graphql-form-mui 0.0.25 → 0.0.27

Sign up to get free protection for your applications and to get access to all the features.
@@ -4,10 +4,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  var material_1 = require("@mui/material");
7
+ var graphql_form_1 = require("graphql-form");
7
8
  var react_1 = __importDefault(require("react"));
8
- var FormField = function (_a) {
9
- var children = _a.children;
10
- return react_1.default.createElement(material_1.FormControl, { fullWidth: true }, children);
9
+ var FormField = function (props) {
10
+ var children = props.children;
11
+ var errors = (0, graphql_form_1.getErrorFromProps)(props);
12
+ return (react_1.default.createElement(material_1.FormControl, { fullWidth: true, error: !!errors },
13
+ children,
14
+ errors && react_1.default.createElement(material_1.FormHelperText, null, errors)));
11
15
  };
12
16
  exports.default = FormField;
13
17
  //# sourceMappingURL=FormField.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../src/components/FormField.tsx"],"names":[],"mappings":";;;;;AAAA,0CAA4C;AAE5C,gDAA0B;AAC1B,IAAM,SAAS,GAA8B,UAAC,EAAY;QAAV,QAAQ,cAAA;IAAO,OAAA,8BAAC,sBAAW,IAAC,SAAS,UAAE,QAAQ,CAAe;AAA/C,CAA+C,CAAC;AAE/G,kBAAe,SAAS,CAAC"}
1
+ {"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../src/components/FormField.tsx"],"names":[],"mappings":";;;;;AAAA,0CAA4D;AAC5D,6CAAkE;AAClE,gDAA0B;AAC1B,IAAM,SAAS,GAA8B,UAAC,KAAK;IACvC,IAAA,QAAQ,GAAK,KAAK,SAAV,CAAW;IAC3B,IAAM,MAAM,GAAG,IAAA,gCAAiB,EAAC,KAAK,CAAC,CAAC;IACxC,OAAO,CACH,8BAAC,sBAAW,IAAC,SAAS,QAAC,KAAK,EAAE,CAAC,CAAC,MAAM;QACjC,QAAQ;QACR,MAAM,IAAI,8BAAC,yBAAc,QAAE,MAAM,CAAkB,CAC1C,CACjB,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC"}
@@ -15,13 +15,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
15
15
  };
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  var material_1 = require("@mui/material");
18
- var graphql_form_1 = require("graphql-form");
19
18
  var react_1 = __importDefault(require("react"));
20
19
  exports.default = (function (props) {
21
- var errs = (0, graphql_form_1.getErrorFromProps)(props);
22
20
  return (react_1.default.createElement(material_1.TextField, { value: props.formObject.value || '', placeholder: props.f.name.replace(/([A-Z])/g, ' $1').replace(/^./, function (str) {
23
21
  return str.toUpperCase();
24
- }), error: !!errs, helperText: errs, onChange: function (e) {
22
+ }), onChange: function (e) {
25
23
  props.onChange(__assign(__assign({}, props.formObject), { value: e.target.value }));
26
24
  } }));
27
25
  });
@@ -1 +1 @@
1
- {"version":3,"file":"UniversalField.js","sourceRoot":"","sources":["../../src/components/UniversalField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,0CAA0C;AAC1C,6CAAkE;AAClE,gDAA0B;AAC1B,mBAAe,UAAC,KAAsB;IAClC,IAAM,IAAI,GAAG,IAAA,gCAAiB,EAAC,KAAK,CAAC,CAAC;IACtC,OAAO,CACH,8BAAC,oBAAS,IACN,KAAK,EAAG,KAAK,CAAC,UAAU,CAAC,KAA4B,IAAI,EAAE,EAC3D,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,UAAU,GAAG;YAC5E,OAAO,GAAG,CAAC,WAAW,EAAE,CAAC;QAC7B,CAAC,CAAC,EACF,KAAK,EAAE,CAAC,CAAC,IAAI,EACb,UAAU,EAAE,IAAI,EAChB,QAAQ,EAAE,UAAC,CAAC;YACR,KAAK,CAAC,QAAQ,uBACP,KAAK,CAAC,UAAU,KACnB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,IACvB,CAAC;QACP,CAAC,GACH,CACL,CAAC;AACN,CAAC,EAAC"}
1
+ {"version":3,"file":"UniversalField.js","sourceRoot":"","sources":["../../src/components/UniversalField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,0CAA0C;AAE1C,gDAA0B;AAC1B,mBAAe,UAAC,KAAsB;IAClC,OAAO,CACH,8BAAC,oBAAS,IACN,KAAK,EAAG,KAAK,CAAC,UAAU,CAAC,KAA4B,IAAI,EAAE,EAC3D,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,UAAU,GAAG;YAC5E,OAAO,GAAG,CAAC,WAAW,EAAE,CAAC;QAC7B,CAAC,CAAC,EACF,QAAQ,EAAE,UAAC,CAAC;YACR,KAAK,CAAC,QAAQ,uBACP,KAAK,CAAC,UAAU,KACnB,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,IACvB,CAAC;QACP,CAAC,GACH,CACL,CAAC;AACN,CAAC,EAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "graphql-form-mui",
3
- "version": "0.0.25",
3
+ "version": "0.0.27",
4
4
  "description": "Easy form creation with GraphQL Editor and React",
5
5
  "main": "lib/index.js",
6
6
  "scripts": {
@@ -1,6 +1,15 @@
1
- import { FormControl } from '@mui/material';
2
- import { PassedFormProps } from 'graphql-form';
1
+ import { FormControl, FormHelperText } from '@mui/material';
2
+ import { getErrorFromProps, PassedFormProps } from 'graphql-form';
3
3
  import React from 'react';
4
- const FormField: React.FC<PassedFormProps> = ({ children }) => <FormControl fullWidth>{children}</FormControl>;
4
+ const FormField: React.FC<PassedFormProps> = (props) => {
5
+ const { children } = props;
6
+ const errors = getErrorFromProps(props);
7
+ return (
8
+ <FormControl fullWidth error={!!errors}>
9
+ {children}
10
+ {errors && <FormHelperText>{errors}</FormHelperText>}
11
+ </FormControl>
12
+ );
13
+ };
5
14
 
6
15
  export default FormField;
@@ -1,16 +1,13 @@
1
1
  import { TextField } from '@mui/material';
2
- import { getErrorFromProps, PassedFormProps } from 'graphql-form';
2
+ import { PassedFormProps } from 'graphql-form';
3
3
  import React from 'react';
4
4
  export default (props: PassedFormProps) => {
5
- const errs = getErrorFromProps(props);
6
5
  return (
7
6
  <TextField
8
7
  value={(props.formObject.value as string | undefined) || ''}
9
8
  placeholder={props.f.name.replace(/([A-Z])/g, ' $1').replace(/^./, function (str) {
10
9
  return str.toUpperCase();
11
10
  })}
12
- error={!!errs}
13
- helperText={errs}
14
11
  onChange={(e) => {
15
12
  props.onChange({
16
13
  ...props.formObject,