feat(datatable): add help button

source/components/datatable/datatable.mjs

@@ -80,6 +80,8 @@ import {generateUniqueConfigKey} from "../host/util.mjs";
 import "./datasource/dom.mjs";
 import "./datasource/rest.mjs";
 
+import "../form/context-help.mjs";
+
 export {DataTable};
 
 /**
@@ -213,6 +215,10 @@ class DataTable extends CustomElement {
                 labels: {
                     theListContainsNoEntries: "The list contains no entries",
                     copyAll: "Copy all",
+                    helpText: "<p>You can copy the values from individual rows<br>" +
+                        "to the clipboard by double-clicking on the relevant column.</p>" +
+                        "<p>To copy an entire row, hold down the Shift key while clicking.<br>" +
+                        "If you want to copy all rows, you can use the <strong>Copy All</strong> button.</p>",
                 },
 
                 classes: {
@@ -227,6 +233,7 @@ class DataTable extends CustomElement {
                     autoInit: true,
                     doubleClickCopyToClipboard: true,
                     copyAll: true,
+                    help: true,
                 },
                 
                 copy: {
@@ -1155,6 +1162,10 @@ function getTemplate() {
                     <slot name="filter"></slot>
                 </div>
                 <div class="bar">
+                    <monster-context-help
+                            data-monster-attributes="class path:features.help | ?::hidden"
+                            data-monster-replace="path:labels.helpText"
+                    ></monster-context-help>
                     <a href="#" data-monster-attributes="class path:features.copyAll | ?::hidden" data-monster-role="copy-all" data-monster-replace="path:locale.copyAll">Copy all</a>
                     <monster-column-bar
                             data-monster-attributes="class path:features.settings | ?::hidden"></monster-column-bar>