@conform-to/react 0.7.0-pre.3 → 0.7.1

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/helpers.d.ts CHANGED
@@ -51,7 +51,7 @@ type InputOptions = BaseOptions & ({
51
51
  value?: never;
52
52
  });
53
53
  export declare const hiddenProps: {
54
- hiddenStyle: CSSProperties;
54
+ style: CSSProperties;
55
55
  tabIndex: number;
56
56
  'aria-hidden': boolean;
57
57
  };
package/helpers.js CHANGED
@@ -10,11 +10,9 @@ function getFormControlProps(config, options) {
10
10
  id: config.id,
11
11
  name: config.name,
12
12
  form: config.form,
13
- required: config.required
13
+ required: config.required,
14
+ autoFocus: config.initialError && Object.entries(config.initialError).length > 0 ? true : undefined
14
15
  };
15
- if (config.id) {
16
- props.id = config.id;
17
- }
18
16
  if (options !== null && options !== void 0 && options.ariaAttributes) {
19
17
  var _config$error;
20
18
  if (config.descriptionId && options !== null && options !== void 0 && options.description) {
@@ -25,17 +23,22 @@ function getFormControlProps(config, options) {
25
23
  props['aria-describedby'] = config.descriptionId && options !== null && options !== void 0 && options.description ? "".concat(config.errorId, " ").concat(config.descriptionId) : config.errorId;
26
24
  }
27
25
  }
28
- if (config.initialError && Object.entries(config.initialError).length > 0) {
29
- props.autoFocus = true;
26
+ return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, props), options !== null && options !== void 0 && options.hidden ? hiddenProps : {});
27
+ }
28
+ function cleanup(props) {
29
+ for (var key in props) {
30
+ if (props[key] === undefined) {
31
+ delete props[key];
32
+ }
30
33
  }
31
- return options !== null && options !== void 0 && options.hidden ? _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, props), hiddenProps) : props;
34
+ return props;
32
35
  }
33
36
  var hiddenProps = {
34
37
  /**
35
38
  * Style to make the input element visually hidden
36
39
  * Based on the `sr-only` class from tailwindcss
37
40
  */
38
- hiddenStyle: {
41
+ style: {
39
42
  position: 'absolute',
40
43
  width: '1px',
41
44
  height: '1px',
@@ -68,14 +71,14 @@ function input(config) {
68
71
  } else if (options.type !== 'file') {
69
72
  props.defaultValue = config.defaultValue;
70
73
  }
71
- return props;
74
+ return cleanup(props);
72
75
  }
73
76
  function select(config, options) {
74
77
  var props = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, getFormControlProps(config, options)), {}, {
75
78
  defaultValue: config.defaultValue,
76
79
  multiple: config.multiple
77
80
  });
78
- return props;
81
+ return cleanup(props);
79
82
  }
80
83
  function textarea(config, options) {
81
84
  var props = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, getFormControlProps(config, options)), {}, {
@@ -83,7 +86,7 @@ function textarea(config, options) {
83
86
  minLength: config.minLength,
84
87
  maxLength: config.maxLength
85
88
  });
86
- return props;
89
+ return cleanup(props);
87
90
  }
88
91
 
89
92
  Object.defineProperty(exports, 'INTENT', {
package/helpers.mjs CHANGED
@@ -6,11 +6,9 @@ function getFormControlProps(config, options) {
6
6
  id: config.id,
7
7
  name: config.name,
8
8
  form: config.form,
9
- required: config.required
9
+ required: config.required,
10
+ autoFocus: config.initialError && Object.entries(config.initialError).length > 0 ? true : undefined
10
11
  };
11
- if (config.id) {
12
- props.id = config.id;
13
- }
14
12
  if (options !== null && options !== void 0 && options.ariaAttributes) {
15
13
  var _config$error;
16
14
  if (config.descriptionId && options !== null && options !== void 0 && options.description) {
@@ -21,17 +19,22 @@ function getFormControlProps(config, options) {
21
19
  props['aria-describedby'] = config.descriptionId && options !== null && options !== void 0 && options.description ? "".concat(config.errorId, " ").concat(config.descriptionId) : config.errorId;
22
20
  }
23
21
  }
24
- if (config.initialError && Object.entries(config.initialError).length > 0) {
25
- props.autoFocus = true;
22
+ return _objectSpread2(_objectSpread2({}, props), options !== null && options !== void 0 && options.hidden ? hiddenProps : {});
23
+ }
24
+ function cleanup(props) {
25
+ for (var key in props) {
26
+ if (props[key] === undefined) {
27
+ delete props[key];
28
+ }
26
29
  }
27
- return options !== null && options !== void 0 && options.hidden ? _objectSpread2(_objectSpread2({}, props), hiddenProps) : props;
30
+ return props;
28
31
  }
29
32
  var hiddenProps = {
30
33
  /**
31
34
  * Style to make the input element visually hidden
32
35
  * Based on the `sr-only` class from tailwindcss
33
36
  */
34
- hiddenStyle: {
37
+ style: {
35
38
  position: 'absolute',
36
39
  width: '1px',
37
40
  height: '1px',
@@ -64,14 +67,14 @@ function input(config) {
64
67
  } else if (options.type !== 'file') {
65
68
  props.defaultValue = config.defaultValue;
66
69
  }
67
- return props;
70
+ return cleanup(props);
68
71
  }
69
72
  function select(config, options) {
70
73
  var props = _objectSpread2(_objectSpread2({}, getFormControlProps(config, options)), {}, {
71
74
  defaultValue: config.defaultValue,
72
75
  multiple: config.multiple
73
76
  });
74
- return props;
77
+ return cleanup(props);
75
78
  }
76
79
  function textarea(config, options) {
77
80
  var props = _objectSpread2(_objectSpread2({}, getFormControlProps(config, options)), {}, {
@@ -79,7 +82,7 @@ function textarea(config, options) {
79
82
  minLength: config.minLength,
80
83
  maxLength: config.maxLength
81
84
  });
82
- return props;
85
+ return cleanup(props);
83
86
  }
84
87
 
85
88
  export { hiddenProps, input, select, textarea };
package/hooks.js CHANGED
@@ -278,8 +278,9 @@ function useForm() {
278
278
  method: dom.getFormMethod(nativeEvent)
279
279
  });
280
280
  }
281
- } catch (e) {
282
- console.warn(e);
281
+ } catch (error) {
282
+ // eslint-disable-next-line no-console
283
+ console.warn('Client validation failed', error);
283
284
  }
284
285
  }
285
286
  }
@@ -484,7 +485,6 @@ function useInputEvent(options) {
484
485
  if (dom.isFieldElement(element) && (listener === 'onReset' ? event.target === element.form : event.target === element)) {
485
486
  var _optionsRef$current4, _optionsRef$current4$;
486
487
  if (listener !== 'onReset') {
487
- console.log(listener, 'dispatched');
488
488
  eventDispatched.current[listener] = true;
489
489
  }
490
490
  (_optionsRef$current4 = optionsRef.current) === null || _optionsRef$current4 === void 0 ? void 0 : (_optionsRef$current4$ = _optionsRef$current4[listener]) === null || _optionsRef$current4$ === void 0 ? void 0 : _optionsRef$current4$.call(_optionsRef$current4, event);
@@ -514,6 +514,7 @@ function useInputEvent(options) {
514
514
  var _optionsRef$current5, _optionsRef$current6, _optionsRef$current7;
515
515
  var _element2 = typeof ((_optionsRef$current5 = optionsRef.current) === null || _optionsRef$current5 === void 0 ? void 0 : _optionsRef$current5.ref) === 'function' ? (_optionsRef$current6 = optionsRef.current) === null || _optionsRef$current6 === void 0 ? void 0 : _optionsRef$current6.ref() : (_optionsRef$current7 = optionsRef.current) === null || _optionsRef$current7 === void 0 ? void 0 : _optionsRef$current7.ref.current;
516
516
  if (!dom.isFieldElement(_element2)) {
517
+ // eslint-disable-next-line no-console
517
518
  console.warn('Failed to dispatch event; is the input mounted?');
518
519
  return;
519
520
  }
@@ -648,6 +649,7 @@ function validateConstraint(options) {
648
649
  attributeValue
649
650
  });
650
651
  } else {
652
+ // eslint-disable-next-line no-console
651
653
  console.warn("Found an \"".concat(constraintName, "\" constraint with undefined definition; Please specify it on the validateConstraint API."));
652
654
  }
653
655
  }
@@ -692,6 +694,7 @@ function reportSubmission(form, submission) {
692
694
  if (item instanceof RadioNodeList) {
693
695
  for (var field of item) {
694
696
  if (field.type !== 'radio') {
697
+ // eslint-disable-next-line no-console
695
698
  console.warn('Repeated field name is not supported.');
696
699
  continue;
697
700
  }
package/hooks.mjs CHANGED
@@ -274,8 +274,9 @@ function useForm() {
274
274
  method: getFormMethod(nativeEvent)
275
275
  });
276
276
  }
277
- } catch (e) {
278
- console.warn(e);
277
+ } catch (error) {
278
+ // eslint-disable-next-line no-console
279
+ console.warn('Client validation failed', error);
279
280
  }
280
281
  }
281
282
  }
@@ -480,7 +481,6 @@ function useInputEvent(options) {
480
481
  if (isFieldElement(element) && (listener === 'onReset' ? event.target === element.form : event.target === element)) {
481
482
  var _optionsRef$current4, _optionsRef$current4$;
482
483
  if (listener !== 'onReset') {
483
- console.log(listener, 'dispatched');
484
484
  eventDispatched.current[listener] = true;
485
485
  }
486
486
  (_optionsRef$current4 = optionsRef.current) === null || _optionsRef$current4 === void 0 ? void 0 : (_optionsRef$current4$ = _optionsRef$current4[listener]) === null || _optionsRef$current4$ === void 0 ? void 0 : _optionsRef$current4$.call(_optionsRef$current4, event);
@@ -510,6 +510,7 @@ function useInputEvent(options) {
510
510
  var _optionsRef$current5, _optionsRef$current6, _optionsRef$current7;
511
511
  var _element2 = typeof ((_optionsRef$current5 = optionsRef.current) === null || _optionsRef$current5 === void 0 ? void 0 : _optionsRef$current5.ref) === 'function' ? (_optionsRef$current6 = optionsRef.current) === null || _optionsRef$current6 === void 0 ? void 0 : _optionsRef$current6.ref() : (_optionsRef$current7 = optionsRef.current) === null || _optionsRef$current7 === void 0 ? void 0 : _optionsRef$current7.ref.current;
512
512
  if (!isFieldElement(_element2)) {
513
+ // eslint-disable-next-line no-console
513
514
  console.warn('Failed to dispatch event; is the input mounted?');
514
515
  return;
515
516
  }
@@ -644,6 +645,7 @@ function validateConstraint(options) {
644
645
  attributeValue
645
646
  });
646
647
  } else {
648
+ // eslint-disable-next-line no-console
647
649
  console.warn("Found an \"".concat(constraintName, "\" constraint with undefined definition; Please specify it on the validateConstraint API."));
648
650
  }
649
651
  }
@@ -688,6 +690,7 @@ function reportSubmission(form, submission) {
688
690
  if (item instanceof RadioNodeList) {
689
691
  for (var field of item) {
690
692
  if (field.type !== 'radio') {
693
+ // eslint-disable-next-line no-console
691
694
  console.warn('Repeated field name is not supported.');
692
695
  continue;
693
696
  }
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Conform view adapter for react",
4
4
  "homepage": "https://conform.guide",
5
5
  "license": "MIT",
6
- "version": "0.7.0-pre.3",
6
+ "version": "0.7.1",
7
7
  "main": "index.js",
8
8
  "module": "index.mjs",
9
9
  "types": "index.d.ts",
@@ -30,7 +30,7 @@
30
30
  "url": "https://github.com/edmundhung/conform/issues"
31
31
  },
32
32
  "dependencies": {
33
- "@conform-to/dom": "0.7.0-pre.3"
33
+ "@conform-to/dom": "0.7.1"
34
34
  },
35
35
  "peerDependencies": {
36
36
  "react": ">=16.8"