Wondering what‚Äôs next for npm?Check out our public roadmap! ¬Ľ

    ant-react-date-selector
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.2¬†‚Äʬ†Public¬†‚Äʬ†Published

    React Date Selector

    React Date Selector for relative dates with DateMath


    Install

    npm install ant-react-date-selector

    Basic Usage

    • Component
    import React, { useState } from "react";
    import { Form } from "antd";
    import { ReactDateSelector } from "ant-react-date-selector";
     
    export const Tester = () => {
      const [date, setDate] = useState<string | undefined>("$week|$now");
     
      return (
        <Form layout="inline">
          <Form.Item label="Date Selector">
            <ReactDateSelector value={date} onDateChange={setDate} allowClear />
          </Form.Item>
        </Form>
      );
    };

    Component uses basic ant.design InputProps

    Props

    • value: string
    • onDateChange: (date: string) => void
    • open: boolean
    • onVisibleChange: (open: boolean) => void

    • Util to parse date values and labels
    import { DateUtil } from "ant-react-date-selector";
     
    // Last 7 Days
    DateUtil.label("$day-7");
     
    // Last 7 Days ~ Now
    DateUtil.label("$day-7|$now");
     
    /**
     * @return [iso_date, iso_date]
     * Return string array of [start, end]
     */
    DateUtil.parse("$day-7|$now");
     
    /**
     * @return iso_date
     * Return single date string
     */
    DateUtil.parse("$day-7");

    Keywords

    none

    Install

    npm i ant-react-date-selector

    DownloadsWeekly Downloads

    1

    Version

    0.0.2

    License

    MIT

    Unpacked Size

    113 kB

    Total Files

    64

    Last publish

    Collaborators

    • avatar