2025-04-12 13:30:24 +03:00
<!DOCTYPE html> < html class = "default" lang = "en" data-base = "../" > < head > < meta charset = "utf-8" / > < meta http-equiv = "x-ua-compatible" content = "IE=edge" / > < title > default | trilium< / title > < meta name = "description" content = "Documentation for trilium" / > < meta name = "viewport" content = "width=device-width, initial-scale=1" / > < link rel = "stylesheet" href = "../assets/style.css" / > < link rel = "stylesheet" href = "../assets/highlight.css" / > < script defer src = "../assets/main.js" > < / script > < script async src = "../assets/icons.js" id = "tsd-icons-script" > < / script > < script async src = "../assets/search.js" id = "tsd-search-script" > < / script > < script async src = "../assets/navigation.js" id = "tsd-nav-script" > < / script > < script async src = "../assets/hierarchy.js" id = "tsd-hierarchy-script" > < / script > < / head > < body > < script > document . documentElement . dataset . theme = localStorage . getItem ( "tsd-theme" ) || "os" ; document . body . style . display = "none" ; setTimeout ( ( ) => window . app ? app . showPage ( ) : document . body . style . removeProperty ( "display" ) , 500 ) < / script > < header class = "tsd-page-toolbar" > < div class = "tsd-toolbar-contents container" > < a href = "../index.html" class = "title" > trilium< / a > < div id = "tsd-toolbar-links" > < / div > < button id = "tsd-search-trigger" class = "tsd-widget" aria-label = "Search" > < svg width = "16" height = "16" viewBox = "0 0 16 16" fill = "none" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-search" > < / use > < / svg > < / button > < dialog id = "tsd-search" aria-label = "Search" > < input role = "combobox" id = "tsd-search-input" aria-controls = "tsd-search-results" aria-autocomplete = "list" aria-expanded = "true" autocapitalize = "off" autocomplete = "off" placeholder = "Search the docs" maxLength = "100" / > < ul role = "listbox" id = "tsd-search-results" > < / ul > < div id = "tsd-search-status" aria-live = "polite" aria-atomic = "true" > < div > Preparing search index...< / div > < / div > < / dialog > < a href = "#" class = "tsd-widget menu" id = "tsd-toolbar-menu-trigger" data-toggle = "menu" aria-label = "Menu" > < svg width = "16" height = "16" viewBox = "0 0 16 16" fill = "none" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-menu" > < / use > < / svg > < / a > < / div > < / header > < div class = "container container-main" > < div class = "col-content" > < div class = "tsd-page-title" > < ul class = "tsd-breadcrumb" aria-label = "Breadcrumb" > < li > < a href = "../modules/Frontend_Script_API.html" > Frontend Script API< / a > < / li > < li > < a href = "../modules/Frontend_Script_API._internal_.html" > < internal> < / a > < / li > < li > < a href = "" aria-current = "page" > default< / a > < / li > < / ul > < h1 > Class default< / h1 > < / div > < section class = "tsd-panel tsd-comment" > < div class = "tsd-comment tsd-typography" > < p > Abstract class for all components in the Trilium's frontend.< / p >
< p > Contains also event implementation with following properties:< / p >
< ul >
< li > event / command distribution is synchronous which among others mean that events are well-ordered - event
which was sent out first will also be processed first by the component< / li >
< li > execution of the event / command is asynchronous - each component executes the event on its own without regard for
other components.< / li >
< li > although the execution is async, we are collecting all the promises, and therefore it is possible to wait until the
event / command is executed in all components - by simply awaiting the < code > triggerEvent()< / code > .< / li >
< / ul >
2025-04-12 13:36:25 +03:00
< / div > < div class = "tsd-comment tsd-typography" > < / div > < / section > < section class = "tsd-panel tsd-hierarchy" data-refl = "9777" > < h4 > Hierarchy (< a href = "../hierarchy.html#Frontend Script API.<internal>.default" > View Summary< / a > )< / h4 > < ul class = "tsd-hierarchy" > < li class = "tsd-hierarchy-item" > < a href = "Frontend_Script_API._internal_.TypedComponent.html" class = "tsd-signature-type tsd-kind-class" > TypedComponent< / a > < span class = "tsd-signature-symbol" > < < / span > < a href = "" class = "tsd-signature-type tsd-kind-class" > default< / a > < span class = "tsd-signature-symbol" > > < / span > < ul class = "tsd-hierarchy" > < li class = "tsd-hierarchy-item" > < span class = "tsd-hierarchy-target" > default< / span > < ul class = "tsd-hierarchy" > < li class = "tsd-hierarchy-item" > < a href = "Frontend_Script_API._internal_.NoteContext.html" class = "tsd-signature-type tsd-kind-class" > NoteContext< / a > < / li > < / ul > < / li > < / ul > < / li > < / ul > < / section > < aside class = "tsd-sources" > < ul > < li > Defined in < a href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/components/component.ts#L129" > src/public/app/components/component.ts:129< / a > < / li > < / ul > < / aside > < section class = "tsd-panel-group tsd-index-group" > < section class = "tsd-panel tsd-index-panel" > < details class = "tsd-index-content tsd-accordion" open > < summary class = "tsd-accordion-summary tsd-index-summary" > < svg width = "16" height = "16" viewBox = "0 0 16 16" fill = "none" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-chevronSmall" > < / use > < / svg > < h5 class = "tsd-index-heading uppercase" > Index< / h5 > < / summary > < div class = "tsd-accordion-details" > < section class = "tsd-index-section" > < h3 class = "tsd-index-heading" > Constructors< / h3 > < div class = "tsd-index-list" > < a href = "#constructor" class = "tsd-index-link" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Constructor" > < use href = "../assets/icons.svg#icon-512" > < / use > < / svg > < span > constructor< / span > < / a >
2025-04-12 13:30:24 +03:00
< / div > < / section > < section class = "tsd-index-section" > < h3 class = "tsd-index-heading" > Properties< / h3 > < div class = "tsd-index-list" > < a href = "#_position" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Property" > < use href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > _position< / span > < / a >
< a href = "#widget" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Property" > < use href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > $widget< / span > < / a >
< a href = "#children" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Property" > < use href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > children< / span > < / a >
< a href = "#componentid" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Property" > < use href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > component< wbr / > Id< / span > < / a >
< a href = "#initialized" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Property" > < use href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > initialized< / span > < / a >
< a href = "#parent" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Property" > < use href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > parent?< / span > < / a >
< / div > < / section > < section class = "tsd-index-section" > < h3 class = "tsd-index-heading" > Accessors< / h3 > < div class = "tsd-index-list" > < a href = "#position" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Accessor" > < use href = "../assets/icons.svg#icon-262144" > < / use > < / svg > < span > position< / span > < / a >
< a href = "#sanitizedclassname" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Accessor" > < use href = "../assets/icons.svg#icon-262144" > < / use > < / svg > < span > sanitized< wbr / > Class< wbr / > Name< / span > < / a >
< / div > < / section > < section class = "tsd-index-section" > < h3 class = "tsd-index-heading" > Methods< / h3 > < div class = "tsd-index-list" > < a href = "#callmethod" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Method" > < use href = "../assets/icons.svg#icon-2048" > < / use > < / svg > < span > call< wbr / > Method< / span > < / a >
< a href = "#child" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Method" > < use href = "../assets/icons.svg#icon-2048" > < / use > < / svg > < span > child< / span > < / a >
< a href = "#handleevent" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Method" > < use href = "../assets/icons.svg#icon-2048" > < / use > < / svg > < span > handle< wbr / > Event< / span > < / a >
< a href = "#handleeventinchildren" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Method" > < use href = "../assets/icons.svg#icon-2048" > < / use > < / svg > < span > handle< wbr / > Event< wbr / > In< wbr / > Children< / span > < / a >
< a href = "#setparent" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Method" > < use href = "../assets/icons.svg#icon-2048" > < / use > < / svg > < span > set< wbr / > Parent< / span > < / a >
< a href = "#triggercommand" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Method" > < use href = "../assets/icons.svg#icon-2048" > < / use > < / svg > < span > trigger< wbr / > Command< / span > < / a >
< a href = "#triggerevent" class = "tsd-index-link tsd-is-inherited" > < svg class = "tsd-kind-icon" viewBox = "0 0 24 24" aria-label = "Method" > < use href = "../assets/icons.svg#icon-2048" > < / use > < / svg > < span > trigger< wbr / > Event< / span > < / a >
2025-04-12 13:36:25 +03:00
< / div > < / section > < / div > < / details > < / section > < / section > < details class = "tsd-panel-group tsd-member-group tsd-accordion" open > < summary class = "tsd-accordion-summary" data-key = "section-Constructors" > < svg width = "20" height = "20" viewBox = "0 0 24 24" fill = "none" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-chevronDown" > < / use > < / svg > < h2 > Constructors< / h2 > < / summary > < section > < section class = "tsd-panel tsd-member" > < h3 class = "tsd-anchor-link" id = "constructor" > < span > constructor< / span > < a href = "#constructor" aria-label = "Permalink" class = "tsd-anchor-icon" > < svg viewBox = "0 0 24 24" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-anchor" > < / use > < / svg > < / a > < / h3 > < ul class = "tsd-signatures" > < li class = "" > < div class = "tsd-signature tsd-anchor-link" id = "constructordefault" > < span class = "tsd-signature-keyword" > new< / span > < span class = "tsd-kind-constructor-signature" > default< / span > < span class = "tsd-signature-symbol" > ()< / span > < span class = "tsd-signature-symbol" > :< / span > < a href = "" class = "tsd-signature-type tsd-kind-class" > default< / a > < a href = "#constructordefault" aria-label = "Permalink" class = "tsd-anchor-icon" > < svg viewBox = "0 0 24 24" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-anchor" > < / use > < / svg > < / a > < / div > < div class = "tsd-description" > < h4 class = "tsd-returns-title" > Returns < a href = "" class = "tsd-signature-type tsd-kind-class" > default< / a > < / h4 > < aside class = "tsd-sources" > < p > Inherited from < a href = "Frontend_Script_API._internal_.TypedComponent.html" > TypedComponent< / a > .< a href = "Frontend_Script_API._internal_.TypedComponent.html#constructor" > constructor< / a > < / p > < ul > < li > Defined in < a href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/components/component.ts#L23" > src/public/app/components/component.ts:23< / a > < / li > < / ul > < / aside > < / div > < / li > < / ul > < / section > < / section > < / details > < details class = "tsd-panel-group tsd-member-group tsd-accordion" open > < summary class = "tsd-accordion-summary" data-key = "section-Properties" > < svg width = "20" height = "20" viewBox = "0 0 24 24" fill = "none" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-chevronDown" > < / use > < / svg > < h2 > Properties< / h2 > < / summary > < section > < section class = "tsd-panel tsd-member tsd-is-inherited" > < h3 class = "tsd-anchor-link" id = "_position" > < span > _position< / span > < a href = "#_position" aria-label = "Permalink" class = "tsd-anchor-icon" > < svg viewBox = "0 0 24 24" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-anchor" > < / use > < / svg > < / a > < / h3 > < div class = "tsd-signature" > < span class = "tsd-kind-property" > _position< / span > < span class = "tsd-signature-symbol" > :< / span > < span class = "tsd-signature-type" > number< / span > < / div > < aside class = "tsd-sources" > < p > Inherited from < a href = "Frontend_Script_API._internal_.TypedComponent.html" > TypedComponent< / a > .< a href = "Frontend_Script_API._internal_.TypedComponent.html#_position" > _position< / a > < / p > < ul > < li > Defined in < a href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/components/component.ts#L21" > src/public/app/components/component.ts:21< / a > < / li > < / ul > < / aside > < / section > < section class = "tsd-panel tsd-member tsd-is-inherited" > < h3 class = "tsd-anchor-link" id = "widget" > < span > $widget< / span > < a href = "#widget" aria-label = "Permalink" class = "tsd-anchor-icon" > < svg viewBox = "0 0 24 24" aria-hidden = "true" > < use href = "../assets/icons.svg#icon-anchor" > < / use > < / svg > < / a > < / h3 > < div class = "tsd-signature" > < span class = "tsd-kind-property" > $widget< / span > < span class = "tsd-signature-symbol" > :< / span > < span class = "tsd-signature-type" > JQuery< / span > < span class = "tsd-signature-symbol" > < < / span > < span class = "tsd-signature-type" > HTMLElement< / span > < span class = "tsd-signature-symbol" > > < / span > < / div > < aside class = "tsd-sources" > < p > Inherited from < a href = "Frontend_Script_API._internal_.TypedComponent.html" > TypedComponent< / a > .< a href = "Frontend_Script_API._internal_.TypedComponent.html#widget" > $widget< / a > < / p > < ul > < li > Defined in < a href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/components/component.ts#L16" > src/public/app/components/component.ts:16< / a > < / li > < / ul > < / aside > < / section > < secti
