@zeyos/zx 4.1.0 → 4.1.1

package/CHANGELOG.md

@@ -8,6 +8,23 @@ and friends remain the complete record.
 
 ## Unreleased
 
+## 4.1.1 — 2026-08-25
+
+### Changed
+
+- **Material recipes are visibly distinct.** Flat, Glass, and Deep glass now resolve shared
+  semantic tokens consumed by application icons, buttons, raised cards, and transient messages;
+  reduced-transparency and forced-colour environments retain opaque accessible fallbacks.
+- **Theme Studio documents the material system.** Its component showcase now includes the shared
+  AppIcon and raised-surface treatments, and explains which component families consume them.
+- **Application identity is more consistent.** ZeyOS AppIcons use centred white glyphs, a tighter
+  corner radius, CSS-only depth, and explicit hover and focus feedback across module colours.
+
+### Fixed
+
+- AppIcons without badges no longer append a visible `null` text node, preserving exact glyph
+  centring and clean accessible output.
+
 ## 4.1.0 — 2026-08-25
 
 ### Added

package/dist/types/zeyos/icons.d.ts

@@ -110,8 +110,8 @@ export type ModuleChipOptions = {
  */
 /**
  * Creates a module's icon chip: the glyph on the module's identity colour, the way ZeyOS draws
- * module icons in navigation and record headers. The glyph colour is whichever of ZeyOS's two
- * foregrounds contrasts better with the background.
+ * module icons in navigation and record headers. AppIcon identity glyphs stay white across every
+ * module colour; material shading and the glyph shadow preserve their silhouette on light colours.
  * @param {string} name Module, entity, or resource name.
  * @param {ModuleChipOptions} [options={}] Display and accessibility options.
  * @returns {HTMLElement} A `<span class="zx-module-icon">` wrapping the glyph.

package/dist/zx-zeyos.esm.js

@@ -11720,11 +11720,12 @@ var AppIcon = class extends Component {
       class: "zx-app-icon__badge",
       ariaHidden: "true"
     }, String(state.badge));
-    this.el.replaceChildren(
+    const children = [
       h("span", { class: "zx-app-icon__shine", ariaHidden: "true" }),
-      h("span", { class: "zx-app-icon__glyph", ariaHidden: "true" }, visual),
-      badge
-    );
+      h("span", { class: "zx-app-icon__glyph", ariaHidden: "true" }, visual)
+    ];
+    if (badge) children.push(badge);
+    this.el.replaceChildren(...children);
   }
 };
 function appIcon(options = {}) {
@@ -13612,8 +13613,8 @@ function moduleChip(name, options = {}) {
   });
   chip.dataset.module = key;
   chip.style.setProperty("--zx-module-color", background);
-  chip.style.setProperty("--zx-module-glyph", moduleGlyphColor(background));
-  chip.style.setProperty("--zx-app-icon-glyph", moduleGlyphColor(background));
+  chip.style.setProperty("--zx-module-glyph", "var(--zx-color-app-icon-glyph)");
+  chip.style.setProperty("--zx-app-icon-glyph", "var(--zx-color-app-icon-glyph)");
   if (title) chip.title = info.label;
   return chip;
 }