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 > AddToToolbarOpts | 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" > AddToToolbarOpts< / a > < / li > < / ul > < h1 > Interface AddToToolbarOpts< / h1 > < / div > < section  class = "tsd-panel tsd-comment" > < div  class = "tsd-comment tsd-typography" > < p > An instance of the frontend api available globally.< / p >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< / div > < div  class = "tsd-comment tsd-typography" > < div  class = "tsd-tag-global" > < h4  class = "tsd-anchor-link"  id = "global" > Global< a  href = "#global"  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 > < / h4 > < / div > < div  class = "tsd-tag-var" > < h4  class = "tsd-anchor-link"  id = "var" > Var< a  href = "#var"  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 > < / h4 > < p > api< / p >  
						 
					
						
							
								
									
										
										
										
											2025-04-12 13:36:25 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
								
									
										 
							
							
								< / div > < / div > < / section > < div  class = "tsd-signature" > < span  class = "tsd-signature-keyword" > interface< / span >  < span  class = "tsd-kind-interface" > AddToToolbarOpts< / span >  < span  class = "tsd-signature-symbol" > {< / span > < br / >         < a  class = "tsd-kind-property"  href = "#action" > action< / a > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-symbol" > ()< / span >  < span  class = "tsd-signature-symbol" > => < / span >  < span  class = "tsd-signature-type" > void< / span > < span  class = "tsd-signature-symbol" > ;< / span > < br / >         < a  class = "tsd-kind-property"  href = "#icon" > icon< / a > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < span  class = "tsd-signature-symbol" > ;< / span > < br / >         < a  class = "tsd-kind-property"  href = "#id" > id< / a > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < span  class = "tsd-signature-symbol" > ;< / span > < br / >         < a  class = "tsd-kind-property"  href = "#shortcut" > shortcut< / a > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < span  class = "tsd-signature-symbol" > ;< / span > < br / >         < a  class = "tsd-kind-property"  href = "#title" > title< / a > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < span  class = "tsd-signature-symbol" > ;< / span > < br / > < span  class = "tsd-signature-symbol" > }< / span > < / div > < aside  class = "tsd-sources" > < ul > < li > Defined in < a  href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/services/frontend_script_api.ts#L36" > src/public/app/services/frontend_script_api.ts:36< / 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" > Properties< / h3 > < div  class = "tsd-index-list" > < a  href = "#action"  class = "tsd-index-link" > < svg  class = "tsd-kind-icon"  viewBox = "0 0 24 24"  aria-label = "Property" > < use  href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > action< / span > < / a >  
						 
					
						
							
								
									
										
										
										
											2025-04-12 13:30:24 +03:00 
										
									 
								 
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< a  href = "#icon"  class = "tsd-index-link" > < svg  class = "tsd-kind-icon"  viewBox = "0 0 24 24"  aria-label = "Property" > < use  href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > icon< / span > < / a >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< a  href = "#id"  class = "tsd-index-link" > < svg  class = "tsd-kind-icon"  viewBox = "0 0 24 24"  aria-label = "Property" > < use  href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > id< / span > < / a >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< a  href = "#shortcut"  class = "tsd-index-link" > < svg  class = "tsd-kind-icon"  viewBox = "0 0 24 24"  aria-label = "Property" > < use  href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > shortcut< / span > < / a >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< a  href = "#title"  class = "tsd-index-link" > < svg  class = "tsd-kind-icon"  viewBox = "0 0 24 24"  aria-label = "Property" > < use  href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > title< / span > < / a >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< / 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-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" > < h3  class = "tsd-anchor-link"  id = "action" > < span > action< / span > < a  href = "#action"  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" > action< / span > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-symbol" > ()< / span >  < span  class = "tsd-signature-symbol" > => < / span >  < span  class = "tsd-signature-type" > void< / span > < / div > < div  class = "tsd-comment tsd-typography" > < p > callback handling the click on the button< / p >  
						 
					
						
							
								
									
										
										
										
											2025-04-12 13:36:25 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
								
									
								 
							
							
								< / div > < div  class = "tsd-comment tsd-typography" > < / div > < aside  class = "tsd-sources" > < ul > < li > Defined in < a  href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/services/frontend_script_api.ts#L39" > src/public/app/services/frontend_script_api.ts:39< / a > < / li > < / ul > < / aside > < / section > < section  class = "tsd-panel tsd-member" > < h3  class = "tsd-anchor-link"  id = "icon" > < span > icon< / span > < a  href = "#icon"  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" > icon< / span > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < / div > < div  class = "tsd-comment tsd-typography" > < p > name of the boxicon to be used (e.g. " time"  for " bx-time"  icon)< / p >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< / div > < div  class = "tsd-comment tsd-typography" > < / div > < aside  class = "tsd-sources" > < ul > < li > Defined in < a  href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/services/frontend_script_api.ts#L44" > src/public/app/services/frontend_script_api.ts:44< / a > < / li > < / ul > < / aside > < / section > < section  class = "tsd-panel tsd-member" > < h3  class = "tsd-anchor-link"  id = "id" > < span > id< / span > < a  href = "#id"  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" > id< / span > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < / div > < div  class = "tsd-comment tsd-typography" > < p > id of the button, used to identify the old instances of this button to be replaced 
						 
					
						
							
								
									
										
										
										
											2025-04-12 13:30:24 +03:00 
										
									 
								 
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								ID is optional because of BC, but not specifying it is deprecated. ID can be alphanumeric only.< / p > 
							 
						 
					
						
							
								
									
										
										
										
											2025-04-12 13:36:25 +03:00 
										
									 
								 
							 
							
								
									
										 
								
							 
							
								 
							
								
									
								 
							
							
								< / div > < div  class = "tsd-comment tsd-typography" > < / div > < aside  class = "tsd-sources" > < ul > < li > Defined in < a  href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/services/frontend_script_api.ts#L42" > src/public/app/services/frontend_script_api.ts:42< / a > < / li > < / ul > < / aside > < / section > < section  class = "tsd-panel tsd-member" > < h3  class = "tsd-anchor-link"  id = "shortcut" > < span > shortcut< / span > < a  href = "#shortcut"  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" > shortcut< / span > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < / div > < div  class = "tsd-comment tsd-typography" > < p > keyboard shortcut for the button, e.g. " alt+t" < / p >  
						 
					
						
							
								
							 
							
								
							 
							
								 
							
								
									
								 
							
							
								< / div > < div  class = "tsd-comment tsd-typography" > < / div > < aside  class = "tsd-sources" > < ul > < li > Defined in < a  href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/services/frontend_script_api.ts#L46" > src/public/app/services/frontend_script_api.ts:46< / a > < / li > < / ul > < / aside > < / section > < section  class = "tsd-panel tsd-member" > < h3  class = "tsd-anchor-link"  id = "title" > < span > title< / span > < a  href = "#title"  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" > title< / span > < span  class = "tsd-signature-symbol" > :< / span >  < span  class = "tsd-signature-type" > string< / span > < / div > < aside  class = "tsd-sources" > < ul > < li > Defined in < a  href = "https://github.com/TriliumNext/Notes/blob/84883a6e267a4cfd7d26a14ec43a31d53c76e99b/src/public/app/services/frontend_script_api.ts#L37" > src/public/app/services/frontend_script_api.ts:37< / a > < / li > < / ul > < / aside > < / section > < / section > < / details > < / div > < div  class = "col-sidebar" > < div  class = "page-menu" > < div  class = "tsd-navigation settings" > < details  class = "tsd-accordion" > < summary  class = "tsd-accordion-summary" > < svg  width = "20"  height = "20"  viewBox = "0 0 24 24"  fill = "none"  aria-hidden = "true" > < use  href = "../assets/icons.svg#icon-chevronDown" > < / use > < / svg > < h3 > Settings< / h3 > < / summary > < div  class = "tsd-accordion-details" > < div  class = "tsd-filter-visibility" > < span  class = "settings-label" > Member Visibility< / span > < ul  id = "tsd-filter-options" > < li  class = "tsd-filter-item" > < label  class = "tsd-filter-input" > < input  type = "checkbox"  id = "tsd-filter-protected"  name = "protected" / > < svg  width = "32"  height = "32"  viewBox = "0 0 32 32"  aria-hidden = "true" > < rect  class = "tsd-checkbox-background"  width = "30"  height = "30"  x = "1"  y = "1"  rx = "6"  fill = "none" > < / rect > < path  class = "tsd-checkbox-checkmark"  d = "M8.35422 16.8214L13.2143 21.75L24.6458 10.25"  stroke = "none"  stroke-width = "3.5"  stroke-linejoin = "round"  fill = "none" > < / path > < / svg > < span > Protected< / span > < / label > < / li > < li  class = "tsd-filter-item" > < label  class = "tsd-filter-input" > < input  type = "checkbox"  id = "tsd-filter-inherited"  name = "inherited"  checked / > < svg  width = "32"  height = "32"  viewBox = "0 0 32 32"  aria-hidden = "true" > < rect  class = "tsd-checkbox-background"  width = "30"  height = "30"  x = "1"  y = "1"  rx = "6"  fill = "none" > < / rect > < path  class = "tsd-checkbox-checkmark"  d = "M8.35422 16.8214L13.2143 21.75L24.6458 10.25"  stroke = "none"  stroke-width = "3.5"  stroke-linejoin = "round"  fill = "none" > < / path > < / svg > < span > Inherited< / span > < / label > < / li > < li  class = "tsd-filter-item" > < label  class = "tsd-filter-input" > < input  type = "checkbox"  id = "tsd-filter-external"  name = "external" / > < svg  width = "32"  height = "32"  viewBox = "0 0 32 32"  aria-hidden = "true" > < rect  class = "tsd-checkbox-background"  width = "30"  height = "30"  x = "1"  y = "1"  rx = "6"  fill = "none" > < / rect > < path  class = "tsd-checkbox-checkmark"  d = "M8.35422 16.8214L13.2143 21.75L24.6458 10.25"  stroke = "none"  stroke-width = "3.5"  stroke-linejoin = "round"  fill = "none" > < / path > < / svg > < span > External< / span > < / label > < / li > < / ul > < / div > < div  class = "tsd-theme-toggle" > < label  class = "settings-label"  for = "tsd-theme" > Theme< / label > < select  id = "tsd-theme" > < option  value = "os" > OS< / option > < option  value = "light" > Light< / option > < option  value = "dark" > Dark< / option > < / select > < / div > < / div > < / details > < / div > < details  open  class = "tsd-accordion tsd-page-navigation" > < summary  class = "tsd-accordion-summary" > < svg  width = "20"  height = "20"  viewBox = "0 0 24 24"  fill = "none"  aria-hidden = "true" > < use  href = "../assets/icons.svg#icon-chevronDown" > < / use > < / svg > < h3 > On This Page< / h3 > < / summary > < div  class = "tsd-accordion-details" > < details  open  class = "tsd-accordion tsd-page-navigation-section" > < 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 > Properties< / summary > < div > < a  href = "#action" > < svg  class = "tsd-kind-icon"  viewBox = "0 0 24 24"  aria-label = "Property" > < use  href = "../assets/icons.svg#icon-1024" > < / use > < / svg > < span > action< / span > < / a > < a  href = "#icon" > < svg  class = "tsd-kind-icon"  viewBox =