Skip to content

add: Calendar and DatePicker components - #725

Open
davedbase wants to merge 6 commits into
solid2from
v2/update-calendar
Open

add: Calendar and DatePicker components#725
davedbase wants to merge 6 commits into
solid2from
v2/update-calendar

Conversation

@davedbase

@davedbase davedbase commented Aug 27, 2026

Copy link
Copy Markdown

Adds three new date/time components to @kobalte/core, built on @internationalized/date throughout (never native Date), and wires them into the public export surface (packages/core/src/index.tsx had commented-out Calendar/DatePicker exports left over from a previous attempt — those are now live).

  • DateField — a segmented date/time input (react-spectrum-derived, same lineage as every other Kobalte form component). Supports single/multi-segment editing via keyboard, non-Gregorian calendars via createCalendar, granularity control, and the standard form-control system (validationState, required, disabled, readOnly, HTML form integration via a hidden input).
  • Calendar — a date grid supporting single/multiple/range selection, full keyboard navigation, and non-Gregorian calendars. Date math, formatting, and keyboard nav are react-spectrum-derived; range selection follows corvu/calendar's click-only model instead of pointer-drag (first click sets the start, second click commits the end) — credited in the relevant file headers (MIT, Jasmin Noetzli).
  • DatePicker — a trigger button that opens a Calendar inside a Popover. corvu has no dedicated date-picker primitive; this follows its own suggested composition of Calendar directly inside Popover, built on Kobalte's own pre-existing Popover/Calendar (not a corvu code port — credited for the pattern only). No segmented text input — the trigger shows the formatted value via DatePicker.Value.

Also included: Solid 2.0 rc.0rc.3 bump

solid-js/@solidjs/web/@solidjs/signals bumped to 2.0.0-rc.3, babel-preset-solid to 2.0.0-rc.2 (kept in lockstep across the catalog, overrides, and minimumReleaseAgeExclude entries in pnpm-workspace.yaml).

Shared-primitive fixes surfaced while building this

  • button-root.tsx / popper-root.tsx: wrapped initial ref/placement signal reads in untrack() — Solid 2.0's stricter reactivity checks flagged these as untracked reads once exercised by the new components.
  • spin-button-root.tsx: moved {...others} before the named event-handler props to fix a prop-override-order bug (DateField's segment component builds on SpinButton.Root).

Docs

  • New .mdx pages for all three components (calendar.mdx, date-field.mdx, date-picker.mdx), matching the existing house style — anatomy, full prop/data-attribute tables, keyboard interaction tables, live previews.
  • Changelog entries added to 2-0-x.mdx with accurate corvu/react-spectrum attribution.

Testing

  • tsc --noEmit clean, biome check clean.
  • Full suite passing (596 tests, including new calendar.test.tsx, create-calendar-state.test.ts, date-field.test.tsx, date-picker.test.tsx).
  • Manual Storybook smoke test of all three components, including click-only range selection and the disabled-state visual treatment.

@socket-security

socket-security Bot commented Aug 27, 2026

Copy link
Copy Markdown

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff Package Supply Chain
Security
Vulnerability Quality Maintenance License
Updated@​solidjs/​web@​2.0.0-rc.0 ⏵ 2.0.0-rc.399 +310083 +197 +1100
Updatedsolid-js@​2.0.0-rc.0 ⏵ 2.0.0-rc.3100 +110095 +196 +1100
Updated@​solidjs/​signals@​2.0.0-rc.0 ⏵ 2.0.0-rc.3100 +5100100 +198 +1100

View full report

@davedbase
davedbase marked this pull request as ready for review August 27, 2026 23:16

@jer3m01 jer3m01 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Few things to change, will pull the branch to test again after these.

Comment thread apps/docs/src/routes/docs/core/(1)components/calendar.mdx Outdated
Comment thread apps/docs/src/routes/docs/core/(1)components/calendar.mdx Outdated
Comment thread apps/docs/src/routes/docs/core/(1)components/calendar.mdx Outdated
Comment thread apps/docs/src/routes/docs/core/(1)components/date-field.mdx Outdated
Comment thread apps/docs/src/routes/docs/core/(1)components/date-picker.mdx Outdated
Comment thread packages/core/kobalte-core-2.0.0-alpha.0.tgz Outdated
Comment thread packages/utils/kobalte-utils-2.0.0-alpha.0.tgz Outdated
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Backlog

Development

Successfully merging this pull request may close these issues.

2 participants