<drayman-datepicker />

Datepicker powered by Angular Material library. Accepts as an input and emits on change a date in ISO 8601 format.

import dayjs from 'dayjs';

export const component: DraymanComponent = async ({ forceUpdate }) => {

    let age;
    let date;

    const onValueChange = async ({ value }) => {
        date = value;
        const dateOfBirth = dayjs(value);
        age = dayjs().diff(dateOfBirth, 'years');
        await forceUpdate();
    }

    return () => {
        return (
            <div>
                <drayman-datepicker
                    value={date}
                    label="Date of Birth"
                    onValueChange={onValueChange}
                />
                {age && `You are ${age} years old!`}
            </div>
        )
    }
}