refactor(dev): use es6-string-html for templates

src/public/app/widgets/api_log.ts

@@ -3,7 +3,7 @@ import type FNote from "../entities/fnote.js";
 import { t } from "../services/i18n.js";
 import NoteContextAwareWidget from "./note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="api-log-widget">
     <style>
     .api-log-widget {

src/public/app/widgets/attachment_detail.ts

@@ -10,7 +10,7 @@ import toastService from "../services/toast.js";
 import type FAttachment from "../entities/fattachment.js";
 import type { EventData } from "../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="attachment-detail-widget">
     <style>
         .attachment-detail-widget {

src/public/app/widgets/attribute_widgets/attribute_detail.ts

@@ -12,7 +12,7 @@ import shortcutService from "../../services/shortcuts.js";
 import appContext from "../../components/app_context.js";
 import type { Attribute } from "../../services/attribute_parser.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="attr-detail tn-tool-dialog">
     <style>
         .attr-detail {

src/public/app/widgets/attribute_widgets/attribute_editor.ts

@@ -24,7 +24,7 @@ const HELP_TEXT = `
 
 <p>${t("attribute_editor.help_text_body3")}</p>`;
 
-const TPL = `
+const TPL = /*html*/`
 <div style="position: relative; padding-top: 10px; padding-bottom: 10px">
     <style>
     .attribute-list-editor {

src/public/app/widgets/bulk_actions/execute_script.ts

@@ -2,7 +2,7 @@ import { t } from "../../services/i18n.js";
 import SpacedUpdate from "../../services/spaced_update.js";
 import AbstractBulkAction from "./abstract_bulk_action.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td>
         ${t("execute_script.execute_script")}

src/public/app/widgets/bulk_actions/label/add_label.ts

@@ -2,7 +2,7 @@ import { t } from "../../../services/i18n.js";
 import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/bulk_actions/label/delete_label.ts

@@ -2,7 +2,7 @@ import { t } from "../../../services/i18n.js";
 import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td>
         ${t("delete_label.delete_label")}

src/public/app/widgets/bulk_actions/label/rename_label.ts

@@ -2,7 +2,7 @@ import { t } from "../../../services/i18n.js";
 import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/bulk_actions/label/update_label_value.ts

@@ -2,7 +2,7 @@ import { t } from "../../../services/i18n.js";
 import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/bulk_actions/note/delete_note.ts

@@ -1,7 +1,7 @@
 import { t } from "../../../services/i18n.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <span class="bx bx-trash"></span>

src/public/app/widgets/bulk_actions/note/delete_revisions.ts

@@ -1,7 +1,7 @@
 import { t } from "../../../services/i18n.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <span class="bx bx-trash"></span>

src/public/app/widgets/bulk_actions/note/move_note.ts

@@ -3,7 +3,7 @@ import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 import noteAutocompleteService from "../../../services/note_autocomplete.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/bulk_actions/note/rename_note.ts

@@ -2,7 +2,7 @@ import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 import { t } from "../../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/bulk_actions/relation/add_relation.ts

@@ -3,7 +3,7 @@ import AbstractBulkAction from "../abstract_bulk_action.js";
 import noteAutocompleteService from "../../../services/note_autocomplete.js";
 import { t } from "../../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/bulk_actions/relation/delete_relation.ts

@@ -2,7 +2,7 @@ import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 import { t } from "../../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td>
         ${t("delete_relation.delete_relation")}

src/public/app/widgets/bulk_actions/relation/rename_relation.ts

@@ -2,7 +2,7 @@ import SpacedUpdate from "../../../services/spaced_update.js";
 import AbstractBulkAction from "../abstract_bulk_action.js";
 import { t } from "../../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/bulk_actions/relation/update_relation_target.ts

@@ -3,7 +3,7 @@ import AbstractBulkAction from "../abstract_bulk_action.js";
 import noteAutocompleteService from "../../../services/note_autocomplete.js";
 import { t } from "../../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center">

src/public/app/widgets/buttons/abstract_button.ts

@@ -1,7 +1,7 @@
 import { Tooltip } from "bootstrap";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `<button class="button-widget bx"
+const TPL = /*html*/`<button class="button-widget bx"
       data-bs-toggle="tooltip"
       title=""></button>`;
 

src/public/app/widgets/buttons/attachments_actions.ts

@@ -12,7 +12,7 @@ import type attachmentsApiRoute from "../../../../routes/api/attachments.js";
 import type FAttachment from "../../entities/fattachment.js";
 import type AttachmentDetailWidget from "../attachment_detail.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="dropdown attachment-actions">
     <style>
     .attachment-actions {

src/public/app/widgets/buttons/global_menu.ts

@@ -5,7 +5,7 @@ import UpdateAvailableWidget from "./update_available.js";
 import options from "../../services/options.js";
 import { Tooltip, Dropdown } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="dropdown global-menu">
     <style>
     .global-menu {

src/public/app/widgets/buttons/note_actions.ts

@@ -15,7 +15,7 @@ interface ConvertToAttachmentResponse {
     attachment: FAttachmentRow;
 }
 
-const TPL = `
+const TPL = /*html*/`
 <div class="dropdown note-actions">
     <style>
         .note-actions {

src/public/app/widgets/buttons/right_dropdown_button.ts

@@ -2,7 +2,7 @@ import BasicWidget from "../basic_widget.js";
 import { Tooltip, Dropdown } from "bootstrap";
 type PopoverPlacement = Tooltip.PopoverPlacement;
 
-const TPL = `
+const TPL = /*html*/`
 <div class="dropdown right-dropdown-widget dropend">
     <button type="button" data-bs-toggle="dropdown"
             aria-haspopup="true" aria-expanded="false"

src/public/app/widgets/buttons/update_available.ts

@@ -2,7 +2,7 @@ import { t } from "../../services/i18n.js";
 import BasicWidget from "../basic_widget.js";
 import utils from "../../services/utils.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div style="display: none;">
     <style>
         .global-menu-button-update-available-button {

src/public/app/widgets/close_zen_button.ts

@@ -1,7 +1,7 @@
 import BasicWidget from "./basic_widget.js";
 import { t } from "../services/i18n.js";
 
-const TPL = `\
+const TPL = /*html*/`\
 <div class="close-zen-container">
     <button class="button-widget bx icon-action bxs-yin-yang"
         data-trigger-command="toggleZenMode"

src/public/app/widgets/containers/ribbon_container.ts

@@ -7,7 +7,7 @@ import type { NoteType } from "../../entities/fnote.js";
 import type { EventData, EventNames } from "../../components/app_context.js";
 import type NoteActionsWidget from "../buttons/note_actions.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="ribbon-container">
     <style>
     .ribbon-container {

src/public/app/widgets/dialogs/about.ts

@@ -14,7 +14,7 @@ interface AppInfo {
     dataDirectory: string;
 }
 
-const TPL = `
+const TPL = /*html*/`
 <div class="about-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/add_link.ts

@@ -7,7 +7,7 @@ import type { Suggestion } from "../../services/note_autocomplete.js";
 import type { default as TextTypeWidget } from "../type_widgets/editable_text.js";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="add-link-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" style="max-width: 1000px" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/branch_prefix.ts

@@ -8,7 +8,7 @@ import appContext from "../../components/app_context.js";
 import { t } from "../../services/i18n.js";
 import { Modal } from "bootstrap";
 
-const TPL = `<div class="branch-prefix-dialog modal fade mx-auto" tabindex="-1" role="dialog">
+const TPL = /*html*/`<div class="branch-prefix-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <form class="branch-prefix-form">
             <div class="modal-content">

src/public/app/widgets/dialogs/bulk_actions.ts

@@ -8,7 +8,7 @@ import { t } from "../../services/i18n.js";
 import type { EventData } from "../../components/app_context.js";
 
 
-const TPL = `
+const TPL = /*html*/`
 <div class="bulk-actions-dialog modal mx-auto" tabindex="-1" role="dialog">
     <style>
         .bulk-actions-dialog .modal-body h4:not(:first-child) {

src/public/app/widgets/dialogs/clone_to.ts

@@ -10,7 +10,7 @@ import { t } from "../../services/i18n.js";
 import type { EventData } from "../../components/app_context.js";
 
 
-const TPL = `
+const TPL = /*html*/`
 <div class="clone-to-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" style="max-width: 1000px" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/confirm.ts

@@ -4,7 +4,7 @@ import { Modal } from "bootstrap";
 
 const DELETE_NOTE_BUTTON_CLASS = "confirm-dialog-delete-note";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="confirm-dialog modal mx-auto" tabindex="-1" role="dialog" style="z-index: 2000;">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/delete_notes.ts

@@ -24,7 +24,7 @@ interface ShowDeleteNotesDialogOpts {
     forceDeleteAllClones: boolean;
 }
 
-const TPL = `
+const TPL = /*html*/`
 <div class="delete-notes-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-dialog-scrollable modal-xl" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/export.ts

@@ -9,7 +9,7 @@ import { t } from "../../services/i18n.js";
 import type { EventData } from "../../components/app_context.js";
 import { Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="export-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <style>
     .export-dialog .export-form .form-check {

src/public/app/widgets/dialogs/help.ts

@@ -2,7 +2,7 @@ import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="help-dialog modal use-tn-links" tabindex="-1" role="dialog">
     <div class="modal-dialog" role="document" style="min-width: 90%;">
         <div class="modal-content" style="height: auto;">

src/public/app/widgets/dialogs/import.ts

@@ -7,7 +7,7 @@ import { t } from "../../services/i18n.js";
 import { Modal, Tooltip } from "bootstrap";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="import-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/include_note.ts

@@ -8,7 +8,7 @@ import { Modal } from "bootstrap";
 import type { EventData } from "../../components/app_context.js";
 import type EditableTextTypeWidget from "../type_widgets/editable_text.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="include-note-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/info.ts

@@ -5,7 +5,7 @@ import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 import type { ConfirmDialogCallback } from "./confirm.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="info-dialog modal mx-auto" tabindex="-1" role="dialog" style="z-index: 2000;">
     <div class="modal-dialog" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/jump_to_note.ts

@@ -6,7 +6,7 @@ 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">
+const TPL = /*html*/`<div class="jump-to-note-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/public/app/widgets/dialogs/markdown_import.ts

@@ -7,7 +7,7 @@ import shortcutService from "../../services/shortcuts.js";
 import server from "../../services/server.js";
 import { Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="markdown-import-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/move_to.ts

@@ -8,7 +8,7 @@ import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="move-to-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" style="max-width: 1000px" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/note_type_chooser.ts

@@ -5,7 +5,7 @@ import noteTypesService from "../../services/note_types.js";
 import BasicWidget from "../basic_widget.js";
 import { Dropdown, Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-type-chooser-dialog modal mx-auto" tabindex="-1" role="dialog">
     <style>
         .note-type-chooser-dialog {

src/public/app/widgets/dialogs/password_not_set.ts

@@ -3,7 +3,7 @@ import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="password-not-set-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-md" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/prompt.ts

@@ -3,7 +3,7 @@ import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="prompt-dialog modal mx-auto" tabindex="-1" role="dialog" style="z-index: 2000;">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/protected_session_password.ts

@@ -4,7 +4,7 @@ import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="protected-session-password-dialog modal mx-auto" data-backdrop="false" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-md" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/recent_changes.ts

@@ -12,7 +12,7 @@ import utils from "../../services/utils.js";
 import ws from "../../services/ws.js";
 import { Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="recent-changes-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
         <div class="modal-content">

src/public/app/widgets/dialogs/revisions.ts

@@ -13,7 +13,7 @@ import type FNote from "../../entities/fnote.js";
 import type { NoteType } from "../../entities/fnote.js";
 import { Dropdown, Modal } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="revisions-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <style>
         .revisions-dialog .revision-content-wrapper {

src/public/app/widgets/dialogs/sort_child_notes.ts

@@ -4,7 +4,7 @@ import server from "../../services/server.js";
 import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 
-const TPL = `<div class="sort-child-notes-dialog modal mx-auto" tabindex="-1" role="dialog">
+const TPL = /*html*/`<div class="sort-child-notes-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" style="max-width: 500px" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/public/app/widgets/dialogs/upload_attachments.ts

@@ -7,7 +7,7 @@ import BasicWidget from "../basic_widget.js";
 import { Modal, Tooltip } from "bootstrap";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="upload-attachments-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">

src/public/app/widgets/editability_select.ts

@@ -7,7 +7,7 @@ import { Dropdown } from "bootstrap";
 
 type Editability = "auto" | "readOnly" | "autoReadOnlyDisabled";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="dropdown editability-select-widget">
     <style>
     .editability-dropdown {

src/public/app/widgets/find.ts

@@ -22,7 +22,7 @@ export interface FindResult {
 // tabIndex=-1 on the checkbox labels is necessary, so when clicking on the label,
 // the focusout handler is called with relatedTarget equal to the label instead
 // of undefined. It's -1 instead of > 0, so they don't tabstop
-const TPL = `
+const TPL = /*html*/`
 <div class='find-replace-widget' style="contain: none; border-top: 1px solid var(--main-border-color);">
     <style>
         .find-widget-box, .replace-widget-box {

src/public/app/widgets/floating_buttons/code_buttons.ts

@@ -8,7 +8,7 @@ import NoteContextAwareWidget from "../note_context_aware_widget.js";
 import keyboardActionService from "../../services/keyboard_actions.js";
 import type FNote from "../../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="code-buttons-widget">
     <style>
         .code-buttons-widget {

src/public/app/widgets/floating_buttons/copy_image_reference_button.ts

@@ -3,7 +3,7 @@ import NoteContextAwareWidget from "../note_context_aware_widget.js";
 import utils from "../../services/utils.js";
 import imageService from "../../services/image.js";
 
-const TPL = `
+const TPL = /*html*/`
 <button type="button"
         class="copy-image-reference-button"
         title="${t("copy_image_reference_button.button_title")}">

src/public/app/widgets/floating_buttons/floating_buttons.ts

@@ -11,7 +11,7 @@ import type BasicWidget from "../basic_widget.js";
  * properly handle rounded corners, as defined by the --border-radius CSS variable.
  */
 
-const TPL = `
+const TPL = /*html*/`
 <div class="floating-buttons no-print">
     <style>
         .floating-buttons {

src/public/app/widgets/floating_buttons/geo_map_button.ts

@@ -1,7 +1,7 @@
 import { t } from "../../services/i18n.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `\
+const TPL = /*html*/`\
 <div class="geo-map-buttons">
     <style>
         .geo-map-buttons {

src/public/app/widgets/floating_buttons/help_button.ts

@@ -6,7 +6,7 @@ import type { ViewScope } from "../../services/link.js";
 import type { ViewTypeOptions } from "../../services/note_list_renderer.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <button class="open-contextual-help-button" title="${t("help-button.title")}">
     <span class="bx bx-help-circle"></span>
 </button>

src/public/app/widgets/floating_buttons/hide_floating_buttons_button.ts

@@ -1,7 +1,7 @@
 import { t } from "../../services/i18n.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="close-floating-buttons">
     <style>
         .close-floating-buttons {

src/public/app/widgets/floating_buttons/png_export_button.ts

@@ -1,7 +1,7 @@
 import { t } from "../../services/i18n.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <button type="button"
         class="export-svg-button"
         title="${t("png_export_button.button_title")}">

src/public/app/widgets/floating_buttons/relation_map_buttons.ts

@@ -1,7 +1,7 @@
 import { t } from "../../services/i18n.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="relation-map-buttons">
     <style>
         .relation-map-buttons {

src/public/app/widgets/floating_buttons/svg_export_button.ts

@@ -1,7 +1,7 @@
 import { t } from "../../services/i18n.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <button type="button"
         class="export-svg-button"
         title="${t("svg_export_button.button_title")}">

src/public/app/widgets/floating_buttons/switch_layout_button.ts

@@ -3,7 +3,7 @@ import { t } from "../../services/i18n.js";
 import options from "../../services/options.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <button type="button"
     class="switch-layout-button">
     <span class="bx"></span>

src/public/app/widgets/floating_buttons/zpetne_odkazy.ts

@@ -9,7 +9,7 @@ import server from "../../services/server.js";
 import froca from "../../services/froca.js";
 import type FNote from "../../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="backlinks-widget has-overflow">
     <style>
         .backlinks-widget {

src/public/app/widgets/geo_map.ts

@@ -3,7 +3,7 @@ import L from "leaflet";
 import "leaflet/dist/leaflet.css";
 import NoteContextAwareWidget from "./note_context_aware_widget.js";
 
-const TPL = `\
+const TPL = /*html*/`\
 <div class="geo-map-widget">
     <style>
         .note-detail-geo-map,

src/public/app/widgets/highlights_list.ts

@@ -14,7 +14,7 @@ import appContext, { type EventData } from "../components/app_context.js";
 import libraryLoader from "../services/library_loader.js";
 import type FNote from "../entities/fnote.js";
 
-const TPL = `<div class="highlights-list-widget">
+const TPL = /*html*/`<div class="highlights-list-widget">
     <style>
         .highlights-list-widget {
             padding: 10px;

src/public/app/widgets/mobile_widgets/mobile_detail_menu.ts

@@ -6,7 +6,7 @@ import branchService from "../../services/branches.js";
 import treeService from "../../services/tree.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `<button type="button" class="action-button bx"></button>`;
+const TPL = /*html*/`<button type="button" class="action-button bx"></button>`;
 
 class MobileDetailMenuWidget extends BasicWidget {
     private isHorizontalLayout: boolean;

src/public/app/widgets/mobile_widgets/toggle_sidebar_button.ts

@@ -1,6 +1,6 @@
 import BasicWidget from "../basic_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <button type="button" class="action-button bx bx-sidebar"></button>`;
 
 class ToggleSidebarButtonWidget extends BasicWidget {

src/public/app/widgets/note_detail.ts

@@ -37,7 +37,7 @@ import type { NoteType } from "../entities/fnote.js";
 import type TypeWidget from "./type_widgets/type_widget.js";
 import { MermaidTypeWidget } from "./type_widgets/mermaid.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-detail">
     <style>
     .note-detail {

src/public/app/widgets/note_icon.ts

@@ -7,7 +7,7 @@ import type { EventData } from "../components/app_context.js";
 import type { Icon } from "./icon_list.js";
 import { Dropdown } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-icon-widget dropdown">
     <style>
     .note-icon-widget {

src/public/app/widgets/note_language.ts

@@ -9,7 +9,7 @@ import type { Locale } from "../../../services/i18n.js";
 import options from "../services/options.js";
 import appContext from "../components/app_context.js";
 
-const TPL = `\
+const TPL = /*html*/`\
 <div class="dropdown note-language-widget">
     <button type="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-sm dropdown-toggle select-button note-language-button">
         <span class="note-language-desc"></span>

src/public/app/widgets/note_list.ts

@@ -4,7 +4,7 @@ import type FNote from "../entities/fnote.js";
 import type { EventData } from "../components/app_context.js";
 import type ViewMode from "./view_widgets/view_mode.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-list-widget">
     <style>
     .note-list-widget {

src/public/app/widgets/note_map.ts

@@ -12,7 +12,7 @@ import type FNote from "../entities/fnote.js";
 
 const esc = utils.escapeHtml;
 
-const TPL = `<div class="note-map-widget">
+const TPL = /*html*/`<div class="note-map-widget">
     <style>
         .note-detail-note-map {
             height: 100%;

src/public/app/widgets/note_title.ts

@@ -9,7 +9,7 @@ import shortcutService from "../services/shortcuts.js";
 import utils from "../services/utils.js";
 import type FNote from "../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-title-widget">
     <style>
     .note-title-widget {

src/public/app/widgets/note_tree.ts

@@ -26,7 +26,7 @@ import type { NoteType } from "../entities/fnote.js";
 import type { AttributeRow, BranchRow } from "../services/load_results.js";
 import type { SetNoteOpts } from "../components/note_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="tree-wrapper">
     <style>
     .tree-wrapper {

src/public/app/widgets/note_type.ts

@@ -54,7 +54,7 @@ const NOTE_TYPES: NoteTypeMapping[] = [
 
 const NOT_SELECTABLE_NOTE_TYPES = NOTE_TYPES.filter((nt) => !nt.selectable).map((nt) => nt.type);
 
-const TPL = `
+const TPL = /*html*/`
 <div class="dropdown note-type-widget">
     <style>
         .note-type-dropdown {

src/public/app/widgets/quick_search.ts

@@ -8,7 +8,7 @@ import shortcutService from "../services/shortcuts.js";
 import { t } from "../services/i18n.js";
 import { Dropdown, Tooltip } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="quick-search input-group input-group-sm">
   <style>
     .quick-search {

src/public/app/widgets/ribbon_widgets/basic_properties.ts

@@ -9,7 +9,7 @@ import TemplateSwitchWidget from "../template_switch.js";
 import type FNote from "../../entities/fnote.js";
 import NoteLanguageWidget from "../note_language.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="basic-properties-widget">
     <style>
         .basic-properties-widget {

src/public/app/widgets/ribbon_widgets/book_properties.ts

@@ -4,7 +4,7 @@ import { t } from "../../services/i18n.js";
 import type FNote from "../../entities/fnote.js";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="book-properties-widget">
     <style>
         .book-properties-widget {

src/public/app/widgets/ribbon_widgets/classic_editor_toolbar.ts

@@ -3,7 +3,7 @@ import options from "../../services/options.js";
 import utils from "../../services/utils.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `\
+const TPL = /*html*/`\
 <div class="classic-toolbar-widget"></div>
 
 <style>

src/public/app/widgets/ribbon_widgets/edited_notes.ts

@@ -6,7 +6,7 @@ import options from "../../services/options.js";
 import { t } from "../../services/i18n.js";
 import type FNote from "../../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="edited-notes-widget">
     <style>
         .edited-notes-widget {

src/public/app/widgets/ribbon_widgets/file_properties.ts

@@ -7,7 +7,7 @@ import protectedSessionHolder from "../../services/protected_session_holder.js";
 import { t } from "../../services/i18n.js";
 import type FNote from "../../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="file-properties-widget">
     <style>
         .file-table {

src/public/app/widgets/ribbon_widgets/image_properties.ts

@@ -6,7 +6,7 @@ import utils from "../../services/utils.js";
 import { t } from "../../services/i18n.js";
 import type FNote from "../../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="image-properties">
     <div style="display: flex; justify-content: space-evenly; margin: 10px;">
         <span>

src/public/app/widgets/ribbon_widgets/inherited_attribute_list.ts

@@ -6,7 +6,7 @@ import { t } from "../../services/i18n.js";
 import type FNote from "../../entities/fnote.js";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="inherited-attributes-widget">
     <style>
     .inherited-attributes-widget {

src/public/app/widgets/ribbon_widgets/note_info_widget.ts

@@ -6,7 +6,7 @@ import utils from "../../services/utils.js";
 import type { EventData } from "../../components/app_context.js";
 import type FNote from "../../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-info-widget">
     <style>
         .note-info-widget {

src/public/app/widgets/ribbon_widgets/note_map.ts

@@ -2,7 +2,7 @@ import NoteContextAwareWidget from "../note_context_aware_widget.js";
 import NoteMapWidget from "../note_map.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-map-ribbon-widget">
     <style>
         .note-map-ribbon-widget {

src/public/app/widgets/ribbon_widgets/note_paths.ts

@@ -6,7 +6,7 @@ import type FNote from "../../entities/fnote.js";
 import type { NotePathRecord } from "../../entities/fnote.js";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-paths-widget">
     <style>
     .note-paths-widget {

src/public/app/widgets/ribbon_widgets/note_properties.ts

@@ -2,7 +2,7 @@ import type FNote from "../../entities/fnote.js";
 import { t } from "../../services/i18n.js";
 import NoteContextAwareWidget from "../note_context_aware_widget.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="note-properties-widget">
     <style>
         .note-properties-widget {

src/public/app/widgets/ribbon_widgets/owned_attribute_list.ts

@@ -5,7 +5,7 @@ import AttributeEditorWidget from "../attribute_widgets/attribute_editor.js";
 import type { CommandListenerData } from "../../components/app_context.js";
 import type FAttribute from "../../entities/fattribute.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="attribute-list">
     <style>
         .attribute-list {

src/public/app/widgets/ribbon_widgets/promoted_attributes.ts

@@ -12,7 +12,7 @@ import type { Attribute } from "../../services/attribute_parser.js";
 import type FAttribute from "../../entities/fattribute.js";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="promoted-attributes-widget">
     <style>
     body.mobile .promoted-attributes-widget {

src/public/app/widgets/ribbon_widgets/script_executor.ts

@@ -3,7 +3,7 @@ import keyboardActionService from "../../services/keyboard_actions.js";
 import { t } from "../../services/i18n.js";
 import type FNote from "../../entities/fnote.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="script-runner-widget">
     <style>
         .script-runner-widget {

src/public/app/widgets/ribbon_widgets/search_definition.ts

@@ -20,7 +20,7 @@ import { Dropdown } from "bootstrap";
 import type FNote from "../../entities/fnote.js";
 import type { AttributeType } from "../../entities/fattribute.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="search-definition-widget">
     <style>
     .search-setting-table {

src/public/app/widgets/ribbon_widgets/similar_notes.ts

@@ -6,7 +6,7 @@ import NoteContextAwareWidget from "../note_context_aware_widget.js";
 import type FNote from "../../entities/fnote.js";
 import type { EventData } from "../../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="similar-notes-widget">
     <style>
     .similar-notes-wrapper {

src/public/app/widgets/scroll_padding.ts

@@ -1,6 +1,6 @@
 import NoteContextAwareWidget from "./note_context_aware_widget.js";
 
-const TPL = `<div class="scroll-padding-widget"></div>`;
+const TPL = /*html*/`<div class="scroll-padding-widget"></div>`;
 
 export default class ScrollPaddingWidget extends NoteContextAwareWidget {
 

src/public/app/widgets/search_options/ancestor.ts

@@ -2,7 +2,7 @@ import AbstractSearchOption from "./abstract_search_option.js";
 import noteAutocompleteService from "../../services/note_autocomplete.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td colspan="2">
         <div style="display: flex; align-items: center;">

src/public/app/widgets/search_options/debug.ts

@@ -1,7 +1,7 @@
 import AbstractSearchOption from "./abstract_search_option.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr data-search-option-conf="debug">
     <td colSpan="2">
         <span class="bx bx-bug"></span>

src/public/app/widgets/search_options/fast_search.ts

@@ -1,7 +1,7 @@
 import AbstractSearchOption from "./abstract_search_option.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr data-search-option-conf="fastSearch">
     <td colSpan="2">
         <span class="bx bx-run"></span>

src/public/app/widgets/search_options/include_archived_notes.ts

@@ -1,7 +1,7 @@
 import AbstractSearchOption from "./abstract_search_option.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr data-search-option-conf="includeArchivedNotes">
     <td colspan="2">
         <span class="bx bx-archive"></span>

src/public/app/widgets/search_options/limit.ts

@@ -1,7 +1,7 @@
 import AbstractSearchOption from "./abstract_search_option.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr data-search-option-conf="limit">
     <td class="title-column">
         <span class="bx bx-stop"></span>

src/public/app/widgets/search_options/order_by.ts

@@ -1,7 +1,7 @@
 import AbstractSearchOption from "./abstract_search_option.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr data-search-option-conf="orderBy">
     <td class="title-column">
         <span class="bx bx-arrow-from-top"></span>

src/public/app/widgets/search_options/search_script.ts

@@ -2,7 +2,7 @@ import AbstractSearchOption from "./abstract_search_option.js";
 import noteAutocompleteService from "../../services/note_autocomplete.js";
 import { t } from "../../services/i18n.js";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td class="title-column">
         ${t("search_script.title")}

src/public/app/widgets/search_options/search_string.ts

@@ -6,7 +6,7 @@ import appContext, { type EventData } from "../../components/app_context.js";
 import { t } from "../../services/i18n.js";
 import { Tooltip } from "bootstrap";
 
-const TPL = `
+const TPL = /*html*/`
 <tr>
     <td class="title-column">${t("search_string.title_column")}</td>
     <td>

src/public/app/widgets/search_result.ts

@@ -4,7 +4,7 @@ import NoteListRenderer from "../services/note_list_renderer.js";
 import type FNote from "../entities/fnote.js";
 import type { EventData } from "../components/app_context.js";
 
-const TPL = `
+const TPL = /*html*/`
 <div class="search-result-widget">
     <style>
     .search-result-widget {