@godxjp/ui 31.27.0 → 31.28.0

package/dist/components/layout/index.js

@@ -1,4 +1,5 @@
 import { PageContainer } from "./page-container.js";
+import { PageCover } from "./page-cover.js";
 import { Flex } from "./flex.js";
 import { SpaceCompact } from "./space-compact.js";
 import { ResizablePanel, ResizablePanelGroup, ResizableHandle } from "./resizable.js";
@@ -55,6 +56,7 @@ export {
   NavList,
   OrgSwitcher,
   PageContainer,
+  PageCover,
   ResizableHandle,
   ResizablePanel,
   ResizablePanelGroup,

package/dist/components/layout/page-container.d.ts

@@ -2,7 +2,7 @@ import type { PageContainerProp, PageInsetProp } from "../../props/components/la
 export type { PageContainerProp, PageContainerProp as PageContainerProps, PageContainerExtraProp, } from "../../props/components/layout.prop.js";
 export type { BreadcrumbItemProp, BreadcrumbItemProp as BreadcrumbItem, } from "../../props/vocabulary/navigation.prop.js";
 export declare function PageContainerInset({ className, children, ...props }: PageInsetProp): import("react").JSX.Element;
-declare function PageContainerRoot({ title, subtitle, status, extra, toolbar, footer, toolbarPad, footerPad, breadcrumb, breadcrumbLabel, breadcrumbAriaLabel, linkComponent: LinkComponent, headerLoading, titleRef, density, variant, preset, headerLayout, headerScale, measure, stickyFooter, footerReveal, fill, children, className, }: PageContainerProp): import("react").JSX.Element;
+declare function PageContainerRoot({ title, subtitle, status, extra, toolbar, footer, toolbarPad, footerPad, breadcrumb, breadcrumbLabel, breadcrumbAriaLabel, linkComponent: LinkComponent, headerLoading, titleRef, density, variant, preset, headerLayout, headerScale, icon, cover, measure, stickyFooter, footerReveal, fill, children, className, }: PageContainerProp): import("react").JSX.Element;
 export declare const PageContainer: typeof PageContainerRoot & {
     Inset: typeof PageContainerInset;
 };

package/dist/components/layout/page-container.js

@@ -51,6 +51,8 @@ function PageContainerRoot({
   preset = "default",
   headerLayout = "stack",
   headerScale = "document",
+  icon,
+  cover,
   measure = "default",
   stickyFooter = false,
   footerReveal = "always",
@@ -63,12 +65,14 @@ function PageContainerRoot({
   const { t } = useTranslation();
   const { start: extraStart, end: extraEnd } = resolvePageExtra(extra);
   const titleFocus = titleRef === void 0 ? void 0 : { ref: titleRef, tabIndex: -1 };
+  const coverVariant = cover == null || cover === false ? void 0 : isValidElement(cover) && cover.props.variant === "eyecatch" ? "eyecatch" : "banner";
   return /* @__PURE__ */ jsxs(
     "div",
     {
       "data-preset": preset,
       "data-measure": measure,
-      "data-header-scale": headerScale === "chrome" ? "chrome" : void 0,
+      "data-header-scale": headerScale === "document" ? void 0 : headerScale,
+      "data-cover": coverVariant,
       "data-revealed": revealed ? "true" : void 0,
       className: cn(
         "ui-page-container",
@@ -82,6 +86,7 @@ function PageContainerRoot({
         className
       ),
       children: [
+        coverVariant === "banner" ? /* @__PURE__ */ jsx("div", { className: "ui-page-cover-slot", children: cover }) : null,
         /* @__PURE__ */ jsxs(
           "header",
           {
@@ -134,8 +139,10 @@ function PageContainerRoot({
                   }) })
                 }
               ),
+              coverVariant === "eyecatch" ? /* @__PURE__ */ jsx("div", { className: "ui-page-cover-slot", children: cover }) : null,
               /* @__PURE__ */ jsxs("div", { className: "ui-page-header-row", children: [
                 /* @__PURE__ */ jsxs("div", { className: "ui-page-header-heading", children: [
+                  icon != null && icon !== false ? /* @__PURE__ */ jsx("div", { className: "ui-page-header-icon", children: icon }) : null,
                   headerLoading ? /* @__PURE__ */ jsx(
                     "h1",
                     {

package/dist/components/layout/page-cover.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import type { PageCoverProp } from "../../props/components/layout.prop.js";
+export type { PageCoverProp, PageCoverProp as PageCoverProps, } from "../../props/components/layout.prop.js";
+/**
+ * PageCover (gh#1160) — a page's cover image: Notion's banner across the top, or note.com's
+ * eyecatch in the reading column (`variant="eyecatch"`, ~1.91:1, rounded). Put it in
+ * `PageContainer cover`, which places it and lets the page `icon` overlap its bottom edge.
+ *
+ * The focal point is `positionY` (0 top – 100 bottom), applied as `object-position: 50% y%`.
+ * While `repositioning`, the image IS the control: a vertical WAI-ARIA slider that follows a drag
+ * (pixels map to percent through the image's real overflow, so the picture tracks the pointer)
+ * and the slider keys (arrows ±1, PageUp / PageDown ±10, Home / End); Enter or Escape ends it.
+ */
+export declare const PageCover: React.ForwardRefExoticComponent<PageCoverProp & React.RefAttributes<HTMLDivElement>>;

package/dist/components/layout/page-cover.js

@@ -0,0 +1,127 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useTranslation } from "../../i18n/use-translation.js";
+import { cn } from "../../lib/utils.js";
+const clamp = (value) => Math.min(100, Math.max(0, Math.round(value)));
+const PageCover = React.forwardRef(function PageCover2({
+  src,
+  alt,
+  positionY = 50,
+  onPositionChange,
+  repositioning = false,
+  onRepositioningChange,
+  variant = "banner",
+  height = "md",
+  actions,
+  id,
+  className
+}, ref) {
+  const { t } = useTranslation();
+  const frameRef = React.useRef(null);
+  const imageRef = React.useRef(null);
+  const drag = React.useRef(null);
+  const y = clamp(positionY);
+  const overflow = () => {
+    const frame = frameRef.current;
+    const image = imageRef.current;
+    if (!frame || !image || !image.naturalWidth) return 0;
+    const rendered = frame.clientWidth / image.naturalWidth * image.naturalHeight;
+    return Math.max(0, rendered - frame.clientHeight);
+  };
+  const onKeyDown = (event) => {
+    if (!repositioning) return;
+    const step = {
+      ArrowUp: 1,
+      ArrowRight: 1,
+      ArrowDown: -1,
+      ArrowLeft: -1,
+      PageUp: 10,
+      PageDown: -10
+    }[event.key];
+    let next = null;
+    if (step !== void 0) next = clamp(y + step);
+    else if (event.key === "Home") next = 0;
+    else if (event.key === "End") next = 100;
+    else if (event.key === "Enter" || event.key === "Escape") {
+      event.preventDefault();
+      onRepositioningChange?.(false);
+      return;
+    }
+    if (next === null) return;
+    event.preventDefault();
+    if (next !== y) onPositionChange?.(next);
+  };
+  const onPointerDown = (event) => {
+    if (!repositioning || event.button !== 0) return;
+    event.currentTarget.setPointerCapture(event.pointerId);
+    drag.current = { pointer: event.pointerId, startY: event.clientY, startValue: y };
+  };
+  const onPointerMove = (event) => {
+    const active = drag.current;
+    if (!active || active.pointer !== event.pointerId) return;
+    const travel = overflow();
+    if (travel <= 0) return;
+    const next = clamp(active.startValue - (event.clientY - active.startY) / travel * 100);
+    if (next !== y) onPositionChange?.(next);
+  };
+  const endDrag = (event) => {
+    if (drag.current?.pointer === event.pointerId) drag.current = null;
+  };
+  const slider = repositioning ? {
+    role: "slider",
+    tabIndex: 0,
+    "aria-orientation": "vertical",
+    "aria-valuemin": 0,
+    "aria-valuemax": 100,
+    "aria-valuenow": y,
+    "aria-valuetext": t("layout.pageCover.valueText", { value: y }),
+    "aria-label": t("layout.pageCover.position")
+  } : {};
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      id,
+      "data-slot": "page-cover",
+      "data-variant": variant,
+      "data-height": variant === "banner" ? height : void 0,
+      "data-repositioning": repositioning ? "" : void 0,
+      className: cn("ui-page-cover", className),
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            ref: frameRef,
+            className: "ui-page-cover-frame ui-focus-ring",
+            onKeyDown,
+            onPointerDown,
+            onPointerMove,
+            onPointerUp: endDrag,
+            onPointerCancel: endDrag,
+            ...slider,
+            children: [
+              /* @__PURE__ */ jsx(
+                "img",
+                {
+                  ref: imageRef,
+                  className: "ui-page-cover-image",
+                  src,
+                  alt,
+                  draggable: false,
+                  style: { objectPosition: `50% ${y}%` }
+                }
+              ),
+              repositioning ? /* @__PURE__ */ jsx("span", { className: "ui-page-cover-hint", "aria-hidden": "true", children: t("layout.pageCover.hint") }) : null
+            ]
+          }
+        ),
+        actions != null ? /* @__PURE__ */ jsx("div", { className: "ui-page-cover-actions", children: actions }) : null
+      ]
+    }
+  );
+});
+PageCover.displayName = "PageCover";
+export {
+  PageCover
+};

package/dist/contracts/measurement.json

@@ -1,6 +1,6 @@
 {
   "$comment": "AUTO-GENERATED by scripts/gen-measurement-contract.mjs — do not edit. Read this instead of guessing: docs/MEASUREMENT-CONTRACT.md.",
-  "version": "31.27.0",
+  "version": "31.28.0",
   "targetSize": {
     "standard": "WCAG 2.2 SC 2.5.8 Target Size (Minimum), level AA — 24×24 CSS px",
     "min": 24,

package/dist/i18n/messages/en.json

@@ -212,6 +212,26 @@
       "openDialog": "Choose from list",
       "openSearch": "Search",
       "suggestions": "Suggestions"
+    },
+    "emojiPicker": {
+      "trigger": "Choose an icon",
+      "search": "Search emoji",
+      "recent": "Recently used",
+      "remove": "Remove icon",
+      "empty": "No emoji found",
+      "loading": "Loading emoji…",
+      "grid": "Emoji",
+      "categories": {
+        "smileys": "Smileys & emotion",
+        "people": "People & body",
+        "animals": "Animals & nature",
+        "food": "Food & drink",
+        "travel": "Travel & places",
+        "activities": "Activities",
+        "objects": "Objects",
+        "symbols": "Symbols",
+        "flags": "Flags"
+      }
     }
   },
   "feedback": {
@@ -301,6 +321,11 @@
     },
     "draggablePanel": {
       "moveLabel": "Move panel. Use the arrow keys to move it, or hold Shift for larger steps."
+    },
+    "pageCover": {
+      "position": "Cover position",
+      "hint": "Drag the image, or use the arrow keys, to reposition it",
+      "valueText": "{value}% from the top"
     }
   },
   "dataDisplay": {

package/dist/i18n/messages/ja.json

@@ -208,6 +208,26 @@
       "openDialog": "一覧から選択",
       "openSearch": "検索",
       "suggestions": "候補"
+    },
+    "emojiPicker": {
+      "trigger": "アイコンを選ぶ",
+      "search": "絵文字を検索",
+      "recent": "最近使った絵文字",
+      "remove": "アイコンを削除",
+      "empty": "該当する絵文字がありません",
+      "loading": "絵文字を読み込み中…",
+      "grid": "絵文字",
+      "categories": {
+        "smileys": "顔と感情",
+        "people": "人と体",
+        "animals": "動物と自然",
+        "food": "食べ物と飲み物",
+        "travel": "旅行と場所",
+        "activities": "活動",
+        "objects": "もの",
+        "symbols": "記号",
+        "flags": "旗"
+      }
     }
   },
   "feedback": {
@@ -294,6 +314,11 @@
     },
     "draggablePanel": {
       "moveLabel": "パネルを移動。矢印キーで移動、Shift キーを押しながらで大きく移動します。"
+    },
+    "pageCover": {
+      "position": "カバー画像の位置",
+      "hint": "画像をドラッグするか矢印キーで位置を調整",
+      "valueText": "上から {value}%"
     }
   },
   "dataDisplay": {

package/dist/i18n/messages/vi.json

@@ -209,6 +209,26 @@
       "openDialog": "Chọn từ danh sách",
       "openSearch": "Tìm kiếm",
       "suggestions": "Gợi ý"
+    },
+    "emojiPicker": {
+      "trigger": "Chọn biểu tượng",
+      "search": "Tìm emoji",
+      "recent": "Dùng gần đây",
+      "remove": "Gỡ biểu tượng",
+      "empty": "Không tìm thấy emoji",
+      "loading": "Đang tải emoji…",
+      "grid": "Emoji",
+      "categories": {
+        "smileys": "Mặt cười & cảm xúc",
+        "people": "Con người & cơ thể",
+        "animals": "Động vật & thiên nhiên",
+        "food": "Đồ ăn & thức uống",
+        "travel": "Du lịch & địa điểm",
+        "activities": "Hoạt động",
+        "objects": "Đồ vật",
+        "symbols": "Ký hiệu",
+        "flags": "Cờ"
+      }
     }
   },
   "feedback": {
@@ -295,6 +315,11 @@
     },
     "draggablePanel": {
       "moveLabel": "Di chuyển bảng. Dùng phím mũi tên để dời, giữ Shift để bước dài hơn."
+    },
+    "pageCover": {
+      "position": "Vị trí ảnh bìa",
+      "hint": "Kéo ảnh hoặc dùng phím mũi tên để chỉnh vị trí",
+      "valueText": "{value}% tính từ trên"
     }
   },
   "dataDisplay": {

package/dist/props/components/data-display.prop.d.ts

@@ -781,6 +781,12 @@ export type TreeProp = {
     onExpandedValuesChange?: (values: string[]) => void;
     /** Start with every branch open (antd `defaultExpandAll`). Seeded once, never re-applied. */
     defaultExpandAll?: boolean;
+    /**
+     * Expand a parent by clicking its ROW, not only its switcher (antd `DirectoryTree expandAction`,
+     * gh#1162): `"click"` selects AND toggles, `"doubleClick"` toggles on a double click. Default
+     * `false` — the switcher alone expands. The keyboard keeps the APG map (→ / ← expand).
+     */
+    expandAction?: false | "click" | "doubleClick";
     /**
      * Lazy children (antd `loadData`). Called when a branch with no `children` and
      * `isLeaf !== true` is expanded, and never again once its promise RESOLVES; push the fetched

package/dist/props/components/data-entry.prop.d.ts

@@ -2360,3 +2360,29 @@ export type AttachmentsRefProp = {
         multiple?: boolean;
     }) => void;
 };
+/**
+ * @see EmojiPicker — a page icon / reaction picker (gh#1164): search by ja / en / vi keywords
+ * (emojibase-data, loaded for the active locale on first open), categories, per-user recents, a
+ * WAI-ARIA grid, and "remove icon". No skin tones.
+ */
+export type EmojiPickerProp = {
+    /** The chosen emoji (a Unicode string), or null for none. Controlled with `onValueChange`. */
+    value?: ValueProp<string | null>;
+    defaultValue?: DefaultValueProp<string | null>;
+    /** Called with the picked emoji, or null when "remove icon" is chosen. */
+    onValueChange?: OnValueChangeProp<string | null>;
+    open?: OpenProp;
+    defaultOpen?: DefaultOpenProp;
+    onOpenChange?: OnOpenChangeProp;
+    /** Offer "remove icon" while a value is set. Default true. */
+    removable?: boolean;
+    /** localStorage key for the per-user recents. Default `godxjp-ui:emoji-recents`. */
+    recentsKey?: string;
+    size?: SizeProp;
+    disabled?: DisabledProp;
+    /** Replace the default trigger button (it must accept a ref and onClick). */
+    trigger?: React.ReactNode;
+    "aria-label"?: string;
+    id?: IdProp;
+    className?: ClassNameProp;
+};

package/dist/props/components/layout.prop.d.ts

@@ -21,7 +21,7 @@ export type PageContainerMeasureProp = "default" | "narrow" | "medium";
  * What the page's top row IS — the question that decides its type step, not how big you want it.
  * `document` (default) — the row is the page's TITLE: a record, a form, a collection, a report.
  */
-export type PageContainerHeaderScaleProp = "document" | "chrome";
+export type PageContainerHeaderScaleProp = "document" | "chrome" | "display";
 /**
  * @see PageContainer — the header's trailing slot, one node or two named sub-slots.
  *
@@ -99,9 +99,22 @@ export type PageContainerProp = {
     /**
      * Whether the page's top row is a DOCUMENT TITLE or the surface's own CHROME. Pass `chrome` when
      * the row names the thing the user is already inside rather than announcing a document: a chat
-     * channel, a mail thread, an IDE tab.
+     * channel, a mail thread, an IDE tab. Pass `display` for an ARTICLE whose title is the page's
+     * headline (a Notion / note.com page): a larger, token-owned step that scales from phone to
+     * desktop, a CJK-friendly line height, and balanced wrapping (gh#1160).
      */
     headerScale?: PageContainerHeaderScaleProp;
+    /**
+     * The page's icon — an emoji or a glyph — drawn large above the title, overlapping a banner
+     * `cover`'s bottom edge (gh#1160). Decorative by default reading: give it `aria-hidden` unless
+     * it is itself a control (a "change icon" button).
+     */
+    icon?: React.ReactNode;
+    /**
+     * A `PageCover`. The banner variant spans the page edge to edge above the header; the
+     * `eyecatch` variant sits inside the header's reading column, above the title (gh#1160).
+     */
+    cover?: React.ReactNode;
     /**
      * Bounded page measure shared by the header and the body. `narrow` (624px surface) / `medium`
      * (720px surface) cap BOTH bands to one token-owned measure (`--page-measure-{narrow,medium}`),
@@ -970,6 +983,40 @@ export type ErrorSurfaceMaintenanceProp = {
  * All product COPY stays consumer-owned (`title` / `description` / `action` come from the app's own
  * `t()`); the surface owns only its own metadata labels, which it localizes itself.
  */
+/** @see PageCover — banner across the page top, or an article's eyecatch in the reading column. */
+export type PageCoverVariantProp = "banner" | "eyecatch";
+/** @see PageCover — the banner's token-owned height step (phone → desktop). */
+export type PageCoverHeightProp = "md" | "lg";
+/**
+ * @see PageCover — a page's cover image (gh#1160): Notion's banner above the title, or note.com's
+ * eyecatch in the reading column. The focal point is a vertical position, and the cover can be
+ * repositioned by drag OR keyboard: while `repositioning`, the image is a WAI-ARIA slider.
+ */
+export type PageCoverProp = {
+    /** The image URL. */
+    src: string;
+    /** Alternative text; `""` for a purely decorative cover. */
+    alt: string;
+    /** Vertical focal point, 0 (top) – 100 (bottom): the image's `object-position` y. Default 50. */
+    positionY?: number;
+    /** Called while repositioning with the new focal point (drag, arrows, Home / End). */
+    onPositionChange?: (positionY: number) => void;
+    /** Reposition mode: the image becomes a vertical slider (drag + keyboard). Controlled. */
+    repositioning?: boolean;
+    /** Reposition mode ended from inside the cover (Enter / Escape). */
+    onRepositioningChange?: (repositioning: boolean) => void;
+    /** `banner` (default) spans the page above the header; `eyecatch` sits in the reading column. */
+    variant?: PageCoverVariantProp;
+    /** Banner height step, token-owned for phone and desktop. Default `md`. */
+    height?: PageCoverHeightProp;
+    /**
+     * Cover actions (change / reposition / remove). Over the cover's bottom edge on a wide screen,
+     * BELOW the image on a narrow one, so they never sit on the focal area.
+     */
+    actions?: React.ReactNode;
+    id?: IdProp;
+    className?: ClassNameProp;
+};
 export type ErrorSurfaceProp = {
     /** Where the surface lives — `application` = AppShell body (400/403/404), `system` = own page (500/503). */
     mode: ErrorSurfaceModeProp;

package/dist/props/registry.d.ts

@@ -784,7 +784,15 @@ export declare const COMPONENT_PROP_REGISTRY: {
         }, {
             readonly field: "headerScale";
             readonly local: true;
-            readonly reason: "What the page's top row IS — a document title or the surface's own chrome (document | chrome) — which selects the title's type step via --page-title-font-size-chrome AND opens the page flush with the frame via --page-pad-block-start-chrome (chrome sits on the edge; a document title gets the page's top margin). A fourth orthogonal axis: PageContainerVariantProp owns chrome WEIGHT (ghost drops the divider and header pad), headerLayout owns the header ARRANGEMENT, measure owns the inline cap; none of them can say that the h1 is a channel name rather than a headline.";
+            readonly reason: "What the page's top row IS — a document title, the surface's own chrome, or an article headline (document | chrome | display; display = gh#1160) — which selects the title's type step via --page-title-font-size-chrome AND opens the page flush with the frame via --page-pad-block-start-chrome (chrome sits on the edge; a document title gets the page's top margin). A fourth orthogonal axis: PageContainerVariantProp owns chrome WEIGHT (ghost drops the divider and header pad), headerLayout owns the header ARRANGEMENT, measure owns the inline cap; none of them can say that the h1 is a channel name rather than a headline.";
+        }, {
+            readonly field: "icon";
+            readonly local: true;
+            readonly reason: "The PAGE's icon (an emoji or glyph) drawn large above the h1 and over a banner cover's edge — a page identity slot, not the small IconProp glyph a control carries (gh#1160).";
+        }, {
+            readonly field: "cover";
+            readonly local: true;
+            readonly reason: "Slot for a PageCover; the container reads its variant to place it full-bleed above the header (banner) or in the reading column (eyecatch) (gh#1160).";
         }, {
             readonly field: "measure";
             readonly local: true;
@@ -1187,6 +1195,57 @@ export declare const COMPONENT_PROP_REGISTRY: {
             readonly reason: "Server-sent 0–100 completion of the maintenance window; deriving it from the client clock would break hydration.";
         }];
     };
+    readonly PageCoverVariantProp: {
+        readonly group: "layout";
+        readonly file: "components/layout.prop.ts";
+        readonly vocabulary: readonly [];
+    };
+    readonly PageCoverHeightProp: {
+        readonly group: "layout";
+        readonly file: "components/layout.prop.ts";
+        readonly vocabulary: readonly [];
+    };
+    readonly PageCoverProp: {
+        readonly group: "layout";
+        readonly file: "components/layout.prop.ts";
+        readonly vocabulary: readonly ["IdProp", "ClassNameProp", {
+            readonly field: "src";
+            readonly local: true;
+            readonly reason: "The native img src attribute.";
+        }, {
+            readonly field: "alt";
+            readonly local: true;
+            readonly reason: "The native img alt attribute.";
+        }, {
+            readonly field: "positionY";
+            readonly local: true;
+            readonly reason: "The cover's vertical FOCAL POINT, 0–100, applied as object-position y — a geometric value of this image, not a ValueProp a form submits (gh#1160).";
+        }, {
+            readonly field: "onPositionChange";
+            readonly local: true;
+            readonly reason: "Paired change handler of positionY, named after the value it reports (drag / slider keys).";
+        }, {
+            readonly field: "repositioning";
+            readonly local: true;
+            readonly reason: "Controlled MODE flag: while true the image is a vertical WAI-ARIA slider. Not OpenProp — nothing opens; the cover becomes a control.";
+        }, {
+            readonly field: "onRepositioningChange";
+            readonly local: true;
+            readonly reason: "Paired change handler of repositioning, called when Enter / Escape ends the mode from inside.";
+        }, {
+            readonly field: "variant";
+            readonly local: true;
+            readonly reason: "PageCoverVariantProp (banner | eyecatch) — WHERE the cover sits and its shape, not a tone or a visual style variant.";
+        }, {
+            readonly field: "height";
+            readonly local: true;
+            readonly reason: "PageCoverHeightProp (md | lg) — the banner's token-owned viewport-scaled height step; SizeProp means control density, not this.";
+        }, {
+            readonly field: "actions";
+            readonly local: true;
+            readonly reason: "Slot for the host's cover controls (change / reposition / remove), laid out off the focal area — a ReactNode slot, not the ActionsProp item list.";
+        }];
+    };
     readonly ErrorSurfaceProp: {
         readonly group: "layout";
         readonly file: "components/layout.prop.ts";
@@ -3253,10 +3312,35 @@ export declare const COMPONENT_PROP_REGISTRY: {
             readonly reason: "antd `onDrop` info: true when it lands as a sibling, false inside.";
         }];
     };
+    readonly EmojiPickerProp: {
+        readonly group: "data-entry";
+        readonly file: "components/data-entry.prop.ts";
+        readonly vocabulary: readonly ["ValueProp", "DefaultValueProp", "OnValueChangeProp", "OpenProp", "DefaultOpenProp", "OnOpenChangeProp", "SizeProp", "DisabledProp", "IdProp", "ClassNameProp", {
+            readonly field: "removable";
+            readonly local: true;
+            readonly reason: "Whether \"remove icon\" is offered while a value is set — a picker for an OPTIONAL icon (gh#1164), not AllowClearProp's inline ✕ on a field.";
+        }, {
+            readonly field: "recentsKey";
+            readonly local: true;
+            readonly reason: "localStorage key the per-user recents are kept under, so two pickers (page icons, reactions) can keep separate lists.";
+        }, {
+            readonly field: "trigger";
+            readonly local: true;
+            readonly reason: "Replaces the default trigger button (a page icon drawn large, a reaction chip) — a ReactNode slot, not a TriggerProp mode.";
+        }, {
+            readonly field: "aria-label";
+            readonly local: true;
+            readonly reason: "Accessible name of the trigger and the popover.";
+        }];
+    };
     readonly TreeProp: {
         readonly group: "data-display";
         readonly file: "components/data-display.prop.ts";
         readonly vocabulary: readonly ["ValueProp", "DefaultValueProp", "OnValueChangeProp", "DisabledProp", "SizeProp", "ClassNameProp", "IdProp", {
+            readonly field: "expandAction";
+            readonly local: true;
+            readonly reason: "antd DirectoryTree's `expandAction` (false | click | doubleClick): whether a ROW click / double click also toggles a parent's expansion, beside the switcher (gh#1162). An interaction mode of the tree, not an OpenProp.";
+        }, {
             readonly field: "divided";
             readonly local: true;
             readonly reason: "Rules between the rows — a hairline on every node's block-start but the outline's first, full row width at every depth (gh#732). Default false, because chrome defaults quiet here (#44). Not antd's spelling: antd's Tree has no such capability, and `bordered` already means a grid's frame plus column rules on Table / Calendar / RangeTimeline; see docs/DESIGN-AUTHORITY.md.";