@danderson00/react-forms-material 0.0.16 → 0.0.20

package/dist/index.js

@@ -1,7 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -12,6 +10,7 @@ Object.defineProperty(exports, "useFormValues", {
     return _reactForms.useFormValues;
   }
 });
+exports.wrapField = void 0;
 
 var _react = require("react");
 
@@ -19,17 +18,33 @@ var _reactForms = require("@danderson00/react-forms");
 
 var _ErrorMessage = require("@danderson00/react-forms/dist/ErrorMessage");
 
-var core = _interopRequireWildcard(require("@material-ui/core"));
+var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
+
+var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
+
+var _FormControl = _interopRequireDefault(require("@material-ui/core/FormControl"));
+
+var _FormHelperText = _interopRequireDefault(require("@material-ui/core/FormHelperText"));
+
+var _Input = _interopRequireDefault(require("@material-ui/core/Input"));
+
+var _InputLabel = _interopRequireDefault(require("@material-ui/core/InputLabel"));
+
+var _MenuItem = _interopRequireDefault(require("@material-ui/core/MenuItem"));
+
+var _Radio = _interopRequireDefault(require("@material-ui/core/Radio"));
+
+var _RadioGroup = _interopRequireDefault(require("@material-ui/core/RadioGroup"));
+
+var _Select = _interopRequireDefault(require("@material-ui/core/Select"));
 
 require("./styles");
 
-var _excluded = ["className", "error", "hiddenLabel", "variant", "margin", "label", "helperText", "shrinkLabel"],
+var _excluded = ["className", "error", "hiddenLabel", "variant", "margin", "label", "helperText", "shrinkLabel", "valid"],
     _excluded2 = ["name", "values", "labels", "numeric", "required", "getFieldValue", "getFieldValues"],
     _excluded3 = ["values", "labels"];
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
@@ -55,7 +70,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 var ErrorMessage = function ErrorMessage(_ref) {
   var error = _ref.error;
-  return /*#__PURE__*/(0, _react.createElement)(core.FormHelperText, {
+  return /*#__PURE__*/(0, _react.createElement)(_FormHelperText["default"], {
     children: (0, _ErrorMessage.extractErrorMessage)(error),
     error: true
   });
@@ -66,9 +81,9 @@ var Form = (0, _reactForms.FormProvider)(_reactForms.context.Provider, {
   margin: 'dense'
 }, ErrorMessage);
 exports.Form = Form;
-var Submit = (0, _reactForms.wrapSubmit)(core.Button);
+var Submit = (0, _reactForms.wrapSubmit)(_Button["default"]);
 exports.Submit = Submit;
-var Button = core.Button;
+var Button = _Button["default"];
 exports.Button = Button;
 
 var wrapped = function wrapped(component, options, baseOptions) {
@@ -94,9 +109,10 @@ var base = function base(component) {
         label = _ref3.label,
         helperText = _ref3.helperText,
         shrinkLabel = _ref3.shrinkLabel,
+        valid = _ref3.valid,
         inputProps = _objectWithoutProperties(_ref3, _excluded);
 
-    return /*#__PURE__*/(0, _react.createElement)(core.FormControl, {
+    return /*#__PURE__*/(0, _react.createElement)(_FormControl["default"], {
       className: "react-forms-material-field".concat(options.type ? " react-forms-material-".concat(options.type) : '').concat(className ? " ".concat(className) : ''),
       error: error,
       fullWidth: inputProps.fullWidth,
@@ -104,7 +120,7 @@ var base = function base(component) {
       required: inputProps.required,
       variant: variant,
       margin: margin,
-      children: [].concat(_toConsumableArray(label ? [/*#__PURE__*/(0, _react.createElement)(core.InputLabel, _objectSpread(_objectSpread({
+      children: [].concat(_toConsumableArray(label ? [/*#__PURE__*/(0, _react.createElement)(_InputLabel["default"], _objectSpread(_objectSpread({
         key: 'label',
         htmlFor: inputProps.id,
         children: label
@@ -114,7 +130,7 @@ var base = function base(component) {
         className: 'MuiInputLabel-shrink'
       }))] : []), [/*#__PURE__*/(0, _react.createElement)(component, _objectSpread({
         key: 'input'
-      }, inputProps))], _toConsumableArray(helperText ? [/*#__PURE__*/(0, _react.createElement)(core.FormHelperText, {
+      }, inputProps))], _toConsumableArray(helperText ? [/*#__PURE__*/(0, _react.createElement)(_FormHelperText["default"], {
         key: 'helperText',
         children: helperText
       })] : []))
@@ -122,17 +138,17 @@ var base = function base(component) {
   };
 };
 
-var Input = (0, _reactForms.wrapInput)(core.Input);
+var Input = (0, _reactForms.wrapInput)(_Input["default"]);
 exports.Input = Input;
-var Text = wrapped(core.Input);
+var Text = wrapped(_Input["default"]);
 exports.Text = Text;
-var Checkbox = wrapped(core.Checkbox, {
+var Checkbox = wrapped(_Checkbox["default"], {
   type: 'checkbox'
 }, {
   alwaysShrinkLabel: true
 });
 exports.Checkbox = Checkbox;
-var RadioButton = wrapped(core.Radio, {
+var RadioButton = wrapped(_Radio["default"], {
   type: 'radio'
 }, {
   shrinkLabel: false
@@ -148,7 +164,7 @@ var Radio = (0, _reactForms.createRawConsumer)(base(function (_ref4) {
       getFieldValues = _ref4.getFieldValues,
       props = _objectWithoutProperties(_ref4, _excluded2);
 
-  return /*#__PURE__*/(0, _react.createElement)(core.RadioGroup, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/(0, _react.createElement)(_RadioGroup["default"], _objectSpread(_objectSpread({}, props), {}, {
     children: [values.map(function (value, index) {
       return /*#__PURE__*/(0, _react.createElement)(RadioButton, _objectSpread({
         name: name,
@@ -173,9 +189,9 @@ var Select = wrapped(function (_ref5) {
       labels = _ref5.labels,
       props = _objectWithoutProperties(_ref5, _excluded3);
 
-  return /*#__PURE__*/(0, _react.createElement)(core.Select, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/(0, _react.createElement)(_Select["default"], _objectSpread(_objectSpread({}, props), {}, {
     children: values.map(function (value, index) {
-      return /*#__PURE__*/(0, _react.createElement)(core.MenuItem, _objectSpread({
+      return /*#__PURE__*/(0, _react.createElement)(_MenuItem["default"], _objectSpread({
         value: value,
         key: value,
         children: labels && labels[index] || value
@@ -189,4 +205,6 @@ var Select = wrapped(function (_ref5) {
 }, {
   alwaysShrinkLabel: true
 });
-exports.Select = Select;
+exports.Select = Select;
+var wrapField = wrapped;
+exports.wrapField = wrapField;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@danderson00/react-forms-material",
-  "version": "0.0.16",
+  "version": "0.0.20",
   "description": "Beautiful, ultra simple, stateless, validated forms for use in React function components",
   "main": "dist/index.js",
   "module": "src/index.js",
@@ -10,7 +10,7 @@
     "prepare": "babel src --source-maps false --out-dir dist"
   },
   "dependencies": {
-    "@danderson00/react-forms": "0.0.16",
+    "@danderson00/react-forms": "0.0.20",
     "@material-ui/core": "^4.11.3"
   },
   "peerDependencies": {
@@ -52,7 +52,7 @@
     "ui"
   ],
   "author": "danderson00",
-  "license": "UNLICENSED",
+  "license": "MIT",
   "publishConfig": {
     "access": "public"
   },

package/src/index.js

@@ -1,13 +1,22 @@
 import { createElement } from 'react'
 import { FormProvider, context, createRawConsumer, wrapInput, wrapSubmit, useFormValues } from '@danderson00/react-forms'
 import { extractErrorMessage } from '@danderson00/react-forms/dist/ErrorMessage'
-import * as core from '@material-ui/core'
+import MuiButton from '@material-ui/core/Button'
+import MuiCheckbox from '@material-ui/core/Checkbox'
+import MuiFormControl from '@material-ui/core/FormControl'
+import MuiFormHelperText from '@material-ui/core/FormHelperText'
+import MuiInput from '@material-ui/core/Input'
+import MuiInputLabel from '@material-ui/core/InputLabel'
+import MuiMenuItem from '@material-ui/core/MenuItem'
+import MuiRadio from '@material-ui/core/Radio'
+import MuiRadioGroup from '@material-ui/core/RadioGroup'
+import MuiSelect from '@material-ui/core/Select'
 import './styles'
 
-export const ErrorMessage = ({ error }) => createElement(core.FormHelperText, { children: extractErrorMessage(error), error: true })
+export const ErrorMessage = ({ error }) => createElement(MuiFormHelperText, { children: extractErrorMessage(error), error: true })
 export const Form = FormProvider(context.Provider, { margin: 'dense' }, ErrorMessage)
-export const Submit = wrapSubmit(core.Button)
-export const Button = core.Button
+export const Submit = wrapSubmit(MuiButton)
+export const Button = MuiButton
 export { useFormValues }
 
 const wrapped = (component, options, baseOptions) => wrapInput(
@@ -16,8 +25,8 @@ const wrapped = (component, options, baseOptions) => wrapInput(
 )
 
 const base = (component, options = {}, { alwaysShrinkLabel, shrinkLabel: shrinkLabelOption = true } = {}) => (
-  ({ className, error, hiddenLabel, variant, margin, label, helperText, shrinkLabel, ...inputProps }) => (
-    createElement(core.FormControl, {
+  ({ className, error, hiddenLabel, variant, margin, label, helperText, shrinkLabel, valid, ...inputProps }) => (
+    createElement(MuiFormControl, {
       className: `react-forms-material-field${options.type ? ` react-forms-material-${options.type}` : ''}${className ? ` ${className}` : ''}`,
       error,
       fullWidth: inputProps.fullWidth,
@@ -26,7 +35,7 @@ const base = (component, options = {}, { alwaysShrinkLabel, shrinkLabel: shrinkL
       variant,
       margin,
       children: [
-        ...(label ? [createElement(core.InputLabel, {
+        ...(label ? [createElement(MuiInputLabel, {
           key: 'label',
           htmlFor: inputProps.id,
           children: label,
@@ -36,7 +45,7 @@ const base = (component, options = {}, { alwaysShrinkLabel, shrinkLabel: shrinkL
 
         createElement(component, { key: 'input', ...inputProps }),
 
-        ...(helperText ? [createElement(core.FormHelperText, {
+        ...(helperText ? [createElement(MuiFormHelperText, {
           key: 'helperText',
           children: helperText
         })] : [])
@@ -45,14 +54,14 @@ const base = (component, options = {}, { alwaysShrinkLabel, shrinkLabel: shrinkL
   )
 )
 
-export const Input = wrapInput(core.Input)
-export const Text = wrapped(core.Input)
-export const Checkbox = wrapped(core.Checkbox, { type: 'checkbox' }, { alwaysShrinkLabel: true })
-export const RadioButton = wrapped(core.Radio, { type: 'radio' }, { shrinkLabel: false })
+export const Input = wrapInput(MuiInput)
+export const Text = wrapped(MuiInput)
+export const Checkbox = wrapped(MuiCheckbox, { type: 'checkbox' }, { alwaysShrinkLabel: true })
+export const RadioButton = wrapped(MuiRadio, { type: 'radio' }, { shrinkLabel: false })
 
 export const Radio = createRawConsumer(base(
   ({ name, values, labels, numeric, required, getFieldValue, getFieldValues, ...props }) => (
-    createElement(core.RadioGroup, { ...props, children: [
+    createElement(MuiRadioGroup, { ...props, children: [
       values.map((value, index) =>
         createElement(RadioButton, {
           name,
@@ -71,9 +80,9 @@ export const Radio = createRawConsumer(base(
 ))
 
 export const Select = wrapped(({ values, labels, ...props }) =>
-  createElement(core.Select, { ...props, children:
+  createElement(MuiSelect, { ...props, children:
     values.map((value, index) =>
-      createElement(core.MenuItem, {
+      createElement(MuiMenuItem, {
         value,
         key: value,
         children: (labels && labels[index]) || value,
@@ -84,3 +93,5 @@ export const Select = wrapped(({ values, labels, ...props }) =>
   { type: 'select' },
   { alwaysShrinkLabel: true  }
 )
+
+export const wrapField = wrapped