@mohasinac/appkit 2.3.0 → 2.3.1

package/dist/features/contact/components/ContactForm.d.ts

@@ -0,0 +1,32 @@
+interface ContactFormData {
+    name: string;
+    email: string;
+    subject: string;
+    message: string;
+}
+export interface ContactFormProps {
+    onSubmit: (data: ContactFormData) => Promise<void>;
+    labels?: {
+        title?: string;
+        nameLabel?: string;
+        namePlaceholder?: string;
+        emailLabel?: string;
+        emailPlaceholder?: string;
+        subjectLabel?: string;
+        subjectPlaceholder?: string;
+        messageLabel?: string;
+        messagePlaceholder?: string;
+        submitButton?: string;
+        submittingButton?: string;
+        successTitle?: string;
+        successDescription?: string;
+        sendAnotherButton?: string;
+        errorGeneric?: string;
+        validationRequired?: string;
+        validationEmail?: string;
+        validationMessageTooShort?: string;
+    };
+    className?: string;
+}
+export declare function ContactForm({ onSubmit, labels, className, }: ContactFormProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/features/contact/components/ContactForm.js

@@ -0,0 +1,58 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from "react";
+import { Button, Div, Heading, Span, Text, Textarea } from "../../../ui";
+const INITIAL_FORM = {
+    name: "",
+    email: "",
+    subject: "",
+    message: "",
+};
+export function ContactForm({ onSubmit, labels = {}, className = "", }) {
+    const [form, setForm] = useState(INITIAL_FORM);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [submitted, setSubmitted] = useState(false);
+    const [errors, setErrors] = useState({});
+    const [submitError, setSubmitError] = useState(null);
+    const validate = () => {
+        const newErrors = {};
+        if (!form.name.trim())
+            newErrors.name = labels.validationRequired ?? "Required";
+        if (!form.email.trim() || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(form.email))
+            newErrors.email = labels.validationEmail ?? "Valid email required";
+        if (!form.subject.trim())
+            newErrors.subject = labels.validationRequired ?? "Required";
+        if (!form.message.trim() || form.message.length < 10)
+            newErrors.message =
+                labels.validationMessageTooShort ?? "Message too short";
+        setErrors(newErrors);
+        return Object.keys(newErrors).length === 0;
+    };
+    const handleSubmit = useCallback(async (e) => {
+        e.preventDefault();
+        if (!validate())
+            return;
+        setIsSubmitting(true);
+        setSubmitError(null);
+        try {
+            await onSubmit(form);
+            setSubmitted(true);
+            setForm(INITIAL_FORM);
+        }
+        catch {
+            setSubmitError(labels.errorGeneric ?? "Something went wrong. Please try again.");
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [form, onSubmit, labels]);
+    if (submitted) {
+        return (_jsxs(Div, { className: `text-center py-12 ${className}`, children: [_jsx(Div, { className: "text-5xl mb-4", children: "\u2705" }), _jsx(Heading, { level: 2, className: "mb-2", children: labels.successTitle ?? "Message Sent!" }), _jsx(Text, { variant: "secondary", className: "mb-6", children: labels.successDescription ?? "We'll get back to you shortly." }), _jsx(Button, { type: "button", variant: "outline", onClick: () => setSubmitted(false), children: labels.sendAnotherButton ?? "Send another message" })] }));
+    }
+    const field = (id, label, placeholder, multiline) => (_jsxs(Div, { className: "flex flex-col gap-1", children: [_jsx("label", { htmlFor: id, className: "text-sm font-medium text-neutral-700 dark:text-neutral-300", children: label }), multiline ? (_jsx(Textarea, { id: id, value: form[id], onChange: (e) => setForm((f) => ({ ...f, [id]: e.target.value })), placeholder: placeholder, rows: 5, className: "w-full rounded-lg border border-neutral-200 dark:border-slate-600 bg-white dark:bg-slate-800 px-3 py-2 text-sm outline-none focus:ring-2 ring-primary/20 transition" })) : (_jsx("input", { id: id, type: id === "email" ? "email" : "text", value: form[id], onChange: (e) => setForm((f) => ({ ...f, [id]: e.target.value })), placeholder: placeholder, className: "h-10 w-full rounded-lg border border-neutral-200 dark:border-slate-600 bg-white dark:bg-slate-800 px-3 text-sm outline-none focus:ring-2 ring-primary/20 transition" })), errors[id] && _jsx(Span, { className: "text-xs text-red-500", children: errors[id] })] }));
+    return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, className: `space-y-4 ${className}`, children: [_jsx(Heading, { level: 2, className: "mb-6", children: labels.title ?? "Send us a message" }), submitError && (_jsx(Div, { className: "rounded-lg bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-700 px-4 py-3 text-sm text-red-700 dark:text-red-300", children: submitError })), field("name", labels.nameLabel ?? "Your Name", labels.namePlaceholder ?? "Enter your name"), field("email", labels.emailLabel ?? "Email", labels.emailPlaceholder ?? "your@email.com"), field("subject", labels.subjectLabel ?? "Subject", labels.subjectPlaceholder ?? "How can we help?"), field("message", labels.messageLabel ?? "Message", labels.messagePlaceholder ?? "Tell us more…", true), _jsx(Button, { type: "submit", variant: "primary", disabled: isSubmitting, className: "w-full sm:w-auto", children: isSubmitting
+                    ? (labels.submittingButton ?? "Sending…")
+                    : (labels.submitButton ?? "Send Message") })] }));
+}

package/dist/features/contact/components/ContactInfoSidebar.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+export interface ContactInfoItem {
+    icon: string;
+    label: string;
+    value: string;
+    href?: string;
+}
+export interface ContactInfoSidebarProps {
+    infoItems: ContactInfoItem[];
+    labels?: {
+        title?: string;
+        businessHoursLabel?: string;
+        businessHoursValue?: string;
+        responseTimeLabel?: string;
+        responseTimeValue?: string;
+    };
+    /** Render extra action links (e.g. WhatsApp, Chat) */
+    renderActions?: () => React.ReactNode;
+}
+export declare function ContactInfoSidebar({ infoItems, labels, renderActions, }: ContactInfoSidebarProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/contact/components/ContactInfoSidebar.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Div, Heading, Span, Stack, Text } from "../../../ui";
+export function ContactInfoSidebar({ infoItems, labels = {}, renderActions, }) {
+    return (_jsxs(Stack, { as: "aside", gap: "lg", children: [_jsxs(Div, { children: [_jsx(Heading, { level: 3, className: "mb-4", children: labels.title ?? "Contact Information" }), _jsx(Stack, { gap: "md", children: infoItems.map((item) => (_jsxs(Div, { className: "flex items-start gap-3", children: [_jsx(Span, { className: "text-xl flex-shrink-0 mt-0.5", children: item.icon }), _jsxs(Div, { children: [_jsx(Text, { className: "text-xs font-medium text-neutral-500 dark:text-neutral-400 uppercase tracking-wide mb-0.5", children: item.label }), item.href ? (_jsx("a", { href: item.href, className: "text-sm text-primary-800 dark:text-primary-300 hover:underline", children: item.value })) : (_jsx(Text, { className: "text-sm", children: item.value }))] })] }, item.label))) })] }), (labels.businessHoursLabel || labels.responseTimeLabel) && (_jsxs(Stack, { gap: "sm", className: "rounded-xl border border-neutral-200 dark:border-slate-700 bg-neutral-50 dark:bg-slate-800/60 p-4", children: [labels.businessHoursLabel && labels.businessHoursValue && (_jsxs(Div, { children: [_jsx(Text, { className: "text-xs font-semibold text-neutral-500 uppercase tracking-wide", children: labels.businessHoursLabel }), _jsx(Text, { className: "text-sm mt-0.5", children: labels.businessHoursValue })] })), labels.responseTimeLabel && labels.responseTimeValue && (_jsxs(Div, { children: [_jsx(Text, { className: "text-xs font-semibold text-neutral-500 uppercase tracking-wide", children: labels.responseTimeLabel }), _jsx(Text, { className: "text-sm mt-0.5", children: labels.responseTimeValue })] }))] })), renderActions?.()] }));
+}

package/dist/features/contact/components/ContactPageView.d.ts

@@ -0,0 +1 @@
+export declare function ContactPageView(): import("react/jsx-runtime").JSX.Element;

package/dist/features/contact/components/ContactPageView.js

@@ -0,0 +1,45 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Container, Div, Heading, Main, Section, Stack, Text } from "../../../ui";
+import { AdSlot } from "../../homepage/components/AdSlot";
+import { ContactForm } from "./ContactForm";
+import { ContactInfoSidebar } from "./ContactInfoSidebar";
+async function submitContact(data) {
+    const response = await fetch("/api/contact", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(data),
+    });
+    if (!response.ok) {
+        throw new Error("Contact submit failed");
+    }
+}
+export function ContactPageView() {
+    return (_jsx(Main, { children: _jsx(Section, { className: "py-10", children: _jsxs(Container, { size: "xl", className: "space-y-8", children: [_jsxs(Stack, { gap: "3", children: [_jsx(Heading, { level: 1, className: "text-3xl font-semibold text-zinc-900 dark:text-zinc-50", children: "Contact Us" }), _jsx(Text, { className: "text-zinc-500 dark:text-zinc-400", children: "Questions, support requests, or partnership inquiries." })] }), _jsx(AdSlot, { id: "detail-below-gallery", className: "mb-2" }), _jsxs(Div, { className: "grid grid-cols-12 gap-6", children: [_jsx(Div, { className: "col-span-12 lg:col-span-8", children: _jsx(ContactForm, { onSubmit: submitContact, labels: {
+                                        title: "Send us a message",
+                                        nameLabel: "Your Name",
+                                        emailLabel: "Email Address",
+                                        subjectLabel: "Subject",
+                                        messageLabel: "Message",
+                                        submitButton: "Send Message",
+                                    } }) }), _jsx(Div, { className: "col-span-12 lg:col-span-4", children: _jsx(ContactInfoSidebar, { infoItems: [
+                                        {
+                                            icon: "📧",
+                                            label: "Email",
+                                            value: "support@letitrip.in",
+                                            href: "mailto:support@letitrip.in",
+                                        },
+                                        {
+                                            icon: "💬",
+                                            label: "WhatsApp",
+                                            value: "+91 70000 00000",
+                                            href: "https://wa.me/917000000000",
+                                        },
+                                    ], labels: {
+                                        title: "Support",
+                                        businessHoursLabel: "Business Hours",
+                                        businessHoursValue: "Mon-Sat · 10:00 AM - 7:00 PM IST",
+                                        responseTimeLabel: "Response Time",
+                                        responseTimeValue: "Usually within 24 hours",
+                                    } }) })] }), _jsx(AdSlot, { id: "detail-below-price" })] }) }) }));
+}

package/dist/features/contact/components/index.d.ts

@@ -0,0 +1,5 @@
+export { ContactForm } from "./ContactForm";
+export type { ContactFormProps } from "./ContactForm";
+export { ContactInfoSidebar } from "./ContactInfoSidebar";
+export { ContactPageView } from "./ContactPageView";
+export type { ContactInfoSidebarProps, ContactInfoItem, } from "./ContactInfoSidebar";

package/dist/features/contact/components/index.js

@@ -0,0 +1,3 @@
+export { ContactForm } from "./ContactForm";
+export { ContactInfoSidebar } from "./ContactInfoSidebar";
+export { ContactPageView } from "./ContactPageView";

package/dist/features/contact/email.d.ts

@@ -0,0 +1,60 @@
+type SendEmailOptions = Record<string, unknown> & {
+    to: string | string[];
+    subject: string;
+    html?: string;
+    text?: string;
+    from?: string;
+    replyTo?: string;
+};
+export declare function sendEmail(opts: SendEmailOptions): Promise<{
+    data: unknown;
+    error: unknown;
+}>;
+export declare function sendVerificationEmailWithLink(email: string, verificationLink: string): Promise<{
+    success: boolean;
+    data?: unknown;
+}>;
+export declare function sendPasswordResetEmailWithLink(email: string, resetLink: string): Promise<{
+    success: boolean;
+    data?: unknown;
+}>;
+export interface OrderConfirmationEmailParams {
+    to: string;
+    userName: string;
+    orderId: string;
+    productTitle: string;
+    quantity: number;
+    totalPrice: number;
+    currency: string;
+    shippingAddress: string;
+    paymentMethod: string;
+    items?: Array<{
+        productId: string;
+        productTitle: string;
+        quantity: number;
+        unitPrice: number;
+        totalPrice: number;
+    }>;
+}
+export declare function sendOrderConfirmationEmail(params: OrderConfirmationEmailParams): Promise<{
+    success: boolean;
+    data?: unknown;
+}>;
+export declare function sendContactEmail(params: {
+    name: string;
+    email: string;
+    subject: string;
+    message: string;
+}): Promise<{
+    success: boolean;
+    data?: unknown;
+}>;
+export declare function sendSiteSettingsChangedEmail(params: {
+    adminEmails: string[];
+    changedByEmail: string;
+    changedFields: string[];
+}): Promise<{
+    success: boolean;
+    data?: unknown;
+}>;
+export {};

package/dist/features/contact/email.js

@@ -0,0 +1,344 @@
+import { getProviders } from "../../contracts";
+import { serverLogger } from "../../monitoring";
+import { currentYear, formatCurrency, formatDateTime, nowMs, } from "../../utils";
+function getSiteName() {
+    return process.env.NEXT_PUBLIC_SITE_NAME?.trim() || "App";
+}
+function getSiteUrl() {
+    return process.env.NEXTAUTH_URL?.trim() || "http://localhost:3000";
+}
+function getSupportEmail() {
+    return process.env.EMAIL_SUPPORT?.trim() || "support@example.com";
+}
+export async function sendEmail(opts) {
+    try {
+        const data = await getProviders().email.send({
+            to: opts.to,
+            subject: opts.subject,
+            html: typeof opts.html === "string" ? opts.html : "",
+            text: typeof opts.text === "string" ? opts.text : undefined,
+            from: typeof opts.from === "string" ? opts.from : undefined,
+            replyTo: typeof opts.replyTo === "string" ? opts.replyTo : undefined,
+            headers: typeof opts.headers === "object" && opts.headers
+                ? opts.headers
+                : undefined,
+        });
+        return { data, error: null };
+    }
+    catch (error) {
+        return { data: null, error };
+    }
+}
+async function sendConfiguredEmail(opts) {
+    return sendEmail(opts);
+}
+export async function sendVerificationEmailWithLink(email, verificationLink) {
+    const siteName = getSiteName();
+    try {
+        const { data, error } = await sendConfiguredEmail({
+            to: email,
+            subject: `Verify your ${siteName} email address`,
+            html: `<p>Click <a href="${verificationLink}">here</a> to verify your email address. This link expires in 24 hours.</p>`,
+            text: `Verify your email: ${verificationLink}\n\nThis link expires in 24 hours.`,
+        });
+        if (error) {
+            serverLogger.error("Failed to send verification email (link)", { error });
+            throw error;
+        }
+        return { success: true, data };
+    }
+    catch (error) {
+        serverLogger.error("Error sending verification email (link)", { error });
+        throw error;
+    }
+}
+export async function sendPasswordResetEmailWithLink(email, resetLink) {
+    const siteName = getSiteName();
+    try {
+        const { data, error } = await sendConfiguredEmail({
+            to: email,
+            subject: `Reset your ${siteName} password`,
+            html: `<p>Click <a href="${resetLink}">here</a> to reset your password. This link expires in 1 hour.</p><p>If you didn't request this, you can safely ignore this email.</p>`,
+            text: `Reset your password: ${resetLink}\n\nThis link expires in 1 hour.\n\nIf you didn't request this, ignore this email.`,
+        });
+        if (error) {
+            serverLogger.error("Failed to send password reset email (link)", {
+                error,
+            });
+            throw error;
+        }
+        return { success: true, data };
+    }
+    catch (error) {
+        serverLogger.error("Error sending password reset email (link)", { error });
+        throw error;
+    }
+}
+export async function sendOrderConfirmationEmail(params) {
+    const siteName = getSiteName();
+    const siteUrl = getSiteUrl();
+    const { to, userName, orderId, productTitle, quantity, totalPrice, currency, shippingAddress, paymentMethod, items, } = params;
+    const orderUrl = `${siteUrl}/user/orders/view/${orderId}`;
+    const formattedTotal = formatCurrency(totalPrice, currency);
+    const itemsHtml = items && items.length > 1
+        ? `
+        <table width="100%" cellpadding="8" cellspacing="0" border="0" style="border-collapse: collapse; margin-bottom: 8px;">
+          <thead>
+            <tr style="background-color: #e9ecef;">
+              <th style="text-align: left; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Product</th>
+              <th style="text-align: center; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Qty</th>
+              <th style="text-align: right; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Amount</th>
+            </tr>
+          </thead>
+          <tbody>
+            ${items
+            .map((item, index) => `
+              <tr style="background-color: ${index % 2 === 0 ? "#ffffff" : "#f8f9fa"}; border-top: 1px solid #e9ecef;">
+                <td style="font-size: 14px; color: #333; padding: 8px 12px;">${item.productTitle}</td>
+                <td style="font-size: 14px; color: #333; text-align: center; padding: 8px 12px;">${item.quantity}</td>
+                <td style="font-size: 14px; color: #333; text-align: right; padding: 8px 12px;">${formatCurrency(item.totalPrice, currency)}</td>
+              </tr>`)
+            .join("")}
+          </tbody>
+        </table>`
+        : `
+        <tr>
+          <td style="color: #666; font-size: 14px;">Product</td>
+          <td style="color: #333; font-size: 14px;">${productTitle}</td>
+        </tr>
+        <tr>
+          <td style="color: #666; font-size: 14px;">Quantity</td>
+          <td style="color: #333; font-size: 14px;">${quantity}</td>
+        </tr>`;
+    const itemsText = items && items.length > 1
+        ? items
+            .map((item) => `  • ${item.productTitle} × ${item.quantity} — ${formatCurrency(item.totalPrice, currency)}`)
+            .join("\n")
+        : `  Product: ${productTitle}\n  Quantity: ${quantity}`;
+    try {
+        const { data, error } = await sendConfiguredEmail({
+            to,
+            subject: `Order Confirmed — ${orderId}`,
+            html: `
+        <!DOCTYPE html>
+        <html>
+        <head>
+          <meta charset="utf-8">
+          <meta name="viewport" content="width=device-width, initial-scale=1.0">
+          <title>Order Confirmation</title>
+        </head>
+        <body style="margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; background-color: #f5f5f5;">
+          <table width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color: #f5f5f5; padding: 40px 0;">
+            <tr>
+              <td align="center">
+                <table width="600" cellpadding="0" cellspacing="0" border="0" style="background-color: #ffffff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
+                  <tr>
+                    <td style="background: linear-gradient(135deg, #10b981 0%, #059669 100%); padding: 40px; text-align: center;">
+                      <p style="font-size: 48px; margin: 0 0 12px;">✅</p>
+                      <h1 style="color: #ffffff; margin: 0; font-size: 28px; font-weight: 600;">Order Confirmed!</h1>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td style="padding: 40px;">
+                      <p style="color: #333; font-size: 16px; line-height: 1.6; margin: 0 0 20px;">Hi ${userName},</p>
+                      <p style="color: #333; font-size: 16px; line-height: 1.6; margin: 0 0 24px;">
+                        Thank you for your order! We've received it and will process it shortly.
+                      </p>
+                      <table width="100%" cellpadding="12" cellspacing="0" border="0" style="background-color: #f8f9fa; border-radius: 8px; margin-bottom: 24px;">
+                        <tr>
+                          <td style="color: #666; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid #e9ecef;" colspan="2">Order Details</td>
+                        </tr>
+                        <tr>
+                          <td style="color: #666; font-size: 14px; width: 40%;">Order ID</td>
+                          <td style="color: #333; font-size: 14px; font-weight: 600;">${orderId}</td>
+                        </tr>
+                        ${items && items.length > 1
+                ? `
+                        <tr>
+                          <td style="color: #666; font-size: 14px; vertical-align: top;" colspan="2">
+                            <div style="font-weight: 600; margin-bottom: 8px;">Items (${items.length})</div>
+                            ${itemsHtml}
+                          </td>
+                        </tr>`
+                : itemsHtml}
+                        <tr>
+                          <td style="color: #666; font-size: 14px;">Total</td>
+                          <td style="color: #333; font-size: 14px; font-weight: 700;">${formattedTotal}</td>
+                        </tr>
+                        <tr>
+                          <td style="color: #666; font-size: 14px;">Payment</td>
+                          <td style="color: #333; font-size: 14px;">${paymentMethod === "cod" ? "Cash on Delivery" : "Online Payment"}</td>
+                        </tr>
+                        <tr>
+                          <td style="color: #666; font-size: 14px; vertical-align: top;">Ship to</td>
+                          <td style="color: #333; font-size: 14px;">${shippingAddress}</td>
+                        </tr>
+                      </table>
+                      <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 30px 0;">
+                        <tr>
+                          <td align="center">
+                            <a href="${orderUrl}" style="display: inline-block; padding: 14px 40px; background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: #ffffff; text-decoration: none; border-radius: 6px; font-size: 16px; font-weight: 600;">
+                              View Order
+                            </a>
+                          </td>
+                        </tr>
+                      </table>
+                      <p style="color: #999; font-size: 13px; line-height: 1.6; margin: 0;">
+                        We'll send you another email when your order is shipped.
+                      </p>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td style="background-color: #f8f9fa; padding: 24px; text-align: center; border-top: 1px solid #eee;">
+                      <p style="color: #999; font-size: 12px; margin: 0;">
+                        © ${currentYear()} ${siteName}. All rights reserved.
+                      </p>
+                    </td>
+                  </tr>
+                </table>
+              </td>
+            </tr>
+          </table>
+        </body>
+        </html>
+      `,
+            text: `Hi ${userName},\n\nYour order ${orderId} has been confirmed!\n\n${itemsText}\nTotal: ${formattedTotal}\nPayment: ${paymentMethod === "cod" ? "Cash on Delivery" : "Online Payment"}\nShip to: ${shippingAddress}\n\nView your order: ${orderUrl}\n\n© ${currentYear()} ${siteName}`,
+        });
+        if (error) {
+            serverLogger.error("Failed to send order confirmation email", { error });
+            return { success: false };
+        }
+        return { success: true, data };
+    }
+    catch (error) {
+        serverLogger.error("Error sending order confirmation email", { error });
+        return { success: false };
+    }
+}
+export async function sendContactEmail(params) {
+    const siteName = getSiteName();
+    const supportEmail = getSupportEmail();
+    const { name, email, subject, message } = params;
+    try {
+        const { data, error } = await sendConfiguredEmail({
+            to: supportEmail,
+            replyTo: email,
+            subject: `[Contact] ${subject}`,
+            html: `
+        <!DOCTYPE html>
+        <html>
+        <head><meta charset="utf-8"><title>Contact Form</title></head>
+        <body style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #f5f5f5; padding: 40px 0;">
+          <table width="600" style="margin: 0 auto; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
+            <tr><td style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 32px; text-align: center;">
+              <h1 style="color: #fff; margin: 0; font-size: 24px;">New Contact Message</h1>
+            </td></tr>
+            <tr><td style="padding: 32px;">
+              <p><strong>From:</strong> ${name} &lt;${email}&gt;</p>
+              <p><strong>Subject:</strong> ${subject}</p>
+              <hr style="border: none; border-top: 1px solid #eee; margin: 16px 0;">
+              <p style="white-space: pre-wrap;">${message}</p>
+            </td></tr>
+            <tr><td style="background: #f9f9f9; padding: 16px; text-align: center; color: #888; font-size: 12px;">
+              © ${currentYear()} ${siteName}
+            </td></tr>
+          </table>
+        </body>
+        </html>
+      `,
+            text: `From: ${name} <${email}>\nSubject: ${subject}\n\n${message}`,
+        });
+        if (error) {
+            serverLogger.error("Failed to send contact email", { error });
+            return { success: false };
+        }
+        return { success: true, data };
+    }
+    catch (error) {
+        serverLogger.error("Error sending contact email", { error });
+        return { success: false };
+    }
+}
+export async function sendSiteSettingsChangedEmail(params) {
+    const siteName = getSiteName();
+    const siteUrl = getSiteUrl();
+    const { adminEmails, changedByEmail, changedFields } = params;
+    if (adminEmails.length === 0)
+        return { success: false };
+    const settingsUrl = `${siteUrl}/admin/site-settings`;
+    const timestamp = formatDateTime(nowMs());
+    try {
+        const { data, error } = await sendConfiguredEmail({
+            to: adminEmails,
+            subject: `Site settings updated by ${changedByEmail}`,
+            html: `
+        <!DOCTYPE html>
+        <html>
+        <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"></head>
+        <body style="margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;background-color:#f5f5f5;">
+          <table width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color:#f5f5f5;padding:40px 0;">
+            <tr><td align="center">
+              <table width="600" cellpadding="0" cellspacing="0" border="0" style="background-color:#ffffff;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.1);">
+                <tr>
+                  <td style="background:linear-gradient(135deg,#10b981 0%,#059669 100%);padding:40px;text-align:center;">
+                    <p style="font-size:48px;margin:0 0 12px;">⚙️</p>
+                    <h1 style="color:#ffffff;margin:0;font-size:24px;font-weight:600;">Site Settings Changed</h1>
+                    <p style="color:#d1fae5;margin:8px 0 0;font-size:14px;">${timestamp}</p>
+                  </td>
+                </tr>
+                <tr>
+                  <td style="padding:40px;">
+                    <p style="color:#333;font-size:16px;line-height:1.6;margin:0 0 20px;">
+                      <strong>${changedByEmail}</strong> has updated the following site settings:
+                    </p>
+                    <table width="100%" cellpadding="12" cellspacing="0" border="0" style="background:#f8f9fa;border-radius:8px;margin:0 0 24px;">
+                      <tr>
+                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Changed Fields</td>
+                        <td style="color:#111827;font-size:14px;">${changedFields.map((field) => `<code style="background:#e5e7eb;padding:2px 6px;border-radius:3px;">${field}</code>`).join("&ensp;")}</td>
+                      </tr>
+                      <tr>
+                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Changed By</td>
+                        <td style="color:#111827;font-size:14px;">${changedByEmail}</td>
+                      </tr>
+                      <tr>
+                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Timestamp</td>
+                        <td style="color:#111827;font-size:14px;">${timestamp}</td>
+                      </tr>
+                    </table>
+                    <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin:24px 0;">
+                      <tr><td align="center">
+                        <a href="${settingsUrl}" style="display:inline-block;padding:14px 40px;background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#ffffff;text-decoration:none;border-radius:6px;font-size:15px;font-weight:600;">
+                          View Settings
+                        </a>
+                      </td></tr>
+                    </table>
+                  </td>
+                </tr>
+                <tr>
+                  <td style="background-color:#f8f9fa;padding:24px;text-align:center;border-top:1px solid #eeeeee;">
+                    <p style="color:#9ca3af;font-size:12px;margin:0;">© ${currentYear()} ${siteName}. Automated notification — do not reply.</p>
+                  </td>
+                </tr>
+              </table>
+            </td></tr>
+          </table>
+        </body>
+        </html>
+      `,
+            text: `Site settings updated by ${changedByEmail}\n\nChanged fields: ${changedFields.join(", ")}\n\nView at: ${settingsUrl}`,
+        });
+        if (error) {
+            serverLogger.error("Failed to send settings change notification email", {
+                error,
+            });
+            return { success: false };
+        }
+        return { success: true, data };
+    }
+    catch (error) {
+        serverLogger.error("Error sending settings change notification email", {
+            error,
+        });
+        return { success: false };
+    }
+}

package/dist/features/contact/hooks/useContactSubmit.d.ts

@@ -0,0 +1,4 @@
+export interface UseContactSubmitOptions<TInput, TResult> {
+    submit: (data: TInput) => Promise<TResult>;
+}
+export declare function useContactSubmit<TInput, TResult>(options: UseContactSubmitOptions<TInput, TResult>): import("@tanstack/react-query").UseMutationResult<TResult, Error, TInput, unknown>;

package/dist/features/contact/hooks/useContactSubmit.js

@@ -0,0 +1,6 @@
+import { useMutation } from "@tanstack/react-query";
+export function useContactSubmit(options) {
+    return useMutation({
+        mutationFn: (data) => options.submit(data),
+    });
+}

package/dist/features/contact/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./hooks/useContactSubmit";
+export * from "./components";

package/dist/features/contact/index.js

@@ -0,0 +1,2 @@
+export * from "./hooks/useContactSubmit";
+export * from "./components";

package/dist/features/contact/server.d.ts

@@ -0,0 +1,6 @@
+/**
+ * @mohasinac/appkit/features/contact/server
+ *
+ * Server-only entry point for contact email functionality.
+ */
+export * from "./email";

package/dist/features/contact/server.js

@@ -0,0 +1,6 @@
+/**
+ * @mohasinac/appkit/features/contact/server
+ *
+ * Server-only entry point for contact email functionality.
+ */
+export * from "./email";

package/dist/features/copilot/components/AdminCopilotView.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+export interface AdminCopilotViewProps {
+    endpoint?: string;
+    historyEndpoint?: string;
+    renderHeader?: (onNewConversation: () => void) => React.ReactNode;
+    labels?: {
+        title?: string;
+        newConversation?: string;
+        noMessages?: string;
+        noMessagesDesc?: string;
+        inputPlaceholder?: string;
+        sendButton?: string;
+        sendingButton?: string;
+        errorLabel?: string;
+        conversationId?: string;
+        loadConversation?: string;
+        historyTitle?: string;
+    };
+    className?: string;
+}
+export declare function AdminCopilotView({ endpoint, historyEndpoint, renderHeader, labels, className, }: AdminCopilotViewProps): import("react/jsx-runtime").JSX.Element;