@axenstudio/axen-form 0.1.1 → 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/README.md CHANGED
@@ -488,12 +488,12 @@ import { Spacer } from '@axenstudio/axen-form';
488
488
  <Spacer basis={4} />
489
489
  ```
490
490
 
491
- | Prop | Type | Default | Description |
492
- | --- | --- | --- | --- |
493
- | `x` | `number` | `0` | Horizontal spacing multiplier (width = x × 8px) |
494
- | `y` | `number` | `0` | Vertical spacing multiplier (height = y × 8px) |
495
- | `basis` | `number` | `0` | Flex basis multiplier (basis × 8px) |
496
- | `grow` | `boolean` | `false` | Grow to fill remaining space |
491
+ | Prop | Type | Default | Description |
492
+ | ------- | --------- | ------- | ----------------------------------------------- |
493
+ | `x` | `number` | `0` | Horizontal spacing multiplier (width = x × 8px) |
494
+ | `y` | `number` | `0` | Vertical spacing multiplier (height = y × 8px) |
495
+ | `basis` | `number` | `0` | Flex basis multiplier (basis × 8px) |
496
+ | `grow` | `boolean` | `false` | Grow to fill remaining space |
497
497
 
498
498
  ---
499
499
 
@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const jsxRuntime = require("react/jsx-runtime");
4
4
  const react = require("react");
5
5
  const payloadUtils = require("../core/payloadUtils.cjs");
6
+ const defaultComponentMap = require("../fields/defaultComponentMap.cjs");
6
7
  const FormContext = require("./FormContext.cjs");
7
8
  const useAxenForm = require("./useAxenForm.cjs");
8
9
  const useField = require("./useField.cjs");
@@ -10,7 +11,7 @@ function AxenFormInner(props, ref) {
10
11
  const {
11
12
  config,
12
13
  onSubmit,
13
- components = {},
14
+ components,
14
15
  validationAdapter,
15
16
  payloadFields,
16
17
  payloadDiscriminator,
@@ -22,6 +23,10 @@ function AxenFormInner(props, ref) {
22
23
  validateOnBlur,
23
24
  children
24
25
  } = props;
26
+ const mergedComponents = react.useMemo(
27
+ () => ({ ...defaultComponentMap.defaultComponentMap, ...components }),
28
+ [components]
29
+ );
25
30
  const wrappedOnSubmit = react.useMemo(() => {
26
31
  if (!payloadFields) return onSubmit;
27
32
  return async (values, meta) => {
@@ -48,10 +53,10 @@ function AxenFormInner(props, ref) {
48
53
  () => ({
49
54
  store,
50
55
  fields: config.fields,
51
- components,
56
+ components: mergedComponents,
52
57
  disabled
53
58
  }),
54
- [store, config.fields, components, disabled]
59
+ [store, config.fields, mergedComponents, disabled]
55
60
  );
56
61
  const gridStyle = react.useMemo(
57
62
  () => ({
@@ -1 +1 @@
1
- {"version":3,"file":"AxenForm.d.ts","sourceRoot":"","sources":["../../src/react/AxenForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGjF,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAsC,MAAM,UAAU,CAAC;AAyF/F,eAAO,MAAM,QAAQ,EAAgC,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC3F,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAC;IAAC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAA;CAAE,KACnF,SAAS,CAAC"}
1
+ {"version":3,"file":"AxenForm.d.ts","sourceRoot":"","sources":["../../src/react/AxenForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIjF,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAsC,MAAM,UAAU,CAAC;AA+F/F,eAAO,MAAM,QAAQ,EAAgC,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC3F,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAC;IAAC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAA;CAAE,KACnF,SAAS,CAAC"}
@@ -1,6 +1,7 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { forwardRef, useMemo, useImperativeHandle } from "react";
3
3
  import { mapPayload } from "../core/payloadUtils.js";
4
+ import { defaultComponentMap } from "../fields/defaultComponentMap.js";
4
5
  import { FormContext, useFormContext } from "./FormContext.js";
5
6
  import { useAxenForm } from "./useAxenForm.js";
6
7
  import { useField } from "./useField.js";
@@ -8,7 +9,7 @@ function AxenFormInner(props, ref) {
8
9
  const {
9
10
  config,
10
11
  onSubmit,
11
- components = {},
12
+ components,
12
13
  validationAdapter,
13
14
  payloadFields,
14
15
  payloadDiscriminator,
@@ -20,6 +21,10 @@ function AxenFormInner(props, ref) {
20
21
  validateOnBlur,
21
22
  children
22
23
  } = props;
24
+ const mergedComponents = useMemo(
25
+ () => ({ ...defaultComponentMap, ...components }),
26
+ [components]
27
+ );
23
28
  const wrappedOnSubmit = useMemo(() => {
24
29
  if (!payloadFields) return onSubmit;
25
30
  return async (values, meta) => {
@@ -46,10 +51,10 @@ function AxenFormInner(props, ref) {
46
51
  () => ({
47
52
  store,
48
53
  fields: config.fields,
49
- components,
54
+ components: mergedComponents,
50
55
  disabled
51
56
  }),
52
- [store, config.fields, components, disabled]
57
+ [store, config.fields, mergedComponents, disabled]
53
58
  );
54
59
  const gridStyle = useMemo(
55
60
  () => ({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@axenstudio/axen-form",
3
- "version": "0.1.1",
3
+ "version": "0.1.3",
4
4
  "description": "Lightweight, config-driven, enterprise-grade React form library. Zero UI dependency. CSS Modules. A11y-aware.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",