@slashclick/ui 0.1.15 → 0.2.0

package/dist/components/icons/logo.cjs

@@ -23,7 +23,11 @@ __export(logo_exports, {
 module.exports = __toCommonJS(logo_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_utils = require("../../lib/utils");
-const Logo = ({ className }) => {
+var import_nav_theme = require("../../lib/nav-theme");
+const Logo = ({
+  className,
+  navTheme = "auto"
+}) => {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "svg",
     {
@@ -31,7 +35,7 @@ const Logo = ({ className }) => {
       "data-name": "Layer 1",
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 107.25 132.8",
-      className: (0, import_utils.cn)("text-gray-900 dark:text-white", className),
+      className: (0, import_utils.cn)(import_nav_theme.NAV_TEXT_CLASSES[navTheme], className),
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "path",
         {

package/dist/components/icons/logo.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../components/icons/logo.tsx"],"sourcesContent":["import { cn } from '../../lib/utils'\n\nexport const Logo = ({ className }: { className?: string }) => {\n  return (\n    <svg\n      id=\"Layer_1\"\n      data-name=\"Layer 1\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 107.25 132.8\"\n      className={cn('text-gray-900 dark:text-white', className)}\n    >\n      <path\n        d=\"M5.23,48.29A31.58,31.58,0,0,1,2.45,34.87c0-10.09,4.4-18.66,12.74-24.79C24.16,3.48,35.44,0,51.79,0a99.06,99.06,0,0,1,50.83,14L91.21,32.15c-13-7.22-28.55-11.34-41.82-11.34C24.58,20.81,7.84,30.07,5.23,48.29Zm72.17,56.3c-4.59,4.38-13.35,6.35-24.9,6.35-13.49,0-28-4.35-40.85-11.51L0,118.09c16.51,9.56,32.87,14.71,51.51,14.71,22.84,0,32.17-7.9,32.17-16C83.68,111.65,81.3,107.75,77.4,104.59Zm-17.73-49C47,51.11,36.52,45.66,31.93,40.3c-4.87,2.94-8.41,7.53-8.41,13,0,9.71,9.53,16,25.4,21.52,25.39,7.82,51.08,18.74,53.15,38.11a32.5,32.5,0,0,0,5.18-18.27C107.25,70.63,80.76,63,59.67,55.57Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAWM;AAXN,mBAAmB;AAEZ,MAAM,OAAO,CAAC,EAAE,UAAU,MAA8B;AAC7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,aAAU;AAAA,MACV,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,eAAW,iBAAG,iCAAiC,SAAS;AAAA,MAExD;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA;AAAA,EACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../components/icons/logo.tsx"],"sourcesContent":["import { cn } from '../../lib/utils'\nimport { NAV_TEXT_CLASSES, NavTheme } from '../../lib/nav-theme'\n\nexport const Logo = ({\n  className,\n  navTheme = 'auto',\n}: {\n  className?: string\n  navTheme?: NavTheme\n}) => {\n  return (\n    <svg\n      id=\"Layer_1\"\n      data-name=\"Layer 1\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 107.25 132.8\"\n      className={cn(NAV_TEXT_CLASSES[navTheme], className)}\n    >\n      <path\n        d=\"M5.23,48.29A31.58,31.58,0,0,1,2.45,34.87c0-10.09,4.4-18.66,12.74-24.79C24.16,3.48,35.44,0,51.79,0a99.06,99.06,0,0,1,50.83,14L91.21,32.15c-13-7.22-28.55-11.34-41.82-11.34C24.58,20.81,7.84,30.07,5.23,48.29Zm72.17,56.3c-4.59,4.38-13.35,6.35-24.9,6.35-13.49,0-28-4.35-40.85-11.51L0,118.09c16.51,9.56,32.87,14.71,51.51,14.71,22.84,0,32.17-7.9,32.17-16C83.68,111.65,81.3,107.75,77.4,104.59Zm-17.73-49C47,51.11,36.52,45.66,31.93,40.3c-4.87,2.94-8.41,7.53-8.41,13,0,9.71,9.53,16,25.4,21.52,25.39,7.82,51.08,18.74,53.15,38.11a32.5,32.5,0,0,0,5.18-18.27C107.25,70.63,80.76,63,59.67,55.57Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBM;AAlBN,mBAAmB;AACnB,uBAA2C;AAEpC,MAAM,OAAO,CAAC;AAAA,EACnB;AAAA,EACA,WAAW;AACb,MAGM;AACJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,aAAU;AAAA,MACV,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,eAAW,iBAAG,kCAAiB,QAAQ,GAAG,SAAS;AAAA,MAEnD;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/components/icons/logo.d.ts

@@ -1,4 +1,6 @@
-export declare const Logo: ({ className }: {
+import { NavTheme } from '../../lib/nav-theme';
+export declare const Logo: ({ className, navTheme, }: {
     className?: string;
+    navTheme?: NavTheme;
 }) => import("react").JSX.Element;
 //# sourceMappingURL=logo.d.ts.map

package/dist/components/icons/logo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"logo.d.ts","sourceRoot":"","sources":["../../../components/icons/logo.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,GAAI,eAAe;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,gCAezD,CAAA"}
+{"version":3,"file":"logo.d.ts","sourceRoot":"","sources":["../../../components/icons/logo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAoB,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAEhE,eAAO,MAAM,IAAI,GAAI,0BAGlB;IACD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACpB,gCAeA,CAAA"}

package/dist/components/icons/logo.js

@@ -1,6 +1,10 @@
 import { jsx } from "react/jsx-runtime";
 import { cn } from "../../lib/utils";
-const Logo = ({ className }) => {
+import { NAV_TEXT_CLASSES } from "../../lib/nav-theme";
+const Logo = ({
+  className,
+  navTheme = "auto"
+}) => {
   return /* @__PURE__ */ jsx(
     "svg",
     {
@@ -8,7 +12,7 @@ const Logo = ({ className }) => {
       "data-name": "Layer 1",
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 107.25 132.8",
-      className: cn("text-gray-900 dark:text-white", className),
+      className: cn(NAV_TEXT_CLASSES[navTheme], className),
       children: /* @__PURE__ */ jsx(
         "path",
         {

package/dist/components/icons/logo.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../components/icons/logo.tsx"],"sourcesContent":["import { cn } from '../../lib/utils'\n\nexport const Logo = ({ className }: { className?: string }) => {\n  return (\n    <svg\n      id=\"Layer_1\"\n      data-name=\"Layer 1\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 107.25 132.8\"\n      className={cn('text-gray-900 dark:text-white', className)}\n    >\n      <path\n        d=\"M5.23,48.29A31.58,31.58,0,0,1,2.45,34.87c0-10.09,4.4-18.66,12.74-24.79C24.16,3.48,35.44,0,51.79,0a99.06,99.06,0,0,1,50.83,14L91.21,32.15c-13-7.22-28.55-11.34-41.82-11.34C24.58,20.81,7.84,30.07,5.23,48.29Zm72.17,56.3c-4.59,4.38-13.35,6.35-24.9,6.35-13.49,0-28-4.35-40.85-11.51L0,118.09c16.51,9.56,32.87,14.71,51.51,14.71,22.84,0,32.17-7.9,32.17-16C83.68,111.65,81.3,107.75,77.4,104.59Zm-17.73-49C47,51.11,36.52,45.66,31.93,40.3c-4.87,2.94-8.41,7.53-8.41,13,0,9.71,9.53,16,25.4,21.52,25.39,7.82,51.08,18.74,53.15,38.11a32.5,32.5,0,0,0,5.18-18.27C107.25,70.63,80.76,63,59.67,55.57Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  )\n}\n"],"mappings":"AAWM;AAXN,SAAS,UAAU;AAEZ,MAAM,OAAO,CAAC,EAAE,UAAU,MAA8B;AAC7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,aAAU;AAAA,MACV,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,WAAW,GAAG,iCAAiC,SAAS;AAAA,MAExD;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA;AAAA,EACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../components/icons/logo.tsx"],"sourcesContent":["import { cn } from '../../lib/utils'\nimport { NAV_TEXT_CLASSES, NavTheme } from '../../lib/nav-theme'\n\nexport const Logo = ({\n  className,\n  navTheme = 'auto',\n}: {\n  className?: string\n  navTheme?: NavTheme\n}) => {\n  return (\n    <svg\n      id=\"Layer_1\"\n      data-name=\"Layer 1\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 107.25 132.8\"\n      className={cn(NAV_TEXT_CLASSES[navTheme], className)}\n    >\n      <path\n        d=\"M5.23,48.29A31.58,31.58,0,0,1,2.45,34.87c0-10.09,4.4-18.66,12.74-24.79C24.16,3.48,35.44,0,51.79,0a99.06,99.06,0,0,1,50.83,14L91.21,32.15c-13-7.22-28.55-11.34-41.82-11.34C24.58,20.81,7.84,30.07,5.23,48.29Zm72.17,56.3c-4.59,4.38-13.35,6.35-24.9,6.35-13.49,0-28-4.35-40.85-11.51L0,118.09c16.51,9.56,32.87,14.71,51.51,14.71,22.84,0,32.17-7.9,32.17-16C83.68,111.65,81.3,107.75,77.4,104.59Zm-17.73-49C47,51.11,36.52,45.66,31.93,40.3c-4.87,2.94-8.41,7.53-8.41,13,0,9.71,9.53,16,25.4,21.52,25.39,7.82,51.08,18.74,53.15,38.11a32.5,32.5,0,0,0,5.18-18.27C107.25,70.63,80.76,63,59.67,55.57Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  )\n}\n"],"mappings":"AAkBM;AAlBN,SAAS,UAAU;AACnB,SAAS,wBAAkC;AAEpC,MAAM,OAAO,CAAC;AAAA,EACnB;AAAA,EACA,WAAW;AACb,MAGM;AACJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,aAAU;AAAA,MACV,OAAM;AAAA,MACN,SAAQ;AAAA,MACR,WAAW,GAAG,iBAAiB,QAAQ,GAAG,SAAS;AAAA,MAEnD;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA;AAAA,MACP;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/components/tailwind/contact.cjs

@@ -145,7 +145,7 @@ const Contact = () => {
               autoComplete: "given-name",
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -167,7 +167,7 @@ const Contact = () => {
               autoComplete: "family-name",
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -188,7 +188,7 @@ const Contact = () => {
               id: "company",
               autoComplete: "organization",
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -210,7 +210,7 @@ const Contact = () => {
               autoComplete: "email",
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -256,7 +256,7 @@ const Contact = () => {
                 id: "phone-number",
                 autoComplete: "tel",
                 disabled: status === "loading",
-                className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+                className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
               }
             )
           ] })
@@ -278,7 +278,7 @@ const Contact = () => {
               rows: 4,
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full",
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10",
               defaultValue: ""
             }
           ) })

package/dist/components/tailwind/contact.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../components/tailwind/contact.tsx"],"sourcesContent":["'use client'\nimport { useState } from 'react'\nimport { ChevronDownIcon } from '@heroicons/react/20/solid'\nimport { Switch } from '@headlessui/react'\nimport { Input } from '../ui/input'\nimport { useRecaptcha } from '../../hooks/useRecaptcha'\n\nfunction classNames(...classes: string[]) {\n  return classes.filter(Boolean).join(' ')\n}\n\ntype Status = 'idle' | 'loading' | 'success' | 'error'\n\nexport const Contact = () => {\n  const [agreed, setAgreed] = useState(false)\n  const [status, setStatus] = useState<Status>('idle')\n  const [errorMessage, setErrorMessage] = useState('')\n  const { executeRecaptcha } = useRecaptcha()\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n\n    if (!agreed) {\n      setErrorMessage('You must agree to the privacy policy')\n      return\n    }\n\n    const form = e.currentTarget\n    const data = new FormData(form)\n\n    const recaptchaToken = await executeRecaptcha('contact')\n\n    const body = {\n      firstName: data.get('first-name') as string,\n      lastName: data.get('last-name') as string,\n      company: data.get('company') as string,\n      email: data.get('email') as string,\n      phone: data.get('phone-number') as string,\n      message: data.get('message') as string,\n      agreed: true as const,\n      recaptchaToken: recaptchaToken ?? undefined,\n    }\n\n    setStatus('loading')\n    setErrorMessage('')\n\n    try {\n      const res = await fetch('/api/contact', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify(body),\n      })\n\n      if (!res.ok) {\n        const json = await res.json()\n        throw new Error(json.error ?? 'Something went wrong')\n      }\n\n      setStatus('success')\n      form.reset()\n      setAgreed(false)\n    } catch (err) {\n      setStatus('error')\n      setErrorMessage(\n        err instanceof Error ? err.message : 'Something went wrong',\n      )\n    }\n  }\n\n  if (status === 'success') {\n    return (\n      <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n        <div className=\"mx-auto max-w-2xl text-center\">\n          <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n            Message sent\n          </h2>\n          <p className=\"mt-4 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n            Thanks for reaching out. We&apos;ll get back to you as soon as\n            possible.\n          </p>\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n      <div\n        className=\"absolute inset-x-0 top-[-10rem] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[-20rem]\"\n        aria-hidden=\"true\"\n      >\n        <div\n          className=\"aspect-1155/678 bg-linear-to-tr relative left-1/2 -z-10 w-[36.125rem] max-w-none -translate-x-1/2 rotate-[30deg] from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-40rem)] sm:w-[72.1875rem]\"\n          style={{\n            clipPath:\n              'polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)',\n          }}\n        />\n      </div>\n      <div className=\"mx-auto max-w-2xl text-center\">\n        <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n          Contact us\n        </h2>\n        <p className=\"mt-2 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n          Have a question or want to learn more? Send us a message.\n        </p>\n      </div>\n      <form onSubmit={handleSubmit} className=\"mx-auto mt-16 max-w-xl sm:mt-20\">\n        <div className=\"grid grid-cols-1 gap-x-8 gap-y-6 sm:grid-cols-2\">\n          <div>\n            <label\n              htmlFor=\"first-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              First name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"first-name\"\n                id=\"first-name\"\n                autoComplete=\"given-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div>\n            <label\n              htmlFor=\"last-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Last name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"last-name\"\n                id=\"last-name\"\n                autoComplete=\"family-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"company\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Company\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"company\"\n                id=\"company\"\n                autoComplete=\"organization\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"email\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Email\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"email\"\n                name=\"email\"\n                id=\"email\"\n                autoComplete=\"email\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"phone-number\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Phone number\n            </label>\n            <div className=\"relative mt-2.5\">\n              <div className=\"absolute inset-y-0 left-0 flex items-center\">\n                <label htmlFor=\"country\" className=\"sr-only\">\n                  Country\n                </label>\n                <select\n                  id=\"country\"\n                  name=\"country\"\n                  disabled={status === 'loading'}\n                  className=\"h-full rounded-md border-0 bg-transparent bg-none py-0 pl-4 pr-9 text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm\"\n                >\n                  <option>US</option>\n                  <option>CA</option>\n                  <option>EU</option>\n                </select>\n                <ChevronDownIcon\n                  className=\"pointer-events-none absolute right-3 top-0 h-full w-5 text-gray-400\"\n                  aria-hidden=\"true\"\n                />\n              </div>\n              <Input\n                type=\"tel\"\n                name=\"phone-number\"\n                id=\"phone-number\"\n                autoComplete=\"tel\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"message\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Message\n            </label>\n            <div className=\"mt-2.5\">\n              <textarea\n                name=\"message\"\n                id=\"message\"\n                rows={4}\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n                defaultValue={''}\n              />\n            </div>\n          </div>\n          <Switch.Group as=\"div\" className=\"flex gap-x-4 sm:col-span-2\">\n            <div className=\"flex h-6 items-center\">\n              <Switch\n                checked={agreed}\n                onChange={setAgreed}\n                disabled={status === 'loading'}\n                className={classNames(\n                  agreed ? 'bg-primary-600' : 'bg-gray-200',\n                  'focus-visible:outline-primary-600 flex w-8 flex-none cursor-pointer rounded-full p-px ring-1 ring-inset ring-gray-900/5 transition-colors duration-200 ease-in-out focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',\n                )}\n              >\n                <span className=\"sr-only\">Agree to policies</span>\n                <span\n                  aria-hidden=\"true\"\n                  className={classNames(\n                    agreed ? 'translate-x-3.5' : 'translate-x-0',\n                    'shadow-2xs h-4 w-4 transform rounded-full bg-white ring-1 ring-gray-900/5 transition duration-200 ease-in-out',\n                  )}\n                />\n              </Switch>\n            </div>\n            <Switch.Label className=\"text-sm leading-6 text-gray-600 dark:text-white\">\n              By selecting this, you agree to our{' '}\n              <a\n                href=\"/about/privacy\"\n                className=\"text-primary-600 font-semibold\"\n              >\n                privacy&nbsp;policy\n              </a>\n              .\n            </Switch.Label>\n          </Switch.Group>\n        </div>\n\n        {errorMessage && (\n          <p\n            className=\"mt-4 text-sm text-red-600 dark:text-red-400\"\n            role=\"alert\"\n          >\n            {errorMessage}\n          </p>\n        )}\n\n        <div className=\"mt-10\">\n          <button\n            type=\"submit\"\n            disabled={status === 'loading'}\n            className=\"bg-primary-500 hover:bg-primary-400 focus-visible:outline-primary-500 shadow-2xs flex w-full items-center justify-center rounded-md px-3 py-2 text-sm font-semibold text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-60\"\n          >\n            {status === 'loading' ? 'Sending…' : 'Send message'}\n          </button>\n        </div>\n        <p className=\"mt-4 text-center text-xs text-gray-400 dark:text-gray-500\">\n          This site is protected by reCAPTCHA and the Google{' '}\n          <a\n            href=\"https://policies.google.com/privacy\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Privacy Policy\n          </a>{' '}\n          and{' '}\n          <a\n            href=\"https://policies.google.com/terms\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Terms of Service\n          </a>{' '}\n          apply.\n        </p>\n      </form>\n    </div>\n  )\n}\n"],"mappings":"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","names":["import_react"]}
+{"version":3,"sources":["../../../components/tailwind/contact.tsx"],"sourcesContent":["'use client'\nimport { useState } from 'react'\nimport { ChevronDownIcon } from '@heroicons/react/20/solid'\nimport { Switch } from '@headlessui/react'\nimport { Input } from '../ui/input'\nimport { useRecaptcha } from '../../hooks/useRecaptcha'\n\nfunction classNames(...classes: string[]) {\n  return classes.filter(Boolean).join(' ')\n}\n\ntype Status = 'idle' | 'loading' | 'success' | 'error'\n\nexport const Contact = () => {\n  const [agreed, setAgreed] = useState(false)\n  const [status, setStatus] = useState<Status>('idle')\n  const [errorMessage, setErrorMessage] = useState('')\n  const { executeRecaptcha } = useRecaptcha()\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n\n    if (!agreed) {\n      setErrorMessage('You must agree to the privacy policy')\n      return\n    }\n\n    const form = e.currentTarget\n    const data = new FormData(form)\n\n    const recaptchaToken = await executeRecaptcha('contact')\n\n    const body = {\n      firstName: data.get('first-name') as string,\n      lastName: data.get('last-name') as string,\n      company: data.get('company') as string,\n      email: data.get('email') as string,\n      phone: data.get('phone-number') as string,\n      message: data.get('message') as string,\n      agreed: true as const,\n      recaptchaToken: recaptchaToken ?? undefined,\n    }\n\n    setStatus('loading')\n    setErrorMessage('')\n\n    try {\n      const res = await fetch('/api/contact', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify(body),\n      })\n\n      if (!res.ok) {\n        const json = await res.json()\n        throw new Error(json.error ?? 'Something went wrong')\n      }\n\n      setStatus('success')\n      form.reset()\n      setAgreed(false)\n    } catch (err) {\n      setStatus('error')\n      setErrorMessage(\n        err instanceof Error ? err.message : 'Something went wrong',\n      )\n    }\n  }\n\n  if (status === 'success') {\n    return (\n      <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n        <div className=\"mx-auto max-w-2xl text-center\">\n          <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n            Message sent\n          </h2>\n          <p className=\"mt-4 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n            Thanks for reaching out. We&apos;ll get back to you as soon as\n            possible.\n          </p>\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n      <div\n        className=\"absolute inset-x-0 top-[-10rem] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[-20rem]\"\n        aria-hidden=\"true\"\n      >\n        <div\n          className=\"aspect-1155/678 bg-linear-to-tr relative left-1/2 -z-10 w-[36.125rem] max-w-none -translate-x-1/2 rotate-[30deg] from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-40rem)] sm:w-[72.1875rem]\"\n          style={{\n            clipPath:\n              'polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)',\n          }}\n        />\n      </div>\n      <div className=\"mx-auto max-w-2xl text-center\">\n        <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n          Contact us\n        </h2>\n        <p className=\"mt-2 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n          Have a question or want to learn more? Send us a message.\n        </p>\n      </div>\n      <form onSubmit={handleSubmit} className=\"mx-auto mt-16 max-w-xl sm:mt-20\">\n        <div className=\"grid grid-cols-1 gap-x-8 gap-y-6 sm:grid-cols-2\">\n          <div>\n            <label\n              htmlFor=\"first-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              First name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"first-name\"\n                id=\"first-name\"\n                autoComplete=\"given-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div>\n            <label\n              htmlFor=\"last-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Last name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"last-name\"\n                id=\"last-name\"\n                autoComplete=\"family-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"company\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Company\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"company\"\n                id=\"company\"\n                autoComplete=\"organization\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"email\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Email\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"email\"\n                name=\"email\"\n                id=\"email\"\n                autoComplete=\"email\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"phone-number\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Phone number\n            </label>\n            <div className=\"relative mt-2.5\">\n              <div className=\"absolute inset-y-0 left-0 flex items-center\">\n                <label htmlFor=\"country\" className=\"sr-only\">\n                  Country\n                </label>\n                <select\n                  id=\"country\"\n                  name=\"country\"\n                  disabled={status === 'loading'}\n                  className=\"h-full rounded-md border-0 bg-transparent bg-none py-0 pl-4 pr-9 text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm\"\n                >\n                  <option>US</option>\n                  <option>CA</option>\n                  <option>EU</option>\n                </select>\n                <ChevronDownIcon\n                  className=\"pointer-events-none absolute right-3 top-0 h-full w-5 text-gray-400\"\n                  aria-hidden=\"true\"\n                />\n              </div>\n              <Input\n                type=\"tel\"\n                name=\"phone-number\"\n                id=\"phone-number\"\n                autoComplete=\"tel\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"message\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Message\n            </label>\n            <div className=\"mt-2.5\">\n              <textarea\n                name=\"message\"\n                id=\"message\"\n                rows={4}\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n                defaultValue={''}\n              />\n            </div>\n          </div>\n          <Switch.Group as=\"div\" className=\"flex gap-x-4 sm:col-span-2\">\n            <div className=\"flex h-6 items-center\">\n              <Switch\n                checked={agreed}\n                onChange={setAgreed}\n                disabled={status === 'loading'}\n                className={classNames(\n                  agreed ? 'bg-primary-600' : 'bg-gray-200',\n                  'focus-visible:outline-primary-600 flex w-8 flex-none cursor-pointer rounded-full p-px ring-1 ring-inset ring-gray-900/5 transition-colors duration-200 ease-in-out focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',\n                )}\n              >\n                <span className=\"sr-only\">Agree to policies</span>\n                <span\n                  aria-hidden=\"true\"\n                  className={classNames(\n                    agreed ? 'translate-x-3.5' : 'translate-x-0',\n                    'shadow-2xs h-4 w-4 transform rounded-full bg-white ring-1 ring-gray-900/5 transition duration-200 ease-in-out',\n                  )}\n                />\n              </Switch>\n            </div>\n            <Switch.Label className=\"text-sm leading-6 text-gray-600 dark:text-white\">\n              By selecting this, you agree to our{' '}\n              <a\n                href=\"/about/privacy\"\n                className=\"text-primary-600 font-semibold\"\n              >\n                privacy&nbsp;policy\n              </a>\n              .\n            </Switch.Label>\n          </Switch.Group>\n        </div>\n\n        {errorMessage && (\n          <p\n            className=\"mt-4 text-sm text-red-600 dark:text-red-400\"\n            role=\"alert\"\n          >\n            {errorMessage}\n          </p>\n        )}\n\n        <div className=\"mt-10\">\n          <button\n            type=\"submit\"\n            disabled={status === 'loading'}\n            className=\"bg-primary-500 hover:bg-primary-400 focus-visible:outline-primary-500 shadow-2xs flex w-full items-center justify-center rounded-md px-3 py-2 text-sm font-semibold text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-60\"\n          >\n            {status === 'loading' ? 'Sending…' : 'Send message'}\n          </button>\n        </div>\n        <p className=\"mt-4 text-center text-xs text-gray-400 dark:text-gray-500\">\n          This site is protected by reCAPTCHA and the Google{' '}\n          <a\n            href=\"https://policies.google.com/privacy\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Privacy Policy\n          </a>{' '}\n          and{' '}\n          <a\n            href=\"https://policies.google.com/terms\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Terms of Service\n          </a>{' '}\n          apply.\n        </p>\n      </form>\n    </div>\n  )\n}\n"],"mappings":"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","names":["import_react"]}

package/dist/components/tailwind/contact.js

@@ -122,7 +122,7 @@ const Contact = () => {
               autoComplete: "given-name",
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -144,7 +144,7 @@ const Contact = () => {
               autoComplete: "family-name",
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -165,7 +165,7 @@ const Contact = () => {
               id: "company",
               autoComplete: "organization",
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -187,7 +187,7 @@ const Contact = () => {
               autoComplete: "email",
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
             }
           ) })
         ] }),
@@ -233,7 +233,7 @@ const Contact = () => {
                 id: "phone-number",
                 autoComplete: "tel",
                 disabled: status === "loading",
-                className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full"
+                className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10"
               }
             )
           ] })
@@ -255,7 +255,7 @@ const Contact = () => {
               rows: 4,
               required: true,
               disabled: status === "loading",
-              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full",
+              className: "focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10",
               defaultValue: ""
             }
           ) })

package/dist/components/tailwind/contact.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../components/tailwind/contact.tsx"],"sourcesContent":["'use client'\nimport { useState } from 'react'\nimport { ChevronDownIcon } from '@heroicons/react/20/solid'\nimport { Switch } from '@headlessui/react'\nimport { Input } from '../ui/input'\nimport { useRecaptcha } from '../../hooks/useRecaptcha'\n\nfunction classNames(...classes: string[]) {\n  return classes.filter(Boolean).join(' ')\n}\n\ntype Status = 'idle' | 'loading' | 'success' | 'error'\n\nexport const Contact = () => {\n  const [agreed, setAgreed] = useState(false)\n  const [status, setStatus] = useState<Status>('idle')\n  const [errorMessage, setErrorMessage] = useState('')\n  const { executeRecaptcha } = useRecaptcha()\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n\n    if (!agreed) {\n      setErrorMessage('You must agree to the privacy policy')\n      return\n    }\n\n    const form = e.currentTarget\n    const data = new FormData(form)\n\n    const recaptchaToken = await executeRecaptcha('contact')\n\n    const body = {\n      firstName: data.get('first-name') as string,\n      lastName: data.get('last-name') as string,\n      company: data.get('company') as string,\n      email: data.get('email') as string,\n      phone: data.get('phone-number') as string,\n      message: data.get('message') as string,\n      agreed: true as const,\n      recaptchaToken: recaptchaToken ?? undefined,\n    }\n\n    setStatus('loading')\n    setErrorMessage('')\n\n    try {\n      const res = await fetch('/api/contact', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify(body),\n      })\n\n      if (!res.ok) {\n        const json = await res.json()\n        throw new Error(json.error ?? 'Something went wrong')\n      }\n\n      setStatus('success')\n      form.reset()\n      setAgreed(false)\n    } catch (err) {\n      setStatus('error')\n      setErrorMessage(\n        err instanceof Error ? err.message : 'Something went wrong',\n      )\n    }\n  }\n\n  if (status === 'success') {\n    return (\n      <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n        <div className=\"mx-auto max-w-2xl text-center\">\n          <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n            Message sent\n          </h2>\n          <p className=\"mt-4 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n            Thanks for reaching out. We&apos;ll get back to you as soon as\n            possible.\n          </p>\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n      <div\n        className=\"absolute inset-x-0 top-[-10rem] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[-20rem]\"\n        aria-hidden=\"true\"\n      >\n        <div\n          className=\"aspect-1155/678 bg-linear-to-tr relative left-1/2 -z-10 w-[36.125rem] max-w-none -translate-x-1/2 rotate-[30deg] from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-40rem)] sm:w-[72.1875rem]\"\n          style={{\n            clipPath:\n              'polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)',\n          }}\n        />\n      </div>\n      <div className=\"mx-auto max-w-2xl text-center\">\n        <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n          Contact us\n        </h2>\n        <p className=\"mt-2 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n          Have a question or want to learn more? Send us a message.\n        </p>\n      </div>\n      <form onSubmit={handleSubmit} className=\"mx-auto mt-16 max-w-xl sm:mt-20\">\n        <div className=\"grid grid-cols-1 gap-x-8 gap-y-6 sm:grid-cols-2\">\n          <div>\n            <label\n              htmlFor=\"first-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              First name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"first-name\"\n                id=\"first-name\"\n                autoComplete=\"given-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div>\n            <label\n              htmlFor=\"last-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Last name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"last-name\"\n                id=\"last-name\"\n                autoComplete=\"family-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"company\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Company\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"company\"\n                id=\"company\"\n                autoComplete=\"organization\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"email\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Email\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"email\"\n                name=\"email\"\n                id=\"email\"\n                autoComplete=\"email\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"phone-number\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Phone number\n            </label>\n            <div className=\"relative mt-2.5\">\n              <div className=\"absolute inset-y-0 left-0 flex items-center\">\n                <label htmlFor=\"country\" className=\"sr-only\">\n                  Country\n                </label>\n                <select\n                  id=\"country\"\n                  name=\"country\"\n                  disabled={status === 'loading'}\n                  className=\"h-full rounded-md border-0 bg-transparent bg-none py-0 pl-4 pr-9 text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm\"\n                >\n                  <option>US</option>\n                  <option>CA</option>\n                  <option>EU</option>\n                </select>\n                <ChevronDownIcon\n                  className=\"pointer-events-none absolute right-3 top-0 h-full w-5 text-gray-400\"\n                  aria-hidden=\"true\"\n                />\n              </div>\n              <Input\n                type=\"tel\"\n                name=\"phone-number\"\n                id=\"phone-number\"\n                autoComplete=\"tel\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"message\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Message\n            </label>\n            <div className=\"mt-2.5\">\n              <textarea\n                name=\"message\"\n                id=\"message\"\n                rows={4}\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-white/5 px-3 py-1.5 text-base text-white ring-1 ring-inset ring-white/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full\"\n                defaultValue={''}\n              />\n            </div>\n          </div>\n          <Switch.Group as=\"div\" className=\"flex gap-x-4 sm:col-span-2\">\n            <div className=\"flex h-6 items-center\">\n              <Switch\n                checked={agreed}\n                onChange={setAgreed}\n                disabled={status === 'loading'}\n                className={classNames(\n                  agreed ? 'bg-primary-600' : 'bg-gray-200',\n                  'focus-visible:outline-primary-600 flex w-8 flex-none cursor-pointer rounded-full p-px ring-1 ring-inset ring-gray-900/5 transition-colors duration-200 ease-in-out focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',\n                )}\n              >\n                <span className=\"sr-only\">Agree to policies</span>\n                <span\n                  aria-hidden=\"true\"\n                  className={classNames(\n                    agreed ? 'translate-x-3.5' : 'translate-x-0',\n                    'shadow-2xs h-4 w-4 transform rounded-full bg-white ring-1 ring-gray-900/5 transition duration-200 ease-in-out',\n                  )}\n                />\n              </Switch>\n            </div>\n            <Switch.Label className=\"text-sm leading-6 text-gray-600 dark:text-white\">\n              By selecting this, you agree to our{' '}\n              <a\n                href=\"/about/privacy\"\n                className=\"text-primary-600 font-semibold\"\n              >\n                privacy&nbsp;policy\n              </a>\n              .\n            </Switch.Label>\n          </Switch.Group>\n        </div>\n\n        {errorMessage && (\n          <p\n            className=\"mt-4 text-sm text-red-600 dark:text-red-400\"\n            role=\"alert\"\n          >\n            {errorMessage}\n          </p>\n        )}\n\n        <div className=\"mt-10\">\n          <button\n            type=\"submit\"\n            disabled={status === 'loading'}\n            className=\"bg-primary-500 hover:bg-primary-400 focus-visible:outline-primary-500 shadow-2xs flex w-full items-center justify-center rounded-md px-3 py-2 text-sm font-semibold text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-60\"\n          >\n            {status === 'loading' ? 'Sending…' : 'Send message'}\n          </button>\n        </div>\n        <p className=\"mt-4 text-center text-xs text-gray-400 dark:text-gray-500\">\n          This site is protected by reCAPTCHA and the Google{' '}\n          <a\n            href=\"https://policies.google.com/privacy\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Privacy Policy\n          </a>{' '}\n          and{' '}\n          <a\n            href=\"https://policies.google.com/terms\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Terms of Service\n          </a>{' '}\n          apply.\n        </p>\n      </form>\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../components/tailwind/contact.tsx"],"sourcesContent":["'use client'\nimport { useState } from 'react'\nimport { ChevronDownIcon } from '@heroicons/react/20/solid'\nimport { Switch } from '@headlessui/react'\nimport { Input } from '../ui/input'\nimport { useRecaptcha } from '../../hooks/useRecaptcha'\n\nfunction classNames(...classes: string[]) {\n  return classes.filter(Boolean).join(' ')\n}\n\ntype Status = 'idle' | 'loading' | 'success' | 'error'\n\nexport const Contact = () => {\n  const [agreed, setAgreed] = useState(false)\n  const [status, setStatus] = useState<Status>('idle')\n  const [errorMessage, setErrorMessage] = useState('')\n  const { executeRecaptcha } = useRecaptcha()\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n\n    if (!agreed) {\n      setErrorMessage('You must agree to the privacy policy')\n      return\n    }\n\n    const form = e.currentTarget\n    const data = new FormData(form)\n\n    const recaptchaToken = await executeRecaptcha('contact')\n\n    const body = {\n      firstName: data.get('first-name') as string,\n      lastName: data.get('last-name') as string,\n      company: data.get('company') as string,\n      email: data.get('email') as string,\n      phone: data.get('phone-number') as string,\n      message: data.get('message') as string,\n      agreed: true as const,\n      recaptchaToken: recaptchaToken ?? undefined,\n    }\n\n    setStatus('loading')\n    setErrorMessage('')\n\n    try {\n      const res = await fetch('/api/contact', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify(body),\n      })\n\n      if (!res.ok) {\n        const json = await res.json()\n        throw new Error(json.error ?? 'Something went wrong')\n      }\n\n      setStatus('success')\n      form.reset()\n      setAgreed(false)\n    } catch (err) {\n      setStatus('error')\n      setErrorMessage(\n        err instanceof Error ? err.message : 'Something went wrong',\n      )\n    }\n  }\n\n  if (status === 'success') {\n    return (\n      <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n        <div className=\"mx-auto max-w-2xl text-center\">\n          <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n            Message sent\n          </h2>\n          <p className=\"mt-4 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n            Thanks for reaching out. We&apos;ll get back to you as soon as\n            possible.\n          </p>\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className=\"isolate bg-white px-6 py-24 sm:py-32 lg:px-8 dark:bg-gray-800 dark:text-white\">\n      <div\n        className=\"absolute inset-x-0 top-[-10rem] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[-20rem]\"\n        aria-hidden=\"true\"\n      >\n        <div\n          className=\"aspect-1155/678 bg-linear-to-tr relative left-1/2 -z-10 w-[36.125rem] max-w-none -translate-x-1/2 rotate-[30deg] from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-40rem)] sm:w-[72.1875rem]\"\n          style={{\n            clipPath:\n              'polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)',\n          }}\n        />\n      </div>\n      <div className=\"mx-auto max-w-2xl text-center\">\n        <h2 className=\"text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-gray-100\">\n          Contact us\n        </h2>\n        <p className=\"mt-2 text-lg leading-8 text-gray-600 dark:text-gray-400\">\n          Have a question or want to learn more? Send us a message.\n        </p>\n      </div>\n      <form onSubmit={handleSubmit} className=\"mx-auto mt-16 max-w-xl sm:mt-20\">\n        <div className=\"grid grid-cols-1 gap-x-8 gap-y-6 sm:grid-cols-2\">\n          <div>\n            <label\n              htmlFor=\"first-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              First name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"first-name\"\n                id=\"first-name\"\n                autoComplete=\"given-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div>\n            <label\n              htmlFor=\"last-name\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Last name\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"last-name\"\n                id=\"last-name\"\n                autoComplete=\"family-name\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"company\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Company\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"text\"\n                name=\"company\"\n                id=\"company\"\n                autoComplete=\"organization\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"email\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Email\n            </label>\n            <div className=\"mt-2.5\">\n              <Input\n                type=\"email\"\n                name=\"email\"\n                id=\"email\"\n                autoComplete=\"email\"\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"phone-number\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Phone number\n            </label>\n            <div className=\"relative mt-2.5\">\n              <div className=\"absolute inset-y-0 left-0 flex items-center\">\n                <label htmlFor=\"country\" className=\"sr-only\">\n                  Country\n                </label>\n                <select\n                  id=\"country\"\n                  name=\"country\"\n                  disabled={status === 'loading'}\n                  className=\"h-full rounded-md border-0 bg-transparent bg-none py-0 pl-4 pr-9 text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm\"\n                >\n                  <option>US</option>\n                  <option>CA</option>\n                  <option>EU</option>\n                </select>\n                <ChevronDownIcon\n                  className=\"pointer-events-none absolute right-3 top-0 h-full w-5 text-gray-400\"\n                  aria-hidden=\"true\"\n                />\n              </div>\n              <Input\n                type=\"tel\"\n                name=\"phone-number\"\n                id=\"phone-number\"\n                autoComplete=\"tel\"\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n              />\n            </div>\n          </div>\n          <div className=\"sm:col-span-2\">\n            <label\n              htmlFor=\"message\"\n              className=\"block text-sm font-semibold leading-6 text-gray-900 dark:text-white\"\n            >\n              Message\n            </label>\n            <div className=\"mt-2.5\">\n              <textarea\n                name=\"message\"\n                id=\"message\"\n                rows={4}\n                required\n                disabled={status === 'loading'}\n                className=\"focus:ring-primary-500 shadow-2xs w-full min-w-0 appearance-none rounded-md border-0 bg-gray-900/5 px-3 py-1.5 text-base text-gray-900 ring-1 ring-inset ring-gray-900/10 placeholder:text-gray-500 focus:ring-2 focus:ring-inset sm:w-64 sm:text-sm sm:leading-6 xl:w-full dark:bg-white/5 dark:text-white dark:ring-white/10\"\n                defaultValue={''}\n              />\n            </div>\n          </div>\n          <Switch.Group as=\"div\" className=\"flex gap-x-4 sm:col-span-2\">\n            <div className=\"flex h-6 items-center\">\n              <Switch\n                checked={agreed}\n                onChange={setAgreed}\n                disabled={status === 'loading'}\n                className={classNames(\n                  agreed ? 'bg-primary-600' : 'bg-gray-200',\n                  'focus-visible:outline-primary-600 flex w-8 flex-none cursor-pointer rounded-full p-px ring-1 ring-inset ring-gray-900/5 transition-colors duration-200 ease-in-out focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',\n                )}\n              >\n                <span className=\"sr-only\">Agree to policies</span>\n                <span\n                  aria-hidden=\"true\"\n                  className={classNames(\n                    agreed ? 'translate-x-3.5' : 'translate-x-0',\n                    'shadow-2xs h-4 w-4 transform rounded-full bg-white ring-1 ring-gray-900/5 transition duration-200 ease-in-out',\n                  )}\n                />\n              </Switch>\n            </div>\n            <Switch.Label className=\"text-sm leading-6 text-gray-600 dark:text-white\">\n              By selecting this, you agree to our{' '}\n              <a\n                href=\"/about/privacy\"\n                className=\"text-primary-600 font-semibold\"\n              >\n                privacy&nbsp;policy\n              </a>\n              .\n            </Switch.Label>\n          </Switch.Group>\n        </div>\n\n        {errorMessage && (\n          <p\n            className=\"mt-4 text-sm text-red-600 dark:text-red-400\"\n            role=\"alert\"\n          >\n            {errorMessage}\n          </p>\n        )}\n\n        <div className=\"mt-10\">\n          <button\n            type=\"submit\"\n            disabled={status === 'loading'}\n            className=\"bg-primary-500 hover:bg-primary-400 focus-visible:outline-primary-500 shadow-2xs flex w-full items-center justify-center rounded-md px-3 py-2 text-sm font-semibold text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-60\"\n          >\n            {status === 'loading' ? 'Sending…' : 'Send message'}\n          </button>\n        </div>\n        <p className=\"mt-4 text-center text-xs text-gray-400 dark:text-gray-500\">\n          This site is protected by reCAPTCHA and the Google{' '}\n          <a\n            href=\"https://policies.google.com/privacy\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Privacy Policy\n          </a>{' '}\n          and{' '}\n          <a\n            href=\"https://policies.google.com/terms\"\n            className=\"underline hover:text-gray-600 dark:hover:text-gray-300\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            Terms of Service\n          </a>{' '}\n          apply.\n        </p>\n      </form>\n    </div>\n  )\n}\n"],"mappings":"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","names":[]}

package/dist/components/tailwind/pricing.cjs

@@ -100,28 +100,28 @@ const Pricing = ({ onSubscribe }) => {
       setLoading(false);
     }
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "bg-gray-900", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("main", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto mt-16 max-w-7xl px-6 sm:mt-32 lg:px-8", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "bg-white dark:bg-gray-900", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("main", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto mt-16 max-w-7xl px-6 sm:mt-32 lg:px-8", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto max-w-4xl text-center", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-base font-semibold leading-7 text-indigo-400", children: "Pricing" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-2 text-4xl font-bold tracking-tight text-white sm:text-5xl", children: "Start free. Upgrade when you're ready." })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-base font-semibold leading-7 text-indigo-600 dark:text-indigo-400", children: "Pricing" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-2 text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl dark:text-white", children: "Start free. Upgrade when you're ready." })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mx-auto mt-6 max-w-2xl text-center text-lg leading-8 text-gray-300", children: "Build your story bible for free. Subscribe for unlimited worlds, characters, and creative freedom." }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mx-auto mt-6 max-w-2xl text-center text-lg leading-8 text-gray-600 dark:text-gray-300", children: "Build your story bible for free. Subscribe for unlimited worlds, characters, and creative freedom." }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "isolate mx-auto mt-16 grid max-w-2xl grid-cols-1 gap-8 lg:mx-0 lg:max-w-none lg:grid-cols-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-3xl p-8 ring-1 ring-white/10 xl:p-10", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-3xl p-8 ring-1 ring-gray-900/10 xl:p-10 dark:ring-white/10", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-x-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-lg font-semibold leading-8 text-white", children: "Preview" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "rounded-full bg-white/10 px-2.5 py-1 text-xs font-semibold leading-5 text-white", children: "Free forever" })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-lg font-semibold leading-8 text-gray-900 dark:text-white", children: "Preview" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "rounded-full bg-gray-900/5 px-2.5 py-1 text-xs font-semibold leading-5 text-gray-900 dark:bg-white/10 dark:text-white", children: "Free forever" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-4 text-sm leading-6 text-gray-300", children: "Explore Story Bible and start building your creative world with no commitment." }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-4 text-sm leading-6 text-gray-600 dark:text-gray-300", children: "Explore Story Bible and start building your creative world with no commitment." }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "mt-6 flex items-baseline gap-x-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-4xl font-bold tracking-tight text-white", children: "$0" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-semibold leading-6 text-gray-300", children: "/month" })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-4xl font-bold tracking-tight text-gray-900 dark:text-white", children: "$0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-semibold leading-6 text-gray-600 dark:text-gray-300", children: "/month" })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "a",
           {
             href: "/signin",
-            className: "mt-6 block rounded-md bg-white/10 px-3 py-2 text-center text-sm font-semibold leading-6 text-white hover:bg-white/20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white",
+            className: "mt-6 block rounded-md bg-gray-900/10 px-3 py-2 text-center text-sm font-semibold leading-6 text-gray-900 hover:bg-gray-900/20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-900 dark:bg-white/10 dark:text-white dark:hover:bg-white/20 dark:focus-visible:outline-white",
             children: "Get started free"
           }
         ),
@@ -129,12 +129,12 @@ const Pricing = ({ onSubscribe }) => {
           "ul",
           {
             role: "list",
-            className: "mt-8 space-y-3 text-sm leading-6 text-gray-300 xl:mt-10",
+            className: "mt-8 space-y-3 text-sm leading-6 text-gray-600 xl:mt-10 dark:text-gray-300",
             children: FREE_FEATURES.map((feature) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { className: "flex gap-x-3", children: [
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                 import_lucide_react.Check,
                 {
-                  className: "h-6 w-5 flex-none text-white",
+                  className: "h-6 w-5 flex-none text-gray-900 dark:text-white",
                   "aria-hidden": "true"
                 }
               ),
@@ -143,15 +143,15 @@ const Pricing = ({ onSubscribe }) => {
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-3xl bg-white/5 p-8 ring-2 ring-indigo-500 xl:p-10", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-3xl bg-gray-900/5 p-8 ring-2 ring-indigo-500 xl:p-10 dark:bg-white/5", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-x-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-lg font-semibold leading-8 text-white", children: "Pro" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-lg font-semibold leading-8 text-gray-900 dark:text-white", children: "Pro" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "rounded-full bg-indigo-500 px-2.5 py-1 text-xs font-semibold leading-5 text-white", children: "Most popular" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-4 text-sm leading-6 text-gray-300", children: "Unlock unlimited stories, characters, locations, and timelines. Build entire universes." }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-4 text-sm leading-6 text-gray-600 dark:text-gray-300", children: "Unlock unlimited stories, characters, locations, and timelines. Build entire universes." }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "mt-6 flex items-baseline gap-x-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-4xl font-bold tracking-tight text-white", children: "$9.99" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-semibold leading-6 text-gray-300", children: "/month" })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-4xl font-bold tracking-tight text-gray-900 dark:text-white", children: "$9.99" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm font-semibold leading-6 text-gray-600 dark:text-gray-300", children: "/month" })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
           "button",
@@ -168,17 +168,17 @@ const Pricing = ({ onSubscribe }) => {
             ]
           }
         ),
-        error && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-3 text-center text-sm text-red-400", children: error }),
+        error && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-3 text-center text-sm text-red-600 dark:text-red-400", children: error }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "ul",
           {
             role: "list",
-            className: "mt-8 space-y-3 text-sm leading-6 text-gray-300 xl:mt-10",
+            className: "mt-8 space-y-3 text-sm leading-6 text-gray-600 xl:mt-10 dark:text-gray-300",
             children: PRO_FEATURES.map((feature) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { className: "flex gap-x-3", children: [
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                 import_lucide_react.Check,
                 {
-                  className: "h-6 w-5 flex-none text-white",
+                  className: "h-6 w-5 flex-none text-gray-900 dark:text-white",
                   "aria-hidden": "true"
                 }
               ),
@@ -189,19 +189,19 @@ const Pricing = ({ onSubscribe }) => {
       ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto mt-24 max-w-2xl pb-24", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-2xl font-bold leading-10 tracking-tight text-white", children: "Frequently asked questions" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-2xl font-bold leading-10 tracking-tight text-gray-900 dark:text-white", children: "Frequently asked questions" }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("dl", { className: "mt-10 space-y-8", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", { className: "text-base font-semibold leading-7 text-white", children: "Can I cancel anytime?" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", { className: "mt-2 text-base leading-7 text-gray-300", children: "Yes. You can cancel at any time from the subscription management page. You retain Pro access until the end of your current billing period." })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", { className: "text-base font-semibold leading-7 text-gray-900 dark:text-white", children: "Can I cancel anytime?" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", { className: "mt-2 text-base leading-7 text-gray-600 dark:text-gray-300", children: "Yes. You can cancel at any time from the subscription management page. You retain Pro access until the end of your current billing period." })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", { className: "text-base font-semibold leading-7 text-white", children: "What happens to my data if I downgrade?" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", { className: "mt-2 text-base leading-7 text-gray-300", children: "Your existing stories and characters are never deleted. You'll just be unable to create new ones beyond the preview limits until you resubscribe." })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", { className: "text-base font-semibold leading-7 text-gray-900 dark:text-white", children: "What happens to my data if I downgrade?" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", { className: "mt-2 text-base leading-7 text-gray-600 dark:text-gray-300", children: "Your existing stories and characters are never deleted. You'll just be unable to create new ones beyond the preview limits until you resubscribe." })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", { className: "text-base font-semibold leading-7 text-white", children: "Is billing monthly or annually?" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", { className: "mt-2 text-base leading-7 text-gray-300", children: "Currently monthly only. Annual billing with a discount is coming soon." })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", { className: "text-base font-semibold leading-7 text-gray-900 dark:text-white", children: "Is billing monthly or annually?" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", { className: "mt-2 text-base leading-7 text-gray-600 dark:text-gray-300", children: "Currently monthly only. Annual billing with a discount is coming soon." })
         ] })
       ] })
     ] })