@avenue-ticketing/ui 0.3.0 → 0.5.0

package/dist/react/pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/utils.ts","../../src/react/button.tsx","../../src/react/pagination.tsx"],"names":["React","jsx","Pagination"],"mappings":"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","file":"pagination.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst sizeClass = {\n  xs: \"h-8 min-h-8 gap-2 px-4 text-sm has-[>svg]:px-3 [&_svg:not([class*='size-'])]:size-3\",\n  default:\n    \"h-10 min-h-10 gap-2 px-5 text-sm has-[>svg]:px-4 [&_svg:not([class*='size-'])]:size-4\",\n  lg: \"h-11 min-h-11 gap-2 px-6 text-base has-[>svg]:px-5 [&_svg:not([class*='size-'])]:size-5\",\n} as const;\n\n/** Square hit targets for `iconOnly` — same keys as `sizeClass` (`default` | `lg`). */\nconst iconOnlySizeClass = {\n  xs: \"size-8 min-h-8 min-w-8 gap-0 p-0 [&_svg:not([class*='size-'])]:size-3\",\n  default:\n    \"size-10 min-h-10 min-w-10 gap-0 p-0 [&_svg:not([class*='size-'])]:size-4\",\n  lg: \"size-11 min-h-11 min-w-11 gap-0 p-0 [&_svg:not([class*='size-'])]:size-5\",\n} as const;\n\nconst roundedClass = {\n  full: \"rounded-full\",\n  lg: \"rounded-lg\",\n  md: \"rounded-md\",\n} as const;\n\nconst variantClass = {\n  primary:\n    \"bg-primary text-background border border-transparent hover:bg-primary/90 active:bg-primary/85\",\n  secondary:\n    \"bg-background text-primary border border-primary/10 hover:bg-primary/5\",\n  destructive:\n    \"bg-background text-red-500 border border-red-500/25 hover:bg-red-500/5\",\n  success:\n    \"bg-background text-green-500 border border-green-500/25 hover:bg-green-500/5\",\n} as const;\n\nexport type ButtonProps = React.ComponentProps<\"button\"> & {\n  /**\n   * Visual style: neutral (`secondary`, `primary`), or outline (`destructive`,\n   * `success`) using Tailwind `red-500` / `green-500` text and matching borders on\n   * `bg-background` (no solid fill).\n   */\n  variant?: keyof typeof variantClass;\n  /**\n   * Corner radius. Labeled buttons default to `full` (pill). `iconOnly` buttons\n   * default to `md` (square corners) unless you pass `rounded` explicitly.\n   */\n  rounded?: keyof typeof roundedClass;\n  /** Height and horizontal padding: `default` or `lg` only. */\n  size?: keyof typeof sizeClass;\n  /**\n   * Square icon-only control; same `size` presets (`default` | `lg`). Pair with\n   * `aria-label` (or `title`) when there is no visible text.\n   */\n  iconOnly?: boolean;\n};\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      type = \"button\",\n      variant = \"secondary\",\n      rounded: roundedProp,\n      size = \"default\",\n      iconOnly = false,\n      disabled,\n      ...props\n    },\n    ref,\n  ) => {\n    const rounded = roundedProp ?? (iconOnly ? \"md\" : \"full\");\n\n    return (\n      <button\n        type={type}\n        disabled={disabled}\n        data-slot=\"button\"\n        data-icon-only={iconOnly ? \"\" : undefined}\n        className={cn(\n          \"inline-flex shrink-0 cursor-pointer items-center justify-center whitespace-nowrap outline-none scale-100 transition-[color,background-color,box-shadow,transform] duration-150 ease-out active:scale-[0.98] active:duration-100 active:ease-linear [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n          \"disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\",\n          \"focus-visible:border-ring font-medium lg:tracking-wide focus-visible:ring-ring/50 focus-visible:ring-[3px]\",\n          iconOnly ? iconOnlySizeClass[size] : sizeClass[size],\n          roundedClass[rounded],\n          variantClass[variant],\n          className,\n        )}\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\nButton.displayName = \"Button\";\n\nexport { Button };\n","\"use client\";\n\nimport { ChevronLeft, ChevronRight, MoreHorizontal } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Button, type ButtonProps } from \"./button\";\n\nexport type PaginationMeta = {\n  currentPage: number;\n  totalItems: number;\n  itemsPerPage: number;\n  /** omit to derive `ceil(totalItems / itemsPerPage)` (minimum 1) */\n  totalPages?: number;\n};\n\nexport type PaginationProps = {\n  meta: PaginationMeta;\n  onPageChange?: (page: number) => void;\n  className?: string;\n  /** max page numbers in the sliding window (excluding first/last when ellipses show; default 3) */\n  maxVisibleButtons?: number;\n  disabled?: boolean;\n  /**\n   * density preset → resolved `Button` size for every control (`xs` → `default`;\n   * `default` / `lg` → `lg`) so chevrons and page cells share one hit grid.\n   */\n  size?: ButtonProps[\"size\"];\n  /** same as `Button` `rounded`; pagination defaults to `full` */\n  rounded?: NonNullable<ButtonProps[\"rounded\"]>;\n};\n\nconst PaginationInner = React.forwardRef<HTMLDivElement, PaginationProps>(\n  function Pagination(\n    {\n      meta,\n      onPageChange,\n      className,\n      maxVisibleButtons = 3,\n      disabled = false,\n      size = \"default\",\n      rounded = \"full\",\n    },\n    ref,\n  ) {\n    const handlePageChange = React.useCallback(\n      (page: number) => {\n        onPageChange?.(page);\n      },\n      [onPageChange],\n    );\n\n    const totalPages = React.useMemo(() => {\n      const totalItems = Math.max(0, Number(meta.totalItems) || 0);\n      const itemsPerPage = Math.max(1, Number(meta.itemsPerPage) || 16);\n      if (meta.totalPages != null && Number.isFinite(meta.totalPages)) {\n        return Math.max(1, Math.floor(Number(meta.totalPages)));\n      }\n      return Math.max(1, Math.ceil(totalItems / itemsPerPage));\n    }, [meta.totalItems, meta.itemsPerPage, meta.totalPages]);\n\n    const currentPage = React.useMemo(\n      () => Math.max(1, Number(meta.currentPage) || 1),\n      [meta.currentPage],\n    );\n\n    const { endPage, adjustedStart } = React.useMemo(() => {\n      const sp = Math.max(1, currentPage - Math.floor(maxVisibleButtons / 2));\n      const ep = Math.min(totalPages, sp + maxVisibleButtons - 1);\n      const adj =\n        ep - sp + 1 < maxVisibleButtons ? Math.max(1, ep - maxVisibleButtons + 1) : sp;\n      return { endPage: ep, adjustedStart: adj };\n    }, [currentPage, totalPages, maxVisibleButtons]);\n\n    const middlePageNumbers = React.useMemo(\n      () =>\n        Array.from({ length: endPage - adjustedStart + 1 }, (_, i) => adjustedStart + i),\n      [endPage, adjustedStart],\n    );\n\n    const navButtonSize = React.useMemo(\n      (): NonNullable<ButtonProps[\"size\"]> => (size === \"xs\" ? \"default\" : \"lg\"),\n      [size],\n    );\n\n    const ellipsisClassName = React.useMemo(\n      () =>\n        cn(\n          \"inline-flex shrink-0 items-center justify-center\",\n          navButtonSize === \"lg\"\n            ? \"size-11 min-h-11 min-w-11\"\n            : \"size-10 min-h-10 min-w-10\",\n          rounded === \"full\"\n            ? \"rounded-full\"\n            : rounded === \"lg\"\n              ? \"rounded-lg\"\n              : \"rounded-md\",\n        ),\n      [navButtonSize, rounded],\n    );\n\n    const gapIconClassName = React.useMemo(\n      () =>\n        cn(\n          \"mx-auto shrink-0 text-primary/45\",\n          navButtonSize === \"lg\" ? \"size-[18px]\" : \"size-4\",\n        ),\n      [navButtonSize],\n    );\n\n    if (totalPages <= 1) return null;\n\n    return (\n      <div ref={ref} className={cn(\"flex w-full justify-center\", className)}>\n        <nav\n          role=\"navigation\"\n          aria-label=\"Pagination\"\n          className=\"text-primary flex items-center justify-center gap-0.5 text-base font-medium tabular-nums tracking-tight\"\n        >\n          <Button\n            type=\"button\"\n            rounded={rounded}\n            iconOnly\n            size={navButtonSize}\n            className=\"border-0 tracking-tight focus-visible:border-transparent focus-visible:ring-0\"\n            disabled={disabled || currentPage <= 1}\n            onClick={() => handlePageChange(currentPage - 1)}\n            aria-label=\"Previous page\"\n          >\n            <ChevronLeft aria-hidden className=\"size-5 shrink-0 mr-0.5\" />\n          </Button>\n          <div className=\"flex items-center gap-0.5\">\n            {adjustedStart > 1 && (\n              <>\n                {currentPage === 1 ? (\n                  <Button\n                    type=\"button\"\n                    variant=\"primary\"\n                    rounded={rounded}\n                    iconOnly\n                    size={navButtonSize}\n                    className=\"tracking-tight\"\n                    aria-current=\"page\"\n                    tabIndex={-1}\n                  >\n                    <span className=\"tabular-nums\">{1}</span>\n                  </Button>\n                ) : (\n                  <Button\n                    type=\"button\"\n                    rounded={rounded}\n                    iconOnly\n                    size={navButtonSize}\n                    className=\"border-none tracking-tight\"\n                    disabled={disabled}\n                    onClick={() => handlePageChange(1)}\n                    aria-label=\"Go to page 1\"\n                  >\n                    <span className=\"tabular-nums\">1</span>\n                  </Button>\n                )}\n                {adjustedStart > 2 && (\n                  <span aria-hidden className={ellipsisClassName}>\n                    <MoreHorizontal className={gapIconClassName} aria-hidden />\n                  </span>\n                )}\n              </>\n            )}\n            {middlePageNumbers.map((page) =>\n              currentPage === page ? (\n                <Button\n                  key={page}\n                  type=\"button\"\n                  variant=\"primary\"\n                  rounded={rounded}\n                  iconOnly\n                  size={navButtonSize}\n                  className=\"tracking-tight\"\n                  aria-current=\"page\"\n                  tabIndex={-1}\n                >\n                  <span className=\"tabular-nums\">{page}</span>\n                </Button>\n              ) : (\n                <Button\n                  key={page}\n                  type=\"button\"\n                  rounded={rounded}\n                  iconOnly\n                  size={navButtonSize}\n                  className=\"border-none tracking-tight\"\n                  disabled={disabled}\n                  onClick={() => handlePageChange(page)}\n                  aria-label={`Go to page ${page}`}\n                >\n                  <span className=\"tabular-nums\">{page}</span>\n                </Button>\n              ),\n            )}\n            {endPage < totalPages && (\n              <>\n                {endPage < totalPages - 1 && (\n                  <span aria-hidden className={ellipsisClassName}>\n                    <MoreHorizontal className={gapIconClassName} aria-hidden />\n                  </span>\n                )}\n                {currentPage === totalPages ? (\n                  <Button\n                    type=\"button\"\n                    variant=\"primary\"\n                    rounded={rounded}\n                    iconOnly\n                    size={navButtonSize}\n                    className=\"tracking-tight\"\n                    aria-current=\"page\"\n                    tabIndex={-1}\n                  >\n                    <span className=\"tabular-nums\">{totalPages}</span>\n                  </Button>\n                ) : (\n                  <Button\n                    type=\"button\"\n                    rounded={rounded}\n                    iconOnly\n                    size={navButtonSize}\n                    className=\"border-none tracking-tight\"\n                    disabled={disabled}\n                    onClick={() => handlePageChange(totalPages)}\n                    aria-label={`Go to page ${totalPages}`}\n                  >\n                    <span className=\"tabular-nums\">{totalPages}</span>\n                  </Button>\n                )}\n              </>\n            )}\n          </div>\n          <Button\n            type=\"button\"\n            rounded={rounded}\n            iconOnly\n            size={navButtonSize}\n            className=\"border-0 tracking-tight focus-visible:border-transparent focus-visible:ring-0\"\n            disabled={disabled || currentPage >= totalPages}\n            onClick={() => handlePageChange(currentPage + 1)}\n            aria-label=\"Next page\"\n          >\n            <ChevronRight aria-hidden className=\"size-5 shrink-0 ml-0.5\" />\n          </Button>\n        </nav>\n      </div>\n    );\n  },\n);\n\nPaginationInner.displayName = \"Pagination\";\n\nexport const Pagination = React.memo(PaginationInner);\n"]}

package/dist/react/popover.d.ts

@@ -0,0 +1,76 @@
+import React__default from 'react';
+
+declare const Popover: React__default.FC<{
+    children: React__default.ReactNode;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}>;
+declare const PopoverTrigger: React__default.FC<{
+    children: React__default.ReactNode;
+    asChild?: boolean;
+}>;
+declare const PopoverClose: React__default.FC<{
+    children: React__default.ReactNode;
+    asChild?: boolean;
+}>;
+/**
+ * Narrow-viewport (≤1024px) bottom-sheet options for {@link PopoverContent}.
+ * `className` merges onto the sheet panel root (after base sheet styles).
+ */
+interface PopoverMobileSheetOptions {
+    /** When `true`, use a bottom sheet on narrow viewports. Default `false`. */
+    sheet?: boolean;
+    title?: string;
+    className?: string;
+    contentClassName?: string;
+}
+interface PopoverMobileCloseProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
+}
+/**
+ * Dismiss control for the mobile bottom-sheet popover. Styling matches
+ * {@link DialogCloseButton} (circular hit target, X icon).
+ */
+declare const PopoverMobileClose: React__default.ForwardRefExoticComponent<PopoverMobileCloseProps & React__default.RefAttributes<HTMLButtonElement>>;
+type Side = "top" | "right" | "bottom" | "left";
+type Align = "start" | "center" | "end";
+interface PopoverContentProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /** Which side of the trigger to render on */
+    side?: Side;
+    /** Alignment along the cross-axis */
+    align?: Align;
+    /** Gap between trigger and popover in px */
+    offset?: number;
+    /** Show a small arrow pointing to the trigger */
+    showArrow?: boolean;
+    /** Close when clicking outside */
+    closeOnClickOutside?: boolean;
+    /** Close when Escape key is pressed */
+    closeOnEscape?: boolean;
+    /** Animation duration in ms */
+    duration?: number;
+    /** Minimum distance from the viewport edge in px */
+    viewportPadding?: number;
+    /** Portal container – defaults to document.body */
+    container?: HTMLElement | null;
+    /** Width of the popover. 'trigger' matches the trigger width. */
+    width?: "auto" | "trigger" | number;
+    /**
+     * Narrow-viewport (≤1024px) bottom sheet — same options as dropdown
+     * `mobileOptions`, except `sheet` defaults to `false`.
+     */
+    mobileOptions?: PopoverMobileSheetOptions;
+    /**
+     * Mobile bottom sheet only. When `true` (default), panel motion matches Dialog
+     * `slideEntrance`; when `false`, uses full `translateY(100%)`.
+     */
+    slideEntrance?: boolean;
+    /** Mobile sheet only; defaults to 120px (same as dropdown / dialog full sheet). */
+    slideEntranceOffsetPx?: number;
+}
+declare const PopoverContent: React__default.FC<PopoverContentProps>;
+declare const PopoverHeader: React__default.FC<React__default.HTMLAttributes<HTMLDivElement>>;
+declare const PopoverFooter: React__default.FC<React__default.HTMLAttributes<HTMLDivElement>>;
+declare const PopoverTitle: React__default.FC<React__default.HTMLAttributes<HTMLHeadingElement>>;
+declare const PopoverDescription: React__default.FC<React__default.HTMLAttributes<HTMLParagraphElement>>;
+
+export { Popover, PopoverClose, PopoverContent, PopoverDescription, PopoverFooter, PopoverHeader, PopoverMobileClose, type PopoverMobileCloseProps, type PopoverMobileSheetOptions, PopoverTitle, PopoverTrigger };

package/dist/react/popover.js

@@ -0,0 +1,564 @@
+import React, { useState, useRef, useCallback, useMemo, useEffect, useLayoutEffect } from 'react';
+import { createPortal } from 'react-dom';
+import { X } from 'lucide-react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var POPOVER_MOBILE_SHEET_MAX_PX = 1024;
+var POPOVER_MOBILE_SHEET_MOTION_MS = 175;
+var POPOVER_MOBILE_SHEET_ENTRY_EASING = "cubic-bezier(0.85, 0, 0.15, 1)";
+var POPOVER_MOBILE_SHEET_EXIT_EASING = "cubic-bezier(0.85, 0, 1, 0.15)";
+var POPOVER_MOBILE_SHEET_SLIDE_ENTRANCE_OFFSET_DEFAULT_PX = 120;
+function usePopoverIsMobile(breakpoint = 1025) {
+  const [isMobile, setIsMobile] = useState(false);
+  useEffect(() => {
+    const mq = window.matchMedia(`(max-width: ${breakpoint - 1}px)`);
+    setIsMobile(mq.matches);
+    const handler = (e) => setIsMobile(e.matches);
+    mq.addEventListener("change", handler);
+    return () => mq.removeEventListener("change", handler);
+  }, [breakpoint]);
+  return isMobile;
+}
+var PopoverContext = React.createContext(
+  void 0
+);
+function usePopover() {
+  const context = React.useContext(PopoverContext);
+  if (!context) {
+    throw new Error("Popover components must be used within a <Popover />");
+  }
+  return context;
+}
+var Popover = ({ children, open: controlledOpen, onOpenChange }) => {
+  const [internalOpen, setInternalOpen] = useState(false);
+  const isControlled = controlledOpen !== void 0;
+  const open = isControlled ? controlledOpen : internalOpen;
+  const triggerRef = useRef(null);
+  const setOpen = useCallback(
+    (value) => {
+      if (!isControlled) setInternalOpen(value);
+      onOpenChange?.(value);
+    },
+    [isControlled, onOpenChange]
+  );
+  return /* @__PURE__ */ jsx(PopoverContext.Provider, { value: { open, setOpen, triggerRef }, children });
+};
+var PopoverTrigger = ({ children, asChild }) => {
+  const { open, setOpen, triggerRef } = usePopover();
+  const handleClick = (e) => {
+    e.stopPropagation();
+    setOpen(!open);
+  };
+  if (asChild && React.isValidElement(children)) {
+    const child = children;
+    return React.cloneElement(child, {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      ref: (el) => {
+        triggerRef.current = el;
+      },
+      onClick: (e) => {
+        child.props.onClick?.(e);
+        handleClick(e);
+      }
+    });
+  }
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      ref: (el) => {
+        triggerRef.current = el;
+      },
+      onClick: handleClick,
+      children
+    }
+  );
+};
+var PopoverClose = ({ children, asChild }) => {
+  const { setOpen } = usePopover();
+  const handleClick = () => setOpen(false);
+  if (asChild && React.isValidElement(children)) {
+    const child = children;
+    return React.cloneElement(child, {
+      onClick: (e) => {
+        child.props.onClick?.(e);
+        handleClick();
+      }
+    });
+  }
+  return /* @__PURE__ */ jsx("button", { type: "button", onClick: handleClick, children });
+};
+function resolvePopoverMobileSheet(mobileOptions) {
+  return {
+    sheet: mobileOptions?.sheet ?? false,
+    title: mobileOptions?.title,
+    sheetExtraClassName: mobileOptions?.className,
+    contentClassName: mobileOptions?.contentClassName
+  };
+}
+var PopoverMobileClose = React.forwardRef(({ className, type = "button", ...props }, ref) => {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      type,
+      className: cn(
+        "z-100 flex size-12 shrink-0 cursor-pointer items-center justify-center rounded-full transition-all hover:bg-secondary-background active:scale-[0.96]",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(X, { className: "size-5.5" }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+      ]
+    }
+  );
+});
+PopoverMobileClose.displayName = "PopoverMobileClose";
+function PopoverMobileBottomSheetPortal({
+  open,
+  isAnimating,
+  slideEntrance,
+  slideOffsetPx,
+  sheetTitle,
+  sheetExtraClassName,
+  contentClassName,
+  onRequestClose,
+  menuRef,
+  dismissOnBackdropPress = true,
+  children,
+  className,
+  style,
+  ...panelProps
+}) {
+  const sheetMotion = open ? POPOVER_MOBILE_SHEET_ENTRY_EASING : POPOVER_MOBILE_SHEET_EXIT_EASING;
+  const sheetHiddenTransform = slideEntrance ? `translateY(${slideOffsetPx}px)` : "translateY(100%)";
+  return createPortal(
+    /* @__PURE__ */ jsxs("div", { className: "fixed inset-0 z-50 flex items-end justify-center p-0", children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "fixed inset-0 bg-black/40 dark:bg-black/60",
+            isAnimating ? "opacity-100" : "opacity-0"
+          ),
+          style: {
+            transitionProperty: "opacity",
+            transitionDuration: `${POPOVER_MOBILE_SHEET_MOTION_MS}ms`,
+            transitionTimingFunction: sheetMotion
+          },
+          onClick: dismissOnBackdropPress ? onRequestClose : void 0,
+          "aria-hidden": true
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ...panelProps,
+          ref: menuRef,
+          className: cn(
+            // Panel chrome + padding rhythm matches `DropdownMobileBottomSheetPortal`.
+            "bg-background border-primary/10 relative z-10 flex w-full max-h-[min(90dvh,calc(100dvh-env(safe-area-inset-bottom,0px)))] flex-col overflow-hidden shadow-2xl outline-none",
+            "rounded-t-2xl rounded-b-none border-x-0 border-b-0 border-t",
+            sheetExtraClassName,
+            className
+          ),
+          style: {
+            transform: isAnimating ? "translateY(0)" : sheetHiddenTransform,
+            opacity: isAnimating ? 1 : 0,
+            transitionProperty: "transform, opacity",
+            transitionDuration: `${POPOVER_MOBILE_SHEET_MOTION_MS}ms`,
+            transitionTimingFunction: sheetMotion,
+            ...style
+          },
+          children: [
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: cn(
+                  "flex w-full shrink-0 items-center py-2 pl-4 pr-2",
+                  sheetTitle ? "justify-between gap-3" : "justify-end"
+                ),
+                children: [
+                  sheetTitle ? /* @__PURE__ */ jsx("p", { className: "text-foreground min-w-0 flex-1 truncate text-base font-semibold", children: sheetTitle }) : null,
+                  /* @__PURE__ */ jsx(
+                    PopoverMobileClose,
+                    {
+                      onClick: (e) => {
+                        e.stopPropagation();
+                        onRequestClose();
+                      }
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "min-h-0 flex-1 overflow-y-auto px-4 pt-3",
+                  contentClassName,
+                  "pb-[calc(5rem+env(safe-area-inset-bottom,0px))]"
+                ),
+                children
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    document.body
+  );
+}
+function computePosition(trigger, popover, side, align, offset, viewportPadding) {
+  const triggerRect = trigger.getBoundingClientRect();
+  const pw = popover.offsetWidth;
+  const ph = popover.offsetHeight;
+  const vw = window.innerWidth;
+  const vh = window.innerHeight;
+  let top = 0;
+  let left = 0;
+  let effectiveSide = side;
+  const place = (s) => {
+    switch (s) {
+      case "bottom":
+        top = triggerRect.bottom + offset;
+        break;
+      case "top":
+        top = triggerRect.top - ph - offset;
+        break;
+      case "right":
+        left = triggerRect.right + offset;
+        top = align === "start" ? triggerRect.top : align === "end" ? triggerRect.bottom - ph : triggerRect.top + triggerRect.height / 2 - ph / 2;
+        return;
+      case "left":
+        left = triggerRect.left - pw - offset;
+        top = align === "start" ? triggerRect.top : align === "end" ? triggerRect.bottom - ph : triggerRect.top + triggerRect.height / 2 - ph / 2;
+        return;
+    }
+    if (align === "start") left = triggerRect.left;
+    else if (align === "end") left = triggerRect.right - pw;
+    else left = triggerRect.left + triggerRect.width / 2 - pw / 2;
+  };
+  place(side);
+  const tryFlip = () => {
+    if (side === "bottom" && top + ph > vh - viewportPadding) {
+      const flipped = "top";
+      const newTop = triggerRect.top - ph - offset;
+      if (newTop >= viewportPadding) {
+        effectiveSide = flipped;
+        top = newTop;
+      }
+    } else if (side === "top" && top < viewportPadding) {
+      const flipped = "bottom";
+      const newTop = triggerRect.bottom + offset;
+      if (newTop + ph <= vh - viewportPadding) {
+        effectiveSide = flipped;
+        top = newTop;
+      }
+    } else if (side === "right" && left + pw > vw - viewportPadding) {
+      const flipped = "left";
+      const newLeft = triggerRect.left - pw - offset;
+      if (newLeft >= viewportPadding) {
+        effectiveSide = flipped;
+        left = newLeft;
+      }
+    } else if (side === "left" && left < viewportPadding) {
+      const flipped = "right";
+      const newLeft = triggerRect.right + offset;
+      if (newLeft + pw <= vw - viewportPadding) {
+        effectiveSide = flipped;
+        left = newLeft;
+      }
+    }
+  };
+  tryFlip();
+  left = Math.max(
+    viewportPadding,
+    Math.min(left, vw - pw - viewportPadding)
+  );
+  top = Math.max(
+    viewportPadding,
+    Math.min(top, vh - ph - viewportPadding)
+  );
+  return { top, left, side: effectiveSide };
+}
+var ARROW_SIZE = 6;
+var PopoverContent = ({
+  children,
+  side = "bottom",
+  align = "center",
+  offset = 10,
+  showArrow = false,
+  closeOnClickOutside = true,
+  closeOnEscape = true,
+  duration = 80,
+  viewportPadding = 8,
+  container,
+  width = "auto",
+  mobileOptions,
+  slideEntrance = true,
+  slideEntranceOffsetPx: slideEntranceOffsetPxProp,
+  className,
+  style,
+  ...props
+}) => {
+  const { open, setOpen, triggerRef } = usePopover();
+  const isMobile = usePopoverIsMobile(POPOVER_MOBILE_SHEET_MAX_PX + 1);
+  const resolvedMobile = useMemo(
+    () => resolvePopoverMobileSheet(mobileOptions),
+    [mobileOptions]
+  );
+  const sheetMode = isMobile && resolvedMobile.sheet;
+  const slideOffsetPx = useMemo(
+    () => slideEntranceOffsetPxProp ?? POPOVER_MOBILE_SHEET_SLIDE_ENTRANCE_OFFSET_DEFAULT_PX,
+    [slideEntranceOffsetPxProp]
+  );
+  const closeDuration = sheetMode ? POPOVER_MOBILE_SHEET_MOTION_MS : duration;
+  const [shouldRender, setShouldRender] = useState(false);
+  const [isAnimating, setIsAnimating] = useState(false);
+  const [position, setPosition] = useState({
+    top: -9999,
+    left: -9999,
+    side
+  });
+  const [triggerWidth, setTriggerWidth] = useState(0);
+  const popoverRef = useRef(null);
+  const closePopover = useCallback(() => setOpen(false), [setOpen]);
+  useEffect(() => {
+    if (open) {
+      setShouldRender(true);
+    } else {
+      setIsAnimating(false);
+      const timer = setTimeout(() => setShouldRender(false), closeDuration);
+      return () => clearTimeout(timer);
+    }
+  }, [open, closeDuration]);
+  useEffect(() => {
+    if (!shouldRender || !open) return;
+    let raf2 = 0;
+    const raf1 = requestAnimationFrame(() => {
+      raf2 = requestAnimationFrame(() => setIsAnimating(true));
+    });
+    return () => {
+      cancelAnimationFrame(raf1);
+      if (raf2) cancelAnimationFrame(raf2);
+    };
+  }, [shouldRender, open]);
+  useLayoutEffect(() => {
+    if (!shouldRender || !open || sheetMode || !triggerRef.current || !popoverRef.current)
+      return;
+    const update = () => {
+      if (!triggerRef.current || !popoverRef.current) return;
+      setTriggerWidth(triggerRef.current.getBoundingClientRect().width);
+      const pos = computePosition(
+        triggerRef.current,
+        popoverRef.current,
+        side,
+        align,
+        offset,
+        viewportPadding
+      );
+      setPosition(pos);
+    };
+    update();
+    window.addEventListener("resize", update);
+    window.addEventListener("scroll", update, true);
+    return () => {
+      window.removeEventListener("resize", update);
+      window.removeEventListener("scroll", update, true);
+    };
+  }, [shouldRender, open, sheetMode, side, align, offset, viewportPadding]);
+  useEffect(() => {
+    if (open && sheetMode) {
+      document.body.style.overflow = "hidden";
+    }
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, [open, sheetMode]);
+  useEffect(() => {
+    if (!open || !closeOnClickOutside || sheetMode) return;
+    const handler = (e) => {
+      const target = e.target;
+      if (popoverRef.current?.contains(target) || triggerRef.current?.contains(target))
+        return;
+      setOpen(false);
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open, closeOnClickOutside, sheetMode, setOpen, triggerRef]);
+  useEffect(() => {
+    if (!open || !closeOnEscape) return;
+    const handler = (e) => {
+      if (e.key === "Escape") setOpen(false);
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [open, closeOnEscape, setOpen]);
+  if (!shouldRender) return null;
+  if (sheetMode && typeof document !== "undefined") {
+    return /* @__PURE__ */ jsx(
+      PopoverMobileBottomSheetPortal,
+      {
+        ...props,
+        open,
+        isAnimating,
+        slideEntrance,
+        slideOffsetPx,
+        sheetTitle: resolvedMobile.title,
+        sheetExtraClassName: resolvedMobile.sheetExtraClassName,
+        contentClassName: cn(resolvedMobile.contentClassName, className),
+        onRequestClose: closePopover,
+        dismissOnBackdropPress: closeOnClickOutside,
+        menuRef: popoverRef,
+        role: "dialog",
+        "aria-modal": "true",
+        tabIndex: -1,
+        className: void 0,
+        style,
+        "data-slot": "popover-content",
+        children
+      }
+    );
+  }
+  const transformOrigin = {
+    bottom: "top center",
+    top: "bottom center",
+    left: "right center",
+    right: "left center"
+  };
+  const hiddenTransform = {
+    bottom: "translateY(-6px) scale(0.97)",
+    top: "translateY(6px) scale(0.97)",
+    left: "translateX(6px) scale(0.97)",
+    right: "translateX(-6px) scale(0.97)"
+  };
+  const resolvedWidth = width === "trigger" ? triggerWidth : width === "auto" ? void 0 : width;
+  const arrowStyles = () => {
+    const base = {
+      position: "absolute",
+      width: 0,
+      height: 0,
+      pointerEvents: "none"
+    };
+    switch (position.side) {
+      case "bottom":
+        return {
+          ...base,
+          top: -ARROW_SIZE,
+          left: "50%",
+          transform: "translateX(-50%)",
+          borderLeft: `${ARROW_SIZE}px solid transparent`,
+          borderRight: `${ARROW_SIZE}px solid transparent`,
+          borderBottom: `${ARROW_SIZE}px solid var(--border)`
+        };
+      case "top":
+        return {
+          ...base,
+          bottom: -ARROW_SIZE,
+          left: "50%",
+          transform: "translateX(-50%)",
+          borderLeft: `${ARROW_SIZE}px solid transparent`,
+          borderRight: `${ARROW_SIZE}px solid transparent`,
+          borderTop: `${ARROW_SIZE}px solid var(--border)`
+        };
+      case "right":
+        return {
+          ...base,
+          left: -ARROW_SIZE,
+          top: "50%",
+          transform: "translateY(-50%)",
+          borderTop: `${ARROW_SIZE}px solid transparent`,
+          borderBottom: `${ARROW_SIZE}px solid transparent`,
+          borderRight: `${ARROW_SIZE}px solid var(--border)`
+        };
+      case "left":
+        return {
+          ...base,
+          right: -ARROW_SIZE,
+          top: "50%",
+          transform: "translateY(-50%)",
+          borderTop: `${ARROW_SIZE}px solid transparent`,
+          borderBottom: `${ARROW_SIZE}px solid transparent`,
+          borderLeft: `${ARROW_SIZE}px solid var(--border)`
+        };
+    }
+  };
+  const resolvedContainer = container !== void 0 ? container : typeof document !== "undefined" ? document.body : null;
+  if (!resolvedContainer) return null;
+  return createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ...props,
+        ref: popoverRef,
+        className: cn(
+          "bg-background border-primary/10 fixed z-50 overflow-hidden rounded-xl border shadow-xl outline-none",
+          className
+        ),
+        "data-slot": "popover-content",
+        style: {
+          position: "fixed",
+          top: position.top,
+          left: position.left,
+          width: resolvedWidth,
+          transformOrigin: transformOrigin[position.side],
+          transform: isAnimating ? "none" : hiddenTransform[position.side],
+          opacity: isAnimating ? 1 : 0,
+          transition: `opacity ${duration}ms ease, transform ${duration}ms ease`,
+          ...style
+        },
+        children: [
+          showArrow && /* @__PURE__ */ jsx("div", { style: arrowStyles() }),
+          children
+        ]
+      }
+    ),
+    resolvedContainer
+  );
+};
+var PopoverHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "border-primary/10 flex flex-col space-y-1 border-b px-4 py-3",
+      className
+    ),
+    ...props
+  }
+);
+var PopoverFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "border-primary/10 flex flex-row justify-end gap-2 border-t px-4 py-3",
+      className
+    ),
+    ...props
+  }
+);
+var PopoverTitle = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "h4",
+  {
+    className: cn("text-primary text-sm leading-none font-semibold", className),
+    ...props
+  }
+);
+var PopoverDescription = ({ className, ...props }) => /* @__PURE__ */ jsx("p", { className: cn("text-muted-foreground text-xs", className), ...props });
+
+export { Popover, PopoverClose, PopoverContent, PopoverDescription, PopoverFooter, PopoverHeader, PopoverMobileClose, PopoverTitle, PopoverTrigger };
+//# sourceMappingURL=popover.js.map
+//# sourceMappingURL=popover.js.map