diff --git a/apps/edit-docs/demo/!!!meta.json b/apps/edit-docs/demo/!!!meta.json index 44b61171d..d8c4710f9 100644 --- a/apps/edit-docs/demo/!!!meta.json +++ b/apps/edit-docs/demo/!!!meta.json @@ -1,6 +1,6 @@ { "formatVersion": 2, - "appVersion": "0.99.3", + "appVersion": "0.100.0", "files": [ { "isClone": false, @@ -5507,51 +5507,7 @@ } ], "dataFileName": "chartjs-plugin-datalabe.min.js", - "attachments": [], - "dirFileName": "chartjs-plugin-datalabels.min.js", - "children": [ - { - "isClone": true, - "noteId": "piyimQhwfcy5", - "notePath": [ - "root", - "rvaX6hEaQlmk", - "KZVWidxicAfn", - "xRQuuwkaobBM", - "GXUcReLM6dSe", - "oLPbgCo7djD7", - "AlL9eFopYuHg", - "9GZB2MeW51xv", - "3jaioienOLTR", - "piyimQhwfcy5" - ], - "title": "chart.js", - "prefix": null, - "dataFileName": "chart.js.clone.html", - "type": "text", - "format": "html" - } - ] - }, - { - "isClone": true, - "noteId": "piyimQhwfcy5", - "notePath": [ - "root", - "rvaX6hEaQlmk", - "KZVWidxicAfn", - "xRQuuwkaobBM", - "GXUcReLM6dSe", - "oLPbgCo7djD7", - "AlL9eFopYuHg", - "9GZB2MeW51xv", - "piyimQhwfcy5" - ], - "title": "chart.js", - "prefix": null, - "dataFileName": "chart.js.clone.html", - "type": "text", - "format": "html" + "attachments": [] } ] }, @@ -6044,6 +6000,86 @@ ], "dataFileName": "Custom request handler.js", "attachments": [] + }, + { + "isClone": false, + "noteId": "DAybX9h5jOoG", + "notePath": [ + "root", + "rvaX6hEaQlmk", + "KZVWidxicAfn", + "DAybX9h5jOoG" + ], + "title": "Render note with JSX", + "notePosition": 100, + "prefix": null, + "isExpanded": false, + "type": "render", + "mime": "", + "attributes": [ + { + "type": "label", + "name": "widget", + "value": "", + "isInheritable": false, + "position": 10 + }, + { + "type": "relation", + "name": "renderNote", + "value": "xzqr5J1V4YwY", + "isInheritable": false, + "position": 20 + } + ], + "attachments": [], + "dirFileName": "Render note with JSX", + "children": [ + { + "isClone": false, + "noteId": "xzqr5J1V4YwY", + "notePath": [ + "root", + "rvaX6hEaQlmk", + "KZVWidxicAfn", + "DAybX9h5jOoG", + "xzqr5J1V4YwY" + ], + "title": "JSX", + "notePosition": 12, + "prefix": null, + "isExpanded": false, + "type": "code", + "mime": "text/jsx", + "attributes": [], + "dataFileName": "JSX.jsx", + "attachments": [], + "dirFileName": "JSX", + "children": [ + { + "isClone": false, + "noteId": "mqDw6BebfE58", + "notePath": [ + "root", + "rvaX6hEaQlmk", + "KZVWidxicAfn", + "DAybX9h5jOoG", + "xzqr5J1V4YwY", + "mqDw6BebfE58" + ], + "title": "FormElements", + "notePosition": 10, + "prefix": null, + "isExpanded": false, + "type": "code", + "mime": "text/jsx", + "attributes": [], + "dataFileName": "FormElements.jsx", + "attachments": [] + } + ] + } + ] } ] } diff --git a/apps/edit-docs/demo/navigation.html b/apps/edit-docs/demo/navigation.html index 4d1371ac2..8c425fc81 100644 --- a/apps/edit-docs/demo/navigation.html +++ b/apps/edit-docs/demo/navigation.html @@ -540,14 +540,6 @@ @@ -633,6 +625,18 @@
  • Custom request handler
    • +
  • Render note with JSX + +
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo.html b/apps/edit-docs/demo/root/Trilium Demo.html index b5b6672d6..59f6c6d55 100644 --- a/apps/edit-docs/demo/root/Trilium Demo.html +++ b/apps/edit-docs/demo/root/Trilium Demo.html @@ -18,6 +18,7 @@ width="150" height="150">

    Welcome to Trilium Notes! +

    This is a "demo" document packaged with Trilium to showcase some of its features and also give you some ideas on how you might structure your notes. @@ -25,17 +26,22 @@ you wish.

    If you need any help, visit triliumnotes.org or our GitHub repository +

    Cleanup

    +

    Once you're finished with experimenting and want to cleanup these pages, you can simply delete them all.

    Formatting

    +

    Trilium supports classic formatting like italic, bold, bold and italic. You can add links pointing to external pages or  Formatting examples.

    Lists

    +

    Ordered: +

    1. First Item
      2. @@ -50,6 +56,7 @@

    Unordered: +

    Block quotes

    +

    Whereof one cannot speak, thereof one must be silent”

    – Ludwig Wittgenstein

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Books/Book template.html b/apps/edit-docs/demo/root/Trilium Demo/Books/Book template.html index 5f589ccde..b6ece231e 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Books/Book template.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Books/Book template.html @@ -14,17 +14,22 @@

    Main characters

    +

    … here put main characters …

     

    Plot

    +

    … describe main plot lines …

     

    Tone

    +

     

    Genre

    +

    scifi / drama / romance

     

    Similar books

    + diff --git a/apps/edit-docs/demo/root/Trilium Demo/Books/To read.html b/apps/edit-docs/demo/root/Trilium Demo/Books/To read.html index 880a1ac5d..9e3a2eda7 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Books/To read.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Books/To read.html @@ -16,8 +16,10 @@

    Check out Kindle Daily Deals:

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Checkbox lists.html b/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Checkbox lists.html index 62c728414..1a581a9d0 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Checkbox lists.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Checkbox lists.html @@ -18,21 +18,25 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Code blocks.html b/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Code blocks.html index 214ef212e..b1289ea80 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Code blocks.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Code blocks.html @@ -28,6 +28,7 @@ } +

    For larger pieces of code it is better to use a code note, which uses a fully-fledged code editor (CodeMirror). For an example of a code note, see Custom request handler.

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Math.html b/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Math.html index 54a28f3ff..e646e00b4 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Math.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Formatting examples/Math.html @@ -15,7 +15,9 @@

    \(% \f is defined as #1f(#2) using the macro \f\relax{x} = \int_{-\infty}^\infty     \f\hat\xi\,e^{2 \pi i \xi x}     \,d\xi\)Some math examples:

    \[\displaystyle \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}} {1+\frac{e^{-8\pi}} {1+\cdots} } } }\] +

    Another:

    \[\displaystyle \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right)\] +

    Inline math is also possible: \(c^2 = a^2 + b^2\) 

     

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Inbox/Book to read.html b/apps/edit-docs/demo/root/Trilium Demo/Inbox/Book to read.html index 9a45dd7d4..c06d6e52d 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Inbox/Book to read.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Inbox/Book to read.html @@ -15,6 +15,7 @@

    How to be a stoic from Massimo Pigliuci:

    https://www.amazon.com/gp/product/B01K3WN1BY +

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Inbox/The Last Question.html b/apps/edit-docs/demo/root/Trilium Demo/Inbox/The Last Question.html index e0d736c1b..3cb00a8e4 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Inbox/The Last Question.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Inbox/The Last Question.html @@ -22,6 +22,7 @@

    This page demonstrates two things:

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal.html b/apps/edit-docs/demo/root/Trilium Demo/Journal.html index faac301b5..629b4870f 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal.html @@ -14,6 +14,7 @@

    You can read some explanation on how this journal works here: https://github.com/zadam/trilium/wiki/Day-notes +

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday.html index 5171b6ee2..e4a99c109 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Christmas gift ideas.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Christmas gift ideas.html index 2a2d08336..01ad36c16 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Christmas gift ideas.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Christmas gift ideas.html @@ -17,6 +17,7 @@
  • XBox
  • Candles
  • Portable speakers +
  • ...?
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Trusted timestamping.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Trusted timestamping.html index 0a85f8618..bae5a1ed0 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Trusted timestamping.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/11 - November/28 - Tuesday/Trusted timestamping.html @@ -14,8 +14,10 @@

    Wiki: https://en.wikipedia.org/wiki/Trusted_timestamping +

    Bozho: https://techblog.bozho.net/using-trusted-timestamping-java/ +

    Trusted timestamping is the process of securely keeping track of the creation and modification time of a document. Security here diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/18 - Monday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/18 - Monday.html index ae490681e..3722a62c0 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/18 - Monday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/18 - Monday.html @@ -16,6 +16,7 @@

    Miscellaneous notes done on monday ...

     

    Interesting video: https://www.youtube.com/watch?v=_eSAF_qT_FY&feature=youtu.be +

     

     

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/19 - Tuesday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/19 - Tuesday.html index f0309b26d..487b71530 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/19 - Tuesday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/19 - Tuesday.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/20 - Wednesday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/20 - Wednesday.html index 28245eb1a..ae559b3c1 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/20 - Wednesday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/20 - Wednesday.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/21 - Thursday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/21 - Thursday.html index 2ff2ac742..28b77ec56 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/21 - Thursday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/21 - Thursday.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/22 - Friday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/22 - Friday.html index f8ec2e8e5..3545fd3d7 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/22 - Friday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/22 - Friday.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/23 - Saturday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/23 - Saturday.html index 6973b8531..912b715c0 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/23 - Saturday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/23 - Saturday.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!.html index 29a1e0cd2..c243a035c 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!/DONE - Buy a board game for Al.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!/DONE - Buy a board game for Al.html index 55d9b2909..e7367a06c 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!/DONE - Buy a board game for Al.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/24 - Sunday - Christmas Eve!/DONE - Buy a board game for Al.html @@ -18,6 +18,7 @@ width="209" height="300">

    Maybe CodeNames? https://boardgamegeek.com/boardgame/178900/codenames +

    diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/30 - Thursday.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/30 - Thursday.html index 36cbd2ed6..133fae97b 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/30 - Thursday.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/2021/12 - December/30 - Thursday.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Journal/Day template.html b/apps/edit-docs/demo/root/Trilium Demo/Journal/Day template.html index 623273a9e..44bd101ae 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Journal/Day template.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Journal/Day template.html @@ -18,6 +18,7 @@
    • diff --git a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Chichén Itzá, Mexico.html b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Chichén Itzá, Mexico.html index ab44bd638..3992ceed9 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Chichén Itzá, Mexico.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Chichén Itzá, Mexico.html @@ -24,14 +24,17 @@ [1] +

    1. ^ +

      What Are the 7 Wonders of the World? (with HD Images) | TheCollector +

      2. diff --git a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Christ the Redeemer, Brazil.html b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Christ the Redeemer, Brazil.html index 3e1f1e905..cbaae70da 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Christ the Redeemer, Brazil.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Christ the Redeemer, Brazil.html @@ -26,13 +26,16 @@ been brought to its knees.[1] +

      1. ^ +

        What Are the 7 Wonders of the World? (with HD Images) | TheCollector +

        2. diff --git a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Machu Picchu, Peru.html b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Machu Picchu, Peru.html index 5e9817e5b..929103047 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Machu Picchu, Peru.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Machu Picchu, Peru.html @@ -22,13 +22,16 @@ around 1450 in polished drystone walls.[1] +

        1. ^ +

          What Are the 7 Wonders of the World? (with HD Images) | TheCollector +

          2. diff --git a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Petra, Jordan.html b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Petra, Jordan.html index 1396c2691..55e0adafa 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Petra, Jordan.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/Petra, Jordan.html @@ -23,13 +23,16 @@ by earthquakes.[1] +

          1. ^ +

            What Are the 7 Wonders of the World? (with HD Images) | TheCollector +

            2. diff --git a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Colosseum, Rome, Italy.html b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Colosseum, Rome, Italy.html index 650a6623c..c9abd680d 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Colosseum, Rome, Italy.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Colosseum, Rome, Italy.html @@ -26,14 +26,17 @@ [1] +

            1. ^ +

              What Are the 7 Wonders of the World? (with HD Images) | TheCollector +

              2. diff --git a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Great Wall of China.html b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Great Wall of China.html index 1f5d5886f..ccedb8388 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Great Wall of China.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Great Wall of China.html @@ -23,14 +23,17 @@ [1] +

              1. ^ +

                What Are the 7 Wonders of the World? (with HD Images) | TheCollector +

                2. diff --git a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Taj Mahal, India.html b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Taj Mahal, India.html index 0d692392a..755184be0 100644 --- a/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Taj Mahal, India.html +++ b/apps/edit-docs/demo/root/Trilium Demo/Note Types/Geo Map (The Seven Wonders of the World)/The Taj Mahal, India.html @@ -23,13 +23,16 @@ the complex.[1] +

                1. ^ +

                  What Are the 7 Wonders of the World? (with HD Images) | TheCollector +

                  2. diff --git a/apps/edit-docs/demo/root/Trilium Demo/Scripting examples/Render note with JSX/JSX.jsx b/apps/edit-docs/demo/root/Trilium Demo/Scripting examples/Render note with JSX/JSX.jsx new file mode 100644 index 000000000..7e001b535 --- /dev/null +++ b/apps/edit-docs/demo/root/Trilium Demo/Scripting examples/Render note with JSX/JSX.jsx @@ -0,0 +1,108 @@ +import { + ActionButton, Button, LinkButton, + Admonition, Collapsible, FormGroup, + Dropdown, FormListItem, FormDropdownDivider, FormDropdownSubmenu, + NoteAutocomplete, NoteLink, Modal, + CKEditor, + useEffect, useState +} from "trilium:preact"; +import { showMessage } from "trilium:api"; + +export default function() { + const [ time, setTime ] = useState(); + const lorem = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam accumsan eu odio non gravida. Pellentesque ornare, arcu condimentum molestie dignissim, nibh turpis ultrices elit, eget elementum nunc erat at erat. Maecenas vehicula consectetur elit, nec fermentum elit venenatis eu."; + useEffect(() => { + const interval = setInterval(() => setTime(new Date().toLocaleString()), 1000); + return () => clearInterval(interval); + }, []); + + return ( +
                  +

                  Widget showcase

                  + + + + Admonition
                  + {lorem} +                   + + + {lorem} + + + + + + +
                  + ); +} + +function Buttons() { + const onClick = () => showMessage("A button was pressed"); + + return ( + <> +

                  Buttons

                  +
                  + +
                  + + ) +} + +function NoteElements() { + const [ noteId, setNoteId ] = useState(""); + + return ( +
                  +

                  Note elements

                  + + + + + + + {noteId + ? + : Select a note first} + +
                  + ); +} + +function ModalSample() { + const [ shown, setShown ] = useState(false); + + return ( + <> +

                  Modal

                  +