@exponential_app/eui-react 0.11.0 → 0.12.0

package/dist/types/surface.d.ts

@@ -1,5 +1,5 @@
 import { type CSSProperties, type ReactNode, type Ref } from "react";
-import type { ModeName, ResolvedTheme, ScrollAlign, ThemeIssue, ThemeSource, UiNode, SurfaceCommand } from "@exponential_app/eui";
+import type { FormFactor, ModeName, ResolvedTheme, ScrollAlign, ThemeIssue, ThemeSource, UiNode, SurfaceCommand } from "@exponential_app/eui";
 import { type DataModel } from "@exponential_app/eui/web";
 import { type ReactExtension } from "./extensions.js";
 import type { HostPlugin } from "./host.js";
@@ -73,6 +73,10 @@ export interface ExponentialSurfaceProps {
      *  not feed back into its own measurement). The gpui host passes 0 (=
      *  unknown) today, so the default keeps web and desktop identical. */
     viewportHeight?: number;
+    /** VAPP-218: the HOST's form factor, what `@media (form-factor: …)`
+     *  matches (an editor preview's phone frame, a phone). Default: derived
+     *  from the surface width (`phone` below the theme's `$breakpoint.md`). */
+    formFactor?: FormFactor;
     /** An explicit id (defaults to React's `useId`); must be unique per page. */
     id?: string;
     /** Host → surface commands (focus, announce, scrollIntoView). */
@@ -108,6 +112,8 @@ export interface LayoutInputs {
     breakpoints: Record<string, number>;
     queries: readonly string[];
     viewportHeight: number | undefined;
+    /** Unset = derived from the width against `breakpoints.md`. */
+    formFactor?: FormFactor;
     hover: boolean;
     reducedMotion: boolean;
 }
@@ -122,4 +128,4 @@ export declare function surfaceLayout(box: SurfaceBox, inputs: LayoutInputs): {
  *  inline `data={{ items, filter }}` with stable values costs one pass over
  *  its top-level keys). */
 export declare function sameData(a: unknown, b: unknown): boolean;
-export declare function ExponentialSurface({ surface, root: rootProp, templates: templatesProp, data: dataProp, theme: themeProp, mode: modeSetting, density, contrast, locale, timeZone, strings: stringOverrides, readOnly, host, extensions: extensionsProp, states, measure, inlineOverlays, direction: directionProp, width, viewportHeight, id: idProp, handleRef, className, style, children, }: ExponentialSurfaceProps): import("react/jsx-runtime").JSX.Element;
+export declare function ExponentialSurface({ surface, root: rootProp, templates: templatesProp, data: dataProp, theme: themeProp, mode: modeSetting, density, contrast, locale, timeZone, strings: stringOverrides, readOnly, host, extensions: extensionsProp, states, measure, inlineOverlays, direction: directionProp, width, viewportHeight, formFactor, id: idProp, handleRef, className, style, children, }: ExponentialSurfaceProps): import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@exponential_app/eui-react",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "Exponential UI for React: the reference renderer of the core A2UI catalog on Radix with real CSS, runtime themes, extensions, and the shadcn primitive set the Exponential app shares.",
   "license": "Apache-2.0",
   "homepage": "https://exponential.at/ui/",
@@ -42,7 +42,7 @@
     "*.css"
   ],
   "dependencies": {
-    "@exponential_app/eui": "^0.11.0",
+    "@exponential_app/eui": "^0.12.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "lucide-react": "^0.544.0",