@react-spectrum/form 3.6.7 → 3.7.0

package/dist/import.mjs

@@ -1,12 +1,15 @@
 import "./main.css";
 import {useStyleProps as $011V3$useStyleProps, useDOMRef as $011V3$useDOMRef, classNames as $011V3$classNames} from "@react-spectrum/utils";
 import {filterDOMProps as $011V3$filterDOMProps} from "@react-aria/utils";
+import {FormValidationContext as $011V3$FormValidationContext} from "@react-stately/form";
 import {useProviderProps as $011V3$useProviderProps, Provider as $011V3$Provider} from "@react-spectrum/provider";
 import $011V3$react, {useContext as $011V3$useContext} from "react";
 
+
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
+
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
@@ -35,6 +38,7 @@ function $parcel$export(e, n, v, s) {
 
 
 
+
 var $cd231e464c886c86$exports = {};
 
 $parcel$export($cd231e464c886c86$exports, "contextualHelp", () => $cd231e464c886c86$export$4ba534aba1836d, (v) => $cd231e464c886c86$export$4ba534aba1836d = v);
@@ -141,17 +145,20 @@ const $ac118ceca79b8650$var$formPropNames = new Set([
     "encType",
     "method",
     "target",
-    "onSubmit"
+    "onSubmit",
+    "onReset",
+    "onInvalid"
 ]);
 function $ac118ceca79b8650$var$Form(props, ref) {
     props = (0, $011V3$useProviderProps)(props);
-    let { children: children, labelPosition: labelPosition = "top", labelAlign: labelAlign = "start", isRequired: isRequired, necessityIndicator: necessityIndicator, isQuiet: isQuiet, isEmphasized: isEmphasized, isDisabled: isDisabled, isReadOnly: isReadOnly, validationState: validationState, ...otherProps } = props;
+    let { children: children, labelPosition: labelPosition = "top", labelAlign: labelAlign = "start", isRequired: isRequired, necessityIndicator: necessityIndicator, isQuiet: isQuiet, isEmphasized: isEmphasized, isDisabled: isDisabled, isReadOnly: isReadOnly, validationState: validationState, validationBehavior: validationBehavior, validationErrors: validationErrors, ...otherProps } = props;
     let { styleProps: styleProps } = (0, $011V3$useStyleProps)(otherProps);
     let domRef = (0, $011V3$useDOMRef)(ref);
     let ctx = {
         labelPosition: labelPosition,
         labelAlign: labelAlign,
-        necessityIndicator: necessityIndicator
+        necessityIndicator: necessityIndicator,
+        validationBehavior: validationBehavior
     };
     return /*#__PURE__*/ (0, $011V3$react).createElement("form", {
         ...(0, $011V3$filterDOMProps)(otherProps, {
@@ -159,7 +166,7 @@ function $ac118ceca79b8650$var$Form(props, ref) {
             propNames: $ac118ceca79b8650$var$formPropNames
         }),
         ...styleProps,
-        noValidate: true,
+        noValidate: validationBehavior !== "native",
         ref: domRef,
         className: (0, $011V3$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($cd231e464c886c86$exports))), "spectrum-Form", {
             "spectrum-Form--positionSide": labelPosition === "side",
@@ -174,7 +181,9 @@ function $ac118ceca79b8650$var$Form(props, ref) {
         isReadOnly: isReadOnly,
         isRequired: isRequired,
         validationState: validationState
-    }, children)));
+    }, /*#__PURE__*/ (0, $011V3$react).createElement((0, $011V3$FormValidationContext).Provider, {
+        value: validationErrors || {}
+    }, children))));
 }
 /**
  * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.

package/dist/main.css

@@ -1 +1 @@
-.A-HlBa_i18nFontFamily{font-synthesis:weight;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.A-HlBa_i18nFontFamily:lang(ar){font-family:myriad-arabic,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.A-HlBa_i18nFontFamily:lang(he){font-family:myriad-hebrew,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.A-HlBa_i18nFontFamily:lang(zh){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Heiti TC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(zh-Hans){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(zh-Hant){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Microsoft JhengHei UI,Microsoft JhengHei,Heiti TC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(zh-SG),.A-HlBa_i18nFontFamily:lang(zh-CN){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(ko){font-family:adobe-clean-han-korean,source-han-korean,Malgun Gothic,Apple Gothic,sans-serif}.A-HlBa_i18nFontFamily:lang(ja){font-family:adobe-clean-han-japanese,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Osaka,YuGothic,Yu Gothic,メイリオ,Meiryo,ＭＳ Ｐゴシック,MS PGothic,sans-serif}.A-HlBa_spectrum-FocusRing-ring{--spectrum-focus-ring-border-radius:var(--spectrum-textfield-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);--spectrum-focus-ring-border-size:0px;--spectrum-focus-ring-color:var(--spectrum-high-contrast-focus-ring-color,var(--spectrum-alias-focus-ring-color,var(--spectrum-alias-focus-color)))}.A-HlBa_spectrum-FocusRing-ring:after{border-radius:calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));content:"";margin:calc(-1*var(--spectrum-focus-ring-border-size));pointer-events:none;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out,margin var(--spectrum-global-animation-duration-100,.13s)ease-out;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.A-HlBa_spectrum-FocusRing.A-HlBa_focus-ring:after{margin:calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size));box-shadow:0 0 0 var(--spectrum-focus-ring-size)var(--spectrum-focus-ring-color)}.A-HlBa_spectrum-FocusRing--quiet:after{border-radius:0}.A-HlBa_spectrum-FocusRing--quiet.A-HlBa_focus-ring:after{margin:0 0 calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size))0;box-shadow:0 var(--spectrum-focus-ring-size)0 var(--spectrum-focus-ring-color)}.A-HlBa_spectrum-FieldLabel{box-sizing:border-box;padding:var(--spectrum-fieldlabel-padding-top,var(--spectrum-global-dimension-size-50))0 var(--spectrum-fieldlabel-padding-bottom,var(--spectrum-global-dimension-size-65));font-size:var(--spectrum-fieldlabel-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-fieldlabel-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-fieldlabel-text-line-height,var(--spectrum-global-font-line-height-small));vertical-align:top;-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto;font-smoothing:subpixel-antialiased;text-align:start;cursor:default;flex:none;display:flex}.A-HlBa_spectrum-FieldLabel--positionSide{padding-top:var(--spectrum-fieldlabel-side-padding-top,var(--spectrum-global-dimension-size-100));display:inline-flex}.A-HlBa_spectrum-FieldLabel--positionSide:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){padding-right:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-FieldLabel--positionSide:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){padding-right:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-FieldLabel--positionSide:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){padding-right:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-FieldLabel--positionSide:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){padding-left:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-FieldLabel--positionSide:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){padding-left:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-FieldLabel-requiredIcon{margin-top:var(--spectrum-fieldlabel-asterisk-margin-y,var(--spectrum-global-dimension-size-50));margin-bottom:0}.A-HlBa_spectrum-FieldLabel-requiredIcon:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-right:0;margin-left:var(--spectrum-fieldlabel-asterisk-gap,var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel-requiredIcon:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-right:0;margin-left:var(--spectrum-fieldlabel-asterisk-gap,var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel-requiredIcon:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-right:0;margin-left:var(--spectrum-fieldlabel-asterisk-gap,var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel-requiredIcon:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:0;margin-right:var(--spectrum-fieldlabel-asterisk-gap,var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel-requiredIcon:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:0;margin-right:var(--spectrum-fieldlabel-asterisk-gap,var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel--alignEnd{text-align:end;justify-content:flex-end}.A-HlBa_spectrum-Field{--spectrum-field-default-width:var(--spectrum-alias-single-line-width,var(--spectrum-global-dimension-size-2400));height:max-content}.A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-contextualHelp{margin-top:var(--spectrum-global-dimension-size-25);grid-area:A-HlBa_contextualHelp}.A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-contextualHelp:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-left:var(--spectrum-global-dimension-size-50)}.A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-contextualHelp:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-left:var(--spectrum-global-dimension-size-50)}.A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-contextualHelp:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-left:var(--spectrum-global-dimension-size-50)}.A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-contextualHelp:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:var(--spectrum-global-dimension-size-50)}.A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-contextualHelp:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:var(--spectrum-global-dimension-size-50)}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop){width:var(--spectrum-field-default-width);grid-template:"A-HlBa_label A-HlBa_contextualHelp.""A-HlBa_field A-HlBa_field A-HlBa_field"1fr"A-HlBa_helpText A-HlBa_helpText A-HlBa_helpText"/auto auto minmax(0,1fr);align-content:start;display:inline-grid}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop) .A-HlBa_spectrum-Field-field{grid-area:A-HlBa_field;width:100%}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop).A-HlBa_spectrum-Field--alignEnd{grid-template-columns:1fr auto 0}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop) .A-HlBa_spectrum-FieldLabel{grid-area:A-HlBa_label}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide){align-items:flex-start;display:inline-flex}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-wrapper{width:var(--spectrum-field-default-width);flex:1;min-width:0;height:100%}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-wrapper .A-HlBa_spectrum-Field-field{width:100%}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-field{flex:1;min-width:0}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp{margin-top:var(--spectrum-global-dimension-size-65)}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-right:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-right:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){margin-right:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-FieldLabel:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){padding-right:0}.A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-FieldLabel:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){padding-right:0}.A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-FieldLabel:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){padding-right:0}.A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-FieldLabel:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){padding-left:0}.A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-FieldLabel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){padding-left:0}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide{border-collapse:separate;border-spacing:0 var(--spectrum-global-dimension-size-300);margin:calc(var(--spectrum-global-dimension-size-250)*-1)0;text-align:start;display:table}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field{width:100%;display:table-row}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field:not(.A-HlBa_spectrum-Field--hasContextualHelp) .A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-Field-labelCell{display:table-cell}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-labelCell{vertical-align:top}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--alignEnd .A-HlBa_spectrum-Field-labelCell{text-align:end}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-labelWrapper{display:inline-flex}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-labelWrapper .A-HlBa_spectrum-FieldLabel{flex:1}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field-wrapper{width:100%}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field-field{min-width:var(--spectrum-alias-single-line-width,var(--spectrum-global-dimension-size-2400));width:auto}.A-HlBa_spectrum-Form:where(.A-HlBa_spectrum-Form--positionTop){min-width:var(--spectrum-alias-single-line-width,var(--spectrum-global-dimension-size-2400));flex-direction:column;margin:0;display:flex}.A-HlBa_spectrum-Form:where(.A-HlBa_spectrum-Form--positionTop)>*{margin-top:var(--spectrum-global-dimension-size-100);width:100%}.A-HlBa_spectrum-LabeledValue.A-HlBa_spectrum-Field--positionSide{align-items:baseline}.A-HlBa_spectrum-LabeledValue.A-HlBa_spectrum-Field--positionSide .A-HlBa_spectrum-Field-contextualHelp{top:var(--spectrum-global-dimension-size-40);margin-top:var(--spectrum-global-dimension-size-65);position:relative}.A-HlBa_spectrum-LabeledValue.A-HlBa_spectrum-Field--positionTop{width:unset}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-FieldLabel.A-HlBa_spectrum-FieldLabel{padding-top:0}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-Field-wrapper.A-HlBa_spectrum-Field-wrapper{width:unset}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-Field-field{word-break:break-word;overflow:hidden}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-Field-contextualHelp{margin-top:calc(-1*var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form-itemLabel{color:var(--spectrum-fieldlabel-text-color,var(--spectrum-alias-label-text-color))}:-webkit-any(.A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form-itemLabel).A-HlBa_is-disabled{color:var(--spectrum-fieldlabel-text-color-disabled,var(--spectrum-alias-text-color-disabled))}:is(.A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form-itemLabel).A-HlBa_is-disabled{color:var(--spectrum-fieldlabel-text-color-disabled,var(--spectrum-alias-text-color-disabled))}
+.A-HlBa_i18nFontFamily{font-synthesis:weight;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.A-HlBa_i18nFontFamily:lang(ar){font-family:myriad-arabic,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.A-HlBa_i18nFontFamily:lang(he){font-family:myriad-hebrew,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Ubuntu,Trebuchet MS,Lucida Grande,sans-serif}.A-HlBa_i18nFontFamily:lang(zh){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Heiti TC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(zh-Hans){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(zh-Hant){font-family:adobe-clean-han-traditional,source-han-traditional,MingLiu,Microsoft JhengHei UI,Microsoft JhengHei,Heiti TC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(zh-SG),.A-HlBa_i18nFontFamily:lang(zh-CN){font-family:adobe-clean-han-simplified-c,source-han-simplified-c,SimSun,Heiti SC Light,sans-serif}.A-HlBa_i18nFontFamily:lang(ko){font-family:adobe-clean-han-korean,source-han-korean,Malgun Gothic,Apple Gothic,sans-serif}.A-HlBa_i18nFontFamily:lang(ja){font-family:adobe-clean-han-japanese,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Osaka,YuGothic,Yu Gothic,メイリオ,Meiryo,ＭＳ Ｐゴシック,MS PGothic,sans-serif}.A-HlBa_spectrum-FocusRing-ring{--spectrum-focus-ring-border-radius:var(--spectrum-textfield-border-radius,var(--spectrum-alias-border-radius-regular));--spectrum-focus-ring-gap:var(--spectrum-alias-input-focusring-gap);--spectrum-focus-ring-size:var(--spectrum-alias-input-focusring-size);--spectrum-focus-ring-border-size:0px;--spectrum-focus-ring-color:var(--spectrum-high-contrast-focus-ring-color,var(--spectrum-alias-focus-ring-color,var(--spectrum-alias-focus-color)))}.A-HlBa_spectrum-FocusRing-ring:after{border-radius:calc(var(--spectrum-focus-ring-border-radius) + var(--spectrum-focus-ring-gap));content:"";margin:calc(-1*var(--spectrum-focus-ring-border-size));pointer-events:none;transition:box-shadow var(--spectrum-global-animation-duration-100,.13s)ease-out,margin var(--spectrum-global-animation-duration-100,.13s)ease-out;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.A-HlBa_spectrum-FocusRing.A-HlBa_focus-ring:after{margin:calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size));box-shadow:0 0 0 var(--spectrum-focus-ring-size)var(--spectrum-focus-ring-color)}.A-HlBa_spectrum-FocusRing--quiet:after{border-radius:0}.A-HlBa_spectrum-FocusRing--quiet.A-HlBa_focus-ring:after{margin:0 0 calc(var(--spectrum-focus-ring-gap)*-1 - var(--spectrum-focus-ring-border-size))0;box-shadow:0 var(--spectrum-focus-ring-size)0 var(--spectrum-focus-ring-color)}.A-HlBa_spectrum-FieldLabel{box-sizing:border-box;padding:var(--spectrum-fieldlabel-padding-top,var(--spectrum-global-dimension-size-50))0 var(--spectrum-fieldlabel-padding-bottom,var(--spectrum-global-dimension-size-65));font-size:var(--spectrum-fieldlabel-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-fieldlabel-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-fieldlabel-text-line-height,var(--spectrum-global-font-line-height-small));vertical-align:top;-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto;font-smoothing:subpixel-antialiased;text-align:start;cursor:default;flex:none;display:flex}.A-HlBa_spectrum-FieldLabel--positionSide{padding-top:var(--spectrum-fieldlabel-side-padding-top,var(--spectrum-global-dimension-size-100));padding-inline-end:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100));display:inline-flex}.A-HlBa_spectrum-FieldLabel-requiredIcon{margin-top:var(--spectrum-fieldlabel-asterisk-margin-y,var(--spectrum-global-dimension-size-50));margin-inline-end:0;margin-bottom:0;margin-inline-start:var(--spectrum-fieldlabel-asterisk-gap,var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel--alignEnd{text-align:end;justify-content:flex-end}.A-HlBa_spectrum-Field{--spectrum-field-default-width:var(--spectrum-alias-single-line-width,var(--spectrum-global-dimension-size-2400));height:max-content}.A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-contextualHelp{margin-inline-start:var(--spectrum-global-dimension-size-50);margin-top:var(--spectrum-global-dimension-size-25);grid-area:A-HlBa_contextualHelp}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop){width:var(--spectrum-field-default-width);grid-template:"A-HlBa_label A-HlBa_contextualHelp.""A-HlBa_field A-HlBa_field A-HlBa_field"1fr"A-HlBa_helpText A-HlBa_helpText A-HlBa_helpText"/auto auto minmax(0,1fr);align-content:start;display:inline-grid}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop) .A-HlBa_spectrum-Field-field{grid-area:A-HlBa_field;width:100%}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop).A-HlBa_spectrum-Field--alignEnd{grid-template-columns:1fr auto 0}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionTop) .A-HlBa_spectrum-FieldLabel{grid-area:A-HlBa_label}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide){align-items:flex-start;display:inline-flex}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-wrapper{width:var(--spectrum-field-default-width);flex:1;min-width:0;height:100%}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-wrapper .A-HlBa_spectrum-Field-field{width:100%}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-field{flex:1;min-width:0}.A-HlBa_spectrum-Field:where(.A-HlBa_spectrum-Field--positionSide) .A-HlBa_spectrum-Field-contextualHelp{margin-top:var(--spectrum-global-dimension-size-65);margin-inline-end:var(--spectrum-fieldlabel-side-padding-x,var(--spectrum-global-dimension-size-100))}.A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-FieldLabel{padding-inline-end:0}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide{border-collapse:separate;border-spacing:0 var(--spectrum-global-dimension-size-300);margin:calc(var(--spectrum-global-dimension-size-250)*-1)0;text-align:start;display:table}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field{width:100%;display:table-row}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field:not(.A-HlBa_spectrum-Field--hasContextualHelp) .A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--hasContextualHelp .A-HlBa_spectrum-Field-labelCell{display:table-cell}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-labelCell{vertical-align:top}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field.A-HlBa_spectrum-Field--alignEnd .A-HlBa_spectrum-Field-labelCell{text-align:end}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-labelWrapper{display:inline-flex}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field .A-HlBa_spectrum-Field-labelWrapper .A-HlBa_spectrum-FieldLabel{flex:1}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field-wrapper{width:100%}.A-HlBa_spectrum-Form.A-HlBa_spectrum-Form--positionSide .A-HlBa_spectrum-Field-field{min-width:var(--spectrum-alias-single-line-width,var(--spectrum-global-dimension-size-2400));width:auto}.A-HlBa_spectrum-Form:where(.A-HlBa_spectrum-Form--positionTop){min-width:var(--spectrum-alias-single-line-width,var(--spectrum-global-dimension-size-2400));flex-direction:column;margin:0;display:flex}.A-HlBa_spectrum-Form:where(.A-HlBa_spectrum-Form--positionTop)>*{margin-top:var(--spectrum-global-dimension-size-100);width:100%}.A-HlBa_spectrum-LabeledValue.A-HlBa_spectrum-Field--positionSide{align-items:baseline}.A-HlBa_spectrum-LabeledValue.A-HlBa_spectrum-Field--positionSide .A-HlBa_spectrum-Field-contextualHelp{top:var(--spectrum-global-dimension-size-40);margin-top:var(--spectrum-global-dimension-size-65);position:relative}.A-HlBa_spectrum-LabeledValue.A-HlBa_spectrum-Field--positionTop{width:unset}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-FieldLabel.A-HlBa_spectrum-FieldLabel{padding-top:0}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-Field-wrapper.A-HlBa_spectrum-Field-wrapper{width:unset}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-Field-field{word-break:break-word;overflow:hidden}.A-HlBa_spectrum-LabeledValue .A-HlBa_spectrum-Field-contextualHelp{margin-top:calc(-1*var(--spectrum-global-dimension-size-25))}.A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form-itemLabel{color:var(--spectrum-fieldlabel-text-color,var(--spectrum-alias-label-text-color))}:-webkit-any(.A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form-itemLabel).A-HlBa_is-disabled{color:var(--spectrum-fieldlabel-text-color-disabled,var(--spectrum-alias-text-color-disabled))}:is(.A-HlBa_spectrum-FieldLabel,.A-HlBa_spectrum-Form-itemLabel).A-HlBa_is-disabled{color:var(--spectrum-fieldlabel-text-color-disabled,var(--spectrum-alias-text-color-disabled))}

package/dist/main.js

@@ -1,12 +1,15 @@
 require("./main.css");
 var $eLNG1$reactspectrumutils = require("@react-spectrum/utils");
 var $eLNG1$reactariautils = require("@react-aria/utils");
+var $eLNG1$reactstatelyform = require("@react-stately/form");
 var $eLNG1$reactspectrumprovider = require("@react-spectrum/provider");
 var $eLNG1$react = require("react");
 
+
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
+
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
@@ -38,6 +41,7 @@ $parcel$export(module.exports, "Form", () => $d981bcab8e24f2f3$export$a7fed597f4
 
 
 
+
 var $eb2fc0ee655eff6b$exports = {};
 
 $parcel$export($eb2fc0ee655eff6b$exports, "contextualHelp", () => $eb2fc0ee655eff6b$export$4ba534aba1836d, (v) => $eb2fc0ee655eff6b$export$4ba534aba1836d = v);
@@ -144,17 +148,20 @@ const $d981bcab8e24f2f3$var$formPropNames = new Set([
     "encType",
     "method",
     "target",
-    "onSubmit"
+    "onSubmit",
+    "onReset",
+    "onInvalid"
 ]);
 function $d981bcab8e24f2f3$var$Form(props, ref) {
     props = (0, $eLNG1$reactspectrumprovider.useProviderProps)(props);
-    let { children: children, labelPosition: labelPosition = "top", labelAlign: labelAlign = "start", isRequired: isRequired, necessityIndicator: necessityIndicator, isQuiet: isQuiet, isEmphasized: isEmphasized, isDisabled: isDisabled, isReadOnly: isReadOnly, validationState: validationState, ...otherProps } = props;
+    let { children: children, labelPosition: labelPosition = "top", labelAlign: labelAlign = "start", isRequired: isRequired, necessityIndicator: necessityIndicator, isQuiet: isQuiet, isEmphasized: isEmphasized, isDisabled: isDisabled, isReadOnly: isReadOnly, validationState: validationState, validationBehavior: validationBehavior, validationErrors: validationErrors, ...otherProps } = props;
     let { styleProps: styleProps } = (0, $eLNG1$reactspectrumutils.useStyleProps)(otherProps);
     let domRef = (0, $eLNG1$reactspectrumutils.useDOMRef)(ref);
     let ctx = {
         labelPosition: labelPosition,
         labelAlign: labelAlign,
-        necessityIndicator: necessityIndicator
+        necessityIndicator: necessityIndicator,
+        validationBehavior: validationBehavior
     };
     return /*#__PURE__*/ (0, ($parcel$interopDefault($eLNG1$react))).createElement("form", {
         ...(0, $eLNG1$reactariautils.filterDOMProps)(otherProps, {
@@ -162,7 +169,7 @@ function $d981bcab8e24f2f3$var$Form(props, ref) {
             propNames: $d981bcab8e24f2f3$var$formPropNames
         }),
         ...styleProps,
-        noValidate: true,
+        noValidate: validationBehavior !== "native",
         ref: domRef,
         className: (0, $eLNG1$reactspectrumutils.classNames)((0, (/*@__PURE__*/$parcel$interopDefault($eb2fc0ee655eff6b$exports))), "spectrum-Form", {
             "spectrum-Form--positionSide": labelPosition === "side",
@@ -177,7 +184,9 @@ function $d981bcab8e24f2f3$var$Form(props, ref) {
         isReadOnly: isReadOnly,
         isRequired: isRequired,
         validationState: validationState
-    }, children)));
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($eLNG1$react))).createElement((0, $eLNG1$reactstatelyform.FormValidationContext).Provider, {
+        value: validationErrors || {}
+    }, children))));
 }
 /**
  * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.

package/dist/main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC,GAED,0CAA0C;ACZ1C;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACVD,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AA5BA,0CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA0B,CAAC,YAAY,CAAC;AACxC,4CAA+B,CAAC,iBAAiB,CAAC;AAClD,4CAA6B,CAAC,eAAe,CAAC;AAC9C,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAAgC,CAAC,kBAAkB,CAAC;AACpD,4CAA0B,CAAC,YAAY,CAAC;AACxC,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA6C,CAAC,+BAA+B,CAAC;AAC9E,4CAAsD,CAAC,wCAAwC,CAAC;AAChG,4CAAiD,CAAC,mCAAmC,CAAC;AACtF,4CAAgD,CAAC,kCAAkC,CAAC;AACpF,4CAAkD,CAAC,oCAAoC,CAAC;AACxF,2CAAyC,CAAC,2BAA2B,CAAC;AACtE,4CAA6C,CAAC,+BAA+B,CAAC;AAC9E,4CAAgD,CAAC,kCAAkC,CAAC;AACpF,4CAA2C,CAAC,6BAA6B,CAAC;AAC1E,2CAAwC,CAAC,0BAA0B,CAAC;AACpE,4CAAkD,CAAC,oCAAoC,CAAC;AACxF,4CAAsD,CAAC,wCAAwC,CAAC;AAChG,4CAAqD,CAAC,uCAAuC,CAAC;AAC9F,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAAuC,CAAC,0BAA0B,EAAE,0CAA0C,CAAC;AAC/G,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAAkC,CAAC,oBAAoB,CAAC;AACxD,4CAAgD,CAAC,kCAAkC,CAAC;AACpF,4CAA+C,CAAC,iCAAiC,CAAC;AAClF,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAA0C,CAAC,4BAA4B,CAAC;;;ADRxE,IAAI,kDAAc,CAAA,GAAA,sCAAI,EAAE,cAAsC;AACvD,SAAS,0CAA+C,KAAQ;IACrE,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,KACF,OAAO;QAAC,GAAG,GAAG;QAAE,GAAG,KAAK;IAAA;IAG1B,OAAO;AACT;AAEA,MAAM,sCAAgB,IAAI,IAAI;IAC5B;IACA;IACA;IACA;IACA;IACA;CACD;AAED,SAAS,2BAAK,KAAwB,EAAE,GAA4B;IAClE,QAAQ,CAAA,GAAA,6CAAe,EAAE;IACzB,IAAI,YACF,QAAQ,iBACR,gBAAgB,mBAChB,aAAa,qBACb,UAAU,sBACV,kBAAkB,WAClB,OAAO,gBACP,YAAY,cACZ,UAAU,cACV,UAAU,mBACV,eAAe,EACf,GAAG,YACJ,GAAG;IAEJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,IAAI,MAAM;uBACR;oBACA;4BACA;IACF;IAEA,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,oCAAa,EAAE,YAAY;YAAC,WAAW;YAAM,WAAW;QAAa,EAAE;QAC1E,GAAG,UAAU;QACd,YAAA;QACA,KAAK;QACL,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,gEAAK,GACL,iBACA;YACE,+BAA+B,kBAAkB;YACjD,8BAA8B,kBAAkB;QAClD,GACA,WAAW;qBAGf,0DAAC,kCAAY;QAAS,OAAO;qBAC3B,0DAAC,CAAA,GAAA,qCAAO;QACN,SAAS;QACT,cAAc;QACd,YAAY;QACZ,YAAY;QACZ,YAAY;QACZ,iBAAiB;OAChB;AAKX;AAEA;;CAEC,GACD,MAAM,0DAAQ,CAAA,GAAA,sCAAI,EAAE,WAAW;","sources":["packages/@react-spectrum/form/src/index.ts","packages/@react-spectrum/form/src/Form.tsx","packages/@adobe/spectrum-css-temp/components/fieldlabel/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {useFormProps, Form} from './Form';\nexport type {SpectrumFormProps} from '@react-types/form';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Alignment, DOMRef, LabelPosition, SpectrumLabelableProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {Provider, useProviderProps} from '@react-spectrum/provider';\nimport React, {useContext} from 'react';\nimport {SpectrumFormProps} from '@react-types/form';\nimport styles from '@adobe/spectrum-css-temp/components/fieldlabel/vars.css';\n\nlet FormContext = React.createContext<SpectrumLabelableProps>(null);\nexport function useFormProps<T extends SpectrumLabelableProps>(props: T): T {\n  let ctx = useContext(FormContext);\n  if (ctx) {\n    return {...ctx, ...props};\n  }\n\n  return props;\n}\n\nconst formPropNames = new Set([\n  'action',\n  'autoComplete',\n  'encType',\n  'method',\n  'target',\n  'onSubmit'\n]);\n\nfunction Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {\n  props = useProviderProps(props);\n  let {\n    children,\n    labelPosition = 'top' as LabelPosition,\n    labelAlign = 'start' as Alignment,\n    isRequired,\n    necessityIndicator,\n    isQuiet,\n    isEmphasized,\n    isDisabled,\n    isReadOnly,\n    validationState,\n    ...otherProps\n  } = props;\n\n  let {styleProps} = useStyleProps(otherProps);\n  let domRef = useDOMRef(ref);\n\n  let ctx = {\n    labelPosition,\n    labelAlign,\n    necessityIndicator\n  };\n\n  return (\n    <form\n      {...filterDOMProps(otherProps, {labelable: true, propNames: formPropNames})}\n      {...styleProps}\n      noValidate\n      ref={domRef}\n      className={\n        classNames(\n          styles,\n          'spectrum-Form',\n          {\n            'spectrum-Form--positionSide': labelPosition === 'side',\n            'spectrum-Form--positionTop': labelPosition === 'top'\n          },\n          styleProps.className\n        )\n      }>\n      <FormContext.Provider value={ctx}>\n        <Provider\n          isQuiet={isQuiet}\n          isEmphasized={isEmphasized}\n          isDisabled={isDisabled}\n          isReadOnly={isReadOnly}\n          isRequired={isRequired}\n          validationState={validationState}>\n          {children}\n        </Provider>\n      </FormContext.Provider>\n    </form>\n  );\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nconst _Form = React.forwardRef(Form);\nexport {_Form as Form};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC,GAED,0CAA0C;ACZ1C;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACVD,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AA5BA,0CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA0B,CAAC,YAAY,CAAC;AACxC,4CAA+B,CAAC,iBAAiB,CAAC;AAClD,4CAA6B,CAAC,eAAe,CAAC;AAC9C,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAAgC,CAAC,kBAAkB,CAAC;AACpD,4CAA0B,CAAC,YAAY,CAAC;AACxC,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA6C,CAAC,+BAA+B,CAAC;AAC9E,4CAAsD,CAAC,wCAAwC,CAAC;AAChG,4CAAiD,CAAC,mCAAmC,CAAC;AACtF,4CAAgD,CAAC,kCAAkC,CAAC;AACpF,4CAAkD,CAAC,oCAAoC,CAAC;AACxF,2CAAyC,CAAC,2BAA2B,CAAC;AACtE,4CAA6C,CAAC,+BAA+B,CAAC;AAC9E,4CAAgD,CAAC,kCAAkC,CAAC;AACpF,4CAA2C,CAAC,6BAA6B,CAAC;AAC1E,2CAAwC,CAAC,0BAA0B,CAAC;AACpE,4CAAkD,CAAC,oCAAoC,CAAC;AACxF,4CAAsD,CAAC,wCAAwC,CAAC;AAChG,4CAAqD,CAAC,uCAAuC,CAAC;AAC9F,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAAuC,CAAC,0BAA0B,EAAE,0CAA0C,CAAC;AAC/G,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAAkC,CAAC,oBAAoB,CAAC;AACxD,4CAAgD,CAAC,kCAAkC,CAAC;AACpF,4CAA+C,CAAC,iCAAiC,CAAC;AAClF,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAA0C,CAAC,4BAA4B,CAAC;;;ADHxE,IAAI,kDAAc,CAAA,GAAA,sCAAI,EAAE,aAAa,CAA0B;AACxD,SAAS,0CAA+C,KAAQ;IACrE,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,KACF,OAAO;QAAC,GAAG,GAAG;QAAE,GAAG,KAAK;IAAA;IAG1B,OAAO;AACT;AAEA,MAAM,sCAAgB,IAAI,IAAI;IAC5B;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD;AAED,SAAS,2BAAK,KAAwB,EAAE,GAA4B;IAClE,QAAQ,CAAA,GAAA,6CAAe,EAAE;IACzB,IAAI,YACF,QAAQ,iBACR,gBAAgB,mBAChB,aAAa,qBACb,UAAU,sBACV,kBAAkB,WAClB,OAAO,gBACP,YAAY,cACZ,UAAU,cACV,UAAU,mBACV,eAAe,sBACf,kBAAkB,oBAClB,gBAAgB,EAChB,GAAG,YACJ,GAAG;IAEJ,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,IAAI,MAAM;uBACR;oBACA;4BACA;4BACA;IACF;IAEA,qBACE,0DAAC;QACE,GAAG,CAAA,GAAA,oCAAa,EAAE,YAAY;YAAC,WAAW;YAAM,WAAW;QAAa,EAAE;QAC1E,GAAG,UAAU;QACd,YAAY,uBAAuB;QACnC,KAAK;QACL,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,gEAAK,GACL,iBACA;YACE,+BAA+B,kBAAkB;YACjD,8BAA8B,kBAAkB;QAClD,GACA,WAAW,SAAS;qBAGxB,0DAAC,kCAAY,QAAQ;QAAC,OAAO;qBAC3B,0DAAC,CAAA,GAAA,qCAAO;QACN,SAAS;QACT,cAAc;QACd,YAAY;QACZ,YAAY;QACZ,YAAY;QACZ,iBAAiB;qBACjB,0DAAC,CAAA,GAAA,6CAAoB,EAAE,QAAQ;QAAC,OAAO,oBAAoB,CAAC;OACzD;AAMb;AAEA;;CAEC,GACD,MAAM,0DAAQ,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC;","sources":["packages/@react-spectrum/form/src/index.ts","packages/@react-spectrum/form/src/Form.tsx","packages/@adobe/spectrum-css-temp/components/fieldlabel/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {useFormProps, Form} from './Form';\nexport type {SpectrumFormProps} from '@react-types/form';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Alignment, DOMRef, LabelPosition, SpectrumLabelableProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FormValidationContext} from '@react-stately/form';\nimport {Provider, useProviderProps} from '@react-spectrum/provider';\nimport React, {useContext} from 'react';\nimport {SpectrumFormProps} from '@react-types/form';\nimport styles from '@adobe/spectrum-css-temp/components/fieldlabel/vars.css';\n\ninterface FormContextValue extends SpectrumLabelableProps {\n  validationBehavior?: 'aria' | 'native'\n}\n\nlet FormContext = React.createContext<FormContextValue | null>(null);\nexport function useFormProps<T extends SpectrumLabelableProps>(props: T): T {\n  let ctx = useContext(FormContext);\n  if (ctx) {\n    return {...ctx, ...props};\n  }\n\n  return props;\n}\n\nconst formPropNames = new Set([\n  'action',\n  'autoComplete',\n  'encType',\n  'method',\n  'target',\n  'onSubmit',\n  'onReset',\n  'onInvalid'\n]);\n\nfunction Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {\n  props = useProviderProps(props);\n  let {\n    children,\n    labelPosition = 'top' as LabelPosition,\n    labelAlign = 'start' as Alignment,\n    isRequired,\n    necessityIndicator,\n    isQuiet,\n    isEmphasized,\n    isDisabled,\n    isReadOnly,\n    validationState,\n    validationBehavior,\n    validationErrors,\n    ...otherProps\n  } = props;\n\n  let {styleProps} = useStyleProps(otherProps);\n  let domRef = useDOMRef(ref);\n\n  let ctx = {\n    labelPosition,\n    labelAlign,\n    necessityIndicator,\n    validationBehavior\n  };\n\n  return (\n    <form\n      {...filterDOMProps(otherProps, {labelable: true, propNames: formPropNames})}\n      {...styleProps}\n      noValidate={validationBehavior !== 'native'}\n      ref={domRef}\n      className={\n        classNames(\n          styles,\n          'spectrum-Form',\n          {\n            'spectrum-Form--positionSide': labelPosition === 'side',\n            'spectrum-Form--positionTop': labelPosition === 'top'\n          },\n          styleProps.className\n        )\n      }>\n      <FormContext.Provider value={ctx}>\n        <Provider\n          isQuiet={isQuiet}\n          isEmphasized={isEmphasized}\n          isDisabled={isDisabled}\n          isReadOnly={isReadOnly}\n          isRequired={isRequired}\n          validationState={validationState}>\n          <FormValidationContext.Provider value={validationErrors || {}}>\n            {children}\n          </FormValidationContext.Provider>\n        </Provider>\n      </FormContext.Provider>\n    </form>\n  );\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nconst _Form = React.forwardRef(Form);\nexport {_Form as Form};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"main.js.map"}

package/dist/module.js

@@ -1,12 +1,15 @@
 import "./main.css";
 import {useStyleProps as $011V3$useStyleProps, useDOMRef as $011V3$useDOMRef, classNames as $011V3$classNames} from "@react-spectrum/utils";
 import {filterDOMProps as $011V3$filterDOMProps} from "@react-aria/utils";
+import {FormValidationContext as $011V3$FormValidationContext} from "@react-stately/form";
 import {useProviderProps as $011V3$useProviderProps, Provider as $011V3$Provider} from "@react-spectrum/provider";
 import $011V3$react, {useContext as $011V3$useContext} from "react";
 
+
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
+
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
@@ -35,6 +38,7 @@ function $parcel$export(e, n, v, s) {
 
 
 
+
 var $cd231e464c886c86$exports = {};
 
 $parcel$export($cd231e464c886c86$exports, "contextualHelp", () => $cd231e464c886c86$export$4ba534aba1836d, (v) => $cd231e464c886c86$export$4ba534aba1836d = v);
@@ -141,17 +145,20 @@ const $ac118ceca79b8650$var$formPropNames = new Set([
     "encType",
     "method",
     "target",
-    "onSubmit"
+    "onSubmit",
+    "onReset",
+    "onInvalid"
 ]);
 function $ac118ceca79b8650$var$Form(props, ref) {
     props = (0, $011V3$useProviderProps)(props);
-    let { children: children, labelPosition: labelPosition = "top", labelAlign: labelAlign = "start", isRequired: isRequired, necessityIndicator: necessityIndicator, isQuiet: isQuiet, isEmphasized: isEmphasized, isDisabled: isDisabled, isReadOnly: isReadOnly, validationState: validationState, ...otherProps } = props;
+    let { children: children, labelPosition: labelPosition = "top", labelAlign: labelAlign = "start", isRequired: isRequired, necessityIndicator: necessityIndicator, isQuiet: isQuiet, isEmphasized: isEmphasized, isDisabled: isDisabled, isReadOnly: isReadOnly, validationState: validationState, validationBehavior: validationBehavior, validationErrors: validationErrors, ...otherProps } = props;
     let { styleProps: styleProps } = (0, $011V3$useStyleProps)(otherProps);
     let domRef = (0, $011V3$useDOMRef)(ref);
     let ctx = {
         labelPosition: labelPosition,
         labelAlign: labelAlign,
-        necessityIndicator: necessityIndicator
+        necessityIndicator: necessityIndicator,
+        validationBehavior: validationBehavior
     };
     return /*#__PURE__*/ (0, $011V3$react).createElement("form", {
         ...(0, $011V3$filterDOMProps)(otherProps, {
@@ -159,7 +166,7 @@ function $ac118ceca79b8650$var$Form(props, ref) {
             propNames: $ac118ceca79b8650$var$formPropNames
         }),
         ...styleProps,
-        noValidate: true,
+        noValidate: validationBehavior !== "native",
         ref: domRef,
         className: (0, $011V3$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($cd231e464c886c86$exports))), "spectrum-Form", {
             "spectrum-Form--positionSide": labelPosition === "side",
@@ -174,7 +181,9 @@ function $ac118ceca79b8650$var$Form(props, ref) {
         isReadOnly: isReadOnly,
         isRequired: isRequired,
         validationState: validationState
-    }, children)));
+    }, /*#__PURE__*/ (0, $011V3$react).createElement((0, $011V3$FormValidationContext).Provider, {
+        value: validationErrors || {}
+    }, children))));
 }
 /**
  * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.

package/dist/module.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/form/src/index.ts","packages/@react-spectrum/form/src/Form.tsx","packages/@adobe/spectrum-css-temp/components/fieldlabel/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {useFormProps, Form} from './Form';\nexport type {SpectrumFormProps} from '@react-types/form';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Alignment, DOMRef, LabelPosition, SpectrumLabelableProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {Provider, useProviderProps} from '@react-spectrum/provider';\nimport React, {useContext} from 'react';\nimport {SpectrumFormProps} from '@react-types/form';\nimport styles from '@adobe/spectrum-css-temp/components/fieldlabel/vars.css';\n\nlet FormContext = React.createContext<SpectrumLabelableProps>(null);\nexport function useFormProps<T extends SpectrumLabelableProps>(props: T): T {\n  let ctx = useContext(FormContext);\n  if (ctx) {\n    return {...ctx, ...props};\n  }\n\n  return props;\n}\n\nconst formPropNames = new Set([\n  'action',\n  'autoComplete',\n  'encType',\n  'method',\n  'target',\n  'onSubmit'\n]);\n\nfunction Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {\n  props = useProviderProps(props);\n  let {\n    children,\n    labelPosition = 'top' as LabelPosition,\n    labelAlign = 'start' as Alignment,\n    isRequired,\n    necessityIndicator,\n    isQuiet,\n    isEmphasized,\n    isDisabled,\n    isReadOnly,\n    validationState,\n    ...otherProps\n  } = props;\n\n  let {styleProps} = useStyleProps(otherProps);\n  let domRef = useDOMRef(ref);\n\n  let ctx = {\n    labelPosition,\n    labelAlign,\n    necessityIndicator\n  };\n\n  return (\n    <form\n      {...filterDOMProps(otherProps, {labelable: true, propNames: formPropNames})}\n      {...styleProps}\n      noValidate\n      ref={domRef}\n      className={\n        classNames(\n          styles,\n          'spectrum-Form',\n          {\n            'spectrum-Form--positionSide': labelPosition === 'side',\n            'spectrum-Form--positionTop': labelPosition === 'top'\n          },\n          styleProps.className\n        )\n      }>\n      <FormContext.Provider value={ctx}>\n        <Provider\n          isQuiet={isQuiet}\n          isEmphasized={isEmphasized}\n          isDisabled={isDisabled}\n          isReadOnly={isReadOnly}\n          isRequired={isRequired}\n          validationState={validationState}>\n          {children}\n        </Provider>\n      </FormContext.Provider>\n    </form>\n  );\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nconst _Form = React.forwardRef(Form);\nexport {_Form as Form};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/form/src/index.ts","packages/@react-spectrum/form/src/Form.tsx","packages/@adobe/spectrum-css-temp/components/fieldlabel/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {useFormProps, Form} from './Form';\nexport type {SpectrumFormProps} from '@react-types/form';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Alignment, DOMRef, LabelPosition, SpectrumLabelableProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FormValidationContext} from '@react-stately/form';\nimport {Provider, useProviderProps} from '@react-spectrum/provider';\nimport React, {useContext} from 'react';\nimport {SpectrumFormProps} from '@react-types/form';\nimport styles from '@adobe/spectrum-css-temp/components/fieldlabel/vars.css';\n\ninterface FormContextValue extends SpectrumLabelableProps {\n  validationBehavior?: 'aria' | 'native'\n}\n\nlet FormContext = React.createContext<FormContextValue | null>(null);\nexport function useFormProps<T extends SpectrumLabelableProps>(props: T): T {\n  let ctx = useContext(FormContext);\n  if (ctx) {\n    return {...ctx, ...props};\n  }\n\n  return props;\n}\n\nconst formPropNames = new Set([\n  'action',\n  'autoComplete',\n  'encType',\n  'method',\n  'target',\n  'onSubmit',\n  'onReset',\n  'onInvalid'\n]);\n\nfunction Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {\n  props = useProviderProps(props);\n  let {\n    children,\n    labelPosition = 'top' as LabelPosition,\n    labelAlign = 'start' as Alignment,\n    isRequired,\n    necessityIndicator,\n    isQuiet,\n    isEmphasized,\n    isDisabled,\n    isReadOnly,\n    validationState,\n    validationBehavior,\n    validationErrors,\n    ...otherProps\n  } = props;\n\n  let {styleProps} = useStyleProps(otherProps);\n  let domRef = useDOMRef(ref);\n\n  let ctx = {\n    labelPosition,\n    labelAlign,\n    necessityIndicator,\n    validationBehavior\n  };\n\n  return (\n    <form\n      {...filterDOMProps(otherProps, {labelable: true, propNames: formPropNames})}\n      {...styleProps}\n      noValidate={validationBehavior !== 'native'}\n      ref={domRef}\n      className={\n        classNames(\n          styles,\n          'spectrum-Form',\n          {\n            'spectrum-Form--positionSide': labelPosition === 'side',\n            'spectrum-Form--positionTop': labelPosition === 'top'\n          },\n          styleProps.className\n        )\n      }>\n      <FormContext.Provider value={ctx}>\n        <Provider\n          isQuiet={isQuiet}\n          isEmphasized={isEmphasized}\n          isDisabled={isDisabled}\n          isReadOnly={isReadOnly}\n          isRequired={isRequired}\n          validationState={validationState}>\n          <FormValidationContext.Provider value={validationErrors || {}}>\n            {children}\n          </FormValidationContext.Provider>\n        </Provider>\n      </FormContext.Provider>\n    </form>\n  );\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nconst _Form = React.forwardRef(Form);\nexport {_Form as Form};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"module.js.map"}

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"mappings":";;;AAqBA,6BAA6B,CAAC,SAAS,sBAAsB,EAAE,KAAK,EAAE,CAAC,GAAG,CAAC,CAO1E;AAoED;;GAEG;AACH,OAAA,MAAM,0IAA8B,CAAC;ACpFrC,YAAY,EAAC,iBAAiB,EAAC,MAAM,mBAAmB,CAAC","sources":["packages/@react-spectrum/form/src/packages/@react-spectrum/form/src/Form.tsx","packages/@react-spectrum/form/src/packages/@react-spectrum/form/src/index.ts","packages/@react-spectrum/form/src/index.ts"],"sourcesContent":[null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {useFormProps, Form} from './Form';\nexport type {SpectrumFormProps} from '@react-types/form';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
+{"mappings":";;;AA0BA,6BAA6B,CAAC,SAAS,sBAAsB,EAAE,KAAK,EAAE,CAAC,GAAG,CAAC,CAO1E;AA2ED;;GAEG;AACH,OAAA,MAAM,0IAA8B,CAAC;AChGrC,YAAY,EAAC,iBAAiB,EAAC,MAAM,mBAAmB,CAAC","sources":["packages/@react-spectrum/form/src/packages/@react-spectrum/form/src/Form.tsx","packages/@react-spectrum/form/src/packages/@react-spectrum/form/src/index.ts","packages/@react-spectrum/form/src/index.ts"],"sourcesContent":[null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {useFormProps, Form} from './Form';\nexport type {SpectrumFormProps} from '@react-types/form';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-spectrum/form",
-  "version": "3.6.7",
+  "version": "3.7.0",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -36,10 +36,11 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-aria/utils": "^3.21.1",
-    "@react-spectrum/utils": "^3.11.1",
-    "@react-types/form": "^3.5.4",
-    "@react-types/shared": "^3.21.0",
+    "@react-aria/utils": "^3.22.0",
+    "@react-spectrum/utils": "^3.11.2",
+    "@react-stately/form": "^3.0.0",
+    "@react-types/form": "^3.6.0",
+    "@react-types/shared": "^3.22.0",
     "@swc/helpers": "^0.5.0"
   },
   "devDependencies": {
@@ -52,5 +53,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "3ecf62dcceea437cb12df1851636dd491bb6591c"
+  "gitHead": "9ce2f674eab2cc8912800d3162dcf00a1ce94274"
 }

package/src/Form.tsx

@@ -13,12 +13,17 @@
 import {Alignment, DOMRef, LabelPosition, SpectrumLabelableProps} from '@react-types/shared';
 import {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';
 import {filterDOMProps} from '@react-aria/utils';
+import {FormValidationContext} from '@react-stately/form';
 import {Provider, useProviderProps} from '@react-spectrum/provider';
 import React, {useContext} from 'react';
 import {SpectrumFormProps} from '@react-types/form';
 import styles from '@adobe/spectrum-css-temp/components/fieldlabel/vars.css';
 
-let FormContext = React.createContext<SpectrumLabelableProps>(null);
+interface FormContextValue extends SpectrumLabelableProps {
+  validationBehavior?: 'aria' | 'native'
+}
+
+let FormContext = React.createContext<FormContextValue | null>(null);
 export function useFormProps<T extends SpectrumLabelableProps>(props: T): T {
   let ctx = useContext(FormContext);
   if (ctx) {
@@ -34,7 +39,9 @@ const formPropNames = new Set([
   'encType',
   'method',
   'target',
-  'onSubmit'
+  'onSubmit',
+  'onReset',
+  'onInvalid'
 ]);
 
 function Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {
@@ -50,6 +57,8 @@ function Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {
     isDisabled,
     isReadOnly,
     validationState,
+    validationBehavior,
+    validationErrors,
     ...otherProps
   } = props;
 
@@ -59,14 +68,15 @@ function Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {
   let ctx = {
     labelPosition,
     labelAlign,
-    necessityIndicator
+    necessityIndicator,
+    validationBehavior
   };
 
   return (
     <form
       {...filterDOMProps(otherProps, {labelable: true, propNames: formPropNames})}
       {...styleProps}
-      noValidate
+      noValidate={validationBehavior !== 'native'}
       ref={domRef}
       className={
         classNames(
@@ -87,7 +97,9 @@ function Form(props: SpectrumFormProps, ref: DOMRef<HTMLFormElement>) {
           isReadOnly={isReadOnly}
           isRequired={isRequired}
           validationState={validationState}>
-          {children}
+          <FormValidationContext.Provider value={validationErrors || {}}>
+            {children}
+          </FormValidationContext.Provider>
         </Provider>
       </FormContext.Provider>
     </form>