@ktnpm_devops/react-component 0.5.0 → 0.7.0

package/dist/index9.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useId } from "react";
-import { clsx } from "./index47.js";
-import styles from "./index76.js";
+import { clsx } from "./index48.js";
+import styles from "./index73.js";
 const Accordion = forwardRef(
   ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx(styles.root, className), ...props, children })
 );

package/dist/primitives/Pagination/Pagination.d.ts

@@ -0,0 +1,4 @@
+import { PaginationProps } from './Pagination.types';
+
+export declare const Pagination: import('react').ForwardRefExoticComponent<PaginationProps & import('react').RefAttributes<HTMLElement>>;
+//# sourceMappingURL=Pagination.d.ts.map

package/dist/primitives/Pagination/Pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/primitives/Pagination/Pagination.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAkB,eAAe,EAAE,MAAM,oBAAoB,CAAC;AA6D1E,eAAO,MAAM,UAAU,yGAgFtB,CAAC"}

package/dist/primitives/Pagination/Pagination.types.d.ts

@@ -0,0 +1,21 @@
+/** A rendered slot in the pagination control: a page number or a gap. */
+export type PaginationItem = number | 'ellipsis';
+export interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> {
+    /** Currently active page (1-based). */
+    currentPage: number;
+    /** Total number of items across all pages. */
+    totalItems: number;
+    /** Items shown per page. Must be a positive integer. */
+    pageSize: number;
+    /** Called with the requested page (1-based) when the user navigates. */
+    onPageChange: (page: number) => void;
+    /** Page numbers shown on each side of the current page. Defaults to 1. */
+    siblingCount?: number;
+    /** Page numbers pinned at the first/last boundaries. Defaults to 1. */
+    boundaryCount?: number;
+    /** Whether to render the previous/next arrow buttons. Defaults to true. */
+    showPrevNext?: boolean;
+    /** Accessible name for the navigation landmark. Defaults to "Pagination". */
+    'aria-label'?: string;
+}
+//# sourceMappingURL=Pagination.types.d.ts.map

package/dist/primitives/Pagination/Pagination.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.types.d.ts","sourceRoot":"","sources":["../../../src/primitives/Pagination/Pagination.types.ts"],"names":[],"mappings":"AAAA,yEAAyE;AACzE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,UAAU,CAAC;AAEjD,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC3D,uCAAuC;IACvC,WAAW,EAAE,MAAM,CAAC;IACpB,8CAA8C;IAC9C,UAAU,EAAE,MAAM,CAAC;IACnB,wDAAwD;IACxD,QAAQ,EAAE,MAAM,CAAC;IACjB,wEAAwE;IACxE,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,0EAA0E;IAC1E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uEAAuE;IACvE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2EAA2E;IAC3E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB"}

package/dist/primitives/Pagination/index.d.ts

@@ -0,0 +1,3 @@
+export { Pagination } from './Pagination';
+export type { PaginationProps, PaginationItem } from './Pagination.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/primitives/Pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/Pagination/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/style.css

@@ -1947,7 +1947,9 @@
 .krc-option-ZAXum {
   display: flex;
   align-items: center;
-  gap: var(--spacing-xs);
+  justify-content: flex-start;
+  gap: var(--spacing-sm);
+  width: 100%;
   padding: var(--spacing-xs) var(--spacing-sm);
   cursor: pointer;
   transition: background-color 0.1s ease;
@@ -1959,10 +1961,12 @@
 
 .krc-optionLabel-MdDyI {
   display: flex;
+  flex: 1;
   align-items: center;
   gap: var(--spacing-xs);
   font-size: var(--font-size-sm);
   color: var(--text-primary);
+  text-align: left;
 }
 
 .krc-optionCount-JSQl9 {
@@ -2078,6 +2082,71 @@
   font-weight: 600;
   line-height: 1.4;
 }
+.krc-root-wErEG {
+  display: flex;
+}
+
+.krc-list-Np3Qt {
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.krc-page-znalz,
+.krc-arrow-ruhgF {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 2rem;
+  height: 2rem;
+  padding: 0 0.5rem;
+  border: var(--border-width) solid transparent;
+  border-radius: var(--radius-md);
+  background: transparent;
+  color: var(--text-secondary);
+  font-family: inherit;
+  font-size: var(--font-size-sm);
+  font-weight: 600;
+  cursor: pointer;
+  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
+}
+
+.krc-page-znalz:not(.krc-isActive-azJrs):hover,
+.krc-arrow-ruhgF:not(:disabled):hover {
+  background: var(--surface-alt);
+  color: var(--text-primary);
+}
+
+.krc-page-znalz:focus-visible,
+.krc-arrow-ruhgF:focus-visible {
+  outline: none;
+  box-shadow: var(--focus-ring-shadow);
+}
+
+.krc-isActive-azJrs {
+  background: var(--accent-color);
+  border-color: var(--accent-color);
+  color: var(--accent-color-contrast);
+  cursor: default;
+}
+
+.krc-arrow-ruhgF:disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+
+.krc-ellipsis-vMrZ6 {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 2rem;
+  height: 2rem;
+  color: var(--text-tertiary);
+  user-select: none;
+}
 .krc-root-WL0sD {
   display: flex;
   width: 100%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ktnpm_devops/react-component",
-  "version": "0.5.0",
+  "version": "0.7.0",
   "description": "Kenmei Technologies React Component Library",
   "type": "module",
   "license": "MIT",