{"_id":"@alexseitsinger/form-field-error","_rev":"1-d6704cb268e8a714c43e635f0dcda992","name":"@alexseitsinger/form-field-error","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@alexseitsinger/form-field-error","version":"0.1.0","description":"A react component for form field errors.","main":"dist/main.js","homepage":"https://github.com/alexseitsinger/form-field-error#readme","author":{"name":"Alex Seitsinger","email":"alexseitsinger@gmail.com","url":"https://www.alexseitsinger.com"},"license":"BSD-2-Clause","repository":{"type":"git","url":"https://github.com/alexseitsinger/form-field-error.git"},"devDependencies":{"@babel/core":"^7.2.2","@babel/preset-env":"^7.2.0","@babel/preset-react":"^7.0.0","@babel/plugin-proposal-class-properties":"^7.2.1","babel-plugin-transform-react-remove-prop-types":"^0.4.21","babel-plugin-emotion":"^10.0.5","babel-loader":"^8.0.4","enzyme":"^3.7.0","enzyme-adapter-react-16":"^1.6.0","jest":"^23.6.0","jest-emotion":"^9.2.11","webpack":"^4.27.1","webpack-cli":"^3.1.2"},"dependencies":{"react":"^16.6.3","react-dom":"^16.6.3","prop-types":"^15.6.0","@emotion/core":"^10.0.5","@emotion/styled":"^10.0.5"},"scripts":{"build":"./node_modules/.bin/webpack --config=webpack.config.js","test":"./node_modules/.bin/jest test"},"_id":"@alexseitsinger/form-field-error@0.1.0","dist":{"shasum":"d164c3a13d03de4317e60b55f911c0d29c080b82","integrity":"sha512-U5CGgmJeMUQzO7JWufZxIxVjP9NYD1wutI8fKwJSjjADswo93I3llXFigf02ceWsoJsqUIfObIB0x3cD3GbD4g==","tarball":"https://registry.npmjs.org/@alexseitsinger/form-field-error/-/form-field-error-0.1.0.tgz","fileCount":5,"unpackedSize":41767,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcIumYCRA9TVsSAnZWagAAJ1IP/1sDJDExJJ1d86YtlUIJ\ni9X81LtFreqSBPamQfkDe6+KxfGYa1JZ86sqdn9jlR32MHZRMlQ97AdrfEB2\nRHcmDg+5WXfOdX0CZ3ONHoMZ9NJfwZGSkyd2FHWZLmUC6AiyzOGaTMEdprPO\nPUNPDw4VPI74A1LIH1LJR6o2vmYR9T4/DTHR8p+RqcQJGTz0zdeabIiY1TBk\n8td89xtdg36TM1jAQztaQHwaAwOX5bAS8kaHJB0049k2C69449D61HobbVeA\nbcaRsae8IokbC165p1wXos30jrBLOaatNVmvfK62wrLHUyjdHYubvWptfwGf\nRsXw8LGDsoHfmQyQ6HY06li6Gq05c+4IMnfps6ZJMbzTg7P0xpkLABq1I+9I\nyMKBjmFwMpk73tgbWtRAgGf3G0P7sRfHVWCxpSKpRlOqfiUnsLbMdaPg2ZNj\nAXJ2VU/jfb2tXCQXD0VcML9Ob0rJI2wbiWfwBLFfUw0Yniz7+Y6dsxIUCfiv\nZEr3ZYqAAhu2367eoEiQ5dNZt63JymHlpdxa8CeuZGxlN/NXeCjqehcIQA0J\nzZNQvHRp45Whul9xbQ118wsvfv5dbq/NXozm2AYEqpY0d1crZ7E+QWRETg0T\nW19ob7bbdQwEP84qESysZ7frpFG0CnHtgtK7jkuNvcCCbPUlImpmm3qVlEfJ\nEyBX\r\n=r8hZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD617cYmKAE25b7r+qcWwJlnp/shd2NuU6GeDK/ZIGMjgIge5nOn/Cm7C3ulJgmFAdxX5RoP/RinYsWZRzloFc259c="}]},"maintainers":[{"name":"alexseitsinger","email":"alexseitsinger@gmail.com"}],"_npmUser":{"name":"alexseitsinger","email":"alexseitsinger@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/form-field-error_0.1.0_1545791895173_0.3317800327618119"},"_hasShrinkwrap":false}},"time":{"created":"2018-12-26T02:38:14.981Z","0.1.0":"2018-12-26T02:38:15.377Z","modified":"2022-04-04T12:41:35.031Z"},"maintainers":[{"name":"alexseitsinger","email":"alexseitsinger@gmail.com"}],"description":"A react component for form field errors.","homepage":"https://github.com/alexseitsinger/form-field-error#readme","repository":{"type":"git","url":"https://github.com/alexseitsinger/form-field-error.git"},"author":{"name":"Alex Seitsinger","email":"alexseitsinger@gmail.com","url":"https://www.alexseitsinger.com"},"license":"BSD-2-Clause","readme":"# Form Field Error\n\n## Description\n\nA react component for form fields errors.\n\n## Props\n\n- isVisible - (Boolean, Required) - Determines if the component is visible.\n- position - (String, Required) - The position of the component.\n- onClick - (Function, Optional) - The function to invoke when it's clicked.\n- text - (Node, Required) - The text to display.\n- textStyle - (Object, Optional) - Extra styles to apply to the text element.\n- containerStyle - (Object, Optional) - Extra style to apply to the container element.\n- containerClassName - (String, Optional) - An alternative className to use on the container element,\n\n## Usage\n\n```javascript\nimport React from \"react\"\nimport PropTypes from \"prop-types\"\nimport FormFieldError from \"@alexseitsinger/form-field-error\"\nimport { connect } from \"react-redux\"\n\nimport { Form, FormField, Input, SubmitButton } from \"./elements\"\nimport {\n\tsetFormSubmitted,\n\tsetNameFieldEmpty,\n\tonFormCompleted\n} from \"../../actions/form\"\n\nfunction Form({ dispatch, nameFieldEmpty, formSubmitted }) {\n\treturn (\n\t\t {\n\t\t\t\tevent.stopPropagation()\n\t\t\t\tevent.preventDefault()\n\t\t\t\tconst form = event.target\n\t\t\t\tconst input = form.querySelector(\"input[name=name\")\n\t\t\t\tdispatch(setFormSubmitted(true))\n\t\t\t\tif (!input.value.length) {\n\t\t\t\t\tdispatch(setNameFieldEmpty(true))\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tdispatch(onFormCompleted(input.value))\n\t\t\t}}>\n\t\t\t\n\t\t\t\t {\n\t\t\t\t\t\tdispatch(setNameFieldEmpty(!nameFieldEmpty))\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t {\n\t\t\t\t\t\tif (event.target.value.length) {\n\t\t\t\t\t\t\tdispatch(setFormSubmitted(false))\n\t\t\t\t\t\t\tdispatch(setNameFieldEmpty(false))\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t\tonFocus={() => {\n\t\t\t\t\t\tdispatch(setFormSubmitted(false))\n\t\t\t\t\t\tdispatch(setNameFieldEmpty(false))\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\n\t\t\tSubmit\n\t\t\n\t)\n}\n\nconst mapStateToProps = (state) => {\n\treturn {\n\t\tnameFieldEmpty: state.form.nameFieldEmpty,\n\t\tformSubmitted: state.form.formSubmitted\n\t}\n}\n\nForm.propTypes = {\n\tdispatch: PropTypes.func.isRequired,\n\tnameFieldEmpty: PropTypes.bool.isRequired,\n\tformSubmitted: PropTypes.bool.isRequired\n}\n\nexport default connect(mapStateToProps)(Form)\n```\n","readmeFilename":"README.md"}