'use client';

// src/components/DateRangePicker/DateRangePicker.tsx
import * as React6 from "react";
import { CalendarIcon, XCircleIcon } from "@paalan/react-icons";
import { cn as cn23, isAriaInvalid } from "@paalan/react-shared/lib";
import { format } from "date-fns";

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

// src/components/Button/Button.tsx
import { ArrowPathIcon } from "@paalan/react-icons";
import { cn as cn13 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef15 } from "@paalan/react-shared/utils";
import { Slot } from "@radix-ui/react-slot";
import { cva as cva2 } from "class-variance-authority";

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

// src/base/Container/Container.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 Container = forwardRef3((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx3(Box, { className: cn2("container", className), ...restProps, ref, children });
});

// src/base/Flex/Flex.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 Flex = forwardRef4((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx4(Box, { className: cn3("flex", className), ...restProps, ref, children });
});

// src/base/Grid/Grid.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 Grid = forwardRef5((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx5(Box, { className: cn4("grid", className), ...restProps, ref, children });
});
var GridItem = forwardRef5((props, ref) => {
  const { children, ...restProps } = props;
  return /* @__PURE__ */ jsx5(Box, { ...restProps, ref, children });
});

// src/base/HStack/HStack.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 HStack = forwardRef6((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx6(Box, { className: cn5("flex flex-row items-center gap-2", className), ...restProps, ref, children });
});

// src/base/Heading/Heading.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 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 = forwardRef7((props, ref) => {
  const { children, as: headTag = "h1", className, ...restProps } = props;
  const size = headingSizes[headTag];
  return /* @__PURE__ */ jsx7(Box, { as: headTag, ...restProps, ref, className: cn6(size, className), children });
});

// src/base/Paper/Paper.tsx
import { cn as cn7 } from "@paalan/react-shared/lib";
import { forwardRef as forwardRef8 } from "@paalan/react-shared/utils";
import { cva } from "class-variance-authority";
import { jsx as jsx8 } 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 = forwardRef8(
  ({ withBorder, shadow, className, ...props }, ref) => {
    return /* @__PURE__ */ jsx8(
      Box,
      {
        ref,
        className: cn7(paperVariants({ shadow }), withBorder ? "border border-border" : "", className),
        ...props
      }
    );
  }
);

// src/base/Portal/Portal.tsx
import { forwardRef as forwardRef9, 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 jsx9 } 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 Portal = forwardRef9((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__ */ jsx9(Fragment, { children }), nodeRef.current);
});
Portal.displayName = "Portal";

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

// src/base/Text/Text.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 Text = forwardRef11((props, ref) => {
  const { children, className, as = "p", ...restProps } = props;
  return /* @__PURE__ */ jsx11(Box, { as, ref, className: cn9("", className), ...restProps, children });
});

// src/base/Typography/Typography.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 H1 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "h1",
    ref,
    className: cn10("scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl", className),
    ...props
  }
));
H1.displayName = "H1";
var H2 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "h2",
    ref,
    className: cn10(
      "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 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "h3",
    ref,
    className: cn10("mt-8 scroll-m-20 text-2xl font-semibold tracking-tight", className),
    ...props
  }
));
H3.displayName = "H3";
var H4 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "h4", ref, className: cn10("scroll-m-20 text-xl font-semibold tracking-tight", className), ...props }));
H4.displayName = "H4";
var H5 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "h5", ref, className: cn10("scroll-m-20 text-lg font-semibold tracking-tight", className), ...props }));
H5.displayName = "H5";
var H6 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "h6", ref, className: cn10("scroll-m-20 text-base font-semibold tracking-tight", className), ...props }));
H6.displayName = "H6";
var P = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "p", ref, className: cn10("leading-7 [&:not(:first-child)]:mt-4", className), ...props }));
P.displayName = "P";
var BlockQuote = forwardRef12(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
    Box,
    {
      as: "blockquote",
      ref,
      className: cn10(
        "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 = forwardRef12(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "table", ref, className: cn10("w-full", className), ...props })
);
TableLayout.displayName = "Table";
var THead = forwardRef12(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "thead", ref, className: cn10("", className), ...props })
);
THead.displayName = "THead";
var TBody = forwardRef12(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "tbody", ref, className: cn10("", className), ...props })
);
TBody.displayName = "TBody";
var TR = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "tr",
    ref,
    className: cn10(
      "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 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "td",
    ref,
    className: cn10(
      "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 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "th",
    ref,
    className: cn10(
      "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 = forwardRef12(({ className, unstyled = false, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "ul",
    ref,
    className: cn10(
      {
        "m-4 list-disc [&>li]:mt-2": !unstyled
      },
      className
    ),
    ...props
  }
));
UL.displayName = "UL";
var OL = forwardRef12(({ className, unstyled = false, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "ol",
    ref,
    className: cn10(
      {
        "m-4 list-decimal [&>li]:mt-2": !unstyled
      },
      className
    ),
    ...props
  }
));
OL.displayName = "OL";
var LI = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "li", ref, className: cn10("", className), ...props }));
LI.displayName = "LI";
var Code = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
  Box,
  {
    as: "code",
    ref,
    className: cn10("relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-normal", className),
    ...props
  }
));
Code.displayName = "Code";
var Lead = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "p", ref, className: cn10("text-xl text-muted-foreground", className), ...props }));
Lead.displayName = "Lead";
var Large = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "div", ref, className: cn10("text-lg font-semibold", className), ...props }));
Large.displayName = "Large";
var Small = forwardRef12(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "small", ref, className: cn10("text-sm font-medium leading-none", className), ...props })
);
Small.displayName = "Small";
var Subtle = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "p", ref, className: cn10("text-sm text-muted-foreground", className), ...props }));
Subtle.displayName = "Subtle";
var Strong = forwardRef12(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(Box, { as: "strong", ref, className: cn10("font-semibold", className), ...props })
);
Strong.displayName = "Strong";

// src/base/VStack/VStack.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 VStack = forwardRef13((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx13(Box, { className: cn11("flex flex-col items-stretch gap-2", className), ...restProps, ref, children });
});

// src/base/Wrap/Wrap.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 Wrap = forwardRef14((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx14(Box, { className: cn12("flex flex-wrap gap-2", className), ...restProps, ref, children });
});
var WrapItem = forwardRef14((props, ref) => {
  const { children, className, ...restProps } = props;
  return /* @__PURE__ */ jsx14(Box, { className: cn12("flex flex-none items-start", className), ...restProps, ref, children });
});

// src/components/Button/constants.ts
var LOADING_ICON_SIZE = {
  xs: "w-3 h-3",
  sm: "w-4 h-4",
  md: "w-5 h-5",
  lg: "w-6 h-6",
  xl: "w-7 h-7"
};
var BUTTON_SIZE = {
  xs: "px-2 py-1 text-xs",
  sm: "px-3 py-1 text-sm",
  md: "px-4 py-2 text-sm",
  lg: "px-6 py-2 text-base",
  xl: "px-8 py-2.5 text-base"
};
var BUTTON_ROUNDED = {
  none: "rounded-none",
  sm: "rounded-sm",
  md: "rounded-md",
  lg: "rounded-lg",
  xl: "rounded-xl",
  "2xl": "rounded-2xl",
  "3xl": "rounded-3xl",
  full: "rounded-full"
};
var BUTTON_COLOR_VARIANT_MAPPING = {
  solid: {
    gray: "bg-gray-600 hover:bg-gray-700 focus-visible:ring-gray-500 text-gray-50",
    red: "bg-red-600 hover:bg-red-700 focus-visible:ring-red-500 text-red-50",
    orange: "bg-orange-600 hover:bg-orange-700 focus-visible:ring-orange-500 text-orange-50",
    amber: "bg-amber-600 hover:bg-amber-700 focus-visible:ring-amber-500 text-amber-50",
    yellow: "bg-yellow-600 hover:bg-yellow-700 focus-visible:ring-yellow-500 text-yellow-50",
    lime: "bg-lime-600 hover:bg-lime-700 focus-visible:ring-lime-500 text-lime-50",
    green: "bg-green-600 hover:bg-green-700 focus-visible:ring-green-500 text-green-50",
    emerald: "bg-emerald-600 hover:bg-emerald-700 focus-visible:ring-emerald-500 text-emerald-50",
    teal: "bg-teal-600 hover:bg-teal-700 focus-visible:ring-teal-500 text-teal-50",
    cyan: "bg-cyan-600 hover:bg-cyan-700 focus-visible:ring-cyan-500 text-cyan-50",
    sky: "bg-sky-600 hover:bg-sky-700 focus-visible:ring-sky-500 text-sky-50",
    blue: "bg-blue-600 hover:bg-blue-700 focus-visible:ring-blue-500 text-blue-50",
    indigo: "bg-indigo-600 hover:bg-indigo-700 focus-visible:ring-indigo-500 text-indigo-50",
    violet: "bg-violet-600 hover:bg-violet-700 focus-visible:ring-violet-500 text-violet-50",
    purple: "bg-purple-600 hover:bg-purple-700 focus-visible:ring-purple-500 text-purple-50",
    fuchsia: "bg-fuchsia-600 hover:bg-fuchsia-700 focus-visible:ring-fuchsia-500 text-fuchsia-50",
    pink: "bg-pink-600 hover:bg-pink-700 focus-visible:ring-pink-500 text-pink-50",
    rose: "bg-rose-600 hover:bg-rose-700 focus-visible:ring-rose-500 text-rose-50",
    primary: "bg-primary hover:bg-primary/90 focus-visible:ring-primary text-primary-foreground",
    secondary: "bg-secondary hover:bg-secondary/90 focus-visible:ring-secondary text-secondary-foreground",
    tertiary: "bg-tertiary hover:bg-tertiary/90 focus-visible:ring-tertiary text-tertiary-foreground",
    info: "bg-info hover:bg-info/90 focus-visible:ring-info text-info-foreground",
    danger: "bg-danger hover:bg-danger/90 focus-visible:ring-danger text-danger-foreground",
    success: "bg-success hover:bg-success/90 focus-visible:ring-success text-success-foreground",
    warning: "bg-warning hover:bg-warning/90 focus-visible:ring-warning text-warning-foreground"
  },
  surface: {
    gray: "bg-transparent text-gray-600 hover:bg-gray-50 focus:ring-gray-200 focus-visible:ring-gray-500 border border-current",
    red: "bg-transparent text-red-600 hover:bg-red-50 focus:ring-red-200 focus-visible:ring-red-500 border border-current",
    orange: "bg-transparent text-orange-600 hover:bg-orange-50 focus:ring-orange-200 focus-visible:ring-orange-500 border border-current",
    amber: "bg-transparent text-amber-600 hover:bg-amber-50 focus:ring-amber-200 focus-visible:ring-amber-500 border border-current",
    yellow: "bg-transparent text-yellow-600 hover:bg-yellow-50 focus:ring-yellow-200 focus-visible:ring-yellow-500 border border-current",
    lime: "bg-transparent text-lime-600 hover:bg-lime-50 focus:ring-lime-200 focus-visible:ring-lime-500 border border-current",
    green: "bg-transparent text-green-600 hover:bg-green-50 focus:ring-green-200 focus-visible:ring-green-500 border border-current",
    emerald: "bg-transparent text-emerald-600 hover:bg-emerald-50 focus:ring-emerald-200 focus-visible:ring-emerald-500 border border-current",
    teal: "bg-transparent text-teal-600 hover:bg-teal-50 focus:ring-teal-200 focus-visible:ring-teal-500 border border-current",
    cyan: "bg-transparent text-cyan-600 hover:bg-cyan-50 focus:ring-cyan-200 focus-visible:ring-cyan-500 border border-current",
    sky: "bg-transparent text-sky-600 hover:bg-sky-50 focus:ring-sky-200 focus-visible:ring-sky-500 border border-current",
    blue: "bg-transparent text-blue-600 hover:bg-blue-50 focus:ring-blue-200 focus-visible:ring-blue-500 border border-current",
    indigo: "bg-transparent text-indigo-600 hover:bg-indigo-50 focus:ring-indigo-200 focus-visible:ring-indigo-500 border border-current",
    violet: "bg-transparent text-violet-600 hover:bg-violet-50 focus:ring-violet-200 focus-visible:ring-violet-500 border border-current",
    purple: "bg-transparent text-purple-600 hover:bg-purple-50 focus:ring-purple-200 focus-visible:ring-purple-500 border border-current",
    fuchsia: "bg-transparent text-fuchsia-600 hover:bg-fuchsia-50 focus:ring-fuchsia-200 focus-visible:ring-fuchsia-500 border border-current",
    pink: "bg-transparent text-pink-600 hover:bg-pink-50 focus:ring-pink-200 focus-visible:ring-pink-500 border border-current",
    rose: "bg-transparent text-rose-600 hover:bg-rose-50 focus:ring-rose-200 focus-visible:ring-rose-500 border border-current",
    primary: "bg-transparent text-primary hover:bg-primary/10 focus:ring-primary focus-visible:ring-primary border border-current",
    secondary: "bg-transparent text-secondary-foreground/90 hover:bg-secondary-foreground/10 focus:ring-secondary-foreground focus-visible:ring-secondary-foreground border border-current",
    tertiary: "bg-transparent text-tertiary hover:bg-tertiary/10 focus:ring-tertiary focus-visible:ring-tertiary border border-current",
    info: "bg-transparent text-info hover:bg-info/10 focus:ring-info focus-visible:ring-info border border-current",
    danger: "bg-transparent text-danger hover:bg-danger/10 focus:ring-danger focus-visible:ring-danger border border-current",
    success: "bg-transparent text-success hover:bg-success/10 focus:ring-success focus-visible:ring-success border border-current",
    warning: "bg-transparent text-warning hover:bg-warning/10 focus:ring-warning focus-visible:ring-warning border border-current"
  },
  outline: {
    gray: "bg-transparent text-gray-600 hover:bg-gray-600 hover:text-gray-50 focus-visible:ring-gray-500 border border-current hover:border-gray-600",
    red: "bg-transparent text-red-600 hover:bg-red-600 hover:text-red-50 focus-visible:ring-red-500 border border-current hover:border-red-600",
    orange: "bg-transparent text-orange-600 hover:bg-orange-600 hover:text-orange-50 focus-visible:ring-orange-500 border border-current hover:border-orange-600",
    amber: "bg-transparent text-amber-600 hover:bg-amber-600 hover:text-amber-50 focus-visible:ring-amber-500 border border-current hover:border-amber-600",
    yellow: "bg-transparent text-yellow-600 hover:bg-yellow-600 hover:text-yellow-50 focus-visible:ring-yellow-500 border border-current hover:border-yellow-600",
    lime: "bg-transparent text-lime-600 hover:bg-lime-600 hover:text-lime-50 focus-visible:ring-lime-500 border border-current hover:border-lime-600",
    green: "bg-transparent text-green-600 hover:bg-green-600 hover:text-green-50 focus-visible:ring-green-500 border border-current hover:border-green-600",
    emerald: "bg-transparent text-emerald-600 hover:bg-emerald-600 hover:text-emerald-50 focus-visible:ring-emerald-500 border border-current hover:border-emerald-600",
    teal: "bg-transparent text-teal-600 hover:bg-teal-600 hover:text-teal-50 focus-visible:ring-teal-500 border border-current hover:border-teal-600",
    cyan: "bg-transparent text-cyan-600 hover:bg-cyan-600 hover:text-cyan-50 focus-visible:ring-cyan-500 border border-current hover:border-cyan-600",
    sky: "bg-transparent text-sky-600 hover:bg-sky-600 hover:text-sky-50 focus-visible:ring-sky-500 border border-current hover:border-sky-600",
    blue: "bg-transparent text-blue-600 hover:bg-blue-600 hover:text-blue-50 focus-visible:ring-blue-500 border border-current hover:border-blue-600",
    indigo: "bg-transparent text-indigo-600 hover:bg-indigo-600 hover:text-indigo-50 focus-visible:ring-indigo-500 border border-current hover:border-indigo-600",
    violet: "bg-transparent text-violet-600 hover:bg-violet-600 hover:text-violet-50 focus-visible:ring-violet-500 border border-current hover:border-violet-600",
    purple: "bg-transparent text-purple-600 hover:bg-purple-600 hover:text-purple-50 focus-visible:ring-purple-500 border border-current hover:border-purple-600",
    fuchsia: "bg-transparent text-fuchsia-600 hover:bg-fuchsia-600 hover:text-fuchsia-50 focus-visible:ring-fuchsia-500 border border-current hover:border-fuchsia-600",
    pink: "bg-transparent text-pink-600 hover:bg-pink-600 hover:text-pink-50 focus-visible:ring-pink-500 border border-current hover:border-pink-600",
    rose: "bg-transparent text-rose-600 hover:bg-rose-600 hover:text-rose-50 focus-visible:ring-rose-500 border border-current hover:border-rose-600",
    primary: "bg-transparent text-primary hover:bg-primary hover:text-primary-foreground focus-visible:ring-primary border border-current hover:border-primary",
    secondary: "bg-transparent text-secondary-foreground hover:bg-secondary-foreground/80 hover:text-secondary focus-visible:ring-secondary-foreground border border-current hover:border-secondary",
    tertiary: "bg-transparent text-tertiary hover:bg-tertiary hover:text-tertiary-foreground focus-visible:ring-tertiary border border-current hover:border-tertiary",
    info: "bg-transparent text-info hover:bg-info hover:text-info-foreground focus-visible:ring-info border border-current hover:border-info",
    danger: "bg-transparent text-danger hover:bg-danger hover:text-danger-foreground focus-visible:ring-danger border border-current hover:border-danger",
    success: "bg-transparent text-success hover:bg-success hover:text-success-foreground focus-visible:ring-success border border-current hover:border-success",
    warning: "bg-transparent text-warning hover:bg-warning hover:text-warning-foreground focus-visible:ring-warning border border-current hover:border-warning"
  },
  soft: {
    gray: "bg-gray-100 hover:bg-gray-200 text-gray-800 focus-visible:ring-gray-600",
    red: "bg-red-100 hover:bg-red-200 text-red-800 focus-visible:ring-red-600",
    orange: "bg-orange-100 hover:bg-orange-200 text-orange-800 focus-visible:ring-orange-600",
    amber: "bg-amber-100 hover:bg-amber-200 text-amber-800 focus-visible:ring-amber-600",
    yellow: "bg-yellow-100 hover:bg-yellow-200 text-yellow-800 focus-visible:ring-yellow-600",
    lime: "bg-lime-100 hover:bg-lime-200 text-lime-800 focus-visible:ring-lime-600",
    green: "bg-green-100 hover:bg-green-200 text-green-800 focus-visible:ring-green-600",
    emerald: "bg-emerald-100 hover:bg-emerald-200 text-emerald-800 focus-visible:ring-emerald-600",
    teal: "bg-teal-100 hover:bg-teal-200 text-teal-800 focus-visible:ring-teal-600",
    cyan: "bg-cyan-100 hover:bg-cyan-200 text-cyan-800 focus-visible:ring-cyan-600",
    sky: "bg-sky-100 hover:bg-sky-200 text-sky-800 focus-visible:ring-sky-600",
    blue: "bg-blue-100 hover:bg-blue-200 text-blue-800 focus-visible:ring-blue-600",
    indigo: "bg-indigo-100 hover:bg-indigo-200 text-indigo-800 focus-visible:ring-indigo-600",
    violet: "bg-violet-100 hover:bg-violet-200 text-violet-800 focus-visible:ring-violet-600",
    purple: "bg-purple-100 hover:bg-purple-200 text-purple-800 focus-visible:ring-purple-600",
    fuchsia: "bg-fuchsia-100 hover:bg-fuchsia-200 text-fuchsia-800 focus-visible:ring-fuchsia-600",
    pink: "bg-pink-100 hover:bg-pink-200 text-pink-800 focus-visible:ring-pink-600",
    rose: "bg-rose-100 hover:bg-rose-200 text-rose-800 focus-visible:ring-rose-600",
    primary: "bg-primary-soft hover:bg-primary-soft/90 text-primary/90 focus-visible:ring-primary",
    secondary: "bg-secondary-soft hover:bg-secondary-soft/90 text-secondary-foreground/70 focus-visible:ring-secondary-foreground",
    tertiary: "bg-tertiary-soft hover:bg-tertiary-soft/90 text-tertiary/90 focus-visible:ring-tertiary",
    info: "bg-info-soft hover:bg-info-soft/90 text-info/90 focus-visible:ring-info",
    danger: "bg-danger-soft hover:bg-danger-soft/90 text-danger/90 focus-visible:ring-danger",
    success: "bg-success-soft hover:bg-success-soft/90 text-success/90 focus-visible:ring-success",
    warning: "bg-warning-soft hover:bg-warning-soft/90 text-warning focus-visible:ring-warning"
  },
  ghost: {
    gray: "bg-transparent text-gray-600 hover:bg-gray-50 shadow-none focus-visible:ring-gray-500",
    red: "bg-transparent text-red-600 hover:bg-red-50 shadow-none focus-visible:ring-red-500",
    orange: "bg-transparent text-orange-600 hover:bg-orange-50 shadow-none focus-visible:ring-orange-500",
    amber: "bg-transparent text-amber-600 hover:bg-amber-50 shadow-none focus-visible:ring-amber-500",
    yellow: "bg-transparent text-yellow-600 hover:bg-yellow-50 shadow-none focus-visible:ring-yellow-500",
    lime: "bg-transparent text-lime-600 hover:bg-lime-50 shadow-none focus-visible:ring-lime-500",
    green: "bg-transparent text-green-600 hover:bg-green-50 shadow-none focus-visible:ring-green-500",
    emerald: "bg-transparent text-emerald-600 hover:bg-emerald-50 shadow-none focus-visible:ring-emerald-500",
    teal: "bg-transparent text-teal-600 hover:bg-teal-50 shadow-none focus-visible:ring-teal-500",
    cyan: "bg-transparent text-cyan-600 hover:bg-cyan-50 shadow-none focus-visible:ring-cyan-500",
    sky: "bg-transparent text-sky-600 hover:bg-sky-50 shadow-none focus-visible:ring-sky-500",
    blue: "bg-transparent text-blue-600 hover:bg-blue-50 shadow-none focus-visible:ring-blue-500",
    indigo: "bg-transparent text-indigo-600 hover:bg-indigo-50 shadow-none focus-visible:ring-indigo-500",
    violet: "bg-transparent text-violet-600 hover:bg-violet-50 shadow-none focus-visible:ring-violet-500",
    purple: "bg-transparent text-purple-600 hover:bg-purple-50 shadow-none focus-visible:ring-purple-500",
    fuchsia: "bg-transparent text-fuchsia-600 hover:bg-fuchsia-50 shadow-none focus-visible:ring-fuchsia-500",
    pink: "bg-transparent text-pink-600 hover:bg-pink-50 shadow-none focus-visible:ring-pink-500",
    rose: "bg-transparent text-rose-600 hover:bg-rose-50 shadow-none focus-visible:ring-rose-500",
    primary: "bg-transparent text-primary hover:bg-primary/10 shadow-none focus-visible:ring-primary",
    secondary: "bg-transparent text-secondary-foreground/90 hover:bg-secondary-foreground/10 shadow-none focus-visible:ring-secondary-foreground",
    tertiary: "bg-transparent text-tertiary hover:bg-tertiary/10 shadow-none focus-visible:ring-tertiary",
    info: "bg-transparent text-info hover:bg-info/10 shadow-none focus-visible:ring-info",
    danger: "bg-transparent text-danger hover:bg-danger/10 shadow-none focus-visible:ring-danger",
    success: "bg-transparent text-success hover:bg-success/10 shadow-none focus-visible:ring-success",
    warning: "bg-transparent text-warning hover:bg-warning/10 shadow-none focus-visible:ring-warning"
  },
  link: {
    gray: "bg-transparent text-gray-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    red: "bg-transparent text-red-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    orange: "bg-transparent text-orange-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    amber: "bg-transparent text-amber-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    yellow: "bg-transparent text-yellow-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    lime: "bg-transparent text-lime-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    green: "bg-transparent text-green-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    emerald: "bg-transparent text-emerald-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    teal: "bg-transparent text-teal-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    cyan: "bg-transparent text-cyan-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    sky: "bg-transparent text-sky-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    blue: "bg-transparent text-blue-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    indigo: "bg-transparent text-indigo-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    violet: "bg-transparent text-violet-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    purple: "bg-transparent text-purple-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    fuchsia: "bg-transparent text-fuchsia-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    pink: "bg-transparent text-pink-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    rose: "bg-transparent text-rose-600 p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    primary: "bg-transparent text-primary p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    secondary: "bg-transparent text-secondary-foreground p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    tertiary: "bg-transparent text-tertiary p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    info: "bg-transparent text-info p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    danger: "bg-transparent text-danger p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    success: "bg-transparent text-success p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent",
    warning: "bg-transparent text-warning p-0 hover:bg-transparent underline-offset-4 hover:underline shadow-none focus-visible:ring-transparent"
  }
};

// src/components/Button/Button.tsx
import { jsx as jsx15, jsxs } from "react/jsx-runtime";
var buttonVariants = cva2(
  "inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50",
  {
    variants: {
      variant: {
        default: BUTTON_COLOR_VARIANT_MAPPING["solid"]["primary"],
        primary: BUTTON_COLOR_VARIANT_MAPPING["solid"]["primary"],
        secondary: BUTTON_COLOR_VARIANT_MAPPING["solid"]["secondary"],
        info: BUTTON_COLOR_VARIANT_MAPPING["solid"]["info"],
        success: BUTTON_COLOR_VARIANT_MAPPING["solid"]["success"],
        warning: BUTTON_COLOR_VARIANT_MAPPING["solid"]["warning"],
        danger: BUTTON_COLOR_VARIANT_MAPPING["solid"]["danger"],
        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
        ghost: "hover:bg-accent hover:text-accent-foreground"
      },
      rounded: BUTTON_ROUNDED,
      size: BUTTON_SIZE
    },
    defaultVariants: {
      rounded: "md",
      size: "md"
    }
  }
);
var Button = forwardRef15(
  ({
    as: Component = "button",
    className,
    variant = "solid",
    color,
    size,
    label,
    rounded,
    children,
    leftIcon,
    rightIcon,
    asChild = false,
    isLoading,
    loadingText,
    wrapperClassName,
    unstyled,
    disabled,
    ...props
  }, ref) => {
    const Comp = asChild ? Slot : Component;
    let buttonClassName = "";
    if (["outline", "ghost"].includes(variant) && !color) {
      buttonClassName = buttonVariants({
        variant,
        size,
        rounded
      });
    } else {
      buttonClassName = BUTTON_COLOR_VARIANT_MAPPING[variant][color || "primary"];
    }
    return /* @__PURE__ */ jsx15(
      Box,
      {
        ...props,
        as: Comp,
        className: unstyled ? className : cn13(buttonClassName, buttonVariants({ size, rounded }), className),
        ref,
        disabled: isLoading || disabled,
        children: asChild ? children : /* @__PURE__ */ jsxs(Box, { className: cn13("inline-flex flex-1 items-center justify-center gap-1.5", wrapperClassName), children: [
          !isLoading && leftIcon,
          isLoading && /* @__PURE__ */ jsx15(ArrowPathIcon, { className: cn13("size-4 animate-spin", size && LOADING_ICON_SIZE[size]) }),
          isLoading && loadingText ? loadingText : label || children,
          !isLoading && rightIcon
        ] })
      }
    );
  }
);
Button.displayName = "Button";

// src/components/Calendar/Calendar.tsx
import { ChevronLeftIcon, ChevronRightIcon } from "@paalan/react-icons";
import { cn as cn14 } from "@paalan/react-shared/lib";
import { DayPicker } from "react-day-picker";
import { jsx as jsx16 } from "react/jsx-runtime";
var Calendar = ({ className, classNames, showOutsideDays = true, components, ...props }) => {
  return /* @__PURE__ */ jsx16(
    DayPicker,
    {
      showOutsideDays,
      className: cn14("p-3", className),
      classNames: {
        months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
        month: "space-y-4",
        caption: "flex justify-center pt-1 relative items-center",
        caption_label: "text-sm font-medium",
        nav: "space-x-1 flex items-center",
        nav_button: cn14(
          buttonVariants({ variant: "outline" }),
          "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
        ),
        nav_button_previous: "absolute left-1",
        nav_button_next: "absolute right-1",
        table: "w-full border-collapse space-y-1",
        head_row: "flex",
        head_cell: "text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]",
        row: "flex w-full mt-2",
        cell: cn14(
          "relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent",
          props.mode === "range" ? "[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md" : "[&:has([aria-selected])]:rounded-md"
        ),
        day: cn14(buttonVariants({ variant: "ghost" }), "h-8 w-8 p-0 font-normal aria-selected:opacity-100"),
        day_range_start: "day-range-start",
        day_range_end: "day-range-end",
        day_selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",
        day_today: "bg-accent text-accent-foreground",
        day_outside: "text-muted-foreground opacity-50",
        day_disabled: "text-muted-foreground opacity-50",
        day_range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
        day_hidden: "invisible",
        ...classNames
      },
      components: {
        IconLeft: () => /* @__PURE__ */ jsx16(ChevronLeftIcon, { className: "size-4" }),
        IconRight: () => /* @__PURE__ */ jsx16(ChevronRightIcon, { className: "size-4" }),
        ...components
      },
      ...props
    }
  );
};
Calendar.displayName = "Calendar";

// src/components/ErrorMessage/ErrorMessage.tsx
import { cn as cn15 } from "@paalan/react-shared/lib";
import { jsx as jsx17 } from "react/jsx-runtime";
var ErrorMessage = ({ message, className, label, ...props }) => {
  const errorMessage = message || (label ? `${label} is required` : "");
  if (!errorMessage) return null;
  return /* @__PURE__ */ jsx17(Text, { className: cn15("mt-2 text-sm text-danger", className), ...props, children: errorMessage });
};

// src/components/Label/Label.tsx
import * as React2 from "react";
import { InfoOutlineIcon } from "@paalan/react-icons";
import { cn as cn17 } from "@paalan/react-shared/lib";
import * as LabelPrimitive from "@radix-ui/react-label";
import { cva as cva3 } from "class-variance-authority";

// src/components/Tooltip/Tooltip.tsx
import * as React from "react";
import { useControllableState } from "@paalan/react-hooks";
import { cn as cn16 } from "@paalan/react-shared/lib";
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
import { jsx as jsx18, jsxs as jsxs2 } from "react/jsx-runtime";
var TooltipProvider = TooltipPrimitive.Provider;
var TooltipRoot = TooltipPrimitive.Root;
var TooltipTrigger = TooltipPrimitive.Trigger;
var TooltipPortal = TooltipPrimitive.Portal;
var TooltipContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx18(
  TooltipPrimitive.Content,
  {
    ref,
    sideOffset,
    className: cn16(
      "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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
  }
));
TooltipContent.displayName = TooltipPrimitive.Content.displayName;
var Tooltip = React.forwardRef(
  ({
    className,
    trigger,
    asPortal,
    content,
    side = "top",
    align = "center",
    defaultOpen,
    open,
    onOpenChange,
    ...props
  }, ref) => {
    const TooltipPortalComponent = asPortal ? TooltipPortal : React.Fragment;
    const [localOpen, setLocalOpen] = useControllableState({
      defaultValue: defaultOpen,
      value: open,
      onChange: onOpenChange
    });
    return /* @__PURE__ */ jsx18(TooltipProvider, { delayDuration: 100, children: /* @__PURE__ */ jsxs2(TooltipRoot, { open: localOpen, onOpenChange: setLocalOpen, children: [
      /* @__PURE__ */ jsx18(TooltipTrigger, { asChild: true, children: trigger }),
      /* @__PURE__ */ jsx18(TooltipPortalComponent, { children: /* @__PURE__ */ jsxs2(
        TooltipContent,
        {
          ref,
          className: cn16("bg-secondary fill-secondary text-secondary-foreground", className),
          side,
          align,
          ...props,
          children: [
            content,
            /* @__PURE__ */ jsx18(TooltipPrimitive.Arrow, { width: 11, height: 5 })
          ]
        }
      ) })
    ] }) });
  }
);

// src/components/Label/Label.tsx
import { jsx as jsx19, jsxs as jsxs3 } from "react/jsx-runtime";
var labelVariants = cva3("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
var Label = React2.forwardRef(
  ({ className, required = false, labelDescription, text, isInvalid, children, disabled, ...props }, ref) => /* @__PURE__ */ jsxs3(
    LabelPrimitive.Root,
    {
      ref,
      className: cn17(labelVariants(), { "text-danger": isInvalid, "opacity-70": disabled }, className),
      ...props,
      children: [
        text || children,
        required && /* @__PURE__ */ jsx19("span", { className: "text-danger/70", children: "*" }),
        labelDescription && /* @__PURE__ */ jsx19(
          Tooltip,
          {
            trigger: /* @__PURE__ */ jsx19(InfoOutlineIcon, { className: "ml-1 text-muted-foreground", "aria-hidden": "true" }),
            content: labelDescription
          }
        )
      ]
    }
  )
);
Label.displayName = LabelPrimitive.Root.displayName;

// src/components/Popover/Popover.tsx
import * as React3 from "react";
import { cn as cn18 } from "@paalan/react-shared/lib";
import * as PopoverPrimitive from "@radix-ui/react-popover";
import { jsx as jsx20, jsxs as jsxs4 } from "react/jsx-runtime";
var PopoverRoot = PopoverPrimitive.Root;
var PopoverTrigger = PopoverPrimitive.Trigger;
var PopoverContent = React3.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx20(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx20(
  PopoverPrimitive.Content,
  {
    ref,
    align,
    sideOffset,
    className: cn18(
      "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__ */ jsxs4(PopoverRoot, { ...props, children: [
    trigger && /* @__PURE__ */ jsx20(PopoverTrigger, { asChild: true, className: triggerClassName, children: trigger }),
    content && /* @__PURE__ */ jsx20(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 cn22 } from "@paalan/react-shared/lib";

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

// src/components/Dialog/Dialog.tsx
import * as React4 from "react";
import { Cross2Icon } from "@paalan/react-icons";
import { cn as cn19 } from "@paalan/react-shared/lib";
import * as DialogPrimitive from "@radix-ui/react-dialog";
import { jsx as jsx21, jsxs as jsxs5 } from "react/jsx-runtime";
var DialogRoot = DialogPrimitive.Root;
var DialogTrigger = DialogPrimitive.Trigger;
var DialogPortal = ({ ...props }) => /* @__PURE__ */ jsx21(DialogPrimitive.Portal, { ...props });
DialogPortal.displayName = DialogPrimitive.Portal.displayName;
var DialogOverlay = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
  DialogPrimitive.Overlay,
  {
    ref,
    className: cn19(
      "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 = React4.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs5(DialogPortal, { children: [
  /* @__PURE__ */ jsx21(DialogOverlay, {}),
  /* @__PURE__ */ jsxs5(
    DialogPrimitive.Content,
    {
      ref,
      className: cn19(
        "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__ */ jsxs5(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__ */ jsx21(Cross2Icon, { className: "size-4" }),
          /* @__PURE__ */ jsx21("span", { className: "sr-only", children: "Close" })
        ] })
      ]
    }
  )
] }));
DialogContent.displayName = DialogPrimitive.Content.displayName;
var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx21("div", { className: cn19("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
DialogHeader.displayName = "DialogHeader";
var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx21("div", { className: cn19("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className), ...props });
DialogFooter.displayName = "DialogFooter";
var DialogTitle = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(
  DialogPrimitive.Title,
  {
    ref,
    className: cn19("text-lg font-semibold leading-none tracking-tight", className),
    ...props
  }
));
DialogTitle.displayName = DialogPrimitive.Title.displayName;
var DialogDescription = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx21(DialogPrimitive.Description, { ref, className: cn19("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__ */ jsxs5(DialogRoot, { ...props, children: [
    trigger && /* @__PURE__ */ jsx21(DialogTrigger, { asChild: true, className: triggerClassName, children: trigger }),
    /* @__PURE__ */ jsxs5(DialogContent, { className: cn19(contentClassName), children: [
      header && /* @__PURE__ */ jsxs5(DialogHeader, { className: header.className, children: [
        header.title && /* @__PURE__ */ jsx21(DialogTitle, { children: header.title }),
        /* @__PURE__ */ jsx21(DialogDescription, { children: header.description })
      ] }),
      dialogContent,
      footer && /* @__PURE__ */ jsx21(DialogFooter, { className: footer.className, children: footer.content })
    ] })
  ] });
};
Dialog.displayName = "Dialog";

// src/components/Command/Command.tsx
import { jsx as jsx22, jsxs as jsxs6 } from "react/jsx-runtime";
var CommandModal = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
  CommandPrimitive,
  {
    ref,
    className: cn20(
      "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__ */ jsx22(DialogRoot, { ...props, children: /* @__PURE__ */ jsx22(DialogContent, { className: "overflow-hidden p-0", children: /* @__PURE__ */ jsx22(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 = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs6("div", { className: "flex items-center border-b px-3", "data-cmdk-input-wrapper": "", children: [
  /* @__PURE__ */ jsx22(MagnifyingGlassIcon, { className: "mr-2 size-4 shrink-0 opacity-50" }),
  /* @__PURE__ */ jsx22(
    CommandPrimitive.Input,
    {
      ref,
      className: cn20(
        "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 = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
  CommandPrimitive.List,
  {
    ref,
    className: cn20("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
    ...props
  }
));
CommandList.displayName = CommandPrimitive.List.displayName;
var CommandEmpty = React5.forwardRef((props, ref) => /* @__PURE__ */ jsx22(CommandPrimitive.Empty, { ref, className: "py-6 text-center text-sm", ...props }));
CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
var CommandGroup = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
  CommandPrimitive.Group,
  {
    ref,
    className: cn20(
      "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 = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(CommandPrimitive.Separator, { ref, className: cn20("-mx-1 h-px bg-border", className), ...props }));
CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
var CommandLoading = React5.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx22(CommandPrimitive.Loading, { ref, ...props }));
CommandLoading.displayName = CommandPrimitive.Loading.displayName;
var CommandItem = React5.forwardRef(({ className, onSelect, ...props }, ref) => {
  return /* @__PURE__ */ jsx22(
    CommandPrimitive.Item,
    {
      ref,
      ...props,
      className: cn20(
        "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__ */ jsx22("span", { className: cn20("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__ */ jsxs6(CommandDialog, { ...props, children: [
    /* @__PURE__ */ jsx22(CommandInput, { placeholder: "Search...", ...inputOptions }),
    /* @__PURE__ */ jsxs6(CommandList, { children: [
      /* @__PURE__ */ jsx22(CommandEmpty, { children: emptyResultContent }),
      groups.map(({ items, ...group }, index) => /* @__PURE__ */ jsxs6(React5.Fragment, { children: [
        /* @__PURE__ */ jsx22(CommandGroup, { ...group, children: items.map(({ icon, label, shortcut, ...item }) => /* @__PURE__ */ jsxs6(CommandItem, { ...item, id: `${group.heading} - ${label}`, children: [
          icon && /* @__PURE__ */ jsx22(Text, { as: "span", className: "mr-2", children: icon }),
          /* @__PURE__ */ jsx22(Text, { as: "span", className: "text-sm", children: label }),
          shortcut && /* @__PURE__ */ jsx22(CommandShortcut, { children: shortcut })
        ] }, label)) }),
        index !== groups.length && /* @__PURE__ */ jsx22(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__ */ jsx22(Box, { className: "py-6 text-center text-sm", children: initialSearchContent }) : initialSearchContent;
  }
  if (emptyOptionContent) return emptyOptionContent;
  return /* @__PURE__ */ jsxs6(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 cn21 } from "@paalan/react-shared/lib";
import { jsx as jsx23, jsxs as jsxs7 } from "react/jsx-runtime";
var Loading = ({ className, spin = true, content, parentClassName, ...props }) => {
  return /* @__PURE__ */ jsxs7(Flex, { className: cn21("inline-flex items-center gap-2 text-gray-800 dark:text-gray-200", parentClassName), children: [
    /* @__PURE__ */ jsx23(
      LoadingIcon,
      {
        ...props,
        className: cn21(
          "text-gray-500 dark:text-gray-50",
          {
            "animate-spin": !!spin
          },
          className
        )
      }
    ),
    content
  ] });
};

// src/components/Popover/components/PopoverModalContent.tsx
import { jsx as jsx24, jsxs as jsxs8 } 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__ */ jsxs8(CommandModal, { className: commandClassName, shouldFilter: false, loop: true, children: [
    /* @__PURE__ */ jsx24(
      CommandInput,
      {
        placeholder: searchPlaceholder,
        className: cn22("border-transparent focus:border-transparent focus:ring-0", commandInputClassName),
        value: searchValue,
        onValueChange: handleSearchValueChange
      }
    ),
    !isLoading && /* @__PURE__ */ jsx24(
      CommandNoResultFound,
      {
        emptyOptionMessage,
        emptyOptionContent,
        optionsLength: sortedOptions.length,
        searchValue: searchValueProp ?? searchValue,
        initialSearchContent
      }
    ),
    /* @__PURE__ */ jsx24(CommandGroup, { className: cn22("max-h-64 overflow-auto", commandGroupClassName), children: isLoading ? /* @__PURE__ */ jsx24(CommandLoading, { children: /* @__PURE__ */ jsx24(Box, { className: "p-3 text-center", children: /* @__PURE__ */ jsx24(Loading, { boxSize: "5", content: loadingText }) }) }) : sortedOptions.map((option) => /* @__PURE__ */ jsxs8(
      CommandItem,
      {
        value: option.value,
        className: cn22("flex cursor-pointer", commandItemClassName, option.className),
        disabled: option.disabled,
        onSelect: (currentValue) => {
          onValueChange?.(currentValue === value ? "" : currentValue);
        },
        children: [
          isMulti && /* @__PURE__ */ jsx24(CheckIcon, { className: cn22("mr-2 h-4 w-4", checkIconClassNameFn(option.value)) }),
          option.labelContent || option.label,
          !isMulti && /* @__PURE__ */ jsx24(
            CheckIcon,
            {
              className: cn22(
                "ml-auto h-4 w-4",
                value === option.value ? "opacity-100" : "opacity-0",
                checkIconClassNameFn(option.value)
              )
            }
          )
        ]
      },
      option.key || option.value
    )) })
  ] });
};
PopoverModalContent.displayName = "PopoverModalContent";

// src/components/DateRangePicker/DateRangePicker.tsx
import { Fragment as Fragment4, jsx as jsx25, jsxs as jsxs9 } from "react/jsx-runtime";
var DateRangePicker = React6.forwardRef(
  ({
    dateRange: range,
    onDateRangeChange: onRangeChange,
    label,
    placeholder = "Pick a date",
    numberOfMonths = 2,
    dateFormat = "MMM dd, yyyy",
    className,
    parentClassName,
    isInvalid: invalid,
    required,
    id,
    errorMessage,
    disabled,
    ...props
  }, ref) => {
    const isInvalid = isAriaInvalid(props["aria-invalid"]) || invalid;
    const labelId = id || label?.toLowerCase().replace(/\s/g, "-");
    const [date, setDate] = React6.useState(void 0);
    React6.useEffect(() => {
      setDate(range);
    }, [range]);
    const onSelect = React6.useCallback(
      (range2) => {
        setDate(range2);
        onRangeChange?.(range2);
      },
      [onRangeChange]
    );
    return /* @__PURE__ */ jsxs9(Fragment4, { children: [
      /* @__PURE__ */ jsxs9(Box, { className: cn23("flex flex-col gap-2", parentClassName), children: [
        label && /* @__PURE__ */ jsx25(Label, { htmlFor: labelId, required, isInvalid, children: label }),
        /* @__PURE__ */ jsx25(Box, { className: cn23("grid gap-2", className), children: /* @__PURE__ */ jsxs9(PopoverRoot, { children: [
          /* @__PURE__ */ jsx25(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs9(
            Button,
            {
              ...props,
              disabled,
              type: "button",
              variant: "outline",
              className: cn23("min-w-[300px] justify-start text-left font-normal", {
                "text-muted-foreground": !date,
                "border-danger text-danger hover:bg-background hover:text-danger focus:ring-danger/40": isInvalid
              }),
              wrapperClassName: "justify-start",
              ref,
              id: labelId,
              children: [
                /* @__PURE__ */ jsx25(CalendarIcon, { className: "mr-2 size-4" }),
                date?.from ? date.to ? /* @__PURE__ */ jsxs9(Fragment4, { children: [
                  format(date.from, dateFormat),
                  " - ",
                  format(date.to, dateFormat)
                ] }) : format(date.from, dateFormat) : /* @__PURE__ */ jsx25(Box, { as: "span", children: placeholder }),
                !!(date?.from || date?.to) && /* @__PURE__ */ jsx25(
                  XCircleIcon,
                  {
                    onClick: (e) => {
                      e.stopPropagation();
                      onSelect(void 0);
                    },
                    title: "Clear date range",
                    className: cn23("ml-auto h-5 w-5 text-muted-foreground", {
                      "text-danger": isInvalid
                    })
                  }
                )
              ]
            }
          ) }),
          /* @__PURE__ */ jsx25(PopoverContent, { className: "w-auto min-w-fit p-0", align: "start", children: /* @__PURE__ */ jsx25(
            Calendar,
            {
              mode: "range",
              defaultMonth: date?.from,
              selected: date,
              onSelect,
              numberOfMonths,
              initialFocus: true
            }
          ) })
        ] }) })
      ] }),
      isInvalid && /* @__PURE__ */ jsx25(ErrorMessage, { message: errorMessage })
    ] });
  }
);
export {
  DateRangePicker
};
