blocks-dusted 0.1.12 → 0.1.13

package/templates/blocks/DD-Testimonials/Component.tsx

@@ -1,139 +1,139 @@
-'use client'
-
-import React from 'react'
-import Image from 'next/image'
-import { Star } from 'lucide-react'
-import { motion, type Variants } from 'framer-motion'
-export type DDTestimonialsProps = Record<string, any>
-type Media = { url?: string | null }
-type Testimonial = {
-  id?: string | null
-  title?: string | null
-  content?: unknown
-  designation?: unknown
-  companyLogo?: Media | string | null
-  fallbackAvatarUrl?: string | null
-  rating?: number | null
-}
-
-function isLocalImageSrc(src?: string | null): src is string {
-  return typeof src === 'string' && src.startsWith('/api/media/file/')
-}
-
-const containerVariants: Variants = {
-  hidden: {},
-  show: { transition: { staggerChildren: 0.12, delayChildren: 0.05 } },
-}
-
-const cardVariants: Variants = {
-  hidden: { opacity: 0, y: 24 },
-  show: { opacity: 1, y: 0, transition: { duration: 0.5, ease: 'easeOut' } },
-}
-
-export const DDTestimonials: React.FC<DDTestimonialsProps> = ({
-  eyebrow,
-  headline,
-  testimonials,
-  sectionId,
-  customCSS,
-}) => {
-  const populated = ((testimonials ?? []) as unknown[]).filter(
-    (t): t is Testimonial => typeof t === 'object' && t !== null,
-  )
-
-  return (
-    <>
-      {customCSS && <style dangerouslySetInnerHTML={{ __html: customCSS }} />}
-
-      <div id={sectionId ?? 'testimonials'} className="py-24">
-        <div className="max-w-6xl lg:max-w-7xl mx-auto px-4 md:px-6">
-          {/* Header */}#BlockName-DDTestimonials
-          <div className="text-center max-w-xl mx-auto mb-14">
-            {eyebrow && (
-              <p className="text-[11.5px] font-semibold text-stone-400 tracking-widest uppercase mb-3 top-caption">
-                {eyebrow}
-              </p>
-            )}
-            <h2 className="text-3xl font-semibold text-stone-900 dark:text-stone-50 leading-tight">
-              {headline}
-            </h2>
-          </div>
-          {/* Testimonials */}
-          {populated.length > 0 && (
-            <motion.div
-              className="grid grid-cols-1 md:grid-cols-3 gap-6"
-              variants={containerVariants}
-              initial="hidden"
-              whileInView="show"
-              viewport={{ once: false, amount: 0.15 }}
-            >
-              {populated.map((t, i) => {
-                const avatarUrl =
-                  typeof t.companyLogo === 'object' &&
-                  t.companyLogo !== null &&
-                  'url' in t.companyLogo
-                    ? t.companyLogo.url
-                    : (t.fallbackAvatarUrl ?? null)
-                const safeAvatarUrl = isLocalImageSrc(avatarUrl) ? avatarUrl : null
-
-                const stars = Math.min(5, Math.max(1, t.rating ?? 5))
-
-                return (
-                  <motion.div
-                    key={t.id ?? i}
-                    className="rounded-2xl bg-stone-100 dark:bg-stone-900 border border-stone-100 dark:border-stone-800 p-8 flex flex-col"
-                    variants={cardVariants}
-                    style={{ cornerShape: 'squircle' } as React.CSSProperties}
-                  >
-                    {/* Stars */}
-                    <div className="flex items-center gap-1 mb-5">
-                      {Array.from({ length: stars }).map((_, si) => (
-                        <Star key={si} size={14} className="text-amber-400" fill="currentColor" />
-                      ))}
-                    </div>
-
-                    {/* Quote */}
-                    {t.content ? (
-                      <div className="text-sm text-stone-400 leading-relaxed flex-1 mb-6">
-                        {/* TODO: Reconnect this project's RichText renderer for testimonial content. */}
-                        <span>
-                          Reconnect this project's RichText renderer for testimonial content.
-                        </span>
-                      </div>
-                    ) : null}
-
-                    {/* Author / Company */}
-                    <div className="flex items-center gap-3 pt-5 border-t border-stone-800">
-                      {safeAvatarUrl && (
-                        <div className="w-10 h-10 rounded-full overflow-hidden shrink-0 relative">
-                          <Image
-                            src={safeAvatarUrl}
-                            alt={t.title ?? ''}
-                            fill
-                            sizes="40px"
-                            className="object-cover object-top"
-                          />
-                        </div>
-                      )}
-                      <div>
-                        <div className="text-sm font-semibold text-stone-800 dark:text-stone-50">
-                          {t.title}
-                        </div>
-                        {t.designation ? (
-                          <div className="text-xs text-stone-300">
-                            {/* TODO: Reconnect RichText for designation if needed. */}
-                            <span>Reconnect RichText for designation</span>
-                          </div>
-                        ) : null}
-                      </div>
-                    </div>
-                  </motion.div>
-                )
-              })}
-            </motion.div>
-          )}
-        </div>
-      </div>
-    </>
-  )
-}
+'use client'
+
+import React from 'react'
+import Image from 'next/image'
+import { Star } from 'lucide-react'
+import { motion, type Variants } from 'framer-motion'
+export type DDTestimonialsProps = Record<string, any>
+type Media = { url?: string | null }
+type Testimonial = {
+  id?: string | null
+  title?: string | null
+  content?: unknown
+  designation?: unknown
+  companyLogo?: Media | string | null
+  fallbackAvatarUrl?: string | null
+  rating?: number | null
+}
+
+function isLocalImageSrc(src?: string | null): src is string {
+  return typeof src === 'string' && src.startsWith('/api/media/file/')
+}
+
+const containerVariants: Variants = {
+  hidden: {},
+  show: { transition: { staggerChildren: 0.12, delayChildren: 0.05 } },
+}
+
+const cardVariants: Variants = {
+  hidden: { opacity: 0, y: 24 },
+  show: { opacity: 1, y: 0, transition: { duration: 0.5, ease: 'easeOut' } },
+}
+
+export const DDTestimonials: React.FC<DDTestimonialsProps> = ({
+  eyebrow,
+  headline,
+  testimonials,
+  sectionId,
+  customCSS,
+}) => {
+  const populated = ((testimonials ?? []) as unknown[]).filter(
+    (t): t is Testimonial => typeof t === 'object' && t !== null,
+  )
+
+  return (
+    <>
+      {customCSS && <style dangerouslySetInnerHTML={{ __html: customCSS }} />}
+
+      <div id={sectionId ?? 'testimonials'} className="py-4">
+        <div className="max-w-6xl lg:max-w-7xl mx-auto px-4 md:px-6">
+          {/* Header */}
+          <div className="text-center max-w-xl mx-auto mb-14">
+            {eyebrow && (
+              <p className="text-[11.5px] font-semibold text-stone-400 tracking-widest uppercase mb-3 top-caption">
+                {eyebrow}
+              </p>
+            )}
+            <h2 className="text-3xl font-semibold text-stone-900 dark:text-stone-50 leading-tight">
+              {headline}
+            </h2>
+          </div>
+          {/* Testimonials */}
+          {populated.length > 0 && (
+            <motion.div
+              className="grid grid-cols-1 md:grid-cols-3 gap-6"
+              variants={containerVariants}
+              initial="hidden"
+              whileInView="show"
+              viewport={{ once: false, amount: 0.15 }}
+            >
+              {populated.map((t, i) => {
+                const avatarUrl =
+                  typeof t.companyLogo === 'object' &&
+                  t.companyLogo !== null &&
+                  'url' in t.companyLogo
+                    ? t.companyLogo.url
+                    : (t.fallbackAvatarUrl ?? null)
+                const safeAvatarUrl = isLocalImageSrc(avatarUrl) ? avatarUrl : null
+
+                const stars = Math.min(5, Math.max(1, t.rating ?? 5))
+
+                return (
+                  <motion.div
+                    key={t.id ?? i}
+                    className="rounded-2xl bg-stone-100 dark:bg-stone-900 border border-stone-100 dark:border-stone-800 p-8 flex flex-col"
+                    variants={cardVariants}
+                    style={{ cornerShape: 'squircle' } as React.CSSProperties}
+                  >
+                    {/* Stars */}
+                    <div className="flex items-center gap-1 mb-5">
+                      {Array.from({ length: stars }).map((_, si) => (
+                        <Star key={si} size={14} className="text-amber-400" fill="currentColor" />
+                      ))}
+                    </div>
+
+                    {/* Quote */}
+                    {t.content ? (
+                      <div className="text-sm text-stone-400 leading-relaxed flex-1 mb-6">
+                        {/* TODO: Reconnect this project's RichText renderer for testimonial content. */}
+                        <span>
+                          Reconnect this project's RichText renderer for testimonial content.
+                        </span>
+                      </div>
+                    ) : null}
+
+                    {/* Author / Company */}
+                    <div className="flex items-center gap-3 pt-5 border-t border-stone-800">
+                      {safeAvatarUrl && (
+                        <div className="w-10 h-10 rounded-full overflow-hidden shrink-0 relative">
+                          <Image
+                            src={safeAvatarUrl}
+                            alt={t.title ?? ''}
+                            fill
+                            sizes="40px"
+                            className="object-cover object-top"
+                          />
+                        </div>
+                      )}
+                      <div>
+                        <div className="text-sm font-semibold text-stone-800 dark:text-stone-50">
+                          {t.title}
+                        </div>
+                        {t.designation ? (
+                          <div className="text-xs text-stone-300">
+                            {/* TODO: Reconnect RichText for designation if needed. */}
+                            <span>Reconnect RichText for designation</span>
+                          </div>
+                        ) : null}
+                      </div>
+                    </div>
+                  </motion.div>
+                )
+              })}
+            </motion.div>
+          )}
+        </div>
+      </div>
+    </>
+  )
+}

package/templates/blocks/DD-Thanks/Component.tsx

@@ -315,7 +315,7 @@ export function DDThanks({
     <section
       id={sectionId ?? undefined}
       className={cn(
-        'thanks-confetti-section relative flex min-h-screen w-full flex-col items-center justify-center overflow-hidden bg-stone-transparent dark:bg-stone-950 px-4 py-24 text-center hue-rotate-300 invert-100 dark:invert-0',
+        'thanks-confetti-section relative flex min-h-screen w-full flex-col items-center justify-center overflow-hidden bg-stone-transparent dark:bg-stone-950 px-4 py-4 text-center hue-rotate-300 invert-100 dark:invert-0',
         className,
       )}
     >