{"library":"react-moment","title":"React Moment Component","description":"react-moment is a React component that acts as a wrapper for the widely-used `moment.js` date and time library. It enables developers to easily display formatted dates and times within React applications, leveraging Moment's extensive parsing, formatting, and manipulation capabilities. The current stable version, 1.2.2, integrates with `moment.js` versions 2.29.0 and higher. While `moment.js` itself is now considered a legacy project with its maintainers recommending modern alternatives like Luxon, date-fns, or Day.js, `react-moment` remains functional for projects still relying on the Moment.js ecosystem. It provides a declarative, component-based API for Moment's features, including relative time (\"from now\"), calendrical formatting, and custom date displays, often with built-in interval updates. The library also ships with TypeScript types, enhancing the developer experience in typed React projects.","language":"javascript","status":"maintenance","last_verified":"Sun Apr 19","install":{"commands":["npm install react-moment"],"cli":null},"imports":["import Moment from 'react-moment';","import type { MomentProps } from 'react-moment';","import Moment from 'react-moment'; Moment.startPooledTimer();"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import React from 'react';\nimport Moment from 'react-moment';\nimport type { FC } from 'react';\n\nconst App: FC = () => {\n  const dateToFormat = '1976-04-19T12:59-0500';\n  // Use a dynamic date for 'fromNow' to show updates.\n  // Example: 1 hour from now\n  const futureDate = new Date(Date.now() + 60 * 60 * 1000);\n\n  return (\n    <div>\n      <h1>React Moment Examples</h1>\n      <p>Original date: <code>{dateToFormat}</code></p>\n      <p>Standard format: <Moment date={dateToFormat} /></p>\n      <p>Custom format: <Moment date={futureDate} format=\"MMMM Do YYYY, h:mm:ss a\" /></p>\n      {/* fromNow updates automatically by default every 60s, explicitly setting interval */}\n      <p>Relative time (from now, updates every 30s): <Moment fromNow interval={30000}>{futureDate}</Moment></p>\n      <p>Calendar time (e.g., Today at 3:00 PM): <Moment calendar>{new Date()}</Moment></p>\n      <p>Just the current time: <Moment date={new Date()} format=\"HH:mm:ss\" interval={1000} /></p>\n      <p>Date passed as child: <Moment>{dateToFormat}</Moment></p>\n    </div>\n  );\n};\n\nexport default App;\n","lang":"typescript","description":"Demonstrates basic usage of the `Moment` component for various date and time displays, including custom formatting, relative time with live updates, and calendar views.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}