@danderson00/react-forms-material 0.0.19 → 0.0.22

package/README.md

@@ -124,3 +124,22 @@ component.
 
 Renders a field component with a Material UI [`Checkbox` component](https://material-ui.com/api/checkbox/) as the 
 input component. 
+
+## License
+
+**The MIT License (MIT)**
+
+Copyright © 2022 Dale Anderson
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+documentation files (the “Software”), to deal in the Software without restriction, including without limitation the
+rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit
+persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the
+Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
+WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
+OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/dist/index.js

@@ -62,9 +62,9 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
@@ -98,7 +98,8 @@ var base = function base(component) {
   var _ref2 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
       alwaysShrinkLabel = _ref2.alwaysShrinkLabel,
       _ref2$shrinkLabel = _ref2.shrinkLabel,
-      shrinkLabelOption = _ref2$shrinkLabel === void 0 ? true : _ref2$shrinkLabel;
+      shrinkLabelOption = _ref2$shrinkLabel === void 0 ? true : _ref2$shrinkLabel,
+      passError = _ref2.passError;
 
   return function (_ref3) {
     var className = _ref3.className,
@@ -128,9 +129,12 @@ var base = function base(component) {
         shrink: false
       }), (alwaysShrinkLabel || shrinkLabel) && {
         className: 'MuiInputLabel-shrink'
-      }))] : []), [/*#__PURE__*/(0, _react.createElement)(component, _objectSpread({
-        key: 'input'
-      }, inputProps))], _toConsumableArray(helperText ? [/*#__PURE__*/(0, _react.createElement)(_FormHelperText["default"], {
+      }))] : []), [/*#__PURE__*/(0, _react.createElement)(component, _objectSpread(_objectSpread({
+        key: 'input',
+        variant: variant
+      }, passError && {
+        error: error
+      }), inputProps))], _toConsumableArray(helperText ? [/*#__PURE__*/(0, _react.createElement)(_FormHelperText["default"], {
         key: 'helperText',
         children: helperText
       })] : []))

package/dist/styles.js

@@ -4,4 +4,4 @@ var _injectCss = _interopRequireDefault(require("@danderson00/react-forms/dist/i
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-(0, _injectCss["default"])('react-forms-material-styles', "\n  .react-forms-material-radiogroup.MuiFormControl-root {\n    overflow: hidden;\n  }\n\n  .react-forms-material-radio.MuiFormControl-root {\n    flex-direction: row-reverse;\n    justify-content: flex-end;\n  }\n  \n  .react-forms-material-radio .MuiInputLabel-formControl {\n    position: static;\n  }\n\n  .react-forms-material-radio .MuiRadio-root {\n    transform: translate(0, 9px) scale(1);\n  }  \n  \n  .react-forms-material-checkbox .MuiCheckbox-root {\n    transform: translate(0, 9px) scale(1);\n  }\n");
+(0, _injectCss["default"])('react-forms-material-styles', "\n  .react-forms-material-radiogroup.MuiFormControl-root {\n    overflow: hidden;\n  }\n\n  .react-forms-material-radio.MuiFormControl-root {\n    flex-direction: row-reverse;\n    justify-content: flex-end;\n  }\n  \n  .react-forms-material-radio .MuiInputLabel-formControl {\n    position: static;\n  }\n\n  .react-forms-material-radio .MuiRadio-root {\n    transform: translate(0, 9px) scale(1);\n  }  \n  \n  .react-forms-material-checkbox .MuiCheckbox-root {\n    transform: translate(0, 9px) scale(1);\n  }\n  \n  /* allow forms to be embedded in dialogs - essentially replicate a few styles */\n  .MuiDialog-container form {\n    display: flex;\n  }\n  \n  .MuiDialog-container form .MuiDialogContent-root {\n    display: flex;\n    align-items: flex-start;\n    flex-direction: column;\n  }\n\n  .MuiDialog-container form .MuiDialogActions-root {\n    align-self: flex-end;\n  }\n");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@danderson00/react-forms-material",
-  "version": "0.0.19",
+  "version": "0.0.22",
   "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.18",
+    "@danderson00/react-forms": "0.0.21",
     "@material-ui/core": "^4.11.3"
   },
   "peerDependencies": {

package/src/index.js

@@ -24,7 +24,7 @@ const wrapped = (component, options, baseOptions) => wrapInput(
   { passErrorProp: true, ...options }
 )
 
-const base = (component, options = {}, { alwaysShrinkLabel, shrinkLabel: shrinkLabelOption = true } = {}) => (
+const base = (component, options = {}, { alwaysShrinkLabel, shrinkLabel: shrinkLabelOption = true, passError } = {}) => (
   ({ 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}` : ''}`,
@@ -43,7 +43,12 @@ const base = (component, options = {}, { alwaysShrinkLabel, shrinkLabel: shrinkL
           ...((alwaysShrinkLabel || shrinkLabel) && { className: 'MuiInputLabel-shrink' }),
         })] : []),
 
-        createElement(component, { key: 'input', ...inputProps }),
+        createElement(component, {
+          key: 'input',
+          variant,
+          ...(passError && { error }),
+          ...inputProps
+        }),
 
         ...(helperText ? [createElement(MuiFormHelperText, {
           key: 'helperText',

package/src/styles.js

@@ -21,6 +21,21 @@ injectCss('react-forms-material-styles', `
   .react-forms-material-checkbox .MuiCheckbox-root {
     transform: translate(0, 9px) scale(1);
   }
+  
+  /* allow forms to be embedded in dialogs - essentially replicate a few styles */
+  .MuiDialog-container form {
+    display: flex;
+  }
+  
+  .MuiDialog-container form .MuiDialogContent-root {
+    display: flex;
+    align-items: flex-start;
+    flex-direction: column;
+  }
+
+  .MuiDialog-container form .MuiDialogActions-root {
+    align-self: flex-end;
+  }
 `)