@multiplatform.one/frappe-ui 7.66.0 → 7.67.0

package/src/FrappeImageView.tsx

@@ -1,10 +1,10 @@
 import { useDocTypeMeta } from "@multiplatform.one/frappe";
-import { AsyncSkeleton, Card, ImageGrid } from "@multiplatform.one/components";
+import { AsyncSkeleton, Image, ImageGrid } from "@multiplatform.one/components";
 import { ImageSquareIcon } from "@phosphor-icons/react";
 import React, { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { Spinner, formCommonColors } from "@multiplatform.one/forms";
-import { Image, Text, YStack, useTheme, type YStackProps } from "tamagui";
+import { Text, YStack, useTheme, type YStackProps } from "tamagui";
 import { isServer } from "@multiplatform.one/platform";
 import { useResolvedKnobs } from "@multiplatform.one/theme";
 import { useFrappeConfig } from "./FrappeProvider";
@@ -105,6 +105,7 @@ export function FrappeImageView<TDoc extends { name: string; doctype: string }>(
     if (ssrItems && ssrItems.length > 0 && imageField && baseURL) {
       return (
         <ImageGrid
+          variant="photos"
           items={ssrItems}
           columns={columns}
           onItemClick={onItemClick}
@@ -112,14 +113,13 @@ export function FrappeImageView<TDoc extends { name: string; doctype: string }>(
           testID={`${doctype.toLowerCase()}-list`}
           {...(stackProps as any)}
           renderItem={(doc) => (
-            <FrappeImageCard
+            <FrappePhoto
               doc={doc as Record<string, unknown>}
               doctype={doctype}
               imageField={imageField}
               titleField={titleField}
               subtitleField={subtitleField}
               baseURL={baseURL}
-              onItemClick={onItemClick as ((doc: Partial<unknown>) => void) | undefined}
               knobProps={knobProps}
             />
           )}
@@ -283,6 +283,7 @@ function FrappeImageViewClient<TDoc extends { name: string; doctype: string }>({
     <>
       <FrappeReconnectIndicator config={appConfig} />
       <ImageGrid
+        variant="photos"
         items={items}
         columns={columns}
         onItemClick={onItemClick}
@@ -290,14 +291,13 @@ function FrappeImageViewClient<TDoc extends { name: string; doctype: string }>({
         testID={`${doctype.toLowerCase()}-list`}
         {...(stackProps as any)}
         renderItem={(doc) => (
-          <FrappeImageCard
+          <FrappePhoto
             doc={doc as Record<string, unknown>}
             doctype={doctype}
             imageField={effectiveImageField}
             titleField={effectiveTitleField}
             subtitleField={subtitleField}
             baseURL={finalBaseURL}
-            onItemClick={onItemClick as ((doc: Partial<unknown>) => void) | undefined}
             knobProps={knobProps}
           />
         )}
@@ -307,18 +307,18 @@ function FrappeImageViewClient<TDoc extends { name: string; doctype: string }>({
 }
 
 /**
- * Card renderer shared between SSR and client paths so they produce
- * matching markup (avoiding hydration mismatches) and the look stays
- * defined in one place.
+ * One photo in the Photos grid (LC-264), shared between SSR and client paths so they
+ * produce matching markup: the image fills a square edge to edge with no card
+ * chrome. The title is its accessible name; it shows as a caption only when
+ * there is no picture to look at (no URL, or the image failed to load).
  */
-function FrappeImageCard({
+function FrappePhoto({
   doc,
   doctype,
   imageField,
   titleField,
   subtitleField,
   baseURL,
-  onItemClick,
   knobProps,
 }: {
   doc: Record<string, unknown>;
@@ -327,74 +327,60 @@ function FrappeImageCard({
   titleField: string;
   subtitleField?: string;
   baseURL: string;
-  onItemClick?: (doc: Partial<unknown>) => void;
   knobProps: ReturnType<typeof useResolvedKnobs>["knobProps"];
 }) {
-  const theme = useTheme();
   const imageUrl = getImageUrl(doc[imageField], baseURL);
-  const title = doc[titleField] || doc.name;
+  const title = String(doc[titleField] || doc.name);
   const subtitle = subtitleField ? doc[subtitleField] : undefined;
-  const iconSize = Number(knobProps.controlIcon?.width) || 16;
-
-  return (
-    // Catalog Card owns cardSurface (no cherry-picked radius). Inner media
-    // radius stays UNCLAMPED (R11). No status pip on the tile.
-    <Card
-      testID={`${doctype.toLowerCase()}-card-${doc.name}`}
-      cursor="pointer"
-      hoverStyle={{ scale: 1.02 }}
-      pressStyle={{ scale: 0.98 }}
-      onPress={(e) => {
-        // Bind click directly to `doc` so the correct item is used even
-        // if the ImageGrid wrapper's closure captured a stale/recycled item.
-        (e as unknown as { stopPropagation?: () => void })?.stopPropagation?.();
-        onItemClick?.(doc as Partial<unknown>);
-      }}
+  const slug = doctype.toLowerCase();
+  const caption = (
+    <YStack
+      width="100%"
+      aspectRatio={1}
+      alignItems="center"
+      justifyContent="center"
+      backgroundColor="$color3"
+      padding="$2"
+      gap="$1"
     >
+      <Text
+        testID={`${slug}-name-${doc.name}`}
+        {...knobProps.label}
+        color={knobProps.textAccentColor}
+        textAlign="center"
+        numberOfLines={2}
+      >
+        {title}
+      </Text>
+      {subtitle != null ? (
+        <Text
+          testID={`${slug}-subtitle-${doc.name}`}
+          {...knobProps.label}
+          color={formCommonColors.muted}
+          textAlign="center"
+          numberOfLines={1}
+        >
+          {String(subtitle)}
+        </Text>
+      ) : null}
+    </YStack>
+  );
+  return (
+    <YStack testID={`${slug}-card-${doc.name}`} aria-label={title} width="100%">
       {imageUrl ? (
         <Image
           src={imageUrl}
-          alt={String(title)}
+          alt={title}
           width="100%"
           aspectRatio={1}
           objectFit="cover"
-          backgroundColor="$color2"
-          {...knobProps.borderRadius}
+          borderRadius={0}
+          backgroundColor="$color3"
+          fallback={caption}
         />
       ) : (
-        <YStack
-          width="100%"
-          aspectRatio={1}
-          backgroundColor="$color2"
-          {...knobProps.borderRadius}
-          alignItems="center"
-          justifyContent="center"
-        >
-          <ImageSquareIcon size={iconSize * 2} color={theme.color11?.val ?? "currentColor"} />
-        </YStack>
+        caption
       )}
-      <Card.Footer>
-        <YStack {...knobProps.gap}>
-          <Text
-            testID={`${doctype.toLowerCase()}-name-${doc.name}`}
-            {...knobProps.heading}
-            fontWeight="400"
-            numberOfLines={1}
-          >
-            {String(title)}
-          </Text>
-          {subtitle != null ? (
-            <Text
-              testID={`${doctype.toLowerCase()}-subtitle-${doc.name}`}
-              color={formCommonColors.muted}
-              {...knobProps.label}
-              numberOfLines={1}
-            >
-              {String(subtitle)}
-            </Text>
-          ) : null}
-        </YStack>
-      </Card.Footer>
-    </Card>
+    </YStack>
   );
 }

package/src/FrappeListView.controls.spec.tsx

@@ -165,7 +165,8 @@ describe("FrappeListView controls write their state back", () => {
     renderList({}, {}, navigationAt({}, setParams));
     await waitFor(() => expect(shownCards().length).toBe(6), { timeout: 5000 });
     const chip = await screen.findByTestId("pokemon-type-fire");
-    expect(getComputedStyle(chip).height).toBe("32px");
+    expect(chip.hasAttribute("data-chip")).toBe(true);
+    expect(chip.getAttribute("role")).toBe("radio");
     fireEvent.click(chip);
     await expectCards(["charmander"]);
     expect(setParams).toHaveBeenCalledWith({ type: "fire" });
@@ -228,7 +229,7 @@ describe("FrappeListView routed page with its toolbar off", () => {
     fireEvent.click(screen.getByTestId("insights"));
     expect(navigate).toHaveBeenCalledWith("/pokemon/insights");
     expect(screen.getByText("Skip to results")).toBeTruthy();
-    fireEvent.click(await screen.findByText("Add Pokemon"));
+    fireEvent.click(await screen.findByRole("button", { name: "Add Pokemon" }));
     expect(navigate).toHaveBeenCalledWith("/pokemon/new");
   });
 });

package/src/FrappeListView.tsx

@@ -22,6 +22,7 @@ import {
   EmptyState,
   ListPageLayout,
   ListRow,
+  PageBarButton,
   PageHeader,
   SkipLink,
   Tooltip,
@@ -922,7 +923,7 @@ function FrappeListViewBody<TDoc extends { name: string; doctype: string }>({
     : [];
   const headerActions =
     headerOwnsViews || (headerOwnsTools && onAdd) || headerAccessory || actions?.length ? (
-      <XStack {...knobProps.gap} alignItems="center" flexWrap="wrap" flexShrink={1} minWidth={0}>
+      <XStack alignItems="center">
         {headerOwnsViews ? (
           <Tooltip content={t("Switch views")}>
             <XStack {...secondaryHidden}>
@@ -938,69 +939,35 @@ function FrappeListViewBody<TDoc extends { name: string; doctype: string }>({
         {actions?.map((action) => {
           const Icon = action.icon;
           const onPress = pressFor(action);
-          if (sidebarFilters) {
-            return (
-              <XStack key={action.label} {...secondaryHidden}>
-                <Tooltip content={action.hint ?? action.label}>
-                  <Button
-                    outlined
+          return (
+            <XStack key={action.label} {...secondaryHidden}>
+              <Tooltip content={action.hint ?? action.label}>
+                {Icon ? (
+                  <PageBarButton
+                    icon={Icon as never}
+                    aria-label={action.label}
                     onPress={onPress}
-                    icon={Icon ? <Icon size={16} /> : undefined}
                     testID={action.testID}
-                  >
+                  />
+                ) : (
+                  <Button chromeless accentInk onPress={onPress} testID={action.testID}>
                     {action.label}
                   </Button>
-                </Tooltip>
-              </XStack>
-            );
-          }
-          return (
-            <React.Fragment key={action.label}>
-              <Tooltip content={action.hint ?? action.label}>
-                {/* responsive-parity: the circular icon twin below carries this action on phones */}
-                <Button
-                  outlined
-                  onPress={onPress}
-                  icon={Icon ? <Icon size={16} /> : undefined}
-                  $max-sm={{ display: "none" }}
-                  testID={action.testID}
-                >
-                  {action.label}
-                </Button>
+                )}
               </Tooltip>
-              <Button
-                outlined
-                circular
-                onPress={onPress}
-                icon={Icon ? <Icon size={16} /> : undefined}
-                display="none"
-                aria-label={action.label}
-                $max-sm={{ display: "flex" }}
-              />
-            </React.Fragment>
+            </XStack>
           );
         })}
         {headerOwnsTools && onAdd ? (
-          <>
-            {/* responsive-parity: the short "Add" twin below carries this action on phones */}
-            <Button
-              theme="accent"
-              onPress={onAdd}
-              icon={<PlusIcon size={16} />}
-              $max-sm={{ display: "none" }}
-            >
-              {t("Add {{doctype}}", { doctype })}
-            </Button>
-            <Button
-              theme="accent"
+          <Tooltip content={t("Add {{doctype}}", { doctype })}>
+            <PageBarButton
+              icon={PlusIcon}
+              aria-label={t("Add {{doctype}}", { doctype })}
               onPress={onAdd}
-              icon={<PlusIcon size={16} />}
-              display="none"
-              $max-sm={{ display: "flex" }}
-            >
-              {t("Add")}
-            </Button>
-          </>
+              edge="end"
+              testID={`${slug}-add`}
+            />
+          </Tooltip>
         ) : null}
       </XStack>
     ) : undefined;
@@ -1013,6 +980,7 @@ function FrappeListViewBody<TDoc extends { name: string; doctype: string }>({
         rows={shuffleRows}
         itemLabel={shuffle.label}
         renderPick={(doc) => drawCard(doc, 0)}
+        grid={gridProps}
         onGo={(doc) => {
           setShuffleOpen(false);
           onItemClick?.(doc);

package/src/FrappeRecordView.tsx

@@ -1,6 +1,7 @@
 import { EmptyState, Screen } from "@multiplatform.one/components";
 import { Button } from "@multiplatform.one/forms";
 import type { Order } from "@multiplatform.one/frappe";
+import { DETAIL_READABLE_WIDTH } from "@multiplatform.one/theme";
 import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import type { FrappeConnection } from "./frappeConnections";
@@ -141,12 +142,18 @@ export function FrappeRecordView<TDoc extends { name: string; doctype: string }>
       showSidebar={false}
       showTimeline={false}
       loadingFallback={
-        <Screen noPadding gap={0} topBar={backButton}>
+        <Screen noPadding gap={0} maxWidth={DETAIL_READABLE_WIDTH} topBar={backButton}>
           <RecordSkeleton testID={`${slug}-detail-skeleton`} />
         </Screen>
       }
       notFoundFallback={
-        <Screen scroll={false} noPadding gap={0} topBar={backButton}>
+        <Screen
+          scroll={false}
+          noPadding
+          gap={0}
+          maxWidth={DETAIL_READABLE_WIDTH}
+          topBar={backButton}
+        >
           <EmptyState
             title={t("{{doctype}} not found", { doctype })}
             description={t("No {{doctype}} is named {{name}}.", { doctype, name })}
@@ -159,7 +166,13 @@ export function FrappeRecordView<TDoc extends { name: string; doctype: string }>
         </Screen>
       }
       errorFallback={
-        <Screen scroll={false} noPadding gap={0} topBar={backButton}>
+        <Screen
+          scroll={false}
+          noPadding
+          gap={0}
+          maxWidth={DETAIL_READABLE_WIDTH}
+          topBar={backButton}
+        >
           <EmptyState
             intent="error"
             title={t("Couldn't load this {{doctype}}", { doctype })}

package/src/FrappeReportBuilder.tsx

@@ -870,25 +870,27 @@ function FrappeReportBuilderBody({
 
   const content = (
     <YStack flex={1} minWidth={0} minHeight={0} {...stackProps}>
-      <ReportViewToolbar
-        columns={allColumns}
-        selected={selectedFieldnames}
-        onToggleColumn={handleToggleColumn}
-        onResetColumns={handleResetColumns}
-        groupBy={groupBy}
-        onGroupByChange={setGroupBy}
-        baseFilters={baseFilters}
-        onClearBaseFilters={baseFilters.length > 0 ? handleClearBaseFilters : undefined}
-        columnFilterCount={columnTuples.length}
-        onClearColumnFilters={handleClearColumnFilters}
-        savedReports={savedReports.reports}
-        currentReport={currentReport}
-        onSelectReport={handleSelectReport}
-        onSaveReport={readsWithoutMeta ? undefined : handleSaveReport}
-        onDeleteReport={readsWithoutMeta ? undefined : handleDeleteReport}
-        onExport={exportEnabled ? handleExport : undefined}
-        exportDisabled={total === 0}
-      />
+      <YStack paddingHorizontal="$3">
+        <ReportViewToolbar
+          columns={allColumns}
+          selected={selectedFieldnames}
+          onToggleColumn={handleToggleColumn}
+          onResetColumns={handleResetColumns}
+          groupBy={groupBy}
+          onGroupByChange={setGroupBy}
+          baseFilters={baseFilters}
+          onClearBaseFilters={baseFilters.length > 0 ? handleClearBaseFilters : undefined}
+          columnFilterCount={columnTuples.length}
+          onClearColumnFilters={handleClearColumnFilters}
+          savedReports={savedReports.reports}
+          currentReport={currentReport}
+          onSelectReport={handleSelectReport}
+          onSaveReport={readsWithoutMeta ? undefined : handleSaveReport}
+          onDeleteReport={readsWithoutMeta ? undefined : handleDeleteReport}
+          onExport={exportEnabled ? handleExport : undefined}
+          exportDisabled={total === 0}
+        />
+      </YStack>
       <ScrollView
         flex={1}
         minWidth={0}

package/src/SyncErrorNotice.spec.tsx

@@ -1,5 +1,5 @@
 // SyncErrorNotice contract: the visible half of the rejected-write pattern —
-// role="alert" message, Retry re-issues, Dismiss clears, and each affordance
+// role="alert" message, Retry re-issues, the close button clears, and each affordance
 // only renders when its handler is provided.
 import { renderWithProviders } from "@multiplatform.one/test-utils";
 import { cleanup, fireEvent, screen } from "@testing-library/react";
@@ -33,7 +33,9 @@ describe("SyncErrorNotice", () => {
     );
     fireEvent.click(await screen.findByText("Retry"));
     expect(onRetry).toHaveBeenCalledTimes(1);
-    fireEvent.click(await screen.findByText("Dismiss"));
+    const close = await screen.findByRole("button", { name: "Dismiss" });
+    expect(close.textContent?.trim()).toBe("");
+    fireEvent.click(close);
     expect(onDismiss).toHaveBeenCalledTimes(1);
   });
 
@@ -41,20 +43,13 @@ describe("SyncErrorNotice", () => {
     renderWithProviders(<SyncErrorNotice message="No actions" />);
     await screen.findByRole("alert");
     expect(screen.queryByText("Retry")).toBeNull();
-    expect(screen.queryByText("Dismiss")).toBeNull();
+    expect(screen.queryByRole("button", { name: "Dismiss" })).toBeNull();
   });
 
-  it("honors custom labels", async () => {
+  it("honors a custom Retry label", async () => {
     renderWithProviders(
-      <SyncErrorNotice
-        message="Custom"
-        onRetry={() => {}}
-        onDismiss={() => {}}
-        retryLabel="Try again"
-        dismissLabel="Ignore"
-      />,
+      <SyncErrorNotice message="Custom" onRetry={() => {}} retryLabel="Try again" />,
     );
     expect(await screen.findByText("Try again")).toBeTruthy();
-    expect(await screen.findByText("Ignore")).toBeTruthy();
   });
 });

package/src/SyncErrorNotice.stories.tsx

@@ -10,14 +10,13 @@ export default {
     docs: {
       description: {
         component:
-          "Rejected-write notice: role=alert message with Retry (same mutation id) and Dismiss. Each affordance only renders when its handler is provided.",
+          "Rejected-write notice: role=alert message with Retry (same mutation id) and a close button. Each affordance only renders when its handler is provided.",
       },
     },
   },
   argTypes: {
     message: { control: "text" },
     retryLabel: { control: "text" },
-    dismissLabel: { control: "text" },
   },
 };
 
@@ -40,11 +39,10 @@ export const AllStates = () => (
     <SyncErrorNotice message="Write rejected — retry only" onRetry={action("onRetry")} />
     <SyncErrorNotice message="No actions" />
     <SyncErrorNotice
-      message="Custom labels"
+      message="Custom Retry label"
       onRetry={action("onRetry")}
       onDismiss={action("onDismiss")}
       retryLabel="Try again"
-      dismissLabel="Ignore"
     />
   </YStack>
 );

package/src/SyncErrorNotice.tsx

@@ -1,8 +1,6 @@
-import { Button, Text } from "@multiplatform.one/components";
-import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { Alert } from "@multiplatform.one/components";
 import React from "react";
 import { useTranslation } from "react-i18next";
-import { XStack } from "tamagui";
 
 export interface SyncErrorNoticeProps {
   /** Human-readable failure message (already localized by the caller). */
@@ -12,20 +10,18 @@ export interface SyncErrorNoticeProps {
    * Omit to hide the Retry affordance.
    */
   onRetry?: () => void;
-  /** Drops the failed entry without retrying. Omit to hide Dismiss. */
+  /** Drops the failed entry without retrying: the alert's close button. Omit to hide it. */
   onDismiss?: () => void;
   /** Override the Retry button label (defaults to a localized "Retry"). */
   retryLabel?: string;
-  /** Override the Dismiss button label (defaults to a localized "Dismiss"). */
-  dismissLabel?: string;
 }
 
 /**
  * The rejected-write notice — the visible half of the optimistic mutation
- * contract: when the server rejects a write, the optimistic state has
+ * contract, on the MPO error `Alert` (LC-175): when the server rejects a write, the optimistic state has
  * already been rolled back by the sync engine; this primitive surfaces the
  * error inline at the surface that initiated the write, with Retry
- * (re-issues the SAME mutation id) and Dismiss (clears the ledger entry).
+ * (re-issues the SAME mutation id) and a close button (clears the ledger entry).
  *
  * Pair with `useFrappePendingMutations` from `@multiplatform.one/frappe`:
  *
@@ -41,41 +37,17 @@ export interface SyncErrorNoticeProps {
  * ))}
  * ```
  */
-export function SyncErrorNotice({
-  message,
-  onRetry,
-  onDismiss,
-  retryLabel,
-  dismissLabel,
-}: SyncErrorNoticeProps) {
+export function SyncErrorNotice({ message, onRetry, onDismiss, retryLabel }: SyncErrorNoticeProps) {
   const { t } = useTranslation();
-  const { knobProps } = useResolvedKnobs();
   return (
-    <XStack
-      role="alert"
-      alignItems="center"
-      flexWrap="wrap"
-      gap="$2"
-      paddingHorizontal="$3"
-      paddingVertical="$2"
-      {...knobProps.borderRadius}
-      backgroundColor="$red3"
-      borderColor="$red7"
-      borderWidth={1}
+    <Alert
+      intent="error"
+      actionLabel={onRetry ? (retryLabel ?? t("Retry")) : undefined}
+      onAction={onRetry}
+      dismissible={Boolean(onDismiss)}
+      onDismiss={onDismiss}
     >
-      <Text flex={1} fontSize="$2" color="$red11">
-        {message}
-      </Text>
-      {onRetry && (
-        <Button size="$2" theme="error" {...knobProps.borderRadius} onPress={onRetry}>
-          {retryLabel ?? t("Retry")}
-        </Button>
-      )}
-      {onDismiss && (
-        <Button size="$2" chromeless {...knobProps.borderRadius} onPress={onDismiss}>
-          {dismissLabel ?? t("Dismiss")}
-        </Button>
-      )}
-    </XStack>
+      {message}
+    </Alert>
   );
 }

package/src/desk/DeskFormSidebar.tsx

@@ -20,7 +20,6 @@ import { useDocTypeMeta, useFrappeCollection, useLiveQuery } from "@multiplatfor
 import { eq } from "@tanstack/db";
 import React, { useMemo } from "react";
 import { useTranslation } from "react-i18next";
-import { isWeb } from "tamagui";
 import {
   buildSidebarSections,
   mapDocToSidebarMetadata,
@@ -142,7 +141,7 @@ export function DeskFormSidebar({ doctype, name }: DeskFormSidebarProps) {
       // inline rail width, and drop the end rail — the pane gap separates the
       // sidebar from the form (stacked below on compact, the rail would float).
       width="100%"
-      {...(isWeb ? { borderInlineEndWidth: 0 } : { borderEndWidth: 0 })}
+      divider={false}
       data-testid="desk-form-sidebar"
     />
   );

package/src/desk/DeskShell.tsx

@@ -90,6 +90,7 @@ function useIsNarrowDesk(): boolean {
 // Component
 // ---------------------------------------------------------------------------
 
+// mpo-role-escape: MPO has no app shell (top bar, nav rail, compact drawer) yet; FZ-7996 builds it and moves DeskShell onto it.
 export function DeskShell({
   children,
   breadcrumbs,

package/src/fields/Date/catalog.tsx

@@ -1,6 +1,7 @@
 /**
- * Web `Date` field for the three Frappe date fieldtypes, and the native one
- * when the optional `@react-native-community/datetimepicker` peer is absent.
+ * The `Date` field for the three Frappe date fieldtypes, on web and native.
+ * On iOS and Android the forms pickers open the OS sheet themselves
+ * (`OsDateTimeSheet`), so this field has no native fork (FZ-8000).
  *
  * The field used to render ONE date-only calendar for all three types, with
  * only the placeholder varying — so a `Datetime` silently dropped its time
@@ -14,8 +15,8 @@
  *               registry routes the Frappe `Time` fieldtype to, so a
  *               `Date type="time"` and a `Time` field are one control
  *
- * This mirrors what the native half already does (calendar / wheel /
- * calendar-then-wheel), and every branch serializes through the one shared
+ * On native the same three pickers present the OS calendar, wheel, and
+ * calendar-then-wheel, and every branch serializes through the one shared
  * `wire.ts` body, so a web pick and a native pick of the same moment persist
  * byte-identical strings.
  */
@@ -50,8 +51,7 @@ function toPickerDate(value: string | undefined): Date | null {
 /**
  * `TimePicker` speaks `HH:mm`; Frappe stores `HH:mm:ss`. Round-tripping
  * through the shared wire body — rather than padding the string here — is
- * what keeps the two platform halves byte-identical, since the native half
- * serializes its wheel pick through exactly this call.
+ * what keeps a picked time in Frappe's wire shape on every platform.
  */
 function toTimeWireValue(picked: string): string {
   if (!picked) return "";
@@ -130,7 +130,6 @@ export function Date<
         // No `previousValue`: this picker owns both halves of the value and
         // preserves an existing time across a day change itself, so carrying
         // the old time part here would overwrite a time the user just set.
-        // The native half passes nothing for the same reason.
         onChange={(date) => emit?.(date ? toFrappeDateValue(date, "datetime") : "")}
         defaultValue={defaultValue as string}
         label={fieldProps.label}