'use client';

// src/components/Popover/Popover.tsx
import * as React from "react";
import { cn } from "@paalan/react-shared/lib";
import * as PopoverPrimitive from "@radix-ui/react-popover";
import { jsx, jsxs } from "react/jsx-runtime";
var PopoverRoot = PopoverPrimitive.Root;
var PopoverTrigger = PopoverPrimitive.Trigger;
var PopoverContent = React.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
  PopoverPrimitive.Content,
  {
    ref,
    align,
    sideOffset,
    className: cn(
      "relative z-50 min-w-[var(--radix-popper-anchor-width)] rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
      className
    ),
    ...props
  }
) }));
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
var Popover = ({ trigger, triggerClassName, contentClassName, content, ...props }) => {
  return /* @__PURE__ */ jsxs(PopoverRoot, { ...props, children: [
    trigger && /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, className: triggerClassName, children: trigger }),
    content && /* @__PURE__ */ jsx(PopoverContent, { className: contentClassName, children: content })
  ] });
};
Popover.displayName = "Popover";

// src/components/Popover/components/PopoverModalContent.tsx
import { useEffect, useMemo, useRef as useRef2, useState as useState2 } from "react";
import { CheckIcon } from "@paalan/react-icons";
import { cn as cn17 } from "@paalan/react-shared/lib";

// src/base/Box/Box.tsx
import { StyledComponent, WithStyledComponent } from "@paalan/react-shared/system";
import { forwardRef as forwardRef2 } from "@paalan/react-shared/utils";
import { jsx as jsx2 } from "react/jsx-runtime";
var Box = forwardRef2((props, ref) => {
  return /* @__PURE__ */ jsx2(StyledComponent, { ...props, ref });
});
Box.withComponent = WithStyledComponent;

// src/base/Center/Center.tsx
import { cn as cn2 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef3 } from "@paalan/react-shared/utils";
import { jsx as jsx3 } from "react/jsx-runtime";
var Center = forwardRef3((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx3(Box, { className: cn2("flex items-center justify-center", className), ...restProps, ref, children });
});

// src/base/Container/Container.tsx
import { cn as cn3 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef4 } from "@paalan/react-shared/utils";
import { jsx as jsx4 } from "react/jsx-runtime";
var Container = forwardRef4((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx4(Box, { className: cn3("container", className), ...restProps, ref, children });
});

// src/base/Flex/Flex.tsx
import { cn as cn4 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef5 } from "@paalan/react-shared/utils";
import { jsx as jsx5 } from "react/jsx-runtime";
var Flex = forwardRef5((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx5(Box, { className: cn4("flex", className), ...restProps, ref, children });
});

// src/base/Grid/Grid.tsx
import { cn as cn5 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef6 } from "@paalan/react-shared/utils";
import { jsx as jsx6 } from "react/jsx-runtime";
var Grid = forwardRef6((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx6(Box, { className: cn5("grid", className), ...restProps, ref, children });
});
var GridItem = forwardRef6((props, ref) => {
  const { children, ...restProps } = props;
  return /* @__PURE__ */ jsx6(Box, { ...restProps, ref, children });
});

// src/base/HStack/HStack.tsx
import { cn as cn6 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef7 } from "@paalan/react-shared/utils";
import { jsx as jsx7 } from "react/jsx-runtime";
var HStack = forwardRef7((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx7(Box, { className: cn6("flex flex-row items-center gap-2", className), ...restProps, ref, children });
});

// src/base/Heading/Heading.tsx
import { cn as cn7 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef8 } from "@paalan/react-shared/utils";
import { jsx as jsx8 } from "react/jsx-runtime";
var headingSizes = {
  h1: "text-3xl font-bold",
  h2: "text-2xl font-bold",
  h3: "text-xl font-semibold",
  h4: "text-lg font-semibold",
  h5: "text-base font-semibold",
  h6: "text-sm font-semibold"
};
var Heading = forwardRef8((props, ref) => {
  const { children, as: headTag = "h1", className, ...restProps } = props;
  const size = headingSizes[headTag];
  return /* @__PURE__ */ jsx8(Box, { as: headTag, ...restProps, ref, className: cn7(size, className), children });
});

// src/base/Paper/Paper.tsx
import { cn as cn8 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef9 } from "@paalan/react-shared/utils";
import { cva } from "class-variance-authority";
import { jsx as jsx9 } from "react/jsx-runtime";
var paperVariants = cva("bg-background text-foreground", {
  variants: {
    shadow: {
      default: "shadow",
      sm: "shadow-sm",
      md: "shadow-md",
      lg: "shadow-lg",
      xl: "shadow-xl",
      "2xl": "shadow-2xl",
      inner: "shadow-inner",
      none: "shadow-none"
    }
  },
  defaultVariants: {
    shadow: "default"
  }
});
var Paper = forwardRef9(
  ({ withBorder, shadow, className, ...props }, ref) => {
    return /* @__PURE__ */ jsx9(
      Box,
      {
        ref,
        className: cn8(paperVariants({ shadow }), withBorder ? "border border-border" : "", className),
        ...props
      }
    );
  }
);

// src/base/Portal/Portal.tsx
import { forwardRef as forwardRef10, useRef, useState } from "react";
import { useIsomorphicEffect } from "@paalan/react-hooks";
import { assignRef } from "@paalan/react-shared/utils";
import { createPortal } from "react-dom";
import { Fragment, jsx as jsx10 } from "react/jsx-runtime";
var createPortalNode = (props) => {
  const node = document.createElement("div");
  node.setAttribute("data-portal", "true");
  if (typeof props.className === "string") {
    node.classList.add(...props.className.split(" "));
  }
  if (typeof props.style === "object") {
    Object.assign(node.style, props.style);
  }
  if (typeof props.id === "string") {
    node.setAttribute("id", props.id);
  }
  return node;
};
var defaultProps = {};
var Portal2 = forwardRef10((props, ref) => {
  const { children, target, ...others } = { ...defaultProps, ...props };
  const [mounted, setMounted] = useState(false);
  const nodeRef = useRef(null);
  useIsomorphicEffect(() => {
    setMounted(true);
    nodeRef.current = !target ? createPortalNode(others) : typeof target === "string" ? document.querySelector(target) : target;
    if (!nodeRef.current) return;
    assignRef(ref, nodeRef.current);
    if (!target && nodeRef.current) {
      document.body.appendChild(nodeRef.current);
    }
    return () => {
      if (!target && nodeRef.current) {
        document.body.removeChild(nodeRef.current);
      }
    };
  }, [target]);
  if (!mounted || !nodeRef.current) {
    return null;
  }
  return createPortal(/* @__PURE__ */ jsx10(Fragment, { children }), nodeRef.current);
});
Portal2.displayName = "Portal";

// src/base/Stack/Stack.tsx
import { cn as cn9 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef11 } from "@paalan/react-shared/utils";
import { jsx as jsx11 } from "react/jsx-runtime";
var Stack = forwardRef11((props, ref) => {
  const { children, className, direction, ...restProps } = props;
  return /* @__PURE__ */ jsx11(Box, { className: cn9("flex flex-col gap-2", className), flexDirection: direction, ...restProps, ref, children });
});

// src/base/Text/Text.tsx
import { cn as cn10 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef12 } from "@paalan/react-shared/utils";
import { jsx as jsx12 } from "react/jsx-runtime";
var Text = forwardRef12((props, ref) => {
  const { children, className, as = "p", ...restProps } = props;
  return /* @__PURE__ */ jsx12(Box, { as, ref, className: cn10("", className), ...restProps, children });
});

// src/base/Typography/Typography.tsx
import { cn as cn11 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef13 } from "@paalan/react-shared/utils";
import { jsx as jsx13 } from "react/jsx-runtime";
var H1 = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "h1",
    ref,
    className: cn11("scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl", className),
    ...props
  }
));
H1.displayName = "H1";
var H2 = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "h2",
    ref,
    className: cn11(
      "mt-10 scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0",
      className
    ),
    ...props
  }
));
H2.displayName = "H2";
var H3 = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "h3",
    ref,
    className: cn11("mt-8 scroll-m-20 text-2xl font-semibold tracking-tight", className),
    ...props
  }
));
H3.displayName = "H3";
var H4 = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "h4", ref, className: cn11("scroll-m-20 text-xl font-semibold tracking-tight", className), ...props }));
H4.displayName = "H4";
var H5 = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "h5", ref, className: cn11("scroll-m-20 text-lg font-semibold tracking-tight", className), ...props }));
H5.displayName = "H5";
var H6 = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "h6", ref, className: cn11("scroll-m-20 text-base font-semibold tracking-tight", className), ...props }));
H6.displayName = "H6";
var P = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "p", ref, className: cn11("leading-7 [&:not(:first-child)]:mt-4", className), ...props }));
P.displayName = "P";
var BlockQuote = forwardRef13(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
    Box,
    {
      as: "blockquote",
      ref,
      className: cn11(
        "mt-6 border-l-2 border-slate-300 pl-6 italic text-slate-800 dark:border-slate-600 dark:text-slate-200",
        className
      ),
      ...props
    }
  )
);
BlockQuote.displayName = "BlockQuote";
var TableLayout = forwardRef13(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "table", ref, className: cn11("w-full", className), ...props })
);
TableLayout.displayName = "Table";
var THead = forwardRef13(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "thead", ref, className: cn11("", className), ...props })
);
THead.displayName = "THead";
var TBody = forwardRef13(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "tbody", ref, className: cn11("", className), ...props })
);
TBody.displayName = "TBody";
var TR = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "tr",
    ref,
    className: cn11(
      "m-0 border-t border-slate-300 p-0 even:bg-slate-100 dark:border-slate-700 dark:even:bg-slate-800",
      className
    ),
    ...props
  }
));
TR.displayName = "TR";
var TD = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "td",
    ref,
    className: cn11(
      "border border-slate-200 px-4 py-2 text-left dark:border-slate-700 [&[align=center]]:text-center [&[align=right]]:text-right",
      className
    ),
    ...props
  }
));
TD.displayName = "TD";
var TH = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "th",
    ref,
    className: cn11(
      "border border-slate-200 px-4 py-2 text-left font-bold dark:border-slate-700 [&[align=center]]:text-center [&[align=right]]:text-right",
      className
    ),
    ...props
  }
));
TH.displayName = "TH";
var UL = forwardRef13(({ className, unstyled = false, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "ul",
    ref,
    className: cn11(
      {
        "m-4 list-disc [&>li]:mt-2": !unstyled
      },
      className
    ),
    ...props
  }
));
UL.displayName = "UL";
var OL = forwardRef13(({ className, unstyled = false, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "ol",
    ref,
    className: cn11(
      {
        "m-4 list-decimal [&>li]:mt-2": !unstyled
      },
      className
    ),
    ...props
  }
));
OL.displayName = "OL";
var LI = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "li", ref, className: cn11("", className), ...props }));
LI.displayName = "LI";
var Code = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
  Box,
  {
    as: "code",
    ref,
    className: cn11("relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-normal", className),
    ...props
  }
));
Code.displayName = "Code";
var Lead = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "p", ref, className: cn11("text-xl text-muted-foreground", className), ...props }));
Lead.displayName = "Lead";
var Large = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "div", ref, className: cn11("text-lg font-semibold", className), ...props }));
Large.displayName = "Large";
var Small = forwardRef13(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "small", ref, className: cn11("text-sm font-medium leading-none", className), ...props })
);
Small.displayName = "Small";
var Subtle = forwardRef13(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "p", ref, className: cn11("text-sm text-muted-foreground", className), ...props }));
Subtle.displayName = "Subtle";
var Strong = forwardRef13(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx13(Box, { as: "strong", ref, className: cn11("font-semibold", className), ...props })
);
Strong.displayName = "Strong";

// src/base/VStack/VStack.tsx
import { cn as cn12 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef14 } from "@paalan/react-shared/utils";
import { jsx as jsx14 } from "react/jsx-runtime";
var VStack = forwardRef14((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx14(Box, { className: cn12("flex flex-col items-stretch gap-2", className), ...restProps, ref, children });
});

// src/base/Wrap/Wrap.tsx
import { cn as cn13 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef15 } from "@paalan/react-shared/utils";
import { jsx as jsx15 } from "react/jsx-runtime";
var Wrap = forwardRef15((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx15(Box, { className: cn13("flex flex-wrap gap-2", className), ...restProps, ref, children });
});
var WrapItem = forwardRef15((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx15(Box, { className: cn13("flex flex-none items-start", className), ...restProps, ref, children });
});

// src/components/Command/Command.tsx
import * as React3 from "react";
import { MagnifyingGlassIcon } from "@paalan/react-icons";
import { cn as cn15 } from "@paalan/react-shared/lib";
import { Command as CommandPrimitive } from "cmdk";

// src/components/Dialog/Dialog.tsx
import * as React2 from "react";
import { Cross2Icon } from "@paalan/react-icons";
import { cn as cn14 } from "@paalan/react-shared/lib";
import * as DialogPrimitive from "@radix-ui/react-dialog";
import { jsx as jsx16, jsxs as jsxs2 } from "react/jsx-runtime";
var DialogRoot = DialogPrimitive.Root;
var DialogTrigger = DialogPrimitive.Trigger;
var DialogPortal = ({ ...props }) => /* @__PURE__ */ jsx16(DialogPrimitive.Portal, { ...props });
DialogPortal.displayName = DialogPrimitive.Portal.displayName;
var DialogOverlay = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
  DialogPrimitive.Overlay,
  {
    ref,
    className: cn14(
      "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
      className
    ),
    ...props
  }
));
DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
var DialogContent = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(DialogPortal, { children: [
  /* @__PURE__ */ jsx16(DialogOverlay, {}),
  /* @__PURE__ */ jsxs2(
    DialogPrimitive.Content,
    {
      ref,
      className: cn14(
        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",
        className
      ),
      ...props,
      children: [
        children,
        /* @__PURE__ */ jsxs2(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
          /* @__PURE__ */ jsx16(Cross2Icon, { className: "size-4" }),
          /* @__PURE__ */ jsx16("span", { className: "sr-only", children: "Close" })
        ] })
      ]
    }
  )
] }));
DialogContent.displayName = DialogPrimitive.Content.displayName;
var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx16("div", { className: cn14("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
DialogHeader.displayName = "DialogHeader";
var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx16("div", { className: cn14("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className), ...props });
DialogFooter.displayName = "DialogFooter";
var DialogTitle = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
  DialogPrimitive.Title,
  {
    ref,
    className: cn14("text-lg font-semibold leading-none tracking-tight", className),
    ...props
  }
));
DialogTitle.displayName = DialogPrimitive.Title.displayName;
var DialogDescription = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(DialogPrimitive.Description, { ref, className: cn14("text-sm text-muted-foreground", className), ...props }));
DialogDescription.displayName = DialogPrimitive.Description.displayName;
var Dialog = ({
  content,
  children,
  trigger,
  triggerClassName,
  header,
  contentClassName,
  footer,
  ...props
}) => {
  const dialogContent = content || children;
  return /* @__PURE__ */ jsxs2(DialogRoot, { ...props, children: [
    trigger && /* @__PURE__ */ jsx16(DialogTrigger, { asChild: true, className: triggerClassName, children: trigger }),
    /* @__PURE__ */ jsxs2(DialogContent, { className: cn14(contentClassName), children: [
      header && /* @__PURE__ */ jsxs2(DialogHeader, { className: header.className, children: [
        header.title && /* @__PURE__ */ jsx16(DialogTitle, { children: header.title }),
        /* @__PURE__ */ jsx16(DialogDescription, { children: header.description })
      ] }),
      dialogContent,
      footer && /* @__PURE__ */ jsx16(DialogFooter, { className: footer.className, children: footer.content })
    ] })
  ] });
};
Dialog.displayName = "Dialog";

// src/components/Command/Command.tsx
import { jsx as jsx17, jsxs as jsxs3 } from "react/jsx-runtime";
var CommandModal = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(
  CommandPrimitive,
  {
    ref,
    className: cn15(
      "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
      className
    ),
    ...props
  }
));
CommandModal.displayName = CommandPrimitive.displayName;
var CommandDialog = ({ children, ...props }) => {
  return /* @__PURE__ */ jsx17(DialogRoot, { ...props, children: /* @__PURE__ */ jsx17(DialogContent, { className: "overflow-hidden p-0", children: /* @__PURE__ */ jsx17(CommandModal, { className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:size-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:size-5", children }) }) });
};
var CommandInput = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs3("div", { className: "flex items-center border-b px-3", "data-cmdk-input-wrapper": "", children: [
  /* @__PURE__ */ jsx17(MagnifyingGlassIcon, { className: "mr-2 size-4 shrink-0 opacity-50" }),
  /* @__PURE__ */ jsx17(
    CommandPrimitive.Input,
    {
      ref,
      className: cn15(
        "flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
        className
      ),
      ...props
    }
  )
] }));
CommandInput.displayName = CommandPrimitive.Input.displayName;
var CommandList = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(
  CommandPrimitive.List,
  {
    ref,
    className: cn15("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
    ...props
  }
));
CommandList.displayName = CommandPrimitive.List.displayName;
var CommandEmpty = React3.forwardRef((props, ref) => /* @__PURE__ */ jsx17(CommandPrimitive.Empty, { ref, className: "py-6 text-center text-sm", ...props }));
CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
var CommandGroup = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(
  CommandPrimitive.Group,
  {
    ref,
    className: cn15(
      "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
      className
    ),
    ...props
  }
));
CommandGroup.displayName = CommandPrimitive.Group.displayName;
var CommandSeparator = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(CommandPrimitive.Separator, { ref, className: cn15("-mx-1 h-px bg-border", className), ...props }));
CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
var CommandLoading = React3.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx17(CommandPrimitive.Loading, { ref, ...props }));
CommandLoading.displayName = CommandPrimitive.Loading.displayName;
var CommandItem = React3.forwardRef(({ className, onSelect, ...props }, ref) => {
  return /* @__PURE__ */ jsx17(
    CommandPrimitive.Item,
    {
      ref,
      ...props,
      className: cn15(
        "relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
        className
      ),
      onSelect: (value) => {
        onSelect?.(props.value ?? value);
      }
    }
  );
});
CommandItem.displayName = CommandPrimitive.Item.displayName;
var CommandShortcut = ({ className, ...props }) => {
  return /* @__PURE__ */ jsx17("span", { className: cn15("ml-auto text-xs tracking-widest text-muted-foreground", className), ...props });
};
CommandShortcut.displayName = "CommandShortcut";
var Command = ({
  inputOptions,
  emptyResultContent = "No results found.",
  groups,
  ...props
}) => {
  return /* @__PURE__ */ jsxs3(CommandDialog, { ...props, children: [
    /* @__PURE__ */ jsx17(CommandInput, { placeholder: "Search...", ...inputOptions }),
    /* @__PURE__ */ jsxs3(CommandList, { children: [
      /* @__PURE__ */ jsx17(CommandEmpty, { children: emptyResultContent }),
      groups.map(({ items, ...group }, index) => /* @__PURE__ */ jsxs3(React3.Fragment, { children: [
        /* @__PURE__ */ jsx17(CommandGroup, { ...group, children: items.map(({ icon, label, shortcut, ...item }) => /* @__PURE__ */ jsxs3(CommandItem, { ...item, id: `${group.heading} - ${label}`, children: [
          icon && /* @__PURE__ */ jsx17(Text, { as: "span", className: "mr-2", children: icon }),
          /* @__PURE__ */ jsx17(Text, { as: "span", className: "text-sm", children: label }),
          shortcut && /* @__PURE__ */ jsx17(CommandShortcut, { children: shortcut })
        ] }, label)) }),
        index !== groups.length && /* @__PURE__ */ jsx17(CommandSeparator, {})
      ] }, group.heading))
    ] })
  ] });
};
Command.displayName = "Command";
var CommandNoResultFound = ({
  optionsLength,
  emptyOptionMessage,
  emptyOptionContent,
  searchValue,
  initialSearchContent
}) => {
  if (optionsLength > 0) return null;
  if (!searchValue && initialSearchContent) {
    return typeof initialSearchContent === "string" ? /* @__PURE__ */ jsx17(Box, { className: "py-6 text-center text-sm", children: initialSearchContent }) : initialSearchContent;
  }
  if (emptyOptionContent) return emptyOptionContent;
  return /* @__PURE__ */ jsxs3(Box, { className: "py-6 text-center text-sm", children: [
    emptyOptionMessage ?? `No results found${searchValue ? ` for "${searchValue}"` : ""}`,
    "."
  ] });
};
CommandNoResultFound.displayName = "CommandNoResultFound";

// src/components/Loading/Loading.tsx
import { LoadingIcon } from "@paalan/react-icons";
import { cn as cn16 } from "@paalan/react-shared/lib";
import { jsx as jsx18, jsxs as jsxs4 } from "react/jsx-runtime";
var Loading = ({ className, spin = true, content, parentClassName, ...props }) => {
  return /* @__PURE__ */ jsxs4(Flex, { className: cn16("inline-flex items-center gap-2 text-gray-800 dark:text-gray-200", parentClassName), children: [
    /* @__PURE__ */ jsx18(
      LoadingIcon,
      {
        ...props,
        className: cn16(
          "text-gray-500 dark:text-gray-50",
          {
            "animate-spin": !!spin
          },
          className
        )
      }
    ),
    content
  ] });
};

// src/components/Popover/components/PopoverModalContent.tsx
import { jsx as jsx19, jsxs as jsxs5 } from "react/jsx-runtime";
var PopoverModalContent = ({
  searchPlaceholder = "Search...",
  emptyOptionMessage,
  emptyOptionContent,
  options,
  value,
  onValueChange,
  onSearchValueChange,
  commandClassName,
  commandInputClassName,
  commandGroupClassName,
  commandItemClassName,
  checkIconClassName,
  filter,
  filterBy = "label",
  isMulti,
  isLoading,
  loadingText = "Loading...",
  searchValue: searchValueProp,
  initialSearchContent
}) => {
  const [searchValue, setSearchValue] = useState2(searchValueProp || "");
  const filterRef = useRef2(filter);
  useEffect(() => {
    setSearchValue(searchValueProp || "");
  }, [searchValueProp]);
  useEffect(() => {
    filterRef.current = filter;
  }, [filter]);
  const filteredOptions = useMemo(() => {
    if (!searchValue) return options;
    if (typeof filterRef.current === "function") {
      return options.filter((option, index) => filterRef.current?.(option, searchValue, index));
    }
    const filterKeys = filterBy === "both" ? ["label", "value"] : [filterBy];
    return options.filter((option) => {
      return filterKeys.some((key) => {
        const value2 = option[key];
        if (typeof value2 === "string") {
          return value2.toLowerCase().includes(searchValue.toLowerCase());
        }
        return false;
      });
    });
  }, [searchValue, filterBy, options]);
  const sortedOptions = useMemo(() => {
    return filteredOptions.sort((a, b) => {
      return a.label.localeCompare(b.label);
    });
  }, [filteredOptions]);
  const checkIconClassNameFn = (value2) => {
    return typeof checkIconClassName === "function" ? checkIconClassName(value2) : checkIconClassName;
  };
  const handleSearchValueChange = (search) => {
    setSearchValue(search);
    onSearchValueChange?.(search);
  };
  return /* @__PURE__ */ jsxs5(CommandModal, { className: commandClassName, shouldFilter: false, loop: true, children: [
    /* @__PURE__ */ jsx19(
      CommandInput,
      {
        placeholder: searchPlaceholder,
        className: cn17("border-transparent focus:border-transparent focus:ring-0", commandInputClassName),
        value: searchValue,
        onValueChange: handleSearchValueChange
      }
    ),
    !isLoading && /* @__PURE__ */ jsx19(
      CommandNoResultFound,
      {
        emptyOptionMessage,
        emptyOptionContent,
        optionsLength: sortedOptions.length,
        searchValue: searchValueProp ?? searchValue,
        initialSearchContent
      }
    ),
    /* @__PURE__ */ jsx19(CommandGroup, { className: cn17("max-h-64 overflow-auto", commandGroupClassName), children: isLoading ? /* @__PURE__ */ jsx19(CommandLoading, { children: /* @__PURE__ */ jsx19(Box, { className: "p-3 text-center", children: /* @__PURE__ */ jsx19(Loading, { boxSize: "5", content: loadingText }) }) }) : sortedOptions.map((option) => /* @__PURE__ */ jsxs5(
      CommandItem,
      {
        value: option.value,
        className: cn17("flex cursor-pointer", commandItemClassName, option.className),
        disabled: option.disabled,
        onSelect: (currentValue) => {
          onValueChange?.(currentValue === value ? "" : currentValue);
        },
        children: [
          isMulti && /* @__PURE__ */ jsx19(CheckIcon, { className: cn17("mr-2 h-4 w-4", checkIconClassNameFn(option.value)) }),
          option.labelContent || option.label,
          !isMulti && /* @__PURE__ */ jsx19(
            CheckIcon,
            {
              className: cn17(
                "ml-auto h-4 w-4",
                value === option.value ? "opacity-100" : "opacity-0",
                checkIconClassNameFn(option.value)
              )
            }
          )
        ]
      },
      option.key || option.value
    )) })
  ] });
};
PopoverModalContent.displayName = "PopoverModalContent";
export {
  Popover,
  PopoverContent,
  PopoverModalContent,
  PopoverRoot,
  PopoverTrigger
};
