@godxjp/ui 33.22.2 → 33.25.0

package/dist/i18n/messages/vi.json

@@ -375,10 +375,16 @@
       "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"
+    },
+    "pageErrorBoundary": {
+      "title": "Không thể hiển thị trang này",
+      "description": "Đã xảy ra lỗi khi hiển thị trang này. Các phần khác của ứng dụng vẫn hoạt động: hãy tải lại trang, hoặc chuyển sang trang khác từ menu.",
+      "reload": "Tải lại trang"
     }
   },
   "dataDisplay": {
     "avatar": {
+      "agent": "Tác tử AI",
       "presence": {
         "online": "Trực tuyến",
         "away": "Vắng mặt",
@@ -780,6 +786,7 @@
     "trendCurrent": "hiện tại",
     "heatmapSummary": "Bản đồ nhiệt {rows} × {columns}",
     "heatmapHighest": "Cao nhất: {value} tại {row}, {column}",
+    "noData": "Không có dữ liệu",
     "heatmapNoData": "Không có dữ liệu",
     "heatmapTop": "Hạng {rank}",
     "heatmapLegend": "Thang màu",

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

@@ -261,9 +261,25 @@ export type AvatarProp = React.ComponentPropsWithoutRef<"span"> & {
      * a presence dot never carries visible text; that is `Badge status`.
      */
     presenceLabel?: LabelProp;
+    /**
+     * Who the mark stands for. `person` (default) is inert — no attribute, no node. `agent` marks an
+     * AI agent: a small "AI" tag at the block-start/inline-end corner (the corner `presence` does not
+     * use) plus a localized visually hidden "AI agent" folded into the avatar's accessible text, so the
+     * difference is never carried by the tag's colour alone (WCAG 1.4.1). Same vocabulary as
+     * `OrgChartNode.variant`.
+     */
+    kind?: AvatarKindProp;
     className?: ClassNameProp;
     children?: ChildrenProp;
 };
+/**
+ * Who an Avatar stands for — a person or an AI agent. Deliberately the same two values as
+ * `OrgChartNodeVariantProp`, so an app that already knows a principal's kind passes it unchanged
+ * to both. Retune the agent tag with `--avatar-agent-*`.
+ *
+ * @see Avatar
+ */
+export type AvatarKindProp = "person" | "agent";
 /**
  * Avatar presence status — a person's realtime reachability.
  *
@@ -307,6 +323,17 @@ export type AvatarAppearanceProp = "default" | "tinted";
  */
 export type AvatarImageFitProp = "cover" | "contain";
 /** @see Badge */
+/**
+ * @see AgentBadge — the "AI agent" label beside a name (violet outline, pill, never wraps). The
+ * text-row half of telling an agent apart from a person; `Avatar kind="agent"` is the mark half.
+ */
+export type AgentBadgeProp = Omit<React.HTMLAttributes<HTMLElement>, "children"> & {
+    /** Render element — `span` (default; the label sits in a name's text line) or `div`. */
+    as?: "div" | "span";
+    /** Overrides the localized default label (`dataDisplay.avatar.agent`). */
+    children?: ChildrenProp;
+    className?: ClassNameProp;
+};
 export type BadgeProp = {
     /**
      * Render element — `div` (default) or `span` when the chip sits in a phrasing context where a
@@ -1325,6 +1352,8 @@ export type ImageProp = Omit<React.ImgHTMLAttributes<HTMLImageElement>, "alt" |
     fallback?: string;
     /** Painted over the frame until the picture loads. `true` = the plain muted block. */
     placeholder?: React.ReactNode | boolean;
+    /** Resolved source status, including cached-before-mount images. Error stays final for fallback. */
+    onStatusChange?: (status: "loading" | "loaded" | "error") => void;
     /** `false` = a plain picture, not clickable, not in its group. Default `true`. */
     preview?: boolean | ImagePreviewConfigProp;
     /**

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

@@ -1,5 +1,6 @@
 /** Layout component prop types — @see docs/COMPONENTS.md#layout */
 import type * as React from "react";
+import type { ImageProp } from "./data-display.prop.js";
 import type { ComponentType, ReactNode, SVGProps } from "react";
 import type { BreadcrumbProp, BreadcrumbCurrentItemProp, TitleProp, SubtitleProp, StatusProp, ExtraProp, FooterProp, PageDensityProp, DensityProp, PageContainerVariantProp, CenteredShellWidthProp, CenteredShellAlignProp, CenteredShellPresetProp, ErrorSurfaceModeProp, ErrorSurfaceStatusProp, AuthShellPresetProp, MobileShellHeightProp, MobileShellWidthProp, OrientationProp, TextAlignProp, TextToneProp, BreakpointProp, GapProp, PadProp, PadRawProp, ClassNameProp, ChildrenProp, IdProp, DisabledProp, DescriptionProp, ActionProp, IconProp, HeadingLevelProp, ToneProp, WidthProp, SizeProp, LabelProp, NameProp, PlaceholderProp } from "../vocabulary/index.js";
 import type { EmptyStateToneProp } from "./data-display.prop.js";
@@ -73,6 +74,13 @@ export type PageContainerProp = {
     titleRef?: React.Ref<HTMLHeadingElement>;
     /** @see PageContainerExtraProp */
     extra?: PageContainerExtraProp;
+    /**
+     * The page's Help control (gh#1494) — a `Button` that opens a help Sheet, or a link to the
+     * manual. It has ONE fixed place on every page: the inline end of the header row, after the
+     * `extra` actions, and still the last item at the inline end when those actions wrap. A page
+     * passing only `help` still gets a header. Pass one control; it is not a second action cluster.
+     */
+    help?: ReactNode;
     /**
      * FIXED chrome band between the page header and the scrolling body — a filter strip, a status
      * bar, a "channel workflow" rail. It is a first-class page-chrome slot precisely because the
@@ -454,6 +462,33 @@ export type PageInsetProp = React.HTMLAttributes<HTMLDivElement> & {
     children?: ChildrenProp;
     className?: ClassNameProp;
 };
+/** @see PageErrorBoundary — the render-prop form of `fallback`. */
+export type PageErrorBoundaryFallbackProp = (failure: {
+    /** What the page threw. */
+    error: unknown;
+    /** Draws the page again (e.g. a "Try again" button that re-renders without a reload). */
+    reset: () => void;
+}) => ReactNode;
+/**
+ * @see PageErrorBoundary — a page-level error boundary (gh#1494). A page that throws while
+ * rendering is replaced by an `ErrorSurface`; the shell around it stays.
+ */
+export type PageErrorBoundaryProp = {
+    children?: ChildrenProp;
+    /**
+     * What to draw instead of the page. Default: an `application` `ErrorSurface` (status 500,
+     * localized title and description, one "Reload page" action). A function receives
+     * `{ error, reset }`.
+     */
+    fallback?: ReactNode | PageErrorBoundaryFallbackProp;
+    /**
+     * Draw the page again whenever this value changes (compared with `Object.is`). The boundary
+     * already resets when the URL changes; pass a key for a change the URL does not show.
+     */
+    resetKey?: unknown;
+    /** Report the error (Sentry, a log endpoint). Replaces the development-time `console.error`. */
+    onError?: (error: unknown, info: React.ErrorInfo) => void;
+};
 /** @see AppShell */
 export type AppShellProp = {
     /** Phone destinations, using MobileShell tabBar children (3–5 links or Buttons with aria-current="page"). Only rendered in drawer navigation mode. Main/footer reserve the measured safe-area-inclusive height. */
@@ -463,6 +498,14 @@ export type AppShellProp = {
     /** Omit or pass null/false for a shell without the sidebar landmark or grid track. */
     sidebar?: ReactNode;
     children: ReactNode;
+    /**
+     * The page-level error boundary around `children` (gh#1494). Default `true`: a page that throws
+     * while rendering is replaced by an `ErrorSurface` inside `<main>`, and the sidebar, topbar and
+     * breadcrumb stay, so the user can navigate away; the boundary resets when the URL changes.
+     * Pass props to configure it (`{ fallback, resetKey, onError }`), or `false` when the app
+     * already wraps its pages in its own boundary.
+     */
+    errorBoundary?: boolean | Omit<PageErrorBoundaryProp, "children">;
     topbar?: ReactNode;
     topbarLeft?: ReactNode;
     topbarRight?: ReactNode;
@@ -1149,6 +1192,9 @@ export type SidebarItemProp = {
      * Nested rows — renders a collapsible submenu group (the parent reads active when any child is).
      * Honoured by BOTH `Sidebar` and `NavList` (gh#815): `NavList` used to map `items` straight to a
      * row, so a nested group type-checked, rendered as one flat row and lost its children silently.
+     * A child may carry `children` of its own (gh#1493): the group nests one level further, so a
+     * section can hold work area → sub-area → page (three clickable levels), and the collapsed-rail
+     * flyout lists the grandchildren under a labelled group.
      */
     children?: SidebarItemProp[];
 };
@@ -2594,8 +2640,12 @@ export type EditorialFilterFieldProp = {
 export type CatalogDetailProp = {
     /** `"sealed"` frames a product package instead of a card. */
     variant?: "card" | "sealed";
-    /** The picture — an `<img>` (or a link around one). */
-    media: ReactNode;
+    /** Custom media. Used when `image` is omitted. */
+    media?: ReactNode;
+    /** Kit-owned, source-keyed Image with loading skeleton and error fallback. Takes precedence over media. */
+    image?: Pick<ImageProp, "src" | "alt" | "width" | "height" | "fallback"> & {
+        priority?: boolean;
+    };
     /** The save toggle over the frame's corner (same shape as `CatalogCard`'s). */
     favorite?: CatalogCardProp["favorite"];
     /** A line under the frame (the picture's source, an official link). */

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

@@ -2,7 +2,7 @@
 import type * as React from "react";
 import type { ReactNode } from "react";
 import type { AffixProp, AffixTargetProp, ResponsiveGridColumnsProp, SidebarLinkComponentProp } from "./layout.prop.js";
-import type { ActionsProp, ChildrenProp, ClassNameProp, DisabledProp, ErrorProp, HasActiveFiltersProp, IdProp, LabelProp, OnClearFiltersProp, OnOpenChangeProp, OpenProp, DefaultOpenProp, PendingProp, PlaceholderProp, StickyProp, TextAlignProp } from "../vocabulary/index.js";
+import type { ActionsProp, AllowClearProp, ChildrenProp, ClassNameProp, DisabledProp, ErrorProp, HasActiveFiltersProp, IdProp, LabelProp, OnClearFiltersProp, OnOpenChangeProp, OpenProp, DefaultOpenProp, PendingProp, PlaceholderProp, RequiredProp, StickyProp, TextAlignProp } from "../vocabulary/index.js";
 import type { FormProp, SearchSelectOptionProp } from "./data-entry.prop.js";
 /**
  * Renders the canonical SearchInput as the FIRST control of the strip, with a token-owned
@@ -41,6 +41,17 @@ export type FilterBarFilterProp = {
     onSelectedChange?: (selected: string) => void;
     placeholder?: PlaceholderProp;
     disabled?: DisabledProp;
+    /**
+     * A SCOPE filter that is never empty — the branch, the month (gh#1495). The filter renders no
+     * ✕ and its control is `aria-required`; the bar's clear-all is still the consumer's `onClear`,
+     * which should leave a required filter at its value. Implies `allowClear={false}`.
+     */
+    required?: RequiredProp;
+    /**
+     * The per-filter ✕. Default `true`: a filter is optional by nature, "no filter" is its resting
+     * state. `false` hides it without marking the filter required (gh#1495).
+     */
+    allowClear?: AllowClearProp;
 };
 /**
  * Chips are pure consumer data — the lifecycle is: ADD by including the chip in `chips`, REMOVE
@@ -221,6 +232,9 @@ export type PaginationProp = {
     disabled?: DisabledProp;
     className?: ClassNameProp;
     onValueChange?: (page: number, pageSize: number) => void;
+    /** Pointer enter, focus or touch start on an enabled page/previous/next target. May repeat;
+     * preload/cache the target without changing the controlled value. Also applies in simple mode. */
+    onPageIntent?: (page: number) => void;
 };
 /** @see Pagination — control tier (Ant Design `size`: `small` → `sm`, `middle` → `md`). */
 export type PaginationSizeProp = "sm" | "md";

package/dist/props/registry.d.ts

@@ -847,6 +847,10 @@ export declare const COMPONENT_PROP_REGISTRY: {
         readonly group: "layout";
         readonly file: "components/layout.prop.ts";
         readonly vocabulary: readonly ["TitleProp", "SubtitleProp", "StatusProp", "ExtraProp", "FooterProp", "BreadcrumbProp", "BreadcrumbCurrentItemProp", "DensityProp", "PageContainerVariantProp", {
+            readonly field: "help";
+            readonly local: true;
+            readonly reason: "The page's ONE Help control (gh#1494), at a fixed place: the last item at the header row's inline end, after the `extra` actions. A single node, not an ActionsProp list.";
+        }, {
             readonly field: "toolbar";
             readonly local: true;
             readonly reason: "FIXED chrome band between the page header and the scrolling body (filter strip, status bar, channel workflow rail). Distinct from ExtraProp (header actions, inside the title row) and FooterProp (action bar after the body): it is the only slot that stays OUT of the `fill` scroll viewport while sharing the header/body gutters and measure, so a consumer never hand-lays `position: sticky` page chrome.";
@@ -1133,7 +1137,11 @@ export declare const COMPONENT_PROP_REGISTRY: {
     readonly AppShellProp: {
         readonly group: "layout";
         readonly file: "components/layout.prop.ts";
-        readonly vocabulary: readonly ["ChildrenProp", "BreakpointProp", {
+        readonly vocabulary: readonly ["ChildrenProp", {
+            readonly field: "errorBoundary";
+            readonly local: true;
+            readonly reason: "Page-level error boundary around `children` (gh#1494): `true` (default) keeps the shell when a page throws, an object configures PageErrorBoundary, `false` opts out.";
+        }, "BreakpointProp", {
             readonly field: "logoCompact";
             readonly local: true;
             readonly reason: "The brand node a narrow bar gets instead of `logo` — the consumer's own mark/viewBox, which a stylesheet cannot produce (gh#728).";
@@ -1929,7 +1937,11 @@ export declare const COMPONENT_PROP_REGISTRY: {
     readonly CatalogDetailProp: {
         readonly group: "layout";
         readonly file: "components/layout.prop.ts";
-        readonly vocabulary: readonly ["TitleProp", "ClassNameProp", {
+        readonly vocabulary: readonly [{
+            readonly field: "image";
+            readonly local: true;
+            readonly reason: "Kit-owned source-keyed media configuration.";
+        }, "TitleProp", "ClassNameProp", {
             readonly field: "variant";
             readonly local: true;
             readonly reason: "Card or sealed-product frame.";
@@ -2452,6 +2464,32 @@ export declare const COMPONENT_PROP_REGISTRY: {
             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 PageErrorBoundaryFallbackProp: {
+        readonly group: "layout";
+        readonly file: "components/layout.prop.ts";
+        readonly vocabulary: readonly [{
+            readonly field: "fallback";
+            readonly local: true;
+            readonly reason: "Render-prop form of PageErrorBoundary `fallback`: `({ error, reset }) => node` (gh#1494).";
+        }];
+    };
+    readonly PageErrorBoundaryProp: {
+        readonly group: "layout";
+        readonly file: "components/layout.prop.ts";
+        readonly vocabulary: readonly ["ChildrenProp", {
+            readonly field: "fallback";
+            readonly local: true;
+            readonly reason: "What replaces the page that threw — a node, or `({ error, reset }) => node`. Default: an application ErrorSurface with the kit's localized copy (gh#1494).";
+        }, {
+            readonly field: "resetKey";
+            readonly local: true;
+            readonly reason: "React error-boundary reset key (react-error-boundary's resetKeys, one value): a change draws the page again. The URL change already resets.";
+        }, {
+            readonly field: "onError";
+            readonly local: true;
+            readonly reason: "componentDidCatch reporter `(error, info)` for an error tracker.";
+        }];
+    };
     readonly ErrorSurfaceProp: {
         readonly group: "layout";
         readonly file: "components/layout.prop.ts";
@@ -3339,6 +3377,20 @@ export declare const COMPONENT_PROP_REGISTRY: {
         readonly file: "components/data-display.prop.ts";
         readonly vocabulary: readonly [];
     };
+    readonly AvatarKindProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display.prop.ts";
+        readonly vocabulary: readonly [];
+    };
+    readonly AgentBadgeProp: {
+        readonly group: "data-display";
+        readonly file: "components/data-display.prop.ts";
+        readonly vocabulary: readonly [{
+            readonly field: "as";
+            readonly local: true;
+            readonly reason: "Closed tag seam (div | span), the same one Badge carries, so the label stays valid HTML beside a name inside a link or a <button>.";
+        }, "ChildrenProp", "ClassNameProp"];
+    };
     readonly AvatarImageFitProp: {
         readonly group: "data-display";
         readonly file: "components/data-display.prop.ts";
@@ -4003,7 +4055,7 @@ export declare const COMPONENT_PROP_REGISTRY: {
     readonly FilterBarFilterProp: {
         readonly group: "navigation";
         readonly file: "components/navigation.prop.ts";
-        readonly vocabulary: readonly ["LabelProp", "PlaceholderProp", "DisabledProp"];
+        readonly vocabulary: readonly ["LabelProp", "PlaceholderProp", "DisabledProp", "RequiredProp", "AllowClearProp"];
     };
     readonly FilterBarChipProp: {
         readonly group: "navigation";
@@ -4018,7 +4070,11 @@ export declare const COMPONENT_PROP_REGISTRY: {
     readonly PaginationProp: {
         readonly group: "navigation";
         readonly file: "components/navigation.prop.ts";
-        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "ClassNameProp", "SizeProp"];
+        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "DisabledProp", "ClassNameProp", "SizeProp", {
+            readonly field: "onPageIntent";
+            readonly local: true;
+            readonly reason: "A page target intent event for cache/router preloading, separate from the controlled value channel; pointer enter, focus and touch start (gh#1472).";
+        }];
     };
     readonly PaginationSizeProp: {
         readonly group: "navigation";
@@ -5643,7 +5699,11 @@ export declare const COMPONENT_PROP_REGISTRY: {
     readonly ImageProp: {
         readonly group: "data-display";
         readonly file: "components/data-display.prop.ts";
-        readonly vocabulary: readonly ["ClassNameProp", "PlaceholderProp", {
+        readonly vocabulary: readonly [{
+            readonly field: "onStatusChange";
+            readonly local: true;
+            readonly reason: "Resolved image loading state, including cached images and fallback.";
+        }, "ClassNameProp", "PlaceholderProp", {
             readonly field: "src";
             readonly local: true;
             readonly reason: "The native img src attribute.";

package/dist/props/registry.js

@@ -861,6 +861,11 @@ const COMPONENT_PROP_REGISTRY = {
       "BreadcrumbCurrentItemProp",
       "DensityProp",
       "PageContainerVariantProp",
+      {
+        field: "help",
+        local: true,
+        reason: "The page's ONE Help control (gh#1494), at a fixed place: the last item at the header row's inline end, after the `extra` actions. A single node, not an ActionsProp list."
+      },
       {
         field: "toolbar",
         local: true,
@@ -1152,6 +1157,11 @@ const COMPONENT_PROP_REGISTRY = {
     file: "components/layout.prop.ts",
     vocabulary: [
       "ChildrenProp",
+      {
+        field: "errorBoundary",
+        local: true,
+        reason: "Page-level error boundary around `children` (gh#1494): `true` (default) keeps the shell when a page throws, an object configures PageErrorBoundary, `false` opts out."
+      },
       "BreakpointProp",
       {
         field: "logoCompact",
@@ -1590,9 +1600,17 @@ const COMPONENT_PROP_REGISTRY = {
       { field: "variant", local: true, reason: "inset (site search) or inline (collection row)." },
       { field: "count", local: true, reason: "Live count at the end of the inline row." },
       { field: "debounce", local: true, reason: "Settle delay in ms, as SearchInput.debounce." },
-      { field: "suggestions", local: true, reason: "Grouped suggestion rows under the box (gh#1447)." },
+      {
+        field: "suggestions",
+        local: true,
+        reason: "Grouped suggestion rows under the box (gh#1447)."
+      },
       { field: "suggestionsFooter", local: true, reason: "Last popup row linking to all results." },
-      { field: "suggestionsLabel", local: true, reason: "Accessible name of the suggestions listbox." },
+      {
+        field: "suggestionsLabel",
+        local: true,
+        reason: "Accessible name of the suggestions listbox."
+      },
       {
         field: "onQueryChange",
         local: true,
@@ -1874,6 +1892,7 @@ const COMPONENT_PROP_REGISTRY = {
     group: "layout",
     file: "components/layout.prop.ts",
     vocabulary: [
+      { field: "image", local: true, reason: "Kit-owned source-keyed media configuration." },
       "TitleProp",
       "ClassNameProp",
       { field: "variant", local: true, reason: "Card or sealed-product frame." },
@@ -2182,6 +2201,39 @@ const COMPONENT_PROP_REGISTRY = {
       }
     ]
   },
+  PageErrorBoundaryFallbackProp: {
+    group: "layout",
+    file: "components/layout.prop.ts",
+    vocabulary: [
+      {
+        field: "fallback",
+        local: true,
+        reason: "Render-prop form of PageErrorBoundary `fallback`: `({ error, reset }) => node` (gh#1494)."
+      }
+    ]
+  },
+  PageErrorBoundaryProp: {
+    group: "layout",
+    file: "components/layout.prop.ts",
+    vocabulary: [
+      "ChildrenProp",
+      {
+        field: "fallback",
+        local: true,
+        reason: "What replaces the page that threw \u2014 a node, or `({ error, reset }) => node`. Default: an application ErrorSurface with the kit's localized copy (gh#1494)."
+      },
+      {
+        field: "resetKey",
+        local: true,
+        reason: "React error-boundary reset key (react-error-boundary's resetKeys, one value): a change draws the page again. The URL change already resets."
+      },
+      {
+        field: "onError",
+        local: true,
+        reason: "componentDidCatch reporter `(error, info)` for an error tracker."
+      }
+    ]
+  },
   ErrorSurfaceProp: {
     group: "layout",
     file: "components/layout.prop.ts",
@@ -3453,6 +3505,24 @@ const COMPONENT_PROP_REGISTRY = {
     file: "components/data-display.prop.ts",
     vocabulary: []
   },
+  AvatarKindProp: {
+    group: "data-display",
+    file: "components/data-display.prop.ts",
+    vocabulary: []
+  },
+  AgentBadgeProp: {
+    group: "data-display",
+    file: "components/data-display.prop.ts",
+    vocabulary: [
+      {
+        field: "as",
+        local: true,
+        reason: "Closed tag seam (div | span), the same one Badge carries, so the label stays valid HTML beside a name inside a link or a <button>."
+      },
+      "ChildrenProp",
+      "ClassNameProp"
+    ]
+  },
   AvatarImageFitProp: {
     group: "data-display",
     file: "components/data-display.prop.ts",
@@ -4180,7 +4250,7 @@ const COMPONENT_PROP_REGISTRY = {
   FilterBarFilterProp: {
     group: "navigation",
     file: "components/navigation.prop.ts",
-    vocabulary: ["LabelProp", "PlaceholderProp", "DisabledProp"]
+    vocabulary: ["LabelProp", "PlaceholderProp", "DisabledProp", "RequiredProp", "AllowClearProp"]
   },
   FilterBarChipProp: {
     group: "navigation",
@@ -4195,7 +4265,18 @@ const COMPONENT_PROP_REGISTRY = {
   PaginationProp: {
     group: "navigation",
     file: "components/navigation.prop.ts",
-    vocabulary: ["ValueProp", "OnValueChangeProp", "DisabledProp", "ClassNameProp", "SizeProp"]
+    vocabulary: [
+      "ValueProp",
+      "OnValueChangeProp",
+      "DisabledProp",
+      "ClassNameProp",
+      "SizeProp",
+      {
+        field: "onPageIntent",
+        local: true,
+        reason: "A page target intent event for cache/router preloading, separate from the controlled value channel; pointer enter, focus and touch start (gh#1472)."
+      }
+    ]
   },
   PaginationSizeProp: {
     group: "navigation",
@@ -6260,6 +6341,11 @@ const COMPONENT_PROP_REGISTRY = {
     group: "data-display",
     file: "components/data-display.prop.ts",
     vocabulary: [
+      {
+        field: "onStatusChange",
+        local: true,
+        reason: "Resolved image loading state, including cached images and fallback."
+      },
       "ClassNameProp",
       "PlaceholderProp",
       { field: "src", local: true, reason: "The native img src attribute." },

package/dist/styles/alert-layout.css

@@ -243,6 +243,10 @@
     visibility: hidden;
   }
 
+  :root:has(.ui-overlay-modal) [data-sonner-toaster] {
+    pointer-events: none;
+  }
+
   .ui-skeleton-block {
     border-radius: var(--skeleton-radius, var(--radius));
     background: var(--skeleton-background, hsl(var(--muted)));

package/dist/styles/application.css

@@ -0,0 +1,24 @@
+
+@layer theme, base, vendor, components, utilities;
+@import "./vendor-sonner.css";
+@import "./vendor-day-picker.css";
+@import "./base.css";
+@import "./shell-layout.css";
+@import "./motion.css";
+@import "./layout.css";
+@import "./control.css";
+@import "./toggle.css";
+@import "./logo-layout.css";
+@import "./card-layout.css";
+@import "./text-layout.css";
+@import "./table-layout.css";
+@import "./dialog-layout.css";
+@import "./alert-layout.css";
+@import "./badge-layout.css";
+@import "./data-display-layout.css";
+@import "./data-entry-layout.css";
+@import "./form-layout.css";
+@import "./navigation-layout.css";
+@import "./chart-layout.css";
+@import "./float-button-layout.css";
+@import "./icon-layout.css";

package/dist/styles/badge-layout.css

@@ -94,4 +94,18 @@
     width: var(--badge-remove-icon-size);
     height: var(--badge-remove-icon-size);
   }
+
+  [data-slot="badge"][data-agent] {
+    border-color: hsl(var(--badge-agent-border, var(--agent)));
+    background-color: transparent;
+    color: hsl(var(--badge-agent-foreground, var(--text-agent)));
+    white-space: nowrap;
+  }
+
+  @media (forced-colors: active) {
+    [data-slot="badge"][data-agent] {
+      border-color: CanvasText;
+      color: CanvasText;
+    }
+  }
 }

package/dist/styles/base.css

@@ -174,6 +174,17 @@
 }
 
 @layer base {
+  :root {
+    color-scheme: light;
+  }
+
+  @media not print {
+    .dark,
+    :root[data-theme="dark"] {
+      color-scheme: dark;
+    }
+  }
+
   * {
     border-color: hsl(var(--border));
   }

package/dist/styles/control.css

@@ -138,6 +138,12 @@
     flex-shrink: 0;
   }
 
+  .ui-button--xs svg,
+  .ui-button--icon-xs svg {
+    width: var(--button-icon-size, var(--button-xs-icon-size));
+    height: var(--button-icon-size, var(--button-xs-icon-size));
+  }
+
   .ui-button {
     backdrop-filter: blur(var(--button-backdrop-blur-size))
       saturate(var(--surface-backdrop-saturate, 160%));
@@ -1945,9 +1951,13 @@
     max-block-size: var(--radix-popover-content-available-height);
     max-inline-size: min(
       var(--search-select-panel-max-width),
-      calc(100vw - var(--search-select-panel-viewport-inset))
+      calc(var(--popover-viewport-inline-size, 100vw) - var(--search-select-panel-viewport-inset))
+    );
+    min-inline-size: min(
+      var(--radix-popover-trigger-width),
+      var(--search-select-panel-max-width),
+      calc(var(--popover-viewport-inline-size, 100vw) - var(--search-select-panel-viewport-inset))
     );
-    min-inline-size: var(--radix-popover-trigger-width);
   }
 
   .ui-search-select-panel[data-popup-match="content"] {
@@ -1955,8 +1965,16 @@
   }
 
   .ui-search-select-panel[data-popup-match="fixed"] {
-    min-inline-size: var(--search-select-panel-inline-size);
-    inline-size: var(--search-select-panel-inline-size);
+    min-inline-size: min(
+      var(--search-select-panel-inline-size, var(--radix-popover-trigger-width)),
+      var(--search-select-panel-max-width),
+      calc(var(--popover-viewport-inline-size, 100vw) - var(--search-select-panel-viewport-inset))
+    );
+    inline-size: min(
+      var(--search-select-panel-inline-size, var(--radix-popover-trigger-width)),
+      var(--search-select-panel-max-width),
+      calc(var(--popover-viewport-inline-size, 100vw) - var(--search-select-panel-viewport-inset))
+    );
   }
 
   .ui-search-select-selected-icon {
@@ -2243,6 +2261,12 @@
       var(--menu-content-min-width),
       var(--trigger-width, var(--menu-content-min-width))
     );
+
+    inline-size: max-content;
+    max-inline-size: min(
+      var(--select-content-max-width),
+      calc(100vw - var(--select-content-viewport-inset))
+    );
     overflow: hidden;
     border-radius: var(--radius-md, calc(var(--radius) / var(--radius-ratio)));
     border: var(--stroke-hairline) solid hsl(var(--border));
@@ -2262,6 +2286,7 @@
   .ui-select-content[data-popup-match="fixed"] {
     min-width: var(--select-content-inline-size);
     width: var(--select-content-inline-size);
+    max-inline-size: none;
   }
 
   .ui-select-viewport {
@@ -2287,21 +2312,9 @@
       calc(var(--radius) / var(--radius-ratio) / var(--radius-ratio))
     );
     padding-inline: var(--menu-item-space-inline);
-    height: var(--menu-item-height);
-    display: flex;
-    align-items: center;
-    gap: var(--menu-item-space-gap);
-    font-size: var(--menu-item-font-size);
-  }
-
-  .ui-select-item,
-  .ui-select-label {
-    border-radius: var(
-      --menu-item-radius,
-      calc(var(--radius) / var(--radius-ratio) / var(--radius-ratio))
-    );
-    padding-inline: var(--menu-item-space-inline);
-    height: var(--menu-item-height);
+    height: auto;
+    min-height: var(--menu-item-height);
+    padding-block: max(0px, calc((var(--menu-item-height) - 1lh) / 2));
     display: flex;
     align-items: center;
     gap: var(--menu-item-space-gap);

package/dist/styles/core.css

@@ -8,6 +8,7 @@
 @import "./shell-layout.css";
 @import "./motion.css";
 @import "./layout.css";
+@import "./editorial-layout.css";
 @import "./editorial-account-layout.css";
 @import "./control.css";
 @import "./toggle.css";