@multiplatform.one/forms 7.72.0 → 7.74.0

package/dist/cjs/Button/IconButtonGroup.cjs

@@ -31,6 +31,7 @@ var import_react = require("react");
 var import_tamagui = require("tamagui");
 var import_glass = require("./glass.cjs");
 var import_mediaPlate = require("./mediaPlate.cjs");
+var import_webGlass = require("./webGlass.cjs");
 var import_iconButtonGroupContext = require("./iconButtonGroupContext.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
 const ICON_BUTTON_GLASS_MERGE_PX = 22;
@@ -68,6 +69,37 @@ function IconButtonGroup({
       })
     });
   }
+  if (bar && import_tamagui.isWeb && (0, import_webGlass.isAppleTouchWeb)()) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupRegistry.Provider, {
+      value: register,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupContext.Provider, {
+        value: "glass",
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
+          alignItems: "center",
+          "data-mp-icon-button-group": members > 0 ? "glass" : "bar",
+          ...rest,
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+            alignItems: "center",
+            position: "relative",
+            zIndex: 0,
+            paddingHorizontal: "$2",
+            gap: "$1",
+            "data-mp-glass-capsule": "",
+            children: [members > 0 ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_webGlass.WebGlassFace, {
+              style: {
+                position: "absolute",
+                top: 0,
+                right: 0,
+                bottom: 0,
+                left: 0,
+                borderRadius: 1e5
+              }
+            }) : null, children]
+          })
+        })
+      })
+    });
+  }
   const GlassView = bar ? (0, import_glass.loadGlassView)() : null;
   const row = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
     alignItems: "center",

package/dist/cjs/Button/IconButtonGroup.native.js

@@ -34,6 +34,7 @@ var import_react = require("react");
 var import_tamagui = require("tamagui");
 var import_glass = require("./glass.native.js");
 var import_mediaPlate = require("./mediaPlate.native.js");
+var import_webGlass = require("./webGlass.native.js");
 var import_iconButtonGroupContext = require("./iconButtonGroupContext.native.js");
 var ICON_BUTTON_GLASS_MERGE_PX = 22;
 function IconButtonGroup(param) {
@@ -77,6 +78,37 @@ function IconButtonGroup(param) {
       })
     });
   }
+  if (bar && import_tamagui.isWeb && (0, import_webGlass.isAppleTouchWeb)()) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupRegistry.Provider, {
+      value: register,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupContext.Provider, {
+        value: "glass",
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
+          alignItems: "center",
+          "data-mp-icon-button-group": members > 0 ? "glass" : "bar",
+          ...rest,
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+            alignItems: "center",
+            position: "relative",
+            zIndex: 0,
+            paddingHorizontal: "$2",
+            gap: "$1",
+            "data-mp-glass-capsule": "",
+            children: [members > 0 ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_webGlass.WebGlassFace, {
+              style: {
+                position: "absolute",
+                top: 0,
+                right: 0,
+                bottom: 0,
+                left: 0,
+                borderRadius: 1e5
+              }
+            }) : null, children]
+          })
+        })
+      })
+    });
+  }
   var GlassView = bar ? (0, import_glass.loadGlassView)() : null;
   var row = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
     alignItems: "center",

package/dist/cjs/Button/IconButtonGroup.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","IconButtonGroup_exports","__export","ICON_BUTTON_GLASS_MERGE_PX","IconButtonGroup","module","exports","import_jsx_runtime","require","import_theme","import_react","import_tamagui","import_glass","import_mediaPlate","import_iconButtonGroupContext","param","plate","children","rest","bar","useBarSurface","capsuleHeight","setCapsuleHeight","useState","members","setMembers","register","useCallback","count","jsx","IconButtonGroupContext","Provider","Theme","name","XStack","alignItems","alignSelf","borderRadius","backgroundColor","overflow","radiusClassProps","isWeb","style","MEDIA_PLATE_WEB_STYLE","GlassView","loadGlassView","row","IconButtonGroupRegistry","jsxs","View","position","flexShrink","minWidth","onLayout","event","nativeEvent","layout","height","glassEffectStyle","pointerEvents","top"],"sources":["../../../src/Button/IconButtonGroup.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","IconButtonGroup_exports","__export","ICON_BUTTON_GLASS_MERGE_PX","IconButtonGroup","module","exports","import_jsx_runtime","require","import_theme","import_react","import_tamagui","import_glass","import_mediaPlate","import_webGlass","import_iconButtonGroupContext","param","plate","children","rest","bar","useBarSurface","capsuleHeight","setCapsuleHeight","useState","members","setMembers","register","useCallback","count","jsx","IconButtonGroupContext","Provider","Theme","name","XStack","alignItems","alignSelf","borderRadius","backgroundColor","overflow","radiusClassProps","isWeb","style","MEDIA_PLATE_WEB_STYLE","isAppleTouchWeb","IconButtonGroupRegistry","jsxs","position","zIndex","paddingHorizontal","gap","WebGlassFace","top","right","bottom","left","GlassView","loadGlassView","row","View","flexShrink","minWidth","onLayout","event","nativeEvent","layout","height","glassEffectStyle","pointerEvents"],"sources":["../../../src/Button/IconButtonGroup.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,uBAAA;AAAAC,QAAA,CAAAD,uBAAA;EAAAE,0BAAA,EAAAA,CAAA,KAAAA,0BAAA;EAAAC,eAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAV,YAAgD,CAAAK,uBAAA;AAChD,IAAAM,kBAAsD,GAAAC,OAAA;AACtD,IAAAC,YAAA,GAAAD,OAA6D;AAC7D,IAAAE,YAAA,GAA8BF,OAAA;AAC9B,IAAAG,cAAA,GAAAH,OAAsC;AACtC,IAAAI,YAAA,GAAAJ,OAA8C;AAC9C,IAAAK,iBAAA,GAAAL,OAAA,yBAAgE;AAmCtD,IAAAM,eAAA,GAAAN,OAAA;AA7BH,IAAAO,6BAAM,GAA6BP,OAAA;AAiBnC,IAAAL,0BAA2B,KAAO;AACvC,SAAMC,eAAMA,CAAAY,KAAA;EACZ;IAAMC,KAAC;IAAAC,QAAA;IAAe,GAAAC;EAAA,IAAAH,KAAgB;EACtC,IAAAI,GAAO,OAAAX,YAAmB,CAAAY,aAAI;EAC9B,KAAAC,aAAM,EAAAC,gBAAW,QAAAb,YAAkB,CAAAc,QAAA;EACjC,KAAAC,OAAA,EAAYC,UAAU,QAAQhB,YAAC,CAAAc,QAAA;EAC/B,IAAAG,QAAO,GAAM,IAAAjB,YAAY,CAAAkB,WAAU,EAAQ,YAAC;IAC9CF,UAAK,WAAAG,KAAA;MACD,OAAAA,KAAU;IACZ;IAGM,OAAC;MAAA,OAAAH,UAAA,WAAAG,KAAA;QACC,OAAAA,KAAW;MAAA,EACX;IAAU;EACI,MACd;EAAgB,IAAAZ,KAChB,YAAS;IAAA,OACT,mBAAAV,kBAA0B,CAAAuB,GAAA,EAAAf,6BAAA,CAAAgB,sBAAA,CAAAC,QAAA;MAAAhC,KACzB,SAAG;MAAkDkB,QACjD,mBAAQ,EAAEX,kBAAO,CAAAuB,GAAA,EAAAnB,cAAA,CAAAsB,KAAA;QACrBC,IAAG;QAEHhB,QAAA,qBAAAX,kBAAA,CAAAuB,GAAA,EAAAnB,cAAA,CAAAwB,MAAA;UAAAC,UAAA;UAGPC,SAAA;UAEJC,YAAA;UACIC,eAAO;UAGTC,QACE;UAEK;UAAA,OAAA/B,YAAA,CAAAgC,gBAAA;UACC,IAAA9B,cAAW,CAAA+B,KAAA;YACXC,KAAA,EAAA9B,iBAAA,CAA2B+B;UAC1B,CAAG;UAEJ,GAAAzB,IAAA;UAACD;QAAA;MAAA;IACY;EACF;EACD,IAAAE,GAAA,IACRT,cAAA,CAAA+B,KAAkB,QAAA5B,eAAA,CAAA+B,eAAA;IAAA,sBACd,IAAAtC,kBAAA,CAAAuB,GAAA,EAAAf,6BAAA,CAAA+B,uBAAA,CAAAd,QAAA;MAAAhC,KAAA,EACJ2B,QAAA;MAAsBT,QAErB,qBAAAX,kBAAA,CAAAuB,GAAA,EAAAf,6BAAA,CAAAgB,sBAAA,CAAAC,QAAA;QAAAhC,KAAA;QACCkB,QAAC,qBAAAX,kBAAA,CAAAuB,GAAA,EAAAnB,cAAA,CAAAwB,MAAA;UAAAC,UAAA;UAAA,2BACQ,EAAAX,OAAA;UAAA,GAAAN,IAAA;UACKD,QAAA,EACV,eAAK,IAAAX,kBAAA,CAAAwC,IAAA,EAAApC,cAAA,CAAAwB,MAAA;YAAAC,UACL,UAAO;YAAAY,QACP,YAAQ;YAAAC,MAAA,EACR;YAAMC,iBACN,MAAc;YAAAC,GAAA,MAChB;YAAA;YAAAjC,QAEA,GACHO,OAAA,0BAAAlB,kBAAA,CAAAuB,GAAA,EAAAhB,eAAA,CAAAsC,YAAA;cAAAT,KAAA;gBAAAK,QAAA;gBACHK,GAAA;gBAAAC,KAAA;gBAGNC,MAAA;gBAEJC,IAAA;gBACMlB,YAAkB;cAEtB;YAAC,WAAApB,QAAA;UAEC;QACC,CAAG;MAEH;IAAA;EACH;EAEF,IAAIuC,SAAC,GAAWrC,GAAA,IAAO,GAAAR,YAAA,CAAA8C,aAAA;EACvB,IAAAC,GACE,sBAAApD,kBAAA,CAAAuB,GAAC,EAAAnB,cAAA,CAAAwB,MAAA;IAEIC,UAAA;IAAA,6BAAAqB,SAAA,IAAAhC,OAAA,iBAAAL,GAAA;IAAA,GACCD,IAAA;IAASD;EACG;EACF,IACV,CAAAuC,SAAU,EAAC,OAAAE,GAAU;EAAgD,OAEpE,mBAAApD,kBAAA,CAAAuB,GAAA,EAAAf,6BAAA,CAAA+B,uBAAA,CAAAd,QAAA;IAAAhC,KAAA,EAAA2B,QAAU;IACTT,QAAC,qBAAAX,kBAAA,CAAAuB,GAAA,EAAAf,6BAAA,CAAAgB,sBAAA,CAAAC,QAAA;MAAAhC,KAAA;MAAAkB,QACC,iBAAiB,IAAAX,kBAAA,CAAAwC,IAAA,EAAApC,cAAA,CAAAiD,IAAA;QAAAZ,QACjB,YAAc;QAAAa,UACd,EAAO;QAAAC,QACL;QAAUC,QACV,WAAKA,SAAAC,KAAA;UAAA,OACLzC,gBAAO,CAAAyC,KAAA,CAAAC,WAAA,CAAAC,MAAA,CAAAC,MAAA;QAAA;QACCjD,QACR,GAAMO,OACN,sBAAc,IAAgBlB,kBAAA,CAAAuB,GAAA,EAAA2B,SAAA;UAChCW,gBAAA;UAAAC,aAAA;UAEA1B,KAAA;YACHK,QAAA;YAAAK,GAAA;YAAAC,KAAA;YAGPC,MAAA;YAEJC,IAAA","ignoreList":[]}

package/dist/cjs/Button/circleGlyph.cjs

@@ -0,0 +1,28 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var circleGlyph_exports = {};
+__export(circleGlyph_exports, {
+  ICON_BUTTON_CIRCLE_GLYPH_RATIO: () => ICON_BUTTON_CIRCLE_GLYPH_RATIO
+});
+module.exports = __toCommonJS(circleGlyph_exports);
+const ICON_BUTTON_CIRCLE_GLYPH_RATIO = 0.58;

package/dist/cjs/Button/circleGlyph.native.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var circleGlyph_exports = {};
+__export(circleGlyph_exports, {
+  ICON_BUTTON_CIRCLE_GLYPH_RATIO: () => ICON_BUTTON_CIRCLE_GLYPH_RATIO
+});
+module.exports = __toCommonJS(circleGlyph_exports);
+var ICON_BUTTON_CIRCLE_GLYPH_RATIO = 0.58;
+//# sourceMappingURL=circleGlyph.native.js.map

package/dist/cjs/Button/circleGlyph.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","circleGlyph_exports","__export","ICON_BUTTON_CIRCLE_GLYPH_RATIO","module","exports"],"sources":["../../../src/Button/circleGlyph.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,mBAAA;AAAAC,QAAA,CAAAD,mBAAA;EAAAE,8BAAA,EAAAA,CAAA,KAAAA;AAAA;AAKOC,MAAM,CAAAC,OAAA,GAAAT,YAAA,CAAAK,mBAAiC","ignoreList":[]}

package/dist/cjs/Button/glass.cjs

@@ -22,12 +22,15 @@ var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
 }), mod);
 var glass_exports = {};
 __export(glass_exports, {
+  isAppleTouchWeb: () => import_webGlass2.isAppleTouchWeb,
   loadGlassContainer: () => loadGlassContainer,
   loadGlassView: () => loadGlassView
 });
 module.exports = __toCommonJS(glass_exports);
+var import_webGlass = require("./webGlass.cjs");
+var import_webGlass2 = require("./webGlass.cjs");
 function loadGlassView() {
-  return null;
+  return (0, import_webGlass.isAppleTouchWeb)() ? import_webGlass.WebGlassFace : null;
 }
 function loadGlassContainer() {
   return null;

package/dist/cjs/Button/iconButtonGroupContext.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","iconButtonGroupContext_exports","__export","IconButtonGroupContext","IconButtonGroupRegistry","useIconButtonGroupGround","useIconButtonGroupMember","module","exports","import_react","require","useIsomorphicLayoutEffect","window","useEffect","useLayoutEffect","createContext","useContext","iconOnly","register"],"sources":["../../../src/Button/iconButtonGroupContext.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,8BAAA;AAAAC,QAAA,CAAAD,8BAAA;EAAAE,sBAAA,EAAAA,CAAA,KAAAA,sBAAA;EAAAC,uBAAA,EAAAA,CAAA,KAAAA,uBAAA;EAAAC,wBAAA,EAAAA,CAAA,KAAAA,wBAAA;EAAAC,wBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAZ,YAAsE,CAAAK,8BAAA;AAEtE,IAAAQ,YAAM,GAAAC,OAAA,QAA4B;AAS3B,IAAAC,yBAAM,UAAyBC,MAAA,mBAAqCH,YAAI,CAAAI,SAAA,GAAAJ,YAAA,CAAAK,eAAA;AAExE,IAAAX,sBAAS,OAAAM,YAAkD,CAAAM,aAAA;AAChE,SAAAV,wBAAOA,CAAA;EACT,WAAAI,YAAA,CAAAO,UAAA,EAAAb,sBAAA;AAOO;AAEA,IAAAC,uBAAS,OAAyBK,YAAyB,CAAAM,aAAA;AAChE,SAAMT,wBAAWA,CAAAW,QAAA;EACjB,IAAAC,QAAA,OAAAT,YAAA,CAAAO,UAAA,EAAAZ,uBAAA;EAAAO,yBACqB,aAAW;IAC9B,OAACM,QAAU,IAAQC,QAAA,GAAAA,QAAA;EACrB,IACFD,QAAA,E","ignoreList":[]}
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","iconButtonGroupContext_exports","__export","IconButtonGroupContext","IconButtonGroupRegistry","useIconButtonGroupGround","useIconButtonGroupMember","module","exports","import_react","require","useIsomorphicLayoutEffect","window","useEffect","useLayoutEffect","createContext","useContext","iconOnly","register"],"sources":["../../../src/Button/iconButtonGroupContext.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,8BAAA;AAAAC,QAAA,CAAAD,8BAAA;EAAAE,sBAAA,EAAAA,CAAA,KAAAA,sBAAA;EAAAC,uBAAA,EAAAA,CAAA,KAAAA,uBAAA;EAAAC,wBAAA,EAAAA,CAAA,KAAAA,wBAAA;EAAAC,wBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAZ,YAAsE,CAAAK,8BAAA;AAEtE,IAAAQ,YAAM,GAAAC,OAAA,QAA4B;AAU3B,IAAAC,yBAAM,UAAyBC,MAAA,mBAAqCH,YAAI,CAAAI,SAAA,GAAAJ,YAAA,CAAAK,eAAA;AAExE,IAAAX,sBAAS,OAAAM,YAAkD,CAAAM,aAAA;AAChE,SAAAV,wBAAOA,CAAA;EACT,WAAAI,YAAA,CAAAO,UAAA,EAAAb,sBAAA;AAOO;AAEA,IAAAC,uBAAS,OAAyBK,YAAyB,CAAAM,aAAA;AAChE,SAAMT,wBAAWA,CAAAW,QAAA;EACjB,IAAAC,QAAA,OAAAT,YAAA,CAAAO,UAAA,EAAAZ,uBAAA;EAAAO,yBACqB,aAAW;IAC9B,OAACM,QAAU,IAAQC,QAAA,GAAAA,QAAA;EACrB,IACFD,QAAA,E","ignoreList":[]}

package/dist/cjs/Button/index.cjs

@@ -24,7 +24,8 @@ var Button_exports = {};
 __export(Button_exports, {
   Button: () => Button,
   ButtonFrame: () => ButtonFrame,
-  ICON_BUTTON_CIRCLE_GLYPH_RATIO: () => ICON_BUTTON_CIRCLE_GLYPH_RATIO,
+  GLYPH_BOLD_STROKE_UNITS: () => GLYPH_BOLD_STROKE_UNITS,
+  ICON_BUTTON_CIRCLE_GLYPH_RATIO: () => import_circleGlyph.ICON_BUTTON_CIRCLE_GLYPH_RATIO,
   ICON_BUTTON_GLASS_MERGE_PX: () => import_IconButtonGroup.ICON_BUTTON_GLASS_MERGE_PX,
   ICON_BUTTON_GLYPH_PX: () => ICON_BUTTON_GLYPH_PX,
   ICON_BUTTON_NEUTRAL_GLYPH_PX: () => ICON_BUTTON_NEUTRAL_GLYPH_PX,
@@ -57,6 +58,7 @@ var import_groupContext = require("../shared/groupContext.cjs");
 var import_echoContext = require("../FloatingPanel/echoContext.cjs");
 var import_glass = require("./glass.cjs");
 var import_mediaPlate = require("./mediaPlate.cjs");
+var import_circleGlyph = require("./circleGlyph.cjs");
 var import_iconButtonGroupContext = require("./iconButtonGroupContext.cjs");
 var import_IconButtonGroup = require("./IconButtonGroup.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -231,24 +233,35 @@ function iconButtonGlyphPx(rowLinePx) {
   if (rowLinePx === void 0) return ICON_BUTTON_GLYPH_PX;
   return Math.max(ICON_BUTTON_GLYPH_PX, Math.round(rowLinePx / PHOSPHOR_INK_RATIO));
 }
-const ICON_BUTTON_CIRCLE_GLYPH_RATIO = 0.58;
 const INLINE_GLYPH_RATIO = 1.2;
-function withGlyphWeight(icon, size, weight) {
+const GLYPH_BOLD_STROKE_UNITS = 8;
+function boldStroke(weight, color = "currentColor") {
+  return weight === "bold" ? {
+    stroke: color,
+    strokeWidth: GLYPH_BOLD_STROKE_UNITS,
+    strokeLinejoin: "round"
+  } : void 0;
+}
+function withGlyphWeight(icon, size, weight, floor = false) {
   if (icon == null || icon === false) return icon;
   if ((0, import_react.isValidElement)(icon)) {
+    const resolved = icon.props.weight ?? weight;
+    const own = icon.props.size;
     return (0, import_react.cloneElement)(icon, {
-      ...(icon.props.size == null ? {
+      ...(own == null || floor && typeof own === "number" && own < size ? {
         size
       } : void 0),
       ...(icon.props.weight == null ? {
         weight
-      } : void 0)
+      } : void 0),
+      ...boldStroke(resolved, icon.props.color)
     });
   }
   if (typeof icon === "function" || typeof icon === "object" && "$$typeof" in icon) {
     return (0, import_react.createElement)(icon, {
       size,
-      weight
+      weight,
+      ...boldStroke(weight)
     });
   }
   return icon;
@@ -354,7 +367,7 @@ function Button({
   const parentScopeTheme = (0, import_tamagui.useTheme)();
   const pageOutlineColor = parentScopeTheme.outlineColor?.val;
   const hostAccentInk = (0, import_theme3.useAccentOnSurface)();
-  const hostIdentityInk = (0, import_theme3.useIdentityInkOnSurface)();
+  const glyphTint = (0, import_theme3.useGlyphTintOnSurface)();
   const grouped = (0, import_groupContext.useControlGrouped)();
   const labelled = verb != null || children != null && children !== false && children !== "";
   const iconOnly = !labelled && Boolean(icon || iconAfter);
@@ -420,7 +433,7 @@ function Button({
     e.currentTarget?.click?.();
   };
   const activeThemeName = theme ?? intent;
-  const tier = activeThemeName || chromeless || grouped ? void 0 : barSurface ? "plain" : knobProps.outlined ? void 0 : "tinted";
+  const tier = activeThemeName || chromeless || grouped || mediaPlate ? void 0 : barSurface ? "plain" : knobProps.outlined ? void 0 : "tinted";
   const tierPaint = tier ? (0, import_theme3.controlTierPaint)(tier, darkScheme, elevatedGround) : void 0;
   const tierDisabled = tier && disabledState.style !== "dimWhole" ? (0, import_theme3.controlTierDisabled)(tier) : void 0;
   const hostScoped = fragment => Object.fromEntries(Object.entries(fragment).map(([key, value]) => [key, typeof value === "string" && value.startsWith("$") ? parentScopeTheme[value.slice(1)]?.val ?? value : value]));
@@ -472,7 +485,7 @@ function Button({
   const ariaPressedProp = props["aria-pressed"];
   const isSelected = selected ?? (ariaPressedProp === true || ariaPressedProp === "true" ? true : void 0);
   const selectedFill = Boolean(isSelected) && !unavailable && !mediaPlate;
-  const barInk = accentInk && chromeless && !selectedFill && !unavailable ? hostIdentityInk : null;
+  const barInk = accentInk && chromeless && !selectedFill && !unavailable ? labelled ? glyphTint.label : glyphTint.glyph : null;
   const inlineGlyph = iconButton && inline === true && !nested;
   const barGlyph = (iconButton || mediaPlate || confirmPlate) && !nested || labelled && chromeless && accentInk === true && edge === "start";
   const labelLine = labelLinePx(knobProps.body.fontFamily);
@@ -480,12 +493,21 @@ function Button({
   const glassGroup = groupGround === "glass";
   const GlassView = iconButton && !inlineGlyph && !nested && accentInk && barSurface && !selectedFill && !glassGroup ? (0, import_glass.loadGlassView)() : null;
   const framedCircle = iconOnly && Boolean(circular) && !nested && !mediaPlate && !confirmPlate;
+  const plateInk = unavailable || barInk || outlinedInk ? void 0 : mediaPlate || iconButton && groupGround === "media" ? "$color12" : framedCircle && !activeThemeName ? hostScoped({
+    color: "$color12"
+  }).color : void 0;
   const framedCirclePx = touch && typeof sizeProp !== "number" ? Math.max(sizeTokenPx(resolvedSize), import_theme3.MIN_PRESS_TARGET) : sizeTokenPx(resolvedSize);
-  const iconSize = nested ? Math.min(recipe.iconSize, Math.max(12, Math.round(knobProps.nestedControl.px * 0.45))) : framedCircle ? Math.round(framedCirclePx * ICON_BUTTON_CIRCLE_GLYPH_RATIO) : inlineGlyph ? Math.round(recipe.fontSize * INLINE_GLYPH_RATIO) : barGlyph ? touch ? Math.max(glyphFloor, resolveButtonSizeRecipe("$6", recipeFamily, touch).iconSize) :
-  // A pointer toolbar keeps its token box (LC-54); the glyph fills it
-  // up to the same floor.
+  const iconSize = nested ? Math.min(recipe.iconSize, Math.max(12, Math.round(knobProps.nestedControl.px * 0.45))) : framedCircle ? Math.round(framedCirclePx * import_circleGlyph.ICON_BUTTON_CIRCLE_GLYPH_RATIO) : inlineGlyph ? Math.round(recipe.fontSize * INLINE_GLYPH_RATIO) : barGlyph ? touch ? Math.max(glyphFloor, resolveButtonSizeRecipe("$6", recipeFamily, touch).iconSize) : iconButton ?
+  // A bare glyph has no plate to inset from, so it takes its box
+  // less a 2pt optical margin, up to the row's glyph: the SHC
+  // "+" at $3 reaches the bar's glyph, a $2 copy beside mono
+  // text stays in proportion.
+  Math.max(recipe.iconSize, Math.min(glyphFloor, recipe.height - 4)) :
+  // A pointer toolbar keeps its token box (LC-54); the glyph fills
+  // it up to the same floor.
   Math.max(recipe.iconSize, Math.min(glyphFloor, recipe.height - 8)) : recipe.iconSize;
-  const glyph = barGlyph || inlineGlyph || framedCircle ? withGlyphWeight(icon, iconSize, resolvedGlyphWeight) : icon;
+  const barGlyphFloor = barGlyph && !framedCircle && !inlineGlyph && !nested;
+  const glyph = barGlyph || inlineGlyph || framedCircle ? withGlyphWeight(icon, iconSize, resolvedGlyphWeight, barGlyphFloor) : icon;
   const labelBoxPx = nested ? knobProps.nestedControl.px : recipe.height;
   const labelMaxFontScale = Math.min((0, import_theme3.maxFontScaleToFit)(labelBoxPx, nested ? (0, import_tamagui.getFontSize)(knobProps.label.fontSize) : recipe.fontSize, import_theme3.dynamicTypeFit.controlLabelFill), labelLine === void 0 ? Number.POSITIVE_INFINITY : (0, import_theme3.maxFontScaleToFit)(labelBoxPx, labelLine, 1));
   const renderLabelText = (label, key) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.SizableText, {
@@ -518,7 +540,7 @@ function Button({
   const flattenedChildren = Array.isArray(resolvedChildren) ? import_react.Children.toArray(resolvedChildren) : null;
   const labelContent = isBareTextChild(resolvedChildren) ? renderLabelText(resolvedChildren) : flattenedChildren?.some(isBareTextChild) ? wrapBareTextChildren(flattenedChildren, renderLabelText) : resolvedChildren;
   const hasIcon = icon || iconAfter || loading;
-  const nativeIconColor = props.color ?? (unavailable ? disabledText.color : void 0) ?? barInk ?? (textColor ? outlinedOnHost ? hostScoped({
+  const nativeIconColor = props.color ?? (unavailable ? disabledText.color : void 0) ?? barInk ?? plateInk ?? (textColor ? outlinedOnHost ? hostScoped({
     color: textColor
   }).color : textColor : outlinedInk) ?? "$color";
   const iconElement = loading ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
@@ -538,7 +560,7 @@ function Button({
       color: nativeIconColor
     })
   }) : null;
-  const glyphAfter = iconAfter && (barGlyph || inlineGlyph || framedCircle) ? withGlyphWeight(iconAfter, iconSize, resolvedGlyphWeight) : iconAfter;
+  const glyphAfter = iconAfter && (barGlyph || inlineGlyph || framedCircle) ? withGlyphWeight(iconAfter, iconSize, resolvedGlyphWeight, barGlyphFloor) : iconAfter;
   const iconAfterElement = glyphAfter ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
     flexShrink: 0,
     children: import_tamagui.isWeb ? normalizeButtonIcon(glyphAfter, iconSize) : /* @__PURE__ */(0, import_jsx_runtime.jsx)(NativeButtonIcon, {
@@ -639,6 +661,10 @@ function Button({
     ...(GlassView ? {
       borderRadius: 1e5
     } : void 0),
+    ...(GlassView && import_tamagui.isWeb ? {
+      position: "relative",
+      zIndex: 0
+    } : void 0),
     ...(confirmPlate ? {
       borderRadius: 1e5
     } : void 0),
@@ -663,6 +689,9 @@ function Button({
     ...(barInk ? {
       color: barInk
     } : void 0),
+    ...(plateInk ? {
+      color: plateInk
+    } : void 0),
     ...(unavailable ? {
       ...disabledSurface,
       ...disabledText,

package/dist/cjs/Button/index.native.js

@@ -26,7 +26,8 @@ var Button_exports = {};
 __export(Button_exports, {
   Button: () => Button,
   ButtonFrame: () => ButtonFrame,
-  ICON_BUTTON_CIRCLE_GLYPH_RATIO: () => ICON_BUTTON_CIRCLE_GLYPH_RATIO,
+  GLYPH_BOLD_STROKE_UNITS: () => GLYPH_BOLD_STROKE_UNITS,
+  ICON_BUTTON_CIRCLE_GLYPH_RATIO: () => import_circleGlyph.ICON_BUTTON_CIRCLE_GLYPH_RATIO,
   ICON_BUTTON_GLASS_MERGE_PX: () => import_IconButtonGroup.ICON_BUTTON_GLASS_MERGE_PX,
   ICON_BUTTON_GLYPH_PX: () => ICON_BUTTON_GLYPH_PX,
   ICON_BUTTON_NEUTRAL_GLYPH_PX: () => ICON_BUTTON_NEUTRAL_GLYPH_PX,
@@ -60,6 +61,7 @@ var import_groupContext = require("../shared/groupContext.native.js");
 var import_echoContext = require("../FloatingPanel/echoContext.native.js");
 var import_glass = require("./glass.native.js");
 var import_mediaPlate = require("./mediaPlate.native.js");
+var import_circleGlyph = require("./circleGlyph.native.js");
 var import_iconButtonGroupContext = require("./iconButtonGroupContext.native.js");
 var import_IconButtonGroup = require("./IconButtonGroup.native.js");
 function _type_of(obj) {
@@ -266,24 +268,38 @@ function iconButtonGlyphPx(rowLinePx) {
   if (rowLinePx === void 0) return ICON_BUTTON_GLYPH_PX;
   return Math.max(ICON_BUTTON_GLYPH_PX, Math.round(rowLinePx / PHOSPHOR_INK_RATIO));
 }
-var ICON_BUTTON_CIRCLE_GLYPH_RATIO = 0.58;
 var INLINE_GLYPH_RATIO = 1.2;
+var GLYPH_BOLD_STROKE_UNITS = 8;
+function boldStroke(weight) {
+  var color = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "currentColor";
+  return weight === "bold" ? {
+    stroke: color,
+    strokeWidth: GLYPH_BOLD_STROKE_UNITS,
+    strokeLinejoin: "round"
+  } : void 0;
+}
 function withGlyphWeight(icon, size, weight) {
+  var floor = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : false;
   if (icon == null || icon === false) return icon;
   if (/* @__PURE__ */(0, import_react.isValidElement)(icon)) {
+    var _icon_props_weight;
+    var resolved = (_icon_props_weight = icon.props.weight) !== null && _icon_props_weight !== void 0 ? _icon_props_weight : weight;
+    var own = icon.props.size;
     return /* @__PURE__ */(0, import_react.cloneElement)(icon, {
-      ...(icon.props.size == null ? {
+      ...(own == null || floor && typeof own === "number" && own < size ? {
         size
       } : void 0),
       ...(icon.props.weight == null ? {
         weight
-      } : void 0)
+      } : void 0),
+      ...boldStroke(resolved, icon.props.color)
     });
   }
   if (typeof icon === "function" || (typeof icon === "undefined" ? "undefined" : _type_of(icon)) === "object" && "$$typeof" in icon) {
     return /* @__PURE__ */(0, import_react.createElement)(icon, {
       size,
-      weight
+      weight,
+      ...boldStroke(weight)
     });
   }
   return icon;
@@ -327,7 +343,7 @@ function Button(param) {
     paddingHorizontal: paddingHorizontalProp,
     ...props
   } = param;
-  var _ref, _ref1, _ref2, _ref3, _props_color, _props_id;
+  var _ref, _ref1, _ref2, _ref3, _ref4, _props_color, _props_id;
   var _parentScopeTheme_outlineColor;
   var {
     resolvedForm: formFromHook
@@ -395,7 +411,7 @@ function Button(param) {
   var parentScopeTheme = (0, import_tamagui.useTheme)();
   var pageOutlineColor = (_parentScopeTheme_outlineColor = parentScopeTheme.outlineColor) === null || _parentScopeTheme_outlineColor === void 0 ? void 0 : _parentScopeTheme_outlineColor.val;
   var hostAccentInk = (0, import_theme3.useAccentOnSurface)();
-  var hostIdentityInk = (0, import_theme3.useIdentityInkOnSurface)();
+  var glyphTint = (0, import_theme3.useGlyphTintOnSurface)();
   var grouped = (0, import_groupContext.useControlGrouped)();
   var labelled = verb != null || children != null && children !== false && children !== "";
   var iconOnly = !labelled && Boolean(icon || iconAfter);
@@ -462,15 +478,15 @@ function Button(param) {
     (_e_currentTarget = e.currentTarget) === null || _e_currentTarget === void 0 ? void 0 : (_e_currentTarget_click = _e_currentTarget.click) === null || _e_currentTarget_click === void 0 ? void 0 : _e_currentTarget_click.call(_e_currentTarget);
   };
   var activeThemeName = theme !== null && theme !== void 0 ? theme : intent;
-  var tier = activeThemeName || chromeless || grouped ? void 0 : barSurface ? "plain" : knobProps.outlined ? void 0 : "tinted";
+  var tier = activeThemeName || chromeless || grouped || mediaPlate ? void 0 : barSurface ? "plain" : knobProps.outlined ? void 0 : "tinted";
   var tierPaint = tier ? (0, import_theme3.controlTierPaint)(tier, darkScheme, elevatedGround) : void 0;
   var tierDisabled = tier && disabledState.style !== "dimWhole" ? (0, import_theme3.controlTierDisabled)(tier) : void 0;
   var hostScoped = function hostScoped2(fragment) {
     return Object.fromEntries(Object.entries(fragment).map(function (param2) {
       var [key, value] = param2;
-      var _ref4;
+      var _ref5;
       var _parentScopeTheme_value_slice;
-      return [key, typeof value === "string" && value.startsWith("$") ? (_ref4 = (_parentScopeTheme_value_slice = parentScopeTheme[value.slice(1)]) === null || _parentScopeTheme_value_slice === void 0 ? void 0 : _parentScopeTheme_value_slice.val) !== null && _ref4 !== void 0 ? _ref4 : value : value];
+      return [key, typeof value === "string" && value.startsWith("$") ? (_ref5 = (_parentScopeTheme_value_slice = parentScopeTheme[value.slice(1)]) === null || _parentScopeTheme_value_slice === void 0 ? void 0 : _parentScopeTheme_value_slice.val) !== null && _ref5 !== void 0 ? _ref5 : value : value];
     }));
   };
   var washOnHost = Boolean(unavailable && activeThemeName && import_theme3.solidPaletteThemes.has(activeThemeName));
@@ -525,7 +541,7 @@ function Button(param) {
   var ariaPressedProp = props["aria-pressed"];
   var isSelected = selected !== null && selected !== void 0 ? selected : ariaPressedProp === true || ariaPressedProp === "true" ? true : void 0;
   var selectedFill = Boolean(isSelected) && !unavailable && !mediaPlate;
-  var barInk = accentInk && chromeless && !selectedFill && !unavailable ? hostIdentityInk : null;
+  var barInk = accentInk && chromeless && !selectedFill && !unavailable ? labelled ? glyphTint.label : glyphTint.glyph : null;
   var inlineGlyph = iconButton && inline === true && !nested;
   var barGlyph = (iconButton || mediaPlate || confirmPlate) && !nested || labelled && chromeless && accentInk === true && edge === "start";
   var labelLine = labelLinePx(knobProps.body.fontFamily);
@@ -533,12 +549,21 @@ function Button(param) {
   var glassGroup = groupGround === "glass";
   var GlassView = iconButton && !inlineGlyph && !nested && accentInk && barSurface && !selectedFill && !glassGroup ? (0, import_glass.loadGlassView)() : null;
   var framedCircle = iconOnly && Boolean(circular) && !nested && !mediaPlate && !confirmPlate;
+  var plateInk = unavailable || barInk || outlinedInk ? void 0 : mediaPlate || iconButton && groupGround === "media" ? "$color12" : framedCircle && !activeThemeName ? hostScoped({
+    color: "$color12"
+  }).color : void 0;
   var framedCirclePx = touch && typeof sizeProp !== "number" ? Math.max(sizeTokenPx(resolvedSize), import_theme3.MIN_PRESS_TARGET) : sizeTokenPx(resolvedSize);
-  var iconSize = nested ? Math.min(recipe.iconSize, Math.max(12, Math.round(knobProps.nestedControl.px * 0.45))) : framedCircle ? Math.round(framedCirclePx * ICON_BUTTON_CIRCLE_GLYPH_RATIO) : inlineGlyph ? Math.round(recipe.fontSize * INLINE_GLYPH_RATIO) : barGlyph ? touch ? Math.max(glyphFloor, resolveButtonSizeRecipe("$6", recipeFamily, touch).iconSize) :
-  // A pointer toolbar keeps its token box (LC-54); the glyph fills it
-  // up to the same floor.
+  var iconSize = nested ? Math.min(recipe.iconSize, Math.max(12, Math.round(knobProps.nestedControl.px * 0.45))) : framedCircle ? Math.round(framedCirclePx * import_circleGlyph.ICON_BUTTON_CIRCLE_GLYPH_RATIO) : inlineGlyph ? Math.round(recipe.fontSize * INLINE_GLYPH_RATIO) : barGlyph ? touch ? Math.max(glyphFloor, resolveButtonSizeRecipe("$6", recipeFamily, touch).iconSize) : iconButton ?
+  // A bare glyph has no plate to inset from, so it takes its box
+  // less a 2pt optical margin, up to the row's glyph: the SHC
+  // "+" at $3 reaches the bar's glyph, a $2 copy beside mono
+  // text stays in proportion.
+  Math.max(recipe.iconSize, Math.min(glyphFloor, recipe.height - 4)) :
+  // A pointer toolbar keeps its token box (LC-54); the glyph fills
+  // it up to the same floor.
   Math.max(recipe.iconSize, Math.min(glyphFloor, recipe.height - 8)) : recipe.iconSize;
-  var glyph = barGlyph || inlineGlyph || framedCircle ? withGlyphWeight(icon, iconSize, resolvedGlyphWeight) : icon;
+  var barGlyphFloor = barGlyph && !framedCircle && !inlineGlyph && !nested;
+  var glyph = barGlyph || inlineGlyph || framedCircle ? withGlyphWeight(icon, iconSize, resolvedGlyphWeight, barGlyphFloor) : icon;
   var labelBoxPx = nested ? knobProps.nestedControl.px : recipe.height;
   var labelMaxFontScale = Math.min((0, import_theme3.maxFontScaleToFit)(labelBoxPx, nested ? (0, import_tamagui.getFontSize)(knobProps.label.fontSize) : recipe.fontSize, import_theme3.dynamicTypeFit.controlLabelFill), labelLine === void 0 ? Number.POSITIVE_INFINITY : (0, import_theme3.maxFontScaleToFit)(labelBoxPx, labelLine, 1));
   var renderLabelText = function renderLabelText2(label, key) {
@@ -579,7 +604,7 @@ function Button(param) {
   var flattenedChildren = Array.isArray(resolvedChildren) ? import_react.Children.toArray(resolvedChildren) : null;
   var labelContent = isBareTextChild(resolvedChildren) ? renderLabelText(resolvedChildren) : (flattenedChildren === null || flattenedChildren === void 0 ? void 0 : flattenedChildren.some(isBareTextChild)) ? wrapBareTextChildren(flattenedChildren, renderLabelText) : resolvedChildren;
   var hasIcon = icon || iconAfter || loading;
-  var nativeIconColor = (_ref1 = (_ref2 = (_ref3 = (_props_color = props.color) !== null && _props_color !== void 0 ? _props_color : unavailable ? disabledText.color : void 0) !== null && _ref3 !== void 0 ? _ref3 : barInk) !== null && _ref2 !== void 0 ? _ref2 : textColor ? outlinedOnHost ? hostScoped({
+  var nativeIconColor = (_ref1 = (_ref2 = (_ref3 = (_ref4 = (_props_color = props.color) !== null && _props_color !== void 0 ? _props_color : unavailable ? disabledText.color : void 0) !== null && _ref4 !== void 0 ? _ref4 : barInk) !== null && _ref3 !== void 0 ? _ref3 : plateInk) !== null && _ref2 !== void 0 ? _ref2 : textColor ? outlinedOnHost ? hostScoped({
     color: textColor
   }).color : textColor : outlinedInk) !== null && _ref1 !== void 0 ? _ref1 : "$color";
   var iconElement = loading ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
@@ -599,7 +624,7 @@ function Button(param) {
       color: nativeIconColor
     })
   }) : null;
-  var glyphAfter = iconAfter && (barGlyph || inlineGlyph || framedCircle) ? withGlyphWeight(iconAfter, iconSize, resolvedGlyphWeight) : iconAfter;
+  var glyphAfter = iconAfter && (barGlyph || inlineGlyph || framedCircle) ? withGlyphWeight(iconAfter, iconSize, resolvedGlyphWeight, barGlyphFloor) : iconAfter;
   var iconAfterElement = glyphAfter ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
     flexShrink: 0,
     children: import_tamagui.isWeb ? normalizeButtonIcon(glyphAfter, iconSize) : /* @__PURE__ */(0, import_jsx_runtime.jsx)(NativeButtonIcon, {
@@ -712,6 +737,13 @@ function Button(param) {
     ...(GlassView ? {
       borderRadius: 1e5
     } : void 0),
+    // On the web the absolute glass circle needs its button as the
+    // containing block and stacking context, or it fills the page and
+    // paints over the glyph.
+    ...(GlassView && import_tamagui.isWeb ? {
+      position: "relative",
+      zIndex: 0
+    } : void 0),
     ...(confirmPlate ? {
       borderRadius: 1e5
     } : void 0),
@@ -739,6 +771,9 @@ function Button(param) {
     ...(barInk ? {
       color: barInk
     } : void 0),
+    ...(plateInk ? {
+      color: plateInk
+    } : void 0),
     // LC-40 DISABLED-VISIBLE: keepLabel washes the chrome (muted fill/
     // border) while label/glyphs re-anchor to the lowest AA text tier
     // (`color` inherits into currentColor icons); dimWhole dims the