@julien-wiegandt/open-ui 0.1.58 → 0.1.60

package/dist/components/popover/index.d.ts

@@ -8,6 +8,7 @@ export type PopoverStyleProps = {
     visible?: boolean;
     zIndex?: number;
     placement?: "left" | "right" | "top" | "bottom";
+    gap?: number;
     bgcolor?: string;
     arrowcolor?: string;
     radius?: Radius;
@@ -20,6 +21,7 @@ export declare const Popover: React.ForwardRefExoticComponent<{
     visible?: boolean;
     zIndex?: number;
     placement?: "left" | "right" | "top" | "bottom";
+    gap?: number;
     bgcolor?: string;
     arrowcolor?: string;
     radius?: Radius;

package/dist/index.d.ts

@@ -14,6 +14,7 @@ export * from './components/text';
 export * from './components/textarea';
 export * from './components/title';
 export * from './components/toast';
+export * from './components/utils/get-color-based-on-background';
 export * from './context/toast';
 export * from './hooks';
 export * from './theme/constants';

package/dist/open-ui.js

@@ -4729,11 +4729,11 @@ const Ld = gt(be)`
       ...e
     }), [e]);
     Ie(() => {
-      if (o?.current) {
+      if (o?.current && e.visible) {
         const { clientHeight: x, clientWidth: v } = o.current;
         u({ height: x, width: v });
       }
-    }, [o?.current]), Ie(() => {
+    }, [o?.current, e.visible]), Ie(() => {
       if (i?.current && e.visible) {
         const { clientHeight: x, clientWidth: v } = i.current;
         a({ height: x, width: v });
@@ -4742,7 +4742,7 @@ const Ld = gt(be)`
       const x = () => {
         if (!e.visible || !o.current || !i.current || s.height === 0 || c.height === 0)
           return;
-        const v = o.current.getBoundingClientRect(), k = window.scrollY, P = window.scrollX, { height: _, width: b } = s, { height: w, width: T } = c, E = 8, z = 8, I = 4;
+        const v = o.current.getBoundingClientRect(), k = window.scrollY, P = window.scrollX, { height: _, width: b } = s, { height: w, width: T } = c, E = e.gap ?? 8, z = 8, I = E - z / 2;
         let L = { top: 0, left: 0 }, O = { top: 0, left: 0 };
         const H = v.left + P + T / 2, V = v.top + k + w / 2;
         switch (g.placement) {
@@ -4790,7 +4790,7 @@ const Ld = gt(be)`
         window.removeEventListener("scroll", x, !0), window.removeEventListener("resize", x);
       };
     }, [e.visible, g.placement, s, c]), Ie(() => {
-      e.visible || (a({ height: 0, width: 0 }), d({ top: 0, left: 0 }), l({ top: 0, left: 0 }));
+      e.visible || (a({ height: 0, width: 0 }), u({ height: 0, width: 0 }), d({ top: 0, left: 0 }), l({ top: 0, left: 0 }));
     }, [e.visible]);
     const p = (x) => {
       if (o.current = x, Ds(n)) {
@@ -4811,7 +4811,8 @@ const Ld = gt(be)`
             top: `${f.top}px`,
             left: `${f.left}px`,
             zIndex: g.zIndex,
-            opacity: `${e.visible && s.height !== 0 && s.width !== 0 ? 1 : 0}`
+            opacity: `${e.visible && s.height !== 0 && s.width !== 0 ? 1 : 0}`,
+            transition: "opacity 0.25s ease"
           },
           children: e.content
         }
@@ -6286,6 +6287,7 @@ export {
   hh as ToastProvider,
   ao as breakpoints,
   Eh as createTheme,
+  yc as getColorBasedOnBackground,
   Ht as radiusMap,
   Un as useResponsive,
   Ph as useTheme,