@stocksharp/trading-controls 1.1.0 → 1.2.0

package/dist/sstradingcontrols.js

@@ -73,6 +73,7 @@ var SSTradingControls = (() => {
     _required(host.presentation.isBuy, "host.presentation.isBuy", "function", controlName);
     _required(host.presentation.typeText, "host.presentation.typeText", "function", controlName);
     _required(host.presentation.statusText, "host.presentation.statusText", "function", controlName);
+    _required(host.presentation.timeText, "host.presentation.timeText", "function", controlName);
     _required(host.presentation.sideClass, "host.presentation.sideClass", "function", controlName);
     _required(host.presentation.pnlClass, "host.presentation.pnlClass", "function", controlName);
     _required(host.presentation.canvasPalette, "host.presentation.canvasPalette", "function", controlName);
@@ -1863,7 +1864,7 @@ var SSTradingControls = (() => {
   var _ActiveOrdersWidget = class _ActiveOrdersWidget {
     static create(hostEl, state, deps) {
       const host = assertHost(deps?.host, "ActiveOrdersWidget");
-      const root = _ActiveOrdersWidget._buildRoot(host);
+      const root = _ActiveOrdersWidget._buildRoot(host, deps?.readOnly === true);
       root.id = makePanelId(_ActiveOrdersWidget.TYPE);
       hostEl.appendChild(root);
       return new _ActiveOrdersWidget(root, state || {}, deps);
@@ -1879,7 +1880,7 @@ var SSTradingControls = (() => {
     // already give the identical button — and are wired to deps. Cancel-all
     // keeps a distinct accessible name from its tooltip, which is why it states
     // `aria-label` rather than taking the tooltip for both.
-    static _buildRoot(host) {
+    static _buildRoot(host, readOnly = false) {
       return makePanelRoot("active-orders-panel", host.t("ActiveOrders"), [
         makeElement("div", "panel-header", {}, [
           makeElement("span", "", {}, [host.t("OpenOrders")]),
@@ -1893,13 +1894,15 @@ var SSTradingControls = (() => {
             ])
           ]),
           makeElement("div", "panel-rail", { role: "toolbar", "aria-label": host.t("ActiveOrdersActions") }, [
-            makeIconButton(
-              "bt-icon-btn bt-icon-cancel-all panel-cancel-all-btn",
-              host.t("CancelAll"),
-              "bi-x-circle",
-              { "aria-label": host.t("CancelAllOrders") }
-            ),
-            makeIconButton("bt-icon-btn panel-refresh-btn", host.t("Refresh"), "bi-arrow-clockwise", {}),
+            ...readOnly ? [] : [
+              makeIconButton(
+                "bt-icon-btn bt-icon-cancel-all panel-cancel-all-btn",
+                host.t("CancelAll"),
+                "bi-x-circle",
+                { "aria-label": host.t("CancelAllOrders") }
+              ),
+              makeIconButton("bt-icon-btn panel-refresh-btn", host.t("Refresh"), "bi-arrow-clockwise", {})
+            ],
             makeIconButton("bt-icon-btn panel-export-btn", host.t("ExportToExcel"), "bi-file-earmark-spreadsheet", {})
           ])
         ])
@@ -1907,9 +1910,16 @@ var SSTradingControls = (() => {
     }
     constructor(rootEl, _state, deps) {
       this._host = assertHost(deps?.host, "ActiveOrdersWidget");
-      for (const name of ["cancelOrder", "dismissOrder", "editOrderField", "replaceOrder", "cancelAllOrders", "refreshOrders"]) {
-        if (typeof deps?.[name] !== "function")
-          throw new Error(`ActiveOrdersWidget: dep "${name}" is required`);
+      this._readOnly = deps?.readOnly === true;
+      if (this._readOnly) {
+        this._actions = null;
+      } else {
+        const actions = deps;
+        for (const name of ["cancelOrder", "dismissOrder", "editOrderField", "replaceOrder", "cancelAllOrders", "refreshOrders"]) {
+          if (typeof actions?.[name] !== "function")
+            throw new Error(`ActiveOrdersWidget: dep "${name}" is required`);
+        }
+        this._actions = actions;
       }
       this.rootEl = rootEl;
       this._deps = deps;
@@ -1925,11 +1935,11 @@ var SSTradingControls = (() => {
       });
       this._cancelAllBtn?.addEventListener("click", (e) => {
         e.preventDefault();
-        this._deps.cancelAllOrders();
+        this._actions?.cancelAllOrders();
       });
       this._refreshBtn?.addEventListener("click", (e) => {
         e.preventDefault();
-        this._deps.refreshOrders();
+        this._actions?.refreshOrders();
       });
       this._exportBtn?.addEventListener("click", (e) => {
         e.preventDefault();
@@ -2032,7 +2042,7 @@ var SSTradingControls = (() => {
         }
         const updated = { quantity: order.quantity, limitPrice: order.limitPrice, stopPrice: order.stopPrice };
         updated[field] = newVal;
-        this._deps.replaceOrder(orderId, updated.quantity, updated.limitPrice, updated.stopPrice);
+        this._actions?.replaceOrder(orderId, updated.quantity, updated.limitPrice, updated.stopPrice);
       };
       input.addEventListener("blur", commit);
       input.addEventListener("keydown", (e) => {
@@ -2092,7 +2102,7 @@ var SSTradingControls = (() => {
           exportable: true,
           value: (o) => o.quantity,
           render: (o) => formatQty(o.quantity),
-          cellClass: (o) => _ActiveOrdersWidget._editableClass(o, "quantity"),
+          cellClass: (o) => this._readOnly ? "" : _ActiveOrdersWidget._editableClass(o, "quantity"),
           bindCell: (td, o) => this._bindInlineEdit(td, o, "quantity")
         },
         {
@@ -2101,7 +2111,7 @@ var SSTradingControls = (() => {
           exportable: true,
           value: (o) => o.limitPrice,
           render: (o) => o.limitPrice ? formatPrice(o.limitPrice) : label("MKT"),
-          cellClass: (o) => _ActiveOrdersWidget._editableClass(o, "limitPrice"),
+          cellClass: (o) => this._readOnly ? "" : _ActiveOrdersWidget._editableClass(o, "limitPrice"),
           bindCell: (td, o) => this._bindInlineEdit(td, o, "limitPrice"),
           exportValue: (o) => o.limitPrice ?? label("MKT")
         },
@@ -2111,7 +2121,7 @@ var SSTradingControls = (() => {
           exportable: true,
           value: (o) => o.stopPrice,
           render: (o) => o.stopPrice ? formatPrice(o.stopPrice) : "--",
-          cellClass: (o) => _ActiveOrdersWidget._editableClass(o, "stopPrice"),
+          cellClass: (o) => this._readOnly ? "" : _ActiveOrdersWidget._editableClass(o, "stopPrice"),
           bindCell: (td, o) => this._bindInlineEdit(td, o, "stopPrice"),
           exportValue: (o) => o.stopPrice ?? ""
         },
@@ -2123,14 +2133,14 @@ var SSTradingControls = (() => {
           render: (o) => this._statusCell(o),
           exportValue: (o) => presentation.statusText(o.status)
         },
-        {
+        ...this._readOnly ? [] : [{
           key: "actions",
           header: label("Actions"),
           headerHidden: true,
           exportable: false,
           cellClass: () => "position-actions",
           render: (o) => this._actionButton(o)
-        }
+        }]
       ];
     }
     static _rowClass(order) {
@@ -2152,8 +2162,9 @@ var SSTradingControls = (() => {
     // Double-click to edit belongs to the whole cell rather than to a control
     // inside it, which is why it is wired here instead of returned by render().
     _bindInlineEdit(td, order, field) {
-      if (!_ActiveOrdersWidget._canEdit(order, field)) return;
-      td.addEventListener("dblclick", () => this._deps.editOrderField(order.id, field));
+      if (this._actions === null || !_ActiveOrdersWidget._canEdit(order, field)) return;
+      const edit = this._actions.editOrderField;
+      td.addEventListener("dblclick", () => edit(order.id, field));
     }
     // Status text, plus a hoverable icon carrying the rejection reason. Some
     // venues wrap the human-readable rejection inside a JSON blob;
@@ -2189,8 +2200,9 @@ var SSTradingControls = (() => {
       icon.className = "bi bi-x-circle";
       button.appendChild(icon);
       button.addEventListener("click", () => {
-        if (isTerminal) this._deps.dismissOrder(order.id);
-        else this._deps.cancelOrder(order.id);
+        if (this._actions === null) return;
+        if (isTerminal) this._actions.dismissOrder(order.id);
+        else this._actions.cancelOrder(order.id);
       });
       return button;
     }
@@ -2447,14 +2459,14 @@ var SSTradingControls = (() => {
   var _TradeHistoryWidget = class _TradeHistoryWidget {
     static create(hostEl, state, deps) {
       const host = assertHost(deps?.host, "TradeHistoryWidget");
-      const root = _TradeHistoryWidget._buildRoot(host);
+      const root = _TradeHistoryWidget._buildRoot(host, deps?.readOnly === true);
       root.id = makePanelId(_TradeHistoryWidget.TYPE);
       hostEl.appendChild(root);
       return new _TradeHistoryWidget(root, state || {}, deps);
     }
     // The panel's markup. The host stylesheet reads this structure, and a
     // docking host lifts `.panel-header`'s children into its tab strip.
-    static _buildRoot(host) {
+    static _buildRoot(host, readOnly = false) {
       const title = host.t("TradeHistory");
       return makePanelRoot("trade-history-panel", title, [
         makeElement("div", "panel-header", {}, [
@@ -2469,7 +2481,7 @@ var SSTradingControls = (() => {
             ])
           ]),
           makeElement("div", "panel-rail", { role: "toolbar", "aria-label": host.t("TradeHistoryActions") }, [
-            makeIconButton("bt-icon-btn panel-refresh-btn", host.t("Refresh"), "bi-arrow-clockwise", {}),
+            ...readOnly ? [] : [makeIconButton("bt-icon-btn panel-refresh-btn", host.t("Refresh"), "bi-arrow-clockwise", {})],
             makeIconButton("bt-icon-btn panel-export-btn", host.t("ExportToExcel"), "bi-file-earmark-spreadsheet", {})
           ])
         ])
@@ -2545,6 +2557,14 @@ var SSTradingControls = (() => {
         this._host.log(`TradeHistoryWidget: failed to load trade history: ${err}`);
       }
     }
+    /// Show these rows. The push path, for a consumer that already holds the
+    /// trades - a finished run's report - rather than an account to load them
+    /// from. `refresh` is the pull path and the two do not mix: whichever ran
+    /// last is what the grid shows.
+    update(rows) {
+      this._rows = rows || [];
+      this._grid?.setRows(this._rows);
+    }
     // Export the table to .xlsx in the currently rendered (sorted) order.
     _export() {
       this._grid?.download("trades", this._host.t("TradeHistory"));
@@ -2568,8 +2588,8 @@ var SSTradingControls = (() => {
           header: label("Time"),
           exportable: true,
           value: (t) => t.executedAt || t.time,
-          render: (t) => formatTime(t.executedAt || t.time),
-          exportValue: (t) => formatTime(t.executedAt || t.time)
+          render: (t) => presentation.timeText(t.executedAt || t.time),
+          exportValue: (t) => presentation.timeText(t.executedAt || t.time)
         },
         {
           key: "symbol",
@@ -4713,7 +4733,7 @@ var SSTradingControls = (() => {
           header: label("Time"),
           exportable: true,
           value: (t) => String(t.time || t.executedAt || ""),
-          render: (t) => formatTime(t.time || t.executedAt)
+          render: (t) => this._host.presentation.timeText(t.time || t.executedAt)
         },
         {
           key: "symbol",
@@ -5018,7 +5038,7 @@ var SSTradingControls = (() => {
       const side = bubble.side;
       const lines = [];
       if (this._extraSymbols.size > 0) lines.push(this._tooltipLine(this._host.t("Symbol"), bubble.symbol, ""));
-      lines.push(this._tooltipLine(this._host.t("Time"), formatTime(bubble.time), ""));
+      lines.push(this._tooltipLine(this._host.t("Time"), this._host.presentation.timeText(bubble.time), ""));
       lines.push(this._tooltipLine(aggregated ? this._host.t("VWAP") : this._host.t("Price"), formatPrice(bubble.price), ""));
       lines.push(this._tooltipLine(aggregated ? this._host.t("Total qty") : this._host.t("Qty"), formatQty(bubble.quantity), ""));
       lines.push(this._tooltipLine(this._host.t("Side"), presentation.sideText(side), presentation.sideClass(side)));