50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T1587,'use client'; import { ExpandableGrid, ExpandableGridCell, ExpandableGridClose, ExpandableGridControls, ExpandableGridContent, ExpandbleGridArrow, } from '@/components/systaliko-ui/ecommerce/expandable-grid'; import { Button } from '@/components/systaliko-ui/shadcn/button'; import { ArrowLeftIcon, ArrowRightIcon, ShoppingBagIcon, XIcon, } from 'lucide-react'; const products = [ { id: 'product-16', name: 'Dunk low', category: 'shoes', price: 120, imageUrl: 'https://m.media-amazon.com/images/I/610xbLBO7OL._AC_SX695_.jpg', }, { id: 'product-2', name: 'Air Jordan', category: 'Shoes', price: 29, imageUrl: 'https://m.media-amazon.com/images/I/71zTqMdALmL._AC_SX679_.jpg', }, { id: 'product-6', name: 'Dunk low', category: 'Shoes', price: 199.99, imageUrl: 'https://m.media-amazon.com/images/I/7119MA+u0-L._AC_SY695_.jpg', }, { id: 'product-8', name: 'Dunk low', category: 'Shoes', price: 209, imageUrl: 'https://m.media-amazon.com/images/I/71O6Mufrm9L._AC_SX695_.jpg', }, { id: 'product-10', name: 'Air 1', category: 'Shoes', price: 309, imageUrl: 'https://m.media-amazon.com/images/I/51lif4Kn+hL._AC_SX695_.jpg', }, { id: 'product-9', name: 'Air 1', category: 'Shoes', price: 109, imageUrl: 'https://m.media-amazon.com/images/I/71xE6hxRI8L._AC_SX695_.jpg', }, { id: 'product-11', name: 'Spizike', category: 'Shoes', price: 289.99, imageUrl: 'https://m.media-amazon.com/images/I/61YTxxzMl7L._AC_SY695_.jpg', }, { id: 'product-12', name: 'Air 1', category: 'Shoes', price: 129.99, imageUrl: 'https://m.media-amazon.com/images/I/610ts+H4DSL._AC_SY695_.jpg', }, { id: 'product-13', name: 'Air 1', category: 'Shoes', price: 139.99, imageUrl: 'https://m.media-amazon.com/images/I/713LjPUQ+iL._AC_SY695_.jpg', }, { id: 'product-14', name: 'Air 1', category: 'Shoes', price: 99.99, imageUrl: 'https://m.media-amazon.com/images/I/51Gq5rf1snL._AC_SX695_.jpg', }, { id: 'product-15', name: 'Spizike Low', category: 'Shoes', price: 139.99, imageUrl: 'https://m.media-amazon.com/images/I/51QWuYdWCwL._AC_SY695_.jpg', }, { id: 'product-1', name: 'Air 1', category: 'Shoes', price: 149.99, imageUrl: 'https://m.media-amazon.com/images/I/61u1hnBaaTL._AC_SX695_.jpg', }, ]; const button_styles = 'cursor-pointer rounded-full bg-secondary text-secondary-foreground hover:bg-secondary/80 size-6 flex justify-center items-center [&>svg]:w-3'; export function ExpandableGridDemo() { return (

{products.map((product, index) => (

{product.name}

${product.price}

{['7', '8', '9', '10', '11'].map((size) => ( ))}

))}

); } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L50",null,{"namespace":"@systaliko-ui","registryDependencies":["https://systaliko-ui.vercel.app/r/ecommerce/expandable-grid"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"registry/demo/ecommerce/expandable-grid/index.tsx","content":"$52","type":"registry:block","target":"components/systaliko-ui/demo/expandable-grid.tsx"}],"className":"h-[70svh] min-h-80"}]]}]