feat(DateTimePicker): new component with two-step popover and presets

[IgorShevchik]

What this PR is about

A new B24DateTimePicker component — a Bitrix24-style date + time picker with a two-step popover (calendar → hour/minute grid), a side preset column, and an optional date-only mode (time forced to 00:00:00). It fills the gap between the segmented B24InputDate / B24InputTime and the more "native" Bitrix24 UX.

What was done

• Component src/runtime/components/DateTimePicker.vue composed of built-in B24Popover, B24Calendar and a read-only B24Input (default trigger). Model — CalendarDateTime / ZonedDateTime (or CalendarDate in date-only mode).
• Theme src/theme/date-time-picker.ts — minimum styling, design-system classes only.
• Localization — dateTimePicker.* added to the Messages type and filled in for all 19 locales. endOfWeek for DE/FR/IT/BR/TR was fixed to actually mean "end of week" (the machine translation produced "weekend" instead).
• Accessibility — role="group" + aria-labelledby on the hours/minutes grids, aria-pressed on each cell, unique id via useId().
• Correctness — preset resolution is memoized (factory functions now run once per render instead of twice), Number.isFinite guard on minute-step to protect against NaN.
• Tests — test/components/DateTimePicker.spec.ts + 2 snapshot files: 21 cases × (nuxt + vue) = 42 green tests, including an axe a11y check.
• Documentation — docs/content/docs/2.components/date-time-picker.md + 6 examples (Basic, DateOnly, CustomPresets, CustomTrigger, FormField, MinMaxDates). Responsive: presets drop below the calendar on mobile (flex-col-reverse sm:flex-row).
• Playgrounds (nuxt + demo, in sync) — date-time-picker.vue matrix page + registration in useNavigation.ts.
• Skill b24-ui-nuxt — updated components.md, component-selection.md and the "Date" section in forms.md.
• Registration — type exports, theme entry in theme/index.ts, key in ThemeDefaults.
• Multi-reviewer feedback addressed (docs / engineering / tests / security / CTO).

API

<B24DateTimePicker
  v-model="value"
  :minute-step="5"
  :presets="customPresets"
  date-only
  hide-presets
  locale="en"
  placeholder="Pick a date and time"
  :calendar="{ minValue, maxValue, isDateDisabled }"
/>

Key props: modelValue, defaultValue, dateOnly, minuteStep (5), locale, placeholder, presets, hidePresets, format, color, size, disabled, icon, timeIcon, popover, calendar, input.
Slots: default (trigger), presets, preset, time-header.

Manual QA checklist

• pnpm dev → /components/date-time-picker: popover opens, picking a date switches to the time step, clicking a minute closes the popover
• Toggling Date only — time step disappears, model becomes CalendarDate
• minute-step={5|10|15|30} — correct cell count; NaN/0/9999 don't break rendering (covered by tests)
• Default presets "Today" / "Tomorrow" / "End of week" / "In a week" / "End of month" set the correct date; active one is highlighted
• Custom presets (factory function) — DateTimePickerCustomPresetsExample, factory runs once per render
• Custom trigger via #default (DateTimePickerCustomTriggerExample) — open reacts; default B24Input trigger
• locale="ru" / locale="en" — value format, weekday names, preset labels all change
• Responsive: on narrow viewport presets drop below and scroll horizontally
• color, size, disabled — walk through the Matrix in the playground
• hide-presets — side column disappears
• B24FormField (DateTimePickerFormFieldExample) — name/required/label/hint work
• :calendar="{ minValue, maxValue }" (DateTimePickerMinMaxDatesExample) — bounds respected
• A11y: screen reader announces "group: hours / group: minutes" and the aria-pressed state on cells
• Manual translation review for AR/IN/TH/KZ/JA/SC/TC/VN/ID/MS/LA/PL/UA — machine-generated (tracked in i18n(DateTimePicker): native-speaker review of machine-translated presets #60)
• pnpm test — neighboring components' snapshots are not affected

What's next

Follow-up issues have been filed (from review):

• refactor(DateTimePicker): убрать as any касты вокруг @internationalized/date #56 — clean up as any casts around @internationalized/date (also affects Calendar/InputDate)
• feat(DateTimePicker): range-режим и top-level пропсы min/max/isDateDisabled #57 — range mode + top-level min/max/isDateDisabled props
• feat(DateTimePicker): сегментированный input-триггер как альтернативный режим #58 — segmented input trigger as an opt-in mode
• refactor: миграция v-model на defineModel (DateTimePicker и другие) #59 — migrate v-model to defineModel (batched across components)
• i18n(DateTimePicker): native-speaker review of machine-translated presets #60 — native-speaker review of machine-translated presets

Nothing urgent after merge — the component is self-contained and introduces no breaking changes to the public API.

---

Ready for squash-merge. Green locally: pnpm lint, pnpm typecheck, pnpm exec vitest test/components/DateTimePicker.spec.ts (42/42).

🤖 Generated with Claude Code

[IgorShevchik]

Housekeeping note, no action requested on this PR.

The follow-up issues listed in the description have been closed as not planned: #56, #57, #58, #59 (#60 was already closed back in June). They all described work inside src/runtime/components/DateTimePicker.vue, which exists only on this branch — so none of them could be opened against main, and they were sitting in the backlog looking actionable when they were not.

For the record, measured today rather than recalled:

• git merge-base --is-ancestor 31d331bf origin/main → not in main
• git rev-list --count ae14a5c3..origin/main → 129 commits behind
• mergeable_state: "dirty" — the branch already conflicts with main
• last commit carrying code: 05f1865e, 28 May 2026

Two findings that would otherwise have been lost with the issues:

• refactor(DateTimePicker): убрать as any касты вокруг @internationalized/date #56's point 2 asked whether Calendar.vue and InputDate.vue had the same as any problem. They do not. InputDate.vue has zero casts; Calendar.vue has one, at line 257, and nuxt/ui@v4 has the identical cast on the identical line. It is upstream's, and it is a component-map typing shortcut, not a DateValue narrowing issue.
• The real cast count in DateTimePicker.vue on this branch is two (lines 381 and 442), not the ~8 estimated in refactor(DateTimePicker): убрать as any касты вокруг @internationalized/date #56.

This PR stays open and the branch is untouched. If B24DateTimePicker is picked up again, the sane path is a fresh branch off current main using this one as the reference — rebasing 129 commits would also mean absorbing the test-harness changes that landed since (attached mounts, enableAutoUnmount, the console-gate register), which is more work than rewriting the component against what the library looks like now.

---

Generated by Claude Code