@deftui/addons 0.1.2 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/form.d.mts CHANGED
@@ -1,19 +1,8 @@
1
1
  import { RHFField } from "./react-hook-form/field.mjs";
2
2
  import { RHFForm } from "./react-hook-form/form.mjs";
3
3
  export declare const RHF: {
4
- /**
5
- * Thin wrapper for BaseUI's FormPrimitive.
6
- *
7
- * - `className` defaults to `"grid gap-4"`.
8
- */
4
+ /** A Base UI form with a default grid layout; submission stays controlled by the caller. */
9
5
  Form: typeof RHFForm;
10
- /**
11
- * `useController` wrapper with label, description, and error.
12
- *
13
- * - Injects `id`, `aria-invalid`, and `aria-describedby` into a single child element.
14
- * - For arrays/fragments, spread the second callback argument onto the control.
15
- * - Syncs `data-disabled` with the field's disabled state.
16
- * - Custom components must forward these props.
17
- */
6
+ /** Wraps `useController` with label, description, error, and control-prop forwarding. */
18
7
  Field: typeof RHFField;
19
8
  };
package/dist/form.mjs CHANGED
@@ -2,20 +2,9 @@ import { RHFField } from "./react-hook-form/field.mjs";
2
2
  import { RHFForm } from "./react-hook-form/form.mjs";
3
3
  // src/react-hook-form/index.ts
4
4
  const RHF = {
5
- /**
6
- * Thin wrapper for BaseUI's FormPrimitive.
7
- *
8
- * - `className` defaults to `"grid gap-4"`.
9
- */
5
+ /** A Base UI form with a default grid layout; submission stays controlled by the caller. */
10
6
  Form: RHFForm,
11
- /**
12
- * `useController` wrapper with label, description, and error.
13
- *
14
- * - Injects `id`, `aria-invalid`, and `aria-describedby` into a single child element.
15
- * - For arrays/fragments, spread the second callback argument onto the control.
16
- * - Syncs `data-disabled` with the field's disabled state.
17
- * - Custom components must forward these props.
18
- */
7
+ /** Wraps `useController` with label, description, error, and control-prop forwarding. */
19
8
  Field: RHFField
20
9
  };
21
10
  export { RHF };
@@ -1,19 +1,24 @@
1
1
  import React from "react";
2
- import { Field } from "@deftui/react";
3
2
  import { FieldPath, FieldValues, UseControllerProps, UseControllerReturn } from "react-hook-form";
4
- type FieldStateKeys = "name" | "disabled" | "invalid" | "dirty" | "touched";
5
- type FieldValidKeys = "validate" | "validationMode" | "validationDebounceTime";
6
- type FieldRootProps = Omit<React.ComponentProps<typeof Field>, FieldStateKeys | FieldValidKeys | "children">;
7
3
  interface ControlProps {
8
4
  "id": string;
9
5
  "aria-invalid": boolean;
10
6
  "aria-describedby": string | undefined;
11
7
  }
12
8
  interface RHFFieldProps<Values extends FieldValues, Name extends FieldPath<Values> = FieldPath<Values>, Output = Values> extends UseControllerProps<Values, Name, Output> {
9
+ /** Label associated with the control's ID. */
13
10
  label?: React.ReactNode;
11
+ /** Supporting text referenced by the control's aria-describedby. */
14
12
  description?: React.ReactNode;
15
- fieldProps?: FieldRootProps;
16
- /** A single non-fragment element receives control props automatically; spread them manually for nested controls. */
13
+ /**
14
+ * Injects id, aria-invalid, and aria-describedby into a single non-Fragment element returned by children.
15
+ *
16
+ * Set to false for wrapper elements or when binding `controlProps` to an inner control manually.
17
+ *
18
+ * @default true
19
+ */
20
+ injectControlProps?: boolean;
21
+ /** Callback with `useController` states and `controllerProps` for rendering JSX. */
17
22
  children: (state: UseControllerReturn<Values, Name>, controlProps: ControlProps) => React.ReactNode;
18
23
  }
19
24
  export declare function RHFField<T extends FieldValues, Name extends FieldPath<T>, Output = T>(props: RHFFieldProps<T, Name, Output>): React.JSX.Element;
@@ -1,10 +1,10 @@
1
- import { Fragment, cloneElement, isValidElement, useId } from "react";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
1
  import { Field } from "@deftui/react";
2
+ import { Fragment, cloneElement, isValidElement, useId } from "react";
4
3
  import { useController } from "react-hook-form";
4
+ import { jsx, jsxs } from "react/jsx-runtime";
5
5
  // src/react-hook-form/field.tsx
6
6
  function RHFField(props) {
7
- const { label, description, fieldProps, children, ...controllerProps } = props;
7
+ const { label, description, injectControlProps = true, children, ...controllerProps } = props;
8
8
  const id = useId();
9
9
  const controller = useController(controllerProps);
10
10
  const hasError = Boolean(controller.fieldState.error?.message);
@@ -14,12 +14,11 @@ function RHFField(props) {
14
14
  "aria-describedby": [description != null && `${id}-description`, hasError && `${id}-error`].filter(Boolean).join(" ") || void 0
15
15
  };
16
16
  const child = children(controller, controlProps);
17
- const control = isValidElement(child) && child.type !== Fragment ? child : null;
17
+ const control = injectControlProps && isValidElement(child) && child.type !== Fragment ? child : null;
18
18
  const controlId = control?.props.id ?? id;
19
19
  const descriptionIds = [control?.props["aria-describedby"], controlProps["aria-describedby"]].join(" ").split(/\s+/).filter(Boolean);
20
20
  const describedBy = [...new Set(descriptionIds)].join(" ") || void 0;
21
21
  return /* @__PURE__ */ jsxs(Field, {
22
- ...fieldProps,
23
22
  "data-invalid": controller.fieldState.invalid,
24
23
  "data-disabled": controller.field.disabled,
25
24
  children: [
@@ -1,3 +1,3 @@
1
- import { ComponentProps } from "react";
2
1
  import { Form } from "@deftui/react";
2
+ import { ComponentProps } from "react";
3
3
  export declare function RHFForm(props: ComponentProps<typeof Form>): import("react").JSX.Element;
@@ -1,5 +1,5 @@
1
- import { jsx } from "react/jsx-runtime";
2
1
  import { Form, cn } from "@deftui/react";
2
+ import { jsx } from "react/jsx-runtime";
3
3
  // src/react-hook-form/form.tsx
4
4
  function RHFForm(props) {
5
5
  const { children, className, ...formProps } = props;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deftui/addons",
3
- "version": "0.1.2",
3
+ "version": "0.1.3",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/KiriRainCat/deftui.git",
@@ -14,14 +14,14 @@
14
14
  "**/*.css"
15
15
  ],
16
16
  "exports": {
17
- "./modal": {
18
- "types": "./dist/modal.d.mts",
19
- "import": "./dist/modal.mjs"
20
- },
21
17
  "./form": {
22
18
  "types": "./dist/form.d.mts",
23
19
  "import": "./dist/form.mjs"
24
20
  },
21
+ "./modal": {
22
+ "types": "./dist/modal.d.mts",
23
+ "import": "./dist/modal.mjs"
24
+ },
25
25
  "./router": {
26
26
  "types": "./dist/router.d.mts",
27
27
  "import": "./dist/router.mjs"
@@ -40,17 +40,17 @@
40
40
  "fix": "vp check --fix"
41
41
  },
42
42
  "devDependencies": {
43
- "@deftui/react": "^0.1.2",
43
+ "@deftui/react": "^0.1.3",
44
44
  "@tanstack/react-router": "^1.170.46",
45
45
  "@types/react": "^19.3.0",
46
46
  "react-hook-form": "^7.91.0",
47
47
  "vite-plus": "catalog:"
48
48
  },
49
49
  "peerDependencies": {
50
- "@deftui/react": "^0.1.2",
51
- "@tanstack/react-router": "^1",
52
- "react": "^19",
53
- "react-hook-form": "^7"
50
+ "@deftui/react": "^0.1.3",
51
+ "@tanstack/react-router": "^1.170.0",
52
+ "react": "^19.0.0",
53
+ "react-hook-form": "^7.91.0"
54
54
  },
55
55
  "peerDependenciesMeta": {
56
56
  "@tanstack/react-router": {