@open-slot-ui/core 0.0.1 → 0.1.0

package/dist/index.cjs

@@ -95,8 +95,11 @@ function extendTheme(base, patch) {
 
 // src/layout/screen.ts
 var defaultLayoutConfig = {
+  // Reference design frames, matching the Figma "DEF" frames 1:1 so offsets map
+  // directly: desktop 1920×1080, mobile 360×779 (×3 = 1080×2337). The portrait
+  // aspect matches real phones (~0.46), so scaling no longer squashes vertically.
   refLandscape: [1920, 1080],
-  refPortrait: [1080, 1920],
+  refPortrait: [1080, 2337],
   portraitBelowAspect: 0.85,
   breakpoints: { mobile: 480, tablet: 840 }
 };
@@ -1346,10 +1349,10 @@ var RGS_ERROR_KEYS = Object.freeze({
   ERR_TIMEOUT: { title: "openui.err.connection.title", message: "openui.err.connection.message" }
 });
 var DEFAULT_NOTICE_ACTION = { label: "openui.ok", variant: "primary" };
-function errorBlocks(message, title, tone) {
+function errorBlocks(message, title, _tone) {
   return [
     { kind: "heading", id: "notice-title", text: title },
-    { kind: "callout", id: "notice-body", tone, text: message }
+    { kind: "text", id: "notice-body", text: message }
   ];
 }
 
@@ -1620,11 +1623,11 @@ var OpenUI = class {
     this.betMinus = new ButtonControl({ id: "bet-minus", layout: { anchor: "bottom-center", offset: [-150, -270] } }, this.bus);
     this.betPlus = new ButtonControl({ id: "bet-plus", layout: { anchor: "bottom-center", offset: [150, -270] } }, this.bus);
     this.betStepper = new StepperControl({ id: "bet-stepper", layout: { anchor: "center" }, levels: [0.5, 1, 2, 5, 10, 20], index: 1 }, this.bus);
-    this.muteButton = new ButtonControl({ id: "mute", layout: { anchor: "top-right", offset: [-110, 28] } }, this.bus);
-    this.fullscreenButton = new ButtonControl({ id: "fullscreen", layout: { anchor: "top-right", offset: [-52, 28] } }, this.bus);
-    this.rtp = new ReadoutControl({ id: "rtp", kind: "percent", label: "RTP", layout: { anchor: "top-left", offset: [120, 96] } });
-    this.netPosition = new ReadoutControl({ id: "net-position", kind: "currency", label: "Net", currency: { code: "USD", decimals: 2 }, layout: { anchor: "top-center", offset: [0, 56] } });
-    this.sessionTimer = new ReadoutControl({ id: "session-timer", kind: "duration", label: "Session", layout: { anchor: "top-left", offset: [120, 56] } });
+    this.muteButton = new ButtonControl({ id: "mute", layout: { anchor: "top-right", offset: [-122, 46] } }, this.bus);
+    this.fullscreenButton = new ButtonControl({ id: "fullscreen", layout: { anchor: "top-right", offset: [-46, 46] } }, this.bus);
+    this.rtp = new ReadoutControl({ id: "rtp", kind: "percent", label: "RTP", layout: { anchor: "top-left", offset: [18, 18] } });
+    this.sessionTimer = new ReadoutControl({ id: "session-timer", kind: "duration", label: "Session Time", layout: { anchor: "top-left", offset: [18, 36] } });
+    this.netPosition = new ReadoutControl({ id: "net-position", kind: "currency", label: "Net", currency: { code: "USD", symbol: "$", display: "symbol", position: "prefix", decimals: 2 }, layout: { anchor: "top-left", offset: [18, 60] } });
     this.noticePanel = new PanelControl({ id: "notice-panel", variant: "modal", layout: { anchor: "center" } }, this.bus);
     for (const c of [
       this.spin,
@@ -1961,7 +1964,7 @@ var OpenUI = class {
 
 // src/spec/responsive.ts
 function cloneLayout(l) {
-  return { anchor: l.anchor, offset: l.offset ? [l.offset[0], l.offset[1]] : void 0, scale: l.scale };
+  return { anchor: l.anchor, offset: l.offset ? [l.offset[0], l.offset[1]] : void 0, scale: l.scale, rotation: l.rotation };
 }
 function activeKeys(screen) {
   return [screen.orientation, screen.breakpoint];