minerva-design 1.2.0 → 1.4.0

package/dist/vue/components/Chart/orderbook.d.ts

@@ -0,0 +1,359 @@
+import { PropType } from 'vue';
+import { ChartRendererPreference, DepthChartLabels, DepthChartPriceLine, OrderBookColorConvention, OrderBookDelta, OrderBookHeatmapLabels, OrderBookHeatmapScale, OrderBookLabels, OrderBookMode, OrderBookSnapshot, TimeAndSalesColumn, TimeAndSalesLabels } from '../../../charts/core.js';
+import { EngineInstance } from './engine.js';
+import { ChartTrades } from './types.js';
+/** Props of DepthChart */
+export declare const depthChartProps: {
+    /** Book to draw, applied when the object changes (stream updates through the handle's `applyDeltas`) */
+    book: PropType<OrderBookSnapshot>;
+    /** Visible range on each side of the mid price, as a fraction of the mid; fits the book by default */
+    range: NumberConstructor;
+    /** Smallest and largest `range` reachable by zooming (default `[0.0005, 0.5]`) */
+    rangeLimits: PropType<readonly [number, number]>;
+    /** Zoom around the mid with the wheel / pinch (default `true`) */
+    zoomable: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Stepped or straight curves (default `step`) */
+    curve: PropType<"step" | "linear">;
+    /** Cumulative amount in the base asset or the quote notional (default `base`) */
+    amount: PropType<"base" | "quote">;
+    /** Eased transitions between books (default `true`) */
+    animate: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Opacity of the areas, 0-1 (default 0.28) */
+    fillOpacity: NumberConstructor;
+    /** Line and label at the mid price (default `true`) */
+    midLine: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Legend with the spread (default `true`) */
+    legend: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Grid lines (default `true`) */
+    grid: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Price and amount axes (default `true`) */
+    axes: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Hover readout (default `true`) */
+    tooltip: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Mirrored readout on the other side (default `true`) */
+    mirror: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Reference lines at prices (an order, a liquidation) */
+    priceLines: PropType<readonly DepthChartPriceLine[]>;
+    /** Overrides of the built-in texts of the `locale` */
+    labels: PropType<Partial<DepthChartLabels>>;
+    /** Color of the bids / buys (any CSS color); from `colorConvention` by default */
+    upColor: StringConstructor;
+    /** Color of the asks / sells */
+    downColor: StringConstructor;
+    /** `red-up` swaps the default colors (default `green-up`) */
+    colorConvention: PropType<OrderBookColorConvention>;
+    /** Decimals of the prices; detected from the data by default */
+    pricePrecision: NumberConstructor;
+    /** Decimals of the sizes; detected from the data by default */
+    sizePrecision: NumberConstructor;
+    /** Locale of the numbers and texts (`"zh-CN"`); the page language by default */
+    locale: StringConstructor;
+    /** Formats the prices; overrides `pricePrecision` */
+    formatPrice: PropType<(price: number) => string>;
+    /** Formats the sizes; overrides `sizePrecision` */
+    formatSize: PropType<(size: number) => string>;
+    /** Font family of the texts (default: the theme font) */
+    fontFamily: StringConstructor;
+    /** Font size of the texts, in pixels (default 12) */
+    fontSize: NumberConstructor;
+    /** Accessible label */
+    ariaLabel: StringConstructor;
+    height: PropType<number | string>;
+    width: PropType<number | string>;
+    deep: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};
+/** Props of OrderBook */
+export declare const orderBookProps: {
+    /** Book to draw, applied when the object changes (stream updates through the handle's `applyDeltas`) */
+    book: PropType<OrderBookSnapshot>;
+    /** Price of the spread row, colored by its last move; the mid price when omitted */
+    lastPrice: {
+        type: PropType<number | null>;
+        default: undefined;
+    };
+    /** Sides shown (default `both`) */
+    mode: PropType<OrderBookMode>;
+    /** Price step the levels are grouped by (default 0: none) */
+    grouping: NumberConstructor;
+    /** Rows per side; fills the height by default */
+    rows: NumberConstructor;
+    /** Height of a row, in pixels (default 20) */
+    rowHeight: NumberConstructor;
+    /** Depth bars behind the rows (default `cumulative`) */
+    depthBars: PropType<"cumulative" | "level" | "none">;
+    /** Total column in the base asset or the quote notional (default `base`) */
+    total: PropType<"base" | "quote">;
+    /** Columns, in order (default `["price", "size", "total"]`) */
+    columns: PropType<readonly ("price" | "size" | "total")[]>;
+    /** Flashes the changed sizes (default `true`) */
+    flash: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Duration of a flash, in ms (default 450) */
+    flashDuration: NumberConstructor;
+    /** Highlights the levels at or above this size */
+    largeOrderThreshold: NumberConstructor;
+    /** Column headers (default `true`) */
+    header: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Spread row between the sides (default `true`) */
+    spreadRow: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Bid / ask imbalance bar (default `true`) */
+    imbalance: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Hover summary of the cumulative levels (default `true`) */
+    tooltip: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Overrides of the built-in texts of the `locale` */
+    labels: PropType<Partial<OrderBookLabels>>;
+    /** Color of the bids / buys (any CSS color); from `colorConvention` by default */
+    upColor: StringConstructor;
+    /** Color of the asks / sells */
+    downColor: StringConstructor;
+    /** `red-up` swaps the default colors (default `green-up`) */
+    colorConvention: PropType<OrderBookColorConvention>;
+    /** Decimals of the prices; detected from the data by default */
+    pricePrecision: NumberConstructor;
+    /** Decimals of the sizes; detected from the data by default */
+    sizePrecision: NumberConstructor;
+    /** Locale of the numbers and texts (`"zh-CN"`); the page language by default */
+    locale: StringConstructor;
+    /** Formats the prices; overrides `pricePrecision` */
+    formatPrice: PropType<(price: number) => string>;
+    /** Formats the sizes; overrides `sizePrecision` */
+    formatSize: PropType<(size: number) => string>;
+    /** Font family of the texts (default: the theme font) */
+    fontFamily: StringConstructor;
+    /** Font size of the texts, in pixels (default 12) */
+    fontSize: NumberConstructor;
+    /** Accessible label */
+    ariaLabel: StringConstructor;
+    height: PropType<number | string>;
+    width: PropType<number | string>;
+    deep: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};
+/** Props of OrderBookHeatmap */
+export declare const orderBookHeatmapProps: {
+    /** Book, applied when the object changes (stream updates through the handle's `applyDeltas`) */
+    book: PropType<OrderBookSnapshot>;
+    /** Trades; when the array grows, only the appended ones are added */
+    trades: PropType<ChartTrades>;
+    /** Price step of the rows; detected from the book by default */
+    tickSize: NumberConstructor;
+    /** Duration of a column, in ms (default 100) */
+    interval: NumberConstructor;
+    /** Time shown, in ms (default 60000) */
+    window: NumberConstructor;
+    /** Time kept for panning back, in ms (default 300000) */
+    history: NumberConstructor;
+    /** Price levels kept on each side (default 160) */
+    depth: NumberConstructor;
+    /** Price range shown around the mid; from `depth` by default */
+    priceSpan: NumberConstructor;
+    /** Scale of the sizes to the colors (default `log`) */
+    colorScale: PropType<OrderBookHeatmapScale>;
+    /** Contrast of the colors (default 1) */
+    contrast: NumberConstructor;
+    /** Size drawn with the last color; follows the data by default */
+    maxSize: NumberConstructor;
+    /** Colors from no liquidity to `maxSize` (any CSS colors) */
+    colors: PropType<readonly string[]>;
+    /** Trades as bubbles (default `true`) */
+    bubbles: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Diameter of the largest bubble, in pixels (default 28) */
+    bubbleSize: NumberConstructor;
+    /** Trade volume of the largest bubble; follows the data by default */
+    bubbleVolume: NumberConstructor;
+    /** Best bid / ask lines (default `true`) */
+    bestLines: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Size profile of the current book at the right (default `true`) */
+    profile: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Zoom and pan (default `true`) */
+    interactive: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Hover readout (default `true`) */
+    tooltip: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Backend: WebGPU, then WebGL2, WebGL, Canvas2D (default `auto`) */
+    renderer: PropType<ChartRendererPreference>;
+    /** Overrides of the built-in texts of the `locale` */
+    labels: PropType<Partial<OrderBookHeatmapLabels>>;
+    /** Color of the bids / buys (any CSS color); from `colorConvention` by default */
+    upColor: StringConstructor;
+    /** Color of the asks / sells */
+    downColor: StringConstructor;
+    /** `red-up` swaps the default colors (default `green-up`) */
+    colorConvention: PropType<OrderBookColorConvention>;
+    /** Decimals of the prices; detected from the data by default */
+    pricePrecision: NumberConstructor;
+    /** Decimals of the sizes; detected from the data by default */
+    sizePrecision: NumberConstructor;
+    /** Locale of the numbers and texts (`"zh-CN"`); the page language by default */
+    locale: StringConstructor;
+    /** Formats the prices; overrides `pricePrecision` */
+    formatPrice: PropType<(price: number) => string>;
+    /** Formats the sizes; overrides `sizePrecision` */
+    formatSize: PropType<(size: number) => string>;
+    /** Font family of the texts (default: the theme font) */
+    fontFamily: StringConstructor;
+    /** Font size of the texts, in pixels (default 12) */
+    fontSize: NumberConstructor;
+    /** Accessible label */
+    ariaLabel: StringConstructor;
+    height: PropType<number | string>;
+    width: PropType<number | string>;
+    deep: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};
+/** Props of TimeAndSales */
+export declare const timeAndSalesProps: {
+    /** Trades, oldest first; when the array grows, only the appended ones are added (other changes replace the tape) */
+    trades: PropType<ChartTrades>;
+    /** Trades kept (default 200000) */
+    capacity: NumberConstructor;
+    /** Height of a row, in pixels (default 20) */
+    rowHeight: NumberConstructor;
+    /** Columns, in order (default `["time", "price", "size"]`) */
+    columns: PropType<readonly TimeAndSalesColumn[]>;
+    /** Hides the trades below this size (default 0) */
+    minSize: NumberConstructor;
+    /** Highlights the trades at or above this size */
+    largeTradeThreshold: NumberConstructor;
+    /** Merges the consecutive trades of the same side and price (default `false`) */
+    aggregate: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Price color: the side of the trade or the tick direction (default `side`) */
+    priceColor: PropType<"side" | "tick">;
+    /** Pauses the tape while hovered (default `true`) */
+    pauseOnHover: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Slides the new rows in (default `true`) */
+    animate: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Column headers (default `true`) */
+    header: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Milliseconds in the times (default `true`) */
+    milliseconds: {
+        readonly type: BooleanConstructor;
+        readonly default: undefined;
+    };
+    /** Formats the times */
+    formatTime: PropType<(time: number) => string>;
+    /** Overrides of the built-in texts of the `locale` */
+    labels: PropType<Partial<TimeAndSalesLabels>>;
+    /** Color of the bids / buys (any CSS color); from `colorConvention` by default */
+    upColor: StringConstructor;
+    /** Color of the asks / sells */
+    downColor: StringConstructor;
+    /** `red-up` swaps the default colors (default `green-up`) */
+    colorConvention: PropType<OrderBookColorConvention>;
+    /** Decimals of the prices; detected from the data by default */
+    pricePrecision: NumberConstructor;
+    /** Decimals of the sizes; detected from the data by default */
+    sizePrecision: NumberConstructor;
+    /** Locale of the numbers and texts (`"zh-CN"`); the page language by default */
+    locale: StringConstructor;
+    /** Formats the prices; overrides `pricePrecision` */
+    formatPrice: PropType<(price: number) => string>;
+    /** Formats the sizes; overrides `sizePrecision` */
+    formatSize: PropType<(size: number) => string>;
+    /** Font family of the texts (default: the theme font) */
+    fontFamily: StringConstructor;
+    /** Font size of the texts, in pixels (default 12) */
+    fontSize: NumberConstructor;
+    /** Accessible label */
+    ariaLabel: StringConstructor;
+    height: PropType<number | string>;
+    width: PropType<number | string>;
+    deep: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};
+interface Widget<O> extends EngineInstance<O> {
+    setBook?(snapshot: OrderBookSnapshot): void;
+    applyDeltas?(deltas: OrderBookDelta | readonly OrderBookDelta[]): void;
+}
+/**
+ * Mounts an order book engine: the options are every set prop but the
+ * streamed ones; `book` goes through `setBook` when the object changes,
+ * `trades` through `add` (the appended trades) / `replace` (any other
+ * change)
+ */
+export declare function useBookWidget<O, I extends Widget<O>>(factory: (container: HTMLElement, options: O) => I, props: Record<string, unknown> & {
+    book?: OrderBookSnapshot;
+    trades?: ChartTrades;
+    deep?: boolean;
+}, bind: (engine: I) => Array<() => void>, trades?: {
+    add: (engine: I, trades: ChartTrades) => void;
+    replace: (engine: I, trades: ChartTrades) => void;
+}): {
+    container: import('vue').Ref<HTMLElement | null>;
+    setContainer: (el: unknown) => void;
+    instance: import('vue').ShallowRef<I | null>;
+};
+export {};

package/dist/vue/components/Chart/orderbook.js

@@ -0,0 +1,126 @@
+import { raw as e, useChartEngine as t } from "./engine.js";
+import { chartFrameProps as n } from "./props.js";
+import { definedOptions as r } from "./trading.js";
+import { watch as i } from "vue";
+//#region src/components/Chart/orderbook.ts
+var a = {
+	type: Boolean,
+	default: void 0
+}, o = {
+	...n,
+	upColor: String,
+	downColor: String,
+	colorConvention: String,
+	pricePrecision: Number,
+	sizePrecision: Number,
+	locale: String,
+	formatPrice: Function,
+	formatSize: Function,
+	fontFamily: String,
+	fontSize: Number,
+	ariaLabel: String
+}, s = {
+	...o,
+	book: Object,
+	range: Number,
+	rangeLimits: Array,
+	zoomable: a,
+	curve: String,
+	amount: String,
+	animate: a,
+	fillOpacity: Number,
+	midLine: a,
+	legend: a,
+	grid: a,
+	axes: a,
+	tooltip: a,
+	mirror: a,
+	priceLines: Array,
+	labels: Object
+}, c = {
+	...o,
+	book: Object,
+	lastPrice: {
+		type: Number,
+		default: void 0
+	},
+	mode: String,
+	grouping: Number,
+	rows: Number,
+	rowHeight: Number,
+	depthBars: String,
+	total: String,
+	columns: Array,
+	flash: a,
+	flashDuration: Number,
+	largeOrderThreshold: Number,
+	header: a,
+	spreadRow: a,
+	imbalance: a,
+	tooltip: a,
+	labels: Object
+}, l = {
+	...o,
+	book: Object,
+	trades: Array,
+	tickSize: Number,
+	interval: Number,
+	window: Number,
+	history: Number,
+	depth: Number,
+	priceSpan: Number,
+	colorScale: String,
+	contrast: Number,
+	maxSize: Number,
+	colors: Array,
+	bubbles: a,
+	bubbleSize: Number,
+	bubbleVolume: Number,
+	bestLines: a,
+	profile: a,
+	interactive: a,
+	tooltip: a,
+	renderer: String,
+	labels: Object
+}, u = {
+	...o,
+	trades: Array,
+	capacity: Number,
+	rowHeight: Number,
+	columns: Array,
+	minSize: Number,
+	largeTradeThreshold: Number,
+	aggregate: a,
+	priceColor: String,
+	pauseOnHover: a,
+	animate: a,
+	header: a,
+	milliseconds: a,
+	formatTime: Function,
+	labels: Object
+}, d = [
+	"book",
+	"trades",
+	"lastPrice"
+];
+function f(n, a, o, s) {
+	let c, l = (t) => {
+		let n = e(a.trades), r = c;
+		if (c = n, !s || !n || n === r) return;
+		let i = r?.length ?? 0;
+		if (r && i > 0 && n.length >= i && n[0] === r[0] && n[i - 1] === r[i - 1]) {
+			n.length > i && s.add(t, n.slice(i));
+			return;
+		}
+		s.replace(t, n);
+	}, u = t(n, a, () => r(a, d), (t) => (c = void 0, a.book && t.setBook?.(e(a.book)), l(t), o(t)), () => r(a, d));
+	return i(() => a.book, (t) => {
+		t && u.instance.value?.setBook?.(e(t));
+	}), i(() => a.trades, () => {
+		u.instance.value && l(u.instance.value);
+	}), u;
+}
+//#endregion
+export { s as depthChartProps, l as orderBookHeatmapProps, c as orderBookProps, u as timeAndSalesProps, f as useBookWidget };
+
+//# sourceMappingURL=orderbook.js.map

package/dist/vue/components/Chart/orderbook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"orderbook.js","names":["optionalBoolean","commonProps","chartFrameProps","depthChartProps","orderBookProps","orderBookHeatmapProps","timeAndSalesProps","STREAMED","useBookWidget","previous","feed","list","raw","props","before","trades","n","engine","useChartEngine","factory","definedOptions","instance","bind","watch","book"],"sources":["../../../../../vue/src/components/Chart/orderbook.ts"],"sourcesContent":["import { watch, type PropType } from \"vue\";\nimport type {\n  ChartRendererPreference,\n  DepthChartLabels,\n  DepthChartPriceLine,\n  OrderBookColorConvention,\n  OrderBookDelta,\n  OrderBookHeatmapLabels,\n  OrderBookHeatmapScale,\n  OrderBookLabels,\n  OrderBookMode,\n  OrderBookSnapshot,\n  TimeAndSalesColumn,\n  TimeAndSalesLabels,\n} from \"minerva-design/charts/core\";\nimport { raw, useChartEngine, type EngineInstance } from \"./engine\";\nimport { chartFrameProps } from \"./props\";\nimport { definedOptions } from \"./trading\";\nimport type { ChartTrades } from \"./types\";\n\nconst optionalBoolean = { type: Boolean, default: undefined } as const;\n\n/** Options shared by the order book components */\nconst commonProps = {\n  ...chartFrameProps,\n  /** Color of the bids / buys (any CSS color); from `colorConvention` by default */\n  upColor: String,\n  /** Color of the asks / sells */\n  downColor: String,\n  /** `red-up` swaps the default colors (default `green-up`) */\n  colorConvention: String as PropType<OrderBookColorConvention>,\n  /** Decimals of the prices; detected from the data by default */\n  pricePrecision: Number,\n  /** Decimals of the sizes; detected from the data by default */\n  sizePrecision: Number,\n  /** Locale of the numbers and texts (`\"zh-CN\"`); the page language by default */\n  locale: String,\n  /** Formats the prices; overrides `pricePrecision` */\n  formatPrice: Function as PropType<(price: number) => string>,\n  /** Formats the sizes; overrides `sizePrecision` */\n  formatSize: Function as PropType<(size: number) => string>,\n  /** Font family of the texts (default: the theme font) */\n  fontFamily: String,\n  /** Font size of the texts, in pixels (default 12) */\n  fontSize: Number,\n  /** Accessible label */\n  ariaLabel: String,\n};\n\n/** Props of DepthChart */\nexport const depthChartProps = {\n  ...commonProps,\n  /** Book to draw, applied when the object changes (stream updates through the handle's `applyDeltas`) */\n  book: Object as PropType<OrderBookSnapshot>,\n  /** Visible range on each side of the mid price, as a fraction of the mid; fits the book by default */\n  range: Number,\n  /** Smallest and largest `range` reachable by zooming (default `[0.0005, 0.5]`) */\n  rangeLimits: Array as unknown as PropType<readonly [number, number]>,\n  /** Zoom around the mid with the wheel / pinch (default `true`) */\n  zoomable: optionalBoolean,\n  /** Stepped or straight curves (default `step`) */\n  curve: String as PropType<\"step\" | \"linear\">,\n  /** Cumulative amount in the base asset or the quote notional (default `base`) */\n  amount: String as PropType<\"base\" | \"quote\">,\n  /** Eased transitions between books (default `true`) */\n  animate: optionalBoolean,\n  /** Opacity of the areas, 0-1 (default 0.28) */\n  fillOpacity: Number,\n  /** Line and label at the mid price (default `true`) */\n  midLine: optionalBoolean,\n  /** Legend with the spread (default `true`) */\n  legend: optionalBoolean,\n  /** Grid lines (default `true`) */\n  grid: optionalBoolean,\n  /** Price and amount axes (default `true`) */\n  axes: optionalBoolean,\n  /** Hover readout (default `true`) */\n  tooltip: optionalBoolean,\n  /** Mirrored readout on the other side (default `true`) */\n  mirror: optionalBoolean,\n  /** Reference lines at prices (an order, a liquidation) */\n  priceLines: Array as PropType<readonly DepthChartPriceLine[]>,\n  /** Overrides of the built-in texts of the `locale` */\n  labels: Object as PropType<Partial<DepthChartLabels>>,\n};\n\n/** Props of OrderBook */\nexport const orderBookProps = {\n  ...commonProps,\n  /** Book to draw, applied when the object changes (stream updates through the handle's `applyDeltas`) */\n  book: Object as PropType<OrderBookSnapshot>,\n  /** Price of the spread row, colored by its last move; the mid price when omitted */\n  lastPrice: { type: Number as PropType<number | null>, default: undefined },\n  /** Sides shown (default `both`) */\n  mode: String as PropType<OrderBookMode>,\n  /** Price step the levels are grouped by (default 0: none) */\n  grouping: Number,\n  /** Rows per side; fills the height by default */\n  rows: Number,\n  /** Height of a row, in pixels (default 20) */\n  rowHeight: Number,\n  /** Depth bars behind the rows (default `cumulative`) */\n  depthBars: String as PropType<\"cumulative\" | \"level\" | \"none\">,\n  /** Total column in the base asset or the quote notional (default `base`) */\n  total: String as PropType<\"base\" | \"quote\">,\n  /** Columns, in order (default `[\"price\", \"size\", \"total\"]`) */\n  columns: Array as PropType<readonly (\"price\" | \"size\" | \"total\")[]>,\n  /** Flashes the changed sizes (default `true`) */\n  flash: optionalBoolean,\n  /** Duration of a flash, in ms (default 450) */\n  flashDuration: Number,\n  /** Highlights the levels at or above this size */\n  largeOrderThreshold: Number,\n  /** Column headers (default `true`) */\n  header: optionalBoolean,\n  /** Spread row between the sides (default `true`) */\n  spreadRow: optionalBoolean,\n  /** Bid / ask imbalance bar (default `true`) */\n  imbalance: optionalBoolean,\n  /** Hover summary of the cumulative levels (default `true`) */\n  tooltip: optionalBoolean,\n  /** Overrides of the built-in texts of the `locale` */\n  labels: Object as PropType<Partial<OrderBookLabels>>,\n};\n\n/** Props of OrderBookHeatmap */\nexport const orderBookHeatmapProps = {\n  ...commonProps,\n  /** Book, applied when the object changes (stream updates through the handle's `applyDeltas`) */\n  book: Object as PropType<OrderBookSnapshot>,\n  /** Trades; when the array grows, only the appended ones are added */\n  trades: Array as PropType<ChartTrades>,\n  /** Price step of the rows; detected from the book by default */\n  tickSize: Number,\n  /** Duration of a column, in ms (default 100) */\n  interval: Number,\n  /** Time shown, in ms (default 60000) */\n  window: Number,\n  /** Time kept for panning back, in ms (default 300000) */\n  history: Number,\n  /** Price levels kept on each side (default 160) */\n  depth: Number,\n  /** Price range shown around the mid; from `depth` by default */\n  priceSpan: Number,\n  /** Scale of the sizes to the colors (default `log`) */\n  colorScale: String as PropType<OrderBookHeatmapScale>,\n  /** Contrast of the colors (default 1) */\n  contrast: Number,\n  /** Size drawn with the last color; follows the data by default */\n  maxSize: Number,\n  /** Colors from no liquidity to `maxSize` (any CSS colors) */\n  colors: Array as PropType<readonly string[]>,\n  /** Trades as bubbles (default `true`) */\n  bubbles: optionalBoolean,\n  /** Diameter of the largest bubble, in pixels (default 28) */\n  bubbleSize: Number,\n  /** Trade volume of the largest bubble; follows the data by default */\n  bubbleVolume: Number,\n  /** Best bid / ask lines (default `true`) */\n  bestLines: optionalBoolean,\n  /** Size profile of the current book at the right (default `true`) */\n  profile: optionalBoolean,\n  /** Zoom and pan (default `true`) */\n  interactive: optionalBoolean,\n  /** Hover readout (default `true`) */\n  tooltip: optionalBoolean,\n  /** Backend: WebGPU, then WebGL2, WebGL, Canvas2D (default `auto`) */\n  renderer: String as PropType<ChartRendererPreference>,\n  /** Overrides of the built-in texts of the `locale` */\n  labels: Object as PropType<Partial<OrderBookHeatmapLabels>>,\n};\n\n/** Props of TimeAndSales */\nexport const timeAndSalesProps = {\n  ...commonProps,\n  /** Trades, oldest first; when the array grows, only the appended ones are added (other changes replace the tape) */\n  trades: Array as PropType<ChartTrades>,\n  /** Trades kept (default 200000) */\n  capacity: Number,\n  /** Height of a row, in pixels (default 20) */\n  rowHeight: Number,\n  /** Columns, in order (default `[\"time\", \"price\", \"size\"]`) */\n  columns: Array as PropType<readonly TimeAndSalesColumn[]>,\n  /** Hides the trades below this size (default 0) */\n  minSize: Number,\n  /** Highlights the trades at or above this size */\n  largeTradeThreshold: Number,\n  /** Merges the consecutive trades of the same side and price (default `false`) */\n  aggregate: optionalBoolean,\n  /** Price color: the side of the trade or the tick direction (default `side`) */\n  priceColor: String as PropType<\"side\" | \"tick\">,\n  /** Pauses the tape while hovered (default `true`) */\n  pauseOnHover: optionalBoolean,\n  /** Slides the new rows in (default `true`) */\n  animate: optionalBoolean,\n  /** Column headers (default `true`) */\n  header: optionalBoolean,\n  /** Milliseconds in the times (default `true`) */\n  milliseconds: optionalBoolean,\n  /** Formats the times */\n  formatTime: Function as PropType<(time: number) => string>,\n  /** Overrides of the built-in texts of the `locale` */\n  labels: Object as PropType<Partial<TimeAndSalesLabels>>,\n};\n\n/** Props passed through engine methods rather than the options */\nconst STREAMED = [\"book\", \"trades\", \"lastPrice\"];\n\ninterface Widget<O> extends EngineInstance<O> {\n  setBook?(snapshot: OrderBookSnapshot): void;\n  applyDeltas?(deltas: OrderBookDelta | readonly OrderBookDelta[]): void;\n}\n\n/**\n * Mounts an order book engine: the options are every set prop but the\n * streamed ones; `book` goes through `setBook` when the object changes,\n * `trades` through `add` (the appended trades) / `replace` (any other\n * change)\n */\nexport function useBookWidget<O, I extends Widget<O>>(\n  factory: (container: HTMLElement, options: O) => I,\n  props: Record<string, unknown> & {\n    book?: OrderBookSnapshot;\n    trades?: ChartTrades;\n    deep?: boolean;\n  },\n  bind: (engine: I) => Array<() => void>,\n  trades?: {\n    add: (engine: I, trades: ChartTrades) => void;\n    replace: (engine: I, trades: ChartTrades) => void;\n  },\n) {\n  let previous: ChartTrades | undefined;\n  const feed = (engine: I) => {\n    const list = raw(props.trades);\n    const before = previous;\n    previous = list;\n    if (!trades || !list || list === before) return;\n    const n = before?.length ?? 0;\n    if (\n      before &&\n      n > 0 &&\n      list.length >= n &&\n      list[0] === before[0] &&\n      list[n - 1] === before[n - 1]\n    ) {\n      if (list.length > n) trades.add(engine, list.slice(n));\n      return;\n    }\n    trades.replace(engine, list);\n  };\n  const engine = useChartEngine<O, I>(\n    factory,\n    props,\n    () => definedOptions<O>(props, STREAMED),\n    (instance) => {\n      previous = undefined;\n      if (props.book) instance.setBook?.(raw(props.book));\n      feed(instance);\n      return bind(instance);\n    },\n    () => definedOptions(props, STREAMED),\n  );\n  watch(\n    () => props.book,\n    (book) => {\n      if (book) engine.instance.value?.setBook?.(raw(book));\n    },\n  );\n  watch(\n    () => props.trades,\n    () => {\n      if (engine.instance.value) feed(engine.instance.value);\n    },\n  );\n  return engine;\n}\n"],"mappings":";;;;;AAoBA,IAAMA,IAAkB;CAAE,MAAM;CAAS,SAAS,KAAA;AAAU,GAGtDC,IAAc;CAClB,GAAGC;CAEH,SAAS;CAET,WAAW;CAEX,iBAAiB;CAEjB,gBAAgB;CAEhB,eAAe;CAEf,QAAQ;CAER,aAAa;CAEb,YAAY;CAEZ,YAAY;CAEZ,UAAU;CAEV,WAAW;AACb,GAGaC,IAAkB;CAC7B,GAAGF;CAEH,MAAM;CAEN,OAAO;CAEP,aAAa;CAEb,UAAUD;CAEV,OAAO;CAEP,QAAQ;CAER,SAASA;CAET,aAAa;CAEb,SAASA;CAET,QAAQA;CAER,MAAMA;CAEN,MAAMA;CAEN,SAASA;CAET,QAAQA;CAER,YAAY;CAEZ,QAAQ;AACV,GAGaI,IAAiB;CAC5B,GAAGH;CAEH,MAAM;CAEN,WAAW;EAAE,MAAM;EAAmC,SAAS,KAAA;CAAU;CAEzE,MAAM;CAEN,UAAU;CAEV,MAAM;CAEN,WAAW;CAEX,WAAW;CAEX,OAAO;CAEP,SAAS;CAET,OAAOD;CAEP,eAAe;CAEf,qBAAqB;CAErB,QAAQA;CAER,WAAWA;CAEX,WAAWA;CAEX,SAASA;CAET,QAAQ;AACV,GAGaK,IAAwB;CACnC,GAAGJ;CAEH,MAAM;CAEN,QAAQ;CAER,UAAU;CAEV,UAAU;CAEV,QAAQ;CAER,SAAS;CAET,OAAO;CAEP,WAAW;CAEX,YAAY;CAEZ,UAAU;CAEV,SAAS;CAET,QAAQ;CAER,SAASD;CAET,YAAY;CAEZ,cAAc;CAEd,WAAWA;CAEX,SAASA;CAET,aAAaA;CAEb,SAASA;CAET,UAAU;CAEV,QAAQ;AACV,GAGaM,IAAoB;CAC/B,GAAGL;CAEH,QAAQ;CAER,UAAU;CAEV,WAAW;CAEX,SAAS;CAET,SAAS;CAET,qBAAqB;CAErB,WAAWD;CAEX,YAAY;CAEZ,cAAcA;CAEd,SAASA;CAET,QAAQA;CAER,cAAcA;CAEd,YAAY;CAEZ,QAAQ;AACV,GAGMO,IAAW;CAAC;CAAQ;CAAU;AAAW;AAa/C,SAAgBC,EACd,GACA,GAKA,GACA,GAIA;CACA,IAAIC,GACEC,KAAQ,MAAc;EAC1B,IAAMC,IAAOC,EAAIC,EAAM,MAAM,GACvBC,IAASL;EAEf,IADA,IAAWE,GACP,CAACI,KAAU,CAACJ,KAAQA,MAASG,GAAQ;EACzC,IAAME,IAAIF,GAAQ,UAAU;EAC5B,IACEA,KACAE,IAAI,KACJL,EAAK,UAAUK,KACfL,EAAK,OAAOG,EAAO,MACnBH,EAAKK,IAAI,OAAOF,EAAOE,IAAI,IAC3B;GACA,AAAIL,EAAK,SAASK,KAAGD,EAAO,IAAIE,GAAQN,EAAK,MAAMK,CAAC,CAAC;GACrD;EACF;EACA,EAAO,QAAQC,GAAQN,CAAI;CAC7B,GACMM,IAASC,EACbC,GACAN,SACMO,EAAkBP,GAAON,CAAQ,IACtC,OACC,IAAW,KAAA,GACPM,EAAM,QAAMQ,EAAS,UAAUT,EAAIC,EAAM,IAAI,CAAC,GAClDH,EAAKW,CAAQ,GACNC,EAAKD,CAAQ,UAEhBD,EAAeP,GAAON,CAAQ,CACtC;CAaA,OAZAgB,QACQV,EAAM,OACX,MAAS;EACR,AAAIW,KAAMP,EAAO,SAAS,OAAO,UAAUL,EAAIY,CAAI,CAAC;CACtD,CACF,GACAD,QACQV,EAAM,cACN;EACJ,AAAII,EAAO,SAAS,SAAOP,EAAKO,EAAO,SAAS,KAAK;CACvD,CACF,GACOA;AACT"}