@realtimex/email-automator 2.2.0 → 2.3.0

package/src/components/ui/button.tsx

@@ -1,57 +0,0 @@
-import * as React from "react"
-import { Slot } from "@radix-ui/react-slot"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "../../lib/utils"
-
-const buttonVariants = cva(
-    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-[color,box-shadow] disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 focus-visible:ring-4 focus-visible:outline-1 aria-invalid:focus-visible:ring-0",
-    {
-        variants: {
-            variant: {
-                default:
-                    "bg-primary text-primary-foreground shadow-sm hover:bg-primary/90",
-                destructive:
-                    "bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90",
-                outline:
-                    "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
-                secondary:
-                    "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
-                ghost: "hover:bg-accent hover:text-accent-foreground",
-                link: "text-primary underline-offset-4 hover:underline",
-            },
-            size: {
-                default: "h-9 px-4 py-2",
-                sm: "h-8 rounded-md px-3 text-xs",
-                lg: "h-10 rounded-md px-8",
-                icon: "h-9 w-9",
-            },
-        },
-        defaultVariants: {
-            variant: "default",
-            size: "default",
-        },
-    }
-)
-
-export interface ButtonProps
-    extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof buttonVariants> {
-    asChild?: boolean
-}
-
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-    ({ className, variant, size, asChild = false, ...props }, ref) => {
-        const Comp = asChild ? Slot : "button"
-        return (
-            <Comp
-                className={cn(buttonVariants({ variant, size, className }))}
-                ref={ref}
-                {...props}
-            />
-        )
-    }
-)
-Button.displayName = "Button"
-
-export { Button, buttonVariants }

package/src/components/ui/card.tsx

@@ -1,75 +0,0 @@
-import * as React from "react"
-import { cn } from "../../lib/utils"
-
-const Card = React.forwardRef<
-    HTMLDivElement,
-    React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-    <div
-        ref={ref}
-        className={cn(
-            "rounded-xl border bg-card text-card-foreground shadow",
-            className
-        )}
-        {...props}
-    />
-))
-Card.displayName = "Card"
-
-const CardHeader = React.forwardRef<
-    HTMLDivElement,
-    React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-    <div
-        ref={ref}
-        className={cn("flex flex-col space-y-1.5 p-6", className)}
-        {...props}
-    />
-))
-CardHeader.displayName = "CardHeader"
-
-const CardTitle = React.forwardRef<
-    HTMLDivElement,
-    React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-    <div
-        ref={ref}
-        className={cn("font-semibold leading-none tracking-tight", className)}
-        {...props}
-    />
-))
-CardTitle.displayName = "CardTitle"
-
-const CardDescription = React.forwardRef<
-    HTMLDivElement,
-    React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-    <div
-        ref={ref}
-        className={cn("text-sm text-muted-foreground", className)}
-        {...props}
-    />
-))
-CardDescription.displayName = "CardDescription"
-
-const CardContent = React.forwardRef<
-    HTMLDivElement,
-    React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-    <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
-))
-CardContent.displayName = "CardContent"
-
-const CardFooter = React.forwardRef<
-    HTMLDivElement,
-    React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-    <div
-        ref={ref}
-        className={cn("flex items-center p-6 pt-0", className)}
-        {...props}
-    />
-))
-CardFooter.displayName = "CardFooter"
-
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }

package/src/components/ui/dialog.tsx

@@ -1,133 +0,0 @@
-import * as React from "react"
-import * as DialogPrimitive from "@radix-ui/react-dialog"
-import { XIcon } from "lucide-react"
-
-import { cn } from "@/lib/utils"
-
-function Dialog({
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Root>) {
-    return <DialogPrimitive.Root data-slot="dialog" {...props} />
-}
-
-function DialogTrigger({
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
-    return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
-}
-
-function DialogPortal({
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
-    return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
-}
-
-function DialogClose({
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Close>) {
-    return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
-}
-
-function DialogOverlay({
-    className,
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
-    return (
-        <DialogPrimitive.Overlay
-            data-slot="dialog-overlay"
-            className={cn(
-                "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
-                className
-            )}
-            {...props}
-        />
-    )
-}
-
-function DialogContent({
-    className,
-    children,
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Content>) {
-    return (
-        <DialogPortal data-slot="dialog-portal">
-            <DialogOverlay />
-            <DialogPrimitive.Content
-                data-slot="dialog-content"
-                className={cn(
-                    "bg-background 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 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
-                    className
-                )}
-                {...props}
-            >
-                {children}
-                <DialogPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4">
-                    <XIcon />
-                    <span className="sr-only">Close</span>
-                </DialogPrimitive.Close>
-            </DialogPrimitive.Content>
-        </DialogPortal>
-    )
-}
-
-function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
-    return (
-        <div
-            data-slot="dialog-header"
-            className={cn("flex flex-col gap-2 text-center sm:text-left", className)}
-            {...props}
-        />
-    )
-}
-
-function DialogFooter({ className, ...props }: React.ComponentProps<"div">) {
-    return (
-        <div
-            data-slot="dialog-footer"
-            className={cn(
-                "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
-                className
-            )}
-            {...props}
-        />
-    )
-}
-
-function DialogTitle({
-    className,
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Title>) {
-    return (
-        <DialogPrimitive.Title
-            data-slot="dialog-title"
-            className={cn("text-lg leading-none font-semibold", className)}
-            {...props}
-        />
-    )
-}
-
-function DialogDescription({
-    className,
-    ...props
-}: React.ComponentProps<typeof DialogPrimitive.Description>) {
-    return (
-        <DialogPrimitive.Description
-            data-slot="dialog-description"
-            className={cn("text-muted-foreground text-sm", className)}
-            {...props}
-        />
-    )
-}
-
-export {
-    Dialog,
-    DialogClose,
-    DialogContent,
-    DialogDescription,
-    DialogFooter,
-    DialogHeader,
-    DialogOverlay,
-    DialogPortal,
-    DialogTitle,
-    DialogTrigger,
-}

package/src/components/ui/input.tsx

@@ -1,22 +0,0 @@
-import * as React from "react"
-
-import { cn } from "../../lib/utils"
-
-const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
-    ({ className, type, ...props }, ref) => {
-        return (
-            <input
-                type={type}
-                className={cn(
-                    "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
-                    className
-                )}
-                ref={ref}
-                {...props}
-            />
-        )
-    }
-)
-Input.displayName = "Input"
-
-export { Input }

package/src/components/ui/label.tsx

@@ -1,24 +0,0 @@
-"use client"
-
-import * as React from "react"
-import * as LabelPrimitive from "@radix-ui/react-label"
-
-import { cn } from "@/lib/utils"
-
-function Label({
-    className,
-    ...props
-}: React.ComponentProps<typeof LabelPrimitive.Root>) {
-    return (
-        <LabelPrimitive.Root
-            data-slot="label"
-            className={cn(
-                "flex items-center gap-2 text-sm leading-none font-medium select-none text-muted-foreground group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
-                className
-            )}
-            {...props}
-        />
-    )
-}
-
-export { Label }

package/src/components/ui/otp-input.tsx

@@ -1,184 +0,0 @@
-import { useRef, useState, KeyboardEvent, ClipboardEvent } from "react";
-import { Input } from "./input";
-import { cn } from "../../lib/utils";
-
-interface OtpInputProps {
-    length?: number;
-    value: string;
-    onChange: (value: string) => void;
-    onComplete?: (value: string) => void;
-    disabled?: boolean;
-    error?: boolean;
-}
-
-export function OtpInput({
-    length = 6,
-    value,
-    onChange,
-    onComplete,
-    disabled = false,
-    error = false,
-}: OtpInputProps) {
-    const inputRefs = useRef<(HTMLInputElement | null)[]>([]);
-    const [focusedIndex, setFocusedIndex] = useState<number | null>(null);
-
-    const handleChange = (index: number, inputValue: string) => {
-        // Only allow digits
-        const digit = inputValue.replace(/[^0-9]/g, "");
-
-        if (digit.length === 0) {
-            // Handle backspace/delete
-            const newValue = value.split("");
-            newValue[index] = " "; // Use space as placeholder to maintain length if needed, or better logic below
-            // Actually, split("") of string length N gives N chars. 
-            // If we want to clear index, we should rebuild string carefully.
-
-            // Better approach for fixed length string representation:
-            // We can't easily mutate string directly.
-            // Let's assume value is a string of digits, potentially shorter than length?
-            // No, usually value is just the current OTP string.
-
-            const newChars = value.split("");
-            // Pad if needed? No, value might be "12" for length 6.
-            // But we map over length.
-
-            // Let's follow the atomic-crm logic logic carefully or improve it.
-            // atomic-crm logic:
-            // newValue[index] = "";
-            // updatedValue = newValue.join("");
-            // This reduces length if value was "123" and we clear index 1 -> "13". 
-            // This shifts subsequent digits left, which is standard backspace behavior for text input,
-            // but typical OTP inputs usually clear the digit IN PLACE.
-            // However, seeing atomic-crm implementation: 
-            /*
-            const newValue = value.split("");
-            newValue[index] = "";
-            const updatedValue = newValue.join("");
-            */
-            // This effectively DELETES the char at index.
-
-            // Let's stick to the ported code exactly to match expectations.
-            // However, I need to make sure 'value' passed in handles getting shorter.
-
-            let valArray = value.split('');
-            if (index < valArray.length) {
-                valArray.splice(index, 1); // Remove char at index
-            }
-            const updatedValue = valArray.join('');
-
-            onChange(updatedValue);
-
-            // Move to previous input
-            if (index > 0) {
-                inputRefs.current[index - 1]?.focus();
-            }
-            return;
-        }
-
-        // Update the value at the current index
-        // If we are typing in an empty slot (index >= value.length), append?
-        // If we are typing in existing slot, replace?
-
-        // atomic-crm logic:
-        /*
-        const newValue = value.split("");
-        newValue[index] = digit[0];
-        const updatedValue = newValue.join("");
-        */
-        // This implies value has length equal to inputs? Or at least up to index?
-        // If value is "1", and I type in box 2 (index 1), newValue[1] = digit.
-        // "1" split is ["1"]. newValue[1] = "2" -> ["1", "2"]. Join -> "12". Works.
-
-        // But if I click box 3 with value "1", index is 2. newValue[2] = "3". -> ["1", undefined, "3"].
-        // Join might be "13" or "1undefined3".
-
-        // Let's write robust logic.
-        const chars = value.split('');
-        // Fill gaps if jumping ahead? Usually OTP fields auto-focus next.
-        // But if user clicks manualy...
-        // Let's just assume we append if index >= length
-
-        // Actually, sticking to exact atomic-crm port is safest if we trust it works there.
-        // The provided code was:
-        /*
-          const newValue = value.split("");
-          newValue[index] = digit[0];
-          const updatedValue = newValue.join("");
-        */
-
-        // I will use a slightly more robust version that ensures we don't get holes if possible,
-        // or just trust the array manipulation.
-
-        const newChars = [...value]; // split
-        newChars[index] = digit[0];
-        onChange(newChars.join(""));
-
-        // Move to next input if not the last one
-        if (index < length - 1) {
-            inputRefs.current[index + 1]?.focus();
-        }
-
-        // Check if OTP is complete
-        const resultingStr = newChars.join("");
-        if (resultingStr.length === length && onComplete) {
-            onComplete(resultingStr);
-        }
-    };
-
-    const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {
-        if (e.key === "Backspace" && !value[index] && index > 0) {
-            // If current input is empty and backspace is pressed, move to previous
-            inputRefs.current[index - 1]?.focus();
-        } else if (e.key === "ArrowLeft" && index > 0) {
-            inputRefs.current[index - 1]?.focus();
-        } else if (e.key === "ArrowRight" && index < length - 1) {
-            inputRefs.current[index + 1]?.focus();
-        }
-    };
-
-    const handlePaste = (e: ClipboardEvent<HTMLInputElement>) => {
-        e.preventDefault();
-        const pastedData = e.clipboardData.getData("text/plain");
-        const digits = pastedData.replace(/[^0-9]/g, "").slice(0, length);
-
-        onChange(digits);
-
-        // Focus the next empty input or the last input
-        const nextIndex = Math.min(digits.length, length - 1);
-        inputRefs.current[nextIndex]?.focus();
-
-        // Check if OTP is complete
-        if (digits.length === length && onComplete) {
-            onComplete(digits);
-        }
-    };
-
-    return (
-        <div className="flex gap-2 justify-center">
-            {Array.from({ length }).map((_, index) => (
-                <Input
-                    key={index}
-                    ref={(el) => {
-                        inputRefs.current[index] = el;
-                    }}
-                    type="text"
-                    inputMode="numeric"
-                    maxLength={1}
-                    value={value[index] || ""}
-                    onChange={(e) => handleChange(index, e.target.value)}
-                    onKeyDown={(e) => handleKeyDown(index, e)}
-                    onPaste={handlePaste}
-                    onFocus={() => setFocusedIndex(index)}
-                    onBlur={() => setFocusedIndex(null)}
-                    disabled={disabled}
-                    className={cn(
-                        "w-10 h-10 sm:w-12 sm:h-12 text-center text-lg font-semibold px-0",
-                        error && "border-destructive focus-visible:ring-destructive",
-                        focusedIndex === index && "ring-2 ring-ring",
-                    )}
-                    aria-label={`Digit ${index + 1}`}
-                />
-            ))}
-        </div>
-    );
-}