@loomhq/lens 10.63.1 → 10.63.3

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.
@@ -1,6 +1,6 @@
1
1
  import React from 'react';
2
2
  declare const ModalCardWrapper: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.DialogHTMLAttributes<HTMLDialogElement>, HTMLDialogElement>, ModalCardProps, object>;
3
- export declare const ModalCard: ({ children, onCloseClick, isOpen, maxWidth, maxHeight, placement, ref, ...props }: ModalCardProps & React.ComponentProps<typeof ModalCardWrapper>) => JSX.Element;
3
+ export declare const ModalCard: ({ children, onCloseClick, isOpen, maxWidth, maxHeight, placement, ariaLabel, ref, ...props }: ModalCardProps & React.ComponentProps<typeof ModalCardWrapper>) => JSX.Element;
4
4
  declare const Modal: React.ForwardRefExoticComponent<Pick<ModalProps & {
5
5
  isOpen?: boolean;
6
6
  children?: React.ReactNode;
@@ -8,7 +8,7 @@ declare const Modal: React.ForwardRefExoticComponent<Pick<ModalProps & {
8
8
  backgroundColor?: string;
9
9
  } & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & {
10
10
  theme?: object;
11
- }, "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "backgroundColor" | "maxHeight" | "maxWidth" | "zIndex" | "theme" | "isOpen" | "onCloseClick" | "placement" | "hasDividers" | "noPadding" | "mainButton" | "secondaryButton" | "alternativeButton" | "onBackgroundClick"> & React.RefAttributes<HTMLDialogElement>>;
11
+ }, "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "backgroundColor" | "maxHeight" | "maxWidth" | "zIndex" | "theme" | "isOpen" | "onCloseClick" | "placement" | "ariaLabel" | "hasDividers" | "noPadding" | "mainButton" | "secondaryButton" | "alternativeButton" | "onBackgroundClick"> & React.RefAttributes<HTMLDialogElement>>;
12
12
  declare type ModalProps = {
13
13
  children?: React.ReactNode;
14
14
  isOpen?: boolean;
@@ -25,6 +25,7 @@ declare type ModalProps = {
25
25
  noPadding?: boolean;
26
26
  placement?: 'center' | 'bottom';
27
27
  zIndex?: number;
28
+ ariaLabel?: string;
28
29
  };
29
30
  declare type ModalCardProps = {
30
31
  children?: React.ReactNode;
@@ -35,5 +36,6 @@ declare type ModalCardProps = {
35
36
  placement?: string;
36
37
  maxHeight?: number | string;
37
38
  maxWidth?: number | string;
39
+ ariaLabel?: string;
38
40
  };
39
41
  export default Modal;
@@ -109,7 +109,7 @@ const ModalCardChildrenSection = styled.div `
109
109
  `;
110
110
  export const ModalCard = (_a) => {
111
111
  // TODO: LNS-151: Abstract into useKeyDown hook for reuse
112
- var { children, onCloseClick, isOpen, maxWidth = 60, maxHeight = '70vh', placement = 'center', ref } = _a, props = __rest(_a, ["children", "onCloseClick", "isOpen", "maxWidth", "maxHeight", "placement", "ref"]);
112
+ var { children, onCloseClick, isOpen, maxWidth = 60, maxHeight = '70vh', placement = 'center', ariaLabel, ref } = _a, props = __rest(_a, ["children", "onCloseClick", "isOpen", "maxWidth", "maxHeight", "placement", "ariaLabel", "ref"]);
113
113
  useEffect(() => {
114
114
  if (!isOpen) {
115
115
  return;
@@ -129,13 +129,14 @@ export const ModalCard = (_a) => {
129
129
  clickOutsideDeactivates: false,
130
130
  allowOutsideClick: true,
131
131
  } },
132
- React.createElement(ModalCardWrapper, Object.assign({ open: isOpen, maxWidth: maxWidth, maxHeight: maxHeight, placement: placement, onClick: e => e.stopPropagation(), ref: ref }, props),
132
+ React.createElement(ModalCardWrapper, Object.assign({ open: isOpen, maxWidth: maxWidth, maxHeight: maxHeight, placement: placement, onClick: e => e.stopPropagation(), ref: ref, "aria-label": ariaLabel }, props),
133
133
  onCloseClick && (React.createElement(CloseIconSection, null,
134
134
  React.createElement(IconButton, { altText: "Close", icon: React.createElement(SvgClose, null), onClick: onCloseClick }))),
135
135
  React.createElement(ModalCardChildrenSection, null, children))));
136
136
  };
137
137
  const Modal = React.forwardRef((_a, ref) => {
138
- var { children, id, isOpen, mainButton, secondaryButton, alternativeButton, title, noPadding, onCloseClick, onBackgroundClick, onKeyDown, hasDividers, maxHeight = '70vh', maxWidth = 60, placement = 'center', zIndex = 1000 } = _a, props = __rest(_a, ["children", "id", "isOpen", "mainButton", "secondaryButton", "alternativeButton", "title", "noPadding", "onCloseClick", "onBackgroundClick", "onKeyDown", "hasDividers", "maxHeight", "maxWidth", "placement", "zIndex"]);
138
+ var { children, id, isOpen, mainButton, secondaryButton, alternativeButton, title, noPadding, onCloseClick, onBackgroundClick, onKeyDown, hasDividers, maxHeight = '70vh', maxWidth = 60, placement = 'center', zIndex = 1000, ariaLabel } = _a, props = __rest(_a, ["children", "id", "isOpen", "mainButton", "secondaryButton", "alternativeButton", "title", "noPadding", "onCloseClick", "onBackgroundClick", "onKeyDown", "hasDividers", "maxHeight", "maxWidth", "placement", "zIndex", "ariaLabel"]);
139
+ const titleId = id ? `${id}-modal-title` : 'modal-title';
139
140
  const hasButtons = mainButton || secondaryButton || alternativeButton ? true : false;
140
141
  const closeClickHandler = e => {
141
142
  if (onBackgroundClick) {
@@ -146,15 +147,12 @@ const Modal = React.forwardRef((_a, ref) => {
146
147
  onCloseClick(e);
147
148
  };
148
149
  return (React.createElement(Backdrop, Object.assign({ isOpen: isOpen, zIndex: zIndex }, props),
149
- React.createElement(Container, { height: "100%", onClick: closeClickHandler, onKeyDown: onKeyDown },
150
- React.createElement(ModalCard, { ref: ref,
151
- // TODO: LNS-148: Add aria labelling for screenreader support
152
- // ariaLabelledBy={title}
153
- id: id, isOpen: isOpen, maxHeight: maxHeight, maxWidth: maxWidth, placement: placement, onCloseClick: onCloseClick },
150
+ React.createElement(Container, { height: "100%", onClick: closeClickHandler, onKeyDown: onKeyDown, "aria-labelledby": titleId },
151
+ React.createElement(ModalCard, { ref: ref, id: id, isOpen: isOpen, maxHeight: maxHeight, maxWidth: maxWidth, placement: placement, onCloseClick: onCloseClick, ariaLabel: ariaLabel },
154
152
  React.createElement(ContentWrapper, { rows: `${title ? 'auto ' : ''} ${children ? '1fr ' : ''} ${hasButtons ? 'auto' : ''}` },
155
153
  title && (React.createElement(TitleSection, { bottom: children
156
154
  ? 'var(--lns-space-medium)'
157
- : 'var(--lns-space-xlarge)' },
155
+ : 'var(--lns-space-xlarge)', id: titleId },
158
156
  React.createElement(Text, { variant: "title" }, title))),
159
157
  React.createElement(ChildrenSection, { noPadding: noPadding, hasDividers: hasDividers, hasTitle: Boolean(title), hasButtons: hasButtons }, children && children),
160
158
  hasButtons && (React.createElement(ButtonsSection, { top: children ? 'var(--lns-space-xlarge)' : 0, hasDividers: hasDividers },
@@ -4,7 +4,7 @@ declare const TooltipBoxWrapper: import("@emotion/styled-base").StyledComponent<
4
4
  declare const ShortcutWrapper: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement>>, object>;
5
5
  export declare const ShortcutBox: ({ children, }: React.ComponentProps<typeof ShortcutWrapper>) => JSX.Element;
6
6
  export declare const TooltipBox: ({ children, maxWidth, onMouseEnter, onMouseLeave, layerProps, zIndex, ...rest }: TooltipBoxProps & React.ComponentProps<typeof TooltipBoxWrapper>) => JSX.Element;
7
- declare const Tooltip: ({ children, content, shortcut, placement, keepOpen, triggerOffset, maxWidth, isInline, isDisabled, container, tabIndex, zIndex, verticalAlign, delay, dynamicPosition, ...rest }: TooltipProps) => JSX.Element;
7
+ declare const Tooltip: ({ children, content, shortcut, placement, keepOpen, triggerOffset, maxWidth, isInline, isDisabled, container, tabIndex, zIndex, verticalAlign, delay, ...rest }: TooltipProps) => JSX.Element;
8
8
  export declare const availablePlacements: string[];
9
9
  declare type TooltipBoxProps = {
10
10
  children?: React.ReactNode;
@@ -24,7 +24,6 @@ declare type TooltipProps = {
24
24
  keepOpen?: boolean;
25
25
  maxWidth?: number | string | [];
26
26
  placement?: 'topLeft' | 'topCenter' | 'topRight' | 'bottomLeft' | 'bottomCenter' | 'bottomRight' | 'leftTop' | 'leftCenter' | 'leftBottom' | 'rightTop' | 'rightCenter' | 'rightBottom';
27
- dynamicPosition?: boolean;
28
27
  triggerOffset?: number;
29
28
  verticalAlign?: string;
30
29
  zIndex?: number;
@@ -13,11 +13,10 @@ import React, { useState, useRef, useEffect } from 'react';
13
13
  import Arrange from '../arrange/arrange';
14
14
  import Text from '../text/text';
15
15
  import { getColorValue, getFontWeight, getRadius, getShadow, getSize, getTextSize, u, } from '../../utilities';
16
- import { useHover, useLayer, mergeRefs, useMousePositionAsTrigger, } from 'react-laag';
16
+ import { useHover, useLayer, mergeRefs } from 'react-laag';
17
17
  import ResizeObserver from 'resize-observer-polyfill';
18
18
  import styled from '@emotion/styled';
19
19
  import { textSizes } from '../../variables';
20
- import { usePrefersReducedMotion } from '../../hooks/use-prefer-reduced-motion';
21
20
  const placements = {
22
21
  topLeft: 'top-start',
23
22
  topCenter: 'top-center',
@@ -82,20 +81,15 @@ function getInitialDelaySpeed(delay) {
82
81
  }
83
82
  }
84
83
  const Tooltip = (_a) => {
85
- var { children, content, shortcut, placement = 'topCenter', keepOpen, triggerOffset = 4, maxWidth = 26, isInline = true, isDisabled, container, tabIndex = 0, zIndex = 1100, verticalAlign = 'middle', delay = 'immediate', dynamicPosition = false } = _a, rest = __rest(_a, ["children", "content", "shortcut", "placement", "keepOpen", "triggerOffset", "maxWidth", "isInline", "isDisabled", "container", "tabIndex", "zIndex", "verticalAlign", "delay", "dynamicPosition"]);
84
+ var { children, content, shortcut, placement = 'topCenter', keepOpen, triggerOffset = 4, maxWidth = 26, isInline = true, isDisabled, container, tabIndex = 0, zIndex = 1100, verticalAlign = 'middle', delay = 'immediate' } = _a, rest = __rest(_a, ["children", "content", "shortcut", "placement", "keepOpen", "triggerOffset", "maxWidth", "isInline", "isDisabled", "container", "tabIndex", "zIndex", "verticalAlign", "delay"]);
86
85
  const [show, hoverProps] = useHover({
87
86
  delayEnter: getInitialDelaySpeed(delay),
88
87
  delayLeave: 200,
89
88
  });
90
- const { handleMouseEvent, trigger, parentRef } = useMousePositionAsTrigger({
91
- enabled: show,
92
- });
93
89
  const [isOverTooltip, setIsOverTooltip] = useState(false);
94
90
  const [isOpen, setIsOpen] = useState(false);
95
91
  const focusRef = useRef();
96
92
  const isTooltipDisabled = !content || isDisabled;
97
- const prefersReducedMotion = usePrefersReducedMotion();
98
- const allowTrackMousePosition = dynamicPosition && !prefersReducedMotion;
99
93
  // show the tooltip if a user has focused or hovered on it AND it is not disabled
100
94
  useEffect(() => {
101
95
  const keepTooltipOpenOnHover = isOverTooltip && keepOpen;
@@ -148,10 +142,9 @@ const Tooltip = (_a) => {
148
142
  triggerOffset,
149
143
  container,
150
144
  auto: true,
151
- trigger: allowTrackMousePosition ? trigger : null,
152
145
  });
153
146
  return (React.createElement(React.Fragment, null,
154
- React.createElement(TooltipChildren, Object.assign({}, triggerProps, hoverProps, { onFocus: handleFocus, onBlur: handleBlur, isInline: isInline, verticalAlign: verticalAlign, tabIndex: isTooltipDisabled ? -1 : tabIndex, ref: mergeRefs(triggerProps.ref, focusRef, parentRef), onMouseMove: allowTrackMousePosition ? handleMouseEvent : null }), children),
147
+ React.createElement(TooltipChildren, Object.assign({}, triggerProps, hoverProps, { onFocus: handleFocus, onBlur: handleBlur, isInline: isInline, verticalAlign: verticalAlign, tabIndex: isTooltipDisabled ? -1 : tabIndex, ref: mergeRefs(triggerProps.ref, focusRef) }), children),
155
148
  isOpen &&
156
149
  renderLayer(React.createElement("div", Object.assign({}, layerProps, { style: Object.assign(Object.assign({}, layerProps.style), { zIndex }) }),
157
150
  React.createElement(TooltipBox, Object.assign({ maxWidth: maxWidth, onMouseEnter: () => setIsOverTooltip(true), onMouseLeave: () => setIsOverTooltip(false) }, rest),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@loomhq/lens",
3
- "version": "10.63.1",
3
+ "version": "10.63.3",
4
4
  "scripts": {
5
5
  "dev": "next",
6
6
  "build:next": "next build",
@@ -1 +0,0 @@
1
- export function usePrefersReducedMotion(): boolean;
@@ -1,17 +0,0 @@
1
- import { useEffect, useState } from 'react';
2
- const QUERY = '(prefers-reduced-motion: no-preference)';
3
- export function usePrefersReducedMotion() {
4
- const [prefersReducedMotion, setPrefersReducedMotion] = useState(true);
5
- useEffect(() => {
6
- const mediaQueryList = window.matchMedia(QUERY);
7
- setPrefersReducedMotion(!window.matchMedia(QUERY).matches);
8
- const listener = event => {
9
- setPrefersReducedMotion(!event.matches);
10
- };
11
- mediaQueryList.addEventListener('toggle motion', listener);
12
- return () => {
13
- mediaQueryList.removeEventListener('toggle motion', listener);
14
- };
15
- }, []);
16
- return prefersReducedMotion;
17
- }