diff --git a/source/components/datatable/datatable.mjs b/source/components/datatable/datatable.mjs index 4ecec2e34f7dbec1b530e23ed50d649d27fb999b..545c58f60cd2f265c5a5edeffd394025b3dabc02 100644 --- a/source/components/datatable/datatable.mjs +++ b/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>