@shopify/polaris/dist/esm/components/Form/Form.js

Shopify’s product component library

import React$1, { useCallback } from 'react';
import { useI18n } from '../../utilities/i18n/hooks.js';
import { VisuallyHidden as VisuallyHidden$1 } from '../VisuallyHidden/VisuallyHidden.js';

function Form({
  acceptCharset,
  action,
  autoComplete,
  children,
  encType,
  implicitSubmit = true,
  method = 'post',
  name,
  noValidate,
  preventDefault = true,
  target,
  onSubmit
}) {
  var i18n = useI18n();
  var handleSubmit = useCallback(event => {
    if (!preventDefault) {
      return;
    }

    event.preventDefault();
    onSubmit(event);
  }, [onSubmit, preventDefault]);
  var autoCompleteInputs = normalizeAutoComplete(autoComplete);
  var submitMarkup = implicitSubmit ? /*#__PURE__*/React$1.createElement(VisuallyHidden$1, null, /*#__PURE__*/React$1.createElement("button", {
    type: "submit",
    "aria-hidden": "true",
    tabIndex: -1
  }, i18n.translate('Polaris.Common.submit'))) : null;
  return /*#__PURE__*/React$1.createElement("form", {
    acceptCharset: acceptCharset,
    action: action,
    autoComplete: autoCompleteInputs,
    encType: encType,
    method: method,
    name: name,
    noValidate: noValidate,
    target: target,
    onSubmit: handleSubmit
  }, children, submitMarkup);
}

function normalizeAutoComplete(autoComplete) {
  if (autoComplete == null) {
    return autoComplete;
  }

  return autoComplete ? 'on' : 'off';
}

export { Form };