@choice-ui/react 1.4.2 → 1.4.5

package/dist/components/numeric-input/src/components/numeric-input-element.js

@@ -8,7 +8,7 @@ const NumericInputElement = memo(
     const { type = "handler", className, position, children } = props;
     const context = useNumericInputContext();
     const handlerProps = context.handlerProps;
-    const elementClassName = NumericInputElementTv({
+    const tv = NumericInputElementTv({
       type,
       position,
       disabled: context.disabled,
@@ -22,7 +22,7 @@ const NumericInputElement = memo(
       "div",
       {
         ref,
-        className: tcx(elementClassName, className),
+        className: tcx(tv, className),
         "data-element-position": position,
         "data-element-type": type,
         ...elementProps,

package/dist/components/numeric-input/src/components/numeric-input-menu-trigger.d.ts

@@ -1,6 +1,6 @@
 import { IconButtonProps } from '../../../icon-button/src';
 import { HTMLProps } from 'react';
-interface NumericInputMenuTriggerProps extends IconButtonProps {
+export interface NumericInputMenuTriggerProps extends IconButtonProps {
     className?: string;
     type?: "menu" | "action";
 }

package/dist/components/numeric-input/src/components/numeric-input-menu-trigger.js

@@ -9,7 +9,7 @@ const NumericInputMenuTrigger = forwardRef(
   (props, ref) => {
     const { className, type = "menu", ...rest } = props;
     const context = useNumericInputContext();
-    const style = NumericInputMenuTriggerTv({
+    const tv = NumericInputMenuTriggerTv({
       type,
       disabled: context.disabled,
       variant: context.variant
@@ -19,7 +19,7 @@ const NumericInputMenuTrigger = forwardRef(
       {
         ref,
         variant: type === "menu" ? context.disabled ? "ghost" : "solid" : void 0,
-        className: tcx(style, className),
+        className: tcx(tv, className),
         disabled: context.disabled,
         ...rest,
         children: /* @__PURE__ */ jsx(ChevronDownSmall, {})

package/dist/components/numeric-input/src/components/numeric-input-variable.d.ts

@@ -1,8 +1,7 @@
-interface NumericInputVariableProps {
+export interface NumericInputVariableProps {
     className?: string;
     hasPrefixElement?: boolean;
     onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
     value?: number | null;
 }
 export declare const NumericInputVariable: import('react').ForwardRefExoticComponent<NumericInputVariableProps & import('react').RefAttributes<HTMLDivElement>>;
-export {};

package/dist/components/numeric-input/src/components/numeric-input-variable.js

@@ -8,17 +8,17 @@ const NumericInputVariable = forwardRef(
   (props, ref) => {
     const { onClick, className, hasPrefixElement, value } = props;
     const context = useNumericInputContext();
-    const styles = NumericInputVariableTv({
+    const tv = NumericInputVariableTv({
       prefixElement: hasPrefixElement,
       variant: context.variant,
       disabled: context.disabled,
       selected: context.selected
     });
-    return /* @__PURE__ */ jsx("div", { className: tcx(styles.root(), className), children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx("div", { className: tcx(tv.root(), className), children: /* @__PURE__ */ jsx(
       Chip,
       {
         as: "button",
-        className: styles.chip(),
+        className: tv.chip(),
         ref,
         onClick: (e) => {
           e.stopPropagation();

package/dist/components/numeric-input/src/hooks/use-input-interactions.d.ts

@@ -21,9 +21,9 @@ interface UseInputInteractionsProps<T extends NumericInputValue> {
     value?: T;
 }
 /**
- * 处理输入框交互的钩子
- * @param props 输入交互配置
- * @returns 输入处理器和初始值引用
+ * Hook to handle input box interactions
+ * @param props Input interaction configuration
+ * @returns Input handlers and initial value reference
  */
 export declare function useInputInteractions<T extends NumericInputValue>({ inputRef, displayValue, setDisplayValue, isFocused, setIsFocused, expression, min, max, decimal, disabled, readOnly, innerValue, setValue, updateValue, getCurrentStep, onChange, onEmpty, value, }: UseInputInteractionsProps<T>): {
     inputHandlers: {

package/dist/components/numeric-input/src/hooks/use-numeric-input.d.ts

@@ -20,9 +20,9 @@ interface UseNumericInputProps<T extends NumericInputValue> extends Omit<HTMLPro
     value?: T;
 }
 /**
- * 数值输入控件的主钩子，整合各种交互功能
- * @param props 配置选项
- * @returns 处理状态和事件处理器
+ * Main hook for numeric input component, integrating various interaction features
+ * @param props Configuration options
+ * @returns State management and event handlers
  */
 export declare function useNumericInput<T extends NumericInputValue>(props: UseNumericInputProps<T>): {
     handlerPressed: boolean;

package/dist/components/numeric-input/src/hooks/use-numeric-value-processing.d.ts

@@ -8,9 +8,9 @@ interface UseNumericValueProcessingProps<T extends NumericInputValue> {
     value?: T;
 }
 /**
- * 处理数值输入和转换的钩子
- * @param props 数值处理配置
- * @returns 处理后的值和表达式引用
+ * Hook to handle numeric input and conversion
+ * @param props Numeric processing configuration
+ * @returns Processed value and expression reference
  */
 export declare function useNumericValueProcessing<T extends NumericInputValue>({ value, defaultValue, expression, min, max, decimal, }: UseNumericValueProcessingProps<T>): {
     valuePre: import('../../..').NumberResult | undefined;

package/dist/components/numeric-input/src/hooks/use-step-calculation.d.ts

@@ -1,9 +1,9 @@
 /**
- * 计算数值步进大小的钩子
- * @param shiftPressed Shift键是否按下
- * @param metaPressed Meta/Alt键是否按下
- * @param shiftStep Shift按下时的步进值
- * @param step 正常步进值
- * @returns 计算步进值的函数
+ * Hook to calculate the step size of numeric input
+ * @param shiftPressed Whether Shift key is pressed
+ * @param metaPressed Whether Meta/Alt key is pressed
+ * @param shiftStep Step size when Shift key is pressed
+ * @param step Normal step size
+ * @returns Function to calculate step size
  */
 export declare function useStepCalculation(shiftPressed: boolean, metaPressed: boolean, shiftStep: number, step: number): () => number;

package/dist/components/numeric-input/src/index.d.ts

@@ -1,4 +1,5 @@
-export * from './components';
-export * from './hooks';
-export * from './numeric-input';
-export type { NumberResult, NumericInputValue } from './types';
+export { NumericInput } from './numeric-input';
+export { NumericInputElement, NumericInputMenuTrigger, NumericInputVariable } from './components';
+export type { NumericInputProps } from './numeric-input';
+export type { NumericInputElementProps, NumericInputMenuTriggerProps, NumericInputVariableProps, } from './components';
+export type { NumberResult, NumericChangeDetail, NumericInputValue } from './types';

package/dist/components/numeric-input/src/numeric-input.js

@@ -3,9 +3,9 @@ import { Tooltip } from "../../tooltip/dist/index.js";
 import { forwardRef, useRef, useState, useMemo, cloneElement, Children, isValidElement } from "react";
 import { useEventCallback } from "usehooks-ts";
 import { NumericInputTv } from "./tv.js";
+import { NumericInputMenuTrigger, NumericInputMenuActionPrompt } from "./components/numeric-input-menu-trigger.js";
 import { useNumericInput } from "./hooks/use-numeric-input.js";
 import { NumericInputContext } from "./context/numeric-input-context.js";
-import { NumericInputMenuTrigger, NumericInputMenuActionPrompt } from "./components/numeric-input-menu-trigger.js";
 import { NumericInputVariable } from "./components/numeric-input-variable.js";
 import { NumericInputElement } from "./components/numeric-input-element.js";
 import { mergeRefs } from "../../../shared/utils/merge-refs/merge-refs.js";
@@ -79,7 +79,7 @@ const NumericInputBase = forwardRef((props, ref) => {
   const contextValue = useMemo(
     () => ({
       variant,
-      // 状态
+      // State
       value,
       defaultValue,
       disabled,
@@ -87,20 +87,20 @@ const NumericInputBase = forwardRef((props, ref) => {
       selected,
       focused,
       handlerPressed,
-      // 配置
+      // Configuration
       min,
       max,
       step,
       shiftStep,
       decimal,
       expression,
-      // 事件处理方法
+      // Event handling methods
       onChange,
       onEmpty,
       onPressStart,
       onPressEnd,
       onIsEditingChange,
-      // 处理程序
+      // Handler props
       handlerProps
     }),
     [
@@ -158,7 +158,7 @@ const NumericInputBase = forwardRef((props, ref) => {
   const suffixNode = suffix[0] || null;
   const variableNode = variable[0] || null;
   const actionPromptNode = actionPrompt[0] || null;
-  const styles = NumericInputTv({
+  const tv = NumericInputTv({
     variant,
     selected: selected || handlerPressed,
     focused,
@@ -171,7 +171,7 @@ const NumericInputBase = forwardRef((props, ref) => {
     "div",
     {
       ref: triggerRef,
-      className: tcx(styles.container(), classNames == null ? void 0 : classNames.container, className),
+      className: tcx(tv.container(), classNames == null ? void 0 : classNames.container, className),
       onMouseDown: (e) => {
         e.stopPropagation();
       },
@@ -192,7 +192,7 @@ const NumericInputBase = forwardRef((props, ref) => {
             autoComplete: "off",
             spellCheck: false,
             required,
-            className: tcx("[grid-area:input]", styles.input(), classNames == null ? void 0 : classNames.input),
+            className: tcx("[grid-area:input]", tv.input(), classNames == null ? void 0 : classNames.input),
             disabled,
             "aria-label": ariaLabel,
             "aria-describedby": ariaDescribedby,
@@ -208,7 +208,7 @@ const NumericInputBase = forwardRef((props, ref) => {
           "span",
           {
             tabIndex: -1,
-            className: styles.tooltip(),
+            className: tv.tooltip(),
             onFocusCapture: () => {
               if (inputRef.current) {
                 inputRef.current.focus();

package/dist/components/numeric-input/src/utils/error-handler.d.ts

@@ -1,32 +1,32 @@
 /**
- * 自定义错误类型
+ * Custom error type
  */
 export declare class NumericInputError extends Error {
     code: string;
     constructor(message: string, code?: string);
 }
 /**
- * 表达式解析错误
+ * Expression parsing error
  */
 export declare class ExpressionParseError extends NumericInputError {
     constructor(expression: string, details?: string);
 }
 /**
- * 模式解析错误
+ * Pattern parsing error
  */
 export declare class PatternParseError extends NumericInputError {
     constructor(pattern: string, details?: string);
 }
 /**
- * 输入值类型错误
+ * Input value type error
  */
 export declare class InvalidInputTypeError extends NumericInputError {
     constructor(input: any, expectedType?: string);
 }
 /**
- * 安全的错误处理封装
- * @param fn 要执行的函数
- * @param fallback 出错时的默认返回值
- * @returns 函数执行结果或默认值
+ * Safe error handling wrapper
+ * @param fn Function to execute
+ * @param fallback Default return value when error occurs
+ * @returns Function execution result or default value
  */
 export declare function safeExecute<T, R>(fn: (arg: T) => R, arg: T, fallback: R): R;

package/dist/components/numeric-input/src/utils/expression-evaluator.d.ts

@@ -1,25 +1,25 @@
 import { Operation } from '../types';
 /**
- * 执行二元操作
+ * Execute binary operation
  * @param op 操作符
- * @param b 右操作数
- * @param a 左操作数
- * @returns 计算结果
+ * @param b Right operand
+ * @param a Left operand
+ * @returns Calculation result
  */
 export declare const applyOperation: (op: Operation, b: number, a: number) => number;
 /**
- * 评估数学表达式并返回计算结果
- * @param expression 数学表达式字符串
- * @returns 表达式的计算结果
+ * Evaluate mathematical expression and return calculation result
+ * @param expression Mathematical expression string
+ * @returns Calculation result of the expression
  */
 export declare const evaluate: (expression: string) => number;
 /**
- * 记忆化包装函数，用于缓存表达式计算结果
- * @param fn 原始函数
- * @returns 具有缓存功能的函数
+ * Memoized wrapper function, used to cache expression calculation results
+ * @param fn Original function
+ * @returns Function with caching functionality
  */
 export declare function memoize<T extends string, R>(fn: (arg: T) => R): (arg: T) => R;
 /**
- * 记忆化的表达式计算函数
+ * Memoized expression calculation function
  */
 export declare const memoizedEvaluate: (arg: string) => number;

package/dist/components/numeric-input/src/utils/input-parser.d.ts

@@ -1,8 +1,8 @@
 import { NumericInputValue } from '../types';
 /**
- * 解析输入值，支持字符串、数字、数组和对象类型
- * @param input 输入值
- * @returns 解析后的数字数组
+ * Parse input value, support string, number, array and object types
+ * @param input Input value
+ * @returns Parsed number array
  */
 export declare function parseInputValue(input: NumericInputValue): {
     values: number[];
@@ -10,10 +10,10 @@ export declare function parseInputValue(input: NumericInputValue): {
     isObjectNumber: boolean;
 };
 /**
- * 从输入字符串中提取变量值
- * @param input 输入字符串
- * @param regex 匹配正则表达式
- * @param keys 变量键数组
- * @returns 提取的变量值
+ * Extract variable values from input string
+ * @param input Input string
+ * @param regex Matching regular expression
+ * @param keys Variable key array
+ * @returns Extracted variable values
  */
 export declare function extractValuesFromString(input: string, regex: RegExp, keys: string[]): Record<string, number> | null;

package/dist/components/numeric-input/src/utils/numeric-value-processor.d.ts

@@ -1,13 +1,13 @@
 import { DealWithNumericValueOptions, NumberResult } from '../types';
 /**
- * 安全处理数值输入，捕获异常并返回undefined
- * @param options 输入选项
- * @returns 处理结果或undefined（出错时）
+ * Safe handling of numeric input, capture exceptions and return undefined
+ * @param options Input options
+ * @returns Processing result or undefined (when error occurs)
  */
 export declare const dealWithNumericValueCatch: (options: DealWithNumericValueOptions) => NumberResult | undefined;
 /**
- * 主处理函数：处理各种类型的数值输入并应用约束
- * @param options 输入选项
- * @returns 处理结果对象
+ * Main processing function: process various types of numeric input and apply constraints
+ * @param options Input options
+ * @returns Processing result object
  */
 export declare const dealWithNumericInputValue: ({ input, pattern, call, max, min, decimal, }: DealWithNumericValueOptions) => NumberResult;

package/dist/components/numeric-input/src/utils/pattern-parser.d.ts

@@ -1,7 +1,7 @@
 /**
- * 解析模式字符串，提取变量键
- * @param pattern 模式字符串（如 "{value}px"）
- * @returns 解析结果，包含变量键和正则表达式
+ * Parse pattern string, extract variable keys
+ * @param pattern Pattern string (e.g. "{value}px")
+ * @returns Parsed result, containing variable keys and regular expression
  */
 export declare function parsePattern(pattern: string): {
     keys: string[];
@@ -9,9 +9,9 @@ export declare function parsePattern(pattern: string): {
     regexPattern: string;
 };
 /**
- * 格式化结果，将变量值应用到模式字符串中
- * @param pattern 模式字符串
- * @param result 变量值对象
- * @returns 格式化后的字符串
+ * Format result, apply variable values to pattern string
+ * @param pattern Pattern string
+ * @param result Variable value object
+ * @returns Formatted string
  */
 export declare function formatResult(pattern: string, result: Record<string, number>): string;

package/dist/components/numeric-input/src/utils/value-comparator.d.ts

@@ -1,29 +1,29 @@
 import { NumberResult } from '../types';
 /**
- * 比较两个数值数组是否相同
- * @param array1 第一个数组
- * @param array2 第二个数组
- * @returns 是否相同
+ * Compare two numeric arrays whether they are the same
+ * @param array1 First array
+ * @param array2 Second array
+ * @returns Whether they are the same
  */
 export declare function compareNumericArrays(array1: number[] | undefined, array2: number[] | undefined): boolean;
 /**
- * 比较两个对象是否相同
- * @param object1 第一个对象
- * @param object2 第二个对象
- * @returns 是否相同
+ * Compare two objects whether they are the same
+ * @param object1 First object
+ * @param object2 Second object
+ * @returns Whether they are the same
  */
 export declare function compareNumericObjects(object1: Record<string, number> | undefined, object2: Record<string, number> | undefined): boolean;
 /**
- * 比较两个 NumberResult 是否相同
- * @param result1 第一个结果
- * @param result2 第二个结果
- * @returns 是否相同
+ * Compare two NumberResult whether they are the same
+ * @param result1 First result
+ * @param result2 Second result
+ * @returns Whether they are the same
  */
 export declare function compareNumberResults(result1: NumberResult | undefined, result2: NumberResult | undefined): boolean;
 /**
- * 检查是否为表达式输入
- * @param displayValue 显示值
- * @param processedValue 处理后的值
- * @returns 是否为表达式输入
+ * Check whether it is an expression input
+ * @param displayValue Display value
+ * @param processedValue Processed value
+ * @returns Whether it is an expression input
  */
 export declare function isExpressionInput(displayValue: string, processedValue: NumberResult): boolean;

package/dist/components/numeric-input/src/utils/value-processor.d.ts

@@ -1,23 +1,23 @@
 /**
- * 应用数值约束（最小值、最大值、小数位数）
- * @param value 原始数值
- * @param min 最小值
- * @param max 最大值
- * @param decimal 小数位数
- * @returns 处理后的数值
+ * Apply numeric constraints (minimum value, maximum value, decimal places)
+ * @param value Original value
+ * @param min Minimum value
+ * @param max Maximum value
+ * @param decimal Decimal places
+ * @returns Processed value
  */
 export declare function applyConstraints(value: number, min?: number, max?: number, decimal?: number): number;
 /**
- * 批量应用约束到多个值
- * @param values 值对象
- * @param min 最小值
- * @param max 最大值
- * @param decimal 小数位数
+ * Batch apply constraints to multiple values
+ * @param values Value object
+ * @param min Minimum value
+ * @param max Maximum value
+ * @param decimal Decimal places
  */
 export declare function applyConstraintsToValues(values: Record<string, number>, min?: number, max?: number, decimal?: number): void;
 /**
- * 应用自定义转换函数到值
- * @param values 值对象
- * @param transformFn 转换函数
+ * Apply custom transformation function to values
+ * @param values Value object
+ * @param transformFn Transformation function
  */
 export declare function applyTransform(values: Record<string, number>, transformFn?: (value: number) => number): void;

package/dist/components/pagination/src/components/pagination-items-per-page.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { Segmented } from "../../../segmented/dist/index.js";
 import { forwardRef } from "react";
-import { usePaginationContext } from "./pagination-context.js";
+import { usePaginationContext } from "../context/pagination-context.js";
 import { tcx } from "../../../../shared/utils/tcx/tcx.js";
 const PaginationItemsPerPage = forwardRef(
   (props, ref) => {

package/dist/components/pagination/src/components/pagination-navigation.js

@@ -3,25 +3,25 @@ import { Button } from "../../../button/dist/index.js";
 import { EllipsisSmall } from "@choiceform/icons-react";
 import { forwardRef } from "react";
 import { paginationTv } from "../tv.js";
-import { usePaginationContext } from "./pagination-context.js";
+import { usePaginationContext } from "../context/pagination-context.js";
 import { tcx } from "../../../../shared/utils/tcx/tcx.js";
 const PaginationNavigation = forwardRef(
   (props, ref) => {
     const { className, variant = (isActive) => isActive ? "solid" : "ghost", ...rest } = props;
     const { currentPage, pageNumbers, handlePageChange, labels, disabled, loading } = usePaginationContext();
-    const styles = paginationTv();
+    const tv = paginationTv();
     return /* @__PURE__ */ jsx(
       "div",
       {
         ref,
-        className: tcx(styles.pages(), className),
+        className: tcx(tv.pages(), className),
         ...rest,
         children: pageNumbers.map((pageNumber, index) => {
           if (pageNumber === "ellipsis") {
             return /* @__PURE__ */ jsx(
               "div",
               {
-                className: styles.ellipsis(),
+                className: tv.ellipsis(),
                 children: /* @__PURE__ */ jsx(EllipsisSmall, {})
               },
               `ellipsis-${index}`
@@ -37,7 +37,7 @@ const PaginationNavigation = forwardRef(
               onClick: () => handlePageChange(pageNumber),
               "aria-label": `${labels.page} ${pageNumber}`,
               "aria-current": isActive ? "page" : void 0,
-              className: styles.pageButton({ active: isActive }),
+              className: tv.pageButton({ active: isActive }),
               children: pageNumber
             },
             pageNumber

package/dist/components/pagination/src/components/pagination-root.js

@@ -1,9 +1,9 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { paginationTv } from "../tv.js";
-import { PaginationContext } from "./pagination-context.js";
 import { getDefaultLabels } from "../utils/pagination-helpers.js";
 import { usePagination } from "../hooks/use-pagination.js";
+import { PaginationContext } from "../context/pagination-context.js";
 import { tcx } from "../../../../shared/utils/tcx/tcx.js";
 const PaginationRoot = forwardRef((props, ref) => {
   const {
@@ -40,7 +40,7 @@ const PaginationRoot = forwardRef((props, ref) => {
     onItemsPerPageChange,
     disabled
   });
-  const styles = paginationTv();
+  const tv = paginationTv();
   if (totalItems === 0) {
     return null;
   }
@@ -66,7 +66,7 @@ const PaginationRoot = forwardRef((props, ref) => {
     "div",
     {
       ref,
-      className: tcx(styles.root(), className),
+      className: tcx(tv.root(), className),
       ...rest,
       children
     }

package/dist/components/pagination/src/components/pagination-spinner.js

@@ -4,7 +4,7 @@ import { ChevronLeftMedium, ChevronRightMedium } from "@choiceform/icons-react";
 import { forwardRef, useState, useRef, useEffect } from "react";
 import { useOnClickOutside, useEventCallback } from "usehooks-ts";
 import { paginationSpinnerTv } from "../tv.js";
-import { usePaginationContext } from "./pagination-context.js";
+import { usePaginationContext } from "../context/pagination-context.js";
 import { tcx } from "../../../../shared/utils/tcx/tcx.js";
 const PaginationSpinner = forwardRef(
   (props, ref) => {
@@ -20,7 +20,7 @@ const PaginationSpinner = forwardRef(
       }
     });
     const { currentPage, totalPages, handlePageChange, disabled } = usePaginationContext();
-    const styles = paginationSpinnerTv();
+    const tv = paginationSpinnerTv();
     useEffect(() => {
       if (isEditing) {
         setInputValue(currentPage.toString());
@@ -29,15 +29,17 @@ const PaginationSpinner = forwardRef(
     useEffect(() => {
       if (isEditing && inputRef.current) {
         inputRef.current.focus();
-        try {
-          const timer = setTimeout(() => {
-            if (inputRef.current && inputRef.current.setSelectionRange) {
-              inputRef.current.setSelectionRange(0, inputRef.current.value.length);
-            }
-          }, 0);
-          return () => clearTimeout(timer);
-        } catch (e) {
-        }
+        if (inputRef.current.type === "number") return;
+        const timer = setTimeout(() => {
+          const el = inputRef.current;
+          if (!el) return;
+          if (el.type === "number") return;
+          try {
+            el.setSelectionRange(0, el.value.length);
+          } catch {
+          }
+        }, 0);
+        return () => clearTimeout(timer);
       }
     }, [isEditing]);
     const handleInputChange = useEventCallback((e) => {
@@ -77,7 +79,7 @@ const PaginationSpinner = forwardRef(
       "div",
       {
         ref,
-        className: tcx(styles.spinner(), className),
+        className: tcx(tv.spinner(), className),
         ...rest,
         children: [
           /* @__PURE__ */ jsx(
@@ -87,7 +89,7 @@ const PaginationSpinner = forwardRef(
               disabled: currentPage === 1 || disabled,
               onClick: handlePrevious,
               "aria-label": "Previous page",
-              className: styles.button({ position: "left" }),
+              className: tv.button({ position: "left" }),
               children: /* @__PURE__ */ jsx(ChevronLeftMedium, {})
             }
           ),
@@ -95,7 +97,7 @@ const PaginationSpinner = forwardRef(
             "div",
             {
               ref: inputWrapperRef,
-              className: styles.inputWrapper(),
+              className: tv.inputWrapper(),
               onClick: () => {
                 if (!isEditing) {
                   setIsEditing(true);
@@ -110,16 +112,15 @@ const PaginationSpinner = forwardRef(
                     onChange: handleInputChange,
                     onBlur: handleInputBlur,
                     onKeyDown: handleInputKeyDown,
-                    onFocus: (e) => e.target.select(),
                     type: "number",
                     min: 1,
                     max: totalPages,
                     disabled,
-                    className: styles.input(),
+                    className: tv.input(),
                     autoFocus: true
                   }
-                ) : /* @__PURE__ */ jsx("span", { className: tcx(styles.currentPage()), children: currentPage }),
-                /* @__PURE__ */ jsxs("span", { className: styles.label(), children: [
+                ) : /* @__PURE__ */ jsx("span", { className: tcx(tv.currentPage()), children: currentPage }),
+                /* @__PURE__ */ jsxs("span", { className: tv.label(), children: [
                   "/ ",
                   totalPages
                 ] })
@@ -133,7 +134,7 @@ const PaginationSpinner = forwardRef(
               disabled: currentPage === totalPages || disabled,
               onClick: handleNext,
               "aria-label": "Next page",
-              className: styles.button({ position: "right" }),
+              className: tv.button({ position: "right" }),
               children: /* @__PURE__ */ jsx(ChevronRightMedium, {})
             }
           )

package/dist/components/pagination/src/context/index.d.ts

@@ -0,0 +1 @@
+export * from './pagination-context';