@particle-academy/react-fancy 4.13.0 → 4.13.1

package/dist/index.d.cts

@@ -1262,21 +1262,30 @@ interface PopoverProps {
     /** Delay in ms before closing after hover leaves. Default: 300 */
     hoverCloseDelay?: number;
 }
-interface PopoverTriggerProps {
+/**
+ * The trigger renders a `<span>` — it extends its attributes so consumers can
+ * forward `aria-*`, `data-*`, `id`, `title`, etc. onto the actual anchor node
+ * (e.g. `aria-label` for an icon-only trigger). Popover-owned props (ref,
+ * onClick, aria-expanded/haspopup) always win over forwarded ones.
+ */
+interface PopoverTriggerProps extends HTMLAttributes<HTMLSpanElement> {
     children: ReactNode;
-    className?: string;
 }
-interface PopoverContentProps {
+/**
+ * The content renders a `<div>` — it extends its attributes so consumers can
+ * forward `aria-*`/`data-*`/`role`/`id` onto the floating panel. Consumer
+ * `style` is merged under the Popover's positioning (left/top always win).
+ */
+interface PopoverContentProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
-    className?: string;
 }
 
-declare function PopoverTrigger({ children, className }: PopoverTriggerProps): react.JSX.Element;
+declare function PopoverTrigger({ children, className, ...rest }: PopoverTriggerProps): react.JSX.Element;
 declare namespace PopoverTrigger {
     var displayName: string;
 }
 
-declare function PopoverContent({ children, className }: PopoverContentProps): react.JSX.Element | null;
+declare function PopoverContent({ children, className, style, ...rest }: PopoverContentProps): react.JSX.Element | null;
 declare namespace PopoverContent {
     var displayName: string;
 }

package/dist/index.d.ts

@@ -1262,21 +1262,30 @@ interface PopoverProps {
     /** Delay in ms before closing after hover leaves. Default: 300 */
     hoverCloseDelay?: number;
 }
-interface PopoverTriggerProps {
+/**
+ * The trigger renders a `<span>` — it extends its attributes so consumers can
+ * forward `aria-*`, `data-*`, `id`, `title`, etc. onto the actual anchor node
+ * (e.g. `aria-label` for an icon-only trigger). Popover-owned props (ref,
+ * onClick, aria-expanded/haspopup) always win over forwarded ones.
+ */
+interface PopoverTriggerProps extends HTMLAttributes<HTMLSpanElement> {
     children: ReactNode;
-    className?: string;
 }
-interface PopoverContentProps {
+/**
+ * The content renders a `<div>` — it extends its attributes so consumers can
+ * forward `aria-*`/`data-*`/`role`/`id` onto the floating panel. Consumer
+ * `style` is merged under the Popover's positioning (left/top always win).
+ */
+interface PopoverContentProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
-    className?: string;
 }
 
-declare function PopoverTrigger({ children, className }: PopoverTriggerProps): react.JSX.Element;
+declare function PopoverTrigger({ children, className, ...rest }: PopoverTriggerProps): react.JSX.Element;
 declare namespace PopoverTrigger {
     var displayName: string;
 }
 
-declare function PopoverContent({ children, className }: PopoverContentProps): react.JSX.Element | null;
+declare function PopoverContent({ children, className, style, ...rest }: PopoverContentProps): react.JSX.Element | null;
 declare namespace PopoverContent {
     var displayName: string;
 }

package/dist/index.js

@@ -7882,11 +7882,12 @@ function usePopover() {
   }
   return ctx;
 }
-function PopoverTrigger({ children, className }) {
+function PopoverTrigger({ children, className, ...rest }) {
   const { setOpen, open, anchorRef, hover, onHoverEnter, onHoverLeave } = usePopover();
   return /* @__PURE__ */ jsx(
     "span",
     {
+      ...rest,
       ref: anchorRef,
       "data-react-fancy-popover-trigger": "",
       className: cn("inline-flex", className),
@@ -7900,7 +7901,7 @@ function PopoverTrigger({ children, className }) {
   );
 }
 PopoverTrigger.displayName = "PopoverTrigger";
-function PopoverContent({ children, className }) {
+function PopoverContent({ children, className, style, ...rest }) {
   const { open, setOpen, anchorRef, floatingRef, placement, offset, hover, onHoverEnter, onHoverLeave } = usePopover();
   const outsideRef = useRef(null);
   const position = useFloatingPosition(anchorRef, floatingRef, {
@@ -7916,6 +7917,7 @@ function PopoverContent({ children, className }) {
   return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(
     "div",
     {
+      ...rest,
       ref: (node) => {
         outsideRef.current = node;
         floatingRef.current = node;
@@ -7926,7 +7928,7 @@ function PopoverContent({ children, className }) {
         positioned ? "fancy-scale-in" : "invisible",
         className
       ),
-      style: { left: position.x, top: position.y },
+      style: { ...style, left: position.x, top: position.y },
       onMouseEnter: hover ? onHoverEnter : void 0,
       onMouseLeave: hover ? onHoverLeave : void 0,
       children