@webstudio-is/sdk-components-react-remix 0.75.0 → 0.76.0

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.
@@ -22,115 +22,8 @@ __export(link_props_exports, {
22
22
  });
23
23
  module.exports = __toCommonJS(link_props_exports);
24
24
  const props = {
25
- slot: { required: false, control: "text", type: "string" },
26
- style: { required: false, control: "text", type: "string" },
27
- title: { required: false, control: "text", type: "string" },
28
- download: { required: false, control: "text", type: "string" },
29
- href: { required: false, control: "text", type: "string" },
30
- hrefLang: { required: false, control: "text", type: "string" },
31
- media: { required: false, control: "text", type: "string" },
32
- ping: { required: false, control: "text", type: "string" },
33
- type: { required: false, control: "text", type: "string" },
34
- referrerPolicy: {
35
- required: false,
36
- control: "select",
37
- type: "string",
38
- options: [
39
- "",
40
- "no-referrer",
41
- "no-referrer-when-downgrade",
42
- "origin",
43
- "origin-when-cross-origin",
44
- "same-origin",
45
- "strict-origin",
46
- "strict-origin-when-cross-origin",
47
- "unsafe-url"
48
- ]
49
- },
50
- defaultChecked: { required: false, control: "boolean", type: "boolean" },
51
- defaultValue: { required: false, control: "text", type: "string" },
52
- suppressContentEditableWarning: {
53
- required: false,
54
- control: "boolean",
55
- type: "boolean"
56
- },
57
- suppressHydrationWarning: {
58
- required: false,
59
- control: "boolean",
60
- type: "boolean"
61
- },
62
- accessKey: { required: false, control: "text", type: "string" },
63
- autoFocus: { required: false, control: "boolean", type: "boolean" },
64
- className: { required: false, control: "text", type: "string" },
65
- contentEditable: { required: false, control: "text", type: "string" },
66
- contextMenu: { required: false, control: "text", type: "string" },
67
- dir: { required: false, control: "text", type: "string" },
68
- draggable: { required: false, control: "boolean", type: "boolean" },
69
- hidden: { required: false, control: "boolean", type: "boolean" },
70
- id: { required: false, control: "text", type: "string" },
71
- lang: { required: false, control: "text", type: "string" },
72
- nonce: { required: false, control: "text", type: "string" },
73
- placeholder: { required: false, control: "text", type: "string" },
74
- spellCheck: { required: false, control: "boolean", type: "boolean" },
75
- tabIndex: { required: false, control: "number", type: "number" },
76
- translate: {
77
- required: false,
78
- control: "radio",
79
- type: "string",
80
- options: ["yes", "no"]
81
- },
82
- radioGroup: { required: false, control: "text", type: "string" },
83
- role: { required: false, control: "text", type: "string" },
84
25
  about: { required: false, control: "text", type: "string" },
85
- content: { required: false, control: "text", type: "string" },
86
- datatype: { required: false, control: "text", type: "string" },
87
- inlist: { required: false, control: "text", type: "string" },
88
- prefix: { required: false, control: "text", type: "string" },
89
- property: { required: false, control: "text", type: "string" },
90
- rel: { required: false, control: "text", type: "string" },
91
- resource: { required: false, control: "text", type: "string" },
92
- rev: { required: false, control: "text", type: "string" },
93
- typeof: { required: false, control: "text", type: "string" },
94
- vocab: { required: false, control: "text", type: "string" },
95
- autoCapitalize: { required: false, control: "text", type: "string" },
96
- autoCorrect: { required: false, control: "text", type: "string" },
97
- autoSave: { required: false, control: "text", type: "string" },
98
- color: { required: false, control: "color", type: "string" },
99
- itemProp: { required: false, control: "text", type: "string" },
100
- itemScope: { required: false, control: "boolean", type: "boolean" },
101
- itemType: { required: false, control: "text", type: "string" },
102
- itemID: { required: false, control: "text", type: "string" },
103
- itemRef: { required: false, control: "text", type: "string" },
104
- results: { required: false, control: "number", type: "number" },
105
- security: { required: false, control: "text", type: "string" },
106
- unselectable: {
107
- required: false,
108
- control: "radio",
109
- type: "string",
110
- options: ["on", "off"]
111
- },
112
- inputMode: {
113
- description: "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
114
- required: false,
115
- control: "select",
116
- type: "string",
117
- options: [
118
- "text",
119
- "none",
120
- "search",
121
- "tel",
122
- "url",
123
- "email",
124
- "numeric",
125
- "decimal"
126
- ]
127
- },
128
- is: {
129
- description: "Specify that a standard HTML element should behave like a defined custom built-in element\n@see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is",
130
- required: false,
131
- control: "text",
132
- type: "string"
133
- },
26
+ accessKey: { required: false, control: "text", type: "string" },
134
27
  "aria-activedescendant": {
135
28
  description: "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
136
29
  required: false,
@@ -437,19 +330,121 @@ const props = {
437
330
  control: "text",
438
331
  type: "string"
439
332
  },
440
- target: {
333
+ autoCapitalize: { required: false, control: "text", type: "string" },
334
+ autoCorrect: { required: false, control: "text", type: "string" },
335
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
336
+ autoSave: { required: false, control: "text", type: "string" },
337
+ className: { required: false, control: "text", type: "string" },
338
+ color: { required: false, control: "color", type: "string" },
339
+ content: { required: false, control: "text", type: "string" },
340
+ contextMenu: { required: false, control: "text", type: "string" },
341
+ datatype: { required: false, control: "text", type: "string" },
342
+ defaultChecked: { required: false, control: "boolean", type: "boolean" },
343
+ dir: { required: false, control: "text", type: "string" },
344
+ draggable: { required: false, control: "boolean", type: "boolean" },
345
+ hidden: { required: false, control: "boolean", type: "boolean" },
346
+ href: { required: false, control: "text", type: "string" },
347
+ hrefLang: { required: false, control: "text", type: "string" },
348
+ id: { required: false, control: "text", type: "string" },
349
+ inputMode: {
350
+ description: "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
441
351
  required: false,
442
352
  control: "select",
443
353
  type: "string",
444
- options: ["_self", "_blank", "_parent", "_top"]
354
+ options: [
355
+ "text",
356
+ "none",
357
+ "search",
358
+ "tel",
359
+ "url",
360
+ "email",
361
+ "numeric",
362
+ "decimal"
363
+ ]
445
364
  },
365
+ is: {
366
+ description: "Specify that a standard HTML element should behave like a defined custom built-in element\n@see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is",
367
+ required: false,
368
+ control: "text",
369
+ type: "string"
370
+ },
371
+ itemID: { required: false, control: "text", type: "string" },
372
+ itemProp: { required: false, control: "text", type: "string" },
373
+ itemRef: { required: false, control: "text", type: "string" },
374
+ itemScope: { required: false, control: "boolean", type: "boolean" },
375
+ itemType: { required: false, control: "text", type: "string" },
376
+ lang: { required: false, control: "text", type: "string" },
377
+ media: { required: false, control: "text", type: "string" },
378
+ nonce: { required: false, control: "text", type: "string" },
379
+ ping: { required: false, control: "text", type: "string" },
380
+ placeholder: { required: false, control: "text", type: "string" },
446
381
  prefetch: {
447
382
  required: false,
448
383
  control: "radio",
449
384
  type: "string",
450
385
  options: ["none", "intent", "render"]
451
386
  },
387
+ prefix: { required: false, control: "text", type: "string" },
388
+ preventScrollReset: { required: false, control: "boolean", type: "boolean" },
389
+ property: { required: false, control: "text", type: "string" },
390
+ radioGroup: { required: false, control: "text", type: "string" },
391
+ referrerPolicy: {
392
+ required: false,
393
+ control: "select",
394
+ type: "string",
395
+ options: [
396
+ "",
397
+ "no-referrer",
398
+ "no-referrer-when-downgrade",
399
+ "origin",
400
+ "origin-when-cross-origin",
401
+ "same-origin",
402
+ "strict-origin",
403
+ "strict-origin-when-cross-origin",
404
+ "unsafe-url"
405
+ ]
406
+ },
407
+ rel: { required: false, control: "text", type: "string" },
452
408
  reloadDocument: { required: false, control: "boolean", type: "boolean" },
453
409
  replace: { required: false, control: "boolean", type: "boolean" },
454
- preventScrollReset: { required: false, control: "boolean", type: "boolean" }
410
+ resource: { required: false, control: "text", type: "string" },
411
+ results: { required: false, control: "number", type: "number" },
412
+ rev: { required: false, control: "text", type: "string" },
413
+ role: { required: false, control: "text", type: "string" },
414
+ security: { required: false, control: "text", type: "string" },
415
+ slot: { required: false, control: "text", type: "string" },
416
+ spellCheck: { required: false, control: "boolean", type: "boolean" },
417
+ suppressContentEditableWarning: {
418
+ required: false,
419
+ control: "boolean",
420
+ type: "boolean"
421
+ },
422
+ suppressHydrationWarning: {
423
+ required: false,
424
+ control: "boolean",
425
+ type: "boolean"
426
+ },
427
+ tabIndex: { required: false, control: "number", type: "number" },
428
+ target: {
429
+ required: false,
430
+ control: "select",
431
+ type: "string",
432
+ options: ["_self", "_blank", "_parent", "_top"]
433
+ },
434
+ title: { required: false, control: "text", type: "string" },
435
+ translate: {
436
+ required: false,
437
+ control: "radio",
438
+ type: "string",
439
+ options: ["yes", "no"]
440
+ },
441
+ type: { required: false, control: "text", type: "string" },
442
+ typeof: { required: false, control: "text", type: "string" },
443
+ unselectable: {
444
+ required: false,
445
+ control: "radio",
446
+ type: "string",
447
+ options: ["on", "off"]
448
+ },
449
+ vocab: { required: false, control: "text", type: "string" }
455
450
  };
@@ -22,115 +22,8 @@ __export(rich_text_link_props_exports, {
22
22
  });
23
23
  module.exports = __toCommonJS(rich_text_link_props_exports);
24
24
  const props = {
25
- slot: { required: false, control: "text", type: "string" },
26
- style: { required: false, control: "text", type: "string" },
27
- title: { required: false, control: "text", type: "string" },
28
- download: { required: false, control: "text", type: "string" },
29
- href: { required: false, control: "text", type: "string" },
30
- hrefLang: { required: false, control: "text", type: "string" },
31
- media: { required: false, control: "text", type: "string" },
32
- ping: { required: false, control: "text", type: "string" },
33
- type: { required: false, control: "text", type: "string" },
34
- referrerPolicy: {
35
- required: false,
36
- control: "select",
37
- type: "string",
38
- options: [
39
- "",
40
- "no-referrer",
41
- "no-referrer-when-downgrade",
42
- "origin",
43
- "origin-when-cross-origin",
44
- "same-origin",
45
- "strict-origin",
46
- "strict-origin-when-cross-origin",
47
- "unsafe-url"
48
- ]
49
- },
50
- defaultChecked: { required: false, control: "boolean", type: "boolean" },
51
- defaultValue: { required: false, control: "text", type: "string" },
52
- suppressContentEditableWarning: {
53
- required: false,
54
- control: "boolean",
55
- type: "boolean"
56
- },
57
- suppressHydrationWarning: {
58
- required: false,
59
- control: "boolean",
60
- type: "boolean"
61
- },
62
- accessKey: { required: false, control: "text", type: "string" },
63
- autoFocus: { required: false, control: "boolean", type: "boolean" },
64
- className: { required: false, control: "text", type: "string" },
65
- contentEditable: { required: false, control: "text", type: "string" },
66
- contextMenu: { required: false, control: "text", type: "string" },
67
- dir: { required: false, control: "text", type: "string" },
68
- draggable: { required: false, control: "boolean", type: "boolean" },
69
- hidden: { required: false, control: "boolean", type: "boolean" },
70
- id: { required: false, control: "text", type: "string" },
71
- lang: { required: false, control: "text", type: "string" },
72
- nonce: { required: false, control: "text", type: "string" },
73
- placeholder: { required: false, control: "text", type: "string" },
74
- spellCheck: { required: false, control: "boolean", type: "boolean" },
75
- tabIndex: { required: false, control: "number", type: "number" },
76
- translate: {
77
- required: false,
78
- control: "radio",
79
- type: "string",
80
- options: ["yes", "no"]
81
- },
82
- radioGroup: { required: false, control: "text", type: "string" },
83
- role: { required: false, control: "text", type: "string" },
84
25
  about: { required: false, control: "text", type: "string" },
85
- content: { required: false, control: "text", type: "string" },
86
- datatype: { required: false, control: "text", type: "string" },
87
- inlist: { required: false, control: "text", type: "string" },
88
- prefix: { required: false, control: "text", type: "string" },
89
- property: { required: false, control: "text", type: "string" },
90
- rel: { required: false, control: "text", type: "string" },
91
- resource: { required: false, control: "text", type: "string" },
92
- rev: { required: false, control: "text", type: "string" },
93
- typeof: { required: false, control: "text", type: "string" },
94
- vocab: { required: false, control: "text", type: "string" },
95
- autoCapitalize: { required: false, control: "text", type: "string" },
96
- autoCorrect: { required: false, control: "text", type: "string" },
97
- autoSave: { required: false, control: "text", type: "string" },
98
- color: { required: false, control: "color", type: "string" },
99
- itemProp: { required: false, control: "text", type: "string" },
100
- itemScope: { required: false, control: "boolean", type: "boolean" },
101
- itemType: { required: false, control: "text", type: "string" },
102
- itemID: { required: false, control: "text", type: "string" },
103
- itemRef: { required: false, control: "text", type: "string" },
104
- results: { required: false, control: "number", type: "number" },
105
- security: { required: false, control: "text", type: "string" },
106
- unselectable: {
107
- required: false,
108
- control: "radio",
109
- type: "string",
110
- options: ["on", "off"]
111
- },
112
- inputMode: {
113
- description: "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
114
- required: false,
115
- control: "select",
116
- type: "string",
117
- options: [
118
- "text",
119
- "none",
120
- "search",
121
- "tel",
122
- "url",
123
- "email",
124
- "numeric",
125
- "decimal"
126
- ]
127
- },
128
- is: {
129
- description: "Specify that a standard HTML element should behave like a defined custom built-in element\n@see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is",
130
- required: false,
131
- control: "text",
132
- type: "string"
133
- },
26
+ accessKey: { required: false, control: "text", type: "string" },
134
27
  "aria-activedescendant": {
135
28
  description: "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
136
29
  required: false,
@@ -437,19 +330,121 @@ const props = {
437
330
  control: "text",
438
331
  type: "string"
439
332
  },
440
- target: {
333
+ autoCapitalize: { required: false, control: "text", type: "string" },
334
+ autoCorrect: { required: false, control: "text", type: "string" },
335
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
336
+ autoSave: { required: false, control: "text", type: "string" },
337
+ className: { required: false, control: "text", type: "string" },
338
+ color: { required: false, control: "color", type: "string" },
339
+ content: { required: false, control: "text", type: "string" },
340
+ contextMenu: { required: false, control: "text", type: "string" },
341
+ datatype: { required: false, control: "text", type: "string" },
342
+ defaultChecked: { required: false, control: "boolean", type: "boolean" },
343
+ dir: { required: false, control: "text", type: "string" },
344
+ draggable: { required: false, control: "boolean", type: "boolean" },
345
+ hidden: { required: false, control: "boolean", type: "boolean" },
346
+ href: { required: false, control: "text", type: "string" },
347
+ hrefLang: { required: false, control: "text", type: "string" },
348
+ id: { required: false, control: "text", type: "string" },
349
+ inputMode: {
350
+ description: "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
441
351
  required: false,
442
352
  control: "select",
443
353
  type: "string",
444
- options: ["_self", "_blank", "_parent", "_top"]
354
+ options: [
355
+ "text",
356
+ "none",
357
+ "search",
358
+ "tel",
359
+ "url",
360
+ "email",
361
+ "numeric",
362
+ "decimal"
363
+ ]
445
364
  },
365
+ is: {
366
+ description: "Specify that a standard HTML element should behave like a defined custom built-in element\n@see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is",
367
+ required: false,
368
+ control: "text",
369
+ type: "string"
370
+ },
371
+ itemID: { required: false, control: "text", type: "string" },
372
+ itemProp: { required: false, control: "text", type: "string" },
373
+ itemRef: { required: false, control: "text", type: "string" },
374
+ itemScope: { required: false, control: "boolean", type: "boolean" },
375
+ itemType: { required: false, control: "text", type: "string" },
376
+ lang: { required: false, control: "text", type: "string" },
377
+ media: { required: false, control: "text", type: "string" },
378
+ nonce: { required: false, control: "text", type: "string" },
379
+ ping: { required: false, control: "text", type: "string" },
380
+ placeholder: { required: false, control: "text", type: "string" },
446
381
  prefetch: {
447
382
  required: false,
448
383
  control: "radio",
449
384
  type: "string",
450
385
  options: ["none", "intent", "render"]
451
386
  },
387
+ prefix: { required: false, control: "text", type: "string" },
388
+ preventScrollReset: { required: false, control: "boolean", type: "boolean" },
389
+ property: { required: false, control: "text", type: "string" },
390
+ radioGroup: { required: false, control: "text", type: "string" },
391
+ referrerPolicy: {
392
+ required: false,
393
+ control: "select",
394
+ type: "string",
395
+ options: [
396
+ "",
397
+ "no-referrer",
398
+ "no-referrer-when-downgrade",
399
+ "origin",
400
+ "origin-when-cross-origin",
401
+ "same-origin",
402
+ "strict-origin",
403
+ "strict-origin-when-cross-origin",
404
+ "unsafe-url"
405
+ ]
406
+ },
407
+ rel: { required: false, control: "text", type: "string" },
452
408
  reloadDocument: { required: false, control: "boolean", type: "boolean" },
453
409
  replace: { required: false, control: "boolean", type: "boolean" },
454
- preventScrollReset: { required: false, control: "boolean", type: "boolean" }
410
+ resource: { required: false, control: "text", type: "string" },
411
+ results: { required: false, control: "number", type: "number" },
412
+ rev: { required: false, control: "text", type: "string" },
413
+ role: { required: false, control: "text", type: "string" },
414
+ security: { required: false, control: "text", type: "string" },
415
+ slot: { required: false, control: "text", type: "string" },
416
+ spellCheck: { required: false, control: "boolean", type: "boolean" },
417
+ suppressContentEditableWarning: {
418
+ required: false,
419
+ control: "boolean",
420
+ type: "boolean"
421
+ },
422
+ suppressHydrationWarning: {
423
+ required: false,
424
+ control: "boolean",
425
+ type: "boolean"
426
+ },
427
+ tabIndex: { required: false, control: "number", type: "number" },
428
+ target: {
429
+ required: false,
430
+ control: "select",
431
+ type: "string",
432
+ options: ["_self", "_blank", "_parent", "_top"]
433
+ },
434
+ title: { required: false, control: "text", type: "string" },
435
+ translate: {
436
+ required: false,
437
+ control: "radio",
438
+ type: "string",
439
+ options: ["yes", "no"]
440
+ },
441
+ type: { required: false, control: "text", type: "string" },
442
+ typeof: { required: false, control: "text", type: "string" },
443
+ unselectable: {
444
+ required: false,
445
+ control: "radio",
446
+ type: "string",
447
+ options: ["on", "off"]
448
+ },
449
+ vocab: { required: false, control: "text", type: "string" }
455
450
  };
package/lib/cjs/form.js CHANGED
@@ -28,54 +28,28 @@ var import_react2 = require("@remix-run/react");
28
28
  var import_form_handlers = require("@webstudio-is/form-handlers");
29
29
  var import_react_sdk = require("@webstudio-is/react-sdk");
30
30
  const defaultTag = "form";
31
- const isComponentNode = (component, node) => "props" in node && node.props.instance?.component === component;
32
- const onlyErrorMessage = (children) => import_react.Children.map(children, (child) => {
33
- if (typeof child !== "object" || child === null) {
34
- return null;
35
- }
36
- if (isComponentNode("ErrorMessage", child)) {
37
- return child;
38
- }
39
- if ("props" in child) {
40
- const newChildren = onlyErrorMessage(child.props.children);
41
- return import_react.Children.toArray(newChildren).some((child2) => child2 !== null) ? (0, import_react.cloneElement)(child, { children: newChildren }) : null;
42
- }
43
- return onlyErrorMessage(child);
44
- });
45
- const onlySuccessMessage = (children) => import_react.Children.map(children, (child) => {
46
- if (typeof child !== "object" || child === null) {
47
- return null;
48
- }
49
- if (isComponentNode("SuccessMessage", child)) {
50
- return child;
51
- }
52
- if ("props" in child) {
53
- const newChildren = onlySuccessMessage(child.props.children);
54
- return import_react.Children.toArray(newChildren).some((child2) => child2 !== null) ? (0, import_react.cloneElement)(child, { children: newChildren }) : null;
55
- }
56
- return onlySuccessMessage(child);
57
- });
58
- const withoutMessages = (children) => import_react.Children.map(children, (child) => {
59
- if (typeof child !== "object" || child === null) {
60
- return child;
61
- }
62
- if (isComponentNode("ErrorMessage", child) || isComponentNode("SuccessMessage", child)) {
63
- return null;
64
- }
65
- if ("props" in child) {
66
- return (0, import_react.cloneElement)(child, {
67
- children: withoutMessages(child.props.children)
68
- });
69
- }
70
- return withoutMessages(child);
71
- });
72
- const Form = (0, import_react.forwardRef)(({ children, initialState = "initial", ...props }, ref) => {
31
+ const useOnFetchEnd = (fetcher, handler) => {
32
+ const latestHandler = (0, import_react.useRef)(handler);
33
+ latestHandler.current = handler;
34
+ const prevFetcher = (0, import_react.useRef)(fetcher);
35
+ (0, import_react.useEffect)(() => {
36
+ if (prevFetcher.current.state !== fetcher.state && fetcher.state === "idle" && fetcher.data !== void 0) {
37
+ latestHandler.current(fetcher.data);
38
+ }
39
+ prevFetcher.current = fetcher;
40
+ }, [fetcher]);
41
+ };
42
+ const Form = (0, import_react.forwardRef)(({ children, action, method, state = "initial", ...rest }, ref) => {
43
+ const { setDataSourceValue } = (0, import_react.useContext)(import_react_sdk.ReactSdkContext);
73
44
  const fetcher = (0, import_react2.useFetcher)();
74
- const state = fetcher.type === "done" ? fetcher.data?.success === true ? "success" : "error" : initialState;
75
- const instanceId = (0, import_react_sdk.getInstanceIdFromComponentProps)(props);
76
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(fetcher.Form, { ...props, method: "post", "data-state": state, ref, children: [
45
+ const instanceId = (0, import_react_sdk.getInstanceIdFromComponentProps)(rest);
46
+ useOnFetchEnd(fetcher, (data) => {
47
+ const state2 = data?.success === true ? "success" : "error";
48
+ setDataSourceValue(instanceId, "state", state2);
49
+ });
50
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(fetcher.Form, { ...rest, method: "post", "data-state": state, ref, children: [
77
51
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "hidden", name: import_form_handlers.formIdFieldName, value: instanceId }),
78
- state === "success" ? onlySuccessMessage(children) : state === "error" ? onlyErrorMessage(children) : withoutMessages(children)
52
+ children
79
53
  ] });
80
54
  });
81
55
  Form.displayName = "Form";