Module: ui

Routines for building UI

Namespaces

Classes

Interfaces

IInputInitOptions

Variables

icons

• icons: Object

Type declaration

Name	Type
`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:1366

• tooltip: Tooltip

Defined in

ui.ts:905

Functions

_backColor

▸ _backColor(x, s): HTMLElement

Parameters

Name	Type
`x`	`HTMLElement`
`s`	`string`

Returns

HTMLElement

Defined in

ui.ts:104

_class

▸ _class(x, s): HTMLElement

Parameters

Name	Type
`x`	`HTMLElement`
`s`	`string`

Returns

HTMLElement

Defined in

ui.ts:94

_color

▸ _color(x, s): HTMLElement

Parameters

Name	Type
`x`	`HTMLElement`
`s`	`string`

Returns

HTMLElement

Defined in

ui.ts:99

_innerText

▸ _innerText(x, s): HTMLElement

Parameters

Name	Type
`x`	`HTMLElement`
`s`	`string`

Returns

HTMLElement

Defined in

ui.ts:89

accordion

▸ accordion(key?): Accordion

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

Parameters

Name	Type	Default value
`key`	`any`	`null`

Returns

Accordion

Defined in

ui.ts:157

appendAll

▸ appendAll(root, elements): HTMLElement

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

Parameters

Name	Type
`root`	`HTMLElement`
`elements`	(`HTMLElement` \| `Viewer`<`any`>)[]

Returns

HTMLElement

Defined in

ui.ts:57

bigButton

▸ bigButton(text, handler, tooltip?): HTMLButtonElement

Parameters

Name	Type	Default value
`text`	`string`	`undefined`
`handler`	`Function`	`undefined`
`tooltip`	`null` \| `string`	`null`

Returns

HTMLButtonElement

Defined in

ui.ts:396

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

Name	Type
`item`	`any`
`element`	`HTMLElement`
`options?`	`Object`
`options.contextMenu`	`boolean`

Returns

HTMLElement

Defined in

ui.ts:532

bindInputs

▸ bindInputs(inputs): StreamSubscription[]

Parameters

Name	Type
`inputs`	`InputBase`<`any`>[]

Returns

StreamSubscription[]

Defined in

ui.ts:618

block

▸ block(items, options?): HTMLDivElement

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`undefined`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1259

block25

▸ block25(items, options?): HTMLDivElement

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`undefined`
`options`	`null` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1271

block50

▸ block50(items, options?): HTMLDivElement

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`undefined`
`options`	`null` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1277

block75

▸ block75(items, options?): HTMLDivElement

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`undefined`
`options`	`null` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1265

boolInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`boolean`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<boolean | null>

Defined in

ui.ts:729

box

▸ box(item?, options?): HTMLDivElement

Parameters

Name	Type	Default value
`item`	`null` \| `HTMLElement` \| `Widget`<`any`> \| `InputBase`<`any`>	`null`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1077

boxFixed

▸ boxFixed(item, options?): HTMLDivElement

Parameters

Name	Type	Default value
`item`	`null` \| `HTMLElement` \| `Widget`<`any`> \| `InputBase`<`any`>	`undefined`
`options`	`null` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1094

button

▸ button(content, handler, tooltip?): HTMLButtonElement

Creates a button with the specified text, click handler, and tooltip

Parameters

Name	Type	Default value
`content`	`string` \| `Element` \| (`string` \| `Element`)[]	`undefined`
`handler`	`Function`	`undefined`
`tooltip`	`null` \| `string`	`null`

Returns

HTMLButtonElement

Defined in

ui.ts:392

buttonsInput

▸ buttonsInput(children?): HTMLDivElement

Parameters

Name	Type	Default value
`children`	`HTMLButtonElement`[]	`[]`

Returns

HTMLDivElement

Defined in

ui.ts:1327

canvas

▸ canvas(width?, height?): HTMLCanvasElement

Parameters

Name	Type	Default value
`width`	`null` \| `number`	`null`
`height`	`null` \| `number`	`null`

Returns

HTMLCanvasElement

Defined in

ui.ts:113

card

▸ card(content): HTMLDivElement

Renders content as a card.

Parameters

Name	Type
`content`	`HTMLElement`

Returns

HTMLDivElement

Defined in

ui.ts:374

choiceInput

▸ choiceInput<T>(name, selected, items, onValueChanged?): InputBase<T | null>

Type parameters

Name
`T`

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`selected`	`T`	`undefined`
`items`	`T`[]	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<T | null>

Defined in

ui.ts:705

colorInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`string`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<string>

Defined in

ui.ts:758

columnInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`table`	`DataFrame`	`undefined`
`value`	`null` \| `Column`<`any`>	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<Column | null>

Defined in

ui.ts:741

columnsInput

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

Parameters

Name	Type
`name`	`string`
`table`	`DataFrame`
`onValueChanged`	(`columns`: `Column`<`any`>[]) => `void`
`options?`	`Object`
`options.available?`	`string`[]
`options.checked?`	`string`[]

Returns

InputBase<Column[]>

Defined in

ui.ts:745

comboPopup

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

Creates a combo popup with the specified icons and items

Parameters

Name	Type	Description
`caption`	`string` \| `HTMLElement`
`items`	`string`[]
`handler`	(`item`: `any`) => `void`	(item) => {...}
`renderer?`	`null` \| (`item`: `any`) => `HTMLElement`	(item) => {...}

Returns

HTMLElement

Defined in

ui.ts:407

comboPopupItems

▸ comboPopupItems(caption, items): HTMLElement

Creates a combo popup with the specified icons and items

Parameters

Name	Type
`caption`	`string` \| `HTMLElement`
`items`	`Object`

Returns

HTMLElement

Defined in

ui.ts:416

contextActions

▸ contextActions(x): HTMLElement

Parameters

Name	Type
`x`	`any`

Returns

HTMLElement

Defined in

ui.ts:1343

dateInput

▸ dateInput(name, value, onValueChanged?): DateInput

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`null` \| `Dayjs`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

DateInput

Defined in

ui.ts:725

dialog

▸ dialog(options?): Dialog

Creates a [Dialog].

Parameters

Name	Type
`options?`	`string` \| { `helpUrl?`: `string` ; `showFooter?`: `boolean` ; `showHeader?`: `boolean` ; `title?`: `string` }

Returns

Dialog

Defined in

ui.ts:526

div

▸ div(children?, options?): HTMLDivElement

Parameters

Name	Type	Default value
`children`	`string` \| `any`[] \| `HTMLElement`	`[]`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:315

divH

▸ divH(items, options?): HTMLDivElement

Div flex-box container that positions child elements horizontally.

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`undefined`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:369

divText

▸ divText(text, options?): HTMLDivElement

Returns DivElement with the specified inner text

Parameters

Name	Type	Default value
`text`	`string`	`undefined`
`options`	`any`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:180

divV

▸ divV(items, options?): HTMLDivElement

Div flex-box container that positions child elements vertically.

Parameters

Name	Type	Default value
`items`	`any`[]	`undefined`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:361

element

▸ element(tagName, className?): HTMLElement & any

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

Parameters

Name	Type	Default value	Description
`tagName`	`string`	`undefined`	The name of an element.
`className`	`null` \| `string`	`null`

Returns

HTMLElement & any

Defined in

ui.ts:44

empty

▸ empty(e): HTMLElement

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

Parameters

Name	Type
`e`	`HTMLElement`

Returns

HTMLElement

Defined in

ui.ts:67

extractRoot

▸ extractRoot(x): HTMLElement | null

Parameters

Name	Type
`x`	`any`

Returns

HTMLElement | null

Defined in

ui.ts:239

fileBrowser

▸ fileBrowser(params?): Widget

Parameters

Name	Type
`params`	`Object`
`params.dataSourceFilter?`	`"S3"`[]
`params.path?`	`string`

Returns

Widget

Defined in

ui.ts:1396

floatInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`null` \| `number`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<number | null>

Defined in

ui.ts:721

form

▸ form(children?, options?): HTMLDivElement

Parameters

Name	Type	Default value
`children`	`InputBase`<`any`>[]	`[]`
`options`	`null` \| {}	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1305

h1

▸ h1(s, options?): HTMLHeadingElement

Parameters

Name	Type	Default value
`s`	`string` \| `Element`	`undefined`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLHeadingElement

Defined in

ui.ts:125

h2

▸ h2(s, options?): HTMLHeadingElement

Parameters

Name	Type	Default value
`s`	`string` \| `Element`	`undefined`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLHeadingElement

Defined in

ui.ts:135

h3

▸ h3(s, options?): HTMLHeadingElement

Parameters

Name	Type	Default value
`s`	`string` \| `Element`	`undefined`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLHeadingElement

Defined in

ui.ts:145

iconFA

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

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

Parameters

Name	Type	Default value	Description
`name`	`string`	`undefined`	icon name (omit the "fa-" prefix)
`handler`	`null` \| (`this`: `HTMLElement`, `ev`: `MouseEvent`) => `any`	`null`
`tooltipMsg`	`null` \| `string`	`null`

Returns

HTMLElement

Defined in

ui.ts:201

iconImage

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`path`	`string`	`undefined`
`handler`	`null` \| (`this`: `HTMLElement`, `ev`: `MouseEvent`) => `any`	`null`
`tooltipMsg`	`null` \| `string`	`null`

Returns

HTMLElement

Defined in

ui.ts:213

iconSvg

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`handler`	`null` \| (`this`: `HTMLElement`, `ev`: `MouseEvent`) => `any`	`null`
`tooltipMsg`	`null` \| `string`	`null`

Returns

HTMLElement

Defined in

ui.ts:227

iframe

▸ iframe(options?): HTMLIFrameElement

Parameters

Name	Type
`options?`	`Object`
`options.height?`	`string`
`options.src?`	`string`
`options.width?`	`string`

Returns

HTMLIFrameElement

Defined in

ui.ts:456

image

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

Parameters

Name	Type
`src`	`string`
`width`	`number`
`height`	`number`
`options?`	`Object`
`options.target?`	`string` \| `Function`
`options.tooltipMsg?`	`string`

Returns

HTMLDivElement

Defined in

ui.ts:487

info

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

Parameters

Name	Type	Default value
`children`	`string` \| `HTMLElement` \| `HTMLElement`[]	`undefined`
`header`	`null` \| `string`	`null`
`reopenable`	`boolean`	`true`

Returns

HTMLDivElement

Defined in

ui.ts:327

inlineText

▸ inlineText(objects): HTMLElement

Renders inline text, calling [renderMarkup] for each non-HTMLElement

Parameters

Name	Type
`objects`	`any`[]

Returns

HTMLElement

Defined in

ui.ts:307

inputs

▸ inputs(inputs, options?): HTMLDivElement

Parameters

Name	Type	Default value
`inputs`	`Iterable`<`InputBase`<`any`>>	`undefined`
`options`	`any`	`null`

Returns

HTMLDivElement

Defined in

ui.ts:633

inputsRow

▸ inputsRow(name, inputs): HTMLElement

Parameters

Name	Type
`name`	`string`
`inputs`	`InputBase`<`any`>[]

Returns

HTMLElement

Defined in

ui.ts:691

intInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`null` \| `number`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<number | null>

Defined in

ui.ts:697

label

▸ label(text, options?): HTMLLabelElement

Parameters

Name	Type	Default value
`text`	`null` \| `string`	`undefined`
`options`	`null` \| {}	`null`

Returns

HTMLLabelElement

Defined in

ui.ts:1297

link

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

Creates an <a> element.

Parameters

Name	Type
`text`	`string`
`target`	`string` \| `object` \| `Function`
`tooltipMsg?`	`string`
`options`	`null` \| `string` \| `ElementOptions`

Returns

HTMLAnchorElement

Defined in

ui.ts:502

list

▸ list(items, options?): HTMLElement

Creates a visual element representing list of [items].

Parameters

Name	Type
`items`	`any`[]
`options?`	`Object`
`options.processNode?`	(`node`: `HTMLElement`) => `void`

Returns

HTMLElement

Defined in

ui.ts:448

loader

▸ loader(): any

Returns

any

Defined in

ui.ts:378

makeDraggable

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

Type parameters

Name
`T`

Parameters

Name	Type
`e`	`Element`
`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:582

makeDroppable

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

Type parameters

Name
`T`

Parameters

Name	Type
`e`	`Element`
`options?`	`Object`
`options.acceptDrop?`	(`dragObject`: `T`) => `boolean`
`options.doDrop?`	(`dragObject`: `T`, `copying`: `boolean`) => `void`

Returns

void

Defined in

ui.ts:607

markdown

▸ markdown(text): HTMLElement

Parameters

Name	Type
`text`	`string`

Returns

HTMLElement

Defined in

ui.ts:191

moleculeInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`string`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<string>

Defined in

ui.ts:737

multiChoiceInput

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

Type parameters

Name
`T`

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`T`[]	`undefined`
`items`	`T`[]	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<T[] | null>

Defined in

ui.ts:709

narrowForm

▸ narrowForm(children?, options?): HTMLDivElement

Parameters

Name	Type	Default value
`children`	`InputBase`<`any`>[]	`[]`
`options`	`null` \| {}	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1315

onSizeChanged

▸ onSizeChanged(element): rxjs.Observable<any>

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

Parameters

Name	Type
`element`	`HTMLElement`

Returns

rxjs.Observable<any>

Defined in

ui.ts:766

p

▸ p(text, options?): HTMLParagraphElement

Parameters

Name	Type	Default value
`text`	`string`	`undefined`
`options`	`any`	`null`

Returns

HTMLParagraphElement

Defined in

ui.ts:1283

panel

▸ panel(items?, options?): HTMLDivElement

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`[]`
`options?`	`string` \| `ElementOptions`	`undefined`

Returns

HTMLDivElement

Defined in

ui.ts:1291

popupMenu

▸ popupMenu(items): void

Parameters

Name	Type
`items`	`any`

Returns

void

Defined in

ui.ts:566

rangeSlider

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

Parameters

Name	Type	Default value
`minRange`	`number`	`undefined`
`maxRange`	`number`	`undefined`
`min`	`number`	`undefined`
`max`	`number`	`undefined`
`vertical`	`boolean`	`false`
`style`	`RangeSliderStyle` \| `SliderOptions`	`'barbell'`

Returns

RangeSlider

Defined in

ui.ts:546

remove

▸ remove(element): void

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

Parameters

Name	Type
`element`	`HTMLElement`

Returns

void

Defined in

ui.ts:84

render

▸ render(x, options?): HTMLElement

Renders object to html element.

Parameters

Name	Type
`x`	`any`
`options?`	`ElementOptions`

Returns

HTMLElement

Defined in

ui.ts:258

renderCard

▸ renderCard(x): HTMLElement

Renders object to html card.

Parameters

Name	Type
`x`	`object`

Returns

HTMLElement

Defined in

ui.ts:289

renderInline

▸ renderInline(x): HTMLElement

Parameters

Name	Type
`x`	`HTMLElement`

Returns

HTMLElement

Defined in

ui.ts:298

ribbonPanel

▸ ribbonPanel(items): HTMLDivElement

Parameters

Name	Type
`items`	`null` \| `HTMLElement`[]

Returns

HTMLDivElement

Defined in

ui.ts:1242

searchInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`string`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<string>

Defined in

ui.ts:717

setClass

▸ setClass(e, classes, flag): void

Parameters

Name	Type
`e`	`HTMLElement`
`classes`	`string`
`flag`	`boolean`

Returns

void

Defined in

ui.ts:75

setDisplay

▸ setDisplay(element, show): HTMLElement

Parameters

Name	Type
`element`	`HTMLElement`
`show`	`boolean`

Returns

HTMLElement

Defined in

ui.ts:1388

setDisplayAll

▸ setDisplayAll(elements, show): void

Parameters

Name	Type
`elements`	`HTMLElement`[]
`show`	`boolean`

Returns

void

Defined in

ui.ts:1384

setUpdateIndicator

▸ setUpdateIndicator(element, updating?): void

Parameters

Name	Type	Default value
`element`	`HTMLElement`	`undefined`
`updating`	`boolean`	`true`

Returns

void

Defined in

ui.ts:382

showPopup

▸ showPopup(element, anchor, vertical?): Element

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

Parameters

Name	Type	Default value
`element`	`HTMLElement`	`undefined`
`anchor`	`HTMLElement`	`undefined`
`vertical`	`boolean`	`false`

Returns

Element

Defined in

ui.ts:542

sliderInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`null` \| `number`	`undefined`
`min`	`number`	`undefined`
`max`	`number`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<number | null>

Defined in

ui.ts:701

span

▸ span(x, options?): HTMLElement

Renders multiple objects as a span

Parameters

Name	Type	Default value
`x`	`any`[]	`undefined`
`options`	`null` \| `string` \| `ElementOptions`	`null`

Returns

HTMLElement

Defined in

ui.ts:294

splitH

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

Div flex-box container that positions child elements horizontally.

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`undefined`
`options`	`null` \| `ElementOptions`	`null`
`resize`	`null` \| `boolean`	`false`

Returns

HTMLDivElement

Defined in

ui.ts:1139

splitV

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

Div flex-box container that positions child elements vertically.

Parameters

Name	Type	Default value
`items`	`HTMLElement`[]	`undefined`
`options`	`null` \| `ElementOptions`	`null`
`resize`	`null` \| `boolean`	`false`

Returns

HTMLDivElement

Defined in

ui.ts:1101

star

▸ star(id): HTMLElement

Parameters

Name	Type
`id`	`string`

Returns

HTMLElement

Defined in

ui.ts:1347

stringInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`string`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`
`options`	`null` \| { `clearIcon?`: `boolean` ; `escClears?`: `boolean` ; `icon?`: `string` \| `HTMLElement` ; `placeholder?`: `String` }	`null`

Returns

InputBase<string>

Defined in

ui.ts:713

switchInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`boolean`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<boolean>

Defined in

ui.ts:733

tabControl

▸ tabControl(pages?, vertical?): TabControl

Parameters

Name	Type	Default value	Description
`pages`	`null` \| { `[key: string]`: `any`; }	`null`	list of page factories
`vertical`	`boolean`	`false`

Returns

TabControl

Defined in

ui.ts:165

table

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

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

Type parameters

Name
`T`

Parameters

Name	Type	Default value
`items`	`T`[]	`undefined`
`renderer`	`null` \| (`item`: `T`, `ind`: `number`) => `any`	`undefined`
`columnNames`	`null` \| `string`[]	`null`

Returns

HTMLTableElement

Defined in

ui.ts:433

tableFromMap

▸ tableFromMap(map): HTMLTableElement

Creates an html table based on [map].

Parameters

Name	Type
`map`	`Object`

Returns

HTMLTableElement

Defined in

ui.ts:421

tableFromProperties

▸ tableFromProperties(items, properties): HTMLTableElement

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

Parameters

Name	Type
`items`	`any`[]
`properties`	`Property`[]

Returns

HTMLTableElement

Defined in

ui.ts:426

tableInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`table`	`null` \| `DataFrame`	`undefined`
`tables`	`DataFrame`[]	`grok.shell.tables`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<DataFrame | null>

Defined in

ui.ts:750

textInput

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

Parameters

Name	Type	Default value
`name`	`string`	`undefined`
`value`	`string`	`undefined`
`onValueChanged`	`null` \| `Function`	`null`

Returns

InputBase<string>

Defined in

ui.ts:754

tree

▸ tree(): TreeViewGroup

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

Returns

TreeViewGroup

Defined in

ui.ts:640

virtualView

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

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

Parameters

Name	Type	Default value	Description
`length`	`number`	`undefined`	number of elements
`renderer`	`Function`	`undefined`
`verticalScroll`	`boolean`	`true`	vertical or horizontal scrolling
`maxColumns`	`number`	`1000`	maximum number of items on the non-scrolling axis

Returns

VirtualView

Defined in

ui.ts:560

wait

▸ wait(getElement): any

Waits for Future<Element> function to complete and collect its result.

Parameters

Name	Type
`getElement`	() => `Promise`<`HTMLElement`>

Returns

any

Defined in

ui.ts:438

waitBox

▸ waitBox(getElement): any

Waits for Future<Element> function to complete and collect its result as a ui.box.

Parameters

Name	Type
`getElement`	() => `Promise`<`HTMLElement`>

Returns

any

Defined in

ui.ts:443

wideForm

▸ wideForm(children?, options?): HTMLDivElement

Parameters

Name	Type	Default value
`children`	`InputBase`<`any`>[]	`[]`
`options`	`null` \| {}	`null`

Returns

HTMLDivElement

Defined in

ui.ts:1321

Namespaces​

Classes​

Interfaces​

Variables​

icons​

Type declaration​

Defined in​

tooltip​

Defined in​

Functions​

_backColor​

Parameters​

Returns​

Defined in​

_class​

Parameters​

Returns​

Defined in​

_color​

Parameters​

Returns​

Defined in​

_innerText​

Parameters​

Returns​

Defined in​

accordion​

Parameters​

Returns​

Defined in​

appendAll​

Parameters​

Returns​

Defined in​

bigButton​

Parameters​

Returns​

Defined in​

bind​

Parameters​

Returns​

Defined in​

bindInputs​

Parameters​

Returns​

Defined in​

block​

Parameters​

Returns​

Defined in​

block25​

Parameters​

Returns​

Defined in​

block50​

Parameters​

Returns​

Defined in​

block75​

Parameters​

Returns​

Defined in​

boolInput​

Parameters​

Returns​

Defined in​

box​

Parameters​

Returns​

Defined in​

boxFixed​

Parameters​

Returns​

Defined in​

button​

Parameters​

Returns​

Defined in​

buttonsInput​

Parameters​

Namespaces

Classes

Interfaces

Variables

icons

Type declaration

Defined in

tooltip

Defined in

Functions

_backColor

Parameters

Returns

Defined in

_class

Parameters

Returns

Defined in

_color

Parameters

Returns

Defined in

_innerText

Parameters

Returns

Defined in

accordion

Parameters

Returns

Defined in

appendAll

Parameters

Returns

Defined in

bigButton

Parameters

Returns

Defined in

bind

Parameters

Returns

Defined in

bindInputs

Parameters

Returns

Defined in

block

Parameters

Returns

Defined in

block25

Parameters

Returns

Defined in

block50

Parameters

Returns

Defined in

block75

Parameters

Returns

Defined in

boolInput

Parameters

Returns

Defined in

box

Parameters

Returns

Defined in

boxFixed

Parameters

Returns

Defined in

button

Parameters

Returns

Defined in

buttonsInput

Parameters