or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

calendar.mdcomponents.mddate-creation.mdformatting.mdindex.mdlocalization.mdmanipulation.mdvalidation-comparison.md
tile.json

tessl/npm-date-io--moment

TypeScript adapter providing a unified interface for the Moment.js date library through the date-io abstraction layer.

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@date-io/moment@3.2.x

To install, run

npx @tessl/cli install tessl/npm-date-io--moment@3.2.0

index.mddocs/

@date-io/moment

@date-io/moment is a TypeScript adapter that provides a unified interface for the Moment.js date management library. It abstracts Moment.js operations through a standardized API defined by the @date-io/core interface, enabling developers to build date/time UI components that can work interchangeably with different underlying date libraries (moment, date-fns, dayjs, luxon).

Package Information

  • Package Name: @date-io/moment
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install @date-io/moment moment

Core Imports

import MomentUtils from "@date-io/moment";

For CommonJS:

const MomentUtils = require("@date-io/moment");

Basic Usage

import MomentUtils from "@date-io/moment";

// Initialize the utility with optional locale and custom formats
const utils = new MomentUtils({ locale: "en" });

// Create dates
const now = utils.date(); // Current date
const specificDate = utils.date("2023-10-30T14:30:00.000Z");
const parsedDate = utils.parse("2023-10-30", "YYYY-MM-DD");

// Format dates
const formatted = utils.format(now, "fullDate"); // "Oct 30, 2023"
const customFormat = utils.formatByString(now, "YYYY-MM-DD HH:mm");

// Date operations
const tomorrow = utils.addDays(now, 1);
const startOfMonth = utils.startOfMonth(now);
const isValid = utils.isValid(specificDate);

Architecture

@date-io/moment is built around several key components:

  • MomentUtils Class: Main utility class implementing the IUtils interface
  • Date Creation: Multiple methods for creating Moment objects from various inputs
  • Format System: Predefined format keys and custom format string support
  • Immutable Operations: All date modifications return new cloned instances
  • Locale Support: Full localization support with meridiem and format helper text
  • Type Safety: Full TypeScript integration with generic type preservation

Capabilities

Date Creation and Conversion

Core functionality for creating and converting date objects between different formats and representations.

class MomentUtils {
  constructor(options?: {
    formats?: Partial<DateIOFormats>;
    locale?: string;
    instance?: any;
  });

  date<TArg, TRes>(value?: TArg): TRes;
  parseISO(isoString: string): Moment;
  parse(value: string, format: string): Moment | null;
  toISO(value: Moment): string;
  toJsDate(value: Moment): Date;
}

Date Creation and Conversion

Date Validation and Comparison

Methods for validating dates and comparing date relationships including equality, ordering, and range checking.

interface DateValidation {
  isValid(value: any): boolean;
  isNull(date: Moment): boolean;
  isEqual(value: any, comparing: any): boolean;
  isAfter(date: Moment, value: Moment): boolean;
  isBefore(date: Moment, value: Moment): boolean;
  isWithinRange(date: Moment, range: [Moment, Moment]): boolean;
}

Date Validation and Comparison

Date Manipulation and Math

Comprehensive date arithmetic operations for adding/subtracting time units and navigating between date boundaries.

interface DateManipulation {
  addSeconds(date: Moment, count: number): Moment;
  addMinutes(date: Moment, count: number): Moment;
  addHours(date: Moment, count: number): Moment;
  addDays(date: Moment, count: number): Moment;
  addWeeks(date: Moment, count: number): Moment;
  addMonths(date: Moment, count: number): Moment;
  addYears(date: Moment, count: number): Moment;
  startOfDay(date: Moment): Moment;
  endOfDay(date: Moment): Moment;
}

Date Manipulation and Math

Date Formatting and Display

Date formatting capabilities with predefined format keys and custom format strings, supporting localized output.

interface DateFormatting {
  format(date: Moment, formatKey: keyof DateIOFormats): string;
  formatByString(date: Moment, formatString: string): string;
  formatNumber(numberToFormat: string): string;
  getFormatHelperText(format: string): string;
}

interface DateIOFormats {
  fullDate: string;
  fullDateTime: string;
  shortDate: string;
  year: string;
  month: string;
  keyboardDate: string;
  // ... and 20+ more predefined formats
}

Date Formatting and Display

Date Component Access

Getter and setter methods for accessing and modifying individual date components (year, month, day, hour, etc.).

interface DateComponents {
  getYear(date: Moment): number;
  setYear(date: Moment, year: number): Moment;
  getMonth(date: Moment): number;
  setMonth(date: Moment, count: number): Moment;
  getDate(date: Moment): number;
  setDate(date: Moment, date: number): Moment;
  getHours(date: Moment): number;
  setHours(date: Moment, count: number): Moment;
}

Date Component Access

Calendar and Range Operations

Advanced calendar operations for working with date ranges, week arrays, month arrays, and calendar views.

interface CalendarOperations {
  getWeekArray(date: Moment): Moment[][];
  getMonthArray(date: Moment): Moment[];
  getYearRange(start: Moment, end: Moment): Moment[];
  getWeekdays(): string[];
  mergeDateAndTime(date: Moment, time: Moment): Moment;
}

Calendar and Range Operations

Localization Support

Comprehensive localization functionality including locale detection, meridiem text, and format helpers.

interface Localization {
  getCurrentLocaleCode(): string;
  is12HourCycleInCurrentLocale(): boolean;
  getFormatHelperText(format: string): string;
  getMeridiemText(ampm: "am" | "pm"): string;
}

Localization Support

Types

type Unit = 
  | "years" 
  | "quarters" 
  | "months" 
  | "weeks" 
  | "days" 
  | "hours" 
  | "minutes" 
  | "seconds" 
  | "milliseconds";

type Moment = import("moment").Moment;

interface DateIOFormats<TLibFormatToken = string> {
  fullDate: TLibFormatToken;
  fullDateWithWeekday: TLibFormatToken;
  normalDate: TLibFormatToken;
  normalDateWithWeekday: TLibFormatToken;
  shortDate: TLibFormatToken;
  year: TLibFormatToken;
  month: TLibFormatToken;
  monthShort: TLibFormatToken;
  monthAndYear: TLibFormatToken;
  monthAndDate: TLibFormatToken;
  weekday: TLibFormatToken;
  weekdayShort: TLibFormatToken;
  dayOfMonth: TLibFormatToken;
  hours12h: TLibFormatToken;
  hours24h: TLibFormatToken;
  minutes: TLibFormatToken;
  seconds: TLibFormatToken;
  fullTime: TLibFormatToken;
  fullTime12h: TLibFormatToken;
  fullTime24h: TLibFormatToken;
  fullDateTime: TLibFormatToken;
  fullDateTime12h: TLibFormatToken;
  fullDateTime24h: TLibFormatToken;
  keyboardDate: TLibFormatToken;
  keyboardDateTime: TLibFormatToken;
  keyboardDateTime12h: TLibFormatToken;
  keyboardDateTime24h: TLibFormatToken;
}