Files
react-editor-shopify/editor/components/logos/logos.editor.tsx
Rami Bitar 343a2aa3a7 Add media and AI plugins, refresh editor configs
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-04 22:36:42 -04:00

45 lines
1.5 KiB
TypeScript

import { ComponentConfig } from "@reacteditor/core";
import { imageField } from "@reacteditor/plugin-media/field";
import { Award } from "lucide-react";
import { Logos, type LogosProps } from "@/editor/components/logos/logos";
import { frontendAiMediaAdapter } from "@/editor/services/media-adapter";
export const logosEditor: ComponentConfig<LogosProps> = {
label: "Press / Logos",
icon: <Award size={16} />,
category: "content",
defaultProps: {
tagline: "As seen in",
layout: "row",
items: [
{ src: "https://logo.clearbit.com/vogue.com", alt: "Vogue" },
{ src: "https://logo.clearbit.com/highsnobiety.com", alt: "Highsnobiety" },
{ src: "https://logo.clearbit.com/gq.com", alt: "GQ" },
{ src: "https://logo.clearbit.com/dezeen.com", alt: "Dezeen" },
{ src: "https://logo.clearbit.com/wallpaper.com", alt: "Wallpaper*" },
],
},
fields: {
tagline: { label: "Tagline", type: "text", contentEditable: true },
layout: {
label: "Layout",
type: "radio",
options: [
{ label: "Row", value: "row" },
{ label: "Marquee", value: "marquee" },
],
},
items: {
label: "Logos",
type: "array",
defaultItemProps: { src: "", alt: "" },
getItemSummary: (it) => it?.alt || "Logo",
arrayFields: {
src: { label: "Image", ...imageField({ adapter: frontendAiMediaAdapter }) },
alt: { label: "Alt text", type: "text", contentEditable: true },
},
},
},
render: (props) => <Logos {...props} />,
};