pf-common-components 1.0.0

package/dist/ui/avatar.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
+declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export { Avatar, AvatarImage, AvatarFallback };

package/dist/ui/avatar.js

@@ -0,0 +1,32 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+import { cn } from "../lib/utils";
+const Avatar = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(AvatarPrimitive.Root, Object.assign({ ref: ref, className: cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className) }, props)));
+});
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+const AvatarImage = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(AvatarPrimitive.Image, Object.assign({ ref: ref, className: cn("aspect-square h-full w-full", className) }, props)));
+});
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+const AvatarFallback = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(AvatarPrimitive.Fallback, Object.assign({ ref: ref, className: cn("flex h-full w-full items-center justify-center rounded-full bg-muted", className) }, props)));
+});
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+export { Avatar, AvatarImage, AvatarFallback };

package/dist/ui/badge.d.ts

@@ -0,0 +1,10 @@
+import { type VariantProps } from "class-variance-authority";
+import * as React from "react";
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "primary" | "secondary" | "disable" | "success" | "danger" | "warning" | "outline" | "destructive" | "pending" | "border-primary" | "border-success" | "border-danger" | "border-warning" | "border-pending" | "border-disable" | "secondary-primary" | "secondary-success" | "secondary-danger" | "secondary-warning" | "secondary-pending" | "secondary-disable" | null | undefined;
+    size?: "default" | "sm" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
+}
+declare function Badge({ className, variant, size, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export { Badge, badgeVariants };

package/dist/ui/badge.js

@@ -0,0 +1,58 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/utils";
+const badgeVariants = cva("inline-flex items-center justify-center gap-[5px] whitespace-nowrap max-w-fit ", {
+    variants: {
+        variant: {
+            primary: "bg-primary-light text-primary",
+            success: "bg-green-light text-green",
+            danger: "bg-red-light text-red",
+            warning: "bg-yellow-light text-yellow",
+            pending: "bg-orange-light text-orange",
+            disable: "bg-grey2-light text-grey2",
+            "border-primary": "bg-primary-light border border-primary text-primary",
+            "border-success": "bg-green-light border border-green text-green",
+            "border-danger": "bg-red-light border border-red text-red",
+            "border-warning": "bg-yellow-light border border-yellow text-yellow",
+            "border-pending": "bg-orange-light border border-orange text-orange",
+            "border-disable": "bg-grey2-light border border-grey2 text-grey2",
+            "secondary-primary": "bg-white text-primary",
+            "secondary-success": "bg-white text-green",
+            "secondary-danger": "bg-white text-red",
+            "secondary-warning": "bg-white text-yellow",
+            "secondary-pending": "bg-white text-orange",
+            "secondary-disable": "bg-white text-grey2",
+            //TODO: Remove bellow styles after new design is implemented
+            default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+            secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+            outline: "text-foreground",
+        },
+        size: {
+            default: "h-6 px-2 py-2 rounded-full text-sm font-semibold",
+            sm: "h-7 px-3 py-2 rounded-full text-sm font-medium",
+            lg: "h-8 px-3 py-2 rounded-full text-sm font-medium",
+            xl: "h-9 px-3 py-2 rounded-full text-sm font-medium",
+        },
+    },
+    defaultVariants: {
+        variant: "primary",
+        size: "default",
+    },
+});
+function Badge(_a) {
+    var { className, variant, size } = _a, props = __rest(_a, ["className", "variant", "size"]);
+    return (_jsx("div", Object.assign({ className: cn(badgeVariants({ variant, size }), className) }, props)));
+}
+export { Badge, badgeVariants };

package/dist/ui/button.d.ts

@@ -0,0 +1,12 @@
+import { type VariantProps } from "class-variance-authority";
+import * as React from "react";
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "link" | "primary" | "secondary" | "disable" | "success" | "danger" | "warning" | "outline" | "ghost" | "plain" | null | undefined;
+    size?: "default" | "sm" | "lg" | "xl" | "xs" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+    isLoading?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };

package/dist/ui/button.js

@@ -0,0 +1,54 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import * as React from "react";
+import { cn } from "../lib/utils";
+const buttonVariants = cva("inline-flex items-center justify-center gap-1 whitespace-nowrap  cursor-pointer disabled:cursor-not-allowed focus:outline-keyboardTab", {
+    variants: {
+        variant: {
+            primary: "bg-primary text-white",
+            secondary: "bg-white border border-primary text-primary ",
+            disable: "bg-grey2 text-white",
+            success: "bg-green text-white",
+            danger: "bg-red text-white",
+            warning: "bg-yellow text-white",
+            link: "bg-white text-primary",
+            // TODO: need to remove after implementing the new design
+            default: "bg-primary text-primary-foreground ",
+            outline: "border border-input bg-white ",
+            ghost: "hover:bg-accent hover:text-accent-foreground",
+            plain: "!px-0 !py-1 text-primary",
+        },
+        size: {
+            default: "h-10 px-6 py-3 rounded-xl text-base font-medium",
+            sm: "h-9 px-6 py-2 rounded-xl text-base font-medium",
+            lg: "h-11 px-6 py-3 rounded-xl text-base font-medium",
+            xl: "h-12 px-6 py-3 rounded-xl text-base font-medium",
+            xs: "px-2 py-2 rounded-xl text-base font-medium",
+        },
+    },
+    defaultVariants: {
+        variant: "primary",
+        size: "default",
+    },
+});
+const Button = React.forwardRef((_a, ref) => {
+    var { className, variant, size, asChild = false, isLoading = false, type = "button", // Default type set to "button"
+    children } = _a, props = __rest(_a, ["className", "variant", "size", "asChild", "isLoading", "type", "children"]);
+    const Comp = asChild ? Slot : "button";
+    return (_jsx(Comp, Object.assign({ className: cn(buttonVariants({ variant, size, className }), isLoading && "opacity-50"), ref: ref, disabled: isLoading || props.disabled, type: type }, props, { children: isLoading ? (_jsx("div", Object.assign({ className: "loader-small" }, { children: _jsx("div", { className: "loader" }) }))) : (children) })));
+});
+Button.displayName = "Button";
+Button.displayName = "Button";
+export { Button, buttonVariants };

package/dist/ui/calendar.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { DayPicker } from "react-day-picker";
+export type CalendarProps = React.ComponentProps<typeof DayPicker>;
+declare function Calendar({ className, classNames, showOutsideDays, ...props }: CalendarProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Calendar {
+    var displayName: string;
+}
+export { Calendar };

package/dist/ui/calendar.js

@@ -0,0 +1,45 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronLeft, ChevronRight } from "lucide-react";
+import { DayPicker } from "react-day-picker";
+import { cn } from "../lib/utils";
+import { buttonVariants } from "./button";
+import dayjs from "dayjs";
+function Calendar(_a) {
+    var { className, classNames, showOutsideDays = true } = _a, props = __rest(_a, ["className", "classNames", "showOutsideDays"]);
+    return (_jsx(DayPicker, Object.assign({ weekStartsOn: 1, formatters: {
+            formatWeekdayName: (date, options) => {
+                return dayjs(date).format("ddd");
+            },
+        }, showOutsideDays: showOutsideDays, className: cn("p-3", className), classNames: Object.assign({ 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: cn(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 capitalize w-full text-sm", head_cell: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]", row: "flex w-full mt-2", cell: "h-9 w-9 text-center text-sm !rounded-full p-0 relative [&:has([aria-selected].day-range-end)]:rounded-r-md [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20", day: cn(buttonVariants({ variant: "ghost" }), "h-9 w-9 p-0 font-normal aria-selected:opacity-100 text-[13px] !rounded-full"), 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: "day-outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30", 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: (_a) => {
+                var props = __rest(_a, []);
+                return _jsx(ChevronLeft, { className: "h-4 w-4" });
+            },
+            IconRight: (_a) => {
+                var props = __rest(_a, []);
+                return _jsx(ChevronRight, { className: "h-4 w-4" });
+            },
+            CaptionLabel: (_a) => {
+                var props = __rest(_a, []);
+                // Extract the month from the props
+                const { displayMonth } = props;
+                const month = dayjs(displayMonth).format("MMMM");
+                const year = displayMonth.getFullYear();
+                return (_jsxs("div", Object.assign({ className: "flex flex-col items-center gap-1 font-semibold" }, { children: [_jsx("div", Object.assign({ className: "text-[16px] capitalize" }, { children: month })), _jsx("div", Object.assign({ className: "text-[12px] text-[#999999]" }, { children: year }))] })));
+            },
+        } }, props)));
+}
+Calendar.displayName = "Calendar";
+export { Calendar };

package/dist/ui/card.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent, };

package/dist/ui/card.js

@@ -0,0 +1,45 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/utils";
+const Card = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("div", Object.assign({ ref: ref, className: cn("rounded-lg bg-white shadow-sm", className) }, props)));
+});
+Card.displayName = "Card";
+const CardHeader = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("div", Object.assign({ ref: ref, className: cn("flex flex-col space-y-2 p-6", className) }, props)));
+});
+CardHeader.displayName = "CardHeader";
+const CardTitle = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("h3", Object.assign({ ref: ref, className: cn("text-2xl font-semibold leading-none tracking-tight text-grey2-dark-active", className) }, props)));
+});
+CardTitle.displayName = "CardTitle";
+const CardDescription = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("p", Object.assign({ ref: ref, className: cn("text-sm text-muted-foreground", className) }, props)));
+});
+CardDescription.displayName = "CardDescription";
+const CardContent = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("div", Object.assign({ ref: ref, className: cn("p-6 pt-0", className) }, props)));
+});
+CardContent.displayName = "CardContent";
+const CardFooter = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("div", Object.assign({ ref: ref, className: cn("flex items-center p-6 pt-0", className) }, props)));
+});
+CardFooter.displayName = "CardFooter";
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent, };

package/dist/ui/checkbox.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { type VariantProps } from "class-variance-authority";
+declare const checkboxVariants: (props?: ({
+    size?: "sm" | "lg" | "xl" | "md" | "xxl" | null | undefined;
+    error?: boolean | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, VariantProps<typeof checkboxVariants> {
+    asChild?: boolean;
+}
+declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
+export { Checkbox, checkboxVariants };

package/dist/ui/checkbox.js

@@ -0,0 +1,44 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { Check } from "lucide-react";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/utils";
+// Define variants using CVA
+const checkboxVariants = cva("m-1 flex items-center justify-center peer shrink-0 rounded-lg border focus:outline-keyboardTab leading-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-white data-[state=checked]:border-transparent data-[state=unchecked]:border-gray-hover box-border", {
+    variants: {
+        size: {
+            sm: "h-4 w-4",
+            md: "h-5 w-5",
+            lg: "h-6 w-6",
+            xl: "h-7 w-7",
+            xxl: "h-8 w-8",
+        },
+        error: {
+            true: "border-red",
+            false: "border-gray-hover",
+        },
+    },
+    defaultVariants: {
+        size: "lg",
+        error: false,
+    },
+});
+const Checkbox = React.forwardRef((_a, ref) => {
+    var { className, size, error } = _a, props = __rest(_a, ["className", "size", "error"]);
+    return (_jsx(CheckboxPrimitive.Root, Object.assign({ ref: ref, className: cn(checkboxVariants({ size, error: !!error }), className) }, props, { children: _jsx(CheckboxPrimitive.Indicator, Object.assign({ className: "flex items-center justify-center text-current" }, { children: _jsx(Check, { className: "h-[80%] w-[80%] transition-transform duration-150" }) })) })));
+});
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+export { Checkbox, checkboxVariants };

package/dist/ui/command.d.ts

@@ -0,0 +1,47 @@
+import * as React from "react";
+import { type DialogProps } from "@radix-ui/react-dialog";
+declare const Command: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & React.HTMLAttributes<HTMLDivElement> & {
+    label?: string | undefined;
+    shouldFilter?: boolean | undefined;
+    filter?: ((value: string, search: string) => number) | undefined;
+    defaultValue?: string | undefined;
+    value?: string | undefined;
+    onValueChange?: ((value: string) => void) | undefined;
+    loop?: boolean | undefined;
+    vimBindings?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+interface CommandDialogProps extends DialogProps {
+}
+declare const CommandDialog: ({ children, ...props }: CommandDialogProps) => import("react/jsx-runtime").JSX.Element;
+declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+declare const CommandList: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "heading" | "value"> & {
+    heading?: React.ReactNode;
+    value?: string | undefined;
+    forceMount?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement> & {
+    alwaysRender?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect" | "disabled" | "value"> & {
+    disabled?: boolean | undefined;
+    onSelect?: ((value: string) => void) | undefined;
+    value?: string | undefined;
+    forceMount?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };

package/dist/ui/command.js

@@ -0,0 +1,67 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Command as CommandPrimitive, useCommandState } from "cmdk";
+import { Search } from "lucide-react";
+import { cn } from "../lib/utils";
+import { Dialog, DialogContent } from "./dialog";
+import { Input } from "./input";
+const Command = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(CommandPrimitive, Object.assign({ ref: ref, className: cn("flex h-full w-full flex-col overflow-hidden rounded-xl bg-popover text-popover-foreground", className) }, props)));
+});
+Command.displayName = CommandPrimitive.displayName;
+const CommandDialog = (_a) => {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    return (_jsx(Dialog, Object.assign({}, props, { children: _jsx(DialogContent, Object.assign({ className: "overflow-hidden p-0 shadow-lg" }, { children: _jsx(Command, Object.assign({ 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]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5" }, { children: children })) })) })));
+};
+const CommandInput = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsxs("div", Object.assign({ className: "flex items-center border-none px-3", "cmdk-input-wrapper": "" }, { children: [_jsx(Input, Object.assign({ ref: ref, className: cn("flex h-11 w-full rounded-md bg-transparent px-2 py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50", className) }, props)), _jsx(Search, { className: "mr-2 h-4 w-4 shrink-0 text-primary" })] })));
+});
+CommandInput.displayName = CommandPrimitive.Input.displayName;
+const CommandList = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(CommandPrimitive.List, Object.assign({ ref: ref, className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className) }, props)));
+});
+CommandList.displayName = CommandPrimitive.List.displayName;
+const CommandEmpty = React.forwardRef((_a, forwardedRef) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    const render = useCommandState((state) => state.filtered.count === 0);
+    if (!render)
+        return null;
+    return (_jsx("div", Object.assign({ ref: forwardedRef, className: cn("py-6 text-center text-sm", className), "cmdk-empty": "", role: "presentation" }, props)));
+});
+CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
+const CommandGroup = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(CommandPrimitive.Group, Object.assign({ ref: ref, className: cn("overflow-hidden 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;
+const CommandSeparator = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(CommandPrimitive.Separator, Object.assign({ ref: ref, className: cn("-mx-1 h-px bg-border", className) }, props)));
+});
+CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
+const CommandItem = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(CommandPrimitive.Item, Object.assign({ ref: ref, className: cn("relative flex min-h-[44px] cursor-default select-none items-center px-5 py-1.5 text-sm font-semibold text-[#414141] outline-none hover:bg-[#7677F4]/10 aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[selected=true]:bg-accent data-[disabled]:opacity-50", className) }, props)));
+});
+CommandItem.displayName = CommandPrimitive.Item.displayName;
+const CommandShortcut = (_a) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("span", Object.assign({ className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className) }, props)));
+};
+CommandShortcut.displayName = "CommandShortcut";
+export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };

package/dist/ui/dialog.d.ts

@@ -0,0 +1,31 @@
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import * as React from "react";
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Note: if content is overflowing the container, use max-h-[75vh] and overflow-y-scroll. in the main container inside DialogContent
+ */
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    /**
+     * flag whether to display close icon or not
+     */
+    closeIcon?: boolean | undefined;
+    /**
+     * Function to be passed when we click on close icon in dialog
+     */
+    handleClickCloseButton?: (() => void) | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DialogHeader: {
+    ({ className, children, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };

package/dist/ui/dialog.js

@@ -0,0 +1,57 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { X } from "lucide-react";
+import * as React from "react";
+import { cn } from "../lib/utils";
+const Dialog = DialogPrimitive.Root;
+const DialogTrigger = DialogPrimitive.Trigger;
+const DialogPortal = DialogPrimitive.Portal;
+const DialogClose = DialogPrimitive.Close;
+const DialogOverlay = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(DialogPrimitive.Overlay, Object.assign({ ref: ref, className: cn("fixed inset-0 z-50 bg-black/20 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;
+/**
+ * Note: if content is overflowing the container, use max-h-[75vh] and overflow-y-scroll. in the main container inside DialogContent
+ */
+const DialogContent = React.forwardRef((_a, ref) => {
+    var { className, children, closeIcon = true, handleClickCloseButton = () => { } } = _a, props = __rest(_a, ["className", "children", "closeIcon", "handleClickCloseButton"]);
+    return (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, Object.assign({ ref: ref, className: cn("fixed left-[50%] top-[50%] z-50 max-h-[95vh] max-w-[95Vw] translate-x-[-50%] translate-y-[-50%] rounded-3xl bg-white p-6 shadow-sm duration-200 focus: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-[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%]", className) }, props, { children: [children, closeIcon && (_jsxs(DialogPrimitive.Close, Object.assign({ onClick: () => {
+                            handleClickCloseButton();
+                        }, 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: [_jsx(X, { className: "mt-1 h-6 w-6" }), _jsx("span", Object.assign({ className: "sr-only" }, { children: "Close" }))] })))] }))] }));
+});
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+const DialogHeader = (_a) => {
+    var { className, children } = _a, props = __rest(_a, ["className", "children"]);
+    return (_jsx("div", Object.assign({ className: cn("sticky top-0 mt-0 flex justify-center pb-2", className) }, props, { children: children })));
+};
+DialogHeader.displayName = "DialogHeader";
+const DialogFooter = (_a) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx("div", Object.assign({ className: cn("mb-1 flex flex-col-reverse justify-center sm:flex-row sm:space-x-2", className) }, props)));
+};
+DialogFooter.displayName = "DialogFooter";
+const DialogTitle = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(DialogPrimitive.Title, Object.assign({ ref: ref, className: cn("text-lg font-semibold leading-none tracking-tight", className) }, props)));
+});
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+const DialogDescription = React.forwardRef((_a, ref) => {
+    var { className } = _a, props = __rest(_a, ["className"]);
+    return (_jsx(DialogPrimitive.Description, Object.assign({ ref: ref, className: cn("my-2 text-sm text-muted-foreground", className) }, props)));
+});
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };

package/dist/ui/dropdown-menu.d.ts

@@ -0,0 +1,27 @@
+import * as React from "react";
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, };