@relu-interactives/spatial-ecs 0.8.0 → 0.10.0

package/dist/components/index.cjs

@@ -2167,6 +2167,127 @@ var _IKComponent = class _IKComponent extends Component {
 __name(_IKComponent, "IKComponent");
 var IKComponent = _IKComponent;
 
+// core/ui/uiStyle.ts
+var isRecord = /* @__PURE__ */ __name((value) => typeof value === "object" && value !== null && !Array.isArray(value), "isRecord");
+var finite = /* @__PURE__ */ __name((value) => typeof value === "number" && Number.isFinite(value), "finite");
+var nonEmpty = /* @__PURE__ */ __name((value) => typeof value === "string" && value.length > 0, "nonEmpty");
+function normalizeStops(value) {
+  if (!Array.isArray(value)) return null;
+  const stops = [];
+  for (const stop of value) {
+    if (isRecord(stop) && finite(stop.at) && nonEmpty(stop.color)) {
+      stops.push({ at: Math.min(1, Math.max(0, stop.at)), color: stop.color });
+    }
+  }
+  return stops.length >= 2 ? stops : null;
+}
+__name(normalizeStops, "normalizeStops");
+function normalizePaint(value) {
+  if (!isRecord(value)) return void 0;
+  if (value.kind === "solid" && nonEmpty(value.color)) {
+    return { kind: "solid", color: value.color };
+  }
+  if (value.kind === "linear") {
+    const stops = normalizeStops(value.stops);
+    if (stops) {
+      return {
+        kind: "linear",
+        angle: finite(value.angle) ? value.angle : 180,
+        stops
+      };
+    }
+  }
+  if (value.kind === "radial") {
+    const stops = normalizeStops(value.stops);
+    if (stops) return { kind: "radial", stops };
+  }
+  if (value.kind === "image" && nonEmpty(value.src)) {
+    const fit = value.fit === "contain" || value.fit === "fill" ? value.fit : "cover";
+    return {
+      kind: "image",
+      src: value.src,
+      fit,
+      ...nonEmpty(value.tint) ? { tint: value.tint } : {}
+    };
+  }
+  return void 0;
+}
+__name(normalizePaint, "normalizePaint");
+function normalizeShadow(value) {
+  if (!isRecord(value) || !nonEmpty(value.color)) return void 0;
+  return {
+    x: finite(value.x) ? value.x : 0,
+    y: finite(value.y) ? value.y : 0,
+    blur: finite(value.blur) ? Math.max(0, value.blur) : 0,
+    color: value.color
+  };
+}
+__name(normalizeShadow, "normalizeShadow");
+function normalizeText(value) {
+  if (!isRecord(value)) return void 0;
+  const text = {};
+  if (nonEmpty(value.font)) text.font = value.font;
+  if (finite(value.weight)) text.weight = value.weight;
+  if (finite(value.tracking)) text.tracking = value.tracking;
+  if (value.transform === "upper" || value.transform === "lower") {
+    text.transform = value.transform;
+  }
+  const paint = normalizePaint(value.paint);
+  if (paint) text.paint = paint;
+  if (finite(value.maxLines) && value.maxLines >= 1) {
+    text.maxLines = Math.floor(value.maxLines);
+  }
+  const shadow = normalizeShadow(value.shadow);
+  if (shadow) text.shadow = shadow;
+  return Object.keys(text).length > 0 ? text : void 0;
+}
+__name(normalizeText, "normalizeText");
+function normalizeUiStyle(value) {
+  if (!isRecord(value)) return void 0;
+  const style = {};
+  const fill = normalizePaint(value.fill);
+  if (fill) style.fill = fill;
+  if (isRecord(value.border) && finite(value.border.width)) {
+    const paint = normalizePaint(value.border.paint);
+    if (paint) {
+      style.border = { width: Math.max(0, value.border.width), paint };
+    }
+  }
+  if (finite(value.radius)) {
+    style.radius = Math.max(0, value.radius);
+  } else if (Array.isArray(value.radius) && value.radius.length === 4 && value.radius.every(finite)) {
+    style.radius = value.radius.map((r) => Math.max(0, r));
+  }
+  if (Array.isArray(value.shadows)) {
+    const shadows = value.shadows.map(normalizeShadow).filter((s) => !!s);
+    if (shadows.length > 0) style.shadows = shadows;
+  }
+  if (isRecord(value.edge) && finite(value.edge.width) && nonEmpty(value.edge.color)) {
+    style.edge = {
+      width: Math.max(0, value.edge.width),
+      color: value.edge.color
+    };
+  }
+  if (finite(value.opacity)) {
+    style.opacity = Math.min(1, Math.max(0, value.opacity));
+  }
+  const text = normalizeText(value.text);
+  if (text) style.text = text;
+  return Object.keys(style).length > 0 ? style : void 0;
+}
+__name(normalizeUiStyle, "normalizeUiStyle");
+function normalizeUiTokens(value) {
+  if (!isRecord(value)) return void 0;
+  const tokens = {};
+  for (const [key, token] of Object.entries(value)) {
+    if (nonEmpty(token) && key.length > 0 && !key.includes("/")) {
+      tokens[key] = token;
+    }
+  }
+  return Object.keys(tokens).length > 0 ? tokens : void 0;
+}
+__name(normalizeUiTokens, "normalizeUiTokens");
+
 // core/components/UIPanel.ts
 var _UIPanelComponent = class _UIPanelComponent extends Component {
   constructor(options) {
@@ -2180,6 +2301,10 @@ var _UIPanelComponent = class _UIPanelComponent extends Component {
     this.borderColor = options?.borderColor ?? "#333333";
     this.pixelDensity = options?.pixelDensity ?? 1024;
     this.follow = options?.follow ?? "world";
+    const style = normalizeUiStyle(options?.style);
+    if (style) this.style = style;
+    const tokens = normalizeUiTokens(options?.tokens);
+    if (tokens) this.tokens = tokens;
   }
 };
 __name(_UIPanelComponent, "UIPanelComponent");
@@ -2199,6 +2324,11 @@ var _UITextComponent = class _UITextComponent extends Component {
     this.valign = options?.valign ?? "middle";
     this.lineHeight = options?.lineHeight ?? 1.25;
     this.padding = options?.padding ?? 0.01;
+    if (options?.pixelDensity !== void 0) {
+      this.pixelDensity = options.pixelDensity;
+    }
+    const style = normalizeUiStyle(options?.style);
+    if (style) this.style = style;
   }
 };
 __name(_UITextComponent, "UITextComponent");
@@ -2220,6 +2350,13 @@ var _UIButtonComponent = class _UIButtonComponent extends Component {
     this.cornerRadius = options?.cornerRadius ?? 0.02;
     this.borderWidth = options?.borderWidth ?? 2e-3;
     this.borderColor = options?.borderColor ?? "#3a3a3a";
+    if (options?.pixelDensity !== void 0) {
+      this.pixelDensity = options.pixelDensity;
+    }
+    const style = normalizeUiStyle(options?.style);
+    if (style) this.style = style;
+    if (options?.icon) this.icon = options.icon;
+    if (options?.iconPosition) this.iconPosition = options.iconPosition;
   }
 };
 __name(_UIButtonComponent, "UIButtonComponent");
@@ -2236,6 +2373,12 @@ var _UIToggleComponent = class _UIToggleComponent extends Component {
     this.trackColor = options?.trackColor ?? "#2a2a2a";
     this.accentColor = options?.accentColor ?? "#ff6b35";
     this.knobColor = options?.knobColor ?? "#ffffff";
+    if (options?.pixelDensity !== void 0) {
+      this.pixelDensity = options.pixelDensity;
+    }
+    const style = normalizeUiStyle(options?.style);
+    if (style) this.style = style;
+    if (options?.variant) this.variant = options.variant;
   }
 };
 __name(_UIToggleComponent, "UIToggleComponent");
@@ -2256,6 +2399,14 @@ var _UISliderComponent = class _UISliderComponent extends Component {
     this.trackColor = options?.trackColor ?? "#2a2a2a";
     this.accentColor = options?.accentColor ?? "#ff6b35";
     this.knobColor = options?.knobColor ?? "#ffffff";
+    if (options?.pixelDensity !== void 0) {
+      this.pixelDensity = options.pixelDensity;
+    }
+    const style = normalizeUiStyle(options?.style);
+    if (style) this.style = style;
+    if (options?.variant) this.variant = options.variant;
+    if (options?.step !== void 0) this.step = options.step;
+    if (options?.readOnly !== void 0) this.readOnly = options.readOnly;
   }
 };
 __name(_UISliderComponent, "UISliderComponent");