bianic-ui 2.2.0-beta.1 → 2.2.0

package/dist/cjs/types/components/Popover/index.d.ts

@@ -1,8 +1,16 @@
 import React from 'react';
-import { PopoverProps } from './PropInterface';
-declare function Popover({ className, children, content, direction, maxWidth, title, style, zIndex, }: PopoverProps): React.JSX.Element;
+interface PopoverProps {
+    children: React.ReactNode;
+    content: string;
+    delay?: number;
+    direction?: 'top' | 'right' | 'bottom' | 'left' | 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
+    title?: string;
+    maxWidth?: string;
+}
+declare function Popover({ children, content, delay, direction, title, maxWidth, }: PopoverProps): React.JSX.Element;
 declare namespace Popover {
     var defaultProps: {
+        delay: number;
         direction: string;
         title: string;
     };

package/dist/cjs/types/components/Tooltip/PropsInterface.d.ts

@@ -1,20 +1,16 @@
-import { ComponentPropsWithoutRef, ComponentPropsWithRef, ReactNode, RefObject } from 'react';
+import { ComponentPropsWithoutRef, ReactNode, RefObject } from 'react';
 interface TooltipProps extends Omit<ComponentPropsWithoutRef<'div'>, 'content'> {
     children: ReactNode;
     content: ReactNode | string;
     delay?: number;
     maxWidth?: string;
-    zIndex?: number;
     direction?: 'top' | 'right' | 'bottom' | 'left' | 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
 }
 interface TooltipItemProps {
     anchorRef: RefObject<HTMLDivElement>;
-    className?: string;
+    direction?: 'top' | 'right' | 'bottom' | 'left' | 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
     content: ReactNode | string;
     tooltipContainerRef: React.RefObject<HTMLDivElement>;
     tooltipContainerStyle: React.CSSProperties;
-    style?: ComponentPropsWithRef<'div'>['style'];
-    zIndex: number;
-    direction?: 'top' | 'right' | 'bottom' | 'left' | 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
 }
 export { TooltipProps, TooltipItemProps };

package/dist/esm/index.js

@@ -1987,15 +1987,15 @@ MenuItem.defaultProps = {
 };
 
 function Tooltip(props) {
-    var children = props.children, content = props.content, delay = props.delay, _a = props.direction, direction = _a === void 0 ? 'top' : _a, _b = props.maxWidth, maxWidth = _b === void 0 ? undefined : _b, _c = props.zIndex, zIndex = _c === void 0 ? 150 : _c, className = props.className, style = props.style;
+    var children = props.children, content = props.content, delay = props.delay, _a = props.direction, direction = _a === void 0 ? 'top' : _a, _b = props.maxWidth, maxWidth = _b === void 0 ? undefined : _b;
     var timeout;
-    var _d = useState(false), active = _d[0], setActive = _d[1];
+    var _c = useState(false), active = _c[0], setActive = _c[1];
     var anchorRef = useRef(null);
     var tooltipContainerRef = useRef(null);
-    var _e = useState({
+    var _d = useState({
         maxWidth: maxWidth + 'px',
         whiteSpace: 'nowrap',
-    }), tooltipContainerStyle = _e[0], setTooltipContainerStyle = _e[1];
+    }), tooltipContainerStyle = _d[0], setTooltipContainerStyle = _d[1];
     var showTip = function () {
         timeout = setTimeout(function () {
             setActive(true);
@@ -2039,12 +2039,12 @@ function Tooltip(props) {
     }, [content, maxWidth, scrollWidth, offsetHeight]);
     return (React.createElement("div", { className: "tooltip-wrapper relative inline-flex h-fit w-fit flex-col", onMouseEnter: showTip, onMouseLeave: hideTip, ref: anchorRef },
         children,
-        active && (React.createElement(TooltipItem, { anchorRef: anchorRef, direction: direction, content: content, tooltipContainerRef: tooltipContainerRef, tooltipContainerStyle: tooltipContainerStyle, zIndex: zIndex, className: className, style: style }))));
+        active && (React.createElement(TooltipItem, { anchorRef: anchorRef, direction: direction, content: content, tooltipContainerRef: tooltipContainerRef, tooltipContainerStyle: tooltipContainerStyle }))));
 }
 var TooltipItem = function (_a) {
-    var anchorRef = _a.anchorRef, className = _a.className, content = _a.content, direction = _a.direction, style = _a.style, tooltipContainerRef = _a.tooltipContainerRef, tooltipContainerStyle = _a.tooltipContainerStyle, zIndex = _a.zIndex;
+    var anchorRef = _a.anchorRef, direction = _a.direction, content = _a.content, tooltipContainerRef = _a.tooltipContainerRef, tooltipContainerStyle = _a.tooltipContainerStyle;
     var positionStyle = usePopupPosition(anchorRef, tooltipContainerRef, direction)[0];
-    return createPortal(React.createElement("div", { className: "tooltip-container break-word absolute inline-block break-all rounded-[4px] bg-primary-black px-[7px] py-[4px] text-size-sm text-primary-white ".concat(className), style: __assign(__assign(__assign({ zIndex: zIndex }, positionStyle), tooltipContainerStyle), style), ref: tooltipContainerRef }, content), document.body);
+    return createPortal(React.createElement("div", { className: "tooltip-container break-word absolute z-50 inline-block break-all rounded-[4px] bg-primary-black px-[7px] py-[4px] text-size-sm text-primary-white", style: __assign(__assign({}, positionStyle), tooltipContainerStyle), ref: tooltipContainerRef }, content), document.body);
 };
 Tooltip.defaultProps = {
     delay: 400,
@@ -3707,19 +3707,20 @@ var classConfig = {
 };
 
 function Popover(_a) {
-    var className = _a.className, children = _a.children, content = _a.content, _b = _a.direction, direction = _b === void 0 ? 'bottom' : _b; _a.maxWidth; var _c = _a.title, title = _c === void 0 ? '' : _c, style = _a.style, zIndex = _a.zIndex;
+    var children = _a.children, content = _a.content; _a.delay; var _c = _a.direction, direction = _c === void 0 ? 'bottom' : _c, _d = _a.title, title = _d === void 0 ? '' : _d; _a.maxWidth;
     var wrapperRef = useRef(null);
-    var _d = useDetectOutsideClick(wrapperRef, false), isOpen = _d[0], setIsOpen = _d[1];
+    useRef(null);
+    var _e = useDetectOutsideClick(wrapperRef, false), isOpen = _e[0], setIsOpen = _e[1];
     return (React.createElement("div", { className: "Bianic-popover-Wrapper relative block h-fit w-fit", role: "button", ref: wrapperRef, onClick: function () { return setIsOpen(true); } },
         children,
-        isOpen && (React.createElement(PopoverItem, { title: title, content: content, anchorRef: wrapperRef, direction: direction, className: className, style: style, zIndex: zIndex }))));
+        isOpen && (React.createElement(PopoverItem, { title: title, content: content, anchorRef: wrapperRef, direction: direction }))));
 }
 var PopoverItem = function (_a) {
-    var title = _a.title, content = _a.content, anchorRef = _a.anchorRef, direction = _a.direction, className = _a.className, style = _a.style, zIndex = _a.zIndex;
+    var title = _a.title, content = _a.content, anchorRef = _a.anchorRef, direction = _a.direction;
     var popoverRef = useRef(null);
     var positionStyle = usePopupPosition(anchorRef, popoverRef, direction)[0];
     var _b = classConfig[direction], triangleContainer = _b.triangleContainer, triangleShape = _b.triangleShape;
-    return createPortal(React.createElement("div", { ref: popoverRef, style: __assign(__assign(__assign({}, positionStyle), style), { zIndex: zIndex }), className: "Bianic-popover-Tip text-bia-sm absolute z-50 w-[245px] space-y-[5px] rounded-[4px] bg-primary-black px-[20px] py-[17.5px] text-primary-white ".concat(className) },
+    return createPortal(React.createElement("div", { ref: popoverRef, style: positionStyle, className: "Bianic-popover-Tip text-bia-sm absolute z-50 w-[245px] space-y-[5px] rounded-[4px] bg-primary-black px-[20px] py-[17.5px] text-primary-white" },
         React.createElement("div", { className: "flex flex-col" },
             React.createElement("div", { className: "mb-[5px] font-humnst777 text-[16px] font-bold leading-[19.42px]" }, title),
             React.createElement("div", { className: "break-words font-segoe text-[12px] font-normal" }, content)),
@@ -3727,6 +3728,7 @@ var PopoverItem = function (_a) {
             React.createElement("div", { className: "h-0 w-0 ".concat(triangleShape) }))), document.body);
 };
 Popover.defaultProps = {
+    delay: 400,
     direction: 'top',
     title: '',
 };