@substrate-system/tool-tip 0.0.4 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +2 -1
- package/dist/index.cjs.map +2 -2
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +2 -2
- package/dist/index.min.js +2 -2
- package/dist/index.min.js.map +2 -2
- package/dist/meta.json +4 -4
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -27,6 +27,7 @@ class ToolTip extends HTMLElement {
|
|
|
27
27
|
static {
|
|
28
28
|
__name(this, "ToolTip");
|
|
29
29
|
}
|
|
30
|
+
static TAG = "tool-tip";
|
|
30
31
|
static observedAttributes = [
|
|
31
32
|
"content",
|
|
32
33
|
"placement",
|
|
@@ -429,5 +430,5 @@ class ToolTip extends HTMLElement {
|
|
|
429
430
|
this.open = false;
|
|
430
431
|
}
|
|
431
432
|
}
|
|
432
|
-
(0, import_util.define)(
|
|
433
|
+
(0, import_util.define)(ToolTip.TAG, ToolTip);
|
|
433
434
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { define } from '@substrate-system/web-component/util'\n\n// for document.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tool-tip':ToolTip\n }\n}\n\nexport type Placement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n\nexport type Trigger = 'hover' | 'focus' | 'click' | 'manual'\n\nexport class ToolTip extends HTMLElement {\n static observedAttributes = ['content', 'placement', 'disabled',\n 'open', 'distance', 'skidding', 'delay']\n\n private popup: HTMLDivElement | null = null\n private arrow: HTMLDivElement | null = null\n private target: HTMLElement | null = null\n\n private _open = false\n private _disabled = false\n private _showTimeout:number|null = null\n\n /** The text content of the tooltip. */\n get content ():string {\n return this.getAttribute('content') || ''\n }\n\n set content (value:string) {\n this.setAttribute('content', value)\n }\n\n /** Where to place the tooltip relative to the target. Defaults to 'top'. */\n get placement ():Placement {\n return (this.getAttribute('placement') as Placement) || 'top'\n }\n\n set placement (value:Placement) {\n this.setAttribute('placement', value)\n }\n\n /** Space-separated list of triggers. Defaults to 'hover focus'. */\n get trigger ():Trigger[] {\n const attr = this.getAttribute('trigger') || 'hover focus'\n return attr.split(' ').filter(Boolean) as Trigger[]\n }\n\n set trigger (value:Trigger[]|string) {\n if (Array.isArray(value)) {\n this.setAttribute('trigger', value.join(' '))\n } else {\n this.setAttribute('trigger', value)\n }\n }\n\n /** Whether the tooltip is disabled. */\n get disabled ():boolean {\n return this._disabled\n }\n\n set disabled (value:boolean) {\n this._disabled = value\n if (value) {\n this.setAttribute('disabled', '')\n } else {\n this.removeAttribute('disabled')\n }\n }\n\n get open ():boolean {\n return this._open\n }\n\n set open (value:boolean) {\n if (this._disabled) return\n const wasOpen = this._open\n this._open = value\n\n if (value && !wasOpen) {\n this.showTooltip()\n } else if (!value && wasOpen) {\n this.hideTooltip()\n }\n }\n\n /** Distance in pixels from the target. Defaults to 8. */\n get distance ():number {\n return parseInt(this.getAttribute('distance') || '8', 10)\n }\n\n set distance (value:number) {\n this.setAttribute('distance', String(value))\n }\n\n /** Lateral offset in pixels. Defaults to 0. */\n get skidding ():number {\n return parseInt(this.getAttribute('skidding') || '0', 10)\n }\n\n set skidding (value:number) {\n this.setAttribute('skidding', String(value))\n }\n\n /** Delay in milliseconds before showing the tooltip on hover. Defaults to 0. */\n get delay ():number {\n return parseInt(this.getAttribute('delay') || '0', 10)\n }\n\n set delay (value:number) {\n this.setAttribute('delay', String(value))\n }\n\n get hoist ():boolean {\n return this.hasAttribute('hoist')\n }\n\n set hoist (value:boolean) {\n if (value) {\n this.setAttribute('hoist', '')\n } else {\n this.removeAttribute('hoist')\n }\n }\n\n connectedCallback () {\n // Use display: contents so the tooltip doesn't affect layout\n this.style.display = 'contents'\n\n // Find the target element (first child element)\n this.target = this.firstElementChild as HTMLElement\n\n if (!this.target) {\n console.warn('tool-tip: No target element found. ' +\n 'Add a child element.')\n return\n }\n\n // Create the popup element\n this.createPopup()\n\n // Bind event handlers\n this.bindEvents()\n\n // Check if open attribute is set\n if (this.hasAttribute('open')) {\n this._open = true\n this.showTooltip()\n }\n }\n\n disconnectedCallback () {\n this.unbindEvents()\n this.popup?.remove()\n }\n\n attributeChangedCallback (\n name:string,\n _oldValue:string|null,\n newValue:string|null\n ) {\n if (name === 'content' && this.popup) {\n const body = this.popup.querySelector('.body')\n if (body) {\n body.textContent = newValue || ''\n }\n }\n\n if (name === 'placement' && this._open) {\n this.positionPopup()\n }\n\n if (name === 'disabled') {\n this._disabled = newValue !== null\n if (this._disabled && this._open) {\n this.hide()\n }\n }\n\n if (name === 'open') {\n this.open = newValue !== null\n }\n\n if ((name === 'distance' || name === 'skidding') && this._open) {\n this.positionPopup()\n }\n }\n\n private createPopup () {\n this.popup = document.createElement('div')\n this.popup.className = 'popup'\n this.popup.setAttribute('role', 'tooltip')\n this.popup.setAttribute('aria-hidden', 'true')\n this.popup.innerHTML = `\n <div class=\"body\">${this.content}</div>\n <div class=\"arrow\"></div>\n `\n\n this.arrow = this.popup.querySelector('.arrow')\n\n // Append to body if hoisted, otherwise to this element's parent\n if (this.hoist) {\n document.body.appendChild(this.popup)\n } else {\n this.appendChild(this.popup)\n }\n }\n\n private bindEvents () {\n if (!this.target) return\n\n const triggers = this.trigger\n\n if (triggers.includes('hover')) {\n this.target.addEventListener('mouseenter', this.handleMouseEnter)\n this.target.addEventListener('mouseleave', this.handleMouseLeave)\n }\n\n if (triggers.includes('focus')) {\n this.target.addEventListener('focus', this.handleFocus)\n this.target.addEventListener('blur', this.handleBlur)\n }\n\n if (triggers.includes('click')) {\n this.target.addEventListener('click', this.handleClick)\n }\n\n // Add keyboard support\n this.target.addEventListener('keydown', this.handleKeyDown)\n }\n\n private unbindEvents () {\n if (!this.target) return\n\n this.target.removeEventListener('mouseenter', this.handleMouseEnter)\n this.target.removeEventListener('mouseleave', this.handleMouseLeave)\n this.target.removeEventListener('blur', this.handleBlur)\n this.target.removeEventListener('click', this.handleClick)\n this.target.removeEventListener('keydown', this.handleKeyDown)\n }\n\n private handleMouseEnter = () => {\n this.show()\n }\n\n private handleMouseLeave = () => {\n this.hide()\n }\n\n private handleFocus = () => {\n this.show()\n }\n\n private handleBlur = () => {\n this.hide()\n }\n\n private handleClick = () => {\n if (this._open) {\n this.hide()\n } else {\n this.show()\n }\n }\n\n private handleKeyDown = (event:KeyboardEvent) => {\n // Close tooltip on Escape\n if (event.key === 'Escape' && this._open) {\n this.hide()\n }\n }\n\n private showTooltip () {\n if (!this.popup || this._disabled) return\n\n // Emit show event\n const showEvent = new CustomEvent('tool-tip-show', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(showEvent)) return\n\n this.popup.classList.add('visible')\n this.popup.setAttribute('aria-hidden', 'false')\n\n // Position the popup\n this.positionPopup()\n\n // Emit after-show event\n this.dispatchEvent(new CustomEvent('tool-tip-after-show', {\n bubbles: true\n }))\n }\n\n private hideTooltip () {\n if (!this.popup) return\n\n // Emit hide event\n const hideEvent = new CustomEvent('tool-tip-hide', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(hideEvent)) return\n\n this.popup.classList.remove('visible')\n this.popup.setAttribute('aria-hidden', 'true')\n\n // Emit after-hide event\n this.dispatchEvent(new CustomEvent('tool-tip-after-hide', {\n bubbles: true\n }))\n }\n\n private positionPopup () {\n if (!this.popup || !this.target) return\n\n const targetRect = this.target.getBoundingClientRect()\n const popupRect = this.popup.getBoundingClientRect()\n const arrowSize = 8\n\n let top = 0\n let left = 0\n let arrowTop = ''\n let arrowLeft = ''\n let arrowTransform = ''\n\n const distance = this.distance\n const skidding = this.skidding\n const placement = this.getOptimalPlacement(targetRect, popupRect)\n\n // Set data attribute for CSS styling\n this.popup.dataset.placement = placement\n\n switch (placement) {\n case 'top':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '100%'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-start':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + skidding\n arrowTop = '100%'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-end':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '100%'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%)'\n break\n case 'bottom':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '0'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-start':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + skidding\n arrowTop = '0'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-end':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '0'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'left':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = '50%'\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-start':\n top = targetRect.top + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'right':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = '50%'\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-start':\n top = targetRect.top + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n }\n\n // Adjust for scroll position\n if (this.hoist) {\n top += window.scrollY\n left += window.scrollX\n }\n\n // Apply position\n this.popup.style.top = `${top}px`\n this.popup.style.left = `${left}px`\n\n // Position the arrow\n if (this.arrow) {\n this.arrow.style.top = arrowTop\n this.arrow.style.left = arrowLeft\n this.arrow.style.transform = arrowTransform\n }\n }\n\n private getOptimalPlacement (\n targetRect:DOMRect,\n popupRect:DOMRect\n ):Placement {\n const placement = this.placement\n const viewportWidth = window.innerWidth\n const viewportHeight = window.innerHeight\n const distance = this.distance\n const arrowSize = 8\n\n // Check if the preferred placement fits\n const fits = {\n top: targetRect.top - popupRect.height - distance - arrowSize > 0,\n bottom: (targetRect.bottom + popupRect.height + distance +\n arrowSize < viewportHeight),\n left: targetRect.left - popupRect.width - distance - arrowSize > 0,\n right: (targetRect.right + popupRect.width + distance +\n arrowSize < viewportWidth),\n }\n\n // Get the base direction from the placement\n const baseDirection = placement.split('-')[0] as 'top' |\n 'bottom' |\n 'left' |\n 'right'\n\n // If preferred placement fits, use it\n if (fits[baseDirection]) {\n return placement\n }\n\n // Find the best alternative\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n }\n\n const opposite = opposites[baseDirection] as\n 'top' | 'bottom' | 'left' | 'right'\n if (fits[opposite]) {\n // Return the opposite with the same alignment\n const alignment = (placement.includes('-') ?\n placement.split('-')[1] :\n '')\n return (alignment ?\n `${opposite}-${alignment}` :\n opposite) as Placement\n }\n\n // Fall back to a direction that fits\n for (const dir of ['top', 'bottom', 'left', 'right'] as const) {\n if (fits[dir]) {\n return dir\n }\n }\n\n // If nothing fits, return original placement\n return placement\n }\n\n /**\n * Programmatically show the tooltip\n */\n show () {\n if (this._disabled || this._open) return\n\n const delay = this.delay\n if (delay > 0) {\n if (this._showTimeout) return\n this._showTimeout = window.setTimeout(() => {\n this.open = true\n this._showTimeout = null\n }, delay)\n } else {\n this.open = true\n }\n }\n\n /**\n * Programmatically hide the tooltip\n */\n hide () {\n if (this._showTimeout) {\n window.clearTimeout(this._showTimeout)\n this._showTimeout = null\n }\n this.open = false\n }\n}\n\ndefine('tool-tip', ToolTip)\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAuB;AAyBhB,MAAM,gBAAgB,YAAY;AAAA,EAzBzC,OAyByC;AAAA;AAAA;AAAA,EACrC,OAAO,qBAAqB;AAAA,IAAC;AAAA,IAAW;AAAA,IAAa;AAAA,IACjD;AAAA,IAAQ;AAAA,IAAY;AAAA,IAAY;AAAA,EAAO;AAAA,EAEnC,
|
|
4
|
+
"sourcesContent": ["import { define } from '@substrate-system/web-component/util'\n\n// for document.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tool-tip':ToolTip\n }\n}\n\nexport type Placement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n\nexport type Trigger = 'hover'|'focus'|'click'|'manual'\n\nexport class ToolTip extends HTMLElement {\n static TAG = 'tool-tip'\n static observedAttributes = ['content', 'placement', 'disabled',\n 'open', 'distance', 'skidding', 'delay']\n\n private popup:HTMLDivElement|null = null\n private arrow:HTMLDivElement|null = null\n private target:HTMLElement|null = null\n\n private _open = false\n private _disabled = false\n private _showTimeout:number|null = null\n\n /** The text content of the tooltip. */\n get content ():string {\n return this.getAttribute('content') || ''\n }\n\n set content (value:string) {\n this.setAttribute('content', value)\n }\n\n /** Where to place the tooltip relative to the target. Defaults to 'top'. */\n get placement ():Placement {\n return (this.getAttribute('placement') as Placement) || 'top'\n }\n\n set placement (value:Placement) {\n this.setAttribute('placement', value)\n }\n\n /** Space-separated list of triggers. Defaults to 'hover focus'. */\n get trigger ():Trigger[] {\n const attr = this.getAttribute('trigger') || 'hover focus'\n return attr.split(' ').filter(Boolean) as Trigger[]\n }\n\n set trigger (value:Trigger[]|string) {\n if (Array.isArray(value)) {\n this.setAttribute('trigger', value.join(' '))\n } else {\n this.setAttribute('trigger', value)\n }\n }\n\n /** Whether the tooltip is disabled. */\n get disabled ():boolean {\n return this._disabled\n }\n\n set disabled (value:boolean) {\n this._disabled = value\n if (value) {\n this.setAttribute('disabled', '')\n } else {\n this.removeAttribute('disabled')\n }\n }\n\n get open ():boolean {\n return this._open\n }\n\n set open (value:boolean) {\n if (this._disabled) return\n const wasOpen = this._open\n this._open = value\n\n if (value && !wasOpen) {\n this.showTooltip()\n } else if (!value && wasOpen) {\n this.hideTooltip()\n }\n }\n\n /** Distance in pixels from the target. Defaults to 8. */\n get distance ():number {\n return parseInt(this.getAttribute('distance') || '8', 10)\n }\n\n set distance (value:number) {\n this.setAttribute('distance', String(value))\n }\n\n /** Lateral offset in pixels. Defaults to 0. */\n get skidding ():number {\n return parseInt(this.getAttribute('skidding') || '0', 10)\n }\n\n set skidding (value:number) {\n this.setAttribute('skidding', String(value))\n }\n\n /** Delay in milliseconds before showing the tooltip on hover. Defaults to 0. */\n get delay ():number {\n return parseInt(this.getAttribute('delay') || '0', 10)\n }\n\n set delay (value:number) {\n this.setAttribute('delay', String(value))\n }\n\n get hoist ():boolean {\n return this.hasAttribute('hoist')\n }\n\n set hoist (value:boolean) {\n if (value) {\n this.setAttribute('hoist', '')\n } else {\n this.removeAttribute('hoist')\n }\n }\n\n connectedCallback () {\n // Use display: contents so the tooltip doesn't affect layout\n this.style.display = 'contents'\n\n // Find the target element (first child element)\n this.target = this.firstElementChild as HTMLElement\n\n if (!this.target) {\n console.warn('tool-tip: No target element found. ' +\n 'Add a child element.')\n return\n }\n\n // Create the popup element\n this.createPopup()\n\n // Bind event handlers\n this.bindEvents()\n\n // Check if open attribute is set\n if (this.hasAttribute('open')) {\n this._open = true\n this.showTooltip()\n }\n }\n\n disconnectedCallback () {\n this.unbindEvents()\n this.popup?.remove()\n }\n\n attributeChangedCallback (\n name:string,\n _oldValue:string|null,\n newValue:string|null\n ) {\n if (name === 'content' && this.popup) {\n const body = this.popup.querySelector('.body')\n if (body) {\n body.textContent = newValue || ''\n }\n }\n\n if (name === 'placement' && this._open) {\n this.positionPopup()\n }\n\n if (name === 'disabled') {\n this._disabled = newValue !== null\n if (this._disabled && this._open) {\n this.hide()\n }\n }\n\n if (name === 'open') {\n this.open = newValue !== null\n }\n\n if ((name === 'distance' || name === 'skidding') && this._open) {\n this.positionPopup()\n }\n }\n\n private createPopup () {\n this.popup = document.createElement('div')\n this.popup.className = 'popup'\n this.popup.setAttribute('role', 'tooltip')\n this.popup.setAttribute('aria-hidden', 'true')\n this.popup.innerHTML = `\n <div class=\"body\">${this.content}</div>\n <div class=\"arrow\"></div>\n `\n\n this.arrow = this.popup.querySelector('.arrow')\n\n // Append to body if hoisted, otherwise to this element's parent\n if (this.hoist) {\n document.body.appendChild(this.popup)\n } else {\n this.appendChild(this.popup)\n }\n }\n\n private bindEvents () {\n if (!this.target) return\n\n const triggers = this.trigger\n\n if (triggers.includes('hover')) {\n this.target.addEventListener('mouseenter', this.handleMouseEnter)\n this.target.addEventListener('mouseleave', this.handleMouseLeave)\n }\n\n if (triggers.includes('focus')) {\n this.target.addEventListener('focus', this.handleFocus)\n this.target.addEventListener('blur', this.handleBlur)\n }\n\n if (triggers.includes('click')) {\n this.target.addEventListener('click', this.handleClick)\n }\n\n // Add keyboard support\n this.target.addEventListener('keydown', this.handleKeyDown)\n }\n\n private unbindEvents () {\n if (!this.target) return\n\n this.target.removeEventListener('mouseenter', this.handleMouseEnter)\n this.target.removeEventListener('mouseleave', this.handleMouseLeave)\n this.target.removeEventListener('blur', this.handleBlur)\n this.target.removeEventListener('click', this.handleClick)\n this.target.removeEventListener('keydown', this.handleKeyDown)\n }\n\n private handleMouseEnter = () => {\n this.show()\n }\n\n private handleMouseLeave = () => {\n this.hide()\n }\n\n private handleFocus = () => {\n this.show()\n }\n\n private handleBlur = () => {\n this.hide()\n }\n\n private handleClick = () => {\n if (this._open) {\n this.hide()\n } else {\n this.show()\n }\n }\n\n private handleKeyDown = (event:KeyboardEvent) => {\n // Close tooltip on Escape\n if (event.key === 'Escape' && this._open) {\n this.hide()\n }\n }\n\n private showTooltip () {\n if (!this.popup || this._disabled) return\n\n // Emit show event\n const showEvent = new CustomEvent('tool-tip-show', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(showEvent)) return\n\n this.popup.classList.add('visible')\n this.popup.setAttribute('aria-hidden', 'false')\n\n // Position the popup\n this.positionPopup()\n\n // Emit after-show event\n this.dispatchEvent(new CustomEvent('tool-tip-after-show', {\n bubbles: true\n }))\n }\n\n private hideTooltip () {\n if (!this.popup) return\n\n // Emit hide event\n const hideEvent = new CustomEvent('tool-tip-hide', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(hideEvent)) return\n\n this.popup.classList.remove('visible')\n this.popup.setAttribute('aria-hidden', 'true')\n\n // Emit after-hide event\n this.dispatchEvent(new CustomEvent('tool-tip-after-hide', {\n bubbles: true\n }))\n }\n\n private positionPopup () {\n if (!this.popup || !this.target) return\n\n const targetRect = this.target.getBoundingClientRect()\n const popupRect = this.popup.getBoundingClientRect()\n const arrowSize = 8\n\n let top = 0\n let left = 0\n let arrowTop = ''\n let arrowLeft = ''\n let arrowTransform = ''\n\n const distance = this.distance\n const skidding = this.skidding\n const placement = this.getOptimalPlacement(targetRect, popupRect)\n\n // Set data attribute for CSS styling\n this.popup.dataset.placement = placement\n\n switch (placement) {\n case 'top':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '100%'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-start':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + skidding\n arrowTop = '100%'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-end':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '100%'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%)'\n break\n case 'bottom':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '0'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-start':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + skidding\n arrowTop = '0'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-end':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '0'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'left':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = '50%'\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-start':\n top = targetRect.top + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'right':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = '50%'\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-start':\n top = targetRect.top + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n }\n\n // Adjust for scroll position\n if (this.hoist) {\n top += window.scrollY\n left += window.scrollX\n }\n\n // Apply position\n this.popup.style.top = `${top}px`\n this.popup.style.left = `${left}px`\n\n // Position the arrow\n if (this.arrow) {\n this.arrow.style.top = arrowTop\n this.arrow.style.left = arrowLeft\n this.arrow.style.transform = arrowTransform\n }\n }\n\n private getOptimalPlacement (\n targetRect:DOMRect,\n popupRect:DOMRect\n ):Placement {\n const placement = this.placement\n const viewportWidth = window.innerWidth\n const viewportHeight = window.innerHeight\n const distance = this.distance\n const arrowSize = 8\n\n // Check if the preferred placement fits\n const fits = {\n top: targetRect.top - popupRect.height - distance - arrowSize > 0,\n bottom: (targetRect.bottom + popupRect.height + distance +\n arrowSize < viewportHeight),\n left: targetRect.left - popupRect.width - distance - arrowSize > 0,\n right: (targetRect.right + popupRect.width + distance +\n arrowSize < viewportWidth),\n }\n\n // Get the base direction from the placement\n const baseDirection = placement.split('-')[0] as 'top' |\n 'bottom' |\n 'left' |\n 'right'\n\n // If preferred placement fits, use it\n if (fits[baseDirection]) {\n return placement\n }\n\n // Find the best alternative\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n }\n\n const opposite = opposites[baseDirection] as\n 'top' | 'bottom' | 'left' | 'right'\n if (fits[opposite]) {\n // Return the opposite with the same alignment\n const alignment = (placement.includes('-') ?\n placement.split('-')[1] :\n '')\n return (alignment ?\n `${opposite}-${alignment}` :\n opposite) as Placement\n }\n\n // Fall back to a direction that fits\n for (const dir of ['top', 'bottom', 'left', 'right'] as const) {\n if (fits[dir]) {\n return dir\n }\n }\n\n // If nothing fits, return original placement\n return placement\n }\n\n /**\n * Programmatically show the tooltip\n */\n show () {\n if (this._disabled || this._open) return\n\n const delay = this.delay\n if (delay > 0) {\n if (this._showTimeout) return\n this._showTimeout = window.setTimeout(() => {\n this.open = true\n this._showTimeout = null\n }, delay)\n } else {\n this.open = true\n }\n }\n\n /**\n * Programmatically hide the tooltip\n */\n hide () {\n if (this._showTimeout) {\n window.clearTimeout(this._showTimeout)\n this._showTimeout = null\n }\n this.open = false\n }\n}\n\ndefine(ToolTip.TAG, ToolTip)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ declare global {
|
|
|
6
6
|
export type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
|
|
7
7
|
export type Trigger = 'hover' | 'focus' | 'click' | 'manual';
|
|
8
8
|
export declare class ToolTip extends HTMLElement {
|
|
9
|
+
static TAG: string;
|
|
9
10
|
static observedAttributes: string[];
|
|
10
11
|
private popup;
|
|
11
12
|
private arrow;
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,UAAU,EAAC,OAAO,CAAA;KACrB;CACJ;AAED,MAAM,MAAM,SAAS,GACf,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,CAAA;AAEhB,MAAM,MAAM,OAAO,GAAG,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,UAAU,EAAC,OAAO,CAAA;KACrB;CACJ;AAED,MAAM,MAAM,SAAS,GACf,KAAK,GACL,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,WAAW,GACX,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,MAAM,GACN,YAAY,GACZ,UAAU,CAAA;AAEhB,MAAM,MAAM,OAAO,GAAG,OAAO,GAAC,OAAO,GAAC,OAAO,GAAC,QAAQ,CAAA;AAEtD,qBAAa,OAAQ,SAAQ,WAAW;IACpC,MAAM,CAAC,GAAG,SAAa;IACvB,MAAM,CAAC,kBAAkB,WACmB;IAE5C,OAAO,CAAC,KAAK,CAA2B;IACxC,OAAO,CAAC,KAAK,CAA2B;IACxC,OAAO,CAAC,MAAM,CAAwB;IAEtC,OAAO,CAAC,KAAK,CAAQ;IACrB,OAAO,CAAC,SAAS,CAAQ;IACzB,OAAO,CAAC,YAAY,CAAmB;IAEvC,uCAAuC;IACvC,IAAI,OAAO,IAAI,MAAM,CAEpB;IAED,IAAI,OAAO,CAAE,KAAK,EAAC,MAAM,EAExB;IAED,4EAA4E;IAC5E,IAAI,SAAS,IAAI,SAAS,CAEzB;IAED,IAAI,SAAS,CAAE,KAAK,EAAC,SAAS,EAE7B;IAED,mEAAmE;IACnE,IAAI,OAAO,IAAI,OAAO,EAAE,CAGvB;IAED,IAAI,OAAO,CAAE,KAAK,EAAC,OAAO,EAAE,GAAC,MAAM,EAMlC;IAED,uCAAuC;IACvC,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAE,KAAK,EAAC,OAAO,EAO1B;IAED,IAAI,IAAI,IAAI,OAAO,CAElB;IAED,IAAI,IAAI,CAAE,KAAK,EAAC,OAAO,EAUtB;IAED,yDAAyD;IACzD,IAAI,QAAQ,IAAI,MAAM,CAErB;IAED,IAAI,QAAQ,CAAE,KAAK,EAAC,MAAM,EAEzB;IAED,+CAA+C;IAC/C,IAAI,QAAQ,IAAI,MAAM,CAErB;IAED,IAAI,QAAQ,CAAE,KAAK,EAAC,MAAM,EAEzB;IAED,gFAAgF;IAChF,IAAI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,KAAK,CAAE,KAAK,EAAC,MAAM,EAEtB;IAED,IAAI,KAAK,IAAI,OAAO,CAEnB;IAED,IAAI,KAAK,CAAE,KAAK,EAAC,OAAO,EAMvB;IAED,iBAAiB;IA0BjB,oBAAoB;IAKpB,wBAAwB,CACpB,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,MAAM,GAAC,IAAI,EACrB,QAAQ,EAAC,MAAM,GAAC,IAAI;IA6BxB,OAAO,CAAC,WAAW;IAoBnB,OAAO,CAAC,UAAU;IAuBlB,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,gBAAgB,CAEvB;IAED,OAAO,CAAC,gBAAgB,CAEvB;IAED,OAAO,CAAC,WAAW,CAElB;IAED,OAAO,CAAC,UAAU,CAEjB;IAED,OAAO,CAAC,WAAW,CAMlB;IAED,OAAO,CAAC,aAAa,CAKpB;IAED,OAAO,CAAC,WAAW;IAsBnB,OAAO,CAAC,WAAW;IAmBnB,OAAO,CAAC,aAAa;IAiIrB,OAAO,CAAC,mBAAmB;IA8D3B;;OAEG;IACH,IAAI;IAeJ;;OAEG;IACH,IAAI;CAOP"}
|
package/dist/index.js
CHANGED
|
@@ -5,6 +5,7 @@ class ToolTip extends HTMLElement {
|
|
|
5
5
|
static {
|
|
6
6
|
__name(this, "ToolTip");
|
|
7
7
|
}
|
|
8
|
+
static TAG = "tool-tip";
|
|
8
9
|
static observedAttributes = [
|
|
9
10
|
"content",
|
|
10
11
|
"placement",
|
|
@@ -407,7 +408,7 @@ class ToolTip extends HTMLElement {
|
|
|
407
408
|
this.open = false;
|
|
408
409
|
}
|
|
409
410
|
}
|
|
410
|
-
define(
|
|
411
|
+
define(ToolTip.TAG, ToolTip);
|
|
411
412
|
export {
|
|
412
413
|
ToolTip
|
|
413
414
|
};
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { define } from '@substrate-system/web-component/util'\n\n// for document.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tool-tip':ToolTip\n }\n}\n\nexport type Placement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n\nexport type Trigger = 'hover' | 'focus' | 'click' | 'manual'\n\nexport class ToolTip extends HTMLElement {\n static observedAttributes = ['content', 'placement', 'disabled',\n 'open', 'distance', 'skidding', 'delay']\n\n private popup: HTMLDivElement | null = null\n private arrow: HTMLDivElement | null = null\n private target: HTMLElement | null = null\n\n private _open = false\n private _disabled = false\n private _showTimeout:number|null = null\n\n /** The text content of the tooltip. */\n get content ():string {\n return this.getAttribute('content') || ''\n }\n\n set content (value:string) {\n this.setAttribute('content', value)\n }\n\n /** Where to place the tooltip relative to the target. Defaults to 'top'. */\n get placement ():Placement {\n return (this.getAttribute('placement') as Placement) || 'top'\n }\n\n set placement (value:Placement) {\n this.setAttribute('placement', value)\n }\n\n /** Space-separated list of triggers. Defaults to 'hover focus'. */\n get trigger ():Trigger[] {\n const attr = this.getAttribute('trigger') || 'hover focus'\n return attr.split(' ').filter(Boolean) as Trigger[]\n }\n\n set trigger (value:Trigger[]|string) {\n if (Array.isArray(value)) {\n this.setAttribute('trigger', value.join(' '))\n } else {\n this.setAttribute('trigger', value)\n }\n }\n\n /** Whether the tooltip is disabled. */\n get disabled ():boolean {\n return this._disabled\n }\n\n set disabled (value:boolean) {\n this._disabled = value\n if (value) {\n this.setAttribute('disabled', '')\n } else {\n this.removeAttribute('disabled')\n }\n }\n\n get open ():boolean {\n return this._open\n }\n\n set open (value:boolean) {\n if (this._disabled) return\n const wasOpen = this._open\n this._open = value\n\n if (value && !wasOpen) {\n this.showTooltip()\n } else if (!value && wasOpen) {\n this.hideTooltip()\n }\n }\n\n /** Distance in pixels from the target. Defaults to 8. */\n get distance ():number {\n return parseInt(this.getAttribute('distance') || '8', 10)\n }\n\n set distance (value:number) {\n this.setAttribute('distance', String(value))\n }\n\n /** Lateral offset in pixels. Defaults to 0. */\n get skidding ():number {\n return parseInt(this.getAttribute('skidding') || '0', 10)\n }\n\n set skidding (value:number) {\n this.setAttribute('skidding', String(value))\n }\n\n /** Delay in milliseconds before showing the tooltip on hover. Defaults to 0. */\n get delay ():number {\n return parseInt(this.getAttribute('delay') || '0', 10)\n }\n\n set delay (value:number) {\n this.setAttribute('delay', String(value))\n }\n\n get hoist ():boolean {\n return this.hasAttribute('hoist')\n }\n\n set hoist (value:boolean) {\n if (value) {\n this.setAttribute('hoist', '')\n } else {\n this.removeAttribute('hoist')\n }\n }\n\n connectedCallback () {\n // Use display: contents so the tooltip doesn't affect layout\n this.style.display = 'contents'\n\n // Find the target element (first child element)\n this.target = this.firstElementChild as HTMLElement\n\n if (!this.target) {\n console.warn('tool-tip: No target element found. ' +\n 'Add a child element.')\n return\n }\n\n // Create the popup element\n this.createPopup()\n\n // Bind event handlers\n this.bindEvents()\n\n // Check if open attribute is set\n if (this.hasAttribute('open')) {\n this._open = true\n this.showTooltip()\n }\n }\n\n disconnectedCallback () {\n this.unbindEvents()\n this.popup?.remove()\n }\n\n attributeChangedCallback (\n name:string,\n _oldValue:string|null,\n newValue:string|null\n ) {\n if (name === 'content' && this.popup) {\n const body = this.popup.querySelector('.body')\n if (body) {\n body.textContent = newValue || ''\n }\n }\n\n if (name === 'placement' && this._open) {\n this.positionPopup()\n }\n\n if (name === 'disabled') {\n this._disabled = newValue !== null\n if (this._disabled && this._open) {\n this.hide()\n }\n }\n\n if (name === 'open') {\n this.open = newValue !== null\n }\n\n if ((name === 'distance' || name === 'skidding') && this._open) {\n this.positionPopup()\n }\n }\n\n private createPopup () {\n this.popup = document.createElement('div')\n this.popup.className = 'popup'\n this.popup.setAttribute('role', 'tooltip')\n this.popup.setAttribute('aria-hidden', 'true')\n this.popup.innerHTML = `\n <div class=\"body\">${this.content}</div>\n <div class=\"arrow\"></div>\n `\n\n this.arrow = this.popup.querySelector('.arrow')\n\n // Append to body if hoisted, otherwise to this element's parent\n if (this.hoist) {\n document.body.appendChild(this.popup)\n } else {\n this.appendChild(this.popup)\n }\n }\n\n private bindEvents () {\n if (!this.target) return\n\n const triggers = this.trigger\n\n if (triggers.includes('hover')) {\n this.target.addEventListener('mouseenter', this.handleMouseEnter)\n this.target.addEventListener('mouseleave', this.handleMouseLeave)\n }\n\n if (triggers.includes('focus')) {\n this.target.addEventListener('focus', this.handleFocus)\n this.target.addEventListener('blur', this.handleBlur)\n }\n\n if (triggers.includes('click')) {\n this.target.addEventListener('click', this.handleClick)\n }\n\n // Add keyboard support\n this.target.addEventListener('keydown', this.handleKeyDown)\n }\n\n private unbindEvents () {\n if (!this.target) return\n\n this.target.removeEventListener('mouseenter', this.handleMouseEnter)\n this.target.removeEventListener('mouseleave', this.handleMouseLeave)\n this.target.removeEventListener('blur', this.handleBlur)\n this.target.removeEventListener('click', this.handleClick)\n this.target.removeEventListener('keydown', this.handleKeyDown)\n }\n\n private handleMouseEnter = () => {\n this.show()\n }\n\n private handleMouseLeave = () => {\n this.hide()\n }\n\n private handleFocus = () => {\n this.show()\n }\n\n private handleBlur = () => {\n this.hide()\n }\n\n private handleClick = () => {\n if (this._open) {\n this.hide()\n } else {\n this.show()\n }\n }\n\n private handleKeyDown = (event:KeyboardEvent) => {\n // Close tooltip on Escape\n if (event.key === 'Escape' && this._open) {\n this.hide()\n }\n }\n\n private showTooltip () {\n if (!this.popup || this._disabled) return\n\n // Emit show event\n const showEvent = new CustomEvent('tool-tip-show', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(showEvent)) return\n\n this.popup.classList.add('visible')\n this.popup.setAttribute('aria-hidden', 'false')\n\n // Position the popup\n this.positionPopup()\n\n // Emit after-show event\n this.dispatchEvent(new CustomEvent('tool-tip-after-show', {\n bubbles: true\n }))\n }\n\n private hideTooltip () {\n if (!this.popup) return\n\n // Emit hide event\n const hideEvent = new CustomEvent('tool-tip-hide', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(hideEvent)) return\n\n this.popup.classList.remove('visible')\n this.popup.setAttribute('aria-hidden', 'true')\n\n // Emit after-hide event\n this.dispatchEvent(new CustomEvent('tool-tip-after-hide', {\n bubbles: true\n }))\n }\n\n private positionPopup () {\n if (!this.popup || !this.target) return\n\n const targetRect = this.target.getBoundingClientRect()\n const popupRect = this.popup.getBoundingClientRect()\n const arrowSize = 8\n\n let top = 0\n let left = 0\n let arrowTop = ''\n let arrowLeft = ''\n let arrowTransform = ''\n\n const distance = this.distance\n const skidding = this.skidding\n const placement = this.getOptimalPlacement(targetRect, popupRect)\n\n // Set data attribute for CSS styling\n this.popup.dataset.placement = placement\n\n switch (placement) {\n case 'top':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '100%'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-start':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + skidding\n arrowTop = '100%'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-end':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '100%'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%)'\n break\n case 'bottom':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '0'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-start':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + skidding\n arrowTop = '0'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-end':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '0'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'left':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = '50%'\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-start':\n top = targetRect.top + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'right':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = '50%'\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-start':\n top = targetRect.top + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n }\n\n // Adjust for scroll position\n if (this.hoist) {\n top += window.scrollY\n left += window.scrollX\n }\n\n // Apply position\n this.popup.style.top = `${top}px`\n this.popup.style.left = `${left}px`\n\n // Position the arrow\n if (this.arrow) {\n this.arrow.style.top = arrowTop\n this.arrow.style.left = arrowLeft\n this.arrow.style.transform = arrowTransform\n }\n }\n\n private getOptimalPlacement (\n targetRect:DOMRect,\n popupRect:DOMRect\n ):Placement {\n const placement = this.placement\n const viewportWidth = window.innerWidth\n const viewportHeight = window.innerHeight\n const distance = this.distance\n const arrowSize = 8\n\n // Check if the preferred placement fits\n const fits = {\n top: targetRect.top - popupRect.height - distance - arrowSize > 0,\n bottom: (targetRect.bottom + popupRect.height + distance +\n arrowSize < viewportHeight),\n left: targetRect.left - popupRect.width - distance - arrowSize > 0,\n right: (targetRect.right + popupRect.width + distance +\n arrowSize < viewportWidth),\n }\n\n // Get the base direction from the placement\n const baseDirection = placement.split('-')[0] as 'top' |\n 'bottom' |\n 'left' |\n 'right'\n\n // If preferred placement fits, use it\n if (fits[baseDirection]) {\n return placement\n }\n\n // Find the best alternative\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n }\n\n const opposite = opposites[baseDirection] as\n 'top' | 'bottom' | 'left' | 'right'\n if (fits[opposite]) {\n // Return the opposite with the same alignment\n const alignment = (placement.includes('-') ?\n placement.split('-')[1] :\n '')\n return (alignment ?\n `${opposite}-${alignment}` :\n opposite) as Placement\n }\n\n // Fall back to a direction that fits\n for (const dir of ['top', 'bottom', 'left', 'right'] as const) {\n if (fits[dir]) {\n return dir\n }\n }\n\n // If nothing fits, return original placement\n return placement\n }\n\n /**\n * Programmatically show the tooltip\n */\n show () {\n if (this._disabled || this._open) return\n\n const delay = this.delay\n if (delay > 0) {\n if (this._showTimeout) return\n this._showTimeout = window.setTimeout(() => {\n this.open = true\n this._showTimeout = null\n }, delay)\n } else {\n this.open = true\n }\n }\n\n /**\n * Programmatically hide the tooltip\n */\n hide () {\n if (this._showTimeout) {\n window.clearTimeout(this._showTimeout)\n this._showTimeout = null\n }\n this.open = false\n }\n}\n\ndefine('tool-tip', ToolTip)\n"],
|
|
5
|
-
"mappings": ";;AAAA,SAAS,cAAc;AAyBhB,MAAM,gBAAgB,YAAY;AAAA,EAzBzC,OAyByC;AAAA;AAAA;AAAA,EACrC,OAAO,qBAAqB;AAAA,IAAC;AAAA,IAAW;AAAA,IAAa;AAAA,IACjD;AAAA,IAAQ;AAAA,IAAY;AAAA,IAAY;AAAA,EAAO;AAAA,EAEnC,
|
|
4
|
+
"sourcesContent": ["import { define } from '@substrate-system/web-component/util'\n\n// for document.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tool-tip':ToolTip\n }\n}\n\nexport type Placement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n\nexport type Trigger = 'hover'|'focus'|'click'|'manual'\n\nexport class ToolTip extends HTMLElement {\n static TAG = 'tool-tip'\n static observedAttributes = ['content', 'placement', 'disabled',\n 'open', 'distance', 'skidding', 'delay']\n\n private popup:HTMLDivElement|null = null\n private arrow:HTMLDivElement|null = null\n private target:HTMLElement|null = null\n\n private _open = false\n private _disabled = false\n private _showTimeout:number|null = null\n\n /** The text content of the tooltip. */\n get content ():string {\n return this.getAttribute('content') || ''\n }\n\n set content (value:string) {\n this.setAttribute('content', value)\n }\n\n /** Where to place the tooltip relative to the target. Defaults to 'top'. */\n get placement ():Placement {\n return (this.getAttribute('placement') as Placement) || 'top'\n }\n\n set placement (value:Placement) {\n this.setAttribute('placement', value)\n }\n\n /** Space-separated list of triggers. Defaults to 'hover focus'. */\n get trigger ():Trigger[] {\n const attr = this.getAttribute('trigger') || 'hover focus'\n return attr.split(' ').filter(Boolean) as Trigger[]\n }\n\n set trigger (value:Trigger[]|string) {\n if (Array.isArray(value)) {\n this.setAttribute('trigger', value.join(' '))\n } else {\n this.setAttribute('trigger', value)\n }\n }\n\n /** Whether the tooltip is disabled. */\n get disabled ():boolean {\n return this._disabled\n }\n\n set disabled (value:boolean) {\n this._disabled = value\n if (value) {\n this.setAttribute('disabled', '')\n } else {\n this.removeAttribute('disabled')\n }\n }\n\n get open ():boolean {\n return this._open\n }\n\n set open (value:boolean) {\n if (this._disabled) return\n const wasOpen = this._open\n this._open = value\n\n if (value && !wasOpen) {\n this.showTooltip()\n } else if (!value && wasOpen) {\n this.hideTooltip()\n }\n }\n\n /** Distance in pixels from the target. Defaults to 8. */\n get distance ():number {\n return parseInt(this.getAttribute('distance') || '8', 10)\n }\n\n set distance (value:number) {\n this.setAttribute('distance', String(value))\n }\n\n /** Lateral offset in pixels. Defaults to 0. */\n get skidding ():number {\n return parseInt(this.getAttribute('skidding') || '0', 10)\n }\n\n set skidding (value:number) {\n this.setAttribute('skidding', String(value))\n }\n\n /** Delay in milliseconds before showing the tooltip on hover. Defaults to 0. */\n get delay ():number {\n return parseInt(this.getAttribute('delay') || '0', 10)\n }\n\n set delay (value:number) {\n this.setAttribute('delay', String(value))\n }\n\n get hoist ():boolean {\n return this.hasAttribute('hoist')\n }\n\n set hoist (value:boolean) {\n if (value) {\n this.setAttribute('hoist', '')\n } else {\n this.removeAttribute('hoist')\n }\n }\n\n connectedCallback () {\n // Use display: contents so the tooltip doesn't affect layout\n this.style.display = 'contents'\n\n // Find the target element (first child element)\n this.target = this.firstElementChild as HTMLElement\n\n if (!this.target) {\n console.warn('tool-tip: No target element found. ' +\n 'Add a child element.')\n return\n }\n\n // Create the popup element\n this.createPopup()\n\n // Bind event handlers\n this.bindEvents()\n\n // Check if open attribute is set\n if (this.hasAttribute('open')) {\n this._open = true\n this.showTooltip()\n }\n }\n\n disconnectedCallback () {\n this.unbindEvents()\n this.popup?.remove()\n }\n\n attributeChangedCallback (\n name:string,\n _oldValue:string|null,\n newValue:string|null\n ) {\n if (name === 'content' && this.popup) {\n const body = this.popup.querySelector('.body')\n if (body) {\n body.textContent = newValue || ''\n }\n }\n\n if (name === 'placement' && this._open) {\n this.positionPopup()\n }\n\n if (name === 'disabled') {\n this._disabled = newValue !== null\n if (this._disabled && this._open) {\n this.hide()\n }\n }\n\n if (name === 'open') {\n this.open = newValue !== null\n }\n\n if ((name === 'distance' || name === 'skidding') && this._open) {\n this.positionPopup()\n }\n }\n\n private createPopup () {\n this.popup = document.createElement('div')\n this.popup.className = 'popup'\n this.popup.setAttribute('role', 'tooltip')\n this.popup.setAttribute('aria-hidden', 'true')\n this.popup.innerHTML = `\n <div class=\"body\">${this.content}</div>\n <div class=\"arrow\"></div>\n `\n\n this.arrow = this.popup.querySelector('.arrow')\n\n // Append to body if hoisted, otherwise to this element's parent\n if (this.hoist) {\n document.body.appendChild(this.popup)\n } else {\n this.appendChild(this.popup)\n }\n }\n\n private bindEvents () {\n if (!this.target) return\n\n const triggers = this.trigger\n\n if (triggers.includes('hover')) {\n this.target.addEventListener('mouseenter', this.handleMouseEnter)\n this.target.addEventListener('mouseleave', this.handleMouseLeave)\n }\n\n if (triggers.includes('focus')) {\n this.target.addEventListener('focus', this.handleFocus)\n this.target.addEventListener('blur', this.handleBlur)\n }\n\n if (triggers.includes('click')) {\n this.target.addEventListener('click', this.handleClick)\n }\n\n // Add keyboard support\n this.target.addEventListener('keydown', this.handleKeyDown)\n }\n\n private unbindEvents () {\n if (!this.target) return\n\n this.target.removeEventListener('mouseenter', this.handleMouseEnter)\n this.target.removeEventListener('mouseleave', this.handleMouseLeave)\n this.target.removeEventListener('blur', this.handleBlur)\n this.target.removeEventListener('click', this.handleClick)\n this.target.removeEventListener('keydown', this.handleKeyDown)\n }\n\n private handleMouseEnter = () => {\n this.show()\n }\n\n private handleMouseLeave = () => {\n this.hide()\n }\n\n private handleFocus = () => {\n this.show()\n }\n\n private handleBlur = () => {\n this.hide()\n }\n\n private handleClick = () => {\n if (this._open) {\n this.hide()\n } else {\n this.show()\n }\n }\n\n private handleKeyDown = (event:KeyboardEvent) => {\n // Close tooltip on Escape\n if (event.key === 'Escape' && this._open) {\n this.hide()\n }\n }\n\n private showTooltip () {\n if (!this.popup || this._disabled) return\n\n // Emit show event\n const showEvent = new CustomEvent('tool-tip-show', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(showEvent)) return\n\n this.popup.classList.add('visible')\n this.popup.setAttribute('aria-hidden', 'false')\n\n // Position the popup\n this.positionPopup()\n\n // Emit after-show event\n this.dispatchEvent(new CustomEvent('tool-tip-after-show', {\n bubbles: true\n }))\n }\n\n private hideTooltip () {\n if (!this.popup) return\n\n // Emit hide event\n const hideEvent = new CustomEvent('tool-tip-hide', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(hideEvent)) return\n\n this.popup.classList.remove('visible')\n this.popup.setAttribute('aria-hidden', 'true')\n\n // Emit after-hide event\n this.dispatchEvent(new CustomEvent('tool-tip-after-hide', {\n bubbles: true\n }))\n }\n\n private positionPopup () {\n if (!this.popup || !this.target) return\n\n const targetRect = this.target.getBoundingClientRect()\n const popupRect = this.popup.getBoundingClientRect()\n const arrowSize = 8\n\n let top = 0\n let left = 0\n let arrowTop = ''\n let arrowLeft = ''\n let arrowTransform = ''\n\n const distance = this.distance\n const skidding = this.skidding\n const placement = this.getOptimalPlacement(targetRect, popupRect)\n\n // Set data attribute for CSS styling\n this.popup.dataset.placement = placement\n\n switch (placement) {\n case 'top':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '100%'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-start':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + skidding\n arrowTop = '100%'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-end':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '100%'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%)'\n break\n case 'bottom':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '0'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-start':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + skidding\n arrowTop = '0'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-end':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '0'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'left':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = '50%'\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-start':\n top = targetRect.top + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'right':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = '50%'\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-start':\n top = targetRect.top + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n }\n\n // Adjust for scroll position\n if (this.hoist) {\n top += window.scrollY\n left += window.scrollX\n }\n\n // Apply position\n this.popup.style.top = `${top}px`\n this.popup.style.left = `${left}px`\n\n // Position the arrow\n if (this.arrow) {\n this.arrow.style.top = arrowTop\n this.arrow.style.left = arrowLeft\n this.arrow.style.transform = arrowTransform\n }\n }\n\n private getOptimalPlacement (\n targetRect:DOMRect,\n popupRect:DOMRect\n ):Placement {\n const placement = this.placement\n const viewportWidth = window.innerWidth\n const viewportHeight = window.innerHeight\n const distance = this.distance\n const arrowSize = 8\n\n // Check if the preferred placement fits\n const fits = {\n top: targetRect.top - popupRect.height - distance - arrowSize > 0,\n bottom: (targetRect.bottom + popupRect.height + distance +\n arrowSize < viewportHeight),\n left: targetRect.left - popupRect.width - distance - arrowSize > 0,\n right: (targetRect.right + popupRect.width + distance +\n arrowSize < viewportWidth),\n }\n\n // Get the base direction from the placement\n const baseDirection = placement.split('-')[0] as 'top' |\n 'bottom' |\n 'left' |\n 'right'\n\n // If preferred placement fits, use it\n if (fits[baseDirection]) {\n return placement\n }\n\n // Find the best alternative\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n }\n\n const opposite = opposites[baseDirection] as\n 'top' | 'bottom' | 'left' | 'right'\n if (fits[opposite]) {\n // Return the opposite with the same alignment\n const alignment = (placement.includes('-') ?\n placement.split('-')[1] :\n '')\n return (alignment ?\n `${opposite}-${alignment}` :\n opposite) as Placement\n }\n\n // Fall back to a direction that fits\n for (const dir of ['top', 'bottom', 'left', 'right'] as const) {\n if (fits[dir]) {\n return dir\n }\n }\n\n // If nothing fits, return original placement\n return placement\n }\n\n /**\n * Programmatically show the tooltip\n */\n show () {\n if (this._disabled || this._open) return\n\n const delay = this.delay\n if (delay > 0) {\n if (this._showTimeout) return\n this._showTimeout = window.setTimeout(() => {\n this.open = true\n this._showTimeout = null\n }, delay)\n } else {\n this.open = true\n }\n }\n\n /**\n * Programmatically hide the tooltip\n */\n hide () {\n if (this._showTimeout) {\n window.clearTimeout(this._showTimeout)\n this._showTimeout = null\n }\n this.open = false\n }\n}\n\ndefine(ToolTip.TAG, ToolTip)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/index.min.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
var v=Object.defineProperty;var l=(p,t)=>v(p,"name",{value:t,configurable:!0});var E=Object.defineProperty,y=l((p,t)=>E(p,"name",{value:t,configurable:!0}),"__name");function m(p){return Object.keys(p).reduce((t,e)=>{let i=p[e];return i?typeof i=="boolean"?i?(t+` ${e}`).trim():t:Array.isArray(i)?t+` ${e}="${i.join(" ")}"`:(t+` ${e}="${i}"`).trim():t},"")}l(m,"toAttributes");y(m,"toAttributes");var
|
|
1
|
+
var v=Object.defineProperty;var l=(p,t)=>v(p,"name",{value:t,configurable:!0});var E=Object.defineProperty,y=l((p,t)=>E(p,"name",{value:t,configurable:!0}),"__name");function m(p){return Object.keys(p).reduce((t,e)=>{let i=p[e];return i?typeof i=="boolean"?i?(t+` ${e}`).trim():t:Array.isArray(i)?t+` ${e}="${i.join(" ")}"`:(t+` ${e}="${i}"`).trim():t},"")}l(m,"toAttributes");y(m,"toAttributes");var A=Object.defineProperty,f=l((p,t)=>A(p,"name",{value:t,configurable:!0}),"__name");function w(p){return document.createElement(p).constructor!==window.HTMLElement}l(w,"isRegistered");f(w,"isRegistered");function g(p,t){window&&"customElements"in window&&(w(p)||window.customElements.define(p,t))}l(g,"define");f(g,"define");var M=document.querySelector.bind(document),P=document.querySelectorAll.bind(document);var b=class extends HTMLElement{static{l(this,"ToolTip")}static TAG="tool-tip";static observedAttributes=["content","placement","disabled","open","distance","skidding","delay"];popup=null;arrow=null;target=null;_open=!1;_disabled=!1;_showTimeout=null;get content(){return this.getAttribute("content")||""}set content(t){this.setAttribute("content",t)}get placement(){return this.getAttribute("placement")||"top"}set placement(t){this.setAttribute("placement",t)}get trigger(){return(this.getAttribute("trigger")||"hover focus").split(" ").filter(Boolean)}set trigger(t){Array.isArray(t)?this.setAttribute("trigger",t.join(" ")):this.setAttribute("trigger",t)}get disabled(){return this._disabled}set disabled(t){this._disabled=t,t?this.setAttribute("disabled",""):this.removeAttribute("disabled")}get open(){return this._open}set open(t){if(this._disabled)return;let e=this._open;this._open=t,t&&!e?this.showTooltip():!t&&e&&this.hideTooltip()}get distance(){return parseInt(this.getAttribute("distance")||"8",10)}set distance(t){this.setAttribute("distance",String(t))}get skidding(){return parseInt(this.getAttribute("skidding")||"0",10)}set skidding(t){this.setAttribute("skidding",String(t))}get delay(){return parseInt(this.getAttribute("delay")||"0",10)}set delay(t){this.setAttribute("delay",String(t))}get hoist(){return this.hasAttribute("hoist")}set hoist(t){t?this.setAttribute("hoist",""):this.removeAttribute("hoist")}connectedCallback(){if(this.style.display="contents",this.target=this.firstElementChild,!this.target){console.warn("tool-tip: No target element found. Add a child element.");return}this.createPopup(),this.bindEvents(),this.hasAttribute("open")&&(this._open=!0,this.showTooltip())}disconnectedCallback(){this.unbindEvents(),this.popup?.remove()}attributeChangedCallback(t,e,i){if(t==="content"&&this.popup){let s=this.popup.querySelector(".body");s&&(s.textContent=i||"")}t==="placement"&&this._open&&this.positionPopup(),t==="disabled"&&(this._disabled=i!==null,this._disabled&&this._open&&this.hide()),t==="open"&&(this.open=i!==null),(t==="distance"||t==="skidding")&&this._open&&this.positionPopup()}createPopup(){this.popup=document.createElement("div"),this.popup.className="popup",this.popup.setAttribute("role","tooltip"),this.popup.setAttribute("aria-hidden","true"),this.popup.innerHTML=`
|
|
2
2
|
<div class="body">${this.content}</div>
|
|
3
3
|
<div class="arrow"></div>
|
|
4
|
-
`,this.arrow=this.popup.querySelector(".arrow"),this.hoist?document.body.appendChild(this.popup):this.appendChild(this.popup)}bindEvents(){if(!this.target)return;let t=this.trigger;t.includes("hover")&&(this.target.addEventListener("mouseenter",this.handleMouseEnter),this.target.addEventListener("mouseleave",this.handleMouseLeave)),t.includes("focus")&&(this.target.addEventListener("focus",this.handleFocus),this.target.addEventListener("blur",this.handleBlur)),t.includes("click")&&this.target.addEventListener("click",this.handleClick),this.target.addEventListener("keydown",this.handleKeyDown)}unbindEvents(){this.target&&(this.target.removeEventListener("mouseenter",this.handleMouseEnter),this.target.removeEventListener("mouseleave",this.handleMouseLeave),this.target.removeEventListener("blur",this.handleBlur),this.target.removeEventListener("click",this.handleClick),this.target.removeEventListener("keydown",this.handleKeyDown))}handleMouseEnter=l(()=>{this.show()},"handleMouseEnter");handleMouseLeave=l(()=>{this.hide()},"handleMouseLeave");handleFocus=l(()=>{this.show()},"handleFocus");handleBlur=l(()=>{this.hide()},"handleBlur");handleClick=l(()=>{this._open?this.hide():this.show()},"handleClick");handleKeyDown=l(t=>{t.key==="Escape"&&this._open&&this.hide()},"handleKeyDown");showTooltip(){if(!this.popup||this._disabled)return;let t=new CustomEvent("tool-tip-show",{bubbles:!0,cancelable:!0});this.dispatchEvent(t)&&(this.popup.classList.add("visible"),this.popup.setAttribute("aria-hidden","false"),this.positionPopup(),this.dispatchEvent(new CustomEvent("tool-tip-after-show",{bubbles:!0})))}hideTooltip(){if(!this.popup)return;let t=new CustomEvent("tool-tip-hide",{bubbles:!0,cancelable:!0});this.dispatchEvent(t)&&(this.popup.classList.remove("visible"),this.popup.setAttribute("aria-hidden","true"),this.dispatchEvent(new CustomEvent("tool-tip-after-hide",{bubbles:!0})))}positionPopup(){if(!this.popup||!this.target)return;let t=this.target.getBoundingClientRect(),e=this.popup.getBoundingClientRect(),i=8,s=0,a=0,r="",n="",o="",h=this.distance,d=this.skidding,u=this.getOptimalPlacement(t,e);switch(this.popup.dataset.placement=u,u){case"top":s=t.top-e.height-h-i,a=t.left+t.width/2-e.width/2+d,r="100%",n="50%",o="translateX(-50%)";break;case"top-start":s=t.top-e.height-h-i,a=t.left+d,r="100%",n=`${Math.min(24,e.width/2)}px`,o="translateX(-50%)";break;case"top-end":s=t.top-e.height-h-i,a=t.right-e.width+d,r="100%",n=`calc(100% - ${Math.min(24,e.width/2)}px)`,o="translateX(-50%)";break;case"bottom":s=t.bottom+h+i,a=t.left+t.width/2-e.width/2+d,r="0",n="50%",o="translateX(-50%) translateY(-100%)";break;case"bottom-start":s=t.bottom+h+i,a=t.left+d,r="0",n=`${Math.min(24,e.width/2)}px`,o="translateX(-50%) translateY(-100%)";break;case"bottom-end":s=t.bottom+h+i,a=t.right-e.width+d,r="0",n=`calc(100% - ${Math.min(24,e.width/2)}px)`,o="translateX(-50%) translateY(-100%)";break;case"left":s=t.top+t.height/2-e.height/2+d,a=t.left-e.width-h-i,r="50%",n="100%",o="translateY(-50%)";break;case"left-start":s=t.top+d,a=t.left-e.width-h-i,r=`${Math.min(16,e.height/2)}px`,n="100%",o="translateY(-50%)";break;case"left-end":s=t.bottom-e.height+d,a=t.left-e.width-h-i,r=`calc(100% - ${Math.min(16,e.height/2)}px)`,n="100%",o="translateY(-50%)";break;case"right":s=t.top+t.height/2-e.height/2+d,a=t.right+h+i,r="50%",n="0",o="translateY(-50%) translateX(-100%)";break;case"right-start":s=t.top+d,a=t.right+h+i,r=`${Math.min(16,e.height/2)}px`,n="0",o="translateY(-50%) translateX(-100%)";break;case"right-end":s=t.bottom-e.height+d,a=t.right+h+i,r=`calc(100% - ${Math.min(16,e.height/2)}px)`,n="0",o="translateY(-50%) translateX(-100%)";break}this.hoist&&(s+=window.scrollY,a+=window.scrollX),this.popup.style.top=`${s}px`,this.popup.style.left=`${a}px`,this.arrow&&(this.arrow.style.top=r,this.arrow.style.left=n,this.arrow.style.transform=o)}getOptimalPlacement(t,e){let i=this.placement,s=window.innerWidth,a=window.innerHeight,r=this.distance,n=8,o={top:t.top-e.height-r-n>0,bottom:t.bottom+e.height+r+n<a,left:t.left-e.width-r-n>0,right:t.right+e.width+r+n<s},h=i.split("-")[0];if(o[h])return i;let u={top:"bottom",bottom:"top",left:"right",right:"left"}[h];if(o[u]){let c=i.includes("-")?i.split("-")[1]:"";return c?`${u}-${c}`:u}for(let c of["top","bottom","left","right"])if(o[c])return c;return i}show(){if(this._disabled||this._open)return;let t=this.delay;if(t>0){if(this._showTimeout)return;this._showTimeout=window.setTimeout(()=>{this.open=!0,this._showTimeout=null},t)}else this.open=!0}hide(){this._showTimeout&&(window.clearTimeout(this._showTimeout),this._showTimeout=null),this.open=!1}};b
|
|
4
|
+
`,this.arrow=this.popup.querySelector(".arrow"),this.hoist?document.body.appendChild(this.popup):this.appendChild(this.popup)}bindEvents(){if(!this.target)return;let t=this.trigger;t.includes("hover")&&(this.target.addEventListener("mouseenter",this.handleMouseEnter),this.target.addEventListener("mouseleave",this.handleMouseLeave)),t.includes("focus")&&(this.target.addEventListener("focus",this.handleFocus),this.target.addEventListener("blur",this.handleBlur)),t.includes("click")&&this.target.addEventListener("click",this.handleClick),this.target.addEventListener("keydown",this.handleKeyDown)}unbindEvents(){this.target&&(this.target.removeEventListener("mouseenter",this.handleMouseEnter),this.target.removeEventListener("mouseleave",this.handleMouseLeave),this.target.removeEventListener("blur",this.handleBlur),this.target.removeEventListener("click",this.handleClick),this.target.removeEventListener("keydown",this.handleKeyDown))}handleMouseEnter=l(()=>{this.show()},"handleMouseEnter");handleMouseLeave=l(()=>{this.hide()},"handleMouseLeave");handleFocus=l(()=>{this.show()},"handleFocus");handleBlur=l(()=>{this.hide()},"handleBlur");handleClick=l(()=>{this._open?this.hide():this.show()},"handleClick");handleKeyDown=l(t=>{t.key==="Escape"&&this._open&&this.hide()},"handleKeyDown");showTooltip(){if(!this.popup||this._disabled)return;let t=new CustomEvent("tool-tip-show",{bubbles:!0,cancelable:!0});this.dispatchEvent(t)&&(this.popup.classList.add("visible"),this.popup.setAttribute("aria-hidden","false"),this.positionPopup(),this.dispatchEvent(new CustomEvent("tool-tip-after-show",{bubbles:!0})))}hideTooltip(){if(!this.popup)return;let t=new CustomEvent("tool-tip-hide",{bubbles:!0,cancelable:!0});this.dispatchEvent(t)&&(this.popup.classList.remove("visible"),this.popup.setAttribute("aria-hidden","true"),this.dispatchEvent(new CustomEvent("tool-tip-after-hide",{bubbles:!0})))}positionPopup(){if(!this.popup||!this.target)return;let t=this.target.getBoundingClientRect(),e=this.popup.getBoundingClientRect(),i=8,s=0,a=0,r="",n="",o="",h=this.distance,d=this.skidding,u=this.getOptimalPlacement(t,e);switch(this.popup.dataset.placement=u,u){case"top":s=t.top-e.height-h-i,a=t.left+t.width/2-e.width/2+d,r="100%",n="50%",o="translateX(-50%)";break;case"top-start":s=t.top-e.height-h-i,a=t.left+d,r="100%",n=`${Math.min(24,e.width/2)}px`,o="translateX(-50%)";break;case"top-end":s=t.top-e.height-h-i,a=t.right-e.width+d,r="100%",n=`calc(100% - ${Math.min(24,e.width/2)}px)`,o="translateX(-50%)";break;case"bottom":s=t.bottom+h+i,a=t.left+t.width/2-e.width/2+d,r="0",n="50%",o="translateX(-50%) translateY(-100%)";break;case"bottom-start":s=t.bottom+h+i,a=t.left+d,r="0",n=`${Math.min(24,e.width/2)}px`,o="translateX(-50%) translateY(-100%)";break;case"bottom-end":s=t.bottom+h+i,a=t.right-e.width+d,r="0",n=`calc(100% - ${Math.min(24,e.width/2)}px)`,o="translateX(-50%) translateY(-100%)";break;case"left":s=t.top+t.height/2-e.height/2+d,a=t.left-e.width-h-i,r="50%",n="100%",o="translateY(-50%)";break;case"left-start":s=t.top+d,a=t.left-e.width-h-i,r=`${Math.min(16,e.height/2)}px`,n="100%",o="translateY(-50%)";break;case"left-end":s=t.bottom-e.height+d,a=t.left-e.width-h-i,r=`calc(100% - ${Math.min(16,e.height/2)}px)`,n="100%",o="translateY(-50%)";break;case"right":s=t.top+t.height/2-e.height/2+d,a=t.right+h+i,r="50%",n="0",o="translateY(-50%) translateX(-100%)";break;case"right-start":s=t.top+d,a=t.right+h+i,r=`${Math.min(16,e.height/2)}px`,n="0",o="translateY(-50%) translateX(-100%)";break;case"right-end":s=t.bottom-e.height+d,a=t.right+h+i,r=`calc(100% - ${Math.min(16,e.height/2)}px)`,n="0",o="translateY(-50%) translateX(-100%)";break}this.hoist&&(s+=window.scrollY,a+=window.scrollX),this.popup.style.top=`${s}px`,this.popup.style.left=`${a}px`,this.arrow&&(this.arrow.style.top=r,this.arrow.style.left=n,this.arrow.style.transform=o)}getOptimalPlacement(t,e){let i=this.placement,s=window.innerWidth,a=window.innerHeight,r=this.distance,n=8,o={top:t.top-e.height-r-n>0,bottom:t.bottom+e.height+r+n<a,left:t.left-e.width-r-n>0,right:t.right+e.width+r+n<s},h=i.split("-")[0];if(o[h])return i;let u={top:"bottom",bottom:"top",left:"right",right:"left"}[h];if(o[u]){let c=i.includes("-")?i.split("-")[1]:"";return c?`${u}-${c}`:u}for(let c of["top","bottom","left","right"])if(o[c])return c;return i}show(){if(this._disabled||this._open)return;let t=this.delay;if(t>0){if(this._showTimeout)return;this._showTimeout=window.setTimeout(()=>{this.open=!0,this._showTimeout=null},t)}else this.open=!0}hide(){this._showTimeout&&(window.clearTimeout(this._showTimeout),this._showTimeout=null),this.open=!1}};g(b.TAG,b);export{b as ToolTip};
|
|
5
5
|
//# sourceMappingURL=index.min.js.map
|
package/dist/index.min.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../node_modules/@substrate-system/web-component/src/attributes.ts", "../node_modules/@substrate-system/web-component/src/util.ts", "../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["export type Attrs = Record<string, undefined|null|string|number|boolean|(string|number)[]>\n\n/**\n * Transform an object into an HTML attributes string. The object should be\n * like `{ attributeName: value }`.\n *\n * @param attrs An object for the attributes.\n * @returns {string} A string suitable for use as HTML attributes.\n */\nexport function toAttributes (attrs:Attrs):string {\n return Object.keys(attrs).reduce((acc, k) => {\n const value = attrs[k]\n if (!value) return acc\n\n if (typeof value === 'boolean') {\n if (value) return (acc + ` ${k}`).trim()\n return acc\n }\n\n if (Array.isArray(value)) {\n return (acc + ` ${k}=\"${value.join(' ')}\"`)\n }\n\n return (acc + ` ${k}=\"${value}\"`).trim()\n }, '')\n}\n", "export { toAttributes } from './attributes.js'\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n\nexport const qs = document.querySelector.bind(document)\nexport const qsa = document.querySelectorAll.bind(document)\n", "import { define } from '@substrate-system/web-component/util'\n\n// for document.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tool-tip':ToolTip\n }\n}\n\nexport type Placement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n\nexport type Trigger = 'hover' | 'focus' | 'click' | 'manual'\n\nexport class ToolTip extends HTMLElement {\n static observedAttributes = ['content', 'placement', 'disabled',\n 'open', 'distance', 'skidding', 'delay']\n\n private popup: HTMLDivElement | null = null\n private arrow: HTMLDivElement | null = null\n private target: HTMLElement | null = null\n\n private _open = false\n private _disabled = false\n private _showTimeout:number|null = null\n\n /** The text content of the tooltip. */\n get content ():string {\n return this.getAttribute('content') || ''\n }\n\n set content (value:string) {\n this.setAttribute('content', value)\n }\n\n /** Where to place the tooltip relative to the target. Defaults to 'top'. */\n get placement ():Placement {\n return (this.getAttribute('placement') as Placement) || 'top'\n }\n\n set placement (value:Placement) {\n this.setAttribute('placement', value)\n }\n\n /** Space-separated list of triggers. Defaults to 'hover focus'. */\n get trigger ():Trigger[] {\n const attr = this.getAttribute('trigger') || 'hover focus'\n return attr.split(' ').filter(Boolean) as Trigger[]\n }\n\n set trigger (value:Trigger[]|string) {\n if (Array.isArray(value)) {\n this.setAttribute('trigger', value.join(' '))\n } else {\n this.setAttribute('trigger', value)\n }\n }\n\n /** Whether the tooltip is disabled. */\n get disabled ():boolean {\n return this._disabled\n }\n\n set disabled (value:boolean) {\n this._disabled = value\n if (value) {\n this.setAttribute('disabled', '')\n } else {\n this.removeAttribute('disabled')\n }\n }\n\n get open ():boolean {\n return this._open\n }\n\n set open (value:boolean) {\n if (this._disabled) return\n const wasOpen = this._open\n this._open = value\n\n if (value && !wasOpen) {\n this.showTooltip()\n } else if (!value && wasOpen) {\n this.hideTooltip()\n }\n }\n\n /** Distance in pixels from the target. Defaults to 8. */\n get distance ():number {\n return parseInt(this.getAttribute('distance') || '8', 10)\n }\n\n set distance (value:number) {\n this.setAttribute('distance', String(value))\n }\n\n /** Lateral offset in pixels. Defaults to 0. */\n get skidding ():number {\n return parseInt(this.getAttribute('skidding') || '0', 10)\n }\n\n set skidding (value:number) {\n this.setAttribute('skidding', String(value))\n }\n\n /** Delay in milliseconds before showing the tooltip on hover. Defaults to 0. */\n get delay ():number {\n return parseInt(this.getAttribute('delay') || '0', 10)\n }\n\n set delay (value:number) {\n this.setAttribute('delay', String(value))\n }\n\n get hoist ():boolean {\n return this.hasAttribute('hoist')\n }\n\n set hoist (value:boolean) {\n if (value) {\n this.setAttribute('hoist', '')\n } else {\n this.removeAttribute('hoist')\n }\n }\n\n connectedCallback () {\n // Use display: contents so the tooltip doesn't affect layout\n this.style.display = 'contents'\n\n // Find the target element (first child element)\n this.target = this.firstElementChild as HTMLElement\n\n if (!this.target) {\n console.warn('tool-tip: No target element found. ' +\n 'Add a child element.')\n return\n }\n\n // Create the popup element\n this.createPopup()\n\n // Bind event handlers\n this.bindEvents()\n\n // Check if open attribute is set\n if (this.hasAttribute('open')) {\n this._open = true\n this.showTooltip()\n }\n }\n\n disconnectedCallback () {\n this.unbindEvents()\n this.popup?.remove()\n }\n\n attributeChangedCallback (\n name:string,\n _oldValue:string|null,\n newValue:string|null\n ) {\n if (name === 'content' && this.popup) {\n const body = this.popup.querySelector('.body')\n if (body) {\n body.textContent = newValue || ''\n }\n }\n\n if (name === 'placement' && this._open) {\n this.positionPopup()\n }\n\n if (name === 'disabled') {\n this._disabled = newValue !== null\n if (this._disabled && this._open) {\n this.hide()\n }\n }\n\n if (name === 'open') {\n this.open = newValue !== null\n }\n\n if ((name === 'distance' || name === 'skidding') && this._open) {\n this.positionPopup()\n }\n }\n\n private createPopup () {\n this.popup = document.createElement('div')\n this.popup.className = 'popup'\n this.popup.setAttribute('role', 'tooltip')\n this.popup.setAttribute('aria-hidden', 'true')\n this.popup.innerHTML = `\n <div class=\"body\">${this.content}</div>\n <div class=\"arrow\"></div>\n `\n\n this.arrow = this.popup.querySelector('.arrow')\n\n // Append to body if hoisted, otherwise to this element's parent\n if (this.hoist) {\n document.body.appendChild(this.popup)\n } else {\n this.appendChild(this.popup)\n }\n }\n\n private bindEvents () {\n if (!this.target) return\n\n const triggers = this.trigger\n\n if (triggers.includes('hover')) {\n this.target.addEventListener('mouseenter', this.handleMouseEnter)\n this.target.addEventListener('mouseleave', this.handleMouseLeave)\n }\n\n if (triggers.includes('focus')) {\n this.target.addEventListener('focus', this.handleFocus)\n this.target.addEventListener('blur', this.handleBlur)\n }\n\n if (triggers.includes('click')) {\n this.target.addEventListener('click', this.handleClick)\n }\n\n // Add keyboard support\n this.target.addEventListener('keydown', this.handleKeyDown)\n }\n\n private unbindEvents () {\n if (!this.target) return\n\n this.target.removeEventListener('mouseenter', this.handleMouseEnter)\n this.target.removeEventListener('mouseleave', this.handleMouseLeave)\n this.target.removeEventListener('blur', this.handleBlur)\n this.target.removeEventListener('click', this.handleClick)\n this.target.removeEventListener('keydown', this.handleKeyDown)\n }\n\n private handleMouseEnter = () => {\n this.show()\n }\n\n private handleMouseLeave = () => {\n this.hide()\n }\n\n private handleFocus = () => {\n this.show()\n }\n\n private handleBlur = () => {\n this.hide()\n }\n\n private handleClick = () => {\n if (this._open) {\n this.hide()\n } else {\n this.show()\n }\n }\n\n private handleKeyDown = (event:KeyboardEvent) => {\n // Close tooltip on Escape\n if (event.key === 'Escape' && this._open) {\n this.hide()\n }\n }\n\n private showTooltip () {\n if (!this.popup || this._disabled) return\n\n // Emit show event\n const showEvent = new CustomEvent('tool-tip-show', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(showEvent)) return\n\n this.popup.classList.add('visible')\n this.popup.setAttribute('aria-hidden', 'false')\n\n // Position the popup\n this.positionPopup()\n\n // Emit after-show event\n this.dispatchEvent(new CustomEvent('tool-tip-after-show', {\n bubbles: true\n }))\n }\n\n private hideTooltip () {\n if (!this.popup) return\n\n // Emit hide event\n const hideEvent = new CustomEvent('tool-tip-hide', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(hideEvent)) return\n\n this.popup.classList.remove('visible')\n this.popup.setAttribute('aria-hidden', 'true')\n\n // Emit after-hide event\n this.dispatchEvent(new CustomEvent('tool-tip-after-hide', {\n bubbles: true\n }))\n }\n\n private positionPopup () {\n if (!this.popup || !this.target) return\n\n const targetRect = this.target.getBoundingClientRect()\n const popupRect = this.popup.getBoundingClientRect()\n const arrowSize = 8\n\n let top = 0\n let left = 0\n let arrowTop = ''\n let arrowLeft = ''\n let arrowTransform = ''\n\n const distance = this.distance\n const skidding = this.skidding\n const placement = this.getOptimalPlacement(targetRect, popupRect)\n\n // Set data attribute for CSS styling\n this.popup.dataset.placement = placement\n\n switch (placement) {\n case 'top':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '100%'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-start':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + skidding\n arrowTop = '100%'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-end':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '100%'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%)'\n break\n case 'bottom':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '0'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-start':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + skidding\n arrowTop = '0'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-end':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '0'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'left':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = '50%'\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-start':\n top = targetRect.top + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'right':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = '50%'\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-start':\n top = targetRect.top + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n }\n\n // Adjust for scroll position\n if (this.hoist) {\n top += window.scrollY\n left += window.scrollX\n }\n\n // Apply position\n this.popup.style.top = `${top}px`\n this.popup.style.left = `${left}px`\n\n // Position the arrow\n if (this.arrow) {\n this.arrow.style.top = arrowTop\n this.arrow.style.left = arrowLeft\n this.arrow.style.transform = arrowTransform\n }\n }\n\n private getOptimalPlacement (\n targetRect:DOMRect,\n popupRect:DOMRect\n ):Placement {\n const placement = this.placement\n const viewportWidth = window.innerWidth\n const viewportHeight = window.innerHeight\n const distance = this.distance\n const arrowSize = 8\n\n // Check if the preferred placement fits\n const fits = {\n top: targetRect.top - popupRect.height - distance - arrowSize > 0,\n bottom: (targetRect.bottom + popupRect.height + distance +\n arrowSize < viewportHeight),\n left: targetRect.left - popupRect.width - distance - arrowSize > 0,\n right: (targetRect.right + popupRect.width + distance +\n arrowSize < viewportWidth),\n }\n\n // Get the base direction from the placement\n const baseDirection = placement.split('-')[0] as 'top' |\n 'bottom' |\n 'left' |\n 'right'\n\n // If preferred placement fits, use it\n if (fits[baseDirection]) {\n return placement\n }\n\n // Find the best alternative\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n }\n\n const opposite = opposites[baseDirection] as\n 'top' | 'bottom' | 'left' | 'right'\n if (fits[opposite]) {\n // Return the opposite with the same alignment\n const alignment = (placement.includes('-') ?\n placement.split('-')[1] :\n '')\n return (alignment ?\n `${opposite}-${alignment}` :\n opposite) as Placement\n }\n\n // Fall back to a direction that fits\n for (const dir of ['top', 'bottom', 'left', 'right'] as const) {\n if (fits[dir]) {\n return dir\n }\n }\n\n // If nothing fits, return original placement\n return placement\n }\n\n /**\n * Programmatically show the tooltip\n */\n show () {\n if (this._disabled || this._open) return\n\n const delay = this.delay\n if (delay > 0) {\n if (this._showTimeout) return\n this._showTimeout = window.setTimeout(() => {\n this.open = true\n this._showTimeout = null\n }, delay)\n } else {\n this.open = true\n }\n }\n\n /**\n * Programmatically hide the tooltip\n */\n hide () {\n if (this._showTimeout) {\n window.clearTimeout(this._showTimeout)\n this._showTimeout = null\n }\n this.open = false\n }\n}\n\ndefine('tool-tip', ToolTip)\n"],
|
|
5
|
-
"mappings": "sKASO,SAASA,EAAcC,EAAoB,CAC9C,OAAO,OAAO,KAAKA,CAAK,EAAE,OAAO,CAACC,EAAKC,IAAM,CACzC,IAAMC,EAAQH,EAAME,CAAC,EACrB,OAAKC,EAED,OAAOA,GAAU,UACbA,GAAeF,EAAM,IAAIC,CAAC,IAAI,KAAK,EAChCD,EAGP,MAAM,QAAQE,CAAK,EACXF,EAAM,IAAIC,CAAC,KAAKC,EAAM,KAAK,GAAG,CAAC,KAGnCF,EAAM,IAAIC,CAAC,KAAKC,CAAK,KAAK,KAAK,EAXpBF,CAYvB,EAAG,EAAE,CACT,CAhBgBG,EAAAL,EAAA,gBAAAK,EAAAL,EAAA,cAAA,yFCAT,SAASM,EAAcC,EAAuB,CACjD,OAAO,SAAS,cAAcA,CAAM,EAAE,cAAgB,OAAO,WACjE,CAFgBC,EAAAF,EAAA,gBAAAE,EAAAF,EAAA,cAAA,EAIT,SAASG,EAAQC,EAAaC,EAAkC,CAC9D,QACC,mBAAoB,SAErBL,EAAaI,CAAI,GAClB,OAAO,eAAe,OAAOA,EAAMC,CAAO,EAElD,CAPgBH,EAAAC,EAAA,UAAAD,EAAAC,EAAA,QAAA,EAST,IAAMG,EAAK,SAAS,cAAc,KAAK,QAAQ,EACzCC,EAAM,SAAS,iBAAiB,KAAK,QAAQ,ECEnD,IAAMC,EAAN,cAAsB,WAAY,CAzBzC,MAyByC,CAAAC,EAAA,gBACrC,OAAO,mBAAqB,CAAC,UAAW,YAAa,WACjD,OAAQ,WAAY,WAAY,OAAO,EAEnC,
|
|
4
|
+
"sourcesContent": ["export type Attrs = Record<string, undefined|null|string|number|boolean|(string|number)[]>\n\n/**\n * Transform an object into an HTML attributes string. The object should be\n * like `{ attributeName: value }`.\n *\n * @param attrs An object for the attributes.\n * @returns {string} A string suitable for use as HTML attributes.\n */\nexport function toAttributes (attrs:Attrs):string {\n return Object.keys(attrs).reduce((acc, k) => {\n const value = attrs[k]\n if (!value) return acc\n\n if (typeof value === 'boolean') {\n if (value) return (acc + ` ${k}`).trim()\n return acc\n }\n\n if (Array.isArray(value)) {\n return (acc + ` ${k}=\"${value.join(' ')}\"`)\n }\n\n return (acc + ` ${k}=\"${value}\"`).trim()\n }, '')\n}\n", "export { toAttributes } from './attributes.js'\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n\nexport const qs = document.querySelector.bind(document)\nexport const qsa = document.querySelectorAll.bind(document)\n", "import { define } from '@substrate-system/web-component/util'\n\n// for document.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tool-tip':ToolTip\n }\n}\n\nexport type Placement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n\nexport type Trigger = 'hover'|'focus'|'click'|'manual'\n\nexport class ToolTip extends HTMLElement {\n static TAG = 'tool-tip'\n static observedAttributes = ['content', 'placement', 'disabled',\n 'open', 'distance', 'skidding', 'delay']\n\n private popup:HTMLDivElement|null = null\n private arrow:HTMLDivElement|null = null\n private target:HTMLElement|null = null\n\n private _open = false\n private _disabled = false\n private _showTimeout:number|null = null\n\n /** The text content of the tooltip. */\n get content ():string {\n return this.getAttribute('content') || ''\n }\n\n set content (value:string) {\n this.setAttribute('content', value)\n }\n\n /** Where to place the tooltip relative to the target. Defaults to 'top'. */\n get placement ():Placement {\n return (this.getAttribute('placement') as Placement) || 'top'\n }\n\n set placement (value:Placement) {\n this.setAttribute('placement', value)\n }\n\n /** Space-separated list of triggers. Defaults to 'hover focus'. */\n get trigger ():Trigger[] {\n const attr = this.getAttribute('trigger') || 'hover focus'\n return attr.split(' ').filter(Boolean) as Trigger[]\n }\n\n set trigger (value:Trigger[]|string) {\n if (Array.isArray(value)) {\n this.setAttribute('trigger', value.join(' '))\n } else {\n this.setAttribute('trigger', value)\n }\n }\n\n /** Whether the tooltip is disabled. */\n get disabled ():boolean {\n return this._disabled\n }\n\n set disabled (value:boolean) {\n this._disabled = value\n if (value) {\n this.setAttribute('disabled', '')\n } else {\n this.removeAttribute('disabled')\n }\n }\n\n get open ():boolean {\n return this._open\n }\n\n set open (value:boolean) {\n if (this._disabled) return\n const wasOpen = this._open\n this._open = value\n\n if (value && !wasOpen) {\n this.showTooltip()\n } else if (!value && wasOpen) {\n this.hideTooltip()\n }\n }\n\n /** Distance in pixels from the target. Defaults to 8. */\n get distance ():number {\n return parseInt(this.getAttribute('distance') || '8', 10)\n }\n\n set distance (value:number) {\n this.setAttribute('distance', String(value))\n }\n\n /** Lateral offset in pixels. Defaults to 0. */\n get skidding ():number {\n return parseInt(this.getAttribute('skidding') || '0', 10)\n }\n\n set skidding (value:number) {\n this.setAttribute('skidding', String(value))\n }\n\n /** Delay in milliseconds before showing the tooltip on hover. Defaults to 0. */\n get delay ():number {\n return parseInt(this.getAttribute('delay') || '0', 10)\n }\n\n set delay (value:number) {\n this.setAttribute('delay', String(value))\n }\n\n get hoist ():boolean {\n return this.hasAttribute('hoist')\n }\n\n set hoist (value:boolean) {\n if (value) {\n this.setAttribute('hoist', '')\n } else {\n this.removeAttribute('hoist')\n }\n }\n\n connectedCallback () {\n // Use display: contents so the tooltip doesn't affect layout\n this.style.display = 'contents'\n\n // Find the target element (first child element)\n this.target = this.firstElementChild as HTMLElement\n\n if (!this.target) {\n console.warn('tool-tip: No target element found. ' +\n 'Add a child element.')\n return\n }\n\n // Create the popup element\n this.createPopup()\n\n // Bind event handlers\n this.bindEvents()\n\n // Check if open attribute is set\n if (this.hasAttribute('open')) {\n this._open = true\n this.showTooltip()\n }\n }\n\n disconnectedCallback () {\n this.unbindEvents()\n this.popup?.remove()\n }\n\n attributeChangedCallback (\n name:string,\n _oldValue:string|null,\n newValue:string|null\n ) {\n if (name === 'content' && this.popup) {\n const body = this.popup.querySelector('.body')\n if (body) {\n body.textContent = newValue || ''\n }\n }\n\n if (name === 'placement' && this._open) {\n this.positionPopup()\n }\n\n if (name === 'disabled') {\n this._disabled = newValue !== null\n if (this._disabled && this._open) {\n this.hide()\n }\n }\n\n if (name === 'open') {\n this.open = newValue !== null\n }\n\n if ((name === 'distance' || name === 'skidding') && this._open) {\n this.positionPopup()\n }\n }\n\n private createPopup () {\n this.popup = document.createElement('div')\n this.popup.className = 'popup'\n this.popup.setAttribute('role', 'tooltip')\n this.popup.setAttribute('aria-hidden', 'true')\n this.popup.innerHTML = `\n <div class=\"body\">${this.content}</div>\n <div class=\"arrow\"></div>\n `\n\n this.arrow = this.popup.querySelector('.arrow')\n\n // Append to body if hoisted, otherwise to this element's parent\n if (this.hoist) {\n document.body.appendChild(this.popup)\n } else {\n this.appendChild(this.popup)\n }\n }\n\n private bindEvents () {\n if (!this.target) return\n\n const triggers = this.trigger\n\n if (triggers.includes('hover')) {\n this.target.addEventListener('mouseenter', this.handleMouseEnter)\n this.target.addEventListener('mouseleave', this.handleMouseLeave)\n }\n\n if (triggers.includes('focus')) {\n this.target.addEventListener('focus', this.handleFocus)\n this.target.addEventListener('blur', this.handleBlur)\n }\n\n if (triggers.includes('click')) {\n this.target.addEventListener('click', this.handleClick)\n }\n\n // Add keyboard support\n this.target.addEventListener('keydown', this.handleKeyDown)\n }\n\n private unbindEvents () {\n if (!this.target) return\n\n this.target.removeEventListener('mouseenter', this.handleMouseEnter)\n this.target.removeEventListener('mouseleave', this.handleMouseLeave)\n this.target.removeEventListener('blur', this.handleBlur)\n this.target.removeEventListener('click', this.handleClick)\n this.target.removeEventListener('keydown', this.handleKeyDown)\n }\n\n private handleMouseEnter = () => {\n this.show()\n }\n\n private handleMouseLeave = () => {\n this.hide()\n }\n\n private handleFocus = () => {\n this.show()\n }\n\n private handleBlur = () => {\n this.hide()\n }\n\n private handleClick = () => {\n if (this._open) {\n this.hide()\n } else {\n this.show()\n }\n }\n\n private handleKeyDown = (event:KeyboardEvent) => {\n // Close tooltip on Escape\n if (event.key === 'Escape' && this._open) {\n this.hide()\n }\n }\n\n private showTooltip () {\n if (!this.popup || this._disabled) return\n\n // Emit show event\n const showEvent = new CustomEvent('tool-tip-show', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(showEvent)) return\n\n this.popup.classList.add('visible')\n this.popup.setAttribute('aria-hidden', 'false')\n\n // Position the popup\n this.positionPopup()\n\n // Emit after-show event\n this.dispatchEvent(new CustomEvent('tool-tip-after-show', {\n bubbles: true\n }))\n }\n\n private hideTooltip () {\n if (!this.popup) return\n\n // Emit hide event\n const hideEvent = new CustomEvent('tool-tip-hide', {\n bubbles: true,\n cancelable: true,\n })\n if (!this.dispatchEvent(hideEvent)) return\n\n this.popup.classList.remove('visible')\n this.popup.setAttribute('aria-hidden', 'true')\n\n // Emit after-hide event\n this.dispatchEvent(new CustomEvent('tool-tip-after-hide', {\n bubbles: true\n }))\n }\n\n private positionPopup () {\n if (!this.popup || !this.target) return\n\n const targetRect = this.target.getBoundingClientRect()\n const popupRect = this.popup.getBoundingClientRect()\n const arrowSize = 8\n\n let top = 0\n let left = 0\n let arrowTop = ''\n let arrowLeft = ''\n let arrowTransform = ''\n\n const distance = this.distance\n const skidding = this.skidding\n const placement = this.getOptimalPlacement(targetRect, popupRect)\n\n // Set data attribute for CSS styling\n this.popup.dataset.placement = placement\n\n switch (placement) {\n case 'top':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '100%'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-start':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.left + skidding\n arrowTop = '100%'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%)'\n break\n case 'top-end':\n top = targetRect.top - popupRect.height - distance - arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '100%'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%)'\n break\n case 'bottom':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + (targetRect.width / 2) -\n (popupRect.width / 2) + skidding\n arrowTop = '0'\n arrowLeft = '50%'\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-start':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.left + skidding\n arrowTop = '0'\n arrowLeft = `${Math.min(24, popupRect.width / 2)}px`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'bottom-end':\n top = targetRect.bottom + distance + arrowSize\n left = targetRect.right - popupRect.width + skidding\n arrowTop = '0'\n arrowLeft = `calc(100% - ${Math.min(24, popupRect.width / 2)}px)`\n arrowTransform = 'translateX(-50%) translateY(-100%)'\n break\n case 'left':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = '50%'\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-start':\n top = targetRect.top + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'left-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.left - popupRect.width - distance - arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '100%'\n arrowTransform = 'translateY(-50%)'\n break\n case 'right':\n top = targetRect.top + (targetRect.height / 2) -\n (popupRect.height / 2) + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = '50%'\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-start':\n top = targetRect.top + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `${Math.min(16, popupRect.height / 2)}px`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n case 'right-end':\n top = targetRect.bottom - popupRect.height + skidding\n left = targetRect.right + distance + arrowSize\n arrowTop = `calc(100% - ${Math.min(16, popupRect.height / 2)}px)`\n arrowLeft = '0'\n arrowTransform = 'translateY(-50%) translateX(-100%)'\n break\n }\n\n // Adjust for scroll position\n if (this.hoist) {\n top += window.scrollY\n left += window.scrollX\n }\n\n // Apply position\n this.popup.style.top = `${top}px`\n this.popup.style.left = `${left}px`\n\n // Position the arrow\n if (this.arrow) {\n this.arrow.style.top = arrowTop\n this.arrow.style.left = arrowLeft\n this.arrow.style.transform = arrowTransform\n }\n }\n\n private getOptimalPlacement (\n targetRect:DOMRect,\n popupRect:DOMRect\n ):Placement {\n const placement = this.placement\n const viewportWidth = window.innerWidth\n const viewportHeight = window.innerHeight\n const distance = this.distance\n const arrowSize = 8\n\n // Check if the preferred placement fits\n const fits = {\n top: targetRect.top - popupRect.height - distance - arrowSize > 0,\n bottom: (targetRect.bottom + popupRect.height + distance +\n arrowSize < viewportHeight),\n left: targetRect.left - popupRect.width - distance - arrowSize > 0,\n right: (targetRect.right + popupRect.width + distance +\n arrowSize < viewportWidth),\n }\n\n // Get the base direction from the placement\n const baseDirection = placement.split('-')[0] as 'top' |\n 'bottom' |\n 'left' |\n 'right'\n\n // If preferred placement fits, use it\n if (fits[baseDirection]) {\n return placement\n }\n\n // Find the best alternative\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n }\n\n const opposite = opposites[baseDirection] as\n 'top' | 'bottom' | 'left' | 'right'\n if (fits[opposite]) {\n // Return the opposite with the same alignment\n const alignment = (placement.includes('-') ?\n placement.split('-')[1] :\n '')\n return (alignment ?\n `${opposite}-${alignment}` :\n opposite) as Placement\n }\n\n // Fall back to a direction that fits\n for (const dir of ['top', 'bottom', 'left', 'right'] as const) {\n if (fits[dir]) {\n return dir\n }\n }\n\n // If nothing fits, return original placement\n return placement\n }\n\n /**\n * Programmatically show the tooltip\n */\n show () {\n if (this._disabled || this._open) return\n\n const delay = this.delay\n if (delay > 0) {\n if (this._showTimeout) return\n this._showTimeout = window.setTimeout(() => {\n this.open = true\n this._showTimeout = null\n }, delay)\n } else {\n this.open = true\n }\n }\n\n /**\n * Programmatically hide the tooltip\n */\n hide () {\n if (this._showTimeout) {\n window.clearTimeout(this._showTimeout)\n this._showTimeout = null\n }\n this.open = false\n }\n}\n\ndefine(ToolTip.TAG, ToolTip)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["toAttributes", "attrs", "acc", "k", "value", "__name", "isRegistered", "elName", "__name", "define", "name", "element", "qs", "qsa", "ToolTip", "__name", "value", "wasOpen", "name", "_oldValue", "newValue", "body", "triggers", "event", "showEvent", "hideEvent", "targetRect", "popupRect", "arrowSize", "top", "left", "arrowTop", "arrowLeft", "arrowTransform", "distance", "skidding", "placement", "viewportWidth", "viewportHeight", "fits", "baseDirection", "opposite", "alignment", "dir", "delay", "define"]
|
|
7
7
|
}
|
package/dist/meta.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"inputs": {
|
|
3
3
|
"src/index.ts": {
|
|
4
|
-
"bytes":
|
|
4
|
+
"bytes": 16749,
|
|
5
5
|
"imports": [],
|
|
6
6
|
"format": "esm"
|
|
7
7
|
}
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"imports": [],
|
|
12
12
|
"exports": [],
|
|
13
13
|
"inputs": {},
|
|
14
|
-
"bytes":
|
|
14
|
+
"bytes": 25739
|
|
15
15
|
},
|
|
16
16
|
"dist/index.js": {
|
|
17
17
|
"imports": [
|
|
@@ -27,10 +27,10 @@
|
|
|
27
27
|
"entryPoint": "src/index.ts",
|
|
28
28
|
"inputs": {
|
|
29
29
|
"src/index.ts": {
|
|
30
|
-
"bytesInOutput":
|
|
30
|
+
"bytesInOutput": 12980
|
|
31
31
|
}
|
|
32
32
|
},
|
|
33
|
-
"bytes":
|
|
33
|
+
"bytes": 13165
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
}
|