{"_id":"@availity/formik-date","_rev":"28-dcf1f2ec7796a942d39eee2f5e5ab18b","name":"@availity/formik-date","dist-tags":{"latest":"0.1.1-alpha.548","canary":"0.1.1-alpha.571"},"versions":{"0.1.1-alpha.548":{"name":"@availity/formik-date","version":"0.1.1-alpha.548","keywords":["availity","reactstrap","validation","date"],"author":{"name":"Tyson Warner","email":"tyson.warner@availity.com"},"license":"MIT","_id":"@availity/formik-date@0.1.1-alpha.548","maintainers":[{"name":"hnicbaker","email":"heather@heatherdev.net"},{"name":"gregmartdotin","email":"gregmartdotin@gmail.com"},{"name":"adenflorian","email":"AdenFlorian@gmail.com"},{"name":"sepiac","email":"danerussell4@gmail.com"},{"name":"gopro16","email":"kgray1497@gmail.com"},{"name":"twarner","email":"tyrules3@yahoo.com"},{"name":"sharpie","email":"dumbdrum@gmail.com"},{"name":"robmcguinness","email":"robert.mcguinness.iii@gmail.com"},{"name":"dnoler","email":"d.noler@gmail.com"},{"name":"jselden","email":"jselden1@gmail.com"},{"name":"cbaker1","email":"Christie.Baker@availity.com"}],"homepage":"https://github.com/Availity/availity-react/tree/master/packages/formik-date#readme","bugs":{"url":"https://github.com/Availity/availity-react/issues"},"dist":{"shasum":"7e2385a034d8ed9be6cddb692e530cc1c1d5e757","tarball":"https://registry.npmjs.org/@availity/formik-date/-/formik-date-0.1.1-alpha.548.tgz","fileCount":9,"integrity":"sha512-aLL5g7Bb7FAKu5nfnEkoqHgNU1YilE4EpdNvpeAR2dj1flvWF6i1mL+W9aH/l5c94+EDhmS32u8F+dFcmxJG4Q==","signatures":[{"sig":"MEUCIQDQLVaD91bW0Z5aO4iZzbfCeG6hMN/gMxosWqgqEX3bnAIgNQ8elKRIXabqP09IJHufkzc5brQiQbVdsZsgAau0ugc=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":7905,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdH3eMCRA9TVsSAnZWagAA+JYP/3aVi1wk5d7IRfGJDKTt\njuwJkwSfS756AwaUYiY3OBCBjtunmIp+LqIoP49DAPTRlsmcI2xd6x41fUio\nCaxv3+m7SASs4cjPi/SgJ4lmDi/e5Sz1rH+IqMqmCnLRT0ANkQAlOR/lnFhI\ntHkGjb03+cJ6gSNM8akDPOQeABTdqfE7t22aLS+wpiGpkzIscWEx9kyAeIbf\nx19nHXF3UJsVm8FisK6WeVKcmDCHyil+9WXYJ3NDWCkfynyjaYl4TmdCRuQl\nKNF2Vg/KmIgfzPlqj5Vb/7U+tnFw6jXAHxBIw1KJcgT7ovN7NY9OGSIxp3QQ\nG5qBRECxY/HC2LNDk5mSiTQGfx46ZIh9LT8kiIjyTfP56NGkHkagVVD+lp1L\nManLt3T/N8BNsMuGMAzxTW65aaWFDDam2+sEZM1DnYohR3IL5mB6bfrzb/bo\nerA6txQ3JSo1qouC9HB1IwOlidwsjm6V9JhRP4v5i+gGbRdOUaU+4T8aaATK\nOPzBN7GEqKyOEWf8FdNwSRZzjKWA4iazVAxfJm2mXWDF9dIreavY5mG0uzqj\n0LoAex4iU/i+s8z2ptAetOe8j0r6A9xqG/h02eYyx9PGfP1ad+8J0y9Omr+9\nAN7cS4T7iBXabXbdfOHXMddOVZdpZCkqKO/dOxzEyCxR8DQMEZKRpgwN2ske\nr/TX\r\n=H8DB\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","gitHead":"6a99e9d36b1ebb8a393b25bb517b408d0329d13d","_npmUser":{"name":"gopro16","email":"kgray1497@gmail.com"},"repository":{"url":"git+https://github.com/Availity/availity-react.git","type":"git"},"_npmVersion":"lerna/3.15.0/node@v10.15.0+x64 (darwin)","description":"Wrapper for react-dates to work with formik","directories":{},"_nodeVersion":"10.15.0","dependencies":{"moment":"^2.24.0","classnames":"^2.2.6","prop-types":"^15.7.2","react-dates":"^20.2.5","@availity/icon":"^0.4.2","@availity/hooks":"^1.3.3"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^16.8.3","formik":"^2.0.1-rc.5","react-dom":"^16.8.3","reactstrap":"^8.0.0","@availity/form":"^0.1.1-alpha.548+6a99e9d"},"peerDependencies":{"react":"^16.3.0","formik":"^2.0.1-rc.5","reactstrap":"^8.0.0 || ^7.0.0 || ^6.0.0","@availity/form":"^0.1.0"},"_npmOperationalInternal":{"tmp":"tmp/formik-date_0.1.1-alpha.548_1562343308251_0.9384045623158295","host":"s3://npm-registry-packages"}},"0.1.1-alpha.571":{"name":"@availity/formik-date","version":"0.1.1-alpha.571","keywords":["availity","reactstrap","validation","date"],"author":{"name":"Tyson Warner","email":"tyson.warner@availity.com"},"license":"MIT","_id":"@availity/formik-date@0.1.1-alpha.571","maintainers":[{"name":"adenflorian","email":"AdenFlorian@gmail.com"},{"name":"cbaker1","email":"Christie.Baker@availity.com"},{"name":"dnoler","email":"d.noler@gmail.com"},{"name":"gopro16","email":"kgray1497@gmail.com"},{"name":"gregmartdotin","email":"gregmartdotin@gmail.com"},{"name":"hnicbaker","email":"heather@heatherdev.net"},{"name":"jselden","email":"jselden1@gmail.com"},{"name":"robmcguinness","email":"robert.mcguinness.iii@gmail.com"},{"name":"sepiac","email":"danerussell4@gmail.com"},{"name":"sharpie","email":"dumbdrum@gmail.com"},{"name":"twarner","email":"tyrules3@yahoo.com"}],"homepage":"https://github.com/Availity/availity-react/tree/master/packages/formik-date#readme","bugs":{"url":"https://github.com/Availity/availity-react/issues"},"dist":{"shasum":"f5ea2cc2a161e2e0a5f7d356c923877f0db114c2","tarball":"https://registry.npmjs.org/@availity/formik-date/-/formik-date-0.1.1-alpha.571.tgz","fileCount":18,"integrity":"sha512-TsoTe6UoaL+TOMnaIz11j4R7t9HR0PyNXHDO4c6+D3F3zdPwjgI5uEaWY3X9GJX6pdoetf+pvMO7JUqy0JZO5g==","signatures":[{"sig":"MEQCICXrHc7ErVgUTFnCYTWY1Yw7sx5xQw6yuPShBaeXfixyAiAfaVvLnSsOCS1bL9pbjyGJw4e6m5H8qX7wkwsU/9KivQ==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":32111,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdLjaKCRA9TVsSAnZWagAAgoQQAJukwvv3QUX+M0gH0ltM\nBMM4U55/zOVY0XiEvHRFlhnN/fpMZyKA2ZSWr1XhOnzKdTE/V31Www0JRrqP\nXmeLWqdWgzbjKENtK6XDeeHihM8NjADgw2BMAX5ngAINi2sTGjEejHTLTydt\nZLDRheiUoVEfPCyGqfjVVLY2VYtmOs7xfHBDPal2t2DCuSYfFKtKTC9MPR4h\nGh/xQPOCwgDJqPvHHa9i2IeR3evIUNmkYySqBwXZSy4sYaZGYdHwiZkrRNNt\n0xby3uNNyictvcv4Q8t+8oLOFbhkHq1Pa5C04ofpjPAlbiAMWWnHApOGN1eT\nMC2Ktfl8vTDKn+RsO9xReM+7LrufRU+uo+NyW8DRHHB2Xx9Qnk7fXxiFysVR\nM6sFTd0tHq/tldYkN/01FpYz1ITamUBnezc/HqCpPSWON7XSXSCXRWA1/5zV\nDjfaZ9Y3vzG2t1HmNmefxpjUkkkDBajfDCtE96Dek94MgFeI1+BAq/iIXTy4\n+2hEYB0HlfFXqE6tcX/mx1qYG2GvKguXhngwqU2vGhNdEepRPQ8LbC8l2Z07\ntmutvWQBHKcMQEsgJsnjx6U/xaQWwnAfyUNOMrxdH63vUUAzVvCr44HS+jq5\nu2n/4Ud8V8VuFuiPpnb1gUx1hjxPwJWZ5njuLXmbdo4yRpp387FzfgqWYeq8\nprJF\r\n=7QUu\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.js","readme":"# @availity/formik-date\n\n> Wrapper for [react-dates](https://github.com/airbnb/react-dates) to work with [formik](https://github.com/jaredpalmer/formik)\n\n## Installation\n\n```bash\nnpm install @availity/formik-date @availity/form formik react reactstrap --save\n```\n\n## Validation\n\nSee [yup](https://github.com/jquense/yup) and [@availity/yup](https://github.com/Availity/sdk-js/tree/master/packages/yup)\n\n### FormikDate (Default Export)\n\nDate picker without a `Label` or `Feedback`\n\n#### FormikDate Usage\n\n```javascript\nimport React from 'react';\nimport { Form } from '@availity/form';\nimport FormikDate from '@availity/formik-date';\nimport * as yup from 'yup';\nimport '@availity/yup';\n\n// ...\nconst schema = yup.object().shape({\n dateOfService: yup\n .required()\n .date('This field is invalid.')\n .format('MM/DD/YYYY', true),\n});\n\nreturn (\n apiResource.submit(values)}\n validationSchema={schema}\n >\n \n\n \n \n);\n```\n\n#### FormikDate Props\n\nSee [react-dates](https://github.com/airbnb/react-dates#singledatepicker) for additional props\n\n* **`name`**: String. Required. The name of the field. Will be the key of the selected date that comes through in the values of the `onSubmit` callback.\n* **`disabled`**: Boolean. Whether the `` is disabled\n* **`className`**: Additional styles to be added to the ``\n* **`min`**: limitPropType. Optional. See [limitPropType](./src/utils'). Used in conjunction with `max` to derive `isOutsideRange` prop from `react-dates`. Dates outside the allowed range will not be clickable in datepicker.\n* **`max`**: limitPropType. Optional. See [limitPropType](./src/utils'). Used in conjunction with `min` to derive `isOutsideRange` prop from `react-dates`. Dates outside the allowed range will not be clickable in datepicker.\n* **`calendarIcon`**: Node. Optional. Default: ``. Override the default icon that appears\n* **`onChange`**: Function. Optional. Function to be run when date is chosen. Selected value is passed to function in format: `{ value }` \n* **`onPickerFocusChange`**: Function. Optional. Function to be run when focus on the input changes. Value is passed to function in format `{ focused }`\n* **`innerRef`**: Function or Node. Optional. Ref passed to `` inside of ``.\n* **`format`**: String. Optional. Default: `MM/DD/YYYY`. How to format date value in `onSubmit` callback. Must be a format recognized by [moment](https://momentjs.com/docs/#/displaying/format/)\n* **`data-testid`**: String. Optional. Useful for writing unit tests with [@testing-library/react](https://github.com/testing-library/react-testing-library)\n\n### DateField\n\nThe same as `FormikDate` but with a `Label` that appears above input and a `Feedback` that appears below the input.\n\n#### DateField Usage\n\n```javascript\nimport React from 'react';\nimport { Form } from '@availity/form';\nimport { DateField } from '@availity/formik-date';\nimport * as yup from 'yup';\nimport '@availity/yup';\n\n// ...\nconst schema = yup.object().shape({\n dateOfService: yup\n .required()\n .date('This field is invalid.')\n .format('MM/DD/YYYY', true),\n});\n\nreturn (\n apiResource.submit(values)}\n validationSchema={schema}\n >\n \n\n \n \n);\n```\n\n#### DateField Props\n\nSame as `FormikDate`, except for an additional `label` prop:\n\n* **`label`**: String. Optional. The text that renders inside the `Label` above the input.\n\n### DateRange\n\nA date range, consisting of 2 fields, a start date and an end date, without a `Label` or `Feedback`\n\n#### DateRange Usage\n\n```javascript\nimport React from 'react';\nimport { Form } from '@availity/form';\nimport { DateRange } from '@availity/formik-date';\nimport * as yup from 'yup';\nimport '@availity/yup';\n\n// ...\nconst dateFormat = 'MM/DD/YYYY';\nconst minDate = moment()\n .subtract(7, 'day')\n .format(dateFormat);\nconst maxDate = moment()\n .add(7, 'day')\n .format(dateFormat);\n\nconst schema = yup.object().shape({\n dateOfService: yup\n .string()\n .typeError('This field is invalid.')\n .required('This field is required.')\n .dateRange(\n { min: minDate, max: maxDate, format: dateFormat },\n `Date must be between ${minDate} and ${maxDate}`\n ),\n});\n\nreturn (\n apiResource.submit(values)}\n validationSchema={schema}\n >\n \n\n \n \n);\n```\n\n#### DateRange Props\n\n* **`id`**: String. Required. The id of the field.\n* **`name`**: String. Required. The name of the field. Will be the key of the selected dates that come through in the values of the `onSubmit` callback.\n* **`min`**: limitPropType. Optional. See [limitPropType](./src/utils'). Used in conjunction with `max` to derive `isOutsideRange` prop from `react-dates`. Dates outside the allowed range will not be clickable in datepicker.\n* **`max`**: limitPropType. Optional. See [limitPropType](./src/utils'). Used in conjunction with `min` to derive `isOutsideRange` prop from `react-dates`. Dates outside the allowed range will not be clickable in datepicker.\n* **`className`**: Additional styles to be added to the ``\n* **`disabled`**: Boolean. Whether the `` is disabled\n* **`onChange`**: Function. Optional. Function to be run when date is chosen. Selected value is passed to function in format: `{ value }` \n* **`onPickerFocusChange`**: Function. Optional. Function to be run when focus on the input changes. Value is passed to function in format `{ focusedInput }`\n* **`calendarIcon`**: Node. Optional. Default: ``. Override the default icon that appears\n* **`innerRef`**: Function or Node. Optional. Ref passed to `` inside of ``.\n* **`format`**: String. Optional. Default: `MM/DD/YYYY`. How to format date value in `onSubmit` callback. Must be a format recognized by [moment](https://momentjs.com/docs/#/displaying/format/)\n* **`data-testid`**: String. Optional. Useful for writing unit tests with [@testing-library/react](https://github.com/testing-library/react-testing-library)\n\n### DateRangeField\n\nThe same as `DateRange` but with a `Label` that appears above the input and a `Feedback` that appears below the input.\n\n#### DateRangeField Usage\n\n```javascript\nimport React from 'react';\nimport { Form } from '@availity/form';\nimport { DateRangeField } from '@availity/formik-date';\nimport * as yup from 'yup';\nimport '@availity/yup';\n\n// ...\nconst dateFormat = 'MM/DD/YYYY';\nconst minDate = moment()\n .subtract(7, 'day')\n .format(dateFormat);\nconst maxDate = moment()\n .add(7, 'day')\n .format(dateFormat);\n\nconst schema = yup.object().shape({\n dateOfService: yup\n .string()\n .typeError('This field is invalid.')\n .required('This field is required.')\n .dateRange(\n { min: minDate, max: maxDate, format: dateFormat },\n `Date must be between ${minDate} and ${maxDate}`\n ),\n});\n\nreturn (\n apiResource.submit(values)}\n validationSchema={schema}\n >\n \n\n \n \n);\n```\n\n#### DateRangeField Props\n\nSame as `DateRange`, except for an additional `label` prop:\n\n* **`label`**: String. Optional. The text that renders inside the `Label` above the input.\n","gitHead":"67b437dee8cbaf901dd88552ab2d619cac11621a","typings":"typings/index.d.ts","_npmUser":{"name":"gopro16","email":"kgray1497@gmail.com"},"repository":{"url":"git+https://github.com/Availity/availity-react.git","type":"git"},"_npmVersion":"lerna/3.15.0/node@v10.15.0+x64 (darwin)","description":"Wrapper for react-dates to work with formik","directories":{},"_nodeVersion":"10.15.0","dependencies":{"moment":"^2.24.0","classnames":"^2.2.6","prop-types":"^15.7.2","react-dates":"^20.2.5","@availity/icon":"^0.4.2","@availity/hooks":"^1.3.3"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"react":"^16.8.3","formik":"^2.0.1-rc.5","react-dom":"^16.8.3","reactstrap":"^8.0.0","@availity/form":"^0.1.1-alpha.571+67b437d","@types/react-dates":"^17.1.5"},"peerDependencies":{"react":"^16.3.0","formik":"^2.0.1-rc.5","reactstrap":"^8.0.0 || ^7.0.0 || ^6.0.0","@availity/form":"^0.1.0"},"_npmOperationalInternal":{"tmp":"tmp/formik-date_0.1.1-alpha.571_1563309705564_0.4223160662226828","host":"s3://npm-registry-packages"}}},"time":{"created":"2019-07-05T16:15:08.046Z","modified":"2025-11-17T21:15:26.047Z","0.1.1-alpha.548":"2019-07-05T16:15:08.395Z","0.1.1-alpha.571":"2019-07-16T20:41:45.675Z"},"bugs":{"url":"https://github.com/Availity/availity-react/issues"},"author":{"name":"Tyson Warner","email":"tyson.warner@availity.com"},"license":"MIT","homepage":"https://github.com/Availity/availity-react/tree/master/packages/formik-date#readme","keywords":["availity","reactstrap","validation","date"],"repository":{"url":"git+https://github.com/Availity/availity-react.git","type":"git"},"description":"Wrapper for react-dates to work with formik","maintainers":[{"email":"d.noler@gmail.com","name":"dnoler"},{"email":"jselden1@gmail.com","name":"jselden"},{"email":"Christie.Baker@availity.com","name":"cbaker1"},{"email":"tyrules3@yahoo.com","name":"twarner"},{"email":"gregmartdotin@gmail.com","name":"gregmartdotin"},{"email":"heather@heatherdev.net","name":"hnicbaker"},{"email":"christopherhavekost@gmail.com","name":"chrishavekost"},{"email":"jordanyoung1616@gmail.com","name":"jordan-a-young"},{"email":"AVOSS@availity.com","name":"availity-cicd-bot"},{"email":"lau.rox.young@gmail.com","name":"lauroxx"}],"readme":"","readmeFilename":""}