@seeqdev/qomponents 0.0.66 → 0.0.67
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.esm.js +12 -9
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +12 -9
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -15003,7 +15003,7 @@ const disabledClasses$1 = ['tw-opacity-50', 'tw-cursor-not-allowed'].join(' ');
|
|
|
15003
15003
|
const ButtonWithPopover = ({ children, trigger, id, hasArrow, extraTriggerClassNames, extraPopoverClassNames, containerTestId, onInteractOutside, onPointerDownOutside, disabled = false, align = 'end', alignOffset = -35, placement = 'bottom', placementOffset = 2, isHoverEnabled = false, hoverOpenDelay = 300, onOpenChange, isOpen, isCloseOnContentClick = false, setFocusOnTriggerOnClose = true, ...tooltipProps }) => {
|
|
15004
15004
|
const tooltipData = getQTipData(tooltipProps);
|
|
15005
15005
|
let timeout;
|
|
15006
|
-
const [isHoveredOpen, setIsHoveredOpen] = React.useState();
|
|
15006
|
+
const [isHoveredOpen, setIsHoveredOpen] = React.useState(false);
|
|
15007
15007
|
const onHoverStart = () => {
|
|
15008
15008
|
if (isHoverEnabled) {
|
|
15009
15009
|
timeout = setTimeout(() => {
|
|
@@ -15021,16 +15021,19 @@ const ButtonWithPopover = ({ children, trigger, id, hasArrow, extraTriggerClassN
|
|
|
15021
15021
|
}
|
|
15022
15022
|
};
|
|
15023
15023
|
React.useEffect(() => () => timeout && clearTimeout(timeout), []);
|
|
15024
|
-
|
|
15025
|
-
React.createElement($cb5cc270b50c6fcd$export$
|
|
15026
|
-
React.createElement(
|
|
15027
|
-
|
|
15028
|
-
React.createElement(
|
|
15024
|
+
const renderPopover = (popoverOpenState) => {
|
|
15025
|
+
return (React.createElement($cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, { open: popoverOpenState, defaultOpen: false, onOpenChange: onOpenChange },
|
|
15026
|
+
React.createElement($cb5cc270b50c6fcd$export$41fb9f06171c75f4, { id: id, className: `tw-border-none`, disabled: disabled },
|
|
15027
|
+
React.createElement("div", { ...tooltipData, onMouseOver: onHoverStart, onMouseOut: onHoverEnd, className: `tw-bg-transparent tw-flex tw-flex-col tw-items-center tw-justify-center focus-visible:tw-outline-none tw-outline-none ${disabled ? disabledClasses$1 : ''} ${extraTriggerClassNames || ''}` }, trigger)),
|
|
15028
|
+
React.createElement($cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, { sideOffset: placementOffset, align: align, side: placement, onInteractOutside: onInteractOutside, onPointerDownOutside: onPointerDownOutside, alignOffset: isHoverEnabled ? -10 : alignOffset, asChild: true, onClick: () => isCloseOnContentClick && onOpenChange && onOpenChange(false), className: "focus-visible:tw-outline-none tw-outline-none" },
|
|
15029
|
+
React.createElement("div", { "data-testid": containerTestId, className: `${bgStyles$1} ${borderStyles$1} tw-relative tw-z-[1000] tw-min-w-6 focus-visible:tw-outline-none tw-outline-none data-[state=open]:tw-animate-in data-[state=closed]:tw-animate-out
|
|
15029
15030
|
data-[side=top]:tw-animate-slideDownAndFade data-[side=right]:tw-animate-slideLeftAndFade data-[side=bottom]:tw-animate-slideUpAndFade data-[side=left]:tw-animate-slideRightAndFade tw-text-sq-text-color
|
|
15030
15031
|
${extraPopoverClassNames || ''}` },
|
|
15031
|
-
|
|
15032
|
-
|
|
15033
|
-
|
|
15032
|
+
hasArrow && (React.createElement($cb5cc270b50c6fcd$export$21b07c8f274aebd5, { asChild: true },
|
|
15033
|
+
React.createElement("div", { className: " tw-fill-transparent tw-bg-white tw-w-[15px] tw-h-[15px] tw-mt-[-7px] tw-rotate-45 dark:tw-bg-sq-dark-background tw-border-b tw-border-r tw-border-sq-disabled-gray dark:tw-border-gray-500" }))),
|
|
15034
|
+
children))));
|
|
15035
|
+
};
|
|
15036
|
+
return isHoverEnabled ? renderPopover(isHoveredOpen) : renderPopover(isOpen);
|
|
15034
15037
|
};
|
|
15035
15038
|
|
|
15036
15039
|
const $6cc32821e9371a1c$var$SELECTION_KEYS = [
|