import { c as P$1 } from "./chunk-3YVJ2ELD.js";
import { a as y } from "./chunk-RJYZ5FAR.js";
import { m as qe } from "./chunk-AFVJZPLS.js";
import { b as b$1 } from "./chunk-CCI4C3TM.js";
import { a as l } from "./chunk-A3GF4PYW.js";
import { b as s, d as b } from "./chunk-ZTZJHY4E.js";
import { c as y$1 } from "./chunk-CZRCW5EN.js";
import { c } from "./chunk-OHNYCXPX.js";
import { Type } from "@sinclair/typebox";
import { IoGridOutline } from "../../../../node_modules/.pnpm/react-icons@5.5.0_react@19.1.1/node_modules/react-icons/io5/index.js";
/*! Upstart.gg - Copyright (C) 2024 Flippable - https://github.com/upstart-gg/upstart/blob/main/LICENSE */
var w = y({ type: "images-gallery", name: "Gallery", category: "media", description: "Displays an images collection.", aiInstructions: "This brick should mostly be used for image galleries. Prefer using card bricks for product showcases, articles lists with images, or other collections.", consumesMultipleQueryRows: true, defaultInspectorTab: "content", isContainer: false, minHeight: { desktop: 200 }, minWidth: { desktop: 300 }, defaultWidth: { desktop: "400px", mobile: "100%" }, icon: IoGridOutline, props: P$1({ colorPreset: Type.Optional(y$1({ title: "Color" })), loop: Type.Optional(qe()), images: Type.Array(Type.Object({ image: b$1({ "ui:responsive": "desktop", "ui:no-alt-text": true, "ui:no-object-options": true, "ui:placeholder": "https://example.com/image.jpg" }), legend: Type.Optional(l("Legend")) }), { title: "Images", default: [], maxItems: 12, metadata: { category: "content", consumeQuery: true }, examples: [{ image: { src: "https://via.placeholder.com/300x200.png?text=Image+1" }, legend: "Image 1" }, { image: { src: "https://via.placeholder.com/300x200.png?text=Image+2" }, legend: "Image 2" }, { image: { src: "https://via.placeholder.com/300x200.png?text=Image+3" }, legend: "Image 3" }] }), columns: Type.Optional(Type.Number({ title: "Columns", description: "Number of columns. Only applies to desktop screens. On mobile, it will always display 1 column.", minimum: 1, maximum: 6, default: 3, "ui:field": "slider", "ui:responsive": "desktop" })), gap: Type.Optional(c({ title: "Gap", description: "The gap between the images.", default: "1rem", "ui:styleId": "styles:gap" })), padding: Type.Optional(c({ default: "3rem", description: "Padding inside the gallery.", "ai:instructions": "Use only a single value like '1rem' or '10px'", title: "Padding", "ui:responsive": true, "ui:placeholder": "Not specified", "ui:styleId": "styles:padding" })), rounding: Type.Optional(b()), border: Type.Optional(s()) }) }), P = [{ description: "Product portfolio gallery (3-column grid)", type: "images-gallery", props: { columns: 3, gap: "2.5rem", padding: "p-4", images: [{ image: { src: "https://via.placeholder.com/400x400.png?text=Product+1" }, legend: "Premium wireless headphones" }, { image: { src: "https://via.placeholder.com/400x400.png?text=Product+2" }, legend: "Bluetooth speaker" }, { image: { src: "https://via.placeholder.com/400x400.png?text=Product+3" }, legend: "Smart fitness tracker" }, { image: { src: "https://via.placeholder.com/400x400.png?text=Product+4" }, legend: "Wireless charging pad" }] } }, { description: "Team photos gallery (4-column grid), light neutral background", type: "images-gallery", props: { columns: 4, gap: "1rem", padding: "p-6", images: [{ image: { src: "https://via.placeholder.com/300x300.png?text=CEO" }, legend: "Sarah Johnson - Chief Executive Officer" }, { image: { src: "https://via.placeholder.com/300x300.png?text=CTO" }, legend: "Mike Chen - Chief Technology Officer" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Design" }, legend: "Emily Rodriguez - Head of Design" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Marketing" }, legend: "David Park - Marketing Director" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Sales" }, legend: "Lisa Wong - Sales Manager" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Support" }, legend: "Alex Thompson - Customer Support Lead" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Dev" }, legend: "Carlos Martinez - Senior Developer" }, { image: { src: "https://via.placeholder.com/300x300.png?text=HR" }, legend: "Jennifer Adams - HR Specialist" }], colorPreset: { color: "neutral-100" } } }, { description: "Project showcase (2-column grid with larger spacing)", type: "images-gallery", props: { columns: 2, gap: "1rem", padding: "p-6", images: [{ image: { src: "https://via.placeholder.com/600x400.png?text=Website+Redesign" }, legend: "Modern e-commerce website redesign project" }, { image: { src: "https://via.placeholder.com/600x400.png?text=Mobile+App" }, legend: "iOS and Android mobile application" }, { image: { src: "https://via.placeholder.com/600x400.png?text=Brand+Identity" }, legend: "Complete brand identity design package" }, { image: { src: "https://via.placeholder.com/600x400.png?text=Dashboard+UI" }, legend: "Analytics dashboard user interface" }] } }, { description: "Event photos gallery with tight spacing and minimal padding", type: "images-gallery", props: { columns: 4, gap: "1rem", padding: "p-6", images: [{ image: { src: "https://via.placeholder.com/250x180.png?text=Opening" }, legend: "Conference opening ceremony" }, { image: { src: "https://via.placeholder.com/250x180.png?text=Keynote" }, legend: "Keynote presentation" }, { image: { src: "https://via.placeholder.com/250x180.png?text=Workshop" }, legend: "Technical workshop session" }, { image: { src: "https://via.placeholder.com/250x180.png?text=Networking" }, legend: "Networking lunch break" }, { image: { src: "https://via.placeholder.com/250x180.png?text=Panel" }, legend: "Expert panel discussion" }, { image: { src: "https://via.placeholder.com/250x180.png?text=Awards" }, legend: "Awards ceremony" }] } }, { description: "Photography portfolio with single column layout and primary background", type: "images-gallery", props: { columns: 1, gap: "3rem", padding: "4rem", colorPreset: { color: "primary-50" }, rounding: "rounded-lg", images: [{ image: { src: "https://via.placeholder.com/800x600.png?text=Landscape+1" }, legend: "Mountain sunrise landscape photography" }, { image: { src: "https://via.placeholder.com/800x600.png?text=Portrait+1" }, legend: "Professional business portrait session" }, { image: { src: "https://via.placeholder.com/800x600.png?text=Architecture+1" }, legend: "Modern architectural photography" }] } }, { description: "Real estate property gallery with secondary colors and borders", type: "images-gallery", props: { columns: 3, gap: "1.5rem", padding: "2rem", colorPreset: { color: "secondary-100" }, border: { width: "border", color: "border-secondary-300" }, rounding: "rounded-xl", images: [{ image: { src: "https://via.placeholder.com/400x300.png?text=Living+Room" }, legend: "Spacious living room with natural light" }, { image: { src: "https://via.placeholder.com/400x300.png?text=Kitchen" }, legend: "Modern kitchen with granite countertops" }, { image: { src: "https://via.placeholder.com/400x300.png?text=Master+Bedroom" }, legend: "Master bedroom with walk-in closet" }, { image: { src: "https://via.placeholder.com/400x300.png?text=Bathroom" }, legend: "Luxury bathroom with marble finishes" }, { image: { src: "https://via.placeholder.com/400x300.png?text=Backyard" }, legend: "Private backyard with pool" }, { image: { src: "https://via.placeholder.com/400x300.png?text=Garage" }, legend: "Two-car garage with storage" }] } }, { description: "Restaurant food gallery with 5-column grid and accent colors", type: "images-gallery", props: { columns: 5, gap: "0.75rem", padding: "1.5rem", colorPreset: { color: "accent-200" }, rounding: "rounded-md", images: [{ image: { src: "https://via.placeholder.com/300x300.png?text=Appetizer" }, legend: "Bruschetta with fresh tomatoes" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Soup" }, legend: "Creamy mushroom bisque" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Salad" }, legend: "Mediterranean quinoa salad" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Main+Course" }, legend: "Grilled salmon with herbs" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Dessert" }, legend: "Chocolate lava cake" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Beverage" }, legend: "Artisan coffee selection" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Pasta" }, legend: "Homemade fettuccine alfredo" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Pizza" }, legend: "Wood-fired margherita pizza" }] } }, { description: "Art gallery exhibition with 6-column grid and minimal styling", type: "images-gallery", props: { columns: 6, gap: "0.5rem", padding: "1rem", images: [{ image: { src: "https://via.placeholder.com/200x250.png?text=Abstract+1" }, legend: "Abstract composition #1" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Portrait+Art" }, legend: "Contemporary portrait" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Landscape+Art" }, legend: "Impressionist landscape" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Still+Life" }, legend: "Modern still life" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Sculpture" }, legend: "Bronze sculpture piece" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Digital+Art" }, legend: "Digital artwork collection" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Mixed+Media" }, legend: "Mixed media installation" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Photography" }, legend: "Fine art photography" }, { image: { src: "https://via.placeholder.com/200x250.png?text=Watercolor" }, legend: "Watercolor painting" }] } }, { description: "Fashion lookbook with 2-column layout and neutral dark theme", type: "images-gallery", props: { columns: 2, gap: "2rem", padding: "3rem", colorPreset: { color: "neutral-800" }, border: { width: "border-2", color: "border-neutral-600" }, rounding: "rounded-2xl", images: [{ image: { src: "https://via.placeholder.com/400x600.png?text=Spring+Look" }, legend: "Spring casual collection 2024" }, { image: { src: "https://via.placeholder.com/400x600.png?text=Summer+Look" }, legend: "Summer evening wear" }, { image: { src: "https://via.placeholder.com/400x600.png?text=Business+Look" }, legend: "Professional business attire" }, { image: { src: "https://via.placeholder.com/400x600.png?text=Weekend+Look" }, legend: "Weekend comfort style" }, { image: { src: "https://via.placeholder.com/400x600.png?text=Formal+Look" }, legend: "Formal evening collection" }, { image: { src: "https://via.placeholder.com/400x600.png?text=Street+Style" }, legend: "Urban street fashion" }] } }, { description: "Travel destinations gallery with 3-column grid and no legends", type: "images-gallery", props: { columns: 3, gap: "1.25rem", padding: "2.5rem", colorPreset: { color: "primary-100" }, rounding: "rounded-lg", border: { width: "border", color: "border-primary-200" }, images: [{ image: { src: "https://via.placeholder.com/350x250.png?text=Paris" } }, { image: { src: "https://via.placeholder.com/350x250.png?text=Tokyo" } }, { image: { src: "https://via.placeholder.com/350x250.png?text=New+York" } }, { image: { src: "https://via.placeholder.com/350x250.png?text=London" } }, { image: { src: "https://via.placeholder.com/350x250.png?text=Rome" } }, { image: { src: "https://via.placeholder.com/350x250.png?text=Barcelona" } }] } }, { description: "Technical equipment gallery with 4-column grid and accent styling", type: "images-gallery", props: { columns: 4, gap: "1rem", padding: "2rem", colorPreset: { color: "accent-100" }, border: { width: "border-4", color: "border-accent-400" }, rounding: "rounded-xl", images: [{ image: { src: "https://via.placeholder.com/300x300.png?text=Camera" }, legend: "Professional DSLR camera" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Laptop" }, legend: "High-performance laptop" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Microphone" }, legend: "Studio recording microphone" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Monitor" }, legend: "4K professional monitor" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Tablet" }, legend: "Digital drawing tablet" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Speakers" }, legend: "Studio monitor speakers" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Keyboard" }, legend: "Mechanical keyboard" }, { image: { src: "https://via.placeholder.com/300x300.png?text=Mouse" }, legend: "Precision gaming mouse" }] } }, { description: "Minimal product showcase with large gaps and no padding", type: "images-gallery", props: { columns: 3, gap: "4rem", padding: "0rem", images: [{ image: { src: "https://via.placeholder.com/400x400.png?text=Watch" }, legend: "Luxury Swiss timepiece" }, { image: { src: "https://via.placeholder.com/400x400.png?text=Jewelry" }, legend: "Handcrafted gold necklace" }, { image: { src: "https://via.placeholder.com/400x400.png?text=Sunglasses" }, legend: "Designer sunglasses collection" }] } }, { description: "Dynamic product gallery using products query with loop", type: "images-gallery", props: { columns: 4, gap: "1.5rem", padding: "2rem", colorPreset: { color: "primary-50" }, rounding: "rounded-lg", border: { width: "border", color: "border-primary-200" }, images: [{ image: { src: "{{products.image}}" }, legend: "{{products.name}} - ${{products.price}}" }], loop: { over: "products" } } }, { description: "Portfolio showcase using portfolioProjects query with loop", type: "images-gallery", props: { columns: 3, gap: "2rem", padding: "3rem", colorPreset: { color: "secondary-100" }, rounding: "rounded-xl", images: [{ image: { src: "{{portfolioProjects.thumbnail}}" }, legend: "{{portfolioProjects.projectName}} - {{portfolioProjects.clientName}} ({{portfolioProjects.year}})" }], loop: { over: "portfolioProjects" } } }, { description: "Event photo gallery using eventPhotos query with loop", type: "images-gallery", props: { columns: 5, gap: "1rem", padding: "1.5rem", colorPreset: { color: "accent-50" }, border: { width: "border-2", color: "border-accent-300" }, rounding: "rounded-md", images: [{ image: { src: "{{eventPhotos.imageUrl}}" }, legend: "{{eventPhotos.caption}} - {{eventPhotos.eventDate}}" }], loop: { over: "eventPhotos" } } }, { description: "Team member gallery using teamMembers query with loop", type: "images-gallery", props: { columns: 6, gap: "0.75rem", padding: "2.5rem", colorPreset: { color: "neutral-100" }, rounding: "rounded-lg", border: { width: "border", color: "border-neutral-300" }, images: [{ image: { src: "{{teamMembers.profilePhoto}}" }, legend: "{{teamMembers.fullName}} - {{teamMembers.position}}" }], loop: { over: "teamMembers" } } }];
export {
  w as a,
  P as b
};
//# sourceMappingURL=chunk-WYVJE6J5.js.map
