Compare commits

...

2 Commits

Author SHA1 Message Date
Valentin Silytuin de089b6348 v3.0.1 2025-04-02 00:39:45 +04:00
Valentin Silytuin 06039e55c9 Fix event listeners 2025-04-02 00:38:44 +04:00
3 changed files with 30 additions and 36 deletions

View File

@ -1,3 +1,7 @@
## v3.0.1
- Исправлена работа событий
## v3.0.0
- Исправлено название опции с `virtialReference` на `virtualReference`

View File

@ -289,6 +289,18 @@ export const createTooltip = ($el, content, options) => {
$el._tooltip.isVisible = true;
autoUpdateCleanup = autoUpdate($el, $el._tooltip.$tooltip, $el._tooltip.updatePosition);
if (
options.hideOnClick &&
(options.trigger.includes('click') || options.trigger.includes('manual'))
) {
document.body.addEventListener('click', $el._tooltip.hideOnClickListener);
listeners.push({
el: document.body,
event: 'click',
listener: $el._tooltip.hideOnClickListener,
});
}
if (options.onShow) {
options.onShow($el._tooltip);
}
@ -337,39 +349,29 @@ export const createTooltip = ($el, content, options) => {
);
};
const hideOnClickListener = ({ target }) => {
$el._tooltip.hideOnClickListener = ({ target }) => {
if (
$el._tooltip.isVisible &&
(options.hideOnClick === 'all' ||
$el.contains(target) ||
(options.hideOnClick !== 'toggle' && !$el._tooltip.$tooltip.contains(target)))
) {
document.body.removeEventListener('click', hideOnClickListener);
document.body.removeEventListener('click', $el._tooltip.hideOnClickListener);
$el._tooltip.hide();
}
};
const clickListener = () => {
$el._tooltip.clickListener = () => {
if (!$el._tooltip.isVisible) {
$el._tooltip.show();
if (options.hideOnClick) {
setTimeout(() => {
document.body.addEventListener('click', hideOnClickListener);
listeners.push({
el: document.body,
event: 'click',
listener: hideOnClickListener,
});
});
}
}
};
const mouseEnterListener = () => {
$el._tooltip.mouseEnterListener = () => {
$el._tooltip.show();
};
const mouseLeaveListener = ({ relatedTarget }) => {
$el._tooltip.mouseLeaveListener = ({ relatedTarget }) => {
if (options.interactive) {
if ($el._tooltip.$tooltip.contains(relatedTarget)) {
$el._tooltip.$tooltip.addEventListener(
@ -395,48 +397,36 @@ export const createTooltip = ($el, content, options) => {
for (const trigger of options.trigger.split(' ')) {
switch (trigger) {
case 'mouseenter': {
$el.addEventListener('mouseenter', mouseEnterListener);
$el.addEventListener('mouseenter', $el._tooltip.mouseEnterListener);
listeners.push({
el: $el,
event: 'mouseenter',
listener: mouseEnterListener,
listener: $el._tooltip.mouseEnterListener,
});
$el.addEventListener('mouseleave', mouseLeaveListener);
$el.addEventListener('mouseleave', $el._tooltip.mouseLeaveListener);
listeners.push({
el: $el,
event: 'mouseleave',
listener: mouseLeaveListener,
listener: $el._tooltip.mouseLeaveListener,
});
break;
}
case 'click': {
$el.addEventListener('click', clickListener);
$el.addEventListener('click', $el._tooltip.clickListener);
listeners.push({
el: $el,
event: 'click',
listener: clickListener,
listener: $el._tooltip.clickListener,
});
if (!options.interactive) {
$el.addEventListener('mouseleave', mouseLeaveListener);
$el.addEventListener('mouseleave', $el._tooltip.mouseLeaveListener);
listeners.push({
el: $el,
event: 'mouseleave',
listener: mouseLeaveListener,
});
}
break;
}
case 'manual': {
if (options.hideOnClick) {
document.body.addEventListener('click', hideOnClickListener);
listeners.push({
el: document.body,
event: 'click',
listener: hideOnClickListener,
listener: $el._tooltip.mouseLeaveListener,
});
}

View File

@ -1,6 +1,6 @@
{
"name": "@advdominion/tooltip",
"version": "3.0.0",
"version": "3.0.1",
"type": "module",
"packageManager": "yarn@4.5.3",
"main": "index.js",