@sikka/hawa
Version:
Modern UI Kit made with Tailwind
84 lines (81 loc) • 2.49 kB
JavaScript
"use client";
// elements/popover/Popover.tsx
import * as React from "react";
import * as PopoverPrimitive from "@radix-ui/react-popover";
// util/index.ts
import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";
function cn(...inputs) {
return twMerge(clsx(inputs));
}
// elements/popover/Popover.tsx
var PopoverContent = React.forwardRef(
({ className, align = "center", sideOffset = 4, container, ...props }, ref) => /* @__PURE__ */ React.createElement(PopoverPrimitive.Portal, { container }, /* @__PURE__ */ React.createElement(
PopoverPrimitive.Content,
{
ref,
align,
sideOffset,
className: cn(
"dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
className
),
...props
}
))
);
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
var Popover = ({
trigger,
children,
className,
align = "center",
side,
sideOffset = 4,
open,
width = "default",
disableTrigger,
contentProps,
triggerProps,
...props
}) => {
let widthStyles = {
trigger: "var(--radix-popover-trigger-width)",
default: "auto"
};
return /* @__PURE__ */ React.createElement(PopoverPrimitive.Root, { open, ...props }, /* @__PURE__ */ React.createElement(
PopoverPrimitive.Trigger,
{
className: "hawa-w-full",
disabled: disableTrigger,
...triggerProps
},
trigger
), /* @__PURE__ */ React.createElement(
PopoverContent,
{
side,
className,
align,
sideOffset,
style: {
width: widthStyles[width],
maxWidth: "var(--radix-popover-content-available-width)",
maxHeight: "var(--radix-popover-content-available-height)"
},
...contentProps
},
children
));
};
var PopoverTrigger = PopoverPrimitive.Trigger;
var PopoverPortal = PopoverPrimitive.Portal;
var PopoverRoot = PopoverPrimitive.Root;
export {
Popover,
PopoverContent,
PopoverPortal,
PopoverRoot,
PopoverTrigger
};
//# sourceMappingURL=index.mjs.map