@almadar/ui 6.2.0 → 6.3.0

package/dist/avl/index.cjs

@@ -7334,6 +7334,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -7345,6 +7346,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -7380,6 +7384,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -7405,6 +7410,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -7413,6 +7421,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   React94.useEffect(() => {
     const handler = (e) => {
@@ -13620,7 +13631,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -13656,24 +13667,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -13740,7 +13753,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/dist/avl/index.js

@@ -7258,6 +7258,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -7269,6 +7270,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxs(
@@ -7304,6 +7308,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -7329,6 +7334,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -7337,6 +7345,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   useEffect(() => {
     const handler = (e) => {
@@ -13544,7 +13555,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -13580,24 +13591,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -13664,7 +13677,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/dist/components/index.cjs

@@ -2169,6 +2169,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -2180,6 +2181,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2215,6 +2219,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -2240,6 +2245,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -2248,6 +2256,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   React77.useEffect(() => {
     const handler = (e) => {
@@ -9685,7 +9696,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -9721,24 +9732,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -9805,7 +9818,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/dist/components/index.d.cts

@@ -314,7 +314,9 @@ interface InputProps extends Omit<React__default.InputHTMLAttributes<HTMLInputEl
     value?: string | number;
     /** Whether input is disabled */
     disabled?: boolean;
-    /** Declarative event name for trait dispatch */
+    /** Declarative event name for trait dispatch.
+     *  @payloadTypeWhen value inputType=number->number
+     */
     action?: EventEmit<{
         value: string | number;
     }>;
@@ -406,8 +408,10 @@ interface SelectProps extends Omit<React__default.SelectHTMLAttributes<HTMLSelec
     placeholder?: string;
     /** Current value (string for single, string[] for multiple) */
     value?: string | string[];
-    /** Declarative event name for trait dispatch */
-    action?: EventKey;
+    /** Declarative event name for trait dispatch — emits `{ value }` on selection commit (same gestures as `onChange`). */
+    action?: EventEmit<{
+        value: string | string[];
+    }>;
     /** Error message */
     error?: string;
     /** Allow selecting multiple values — activates the rich dropdown. */

package/dist/components/index.d.ts

@@ -314,7 +314,9 @@ interface InputProps extends Omit<React__default.InputHTMLAttributes<HTMLInputEl
     value?: string | number;
     /** Whether input is disabled */
     disabled?: boolean;
-    /** Declarative event name for trait dispatch */
+    /** Declarative event name for trait dispatch.
+     *  @payloadTypeWhen value inputType=number->number
+     */
     action?: EventEmit<{
         value: string | number;
     }>;
@@ -406,8 +408,10 @@ interface SelectProps extends Omit<React__default.SelectHTMLAttributes<HTMLSelec
     placeholder?: string;
     /** Current value (string for single, string[] for multiple) */
     value?: string | string[];
-    /** Declarative event name for trait dispatch */
-    action?: EventKey;
+    /** Declarative event name for trait dispatch — emits `{ value }` on selection commit (same gestures as `onChange`). */
+    action?: EventEmit<{
+        value: string | string[];
+    }>;
     /** Error message */
     error?: string;
     /** Allow selecting multiple values — activates the rich dropdown. */

package/dist/components/index.js

@@ -2094,6 +2094,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -2105,6 +2106,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxs(
@@ -2140,6 +2144,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -2165,6 +2170,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -2173,6 +2181,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   useEffect(() => {
     const handler = (e) => {
@@ -9610,7 +9621,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -9646,24 +9657,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -9730,7 +9743,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/dist/lib/drawable/three/index.cjs

@@ -854,7 +854,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -896,13 +896,14 @@ function expandFxItem(view, node, epochNowMs, dim) {
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...{}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {

package/dist/lib/drawable/three/index.js

@@ -830,7 +830,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -872,13 +872,14 @@ function expandFxItem(view, node, epochNowMs, dim) {
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...{}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {

package/dist/providers/index.cjs

@@ -3506,6 +3506,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -3517,6 +3518,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -3552,6 +3556,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -3577,6 +3582,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -3585,6 +3593,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   React87.useEffect(() => {
     const handler = (e) => {
@@ -9878,7 +9889,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -9914,24 +9925,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -9998,7 +10011,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/dist/providers/index.js

@@ -3432,6 +3432,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -3443,6 +3444,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxs(
@@ -3478,6 +3482,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -3503,6 +3508,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -3511,6 +3519,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   useEffect(() => {
     const handler = (e) => {
@@ -9804,7 +9815,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -9840,24 +9851,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -9924,7 +9937,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/dist/runtime/index.cjs

@@ -3999,6 +3999,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -4010,6 +4011,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -4045,6 +4049,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -4070,6 +4075,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -4078,6 +4086,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   React85.useEffect(() => {
     const handler = (e) => {
@@ -10228,7 +10239,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -10264,24 +10275,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -10348,7 +10361,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/dist/runtime/index.js

@@ -3925,6 +3925,7 @@ function NativeSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   ...props
 }) {
@@ -3936,6 +3937,9 @@ function NativeSelect({
       onChange?.(e);
     }
     dispatchValueChange(onValueChange, eventBus, e.target.value);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: e.target.value });
+    }
   };
   return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
     /* @__PURE__ */ jsxs(
@@ -3971,6 +3975,7 @@ function RichSelect({
   error,
   onChange,
   onValueChange,
+  action,
   value,
   multiple,
   searchable,
@@ -3996,6 +4001,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   const clear = (e) => {
     e.stopPropagation();
@@ -4004,6 +4012,9 @@ function RichSelect({
       eventBus.emit(`UI:${onChange}`, { value: next });
     }
     dispatchValueChange(onValueChange, eventBus, next);
+    if (action) {
+      eventBus.emit(`UI:${action}`, { value: next });
+    }
   };
   useEffect(() => {
     const handler = (e) => {
@@ -10154,7 +10165,7 @@ function proceduralShapes(view, pos, fade, progress) {
     }
   }
 }
-function expandFxItem(view, node, epochNowMs, dim) {
+function expandFxItem(view, node, epochNowMs, dim, projector) {
   if (view.space === "screen") return [];
   const tickMs = node.tickMs ?? DEFAULT_TICK_MS;
   const { ageMs, progress, fade } = fxLifecycle(view, epochNowMs, tickMs);
@@ -10190,24 +10201,26 @@ function expandFxItem(view, node, epochNowMs, dim) {
     out.push(...proceduralShapes(view, pos, fade, progress));
   }
   if (view.message) {
+    const pxSize = projector && view.size !== void 0 ? Math.max(10, Math.round(view.size * projector.tileWidth)) : void 0;
     const text = {
       type: "draw-text",
       text: view.message,
       position: pos,
       offsetY: -(0.15 + 0.55 * progress),
       color: view.color ?? node.textColor ?? DEFAULT_TEXT_COLOR,
-      opacity: fade
+      opacity: fade,
+      ...pxSize ? { font: `bold ${pxSize}px system-ui, sans-serif` } : {}
     };
     out.push(text);
   }
   return out;
 }
-function expandFxLayer(node, epochNowMs, dim) {
+function expandFxLayer(node, epochNowMs, dim, projector) {
   if (!Array.isArray(node.items)) return [];
   const out = [];
   for (const item of node.items) {
     if (!item || typeof item.id !== "string") continue;
-    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim));
+    out.push(...expandFxItem(resolveFxView(item, node.presets), node, epochNowMs, dim, projector));
   }
   return out;
 }
@@ -10274,7 +10287,7 @@ function paintDrawable(painter, node, dctx) {
       break;
     case "draw-fx-layer": {
       const epochNow = dctx.time > 0 && typeof performance !== "undefined" ? performance.timeOrigin + dctx.time : 0;
-      for (const child of expandFxLayer(node, epochNow, "2d")) paintDrawable(painter, child, dctx);
+      for (const child of expandFxLayer(node, epochNow, "2d", dctx.projector)) paintDrawable(painter, child, dctx);
       break;
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almadar/ui",
-  "version": "6.2.0",
+  "version": "6.3.0",
   "description": "React UI components, hooks, and providers for Almadar",
   "type": "module",
   "sideEffects": [
@@ -118,11 +118,11 @@
     "access": "public"
   },
   "dependencies": {
-    "@almadar/core": "^10.79.0",
-    "@almadar/evaluator": "^2.43.0",
+    "@almadar/core": "^10.80.0",
+    "@almadar/evaluator": "^2.44.0",
     "@almadar/logger": "^1.12.0",
     "@almadar/runtime": "^6.69.0",
-    "@almadar/std": "^16.199.0",
+    "@almadar/std": "^16.200.0",
     "@almadar/syntax": "^1.16.0",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",