@adia-ai/web-components 0.8.40 → 0.8.42

package/components/datetime-picker/datetime-picker.a2ui.json

@@ -2,7 +2,7 @@
   "$schema": "https://json-schema.org/draft/2020-12/schema",
   "$id": "https://adiaui.dev/a2ui/v0_9/components/DatetimePicker.json",
   "title": "DatetimePicker",
-  "description": "Single-control date + time selection. Trigger button opens a popover with a `<calendar-picker-ui>` on the left + a `<time-picker-ui>` on the right; commit emits a full ISO 8601 datetime string (\"YYYY-MM-DDTHH:mm\" or with seconds). Composes the two underlying primitives — never wraps a native `<input type=\"datetime-local\">` (per ADR-0025). Form-associated under one `name`. SPEC-038.",
+  "description": "DEPRECATED (gh#1372, #1363 C3c) — folded into <calendar-picker-ui>'s widened `precision` axis. `<datetime-picker-ui>` is now a thin `UICalendarPicker` subclass (see datetime-picker.class.js) rather than an independent implementation: `precision` defaults to `\"minute\"` (not `\"date\"`) and `placeholder` defaults to `\"Select date and time\"`; every other prop/event/token is inherited unchanged from <calendar-picker-ui>. Existing markup keeps working, but new markup should reach for `<calendar-picker-ui precision=\"minute\">` (or `precision=\"second\"`) directly. See <calendar-picker-ui> for the full contract.",
   "type": "object",
   "allOf": [
     {
@@ -72,7 +72,7 @@
       "default": false
     },
     "placeholder": {
-      "description": "Text shown in the trigger when the value is empty.",
+      "description": "Text shown in the trigger when the value is empty. Defaults to \"Select date and time\" HERE (vs. \"Select date...\" on the base `<calendar-picker-ui>`).",
       "type": "string",
       "default": "Select date and time"
     },
@@ -92,9 +92,10 @@
       "default": "bottom"
     },
     "precision": {
-      "description": "Time-pane precision. `minute` (default) emits `HH:mm`; `second` exposes the seconds segment and emits `HH:mm:ss`.",
+      "description": "Time-pane precision. `minute` (default HERE — `date` on the base `<calendar-picker-ui>`) emits `HH:mm`; `second` exposes the seconds segment and emits `HH:mm:ss`; `date` drops the time pane entirely (identical to the base class's own default).",
       "type": "string",
       "enum": [
+        "date",
         "minute",
         "second"
       ],
@@ -127,34 +128,21 @@
         "wrong": "{\"component\": \"DatetimePicker\", \"value\": \"2026-05-24\"}\n"
       },
       {
-        "fix": "{\"component\": \"DatetimePicker\", \"value\": \"2026-05-24T14:30\"}\n",
-        "why": "`value` is a time-only string — no date component. Use `<TimePicker>` for\ntime-only selection or supply the date portion.\n",
-        "wrong": "{\"component\": \"DatetimePicker\", \"value\": \"14:30\"}\n"
-      },
-      {
-        "fix": "{\"component\": \"DatetimePicker\", \"name\": \"field-name\"}\n",
-        "why": "Nesting a native datetime-local input violates ADR-0025 and bypasses\nElementInternals form participation.\n",
-        "wrong": "{\"component\": \"DatetimePicker\", \"children\": [\n  {\"component\": \"Input\", \"type\": \"datetime-local\"}\n]}\n"
-      },
-      {
-        "fix": "<datetime-picker-ui name=\"appointment\"></datetime-picker-ui>\n",
-        "why": "Hand-rolled date + free-form time composition is the pattern this primitive\nreplaces. It misses the coordinated popover, the per-segment Spinbutton\na11y model, and unified form participation.\n",
-        "wrong": "<calendar-picker-ui></calendar-picker-ui>\n<input-ui type=\"text\" placeholder=\"HH:mm\"></input-ui>\n"
+        "fix": "{\"component\": \"CalendarPicker\", \"precision\": \"minute\", \"name\": \"appointment\"}\n",
+        "why": "DatetimePicker is deprecated (gh#1372) — new generation should reach\nfor CalendarPicker's widened precision axis instead.\n",
+        "wrong": "{\"component\": \"DatetimePicker\", \"name\": \"appointment\"}\n"
       }
     ],
     "category": "input",
     "composes": [
       "calendar-grid-ui",
       "time-picker-ui",
-      "button-ui",
-      "popover-ui",
       "divider-ui"
     ],
     "events": {
       "change": {
         "description": "Fired when the value commits (date picked + time edited, OR Apply clicked in explicit-commit mode).",
         "detail": {
-          "source": "string",
           "value": "string"
         }
       },
@@ -186,24 +174,9 @@
     },
     "examples": [
       {
-        "description": "Form-field-wrapped picker with min/max bounds.",
+        "description": "Form-field-wrapped picker with min/max bounds. Prefer the CalendarPicker[precision] form for NEW markup — see calendar-picker-ui's own \"datetime-picker\" example.",
         "a2ui": "[\n  {\n    \"id\": \"field\",\n    \"component\": \"Field\",\n    \"label\": \"Appointment\",\n    \"children\": [\"dt\"]\n  },\n  {\n    \"id\": \"dt\",\n    \"component\": \"DatetimePicker\",\n    \"name\": \"appointment\",\n    \"min\": \"2026-01-01T00:00\",\n    \"max\": \"2026-12-31T23:59\"\n  }\n]\n",
         "name": "canonical"
-      },
-      {
-        "description": "Log-cursor picker with second precision.",
-        "a2ui": "[\n  {\n    \"id\": \"dt\",\n    \"component\": \"DatetimePicker\",\n    \"name\": \"log-cursor\",\n    \"precision\": \"second\",\n    \"step\": 1,\n    \"value\": \"2026-05-24T14:30:45\"\n  }\n]\n",
-        "name": "second-precision"
-      },
-      {
-        "description": "Cron editor with forced 24-hour cycle.",
-        "a2ui": "[\n  {\n    \"id\": \"dt\",\n    \"component\": \"DatetimePicker\",\n    \"name\": \"cron\",\n    \"hourCycle\": \"h23\"\n  }\n]\n",
-        "name": "forced-24h"
-      },
-      {
-        "description": "Read-only datetime for inspection only.",
-        "a2ui": "[\n  {\n    \"id\": \"dt\",\n    \"component\": \"DatetimePicker\",\n    \"readonly\": true,\n    \"value\": \"2026-05-24T14:30\"\n  }\n]\n",
-        "name": "readonly"
       }
     ],
     "keywords": [
@@ -217,6 +190,7 @@
       "timestamp"
     ],
     "name": "UIDatetimePicker",
+    "parts": {},
     "related": [
       "calendar-picker",
       "time-picker",
@@ -230,7 +204,7 @@
         "description": "Optional Apply / Cancel buttons for explicit-commit flows. Spans both panes below the calendar + time area."
       },
       "trigger": {
-        "description": "Custom trigger replacement. When omitted, a default `<button-ui>` is stamped."
+        "description": "Custom trigger replacement. When omitted, a default trigger is stamped (a plain clickable span, per the base `<calendar-picker-ui>` — NOT the old standalone datetime-picker's `<button-ui>` trigger; see the Consequences note below)."
       }
     },
     "states": [
@@ -239,19 +213,9 @@
         "name": "idle"
       },
       {
-        "description": "Popover open, no calendar pick yet.",
-        "attribute": "open",
-        "name": "open-pending-date"
-      },
-      {
-        "description": "Date picked; time pane is the next focus target.",
-        "attribute": "open",
-        "name": "open-pending-time"
-      },
-      {
-        "description": "Both panes set; awaiting Apply (explicit-commit mode only).",
+        "description": "Popover open.",
         "attribute": "open",
-        "name": "open-committed"
+        "name": "open"
       },
       {
         "description": "Non-interactive; dimmed.",
@@ -264,7 +228,7 @@
         "name": "readonly"
       }
     ],
-    "status": "experimental",
+    "status": "deprecated",
     "synonyms": {
       "appointment": [
         "datetime",
@@ -285,65 +249,8 @@
       ]
     },
     "tag": "datetime-picker-ui",
-    "tokens": {
-      "--datetime-picker-bg": {
-        "description": "Host background.",
-        "default": "var(--a-bg)"
-      },
-      "--datetime-picker-divider": {
-        "description": "Pane divider color.",
-        "default": "var(--a-border-subtle)"
-      },
-      "--datetime-picker-duration": {
-        "description": "Open/close transition duration.",
-        "default": "var(--a-duration-fast)"
-      },
-      "--datetime-picker-easing": {
-        "description": "Open/close transition easing.",
-        "default": "var(--a-easing)"
-      },
-      "--datetime-picker-fg": {
-        "description": "Host text color.",
-        "default": "var(--a-fg)"
-      },
-      "--datetime-picker-popover-bg": {
-        "description": "Popover background.",
-        "default": "var(--a-bg-subtle)"
-      },
-      "--datetime-picker-popover-border": {
-        "description": "Popover border color.",
-        "default": "var(--a-border-subtle)"
-      },
-      "--datetime-picker-popover-gap": {
-        "description": "Gap between calendar pane and time pane.",
-        "default": "var(--a-space-3)"
-      },
-      "--datetime-picker-popover-padding": {
-        "description": "Popover internal padding.",
-        "default": "var(--a-space-3)"
-      },
-      "--datetime-picker-popover-radius": {
-        "description": "Popover border radius.",
-        "default": "var(--a-radius-lg)"
-      },
-      "--datetime-picker-popover-shadow": {
-        "description": "Popover box shadow.",
-        "default": "var(--a-shadow-lg)"
-      },
-      "--datetime-picker-px": {
-        "description": "Horizontal popover padding.",
-        "default": "var(--a-space-3)"
-      },
-      "--datetime-picker-py": {
-        "description": "Vertical popover padding.",
-        "default": "var(--a-space-2)"
-      },
-      "--datetime-picker-trigger-min-width": {
-        "description": "Default trigger min-width — sized so the formatted date+time fits without truncation.",
-        "default": "16em"
-      }
-    },
+    "tokens": {},
     "traits": [],
-    "version": 1
+    "version": 2
   }
 }