@multiplatform.one/forms 7.73.0 → 7.75.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":["__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","IconButtonGroup_exports","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","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","right","bottom","left"],"sources":["IconButtonGroup.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n  for (var name in all)\n    __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar IconButtonGroup_exports = {};\n__export(IconButtonGroup_exports, {\n  ICON_BUTTON_GLASS_MERGE_PX: () => ICON_BUTTON_GLASS_MERGE_PX,\n  IconButtonGroup: () => IconButtonGroup\n});\nmodule.exports = __toCommonJS(IconButtonGroup_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar import_theme = require(\"@multiplatform.one/theme\");\nvar import_react = require(\"react\");\nvar import_tamagui = require(\"tamagui\");\nvar import_glass = require(\"./glass\");\nvar import_mediaPlate = require(\"./mediaPlate\");\nvar import_iconButtonGroupContext = require(\"./iconButtonGroupContext\");\nvar ICON_BUTTON_GLASS_MERGE_PX = 22;\nfunction IconButtonGroup(param) {\n  var { plate, children, ...rest } = param;\n  var bar = (0, import_theme.useBarSurface)();\n  var [capsuleHeight, setCapsuleHeight] = (0, import_react.useState)(0);\n  var [members, setMembers] = (0, import_react.useState)(0);\n  var register = (0, import_react.useCallback)(function() {\n    setMembers(function(count) {\n      return count + 1;\n    });\n    return function() {\n      return setMembers(function(count) {\n        return count - 1;\n      });\n    };\n  }, []);\n  if (plate === \"media\") {\n    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupContext.Provider, {\n      value: \"media\",\n      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Theme, {\n        name: \"dark\",\n        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XStack, {\n          alignItems: \"center\",\n          alignSelf: \"flex-start\",\n          borderRadius: 1e5,\n          backgroundColor: \"$shadow4\",\n          overflow: \"hidden\",\n          \"data-mp-icon-button-group\": \"media\",\n          ...(0, import_theme.radiusClassProps)(\"R-IDENTITY\", \"icon button plate\"),\n          ...import_tamagui.isWeb ? {\n            style: import_mediaPlate.MEDIA_PLATE_WEB_STYLE\n          } : void 0,\n          ...rest,\n          children\n        })\n      })\n    });\n  }\n  var GlassView = bar ? (0, import_glass.loadGlassView)() : null;\n  var row = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XStack, {\n    alignItems: \"center\",\n    \"data-mp-icon-button-group\": GlassView && members > 0 ? \"glass\" : bar ? \"bar\" : \"row\",\n    ...rest,\n    children\n  });\n  if (!GlassView) return row;\n  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupRegistry.Provider, {\n    value: register,\n    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupContext.Provider, {\n      value: \"glass\",\n      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.View, {\n        position: \"relative\",\n        flexShrink: 1,\n        minWidth: 0,\n        onLayout: function onLayout(event) {\n          return setCapsuleHeight(event.nativeEvent.layout.height);\n        },\n        children: [\n          members > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GlassView, {\n            glassEffectStyle: \"regular\",\n            pointerEvents: \"none\",\n            style: {\n              position: \"absolute\",\n              top: 0,\n              right: 0,\n              bottom: 0,\n              left: 0,\n              borderRadius: capsuleHeight / 2\n            }\n          }) : null,\n          row\n        ]\n      })\n    })\n  });\n}\n//# sourceMappingURL=IconButtonGroup.js.map\n"],"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","IconButtonGroup_exports","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","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":["IconButtonGroup.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n  for (var name in all)\n    __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar IconButtonGroup_exports = {};\n__export(IconButtonGroup_exports, {\n  ICON_BUTTON_GLASS_MERGE_PX: () => ICON_BUTTON_GLASS_MERGE_PX,\n  IconButtonGroup: () => IconButtonGroup\n});\nmodule.exports = __toCommonJS(IconButtonGroup_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar import_theme = require(\"@multiplatform.one/theme\");\nvar import_react = require(\"react\");\nvar import_tamagui = require(\"tamagui\");\nvar import_glass = require(\"./glass\");\nvar import_mediaPlate = require(\"./mediaPlate\");\nvar import_webGlass = require(\"./webGlass\");\nvar import_iconButtonGroupContext = require(\"./iconButtonGroupContext\");\nvar ICON_BUTTON_GLASS_MERGE_PX = 22;\nfunction IconButtonGroup(param) {\n  var { plate, children, ...rest } = param;\n  var bar = (0, import_theme.useBarSurface)();\n  var [capsuleHeight, setCapsuleHeight] = (0, import_react.useState)(0);\n  var [members, setMembers] = (0, import_react.useState)(0);\n  var register = (0, import_react.useCallback)(function() {\n    setMembers(function(count) {\n      return count + 1;\n    });\n    return function() {\n      return setMembers(function(count) {\n        return count - 1;\n      });\n    };\n  }, []);\n  if (plate === \"media\") {\n    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupContext.Provider, {\n      value: \"media\",\n      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Theme, {\n        name: \"dark\",\n        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XStack, {\n          alignItems: \"center\",\n          alignSelf: \"flex-start\",\n          borderRadius: 1e5,\n          backgroundColor: \"$shadow4\",\n          overflow: \"hidden\",\n          \"data-mp-icon-button-group\": \"media\",\n          ...(0, import_theme.radiusClassProps)(\"R-IDENTITY\", \"icon button plate\"),\n          ...import_tamagui.isWeb ? {\n            style: import_mediaPlate.MEDIA_PLATE_WEB_STYLE\n          } : void 0,\n          ...rest,\n          children\n        })\n      })\n    });\n  }\n  if (bar && import_tamagui.isWeb && (0, import_webGlass.isAppleTouchWeb)()) {\n    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupRegistry.Provider, {\n      value: register,\n      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupContext.Provider, {\n        value: \"glass\",\n        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XStack, {\n          alignItems: \"center\",\n          \"data-mp-icon-button-group\": members > 0 ? \"glass\" : \"bar\",\n          ...rest,\n          children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {\n            alignItems: \"center\",\n            position: \"relative\",\n            zIndex: 0,\n            paddingHorizontal: \"$2\",\n            gap: \"$1\",\n            \"data-mp-glass-capsule\": \"\",\n            children: [\n              members > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_webGlass.WebGlassFace, {\n                style: {\n                  position: \"absolute\",\n                  top: 0,\n                  right: 0,\n                  bottom: 0,\n                  left: 0,\n                  borderRadius: 1e5\n                }\n              }) : null,\n              children\n            ]\n          })\n        })\n      })\n    });\n  }\n  var GlassView = bar ? (0, import_glass.loadGlassView)() : null;\n  var row = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XStack, {\n    alignItems: \"center\",\n    \"data-mp-icon-button-group\": GlassView && members > 0 ? \"glass\" : bar ? \"bar\" : \"row\",\n    ...rest,\n    children\n  });\n  if (!GlassView) return row;\n  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupRegistry.Provider, {\n    value: register,\n    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_iconButtonGroupContext.IconButtonGroupContext.Provider, {\n      value: \"glass\",\n      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.View, {\n        position: \"relative\",\n        flexShrink: 1,\n        minWidth: 0,\n        onLayout: function onLayout(event) {\n          return setCapsuleHeight(event.nativeEvent.layout.height);\n        },\n        children: [\n          members > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GlassView, {\n            glassEffectStyle: \"regular\",\n            pointerEvents: \"none\",\n            style: {\n              position: \"absolute\",\n              top: 0,\n              right: 0,\n              bottom: 0,\n              left: 0,\n              borderRadius: capsuleHeight / 2\n            }\n          }) : null,\n          row\n        ]\n      })\n    })\n  });\n}\n//# sourceMappingURL=IconButtonGroup.js.map\n"],"mappings":"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","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/index.cjs

@@ -24,6 +24,7 @@ var Button_exports = {};
 __export(Button_exports, {
   Button: () => Button,
   ButtonFrame: () => ButtonFrame,
+  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,
@@ -104,6 +105,23 @@ function normalizeButtonIcon(icon, iconSize, color) {
   }
   return icon;
 }
+function accentSolidFill(themeName) {
+  if (!themeName) return null;
+  const themes = (0, import_tamagui.getConfig)().themes;
+  const parts = themeName.split("_");
+  for (let end = parts.length; end > 0; end--) {
+    const theme = themes[`${parts.slice(0, end).join("_")}_accent`];
+    if (!theme) continue;
+    let value = theme.background?.val;
+    for (let hop = 0; hop < 4 && typeof value === "string"; hop++) {
+      const ref = /^var\(--([^)]+)\)$/.exec(value)?.[1];
+      if (!ref) break;
+      value = theme[ref]?.val;
+    }
+    return typeof value === "string" ? (0, import_theme3.normalizeToHex)(value) : null;
+  }
+  return null;
+}
 function NativeButtonIcon({
   icon,
   size,
@@ -233,22 +251,34 @@ function iconButtonGlyphPx(rowLinePx) {
   return Math.max(ICON_BUTTON_GLYPH_PX, Math.round(rowLinePx / PHOSPHOR_INK_RATIO));
 }
 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 +384,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);
@@ -373,7 +403,8 @@ function Button({
   }
   const resolvedGlyphWeight = glyphWeight ?? (iconOnly ? "bold" : "regular");
   const elevatedGround = (0, import_theme3.useElevatedSurface)();
-  const darkScheme = (0, import_theme3.isDarkThemeName)((0, import_tamagui.useThemeName)());
+  const hostThemeName = (0, import_tamagui.useThemeName)();
+  const darkScheme = (0, import_theme3.isDarkThemeName)(hostThemeName);
   const resolvedSize = typeof sizeProp === "number" ? sizeProp : knobProps.sizeToken;
   const touch = (0, import_theme3.useTouchSurface)();
   const recipe = resolveButtonSizeRecipe(resolvedSize, recipeFamily, touch);
@@ -420,7 +451,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 +503,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 && !confirmPlate ? 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 +511,23 @@ 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 accentFillHex = confirmPlate ? accentSolidFill(hostThemeName) : null;
+  const confirmInk = accentFillHex && (0, import_theme3.contrastRatio)((0, import_theme3.relativeLuminance)("#ffffff"), (0, import_theme3.relativeLuminance)(accentFillHex)) >= import_theme3.GLYPH_CONTRAST_FLOOR ? "#ffffff" : "$color";
+  const plateInk = unavailable || barInk || outlinedInk ? void 0 : mediaPlate || iconButton && groupGround === "media" ? "$color12" : confirmPlate ? confirmInk : 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 * 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) :
-  // 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 +560,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 +580,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, {
@@ -600,6 +642,7 @@ function Button({
   } : mediaPlate ? {
     backgroundColor: "$shadow5"
   } : void 0;
+  const glassInset = typeof resolvedBorderWidth === "number" ? -resolvedBorderWidth : 0;
   const glyphEdgePull = GlassView || glassGroup ? 0 : iconButton ? -Math.max(0, (visualPx - iconSize) / 2) : edgePull;
   const buttonElement = /* @__PURE__ */(0, import_jsx_runtime.jsxs)(ButtonFrame, {
     disabled: explainedDisable ? false : isDisabled || false,
@@ -639,6 +682,10 @@ function Button({
     ...(GlassView ? {
       borderRadius: 1e5
     } : void 0),
+    ...(GlassView && import_tamagui.isWeb ? {
+      position: "relative",
+      zIndex: 0
+    } : void 0),
     ...(confirmPlate ? {
       borderRadius: 1e5
     } : void 0),
@@ -657,12 +704,18 @@ function Button({
     ...(restFill ? {
       backgroundColor: restFill
     } : void 0),
+    ...(accentFillHex && !unavailable ? {
+      backgroundColor: accentFillHex
+    } : void 0),
     ...(outlinedInk ? {
       color: outlinedInk
     } : void 0),
     ...(barInk ? {
       color: barInk
     } : void 0),
+    ...(plateInk ? {
+      color: plateInk
+    } : void 0),
     ...(unavailable ? {
       ...disabledSurface,
       ...disabledText,
@@ -801,10 +854,10 @@ function Button({
       pointerEvents: "none",
       style: {
         position: "absolute",
-        top: 0,
-        right: 0,
-        bottom: 0,
-        left: 0,
+        top: glassInset,
+        right: glassInset,
+        bottom: glassInset,
+        left: glassInset,
         borderRadius: visualPx / 2
       }
     }) : null, iconElement, labelContent, iconAfterElement]

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

@@ -26,6 +26,7 @@ var Button_exports = {};
 __export(Button_exports, {
   Button: () => Button,
   ButtonFrame: () => ButtonFrame,
+  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,
@@ -116,6 +117,25 @@ function normalizeButtonIcon(icon, iconSize, color) {
   }
   return icon;
 }
+function accentSolidFill(themeName) {
+  if (!themeName) return null;
+  var themes = (0, import_tamagui.getConfig)().themes;
+  var parts = themeName.split("_");
+  for (var end = parts.length; end > 0; end--) {
+    var _theme_background;
+    var theme = themes[`${parts.slice(0, end).join("_")}_accent`];
+    if (!theme) continue;
+    var value = (_theme_background = theme.background) === null || _theme_background === void 0 ? void 0 : _theme_background.val;
+    for (var hop = 0; hop < 4 && typeof value === "string"; hop++) {
+      var _exec, _theme_ref;
+      var ref = (_exec = /^var\(--([^)]+)\)$/.exec(value)) === null || _exec === void 0 ? void 0 : _exec[1];
+      if (!ref) break;
+      value = (_theme_ref = theme[ref]) === null || _theme_ref === void 0 ? void 0 : _theme_ref.val;
+    }
+    return typeof value === "string" ? (0, import_theme3.normalizeToHex)(value) : null;
+  }
+  return null;
+}
 function NativeButtonIcon(param) {
   var {
     icon,
@@ -268,22 +288,37 @@ function iconButtonGlyphPx(rowLinePx) {
   return Math.max(ICON_BUTTON_GLYPH_PX, Math.round(rowLinePx / PHOSPHOR_INK_RATIO));
 }
 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 +362,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 +430,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);
@@ -414,7 +449,8 @@ function Button(param) {
   }
   var resolvedGlyphWeight = glyphWeight !== null && glyphWeight !== void 0 ? glyphWeight : iconOnly ? "bold" : "regular";
   var elevatedGround = (0, import_theme3.useElevatedSurface)();
-  var darkScheme = (0, import_theme3.isDarkThemeName)((0, import_tamagui.useThemeName)());
+  var hostThemeName = (0, import_tamagui.useThemeName)();
+  var darkScheme = (0, import_theme3.isDarkThemeName)(hostThemeName);
   var resolvedSize = typeof sizeProp === "number" ? sizeProp : knobProps.sizeToken;
   var touch = (0, import_theme3.useTouchSurface)();
   var recipe = resolveButtonSizeRecipe(resolvedSize, recipeFamily, touch);
@@ -462,15 +498,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 +561,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 && !confirmPlate ? 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 +569,23 @@ 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 accentFillHex = confirmPlate ? accentSolidFill(hostThemeName) : null;
+  var confirmInk = accentFillHex && (0, import_theme3.contrastRatio)((0, import_theme3.relativeLuminance)("#ffffff"), (0, import_theme3.relativeLuminance)(accentFillHex)) >= import_theme3.GLYPH_CONTRAST_FLOOR ? "#ffffff" : "$color";
+  var plateInk = unavailable || barInk || outlinedInk ? void 0 : mediaPlate || iconButton && groupGround === "media" ? "$color12" : confirmPlate ? confirmInk : 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 * 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) :
-  // 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 +626,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 +646,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, {
@@ -661,6 +708,7 @@ function Button(param) {
   } : mediaPlate ? {
     backgroundColor: "$shadow5"
   } : void 0;
+  var glassInset = typeof resolvedBorderWidth === "number" ? -resolvedBorderWidth : 0;
   var glyphEdgePull = GlassView || glassGroup ? 0 : iconButton ? -Math.max(0, (visualPx - iconSize) / 2) : edgePull;
   var buttonElement = /* @__PURE__ */(0, import_jsx_runtime.jsxs)(ButtonFrame, {
     // DG-ST-03: an explained disable is aria-disabled (focusable, press
@@ -712,6 +760,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),
@@ -730,6 +785,9 @@ function Button(param) {
     ...(restFill ? {
       backgroundColor: restFill
     } : void 0),
+    ...(accentFillHex && !unavailable ? {
+      backgroundColor: accentFillHex
+    } : void 0),
     // Solid-intent sub-themes carry the on-fill foreground as `$color`
     // (LC-05); outlined frames sit on the page, so re-anchor inherited
     // text/icon color (currentColor) to the hue's readable text tier.
@@ -739,6 +797,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
@@ -903,10 +964,10 @@ function Button(param) {
       pointerEvents: "none",
       style: {
         position: "absolute",
-        top: 0,
-        right: 0,
-        bottom: 0,
-        left: 0,
+        top: glassInset,
+        right: glassInset,
+        bottom: glassInset,
+        left: glassInset,
         borderRadius: visualPx / 2
       }
     }) : null, iconElement, labelContent, iconAfterElement]