@drivy/cobalt 3.0.0 → 3.0.2

package/components/MarketingNote/index.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import cx from 'classnames';
 
-const MarketingNote = ({ children, title, icon, className, variant, }) => (jsxs("div", { className: cx(`cobalt-marketing-note cobalt-marketing-note--${variant}`, className), children: [icon && (jsx("div", { className: "cobalt-marketing-note__icon-container", children: icon })), jsxs("div", { className: "c-flex-1", children: [title && jsx("div", { className: "c-font-bold", children: title }), children] })] }));
+const MarketingNote = ({ children, title, icon, className, variant, compact = false, }) => (jsxs("div", { className: cx(`cobalt-marketing-note cobalt-marketing-note--${variant}`, className, { "cobalt-marketing-note--compact": compact }), children: [icon && (jsx("div", { className: "cobalt-marketing-note__icon-container", children: icon })), jsxs("div", { className: "cobalt-marketing-note__content", children: [title && jsx("div", { className: "c-font-bold", children: title }), children] })] }));
 
 export { MarketingNote };
 //# sourceMappingURL=index.js.map

package/components/MarketingNote/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/MarketingNote/index.tsx"],"sourcesContent":["import cx from \"classnames\"\nimport type { PropsWithChildren } from \"react\"\n\nexport type MarketingNoteProps = PropsWithChildren<{\n  variant: \"success\" | \"tertiary\"\n  title?: string\n  icon?: React.JSX.Element\n  className?: string\n}>\n\nexport const MarketingNote = ({\n  children,\n  title,\n  icon,\n  className,\n  variant,\n}: MarketingNoteProps) => (\n  <div\n    className={cx(\n      `cobalt-marketing-note cobalt-marketing-note--${variant}`,\n      className,\n    )}\n  >\n    {icon && (\n      <div className=\"cobalt-marketing-note__icon-container\">{icon}</div>\n    )}\n\n    <div className=\"c-flex-1\">\n      {title && <div className=\"c-font-bold\">{title}</div>}\n      {children}\n    </div>\n  </div>\n)\n"],"names":["_jsxs","_jsx"],"mappings":";;;AAUO,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,SAAS,EACT,OAAO,GACY,MACnBA,IACE,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CACX,CAAA,6CAAA,EAAgD,OAAO,CAAA,CAAE,EACzD,SAAS,CACV,EAEA,QAAA,EAAA,CAAA,IAAI,KACHC,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,uCAAuC,EAAE,QAAA,EAAA,IAAI,EAAO,CAAA,CACpE,EAEDD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,UAAU,EACtB,QAAA,EAAA,CAAA,KAAK,IAAIC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,aAAa,EAAA,QAAA,EAAE,KAAK,EAAA,CAAO,EACnD,QAAQ,CACL,EAAA,CAAA,CAAA,EAAA,CACF;;;;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/MarketingNote/index.tsx"],"sourcesContent":["import cx from \"classnames\"\nimport type { PropsWithChildren } from \"react\"\n\nexport type MarketingNoteProps = PropsWithChildren<{\n  variant: \"success\" | \"tertiary\"\n  title?: string\n  icon?: React.JSX.Element\n  compact?: boolean\n  className?: string\n}>\n\nexport const MarketingNote = ({\n  children,\n  title,\n  icon,\n  className,\n  variant,\n  compact = false,\n}: MarketingNoteProps) => (\n  <div\n    className={cx(\n      `cobalt-marketing-note cobalt-marketing-note--${variant}`,\n      className,\n      { \"cobalt-marketing-note--compact\": compact },\n    )}\n  >\n    {icon && (\n      <div className=\"cobalt-marketing-note__icon-container\">{icon}</div>\n    )}\n\n    <div className=\"cobalt-marketing-note__content\">\n      {title && <div className=\"c-font-bold\">{title}</div>}\n      {children}\n    </div>\n  </div>\n)\n"],"names":["_jsxs","_jsx"],"mappings":";;;AAWO,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,SAAS,EACT,OAAO,EACP,OAAO,GAAG,KAAK,GACI,MACnBA,IACE,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CACX,CAAgD,6CAAA,EAAA,OAAO,CAAE,CAAA,EACzD,SAAS,EACT,EAAE,gCAAgC,EAAE,OAAO,EAAE,CAC9C,EAAA,QAAA,EAAA,CAEA,IAAI,KACHC,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,uCAAuC,EAAA,QAAA,EAAE,IAAI,EAAA,CAAO,CACpE,EAEDD,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gCAAgC,EAC5C,QAAA,EAAA,CAAA,KAAK,IAAIC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,aAAa,EAAE,QAAA,EAAA,KAAK,GAAO,EACnD,QAAQ,CACL,EAAA,CAAA,CAAA,EAAA,CACF;;;;"}

package/components/Popover/useDesktopPopoverCore.js

@@ -5,13 +5,14 @@ import { useRef, useEffect } from 'react';
 import { zIndexes } from '../../tokens/index.js';
 
 const ANIMATION_TRANSITION_DISTANCE_PX = 4;
-function useDesktopPopoverCore({ isOpen, onOpenChange, referenceElement, placement = "top", flip: flip$1 = true, tooltip = false, arrow: showArrow = true, theme = "", zIndex = zIndexes.dropdown, appendToBody = true, fitContent = true, withBorder = false, trigger = "click", interactive = false, delay = 0, offset: offset$1, bodySpacing = false, ariaLabel, onShow, onHidden, getFloatingExtraProps, }) {
+function useDesktopPopoverCore({ isOpen, onOpenChange, referenceElement, placement = "top", flip: flip$1 = true, tooltip = false, arrow: showArrow = true, theme = "", zIndex = zIndexes.dropdown, appendToBody = true, fixed = false, fitContent = true, withBorder = false, trigger = "click", interactive = false, delay = 0, offset: offset$1, bodySpacing = false, ariaLabel, onShow, onHidden, getFloatingExtraProps, }) {
     const arrowRef = useRef(null);
     const [crossAxis, mainAxis] = offset$1 !== null && offset$1 !== void 0 ? offset$1 : [0, showArrow ? 12 : 8];
     const { refs, floatingStyles, context } = useFloating({
         open: isOpen,
         onOpenChange,
         placement,
+        strategy: fixed ? "fixed" : "absolute",
         transform: false,
         middleware: [
             shift({ padding: 8 }),

package/components/Popover/useDesktopPopoverCore.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDesktopPopoverCore.js","sources":["../../../src/components/Popover/useDesktopPopoverCore.tsx"],"sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  FloatingArrow,\n  FloatingPortal,\n  flip as flipMiddleware,\n  offset as offsetMiddleware,\n  type Placement,\n  safePolygon,\n  shift as shiftMiddleware,\n  useClick,\n  useDismiss,\n  useFloating,\n  useHover,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n} from \"@floating-ui/react\"\nimport classNames from \"classnames\"\nimport type React from \"react\"\nimport { useEffect, useRef } from \"react\"\nimport { zIndexes } from \"../../tokens\"\n\nconst ANIMATION_TRANSITION_DISTANCE_PX = 4\n\nexport type PopoverConfig = {\n  placement?: Placement\n  flip?: boolean\n  arrow?: boolean\n  theme?: string\n  tooltip?: boolean\n  lightMode?: boolean\n  zIndex?: number\n  appendToBody?: boolean\n  withBorder?: boolean\n  fitContent?: boolean\n  trigger?: \"click\" | \"mouseenter\"\n  interactive?: boolean\n  delay?: number | { open?: number; close?: number }\n  offset?: [number, number]\n  bodySpacing?: boolean\n  onShow?: () => void\n  onHidden?: () => void\n}\n\nexport type UseDesktopPopoverCoreOptions = Omit<PopoverConfig, \"trigger\"> & {\n  isOpen: boolean\n  onOpenChange?: (open: boolean) => void\n  referenceElement: Element | null\n  trigger?: \"click\" | \"mouseenter\" | \"manual\"\n  ariaLabel?: string\n  getFloatingExtraProps?: () => React.HTMLAttributes<HTMLElement>\n}\n\nexport type DesktopPopoverCoreRefs = {\n  setReference: (node: Element | null) => void\n  setFloating: (node: HTMLElement | null) => void\n}\n\ntype UseDesktopPopoverCoreReturnType = {\n  refs: DesktopPopoverCoreRefs\n  getReferenceProps: ReturnType<\n    typeof import(\"@floating-ui/react\").useInteractions\n  >[\"getReferenceProps\"]\n  renderFloating: (content: React.ReactNode) => React.ReactNode\n  isMounted: boolean\n}\n\nexport function useDesktopPopoverCore({\n  isOpen,\n  onOpenChange,\n  referenceElement,\n  placement = \"top\",\n  flip = true,\n  tooltip = false,\n  arrow: showArrow = true,\n  theme = \"\",\n  zIndex = zIndexes.dropdown,\n  appendToBody = true,\n  fitContent = true,\n  withBorder = false,\n  trigger = \"click\",\n  interactive = false,\n  delay = 0,\n  offset,\n  bodySpacing = false,\n  ariaLabel,\n  onShow,\n  onHidden,\n  getFloatingExtraProps,\n}: UseDesktopPopoverCoreOptions): UseDesktopPopoverCoreReturnType {\n  const arrowRef = useRef<SVGSVGElement | null>(null)\n\n  const [crossAxis, mainAxis] = offset ?? [0, showArrow ? 12 : 8]\n\n  const { refs, floatingStyles, context } = useFloating({\n    open: isOpen,\n    onOpenChange,\n    placement,\n    transform: false,\n    middleware: [\n      shiftMiddleware({ padding: 8 }),\n      offsetMiddleware({ mainAxis, crossAxis }),\n      ...(flip ? [flipMiddleware()] : []),\n      ...(showArrow ? [arrow({ element: arrowRef })] : []),\n    ],\n    whileElementsMounted: autoUpdate,\n    elements: { reference: referenceElement },\n  })\n\n  const isHover = trigger === \"mouseenter\"\n  const isClick = trigger === \"click\"\n\n  const hover = useHover(context, {\n    enabled: isHover,\n    move: false,\n    delay,\n    handleClose: isHover && interactive ? safePolygon() : undefined,\n  })\n\n  const click = useClick(context, {\n    enabled: isClick,\n  })\n\n  const dismiss = useDismiss(context)\n  const role = useRole(context, { role: \"dialog\" })\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    hover,\n    click,\n    dismiss,\n    role,\n  ])\n\n  const { isMounted, styles: transitionStyles } = useTransitionStyles(context, {\n    duration: { open: 200, close: 150 },\n    initial: ({ side }) => ({\n      opacity: 0,\n      transform:\n        side === \"top\"\n          ? `translateY(${ANIMATION_TRANSITION_DISTANCE_PX}px)`\n          : side === \"bottom\"\n            ? `translateY(-${ANIMATION_TRANSITION_DISTANCE_PX}px)`\n            : side === \"left\"\n              ? `translateX(${ANIMATION_TRANSITION_DISTANCE_PX}px)`\n              : `translateX(-${ANIMATION_TRANSITION_DISTANCE_PX}px)`,\n    }),\n  })\n\n  const prevMountedRef = useRef(false)\n\n  useEffect(() => {\n    if (isMounted && !prevMountedRef.current) onShow?.()\n    if (!isMounted && prevMountedRef.current) onHidden?.()\n    prevMountedRef.current = isMounted\n  }, [isMounted, onShow, onHidden])\n\n  const renderFloating = (content: React.ReactNode) => {\n    if (!isMounted) return null\n\n    const body = bodySpacing ? (\n      <div className=\"cobalt-popover--bodySpacing\">{content}</div>\n    ) : (\n      content\n    )\n\n    const extraFloatingProps = getFloatingExtraProps?.() ?? {}\n    const { onMouseEnter, onMouseLeave, ...restExtraFloatingProps } =\n      extraFloatingProps\n\n    const node = (\n      <div\n        ref={refs.setFloating}\n        style={{\n          ...floatingStyles,\n          ...transitionStyles,\n          zIndex,\n        }}\n        className={classNames(\"cobalt-popover\", {\n          \"cobalt-popover--withArrow\": showArrow,\n          \"cobalt-popover--fitContent\": fitContent,\n          \"cobalt-popover--withBorder\": withBorder,\n        })}\n        data-placement={context.placement}\n        data-theme={classNames(theme, {\n          tooltip: tooltip,\n        })}\n        {...getFloatingProps({\n          \"aria-label\": ariaLabel,\n          ...restExtraFloatingProps,\n          onMouseEnter,\n          onMouseLeave,\n        })}\n      >\n        {showArrow && (\n          <FloatingArrow\n            ref={arrowRef}\n            context={context}\n            className=\"cobalt-popover__arrow\"\n          />\n        )}\n        {body}\n      </div>\n    )\n\n    return appendToBody ? <FloatingPortal>{node}</FloatingPortal> : node\n  }\n\n  return {\n    refs: {\n      setReference: refs.setReference,\n      setFloating: refs.setFloating,\n    },\n    getReferenceProps,\n    renderFloating,\n    isMounted,\n  }\n}\n"],"names":["flip","offset","shiftMiddleware","offsetMiddleware","flipMiddleware","_jsx","_jsxs","classNames"],"mappings":"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"}
+{"version":3,"file":"useDesktopPopoverCore.js","sources":["../../../src/components/Popover/useDesktopPopoverCore.tsx"],"sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  FloatingArrow,\n  FloatingPortal,\n  flip as flipMiddleware,\n  offset as offsetMiddleware,\n  type Placement,\n  safePolygon,\n  shift as shiftMiddleware,\n  useClick,\n  useDismiss,\n  useFloating,\n  useHover,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n} from \"@floating-ui/react\"\nimport classNames from \"classnames\"\nimport type React from \"react\"\nimport { useEffect, useRef } from \"react\"\nimport { zIndexes } from \"../../tokens\"\n\nconst ANIMATION_TRANSITION_DISTANCE_PX = 4\n\nexport type PopoverConfig = {\n  placement?: Placement\n  flip?: boolean\n  arrow?: boolean\n  theme?: string\n  tooltip?: boolean\n  lightMode?: boolean\n  zIndex?: number\n  appendToBody?: boolean\n  fixed?: boolean\n  withBorder?: boolean\n  fitContent?: boolean\n  trigger?: \"click\" | \"mouseenter\"\n  interactive?: boolean\n  delay?: number | { open?: number; close?: number }\n  offset?: [number, number]\n  bodySpacing?: boolean\n  onShow?: () => void\n  onHidden?: () => void\n}\n\nexport type UseDesktopPopoverCoreOptions = Omit<PopoverConfig, \"trigger\"> & {\n  isOpen: boolean\n  onOpenChange?: (open: boolean) => void\n  referenceElement: Element | null\n  trigger?: \"click\" | \"mouseenter\" | \"manual\"\n  ariaLabel?: string\n  getFloatingExtraProps?: () => React.HTMLAttributes<HTMLElement>\n}\n\nexport type DesktopPopoverCoreRefs = {\n  setReference: (node: Element | null) => void\n  setFloating: (node: HTMLElement | null) => void\n}\n\ntype UseDesktopPopoverCoreReturnType = {\n  refs: DesktopPopoverCoreRefs\n  getReferenceProps: ReturnType<\n    typeof import(\"@floating-ui/react\").useInteractions\n  >[\"getReferenceProps\"]\n  renderFloating: (content: React.ReactNode) => React.ReactNode\n  isMounted: boolean\n}\n\nexport function useDesktopPopoverCore({\n  isOpen,\n  onOpenChange,\n  referenceElement,\n  placement = \"top\",\n  flip = true,\n  tooltip = false,\n  arrow: showArrow = true,\n  theme = \"\",\n  zIndex = zIndexes.dropdown,\n  appendToBody = true,\n  fixed = false,\n  fitContent = true,\n  withBorder = false,\n  trigger = \"click\",\n  interactive = false,\n  delay = 0,\n  offset,\n  bodySpacing = false,\n  ariaLabel,\n  onShow,\n  onHidden,\n  getFloatingExtraProps,\n}: UseDesktopPopoverCoreOptions): UseDesktopPopoverCoreReturnType {\n  const arrowRef = useRef<SVGSVGElement | null>(null)\n\n  const [crossAxis, mainAxis] = offset ?? [0, showArrow ? 12 : 8]\n\n  const { refs, floatingStyles, context } = useFloating({\n    open: isOpen,\n    onOpenChange,\n    placement,\n    strategy: fixed ? \"fixed\" : \"absolute\",\n    transform: false,\n    middleware: [\n      shiftMiddleware({ padding: 8 }),\n      offsetMiddleware({ mainAxis, crossAxis }),\n      ...(flip ? [flipMiddleware()] : []),\n      ...(showArrow ? [arrow({ element: arrowRef })] : []),\n    ],\n    whileElementsMounted: autoUpdate,\n    elements: { reference: referenceElement },\n  })\n\n  const isHover = trigger === \"mouseenter\"\n  const isClick = trigger === \"click\"\n\n  const hover = useHover(context, {\n    enabled: isHover,\n    move: false,\n    delay,\n    handleClose: isHover && interactive ? safePolygon() : undefined,\n  })\n\n  const click = useClick(context, {\n    enabled: isClick,\n  })\n\n  const dismiss = useDismiss(context)\n  const role = useRole(context, { role: \"dialog\" })\n\n  const { getReferenceProps, getFloatingProps } = useInteractions([\n    hover,\n    click,\n    dismiss,\n    role,\n  ])\n\n  const { isMounted, styles: transitionStyles } = useTransitionStyles(context, {\n    duration: { open: 200, close: 150 },\n    initial: ({ side }) => ({\n      opacity: 0,\n      transform:\n        side === \"top\"\n          ? `translateY(${ANIMATION_TRANSITION_DISTANCE_PX}px)`\n          : side === \"bottom\"\n            ? `translateY(-${ANIMATION_TRANSITION_DISTANCE_PX}px)`\n            : side === \"left\"\n              ? `translateX(${ANIMATION_TRANSITION_DISTANCE_PX}px)`\n              : `translateX(-${ANIMATION_TRANSITION_DISTANCE_PX}px)`,\n    }),\n  })\n\n  const prevMountedRef = useRef(false)\n\n  useEffect(() => {\n    if (isMounted && !prevMountedRef.current) onShow?.()\n    if (!isMounted && prevMountedRef.current) onHidden?.()\n    prevMountedRef.current = isMounted\n  }, [isMounted, onShow, onHidden])\n\n  const renderFloating = (content: React.ReactNode) => {\n    if (!isMounted) return null\n\n    const body = bodySpacing ? (\n      <div className=\"cobalt-popover--bodySpacing\">{content}</div>\n    ) : (\n      content\n    )\n\n    const extraFloatingProps = getFloatingExtraProps?.() ?? {}\n    const { onMouseEnter, onMouseLeave, ...restExtraFloatingProps } =\n      extraFloatingProps\n\n    const node = (\n      <div\n        ref={refs.setFloating}\n        style={{\n          ...floatingStyles,\n          ...transitionStyles,\n          zIndex,\n        }}\n        className={classNames(\"cobalt-popover\", {\n          \"cobalt-popover--withArrow\": showArrow,\n          \"cobalt-popover--fitContent\": fitContent,\n          \"cobalt-popover--withBorder\": withBorder,\n        })}\n        data-placement={context.placement}\n        data-theme={classNames(theme, {\n          tooltip: tooltip,\n        })}\n        {...getFloatingProps({\n          \"aria-label\": ariaLabel,\n          ...restExtraFloatingProps,\n          onMouseEnter,\n          onMouseLeave,\n        })}\n      >\n        {showArrow && (\n          <FloatingArrow\n            ref={arrowRef}\n            context={context}\n            className=\"cobalt-popover__arrow\"\n          />\n        )}\n        {body}\n      </div>\n    )\n\n    return appendToBody ? <FloatingPortal>{node}</FloatingPortal> : node\n  }\n\n  return {\n    refs: {\n      setReference: refs.setReference,\n      setFloating: refs.setFloating,\n    },\n    getReferenceProps,\n    renderFloating,\n    isMounted,\n  }\n}\n"],"names":["flip","offset","shiftMiddleware","offsetMiddleware","flipMiddleware","_jsx","_jsxs","classNames"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drivy/cobalt",
-  "version": "3.0.0",
+  "version": "3.0.2",
   "description": "Opinionated design system for Drivy's projects.",
   "main": "index.js",
   "types": "types/src/index.d.ts",

package/styles/components/MarketingNote/index.scss

@@ -5,6 +5,28 @@
   align-items: flex-start;
 }
 
+.cobalt-marketing-note__icon-container {
+  --icon-container-size: 28px;
+
+  display: flex;
+
+  justify-content: center;
+  align-items: center;
+
+  width: var(--icon-container-size);
+  height: var(--icon-container-size);
+}
+
+.cobalt-marketing-note__icon-container .cobalt-Icon {
+  width: 100%;
+  height: 100%;
+}
+
+.cobalt-marketing-note__content {
+  flex: 1 1 0%;
+  align-self: center;
+}
+
 .cobalt-marketing-note.cobalt-marketing-note--success {
   @apply c-bg-successContainer c-text-onSuccessContainer;
 
@@ -21,19 +43,12 @@
   }
 }
 
-.cobalt-marketing-note__icon-container {
-  --icon-container-size: 28px;
-
-  display: flex;
-
-  justify-content: center;
-  align-items: center;
+.cobalt-marketing-note.cobalt-marketing-note--compact {
+  @apply c-rounded-lg c-py-xs;
 
-  width: var(--icon-container-size);
-  height: var(--icon-container-size);
-}
+  padding-left: 0.75rem;
 
-.cobalt-marketing-note__icon-container .cobalt-Icon {
-  width: 100%;
-  height: 100%;
+  .cobalt-marketing-note__icon-container {
+    --icon-container-size: 20px;
+  }
 }

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

@@ -3,6 +3,7 @@ export type MarketingNoteProps = PropsWithChildren<{
     variant: "success" | "tertiary";
     title?: string;
     icon?: React.JSX.Element;
+    compact?: boolean;
     className?: string;
 }>;
-export declare const MarketingNote: ({ children, title, icon, className, variant, }: MarketingNoteProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MarketingNote: ({ children, title, icon, className, variant, compact, }: MarketingNoteProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -9,6 +9,7 @@ export type PopoverConfig = {
     lightMode?: boolean;
     zIndex?: number;
     appendToBody?: boolean;
+    fixed?: boolean;
     withBorder?: boolean;
     fitContent?: boolean;
     trigger?: "click" | "mouseenter";
@@ -40,5 +41,5 @@ type UseDesktopPopoverCoreReturnType = {
     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 declare function useDesktopPopoverCore({ isOpen, onOpenChange, referenceElement, placement, flip, tooltip, arrow: showArrow, theme, zIndex, appendToBody, fixed, fitContent, withBorder, trigger, interactive, delay, offset, bodySpacing, ariaLabel, onShow, onHidden, getFloatingExtraProps, }: UseDesktopPopoverCoreOptions): UseDesktopPopoverCoreReturnType;
 export {};

package/utils/getCobaltTailwindcssConfig.js.map

@@ -1 +1 @@
-{"version":3,"file":"getCobaltTailwindcssConfig.js","sources":["../../utils/getCobaltTailwindcssConfig.js?commonjs-entry"],"sourcesContent":["import { getDefaultExportFromCjs } from \"\u0000commonjsHelpers.js\";\nimport { __require as requireGetCobaltTailwindcssConfig } from \"/Users/cedric/Dev/drivy/cobalt/utils/getCobaltTailwindcssConfig.js\";\nvar getCobaltTailwindcssConfigExports = requireGetCobaltTailwindcssConfig();\nexport { getCobaltTailwindcssConfigExports as __moduleExports };\nexport default /*@__PURE__*/getDefaultExportFromCjs(getCobaltTailwindcssConfigExports);"],"names":[],"mappings":";;;AAEA,IAAI,iCAAiC,GAAG,iCAAiC,EAAE,CAAC;AAE5E,iCAAe,aAAa,uBAAuB,CAAC,iCAAiC,CAAC;;;;"}
+{"version":3,"file":"getCobaltTailwindcssConfig.js","sources":["../../utils/getCobaltTailwindcssConfig.js?commonjs-entry"],"sourcesContent":["import { getDefaultExportFromCjs } from \"\u0000commonjsHelpers.js\";\nimport { __require as requireGetCobaltTailwindcssConfig } from \"/Users/thibaudesnouf/sources/cobalt/utils/getCobaltTailwindcssConfig.js\";\nvar getCobaltTailwindcssConfigExports = requireGetCobaltTailwindcssConfig();\nexport { getCobaltTailwindcssConfigExports as __moduleExports };\nexport default /*@__PURE__*/getDefaultExportFromCjs(getCobaltTailwindcssConfigExports);"],"names":[],"mappings":";;;AAEA,IAAI,iCAAiC,GAAG,iCAAiC,EAAE,CAAC;AAE5E,iCAAe,aAAa,uBAAuB,CAAC,iCAAiC,CAAC;;;;"}