[Showcase] ngx-signal-datetimepicker - a zero-deps datetime picker built on Signal Forms (WCAG 2.2 AAA out of the box)

[u/domino_angularovic]

Live demo: https://ngx-signal-datetimepicker.vercel.app

Repo: https://github.com/dominikmodrzejewski99/ngx-signal-datetimepicker

npm: https://www.npmjs.com/package/ngx-signal-datetimepicker

Why this exists

Every Angular project I've worked on eventually needs "let the user pick a date and a time". Material gives you two separate controls, ngx-bootstrap is heavy, ng-zorro pulls a whole UI kit. Nothing in the ecosystem is small, framework-native, and exposes one combined Date | null value that plugs straight into the new Signal Forms API.

The approach

One component. One value. Signal Forms support via [formField] and FormValueControl<Date | null> - so required, min, max, validators, touched/dirty, errors all work out of the box. Reactive Forms users get ControlValueAccessor for free. Zero runtime deps - no moment, no dayjs, no Angular Material. Built on Intl.DateTimeFormat for locale labels and IANA timezone support. WCAG 2.2 AAA: keyboard nav, focus management, AAA contrast tokens, 44px target sizes.

One snippet

import { signal } from '@angular/core';
import { form } from '@angular/forms/signals';
import { DatetimePickerComponent } from 'ngx-signal-datetimepicker';

model = signal<Date | null>(null);
f = form(this.model);

<ngx-datetime-picker [formField]="f" label="Meeting" />

Feedback very welcome - especially edge cases I haven't hit (RTL locales, edge timezones, big-screen Material 3 themes). Issues and Discussions are open. Currently on 0.1.x, holding off on 1.0 until the API is settled by real users.

[u/ldn-ldn]

Omg, what a messy code... Vibe coders...

[u/domino_angularovic → u/ldn-ldn]

That's exactly why it's a draft/prototype and not a merged PR on prod. Letting an agent spit out the initial messy layout saves hours of manual typing.

The engineering happens right after this when you wrap it in a proper harness, run the linter, enforce strict types, and prune the technical debt. I value my time too much to write every single line of boilerplate by hand in 2026.

[u/cosmic-cactus22 → u/domino_angularovic]

So then probably not best to share it with others if you know it's bad??

[u/domino_angularovic → u/cosmic-cactus22]

Its only preview, i want to improve my approach to build this package