Skip to main content

Module: ui

Routines for building UI

Namespaces

Classes

Variables

icons

icons: Object

Type declaration

NameType
add(handler: Function, tooltipMsg: null | string) => HTMLElement
close(handler: Function, tooltipMsg: null | string) => HTMLElement
copy(handler: Function, tooltipMsg: null | string) => HTMLElement
delete(handler: Function, tooltipMsg: null | string) => HTMLElement
edit(handler: Function, tooltipMsg: null | string) => HTMLElement
filter(handler: Function, tooltipMsg: null | string) => HTMLElement
help(handler: Function, tooltipMsg: null | string) => HTMLElement
info(handler: Function, tooltipMsg: null | string) => HTMLElement
play(handler: Function, tooltipMsg: null | string) => HTMLElement
remove(handler: Function, tooltipMsg: null | string) => HTMLElement
save(handler: null | Function, tooltipMsg: null | string) => HTMLElement
search(handler: Function, tooltipMsg: null | string) => HTMLElement
settings(handler: Function, tooltipMsg: null | string) => HTMLElement
sync(handler: Function, tooltipMsg: null | string) => HTMLElement
undo(handler: Function, tooltipMsg: null | string) => HTMLElement

Defined in

ui.ts:2288


tooltip

tooltip: Tooltip

Defined in

ui.ts:1654

Functions

_backColor

_backColor(x, s): HTMLElement

Parameters

NameType
xHTMLElement
sstring

Returns

HTMLElement

Defined in

ui.ts:112


_class

_class(x, s): HTMLElement

Parameters

NameType
xHTMLElement
sstring

Returns

HTMLElement

Defined in

ui.ts:102


_color

_color(x, s): HTMLElement

Parameters

NameType
xHTMLElement
sstring

Returns

HTMLElement

Defined in

ui.ts:107


_innerText

_innerText(x, s): HTMLElement

Parameters

NameType
xHTMLElement
sstring

Returns

HTMLElement

Defined in

ui.ts:97


accordion

accordion(key?): Accordion

Creates an accordion with dynamically populated panes. Example: https://public.datagrok.ai/js/samples/ui/components/accordion

Parameters

NameTypeDefault value
keyanynull

Returns

Accordion

Defined in

ui.ts:171


appendAll

appendAll(root, elements): HTMLElement

Appends multiple elements to root, and returns root. An element could be either HTMLElement or Viewer.

Parameters

NameType
rootHTMLElement
elements(HTMLElement | Viewer<any>)[]

Returns

HTMLElement

Defined in

ui.ts:65


bigButton

bigButton(text, handler, tooltip?): HTMLButtonElement

Parameters

NameTypeDefault value
textstringundefined
handlerFunctionundefined
tooltipnull | stringnull

Returns

HTMLButtonElement

Defined in

ui.ts:432


bind

bind(item, element, options?): HTMLElement

Binds [item] with the [element]. It enables selecting it as a current object, drag-and-drop, tooltip, and popup menu.

Parameters

NameType
itemany
elementHTMLElement
options?Object
options.contextMenuboolean

Returns

HTMLElement

Defined in

ui.ts:584


bindInputs

bindInputs(inputs): StreamSubscription[]

Parameters

NameType
inputsInputBase<any>[]

Returns

StreamSubscription[]

Defined in

ui.ts:676


block

block(items, options?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/containers/blocks

Parameters

NameTypeDefault value
itemsHTMLElement[]undefined
optionsnull | string | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:2084


block25

block25(items, options?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/containers/blocks

Parameters

NameTypeDefault value
itemsHTMLElement[]undefined
optionsnull | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:2102


block50

block50(items, options?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/containers/blocks

Parameters

NameTypeDefault value
itemsHTMLElement[]undefined
optionsnull | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:2111


block75

block75(items, options?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/containers/blocks

Parameters

NameTypeDefault value
itemsHTMLElement[]undefined
optionsnull | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:2093


boolInput

boolInput(name, value, onValueChanged?): InputBase<boolean | null>

Deprecated

The method will be removed soon. Use bool instead

Parameters

NameTypeDefault value
namestringundefined
valuebooleanundefined
onValueChangednull | Functionnull

Returns

InputBase<boolean | null>

Defined in

ui.ts:1002


box

box(item?, options?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/containers/box

Parameters

NameTypeDefault value
itemnull | HTMLElement | Widget<any> | InputBase<any>null
optionsnull | string | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:1834


boxFixed

boxFixed(item, options?): HTMLDivElement

Parameters

NameTypeDefault value
itemnull | HTMLElement | Widget<any> | InputBase<any>undefined
optionsnull | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:1851


breadcrumbs(path): Breadcrumbs

Example: https://public.datagrok.ai/js/samples/ui/components/breadcrumbs

Parameters

NameType
pathstring[]

Returns

Breadcrumbs

Defined in

ui.ts:2268


button

button(content, handler, tooltip?): HTMLButtonElement

Creates a button with the specified text, click handler, and tooltip. Example: https://public.datagrok.ai/js/samples/ui/components/buttons

Parameters

NameTypeDefault value
contentstring | Element | (string | Element)[]undefined
handlerFunctionundefined
tooltipnull | stringnull

Returns

HTMLButtonElement

Defined in

ui.ts:428


buttonsInput

buttonsInput(children?): HTMLDivElement

Parameters

NameTypeDefault value
childrenHTMLButtonElement[][]

Returns

HTMLDivElement

Defined in

ui.ts:2226


canvas

canvas(width?, height?): HTMLCanvasElement

Parameters

NameTypeDefault value
widthnull | numbernull
heightnull | numbernull

Returns

HTMLCanvasElement

Defined in

ui.ts:121


card

card(content): HTMLDivElement

Renders content as a card.

Parameters

NameType
contentHTMLElement

Returns

HTMLDivElement

Defined in

ui.ts:403


choiceInput

choiceInput<T>(name, selected, items, onValueChanged?, options?): ChoiceInput<T | null>

Deprecated

The method will be removed soon. Use choice instead

Type parameters

Name
T

Parameters

NameTypeDefault value
namestringundefined
selectedTundefined
itemsT[]undefined
onValueChangednull | Functionnull
optionsnull | { nullable?: boolean }null

Returns

ChoiceInput<T | null>

Defined in

ui.ts:972


colorInput

colorInput(name, value, onValueChanged?): InputBase<string>

Deprecated

The method will be removed soon. Use color instead

Parameters

NameTypeDefault value
namestringundefined
valuestringundefined
onValueChangednull | Functionnull

Returns

InputBase<string>

Defined in

ui.ts:1039


colorPicker

colorPicker(color, onChanged, colorDiv): HTMLElement

Parameters

NameType
colornumber
onChanged(color: number) => void
colorDivHTMLElement

Returns

HTMLElement

Defined in

ui.ts:1043


columnInput

columnInput(name, table, value, onValueChanged?, options?): InputBase<Column | null>

Deprecated

The method will be removed soon. Use column instead

Parameters

NameTypeDefault value
namestringundefined
tableDataFrameundefined
valuenull | Column<any>undefined
onValueChangednull | Functionnull
options?Objectundefined
options.filter?null | Functionundefined

Returns

InputBase<Column | null>

Defined in

ui.ts:1017


columnsInput

columnsInput(name, table, onValueChanged, options?): InputBase<Column[]>

Deprecated

The method will be removed soon. Use columns instead

Parameters

NameType
namestring
tableDataFrame
onValueChanged(columns: Column<any>[]) => void
options?Object
options.available?string[]
options.checked?string[]

Returns

InputBase<Column[]>

Defined in

ui.ts:1023


comboPopup

comboPopup(caption, items, handler, renderer?): HTMLElement

Creates a combo popup with the specified icons and items. Example: https://public.datagrok.ai/js/samples/ui/components/combo-popup

Parameters

NameTypeDescription
captionstring | HTMLElement
itemsstring[]
handler(item: any) => void(item) => {...}
renderer?null | (item: any) => HTMLElement(item) => {...}

Returns

HTMLElement

Defined in

ui.ts:444


comboPopupItems

comboPopupItems(caption, items): HTMLElement

Creates a combo popup with the specified icons and items

Parameters

NameType
captionstring | HTMLElement
itemsObject

Returns

HTMLElement

Defined in

ui.ts:453


contextActions

contextActions(x): HTMLElement

Parameters

NameType
xany

Returns

HTMLElement

Defined in

ui.ts:2242


dateInput

dateInput(name, value, onValueChanged?): DateInput

Deprecated

The method will be removed soon. Use date instead

Parameters

NameTypeDefault value
namestringundefined
valuenull | Dayjsundefined
onValueChangednull | Functionnull

Returns

DateInput

Defined in

ui.ts:997


dialog

dialog(options?): Dialog

Creates a [Dialog]. Example: https://public.datagrok.ai/js/samples/ui/containers/splitters

Parameters

NameType
options?string | { helpUrl?: string ; showFooter?: boolean ; showHeader?: boolean ; title?: string }

Returns

Dialog

Defined in

ui.ts:578


div

div(children?, options?): HTMLDivElement

Parameters

NameTypeDefault value
childrenstring | any[] | HTMLElement[]
optionsnull | string | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:339


divH

divH(items, options?): HTMLDivElement

Div flex-box container that positions child elements horizontally. Example: https://public.datagrok.ai/js/samples/ui/containers/flexbox

Parameters

NameTypeDefault value
items(null | HTMLElement)[]undefined
optionsnull | string | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:398


divText

divText(text, options?): HTMLDivElement

Returns DivElement with the specified inner text. Example: https://public.datagrok.ai/js/samples/ui/components/typography

Parameters

NameTypeDefault value
textstringundefined
optionsanynull

Returns

HTMLDivElement

Defined in

ui.ts:196


divV

divV(items, options?): HTMLDivElement

Div flex-box container that positions child elements vertically. Example: https://public.datagrok.ai/js/samples/ui/containers/flexbox

Parameters

NameTypeDefault value
itemsany[]undefined
optionsnull | string | ElementOptionsnull

Returns

HTMLDivElement

Defined in

ui.ts:389


dropDown(label, createElement): DropDown

Example: https://public.datagrok.ai/js/samples/ui/components/combo-popup

Parameters

NameType
labelstring | Element
createElement() => HTMLElement

Returns

DropDown

Defined in

ui.ts:2275


element

element(tagName, className?): HTMLElement & any

Creates an instance of the element for the specified tag, and optionally assigns it a CSS class.

Parameters

NameTypeDefault valueDescription
tagNamestringundefinedThe name of an element.
classNamenull | stringnull

Returns

HTMLElement & any

Defined in

ui.ts:52


empty

empty(e): HTMLElement

Removes all child nodes, and disposes widgets that these nodes might contain. See also [remove].

Parameters

NameType
eHTMLElement

Returns

HTMLElement

Defined in

ui.ts:75


extractRoot

extractRoot(x): HTMLElement | null

Parameters

NameType
xany

Returns

HTMLElement | null

Defined in

ui.ts:262


fileBrowser

fileBrowser(params?): Widget

Example: https://public.datagrok.ai/js/samples/ui/components/file-browser

Parameters

NameType
paramsObject
params.dataSourceFilter?"S3"[]
params.path?string

Returns

Widget

Defined in

ui.ts:2369


floatInput

floatInput(name, value, onValueChanged?): InputBase<number | null>

Deprecated

The method will be removed soon. Use float instead

Parameters

NameTypeDefault value
namestringundefined
valuenull | numberundefined
onValueChangednull | Functionnull

Returns

InputBase<number | null>

Defined in

ui.ts:992


form

form(inputs, options?, autosize?): HTMLElement

Parameters

NameTypeDefault value
inputsInputBase<any>[]undefined
optionsnull | {}null
autosizebooleantrue

Returns

HTMLElement

Defined in

ui.ts:2206


h1

h1(s, options?): HTMLHeadingElement

Example: https://public.datagrok.ai/js/samples/ui/components/typography

Parameters

NameTypeDefault value
sstring | Elementundefined
optionsnull | string | ElementOptionsnull

Returns

HTMLHeadingElement

Defined in

ui.ts:135


h2

h2(s, options?): HTMLHeadingElement

Example: https://public.datagrok.ai/js/samples/ui/components/typography

Parameters

NameTypeDefault value
sstring | Elementundefined
optionsnull | string | ElementOptionsnull

Returns

HTMLHeadingElement

Defined in

ui.ts:147


h3

h3(s, options?): HTMLHeadingElement

Example: https://public.datagrok.ai/js/samples/ui/components/typography

Parameters

NameTypeDefault value
sstring | Elementundefined
optionsnull | string | ElementOptionsnull

Returns

HTMLHeadingElement

Defined in

ui.ts:159


iconFA

iconFA(name, handler?, tooltipMsg?): HTMLElement

Returns a font-awesome icon with the specified name, handler, and tooltip. Example: https://public.datagrok.ai/js/samples/ui/components/icons

Parameters

NameTypeDefault valueDescription
namestringundefinedicon name (omit the "fa-" prefix)
handlernull | (this: HTMLElement, ev: MouseEvent) => anynull
tooltipMsgnull | stringnull

Returns

HTMLElement

Defined in

ui.ts:220


iconImage

iconImage(name, path, handler?, tooltipMsg?, options?): HTMLElement

Parameters

NameTypeDefault value
namestringundefined
pathstringundefined
handlernull | (this: HTMLElement, ev: MouseEvent) => anynull
tooltipMsgnull | stringnull
optionsnull | ElementOptionsnull

Returns

HTMLElement

Defined in

ui.ts:232


iconSvg

iconSvg(name, handler?, tooltipMsg?): HTMLElement

Parameters

NameTypeDefault value
namestringundefined
handlernull | (this: HTMLElement, ev: MouseEvent) => anynull
tooltipMsgnull | stringnull

Returns

HTMLElement

Defined in

ui.ts:250


iframe

iframe(options?): HTMLIFrameElement

Example: https://public.datagrok.ai/js/samples/ui/components/iframe

Parameters

NameType
options?Object
options.height?string
options.src?string
options.width?string

Returns

HTMLIFrameElement

Defined in

ui.ts:503


image

image(src, width, height, options?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/components/image

Parameters

NameType
srcstring
widthnumber
heightnumber
options?Object
options.target?string | Function
options.tooltipMsg?string

Returns

HTMLDivElement

Defined in

ui.ts:537


info

info(children, header?, reopenable?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/components/info-bar

Parameters

NameTypeDefault value
childrenstring | HTMLElement | HTMLElement[]undefined
headernull | stringnull
reopenablebooleantrue

Returns

HTMLDivElement

Defined in

ui.ts:354


inlineText

inlineText(objects): HTMLElement

Renders inline text, calling [renderMarkup] for each non-HTMLElement. Example: https://public.datagrok.ai/js/samples/ui/components/typography

Parameters

NameType
objectsany[]

Returns

HTMLElement

.

Defined in

ui.ts:331


inputs

inputs(inputs, options?): HTMLElement

Parameters

NameTypeDefault value
inputsIterable<InputBase<any>>undefined
optionsanynull

Returns

HTMLElement

Defined in

ui.ts:691


inputsRow

inputsRow(name, inputs): HTMLElement

Parameters

NameType
namestring
inputsInputBase<any>[]

Returns

HTMLElement

Defined in

ui.ts:955


intInput

intInput(name, value, onValueChanged?): InputBase<number | null>

Deprecated

The method will be removed soon. Use int instead

Parameters

NameTypeDefault value
namestringundefined
valuenull | numberundefined
onValueChangednull | Functionnull

Returns

InputBase<number | null>

Defined in

ui.ts:962


label

label(text, options?): HTMLLabelElement

Example: https://public.datagrok.ai/js/samples/ui/components/typography

Parameters

NameTypeDefault value
textnull | stringundefined
optionsnull | {}null

Returns

HTMLLabelElement

Defined in

ui.ts:2140


link(text, target, tooltipMsg?, options?): HTMLAnchorElement

Creates an <a> element.

Parameters

NameType
textstring
targetstring | object | Function
tooltipMsg?string
optionsnull | string | ElementOptions

Returns

HTMLAnchorElement

Defined in

ui.ts:552


list

list(items, options?): HTMLElement

Creates a visual element representing list of [items]. Example: https://public.datagrok.ai/js/samples/ui/components/list

Parameters

NameType
itemsany[]
options?Object
options.processNode?(node: HTMLElement) => void

Returns

HTMLElement

Defined in

ui.ts:493


loader

loader(): any

Example: https://public.datagrok.ai/js/samples/ui/components/loading-indicators

Returns

any

Defined in

ui.ts:410


makeDraggable

makeDraggable<T>(e, options?): Element

Example: https://public.datagrok.ai/js/samples/ui/interactivity/drag-and-drop

Type parameters

Name
T

Parameters

NameType
eElement
options?Object
options.allowCopy?() => boolean
options.check?() => boolean
options.dragObjectType?string
options.getDragCaption?() => any
options.getDragContext?() => any
options.getDragHint?() => string
options.getDragObject?() => any
options.onDragEnd?() => void
options.onDragStart?(me: MouseEvent) => boolean

Returns

Element

Defined in

ui.ts:640


makeDroppable

makeDroppable<T>(e, options?): void

Type parameters

Name
T

Parameters

NameType
eElement
options?Object
options.acceptDrop?(dragObject: T) => boolean
options.doDrop?(dragObject: T, copying: boolean) => void

Returns

void

Defined in

ui.ts:665


markdown

markdown(text): HTMLElement

Example: https://public.datagrok.ai/js/samples/ui/components/markdown

Parameters

NameType
textstring

Returns

HTMLElement

Defined in

ui.ts:210


moleculeInput

moleculeInput(name, value, onValueChanged?): InputBase<string>

Deprecated

The method will be removed soon. Use molecule instead

Parameters

NameTypeDefault value
namestringundefined
valuestringundefined
onValueChangednull | Functionnull

Returns

InputBase<string>

Defined in

ui.ts:1012


multiChoiceInput

multiChoiceInput<T>(name, value, items, onValueChanged?): InputBase<T[] | null>

Deprecated

The method will be removed soon. Use multiChoice instead

Type parameters

Name
T

Parameters

NameTypeDefault value
namestringundefined
valueT[]undefined
itemsT[]undefined
onValueChangednull | Functionnull

Returns

InputBase<T[] | null>

Defined in

ui.ts:977


narrowForm

narrowForm(children?, options?): HTMLElement

Parameters

NameTypeDefault value
childrenInputBase<any>[][]
optionsnull | {}null

Returns

HTMLElement

Defined in

ui.ts:2214


onSizeChanged

onSizeChanged(element): rxjs.Observable<any>

Example: https://public.datagrok.ai/js/samples/ui/ui-events

Parameters

NameType
elementHTMLElement

Returns

rxjs.Observable<any>

Defined in

ui.ts:1064


p

p(text, options?): HTMLParagraphElement

Example: https://public.datagrok.ai/js/samples/ui/components/typography

Parameters

NameTypeDefault value
textstringundefined
optionsanynull

Returns

HTMLParagraphElement

Defined in

ui.ts:2120


panel

panel(items?, options?): HTMLDivElement

Example: https://public.datagrok.ai/js/samples/ui/containers/panels

Parameters

NameTypeDefault value
itemsHTMLElement[][]
options?string | ElementOptionsundefined

Returns

HTMLDivElement

Defined in

ui.ts:2131


patternsInput

patternsInput(colors): HTMLElement

Parameters

NameType
colorsObject

Returns

HTMLElement

Defined in

ui.ts:1052


popupMenu

popupMenu(items): void

Parameters

NameType
itemsany

Returns

void

Defined in

ui.ts:621


radioInput

radioInput(name, value, items, onValueChanged?): InputBase<string | null>

Deprecated

The method will be removed soon. Use radio instead

Parameters

NameTypeDefault value
namestringundefined
valuestringundefined
itemsstring[]undefined
onValueChangednull | Functionnull

Returns

InputBase<string | null>

Defined in

ui.ts:1048


rangeSlider

rangeSlider(minRange, maxRange, min, max, vertical?, style?): RangeSlider

Example: https://public.datagrok.ai/js/samples/ui/components/range-slider

Parameters

NameTypeDefault value
minRangenumberundefined
maxRangenumberundefined
minnumberundefined
maxnumberundefined
verticalbooleanfalse
styleRangeSliderStyle | SliderOptions'barbell'

Returns

RangeSlider

Defined in

ui.ts:601


remove

remove(element): void

Removes the [element] from the DOM, and disposes any widgets that the [element] might contain. See also [empty].

Parameters

NameType
elementHTMLElement

Returns

void

Defined in

ui.ts:92


render

render(x, options?): HTMLElement

Renders object to html element.

Parameters

NameType
xany
options?ElementOptions

Returns

HTMLElement

Defined in

ui.ts:281


renderCard

renderCard(x): HTMLElement

Renders object to html card.

Parameters

NameType
xobject

Returns

HTMLElement

.

Defined in

ui.ts:312


renderInline

renderInline(x): HTMLElement

Parameters

NameType
xHTMLElement

Returns

HTMLElement

Defined in

ui.ts:321


ribbonPanel

ribbonPanel(items): HTMLDivElement

Parameters

NameType
itemsnull | HTMLElement[]

Returns

HTMLDivElement

Defined in

ui.ts:2064


schemeInput

schemeInput(gradient): HTMLElement

Parameters

NameType
gradientnumber[]

Returns

HTMLElement

Defined in

ui.ts:1056


searchInput

searchInput(name, value, onValueChanged?): InputBase<string>

Deprecated

The method will be removed soon. Use search instead

Parameters

NameTypeDefault value
namestringundefined
valuestringundefined
onValueChangednull | Functionnull

Returns

InputBase<string>

Defined in

ui.ts:987


setClass

setClass(e, classes, flag): void

Parameters

NameType
eHTMLElement
classesstring
flagboolean

Returns

void

Defined in

ui.ts:83


setDisabled

setDisabled(element, disabled, tooltip?): void

Parameters

NameType
elementHTMLElement
disabledboolean
tooltip?null | string | () => null | string | HTMLElement

Returns

void

Defined in

ui.ts:2318


setDisplay

setDisplay(element, show): HTMLElement

Parameters

NameType
elementHTMLElement
showboolean

Returns

HTMLElement

Defined in

ui.ts:2310


setDisplayAll

setDisplayAll(elements, show): void

Parameters

NameType
elementsHTMLElement[]
showboolean

Returns

void

Defined in

ui.ts:2306


setUpdateIndicator

setUpdateIndicator(element, updating?): void

Example: https://public.datagrok.ai/js/samples/ui/components/update-indicator

Parameters

NameTypeDefault value
elementHTMLElementundefined
updatingbooleantrue

Returns

void

Defined in

ui.ts:417


showPopup

showPopup(element, anchor, vertical?): Element

Shows popup with the [element] near the [anchor]. tooltip, and popup menu.

Parameters

NameTypeDefault value
elementHTMLElementundefined
anchorHTMLElementundefined
verticalbooleanfalse

Returns

Element

.

Defined in

ui.ts:594


sliderInput

sliderInput(name, value, min, max, onValueChanged?, options?): InputBase<number | null>

Deprecated

The method will be removed soon. Use slider instead

Parameters

NameTypeDefault value
namestringundefined
valuenull | numberundefined
minnumberundefined
maxnumberundefined
onValueChangednull | Functionnull
optionsnull | { step: null | number }null

Returns

InputBase<number | null>

Defined in

ui.ts:967


span

span(x, options?): HTMLElement

Renders multiple objects as a span

Parameters

NameTypeDefault value
xany[]undefined
optionsnull | string | ElementOptionsnull

Returns

HTMLElement

Defined in

ui.ts:317


splitH

splitH(items, options?, resize?): HTMLDivElement

Div flex-box container that positions child elements horizontally. Example: https://public.datagrok.ai/js/samples/ui/containers/splitters

Parameters

NameTypeDefault value
itemsHTMLElement[]undefined
optionsnull | ElementOptionsnull
resizenull | booleanfalse

Returns

HTMLDivElement

Defined in

ui.ts:1926


splitV

splitV(items, options?, resize?): HTMLDivElement

Div flex-box container that positions child elements vertically. Example: https://public.datagrok.ai/js/samples/ui/containers/splitters

Parameters

NameTypeDefault value
itemsHTMLElement[]undefined
optionsnull | ElementOptionsnull
resizenull | booleanfalse

Returns

HTMLDivElement

Defined in

ui.ts:1860


star

star(id): HTMLElement

Parameters

NameType
idstring

Returns

HTMLElement

Defined in

ui.ts:2246


stringInput

stringInput(name, value, onValueChanged?, options?): InputBase<string>

Deprecated

The method will be removed soon. Use string instead

Parameters

NameTypeDefault value
namestringundefined
valuestringundefined
onValueChangednull | Functionnull
optionsnull | { clearIcon?: boolean ; escClears?: boolean ; icon?: string | HTMLElement ; placeholder?: String }null

Returns

InputBase<string>

Defined in

ui.ts:982


switchInput

switchInput(name, value, onValueChanged?): InputBase<boolean>

Deprecated

The method will be removed soon. Use toggle instead

Parameters

NameTypeDefault value
namestringundefined
valuebooleanundefined
onValueChangednull | Functionnull

Returns

InputBase<boolean>

Defined in

ui.ts:1007


tabControl

tabControl(pages?, vertical?): TabControl

Example: https://public.datagrok.ai/js/samples/ui/components/tab-control

Parameters

NameTypeDefault valueDescription
pagesnull | { [key: string]: any; }nulllist of page factories
verticalbooleanfalse

Returns

TabControl

Defined in

ui.ts:180


table

table<T>(items, renderer, columnNames?): HTMLTableElement

Creates a visual table based on [items] and [renderer].

Type parameters

Name
T

Parameters

NameTypeDefault value
itemsT[]undefined
renderernull | (item: T, ind: number) => anyundefined
columnNamesnull | string[]null

Returns

HTMLTableElement

Defined in

ui.ts:472


tableFromMap

tableFromMap(map): HTMLTableElement

Creates an html table based on [map]. Example: https://public.datagrok.ai/js/samples/ui/components/html-tables

Parameters

NameType
mapObject

Returns

HTMLTableElement

Defined in

ui.ts:460


tableFromProperties

tableFromProperties(items, properties): HTMLTableElement

Creates an editable html table for the specified items (rows) and properties (columns).

Parameters

NameType
itemsany[]
propertiesProperty[]

Returns

HTMLTableElement

Defined in

ui.ts:465


tableInput

tableInput(name, table, tables?, onValueChanged?): InputBase<DataFrame | null>

Deprecated

The method will be removed soon. Use table instead

Parameters

NameTypeDefault value
namestringundefined
tablenull | DataFrameundefined
tablesDataFrame[]grok.shell.tables
onValueChangednull | Functionnull

Returns

InputBase<DataFrame | null>

Defined in

ui.ts:1029


tags

tags(entity): HTMLElement

Parameters

NameType
entityEntity

Returns

HTMLElement

Defined in

ui.ts:203


tagsInput

tagsInput(name, tags, showButton): TagsInput

Deprecated

The method will be removed soon. Use tags instead

Parameters

NameType
namestring
tagsstring[]
showButtonboolean

Returns

TagsInput

Defined in

ui.ts:2284


textInput

textInput(name, value, onValueChanged?): InputBase<string>

Deprecated

The method will be removed soon. Use textArea instead

Parameters

NameTypeDefault value
namestringundefined
valuestringundefined
onValueChangednull | Functionnull

Returns

InputBase<string>

Defined in

ui.ts:1034


tree

tree(): TreeViewGroup

Creates new nodes tree. Example: https://public.datagrok.ai/js/samples/ui/components/tree-view

Returns

TreeViewGroup

Defined in

ui.ts:698


typeAhead

typeAhead(name, config): TypeAhead

Parameters

NameType
namestring
configTypeAheadConfig

Returns

TypeAhead

Defined in

ui.ts:2279


virtualView

virtualView(length, renderer, verticalScroll?, maxColumns?): VirtualView

Creates a virtual list widget. Example: https://public.datagrok.ai/js/samples/ui/views/virtual-view

Parameters

NameTypeDefault valueDescription
lengthnumberundefinednumber of elements
rendererFunctionundefined
verticalScrollbooleantruevertical or horizontal scrolling
maxColumnsnumber1000maximum number of items on the non-scrolling axis

Returns

VirtualView

Defined in

ui.ts:615


wait

wait(getElement): any

Waits for Future<Element> function to complete and collect its result. Example: https://public.datagrok.ai/js/samples/ui/components/loading-indicators

Parameters

NameType
getElement() => Promise<HTMLElement>

Returns

any

Defined in

ui.ts:479


waitBox

waitBox(getElement): any

Waits for Future<Element> function to complete and collect its result as a ui.box. Example: https://public.datagrok.ai/js/samples/ui/components/loading-indicators

Parameters

NameType
getElement() => Promise<HTMLElement>

Returns

any

Defined in

ui.ts:486


wideForm

wideForm(children?, options?): HTMLElement

Parameters

NameTypeDefault value
childrenInputBase<any>[][]
optionsnull | {}null

Returns

HTMLElement

Defined in

ui.ts:2220