soda-heroui 0.11.33 → 0.12.0

package/README.md

@@ -1,23 +1,23 @@
-# soda-tanstack-form
-
-[![NPM version](https://img.shields.io/npm/v/soda-tanstack-form.svg?style=flat)](https://npmjs.com/package/soda-tanstack-form)
-[![NPM downloads](http://img.shields.io/npm/dm/soda-tanstack-form.svg?style=flat)](https://npmjs.com/package/soda-tanstack-form)
-
-## Install
-
-```bash
-$ pnpm install
-```
-
-```bash
-$ npm run dev
-$ npm run build
-```
-
-## Options
-
-TODO
-
-## LICENSE
-
-MIT
+# soda-tanstack-form
+
+[![NPM version](https://img.shields.io/npm/v/soda-tanstack-form.svg?style=flat)](https://npmjs.com/package/soda-tanstack-form)
+[![NPM downloads](http://img.shields.io/npm/dm/soda-tanstack-form.svg?style=flat)](https://npmjs.com/package/soda-tanstack-form)
+
+## Install
+
+```bash
+$ pnpm install
+```
+
+```bash
+$ npm run dev
+$ npm run build
+```
+
+## Options
+
+TODO
+
+## LICENSE
+
+MIT

package/dist/components/EnumSelect.cjs

@@ -26,20 +26,22 @@ var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
     EnumSelect: ()=>EnumSelect,
-    createEnumSelect: ()=>createEnumSelect
+    createEnumSelect: ()=>createEnumSelect,
+    createFieldEnumSelect: ()=>createFieldEnumSelect
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 const react_namespaceObject = require("@heroui/react");
 const external_deepsea_tools_namespaceObject = require("deepsea-tools");
 const external_soda_hooks_namespaceObject = require("soda-hooks");
+const getFieldProps_cjs_namespaceObject = require("../utils/getFieldProps.cjs");
 const external_FormProvider_cjs_namespaceObject = require("./FormProvider.cjs");
 function render({ label, value }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_namespaceObject.SelectItem, {
         children: label
     }, value);
 }
-function EnumSelect({ enumObject, selectionMode, value: _value, onValueChange, emptyValue, ...rest }) {
+function EnumSelect({ enumObject, selectionMode, value: _value, onValueChange, emptyValue, component: Select2 = react_namespaceObject.Select, ...rest }) {
     const context = (0, external_react_namespaceObject.useContext)(external_FormProvider_cjs_namespaceObject.FormContext);
     emptyValue ??= context.emptyValue;
     const [value, setValue] = (0, external_soda_hooks_namespaceObject.useInputState)(_value);
@@ -67,7 +69,7 @@ function EnumSelect({ enumObject, selectionMode, value: _value, onValueChange, e
             })) : enumObject ? (0, external_deepsea_tools_namespaceObject.getEnumOptions)(enumObject) : [], [
         enumObject
     ]);
-    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_namespaceObject.Select, {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Select2, {
         items: items,
         selectionMode: selectionMode,
         selectedKeys: isNumberEnum ? selectedKeys.map(String) : selectedKeys,
@@ -84,11 +86,22 @@ function createEnumSelect(enumObject) {
         });
     };
 }
+function createFieldEnumSelect(enumObject) {
+    return function({ field, ...rest }) {
+        return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(EnumSelect, {
+            enumObject: enumObject,
+            ...(0, getFieldProps_cjs_namespaceObject.getFieldProps)(field),
+            ...rest
+        });
+    };
+}
 exports.EnumSelect = __webpack_exports__.EnumSelect;
 exports.createEnumSelect = __webpack_exports__.createEnumSelect;
+exports.createFieldEnumSelect = __webpack_exports__.createFieldEnumSelect;
 for(var __webpack_i__ in __webpack_exports__)if (-1 === [
     "EnumSelect",
-    "createEnumSelect"
+    "createEnumSelect",
+    "createFieldEnumSelect"
 ].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
 Object.defineProperty(exports, '__esModule', {
     value: true

package/dist/components/EnumSelect.d.ts

@@ -1,6 +1,7 @@
-import { ComponentProps, ReactNode } from "react";
-import { Select } from "@heroui/react";
+import { ComponentProps, ReactElement, ReactNode } from "react";
+import { Select, SelectProps } from "@heroui/react";
 import { ValueOf } from "deepsea-tools";
+import { Field } from "soda-tanstack-form";
 import { EmptyValue, GetEmptyValue } from "./FormProvider";
 import { SelectionMode } from "./FormSelect";
 /** enumObject 的类型 */
@@ -20,9 +21,15 @@ export interface EnumSelectPropsBase<Options extends SelectOptions, Mode extends
     value?: Value;
     onValueChange?: (value: Value) => void;
     emptyValue?: Empty;
+    component?: <T extends object>(props: SelectProps<T>) => ReactElement;
 }
 export interface EnumSelectProps<Options extends SelectOptions, Mode extends SelectionMode = "single", DisallowEmptySelection extends boolean = false, Empty extends EmptyValue = "null"> extends EnumSelectPropsBase<Options, Mode, DisallowEmptySelection, Empty> {
 }
-export declare function EnumSelect<Options extends SelectOptions, Mode extends SelectionMode = "single", DisallowEmptySelection extends boolean = false, Empty extends EmptyValue = "null">({ enumObject, selectionMode, value: _value, onValueChange, emptyValue, ...rest }: EnumSelectProps<Options, Mode, DisallowEmptySelection, Empty>): ReactNode;
+export declare function EnumSelect<Options extends SelectOptions, Mode extends SelectionMode = "single", DisallowEmptySelection extends boolean = false, Empty extends EmptyValue = "null">({ enumObject, selectionMode, value: _value, onValueChange, emptyValue, component: Select2, ...rest }: EnumSelectProps<Options, Mode, DisallowEmptySelection, Empty>): ReactNode;
 export declare function createEnumSelect<Options extends SelectOptions>(enumObject?: Options): EnumSelectComponent<EnumValue<Options>>;
 export type EnumSelectComponent<Value extends string | number> = <Mode extends SelectionMode = "single", DisallowEmptySelection extends boolean = false, Empty extends EmptyValue = "null">(props: Omit<EnumSelectProps<[ReactNode, Value][], Mode, DisallowEmptySelection, Empty>, "enumObject">) => ReactNode;
+export interface FieldEnumSelectProps<Options extends SelectOptions, Mode extends SelectionMode = "single", DisallowEmptySelection extends boolean = false, Empty extends EmptyValue = "null"> extends Omit<EnumSelectProps<Options, Mode, DisallowEmptySelection, Empty>, "enumObject"> {
+    field: Field<EnumValue<Options>>;
+}
+export type FieldEnumSelectComponent<Value extends string | number> = <Mode extends SelectionMode = "single", DisallowEmptySelection extends boolean = false, Empty extends EmptyValue = "null">(props: FieldEnumSelectProps<[ReactNode, Value][], Mode, DisallowEmptySelection, Empty>) => ReactNode;
+export declare function createFieldEnumSelect<Options extends SelectOptions>(enumObject?: Options): FieldEnumSelectComponent<EnumValue<Options>>;

package/dist/components/EnumSelect.js

@@ -4,13 +4,14 @@ import { useCallback, useContext, useMemo } from "react";
 import { Select, SelectItem } from "@heroui/react";
 import { getEnumOptions, intParser, isNonNullable } from "deepsea-tools";
 import { useInputState } from "soda-hooks";
+import { getFieldProps } from "../utils/getFieldProps.js";
 import { FormContext, getEmptyValue } from "./FormProvider.js";
 function render({ label, value }) {
     return /*#__PURE__*/ jsx(SelectItem, {
         children: label
     }, value);
 }
-function EnumSelect({ enumObject, selectionMode, value: _value, onValueChange, emptyValue, ...rest }) {
+function EnumSelect({ enumObject, selectionMode, value: _value, onValueChange, emptyValue, component: Select2 = Select, ...rest }) {
     const context = useContext(FormContext);
     emptyValue ??= context.emptyValue;
     const [value, setValue] = useInputState(_value);
@@ -38,7 +39,7 @@ function EnumSelect({ enumObject, selectionMode, value: _value, onValueChange, e
             })) : enumObject ? getEnumOptions(enumObject) : [], [
         enumObject
     ]);
-    return /*#__PURE__*/ jsx(Select, {
+    return /*#__PURE__*/ jsx(Select2, {
         items: items,
         selectionMode: selectionMode,
         selectedKeys: isNumberEnum ? selectedKeys.map(String) : selectedKeys,
@@ -55,4 +56,13 @@ function createEnumSelect(enumObject) {
         });
     };
 }
-export { EnumSelect, createEnumSelect };
+function createFieldEnumSelect(enumObject) {
+    return function({ field, ...rest }) {
+        return /*#__PURE__*/ jsx(EnumSelect, {
+            enumObject: enumObject,
+            ...getFieldProps(field),
+            ...rest
+        });
+    };
+}
+export { EnumSelect, createEnumSelect, createFieldEnumSelect };

package/dist/components/FormCalendar.d.ts

@@ -14,4 +14,3 @@ export interface FormCalendarProps<ValueMode extends TimeValueMode = "date", Fie
     component?: <T extends DateValue>(props: CalendarProps<T>) => ReactNode;
 }
 export declare function FormCalendar<ValueMode extends TimeValueMode = "date", FieldValue extends TimeValueModeMap<ValueMode> | null | undefined = TimeValueModeMap<ValueMode> | null | undefined>({ field, valueMode, emptyValue, dateMode, defaultTime, component: Calendar2, ...rest }: FormCalendarProps<ValueMode, FieldValue>): ReactNode;
-ctNode;

package/dist/components/FormDateInput.d.ts

@@ -14,4 +14,3 @@ export interface FormDateInputProps<ValueMode extends TimeValueMode = "date", Fi
     component?: <T extends DateValue>(props: DateInputProps<T>) => ReactNode;
 }
 export declare function FormDateInput<ValueMode extends TimeValueMode = "date", FieldValue extends TimeValueModeMap<ValueMode> | null | undefined = TimeValueModeMap<ValueMode> | null | undefined>({ field, valueMode, emptyValue, dateMode, defaultTime, component: DateInput2, ...rest }: FormDateInputProps<ValueMode, FieldValue>): ReactNode;
-ctNode;

package/dist/components/FormDateRangePicker.d.ts

@@ -14,4 +14,3 @@ export interface FormDateRangePickerProps<ValueMode extends TimeValueMode = "dat
     component?: <T extends DateValue>(props: DateRangePickerProps<T>) => ReactNode;
 }
 export declare function FormDateRangePicker<ValueMode extends TimeValueMode = "date", FieldValue extends [TimeValueModeMap<ValueMode>, TimeValueModeMap<ValueMode>] | null | undefined = [TimeValueModeMap<ValueMode>, TimeValueModeMap<ValueMode>] | null | undefined>({ field: _field, valueMode, emptyValue, dateMode, defaultTime, component: DateRangePicker2, ...rest }: FormDateRangePickerProps<ValueMode, FieldValue>): ReactNode;
-ctNode;

package/dist/components/FormRangeCalendar.d.ts

@@ -14,4 +14,3 @@ export interface FormRangeCalendarProps<ValueMode extends TimeValueMode = "date"
     component?: <T extends DateValue>(props: RangeCalendarProps<T>) => ReactNode;
 }
 export declare function FormRangeCalendar<ValueMode extends TimeValueMode = "date", FieldValue extends [TimeValueModeMap<ValueMode>, TimeValueModeMap<ValueMode>] | null | undefined = [TimeValueModeMap<ValueMode>, TimeValueModeMap<ValueMode>] | null | undefined>({ field: _field, valueMode, emptyValue, dateMode, defaultTime, component: RangeCalendar2, ...rest }: FormRangeCalendarProps<ValueMode, FieldValue>): ReactNode;
-ctNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "soda-heroui",
-  "version": "0.11.33",
+  "version": "0.12.0",
   "description": "",
   "type": "module",
   "exports": {
@@ -37,10 +37,10 @@
   "dependencies": {
     "@internationalized/date": ">=3.10.0",
     "@tanstack/react-form": "^1.27.1",
-    "deepsea-tools": "5.45.2",
+    "deepsea-tools": "5.46.0",
     "soda-tanstack-form": "0.3.6",
-    "soda-hooks": "6.16.8",
-    "soda-type": "6.7.4"
+    "soda-type": "6.7.4",
+    "soda-hooks": "6.16.9"
   },
   "devDependencies": {
     "@react-types/shared": "^3.32.1",

package/src/components/EnumSelect.tsx

@@ -1,10 +1,13 @@
 "use client"
 
-import { ComponentProps, ReactNode, useCallback, useContext, useMemo } from "react"
+import { ComponentProps, ReactElement, ReactNode, useCallback, useContext, useMemo } from "react"
 
-import { Select, SelectItem, SharedSelection } from "@heroui/react"
+import { Select, SelectItem, SelectProps, SharedSelection } from "@heroui/react"
 import { getEnumOptions, intParser, isNonNullable, ValueOf } from "deepsea-tools"
 import { useInputState } from "soda-hooks"
+import { Field } from "soda-tanstack-form"
+
+import { getFieldProps } from "@/utils/getFieldProps"
 
 import { EmptyValue, FormContext, getEmptyValue, GetEmptyValue } from "./FormProvider"
 import { SelectionMode } from "./FormSelect"
@@ -44,6 +47,7 @@ export interface EnumSelectPropsBase<
     value?: Value
     onValueChange?: (value: Value) => void
     emptyValue?: Empty
+    component?: <T extends object>(props: SelectProps<T>) => ReactElement
 }
 
 export interface EnumSelectProps<
@@ -65,7 +69,15 @@ export function EnumSelect<
     Mode extends SelectionMode = "single",
     DisallowEmptySelection extends boolean = false,
     Empty extends EmptyValue = "null",
->({ enumObject, selectionMode, value: _value, onValueChange, emptyValue, ...rest }: EnumSelectProps<Options, Mode, DisallowEmptySelection, Empty>): ReactNode {
+>({
+    enumObject,
+    selectionMode,
+    value: _value,
+    onValueChange,
+    emptyValue,
+    component: Select2 = Select,
+    ...rest
+}: EnumSelectProps<Options, Mode, DisallowEmptySelection, Empty>): ReactNode {
     const context = useContext(FormContext)
     emptyValue ??= context.emptyValue as Empty
 
@@ -96,7 +108,7 @@ export function EnumSelect<
     )
 
     return (
-        <Select
+        <Select2
             items={items}
             selectionMode={selectionMode}
             selectedKeys={isNumberEnum ? selectedKeys.map(String) : selectedKeys}
@@ -104,7 +116,7 @@ export function EnumSelect<
             {...rest}
         >
             {render}
-        </Select>
+        </Select2>
     )
 }
 
@@ -123,3 +135,29 @@ export type EnumSelectComponent<Value extends string | number> = <
 >(
     props: Omit<EnumSelectProps<[ReactNode, Value][], Mode, DisallowEmptySelection, Empty>, "enumObject">,
 ) => ReactNode
+
+export interface FieldEnumSelectProps<
+    Options extends SelectOptions,
+    Mode extends SelectionMode = "single",
+    DisallowEmptySelection extends boolean = false,
+    Empty extends EmptyValue = "null",
+> extends Omit<EnumSelectProps<Options, Mode, DisallowEmptySelection, Empty>, "enumObject"> {
+    field: Field<EnumValue<Options>>
+}
+
+export type FieldEnumSelectComponent<Value extends string | number> = <
+    Mode extends SelectionMode = "single",
+    DisallowEmptySelection extends boolean = false,
+    Empty extends EmptyValue = "null",
+>(
+    props: FieldEnumSelectProps<[ReactNode, Value][], Mode, DisallowEmptySelection, Empty>,
+) => ReactNode
+
+export function createFieldEnumSelect<Options extends SelectOptions>(enumObject?: Options): FieldEnumSelectComponent<EnumValue<Options>> {
+    return function EnumSelect2<Mode extends SelectionMode = "single", DisallowEmptySelection extends boolean = false, Empty extends EmptyValue = "null">({
+        field,
+        ...rest
+    }: FieldEnumSelectProps<Options, Mode, DisallowEmptySelection, Empty>): ReactNode {
+        return <EnumSelect<Options, Mode, DisallowEmptySelection, Empty> enumObject={enumObject} {...getFieldProps(field)} {...rest} />
+    } as unknown as FieldEnumSelectComponent<EnumValue<Options>>
+}

package/tsconfig.json

@@ -1,16 +1,16 @@
-{
-    "compilerOptions": {
-        "baseUrl": ".",
-        "strict": true,
-        "declaration": true,
-        "skipLibCheck": true,
-        "jsx": "react-jsx",
-        "target": "ESNext",
-        "module": "ESNext",
-        "moduleResolution": "Bundler",
-        "paths": {
-            "@/*": ["src/*"]
-        }
-    },
-    "include": ["src"]
-}
+{
+    "compilerOptions": {
+        "baseUrl": ".",
+        "strict": true,
+        "declaration": true,
+        "skipLibCheck": true,
+        "jsx": "react-jsx",
+        "target": "ESNext",
+        "module": "ESNext",
+        "moduleResolution": "Bundler",
+        "paths": {
+            "@/*": ["src/*"]
+        }
+    },
+    "include": ["src"]
+}