All files / state/tooltip-trigger-state create-tooltip-trigger-state.ts

91.5% Statements 140/153
83.33% Branches 25/30
100% Functions 8/8
91.5% Lines 140/153

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 1541x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 17x 17x 17x 17x 17x 17x 17x 12x 12x 17x 17x 12x 5x 1x 1x 1x 5x 12x 17x 17x 8x 1x 1x 1x 8x 8x 8x 8x 8x 8x 8x       8x 8x 3x 3x 3x 8x 17x 17x 8x 4x       4x 4x 4x 4x 3x 3x 4x 4x 8x 8x       8x 8x 6x     6x 6x 6x 3x 3x 3x 6x 6x 8x 17x 17x 4x 4x 4x 4x 1x 1x 1x 1x 1x 1x 4x 3x 3x 4x 17x 17x 17x     17x 17x 17x 17x 17x 8x 4x 4x 4x 4x 8x 17x 17x 17x 17x 17x 63x 63x 17x 17x  
/*
 * Copyright 2020 Adobe. All rights reserved.
 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. You may obtain a copy
 * of the License at http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
 * OF ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 */
 
import { createMemo, mergeProps, onCleanup } from "solid-js";
import { createOverlayTriggerState } from "../../../internals/solid-aria/createOverlayTriggerState";
 
import type { DefaultTooltipTriggerStateArguments, TooltipTriggerState, TooltipTriggerStateArguments } from "./types";
 
export const TOOLTIP_DELAY = 1500;
export const TOOLTIP_COOLDOWN = 500;
 
const tooltips: Record<any, (immediate?: boolean) => void> = {};
 
let tooltipId = 0;
let globalWarmedUp = false;
let globalWarmUpTimeout: number | null = null;
let globalCooldownTimeout: number | null = null;
 
const defaultProps: DefaultTooltipTriggerStateArguments = {
	closeDelay: TOOLTIP_COOLDOWN,
	delay: TOOLTIP_DELAY
};
 
/**
 * Manages state for a tooltip trigger. Tracks whether the tooltip is open, and provides
 * methods to toggle this state. Ensures only one tooltip is open at a time and controls
 * the delay for showing a tooltip.
 */
export function createTooltipTriggerState(props: TooltipTriggerStateArguments = {}): TooltipTriggerState {
	const local = mergeProps(defaultProps, props);
 
	const overlayTriggerState = createOverlayTriggerState(props);
	const id = createMemo(() => `${++tooltipId}`);
	let closeTimeout: number | null = null;
 
	const ensureTooltipEntry = () => {
		tooltips[id()] = hideTooltip;
	};
 
	const closeOpenTooltips = () => {
		for (const hideTooltipId in tooltips) {
			if (hideTooltipId !== id()) {
				tooltips[hideTooltipId](true);
				delete tooltips[hideTooltipId];
			}
		}
	};
 
	const showTooltip = () => {
		if (closeTimeout) {
			clearTimeout(closeTimeout);
			closeTimeout = null;
		}
 
		closeOpenTooltips();
		ensureTooltipEntry();
		globalWarmedUp = true;
		overlayTriggerState.open();
 
		if (globalWarmUpTimeout) {
			clearTimeout(globalWarmUpTimeout);
			globalWarmUpTimeout = null;
		}
 
		if (globalCooldownTimeout) {
			clearTimeout(globalCooldownTimeout);
			globalCooldownTimeout = null;
		}
	};
 
	const hideTooltip = (immediate?: boolean) => {
		if (immediate || local.closeDelay <= 0) {
			if (closeTimeout) {
				clearTimeout(closeTimeout);
				closeTimeout = null;
			}
 
			overlayTriggerState.close();
		} else if (!closeTimeout) {
			closeTimeout = window.setTimeout(() => {
				closeTimeout = null;
				overlayTriggerState.close();
			}, local.closeDelay);
		}
 
		if (globalWarmUpTimeout) {
			clearTimeout(globalWarmUpTimeout);
			globalWarmUpTimeout = null;
		}
 
		if (globalWarmedUp) {
			if (globalCooldownTimeout) {
				clearTimeout(globalCooldownTimeout);
			}
 
			// eslint-disable-next-line solid/reactivity
			globalCooldownTimeout = window.setTimeout(() => {
				delete tooltips[id()];
				globalCooldownTimeout = null;
				globalWarmedUp = false;
			}, Math.max(TOOLTIP_COOLDOWN, local.closeDelay));
		}
	};
 
	const warmupTooltip = () => {
		closeOpenTooltips();
		ensureTooltipEntry();
 
		if (!overlayTriggerState.isOpen() && !globalWarmUpTimeout && !globalWarmedUp) {
			// eslint-disable-next-line solid/reactivity
			globalWarmUpTimeout = window.setTimeout(() => {
				globalWarmUpTimeout = null;
				globalWarmedUp = true;
				showTooltip();
			}, local.delay);
		} else if (!overlayTriggerState.isOpen()) {
			showTooltip();
		}
	};
 
	onCleanup(() => {
		if (closeTimeout) {
			clearTimeout(closeTimeout);
		}
 
		delete tooltips[id()];
	});
 
	const openTooltip = (immediate = false) => {
		if (!immediate && local.delay > 0 && !closeTimeout) {
			warmupTooltip();
		} else {
			showTooltip();
		}
	};
 
	return {
		open: openTooltip,
		close: hideTooltip,
		get isOpen() {
			return overlayTriggerState.isOpen();
		}
	};
}