@jbpark/ui-kit 10.0.2 → 10.1.0

package/README.ko.md

@@ -145,6 +145,13 @@ function App() {
 해당 요소에 `isolation: isolate`를 적용해 Base UI 포털이 앱 내부의 z-index와
 경쟁하지 않고 페이지 콘텐츠 위에 표시되도록 합니다.
 
+반대 방향으로도 효과가 있습니다. 오버레이(Modal, Drawer, Select, Popover)와
+페이지 흐름 안에 고정되는 요소(sticky/fixed `Layout.Header`, `FloatButton`,
+Dropdown 메뉴)는 모두 `z-index: 1000`을 씁니다. 루트를 격리하지 않으면 이
+요소들이 z-index가 더 낮은 앱 자체의 다이얼로그(예: shadcn의 `z-50`)를 덮습니다.
+`data-ui-root`를 지정하면 `body`로 포털되는 앱의 오버레이가 이 요소들을 포함한
+앱 전체를 덮습니다.
+
 ### 개별 컴포넌트 import
 
 ```tsx

package/README.md

@@ -145,6 +145,13 @@ Put `data-ui-root` on your application layout root. The included stylesheet
 applies `isolation: isolate` there so Base UI portals render above page content
 without competing with z-index values inside the app.
 
+It also works in the other direction. Overlays (Modal, Drawer, Select,
+Popover) and in-flow chrome (sticky/fixed `Layout.Header`, `FloatButton`,
+Dropdown menus) share `z-index: 1000`. Without an isolated root, that
+chrome paints over your own dialogs if they use a lower z-index (for example
+shadcn's `z-50`). With `data-ui-root`, any overlay you portal to `body`
+covers the whole app, including this chrome.
+
 ### Import Individual Components
 
 ```tsx

package/dist/Breadcrumb.d.mts

@@ -0,0 +1,39 @@
+//#region src/components/molecules/breadcrumb.d.ts
+interface Item {
+  key?: React.Key;
+  title: React.ReactNode;
+  href?: string;
+  target?: React.HTMLAttributeAnchorTarget;
+  rel?: string;
+  onClick?: React.MouseEventHandler<HTMLElement>;
+  className?: string;
+  'aria-label'?: string;
+  /** Decorative icon placed before the title. */
+  icon?: React.ReactNode;
+  /** Overrides the separator after this item. */
+  separator?: React.ReactNode;
+}
+interface Props extends Omit<React.ComponentPropsWithoutRef<'nav'>, 'children'> {
+  items: Item[];
+  separator?: React.ReactNode;
+  /** Collapse middle items when the trail has more than this many entries. */
+  maxItems?: number;
+  itemsBeforeCollapse?: number;
+  itemsAfterCollapse?: number;
+  expandText?: string;
+  /** Render custom router links. The renderer owns aria-current for the last item. */
+  itemRender?: (item: Item, index: number, isCurrent: boolean) => React.ReactNode;
+  classNames?: {
+    list?: string;
+    item?: string;
+    link?: string;
+    current?: string;
+    separator?: string;
+    collapsed?: string;
+    popup?: string;
+  };
+}
+declare const Breadcrumb: ({ items, separator, maxItems, itemsBeforeCollapse, itemsAfterCollapse, expandText, itemRender, className, classNames, dir, "aria-label": ariaLabel, ...props }: Props) => import("react").JSX.Element;
+//#endregion
+export { Item, Props, Breadcrumb as default };
+//# sourceMappingURL=Breadcrumb.d.mts.map

package/dist/Breadcrumb.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.d.mts","names":[],"sources":["../src/components/molecules/breadcrumb.tsx"],"mappings":";UAUiB;EACf,MAAM,MAAM;EACZ,OAAO,MAAM;EACb;EACA,SAAS,MAAM;EACf;EACA,UAAU,MAAM,kBAAkB;EAClC;EACA;;EAEA,OAAO,MAAM;;EAEb,YAAY,MAAM;;UAGH,cAAc,KAC7B,MAAM;EAGN,OAAO;EACP,YAAY,MAAM;;EAElB;EACA;EACA;EACA;;EAEA,cACE,MAAM,MACN,eACA,uBACG,MAAM;EACX;IACE;IACA;IACA;IACA;IACA;IACA;IACA;;;cAOE,eAAc,OAAA,WAAA,UAAA,qBAAA,oBAAA,YAAA,YAAA,WAAA,YAAA,mBAAA,cAAA,SAajB,0BAAK,IAAA"}

package/dist/Breadcrumb.mjs

@@ -0,0 +1,103 @@
+"use client";
+import { cn } from "./utils.mjs";
+import { useConfig } from "./providers/config/context.mjs";
+import Button from "./Button.mjs";
+import Popover from "./components/atoms/popover.mjs";
+import { Fragment } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/breadcrumb.tsx
+const safeCount = (value, minimum) => Number.isFinite(value) ? Math.max(minimum, Math.floor(value)) : minimum;
+const Breadcrumb = ({ items, separator = "/", maxItems = 8, itemsBeforeCollapse = 1, itemsAfterCollapse = 1, expandText = "Show path", itemRender, className, classNames, dir, "aria-label": ariaLabel, ...props }) => {
+	const { direction } = useConfig();
+	const limit = safeCount(maxItems, 3);
+	const before = Math.min(safeCount(itemsBeforeCollapse, 1), limit - 2);
+	const after = Math.min(safeCount(itemsAfterCollapse, 1), limit - before - 1);
+	const collapsed = items.length > limit && items.length - before - after > 0;
+	const visibleIndices = collapsed ? [...Array.from({ length: before }, (_, index) => index), ...Array.from({ length: after }, (_, index) => items.length - after + index)] : items.map((_, index) => index);
+	const hiddenIndices = collapsed ? Array.from({ length: items.length - before - after }, (_, index) => before + index) : [];
+	const renderItem = (index) => {
+		const item = items[index];
+		const isCurrent = index === items.length - 1;
+		if (itemRender) return itemRender(item, index, isCurrent);
+		const content = /* @__PURE__ */ jsxs(Fragment$1, { children: [item.icon != null && /* @__PURE__ */ jsx("span", {
+			"data-slot": "breadcrumb-icon",
+			"aria-hidden": "true",
+			className: "inline-flex shrink-0",
+			children: item.icon
+		}), item.title] });
+		const itemClassName = cn("inline-flex items-center gap-1.5 rounded-sm", (item.href !== void 0 || item.onClick) && "hover:text-foreground focus-visible:outline-ring focus-visible:outline-2", isCurrent ? "text-foreground font-medium" : "text-muted-foreground", (item.href !== void 0 || item.onClick) && classNames?.link, isCurrent && classNames?.current, item.className);
+		if (item.href !== void 0) return /* @__PURE__ */ jsx("a", {
+			href: item.href,
+			target: item.target,
+			rel: item.rel,
+			onClick: item.onClick,
+			"aria-label": item["aria-label"],
+			"aria-current": isCurrent ? "page" : void 0,
+			className: itemClassName,
+			children: content
+		});
+		if (item.onClick) return /* @__PURE__ */ jsx(Button, {
+			variant: "text",
+			size: "small",
+			onClick: item.onClick,
+			"aria-label": item["aria-label"],
+			"aria-current": isCurrent ? "page" : void 0,
+			className: cn("h-auto px-0 py-0 font-normal", itemClassName),
+			children: content
+		});
+		return /* @__PURE__ */ jsx("span", {
+			"aria-label": item["aria-label"],
+			"aria-current": isCurrent ? "page" : void 0,
+			className: itemClassName,
+			children: content
+		});
+	};
+	const renderSeparator = (index) => /* @__PURE__ */ jsx("li", {
+		"data-slot": "breadcrumb-separator",
+		"aria-hidden": "true",
+		className: cn("text-muted-foreground mx-2 shrink-0", classNames?.separator),
+		children: items[index]?.separator ?? separator
+	});
+	return /* @__PURE__ */ jsx("nav", {
+		...props,
+		"data-slot": "breadcrumb",
+		dir: dir ?? direction,
+		"aria-label": ariaLabel ?? "Breadcrumb",
+		className: cn("text-sm", className),
+		children: /* @__PURE__ */ jsx("ol", {
+			"data-slot": "breadcrumb-list",
+			className: cn("m-0 flex min-w-0 flex-wrap items-center p-0", classNames?.list),
+			children: visibleIndices.map((index, position) => /* @__PURE__ */ jsxs(Fragment, { children: [
+				position > 0 && renderSeparator(collapsed && position === before ? index - 1 : visibleIndices[position - 1]),
+				/* @__PURE__ */ jsx("li", {
+					"data-slot": "breadcrumb-item",
+					className: cn("inline-flex min-w-0 items-center", classNames?.item),
+					children: renderItem(index)
+				}),
+				collapsed && position === before - 1 && /* @__PURE__ */ jsxs(Fragment$1, { children: [renderSeparator(index), /* @__PURE__ */ jsx("li", {
+					"data-slot": "breadcrumb-collapsed",
+					className: classNames?.collapsed,
+					children: /* @__PURE__ */ jsx(Popover, {
+						placement: "bottom",
+						className: classNames?.popup,
+						content: /* @__PURE__ */ jsx("ol", {
+							className: "m-0 grid list-none gap-1 p-0",
+							children: hiddenIndices.map((hiddenIndex) => /* @__PURE__ */ jsx("li", { children: renderItem(hiddenIndex) }, items[hiddenIndex]?.key ?? hiddenIndex))
+						}),
+						children: /* @__PURE__ */ jsx(Button, {
+							variant: "text",
+							size: "small",
+							"aria-label": expandText,
+							className: "h-auto px-1",
+							children: "…"
+						})
+					})
+				})] })
+			] }, items[index]?.key ?? index))
+		})
+	});
+};
+//#endregion
+export { Breadcrumb as default };
+
+//# sourceMappingURL=Breadcrumb.mjs.map

package/dist/Breadcrumb.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.mjs","names":[],"sources":["../src/components/molecules/breadcrumb.tsx"],"sourcesContent":["'use client';\n\nimport { Fragment } from 'react';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../atoms/button';\nimport Popover from '../atoms/popover';\n\nexport interface Item {\n  key?: React.Key;\n  title: React.ReactNode;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  rel?: string;\n  onClick?: React.MouseEventHandler<HTMLElement>;\n  className?: string;\n  'aria-label'?: string;\n  /** Decorative icon placed before the title. */\n  icon?: React.ReactNode;\n  /** Overrides the separator after this item. */\n  separator?: React.ReactNode;\n}\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'nav'>,\n  'children'\n> {\n  items: Item[];\n  separator?: React.ReactNode;\n  /** Collapse middle items when the trail has more than this many entries. */\n  maxItems?: number;\n  itemsBeforeCollapse?: number;\n  itemsAfterCollapse?: number;\n  expandText?: string;\n  /** Render custom router links. The renderer owns aria-current for the last item. */\n  itemRender?: (\n    item: Item,\n    index: number,\n    isCurrent: boolean,\n  ) => React.ReactNode;\n  classNames?: {\n    list?: string;\n    item?: string;\n    link?: string;\n    current?: string;\n    separator?: string;\n    collapsed?: string;\n    popup?: string;\n  };\n}\n\nconst safeCount = (value: number, minimum: number) =>\n  Number.isFinite(value) ? Math.max(minimum, Math.floor(value)) : minimum;\n\nconst Breadcrumb = ({\n  items,\n  separator = '/',\n  maxItems = 8,\n  itemsBeforeCollapse = 1,\n  itemsAfterCollapse = 1,\n  expandText = 'Show path',\n  itemRender,\n  className,\n  classNames,\n  dir,\n  'aria-label': ariaLabel,\n  ...props\n}: Props) => {\n  const { direction } = useConfig();\n  const limit = safeCount(maxItems, 3);\n  const before = Math.min(safeCount(itemsBeforeCollapse, 1), limit - 2);\n  const after = Math.min(safeCount(itemsAfterCollapse, 1), limit - before - 1);\n  const collapsed = items.length > limit && items.length - before - after > 0;\n  const visibleIndices = collapsed\n    ? [\n        ...Array.from({ length: before }, (_, index) => index),\n        ...Array.from(\n          { length: after },\n          (_, index) => items.length - after + index,\n        ),\n      ]\n    : items.map((_, index) => index);\n  const hiddenIndices = collapsed\n    ? Array.from(\n        { length: items.length - before - after },\n        (_, index) => before + index,\n      )\n    : [];\n\n  const renderItem = (index: number) => {\n    const item = items[index]!;\n    const isCurrent = index === items.length - 1;\n\n    if (itemRender) {\n      return itemRender(item, index, isCurrent);\n    }\n\n    const content = (\n      <>\n        {item.icon != null && (\n          <span\n            data-slot=\"breadcrumb-icon\"\n            aria-hidden=\"true\"\n            className=\"inline-flex shrink-0\"\n          >\n            {item.icon}\n          </span>\n        )}\n        {item.title}\n      </>\n    );\n    const itemClassName = cn(\n      'inline-flex items-center gap-1.5 rounded-sm',\n      (item.href !== undefined || item.onClick) &&\n        'hover:text-foreground focus-visible:outline-ring focus-visible:outline-2',\n      isCurrent ? 'text-foreground font-medium' : 'text-muted-foreground',\n      (item.href !== undefined || item.onClick) && classNames?.link,\n      isCurrent && classNames?.current,\n      item.className,\n      //\n    );\n\n    if (item.href !== undefined) {\n      return (\n        <a\n          href={item.href}\n          target={item.target}\n          rel={item.rel}\n          onClick={item.onClick}\n          aria-label={item['aria-label']}\n          aria-current={isCurrent ? 'page' : undefined}\n          className={itemClassName}\n        >\n          {content}\n        </a>\n      );\n    }\n\n    if (item.onClick) {\n      return (\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          onClick={item.onClick}\n          aria-label={item['aria-label']}\n          aria-current={isCurrent ? 'page' : undefined}\n          className={cn('h-auto px-0 py-0 font-normal', itemClassName)}\n        >\n          {content}\n        </Button>\n      );\n    }\n\n    return (\n      <span\n        aria-label={item['aria-label']}\n        aria-current={isCurrent ? 'page' : undefined}\n        className={itemClassName}\n      >\n        {content}\n      </span>\n    );\n  };\n\n  const renderSeparator = (index: number) => (\n    <li\n      data-slot=\"breadcrumb-separator\"\n      aria-hidden=\"true\"\n      className={cn(\n        'text-muted-foreground mx-2 shrink-0',\n        classNames?.separator,\n        //\n      )}\n    >\n      {items[index]?.separator ?? separator}\n    </li>\n  );\n\n  return (\n    <nav\n      {...props}\n      data-slot=\"breadcrumb\"\n      dir={dir ?? direction}\n      aria-label={ariaLabel ?? 'Breadcrumb'}\n      className={cn(\n        'text-sm',\n        className, //\n      )}\n    >\n      <ol\n        data-slot=\"breadcrumb-list\"\n        className={cn(\n          'm-0 flex min-w-0 flex-wrap items-center p-0',\n          classNames?.list,\n          //\n        )}\n      >\n        {visibleIndices.map((index, position) => (\n          <Fragment key={items[index]?.key ?? index}>\n            {position > 0 &&\n              renderSeparator(\n                collapsed && position === before\n                  ? index - 1\n                  : visibleIndices[position - 1]!,\n              )}\n            <li\n              data-slot=\"breadcrumb-item\"\n              className={cn(\n                'inline-flex min-w-0 items-center',\n                classNames?.item, //\n              )}\n            >\n              {renderItem(index)}\n            </li>\n            {collapsed && position === before - 1 && (\n              <>\n                {renderSeparator(index)}\n                <li\n                  data-slot=\"breadcrumb-collapsed\"\n                  className={classNames?.collapsed}\n                >\n                  <Popover\n                    placement=\"bottom\"\n                    className={classNames?.popup}\n                    content={\n                      <ol className=\"m-0 grid list-none gap-1 p-0\">\n                        {hiddenIndices.map(hiddenIndex => (\n                          <li key={items[hiddenIndex]?.key ?? hiddenIndex}>\n                            {renderItem(hiddenIndex)}\n                          </li>\n                        ))}\n                      </ol>\n                    }\n                  >\n                    <Button\n                      variant=\"text\"\n                      size=\"small\"\n                      aria-label={expandText}\n                      className=\"h-auto px-1\"\n                    >\n                      …\n                    </Button>\n                  </Popover>\n                </li>\n              </>\n            )}\n          </Fragment>\n        ))}\n      </ol>\n    </nav>\n  );\n};\n\nexport default Breadcrumb;\n"],"mappings":"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"}

package/dist/Pagination.d.mts

@@ -0,0 +1,53 @@
+//#region src/components/molecules/pagination.d.ts
+interface Props extends Omit<React.ComponentPropsWithoutRef<'nav'>, 'children' | 'onChange'> {
+  /** Total number of items, not pages. */
+  total: number;
+  /** Controlled number of items per page. */
+  pageSize?: number;
+  defaultPageSize?: number;
+  onPageSizeChange?: (pageSize: number) => void;
+  pageSizeOptions?: number[];
+  showSizeChanger?: boolean;
+  /** Render the total and the 1-based inclusive range of visible items. */
+  showTotal?: (total: number, range: [number, number]) => React.ReactNode;
+  showQuickJumper?: boolean;
+  /** 1-based controlled page. */
+  page?: number;
+  defaultPage?: number;
+  onChange?: (page: number) => void;
+  siblingCount?: number;
+  boundaryCount?: number;
+  showFirstLast?: boolean;
+  hideOnSinglePage?: boolean;
+  /** Render available page controls as links to these URLs. */
+  getPageHref?: (page: number) => string;
+  disabled?: boolean;
+  size?: 'small' | 'middle' | 'large';
+  labels?: {
+    navigation?: string;
+    page?: (page: number) => string;
+    previous?: string;
+    next?: string;
+    first?: string;
+    last?: string;
+    pageSize?: string;
+    jump?: string;
+    go?: string;
+  };
+  classNames?: {
+    item?: string;
+    active?: string;
+    previous?: string;
+    next?: string;
+    first?: string;
+    last?: string;
+    ellipsis?: string;
+    total?: string;
+    sizeChanger?: string;
+    jumper?: string;
+  };
+}
+declare const Pagination: ({ total, pageSize, defaultPageSize, onPageSizeChange, pageSizeOptions, showSizeChanger, showTotal, showQuickJumper, page, defaultPage, onChange, siblingCount, boundaryCount, showFirstLast, hideOnSinglePage, getPageHref, disabled, size, labels, className, classNames, "aria-label": ariaLabel, ...props }: Props) => import("react").JSX.Element | null;
+//#endregion
+export { Props, Pagination as default };
+//# sourceMappingURL=Pagination.d.mts.map

package/dist/Pagination.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.mts","names":[],"sources":["../src/components/molecules/pagination.tsx"],"mappings":";UAoBiB,cAAc,KAC7B,MAAM;;EAIN;;EAEA;EACA;EACA,oBAAoB;EACpB;EACA;;EAEA,aAAa,eAAe,4BAA4B,MAAM;EAC9D;;EAEA;EACA;EACA,YAAY;EACZ;EACA;EACA;EACA;;EAEA,eAAe;EACf;EACA;EACA;IACE;IACA,QAAQ;IACR;IACA;IACA;IACA;IACA;IACA;IACA;;EAEF;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;;cAkEE,eAAc,OAAA,UAAA,iBAAA,kBAAA,iBAAA,iBAAA,WAAA,iBAAA,MAAA,aAAA,UAAA,cAAA,eAAA,eAAA,kBAAA,aAAA,UAAA,MAAA,QAAA,WAAA,0BAAA,cAAA,SAwBjB,0BAAK,IAAA"}

package/dist/Pagination.mjs

@@ -0,0 +1,208 @@
+"use client";
+import { cn } from "./utils.mjs";
+import { useConfig } from "./providers/config/context.mjs";
+import Button from "./Button.mjs";
+import Input from "./components/atoms/input/index.mjs";
+import Select from "./components/atoms/select.mjs";
+import { useState } from "react";
+import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/molecules/pagination.tsx
+const clampPage = (page, pageCount) => Math.min(Math.max(1, Number.isFinite(page) ? Math.floor(page) : 1), Math.max(1, pageCount));
+const normalizePageSize = (value) => Number.isFinite(value) && value >= 1 ? Math.floor(value) : 10;
+const getPageItems = (page, pageCount, siblingCount, boundaryCount) => {
+	if (pageCount === 0) return [];
+	const pages = /* @__PURE__ */ new Set();
+	for (let index = 1; index <= boundaryCount && index <= pageCount; index++) {
+		pages.add(index);
+		pages.add(pageCount - index + 1);
+	}
+	for (let index = Math.max(1, page - siblingCount); index <= Math.min(pageCount, page + siblingCount); index++) pages.add(index);
+	const sorted = [...pages].sort((a, b) => a - b);
+	const items = [];
+	let previous = 0;
+	for (const current of sorted) {
+		const gap = current - previous;
+		if (gap === 2) items.push(previous + 1);
+		else if (gap > 2) items.push("start-ellipsis");
+		items.push(current);
+		previous = current;
+	}
+	const finalGap = pageCount - previous;
+	if (finalGap === 1) items.push(pageCount);
+	else if (finalGap > 1) items.push("end-ellipsis");
+	return items;
+};
+const Pagination = ({ total, pageSize, defaultPageSize = 10, onPageSizeChange, pageSizeOptions = [
+	10,
+	20,
+	50,
+	100
+], showSizeChanger = false, showTotal, showQuickJumper = false, page, defaultPage = 1, onChange, siblingCount = 1, boundaryCount = 1, showFirstLast = false, hideOnSinglePage = false, getPageHref, disabled = false, size, labels, className, classNames, "aria-label": ariaLabel, ...props }) => {
+	const { componentSize, direction } = useConfig();
+	const safeTotal = Number.isFinite(total) ? Math.max(0, Math.floor(total)) : 0;
+	const [internalPageSize, setInternalPageSize] = useState(() => normalizePageSize(defaultPageSize));
+	const safePageSize = normalizePageSize(pageSize ?? internalPageSize);
+	const pageCount = Math.ceil(safeTotal / safePageSize);
+	const [jumpValue, setJumpValue] = useState("");
+	const [internal, setInternal] = useState({
+		page: clampPage(defaultPage, pageCount),
+		pageCount
+	});
+	if (page === void 0 && internal.pageCount !== pageCount) setInternal({
+		page: clampPage(internal.page, pageCount),
+		pageCount
+	});
+	const currentPage = clampPage(page ?? internal.page, pageCount);
+	const resolvedSize = size ?? componentSize ?? "middle";
+	const items = getPageItems(currentPage, pageCount, Number.isFinite(siblingCount) ? Math.max(0, Math.floor(siblingCount)) : 1, Number.isFinite(boundaryCount) ? Math.max(0, Math.floor(boundaryCount)) : 1);
+	const sizeOptions = Array.from(new Set([...pageSizeOptions, safePageSize].filter((value) => Number.isInteger(value) && value > 0))).sort((a, b) => a - b);
+	const range = safeTotal === 0 ? [0, 0] : [(currentPage - 1) * safePageSize + 1, Math.min(currentPage * safePageSize, safeTotal)];
+	const goToPage = (next) => {
+		if (disabled || pageCount === 0 || next < 1 || next > pageCount || next === currentPage) return;
+		if (page === void 0) setInternal({
+			page: next,
+			pageCount
+		});
+		onChange?.(next);
+	};
+	const changePageSize = (next) => {
+		if (disabled || next === safePageSize) return;
+		if (pageSize === void 0) setInternalPageSize(next);
+		if (page === void 0) setInternal({
+			page: 1,
+			pageCount: Math.ceil(safeTotal / next)
+		});
+		onPageSizeChange?.(next);
+		if (currentPage !== 1) onChange?.(1);
+	};
+	const jumpToPage = (event) => {
+		event.preventDefault();
+		if (!/^\d+$/.test(jumpValue.trim())) return;
+		const next = Number(jumpValue.trim());
+		if (!Number.isSafeInteger(next) || next < 1 || next > pageCount) return;
+		goToPage(next);
+		setJumpValue("");
+	};
+	const handlePageClick = (next, event) => {
+		if (getPageHref && (event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || event.button !== 0)) return;
+		if (getPageHref && next === currentPage) event.preventDefault();
+		goToPage(next);
+	};
+	const linkProps = (target, isDisabled) => getPageHref && !isDisabled ? {
+		render: /* @__PURE__ */ jsx("a", { href: getPageHref(target) }),
+		nativeButton: false,
+		role: "link"
+	} : {};
+	if (hideOnSinglePage && pageCount <= 1) return null;
+	return /* @__PURE__ */ jsxs("nav", {
+		...props,
+		"data-slot": "pagination",
+		"aria-label": ariaLabel ?? labels?.navigation ?? "Pagination",
+		className: cn("flex flex-wrap items-center gap-1", className),
+		children: [
+			showTotal && /* @__PURE__ */ jsx("span", {
+				"data-slot": "pagination-total",
+				className: cn("text-muted-foreground me-2 text-sm", classNames?.total),
+				children: showTotal(safeTotal, range)
+			}),
+			showFirstLast && /* @__PURE__ */ jsx(Button, {
+				...linkProps(1, disabled || pageCount === 0 || currentPage === 1),
+				icon: direction === "rtl" ? /* @__PURE__ */ jsx(ChevronsRight, {}) : /* @__PURE__ */ jsx(ChevronsLeft, {}),
+				size: resolvedSize,
+				variant: "outlined",
+				"aria-label": labels?.first ?? "First page",
+				disabled: disabled || pageCount === 0 || currentPage === 1,
+				className: cn(classNames?.item, classNames?.first),
+				onClick: (event) => handlePageClick(1, event)
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				...linkProps(currentPage - 1, disabled || pageCount === 0 || currentPage === 1),
+				icon: direction === "rtl" ? /* @__PURE__ */ jsx(ChevronRight, {}) : /* @__PURE__ */ jsx(ChevronLeft, {}),
+				size: resolvedSize,
+				variant: "outlined",
+				"aria-label": labels?.previous ?? "Previous page",
+				disabled: disabled || pageCount === 0 || currentPage === 1,
+				className: cn(classNames?.item, classNames?.previous),
+				onClick: (event) => handlePageClick(currentPage - 1, event)
+			}),
+			items.map((item, index) => typeof item === "number" ? /* @__PURE__ */ jsx(Button, {
+				...linkProps(item, disabled),
+				size: resolvedSize,
+				variant: item === currentPage ? "solid" : "outlined",
+				color: item === currentPage ? "primary" : "default",
+				"aria-current": item === currentPage ? "page" : void 0,
+				"aria-label": labels?.page?.(item) ?? `Page ${item}`,
+				disabled,
+				className: cn("min-w-8", classNames?.item, item === currentPage && classNames?.active),
+				onClick: (event) => handlePageClick(item, event),
+				children: item
+			}, item) : /* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				className: cn(`text-muted-foreground inline-flex min-w-6 items-center
+                justify-center`, classNames?.ellipsis),
+				children: "…"
+			}, `${item}-${index}`)),
+			/* @__PURE__ */ jsx(Button, {
+				...linkProps(currentPage + 1, disabled || pageCount === 0 || currentPage === pageCount),
+				icon: direction === "rtl" ? /* @__PURE__ */ jsx(ChevronLeft, {}) : /* @__PURE__ */ jsx(ChevronRight, {}),
+				size: resolvedSize,
+				variant: "outlined",
+				"aria-label": labels?.next ?? "Next page",
+				disabled: disabled || pageCount === 0 || currentPage === pageCount,
+				className: cn(classNames?.item, classNames?.next),
+				onClick: (event) => handlePageClick(currentPage + 1, event)
+			}),
+			showFirstLast && /* @__PURE__ */ jsx(Button, {
+				...linkProps(pageCount, disabled || pageCount === 0 || currentPage === pageCount),
+				icon: direction === "rtl" ? /* @__PURE__ */ jsx(ChevronsLeft, {}) : /* @__PURE__ */ jsx(ChevronsRight, {}),
+				size: resolvedSize,
+				variant: "outlined",
+				"aria-label": labels?.last ?? "Last page",
+				disabled: disabled || pageCount === 0 || currentPage === pageCount,
+				className: cn(classNames?.item, classNames?.last),
+				onClick: (event) => handlePageClick(pageCount, event)
+			}),
+			showSizeChanger && /* @__PURE__ */ jsx("div", {
+				"data-slot": "pagination-size-changer",
+				className: cn("ms-2 min-w-24", classNames?.sizeChanger),
+				children: /* @__PURE__ */ jsx(Select, {
+					value: String(safePageSize),
+					options: sizeOptions.map((value) => ({
+						value: String(value),
+						label: `${value} / page`
+					})),
+					onChange: (value) => changePageSize(Number(value)),
+					disabled,
+					"aria-label": labels?.pageSize ?? "Items per page"
+				})
+			}),
+			showQuickJumper && /* @__PURE__ */ jsxs("form", {
+				"data-slot": "pagination-jumper",
+				className: cn("ms-2 flex items-center gap-1", classNames?.jumper),
+				onSubmit: jumpToPage,
+				noValidate: true,
+				children: [/* @__PURE__ */ jsx(Input, {
+					type: "text",
+					inputMode: "numeric",
+					autoComplete: "off",
+					"aria-label": labels?.jump ?? "Jump to page",
+					value: jumpValue,
+					onChange: (event) => setJumpValue(event.target.value),
+					disabled: disabled || pageCount === 0,
+					className: "w-16"
+				}), /* @__PURE__ */ jsx(Button, {
+					htmlType: "submit",
+					size: resolvedSize,
+					variant: "outlined",
+					disabled: disabled || pageCount === 0,
+					children: labels?.go ?? "Go"
+				})]
+			})
+		]
+	});
+};
+//#endregion
+export { Pagination as default };
+
+//# sourceMappingURL=Pagination.mjs.map

package/dist/Pagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.mjs","names":[],"sources":["../src/components/molecules/pagination.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\n\nimport {\n  ChevronLeft,\n  ChevronRight,\n  ChevronsLeft,\n  ChevronsRight,\n} from 'lucide-react';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../atoms/button';\nimport Input from '../atoms/input';\nimport Select from '../atoms/select';\n\ntype PageItem = number | 'start-ellipsis' | 'end-ellipsis';\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'nav'>,\n  'children' | 'onChange'\n> {\n  /** Total number of items, not pages. */\n  total: number;\n  /** Controlled number of items per page. */\n  pageSize?: number;\n  defaultPageSize?: number;\n  onPageSizeChange?: (pageSize: number) => void;\n  pageSizeOptions?: number[];\n  showSizeChanger?: boolean;\n  /** Render the total and the 1-based inclusive range of visible items. */\n  showTotal?: (total: number, range: [number, number]) => React.ReactNode;\n  showQuickJumper?: boolean;\n  /** 1-based controlled page. */\n  page?: number;\n  defaultPage?: number;\n  onChange?: (page: number) => void;\n  siblingCount?: number;\n  boundaryCount?: number;\n  showFirstLast?: boolean;\n  hideOnSinglePage?: boolean;\n  /** Render available page controls as links to these URLs. */\n  getPageHref?: (page: number) => string;\n  disabled?: boolean;\n  size?: 'small' | 'middle' | 'large';\n  labels?: {\n    navigation?: string;\n    page?: (page: number) => string;\n    previous?: string;\n    next?: string;\n    first?: string;\n    last?: string;\n    pageSize?: string;\n    jump?: string;\n    go?: string;\n  };\n  classNames?: {\n    item?: string;\n    active?: string;\n    previous?: string;\n    next?: string;\n    first?: string;\n    last?: string;\n    ellipsis?: string;\n    total?: string;\n    sizeChanger?: string;\n    jumper?: string;\n  };\n}\n\nconst clampPage = (page: number, pageCount: number) =>\n  Math.min(\n    Math.max(1, Number.isFinite(page) ? Math.floor(page) : 1),\n    Math.max(1, pageCount),\n  );\n\nconst normalizePageSize = (value: number) =>\n  Number.isFinite(value) && value >= 1 ? Math.floor(value) : 10;\n\nconst getPageItems = (\n  page: number,\n  pageCount: number,\n  siblingCount: number,\n  boundaryCount: number,\n): PageItem[] => {\n  if (pageCount === 0) {\n    return [];\n  }\n\n  const pages = new Set<number>();\n\n  for (let index = 1; index <= boundaryCount && index <= pageCount; index++) {\n    pages.add(index);\n    pages.add(pageCount - index + 1);\n  }\n\n  for (\n    let index = Math.max(1, page - siblingCount);\n    index <= Math.min(pageCount, page + siblingCount);\n    index++\n  ) {\n    pages.add(index);\n  }\n\n  const sorted = [...pages].sort((a, b) => a - b);\n  const items: PageItem[] = [];\n  let previous = 0;\n\n  for (const current of sorted) {\n    const gap = current - previous;\n\n    if (gap === 2) {\n      items.push(previous + 1);\n    } else if (gap > 2) {\n      items.push('start-ellipsis');\n    }\n\n    items.push(current);\n    previous = current;\n  }\n\n  const finalGap = pageCount - previous;\n\n  if (finalGap === 1) {\n    items.push(pageCount);\n  } else if (finalGap > 1) {\n    items.push('end-ellipsis');\n  }\n\n  return items;\n};\n\nconst Pagination = ({\n  total,\n  pageSize,\n  defaultPageSize = 10,\n  onPageSizeChange,\n  pageSizeOptions = [10, 20, 50, 100],\n  showSizeChanger = false,\n  showTotal,\n  showQuickJumper = false,\n  page,\n  defaultPage = 1,\n  onChange,\n  siblingCount = 1,\n  boundaryCount = 1,\n  showFirstLast = false,\n  hideOnSinglePage = false,\n  getPageHref,\n  disabled = false,\n  size,\n  labels,\n  className,\n  classNames,\n  'aria-label': ariaLabel,\n  ...props\n}: Props) => {\n  const { componentSize, direction } = useConfig();\n  const safeTotal = Number.isFinite(total) ? Math.max(0, Math.floor(total)) : 0;\n  const [internalPageSize, setInternalPageSize] = useState(() =>\n    normalizePageSize(defaultPageSize),\n  );\n  const safePageSize = normalizePageSize(pageSize ?? internalPageSize);\n  const pageCount = Math.ceil(safeTotal / safePageSize);\n  const [jumpValue, setJumpValue] = useState('');\n  const [internal, setInternal] = useState({\n    page: clampPage(defaultPage, pageCount),\n    pageCount,\n  });\n\n  // React retries this render with the adjusted state when the available\n  // range changes. Controlled callers still own their page prop.\n  if (page === undefined && internal.pageCount !== pageCount) {\n    setInternal({ page: clampPage(internal.page, pageCount), pageCount });\n  }\n\n  const currentPage = clampPage(page ?? internal.page, pageCount);\n  const resolvedSize = size ?? componentSize ?? 'middle';\n  const safeSiblingCount = Number.isFinite(siblingCount)\n    ? Math.max(0, Math.floor(siblingCount))\n    : 1;\n  const safeBoundaryCount = Number.isFinite(boundaryCount)\n    ? Math.max(0, Math.floor(boundaryCount))\n    : 1;\n  const items = getPageItems(\n    currentPage,\n    pageCount,\n    safeSiblingCount,\n    safeBoundaryCount,\n  );\n  const sizeOptions = Array.from(\n    new Set(\n      [...pageSizeOptions, safePageSize].filter(\n        value => Number.isInteger(value) && value > 0,\n      ),\n    ),\n  ).sort((a, b) => a - b);\n  const range: [number, number] =\n    safeTotal === 0\n      ? [0, 0]\n      : [\n          (currentPage - 1) * safePageSize + 1,\n          Math.min(currentPage * safePageSize, safeTotal),\n        ];\n\n  const goToPage = (next: number) => {\n    if (\n      disabled ||\n      pageCount === 0 ||\n      next < 1 ||\n      next > pageCount ||\n      next === currentPage\n    ) {\n      return;\n    }\n\n    if (page === undefined) {\n      setInternal({ page: next, pageCount });\n    }\n\n    onChange?.(next);\n  };\n\n  const changePageSize = (next: number) => {\n    if (disabled || next === safePageSize) {\n      return;\n    }\n\n    if (pageSize === undefined) {\n      setInternalPageSize(next);\n    }\n\n    if (page === undefined) {\n      setInternal({ page: 1, pageCount: Math.ceil(safeTotal / next) });\n    }\n\n    onPageSizeChange?.(next);\n\n    if (currentPage !== 1) {\n      onChange?.(1);\n    }\n  };\n\n  const jumpToPage = (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    if (!/^\\d+$/.test(jumpValue.trim())) {\n      return;\n    }\n\n    const next = Number(jumpValue.trim());\n\n    if (!Number.isSafeInteger(next) || next < 1 || next > pageCount) {\n      return;\n    }\n\n    goToPage(next);\n    setJumpValue('');\n  };\n\n  const handlePageClick = (next: number, event: React.MouseEvent) => {\n    if (\n      getPageHref &&\n      (event.metaKey ||\n        event.ctrlKey ||\n        event.shiftKey ||\n        event.altKey ||\n        event.button !== 0)\n    ) {\n      return;\n    }\n\n    if (getPageHref && next === currentPage) {\n      event.preventDefault();\n    }\n\n    goToPage(next);\n  };\n\n  const linkProps = (target: number, isDisabled: boolean) =>\n    getPageHref && !isDisabled\n      ? {\n          render: <a href={getPageHref(target)} />,\n          nativeButton: false,\n          role: 'link',\n        }\n      : {};\n\n  if (hideOnSinglePage && pageCount <= 1) {\n    return null;\n  }\n\n  return (\n    <nav\n      {...props}\n      data-slot=\"pagination\"\n      aria-label={ariaLabel ?? labels?.navigation ?? 'Pagination'}\n      className={cn(\n        'flex flex-wrap items-center gap-1',\n        className,\n        //\n      )}\n    >\n      {showTotal && (\n        <span\n          data-slot=\"pagination-total\"\n          className={cn(\n            'text-muted-foreground me-2 text-sm',\n            classNames?.total,\n            //\n          )}\n        >\n          {showTotal(safeTotal, range)}\n        </span>\n      )}\n      {showFirstLast && (\n        <Button\n          {...linkProps(1, disabled || pageCount === 0 || currentPage === 1)}\n          icon={direction === 'rtl' ? <ChevronsRight /> : <ChevronsLeft />}\n          size={resolvedSize}\n          variant=\"outlined\"\n          aria-label={labels?.first ?? 'First page'}\n          disabled={disabled || pageCount === 0 || currentPage === 1}\n          className={cn(\n            classNames?.item,\n            classNames?.first,\n            //\n          )}\n          onClick={event => handlePageClick(1, event)}\n        />\n      )}\n      <Button\n        {...linkProps(\n          currentPage - 1,\n          disabled || pageCount === 0 || currentPage === 1,\n        )}\n        icon={direction === 'rtl' ? <ChevronRight /> : <ChevronLeft />}\n        size={resolvedSize}\n        variant=\"outlined\"\n        aria-label={labels?.previous ?? 'Previous page'}\n        disabled={disabled || pageCount === 0 || currentPage === 1}\n        className={cn(\n          classNames?.item,\n          classNames?.previous,\n          //\n        )}\n        onClick={event => handlePageClick(currentPage - 1, event)}\n      />\n      {items.map((item, index) =>\n        typeof item === 'number' ? (\n          <Button\n            key={item}\n            {...linkProps(item, disabled)}\n            size={resolvedSize}\n            variant={item === currentPage ? 'solid' : 'outlined'}\n            color={item === currentPage ? 'primary' : 'default'}\n            aria-current={item === currentPage ? 'page' : undefined}\n            aria-label={labels?.page?.(item) ?? `Page ${item}`}\n            disabled={disabled}\n            className={cn(\n              'min-w-8',\n              classNames?.item,\n              item === currentPage && classNames?.active,\n              //\n            )}\n            onClick={event => handlePageClick(item, event)}\n          >\n            {item}\n          </Button>\n        ) : (\n          <span\n            key={`${item}-${index}`}\n            aria-hidden=\"true\"\n            className={cn(\n              `text-muted-foreground inline-flex min-w-6 items-center\n                justify-center`,\n              classNames?.ellipsis,\n              //\n            )}\n          >\n            …\n          </span>\n        ),\n      )}\n      <Button\n        {...linkProps(\n          currentPage + 1,\n          disabled || pageCount === 0 || currentPage === pageCount,\n        )}\n        icon={direction === 'rtl' ? <ChevronLeft /> : <ChevronRight />}\n        size={resolvedSize}\n        variant=\"outlined\"\n        aria-label={labels?.next ?? 'Next page'}\n        disabled={disabled || pageCount === 0 || currentPage === pageCount}\n        className={cn(\n          classNames?.item,\n          classNames?.next,\n          //\n        )}\n        onClick={event => handlePageClick(currentPage + 1, event)}\n      />\n      {showFirstLast && (\n        <Button\n          {...linkProps(\n            pageCount,\n            disabled || pageCount === 0 || currentPage === pageCount,\n          )}\n          icon={direction === 'rtl' ? <ChevronsLeft /> : <ChevronsRight />}\n          size={resolvedSize}\n          variant=\"outlined\"\n          aria-label={labels?.last ?? 'Last page'}\n          disabled={disabled || pageCount === 0 || currentPage === pageCount}\n          className={cn(\n            classNames?.item,\n            classNames?.last,\n            //\n          )}\n          onClick={event => handlePageClick(pageCount, event)}\n        />\n      )}\n      {showSizeChanger && (\n        <div\n          data-slot=\"pagination-size-changer\"\n          className={cn(\n            'ms-2 min-w-24',\n            classNames?.sizeChanger,\n            //\n          )}\n        >\n          <Select\n            value={String(safePageSize)}\n            options={sizeOptions.map(value => ({\n              value: String(value),\n              label: `${value} / page`,\n            }))}\n            onChange={value => changePageSize(Number(value))}\n            disabled={disabled}\n            aria-label={labels?.pageSize ?? 'Items per page'}\n          />\n        </div>\n      )}\n      {showQuickJumper && (\n        <form\n          data-slot=\"pagination-jumper\"\n          className={cn(\n            'ms-2 flex items-center gap-1',\n            classNames?.jumper,\n            //\n          )}\n          onSubmit={jumpToPage}\n          noValidate\n        >\n          <Input\n            type=\"text\"\n            inputMode=\"numeric\"\n            autoComplete=\"off\"\n            aria-label={labels?.jump ?? 'Jump to page'}\n            value={jumpValue}\n            onChange={event => setJumpValue(event.target.value)}\n            disabled={disabled || pageCount === 0}\n            className=\"w-16\"\n          />\n          <Button\n            htmlType=\"submit\"\n            size={resolvedSize}\n            variant=\"outlined\"\n            disabled={disabled || pageCount === 0}\n          >\n            {labels?.go ?? 'Go'}\n          </Button>\n        </form>\n      )}\n    </nav>\n  );\n};\n\nexport default Pagination;\n"],"mappings":"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"}

package/dist/Table.d.mts

@@ -0,0 +1,48 @@
+import { Props as Props$1 } from "./Pagination.mjs";
+//#region src/components/organisms/table.d.ts
+type PaginationOptions = Omit<Props$1, 'total'> & ({
+  mode?: 'client';
+  total?: never;
+} | {
+  mode: 'server';
+  total: number;
+});
+interface Column<T> {
+  key: React.Key;
+  title: React.ReactNode;
+  /** Field displayed when render is omitted. */
+  dataIndex?: keyof T;
+  render?: (record: T, index: number) => React.ReactNode;
+  align?: 'left' | 'center' | 'right';
+  width?: string | number;
+  className?: string;
+  headerClassName?: string;
+}
+interface Props<T> extends Omit<React.ComponentPropsWithoutRef<'table'>, 'children'> {
+  columns: Column<T>[];
+  data?: T[];
+  /** Use a stable key when rows may be reordered or paged. */
+  rowKey?: (record: T, index: number) => React.Key;
+  caption?: React.ReactNode;
+  loading?: boolean;
+  empty?: React.ReactNode;
+  size?: 'small' | 'middle' | 'large';
+  bordered?: boolean;
+  striped?: boolean;
+  hoverable?: boolean;
+  /** true paginates data locally; server mode expects current-page data. */
+  pagination?: boolean | PaginationOptions;
+  classNames?: {
+    container?: string;
+    header?: string;
+    body?: string;
+    row?: string;
+    cell?: string;
+    empty?: string;
+    pagination?: string;
+  };
+}
+declare const Table: <T>({ columns, data, rowKey, loading, empty, size, bordered, striped, hoverable, pagination, caption, className, classNames, ...props }: Props<T>) => import("react").JSX.Element;
+//#endregion
+export { Column, PaginationOptions, Props, Table as default };
+//# sourceMappingURL=Table.d.mts.map

package/dist/Table.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.d.mts","names":[],"sources":["../src/components/organisms/table.tsx"],"mappings":";;KAaY,oBAAoB,KAAK;EAChC;EAAiB;;EAAoB;EAAgB;;UAEzC,OAAO;EACtB,KAAK,MAAM;EACX,OAAO,MAAM;;EAEb,kBAAkB;EAClB,UAAU,QAAQ,GAAG,kBAAkB,MAAM;EAC7C;EACA;EACA;EACA;;UAGe,MAAM,WAAW,KAChC,MAAM;EAGN,SAAS,OAAO;EAChB,OAAO;;EAEP,UAAU,QAAQ,GAAG,kBAAkB,MAAM;EAC7C,UAAU,MAAM;EAChB;EACA,QAAQ,MAAM;EACd;EACA;EACA;EACA;;EAEA,uBAAuB;EACvB;IACE;IACA;IACA;IACA;IACA;IACA;IACA;;;cAaE,QAAS,KAAI,SAAA,MAAA,QAAA,SAAA,OAAA,MAAA,UAAA,SAAA,WAAA,YAAA,SAAA,WAAA,eAAA,SAehB,MAAM,uBAAE,IAAA"}