newExchangeNotificationsWidget
newExchangeNotificationsWidget
is a constructor function for creating the Exchange Notifications widget.
Widget Constructor
Call newExchangeNotificationsWidget
to create a widget instance inside a browser DOM
element.
import { newExchangeNotificationsWidget } from '@dxfeed-widgets/exchange-notifications'
const domNode = document.getElementById('widget-container')
const dataProviders = {
ipfPath: '/your-path/ipf',
ipfAuthHeader: 'your-header',
feedPath: 'wss://your-path/feed',
feedAuthHeader: 'your-header',
scannerPath: '/api/scanner',
scannerAuthHeader: 'your-header',
fundamentalsPath: '/api/fundamentals',
fundamentalsAuthHeader: 'your-header',
schedulePath: '/api/schedule'
}
const widget = newExchangeNotificationsWidget({
element: domNode,
providers: dataProviders,
})
Signature
newExchangeNotificationsWidget(props: WidgetConstructorProps): WidgetAPI
Returns
An WidgetAPI object.
WidgetConstructorProps
Name | Type | Description |
---|---|---|
element | HTMLElement | A DOM element where the widget should be attached. |
providers | Providers | An object with configuration for data providers. Refer to the Data Providers section for details |
config optional | Config | Initial configuration of the widget |
state optional | State | Initial state of the widget |
theme optional | ThemeName | Theme | Initial theme of the widget. Refer to the Styling section for details |
Widget API
getConfig
Gets the current widget config.
Signature
getConfig(): Config
Returns
setConfig
Sets widget config.
Signature
setConfig(config: Config): void
Parameters
Name | Type | Description |
---|---|---|
config | Config | Configuration object. Omitted or undefined properties will be set to default |
getState
Gets the current widget state.
Signature
getState(): State
Returns
updateState
Updates widget state.
Signature
updateState(state: Partial<State>): void
Parameters
Name | Type | Description |
---|---|---|
state | Partial<State> | State object. Merges with the previous state object. |
addStateListener
Sets up a function that will be called whenever the state or specified field is changed.
Signature
addStateListener(stateChangeCallback: (state: State) => void): void
addStateListener(field: keyof State, fieldChangeCallback: (field: State[keyof State]) => void): void
Parameters
Name | Type | Description |
---|---|---|
stateChangeCallback | (state: State) => void | Function that will be called whenever the state is changed. |
Or
Name | Type | Description |
---|---|---|
field | keyof State | The state field to listen for. |
fieldChangeCallback | (value: State[keyof State]) => void | Function that will be called whenever the specified field is changed. |
removeStateListener
Removes an state listener previously registered with addStateListener
Signature
removeStateListener(stateChangeCallback: (state: State) => void): void
removeStateListener(field: keyof State, fieldChangeCallback: (field: State[keyof State]) => void): void
Parameters
Name | Type | Description |
---|---|---|
stateChangeCallback | (state: State) => void | Listener that will be removed. |
Or
Name | Type | Description |
---|---|---|
field | keyof State | The state field for which to remove a listener. |
fieldChangeCallback | (value: State[keyof State]) => void | Listener that will be removed. |
getData
Gets the current widget data.
Signature
getData(): Data
Returns
addDataListener
Sets up a function that will be called whenever the data or specified field is changed.
Signature
addDataListener(dataChangeCallback: (data: Data) => void): void
addDataListener(field: keyof Data, fieldChangeCallback: (field: Data[keyof Data]) => void): void
Parameters
Name | Type | Description |
---|---|---|
dataChangeCallback | (data: Data) => void | Function that will be called whenever the data is changed. |
Or
Name | Type | Description |
---|---|---|
field | keyof Data | The data field to listen for. |
fieldChangeCallback | (value: Data[keyof Data]) => void | Function that will be called whenever the specified field is changed. |
removeDataListener
Removes an data listener previously registered with addDataListener
Signature
removeDataListener(dataChangeCallback: (data: Data) => void): void
removeDataListener(field: keyof Data, fieldChangeCallback: (field: Data[keyof Data]) => void): void
Parameters
Name | Type | Description |
---|---|---|
dataChangeCallback | (data: Data) => void | Listener that will be removed. |
Or
Name | Type | Description |
---|---|---|
field | keyof Data | The data field for which to remove a listener. |
fieldChangeCallback | (value: Data[keyof Data]) => void | Listener that will be removed. |
setSlot
Inserts custom markup into widget UI. Refer to the Extend widget UI section for details.
Signature
setSlot(slot: Slot, element: HTMLElement): void
Parameters
Name | Type | Description |
---|---|---|
slot | Slot | The place where a provided element is inserted. |
element | HTMLElement | An element that is inserted. |
setTheme
Sets widget theme.
Signature
setTheme(theme: Theme | ThemeName): void
unmount
Destroys the widget.
Signature
unmount(): void
Data Providers
The Data Providers object supplies an information about the endpoints required by the widget, such as the path to the endpoint and the authorization key.
interface ExchangeNotificationsWidgetDataProviders {
ipfPath: string
ipfAuthHeader: string
feedPath: string
feedAuthHeader: string
scannerPath: string
scannerAuthHeader: string
fundamentalsPath: string
fundamentalsAuthHeader: string
schedulePath: string
}
Properties
Name | Type | Description |
---|---|---|
ipfPath | string | A string containing the path to the endpoint. |
ipfAuthHeader | string | A string containing the authentication header for the endpoint. |
feedPath | string | A string containing the path to the endpoint. |
feedAuthHeader | string | A string containing the authentication header for the endpoint. |
scannerPath | string | A string containing the path to the endpoint. |
scannerAuthHeader | string | A string containing the authentication header for the endpoint. |
fundamentalsPath | string | A string containing the path to the endpoint. |
fundamentalsAuthHeader | string | A string containing the authentication header for the endpoint. |
schedulePath | string | A string containing the path to the endpoint. |
Configuration
Configuration is an object that defines the basic behavior of a widget and allows enabling or disabling widget features that cannot be configured within the widget's user interface.
Type
interface ExchangeNotificationsWidgetConfig {
columnSelectMenuEnabled?: boolean,
sortable?: boolean,
filterable?: boolean,
resizable?: boolean,
reorderable?: boolean,
pollingInterval?: number,
modeSelectorViewMode?: ToolbarSelectorViewMode,
refreshButtonEnabled?: boolean,
delayNotificationEnabled?: boolean,
symbolScheduleStatusEnabled?: boolean,
timezone?: string,
locale?: LocaleSettings,
}
Properties
Name | Type | Default | Description |
---|---|---|---|
columnSelectMenuEnabled Optional | boolean | true | A flag that controls the column select menu feature visibility. Disabling this feature will lead to inability to change columns. |
sortable Optional | boolean | true | A flag that controls the table sorting feature. |
filterable Optional | boolean | true | A flag that controls the filtering function of table columns. |
resizable Optional | boolean | true | A flag that controls the column resizing feature. |
reorderable Optional | boolean | true | A flag that controls the column reorder feature. |
pollingInterval Optional | number | 3000 | A number that specifies the frequency of data updates in the widget in milliseconds. |
modeSelectorViewMode Optional | ToolbarSelectorViewMode | 'available' | View mode of the symbol search in the toolbar. |
refreshButtonEnabled Optional | boolean | true | A flag that controls the refresh button visibility in the toolbar. |
delayNotificationEnabled Optional | boolean | false | A flag that controls a visibility of an data delay notification. |
symbolScheduleStatusEnabled Optional | boolean | false | A flag that controls a visibility of symbol schedule status in symbol column in table |
timezone Optional | string | client environment timezone | String corresponds to IANA Time Zone name used to display dates in spicified time zone |
locale Optional | LocaleSettings | { language: 'en', dateLocale: 'en-GB' } | An object that defines the language and regional settings of the widget. |
State
State is an object that represents the state of the widget.
Type
interface ExchangeNotificationsWidgetState {
mode: ExchangeNotificationsMode,
haltedColumns: ExchangeNotificationsColumnName[],
haltedColumnSizes: ExchangeNotificationsColumnSizes,
haltedSort?: ExchangeNotificationsSort,
haltedFilters: ExchangeNotificationsFilters,
restrictedColumns: ExchangeNotificationsColumnName[],
restrictedColumnSizes: ExchangeNotificationsColumnSizes,
restrictedSort?: ExchangeNotificationsSort,
restrictedFilters: ExchangeNotificationsFilters,
}
Properties
Name | Type | Default | Description |
---|---|---|---|
mode | ExchangeNotificationsMode | 'halted' | display an information about currently halted or a short sale restriction. |
haltedColumns | ExchangeNotificationsColumnName[] | [ 'symbol', 'type', 'tradingStatusReason', 'haltStartTime' ] | A list that represent table columns and its order for halted mode. |
haltedColumnSizes | ExchangeNotificationsColumnSizes | {} | An object that specifies column sizes for halted mode where key is a column identificator and value is a column width in pixels. If the object does not contain a column width, then default width is used. |
haltedSort Optional | ExchangeNotificationsSort | undefined | An object that defines table sort for halted mode. |
haltedFilters | ExchangeNotificationsFilters | {} | An object that defines enabled filters and their parameters for halted mode. |
restrictedColumns | ExchangeNotificationsColumnName[] | [ 'symbol', 'type' ] | A list that represent table columns and its order for restricted mode. |
restrictedColumnSizes | ExchangeNotificationsColumnSizes | {} | An object that specifies column sizes for restricted mode where key is a column identificator and value is a column width in pixels. If the object does not contain a column width, then default width is used. |
restrictedSort Optional | ExchangeNotificationsSort | undefined | An object that defines table sort for restricted mode. |
restrictedFilters | ExchangeNotificationsFilters | {} | An object that defines enabled filters and their parameters for restricted mode. |
Data
Data is an object that represents the readonly data of the widget.
Type
interface ExchangeNotificationsWidgetData {
symbols: string[],
}
Properties
Name | Type | Default | Description |
---|---|---|---|
symbols | string[] | [] | Symbols that are loaded by widget |
Type Reference
ExchangeNotificationsSort
Type
{
property: ExchangeNotificationsFilterableColumnName,
direction: SortDirection,
}