@promakeai/cli 0.9.9 → 0.9.10

package/dist/registry/coming-soon-page-minimal.json

@@ -14,25 +14,25 @@
       "path": "coming-soon-page-minimal/index.ts",
       "type": "registry:index",
       "target": "$modules$/coming-soon-page-minimal/index.ts",
-      "content": "export * from \"./coming-soon-page-minimal\";\r\nexport { default } from \"./coming-soon-page-minimal\";\r\n"
+      "content": "export * from \"./coming-soon-page-minimal\";\nexport { default } from \"./coming-soon-page-minimal\";\n"
     },
     {
       "path": "coming-soon-page-minimal/coming-soon-page-minimal.tsx",
       "type": "registry:page",
       "target": "$modules$/coming-soon-page-minimal/coming-soon-page-minimal.tsx",
-      "content": "import { useState, useEffect, useMemo } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { usePageTitle } from \"@/hooks/use-page-title\";\r\nimport { ArrowRight } from \"lucide-react\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { Input } from \"@/components/ui/input\";\r\nimport { cn } from \"@/lib/utils\";\r\n\r\ninterface ComingSoonPageMinimalProps {\r\n  launchDate?: Date;\r\n  className?: string;\r\n}\r\n\r\n// Default launch date: 30 days from initial load\r\nconst DEFAULT_LAUNCH_DATE = new Date(Date.now() + 30 * 24 * 60 * 60 * 1000);\r\n\r\nexport function ComingSoonPageMinimal({\r\n  launchDate: launchDateProp,\r\n  className\r\n}: ComingSoonPageMinimalProps) {\r\n  const { t } = useTranslation(\"coming-soon-page-minimal\");\r\n  usePageTitle({ title: t(\"title\", \"Coming Soon\") });\r\n\r\n  const launchDate = useMemo(() => launchDateProp ?? DEFAULT_LAUNCH_DATE, [launchDateProp]);\r\n\r\n  const [email, setEmail] = useState(\"\");\r\n  const [isSubmitted, setIsSubmitted] = useState(false);\r\n  const [days, setDays] = useState(0);\r\n\r\n  useEffect(() => {\r\n    const calculateDays = () => {\r\n      const difference = launchDate.getTime() - new Date().getTime();\r\n      if (difference > 0) {\r\n        setDays(Math.floor(difference / (1000 * 60 * 60 * 24)));\r\n      }\r\n    };\r\n    calculateDays();\r\n    const timer = setInterval(calculateDays, 60000);\r\n    return () => clearInterval(timer);\r\n  }, [launchDate]);\r\n\r\n  const handleSubmit = (e: React.FormEvent) => {\r\n    e.preventDefault();\r\n    setIsSubmitted(true);\r\n    setEmail(\"\");\r\n  };\r\n\r\n  return (\r\n    <div className={cn(\r\n      \"min-h-screen flex flex-col items-center justify-center bg-background px-4\",\r\n      className\r\n    )}>\r\n      <div className=\"max-w-3xl mx-auto text-center\">\r\n        {/* Large countdown number */}\r\n        <div className=\"mb-8\">\r\n          <span className=\"text-[12rem] md:text-[16rem] lg:text-[20rem] font-bold leading-none text-primary/10\">\r\n            {days}\r\n          </span>\r\n        </div>\r\n\r\n        {/* Heading overlaid */}\r\n        <div className=\"-mt-32 md:-mt-48 lg:-mt-64 relative z-10 mb-12\">\r\n          <p className=\"text-sm uppercase tracking-[0.3em] text-muted-foreground mb-4\">\r\n            {t(\"daysLeft\", \"days until launch\")}\r\n          </p>\r\n          <h1 className=\"text-4xl md:text-6xl lg:text-7xl font-bold text-foreground mb-6\">\r\n            {t(\"heading\", \"Coming Soon\")}\r\n          </h1>\r\n          <p className=\"text-lg text-muted-foreground max-w-lg mx-auto\">\r\n            {t(\"description\", \"We're crafting something beautiful. Leave your email to get notified.\")}\r\n          </p>\r\n        </div>\r\n\r\n        {/* Email signup */}\r\n        <div className=\"max-w-sm mx-auto\">\r\n          {!isSubmitted ? (\r\n            <form onSubmit={handleSubmit} className=\"relative\">\r\n              <Input\r\n                type=\"email\"\r\n                value={email}\r\n                onChange={(e) => setEmail(e.target.value)}\r\n                placeholder={t(\"emailPlaceholder\", \"your@email.com\")}\r\n                required\r\n                className=\"h-14 pr-14 text-base\"\r\n              />\r\n              <Button\r\n                type=\"submit\"\r\n                size=\"icon\"\r\n                className=\"absolute right-2 top-1/2 -translate-y-1/2 h-10 w-10 rounded-full\"\r\n              >\r\n                <ArrowRight className=\"h-5 w-5\" />\r\n              </Button>\r\n            </form>\r\n          ) : (\r\n            <p className=\"text-primary font-medium py-4\">\r\n              {t(\"success\", \"We'll be in touch!\")}\r\n            </p>\r\n          )}\r\n        </div>\r\n      </div>\r\n\r\n      {/* Bottom decoration line */}\r\n      <div className=\"absolute bottom-0 left-0 right-0 h-1 bg-gradient-to-r from-transparent via-primary/50 to-transparent\" />\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default ComingSoonPageMinimal;\r\n"
+      "content": "import { useState, useEffect, useMemo } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { usePageTitle } from \"@/hooks/use-page-title\";\nimport { ArrowRight } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { cn } from \"@/lib/utils\";\n\ninterface ComingSoonPageMinimalProps {\n  launchDate?: Date;\n  className?: string;\n}\n\n// Default launch date: 30 days from initial load\nconst DEFAULT_LAUNCH_DATE = new Date(Date.now() + 30 * 24 * 60 * 60 * 1000);\n\nexport function ComingSoonPageMinimal({\n  launchDate: launchDateProp,\n  className\n}: ComingSoonPageMinimalProps) {\n  const { t } = useTranslation(\"coming-soon-page-minimal\");\n  usePageTitle({ title: t(\"title\", \"Coming Soon\") });\n\n  const launchDate = useMemo(() => launchDateProp ?? DEFAULT_LAUNCH_DATE, [launchDateProp]);\n\n  const [email, setEmail] = useState(\"\");\n  const [isSubmitted, setIsSubmitted] = useState(false);\n  const [days, setDays] = useState(0);\n\n  useEffect(() => {\n    const calculateDays = () => {\n      const difference = launchDate.getTime() - new Date().getTime();\n      if (difference > 0) {\n        setDays(Math.floor(difference / (1000 * 60 * 60 * 24)));\n      }\n    };\n    calculateDays();\n    const timer = setInterval(calculateDays, 60000);\n    return () => clearInterval(timer);\n  }, [launchDate]);\n\n  const handleSubmit = (e: React.FormEvent) => {\n    e.preventDefault();\n    setIsSubmitted(true);\n    setEmail(\"\");\n  };\n\n  return (\n    <div className={cn(\n      \"min-h-screen flex flex-col items-center justify-center bg-background px-4\",\n      className\n    )}>\n      <div className=\"max-w-3xl mx-auto text-center\">\n        {/* Large countdown number */}\n        <div className=\"mb-8\">\n          <span className=\"text-[12rem] md:text-[16rem] lg:text-[20rem] font-bold leading-none text-primary/10\">\n            {days}\n          </span>\n        </div>\n\n        {/* Heading overlaid */}\n        <div className=\"-mt-32 md:-mt-48 lg:-mt-64 relative z-10 mb-12\">\n          <p className=\"text-sm uppercase tracking-[0.3em] text-muted-foreground mb-4\">\n            {t(\"daysLeft\", \"days until launch\")}\n          </p>\n          <h1 className=\"text-4xl md:text-6xl lg:text-7xl font-bold text-foreground mb-6\">\n            {t(\"heading\", \"Coming Soon\")}\n          </h1>\n          <p className=\"text-lg text-muted-foreground max-w-lg mx-auto\">\n            {t(\"description\", \"We're crafting something beautiful. Leave your email to get notified.\")}\n          </p>\n        </div>\n\n        {/* Email signup */}\n        <div className=\"max-w-sm mx-auto\">\n          {!isSubmitted ? (\n            <form onSubmit={handleSubmit} className=\"relative\">\n              <Input\n                type=\"email\"\n                value={email}\n                onChange={(e) => setEmail(e.target.value)}\n                placeholder={t(\"emailPlaceholder\", \"your@email.com\")}\n                required\n                className=\"h-14 pr-14 text-base\"\n              />\n              <Button\n                type=\"submit\"\n                size=\"icon\"\n                className=\"absolute right-2 top-1/2 -translate-y-1/2 h-10 w-10 rounded-full\"\n              >\n                <ArrowRight className=\"h-5 w-5\" />\n              </Button>\n            </form>\n          ) : (\n            <p className=\"text-primary font-medium py-4\">\n              {t(\"success\", \"We'll be in touch!\")}\n            </p>\n          )}\n        </div>\n      </div>\n\n      {/* Bottom decoration line */}\n      <div className=\"absolute bottom-0 left-0 right-0 h-1 bg-gradient-to-r from-transparent via-primary/50 to-transparent\" />\n    </div>\n  );\n}\n\nexport default ComingSoonPageMinimal;\n"
     },
     {
       "path": "coming-soon-page-minimal/lang/en.json",
       "type": "registry:lang",
       "target": "$modules$/coming-soon-page-minimal/lang/en.json",
-      "content": "{\r\n  \"title\": \"Coming Soon\",\r\n  \"daysLeft\": \"days until launch\",\r\n  \"heading\": \"Coming Soon\",\r\n  \"description\": \"We're crafting something beautiful. Stay tuned!\",\r\n  \"emailPlaceholder\": \"your@email.com\",\r\n  \"success\": \"We'll be in touch!\"\r\n}"
+      "content": "{\n  \"title\": \"Coming Soon\",\n  \"daysLeft\": \"days until launch\",\n  \"heading\": \"Coming Soon\",\n  \"description\": \"We're crafting something beautiful. Stay tuned!\",\n  \"emailPlaceholder\": \"your@email.com\",\n  \"success\": \"We'll be in touch!\"\n}"
     },
     {
       "path": "coming-soon-page-minimal/lang/tr.json",
       "type": "registry:lang",
       "target": "$modules$/coming-soon-page-minimal/lang/tr.json",
-      "content": "{\r\n  \"title\": \"Yakında\",\r\n  \"daysLeft\": \"gün kaldı\",\r\n  \"heading\": \"Yakında\",\r\n  \"description\": \"Güzel bir şey hazırlıyoruz. Haberdar olmak için e-postanızı bırakın.\",\r\n  \"emailPlaceholder\": \"ornek@email.com\",\r\n  \"success\": \"Sizinle iletişime geçeceğiz!\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"Yakında\",\n  \"daysLeft\": \"gün kaldı\",\n  \"heading\": \"Yakında\",\n  \"description\": \"Güzel bir şey hazırlıyoruz. Haberdar olmak için e-postanızı bırakın.\",\n  \"emailPlaceholder\": \"ornek@email.com\",\n  \"success\": \"Sizinle iletişime geçeceğiz!\"\n}\n"
     }
   ],
   "exports": {

package/dist/registry/coming-soon-page.json

@@ -16,25 +16,25 @@
       "path": "coming-soon-page/index.ts",
       "type": "registry:index",
       "target": "$modules$/coming-soon-page/index.ts",
-      "content": "export * from \"./coming-soon-page\";\r\nexport { default } from \"./coming-soon-page\";\r\n"
+      "content": "export * from \"./coming-soon-page\";\nexport { default } from \"./coming-soon-page\";\n"
     },
     {
       "path": "coming-soon-page/coming-soon-page.tsx",
       "type": "registry:page",
       "target": "$modules$/coming-soon-page/coming-soon-page.tsx",
-      "content": "import { useState, useEffect, useMemo } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { usePageTitle } from \"@/hooks/use-page-title\";\r\nimport { Mail, Twitter, Instagram, Github, Linkedin } from \"lucide-react\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { Input } from \"@/components/ui/input\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { FadeIn, ScaleUp } from \"@/modules/animations\";\r\n\r\ninterface ComingSoonPageProps {\r\n  launchDate?: Date;\r\n  className?: string;\r\n}\r\n\r\ninterface TimeLeft {\r\n  days: number;\r\n  hours: number;\r\n  minutes: number;\r\n  seconds: number;\r\n}\r\n\r\n// Default launch date: 30 days from initial load\r\nconst DEFAULT_LAUNCH_DATE = new Date(Date.now() + 30 * 24 * 60 * 60 * 1000);\r\n\r\nexport function ComingSoonPage({\r\n  launchDate: launchDateProp,\r\n  className\r\n}: ComingSoonPageProps) {\r\n  const { t } = useTranslation(\"coming-soon-page\");\r\n  usePageTitle({ title: t(\"title\", \"Coming Soon\") });\r\n\r\n  const launchDate = useMemo(() => launchDateProp ?? DEFAULT_LAUNCH_DATE, [launchDateProp]);\r\n\r\n  const [email, setEmail] = useState(\"\");\r\n  const [isSubmitted, setIsSubmitted] = useState(false);\r\n  const [timeLeft, setTimeLeft] = useState<TimeLeft>({ days: 0, hours: 0, minutes: 0, seconds: 0 });\r\n\r\n  useEffect(() => {\r\n    const calculateTimeLeft = () => {\r\n      const difference = launchDate.getTime() - new Date().getTime();\r\n\r\n      if (difference > 0) {\r\n        setTimeLeft({\r\n          days: Math.floor(difference / (1000 * 60 * 60 * 24)),\r\n          hours: Math.floor((difference / (1000 * 60 * 60)) % 24),\r\n          minutes: Math.floor((difference / 1000 / 60) % 60),\r\n          seconds: Math.floor((difference / 1000) % 60),\r\n        });\r\n      }\r\n    };\r\n\r\n    calculateTimeLeft();\r\n    const timer = setInterval(calculateTimeLeft, 1000);\r\n    return () => clearInterval(timer);\r\n  }, [launchDate]);\r\n\r\n  const handleSubmit = (e: React.FormEvent) => {\r\n    e.preventDefault();\r\n    // Handle email submission\r\n    setIsSubmitted(true);\r\n    setEmail(\"\");\r\n  };\r\n\r\n  const socialLinks = [\r\n    { icon: Twitter, href: \"#\", label: \"Twitter\" },\r\n    { icon: Instagram, href: \"#\", label: \"Instagram\" },\r\n    { icon: Github, href: \"#\", label: \"GitHub\" },\r\n    { icon: Linkedin, href: \"#\", label: \"LinkedIn\" },\r\n  ];\r\n\r\n  const timeUnits = [\r\n    { value: timeLeft.days, label: t(\"days\", \"Days\") },\r\n    { value: timeLeft.hours, label: t(\"hours\", \"Hours\") },\r\n    { value: timeLeft.minutes, label: t(\"minutes\", \"Minutes\") },\r\n    { value: timeLeft.seconds, label: t(\"seconds\", \"Seconds\") },\r\n  ];\r\n\r\n  return (\r\n    <div className={cn(\r\n      \"min-h-screen flex flex-col items-center justify-center relative overflow-hidden\",\r\n      \"bg-gradient-to-br from-background via-muted/50 to-background\",\r\n      className\r\n    )}>\r\n      {/* Background decoration */}\r\n      <div className=\"absolute inset-0 overflow-hidden pointer-events-none\">\r\n        <div className=\"absolute -top-1/2 -left-1/2 w-full h-full bg-primary/5 rounded-full blur-3xl\" />\r\n        <div className=\"absolute -bottom-1/2 -right-1/2 w-full h-full bg-primary/10 rounded-full blur-3xl\" />\r\n      </div>\r\n\r\n      <div className=\"relative z-10 w-full max-w-[var(--container-max-width)] mx-auto px-4 py-12 text-center\">\r\n        {/* Heading */}\r\n        <FadeIn className=\"mb-6\">\r\n          <h1 className=\"text-4xl md:text-5xl lg:text-6xl font-bold text-foreground mb-4\">\r\n            {t(\"heading\", \"Something Amazing is Coming\")}\r\n          </h1>\r\n          <p className=\"text-lg md:text-xl text-muted-foreground max-w-2xl mx-auto\">\r\n            {t(\"description\", \"We're working hard to bring you something special. Stay tuned and be the first to know when we launch.\")}\r\n          </p>\r\n        </FadeIn>\r\n\r\n        {/* Countdown */}\r\n        <ScaleUp delay={0.1} className=\"mb-12\">\r\n          <div className=\"flex justify-center gap-4 md:gap-8\">\r\n            {timeUnits.map((unit, index) => (\r\n              <div key={index} className=\"flex flex-col items-center\">\r\n                <div className=\"w-16 h-16 md:w-24 md:h-24 bg-card border border-border rounded-2xl flex items-center justify-center shadow-lg\">\r\n                  <span className=\"text-2xl md:text-4xl font-bold text-foreground\">\r\n                    {String(unit.value).padStart(2, \"0\")}\r\n                  </span>\r\n                </div>\r\n                <span className=\"mt-2 text-xs md:text-sm text-muted-foreground uppercase tracking-wide\">\r\n                  {unit.label}\r\n                </span>\r\n              </div>\r\n            ))}\r\n          </div>\r\n        </ScaleUp>\r\n\r\n        {/* Email signup */}\r\n        <FadeIn delay={0.2} className=\"mb-12\">\r\n          {!isSubmitted ? (\r\n            <form onSubmit={handleSubmit} className=\"flex flex-col sm:flex-row gap-3 max-w-md mx-auto\">\r\n              <div className=\"relative flex-1\">\r\n                <Mail className=\"absolute left-3 top-1/2 -translate-y-1/2 h-5 w-5 text-muted-foreground\" />\r\n                <Input\r\n                  type=\"email\"\r\n                  value={email}\r\n                  onChange={(e) => setEmail(e.target.value)}\r\n                  placeholder={t(\"emailPlaceholder\", \"Enter your email\")}\r\n                  required\r\n                  className=\"pl-10 h-12\"\r\n                />\r\n              </div>\r\n              <Button type=\"submit\" size=\"lg\" className=\"h-12\">\r\n                {t(\"notify\", \"Notify Me\")}\r\n              </Button>\r\n            </form>\r\n          ) : (\r\n            <div className=\"bg-primary/10 border border-primary/20 rounded-lg p-4 max-w-md mx-auto\">\r\n              <p className=\"text-primary font-medium\">\r\n                {t(\"success\", \"Thank you! We'll notify you when we launch.\")}\r\n              </p>\r\n            </div>\r\n          )}\r\n        </FadeIn>\r\n\r\n        {/* Social links */}\r\n        <FadeIn delay={0.3}>\r\n          <p className=\"text-sm text-muted-foreground mb-4\">\r\n            {t(\"followUs\", \"Follow us for updates\")}\r\n          </p>\r\n          <div className=\"flex justify-center gap-4\">\r\n            {socialLinks.map((social, index) => (\r\n              <a\r\n                key={index}\r\n                href={social.href}\r\n                aria-label={social.label}\r\n                className=\"w-10 h-10 rounded-full bg-muted hover:bg-primary/10 flex items-center justify-center transition-colors\"\r\n              >\r\n                <social.icon className=\"h-5 w-5 text-muted-foreground hover:text-primary transition-colors\" />\r\n              </a>\r\n            ))}\r\n          </div>\r\n        </FadeIn>\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default ComingSoonPage;\r\n"
+      "content": "import { useState, useEffect, useMemo } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { usePageTitle } from \"@/hooks/use-page-title\";\nimport { Mail, Twitter, Instagram, Github, Linkedin } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { cn } from \"@/lib/utils\";\nimport { FadeIn, ScaleUp } from \"@/modules/animations\";\n\ninterface ComingSoonPageProps {\n  launchDate?: Date;\n  className?: string;\n}\n\ninterface TimeLeft {\n  days: number;\n  hours: number;\n  minutes: number;\n  seconds: number;\n}\n\n// Default launch date: 30 days from initial load\nconst DEFAULT_LAUNCH_DATE = new Date(Date.now() + 30 * 24 * 60 * 60 * 1000);\n\nexport function ComingSoonPage({\n  launchDate: launchDateProp,\n  className\n}: ComingSoonPageProps) {\n  const { t } = useTranslation(\"coming-soon-page\");\n  usePageTitle({ title: t(\"title\", \"Coming Soon\") });\n\n  const launchDate = useMemo(() => launchDateProp ?? DEFAULT_LAUNCH_DATE, [launchDateProp]);\n\n  const [email, setEmail] = useState(\"\");\n  const [isSubmitted, setIsSubmitted] = useState(false);\n  const [timeLeft, setTimeLeft] = useState<TimeLeft>({ days: 0, hours: 0, minutes: 0, seconds: 0 });\n\n  useEffect(() => {\n    const calculateTimeLeft = () => {\n      const difference = launchDate.getTime() - new Date().getTime();\n\n      if (difference > 0) {\n        setTimeLeft({\n          days: Math.floor(difference / (1000 * 60 * 60 * 24)),\n          hours: Math.floor((difference / (1000 * 60 * 60)) % 24),\n          minutes: Math.floor((difference / 1000 / 60) % 60),\n          seconds: Math.floor((difference / 1000) % 60),\n        });\n      }\n    };\n\n    calculateTimeLeft();\n    const timer = setInterval(calculateTimeLeft, 1000);\n    return () => clearInterval(timer);\n  }, [launchDate]);\n\n  const handleSubmit = (e: React.FormEvent) => {\n    e.preventDefault();\n    // Handle email submission\n    setIsSubmitted(true);\n    setEmail(\"\");\n  };\n\n  const socialLinks = [\n    { icon: Twitter, href: \"#\", label: \"Twitter\" },\n    { icon: Instagram, href: \"#\", label: \"Instagram\" },\n    { icon: Github, href: \"#\", label: \"GitHub\" },\n    { icon: Linkedin, href: \"#\", label: \"LinkedIn\" },\n  ];\n\n  const timeUnits = [\n    { value: timeLeft.days, label: t(\"days\", \"Days\") },\n    { value: timeLeft.hours, label: t(\"hours\", \"Hours\") },\n    { value: timeLeft.minutes, label: t(\"minutes\", \"Minutes\") },\n    { value: timeLeft.seconds, label: t(\"seconds\", \"Seconds\") },\n  ];\n\n  return (\n    <div className={cn(\n      \"min-h-screen flex flex-col items-center justify-center relative overflow-hidden\",\n      \"bg-gradient-to-br from-background via-muted/50 to-background\",\n      className\n    )}>\n      {/* Background decoration */}\n      <div className=\"absolute inset-0 overflow-hidden pointer-events-none\">\n        <div className=\"absolute -top-1/2 -left-1/2 w-full h-full bg-primary/5 rounded-full blur-3xl\" />\n        <div className=\"absolute -bottom-1/2 -right-1/2 w-full h-full bg-primary/10 rounded-full blur-3xl\" />\n      </div>\n\n      <div className=\"relative z-10 w-full max-w-[var(--container-max-width)] mx-auto px-4 py-12 text-center\">\n        {/* Heading */}\n        <FadeIn className=\"mb-6\">\n          <h1 className=\"text-4xl md:text-5xl lg:text-6xl font-bold text-foreground mb-4\">\n            {t(\"heading\", \"Something Amazing is Coming\")}\n          </h1>\n          <p className=\"text-lg md:text-xl text-muted-foreground max-w-2xl mx-auto\">\n            {t(\"description\", \"We're working hard to bring you something special. Stay tuned and be the first to know when we launch.\")}\n          </p>\n        </FadeIn>\n\n        {/* Countdown */}\n        <ScaleUp delay={0.1} className=\"mb-12\">\n          <div className=\"flex justify-center gap-4 md:gap-8\">\n            {timeUnits.map((unit, index) => (\n              <div key={index} className=\"flex flex-col items-center\">\n                <div className=\"w-16 h-16 md:w-24 md:h-24 bg-card border border-border rounded-2xl flex items-center justify-center shadow-lg\">\n                  <span className=\"text-2xl md:text-4xl font-bold text-foreground\">\n                    {String(unit.value).padStart(2, \"0\")}\n                  </span>\n                </div>\n                <span className=\"mt-2 text-xs md:text-sm text-muted-foreground uppercase tracking-wide\">\n                  {unit.label}\n                </span>\n              </div>\n            ))}\n          </div>\n        </ScaleUp>\n\n        {/* Email signup */}\n        <FadeIn delay={0.2} className=\"mb-12\">\n          {!isSubmitted ? (\n            <form onSubmit={handleSubmit} className=\"flex flex-col sm:flex-row gap-3 max-w-md mx-auto\">\n              <div className=\"relative flex-1\">\n                <Mail className=\"absolute left-3 top-1/2 -translate-y-1/2 h-5 w-5 text-muted-foreground\" />\n                <Input\n                  type=\"email\"\n                  value={email}\n                  onChange={(e) => setEmail(e.target.value)}\n                  placeholder={t(\"emailPlaceholder\", \"Enter your email\")}\n                  required\n                  className=\"pl-10 h-12\"\n                />\n              </div>\n              <Button type=\"submit\" size=\"lg\" className=\"h-12\">\n                {t(\"notify\", \"Notify Me\")}\n              </Button>\n            </form>\n          ) : (\n            <div className=\"bg-primary/10 border border-primary/20 rounded-lg p-4 max-w-md mx-auto\">\n              <p className=\"text-primary font-medium\">\n                {t(\"success\", \"Thank you! We'll notify you when we launch.\")}\n              </p>\n            </div>\n          )}\n        </FadeIn>\n\n        {/* Social links */}\n        <FadeIn delay={0.3}>\n          <p className=\"text-sm text-muted-foreground mb-4\">\n            {t(\"followUs\", \"Follow us for updates\")}\n          </p>\n          <div className=\"flex justify-center gap-4\">\n            {socialLinks.map((social, index) => (\n              <a\n                key={index}\n                href={social.href}\n                aria-label={social.label}\n                className=\"w-10 h-10 rounded-full bg-muted hover:bg-primary/10 flex items-center justify-center transition-colors\"\n              >\n                <social.icon className=\"h-5 w-5 text-muted-foreground hover:text-primary transition-colors\" />\n              </a>\n            ))}\n          </div>\n        </FadeIn>\n      </div>\n    </div>\n  );\n}\n\nexport default ComingSoonPage;\n"
     },
     {
       "path": "coming-soon-page/lang/en.json",
       "type": "registry:lang",
       "target": "$modules$/coming-soon-page/lang/en.json",
-      "content": "{\r\n  \"title\": \"Coming Soon\",\r\n  \"heading\": \"Something Amazing is Coming\",\r\n  \"description\": \"Build anticipation for your launch. Explain what's coming and why it's exciting.\",\r\n  \"days\": \"Days\",\r\n  \"hours\": \"Hours\",\r\n  \"minutes\": \"Minutes\",\r\n  \"seconds\": \"Seconds\",\r\n  \"emailPlaceholder\": \"Enter your email\",\r\n  \"notify\": \"Notify Me\",\r\n  \"success\": \"Thank you! We'll notify you when we launch.\",\r\n  \"followUs\": \"Follow us for updates\"\r\n}"
+      "content": "{\n  \"title\": \"Coming Soon\",\n  \"heading\": \"Something Amazing is Coming\",\n  \"description\": \"Build anticipation for your launch. Explain what's coming and why it's exciting.\",\n  \"days\": \"Days\",\n  \"hours\": \"Hours\",\n  \"minutes\": \"Minutes\",\n  \"seconds\": \"Seconds\",\n  \"emailPlaceholder\": \"Enter your email\",\n  \"notify\": \"Notify Me\",\n  \"success\": \"Thank you! We'll notify you when we launch.\",\n  \"followUs\": \"Follow us for updates\"\n}"
     },
     {
       "path": "coming-soon-page/lang/tr.json",
       "type": "registry:lang",
       "target": "$modules$/coming-soon-page/lang/tr.json",
-      "content": "{\r\n  \"title\": \"Yakında\",\r\n  \"heading\": \"Harika Bir Şey Geliyor\",\r\n  \"description\": \"Lansmanınız için heyecan yaratın. Nelerin geleceğini ve neden heyecan verici olduğunu anlatın.\",\r\n  \"days\": \"Gün\",\r\n  \"hours\": \"Saat\",\r\n  \"minutes\": \"Dakika\",\r\n  \"seconds\": \"Saniye\",\r\n  \"emailPlaceholder\": \"E-posta adresiniz\",\r\n  \"notify\": \"Beni Bilgilendir\",\r\n  \"success\": \"Teşekkürler! Lansman yapıldığında sizi bilgilendireceğiz.\",\r\n  \"followUs\": \"Güncellemeler için bizi takip edin\"\r\n}"
+      "content": "{\n  \"title\": \"Yakında\",\n  \"heading\": \"Harika Bir Şey Geliyor\",\n  \"description\": \"Lansmanınız için heyecan yaratın. Nelerin geleceğini ve neden heyecan verici olduğunu anlatın.\",\n  \"days\": \"Gün\",\n  \"hours\": \"Saat\",\n  \"minutes\": \"Dakika\",\n  \"seconds\": \"Saniye\",\n  \"emailPlaceholder\": \"E-posta adresiniz\",\n  \"notify\": \"Beni Bilgilendir\",\n  \"success\": \"Teşekkürler! Lansman yapıldığında sizi bilgilendireceğiz.\",\n  \"followUs\": \"Güncellemeler için bizi takip edin\"\n}"
     }
   ],
   "exports": {

package/dist/registry/contact-info-grid.json

@@ -10,25 +10,25 @@
       "path": "contact-info-grid/index.ts",
       "type": "registry:index",
       "target": "$modules$/contact-info-grid/index.ts",
-      "content": "export * from './contact-info-grid';\r\n"
+      "content": "export * from './contact-info-grid';\n"
     },
     {
       "path": "contact-info-grid/contact-info-grid.tsx",
       "type": "registry:component",
       "target": "$modules$/contact-info-grid/contact-info-grid.tsx",
-      "content": "import { Mail, MapPin, MessageCircle, Phone } from \"lucide-react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport constants from \"@/constants/constants.json\";\r\n\r\ninterface ContactInfoGridProps {\r\n  className?: string;\r\n}\r\n\r\nexport function ContactInfoGrid({ className }: ContactInfoGridProps) {\r\n  const { t } = useTranslation(\"contact-info-grid\");\r\n\r\n  const contactItems = [\r\n    {\r\n      icon: Mail,\r\n      label: t(\"emailLabel\", \"Email\"),\r\n      description: t(\"emailDesc\", \"We respond to all emails within 24 hours.\"),\r\n      value: constants.email || \"hello@example.com\",\r\n      href: `mailto:${constants.email || \"hello@example.com\"}`,\r\n    },\r\n    {\r\n      icon: MapPin,\r\n      label: t(\"officeLabel\", \"Office\"),\r\n      description: t(\"officeDesc\", \"Drop by our office for a chat.\"),\r\n      value: `${constants.address?.line1 || \"\"}, ${constants.address?.city || \"\"}`,\r\n      href: \"#\",\r\n    },\r\n    {\r\n      icon: Phone,\r\n      label: t(\"phoneLabel\", \"Phone\"),\r\n      description: t(\"phoneDesc\", \"We're available Mon-Fri, 9am-5pm.\"),\r\n      value: constants.phone || \"+1 234 567 890\",\r\n      href: `tel:${constants.phone || \"+1234567890\"}`,\r\n    },\r\n    {\r\n      icon: MessageCircle,\r\n      label: t(\"chatLabel\", \"Live Chat\"),\r\n      description: t(\"chatDesc\", \"Get instant help from our support team.\"),\r\n      value: t(\"startChat\", \"Start Chat\"),\r\n      href: \"#\",\r\n    },\r\n  ];\r\n\r\n  return (\r\n    <section className={cn(\"py-16 md:py-24\", className)}>\r\n      <div className=\"w-full max-w-[var(--container-max-width)] mx-auto px-4\">\r\n        <div className=\"mb-12\">\r\n          <h2 className=\"text-3xl font-bold md:text-4xl mb-4\">\r\n            {t(\"title\", \"Get in Touch\")}\r\n          </h2>\r\n          <p className=\"text-lg text-muted-foreground max-w-xl\">\r\n            {t(\"subtitle\", \"Have questions? We'd love to hear from you. Choose your preferred way to reach us.\")}\r\n          </p>\r\n        </div>\r\n\r\n        <div className=\"grid sm:grid-cols-2 lg:grid-cols-4 gap-6\">\r\n          {contactItems.map((item, index) => (\r\n            <div\r\n              key={index}\r\n              className=\"rounded-xl bg-muted/50 p-6 hover:bg-muted transition-colors\"\r\n            >\r\n              <span className=\"mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-primary/10\">\r\n                <item.icon className=\"h-6 w-6 text-primary\" />\r\n              </span>\r\n              <h3 className=\"mb-2 text-lg font-semibold\">{item.label}</h3>\r\n              <p className=\"mb-3 text-sm text-muted-foreground\">\r\n                {item.description}\r\n              </p>\r\n              <a\r\n                href={item.href}\r\n                className=\"text-sm font-semibold text-primary hover:underline\"\r\n              >\r\n                {item.value}\r\n              </a>\r\n            </div>\r\n          ))}\r\n        </div>\r\n      </div>\r\n    </section>\r\n  );\r\n}\r\n"
+      "content": "import { Mail, MapPin, MessageCircle, Phone } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"@/lib/utils\";\nimport constants from \"@/constants/constants.json\";\n\ninterface ContactInfoGridProps {\n  className?: string;\n}\n\nexport function ContactInfoGrid({ className }: ContactInfoGridProps) {\n  const { t } = useTranslation(\"contact-info-grid\");\n\n  const contactItems = [\n    {\n      icon: Mail,\n      label: t(\"emailLabel\", \"Email\"),\n      description: t(\"emailDesc\", \"We respond to all emails within 24 hours.\"),\n      value: constants.email || \"hello@example.com\",\n      href: `mailto:${constants.email || \"hello@example.com\"}`,\n    },\n    {\n      icon: MapPin,\n      label: t(\"officeLabel\", \"Office\"),\n      description: t(\"officeDesc\", \"Drop by our office for a chat.\"),\n      value: `${constants.address?.line1 || \"\"}, ${constants.address?.city || \"\"}`,\n      href: \"#\",\n    },\n    {\n      icon: Phone,\n      label: t(\"phoneLabel\", \"Phone\"),\n      description: t(\"phoneDesc\", \"We're available Mon-Fri, 9am-5pm.\"),\n      value: constants.phone || \"+1 234 567 890\",\n      href: `tel:${constants.phone || \"+1234567890\"}`,\n    },\n    {\n      icon: MessageCircle,\n      label: t(\"chatLabel\", \"Live Chat\"),\n      description: t(\"chatDesc\", \"Get instant help from our support team.\"),\n      value: t(\"startChat\", \"Start Chat\"),\n      href: \"#\",\n    },\n  ];\n\n  return (\n    <section className={cn(\"py-16 md:py-24\", className)}>\n      <div className=\"w-full max-w-[var(--container-max-width)] mx-auto px-4\">\n        <div className=\"mb-12\">\n          <h2 className=\"text-3xl font-bold md:text-4xl mb-4\">\n            {t(\"title\", \"Get in Touch\")}\n          </h2>\n          <p className=\"text-lg text-muted-foreground max-w-xl\">\n            {t(\"subtitle\", \"Have questions? We'd love to hear from you. Choose your preferred way to reach us.\")}\n          </p>\n        </div>\n\n        <div className=\"grid sm:grid-cols-2 lg:grid-cols-4 gap-6\">\n          {contactItems.map((item, index) => (\n            <div\n              key={index}\n              className=\"rounded-xl bg-muted/50 p-6 hover:bg-muted transition-colors\"\n            >\n              <span className=\"mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-primary/10\">\n                <item.icon className=\"h-6 w-6 text-primary\" />\n              </span>\n              <h3 className=\"mb-2 text-lg font-semibold\">{item.label}</h3>\n              <p className=\"mb-3 text-sm text-muted-foreground\">\n                {item.description}\n              </p>\n              <a\n                href={item.href}\n                className=\"text-sm font-semibold text-primary hover:underline\"\n              >\n                {item.value}\n              </a>\n            </div>\n          ))}\n        </div>\n      </div>\n    </section>\n  );\n}\n"
     },
     {
       "path": "contact-info-grid/lang/en.json",
       "type": "registry:lang",
       "target": "$modules$/contact-info-grid/lang/en.json",
-      "content": "{\r\n  \"title\": \"Get in Touch\",\r\n  \"subtitle\": \"This text introduces your contact information grid. Explain the different ways visitors can reach you and any important details about your contact preferences or availability. Use Promake to provide clear, helpful guidance for getting in touch.\",\r\n  \"emailLabel\": \"Email\",\r\n  \"emailDesc\": \"We respond to all emails within 24 hours.\",\r\n  \"officeLabel\": \"Office\",\r\n  \"officeDesc\": \"Drop by our office for a chat.\",\r\n  \"phoneLabel\": \"Phone\",\r\n  \"phoneDesc\": \"We're available Mon-Fri, 9am-5pm.\",\r\n  \"chatLabel\": \"Live Chat\",\r\n  \"chatDesc\": \"Get instant help from our support team.\",\r\n  \"startChat\": \"Start Chat\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"Get in Touch\",\n  \"subtitle\": \"This text introduces your contact information grid. Explain the different ways visitors can reach you and any important details about your contact preferences or availability. Use Promake to provide clear, helpful guidance for getting in touch.\",\n  \"emailLabel\": \"Email\",\n  \"emailDesc\": \"We respond to all emails within 24 hours.\",\n  \"officeLabel\": \"Office\",\n  \"officeDesc\": \"Drop by our office for a chat.\",\n  \"phoneLabel\": \"Phone\",\n  \"phoneDesc\": \"We're available Mon-Fri, 9am-5pm.\",\n  \"chatLabel\": \"Live Chat\",\n  \"chatDesc\": \"Get instant help from our support team.\",\n  \"startChat\": \"Start Chat\"\n}\n"
     },
     {
       "path": "contact-info-grid/lang/tr.json",
       "type": "registry:lang",
       "target": "$modules$/contact-info-grid/lang/tr.json",
-      "content": "{\r\n  \"title\": \"İletişime Geçin\",\r\n  \"subtitle\": \"Bu metin iletişim bilgileri tablosunu tanıtır. Ziyaretçilerin size ulaşabilecekleri farklı yolları ve iletişim tercihleriniz veya müsaitliğinizle ilgili önemli detayları açıklayın. Promake ile iletişime geçmek için açık ve faydalı rehberlik sağlayın.\",\r\n  \"emailLabel\": \"E-posta\",\r\n  \"emailDesc\": \"Tüm e-postalara 24 saat içinde yanıt veriyoruz.\",\r\n  \"officeLabel\": \"Ofis\",\r\n  \"officeDesc\": \"Sohbet etmek için ofisimize uğrayın.\",\r\n  \"phoneLabel\": \"Telefon\",\r\n  \"phoneDesc\": \"Pazartesi-Cuma, 9:00-17:00 arası müsaitiz.\",\r\n  \"chatLabel\": \"Canlı Sohbet\",\r\n  \"chatDesc\": \"Destek ekibimizden anında yardım alın.\",\r\n  \"startChat\": \"Sohbet Başlat\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"İletişime Geçin\",\n  \"subtitle\": \"Bu metin iletişim bilgileri tablosunu tanıtır. Ziyaretçilerin size ulaşabilecekleri farklı yolları ve iletişim tercihleriniz veya müsaitliğinizle ilgili önemli detayları açıklayın. Promake ile iletişime geçmek için açık ve faydalı rehberlik sağlayın.\",\n  \"emailLabel\": \"E-posta\",\n  \"emailDesc\": \"Tüm e-postalara 24 saat içinde yanıt veriyoruz.\",\n  \"officeLabel\": \"Ofis\",\n  \"officeDesc\": \"Sohbet etmek için ofisimize uğrayın.\",\n  \"phoneLabel\": \"Telefon\",\n  \"phoneDesc\": \"Pazartesi-Cuma, 9:00-17:00 arası müsaitiz.\",\n  \"chatLabel\": \"Canlı Sohbet\",\n  \"chatDesc\": \"Destek ekibimizden anında yardım alın.\",\n  \"startChat\": \"Sohbet Başlat\"\n}\n"
     }
   ],
   "exports": {

package/dist/registry/contact-page-centered.json

@@ -19,25 +19,25 @@
       "path": "contact-page-centered/index.ts",
       "type": "registry:index",
       "target": "$modules$/contact-page-centered/index.ts",
-      "content": "export * from './contact-page-centered';\r\nexport { ContactPageCentered as default } from './contact-page-centered';\r\n"
+      "content": "export * from './contact-page-centered';\nexport { ContactPageCentered as default } from './contact-page-centered';\n"
     },
     {
       "path": "contact-page-centered/contact-page-centered.tsx",
       "type": "registry:component",
       "target": "$modules$/contact-page-centered/contact-page-centered.tsx",
-      "content": "import React, { useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { usePageTitle } from \"@/hooks/use-page-title\";\r\nimport { Mail, Phone, MapPin } from \"lucide-react\";\r\nimport { Layout } from \"@/components/Layout\";\r\nimport { useApiService } from \"@/lib/api\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { Input } from \"@/components/ui/input\";\r\nimport { Textarea } from \"@/components/ui/textarea\";\r\nimport { Card, CardContent } from \"@/components/ui/card\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport constants from \"@/constants/constants.json\";\r\nimport { FormFileInput } from \"@/components/FormFileInput\";\r\nimport { FormField } from \"@/components/FormField\";\r\n\r\ninterface ContactPageCenteredProps {\r\n  className?: string;\r\n}\r\n\r\nexport function ContactPageCentered({ className }: ContactPageCenteredProps) {\r\n  const { t } = useTranslation(\"contact-page-centered\");\r\n  usePageTitle({ title: t(\"title\", \"Contact Us\") });\r\n  const apiService = useApiService();\r\n  const fileMaxFiles = constants.file?.maxFiles || 5;\r\n\r\n  const [formData, setFormData] = useState({\r\n    name: \"\",\r\n    email: \"\",\r\n    message: \"\",\r\n    attachments: [] as File[]\r\n  });\r\n  const [isSubmitting, setIsSubmitting] = useState(false);\r\n  const [submitStatus, setSubmitStatus] = useState<\"idle\" | \"success\" | \"error\">(\"idle\");\r\n\r\n  const contactCards = [\r\n    {\r\n      icon: Mail,\r\n      title: t(\"emailTitle\", \"Email\"),\r\n      value: constants.email || \"hello@example.com\",\r\n      href: `mailto:${constants.email || \"hello@example.com\"}`,\r\n    },\r\n    {\r\n      icon: Phone,\r\n      title: t(\"phoneTitle\", \"Phone\"),\r\n      value: constants.phone || \"+1 234 567 890\",\r\n      href: `tel:${constants.phone || \"+1234567890\"}`,\r\n    },\r\n    {\r\n      icon: MapPin,\r\n      title: t(\"addressTitle\", \"Address\"),\r\n      value: constants.address?.city || \"New York, USA\",\r\n      href: \"#\",\r\n    },\r\n  ];\r\n  const handleFileUploadChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const selectedFiles = Array.from(e.target.files || []) as File[];\r\n\r\n    const remainingSlots = fileMaxFiles - formData.attachments.length;\r\n\r\n    // If the limit is exceeded, alert and do not add any files\r\n    if (selectedFiles.length > remainingSlots) {\r\n      alert(t(\"maxFilesLimit\", { max: fileMaxFiles }));\r\n      e.target.value = ''; // Clear the input\r\n      return;\r\n    }\r\n\r\n    setFormData(prev => ({\r\n      ...prev,\r\n      attachments: [...prev.attachments, ...selectedFiles]\r\n    }));\r\n\r\n    e.target.value = ''; // Clear the input\r\n  }\r\n  const handleRemoveFile = (index: number) => {\r\n    setFormData(prev => ({\r\n      ...prev,\r\n      attachments: prev.attachments.filter((_, i) => i !== index)\r\n    }));\r\n  };\r\n  const handleSubmit = async (e: React.FormEvent) => {\r\n    e.preventDefault();\r\n    setIsSubmitting(true);\r\n    setSubmitStatus(\"idle\");\r\n\r\n    try {\r\n      await apiService.submitFormWithFile(\r\n        formData,\r\n        {\r\n          email_subject1: \"Thank you for contacting us\",\r\n          email_subject2: \"New Contact Form Submission\",\r\n          fields: [\r\n            { name: \"name\", required: true },\r\n            { name: \"email\", required: true },\r\n            { name: \"message\", required: true },\r\n            { name: \"attachments\", required: false },\r\n          ],\r\n        },\r\n        constants.site.defaultLanguage\r\n      );\r\n\r\n      setSubmitStatus(\"success\");\r\n      setFormData({ name: \"\", email: \"\", message: \"\", attachments: [] });\r\n      setTimeout(() => setSubmitStatus(\"idle\"), 5000);\r\n    } catch {\r\n      setSubmitStatus(\"error\");\r\n      setTimeout(() => setSubmitStatus(\"idle\"), 5000);\r\n    } finally {\r\n      setIsSubmitting(false);\r\n    }\r\n  };\r\n\r\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n    setFormData((prev) => ({ ...prev, [e.target.name]: e.target.value }));\r\n  };\r\n\r\n  return (\r\n    <Layout>\r\n      <div className={cn(\"min-h-screen bg-muted/30 py-16 md:py-24\", className)}>\r\n        <div className=\"w-full max-w-[var(--container-max-width)] mx-auto px-4 max-w-4xl\">\r\n          {/* Header */}\r\n          <div className=\"text-center mb-12\">\r\n            <h1 className=\"text-4xl font-bold mb-4\">{t(\"title\", \"Contact Us\")}</h1>\r\n            <p className=\"text-lg text-muted-foreground max-w-2xl mx-auto\">\r\n              {t(\"subtitle\", \"We'd love to hear from you. Send us a message and we'll respond as soon as possible.\")}\r\n            </p>\r\n          </div>\r\n\r\n          {/* Contact Cards */}\r\n          <div className=\"grid sm:grid-cols-3 gap-4 mb-12\">\r\n            {contactCards.map((card, index) => (\r\n              <Card key={index} className=\"text-center\">\r\n                <CardContent className=\"pt-6\">\r\n                  <div className=\"mx-auto w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center mb-4\">\r\n                    <card.icon className=\"h-6 w-6 text-primary\" />\r\n                  </div>\r\n                  <h3 className=\"font-semibold mb-1\">{card.title}</h3>\r\n                  <a\r\n                    href={card.href}\r\n                    className=\"text-sm text-muted-foreground hover:text-primary transition-colors\"\r\n                  >\r\n                    {card.value}\r\n                  </a>\r\n                </CardContent>\r\n              </Card>\r\n            ))}\r\n          </div>\r\n\r\n          {/* Form */}\r\n          <Card>\r\n            <CardContent className=\"pt-6\">\r\n              <form onSubmit={handleSubmit} className=\"space-y-6\">\r\n                <div className=\"grid sm:grid-cols-2 gap-4\">\r\n                  <FormField label={t(\"nameLabel\", \"Name\")} htmlFor=\"name\" required>\r\n                    <Input\r\n                      id=\"name\"\r\n                      name=\"name\"\r\n                      value={formData.name}\r\n                      onChange={handleChange}\r\n                      placeholder={t(\"namePlaceholder\", \"Your name\")}\r\n                      required\r\n                      className=\"mt-1\"\r\n                    />\r\n                  </FormField>\r\n                  <FormField label={t(\"emailLabel\", \"Email\")} htmlFor=\"email\" required>\r\n                    <Input\r\n                      id=\"email\"\r\n                      name=\"email\"\r\n                      type=\"email\"\r\n                      value={formData.email}\r\n                      onChange={handleChange}\r\n                      placeholder={t(\"emailPlaceholder\", \"your@email.com\")}\r\n                      required\r\n                      className=\"mt-1\"\r\n                    />\r\n                  </FormField>\r\n                </div>\r\n                <FormField label={t(\"messageLabel\", \"Message\")} htmlFor=\"message\" required>\r\n                  <Textarea\r\n                    id=\"message\"\r\n                    name=\"message\"\r\n                    value={formData.message}\r\n                    onChange={handleChange}\r\n                    placeholder={t(\"messagePlaceholder\", \"How can we help you?\")}\r\n                    required\r\n                    rows={6}\r\n                    className=\"mt-1 resize-none\"\r\n                  />\r\n                </FormField>\r\n                <FormFileInput\r\n                  files={formData.attachments}\r\n                  onFilesChange={handleFileUploadChange}\r\n                  handleRemoveFile={handleRemoveFile}\r\n                  maxFiles={constants.file?.maxFiles || 5}\r\n                  accept={constants.file?.accept || \".pdf,.doc,.docx,.jpg,.jpeg,.png\"}\r\n                  disabled={isSubmitting}\r\n                  uploadButtonText={t(\"addFiles\")}\r\n                  maxFilesReachedText={t(\"maxFilesReached\")}\r\n                />\r\n                {submitStatus === \"success\" && (\r\n                  <div className=\"p-4 bg-green-500/10 border border-green-500/30 rounded-lg\">\r\n                    <p className=\"text-green-600 dark:text-green-400 text-sm font-medium\">\r\n                      {t(\"success\", \"Message sent successfully! We'll get back to you soon.\")}\r\n                    </p>\r\n                  </div>\r\n                )}\r\n\r\n                {submitStatus === \"error\" && (\r\n                  <div className=\"p-4 bg-destructive/10 border border-destructive/30 rounded-lg\">\r\n                    <p className=\"text-destructive text-sm font-medium\">\r\n                      {t(\"error\", \"Something went wrong. Please try again.\")}\r\n                    </p>\r\n                  </div>\r\n                )}\r\n\r\n                <Button type=\"submit\" size=\"lg\" className=\"w-full\" disabled={isSubmitting}>\r\n                  {isSubmitting ? t(\"sending\", \"Sending...\") : t(\"submit\", \"Send Message\")}\r\n                </Button>\r\n              </form>\r\n            </CardContent>\r\n          </Card>\r\n        </div>\r\n      </div>\r\n    </Layout>\r\n  );\r\n}\r\n\r\nexport default ContactPageCentered;\r\n"
+      "content": "import React, { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { usePageTitle } from \"@/hooks/use-page-title\";\nimport { Mail, Phone, MapPin } from \"lucide-react\";\nimport { Layout } from \"@/components/Layout\";\nimport { useApiService } from \"@/lib/api\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Textarea } from \"@/components/ui/textarea\";\nimport { Card, CardContent } from \"@/components/ui/card\";\nimport { cn } from \"@/lib/utils\";\nimport constants from \"@/constants/constants.json\";\nimport { FormFileInput } from \"@/components/FormFileInput\";\nimport { FormField } from \"@/components/FormField\";\n\ninterface ContactPageCenteredProps {\n  className?: string;\n}\n\nexport function ContactPageCentered({ className }: ContactPageCenteredProps) {\n  const { t } = useTranslation(\"contact-page-centered\");\n  usePageTitle({ title: t(\"title\", \"Contact Us\") });\n  const apiService = useApiService();\n  const fileMaxFiles = constants.file?.maxFiles || 5;\n\n  const [formData, setFormData] = useState({\n    name: \"\",\n    email: \"\",\n    message: \"\",\n    attachments: [] as File[]\n  });\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [submitStatus, setSubmitStatus] = useState<\"idle\" | \"success\" | \"error\">(\"idle\");\n\n  const contactCards = [\n    {\n      icon: Mail,\n      title: t(\"emailTitle\", \"Email\"),\n      value: constants.email || \"hello@example.com\",\n      href: `mailto:${constants.email || \"hello@example.com\"}`,\n    },\n    {\n      icon: Phone,\n      title: t(\"phoneTitle\", \"Phone\"),\n      value: constants.phone || \"+1 234 567 890\",\n      href: `tel:${constants.phone || \"+1234567890\"}`,\n    },\n    {\n      icon: MapPin,\n      title: t(\"addressTitle\", \"Address\"),\n      value: constants.address?.city || \"New York, USA\",\n      href: \"#\",\n    },\n  ];\n  const handleFileUploadChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const selectedFiles = Array.from(e.target.files || []) as File[];\n\n    const remainingSlots = fileMaxFiles - formData.attachments.length;\n\n    // If the limit is exceeded, alert and do not add any files\n    if (selectedFiles.length > remainingSlots) {\n      alert(t(\"maxFilesLimit\", { max: fileMaxFiles }));\n      e.target.value = ''; // Clear the input\n      return;\n    }\n\n    setFormData(prev => ({\n      ...prev,\n      attachments: [...prev.attachments, ...selectedFiles]\n    }));\n\n    e.target.value = ''; // Clear the input\n  }\n  const handleRemoveFile = (index: number) => {\n    setFormData(prev => ({\n      ...prev,\n      attachments: prev.attachments.filter((_, i) => i !== index)\n    }));\n  };\n  const handleSubmit = async (e: React.FormEvent) => {\n    e.preventDefault();\n    setIsSubmitting(true);\n    setSubmitStatus(\"idle\");\n\n    try {\n      await apiService.submitFormWithFile(\n        formData,\n        {\n          email_subject1: \"Thank you for contacting us\",\n          email_subject2: \"New Contact Form Submission\",\n          fields: [\n            { name: \"name\", required: true },\n            { name: \"email\", required: true },\n            { name: \"message\", required: true },\n            { name: \"attachments\", required: false },\n          ],\n        },\n        constants.site.defaultLanguage\n      );\n\n      setSubmitStatus(\"success\");\n      setFormData({ name: \"\", email: \"\", message: \"\", attachments: [] });\n      setTimeout(() => setSubmitStatus(\"idle\"), 5000);\n    } catch {\n      setSubmitStatus(\"error\");\n      setTimeout(() => setSubmitStatus(\"idle\"), 5000);\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n    setFormData((prev) => ({ ...prev, [e.target.name]: e.target.value }));\n  };\n\n  return (\n    <Layout>\n      <div className={cn(\"min-h-screen bg-muted/30 py-16 md:py-24\", className)}>\n        <div className=\"w-full max-w-[var(--container-max-width)] mx-auto px-4 max-w-4xl\">\n          {/* Header */}\n          <div className=\"text-center mb-12\">\n            <h1 className=\"text-4xl font-bold mb-4\">{t(\"title\", \"Contact Us\")}</h1>\n            <p className=\"text-lg text-muted-foreground max-w-2xl mx-auto\">\n              {t(\"subtitle\", \"We'd love to hear from you. Send us a message and we'll respond as soon as possible.\")}\n            </p>\n          </div>\n\n          {/* Contact Cards */}\n          <div className=\"grid sm:grid-cols-3 gap-4 mb-12\">\n            {contactCards.map((card, index) => (\n              <Card key={index} className=\"text-center\">\n                <CardContent className=\"pt-6\">\n                  <div className=\"mx-auto w-12 h-12 rounded-full bg-primary/10 flex items-center justify-center mb-4\">\n                    <card.icon className=\"h-6 w-6 text-primary\" />\n                  </div>\n                  <h3 className=\"font-semibold mb-1\">{card.title}</h3>\n                  <a\n                    href={card.href}\n                    className=\"text-sm text-muted-foreground hover:text-primary transition-colors\"\n                  >\n                    {card.value}\n                  </a>\n                </CardContent>\n              </Card>\n            ))}\n          </div>\n\n          {/* Form */}\n          <Card>\n            <CardContent className=\"pt-6\">\n              <form onSubmit={handleSubmit} className=\"space-y-6\">\n                <div className=\"grid sm:grid-cols-2 gap-4\">\n                  <FormField label={t(\"nameLabel\", \"Name\")} htmlFor=\"name\" required>\n                    <Input\n                      id=\"name\"\n                      name=\"name\"\n                      value={formData.name}\n                      onChange={handleChange}\n                      placeholder={t(\"namePlaceholder\", \"Your name\")}\n                      required\n                      className=\"mt-1\"\n                    />\n                  </FormField>\n                  <FormField label={t(\"emailLabel\", \"Email\")} htmlFor=\"email\" required>\n                    <Input\n                      id=\"email\"\n                      name=\"email\"\n                      type=\"email\"\n                      value={formData.email}\n                      onChange={handleChange}\n                      placeholder={t(\"emailPlaceholder\", \"your@email.com\")}\n                      required\n                      className=\"mt-1\"\n                    />\n                  </FormField>\n                </div>\n                <FormField label={t(\"messageLabel\", \"Message\")} htmlFor=\"message\" required>\n                  <Textarea\n                    id=\"message\"\n                    name=\"message\"\n                    value={formData.message}\n                    onChange={handleChange}\n                    placeholder={t(\"messagePlaceholder\", \"How can we help you?\")}\n                    required\n                    rows={6}\n                    className=\"mt-1 resize-none\"\n                  />\n                </FormField>\n                <FormFileInput\n                  files={formData.attachments}\n                  onFilesChange={handleFileUploadChange}\n                  handleRemoveFile={handleRemoveFile}\n                  maxFiles={constants.file?.maxFiles || 5}\n                  accept={constants.file?.accept || \".pdf,.doc,.docx,.jpg,.jpeg,.png\"}\n                  disabled={isSubmitting}\n                  uploadButtonText={t(\"addFiles\")}\n                  maxFilesReachedText={t(\"maxFilesReached\")}\n                />\n                {submitStatus === \"success\" && (\n                  <div className=\"p-4 bg-green-500/10 border border-green-500/30 rounded-lg\">\n                    <p className=\"text-green-600 dark:text-green-400 text-sm font-medium\">\n                      {t(\"success\", \"Message sent successfully! We'll get back to you soon.\")}\n                    </p>\n                  </div>\n                )}\n\n                {submitStatus === \"error\" && (\n                  <div className=\"p-4 bg-destructive/10 border border-destructive/30 rounded-lg\">\n                    <p className=\"text-destructive text-sm font-medium\">\n                      {t(\"error\", \"Something went wrong. Please try again.\")}\n                    </p>\n                  </div>\n                )}\n\n                <Button type=\"submit\" size=\"lg\" className=\"w-full\" disabled={isSubmitting}>\n                  {isSubmitting ? t(\"sending\", \"Sending...\") : t(\"submit\", \"Send Message\")}\n                </Button>\n              </form>\n            </CardContent>\n          </Card>\n        </div>\n      </div>\n    </Layout>\n  );\n}\n\nexport default ContactPageCentered;\n"
     },
     {
       "path": "contact-page-centered/lang/en.json",
       "type": "registry:lang",
       "target": "$modules$/contact-page-centered/lang/en.json",
-      "content": "{\r\n  \"title\": \"Contact Us\",\r\n  \"subtitle\": \"This subtitle appears below your contact page heading. Use it to encourage visitors to reach out, explain your availability, or highlight your commitment to customer service. Customize with Promake to reflect your brand's communication style.\",\r\n  \"emailTitle\": \"Email\",\r\n  \"phoneTitle\": \"Phone\",\r\n  \"addressTitle\": \"Address\",\r\n  \"nameLabel\": \"Name\",\r\n  \"namePlaceholder\": \"Your name\",\r\n  \"emailLabel\": \"Email\",\r\n  \"emailPlaceholder\": \"your@email.com\",\r\n  \"messageLabel\": \"Message\",\r\n  \"messagePlaceholder\": \"How can we help you?\",\r\n  \"submit\": \"Send Message\",\r\n  \"sending\": \"Sending...\",\r\n  \"success\": \"Message sent successfully! We'll get back to you soon.\",\r\n  \"error\": \"Something went wrong. Please try again.\",\r\n  \"addFiles\": \"Add Files\",\r\n  \"maxFilesReached\": \"Maximum files reached\",\r\n  \"maxFilesLimit\": \"You can add up to {{max}} files\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"Contact Us\",\n  \"subtitle\": \"This subtitle appears below your contact page heading. Use it to encourage visitors to reach out, explain your availability, or highlight your commitment to customer service. Customize with Promake to reflect your brand's communication style.\",\n  \"emailTitle\": \"Email\",\n  \"phoneTitle\": \"Phone\",\n  \"addressTitle\": \"Address\",\n  \"nameLabel\": \"Name\",\n  \"namePlaceholder\": \"Your name\",\n  \"emailLabel\": \"Email\",\n  \"emailPlaceholder\": \"your@email.com\",\n  \"messageLabel\": \"Message\",\n  \"messagePlaceholder\": \"How can we help you?\",\n  \"submit\": \"Send Message\",\n  \"sending\": \"Sending...\",\n  \"success\": \"Message sent successfully! We'll get back to you soon.\",\n  \"error\": \"Something went wrong. Please try again.\",\n  \"addFiles\": \"Add Files\",\n  \"maxFilesReached\": \"Maximum files reached\",\n  \"maxFilesLimit\": \"You can add up to {{max}} files\"\n}\n"
     },
     {
       "path": "contact-page-centered/lang/tr.json",
       "type": "registry:lang",
       "target": "$modules$/contact-page-centered/lang/tr.json",
-      "content": "{\r\n  \"title\": \"İletişim\",\r\n  \"subtitle\": \"Bu alt başlık iletişim sayfası başlığınızın altında görünür. Ziyaretçileri iletişime geçmeye teşvik etmek, müsaitliğinizi açıklamak veya müşteri hizmetlerine olan bağlılığınızı vurgulamak için kullanın. Promake ile markanızın iletişim tarzını yansıtacak şekilde özelleştirin.\",\r\n  \"emailTitle\": \"E-posta\",\r\n  \"phoneTitle\": \"Telefon\",\r\n  \"addressTitle\": \"Adres\",\r\n  \"nameLabel\": \"İsim\",\r\n  \"namePlaceholder\": \"Adınız\",\r\n  \"emailLabel\": \"E-posta\",\r\n  \"emailPlaceholder\": \"email@adresiniz.com\",\r\n  \"messageLabel\": \"Mesaj\",\r\n  \"messagePlaceholder\": \"Size nasıl yardımcı olabiliriz?\",\r\n  \"submit\": \"Mesaj Gönder\",\r\n  \"sending\": \"Gönderiliyor...\",\r\n  \"success\": \"Mesajınız başarıyla gönderildi! En kısa sürede size döneceğiz.\",\r\n  \"error\": \"Bir şeyler yanlış gitti. Lütfen tekrar deneyin.\",\r\n  \"addFiles\": \"Dosya Ekle\",\r\n  \"maxFilesReached\": \"Maksimum dosya sayısına ulaşıldı\",\r\n  \"maxFilesLimit\": \"En fazla {{max}} kadar dosya ekleyebilirsiniz\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"İletişim\",\n  \"subtitle\": \"Bu alt başlık iletişim sayfası başlığınızın altında görünür. Ziyaretçileri iletişime geçmeye teşvik etmek, müsaitliğinizi açıklamak veya müşteri hizmetlerine olan bağlılığınızı vurgulamak için kullanın. Promake ile markanızın iletişim tarzını yansıtacak şekilde özelleştirin.\",\n  \"emailTitle\": \"E-posta\",\n  \"phoneTitle\": \"Telefon\",\n  \"addressTitle\": \"Adres\",\n  \"nameLabel\": \"İsim\",\n  \"namePlaceholder\": \"Adınız\",\n  \"emailLabel\": \"E-posta\",\n  \"emailPlaceholder\": \"email@adresiniz.com\",\n  \"messageLabel\": \"Mesaj\",\n  \"messagePlaceholder\": \"Size nasıl yardımcı olabiliriz?\",\n  \"submit\": \"Mesaj Gönder\",\n  \"sending\": \"Gönderiliyor...\",\n  \"success\": \"Mesajınız başarıyla gönderildi! En kısa sürede size döneceğiz.\",\n  \"error\": \"Bir şeyler yanlış gitti. Lütfen tekrar deneyin.\",\n  \"addFiles\": \"Dosya Ekle\",\n  \"maxFilesReached\": \"Maksimum dosya sayısına ulaşıldı\",\n  \"maxFilesLimit\": \"En fazla {{max}} kadar dosya ekleyebilirsiniz\"\n}\n"
     }
   ],
   "exports": {

package/dist/registry/contact-page-map-overlay.json

@@ -30,19 +30,19 @@
       "path": "contact-page-map-overlay/contact-page-map-overlay.tsx",
       "type": "registry:component",
       "target": "$modules$/contact-page-map-overlay/contact-page-map-overlay.tsx",
-      "content": "import React, { useState, useMemo, useEffect } from \"react\";\r\nimport { usePageTitle } from \"@/hooks/use-page-title\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { Layout } from \"@/components/Layout\";\r\nimport { useApiService } from \"@/lib/api\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { Input } from \"@/components/ui/input\";\r\nimport { Textarea } from \"@/components/ui/textarea\";\r\nimport { Card, CardContent, CardHeader, CardTitle } from \"@/components/ui/card\";\r\nimport {\r\n  Mail,\r\n  Phone,\r\n  MapPin,\r\n  Facebook,\r\n  Twitter,\r\n  Instagram,\r\n  Linkedin,\r\n  Send,\r\n  ExternalLink,\r\n} from \"lucide-react\";\r\nimport constants from \"@/constants/constants.json\";\r\nimport { GoogleMap } from \"@/modules/google-map\";\r\nimport { FormFileInput } from \"@/components/FormFileInput\";\r\nimport { FormField } from \"@/components/FormField\";\r\n\r\nconst socialIcons: Record<string, React.ElementType> = {\r\n  facebook: Facebook,\r\n  twitter: Twitter,\r\n  instagram: Instagram,\r\n  linkedin: Linkedin,\r\n};\r\n\r\nexport function ContactPageMapOverlay() {\r\n  const { t } = useTranslation(\"contact-page-map-overlay\");\r\n  usePageTitle({ title: t(\"title\") });\r\n\r\n  const apiService = useApiService();\r\n\r\n  const socialLinks = useMemo(() => {\r\n    const socialMedia = constants.socialMedia as\r\n      | Record<string, string>\r\n      | undefined;\r\n    if (!socialMedia) return [];\r\n    return Object.entries(socialMedia)\r\n      .filter(([platform, url]) => url && socialIcons[platform])\r\n      .map(([platform, url]) => ({\r\n        platform,\r\n        url,\r\n        Icon: socialIcons[platform],\r\n      }));\r\n  }, []);\r\n\r\n  const [formData, setFormData] = useState({\r\n    name: \"\",\r\n    email: \"\",\r\n    message: \"\",\r\n    attachments: [] as File[]\r\n  });\r\n  const [isSubmitting, setIsSubmitting] = useState(false);\r\n  const [submitStatus, setSubmitStatus] = useState<\r\n    \"idle\" | \"success\" | \"error\"\r\n  >(\"idle\");\r\n  const handleFileUploadChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const selectedFiles = Array.from(e.target.files || []) as File[];\r\n    const maxFiles = constants.file?.maxFiles || 5;\r\n\r\n    const remainingSlots = maxFiles - formData.attachments.length;\r\n\r\n    // If the limit is exceeded, alert and do not add any files\r\n    if (selectedFiles.length > remainingSlots) {\r\n      alert(t(\"maxFilesLimit\", { max: maxFiles }));\r\n      e.target.value = ''; // Clear the input\r\n      return;\r\n    }\r\n\r\n    setFormData(prev => ({\r\n      ...prev,\r\n      attachments: [...prev.attachments, ...selectedFiles]\r\n    }));\r\n\r\n    e.target.value = ''; // Clear the input\r\n  }\r\n\r\n  const handleRemoveFile = (index: number) => {\r\n    setFormData(prev => ({\r\n      ...prev,\r\n      attachments: prev.attachments.filter((_, i) => i !== index)\r\n    }));\r\n  };\r\n\r\n  // Auto-reset status after 5 seconds with proper cleanup\r\n  useEffect(() => {\r\n    if (submitStatus === \"idle\") return;\r\n    const timer = setTimeout(() => setSubmitStatus(\"idle\"), 5000);\r\n    return () => clearTimeout(timer);\r\n  }, [submitStatus]);\r\n\r\n  const handleSubmit = async (e: React.FormEvent) => {\r\n    e.preventDefault();\r\n    setIsSubmitting(true);\r\n    setSubmitStatus(\"idle\");\r\n    try {\r\n      const currentLanguage = constants.site.defaultLanguage;\r\n\r\n      await apiService.submitFormWithFile(\r\n        formData,\r\n        {\r\n          email_subject1: \"Thank you for contacting us\",\r\n          email_subject2: \"New Contact Form Submission\",\r\n          fields: [\r\n            { name: \"name\", required: true },\r\n            { name: \"email\", required: true },\r\n            { name: \"message\", required: true },\r\n            { name: \"attachments\", required: false },\r\n          ],\r\n        },\r\n        currentLanguage\r\n      );\r\n\r\n      setSubmitStatus(\"success\");\r\n      setFormData({\r\n        name: \"\",\r\n        email: \"\",\r\n        message: \"\",\r\n        attachments: []\r\n      });\r\n    } catch (error: unknown) {\r\n      console.error(\"Form submission failed:\", error);\r\n      setSubmitStatus(\"error\");\r\n    } finally {\r\n      setIsSubmitting(false);\r\n    }\r\n  };\r\n\r\n  const handleChange = (\r\n    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\r\n  ) => {\r\n    setFormData((prev) => ({\r\n      ...prev,\r\n      [e.target.name]: e.target.value,\r\n    }));\r\n  };\r\n\r\n  // Default coordinates (can be customized via constants)\r\n  const mapLatitude = (constants as any).location?.latitude || 41.0082;\r\n  const mapLongitude = (constants as any).location?.longitude || 28.9784;\r\n\r\n  return (\r\n    <Layout>\r\n      <div className=\"relative min-h-[calc(100vh-4rem)]\">\r\n        {/* Full-screen Map Background */}\r\n        <div className=\"absolute inset-0\">\r\n          <GoogleMap\r\n            latitude={mapLatitude}\r\n            longitude={mapLongitude}\r\n            zoom={14}\r\n            height=\"100%\"\r\n            className=\"rounded-none border-0 h-full\"\r\n            title={t(\"mapTitle\")}\r\n          />\r\n          {/* Dark overlay for better readability */}\r\n          <div className=\"absolute inset-0 bg-black/30 pointer-events-none\" />\r\n        </div>\r\n\r\n        {/* Content Overlay */}\r\n        <div className=\"relative z-10 min-h-[calc(100vh-4rem)] flex items-center py-12 px-4\">\r\n          <div className=\"w-full max-w-[var(--container-max-width)] mx-auto\">\r\n            <div className=\"grid lg:grid-cols-2 gap-8 items-stretch\">\r\n              {/* Form Card - Glassmorphism */}\r\n              <Card className=\"backdrop-blur-xl bg-background/85 dark:bg-background/90 border-white/20 shadow-2xl\">\r\n                <CardHeader>\r\n                  <CardTitle className=\"text-2xl lg:text-3xl\">\r\n                    {t(\"title\")}\r\n                  </CardTitle>\r\n                  <p className=\"text-muted-foreground mt-2\">\r\n                    {t(\"description\")}\r\n                  </p>\r\n                </CardHeader>\r\n                <CardContent>\r\n                  <form onSubmit={handleSubmit} className=\"space-y-5\">\r\n                    <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n                      <FormField label={t(\"fullName\")} htmlFor=\"name\" required>\r\n                      <Input\r\n                          id=\"name\"\r\n                          name=\"name\"\r\n                          type=\"text\"\r\n                          value={formData.name}\r\n                          onChange={handleChange}\r\n                          placeholder={t(\"fullNamePlaceholder\")}\r\n                          required\r\n                          className=\"mt-1.5 bg-background/50\"\r\n                        />\r\n                      </FormField>\r\n                      <FormField label={t(\"emailAddress\")} htmlFor=\"email\" required>\r\n                      <Input\r\n                          id=\"email\"\r\n                          name=\"email\"\r\n                          type=\"email\"\r\n                          value={formData.email}\r\n                          onChange={handleChange}\r\n                          placeholder={t(\"emailPlaceholder\")}\r\n                          required\r\n                          className=\"mt-1.5 bg-background/50\"\r\n                        />\r\n                      </FormField>\r\n                    </div>\r\n\r\n                    <FormField label={t(\"message\")} htmlFor=\"message\" required>\r\n                    <Textarea\r\n                        id=\"message\"\r\n                        name=\"message\"\r\n                        value={formData.message}\r\n                        onChange={handleChange}\r\n                        placeholder={t(\"messagePlaceholder\")}\r\n                        required\r\n                        rows={4}\r\n                        className=\"mt-1.5 resize-none bg-background/50\"\r\n                      />\r\n                    </FormField>\r\n                    <FormFileInput\r\n                    files={formData.attachments}\r\n                    onFilesChange={handleFileUploadChange}\r\n                    handleRemoveFile={handleRemoveFile}\r\n                    maxFiles={constants.file?.maxFiles || 5}\r\n                    accept={constants.file?.accept || \".pdf,.doc,.docx,.jpg,.jpeg,.png\"}\r\n                    disabled={isSubmitting}\r\n                    uploadButtonText={t(\"addFiles\")}\r\n                    maxFilesReachedText={t(\"maxFilesReached\")}\r\n                  />\r\n                    {submitStatus === \"success\" && (\r\n                      <div className=\"p-3 bg-green-500/10 border border-green-500/30 rounded-lg\">\r\n                        <p className=\"text-green-600 dark:text-green-400 text-sm\">\r\n                          {t(\"success\")}\r\n                        </p>\r\n                      </div>\r\n                    )}\r\n\r\n                    {submitStatus === \"error\" && (\r\n                      <div className=\"p-3 bg-destructive/10 border border-destructive/30 rounded-lg\">\r\n                        <p className=\"text-destructive text-sm\">{t(\"error\")}</p>\r\n                      </div>\r\n                    )}\r\n\r\n                    <Button\r\n                      type=\"submit\"\r\n                      size=\"lg\"\r\n                      className=\"w-full\"\r\n                      disabled={isSubmitting}\r\n                    >\r\n                      {isSubmitting ? (\r\n                        <>\r\n                          <div className=\"w-4 h-4 border-2 border-primary-foreground border-t-transparent rounded-full animate-spin mr-2\" />\r\n                          {t(\"sending\")}\r\n                        </>\r\n                      ) : (\r\n                        <>\r\n                          <Send className=\"w-4 h-4 mr-2\" />\r\n                          {t(\"submit\")}\r\n                        </>\r\n                      )}\r\n                    </Button>\r\n                  </form>\r\n                </CardContent>\r\n              </Card>\r\n\r\n              {/* Contact Info Card - Glassmorphism */}\r\n              <Card className=\"backdrop-blur-xl bg-background/85 dark:bg-background/90 border-white/20 shadow-2xl\">\r\n                <CardHeader>\r\n                  <CardTitle>{t(\"contactInfo\")}</CardTitle>\r\n                </CardHeader>\r\n                <CardContent className=\"space-y-5\">\r\n                  <div className=\"flex items-start gap-4\">\r\n                    <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\r\n                      <Mail className=\"w-5 h-5 text-primary\" />\r\n                    </div>\r\n                    <div>\r\n                      <p className=\"text-sm text-muted-foreground\">{t(\"email\")}</p>\r\n                      <a\r\n                        href={`mailto:${constants.email}`}\r\n                        className=\"font-medium hover:text-primary transition-colors\"\r\n                      >\r\n                        {constants.email}\r\n                      </a>\r\n                    </div>\r\n                  </div>\r\n\r\n                  <div className=\"flex items-start gap-4\">\r\n                    <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\r\n                      <Phone className=\"w-5 h-5 text-primary\" />\r\n                    </div>\r\n                    <div>\r\n                      <p className=\"text-sm text-muted-foreground\">{t(\"phone\")}</p>\r\n                      <a\r\n                        href={`tel:${constants.phone}`}\r\n                        className=\"font-medium hover:text-primary transition-colors\"\r\n                      >\r\n                        {constants.phone}\r\n                      </a>\r\n                    </div>\r\n                  </div>\r\n\r\n                  <div className=\"flex items-start gap-4\">\r\n                    <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\r\n                      <MapPin className=\"w-5 h-5 text-primary\" />\r\n                    </div>\r\n                    <div>\r\n                      <p className=\"text-sm text-muted-foreground\">{t(\"address\")}</p>\r\n                      <p className=\"font-medium\">\r\n                        {constants.address.line1}\r\n                        <br />\r\n                        {constants.address.city}, {constants.address.state} {constants.address.postalCode}\r\n                      </p>\r\n                    </div>\r\n                  </div>\r\n\r\n                  {/* Open in Maps Link */}\r\n                  <a\r\n                    href={`https://www.google.com/maps?q=${mapLatitude},${mapLongitude}`}\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    className=\"inline-flex items-center gap-2 text-sm text-primary hover:underline mt-2\"\r\n                  >\r\n                    <ExternalLink className=\"w-4 h-4\" />\r\n                    {t(\"openInMaps\")}\r\n                  </a>\r\n\r\n                  {/* Social Links */}\r\n                  {socialLinks.length > 0 && (\r\n                    <div className=\"pt-4 border-t\">\r\n                      <p className=\"text-sm text-muted-foreground mb-3\">\r\n                        {t(\"followUs\")}\r\n                      </p>\r\n                      <div className=\"flex gap-2\">\r\n                        {socialLinks.map(({ platform, url, Icon }) => (\r\n                          <a\r\n                            key={platform}\r\n                            href={url}\r\n                            target=\"_blank\"\r\n                            rel=\"noopener noreferrer\"\r\n                            className=\"h-10 w-10 flex items-center justify-center rounded-full border text-muted-foreground hover:text-primary hover:border-primary transition-colors\"\r\n                          >\r\n                            <Icon className=\"h-4 w-4\" />\r\n                          </a>\r\n                        ))}\r\n                      </div>\r\n                    </div>\r\n                  )}\r\n                </CardContent>\r\n              </Card>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </Layout>\r\n  );\r\n}\r\n\r\nexport default ContactPageMapOverlay;\r\n"
+      "content": "import React, { useState, useMemo, useEffect } from \"react\";\nimport { usePageTitle } from \"@/hooks/use-page-title\";\nimport { useTranslation } from \"react-i18next\";\nimport { Layout } from \"@/components/Layout\";\nimport { useApiService } from \"@/lib/api\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Textarea } from \"@/components/ui/textarea\";\nimport { Card, CardContent, CardHeader, CardTitle } from \"@/components/ui/card\";\nimport {\n  Mail,\n  Phone,\n  MapPin,\n  Facebook,\n  Twitter,\n  Instagram,\n  Linkedin,\n  Send,\n  ExternalLink,\n} from \"lucide-react\";\nimport constants from \"@/constants/constants.json\";\nimport { GoogleMap } from \"@/modules/google-map\";\nimport { FormFileInput } from \"@/components/FormFileInput\";\nimport { FormField } from \"@/components/FormField\";\n\nconst socialIcons: Record<string, React.ElementType> = {\n  facebook: Facebook,\n  twitter: Twitter,\n  instagram: Instagram,\n  linkedin: Linkedin,\n};\n\nexport function ContactPageMapOverlay() {\n  const { t } = useTranslation(\"contact-page-map-overlay\");\n  usePageTitle({ title: t(\"title\") });\n\n  const apiService = useApiService();\n\n  const socialLinks = useMemo(() => {\n    const socialMedia = constants.socialMedia as\n      | Record<string, string>\n      | undefined;\n    if (!socialMedia) return [];\n    return Object.entries(socialMedia)\n      .filter(([platform, url]) => url && socialIcons[platform])\n      .map(([platform, url]) => ({\n        platform,\n        url,\n        Icon: socialIcons[platform],\n      }));\n  }, []);\n\n  const [formData, setFormData] = useState({\n    name: \"\",\n    email: \"\",\n    message: \"\",\n    attachments: [] as File[]\n  });\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [submitStatus, setSubmitStatus] = useState<\n    \"idle\" | \"success\" | \"error\"\n  >(\"idle\");\n  const handleFileUploadChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const selectedFiles = Array.from(e.target.files || []) as File[];\n    const maxFiles = constants.file?.maxFiles || 5;\n\n    const remainingSlots = maxFiles - formData.attachments.length;\n\n    // If the limit is exceeded, alert and do not add any files\n    if (selectedFiles.length > remainingSlots) {\n      alert(t(\"maxFilesLimit\", { max: maxFiles }));\n      e.target.value = ''; // Clear the input\n      return;\n    }\n\n    setFormData(prev => ({\n      ...prev,\n      attachments: [...prev.attachments, ...selectedFiles]\n    }));\n\n    e.target.value = ''; // Clear the input\n  }\n\n  const handleRemoveFile = (index: number) => {\n    setFormData(prev => ({\n      ...prev,\n      attachments: prev.attachments.filter((_, i) => i !== index)\n    }));\n  };\n\n  // Auto-reset status after 5 seconds with proper cleanup\n  useEffect(() => {\n    if (submitStatus === \"idle\") return;\n    const timer = setTimeout(() => setSubmitStatus(\"idle\"), 5000);\n    return () => clearTimeout(timer);\n  }, [submitStatus]);\n\n  const handleSubmit = async (e: React.FormEvent) => {\n    e.preventDefault();\n    setIsSubmitting(true);\n    setSubmitStatus(\"idle\");\n    try {\n      const currentLanguage = constants.site.defaultLanguage;\n\n      await apiService.submitFormWithFile(\n        formData,\n        {\n          email_subject1: \"Thank you for contacting us\",\n          email_subject2: \"New Contact Form Submission\",\n          fields: [\n            { name: \"name\", required: true },\n            { name: \"email\", required: true },\n            { name: \"message\", required: true },\n            { name: \"attachments\", required: false },\n          ],\n        },\n        currentLanguage\n      );\n\n      setSubmitStatus(\"success\");\n      setFormData({\n        name: \"\",\n        email: \"\",\n        message: \"\",\n        attachments: []\n      });\n    } catch (error: unknown) {\n      console.error(\"Form submission failed:\", error);\n      setSubmitStatus(\"error\");\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  const handleChange = (\n    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n  ) => {\n    setFormData((prev) => ({\n      ...prev,\n      [e.target.name]: e.target.value,\n    }));\n  };\n\n  // Default coordinates (can be customized via constants)\n  const mapLatitude = (constants as any).location?.latitude || 41.0082;\n  const mapLongitude = (constants as any).location?.longitude || 28.9784;\n\n  return (\n    <Layout>\n      <div className=\"relative min-h-[calc(100vh-4rem)]\">\n        {/* Full-screen Map Background */}\n        <div className=\"absolute inset-0\">\n          <GoogleMap\n            latitude={mapLatitude}\n            longitude={mapLongitude}\n            zoom={14}\n            height=\"100%\"\n            className=\"rounded-none border-0 h-full\"\n            title={t(\"mapTitle\")}\n          />\n          {/* Dark overlay for better readability */}\n          <div className=\"absolute inset-0 bg-black/30 pointer-events-none\" />\n        </div>\n\n        {/* Content Overlay */}\n        <div className=\"relative z-10 min-h-[calc(100vh-4rem)] flex items-center py-12 px-4\">\n          <div className=\"w-full max-w-[var(--container-max-width)] mx-auto\">\n            <div className=\"grid lg:grid-cols-2 gap-8 items-stretch\">\n              {/* Form Card - Glassmorphism */}\n              <Card className=\"backdrop-blur-xl bg-background/85 dark:bg-background/90 border-white/20 shadow-2xl\">\n                <CardHeader>\n                  <CardTitle className=\"text-2xl lg:text-3xl\">\n                    {t(\"title\")}\n                  </CardTitle>\n                  <p className=\"text-muted-foreground mt-2\">\n                    {t(\"description\")}\n                  </p>\n                </CardHeader>\n                <CardContent>\n                  <form onSubmit={handleSubmit} className=\"space-y-5\">\n                    <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n                      <FormField label={t(\"fullName\")} htmlFor=\"name\" required>\n                      <Input\n                          id=\"name\"\n                          name=\"name\"\n                          type=\"text\"\n                          value={formData.name}\n                          onChange={handleChange}\n                          placeholder={t(\"fullNamePlaceholder\")}\n                          required\n                          className=\"mt-1.5 bg-background/50\"\n                        />\n                      </FormField>\n                      <FormField label={t(\"emailAddress\")} htmlFor=\"email\" required>\n                      <Input\n                          id=\"email\"\n                          name=\"email\"\n                          type=\"email\"\n                          value={formData.email}\n                          onChange={handleChange}\n                          placeholder={t(\"emailPlaceholder\")}\n                          required\n                          className=\"mt-1.5 bg-background/50\"\n                        />\n                      </FormField>\n                    </div>\n\n                    <FormField label={t(\"message\")} htmlFor=\"message\" required>\n                    <Textarea\n                        id=\"message\"\n                        name=\"message\"\n                        value={formData.message}\n                        onChange={handleChange}\n                        placeholder={t(\"messagePlaceholder\")}\n                        required\n                        rows={4}\n                        className=\"mt-1.5 resize-none bg-background/50\"\n                      />\n                    </FormField>\n                    <FormFileInput\n                    files={formData.attachments}\n                    onFilesChange={handleFileUploadChange}\n                    handleRemoveFile={handleRemoveFile}\n                    maxFiles={constants.file?.maxFiles || 5}\n                    accept={constants.file?.accept || \".pdf,.doc,.docx,.jpg,.jpeg,.png\"}\n                    disabled={isSubmitting}\n                    uploadButtonText={t(\"addFiles\")}\n                    maxFilesReachedText={t(\"maxFilesReached\")}\n                  />\n                    {submitStatus === \"success\" && (\n                      <div className=\"p-3 bg-green-500/10 border border-green-500/30 rounded-lg\">\n                        <p className=\"text-green-600 dark:text-green-400 text-sm\">\n                          {t(\"success\")}\n                        </p>\n                      </div>\n                    )}\n\n                    {submitStatus === \"error\" && (\n                      <div className=\"p-3 bg-destructive/10 border border-destructive/30 rounded-lg\">\n                        <p className=\"text-destructive text-sm\">{t(\"error\")}</p>\n                      </div>\n                    )}\n\n                    <Button\n                      type=\"submit\"\n                      size=\"lg\"\n                      className=\"w-full\"\n                      disabled={isSubmitting}\n                    >\n                      {isSubmitting ? (\n                        <>\n                          <div className=\"w-4 h-4 border-2 border-primary-foreground border-t-transparent rounded-full animate-spin mr-2\" />\n                          {t(\"sending\")}\n                        </>\n                      ) : (\n                        <>\n                          <Send className=\"w-4 h-4 mr-2\" />\n                          {t(\"submit\")}\n                        </>\n                      )}\n                    </Button>\n                  </form>\n                </CardContent>\n              </Card>\n\n              {/* Contact Info Card - Glassmorphism */}\n              <Card className=\"backdrop-blur-xl bg-background/85 dark:bg-background/90 border-white/20 shadow-2xl\">\n                <CardHeader>\n                  <CardTitle>{t(\"contactInfo\")}</CardTitle>\n                </CardHeader>\n                <CardContent className=\"space-y-5\">\n                  <div className=\"flex items-start gap-4\">\n                    <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\n                      <Mail className=\"w-5 h-5 text-primary\" />\n                    </div>\n                    <div>\n                      <p className=\"text-sm text-muted-foreground\">{t(\"email\")}</p>\n                      <a\n                        href={`mailto:${constants.email}`}\n                        className=\"font-medium hover:text-primary transition-colors\"\n                      >\n                        {constants.email}\n                      </a>\n                    </div>\n                  </div>\n\n                  <div className=\"flex items-start gap-4\">\n                    <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\n                      <Phone className=\"w-5 h-5 text-primary\" />\n                    </div>\n                    <div>\n                      <p className=\"text-sm text-muted-foreground\">{t(\"phone\")}</p>\n                      <a\n                        href={`tel:${constants.phone}`}\n                        className=\"font-medium hover:text-primary transition-colors\"\n                      >\n                        {constants.phone}\n                      </a>\n                    </div>\n                  </div>\n\n                  <div className=\"flex items-start gap-4\">\n                    <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\n                      <MapPin className=\"w-5 h-5 text-primary\" />\n                    </div>\n                    <div>\n                      <p className=\"text-sm text-muted-foreground\">{t(\"address\")}</p>\n                      <p className=\"font-medium\">\n                        {constants.address.line1}\n                        <br />\n                        {constants.address.city}, {constants.address.state} {constants.address.postalCode}\n                      </p>\n                    </div>\n                  </div>\n\n                  {/* Open in Maps Link */}\n                  <a\n                    href={`https://www.google.com/maps?q=${mapLatitude},${mapLongitude}`}\n                    target=\"_blank\"\n                    rel=\"noopener noreferrer\"\n                    className=\"inline-flex items-center gap-2 text-sm text-primary hover:underline mt-2\"\n                  >\n                    <ExternalLink className=\"w-4 h-4\" />\n                    {t(\"openInMaps\")}\n                  </a>\n\n                  {/* Social Links */}\n                  {socialLinks.length > 0 && (\n                    <div className=\"pt-4 border-t\">\n                      <p className=\"text-sm text-muted-foreground mb-3\">\n                        {t(\"followUs\")}\n                      </p>\n                      <div className=\"flex gap-2\">\n                        {socialLinks.map(({ platform, url, Icon }) => (\n                          <a\n                            key={platform}\n                            href={url}\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                            className=\"h-10 w-10 flex items-center justify-center rounded-full border text-muted-foreground hover:text-primary hover:border-primary transition-colors\"\n                          >\n                            <Icon className=\"h-4 w-4\" />\n                          </a>\n                        ))}\n                      </div>\n                    </div>\n                  )}\n                </CardContent>\n              </Card>\n            </div>\n          </div>\n        </div>\n      </div>\n    </Layout>\n  );\n}\n\nexport default ContactPageMapOverlay;\n"
     },
     {
       "path": "contact-page-map-overlay/lang/en.json",
       "type": "registry:lang",
       "target": "$modules$/contact-page-map-overlay/lang/en.json",
-      "content": "{\r\n  \"title\": \"Contact Us\",\r\n  \"description\": \"We'd love to hear from you. Send us a message and we'll respond as soon as possible.\",\r\n  \"contactInfo\": \"Contact Information\",\r\n  \"email\": \"Email\",\r\n  \"phone\": \"Phone\",\r\n  \"address\": \"Address\",\r\n  \"fullName\": \"Full Name\",\r\n  \"fullNamePlaceholder\": \"Your name\",\r\n  \"emailAddress\": \"Email Address\",\r\n  \"emailPlaceholder\": \"your@email.com\",\r\n  \"message\": \"Message\",\r\n  \"messagePlaceholder\": \"How can we help you?\",\r\n  \"submit\": \"Send Message\",\r\n  \"sending\": \"Sending...\",\r\n  \"success\": \"Message sent successfully! We'll get back to you soon.\",\r\n  \"error\": \"Something went wrong. Please try again.\",\r\n  \"followUs\": \"Follow us\",\r\n  \"mapTitle\": \"Our Location\",\r\n  \"openInMaps\": \"Open in Google Maps\",\r\n  \"addFiles\": \"Add Files\",\r\n  \"maxFilesReached\": \"Maximum files reached\",\r\n  \"maxFilesLimit\": \"You can add up to {{max}} files\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"Contact Us\",\n  \"description\": \"We'd love to hear from you. Send us a message and we'll respond as soon as possible.\",\n  \"contactInfo\": \"Contact Information\",\n  \"email\": \"Email\",\n  \"phone\": \"Phone\",\n  \"address\": \"Address\",\n  \"fullName\": \"Full Name\",\n  \"fullNamePlaceholder\": \"Your name\",\n  \"emailAddress\": \"Email Address\",\n  \"emailPlaceholder\": \"your@email.com\",\n  \"message\": \"Message\",\n  \"messagePlaceholder\": \"How can we help you?\",\n  \"submit\": \"Send Message\",\n  \"sending\": \"Sending...\",\n  \"success\": \"Message sent successfully! We'll get back to you soon.\",\n  \"error\": \"Something went wrong. Please try again.\",\n  \"followUs\": \"Follow us\",\n  \"mapTitle\": \"Our Location\",\n  \"openInMaps\": \"Open in Google Maps\",\n  \"addFiles\": \"Add Files\",\n  \"maxFilesReached\": \"Maximum files reached\",\n  \"maxFilesLimit\": \"You can add up to {{max}} files\"\n}\n"
     },
     {
       "path": "contact-page-map-overlay/lang/tr.json",
       "type": "registry:lang",
       "target": "$modules$/contact-page-map-overlay/lang/tr.json",
-      "content": "{\r\n  \"title\": \"Bize Ulaşın\",\r\n  \"description\": \"Sizden haber almak isteriz. Bize mesaj gönderin, en kısa sürede yanıtlayacağız.\",\r\n  \"contactInfo\": \"İletişim Bilgileri\",\r\n  \"email\": \"E-posta\",\r\n  \"phone\": \"Telefon\",\r\n  \"address\": \"Adres\",\r\n  \"fullName\": \"Ad Soyad\",\r\n  \"fullNamePlaceholder\": \"Adınız\",\r\n  \"emailAddress\": \"E-posta Adresi\",\r\n  \"emailPlaceholder\": \"email@adresiniz.com\",\r\n  \"message\": \"Mesaj\",\r\n  \"messagePlaceholder\": \"Size nasıl yardımcı olabiliriz?\",\r\n  \"submit\": \"Mesaj Gönder\",\r\n  \"sending\": \"Gönderiliyor...\",\r\n  \"success\": \"Mesaj başarıyla gönderildi! En kısa sürede yanıtlayacağız.\",\r\n  \"error\": \"Bir hata oluştu. Lütfen tekrar deneyin.\",\r\n  \"followUs\": \"Bizi takip edin\",\r\n  \"mapTitle\": \"Konumumuz\",\r\n  \"openInMaps\": \"Google Maps'te Aç\",\r\n  \"addFiles\": \"Dosya Ekle\",\r\n  \"maxFilesReached\": \"Maksimum dosya sayısına ulaşıldı\",\r\n  \"maxFilesLimit\": \"En fazla {{max}} kadar dosya ekleyebilirsiniz\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"Bize Ulaşın\",\n  \"description\": \"Sizden haber almak isteriz. Bize mesaj gönderin, en kısa sürede yanıtlayacağız.\",\n  \"contactInfo\": \"İletişim Bilgileri\",\n  \"email\": \"E-posta\",\n  \"phone\": \"Telefon\",\n  \"address\": \"Adres\",\n  \"fullName\": \"Ad Soyad\",\n  \"fullNamePlaceholder\": \"Adınız\",\n  \"emailAddress\": \"E-posta Adresi\",\n  \"emailPlaceholder\": \"email@adresiniz.com\",\n  \"message\": \"Mesaj\",\n  \"messagePlaceholder\": \"Size nasıl yardımcı olabiliriz?\",\n  \"submit\": \"Mesaj Gönder\",\n  \"sending\": \"Gönderiliyor...\",\n  \"success\": \"Mesaj başarıyla gönderildi! En kısa sürede yanıtlayacağız.\",\n  \"error\": \"Bir hata oluştu. Lütfen tekrar deneyin.\",\n  \"followUs\": \"Bizi takip edin\",\n  \"mapTitle\": \"Konumumuz\",\n  \"openInMaps\": \"Google Maps'te Aç\",\n  \"addFiles\": \"Dosya Ekle\",\n  \"maxFilesReached\": \"Maksimum dosya sayısına ulaşıldı\",\n  \"maxFilesLimit\": \"En fazla {{max}} kadar dosya ekleyebilirsiniz\"\n}\n"
     }
   ],
   "exports": {

package/dist/registry/contact-page-map-split.json

@@ -30,19 +30,19 @@
       "path": "contact-page-map-split/contact-page-map-split.tsx",
       "type": "registry:component",
       "target": "$modules$/contact-page-map-split/contact-page-map-split.tsx",
-      "content": "import React, { useState, useMemo, useEffect } from \"react\";\r\nimport { usePageTitle } from \"@/hooks/use-page-title\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { Layout } from \"@/components/Layout\";\r\nimport { useApiService } from \"@/lib/api\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { Input } from \"@/components/ui/input\";\r\nimport { Textarea } from \"@/components/ui/textarea\";\r\nimport {  \r\n  Mail,\r\n  Phone,\r\n  MapPin,\r\n  Facebook,\r\n  Twitter,\r\n  Instagram,\r\n  Linkedin,\r\n  Send,\r\n} from \"lucide-react\";\r\nimport constants from \"@/constants/constants.json\";\r\nimport { GoogleMap } from \"@/modules/google-map\";\r\nimport { FormFileInput } from \"@/components/FormFileInput\";\r\nimport { FormField } from \"@/components/FormField\";\r\n\r\nconst socialIcons: Record<string, React.ElementType> = {\r\n  facebook: Facebook,\r\n  twitter: Twitter,\r\n  instagram: Instagram,\r\n  linkedin: Linkedin,\r\n};\r\n\r\nexport function ContactPageMapSplit() {\r\n  const { t } = useTranslation(\"contact-page-map-split\");\r\n  usePageTitle({ title: t(\"title\") });\r\n\r\n  const apiService = useApiService();\r\n\r\n  const socialLinks = useMemo(() => {\r\n    const socialMedia = constants.socialMedia as\r\n      | Record<string, string>\r\n      | undefined;\r\n    if (!socialMedia) return [];\r\n    return Object.entries(socialMedia)\r\n      .filter(([platform, url]) => url && socialIcons[platform])\r\n      .map(([platform, url]) => ({\r\n        platform,\r\n        url,\r\n        Icon: socialIcons[platform],\r\n      }));\r\n  }, []);\r\n\r\n  const [formData, setFormData] = useState({\r\n    name: \"\",\r\n    email: \"\",\r\n    phone: \"\",\r\n    message: \"\",\r\n    attachments: [] as File[]\r\n  });\r\n  const [isSubmitting, setIsSubmitting] = useState(false);\r\n  const [submitStatus, setSubmitStatus] = useState<\r\n    \"idle\" | \"success\" | \"error\"\r\n  >(\"idle\");\r\n\r\n\r\n  const handleFileUploadChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const selectedFiles = Array.from(e.target.files || []) as File[];\r\n    const maxFiles = constants.file?.maxFiles || 5;\r\n\r\n    const remainingSlots = maxFiles - formData.attachments.length;\r\n\r\n    // If the limit is exceeded, alert and do not add any files\r\n    if (selectedFiles.length > remainingSlots) {\r\n      alert(t(\"maxFilesLimit\", { max: maxFiles }));\r\n      e.target.value = ''; // Clear the input\r\n      return;\r\n    }\r\n\r\n    setFormData(prev => ({\r\n      ...prev,\r\n      attachments: [...prev.attachments, ...selectedFiles]\r\n    }));\r\n\r\n    e.target.value = ''; // Clear the input\r\n  }\r\n\r\n  const handleRemoveFile = (index: number) => {\r\n    setFormData(prev => ({\r\n      ...prev,\r\n      attachments: prev.attachments.filter((_, i) => i !== index)\r\n    }));\r\n  };\r\n\r\n  // Auto-reset status after 5 seconds with proper cleanup\r\n  useEffect(() => {\r\n    if (submitStatus === \"idle\") return;\r\n    const timer = setTimeout(() => setSubmitStatus(\"idle\"), 5000);\r\n    return () => clearTimeout(timer);\r\n  }, [submitStatus]);\r\n\r\n  const handleSubmit = async (e: React.FormEvent) => {\r\n    e.preventDefault();\r\n    setIsSubmitting(true);\r\n    setSubmitStatus(\"idle\");\r\n\r\n    try {\r\n      const currentLanguage = constants.site.defaultLanguage;\r\n\r\n      await apiService.submitFormWithFile(\r\n        formData,\r\n        {\r\n          email_subject1: \"Thank you for contacting us\",\r\n          email_subject2: \"New Contact Form Submission\",\r\n          fields: [\r\n            { name: \"name\", required: true },\r\n            { name: \"email\", required: true },\r\n            { name: \"phone\", required: false },\r\n            { name: \"message\", required: true },\r\n            { name: \"attachments\", required: false },\r\n          ],\r\n        },\r\n        currentLanguage\r\n      );\r\n\r\n      setSubmitStatus(\"success\");\r\n      setFormData({\r\n        name: \"\",\r\n        email: \"\",\r\n        phone: \"\",\r\n        message: \"\",\r\n        attachments: []\r\n      });\r\n    } catch (error: unknown) {\r\n      console.error(\"Form submission failed:\", error);\r\n      setSubmitStatus(\"error\");\r\n    } finally {\r\n      setIsSubmitting(false);\r\n    }\r\n  };\r\n\r\n  const handleChange = (\r\n    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\r\n  ) => {\r\n    setFormData((prev) => ({\r\n      ...prev,\r\n      [e.target.name]: e.target.value,\r\n    }));\r\n  };\r\n\r\n  // Default coordinates (can be customized via constants)\r\n  const mapLatitude = (constants as any).location?.latitude || 41.0082;\r\n  const mapLongitude = (constants as any).location?.longitude || 28.9784;\r\n\r\n  return (\r\n    <Layout>\r\n      <div className=\"min-h-screen flex flex-col lg:flex-row\">\r\n        {/* Left Side - Form & Info */}\r\n        <div className=\"w-full lg:w-1/2 bg-background py-12 lg:py-16 px-6 lg:px-12 flex flex-col justify-center\">\r\n          <div className=\"max-w-lg mx-auto w-full\">\r\n            {/* Header */}\r\n            <div className=\"mb-10\">\r\n              <h1 className=\"text-3xl lg:text-4xl font-bold text-foreground mb-3\">\r\n                {t(\"title\")}\r\n              </h1>\r\n              <p className=\"text-muted-foreground\">\r\n                {t(\"description\")}\r\n              </p>\r\n            </div>\r\n\r\n            {/* Contact Info Cards */}\r\n            <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4 mb-10\">\r\n              <div className=\"flex items-center gap-3 p-4 rounded-xl bg-muted/50\">\r\n                <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center\">\r\n                  <Mail className=\"w-5 h-5 text-primary\" />\r\n                </div>\r\n                <div className=\"min-w-0\">\r\n                  <p className=\"text-xs text-muted-foreground\">{t(\"email\")}</p>\r\n                  <p className=\"text-sm font-medium truncate\">{constants.email}</p>\r\n                </div>\r\n              </div>\r\n\r\n              <div className=\"flex items-center gap-3 p-4 rounded-xl bg-muted/50\">\r\n                <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center\">\r\n                  <Phone className=\"w-5 h-5 text-primary\" />\r\n                </div>\r\n                <div className=\"min-w-0\">\r\n                  <p className=\"text-xs text-muted-foreground\">{t(\"phone\")}</p>\r\n                  <p className=\"text-sm font-medium truncate\">{constants.phone}</p>\r\n                </div>\r\n              </div>\r\n\r\n              <div className=\"flex items-center gap-3 p-4 rounded-xl bg-muted/50 sm:col-span-2\">\r\n                <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\r\n                  <MapPin className=\"w-5 h-5 text-primary\" />\r\n                </div>\r\n                <div className=\"min-w-0\">\r\n                  <p className=\"text-xs text-muted-foreground\">{t(\"address\")}</p>\r\n                  <p className=\"text-sm font-medium\">\r\n                    {constants.address.line1}, {constants.address.city}\r\n                  </p>\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            {/* Contact Form */}\r\n            <form onSubmit={handleSubmit} className=\"space-y-5\">\r\n              <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\r\n                <FormField label={t(\"fullName\")} htmlFor=\"name\" required>\r\n                <Input\r\n                    id=\"name\"\r\n                    name=\"name\"\r\n                    type=\"text\"\r\n                    value={formData.name}\r\n                    onChange={handleChange}\r\n                    placeholder={t(\"fullNamePlaceholder\")}\r\n                    required\r\n                    className=\"mt-1.5\"\r\n                  />\r\n                </FormField>\r\n                <FormField label={t(\"emailAddress\")} htmlFor=\"email\" required>\r\n                <Input\r\n                    id=\"email\"\r\n                    name=\"email\"\r\n                    type=\"email\"\r\n                    value={formData.email}\r\n                    onChange={handleChange}\r\n                    placeholder={t(\"emailPlaceholder\")}\r\n                    required\r\n                    className=\"mt-1.5\"\r\n                  />\r\n                  </FormField>\r\n              </div>\r\n\r\n              <FormField label={t(\"phoneNumber\")} htmlFor=\"phone\">\r\n              <Input\r\n                  id=\"phone\"\r\n                  name=\"phone\"\r\n                  type=\"tel\"\r\n                  value={formData.phone}\r\n                  onChange={handleChange}\r\n                  placeholder={t(\"phonePlaceholder\")}\r\n                  className=\"mt-1.5\"\r\n                />\r\n              </FormField>\r\n              <FormField label={t(\"message\")} htmlFor=\"message\" required>\r\n              <Textarea\r\n                  id=\"message\"\r\n                  name=\"message\"\r\n                  value={formData.message}\r\n                  onChange={handleChange}\r\n                  placeholder={t(\"messagePlaceholder\")}\r\n                  required\r\n                  rows={4}\r\n                  className=\"mt-1.5 resize-none\"\r\n                />\r\n              </FormField>\r\n              <FormFileInput\r\n                files={formData.attachments}\r\n                onFilesChange={handleFileUploadChange}\r\n                handleRemoveFile={handleRemoveFile}\r\n                maxFiles={constants.file?.maxFiles || 5}\r\n                accept={constants.file?.accept || \".pdf,.doc,.docx,.jpg,.jpeg,.png\"}\r\n                disabled={isSubmitting}\r\n                uploadButtonText={t(\"addFiles\")}\r\n                maxFilesReachedText={t(\"maxFilesReached\")}\r\n              />\r\n              {submitStatus === \"success\" && (\r\n                <div className=\"p-3 bg-green-500/10 border border-green-500/30 rounded-lg\">\r\n                  <p className=\"text-green-600 dark:text-green-400 text-sm\">\r\n                    {t(\"success\")}\r\n                  </p>\r\n                </div>\r\n              )}\r\n\r\n              {submitStatus === \"error\" && (\r\n                <div className=\"p-3 bg-destructive/10 border border-destructive/30 rounded-lg\">\r\n                  <p className=\"text-destructive text-sm\">{t(\"error\")}</p>\r\n                </div>\r\n              )}\r\n\r\n              <Button\r\n                type=\"submit\"\r\n                size=\"lg\"\r\n                className=\"w-full\"\r\n                disabled={isSubmitting}\r\n              >\r\n                {isSubmitting ? (\r\n                  <>\r\n                    <div className=\"w-4 h-4 border-2 border-primary-foreground border-t-transparent rounded-full animate-spin mr-2\" />\r\n                    {t(\"sending\")}\r\n                  </>\r\n                ) : (\r\n                  <>\r\n                    <Send className=\"w-4 h-4 mr-2\" />\r\n                    {t(\"submit\")}\r\n                  </>\r\n                )}\r\n              </Button>\r\n            </form>\r\n\r\n            {/* Social Links */}\r\n            {socialLinks.length > 0 && (\r\n              <div className=\"mt-10 pt-6 border-t\">\r\n                <p className=\"text-sm text-muted-foreground mb-3\">\r\n                  {t(\"followUs\")}\r\n                </p>\r\n                <div className=\"flex gap-2\">\r\n                  {socialLinks.map(({ platform, url, Icon }) => (\r\n                    <a\r\n                      key={platform}\r\n                      href={url}\r\n                      target=\"_blank\"\r\n                      rel=\"noopener noreferrer\"\r\n                      className=\"h-10 w-10 flex items-center justify-center rounded-full border text-muted-foreground hover:text-primary hover:border-primary transition-colors\"\r\n                    >\r\n                      <Icon className=\"h-4 w-4\" />\r\n                    </a>\r\n                  ))}\r\n                </div>\r\n              </div>\r\n            )}\r\n          </div>\r\n        </div>\r\n\r\n        {/* Right Side - Map */}\r\n        <div className=\"w-full lg:w-1/2 h-[400px] lg:h-[calc(100vh-4rem)] relative\">\r\n          <GoogleMap\r\n            latitude={mapLatitude}\r\n            longitude={mapLongitude}\r\n            zoom={14}\r\n            height=\"100%\"\r\n            className=\"rounded-none border-0 h-full\"\r\n            title={t(\"mapTitle\")}\r\n          />\r\n        </div>\r\n      </div>\r\n    </Layout>\r\n  );\r\n}\r\n\r\nexport default ContactPageMapSplit;\r\n"
+      "content": "import React, { useState, useMemo, useEffect } from \"react\";\nimport { usePageTitle } from \"@/hooks/use-page-title\";\nimport { useTranslation } from \"react-i18next\";\nimport { Layout } from \"@/components/Layout\";\nimport { useApiService } from \"@/lib/api\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Textarea } from \"@/components/ui/textarea\";\nimport {  \n  Mail,\n  Phone,\n  MapPin,\n  Facebook,\n  Twitter,\n  Instagram,\n  Linkedin,\n  Send,\n} from \"lucide-react\";\nimport constants from \"@/constants/constants.json\";\nimport { GoogleMap } from \"@/modules/google-map\";\nimport { FormFileInput } from \"@/components/FormFileInput\";\nimport { FormField } from \"@/components/FormField\";\n\nconst socialIcons: Record<string, React.ElementType> = {\n  facebook: Facebook,\n  twitter: Twitter,\n  instagram: Instagram,\n  linkedin: Linkedin,\n};\n\nexport function ContactPageMapSplit() {\n  const { t } = useTranslation(\"contact-page-map-split\");\n  usePageTitle({ title: t(\"title\") });\n\n  const apiService = useApiService();\n\n  const socialLinks = useMemo(() => {\n    const socialMedia = constants.socialMedia as\n      | Record<string, string>\n      | undefined;\n    if (!socialMedia) return [];\n    return Object.entries(socialMedia)\n      .filter(([platform, url]) => url && socialIcons[platform])\n      .map(([platform, url]) => ({\n        platform,\n        url,\n        Icon: socialIcons[platform],\n      }));\n  }, []);\n\n  const [formData, setFormData] = useState({\n    name: \"\",\n    email: \"\",\n    phone: \"\",\n    message: \"\",\n    attachments: [] as File[]\n  });\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [submitStatus, setSubmitStatus] = useState<\n    \"idle\" | \"success\" | \"error\"\n  >(\"idle\");\n\n\n  const handleFileUploadChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const selectedFiles = Array.from(e.target.files || []) as File[];\n    const maxFiles = constants.file?.maxFiles || 5;\n\n    const remainingSlots = maxFiles - formData.attachments.length;\n\n    // If the limit is exceeded, alert and do not add any files\n    if (selectedFiles.length > remainingSlots) {\n      alert(t(\"maxFilesLimit\", { max: maxFiles }));\n      e.target.value = ''; // Clear the input\n      return;\n    }\n\n    setFormData(prev => ({\n      ...prev,\n      attachments: [...prev.attachments, ...selectedFiles]\n    }));\n\n    e.target.value = ''; // Clear the input\n  }\n\n  const handleRemoveFile = (index: number) => {\n    setFormData(prev => ({\n      ...prev,\n      attachments: prev.attachments.filter((_, i) => i !== index)\n    }));\n  };\n\n  // Auto-reset status after 5 seconds with proper cleanup\n  useEffect(() => {\n    if (submitStatus === \"idle\") return;\n    const timer = setTimeout(() => setSubmitStatus(\"idle\"), 5000);\n    return () => clearTimeout(timer);\n  }, [submitStatus]);\n\n  const handleSubmit = async (e: React.FormEvent) => {\n    e.preventDefault();\n    setIsSubmitting(true);\n    setSubmitStatus(\"idle\");\n\n    try {\n      const currentLanguage = constants.site.defaultLanguage;\n\n      await apiService.submitFormWithFile(\n        formData,\n        {\n          email_subject1: \"Thank you for contacting us\",\n          email_subject2: \"New Contact Form Submission\",\n          fields: [\n            { name: \"name\", required: true },\n            { name: \"email\", required: true },\n            { name: \"phone\", required: false },\n            { name: \"message\", required: true },\n            { name: \"attachments\", required: false },\n          ],\n        },\n        currentLanguage\n      );\n\n      setSubmitStatus(\"success\");\n      setFormData({\n        name: \"\",\n        email: \"\",\n        phone: \"\",\n        message: \"\",\n        attachments: []\n      });\n    } catch (error: unknown) {\n      console.error(\"Form submission failed:\", error);\n      setSubmitStatus(\"error\");\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  const handleChange = (\n    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n  ) => {\n    setFormData((prev) => ({\n      ...prev,\n      [e.target.name]: e.target.value,\n    }));\n  };\n\n  // Default coordinates (can be customized via constants)\n  const mapLatitude = (constants as any).location?.latitude || 41.0082;\n  const mapLongitude = (constants as any).location?.longitude || 28.9784;\n\n  return (\n    <Layout>\n      <div className=\"min-h-screen flex flex-col lg:flex-row\">\n        {/* Left Side - Form & Info */}\n        <div className=\"w-full lg:w-1/2 bg-background py-12 lg:py-16 px-6 lg:px-12 flex flex-col justify-center\">\n          <div className=\"max-w-lg mx-auto w-full\">\n            {/* Header */}\n            <div className=\"mb-10\">\n              <h1 className=\"text-3xl lg:text-4xl font-bold text-foreground mb-3\">\n                {t(\"title\")}\n              </h1>\n              <p className=\"text-muted-foreground\">\n                {t(\"description\")}\n              </p>\n            </div>\n\n            {/* Contact Info Cards */}\n            <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4 mb-10\">\n              <div className=\"flex items-center gap-3 p-4 rounded-xl bg-muted/50\">\n                <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center\">\n                  <Mail className=\"w-5 h-5 text-primary\" />\n                </div>\n                <div className=\"min-w-0\">\n                  <p className=\"text-xs text-muted-foreground\">{t(\"email\")}</p>\n                  <p className=\"text-sm font-medium truncate\">{constants.email}</p>\n                </div>\n              </div>\n\n              <div className=\"flex items-center gap-3 p-4 rounded-xl bg-muted/50\">\n                <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center\">\n                  <Phone className=\"w-5 h-5 text-primary\" />\n                </div>\n                <div className=\"min-w-0\">\n                  <p className=\"text-xs text-muted-foreground\">{t(\"phone\")}</p>\n                  <p className=\"text-sm font-medium truncate\">{constants.phone}</p>\n                </div>\n              </div>\n\n              <div className=\"flex items-center gap-3 p-4 rounded-xl bg-muted/50 sm:col-span-2\">\n                <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0\">\n                  <MapPin className=\"w-5 h-5 text-primary\" />\n                </div>\n                <div className=\"min-w-0\">\n                  <p className=\"text-xs text-muted-foreground\">{t(\"address\")}</p>\n                  <p className=\"text-sm font-medium\">\n                    {constants.address.line1}, {constants.address.city}\n                  </p>\n                </div>\n              </div>\n            </div>\n\n            {/* Contact Form */}\n            <form onSubmit={handleSubmit} className=\"space-y-5\">\n              <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n                <FormField label={t(\"fullName\")} htmlFor=\"name\" required>\n                <Input\n                    id=\"name\"\n                    name=\"name\"\n                    type=\"text\"\n                    value={formData.name}\n                    onChange={handleChange}\n                    placeholder={t(\"fullNamePlaceholder\")}\n                    required\n                    className=\"mt-1.5\"\n                  />\n                </FormField>\n                <FormField label={t(\"emailAddress\")} htmlFor=\"email\" required>\n                <Input\n                    id=\"email\"\n                    name=\"email\"\n                    type=\"email\"\n                    value={formData.email}\n                    onChange={handleChange}\n                    placeholder={t(\"emailPlaceholder\")}\n                    required\n                    className=\"mt-1.5\"\n                  />\n                  </FormField>\n              </div>\n\n              <FormField label={t(\"phoneNumber\")} htmlFor=\"phone\">\n              <Input\n                  id=\"phone\"\n                  name=\"phone\"\n                  type=\"tel\"\n                  value={formData.phone}\n                  onChange={handleChange}\n                  placeholder={t(\"phonePlaceholder\")}\n                  className=\"mt-1.5\"\n                />\n              </FormField>\n              <FormField label={t(\"message\")} htmlFor=\"message\" required>\n              <Textarea\n                  id=\"message\"\n                  name=\"message\"\n                  value={formData.message}\n                  onChange={handleChange}\n                  placeholder={t(\"messagePlaceholder\")}\n                  required\n                  rows={4}\n                  className=\"mt-1.5 resize-none\"\n                />\n              </FormField>\n              <FormFileInput\n                files={formData.attachments}\n                onFilesChange={handleFileUploadChange}\n                handleRemoveFile={handleRemoveFile}\n                maxFiles={constants.file?.maxFiles || 5}\n                accept={constants.file?.accept || \".pdf,.doc,.docx,.jpg,.jpeg,.png\"}\n                disabled={isSubmitting}\n                uploadButtonText={t(\"addFiles\")}\n                maxFilesReachedText={t(\"maxFilesReached\")}\n              />\n              {submitStatus === \"success\" && (\n                <div className=\"p-3 bg-green-500/10 border border-green-500/30 rounded-lg\">\n                  <p className=\"text-green-600 dark:text-green-400 text-sm\">\n                    {t(\"success\")}\n                  </p>\n                </div>\n              )}\n\n              {submitStatus === \"error\" && (\n                <div className=\"p-3 bg-destructive/10 border border-destructive/30 rounded-lg\">\n                  <p className=\"text-destructive text-sm\">{t(\"error\")}</p>\n                </div>\n              )}\n\n              <Button\n                type=\"submit\"\n                size=\"lg\"\n                className=\"w-full\"\n                disabled={isSubmitting}\n              >\n                {isSubmitting ? (\n                  <>\n                    <div className=\"w-4 h-4 border-2 border-primary-foreground border-t-transparent rounded-full animate-spin mr-2\" />\n                    {t(\"sending\")}\n                  </>\n                ) : (\n                  <>\n                    <Send className=\"w-4 h-4 mr-2\" />\n                    {t(\"submit\")}\n                  </>\n                )}\n              </Button>\n            </form>\n\n            {/* Social Links */}\n            {socialLinks.length > 0 && (\n              <div className=\"mt-10 pt-6 border-t\">\n                <p className=\"text-sm text-muted-foreground mb-3\">\n                  {t(\"followUs\")}\n                </p>\n                <div className=\"flex gap-2\">\n                  {socialLinks.map(({ platform, url, Icon }) => (\n                    <a\n                      key={platform}\n                      href={url}\n                      target=\"_blank\"\n                      rel=\"noopener noreferrer\"\n                      className=\"h-10 w-10 flex items-center justify-center rounded-full border text-muted-foreground hover:text-primary hover:border-primary transition-colors\"\n                    >\n                      <Icon className=\"h-4 w-4\" />\n                    </a>\n                  ))}\n                </div>\n              </div>\n            )}\n          </div>\n        </div>\n\n        {/* Right Side - Map */}\n        <div className=\"w-full lg:w-1/2 h-[400px] lg:h-[calc(100vh-4rem)] relative\">\n          <GoogleMap\n            latitude={mapLatitude}\n            longitude={mapLongitude}\n            zoom={14}\n            height=\"100%\"\n            className=\"rounded-none border-0 h-full\"\n            title={t(\"mapTitle\")}\n          />\n        </div>\n      </div>\n    </Layout>\n  );\n}\n\nexport default ContactPageMapSplit;\n"
     },
     {
       "path": "contact-page-map-split/lang/en.json",
       "type": "registry:lang",
       "target": "$modules$/contact-page-map-split/lang/en.json",
-      "content": "{\r\n  \"title\": \"Get in Touch\",\r\n  \"description\": \"Have a question or want to work together? Fill out the form below and we'll get back to you as soon as possible.\",\r\n  \"email\": \"Email\",\r\n  \"phone\": \"Phone\",\r\n  \"address\": \"Address\",\r\n  \"fullName\": \"Full Name\",\r\n  \"fullNamePlaceholder\": \"Your name\",\r\n  \"emailAddress\": \"Email Address\",\r\n  \"emailPlaceholder\": \"your@email.com\",\r\n  \"phoneNumber\": \"Phone Number\",\r\n  \"phonePlaceholder\": \"+1 (555) 000-0000\",\r\n  \"message\": \"Message\",\r\n  \"messagePlaceholder\": \"How can we help you?\",\r\n  \"submit\": \"Send Message\",\r\n  \"sending\": \"Sending...\",\r\n  \"success\": \"Your message has been sent successfully! We'll get back to you soon.\",\r\n  \"error\": \"Something went wrong. Please try again later.\",\r\n  \"followUs\": \"Follow us on social media\",\r\n  \"mapTitle\": \"Our Location\",\r\n  \"addFiles\": \"Add Files\",\r\n  \"maxFilesReached\": \"Maximum files reached\",\r\n  \"maxFilesLimit\": \"You can add up to {{max}} files\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"Get in Touch\",\n  \"description\": \"Have a question or want to work together? Fill out the form below and we'll get back to you as soon as possible.\",\n  \"email\": \"Email\",\n  \"phone\": \"Phone\",\n  \"address\": \"Address\",\n  \"fullName\": \"Full Name\",\n  \"fullNamePlaceholder\": \"Your name\",\n  \"emailAddress\": \"Email Address\",\n  \"emailPlaceholder\": \"your@email.com\",\n  \"phoneNumber\": \"Phone Number\",\n  \"phonePlaceholder\": \"+1 (555) 000-0000\",\n  \"message\": \"Message\",\n  \"messagePlaceholder\": \"How can we help you?\",\n  \"submit\": \"Send Message\",\n  \"sending\": \"Sending...\",\n  \"success\": \"Your message has been sent successfully! We'll get back to you soon.\",\n  \"error\": \"Something went wrong. Please try again later.\",\n  \"followUs\": \"Follow us on social media\",\n  \"mapTitle\": \"Our Location\",\n  \"addFiles\": \"Add Files\",\n  \"maxFilesReached\": \"Maximum files reached\",\n  \"maxFilesLimit\": \"You can add up to {{max}} files\"\n}\n"
     },
     {
       "path": "contact-page-map-split/lang/tr.json",
       "type": "registry:lang",
       "target": "$modules$/contact-page-map-split/lang/tr.json",
-      "content": "{\r\n  \"title\": \"Bize Ulaşın\",\r\n  \"description\": \"Sorunuz mu var veya birlikte çalışmak mı istiyorsunuz? Aşağıdaki formu doldurun, en kısa sürede size döneceğiz.\",\r\n  \"email\": \"E-posta\",\r\n  \"phone\": \"Telefon\",\r\n  \"address\": \"Adres\",\r\n  \"fullName\": \"Ad Soyad\",\r\n  \"fullNamePlaceholder\": \"Adınız\",\r\n  \"emailAddress\": \"E-posta Adresi\",\r\n  \"emailPlaceholder\": \"email@adresiniz.com\",\r\n  \"phoneNumber\": \"Telefon Numarası\",\r\n  \"phonePlaceholder\": \"+90 (555) 000 00 00\",\r\n  \"message\": \"Mesaj\",\r\n  \"messagePlaceholder\": \"Size nasıl yardımcı olabiliriz?\",\r\n  \"submit\": \"Mesaj Gönder\",\r\n  \"sending\": \"Gönderiliyor...\",\r\n  \"success\": \"Mesajınız başarıyla gönderildi! En kısa sürede size döneceğiz.\",\r\n  \"error\": \"Bir hata oluştu. Lütfen daha sonra tekrar deneyin.\",\r\n  \"followUs\": \"Sosyal medyada bizi takip edin\",\r\n  \"mapTitle\": \"Konumumuz\",\r\n  \"addFiles\": \"Dosya Ekle\",\r\n  \"maxFilesReached\": \"Maksimum dosya sayısına ulaşıldı\",\r\n  \"maxFilesLimit\": \"En fazla {{max}} kadar dosya ekleyebilirsiniz\"\r\n}\r\n"
+      "content": "{\n  \"title\": \"Bize Ulaşın\",\n  \"description\": \"Sorunuz mu var veya birlikte çalışmak mı istiyorsunuz? Aşağıdaki formu doldurun, en kısa sürede size döneceğiz.\",\n  \"email\": \"E-posta\",\n  \"phone\": \"Telefon\",\n  \"address\": \"Adres\",\n  \"fullName\": \"Ad Soyad\",\n  \"fullNamePlaceholder\": \"Adınız\",\n  \"emailAddress\": \"E-posta Adresi\",\n  \"emailPlaceholder\": \"email@adresiniz.com\",\n  \"phoneNumber\": \"Telefon Numarası\",\n  \"phonePlaceholder\": \"+90 (555) 000 00 00\",\n  \"message\": \"Mesaj\",\n  \"messagePlaceholder\": \"Size nasıl yardımcı olabiliriz?\",\n  \"submit\": \"Mesaj Gönder\",\n  \"sending\": \"Gönderiliyor...\",\n  \"success\": \"Mesajınız başarıyla gönderildi! En kısa sürede size döneceğiz.\",\n  \"error\": \"Bir hata oluştu. Lütfen daha sonra tekrar deneyin.\",\n  \"followUs\": \"Sosyal medyada bizi takip edin\",\n  \"mapTitle\": \"Konumumuz\",\n  \"addFiles\": \"Dosya Ekle\",\n  \"maxFilesReached\": \"Maksimum dosya sayısına ulaşıldı\",\n  \"maxFilesLimit\": \"En fazla {{max}} kadar dosya ekleyebilirsiniz\"\n}\n"
     }
   ],
   "exports": {