@cypress-design/react-tooltip 0.3.2 → 0.3.4

package/dist/index.umd.js

@@ -30366,7 +30366,7 @@ var Tooltip = function (_a) {
                     fn: function (obj) { return obj; }
                 }
                 : flip(),
-            offset(0),
+            offset(interactive ? 0 : 16),
             arrow({ element: arrowRef, padding: 24 }),
         ],
         whileElementsMounted: autoUpdate
@@ -30418,32 +30418,27 @@ var Tooltip = function (_a) {
     var colors = getColors();
     return (React__namespace.createElement(React__namespace.Fragment, null,
         React__namespace.createElement("div", __assign({}, getReferenceProps(), { ref: reference, className: className }, rest), children),
-        React__namespace.createElement(FloatingPortal, null, open && !disabled && (React__namespace.createElement("div", __assign({}, getFloatingProps({
+        disabled ? null : (React__namespace.createElement(FloatingPortal, null, open && (React__namespace.createElement("div", __assign({}, getFloatingProps({
             ref: floating,
-            style: {
-                position: strategy,
-                top: y !== null && y !== void 0 ? y : '',
-                left: x !== null && x !== void 0 ? x : '',
-                padding: '16px'
-            }
+            style: __assign({ position: strategy, top: y !== null && y !== void 0 ? y : '', left: x !== null && x !== void 0 ? x : '' }, (interactive ? { padding: '16px' } : {}))
         })),
             React__namespace.createElement("div", { className: clsx__default["default"]('rounded shadow border', [
                     colors.background,
                     colors.block,
                     (!x || !y) && 'invisible',
                 ]) },
-                React__namespace.createElement("svg", { ref: arrowRef, viewBox: "0 0 48 48", width: "24", height: "24", className: clsx__default["default"]('absolute z-10', colors.svg), style: (_b = {
+                React__namespace.createElement("svg", { ref: arrowRef, viewBox: "0 0 48 24", width: "24", height: "12", className: clsx__default["default"]('absolute z-10', colors.svg), style: (_b = {
                             transform: "rotate(" + arrowRotate + "deg)",
                             filter: placementSide === 'bottom' || color === 'dark'
                                 ? 'drop-shadow(0 1px 1px rgba(225, 227, 237, .3))'
                                 : 'drop-shadow(0 1px 1px rgba(225, 227, 237, .8))'
                         },
-                        _b[arrowXRule] = (arrowX !== null && arrowX !== void 0 ? arrowX : -6) + "px",
-                        _b[arrowYRule] = (arrowY !== null && arrowY !== void 0 ? arrowY : -6) + "px",
+                        _b[arrowXRule] = (arrowX !== null && arrowX !== void 0 ? arrowX : (interactive ? 0 : -16)) + "px",
+                        _b[arrowYRule] = (arrowY ? arrowY + 6 : interactive ? 6 : -10) + "px",
                         _b), fill: "none" },
                     React__namespace.createElement("rect", { x: "0", y: "0", width: "48", height: "4", strokeWidth: "0" }),
                     React__namespace.createElement("path", { d: "M 0 3 C 12 3 18 18 24 18 C 30 18 36 3 48 3", strokeWidth: "2" })),
-                React__namespace.createElement("div", { className: clsx__default["default"]('rounded text-16px leading-24px min-w-160px text-center p-8px relative z-20', colors.background) }, popper)))))));
+                React__namespace.createElement("div", { className: clsx__default["default"]('rounded text-16px leading-24px min-w-160px text-center p-8px relative z-20', colors.background) }, popper))))))));
 };
 
 module.exports = Tooltip;