@amboss/design-system 1.23.1 → 1.23.2

package/build/cjs/components/UserHighlightTooltip/UserHighlightTooltip.d.ts

@@ -5,5 +5,6 @@ export type UserHighlightTooltipProps = Pick<TooltipContentProps, "content" | "p
     onVisibilityChange?: (isVisible: boolean) => void;
     triggerElements: HTMLElement[];
     selectedRange?: Range;
+    positionAtStart?: boolean;
 };
-export declare function UserHighlightTooltip({ content, contentPadding, placement, maxWidth, portalContainer, "data-e2e-test-id": dataE2eTestId, triggerElements, selectedRange, onVisibilityChange, }: UserHighlightTooltipProps): React.ReactElement;
+export declare function UserHighlightTooltip({ content, contentPadding, placement, maxWidth, portalContainer, "data-e2e-test-id": dataE2eTestId, triggerElements, selectedRange, onVisibilityChange, positionAtStart, }: UserHighlightTooltipProps): React.ReactElement;

package/build/cjs/components/UserHighlightTooltip/UserHighlightTooltip.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"UserHighlightTooltip",{enumerable:!0,get:function(){return UserHighlightTooltip}});const _react=require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_TooltipContent=require("../Tooltip/TooltipContent");function UserHighlightTooltip({content,contentPadding="s",placement="auto",maxWidth,portalContainer,"data-e2e-test-id":dataE2eTestId,triggerElements,selectedRange,onVisibilityChange}){let tooltipId=(0,_react.useMemo)(()=>`DSUserHighlightTooltip_${Math.floor(Date.now()*Math.random())}`,[]),isTooltipHovered=(0,_react.useRef)(!1),showTooltipTimeoutId=(0,_react.useRef)(null),hideTooltipTimeoutId=(0,_react.useRef)(null),triggerHovered=(0,_react.useRef)(!1),rangeRef=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{if(selectedRange)rangeRef.current=selectedRange;else{let range=document.createRange();range.setStart(triggerElements[0],0),range.setEnd(triggerElements[triggerElements.length-1],1),rangeRef.current=range}},[triggerElements,selectedRange]);let[tooltipVisible,setTooltipVisible]=(0,_react.useState)(!1),toggleVisibility=(0,_react.useCallback)(status=>{setTooltipVisible(status),onVisibilityChange&&onVisibilityChange(status)},[onVisibilityChange]);(0,_react.useEffect)(()=>{selectedRange&&toggleVisibility(!0)},[]);let hideTooltipAfterDelay=(0,_react.useCallback)(()=>{hideTooltipTimeoutId.current=setTimeout(()=>{triggerHovered.current||isTooltipHovered.current||!tooltipVisible||toggleVisibility(!1)},200)},[toggleVisibility,tooltipVisible]),handleTriggerPointerEnter=(0,_react.useCallback)(()=>{triggerHovered.current=!0,tooltipVisible||(clearTimeout(showTooltipTimeoutId.current),showTooltipTimeoutId.current=setTimeout(()=>{!tooltipVisible&&triggerHovered.current&&toggleVisibility(!0)},200))},[toggleVisibility,tooltipVisible]),handleTriggerPointerLeave=(0,_react.useCallback)(()=>{clearTimeout(hideTooltipTimeoutId.current),triggerHovered.current=!1,hideTooltipAfterDelay()},[hideTooltipAfterDelay]);return((0,_react.useEffect)(()=>()=>{clearTimeout(showTooltipTimeoutId.current),clearTimeout(hideTooltipTimeoutId.current)},[]),(0,_react.useEffect)(()=>(triggerElements.forEach(node=>{node.addEventListener("pointerenter",handleTriggerPointerEnter),node.addEventListener("pointerleave",handleTriggerPointerLeave)}),()=>{triggerElements.forEach(node=>{node.removeEventListener("pointerenter",handleTriggerPointerEnter),node.removeEventListener("pointerleave",handleTriggerPointerLeave)})}),[handleTriggerPointerEnter,handleTriggerPointerLeave,triggerElements]),(0,_react.useEffect)(()=>{triggerElements.forEach(node=>{tooltipVisible?node.setAttribute("aria-describedby",tooltipId):node.removeAttribute("aria-describedby")})},[tooltipId,tooltipVisible,triggerElements]),rangeRef.current)?_react.default.createElement(_TooltipContent.TooltipContent,{dataDSId:"UserHighlightTooltip",content:content,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,isVisible:tooltipVisible,tooltipId:tooltipId,triggerRef:rangeRef,"aria-hidden":!0,role:"tooltip",contentPadding:contentPadding,maxWidth:maxWidth,onTooltipPointerEnter:()=>{isTooltipHovered.current=!0},onTooltipPointerLeave:()=>{clearTimeout(hideTooltipTimeoutId.current),isTooltipHovered.current=!1,hideTooltipAfterDelay()}}):null}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"UserHighlightTooltip",{enumerable:!0,get:function(){return UserHighlightTooltip}});const _react=require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_TooltipContent=require("../Tooltip/TooltipContent");function UserHighlightTooltip({content,contentPadding="s",placement="auto",maxWidth,portalContainer,"data-e2e-test-id":dataE2eTestId,triggerElements,selectedRange,onVisibilityChange,positionAtStart}){let tooltipId=(0,_react.useMemo)(()=>`DSUserHighlightTooltip_${Math.floor(Date.now()*Math.random())}`,[]),isTooltipHovered=(0,_react.useRef)(!1),showTooltipTimeoutId=(0,_react.useRef)(null),hideTooltipTimeoutId=(0,_react.useRef)(null),triggerHovered=(0,_react.useRef)(!1),rangeRef=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{if(selectedRange)rangeRef.current=selectedRange;else{let range=document.createRange();if(positionAtStart){let text=triggerElements[0].childNodes[0];range.setStart(text,0),range.setEnd(text,1)}else range.setStart(triggerElements[0],0),range.setEnd(triggerElements[triggerElements.length-1],1);rangeRef.current=range}},[triggerElements,selectedRange,positionAtStart]);let[tooltipVisible,setTooltipVisible]=(0,_react.useState)(!1),toggleVisibility=(0,_react.useCallback)(status=>{setTooltipVisible(status),onVisibilityChange&&onVisibilityChange(status)},[onVisibilityChange]);(0,_react.useEffect)(()=>{selectedRange&&toggleVisibility(!0)},[]);let hideTooltipAfterDelay=(0,_react.useCallback)(()=>{hideTooltipTimeoutId.current=setTimeout(()=>{triggerHovered.current||isTooltipHovered.current||!tooltipVisible||toggleVisibility(!1)},200)},[toggleVisibility,tooltipVisible]),handleTriggerPointerEnter=(0,_react.useCallback)(()=>{triggerHovered.current=!0,tooltipVisible||(clearTimeout(showTooltipTimeoutId.current),showTooltipTimeoutId.current=setTimeout(()=>{!tooltipVisible&&triggerHovered.current&&toggleVisibility(!0)},200))},[toggleVisibility,tooltipVisible]),handleTriggerPointerLeave=(0,_react.useCallback)(()=>{clearTimeout(hideTooltipTimeoutId.current),triggerHovered.current=!1,hideTooltipAfterDelay()},[hideTooltipAfterDelay]);return((0,_react.useEffect)(()=>()=>{clearTimeout(showTooltipTimeoutId.current),clearTimeout(hideTooltipTimeoutId.current)},[]),(0,_react.useEffect)(()=>(triggerElements.forEach(node=>{node.addEventListener("pointerenter",handleTriggerPointerEnter),node.addEventListener("pointerleave",handleTriggerPointerLeave)}),()=>{triggerElements.forEach(node=>{node.removeEventListener("pointerenter",handleTriggerPointerEnter),node.removeEventListener("pointerleave",handleTriggerPointerLeave)})}),[handleTriggerPointerEnter,handleTriggerPointerLeave,triggerElements]),(0,_react.useEffect)(()=>{triggerElements.forEach(node=>{tooltipVisible?node.setAttribute("aria-describedby",tooltipId):node.removeAttribute("aria-describedby")})},[tooltipId,tooltipVisible,triggerElements]),rangeRef.current)?_react.default.createElement(_TooltipContent.TooltipContent,{dataDSId:"UserHighlightTooltip",content:content,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,isVisible:tooltipVisible,tooltipId:tooltipId,triggerRef:rangeRef,"aria-hidden":!0,role:"tooltip",contentPadding:contentPadding,maxWidth:maxWidth,onTooltipPointerEnter:()=>{isTooltipHovered.current=!0},onTooltipPointerLeave:()=>{clearTimeout(hideTooltipTimeoutId.current),isTooltipHovered.current=!1,hideTooltipAfterDelay()}}):null}

package/build/esm/components/UserHighlightTooltip/UserHighlightTooltip.d.ts

@@ -5,5 +5,6 @@ export type UserHighlightTooltipProps = Pick<TooltipContentProps, "content" | "p
     onVisibilityChange?: (isVisible: boolean) => void;
     triggerElements: HTMLElement[];
     selectedRange?: Range;
+    positionAtStart?: boolean;
 };
-export declare function UserHighlightTooltip({ content, contentPadding, placement, maxWidth, portalContainer, "data-e2e-test-id": dataE2eTestId, triggerElements, selectedRange, onVisibilityChange, }: UserHighlightTooltipProps): React.ReactElement;
+export declare function UserHighlightTooltip({ content, contentPadding, placement, maxWidth, portalContainer, "data-e2e-test-id": dataE2eTestId, triggerElements, selectedRange, onVisibilityChange, positionAtStart, }: UserHighlightTooltipProps): React.ReactElement;

package/build/esm/components/UserHighlightTooltip/UserHighlightTooltip.js

@@ -1 +1 @@
-import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{TooltipContent}from"../Tooltip/TooltipContent";export function UserHighlightTooltip({content,contentPadding="s",placement="auto",maxWidth,portalContainer,"data-e2e-test-id":dataE2eTestId,triggerElements,selectedRange,onVisibilityChange}){let tooltipId=useMemo(()=>`DSUserHighlightTooltip_${Math.floor(Date.now()*Math.random())}`,[]),isTooltipHovered=useRef(!1),showTooltipTimeoutId=useRef(null),hideTooltipTimeoutId=useRef(null),triggerHovered=useRef(!1),rangeRef=useRef(null);useEffect(()=>{if(selectedRange)rangeRef.current=selectedRange;else{let range=document.createRange();range.setStart(triggerElements[0],0),range.setEnd(triggerElements[triggerElements.length-1],1),rangeRef.current=range}},[triggerElements,selectedRange]);let[tooltipVisible,setTooltipVisible]=useState(!1),toggleVisibility=useCallback(status=>{setTooltipVisible(status),onVisibilityChange&&onVisibilityChange(status)},[onVisibilityChange]);useEffect(()=>{selectedRange&&toggleVisibility(!0)},[]);let hideTooltipAfterDelay=useCallback(()=>{hideTooltipTimeoutId.current=setTimeout(()=>{triggerHovered.current||isTooltipHovered.current||!tooltipVisible||toggleVisibility(!1)},200)},[toggleVisibility,tooltipVisible]),handleTriggerPointerEnter=useCallback(()=>{triggerHovered.current=!0,tooltipVisible||(clearTimeout(showTooltipTimeoutId.current),showTooltipTimeoutId.current=setTimeout(()=>{!tooltipVisible&&triggerHovered.current&&toggleVisibility(!0)},200))},[toggleVisibility,tooltipVisible]),handleTriggerPointerLeave=useCallback(()=>{clearTimeout(hideTooltipTimeoutId.current),triggerHovered.current=!1,hideTooltipAfterDelay()},[hideTooltipAfterDelay]);return(useEffect(()=>()=>{clearTimeout(showTooltipTimeoutId.current),clearTimeout(hideTooltipTimeoutId.current)},[]),useEffect(()=>(triggerElements.forEach(node=>{node.addEventListener("pointerenter",handleTriggerPointerEnter),node.addEventListener("pointerleave",handleTriggerPointerLeave)}),()=>{triggerElements.forEach(node=>{node.removeEventListener("pointerenter",handleTriggerPointerEnter),node.removeEventListener("pointerleave",handleTriggerPointerLeave)})}),[handleTriggerPointerEnter,handleTriggerPointerLeave,triggerElements]),useEffect(()=>{triggerElements.forEach(node=>{tooltipVisible?node.setAttribute("aria-describedby",tooltipId):node.removeAttribute("aria-describedby")})},[tooltipId,tooltipVisible,triggerElements]),rangeRef.current)?React.createElement(TooltipContent,{dataDSId:"UserHighlightTooltip",content:content,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,isVisible:tooltipVisible,tooltipId:tooltipId,triggerRef:rangeRef,"aria-hidden":!0,role:"tooltip",contentPadding:contentPadding,maxWidth:maxWidth,onTooltipPointerEnter:()=>{isTooltipHovered.current=!0},onTooltipPointerLeave:()=>{clearTimeout(hideTooltipTimeoutId.current),isTooltipHovered.current=!1,hideTooltipAfterDelay()}}):null}
+import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{TooltipContent}from"../Tooltip/TooltipContent";export function UserHighlightTooltip({content,contentPadding="s",placement="auto",maxWidth,portalContainer,"data-e2e-test-id":dataE2eTestId,triggerElements,selectedRange,onVisibilityChange,positionAtStart}){let tooltipId=useMemo(()=>`DSUserHighlightTooltip_${Math.floor(Date.now()*Math.random())}`,[]),isTooltipHovered=useRef(!1),showTooltipTimeoutId=useRef(null),hideTooltipTimeoutId=useRef(null),triggerHovered=useRef(!1),rangeRef=useRef(null);useEffect(()=>{if(selectedRange)rangeRef.current=selectedRange;else{let range=document.createRange();if(positionAtStart){let text=triggerElements[0].childNodes[0];range.setStart(text,0),range.setEnd(text,1)}else range.setStart(triggerElements[0],0),range.setEnd(triggerElements[triggerElements.length-1],1);rangeRef.current=range}},[triggerElements,selectedRange,positionAtStart]);let[tooltipVisible,setTooltipVisible]=useState(!1),toggleVisibility=useCallback(status=>{setTooltipVisible(status),onVisibilityChange&&onVisibilityChange(status)},[onVisibilityChange]);useEffect(()=>{selectedRange&&toggleVisibility(!0)},[]);let hideTooltipAfterDelay=useCallback(()=>{hideTooltipTimeoutId.current=setTimeout(()=>{triggerHovered.current||isTooltipHovered.current||!tooltipVisible||toggleVisibility(!1)},200)},[toggleVisibility,tooltipVisible]),handleTriggerPointerEnter=useCallback(()=>{triggerHovered.current=!0,tooltipVisible||(clearTimeout(showTooltipTimeoutId.current),showTooltipTimeoutId.current=setTimeout(()=>{!tooltipVisible&&triggerHovered.current&&toggleVisibility(!0)},200))},[toggleVisibility,tooltipVisible]),handleTriggerPointerLeave=useCallback(()=>{clearTimeout(hideTooltipTimeoutId.current),triggerHovered.current=!1,hideTooltipAfterDelay()},[hideTooltipAfterDelay]);return(useEffect(()=>()=>{clearTimeout(showTooltipTimeoutId.current),clearTimeout(hideTooltipTimeoutId.current)},[]),useEffect(()=>(triggerElements.forEach(node=>{node.addEventListener("pointerenter",handleTriggerPointerEnter),node.addEventListener("pointerleave",handleTriggerPointerLeave)}),()=>{triggerElements.forEach(node=>{node.removeEventListener("pointerenter",handleTriggerPointerEnter),node.removeEventListener("pointerleave",handleTriggerPointerLeave)})}),[handleTriggerPointerEnter,handleTriggerPointerLeave,triggerElements]),useEffect(()=>{triggerElements.forEach(node=>{tooltipVisible?node.setAttribute("aria-describedby",tooltipId):node.removeAttribute("aria-describedby")})},[tooltipId,tooltipVisible,triggerElements]),rangeRef.current)?React.createElement(TooltipContent,{dataDSId:"UserHighlightTooltip",content:content,placement:placement,portalContainer:portalContainer,dataE2eTestId:dataE2eTestId,isVisible:tooltipVisible,tooltipId:tooltipId,triggerRef:rangeRef,"aria-hidden":!0,role:"tooltip",contentPadding:contentPadding,maxWidth:maxWidth,onTooltipPointerEnter:()=>{isTooltipHovered.current=!0},onTooltipPointerLeave:()=>{clearTimeout(hideTooltipTimeoutId.current),isTooltipHovered.current=!1,hideTooltipAfterDelay()}}):null}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amboss/design-system",
-  "version": "1.23.1",
+  "version": "1.23.2",
   "description": "the design system for AMBOSS products",
   "author": "AMBOSS",
   "license": "ISC",