@drivy/cobalt 2.19.1 → 3.0.0

package/components/Popover/useSingletonPopover.js

@@ -0,0 +1,148 @@
+import { useState, useRef, useCallback, useEffect } from 'react';
+import { registerPopover } from './popoverRegistry.js';
+import { useDesktopPopoverCore } from './useDesktopPopoverCore.js';
+
+function normalizeDelay(delay) {
+    var _a, _b;
+    if (typeof delay === "number") {
+        return { open: delay, close: delay };
+    }
+    return {
+        open: (_a = delay === null || delay === void 0 ? void 0 : delay.open) !== null && _a !== void 0 ? _a : 0,
+        close: (_b = delay === null || delay === void 0 ? void 0 : delay.close) !== null && _b !== void 0 ? _b : 0,
+    };
+}
+function useSingletonPopover({ trigger = "mouseenter", delay = 0, interactive = false, gracePeriod = 100, ...options }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const [referenceElement, setReferenceElement] = useState(null);
+    const [content, setContent] = useState(null);
+    const openTimeoutRef = useRef(null);
+    const closeTimeoutRef = useRef(null);
+    const delays = normalizeDelay(delay);
+    const clearOpenTimeout = useCallback(() => {
+        if (openTimeoutRef.current != null) {
+            window.clearTimeout(openTimeoutRef.current);
+            openTimeoutRef.current = null;
+        }
+    }, []);
+    const clearCloseTimeout = useCallback(() => {
+        if (closeTimeoutRef.current != null) {
+            window.clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = null;
+        }
+    }, []);
+    useEffect(() => {
+        return () => {
+            if (openTimeoutRef.current != null) {
+                window.clearTimeout(openTimeoutRef.current);
+            }
+            if (closeTimeoutRef.current != null) {
+                window.clearTimeout(closeTimeoutRef.current);
+            }
+        };
+    }, []);
+    const closePopover = useCallback((immediate = false, useGracePeriod = false) => {
+        clearOpenTimeout();
+        const run = () => {
+            setIsOpen(false);
+        };
+        const closeDelay = useGracePeriod
+            ? Math.max(delays.close, gracePeriod)
+            : delays.close;
+        if (immediate || closeDelay === 0) {
+            clearCloseTimeout();
+            run();
+            return;
+        }
+        clearCloseTimeout();
+        closeTimeoutRef.current = window.setTimeout(run, closeDelay);
+    }, [clearOpenTimeout, clearCloseTimeout, delays.close, gracePeriod]);
+    useEffect(() => {
+        return registerPopover(() => {
+            closePopover(true);
+        });
+    }, [closePopover]);
+    const core = useDesktopPopoverCore({
+        ...options,
+        isOpen,
+        onOpenChange: setIsOpen,
+        referenceElement,
+        trigger: "manual",
+        interactive,
+        getFloatingExtraProps: interactive && trigger === "mouseenter"
+            ? () => ({
+                onMouseEnter: () => {
+                    clearCloseTimeout();
+                },
+                onMouseLeave: () => {
+                    closePopover(false, true);
+                },
+            })
+            : undefined,
+    });
+    const openWithItem = (item, element, immediate = false) => {
+        clearCloseTimeout();
+        const run = () => {
+            setReferenceElement(element);
+            core.refs.setReference(element);
+            setContent(item.content);
+            setIsOpen(true);
+        };
+        const shouldOpenImmediately = immediate || isOpen || delays.open === 0;
+        if (shouldOpenImmediately) {
+            clearOpenTimeout();
+            run();
+            return;
+        }
+        clearOpenTimeout();
+        openTimeoutRef.current = window.setTimeout(run, delays.open);
+    };
+    const getReferenceProps = (item, userProps = {}) => {
+        const { onMouseEnter, onMouseLeave, onPointerEnter, onPointerLeave, onClick, ...restUserProps } = userProps;
+        return core.getReferenceProps({
+            ...restUserProps,
+            onMouseEnter: (e) => {
+                onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(e);
+                if (trigger === "mouseenter") {
+                    openWithItem(item, e.currentTarget);
+                }
+            },
+            onPointerEnter: (e) => {
+                onPointerEnter === null || onPointerEnter === void 0 ? void 0 : onPointerEnter(e);
+            },
+            onMouseLeave: (e) => {
+                onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(e);
+                if (trigger === "mouseenter" && !interactive) {
+                    closePopover(false, true);
+                }
+            },
+            onPointerLeave: (e) => {
+                onPointerLeave === null || onPointerLeave === void 0 ? void 0 : onPointerLeave(e);
+            },
+            onClick: (e) => {
+                onClick === null || onClick === void 0 ? void 0 : onClick(e);
+                if (trigger === "click") {
+                    const sameReference = referenceElement === e.currentTarget;
+                    setReferenceElement(e.currentTarget);
+                    core.refs.setReference(e.currentTarget);
+                    setContent(item.content);
+                    if (sameReference && isOpen) {
+                        setIsOpen(false);
+                    }
+                    else {
+                        setIsOpen(true);
+                    }
+                }
+            },
+        });
+    };
+    return {
+        getReferenceProps,
+        renderFloating: () => content == null ? null : core.renderFloating(content),
+        close: () => closePopover(true),
+        isOpen,
+    };
+}
+
+export { useSingletonPopover };
+//# sourceMappingURL=useSingletonPopover.js.map

package/components/Popover/useSingletonPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSingletonPopover.js","sources":["../../../src/components/Popover/useSingletonPopover.tsx"],"sourcesContent":["import type React from \"react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\nimport { registerPopover } from \"./popoverRegistry\"\nimport type { UseDesktopPopoverCoreOptions } from \"./useDesktopPopoverCore\"\nimport { useDesktopPopoverCore } from \"./useDesktopPopoverCore\"\n\ntype SingletonItem = {\n  content: React.ReactNode\n}\n\ntype SingletonReferenceProps = React.HTMLAttributes<HTMLElement>\n\ntype SingletonOptions = Omit<\n  UseDesktopPopoverCoreOptions,\n  | \"isOpen\"\n  | \"onOpenChange\"\n  | \"referenceElement\"\n  | \"trigger\"\n  | \"getFloatingExtraProps\"\n> & {\n  trigger?: \"click\" | \"mouseenter\"\n  gracePeriod?: number\n}\n\nfunction normalizeDelay(delay: SingletonOptions[\"delay\"]) {\n  if (typeof delay === \"number\") {\n    return { open: delay, close: delay }\n  }\n\n  return {\n    open: delay?.open ?? 0,\n    close: delay?.close ?? 0,\n  }\n}\n\nexport function useSingletonPopover({\n  trigger = \"mouseenter\",\n  delay = 0,\n  interactive = false,\n  gracePeriod = 100,\n  ...options\n}: SingletonOptions) {\n  const [isOpen, setIsOpen] = useState(false)\n  const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n    null,\n  )\n  const [content, setContent] = useState<React.ReactNode>(null)\n\n  const openTimeoutRef = useRef<number | null>(null)\n  const closeTimeoutRef = useRef<number | null>(null)\n\n  const delays = normalizeDelay(delay)\n\n  const clearOpenTimeout = useCallback(() => {\n    if (openTimeoutRef.current != null) {\n      window.clearTimeout(openTimeoutRef.current)\n      openTimeoutRef.current = null\n    }\n  }, [])\n\n  const clearCloseTimeout = useCallback(() => {\n    if (closeTimeoutRef.current != null) {\n      window.clearTimeout(closeTimeoutRef.current)\n      closeTimeoutRef.current = null\n    }\n  }, [])\n\n  useEffect(() => {\n    return () => {\n      if (openTimeoutRef.current != null) {\n        window.clearTimeout(openTimeoutRef.current)\n      }\n\n      if (closeTimeoutRef.current != null) {\n        window.clearTimeout(closeTimeoutRef.current)\n      }\n    }\n  }, [])\n\n  const closePopover = useCallback(\n    (immediate = false, useGracePeriod = false) => {\n      clearOpenTimeout()\n\n      const run = () => {\n        setIsOpen(false)\n      }\n\n      const closeDelay = useGracePeriod\n        ? Math.max(delays.close, gracePeriod)\n        : delays.close\n\n      if (immediate || closeDelay === 0) {\n        clearCloseTimeout()\n        run()\n        return\n      }\n\n      clearCloseTimeout()\n      closeTimeoutRef.current = window.setTimeout(run, closeDelay)\n    },\n    [clearOpenTimeout, clearCloseTimeout, delays.close, gracePeriod],\n  )\n\n  useEffect(() => {\n    return registerPopover(() => {\n      closePopover(true)\n    })\n  }, [closePopover])\n\n  const core = useDesktopPopoverCore({\n    ...options,\n    isOpen,\n    onOpenChange: setIsOpen,\n    referenceElement,\n    trigger: \"manual\",\n    interactive,\n    getFloatingExtraProps:\n      interactive && trigger === \"mouseenter\"\n        ? () => ({\n            onMouseEnter: () => {\n              clearCloseTimeout()\n            },\n            onMouseLeave: () => {\n              closePopover(false, true)\n            },\n          })\n        : undefined,\n  })\n\n  const openWithItem = (\n    item: SingletonItem,\n    element: HTMLElement,\n    immediate = false,\n  ) => {\n    clearCloseTimeout()\n\n    const run = () => {\n      setReferenceElement(element)\n      core.refs.setReference(element)\n      setContent(item.content)\n      setIsOpen(true)\n    }\n\n    const shouldOpenImmediately = immediate || isOpen || delays.open === 0\n\n    if (shouldOpenImmediately) {\n      clearOpenTimeout()\n      run()\n      return\n    }\n\n    clearOpenTimeout()\n    openTimeoutRef.current = window.setTimeout(run, delays.open)\n  }\n\n  const getReferenceProps = (\n    item: SingletonItem,\n    userProps: SingletonReferenceProps = {},\n  ) => {\n    const {\n      onMouseEnter,\n      onMouseLeave,\n      onPointerEnter,\n      onPointerLeave,\n      onClick,\n      ...restUserProps\n    } = userProps\n\n    return core.getReferenceProps({\n      ...restUserProps,\n\n      onMouseEnter: (e: React.MouseEvent<HTMLElement>) => {\n        onMouseEnter?.(e)\n\n        if (trigger === \"mouseenter\") {\n          openWithItem(item, e.currentTarget)\n        }\n      },\n\n      onPointerEnter: (e: React.PointerEvent<HTMLElement>) => {\n        onPointerEnter?.(e)\n      },\n\n      onMouseLeave: (e: React.MouseEvent<HTMLElement>) => {\n        onMouseLeave?.(e)\n\n        if (trigger === \"mouseenter\" && !interactive) {\n          closePopover(false, true)\n        }\n      },\n\n      onPointerLeave: (e: React.PointerEvent<HTMLElement>) => {\n        onPointerLeave?.(e)\n      },\n\n      onClick: (e: React.MouseEvent<HTMLElement>) => {\n        onClick?.(e)\n\n        if (trigger === \"click\") {\n          const sameReference = referenceElement === e.currentTarget\n\n          setReferenceElement(e.currentTarget)\n          core.refs.setReference(e.currentTarget)\n          setContent(item.content)\n\n          if (sameReference && isOpen) {\n            setIsOpen(false)\n          } else {\n            setIsOpen(true)\n          }\n        }\n      },\n    })\n  }\n\n  return {\n    getReferenceProps,\n    renderFloating: () =>\n      content == null ? null : core.renderFloating(content),\n    close: () => closePopover(true),\n    isOpen,\n  }\n}\n"],"names":[],"mappings":"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"}

package/index.js

@@ -50,6 +50,11 @@ export { default as PhotoDropzone } from './components/PhotoDropzone/index.js';
 export { Pill, PillGroup } from './components/Pill/index.js';
 export { PlateNumber } from './components/PlateNumber/index.js';
 export { default as Popover } from './components/Popover/index.js';
+export { PopoverWrapper } from './components/Popover/PopoverWrapper.js';
+export { hideAllPopovers } from './components/Popover/popoverRegistry.js';
+export { TooltipWrapper } from './components/Popover/TooltipWrapper.js';
+export { tooltipConfig } from './components/Popover/tooltipConfig.js';
+export { useSingletonPopover } from './components/Popover/useSingletonPopover.js';
 export { PriceTable, PriceTableRow } from './components/PriceTable/index.js';
 export { ProgressBanner } from './components/ProgressBanner/index.js';
 export { ProgressBar } from './components/ProgressBar/index.js';

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@drivy/cobalt",
-  "version": "2.19.1",
+  "version": "3.0.0",
   "description": "Opinionated design system for Drivy's projects.",
-  "main": "src/index.js",
+  "main": "index.js",
   "types": "types/src/index.d.ts",
   "sideEffects": [
     "*.css",
@@ -11,7 +11,8 @@
   "engines": {
     "node": ">=24.14.1"
   },
-  "module": "src/index.js",
+  "packageManager": "pnpm@11.1.3+sha512.c85357fe17ca12dd23dd7071822666dfd7e3cb76fe214e3370b5ea2fb34f2a231185509b63e717f3cd0acb38dd3f8d82bcd5e8172400ae678b70ea4fbed0896d",
+  "module": "index.js",
   "license": "MIT",
   "author": {
     "name": "Tim Petricola",
@@ -20,17 +21,16 @@
   },
   "dependencies": {
     "@ark-ui/react": "5.30.0",
+    "@floating-ui/react": "0.27.10",
     "@juggle/resize-observer": "3.4.0",
     "@lottiefiles/react-lottie-player": "3.6.0",
-    "@tippyjs/react": "4.2.6",
     "classnames": "2.5.1",
     "date-fns": "2.30.0",
     "lodash.throttle": "4.1.1",
     "media-typer": "1.1.0",
     "nanoid": "5.1.11",
     "postcss": "8.5.14",
-    "tailwindcss": "3.4.19",
-    "tippy.js": "6.3.7"
+    "tailwindcss": "3.4.19"
   },
   "peerDependencies": {
     "react": "^18.3.1",
@@ -65,7 +65,7 @@
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
     "nested-object-access": "^0.2.5",
-    "np": "10.3.0",
+    "np": "11.2.1",
     "postcss-flexbugs-fixes": "5.0.2",
     "postcss-loader": "8.2.1",
     "react": "18.3.1",
@@ -89,6 +89,25 @@
     "ts-jest": "29.4.9",
     "typescript": "5.9.3"
   },
+  "scripts": {
+    "build": "./scripts/build.sh",
+    "build:dev": "pnpm build && yalc publish dist/",
+    "build:publish": "pnpm build && pnpm np --contents dist --package-manager npm",
+    "deploy": "./scripts/publishToBranch.sh",
+    "lint": "biome check && stylelint \"src/**/*.scss\"",
+    "lint:fix": "biome check --fix && stylelint \"src/**/*.scss\" --fix",
+    "scss:vars": "ts-node -e 'console.log(require(\"./utils/tailwindcssThemeHelpers.js\").getFlattenedTheme())'",
+    "binary": "sh ./scripts/buildCobaltBinary.sh",
+    "storybook:prepare": "PLAYGROUND_GENERATION=true npx tailwindcss -i ./src/utilities.css -o ./src/_generated_tailwind_playground.css && PLAYGROUND_GENERATION=false",
+    "storybook": "pnpm storybook:prepare && storybook dev -p 6006",
+    "storybook:build": "pnpm storybook:prepare && storybook build",
+    "build:icons": "./scripts/buildIcons.sh",
+    "build:illustrations": "./scripts/buildIllustrations.sh",
+    "build:theme": "node ./scripts/buildThemeCSSVariables.mts",
+    "test": "jest",
+    "typecheck": "tsc",
+    "version": "cp package.json dist/package.json"
+  },
   "keywords": [
     "drivy",
     "cobalt"
@@ -108,24 +127,5 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org",
     "access": "public"
-  },
-  "scripts": {
-    "build": "./scripts/build.sh",
-    "build:dev": "pnpm build && yalc publish dist/",
-    "build:publish": "pnpm build && pnpm np --contents dist",
-    "deploy": "./scripts/publishToBranch.sh",
-    "lint": "biome check && stylelint \"src/**/*.scss\"",
-    "lint:fix": "biome check --fix && stylelint \"src/**/*.scss\" --fix",
-    "scss:vars": "ts-node -e 'console.log(require(\"./utils/tailwindcssThemeHelpers.js\").getFlattenedTheme())'",
-    "binary": "sh ./scripts/buildCobaltBinary.sh",
-    "storybook:prepare": "PLAYGROUND_GENERATION=true npx tailwindcss -i ./src/utilities.css -o ./src/_generated_tailwind_playground.css && PLAYGROUND_GENERATION=false",
-    "storybook": "pnpm storybook:prepare && storybook dev -p 6006",
-    "storybook:build": "pnpm storybook:prepare && storybook build",
-    "build:icons": "./scripts/buildIcons.sh",
-    "build:illustrations": "./scripts/buildIllustrations.sh",
-    "build:theme": "node ./scripts/buildThemeCSSVariables.mts",
-    "test": "jest",
-    "typecheck": "tsc",
-    "version": "cp package.json dist/package.json"
   }
-}
+}

package/styles/components/Calendar/CalendarRangePicker/index.scss

@@ -305,11 +305,3 @@
     }
   }
 }
-
-.tippy-box[data-theme~="range-picker"] {
-  @apply c-p-xs;
-
-  .tippy-content {
-    min-width: unset;
-  }
-}

package/styles/components/Popover/index.scss

@@ -1,90 +1,47 @@
-@import "tippy.js/dist/tippy.css";
-@import "tippy.js/themes/light.css";
-@import "tippy.js/animations/shift-away-subtle.css";
-
-[data-theme~="cobalt-popover"] {
-  &.tippy-box {
-    @apply c-bg-surfaceBright c-text-onSurface c-shadow-lg c-rounded-lg;
-  }
-
-  .tippy-content {
-    padding: 0;
-    min-width: 16rem;
-
-    @apply c-rounded-lg;
-  }
-
-  &[data-placement^="top"] > .tippy-arrow::before {
-    border-top-color: theme("colors.surfaceBright") !important;
-  }
-
-  &[data-placement^="bottom"] > .tippy-arrow::before {
-    border-bottom-color: theme("colors.surfaceBright") !important;
-  }
-
-  &[data-placement^="left"] > .tippy-arrow::before {
-    border-left-color: theme("colors.surfaceBright") !important;
-  }
-
-  &[data-placement^="right"] > .tippy-arrow::before {
-    border-right-color: theme("colors.surfaceBright") !important;
-  }
+.cobalt-popover {
+  @apply c-bg-surfaceBright c-text-onSurface c-shadow-lg c-rounded-lg;
+  padding: 0;
+  min-width: 16rem;
+  max-width: 500px;
 }
 
-[data-theme~="cobalt-popover--fitContent"] {
-  .tippy-content {
-    min-width: auto;
-  }
+.cobalt-popover--fitContent {
+  min-width: auto;
+  max-width: none;
 }
 
-[data-theme~="cobalt-popover--withArrow"] {
-  &.tippy-box {
-    @apply c-rounded-xl;
-  }
+.cobalt-popover--withArrow {
+  @apply c-rounded-xl;
+}
 
-  .tippy-content {
-    @apply c-rounded-xl;
-  }
+.cobalt-popover--withBorder {
+  @apply c-border c-border-outline;
 }
 
 .cobalt-popover--bodySpacing {
   padding: theme("spacing.md");
 }
 
+.cobalt-popover__arrow {
+  fill: theme("colors.surfaceBright");
+}
+
 .use-cobalt-dark-theme {
-  [data-theme~="cobalt-popover"] {
+  .cobalt-popover {
     box-shadow: 0 0 0 1px theme("colors.outline");
+  }
 
-    &[data-placement^="top"] > .tippy-arrow {
-      bottom: -1px;
-
-      &::before {
-        border-top-color: theme("colors.outline") !important;
-      }
-    }
-
-    &[data-placement^="bottom"] > .tippy-arrow {
-      top: -1px;
-
-      &::before {
-        border-bottom-color: theme("colors.outline") !important;
-      }
-    }
-
-    &[data-placement^="left"] > .tippy-arrow {
-      right: -1px;
+  .cobalt-popover__arrow {
+    fill: theme("colors.surfaceBright");
+    stroke: theme("colors.outline");
+    stroke-width: 1;
+  }
+}
 
-      &::before {
-        border-left-color: theme("colors.outline") !important;
-      }
-    }
+.cobalt-popover[data-theme~="tooltip"] {
+  @apply c-py-2xs c-px-xs c-rounded c-text-body-sm;
 
-    &[data-placement^="right"] > .tippy-arrow {
-      left: -1px;
+  min-width: auto;
 
-      &::before {
-        border-right-color: theme("colors.outline") !important;
-      }
-    }
-  }
+  box-shadow: elevation(), elevation(md);
 }

package/types/src/components/Popover/DesktopPopover.d.ts

@@ -0,0 +1,2 @@
+import type { PopoverPropsType } from ".";
+export declare const DesktopPopover: ({ targetRef, children, isOpen, onOpenChange, ...rest }: PopoverPropsType) => import("react").ReactNode;

package/types/src/components/Popover/PopoverWrapper.d.ts

@@ -0,0 +1,13 @@
+import React, { type ReactElement, type Ref } from "react";
+import { type PopoverPropsType } from ".";
+type RefableElement = ReactElement & {
+    ref?: Ref<HTMLElement>;
+};
+export type PopoverWrapperPropsType = Omit<PopoverPropsType, "targetRef" | "children" | "isOpen"> & {
+    content: React.ReactNode;
+    disabled?: boolean;
+    isOpenByDefault?: boolean;
+    children: RefableElement;
+};
+export declare function PopoverWrapper({ content, children, trigger, onOpenChange, isOpenByDefault, disabled, responsive, ...popoverProps }: PopoverWrapperPropsType): import("react/jsx-runtime").JSX.Element;
+export {};

package/types/src/components/Popover/TooltipWrapper.d.ts

@@ -0,0 +1,3 @@
+import { type PopoverWrapperPropsType } from "./PopoverWrapper";
+export type TooltipWrapperPropsType = Omit<PopoverWrapperPropsType, "responsive">;
+export declare function TooltipWrapper({ content, children, ...popoverProps }: TooltipWrapperPropsType): import("react/jsx-runtime").JSX.Element;

package/types/src/components/Popover/index.d.ts

@@ -1,29 +1,18 @@
-import { type TippyProps } from "@tippyjs/react";
 import type React from "react";
-export type PopoverPropsType = {
-    children?: React.ReactNode;
+import type { DesktopPopoverCoreRefs, PopoverConfig } from "./useDesktopPopoverCore";
+type DesktopPopoverRenderProps = {
+    refs: DesktopPopoverCoreRefs;
+    getReferenceProps: ReturnType<typeof import("@floating-ui/react").useInteractions>["getReferenceProps"];
+    renderFloating: (content: React.ReactNode) => React.ReactNode;
+};
+export type DesktopPopoverChildren = React.ReactNode | ((props: DesktopPopoverRenderProps) => React.ReactNode);
+export type PopoverPropsType = PopoverConfig & {
+    children?: DesktopPopoverChildren;
     isOpen: boolean;
-    close: () => void;
+    onOpenChange?: (open: boolean) => void;
     "aria-label"?: string;
-    bodySpacing?: boolean;
-    onShow?: () => void;
-    onHidden?: () => void;
-    targetRef: TippyProps["reference"];
-    arrow?: boolean;
-    placement?: TippyProps["placement"];
-    flip?: boolean;
-    theme?: string;
-    distance?: number;
-    zIndex?: number;
-    appendToBody?: boolean;
-    fitContent?: boolean;
-    /**
-     * __Only for desktop popover__
-     *
-     * Allow to render the content only when the popover is mounted in the DOM
-     * Useful to render async content in the popover
-     */
-    lazy?: boolean;
+    targetRef: React.RefObject<Element | null> | Element | null;
+    responsive?: boolean;
 };
-declare const Popover: ({ isOpen, targetRef, close, "aria-label": ariaLabel, children, bodySpacing, onShow, onHidden, arrow, placement, flip, theme, distance, zIndex, appendToBody, fitContent, lazy, }: PopoverPropsType) => import("react/jsx-runtime").JSX.Element;
+declare const Popover: ({ arrow, placement, bodySpacing, appendToBody, fitContent, responsive, ...restProps }: PopoverPropsType) => import("react/jsx-runtime").JSX.Element;
 export default Popover;

package/types/src/components/Popover/popoverRegistry.d.ts

@@ -0,0 +1,4 @@
+type CloseFn = () => void;
+export declare const registerPopover: (close: CloseFn) => () => void;
+export declare const hideAllPopovers: () => void;
+export {};

package/types/src/components/Popover/tooltipConfig.d.ts

@@ -0,0 +1,9 @@
+export declare const tooltipConfig: {
+    trigger: "mouseenter";
+    interactive: false;
+    tooltip: true;
+    arrow: true;
+    placement: "top";
+    bodySpacing: false;
+    appendToBody: true;
+};

package/types/src/components/Popover/useDesktopPopoverCore.d.ts

@@ -0,0 +1,44 @@
+import { type Placement } from "@floating-ui/react";
+import type React from "react";
+export type PopoverConfig = {
+    placement?: Placement;
+    flip?: boolean;
+    arrow?: boolean;
+    theme?: string;
+    tooltip?: boolean;
+    lightMode?: boolean;
+    zIndex?: number;
+    appendToBody?: boolean;
+    withBorder?: boolean;
+    fitContent?: boolean;
+    trigger?: "click" | "mouseenter";
+    interactive?: boolean;
+    delay?: number | {
+        open?: number;
+        close?: number;
+    };
+    offset?: [number, number];
+    bodySpacing?: boolean;
+    onShow?: () => void;
+    onHidden?: () => void;
+};
+export type UseDesktopPopoverCoreOptions = Omit<PopoverConfig, "trigger"> & {
+    isOpen: boolean;
+    onOpenChange?: (open: boolean) => void;
+    referenceElement: Element | null;
+    trigger?: "click" | "mouseenter" | "manual";
+    ariaLabel?: string;
+    getFloatingExtraProps?: () => React.HTMLAttributes<HTMLElement>;
+};
+export type DesktopPopoverCoreRefs = {
+    setReference: (node: Element | null) => void;
+    setFloating: (node: HTMLElement | null) => void;
+};
+type UseDesktopPopoverCoreReturnType = {
+    refs: DesktopPopoverCoreRefs;
+    getReferenceProps: ReturnType<typeof import("@floating-ui/react").useInteractions>["getReferenceProps"];
+    renderFloating: (content: React.ReactNode) => React.ReactNode;
+    isMounted: boolean;
+};
+export declare function useDesktopPopoverCore({ isOpen, onOpenChange, referenceElement, placement, flip, tooltip, arrow: showArrow, theme, zIndex, appendToBody, fitContent, withBorder, trigger, interactive, delay, offset, bodySpacing, ariaLabel, onShow, onHidden, getFloatingExtraProps, }: UseDesktopPopoverCoreOptions): UseDesktopPopoverCoreReturnType;
+export {};