diff --git a/src/public/app/widgets/buttons/attachments_actions.js b/src/public/app/widgets/buttons/attachments_actions.js
index da8fd0d9a..5ee51b9d9 100644
--- a/src/public/app/widgets/buttons/attachments_actions.js
+++ b/src/public/app/widgets/buttons/attachments_actions.js
@@ -7,6 +7,7 @@ import ws from "../../services/ws.js";
 import appContext from "../../components/app_context.js";
 import openService from "../../services/open.js";
 import utils from "../../services/utils.js";
+import { Dropdown } from "bootstrap";
 
 const TPL = `
 <div class="dropdown attachment-actions">
@@ -91,7 +92,7 @@ export default class AttachmentActionsWidget extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
+        this.dropdown = Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
         this.$widget.on("click", ".dropdown-item", () => this.dropdown.toggle());
 
         this.$uploadNewRevisionInput = this.$widget.find(".attachment-upload-new-revision-input");
diff --git a/src/public/app/widgets/buttons/calendar.js b/src/public/app/widgets/buttons/calendar.js
index 6eb08c510..d7f2f7514 100644
--- a/src/public/app/widgets/buttons/calendar.js
+++ b/src/public/app/widgets/buttons/calendar.js
@@ -7,6 +7,7 @@ import appContext from "../../components/app_context.js";
 import RightDropdownButtonWidget from "./right_dropdown_button.js";
 import toastService from "../../services/toast.js";
 import options from "../../services/options.js";
+import { Dropdown } from "bootstrap";
 
 const MONTHS = [
     t("calendar.january"),
@@ -84,7 +85,7 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
             // Don't trigger dropdownShown() at widget level when the month selection dropdown is shown, since it would cause a redundant refresh.
             e.stopPropagation();
         });
-        this.monthDropdown = bootstrap.Dropdown.getOrCreateInstance(this.$monthSelect);
+        this.monthDropdown = Dropdown.getOrCreateInstance(this.$monthSelect);
         this.$dropdownContent.find('[data-calendar-input="month-list"] button').on("click", (e) => {
             this.date.setMonth(e.target.dataset.value);
             this.createMonth();
diff --git a/src/public/app/widgets/buttons/right_dropdown_button.js b/src/public/app/widgets/buttons/right_dropdown_button.js
index 822923d5a..1d405bf3b 100644
--- a/src/public/app/widgets/buttons/right_dropdown_button.js
+++ b/src/public/app/widgets/buttons/right_dropdown_button.js
@@ -1,4 +1,5 @@
 import BasicWidget from "../basic_widget.js";
+import { Tooltip, Dropdown } from "bootstrap";
 
 const TPL = `
 <div class="dropdown right-dropdown-widget dropend">
@@ -28,10 +29,10 @@ export default class RightDropdownButtonWidget extends BasicWidget {
     doRender() {
         this.$widget = $(TPL);
         this.$dropdownMenu = this.$widget.find(".dropdown-menu");
-        this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
+        this.dropdown = Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
 
         this.$tooltip = this.$widget.find(".tooltip-trigger").attr("title", this.title);
-        this.tooltip = new bootstrap.Tooltip(this.$tooltip, {
+        this.tooltip = new Tooltip(this.$tooltip, {
             placement: this.settings.titlePlacement,
             fallbackPlacements: [this.settings.titlePlacement]
         });
diff --git a/src/public/app/widgets/dialogs/branch_prefix.js b/src/public/app/widgets/dialogs/branch_prefix.js
index 9eaa440dc..0f0dcd02d 100644
--- a/src/public/app/widgets/dialogs/branch_prefix.js
+++ b/src/public/app/widgets/dialogs/branch_prefix.js
@@ -6,6 +6,7 @@ import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import appContext from "../../components/app_context.js";
 import { t } from "../../services/i18n.js";
+import { Modal } from "bootstrap";
 
 let branchId;
 
@@ -39,7 +40,7 @@ const TPL = `<div class="branch-prefix-dialog modal fade mx-auto" tabindex="-1"
 export default class BranchPrefixDialog extends BasicWidget {
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
         this.$form = this.$widget.find(".branch-prefix-form");
         this.$treePrefixInput = this.$widget.find(".branch-prefix-input");
         this.$noteTitle = this.$widget.find(".branch-prefix-note-title");
diff --git a/src/public/app/widgets/dialogs/import.js b/src/public/app/widgets/dialogs/import.js
index 11ca6d100..4f06208f5 100644
--- a/src/public/app/widgets/dialogs/import.js
+++ b/src/public/app/widgets/dialogs/import.js
@@ -4,6 +4,7 @@ import importService from "../../services/import.js";
 import options from "../../services/options.js";
 import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
+import { Modal, Tooltip } from "bootstrap";
 
 const TPL = `
 <div class="import-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -86,7 +87,7 @@ export default class ImportDialog extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        bootstrap.Modal.getOrCreateInstance(this.$widget);
+        Modal.getOrCreateInstance(this.$widget);
 
         this.$form = this.$widget.find(".import-form");
         this.$noteTitle = this.$widget.find(".import-note-title");
@@ -117,7 +118,7 @@ export default class ImportDialog extends BasicWidget {
         });
 
         let _ = [...this.$widget.find('[data-bs-toggle="tooltip"]')].forEach((element) => {
-            bootstrap.Tooltip.getOrCreateInstance(element, {
+            Tooltip.getOrCreateInstance(element, {
                 html: true
             });
         });
diff --git a/src/public/app/widgets/dialogs/include_note.js b/src/public/app/widgets/dialogs/include_note.js
index f3ff29714..94d813413 100644
--- a/src/public/app/widgets/dialogs/include_note.js
+++ b/src/public/app/widgets/dialogs/include_note.js
@@ -4,6 +4,7 @@ import noteAutocompleteService from "../../services/note_autocomplete.js";
 import utils from "../../services/utils.js";
 import froca from "../../services/froca.js";
 import BasicWidget from "../basic_widget.js";
+import { Modal } from "bootstrap";
 
 const TPL = `
 <div class="include-note-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -54,7 +55,7 @@ const TPL = `
 export default class IncludeNoteDialog extends BasicWidget {
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
         this.$form = this.$widget.find(".include-note-form");
         this.$autoComplete = this.$widget.find(".include-note-autocomplete");
         this.$form.on("submit", () => {
diff --git a/src/public/app/widgets/dialogs/info.js b/src/public/app/widgets/dialogs/info.js
index 655bc4bca..454f7e2ee 100644
--- a/src/public/app/widgets/dialogs/info.js
+++ b/src/public/app/widgets/dialogs/info.js
@@ -1,6 +1,7 @@
 import { t } from "../../services/i18n.js";
 import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
+import { Modal } from "bootstrap";
 
 const TPL = `
 <div class="info-dialog modal mx-auto" tabindex="-1" role="dialog" style="z-index: 2000;">
@@ -30,7 +31,7 @@ export default class InfoDialog extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
         this.$infoContent = this.$widget.find(".info-dialog-content");
         this.$okButton = this.$widget.find(".info-dialog-ok-button");
 
diff --git a/src/public/app/widgets/dialogs/jump_to_note.js b/src/public/app/widgets/dialogs/jump_to_note.js
index 4b2aceb51..f57acb4f7 100644
--- a/src/public/app/widgets/dialogs/jump_to_note.js
+++ b/src/public/app/widgets/dialogs/jump_to_note.js
@@ -4,6 +4,7 @@ import utils from "../../services/utils.js";
 import appContext from "../../components/app_context.js";
 import BasicWidget from "../basic_widget.js";
 import shortcutService from "../../services/shortcuts.js";
+import { Modal } from "bootstrap";
 
 const TPL = `<div class="jump-to-note-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
@@ -35,7 +36,7 @@ export default class JumpToNoteDialog extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
 
         this.$autoComplete = this.$widget.find(".jump-to-note-autocomplete");
         this.$results = this.$widget.find(".jump-to-note-results");
diff --git a/src/public/app/widgets/dialogs/markdown_import.js b/src/public/app/widgets/dialogs/markdown_import.js
index 26cdd20cd..1cd2fdd29 100644
--- a/src/public/app/widgets/dialogs/markdown_import.js
+++ b/src/public/app/widgets/dialogs/markdown_import.js
@@ -5,6 +5,7 @@ import appContext from "../../components/app_context.js";
 import BasicWidget from "../basic_widget.js";
 import shortcutService from "../../services/shortcuts.js";
 import server from "../../services/server.js";
+import { Modal } from "bootstrap";
 
 const TPL = `
 <div class="markdown-import-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -35,7 +36,7 @@ export default class MarkdownImportDialog extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
         this.$importTextarea = this.$widget.find(".markdown-import-textarea");
         this.$importButton = this.$widget.find(".markdown-import-button");
 
diff --git a/src/public/app/widgets/dialogs/protected_session_password.js b/src/public/app/widgets/dialogs/protected_session_password.js
index 8aabd1796..600a0f165 100644
--- a/src/public/app/widgets/dialogs/protected_session_password.js
+++ b/src/public/app/widgets/dialogs/protected_session_password.js
@@ -2,6 +2,7 @@ import { t } from "../../services/i18n.js";
 import protectedSessionService from "../../services/protected_session.js";
 import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
+import { Modal } from "bootstrap";
 
 const TPL = `
 <div class="protected-session-password-dialog modal mx-auto" data-backdrop="false" tabindex="-1" role="dialog">
@@ -28,7 +29,7 @@ const TPL = `
 export default class ProtectedSessionPasswordDialog extends BasicWidget {
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
 
         this.$passwordForm = this.$widget.find(".protected-session-password-form");
         this.$passwordInput = this.$widget.find(".protected-session-password");
diff --git a/src/public/app/widgets/dialogs/recent_changes.js b/src/public/app/widgets/dialogs/recent_changes.js
index 49a03b74a..0d3cd9803 100644
--- a/src/public/app/widgets/dialogs/recent_changes.js
+++ b/src/public/app/widgets/dialogs/recent_changes.js
@@ -10,6 +10,7 @@ import server from "../../services/server.js";
 import toastService from "../../services/toast.js";
 import utils from "../../services/utils.js";
 import ws from "../../services/ws.js";
+import { Modal } from "bootstrap";
 
 const TPL = `
 <div class="recent-changes-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -30,7 +31,7 @@ const TPL = `
 export default class RecentChangesDialog extends BasicWidget {
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
 
         this.$content = this.$widget.find(".recent-changes-content");
         this.$eraseDeletedNotesNow = this.$widget.find(".erase-deleted-notes-now-button");
diff --git a/src/public/app/widgets/dialogs/revisions.ts b/src/public/app/widgets/dialogs/revisions.ts
index 530195ed2..47eeb0dc6 100644
--- a/src/public/app/widgets/dialogs/revisions.ts
+++ b/src/public/app/widgets/dialogs/revisions.ts
@@ -11,6 +11,7 @@ import dialogService from "../../services/dialog.js";
 import options from "../../services/options.js";
 import type FNote from "../../entities/fnote.js";
 import type { NoteType } from "../../entities/fnote.js";
+import { Dropdown, Modal } from "bootstrap";
 
 const TPL = `
 <div class="revisions-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -101,9 +102,9 @@ export default class RevisionsDialog extends BasicWidget {
     private revisionId: string | null;
 
     //@ts-ignore
-    private modal: bootstrap.Modal;
+    private modal: Modal;
     //@ts-ignore
-    private listDropdown: bootstrap.Dropdown;
+    private listDropdown: Dropdown;
 
     private $list!: JQuery<HTMLElement>;
     private $listDropdown!: JQuery<HTMLElement>;
@@ -126,12 +127,12 @@ export default class RevisionsDialog extends BasicWidget {
     doRender() {
         this.$widget = $(TPL);
         //@ts-ignore
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
 
         this.$list = this.$widget.find(".revision-list");
         this.$listDropdown = this.$widget.find(".revision-list-dropdown");
         //@ts-ignore
-        this.listDropdown = bootstrap.Dropdown.getOrCreateInstance(this.$listDropdown, { autoClose: false });
+        this.listDropdown = Dropdown.getOrCreateInstance(this.$listDropdown, { autoClose: false });
         this.$content = this.$widget.find(".revision-content");
         this.$title = this.$widget.find(".revision-title");
         this.$titleButtons = this.$widget.find(".revision-title-buttons");
diff --git a/src/public/app/widgets/dialogs/upload_attachments.js b/src/public/app/widgets/dialogs/upload_attachments.js
index 008cb8c88..608bc1b45 100644
--- a/src/public/app/widgets/dialogs/upload_attachments.js
+++ b/src/public/app/widgets/dialogs/upload_attachments.js
@@ -4,6 +4,7 @@ import treeService from "../../services/tree.js";
 import importService from "../../services/import.js";
 import options from "../../services/options.js";
 import BasicWidget from "../basic_widget.js";
+import { Modal, Tooltip } from "bootstrap";
 
 const TPL = `
 <div class="upload-attachments-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -49,7 +50,7 @@ export default class UploadAttachmentsDialog extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        this.modal = bootstrap.Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget);
 
         this.$form = this.$widget.find(".upload-attachment-form");
         this.$noteTitle = this.$widget.find(".upload-attachment-note-title");
@@ -72,7 +73,7 @@ export default class UploadAttachmentsDialog extends BasicWidget {
             }
         });
 
-        bootstrap.Tooltip.getOrCreateInstance(this.$widget.find('[data-bs-toggle="tooltip"]'), {
+        Tooltip.getOrCreateInstance(this.$widget.find('[data-bs-toggle="tooltip"]'), {
             html: true
         });
     }
diff --git a/src/public/app/widgets/note_type.ts b/src/public/app/widgets/note_type.ts
index 9b3b90665..00033ab01 100644
--- a/src/public/app/widgets/note_type.ts
+++ b/src/public/app/widgets/note_type.ts
@@ -6,6 +6,7 @@ import { t } from "../services/i18n.js";
 import type FNote from "../entities/fnote.js";
 import type { NoteType } from "../entities/fnote.js";
 import type { EventData } from "../components/app_context.js";
+import { Dropdown } from "bootstrap";
 
 interface NoteTypeMapping {
     type: NoteType;
@@ -79,7 +80,7 @@ const TPL = `
 
 export default class NoteTypeWidget extends NoteContextAwareWidget {
 
-    private dropdown!: bootstrap.Dropdown;
+    private dropdown!: Dropdown;
     private $noteTypeDropdown!: JQuery<HTMLElement>;
     private $noteTypeButton!: JQuery<HTMLElement>;
     private $noteTypeDesc!: JQuery<HTMLElement>;
@@ -88,7 +89,7 @@ export default class NoteTypeWidget extends NoteContextAwareWidget {
         this.$widget = $(TPL);
 
         //@ts-ignore
-        this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
+        this.dropdown = Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
 
         this.$widget.on("show.bs.dropdown", () => this.renderDropdown());
 
diff --git a/src/public/app/widgets/quick_search.js b/src/public/app/widgets/quick_search.js
index fddf9b6af..2f456d355 100644
--- a/src/public/app/widgets/quick_search.js
+++ b/src/public/app/widgets/quick_search.js
@@ -6,6 +6,7 @@ import utils from "../services/utils.js";
 import appContext from "../components/app_context.js";
 import shortcutService from "../services/shortcuts.js";
 import { t } from "../services/i18n.js";
+import { Dropdown, Tooltip } from "bootstrap";
 
 const TPL = `
 <div class="quick-search input-group input-group-sm">
@@ -44,7 +45,7 @@ const MAX_DISPLAYED_NOTES = 15;
 export default class QuickSearchWidget extends BasicWidget {
     doRender() {
         this.$widget = $(TPL);
-        this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
+        this.dropdown = Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
 
         this.$searchString = this.$widget.find(".search-string");
         this.$dropdownMenu = this.$widget.find(".dropdown-menu");
@@ -100,7 +101,7 @@ export default class QuickSearchWidget extends BasicWidget {
         const { searchResultNoteIds, error } = await server.get(`quick-search/${encodeURIComponent(searchString)}`);
 
         if (error) {
-            let tooltip = new bootstrap.Tooltip(this.$searchString, {
+            let tooltip = new Tooltip(this.$searchString, {
                 trigger: "manual",
                 title: `Search error: ${error}`,
                 placement: "right"
diff --git a/src/public/app/widgets/ribbon_widgets/search_definition.js b/src/public/app/widgets/ribbon_widgets/search_definition.js
index 3ab077fa9..9f3bb5cb0 100644
--- a/src/public/app/widgets/ribbon_widgets/search_definition.js
+++ b/src/public/app/widgets/ribbon_widgets/search_definition.js
@@ -16,6 +16,7 @@ import Limit from "../search_options/limit.js";
 import Debug from "../search_options/debug.js";
 import appContext from "../../components/app_context.js";
 import bulkActionService from "../../services/bulk_action.js";
+import { Dropdown } from "bootstrap";
 
 const TPL = `
 <div class="search-definition-widget">
@@ -203,7 +204,7 @@ export default class SearchDefinitionWidget extends NoteContextAwareWidget {
         });
 
         this.$widget.on("click", "[data-action-add]", async (event) => {
-            bootstrap.Dropdown.getOrCreateInstance(this.$widget.find(".action-add-toggle"));
+            Dropdown.getOrCreateInstance(this.$widget.find(".action-add-toggle"));
 
             const actionName = $(event.target).attr("data-action-add");
 
diff --git a/src/public/app/widgets/search_options/search_string.js b/src/public/app/widgets/search_options/search_string.js
index 3d355ce17..6c841888b 100644
--- a/src/public/app/widgets/search_options/search_string.js
+++ b/src/public/app/widgets/search_options/search_string.js
@@ -4,6 +4,7 @@ import server from "../../services/server.js";
 import shortcutService from "../../services/shortcuts.js";
 import appContext from "../../components/app_context.js";
 import { t } from "../../services/i18n.js";
+import { Tooltip } from "bootstrap";
 
 const TPL = `
 <tr>
@@ -78,7 +79,7 @@ export default class SearchString extends AbstractSearchOption {
     }
 
     showSearchErrorEvent({ error }) {
-        let tooltip = new bootstrap.Tooltip(this.$searchString, {
+        let tooltip = new Tooltip(this.$searchString, {
             trigger: "manual",
             title: `${t("search_string.error", { error })}`,
             placement: "bottom"
diff --git a/src/public/app/widgets/sync_status.js b/src/public/app/widgets/sync_status.js
index df13c8716..d17b7ae17 100644
--- a/src/public/app/widgets/sync_status.js
+++ b/src/public/app/widgets/sync_status.js
@@ -4,6 +4,7 @@ import ws from "../services/ws.js";
 import options from "../services/options.js";
 import syncService from "../services/sync.js";
 import { escapeQuotes } from "../services/utils.js";
+import { Tooltip } from "bootstrap";
 
 const TPL = `
 <div class="sync-status-widget launcher-button">
@@ -96,7 +97,7 @@ export default class SyncStatusWidget extends BasicWidget {
             return;
         }
 
-        bootstrap.Tooltip.getOrCreateInstance(this.$widget.find(`.sync-status-${className}`), {
+        Tooltip.getOrCreateInstance(this.$widget.find(`.sync-status-${className}`), {
             html: true,
             placement: this.settings.titlePlacement,
             fallbackPlacements: [this.settings.titlePlacement]