UNPKG

@orderly.network/ui-tradingview

Version:

1,316 lines (1,315 loc) 587 kB
import * as React$1 from 'react'; import React__default from 'react'; import { LocaleCode } from '@orderly.network/i18n'; /* eslint-enable jsdoc/require-jsdoc */ declare enum HHistDirection { LeftToRight = 'left_to_right', RightToLeft = 'right_to_left', } declare enum LineStudyPlotStyle { /** * Line plot style. */ Line = 0, /** * Histogram plot style. */ Histogram = 1, /** * Cross plot style. */ Cross = 3, /** * Area plot style. */ Area = 4, /** * Column plot style. */ Columns = 5, /** * Circles plot style. */ Circles = 6, /** * Line with breaks plot style. */ LineWithBreaks = 7, /** * Area with breaks plot style. */ AreaWithBreaks = 8, /** * Step line plot style. */ StepLine = 9, /** * Step line with diamonds plot style. */ StepLineWithDiamonds = 10, /** * Step line with breaks, like LineWithBreaks */ StepLineWithBreaks = 11, } declare enum LineStyle { /** * Solid line style. */ Solid = 0, /** * Dotted line style. */ Dotted = 1, /** * Dashed line style. */ Dashed = 2, } declare enum MarkLocation { AboveBar = 'AboveBar', BelowBar = 'BelowBar', Top = 'Top', Bottom = 'Bottom', Right = 'Right', Left = 'Left', Absolute = 'Absolute', AbsoluteUp = 'AbsoluteUp', AbsoluteDown = 'AbsoluteDown', } declare enum PlotSymbolSize { Auto = 'auto', Tiny = 'tiny', Small = 'small', Normal = 'normal', Large = 'large', Huge = 'huge', } declare const enum ActionId { ChartAddIndicatorToAllCharts = 'Chart.AddIndicatorToAllCharts', ChartAddSymbolToWatchList = 'Chart.AddSymbolToWatchList', ChartApplyIndicatorsToAllCharts = 'Chart.ApplyIndicatorsToAllCharts', ChartChangeTimeZone = 'Chart.ChangeTimeZone', ChartClipboardCopyPrice = 'Chart.Clipboard.CopyPrice', ChartClipboardCopyLineTools = 'Chart.Clipboard.CopyLineTools', ChartClipboardCopySource = 'Chart.Clipboard.CopySource', ChartClipboardPasteSource = 'Chart.Clipboard.PasteSource', ChartCrosshairLockVerticalCursor = 'Chart.Crosshair.LockVerticalCursor', ChartCrosshairPlusButtonDrawHorizontalLine = 'Chart.Crosshair.PlusButton.DrawHorizontalLine', ChartCustomActionId = 'Chart.CustomActionId', ChartDialogsShowChangeInterval = 'Chart.Dialogs.ShowChangeInterval', ChartDialogsShowChangeSymbol = 'Chart.Dialogs.ShowChangeSymbol', ChartDialogsShowCompareOrAddSymbol = 'Chart.Dialogs.ShowCompareOrAddSymbol', ChartDialogsShowGeneralSettings = 'Chart.Dialogs.ShowGeneralSettings', ChartDialogsShowGeneralSettingsLegendTab = 'Chart.Dialogs.ShowGeneralSettings.LegendTab', ChartDialogsShowGeneralSettingsSymbolTab = 'Chart.Dialogs.ShowGeneralSettings.SymbolTab', ChartDialogsShowGeneralScalesTab = 'Chart.Dialogs.ShowGeneralSettings.ScalesTab', ChartDialogsShowGoToDate = 'Chart.Dialogs.ShowGoToDate', ChartDialogsShowInsertIndicators = 'Chart.Dialogs.ShowInsertIndicators', ChartDialogsShowSymbolInfo = 'Chart.Dialogs.ShowSymbolInfo', ChartDrawingToolbarToggleVisibility = 'Chart.DrawingToolbar.ToggleVisibility', ChartExternalActionId = 'Chart.ExternalActionId', ChartFavoriteDrawingToolsToolbarHide = 'Chart.FavoriteDrawingToolsToolbar.Hide', ChartIndicatorShowSettingsDialog = 'Chart.Indicator.ShowSettingsDialog', ChartLegendToggleLastDayChangeValuesVisibility = 'Chart.Legend.ToggleLastDayChangeValuesVisibility', ChartLegendToggleBarChangeValuesVisibility = 'Chart.Legend.ToggleBarChangeValuesVisibility', ChartLegendTogglePriceSourceVisibility = 'Chart.Legend.TogglePriceSourceVisibility', ChartLegendToggleIndicatorArgumentsVisibility = 'Chart.Legend.ToggleIndicatorArgumentsVisibility', ChartLegendToggleIndicatorTitlesVisibility = 'Chart.Legend.ToggleIndicatorTitlesVisibility', ChartLegendToggleIndicatorValuesVisibility = 'Chart.Legend.ToggleIndicatorValuesVisibility', ChartLegendToggleOhlcValuesVisibility = 'Chart.Legend.ToggleOhlcValuesVisibility', ChartLegendToggleOpenMarketStatusVisibility = 'Chart.Legend.ToggleOpenMarketStatusVisibility', ChartLegendToggleSymbolVisibility = 'Chart.Legend.ToggleSymbolVisibility', ChartLegendToggleVolumeVisibility = 'Chart.Legend.ToggleVolumeVisibility', ChartLines = 'Chart.Lines', ChartLinesToggleBidAskLinesVisibility = 'Chart.Lines.ToggleBidAskLinesVisibility', ChartLinesToggleHighLowLinesVisibility = 'Chart.Lines.ToggleHighLowLinesVisibility', ChartLinesToggleAverageLineVisibility = 'Chart.Lines.ToggleAverageLineVisibility', ChartLinesToggleSeriesPrevCloseLineVisibility = 'Chart.Lines.ToggleSeriesPrevCloseLineVisibility', ChartLinesToggleSeriesPriceLineVisibility = 'Chart.Lines.ToggleSeriesPriceLineVisibility', ChartLineToolBarsPatternToggleFlipped = 'Chart.LineTool.BarsPattern.ToggleFlipped', ChartLineToolBarsPatternToggleMirrored = 'Chart.LineTool.BarsPattern.ToggleMirrored', ChartLineToolClone = 'Chart.LineTool.Clone', ChartLineToolCreateLimitOrderFromState = 'Chart.LineTool.CreateLimitOrderFromState', ChartLineToolElliotChangeDegreeProperty = 'Chart.LineTool.Elliot.ChangeDegreeProperty', ChartLineToolNoSync = 'Chart.LineTool.NoSync', ChartLineToolPitchforkChangeTypeToInside = 'Chart.LineTool.Pitchfork.ChangeTypeToInside', ChartLineToolPitchforkChangeTypeToModifiedSchiff = 'Chart.LineTool.Pitchfork.ChangeTypeToModifiedSchiff', ChartLineToolPitchforkChangeTypeToOriginal = 'Chart.LineTool.Pitchfork.ChangeTypeToOriginal', ChartLineToolPitchforkChangeTypeToSchiff = 'Chart.LineTool.Pitchfork.ChangeTypeToSchiff', ChartLineToolSyncInLayout = 'Chart.LineTool.SyncInLayout', ChartLineToolTemplates = 'Chart.LineTool.Templates', ChartLineToolTemplatesApply = 'Chart.LineTool.Templates.Apply', ChartLineToolTemplatesApplyDefaults = 'Chart.LineTool.Templates.ApplyDefaults', ChartLineToolTemplatesSaveAs = 'Chart.LineTool.Templates.SaveAs', ChartLineToolToolbarChangeFontSizeProperty = 'Chart.LineTool.Toolbar.ChangeFontSizeProperty', ChartLineToolToolbarChangeLineStyleToDashed = 'Chart.LineTool.Toolbar.ChangeLineStyleToDashed', ChartLineToolToolbarChangeLineStyleToDotted = 'Chart.LineTool.Toolbar.ChangeLineStyleToDotted', ChartLineToolToolbarChangeLineStyleToSolid = 'Chart.LineTool.Toolbar.ChangeLineStyleToSolid', ChartMarksToggleVisibility = 'Chart.Marks.ToggleVisibility', ChartMoveChartInLayout = 'Chart.MoveChartInLayout', ChartMoveChartInLayoutBack = 'Chart.MoveChartInLayout.Back', ChartMoveChartInLayoutForward = 'Chart.MoveChartInLayout.Forward', ChartObjectTreeShow = 'Chart.ObjectTree.Show', ChartDataWindowShow = 'Chart.DataWindow.Show', ChartPaneControlsDeletePane = 'Chart.PaneControls.DeletePane', ChartPaneControlsMaximizePane = 'Chart.PaneControls.MaximizePane', ChartPaneControlsMinimizePane = 'Chart.PaneControls.MinimizePane', ChartPaneControlsMovePaneDown = 'Chart.PaneControls.MovePaneDown', ChartPaneControlsMovePaneUp = 'Chart.PaneControls.MovePaneUp', ChartPaneControlsCollapsePane = 'Chart.PaneControls.CollapsePane', ChartPaneControlsRestorePane = 'Chart.PaneControls.RestorePane', ChartPriceScaleLabels = 'Chart.PriceScale.Labels', ChartPriceScaleLabelsToggleBidAskLabelsVisibility = 'Chart.PriceScale.Labels.ToggleBidAskLabelsVisibility', ChartPriceScaleLabelsToggleHighLowPriceLabelsVisibility = 'Chart.PriceScale.Labels.ToggleHighLowPriceLabelsVisibility', ChartPriceScaleLabelsToggleAveragePriceLabelVisibility = 'Chart.PriceScale.Labels.ToggleAveragePriceLabelVisibility', ChartPriceScaleLabelsToggleIndicatorsNameLabelsVisibility = 'Chart.PriceScale.Labels.ToggleIndicatorsNameLabelsVisibility', ChartPriceScaleLabelsToggleIndicatorsValueLabelsVisibility = 'Chart.PriceScale.Labels.ToggleIndicatorsValueLabelsVisibility', ChartPriceScaleLabelsToggleNoOverlappingLabelsVisibility = 'Chart.PriceScale.Labels.ToggleNoOverlappingLabelsVisibility', ChartPriceScaleLabelsToggleSeriesLastValueVisibility = 'Chart.PriceScale.Labels.ToggleSeriesLastValueVisibility', ChartPriceScaleLabelsToggleSymbolNameLabelsVisibility = 'Chart.PriceScale.Labels.ToggleSymbolNameLabelsVisibility', ChartPriceScaleLabelsToggleSymbolPrevCloseValueVisibility = 'Chart.PriceScale.Labels.ToggleSymbolPrevCloseValueVisibility', ChartPriceScaleMergeAllScales = 'Chart.PriceScale.MergeAllScales', ChartPriceScaleMergeAllScalesToLeft = 'Chart.PriceScale.MergeAllScalesToLeft', ChartPriceScaleMergeAllScalesToRight = 'Chart.PriceScale.MergeAllScalesToRight', ChartPriceScaleMoveToLeft = 'Chart.PriceScale.MoveToLeft', ChartPriceScaleMoveToRight = 'Chart.PriceScale.MoveToRight', ChartPriceScaleReset = 'Chart.PriceScale.Reset', ChartPriceScaleToggleAddOrderPlusButtonVisibility = 'Chart.PriceScale.ToggleAddOrderPlusButtonVisibility', ChartPriceScaleToggleAutoScale = 'Chart.PriceScale.ToggleAutoScale', ChartPriceScaleToggleAutoScaleSeriesOnly = 'Chart.PriceScale.ToggleAutoScaleSeriesOnly', ChartPriceScaleToggleCountdownToBarCloseVisibility = 'Chart.PriceScale.ToggleCountdownToBarCloseVisibility', ChartPriceScaleToggleIndexedTo100 = 'Chart.PriceScale.ToggleIndexedTo100', ChartPriceScaleToggleInvertScale = 'Chart.PriceScale.ToggleInvertScale', ChartPriceScaleToggleLogarithmic = 'Chart.PriceScale.ToggleLogarithmic', ChartPriceScaleTogglePercentage = 'Chart.PriceScale.TogglePercentage', ChartPriceScaleToggleRegular = 'Chart.PriceScale.ToggleRegular', ChartRedo = 'Chart.Redo', ChartRemoveAllIndicators = 'Chart.RemoveAllIndicators', ChartRemoveAllIndicatorsAndLineTools = 'Chart.RemoveAllIndicatorsAndLineTools', ChartRemoveAllLineTools = 'Chart.RemoveAllLineTools', ChartScalesReset = 'Chart.Scales.Reset', ChartScalesToggleLockPriceToBarRatio = 'Chart.Scales.ToggleLockPriceToBarRatio', ChartScrollToLineTool = 'Chart.ScrollToLineTool', ChartSelectedObjectHide = 'Chart.SelectedObject.Hide', ChartSelectedObjectRemove = 'Chart.SelectedObject.Remove', ChartSelectedObjectShow = 'Chart.SelectedObject.Show', ChartSelectedObjectShowSettingsDialog = 'Chart.SelectedObject.ShowSettingsDialog', ChartSelectedObjectToggleLocked = 'Chart.SelectedObject.ToggleLocked', ChartSeriesPriceScaleToggleAutoScale = 'Chart.Series.PriceScale.ToggleAutoScale', ChartSeriesPriceScaleToggleIndexedTo100 = 'Chart.Series.PriceScale.ToggleIndexedTo100', ChartSeriesPriceScaleToggleInvertPriceScale = 'Chart.Series.PriceScale.ToggleInvertPriceScale', ChartSeriesPriceScaleToggleLogarithmic = 'Chart.Series.PriceScale.ToggleLogarithmic', ChartSeriesPriceScaleTogglePercentage = 'Chart.Series.PriceScale.TogglePercentage', ChartSeriesPriceScaleToggleRegular = 'Chart.Series.PriceScale.ToggleRegular', ChartSessionBreaksToggleVisibility = 'Chart.SessionBreaks.ToggleVisibility', ChartSetSession = 'Chart.SetSession', ChartSourceChangePriceScale = 'Chart.Source.ChangePriceScale', ChartSourceMergeDown = 'Chart.Source.MergeDown', ChartSourceMergeUp = 'Chart.Source.MergeUp', ChartSourceMoveToNoScale = 'Chart.Source.MoveToNoScale', ChartSourceMoveToOtherScale = 'Chart.Source.MoveToOtherScale', ChartSourceMoveToPane = 'Chart.Source.MoveToPane', ChartSourceUnmergeDown = 'Chart.Source.UnmergeDown', ChartSourceUnmergeUp = 'Chart.Source.UnmergeUp', ChartSourceVisualOrder = 'Chart.Source.VisualOrder', ChartSourceVisualOrderBringForward = 'Chart.Source.VisualOrder.BringForward', ChartSourceVisualOrderBringToFront = 'Chart.Source.VisualOrder.BringToFront', ChartSourceVisualOrderSendBackward = 'Chart.Source.VisualOrder.SendBackward', ChartSourceVisualOrderSendToBack = 'Chart.Source.VisualOrder.SendToBack', ChartSourceResetInputPoints = 'Chart.Source.ResetInputPoints', ChartTimeScaleReset = 'Chart.TimeScale.Reset', ChartUndo = 'Chart.Undo', ChartSourceIntervalsVisibility = 'Chart.Source.IntervalsVisibility', ChartSourceIntervalsVisibilityCurrentAndAbove = 'Chart.Source.IntervalsVisibility.CurrentAndAbove', ChartSourceIntervalsVisibilityCurrentAndBelow = 'Chart.Source.IntervalsVisibility.CurrentAndBelow', ChartSourceIntervalsVisibilityOnlyCurrent = 'Chart.Source.IntervalsVisibility.Current', ChartSourceIntervalsVisibilityAll = 'Chart.Source.IntervalsVisibility.All', ObjectsTreeCreateGroup = 'ObjectsTree.CreateGroup', ObjectsTreeRemoveItem = 'ObjectsTree.RemoveItem', ObjectsTreeRenameItem = 'ObjectsTree.RenameItem', ObjectsTreeToggleItemLocked = 'ObjectsTree.ToggleItemLocked', ObjectsTreeToggleItemVisibility = 'ObjectsTree.ToggleItemVisibility', TradingCancelOrder = 'Trading.CancelOrder', TradingClosePosition = 'Trading.ClosePosition', TradingCustomActionId = 'Trading.CustomActionId', TradingDOMPlaceLimitOrder = 'Trading.DOMPlaceLimitOrder', TradingDOMPlaceMarketOrder = 'Trading.DOMPlaceMarketOrder', TradingDOMPlaceStopLimitOrder = 'Trading.DOMPlaceStopLimitOrder', TradingDOMPlaceStopOrder = 'Trading.DOMPlaceStopOrder', TradingEditOrder = 'Trading.EditOrder', TradingModifyPosition = 'Trading.ModifyPosition', TradingReversePosition = 'Trading.ReversePosition', TradingSellBuyButtonsToggleVisibility = 'Trading.SellBuyButtonsToggleVisibility', TradingTradeFromChart = 'Trading.TradeFromChart', TradingNoOverlapMode = 'Trading.NoOverlapMode', WatchlistAddSelectedSymbolsToCompare = 'Watchlist.AddSelectedSymbolsToCompare ', WatchlistAddSymbolToCompare = 'Watchlist.AddSymbolToCompare', WatchlistAddSymbolToSection = 'Watchlist.AddSymbolToSection', WatchlistAddSymbol = 'Watchlist.AddSymbol', WatchlistRemoveSection = 'Watchlist.RemoveSection', WatchlistRenameSection = 'Watchlist.RenameSection', } /** * Filled area type. */ declare const enum FilledAreaType { /** * Filled area type for plots. */ TypePlots = 'plot_plot', /** * Filled area type for bands. */ TypeHlines = 'hline_hline', } declare const enum MenuItemType { Separator = 'separator', Action = 'action', } declare const enum OhlcStudyPlotStyle { OhlcBars = 'ohlc_bars', OhlcCandles = 'ohlc_candles', } declare const enum SeriesType { Bars = 0, Candles = 1, Line = 2, Area = 3, HeikenAshi = 8, HollowCandles = 9, Baseline = 10, HiLo = 12, Column = 13, LineWithMarkers = 14, Stepline = 15, HLCArea = 16, Renko = 4, Kagi = 5, PointAndFigure = 6, LineBreak = 7, } declare const enum StudyInputType { Integer = 'integer', Float = 'float', Price = 'price', Bool = 'bool', Text = 'text', Symbol = 'symbol', Session = 'session', Source = 'source', Resolution = 'resolution', Time = 'time', BarTime = 'bar_time', Color = 'color', Textarea = 'text_area', } declare const enum StudyPlotDisplayTarget { None = 0, Pane = 1, DataWindow = 2, PriceScale = 4, StatusLine = 8, All = 15, } declare const enum StudyPlotType { Line = 'line', Colorer = 'colorer', BarColorer = 'bar_colorer', BgColorer = 'bg_colorer', TextColorer = 'text_colorer', OhlcColorer = 'ohlc_colorer', CandleWickColorer = 'wick_colorer', CandleBorderColorer = 'border_colorer', UpColorer = 'up_colorer', DownColorer = 'down_colorer', Shapes = 'shapes', Chars = 'chars', Arrows = 'arrows', Data = 'data', DataOffset = 'dataoffset', OhlcOpen = 'ohlc_open', OhlcHigh = 'ohlc_high', OhlcLow = 'ohlc_low', OhlcClose = 'ohlc_close', } declare const enum StudyTargetPriceScale { Right = 0, Left = 1, NoScale = 2, } /** * This is the generic type useful for declaring a nominal type, * which does not structurally matches with the base type and * the other types declared over the same base type * * Usage: * @example * type Index = Nominal<number, 'Index'>; * // let i: Index = 42; // this fails to compile * let i: Index = 42 as Index; // OK * @example * type TagName = Nominal<string, 'TagName'>; */ declare type Nominal<T, Name extends string> = T & { /* eslint-disable-next-line jsdoc/require-jsdoc */ [Symbol.species]: Name; }; /** * Override properties for the Abcd drawing tool. */ interface AbcdLineToolOverrides { /** Default value: `false` */ 'linetoolabcd.bold': boolean; /** Default value: `#089981` */ 'linetoolabcd.color': string; /** Default value: `12` */ 'linetoolabcd.fontsize': number; /** Default value: `false` */ 'linetoolabcd.italic': boolean; /** Default value: `2` */ 'linetoolabcd.linewidth': number; /** Default value: `#ffffff` */ 'linetoolabcd.textcolor': string; } /** * Defines a whitelist / blacklist of studies or drawing tools. */ interface AccessList { /** * List type. * Supported values are: * `black` (all listed items should be disabled), * `white` (only the listed items should be enabled). */ type: 'black' | 'white'; /** Array of items which should be considered part of the access list */ tools: AccessListItem[]; } interface AccessListItem { /** * Name of the study / drawing tool. * Use the same name as seen in the UI for drawings, * and use the same names as in the pop-ups for indicators. */ name: string; /** * Whether this study should be visible but look as if it's disabled. * If the study is grayed out and user clicks it, then the `onGrayedObjectClicked` function is called. */ grayed?: boolean; } interface ActionOptions extends Partial<OmitActionId<ActionState>>, Pick<ActionState, 'actionId'> { /** * A function which will be called when an action should be executed (e.g. when a user clicks on the item). */ onExecute?: OnActionExecuteHandler; } interface ActionState { /** * Human-readable, non-unique ID of an action item. Similar to {@link label}, but language-agnostic. */ actionId: ActionId; /** Is active */ active: boolean; /** * Text title of an action */ label: string; /** * Text title of an action consisting of several styled sections. If not defined then {@link label} is used instead. */ styledLabel?: StyledText[]; /** * Whether an action is disabled or not (disabled actions are usually cannot be executed and displayed grayed out) */ disabled: boolean; /** * Sub-items of an action */ subItems: IActionVariant[]; /** * Whether an action should have a checkbox next to it. */ checkable: boolean; /** * If {@link checkable} is `true` then whether current state is checked or not. */ checked: boolean; /** * A hint of an action. */ hint?: string; /** * A string of SVG icon for an action. A string should be a string representation of SVG (not a path/URL). */ icon?: string; /** * If {@link checkable} is `true` then an icon to be used when {@link checked} is `true`. */ iconChecked?: string; /** * Whether an action is still in loading state (it means that it's data is not ready yet). * Usually in this case a spinner/loader will be displayed instead of this action. */ loading: boolean; /** * A string that represents a shortcut hint for this action. */ shortcutHint?: string; } interface ActionsFactory { /** * Creates an action with provided options. */ createAction: (options: ActionOptions) => IUpdatableAction; /** * Creates an action that will wait for a promise to get its options. * In terms of GUI until a promise is resolved the loader/spinner will be displayed. */ createAsyncAction: (loader: () => Promise<ActionOptions>) => IUpdatableAction; /** * Creates a separator item. */ createSeparator: () => ISeparator; } /** * custom symbol info fields to be shown in the Symbol Info dialog */ interface AdditionalSymbolInfoField { /** the name of the new symbol info */ title: string; /** used to look up a property from the symbol info returned from the chart's datafeed */ propertyName: string; } /** * Override properties for the Anchoredvwap drawing tool. */ interface AnchoredvwapLineToolOverrides { /** Default value: `hlc3` */ 'linetoolanchoredvwap.inputs.source': string; /** Default value: `0` */ 'linetoolanchoredvwap.inputs.start_time': number; /** Default value: `default` */ 'linetoolanchoredvwap.precision': string; /** Default value: `#1e88e5` */ 'linetoolanchoredvwap.styles.VWAP.color': string; /** Default value: `15` */ 'linetoolanchoredvwap.styles.VWAP.display': number; /** Default value: `0` */ 'linetoolanchoredvwap.styles.VWAP.linestyle': number; /** Default value: `1` */ 'linetoolanchoredvwap.styles.VWAP.linewidth': number; /** Default value: `0` */ 'linetoolanchoredvwap.styles.VWAP.plottype': number; /** Default value: `false` */ 'linetoolanchoredvwap.styles.VWAP.trackPrice': boolean; /** Default value: `0` */ 'linetoolanchoredvwap.styles.VWAP.transparency': number; } /** * Override properties for the Arc drawing tool. */ interface ArcLineToolOverrides { /** Default value: `rgba(233, 30, 99, 0.2)` */ 'linetoolarc.backgroundColor': string; /** Default value: `#e91e63` */ 'linetoolarc.color': string; /** Default value: `true` */ 'linetoolarc.fillBackground': boolean; /** Default value: `2` */ 'linetoolarc.linewidth': number; /** Default value: `80` */ 'linetoolarc.transparency': number; } /** * Override properties for the Arrow drawing tool. */ interface ArrowLineToolOverrides { /** Default value: `false` */ 'linetoolarrow.alwaysShowStats': boolean; /** Default value: `false` */ 'linetoolarrow.bold': boolean; /** Default value: `false` */ 'linetoolarrow.extendLeft': boolean; /** Default value: `false` */ 'linetoolarrow.extendRight': boolean; /** Default value: `14` */ 'linetoolarrow.fontsize': number; /** Default value: `center` */ 'linetoolarrow.horzLabelsAlign': string; /** Default value: `false` */ 'linetoolarrow.italic': boolean; /** Default value: `0` */ 'linetoolarrow.leftEnd': number; /** Default value: `#2962FF` */ 'linetoolarrow.linecolor': string; /** Default value: `0` */ 'linetoolarrow.linestyle': number; /** Default value: `2` */ 'linetoolarrow.linewidth': number; /** Default value: `1` */ 'linetoolarrow.rightEnd': number; /** Default value: `false` */ 'linetoolarrow.showAngle': boolean; /** Default value: `false` */ 'linetoolarrow.showBarsRange': boolean; /** Default value: `false` */ 'linetoolarrow.showDateTimeRange': boolean; /** Default value: `false` */ 'linetoolarrow.showDistance': boolean; /** Default value: `false` */ 'linetoolarrow.showLabel': boolean; /** Default value: `false` */ 'linetoolarrow.showMiddlePoint': boolean; /** Default value: `false` */ 'linetoolarrow.showPercentPriceRange': boolean; /** Default value: `false` */ 'linetoolarrow.showPipsPriceRange': boolean; /** Default value: `false` */ 'linetoolarrow.showPriceLabels': boolean; /** Default value: `false` */ 'linetoolarrow.showPriceRange': boolean; /** Default value: `2` */ 'linetoolarrow.statsPosition': number; /** Default value: `#2962FF` */ 'linetoolarrow.textcolor': string; /** Default value: `bottom` */ 'linetoolarrow.vertLabelsAlign': string; } /** * Override properties for the Arrowmarkdown drawing tool. */ interface ArrowmarkdownLineToolOverrides { /** Default value: `#CC2F3C` */ 'linetoolarrowmarkdown.arrowColor': string; /** Default value: `false` */ 'linetoolarrowmarkdown.bold': boolean; /** Default value: `#CC2F3C` */ 'linetoolarrowmarkdown.color': string; /** Default value: `14` */ 'linetoolarrowmarkdown.fontsize': number; /** Default value: `false` */ 'linetoolarrowmarkdown.italic': boolean; /** Default value: `true` */ 'linetoolarrowmarkdown.showLabel': boolean; } /** * Override properties for the Arrowmarker drawing tool. */ interface ArrowmarkerLineToolOverrides { /** Default value: `#1E53E5` */ 'linetoolarrowmarker.backgroundColor': string; /** Default value: `true` */ 'linetoolarrowmarker.bold': boolean; /** Default value: `16` */ 'linetoolarrowmarker.fontsize': number; /** Default value: `false` */ 'linetoolarrowmarker.italic': boolean; /** Default value: `true` */ 'linetoolarrowmarker.showLabel': boolean; /** Default value: `#1E53E5` */ 'linetoolarrowmarker.textColor': string; } /** * Override properties for the Arrowmarkleft drawing tool. */ interface ArrowmarkleftLineToolOverrides { /** Default value: `#2962FF` */ 'linetoolarrowmarkleft.arrowColor': string; /** Default value: `false` */ 'linetoolarrowmarkleft.bold': boolean; /** Default value: `#2962FF` */ 'linetoolarrowmarkleft.color': string; /** Default value: `14` */ 'linetoolarrowmarkleft.fontsize': number; /** Default value: `false` */ 'linetoolarrowmarkleft.italic': boolean; /** Default value: `true` */ 'linetoolarrowmarkleft.showLabel': boolean; } /** * Override properties for the Arrowmarkright drawing tool. */ interface ArrowmarkrightLineToolOverrides { /** Default value: `#2962FF` */ 'linetoolarrowmarkright.arrowColor': string; /** Default value: `false` */ 'linetoolarrowmarkright.bold': boolean; /** Default value: `#2962FF` */ 'linetoolarrowmarkright.color': string; /** Default value: `14` */ 'linetoolarrowmarkright.fontsize': number; /** Default value: `false` */ 'linetoolarrowmarkright.italic': boolean; /** Default value: `true` */ 'linetoolarrowmarkright.showLabel': boolean; } /** * Override properties for the Arrowmarkup drawing tool. */ interface ArrowmarkupLineToolOverrides { /** Default value: `#089981` */ 'linetoolarrowmarkup.arrowColor': string; /** Default value: `false` */ 'linetoolarrowmarkup.bold': boolean; /** Default value: `#089981` */ 'linetoolarrowmarkup.color': string; /** Default value: `14` */ 'linetoolarrowmarkup.fontsize': number; /** Default value: `false` */ 'linetoolarrowmarkup.italic': boolean; /** Default value: `true` */ 'linetoolarrowmarkup.showLabel': boolean; } /** * Override properties for the Balloon drawing tool. */ interface BalloonLineToolOverrides { /** Default value: `rgba(156, 39, 176, 0.7)` */ 'linetoolballoon.backgroundColor': string; /** Default value: `rgba(156, 39, 176, 0)` */ 'linetoolballoon.borderColor': string; /** Default value: `#ffffff` */ 'linetoolballoon.color': string; /** Default value: `14` */ 'linetoolballoon.fontsize': number; /** Default value: `30` */ 'linetoolballoon.transparency': number; } /** * Bar data point */ interface Bar { /** Bar time. * Amount of **milliseconds** since Unix epoch start in **UTC** timezone. * `time` for daily, weekly, and monthly bars is expected to be a trading day (not session start day) at 00:00 UTC. * The library adjusts time according to `session` from {@link LibrarySymbolInfo}. */ time: number; /** Opening price */ open: number; /** High price */ high: number; /** Low price */ low: number; /** Closing price */ close: number; /** Trading Volume */ volume?: number; } /** * Override properties for the Barspattern drawing tool. */ interface BarspatternLineToolOverrides { /** Default value: `#2962FF` */ 'linetoolbarspattern.color': string; /** Default value: `false` */ 'linetoolbarspattern.flipped': boolean; /** Default value: `false` */ 'linetoolbarspattern.mirrored': boolean; /** Default value: `0` */ 'linetoolbarspattern.mode': number; } /** * Override properties for the Beziercubic drawing tool. */ interface BeziercubicLineToolOverrides { /** Default value: `rgba(103, 58, 183, 0.2)` */ 'linetoolbeziercubic.backgroundColor': string; /** Default value: `false` */ 'linetoolbeziercubic.extendLeft': boolean; /** Default value: `false` */ 'linetoolbeziercubic.extendRight': boolean; /** Default value: `false` */ 'linetoolbeziercubic.fillBackground': boolean; /** Default value: `0` */ 'linetoolbeziercubic.leftEnd': number; /** Default value: `#673ab7` */ 'linetoolbeziercubic.linecolor': string; /** Default value: `0` */ 'linetoolbeziercubic.linestyle': number; /** Default value: `2` */ 'linetoolbeziercubic.linewidth': number; /** Default value: `0` */ 'linetoolbeziercubic.rightEnd': number; /** Default value: `80` */ 'linetoolbeziercubic.transparency': number; } /** * Override properties for the Bezierquadro drawing tool. */ interface BezierquadroLineToolOverrides { /** Default value: `rgba(41, 98, 255, 0.2)` */ 'linetoolbezierquadro.backgroundColor': string; /** Default value: `false` */ 'linetoolbezierquadro.extendLeft': boolean; /** Default value: `false` */ 'linetoolbezierquadro.extendRight': boolean; /** Default value: `false` */ 'linetoolbezierquadro.fillBackground': boolean; /** Default value: `0` */ 'linetoolbezierquadro.leftEnd': number; /** Default value: `#2962FF` */ 'linetoolbezierquadro.linecolor': string; /** Default value: `0` */ 'linetoolbezierquadro.linestyle': number; /** Default value: `2` */ 'linetoolbezierquadro.linewidth': number; /** Default value: `0` */ 'linetoolbezierquadro.rightEnd': number; /** Default value: `50` */ 'linetoolbezierquadro.transparency': number; } /** * Override properties for the Brush drawing tool. */ interface BrushLineToolOverrides { /** Default value: `#00bcd4` */ 'linetoolbrush.backgroundColor': string; /** Default value: `false` */ 'linetoolbrush.fillBackground': boolean; /** Default value: `0` */ 'linetoolbrush.leftEnd': number; /** Default value: `#00bcd4` */ 'linetoolbrush.linecolor': string; /** Default value: `0` */ 'linetoolbrush.linestyle': number; /** Default value: `2` */ 'linetoolbrush.linewidth': number; /** Default value: `0` */ 'linetoolbrush.rightEnd': number; /** Default value: `5` */ 'linetoolbrush.smooth': number; /** Default value: `50` */ 'linetoolbrush.transparency': number; } /** * Override properties for the Callout drawing tool. */ interface CalloutLineToolOverrides { /** Default value: `rgba(0, 151, 167, 0.7)` */ 'linetoolcallout.backgroundColor': string; /** Default value: `false` */ 'linetoolcallout.bold': boolean; /** Default value: `#0097A7` */ 'linetoolcallout.bordercolor': string; /** Default value: `#ffffff` */ 'linetoolcallout.color': string; /** Default value: `14` */ 'linetoolcallout.fontsize': number; /** Default value: `false` */ 'linetoolcallout.italic': boolean; /** Default value: `2` */ 'linetoolcallout.linewidth': number; /** Default value: `50` */ 'linetoolcallout.transparency': number; /** Default value: `false` */ 'linetoolcallout.wordWrap': boolean; /** Default value: `200` */ 'linetoolcallout.wordWrapWidth': number; } /** * Saved chart data */ interface ChartData { /** unique ID of the chart (may be `undefined` if it wasn't saved before) */ id: string | undefined; /** name of the chart */ name: string; /** symbol of the chart */ symbol: string; /** resolution of the chart */ resolution: ResolutionString; /** content of the chart */ content: string; } interface ChartDescriptionContext { /** Style of chart */ chartType: SeriesType; /** Name of chart style */ chartTypeName: string; /** Symbol's description from the Symbol Info */ description?: string; /** Symbol identifier, typically the symbols ticker or name defined in the Symbol Info */ symbol: string; /** Symbol's exchange */ exchange?: string; /** Symbol's ticker identifier */ ticker?: string; /** Visible time range */ visibleRange: VisibleTimeRange; /** Visible data. Only included if [aria_detailed_chart_descriptions](https://www.tradingview.com/charting-library-docs/latest/customization/Featuresets.md#aria_detailed_chart_descriptions) featureset is enabled */ visibleData?: ExportedData; /** The complete Symbol Info for the chart's main series */ symbolInfo: LibrarySymbolInfo | null; /** Index of the current chart within a multi-chart layout */ chartIndex: number; /** Number of visible charts in the current layout */ chartCount: number; /** Symbol's default price formatter */ priceFormatter: ISymbolValueFormatter; /** Resolution (interval) of the chart */ interval: ResolutionString; /** Is the resolution (interval) intraday */ isIntraday: boolean; } /** * Meta information about a saved chart */ interface ChartMetaInfo { /** unique ID of the chart. */ id: number; /** name of the chart */ name: string; /** symbol of the chart */ symbol: string; /** resolution of the chart */ resolution: ResolutionString; /** UNIX time when the chart was last modified */ timestamp: number; } /** * A chart template. */ interface ChartTemplate { /** * The template content. */ content?: ChartTemplateContent; } /** * Chart template content. The properties of the chart that are saved/loaded when the library saves/loads a chart template. */ interface ChartTemplateContent { [key: string]: any; /** * Chart properties (for example color, etc). */ chartProperties?: { /** * Chart pane properties. */ paneProperties: any; /** * Chart scales properties. */ scalesProperties: any; }; /** * Series properties (for example chart style, etc). */ mainSourceProperties?: any; /** * The version of the chart template. */ version?: number; } interface ChartingLibraryWidgetOptions { /** * The `container` can either be a reference to an attribute of a DOM element inside which the iframe with the chart will be placed or the `HTMLElement` itself. * * ```javascript * container: "tv_chart_container", * ``` * * or * * ```javascript * container: document.getElementById("tv_chart_container"), * ``` */ container: HTMLElement | string; /** * JavaScript object that implements the datafeed interface ({@link IBasicDataFeed}) to supply the chart with data. See [Connecting Data](https://www.tradingview.com/charting-library-docs/latest/connecting_data/connecting_data.md) for more information on the JS API. * * ```javascript * datafeed: new Datafeeds.UDFCompatibleDatafeed("https://demo_feed.tradingview.com") * ``` */ datafeed: IBasicDataFeed | (IBasicDataFeed & IDatafeedQuotesApi); /** * The default interval for the chart. * * Example: * ```javascript * interval: '1D', * ``` */ interval: ResolutionString; /** * The default symbol for the chart. * * Example: * ```javascript * symbol: 'AAPL', * ``` */ symbol?: string; /** * A threshold delay in seconds that is used to reduce the number of `onAutoSaveNeeded` calls. * * ```javascript * auto_save_delay: 5, * ``` */ auto_save_delay?: number; /** * Boolean value showing whether the chart should use all the available space in the container and resize when the container itself is resized. * @default false * * ```javascript * autosize: true, * ``` */ autosize?: boolean; /** * Setting this property to `true` will make the chart write detailed API logs into the browser console. * Alternatively, you can use the `charting_library_debug_mode` featureset to enable it, or use the `setDebugMode` widget method ({@link IChartingLibraryWidget.setDebugMode}) . * * ```javascript * debug: true, * ``` */ debug?: boolean; /** * The array containing names of features that should be disabled by default. `Feature` means part of the functionality of the chart (part of the UI/UX). Supported features are listed in [Featuresets](https://www.tradingview.com/charting-library-docs/latest/customization/Featuresets.md). * * Example: * ```javascript * disabled_features: ["header_widget", "left_toolbar"], * ``` */ disabled_features?: ChartingLibraryFeatureset[]; /** * You can hide some drawings from the toolbar or add custom restrictions for applying them to the chart. * * This property has the same structure as the `studies_access` argument. Use the same names as you see in the UI. * * **Remark**: There is a special case for font-based drawings. Use the "Font Icons" name for them. * Those drawings cannot be enabled or disabled separately - the entire group will have to be either enabled or disabled. * * @example * ```javascript * drawings_access: { * type: 'black', * tools: [ * { * name: 'Trend Line', * grayed: true * }, * ] * }, * ``` */ drawings_access?: AccessList; /** * The array containing names of features that should be enabled by default. `Feature` means part of the functionality of the chart (part of the UI/UX). Supported features are listed in [Featuresets](https://www.tradingview.com/charting-library-docs/latest/customization/Featuresets.md). * * Example: * ```javascript * enabled_features: ["move_logo_to_main_pane"], * ``` */ enabled_features?: ChartingLibraryFeatureset[]; /** * Boolean value showing whether the chart should use all the available space in the window. * @default false * * ```javascript * fullscreen: true, * ``` */ fullscreen?: boolean; /** * A path to a `static` folder. * * ```javascript * library_path: "charting_library/", * ``` * * * If you would like to host the library on a separate origin to the page containing the chart then please view the following guide: [Hosting the library on a separate origin](https://www.tradingview.com/charting-library-docs/latest/getting_started/Hosting-Library-Cross-Origin.md). */ library_path?: string; /** * Locale to be used by the library. See [Localization](https://www.tradingview.com/charting-library-docs/latest/core_concepts/Localization.md) section for details. * * ```javascript * locale: 'en', * ``` */ locale: LanguageCode; /** * The object containing formatting options for numbers. The only possible option is `decimal_sign` currently. * * ```javascript * numeric_formatting: { decimal_sign: "," }, * ``` */ numeric_formatting?: NumericFormattingParams; /** * JS object containing saved chart content. * Use this parameter when creating the widget if you have a saved chart already. * If you want to load the chart content when the chart is initialized then use `load()` method ({@link IChartingLibraryWidget.load}) of the widget. */ saved_data?: object; /** * JS object containing saved chart content meta info. */ saved_data_meta_info?: SavedStateMetaInfo; /** * You can hide some studies from the toolbar or add custom restrictions for applying them to the chart. * * @example * ```javascript * studies_access: { * type: "black" | "white", * tools: [ * { * name: "<study name>", * grayed: true * }, * < ... > * ] * } * ``` */ studies_access?: AccessList; /** * Maximum amount of studies allowed at one time within the layout. Minimum value is 2. * * ```javascript * study_count_limit: 5, * ``` */ study_count_limit?: number; /** * A threshold delay in milliseconds that is used to reduce the number of search requests when the user enters the symbol name in the [Symbol Search](https://www.tradingview.com/charting-library-docs/latest/ui_elements/Symbol-Search.md). * * ```javascript * symbol_search_request_delay: 1000, * ``` */ symbol_search_request_delay?: number; /** * Sets the default time frame of the chart. * * The time frame can be relative to the current date, or a range. * * A relative time frame is a number with a letter D for days and M for months: * * ```javascript * timeframe: '3M', * ``` * * A range is an object with to and from properties. The to and from properties should be UNIX timestamps: * * ```javascript * timeframe: { from: 1640995200, to: 1643673600 } // from 2022-01-01 to 2022-02-01 * ``` * * **Note**: * When using a range the chart will still request data up to the current date. This is to enable scrolling forward in time once the chart has loaded. */ timeframe?: TimeframeOption; /** * Default time zone of the chart. The time on the timescale is displayed according to this time zone. * See the [list of supported time zones](https://www.tradingview.com/charting-library-docs/latest/ui_elements/timezones.md#supported-timezones) for available values. Set it to `exchange` to use the exchange time zone. Use the {@link ChartingLibraryWidgetOptions.overrides} section if you wish to override the default value. * * ```javascript * timezone: "America/New_York", * ``` */ timezone?: 'exchange' | Timezone; /** * Background color of the toolbars. * * ```javascript * toolbar_bg: '#f4f7f9', * ``` */ toolbar_bg?: string; /** * The desired width of a widget. Please make sure that there is enough space for the widget to be displayed correctly. * * ```javascript * width: 300, * ``` * * **Remark**: If you want the chart to use all the available space use the `fullscreen` parameter instead of setting it to '100%'. */ width?: number; /** * The desired height of a widget. Please make sure that there is enough space for the widget to be displayed correctly. * * ```javascript * height: 600, * ``` * * **Remark**: If you want the chart to use all the available space use the `fullscreen` parameter instead of setting it to '100%'. */ height?: number; /** * Set the storage URL endpoint for use with the high-level saving / loading charts API. * Refer to [Saving and Loading Charts](https://www.tradingview.com/charting-library-docs/latest/saving_loading/saving_loading.md) for more information. * * ```javascript * charts_storage_url: 'http://storage.yourserver.com', * ``` */ charts_storage_url?: string; /** * A version of your backend. Supported values are: `"1.0"` | `"1.1"`. Study Templates are supported starting from version `"1.1"`. * * ```javascript * charts_storage_api_version: "1.1", * ``` */ charts_storage_api_version?: AvailableSaveloadVersions; /** * Set the client ID for the high-level saving / loading charts API. * Refer to [Saving and Loading Charts](https://www.tradingview.com/charting-library-docs/latest/saving_loading/saving_loading.md) for more information. * * ```javascript * client_id: 'yourserver.com', * ``` */ client_id?: string; /** * Set the user ID for the high-level saving / loading charts API. * Refer to [Saving and Loading Charts](https://www.tradingview.com/charting-library-docs/latest/saving_loading/saving_loading.md) for more information. * * ```javascript * user_id: 'public_user_id', * ``` */ user_id?: string; /** * Set this parameter to `true` if you want the library to load the last saved chart for a user. You should implement [save/load](https://www.tradingview.com/charting-library-docs/latest/saving_loading/saving_loading.md) first to make it work. * * ```javascript * load_last_chart: true, * ``` */ load_last_chart?: boolean; /** * Use this option to customize the style or inputs of the indicators. * You can also customize the styles and inputs of the `Compare` series using this argument. * Refer to [Indicator Overrides](https://www.tradingview.com/charting-library-docs/latest/customization/overrides/Studies-Overrides.md#specify-default-properties) for more information. * Overrides for built-in indicators are listed in {@link StudyOverrides}. * * ```javascript * studies_overrides: { * "volume.volume.color.0": "#00FFFF", * }, * ``` */ studies_overrides?: Partial<StudyOverrides>; /** * Custom formatters for adjusting the display format of price, date, and time values. * * Example: * * ```javascript * custom_formatters: { * timeFormatter: { * format: (date) => { * const _format_str = '%h:%m'; * return _format_str * .replace('%h', date.getUTCHours(), 2) * .replace('%m', date.getUTCMinutes(), 2) * .replace('%s', date.getUTCSeconds(), 2); * } * }, * dateFormatter: { * format: (date) => { * return date.getUTCFullYear() + '/' + (date.getUTCMonth() + 1) + '/' + date.getUTCDate(); * } * }, * tickMarkFormatter: (date, tickMarkType) => { * switch (tickMarkType) { * case 'Year': * return 'Y' + date.getUTCFullYear(); * * case 'Month': * return 'M' + (date.getUTCMonth() + 1); * * case 'DayOfMonth': * return 'D' + date.getUTCDate(); * * case 'Time': * return 'T' + date.getUTCHours() + ':' + date.getUTCMinutes(); * * case 'TimeWithSeconds': * return 'S' + date.getUTCHours() + ':' + date.getUTCMinutes() + ':' + date.getUTCSeconds(); * } * * throw new Error('unhandled tick mark type ' + tickMarkType); * }, * priceFormatterFactory: (symbolInfo, minTick) => { * if (symbolInfo?.fractional || minTick !== 'default' && minTick.split(',')[2] === 'true') { * return { * format: (price, signPositive) => { * // return the appropriate format * }, * }; * } * return null; // this is to use default formatter; * }, * studyFormatterFactory: (format, symbolInfo) => { * if (format.type === 'price') { * const numberFormat = new Intl.NumberFormat('en-US', { notation: 'scientific' }); * return { * format: (value) => numberFormat.format(value) * }; * } * * if (format.type === 'volume') { * return { * format: (value) => (value / 1e9).toPrecision(format?.precision || 2) + 'B' * }; * } * * if (format.type === 'percent') { * return { * format: (value) => `${value.toPrecision(format?.precision || 4)} percent` * }; * } * * return null; // this is to use default formatter; * }, * } * ``` * * **Remark**: `tickMarkFormatter` must display the UTC date, and not the date corresponding to your local timezone. */ custom_formatters?: CustomFormatters; /** * Override values for the default widget properties * You can override most of the properties (which also may be edited by user through UI) * using `overrides` parameter of Widget Constructor. `overrides` is supposed to be an object. * The keys of this object are the names of overridden properties. * The values of these keys are the new values of the properties. * * Example: * ```javascript * overrides: { * "mainSeriesProperties.style": 2 * } * ``` * This code will change the default series style to "line". * All customizable properties are listed in [separate article](https://www.tradingview.com/charting-library-docs/latest/customization/overrides/Overrides.md). */ overrides?: Partial<WidgetOverrides>; /** * This URL is used to send a POST request with binary chart snapshots when a user presses the [snapshot](https://www.tradingview.com/charting-library-docs/latest/ui_elements/Snapshots.md) button. * This POST request contains `multipart/form-data` with the field `preparedImage` that represents binary data of the snapshot image in `image/png` format. * * This endpoint should return the full URL of the saved image in the response. * * ```javascript * snapshot_url: "https://myserver.com/snapshot", * ``` */ snapshot_url?: string; /** * List of visible time frames that can be selected at the bottom of the chart. See [Time frame toolbar](https://www.tradingview.com/charting-library-docs/latest/ui_elements/Time-Scale.md#time-frame-tool