Skip to content

Commit 234c778

Browse files
committed
Doc update
1 parent 92d9dee commit 234c778

File tree

1 file changed

+21
-2
lines changed

1 file changed

+21
-2
lines changed

README.md

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -253,14 +253,19 @@ By default, the popover will have the `tooltip` and `popover` classes, so you ca
253253
**Props:**
254254

255255
- `open` - Boolean that shows or hide the popover.
256+
- `disable` - Boolean that disables the popover. If it was already open, it will be closed.
256257
- `placement` - *(see above)*
257258
- `delay` - *(see above)*
258259
- `trigger` - *(see above)*
259260
- `offset` - *(see above)*
260261
- `container` - *(see above)*
261262
- `boundariesElement` - *(see above)*
262263
- `popperOptions` - *(see above)*
263-
- `popoverClass` - Classes applied to the popover element.
264+
- `popoverClass` - Classes applied to the popover element. Use this to apply different themes to the popover.
265+
- `popoverBaseClass` - Base classes applied to the popover element (defaults to `'tooltip popover'`).
266+
- `popoverWrapperClass` - Class of the element that contains the arrow and inner content.
267+
- `popoverArrowClass` - Class of the arrow element.
268+
- `popoverInnerClass` - Class of the inner content element.
264269
- `autoHide` - Hide the popover if clicked outside.
265270
- `handleResize` - Automatically update the popover position if its size changes.
266271

@@ -286,8 +291,13 @@ The default global options are:
286291
// Default CSS classes applied to the target element of the tooltip
287292
defaultTargetClass: 'has-tooltip',
288293
// Default HTML template of the tooltip element
289-
// It must include `tooltip` & `tooltip-inner` CSS classes
294+
// It must include `tooltip-arrow` & `tooltip-inner` CSS classes (can be configured, see below)
295+
// Change if the classes conflict with other libraries (for example bootstrap)
290296
defaultTemplate: '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',
297+
// Selector used to get the arrow element in the tooltip template
298+
defaultArrowSelector: '.tooltip-arrow, .tooltip__arrow',
299+
// Selector used to get the inner content element in the tooltip template
300+
defaultInnerSelector: '.tooltip-inner, .tooltip__inner',
291301
// Delay (ms)
292302
defaultDelay: 0,
293303
// Default events that trigger the tooltip
@@ -305,7 +315,16 @@ The default global options are:
305315
// Options for popover
306316
popover: {
307317
defaultPlacement: 'bottom',
318+
// Use the `popoverClass` prop for theming
308319
defaultClass: 'vue-popover-theme',
320+
// Base class (change if conflicts with other libraries)
321+
defaultBaseClass: 'tooltip popover',
322+
// Wrapper class (contains arrow and inner)
323+
defaultWrapperClass: 'wrapper',
324+
// Inner content class
325+
defaultInnerClass: 'tooltip-inner popover-inner',
326+
// Arrow class
327+
defaultArrowClass: 'tooltip-arrow popover-arrow',
309328
defaultDelay: 0,
310329
defaultTrigger: 'click',
311330
defaultOffset: 0,

0 commit comments

Comments
 (0)