@stocksharp/trading-controls 0.1.0 → 1.1.0

package/src/active-orders-widget.ts

@@ -15,6 +15,7 @@
 import { cleanRejectReason, formatPrice, formatQty } from './formatters.js';
 import { makeElement, makeIconButton, makePanelId, makePanelRoot } from './dom.js';
 import { ControlTypes } from './control-types.js';
+import { makeGridMenu } from './grid-menu.js';
 import { TradingHost, assertHost } from './trading-host.js';
 import type { OrderRow } from './trading-data.js';
 import { DataGrid, GridColumn } from '@stocksharp/grids/source/data-grid';
@@ -158,6 +159,11 @@ export class ActiveOrdersWidget {
                 emptyText: this._host.t('NoActiveOrders'),
                 // Terminal rows are greyed out so the live ones stay visually prominent.
                 rowClass: (o) => ActiveOrdersWidget._rowClass(o),
+                contextMenu: makeGridMenu(this._host),
+                // Press to mark, drag or Shift to range, Ctrl to toggle, Ctrl+C
+                // to copy — all the grid's own; the press also claims the
+                // gesture from the browser's text selection.
+                selection: 'multi',
             })
             : null;
 
@@ -165,6 +171,9 @@ export class ActiveOrdersWidget {
     }
 
     dispose(): void {
+        // The grid holds document-level listeners (the copy shortcut) that
+        // outlive a removed subtree — it has to be told, not just detached.
+        this._grid?.destroy();
         this._host.unregister(this);
         try { this.rootEl.remove(); } catch { /* already detached */ }
     }

package/src/control-types.ts

@@ -19,6 +19,9 @@ export const ControlTypes = {
     ActiveOrders: 'activeOrders',
     TradeHistory: 'tradeHistory',
     Positions: 'positions',
+    OrderBook: 'orderbook',
+    TradeFeed: 'tradefeed',
+    OrderEntry: 'orderEntry',
 } as const;
 
 export type ControlType = typeof ControlTypes[keyof typeof ControlTypes];

package/src/grid-menu.ts

@@ -0,0 +1,67 @@
+// The wording of the grid's context menu and its filter dialog.
+//
+// `@stocksharp/grids` draws the menu and speaks English by default; a control
+// here says nothing in its own words, so every label is taken from `host.t()`
+// and handed over through the grid's `contextMenu` option. Each blotter calls
+// this at construction — the labels are read once per grid, which is the same
+// lifetime as every other caption a control renders.
+//
+// Every key below is a literal on purpose: `translation-keys.json` is generated
+// by scanning for them, and a computed key would be invisible to that scan and
+// reach a user as itself.
+import { TradingHost } from './trading-host.js';
+import type { GridMenuOptions } from '@stocksharp/grids/source/data-grid';
+
+/// The grid's `contextMenu` option, worded by the host. Generic over the row
+/// type only because the option is; no label depends on it.
+export function makeGridMenu<TRow>(host: TradingHost): GridMenuOptions<TRow> {
+    return {
+        labels: {
+            sortAsc: host.t('SortAscending'),
+            sortDesc: host.t('SortDescending'),
+            sortClear: host.t('ClearSort'),
+            hideColumn: host.t('HideColumn'),
+            showAllColumns: host.t('ShowAllColumns'),
+            groupBy: host.t('GroupByColumn'),
+            ungroup: host.t('Ungroup'),
+            filterByValue: (text) => host.t('Filter by this value: {0}', text),
+            filterRule: host.t('FilterRule'),
+            showFilters: host.t('ShowFilterRow'),
+            hideFilters: host.t('HideFilterRow'),
+            showHeader: host.t('ShowHeaderRow'),
+            hideHeader: host.t('HideHeaderRow'),
+            clearFilters: host.t('ClearFilters'),
+            copyCell: host.t('CopyCell'),
+            copyRow: host.t('CopyRow'),
+            copyRows: (count) => host.t('Copy selected rows ({0})', count),
+            exportXlsx: host.t('ExportToXlsx'),
+        },
+        filterDialog: {
+            labels: {
+                title: (header) => host.t('Filter: {0}', header),
+                apply: host.t('Apply'),
+                clear: host.t('Clear'),
+                cancel: host.t('Cancel'),
+                value: host.t('Value'),
+                and: host.t('FilterAnd'),
+                ops: {
+                    contains: host.t('FilterOpContains'),
+                    notContains: host.t('FilterOpNotContains'),
+                    startsWith: host.t('FilterOpStartsWith'),
+                    endsWith: host.t('FilterOpEndsWith'),
+                    eq: host.t('FilterOpEq'),
+                    ne: host.t('FilterOpNe'),
+                    gt: host.t('FilterOpGt'),
+                    ge: host.t('FilterOpGe'),
+                    lt: host.t('FilterOpLt'),
+                    le: host.t('FilterOpLe'),
+                    between: host.t('FilterOpBetween'),
+                    anyOf: host.t('FilterOpAnyOf'),
+                    noneOf: host.t('FilterOpNoneOf'),
+                    empty: host.t('FilterOpEmpty'),
+                    notEmpty: host.t('FilterOpNotEmpty'),
+                },
+            },
+        },
+    };
+}

package/src/index.ts

@@ -50,3 +50,34 @@ export type { TradeHistoryDeps } from './trade-history-widget.js';
 export { WatchlistWidget } from './watchlist-widget.js';
 
 export type { WatchlistDeps } from './watchlist-widget.js';
+
+export { OrderEntrySides, OrderEntryTypes, OrderEntryWidget } from './order-entry-widget.js';
+
+export type { OrderEntryDeps, OrderEntrySide, OrderEntryType, OrderEntryValues } from './order-entry-widget.js';
+
+export type { InstrumentSpec } from './trading-data.js';
+
+export { OrderBookWidget } from './orderbook-widget.js';
+
+export type { OrderBookDeps, OrderBookView } from './orderbook-widget.js';
+
+export type { BookLevel, OrderBookFrame, QuoteLevel } from './trading-data.js';
+
+// The palette a host answers with for the parts a control draws on a canvas,
+// where a class name cannot reach.
+export type { CanvasPalette } from './trading-host.js';
+
+export { TradeFeedWidget } from './tradefeed-widget.js';
+
+export type { TradeFeedDeps } from './tradefeed-widget.js';
+
+// The tape's own shapes: one print as the chart reads it, and the bubble a
+// print (or a slice of them) is drawn as. A host that renders its own view of
+// the same feed reads these rather than reinventing the compaction.
+export { aggregateBubbles } from './tradefeed-aggregator.js';
+
+export type { FeedBubble, FeedTick } from './tradefeed-aggregator.js';
+
+export { layoutBubbles } from './tradefeed-bubbles.js';
+
+export type { BubbleAxisTick, BubbleLane, BubbleLaneShape, BubbleLayout, BubbleLayoutInput, BubbleShape } from './tradefeed-bubbles.js';