{"id":11753,"library":"react-moment-proptypes","title":"Moment.js Prop Types for React","description":"react-moment-proptypes provides custom React PropTypes for validating `moment` objects, `moment` duration objects, and strings that `moment` can parse into valid dates. It ensures that React components receive expected date/time formats, leveraging the `moment.js` library. The current stable version is 1.8.1. Releases appear to be driven by dependency updates and bug fixes rather than a strict schedule, with recent activity focusing on modernizing development dependencies and addressing compatibility issues. It is a utility layer bridging React's prop-type validation system with Moment.js's data structures, allowing developers to define robust type checks for time-related props without manual validation logic.","status":"active","version":"1.8.1","language":"javascript","source_language":"en","source_url":"ssh://git@github.com/CalebMorris/react-moment-proptypes","tags":["javascript","moment","react","props","proptypes"],"install":[{"cmd":"npm install react-moment-proptypes","lang":"bash","label":"npm"},{"cmd":"yarn add react-moment-proptypes","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-moment-proptypes","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Core functionality relies on the Moment.js library for date/time objects and parsing.","package":"moment","optional":false}],"imports":[{"note":"While the README shows CommonJS `require`, the package likely exports as a default. For modern ESM environments, use the default import. CommonJS `require` is also fully supported.","wrong":"const momentPropTypes = require('react-moment-proptypes');","symbol":"momentPropTypes","correct":"import momentPropTypes from 'react-moment-proptypes';"},{"note":"This is accessed as a property of the default export. It validates if a prop is an instance of a Moment.js object.","symbol":"momentObj","correct":"import momentPropTypes from 'react-moment-proptypes'; momentPropTypes.momentObj"},{"note":"Accessed as a property of the default export. It validates if a prop is a string that Moment.js can successfully parse into a date.","symbol":"momentString","correct":"import momentPropTypes from 'react-moment-proptypes'; momentPropTypes.momentString"}],"quickstart":{"code":"import React from 'react';\nimport PropTypes from 'prop-types';\nimport moment from 'moment';\nimport momentPropTypes from 'react-moment-proptypes';\n\nclass TestComponent extends React.Component {\n  render() {\n    return (\n      <div>\n        <p>Date Prop: {this.props.dateThing?.format('YYYY-MM-DD')}</p>\n        <p>UTC Date Prop: {this.props.dateThingWithPredicate?.format('YYYY-MM-DD HH:mm [UTC]')}</p>\n        <p>String Date Prop: {this.props.stringThing}</p>\n        <p>Duration Prop: {this.props.durationThing?.humanize()}</p>\n      </div>\n    );\n  }\n}\n\nTestComponent.propTypes = {\n  dateThing: momentPropTypes.momentObj,\n  dateThingWithPredicate: momentPropTypes.momentObj.withPredicate(\n    function isUTC(momentObject) {\n      return momentObject.isUTC();\n    }\n  ),\n  stringThing: momentPropTypes.momentString,\n  durationThing: momentPropTypes.momentDurationObj\n};\n\n// Example Usage\nconst App = () => (\n  <TestComponent\n    dateThing={moment()}\n    dateThingWithPredicate={moment.utc()}\n    stringThing={'12-12-2014'}\n    durationThing={moment.duration(3, 'hours')}\n  />\n);\n\nexport default App;","lang":"javascript","description":"This quickstart demonstrates how to define and use `react-moment-proptypes` within a React component. It showcases `momentObj` for Moment objects, `momentString` for date strings, and `momentDurationObj` for Moment durations, including using `withPredicate` for custom validation."},"warnings":[{"fix":"If your application relies on custom `moment.createFromInputFallback` behavior, ensure it is defined globally or within your application logic, outside of `react-moment-proptypes`.","message":"The internal implementation of `moment.createFromInputFallback` was removed in v1.6.0. This prevents conflicts with other packages but means developers must manage `createFromInputFallback` themselves if custom parsing rules are needed.","severity":"breaking","affected_versions":">=1.6.0"},{"fix":"Upgrade your Node.js environment to version 8.x or newer to ensure compatibility and receive security updates for development dependencies.","message":"Version 1.7.0 introduced a minimum Node.js version requirement of 8.x or above. This primarily affects development environments but could impact older build pipelines.","severity":"breaking","affected_versions":">=1.7.0"},{"fix":"Refer to the Moment.js documentation on warnings (http://momentjs.com/guides/#/warnings/js-date/) and ensure that strings passed to `momentString` props conform to recognized formats or handle `createFromInputFallback` appropriately.","message":"Moment.js itself issues deprecation warnings when constructing dates from unrecognized RFC2822 or ISO formats. `react-moment-proptypes` uses Moment.js, so these warnings may appear in your console if `momentString` props contain ambiguous date formats.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Always use `package-lock.json` or `yarn.lock` in your *application* projects to ensure reproducible builds, regardless of whether a library provides its own lock file.","message":"The `package-lock.json` file was intentionally removed from the package in v1.6.0. While this is a common practice for libraries to avoid locking consumer dependencies, it might lead to less reproducible `npm install` behavior in your own projects if you rely on the library's exact dependency tree.","severity":"gotcha","affected_versions":">=1.6.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Ensure that string date inputs are in a clearly defined, standard format (e.g., ISO 8601 'YYYY-MM-DDTHH:mm:ssZ'). For custom formats, consider defining a `moment.createFromInputFallback` function or explicitly specifying the format when creating moment objects.","cause":"A string passed to a `momentString` prop (or a raw Moment.js constructor call) is in an ambiguous or non-standard format, causing Moment.js to fall back to `new Date()`, which is unreliable.","error":"Deprecation warning: value provided is not in a recognized RFC2822 or ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions."},{"fix":"Verify your import statement: `import momentPropTypes from 'react-moment-proptypes';` for ESM or `const momentPropTypes = require('react-moment-proptypes');` for CommonJS. Ensure `react-moment-proptypes` is correctly installed in `node_modules`.","cause":"The `momentPropTypes` object was not correctly imported or is undefined, often due to incorrect CommonJS `require` or ESM `import` syntax, or the package itself failed to load.","error":"TypeError: Cannot read properties of undefined (reading 'momentObj')"}],"ecosystem":"npm"}