@particle-network/ui-react 0.5.1-beta.21 → 0.5.1-beta.23

package/dist/components/UXRangeInput/index.d.ts

@@ -0,0 +1,42 @@
+import React from 'react';
+import { type UXNumberInputProps } from '../UXNumberInput';
+export interface UXRangeInputValue {
+    min?: number;
+    max?: number;
+}
+export type UXRangeInputProps = Omit<UXNumberInputProps, 'value' | 'defaultValue' | 'onValueChange' | 'minValue' | 'maxValue'> & {
+    /**
+     * The current value of the range input (controlled)
+     */
+    value?: UXRangeInputValue;
+    /**
+     * The default value of the range input (uncontrolled)
+     */
+    defaultValue?: UXRangeInputValue;
+    /**
+     * The minimum value allowed for both inputs
+     */
+    minValue?: number;
+    /**
+     * The maximum value allowed for both inputs
+     */
+    maxValue?: number;
+    /**
+     * Props for the minimum input
+     */
+    minInputProps?: Partial<UXNumberInputProps>;
+    /**
+     * Props for the maximum input
+     */
+    maxInputProps?: Partial<UXNumberInputProps>;
+    /**
+     * Separator between the two inputs
+     * @default '-'
+     */
+    separator?: React.ReactNode;
+    /**
+     * Callback fired when the value changes
+     */
+    onValueChange?: (value: UXRangeInputValue) => void;
+};
+export declare const UXRangeInput: React.ForwardRefExoticComponent<UXRangeInputProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/UXRangeInput/index.js

@@ -0,0 +1,80 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import react, { forwardRef, useCallback, useMemo } from "react";
+import { HStack } from "../layout/index.js";
+import { UXNumberInput } from "../UXNumberInput/index.js";
+const UXRangeInput = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { value, defaultValue, onValueChange, minValue, maxValue, minInputProps = {}, maxInputProps = {}, separator = '', className, ...restProps } = props;
+    const [internalValue, setInternalValue] = react.useState(defaultValue || {
+        min: void 0,
+        max: void 0
+    });
+    const currentValue = void 0 !== value ? value : internalValue;
+    const handleMinChange = useCallback((newMin)=>{
+        const minValue = isNaN(newMin) ? 0 : newMin;
+        const newValue = {
+            min: minValue,
+            max: currentValue.max
+        };
+        if (void 0 !== currentValue.max && !isNaN(currentValue.max) && minValue > currentValue.max) newValue.max = minValue;
+        if (void 0 === value) setInternalValue(newValue);
+        onValueChange?.(newValue);
+    }, [
+        currentValue.max,
+        value,
+        onValueChange
+    ]);
+    const handleMaxChange = useCallback((newMax)=>{
+        const maxValue = isNaN(newMax) ? 0 : newMax;
+        const newValue = {
+            min: currentValue.min,
+            max: maxValue
+        };
+        if (void 0 !== currentValue.min && !isNaN(currentValue.min) && maxValue < currentValue.min) newValue.min = maxValue;
+        if (void 0 === value) setInternalValue(newValue);
+        onValueChange?.(newValue);
+    }, [
+        currentValue.min,
+        value,
+        onValueChange
+    ]);
+    const minInputMaxValue = useMemo(()=>{
+        if (void 0 !== currentValue.max && !isNaN(currentValue.max)) return currentValue.max;
+        return maxValue;
+    }, [
+        currentValue.max,
+        maxValue
+    ]);
+    const maxInputMinValue = useMemo(()=>{
+        if (void 0 !== currentValue.min && !isNaN(currentValue.min)) return currentValue.min;
+        return minValue;
+    }, [
+        currentValue.min,
+        minValue
+    ]);
+    return /*#__PURE__*/ jsxs(HStack, {
+        ref: ref,
+        gap: 2,
+        className: className,
+        children: [
+            /*#__PURE__*/ jsx(UXNumberInput, {
+                ...restProps,
+                ...minInputProps,
+                value: currentValue.min,
+                minValue: minValue,
+                maxValue: minInputMaxValue,
+                onValueChange: handleMinChange
+            }),
+            separator,
+            /*#__PURE__*/ jsx(UXNumberInput, {
+                ...restProps,
+                ...maxInputProps,
+                value: currentValue.max,
+                minValue: maxInputMinValue,
+                maxValue: maxValue,
+                onValueChange: handleMaxChange
+            })
+        ]
+    });
+});
+UXRangeInput.displayName = 'UX.RangeInput';
+export { UXRangeInput };

package/dist/components/UXThemeSwitch/utils.js

@@ -1,7 +1,6 @@
-import { hexColorToHSLValue, themeData, themeKeys } from "@particle-network/ui-shared";
+import { hexColorToHSLValue, objectEntries, themeData, themeKeys } from "@particle-network/ui-shared";
 import { readableColor } from "color2k";
 import { generateThemeColor } from "../../heroui/utils/colors.js";
-import { objectEntries } from "../../utils/index.js";
 import { DEFAULT_FONT_FAMILY, PRELOAD_FONTS_URL } from "./constants.js";
 const getCSSProperties = (theme)=>{
     const { colorVariables } = theme;

package/dist/components/index.d.ts

@@ -21,6 +21,7 @@ export * from './UXNumberInput';
 export * from './UXPagination';
 export * from './UXPopover';
 export * from './UXRadio';
+export * from './UXRangeInput';
 export * from './UXSelect';
 export * from './UXSlider';
 export * from './UXSpinner';

package/dist/components/index.js

@@ -21,6 +21,7 @@ export * from "./UXNumberInput/index.js";
 export * from "./UXPagination/index.js";
 export * from "./UXPopover/index.js";
 export * from "./UXRadio/index.js";
+export * from "./UXRangeInput/index.js";
 export * from "./UXSelect/index.js";
 export * from "./UXSlider/index.js";
 export * from "./UXSpinner/index.js";

package/dist/hooks/useI18n.d.ts

@@ -67,6 +67,10 @@ export declare const useI18n: () => {
         readonly on: "On";
         readonly off: "Off";
     };
+    readonly rangeInput: {
+        readonly min: "Min";
+        readonly max: "Max";
+    };
 } | {
     readonly table: {
         readonly emptyContent: "暂无数据";
@@ -136,4 +140,8 @@ export declare const useI18n: () => {
         readonly on: "开";
         readonly off: "关";
     };
+    readonly rangeInput: {
+        readonly min: "最小值";
+        readonly max: "最大值";
+    };
 };

package/dist/hooks/useI18n.js

@@ -68,6 +68,10 @@ const en = {
     switch: {
         on: 'On',
         off: 'Off'
+    },
+    rangeInput: {
+        min: 'Min',
+        max: 'Max'
     }
 };
 const zh = {
@@ -138,6 +142,10 @@ const zh = {
     switch: {
         on: '开',
         off: '关'
+    },
+    rangeInput: {
+        min: '最小值',
+        max: '最大值'
     }
 };
 const useI18n = ()=>{

package/dist/utils/common.d.ts

@@ -1 +1,4 @@
 export declare function objectEntries<T extends object>(obj: T): [keyof T & string, T[keyof T & string]][];
+export declare function objectKeys<T extends object>(obj: T): (keyof T & string)[];
+export declare function objectValues<T extends object>(obj: T): T[keyof T & string][];
+export declare function objectFromEntries<T extends object>(entries: [keyof T & string, T[keyof T & string]][]): T;

package/dist/utils/common.js

@@ -1,4 +1,13 @@
 function objectEntries(obj) {
     return Object.entries(obj);
 }
-export { objectEntries };
+function objectKeys(obj) {
+    return Object.keys(obj);
+}
+function objectValues(obj) {
+    return Object.values(obj);
+}
+function objectFromEntries(entries) {
+    return Object.fromEntries(entries);
+}
+export { objectEntries, objectFromEntries, objectKeys, objectValues };

package/dist/utils/index.d.ts

@@ -1,6 +1,5 @@
 export { absoluteFullClasses, baseStyles, collapseAdjacentVariantBorders, dataFocusVisibleClasses, focusVisibleClasses, groupDataFocusVisibleClasses, hiddenInputClasses, ringClasses, translateCenterClasses, } from './classes';
 export { cn } from './cn';
-export { objectEntries } from './common';
 export * from './detect';
 export * from './input-classes';
 export { colorVariants } from './variants';

package/dist/utils/index.js

@@ -1,7 +1,6 @@
 import { absoluteFullClasses, baseStyles, collapseAdjacentVariantBorders, dataFocusVisibleClasses, focusVisibleClasses, groupDataFocusVisibleClasses, hiddenInputClasses, ringClasses, translateCenterClasses } from "./classes.js";
 import { cn } from "./cn.js";
-import { objectEntries } from "./common.js";
 import { colorVariants } from "./variants.js";
 export * from "./detect.js";
 export * from "./input-classes.js";
-export { absoluteFullClasses, baseStyles, cn, collapseAdjacentVariantBorders, colorVariants, dataFocusVisibleClasses, focusVisibleClasses, groupDataFocusVisibleClasses, hiddenInputClasses, objectEntries, ringClasses, translateCenterClasses };
+export { absoluteFullClasses, baseStyles, cn, collapseAdjacentVariantBorders, colorVariants, dataFocusVisibleClasses, focusVisibleClasses, groupDataFocusVisibleClasses, hiddenInputClasses, ringClasses, translateCenterClasses };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@particle-network/ui-react",
-  "version": "0.5.1-beta.21",
+  "version": "0.5.1-beta.23",
   "type": "module",
   "exports": {
     ".": {
@@ -38,8 +38,8 @@
     "@rslib/core": "^0.12.3",
     "@types/react": "^19.1.10",
     "react": "^19.1.0",
-    "@particle-network/lintstaged-config": "0.1.0",
-    "@particle-network/eslint-config": "0.3.0"
+    "@particle-network/eslint-config": "0.3.0",
+    "@particle-network/lintstaged-config": "0.1.0"
   },
   "peerDependencies": {
     "react": ">=16.9.0",
@@ -52,8 +52,8 @@
     "react-aria-components": "^1.14.0",
     "values.js": "^2.1.1",
     "zustand": "^5.0.8",
-    "@particle-network/icons": "0.5.1-beta.8",
-    "@particle-network/ui-shared": "0.4.1-beta.6"
+    "@particle-network/icons": "0.5.1-beta.9",
+    "@particle-network/ui-shared": "0.4.1-beta.7"
   },
   "scripts": {
     "build": "rslib build",