@multiplatform.one/forms 7.71.0 → 7.73.0

package/dist/jsx/shared/floatingList.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["transitionProps","useCallback","useEffect","useRef","CaretDownIcon","CaretUpIcon","useResolvedKnobs","View","FocusContext","jsx","dropdownMaxRadiusTokenNum","clampDropdownRadius","fieldRadius","startsWith","num","Number","parseInt","slice","SyncFocusToOpen","open","setFocused","useStyledContext","scrollArrowThreshold","ScrollArrow","direction","scrollRef","visible","arrowScrollDirRef","isUp","animationFrameRef","lastTimeRef","resumeTimerRef","hoveringRef","activeRef","selfScrollingRef","resumeDelay","stopLoop","current","cancelAnimationFrame","startLoop","performance","now","tick","el","elapsed","px","Math","min","max","scrollTop","scrollHeight","clientHeight","requestAnimationFrame","openTimestampRef","handlePointerEnter","wasOverOnOpen","clearTimeout","setTimeout","handlePointerLeave","onScroll","addEventListener","passive","removeEventListener","Icon","knobProps","iconSize","controlIcon","width","position","top","bottom","height","zIndex","children","String","left","right","alignItems","justifyContent","pointerEvents","opacity","motion","control","style","background","onPointerEnter","onPointerLeave","lineHeight","size"],"sources":["../../../src/shared/floatingList.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,eAAA,QAAuB;AAChC,SAAyBC,WAAA,EAAaC,SAAA,EAAWC,MAAA,QAAc;AAC/D,SAASC,aAAA,EAAeC,WAAA,QAAmB;AAC3C,SAASC,gBAAA,QAAwB;AACjC,SAASC,IAAA,QAAY;AACrB,SAASC,YAAA,QAAoB;AA2KnB,SAAAC,GAAA;AAzKV,MAAMC,yBAAA,GAA4B;AAE3B,SAASC,oBAAoBC,WAAA,EAAiC;EACnE,IAAIA,WAAA,KAAgB,MAAM,OAAO;EACjC,IAAI,OAAOA,WAAA,KAAgB,YAAYA,WAAA,CAAYC,UAAA,CAAW,GAAG,GAAG;IAClE,MAAMC,GAAA,GAAMC,MAAA,CAAOC,QAAA,CAASJ,WAAA,CAAYK,KAAA,CAAM,CAAC,GAAG,EAAE;IACpD,OAAOH,GAAA,GAAMJ,yBAAA,GAA4B,IAAIA,yBAAyB,KAAKE,WAAA;EAC7E;EACA,OAAOA,WAAA;AACT;AAEO,SAASM,gBAAgB;EAAEC;AAAK,GAAsB;EAC3D,MAAM;IAAEC;EAAW,IAAIZ,YAAA,CAAaa,gBAAA,CAAiB;EACrDnB,SAAA,CAAU,MAAM;IACdkB,UAAA,CAAWD,IAAI;EACjB,GAAG,CAACA,IAAA,EAAMC,UAAU,CAAC;EACrB,OAAO;AACT;AAEO,MAAME,oBAAA,GAAuB;AAI7B,SAASC,YAAY;EAC1BC,SAAA;EACAC,SAAA;EACAC,OAAA;EACAC;AACF,GAKG;EACD,MAAMC,IAAA,GAAOJ,SAAA,KAAc;EAC3B,MAAMK,iBAAA,GAAoB1B,MAAA,CAAO,CAAC;EAClC,MAAM2B,WAAA,GAAc3B,MAAA,CAAO,CAAC;EAC5B,MAAM4B,cAAA,GAAiB5B,MAAA,CAA6C,IAAI;EACxE,MAAM6B,WAAA,GAAc7B,MAAA,CAAO,KAAK;EAChC,MAAM8B,SAAA,GAAY9B,MAAA,CAAO,KAAK;EAC9B,MAAM+B,gBAAA,GAAmB/B,MAAA,CAAO,KAAK;EACrC,MAAMgC,WAAA,GAAc;EAEpB,MAAMC,QAAA,GAAWnC,WAAA,CAAY,MAAM;IACjCgC,SAAA,CAAUI,OAAA,GAAU;IACpBC,oBAAA,CAAqBT,iBAAA,CAAkBQ,OAAO;IAC9CR,iBAAA,CAAkBQ,OAAA,GAAU;EAC9B,GAAG,EAAE;EAEL,MAAME,SAAA,GAAYtC,WAAA,CAAY,MAAM;IAClC,IAAIgC,SAAA,CAAUI,OAAA,IAAW,CAACL,WAAA,CAAYK,OAAA,EAAS;IAC/CJ,SAAA,CAAUI,OAAA,GAAU;IACpBP,WAAA,CAAYO,OAAA,GAAUG,WAAA,CAAYC,GAAA,CAAI;IACtC,MAAMC,IAAA,GAAOA,CAAA,KAAM;MACjB,MAAMC,EAAA,GAAKlB,SAAA,CAAUY,OAAA;MACrB,IAAI,CAACM,EAAA,IAAM,CAACX,WAAA,CAAYK,OAAA,IAAW,CAACJ,SAAA,CAAUI,OAAA,EAAS;QACrDJ,SAAA,CAAUI,OAAA,GAAU;QACpB;MACF;MACA,MAAMI,GAAA,GAAMD,WAAA,CAAYC,GAAA,CAAI;MAC5B,MAAMG,OAAA,GAAUH,GAAA,GAAMX,WAAA,CAAYO,OAAA;MAClCP,WAAA,CAAYO,OAAA,GAAUI,GAAA;MACtB,MAAMI,EAAA,GAAKC,IAAA,CAAKC,GAAA,CACdH,OAAA,GAAU,GACVE,IAAA,CAAKE,GAAA,CAAIpB,IAAA,GAAOe,EAAA,CAAGM,SAAA,GAAYN,EAAA,CAAGO,YAAA,GAAeP,EAAA,CAAGQ,YAAA,GAAeR,EAAA,CAAGM,SAAA,EAAW,CAAC,CACpF;MACA,IAAIJ,EAAA,GAAK,GAAG;QACVX,gBAAA,CAAiBG,OAAA,GAAU;QAC3BV,iBAAA,CAAkBU,OAAA,GAAUT,IAAA,GAAO,OAAO;QAC1Ce,EAAA,CAAGM,SAAA,IAAarB,IAAA,GAAO,CAACiB,EAAA,GAAKA,EAAA;MAC/B;MACAhB,iBAAA,CAAkBQ,OAAA,GAAUe,qBAAA,CAAsBV,IAAI;IACxD;IACAb,iBAAA,CAAkBQ,OAAA,GAAUe,qBAAA,CAAsBV,IAAI;EACxD,GAAG,CAACd,IAAA,EAAMH,SAAS,CAAC;EAEpB,MAAM4B,gBAAA,GAAmBlD,MAAA,CAAO,CAAC;EACjCD,SAAA,CAAU,MAAM;IACdmD,gBAAA,CAAiBhB,OAAA,GAAUG,WAAA,CAAYC,GAAA,CAAI;EAC7C,GAAG,CAACf,OAAO,CAAC;EAEZ,MAAM4B,kBAAA,GAAqBrD,WAAA,CAAY,MAAM;IAC3C+B,WAAA,CAAYK,OAAA,GAAU;IACtB,MAAMO,OAAA,GAAUJ,WAAA,CAAYC,GAAA,CAAI,IAAIY,gBAAA,CAAiBhB,OAAA;IACrD,MAAMkB,aAAA,GAAgBX,OAAA,GAAU;IAChC,IAAIW,aAAA,EAAe;MACjB,IAAIxB,cAAA,CAAeM,OAAA,EAASmB,YAAA,CAAazB,cAAA,CAAeM,OAAO;MAC/DN,cAAA,CAAeM,OAAA,GAAUoB,UAAA,CAAW,MAAM;QACxC1B,cAAA,CAAeM,OAAA,GAAU;QACzB,IAAIL,WAAA,CAAYK,OAAA,EAASE,SAAA,CAAU;MACrC,GAAG,GAAG;IACR,OAAO;MACLA,SAAA,CAAU;IACZ;EACF,GAAG,CAACA,SAAS,CAAC;EAEd,MAAMmB,kBAAA,GAAqBzD,WAAA,CAAY,MAAM;IAC3C+B,WAAA,CAAYK,OAAA,GAAU;IACtB,IAAIN,cAAA,CAAeM,OAAA,EAAS;MAC1BmB,YAAA,CAAazB,cAAA,CAAeM,OAAO;MACnCN,cAAA,CAAeM,OAAA,GAAU;IAC3B;IACAD,QAAA,CAAS;EACX,GAAG,CAACA,QAAQ,CAAC;EAEblC,SAAA,CAAU,MAAM;IACd,MAAMyC,EAAA,GAAKlB,SAAA,CAAUY,OAAA;IACrB,IAAI,CAACM,EAAA,IAAM,CAACjB,OAAA,EAAS;IACrB,MAAMiC,QAAA,GAAWA,CAAA,KAAM;MACrB,IAAIzB,gBAAA,CAAiBG,OAAA,EAAS;QAC5BH,gBAAA,CAAiBG,OAAA,GAAU;QAC3B;MACF;MACA,IAAI,CAACL,WAAA,CAAYK,OAAA,EAAS;MAC1BD,QAAA,CAAS;MACT,IAAIL,cAAA,CAAeM,OAAA,EAASmB,YAAA,CAAazB,cAAA,CAAeM,OAAO;MAC/DN,cAAA,CAAeM,OAAA,GAAUoB,UAAA,CAAW,MAAM;QACxC1B,cAAA,CAAeM,OAAA,GAAU;QACzB,IAAIL,WAAA,CAAYK,OAAA,EAASE,SAAA,CAAU;MACrC,GAAGJ,WAAW;IAChB;IACAQ,EAAA,CAAGiB,gBAAA,CAAiB,UAAUD,QAAA,EAAU;MAAEE,OAAA,EAAS;IAAK,CAAC;IACzD,OAAO,MAAMlB,EAAA,CAAGmB,mBAAA,CAAoB,UAAUH,QAAQ;EACxD,GAAG,CAAClC,SAAA,EAAWC,OAAA,EAASa,SAAA,EAAWH,QAAQ,CAAC;EAE5ClC,SAAA,CACE,MAAM,MAAM;IACVwD,kBAAA,CAAmB;EACrB,GACA,CAACA,kBAAkB,CACrB;EAEA,MAAMK,IAAA,GAAOnC,IAAA,GAAOvB,WAAA,GAAcD,aAAA;EAClC,MAAM;IAAE4D;EAAU,IAAI1D,gBAAA,CAAiB;EACvC,MAAM2D,QAAA,GAAWD,SAAA,CAAUE,WAAA,CAAYC,KAAA;EAEvC,OACE,eAAA1D,GAAA,CAACF,IAAA;IACC6D,QAAA,EAAS;IACTC,GAAA,EAAKzC,IAAA,GAAO,IAAI;IAChB0C,MAAA,EAAQ1C,IAAA,GAAO,SAAY;IAC3B2C,MAAA,EAAQ;IACRC,MAAA,EAAQ;IAERC,QAAA,iBAAAhE,GAAA,CAACF,IAAA;MACC,yBAAsB;MACtB,kBAAgBiB,SAAA;MAChB,kBAAgBkD,MAAA,CAAOT,QAAQ;MAC/BG,QAAA,EAAS;MACTO,IAAA,EAAM;MACNC,KAAA,EAAO;MACPP,GAAA,EAAKzC,IAAA,GAAO,IAAI;MAChB0C,MAAA,EAAQ1C,IAAA,GAAO,SAAY;MAC1B,GAAGoC,SAAA,CAAUE,WAAA;MACdC,KAAA,EAAM;MACNU,UAAA,EAAW;MACXC,cAAA,EAAe;MACfC,aAAA,EAAerD,OAAA,GAAU,SAAS;MAClCsD,OAAA,EAAStD,OAAA,GAAU,IAAI;MACtB,GAAG1B,eAAA,CAAgBgE,SAAA,CAAUiB,MAAA,CAAOC,OAAO;MAC5CC,KAAA,EAAO;QACLC,UAAA,EAAYxD,IAAA,GACR,mEACA;MACN;MACAyD,cAAA,EAAgB3D,OAAA,GAAU4B,kBAAA,GAAqB;MAC/CgC,cAAA,EAAgB5B,kBAAA;MAEhBe,QAAA,iBAAAhE,GAAA,CAACF,IAAA;QAAK6D,QAAA,EAAS;QAAWI,MAAA,EAAQ;QAAI,GAAGR,SAAA,CAAUE,WAAA;QAAaiB,KAAA,EAAO;UAAEI,UAAA,EAAY;QAAE;QACrFd,QAAA,iBAAAhE,GAAA,CAACsD,IAAA;UAAKyB,IAAA,EAAMvB;QAAA,CAAU;MAAA,CACxB;IAAA,CACF;EAAA,CACF;AAEJ","ignoreList":[]}
+{"version":3,"names":["transitionProps","useCallback","useEffect","useRef","useState","CaretDownIcon","CaretUpIcon","useResolvedKnobs","View","FocusContext","jsx","dropdownMaxRadiusTokenNum","clampDropdownRadius","fieldRadius","startsWith","num","Number","parseInt","slice","SyncFocusToOpen","open","setFocused","useStyledContext","scrollArrowThreshold","ScrollArrow","direction","scrollRef","visible","arrowScrollDirRef","topOffset","bottomOffset","isUp","animationFrameRef","lastTimeRef","resumeTimerRef","hoveringRef","activeRef","selfScrollingRef","resumeDelay","stopLoop","current","cancelAnimationFrame","startLoop","performance","now","tick","el","elapsed","px","Math","min","max","scrollTop","scrollHeight","clientHeight","requestAnimationFrame","openTimestampRef","handlePointerEnter","wasOverOnOpen","clearTimeout","setTimeout","handlePointerLeave","onScroll","addEventListener","passive","removeEventListener","panelFill","setPanelFill","getComputedStyle","fill","backgroundColor","Icon","knobProps","iconSize","controlIcon","width","position","top","bottom","height","zIndex","children","String","left","right","alignItems","justifyContent","pointerEvents","opacity","motion","control","style","background","onPointerEnter","onPointerLeave","lineHeight","size"],"sources":["../../../src/shared/floatingList.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/shared/floatingList.native.js

@@ -64,7 +64,9 @@ function ScrollArrow(param) {
     direction,
     scrollRef,
     visible,
-    arrowScrollDirRef
+    arrowScrollDirRef,
+    topOffset = 0,
+    bottomOffset = 0
   } = param;
   var isUp = direction === "up";
   var animationFrameRef = (0, import_react.useRef)(0);
@@ -156,6 +158,13 @@ function ScrollArrow(param) {
       handlePointerLeave();
     };
   }, [handlePointerLeave]);
+  var [panelFill, setPanelFill] = (0, import_react.useState)("var(--background)");
+  (0, import_react.useEffect)(function () {
+    if (!visible || typeof getComputedStyle !== "function") return;
+    var el = scrollRef.current;
+    var fill = el ? getComputedStyle(el).backgroundColor : "";
+    if (fill && fill !== "transparent" && fill !== "rgba(0, 0, 0, 0)") setPanelFill(fill);
+  }, [visible, scrollRef]);
   var Icon = isUp ? import_react2.CaretUpIcon : import_react2.CaretDownIcon;
   var {
     knobProps
@@ -163,8 +172,8 @@ function ScrollArrow(param) {
   var iconSize = knobProps.controlIcon.width;
   return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
     position: "sticky",
-    top: isUp ? 0 : void 0,
-    bottom: isUp ? void 0 : 0,
+    top: isUp ? topOffset : void 0,
+    bottom: isUp ? void 0 : bottomOffset,
     height: 0,
     zIndex: 2,
     children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
@@ -183,8 +192,10 @@ function ScrollArrow(param) {
       pointerEvents: visible ? "auto" : "none",
       opacity: visible ? 1 : 0,
       ...(0, import_theme.transitionProps)(knobProps.motion.control),
+      // The fade is the panel's own fill: an elevated dark panel is a step
+      // above the theme ground, and a ground-coloured fade read as a band.
       style: {
-        background: isUp ? "linear-gradient(to bottom, var(--background) 40%, transparent)" : "linear-gradient(to top, var(--background) 40%, transparent)"
+        background: isUp ? `linear-gradient(to bottom, ${panelFill} 40%, transparent)` : `linear-gradient(to top, ${panelFill} 40%, transparent)`
       },
       onPointerEnter: visible ? handlePointerEnter : void 0,
       onPointerLeave: handlePointerLeave,

package/dist/jsx/shared/floatingList.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","floatingList_exports","ScrollArrow","SyncFocusToOpen","clampDropdownRadius","scrollArrowThreshold","module","exports","import_jsx_runtime","require","import_theme","import_react","import_react2","import_theme2","import_tamagui","import_InputParts","dropdownMaxRadiusTokenNum","fieldRadius","startsWith","num","Number","parseInt","slice","param","open","setFocused","FocusContext","useStyledContext","useEffect","direction","scrollRef","visible","arrowScrollDirRef","isUp","animationFrameRef","useRef","lastTimeRef","resumeTimerRef","hoveringRef","activeRef","selfScrollingRef","resumeDelay","stopLoop","useCallback","current","cancelAnimationFrame","startLoop","performance","now","tick","tick1","el","elapsed","px","Math","min","max","scrollTop","scrollHeight","clientHeight","requestAnimationFrame","openTimestampRef","handlePointerEnter","wasOverOnOpen","clearTimeout","setTimeout","handlePointerLeave","onScroll","onScroll2","addEventListener","passive","removeEventListener"],"sources":["../../../src/shared/floatingList.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","floatingList_exports","ScrollArrow","SyncFocusToOpen","clampDropdownRadius","scrollArrowThreshold","module","exports","import_jsx_runtime","require","import_theme","import_react","import_react2","import_theme2","import_tamagui","import_InputParts","dropdownMaxRadiusTokenNum","fieldRadius","startsWith","num","Number","parseInt","slice","param","open","setFocused","FocusContext","useStyledContext","useEffect","direction","scrollRef","visible","arrowScrollDirRef","topOffset","bottomOffset","isUp","animationFrameRef","useRef","lastTimeRef","resumeTimerRef","hoveringRef","activeRef","selfScrollingRef","resumeDelay","stopLoop","useCallback","current","cancelAnimationFrame","startLoop","performance","now","tick","tick1","el","elapsed","px","Math","min","max","scrollTop","scrollHeight","clientHeight","requestAnimationFrame","openTimestampRef","handlePointerEnter","wasOverOnOpen","clearTimeout","setTimeout","handlePointerLeave","onScroll","onScroll2","addEventListener","passive","removeEventListener","panelFill","setPanelFill","useState","getComputedStyle","fill","backgroundColor"],"sources":["../../../src/shared/floatingList.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@multiplatform.one/forms",
-  "version": "7.71.0",
+  "version": "7.73.0",
   "description": "Cross-platform form components with URL state management",
   "keywords": [
     "cross-platform",
@@ -57,10 +57,10 @@
   },
   "dependencies": {
     "@floating-ui/react": "^0.27.20",
-    "@multiplatform.one/platform": "^7.71.0",
-    "@multiplatform.one/router": "^7.71.0",
-    "@multiplatform.one/table-primitives": "^7.71.0",
-    "@multiplatform.one/theme": "^7.71.0",
+    "@multiplatform.one/platform": "^7.73.0",
+    "@multiplatform.one/router": "^7.73.0",
+    "@multiplatform.one/table-primitives": "^7.73.0",
+    "@multiplatform.one/theme": "^7.73.0",
     "@phosphor-icons/react": "^2.1.10",
     "@tamagui/get-font-sized": "2.7.6",
     "@tamagui/get-token": "2.7.6",
@@ -80,9 +80,9 @@
   },
   "devDependencies": {
     "@expo/ui": "~55.0.17",
-    "@multiplatform.one/config": "7.71.0",
-    "@multiplatform.one/storybook": "7.71.0",
-    "@multiplatform.one/test-utils": "7.71.0",
+    "@multiplatform.one/config": "7.73.0",
+    "@multiplatform.one/storybook": "7.73.0",
+    "@multiplatform.one/test-utils": "7.73.0",
     "@tamagui/build": "2.7.6",
     "@tamagui/config": "2.7.6",
     "@tamagui/vite-plugin": "2.7.6",

package/src/Button/circleGlyph.ts

@@ -0,0 +1,6 @@
+/**
+ * LC-176: a glyph on a circle the caller asked for (`circular`, `outlined`)
+ * fills this share of the circle, the iOS Settings and Contacts leading-icon
+ * ratio, never a small glyph lost in a big plate.
+ */
+export const ICON_BUTTON_CIRCLE_GLYPH_RATIO = 0.58;

package/src/Button/index.tsx

@@ -7,6 +7,7 @@ import {
   createElement,
   isValidElement,
   useCallback,
+  useEffect,
   useId,
   useState,
   type ComponentType,
@@ -72,10 +73,14 @@ import { formatActionLabel } from "../actionLabel";
 import { formButtonColors, formCommonColors } from "../shared/colorRamps";
 import { warnBareDisabled, warnPositiveTabIndex, warnSizeRecipeEscape } from "../shared/devWarn";
 import { useControlGrouped } from "../shared/groupContext";
+import { useInPanelEcho, usePanelTriggerRadiusReporter } from "../FloatingPanel/echoContext";
 import { loadGlassView } from "./glass";
 import { MEDIA_PLATE_WEB_STYLE } from "./mediaPlate";
+import { ICON_BUTTON_CIRCLE_GLYPH_RATIO } from "./circleGlyph";
 import { useIconButtonGroupGround, useIconButtonGroupMember } from "./iconButtonGroupContext";
 
+export { ICON_BUTTON_CIRCLE_GLYPH_RATIO };
+
 /**
  * Coordinated size recipe (Polaris slim/medium/large, Primer s/m/l, Linear
  * 28/32/40, Spectrum S/M, M3 XS/S). Height, pad, type, icon, gap and radius
@@ -435,13 +440,6 @@ export function iconButtonGlyphPx(rowLinePx: number | undefined): number {
   return Math.max(ICON_BUTTON_GLYPH_PX, Math.round(rowLinePx / PHOSPHOR_INK_RATIO));
 }
 
-/**
- * LC-176: a glyph on a circle the caller asked for (`circular`, `outlined`)
- * fills this share of the circle, the iOS Settings and Contacts leading-icon
- * ratio, never a small glyph lost in a big plate.
- */
-export const ICON_BUTTON_CIRCLE_GLYPH_RATIO = 0.58;
-
 /** LC-176: an inline glyph is the text's size; Phosphor's 256 grid pads ~12%. */
 const INLINE_GLYPH_RATIO = 1.2;
 
@@ -635,6 +633,17 @@ export function Button({
       : undefined;
   const paintedRadius = resolveControlRadius(recipe, radiusStop ?? "medium");
   const innerGap = paintedRadius.gap;
+  // LC-112 seamless cover (FZ-8438): a native menu covering this button
+  // repeats its arc, and the button's echo inside that menu draws no chrome.
+  const inPanelEcho = useInPanelEcho();
+  const reportRadius = usePanelTriggerRadiusReporter();
+  // A circle reports no cap: the menu takes half its short side.
+  const reportedRadius = circular ? Number.POSITIVE_INFINITY : paintedRadius.radius;
+  useEffect(() => {
+    if (reportRadius && !inPanelEcho && !Number.isNaN(reportedRadius)) {
+      reportRadius(reportedRadius);
+    }
+  }, [reportRadius, inPanelEcho, reportedRadius]);
   // The one Skeleton (forms), at the button's own recipe height.
   const boneHeight = nested ? knobProps.nestedControl.px : recipe.height;
   if (skeleton) {
@@ -1220,6 +1229,15 @@ export function Button({
             height: "100%",
           }
         : undefined)}
+      {...(inPanelEcho
+        ? {
+            borderColor: "transparent",
+            backgroundColor: "transparent",
+            elevation: undefined,
+            shadowColor: "transparent",
+            shadowOpacity: 0,
+          }
+        : undefined)}
       {...(resolvedRole ? { "data-mp-action-role": resolvedRole } : undefined)}
       {...(tier ? { "data-mp-tier": tier } : undefined)}
       {...(iconButton

package/src/FloatingPanel/FloatingPanel.echoStretch.spec.tsx

@@ -0,0 +1,67 @@
+/**
+ * LC-112 r3 (FZ-8438): when a consumer sets `panelWidth` and the panel opens
+ * wider than its field, the field's echo grows to the panel's end edge, so
+ * the value isn't cut short above rows that show it whole. A button echo, or
+ * an unset width, keeps the trigger's box.
+ */
+import { afterEach, describe, expect, it } from "vitest";
+import { placeEchoOverTrigger } from "./index";
+
+function panel(field: boolean) {
+  const el = document.createElement("div");
+  const row = document.createElement("div");
+  row.setAttribute("data-fp-trigger-row", "");
+  row.style.width = "260px";
+  const visual = document.createElement("div");
+  const snapshot = document.createElement("div");
+  snapshot.style.width = "260px";
+  snapshot.appendChild(document.createElement(field ? "input" : "span"));
+  visual.appendChild(snapshot);
+  row.appendChild(visual);
+  el.appendChild(row);
+  document.body.appendChild(el);
+  return { el, row, snapshot };
+}
+
+const geometry = { triggerLeft: 16, triggerRight: 276, panelLeft: 16, panelWidth: 360 };
+
+afterEach(() => {
+  document.body.replaceChildren();
+});
+
+describe("placeEchoOverTrigger stretch (LC-112 r3)", () => {
+  it("a field's echo grows from the field's start edge to the panel's end", () => {
+    const { el, row, snapshot } = panel(true);
+    placeEchoOverTrigger(el, geometry, { stretch: true });
+    expect(row.style.width).toBe("360px");
+    expect(snapshot.style.width).toBe("100%");
+    expect(row.style.translate).toBe("");
+  });
+
+  it("a panel slid to the start margin grows the echo only past the field's start", () => {
+    const { el, row } = panel(true);
+    placeEchoOverTrigger(el, { ...geometry, panelLeft: 10, panelWidth: 1420 }, { stretch: true });
+    expect(row.style.translate).toBe("6px 0");
+    expect(row.style.width).toBe("1414px");
+  });
+
+  it("an unset panelWidth keeps the trigger's box", () => {
+    const { el, row } = panel(true);
+    placeEchoOverTrigger(el, geometry);
+    expect(row.style.width).toBe("260px");
+  });
+
+  it("a button echo keeps its box, so a centred label never moves", () => {
+    const { el, row } = panel(false);
+    placeEchoOverTrigger(el, geometry, { stretch: true });
+    expect(row.style.width).toBe("260px");
+  });
+
+  it("a panel back at the trigger's width shrinks a stretched echo again", () => {
+    const { el, row, snapshot } = panel(true);
+    placeEchoOverTrigger(el, geometry, { stretch: true });
+    placeEchoOverTrigger(el, { ...geometry, panelWidth: 260 }, { stretch: true });
+    expect(row.style.width).toBe("260px");
+    expect(snapshot.style.width).toBe("");
+  });
+});

package/src/FloatingPanel/FloatingPanel.iconEcho.spec.tsx

@@ -0,0 +1,297 @@
+/**
+ * LC-112 icon trigger echo (FZ-8480, Clay's rv_2607879d3bdaf9bf): a panel
+ * that covers the icon button it opened from draws that button again in its
+ * exact spot, same size and plate, as an X (Round 37: every icon trigger,
+ * the + and a menu's button alike). It closes the panel and reads "Close".
+ */
+import { PlusIcon, XIcon } from "@phosphor-icons/react";
+import { renderWithProviders } from "@multiplatform.one/test-utils";
+import { fireEvent, render, waitFor, within } from "@testing-library/react";
+import { useState } from "react";
+import { Surface, useBarSurface } from "@multiplatform.one/theme";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { Text } from "tamagui";
+import { Button } from "../Button";
+import { FloatingPanel } from "./index";
+import { usePanelIconEchoBox } from "./echoContext";
+import { PanelHeader } from "./PanelHeader";
+import type { IconEcho } from "./iconEcho";
+
+type Rect = { x: number; y: number; width: number; height: number };
+
+function measure(trigger: Rect, panelWidth = 240, panelHeight = 160, surface?: Rect) {
+  const original = HTMLElement.prototype.getBoundingClientRect;
+  const rect = {
+    ...trigger,
+    top: trigger.y,
+    left: trigger.x,
+    right: trigger.x + trigger.width,
+    bottom: trigger.y + trigger.height,
+    toJSON: () => ({}),
+  };
+  vi.spyOn(HTMLElement.prototype, "getBoundingClientRect").mockImplementation(
+    function (this: HTMLElement) {
+      if (this.hasAttribute("data-fp-reference")) return rect;
+      if (surface && this.hasAttribute("data-fp-cover-surface")) {
+        return {
+          ...surface,
+          top: surface.y,
+          left: surface.x,
+          right: surface.x + surface.width,
+          bottom: surface.y + surface.height,
+          toJSON: () => ({}),
+        };
+      }
+      return original.call(this);
+    },
+  );
+  vi.spyOn(HTMLElement.prototype, "offsetWidth", "get").mockImplementation(
+    function (this: HTMLElement) {
+      return this.hasAttribute("data-fp-panel") ? panelWidth : 0;
+    },
+  );
+  vi.spyOn(HTMLElement.prototype, "scrollHeight", "get").mockImplementation(
+    function (this: HTMLElement) {
+      return this.hasAttribute("data-fp-panel") ? panelHeight : 0;
+    },
+  );
+}
+
+function EchoBoxProbe() {
+  const box = usePanelIconEchoBox();
+  return box ? (
+    <span
+      data-testid="echo-box"
+      data-height={box.height}
+      data-left={box.left}
+      data-right={box.right}
+    />
+  ) : null;
+}
+
+function AddPanel({ kind = "close", header = false }: { kind?: IconEcho; header?: boolean }) {
+  const [open, setOpen] = useState(false);
+  return (
+    <FloatingPanel
+      open={open}
+      onOpenChange={setOpen}
+      anchorMode="cover-trigger"
+      compactFace="menu"
+      triggerEcho={false}
+      iconEcho={kind}
+      coverAlign="auto"
+      widthMode="fit-content"
+      triggerSizing="content"
+      contentPadding="none"
+      trigger={<Button icon={PlusIcon} aria-label="Add node" />}
+    >
+      {header ? (
+        <PanelHeader>
+          <Text>Add a node</Text>
+          <EchoBoxProbe />
+        </PanelHeader>
+      ) : (
+        <Text>Add a node</Text>
+      )}
+      <Button>Copy</Button>
+    </FloatingPanel>
+  );
+}
+
+const glyphPath = (node: Element | null | undefined) =>
+  node?.querySelector("svg path")?.getAttribute("d");
+
+async function open(result: ReturnType<typeof renderWithProviders>) {
+  fireEvent.click(result.getByRole("button", { name: "Add node" }), { detail: 0 });
+  const panel = (await result.findByTestId("floating-panel-viewport")) as HTMLElement;
+  await waitFor(() => expect(panel.style.visibility).toBe("visible"));
+  return panel;
+}
+
+afterEach(() => {
+  vi.restoreAllMocks();
+});
+
+describe("LC-112 icon trigger echo on the web (FZ-8480)", () => {
+  const viewportWidth = () => document.documentElement.clientWidth || window.innerWidth;
+
+  it("draws the + again as an X on the button's exact box at the panel's top trailing corner", async () => {
+    const button = { x: viewportWidth() - 16 - 44, y: 12, width: 44, height: 44 };
+    measure(button, 240);
+    const result = renderWithProviders(<AddPanel />);
+    const panel = await open(result);
+    const panelLeft = button.x + button.width - 240;
+    expect(panel.style.top).toBe(`${button.y}px`);
+    expect(panel.style.left).toBe(`${panelLeft}px`);
+    const row = panel.querySelector<HTMLElement>("[data-fp-icon-echo]") as HTMLElement;
+    expect(row.style.order).toBe("-1");
+    expect(row.style.height).toBe(`${button.height}px`);
+    // The X shares the content's first row, like a sheet's close button: it
+    // takes no height of its own.
+    expect(row.getAttribute("data-fp-icon-echo")).toBe("overlay");
+    const borderTop = parseFloat(getComputedStyle(panel).borderTopWidth) || 0;
+    expect(row.style.marginBottom).toBe(`${-(button.height - borderTop)}px`);
+    const box = row.querySelector<HTMLElement>("[data-fp-icon-echo-box]") as HTMLElement;
+    expect(box.style.width).toBe(`${button.width}px`);
+    expect(box.style.height).toBe(`${button.height}px`);
+    expect(box.style.marginLeft).toBe(`${button.x - panelLeft}px`);
+    const echo = within(panel).getByRole("button", { name: "Close" });
+    const x = render(<XIcon weight="bold" />);
+    expect(glyphPath(echo)).toBe(glyphPath(x.container));
+    x.unmount();
+    expect(glyphPath(echo)).not.toBe(glyphPath(result.getByRole("button", { name: "Add node" })));
+    expect(panel.querySelector("[data-fp-trigger-row]")).toBeNull();
+  });
+
+  it("renders the echo on the trigger's bar surface, so it keeps the bar button's plate", async () => {
+    measure({ x: 16, y: 12, width: 44, height: 44 });
+    function BarProbe({ icon: _icon, ...rest }: { icon?: unknown; [key: string]: unknown }) {
+      const bar = useBarSurface();
+      const press = rest.onPress as (() => void) | undefined;
+      return (
+        <button
+          type="button"
+          aria-label={rest["aria-label"] as string}
+          data-bar={String(bar)}
+          onClick={() => press?.()}
+        />
+      );
+    }
+    const result = renderWithProviders(
+      <Surface bar>
+        <FloatingPanel
+          open
+          onOpenChange={() => {}}
+          anchorMode="cover-trigger"
+          compactFace="menu"
+          triggerEcho={false}
+          iconEcho="close"
+          coverAlign="auto"
+          widthMode="fit-content"
+          triggerSizing="content"
+          trigger={<BarProbe icon={PlusIcon} aria-label="Add node" />}
+        >
+          <Text>Add a node</Text>
+        </FloatingPanel>
+      </Surface>,
+    );
+    const panel = (await result.findByTestId("floating-panel-viewport")) as HTMLElement;
+    expect(within(panel).getByRole("button", { name: "Close" }).getAttribute("data-bar")).toBe(
+      "true",
+    );
+  });
+
+  it("covers a grouped trigger's whole plate, only the pressed trigger showing as its X", async () => {
+    const button = { x: viewportWidth() - 16 - 44, y: 12, width: 44, height: 44 };
+    const plate = { x: button.x - 100, y: 12, width: 144, height: 44 };
+    measure(button, 120, 160, plate);
+    const result = renderWithProviders(
+      <div data-fp-cover-surface="">
+        <Button icon={PlusIcon} aria-label="Search" />
+        <AddPanel kind="menu" />
+      </div>,
+    );
+    const panel = await open(result);
+    // The plate is wider than the menu, so the menu takes the plate's width
+    // and both edges.
+    expect(panel.style.left).toBe(`${plate.x}px`);
+    expect(panel.style.top).toBe(`${plate.y}px`);
+    const row = panel.querySelector<HTMLElement>("[data-fp-icon-echo]") as HTMLElement;
+    // The band covers the whole plate; the group's other buttons are covered,
+    // not echoed.
+    expect(row.getAttribute("data-fp-icon-echo")).toBe("band");
+    expect(row.style.height).toBe(`${plate.height}px`);
+    expect(row.querySelector("[data-fp-group-echo]")).toBeNull();
+    expect(within(panel).queryByRole("button", { name: "Search" })).toBeNull();
+    const box = row.querySelector<HTMLElement>("[data-fp-icon-echo-box]") as HTMLElement;
+    expect(box.style.marginLeft).toBe(`${button.x - plate.x}px`);
+    expect(within(panel).getByRole("button", { name: "Close" })).toBeTruthy();
+  });
+
+  it("closes the panel when the echo is pressed", async () => {
+    measure({ x: 16, y: 12, width: 44, height: 44 });
+    const result = renderWithProviders(<AddPanel />);
+    const panel = await open(result);
+    fireEvent.click(within(panel).getByRole("button", { name: "Close" }));
+    await waitFor(() => expect(result.queryByTestId("floating-panel-viewport")).toBeNull());
+  });
+
+  it("turns a menu trigger into an X too, in its own band", async () => {
+    measure({ x: 16, y: 12, width: 44, height: 44 });
+    const result = renderWithProviders(<AddPanel kind="menu" />);
+    const panel = await open(result);
+    const echo = within(panel).getByRole("button", { name: "Close" });
+    const x = render(<XIcon weight="bold" />);
+    expect(glyphPath(echo)).toBe(glyphPath(x.container));
+    x.unmount();
+    // A menu's rows run the full width, so its X takes its own band.
+    const row = panel.querySelector<HTMLElement>("[data-fp-icon-echo]") as HTMLElement;
+    expect(row.getAttribute("data-fp-icon-echo")).toBe("band");
+    expect(row.style.marginBottom).toBe("");
+  });
+
+  it("puts a panel header on the X's line, clear of the X", async () => {
+    const button = { x: viewportWidth() - 16 - 44, y: 12, width: 44, height: 44 };
+    measure(button, 240);
+    const result = renderWithProviders(<AddPanel header />);
+    const panel = await open(result);
+    expect(panel.querySelector("[data-fp-panel-header]")).toBeTruthy();
+    const box = await within(panel).findByTestId("echo-box");
+    // The header takes the X's height, and the X sits at the end edge, so it
+    // keeps the X's whole box clear there: from the X's start to the panel's end.
+    const panelLeft = button.x + button.width - 240;
+    expect(box.dataset.height).toBe(`${button.height}`);
+    expect(box.dataset.left).toBe("0");
+    expect(box.dataset.right).toBe(`${240 - (button.x - panelLeft)}`);
+  });
+
+  it("keeps a content-sized trigger on a centring row's line", async () => {
+    measure({ x: 16, y: 12, width: 44, height: 44 });
+    const centred = renderWithProviders(
+      <div style={{ display: "flex", flexDirection: "row", alignItems: "center", height: 60 }}>
+        <AddPanel />
+      </div>,
+    );
+    const inRow = centred.container.querySelector<HTMLElement>(
+      "[data-fp-reference]",
+    ) as HTMLElement;
+    await waitFor(() => expect(getComputedStyle(inRow).alignSelf).not.toBe("flex-start"));
+    centred.unmount();
+    const column = renderWithProviders(
+      <div style={{ display: "flex", flexDirection: "column", alignItems: "stretch" }}>
+        <AddPanel />
+      </div>,
+    );
+    const inColumn = column.container.querySelector<HTMLElement>(
+      "[data-fp-reference]",
+    ) as HTMLElement;
+    expect(getComputedStyle(inColumn).alignSelf).toBe("flex-start");
+  });
+
+  it("comes last in the document, so a keyboard open lands on the content first", async () => {
+    measure({ x: 16, y: 12, width: 44, height: 44 });
+    const result = renderWithProviders(<AddPanel />);
+    const panel = await open(result);
+    const buttons = within(panel).getAllByRole("button");
+    expect(buttons.map((b) => b.textContent || b.getAttribute("aria-label"))).toEqual([
+      "Copy",
+      "Close",
+    ]);
+  });
+
+  it("opens up from the button's bottom edge near the bottom, the echo on the bottom row", async () => {
+    const button = { x: 16, y: window.innerHeight - 60, width: 44, height: 44 };
+    measure(button, 240, 300);
+    const result = renderWithProviders(<AddPanel />);
+    const panel = await open(result);
+    const frame = getComputedStyle(panel);
+    const borders =
+      (parseFloat(frame.borderTopWidth) || 0) + (parseFloat(frame.borderBottomWidth) || 0);
+    expect(parseFloat(panel.style.top) + 300 + borders).toBe(button.y + button.height);
+    expect(panel.style.left).toBe(`${button.x}px`);
+    const row = panel.querySelector<HTMLElement>("[data-fp-icon-echo]") as HTMLElement;
+    expect(row.style.order).toBe("1");
+    expect(panel.style.transformOrigin).toBe("bottom left");
+    expect(result.queryByTestId("floating-panel-sheet")).toBeNull();
+  });
+});