blocks-dusted 0.1.12 → 0.1.13

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

@@ -1,51 +1,54 @@
-import type { BannerBlock as BannerBlockProps } from 'src/payload-types'
-
-import { cn } from '@/utilities/ui'
-import React from 'react'
-import RichText from '@/components/RichText'
-
-// Shared ::before overlay (lines.svg texture) applied to all banner variants
-const BANNER_BEFORE_CLS =
-  'relative z-0 ' +
-  "before:content-[''] before:absolute before:inset-0 before:z-[-1] " +
-  'before:bg-[url(/assets/svg/lines.svg)] before:bg-[length:10px_10px] ' +
-  'before:bg-repeat before:opacity-100 before:pointer-events-none'
-
-type Props = {
-  className?: string
-  wrapperClassName?: string
-} & BannerBlockProps
-
-export const BannerBlock: React.FC<Props> = ({ className, wrapperClassName, content, style }) => {
-  return (
-    <div className={cn('mx-auto my-8 w-full banner_container', className)}>
-      <div
-        className={cn(
-          wrapperClassName,
-          'border py-3 pl-0 pr-3 flex items-center rounded shadow-2xl banner_content',
-          BANNER_BEFORE_CLS,
-          {
-            'banner-info border-[var(--border)] bg-card text-[var(--black)] [box-shadow:inset_0_0_2px_0px_var(--border),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--border)]':
-              style === 'info',
-            'banner-error border-[var(--error-border)] bg-[var(--error)] text-[var(--white)] [box-shadow:inset_0_0_2px_0px_var(--error),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--error-border)] text-stone-200 dark:text-stone-200':
-              style === 'error',
-            'banner-success border-[var(--success-border)] bg-[var(--success)] text-[var(--white)] [box-shadow:inset_0_0_2px_0px_var(--success),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--success-border)] text-stone-200 dark:text-stone-200':
-              style === 'success',
-            'banner-warning border-[var(--warning-border)] bg-[var(--warning)] text-white [box-shadow:inset_0_0_2px_0px_var(--warning),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--warning-border)]':
-              style === 'warning',
-          }
-        )}
-      >
-        <RichText
-          data={content}
-          className="banner_richtext"
-          enableGutter={false}
-          enableProse={true}
-        />
-      </div>
-    </div>
-  )
-}
-
-export const DDBanner = BannerBlock
-export default DDBanner
+type BannerBlockProps = {
+  content?: any
+  style?: 'info' | 'warning' | 'error' | 'success'
+}
+
+import { cn } from '@/utilities/ui'
+import React from 'react'
+import RichText from '@/components/RichText'
+
+// Shared ::before overlay (lines.svg texture) applied to all banner variants
+const BANNER_BEFORE_CLS =
+  'relative z-0 ' +
+  "before:content-[''] before:absolute before:inset-0 before:z-[-1] " +
+  'before:bg-lines before:bg-[length:10px_10px] ' +
+  'before:bg-repeat before:opacity-100 before:pointer-events-none'
+
+type Props = {
+  className?: string
+  wrapperClassName?: string
+} & BannerBlockProps
+
+export const BannerBlock: React.FC<Props> = ({ className, wrapperClassName, content, style }) => {
+  return (
+    <div className={cn('mx-auto my-8 w-full banner_container', className)}>
+      <div
+        className={cn(
+          wrapperClassName,
+          'border py-3 pl-0 pr-3 flex items-center rounded shadow-2xl banner_content',
+          BANNER_BEFORE_CLS,
+          {
+            'banner-info border-[var(--border)] bg-card text-[var(--black)] [box-shadow:inset_0_0_2px_0px_var(--border),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--border)]':
+              style === 'info',
+            'banner-error border-[var(--error-border)] bg-[var(--error)] text-[var(--white)] [box-shadow:inset_0_0_2px_0px_var(--error),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--error-border)] text-stone-800 dark:text-stone-200':
+              style === 'error',
+            'banner-success border-[var(--success-border)] bg-[var(--success)] text-[var(--white)] [box-shadow:inset_0_0_2px_0px_var(--success),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--success-border)] text-stone-800 dark:text-stone-200':
+              style === 'success',
+            'banner-warning border-[var(--warning-border)] bg-[var(--warning)] text-white [box-shadow:inset_0_0_2px_0px_var(--warning),var(--shadow-xl)] [&_blockquote]:!border-s-[var(--warning-border)]':
+              style === 'warning',
+          },
+        )}
+      >
+        <RichText
+          data={content}
+          className="banner_richtext"
+          enableGutter={false}
+          enableProse={true}
+        />
+      </div>
+    </div>
+  )
+}
+
+export const DDBanner = BannerBlock
+export default DDBanner