Skip to content
This repository has been archived by the owner on Sep 25, 2023. It is now read-only.
ds-datepicker / 4.2.0

ds-datepicker 4.2.0

Install from the command line:
Learn more about npm packages
$ npm install @navikt/ds-datepicker@4.2.0
Install via package.json:
"@navikt/ds-datepicker": "4.2.0"

About this version

@navikt/ds-datepicker

Simple datepicker basert på react-day-picker https://www.npmjs.com/package/react-day-picker

Denne er portet fra nav.no. Endringer i navikt/datovelger blir ikke automatisk oppdatert her.

Use

import '@navikt/ds-datepicker/lib/index.css';

import { Datepicker, isISODateString } from '@navikt/ds-datepicker';

const BasicDatepicker = () => {
    const [date, setDate] = useState('');
    return <Datepicker onChange={setDato} value={date} />;
};

const AdvancedDatePicker = () => {
    const [date, setDate] = useState<string>;

    return (
        <Datepicker
            locale={'nb'}
            id="datepicker-input"
            label="Oppgi dato"
            value={date}
            inputName="inputName"
            onChange={setDate}
            error="En feilmelding"
            disabled={false}
            inputProps={{
                name: 'dateInput',
                'aria-invalid': date !== '' && isISODateString(date) === false,
            }}
            calendarSettings={{ showWeekNumbers: true }}
            showYearSelector={true}
            limitations={{
                weekendsNotSelectable: false,
                invalidDateRanges: [
                    {
                        from: '2020-04-10',
                        to: '2020-04-11',
                    },
                ],
                minDate: '2000-04-03',
                maxDate: '2020-12-12',
            }}
        />
    );
};

Storybook

Starter storybook med enkelt eksempel som viser noe av funksjonaliteten

npm run storybook

Details


Assets

  • ds-datepicker-4.2.0.tgz

Download activity

  • Total downloads 1,316
  • Last 30 days 477
  • Last week 126
  • Today 0