Introduce gr-tooltip-content element and add for draft comment
This change introduces an element that can wrap a tooltip around
arbitrary contents. Previously, we could only attach a tooltip to a
Polymer element, and want more granularity than that for the purposes
of positioning.
The new tooltip element takes the following arguments:
- title (the contents of the tooltip, required)
- showIcon (optional, to show an info icon)
- maxWidth (optional, to pass a max-width to the tooltip itself).
The tooltip itself will be attached to the content inside of the
<gr-tooltip-content> wrapper.
One tooltip has been added using this new element for the 'DRAFT' text
in the gr-diff-comment'.
Bug: Issue 4539
Change-Id: Iff05c785052c643ef1f1cc01d101b21c48c6299f
diff --git a/polygerrit-ui/app/elements/shared/gr-tooltip/gr-tooltip.js b/polygerrit-ui/app/elements/shared/gr-tooltip/gr-tooltip.js
index 76372ba..4a5f631 100644
--- a/polygerrit-ui/app/elements/shared/gr-tooltip/gr-tooltip.js
+++ b/polygerrit-ui/app/elements/shared/gr-tooltip/gr-tooltip.js
@@ -19,6 +19,15 @@
properties: {
text: String,
+ maxWidth: {
+ type: String,
+ observer: '_updateWidth',
+ },
+ },
+
+ _updateWidth: function(maxWidth) {
+ this.customStyle['--tooltip-max-width'] = maxWidth;
+ this.updateStyles();
},
});
})();
