2d:I[522016,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],""] 2e:I[406394,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],"BlockTabs"] 2f:I[966139,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],"PreviewFrame"] 30:I[967833,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],"CodeView"] 31:T10fb,"use client"; import * as React from "react"; import { Separator } from "@/components/ui/separator"; import { cn } from "@/lib/utils"; import { ItemCardDefaultsContext, type ItemCardDefaults } from "../item-card/item-card"; export type ItemCardGroupProps = React.ComponentProps<"div"> & ItemCardDefaults; /** Root: shares variant, size and pressable with every ItemCard inside. */ export function ItemCardGroup({ variant, size, pressable, className, ...props }: ItemCardGroupProps) { const defaults = React.useMemo(() => ({ variant, size, pressable }), [variant, size, pressable]); return (

); } export function ItemCardGroupHeader({ className, ...props }: React.ComponentProps<"div">) { return

; } export function ItemCardGroupTitle({ className, ...props }: React.ComponentProps<"h3">) { return

; } export function ItemCardGroupDescription({ className, ...props }: React.ComponentProps<"p">) { return
; } const columnClass = { 1: "grid-cols-1", 2: "grid-cols-1 sm:grid-cols-2", 3: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", } as const; export type ItemCardGroupListProps = React.ComponentProps<"div"> & { /** `list` fuses the cards into one bordered block with hairline dividers; `grid` keeps them apart. */ layout?: "list" | "grid"; columns?: 1 | 2 | 3; }; export function ItemCardGroupList({ layout = "list", columns = 2, className, children, ...props }: ItemCardGroupListProps) { const items = React.Children.toArray(children).filter(React.isValidElement); if (layout === "grid") { return (
{items.map((child, i) => (
{child}
))}
); } return (
{items.map((child, i) => ( {i > 0 ? : null}
{child}
))}
); } export type ItemCardGroupSectionProps = Omit, "title"> & Pick & { title?: React.ReactNode; description?: React.ReactNode; }; /** Titled section: header plus a list or grid of cards. Stack several for grouped settings. / export function ItemCardGroupSection({ title, description, layout, columns, className, children, ...props }: ItemCardGroupSectionProps) { const id = React.useId(); return (
{title || description ? ( {title ? {title} : null} {description ? {description} : null} ) : null} {children}
); } 32:T2445,"use client"; import as React from "react"; import { IconCheck, IconChevronDown, IconChevronRight } from "@tabler/icons-react"; import { cva, type VariantProps } from "class-variance-authority"; import { Button } from "@/components/ui/button"; import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemHeader, ItemMedia, ItemTitle, } from "@/components/ui/item"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { Switch } from "@/components/ui/switch"; import { cn } from "@/lib/utils"; /** Group-level defaults an ItemCard inherits (set by ItemCardGroup). */ export type ItemCardDefaults = { variant?: "default" | "outline" | "muted" | "raised"; size?: "default" | "sm" | "xs"; pressable?: boolean; }; export const ItemCardDefaultsContext = React.createContext({}); const itemCard = cva( [ "transition-[background-color,border-color,box-shadow,scale] duration-150 ease-[cubic-bezier(0.23,1,0.32,1)] motion-reduce:transition-none", "data-[selected=true]:border-foreground data-[selected=true]:bg-muted/50 data-[selected=true]:shadow-[inset_0_0_0_1px_var(--foreground)]", "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50", ], { variants: { variant: { default: "", outline: "", muted: "", /** Hairline, then a soft shadow, on the card surface. / raised: "border-border bg-card shadow-[0_1px_2px_0_rgb(0_0_0/0.06)]", }, orientation: { horizontal: "", vertical: "flex-col items-start gap-3 p-4 :data-[slot=item-content]:w-full :data-[slot=item-media]:translate-y-0 :data-[slot=item-media]:self-start!", }, pressable: { true: [ "w-full cursor-pointer text-start", "hover:bg-muted/60 active:scale-[0.99] motion-reduce:active:scale-100", ], false: "", }, }, defaultVariants: { variant: "default", orientation: "horizontal", pressable: false }, }, ); export type ItemCardProps = Omit, "variant"> & Omit, "pressable"> & { variant?: "default" | "outline" | "muted" | "raised"; /** Whole card is one button (or the element you pass to `render`). Don't nest controls inside. */ pressable?: boolean; selected?: boolean; /** Trailing radio-style mark. Defaults to on when `selected` is provided. */ indicator?: boolean; disabled?: boolean; }; /** Icon, title and description with a trailing control. Built on the Kobra item. */ export function ItemCard({ className, variant, size, orientation = "horizontal", pressable, selected, indicator, disabled, render, children, ...props }: ItemCardProps) { const defaults = React.useContext(ItemCardDefaultsContext); const v = variant ?? defaults.variant ?? "outline"; const p = pressable ?? defaults.pressable ?? false; const s = size ?? defaults.size ?? "default"; const pressProps = p ? { "aria-pressed": selected === undefined ? undefined : selected, ...(render ? {} : { disabled, type: "button" as const }), } : {}; return ( : undefined)} className={cn(itemCard({ variant: v, orientation, pressable: p }), className)} {...(pressProps as object)} {...props} > {children} {(indicator ?? selected !== undefined) ? : null} ); } /** Radio-style mark: empty ring at rest, ink disc with a check when selected. */ export function ItemCardMark({ selected }: { selected: boolean }) { return ( ); } export const ItemCardHeader = ItemHeader; export const ItemCardFooter = ItemFooter; export const ItemCardContent = ItemContent; export const ItemCardTitle = ItemTitle; export const ItemCardDescription = ItemDescription; export const ItemCardActions = ItemActions; /** Leading media. Default is the icon tile; `variant="image"` for a thumbnail. */ export function ItemCardMedia({ variant = "icon", ...props }: React.ComponentProps) { return ; } /** Trailing text value, optionally with a chevron to signal navigation. */ export function ItemCardValue({ children, chevron = false, className, ...props }: React.ComponentProps<"span"> & { chevron?: boolean }) { return ( {children} {chevron ? : null} ); } /** Trailing switch. Needs an accessible name. */ export function ItemCardSwitch(props: React.ComponentProps) { return ; } type Option = string | { label: string; value: string }; const norm = (o: Option) => (typeof o === "string" ? { label: o, value: o } : o); const quietTrigger = "h-7 gap-1 border-transparent bg-transparent ps-2 pe-1.5 text-muted-foreground shadow-none hover:text-foreground dark:bg-transparent dark:hover:bg-transparent aria-expanded:text-foreground"; /** Trailing single select that reads as text with a chevron. */ export function ItemCardSelect({ options, value, defaultValue, onValueChange, disabled, "aria-label": ariaLabel, className, }: { options: Option[]; value?: string; defaultValue?: string; onValueChange?: (value: string) => void; disabled?: boolean; "aria-label": string; className?: string; }) { const list = options.map(norm); return ( ); } /** Trailing multi select: a menu of checkable options with a count summary. / export function ItemCardMultiSelect({ options, value, defaultValue = [], onValueChange, disabled, placeholder = "None", "aria-label": ariaLabel, className, }: { options: Option[]; value?: string[]; defaultValue?: string[]; onValueChange?: (value: string[]) => void; disabled?: boolean; placeholder?: string; "aria-label": string; className?: string; }) { const [inner, setInner] = React.useState(defaultValue); const current = value ?? inner; const list = options.map(norm); const set = (next: string[]) => { setInner(next); onValueChange?.(next); }; const summary = current.length === 0 ? placeholder : current.length <= 2 ? list.filter((o) => current.includes(o.value)).map((o) => o.label).join(", ") : `${current.length} selected`; return ( } > {summary} {list.map((o) => ( set(on ? [...current, o.value] : current.filter((v) => v !== o.value))} > {o.label} ))} ); } 33:T154d,"use client"; import as React from "react"; import { IconBell, IconBrush, IconClock, IconDevices, IconLanguage, IconLock, IconMail, IconShieldLock, IconUser } from "@tabler/icons-react"; import { ItemCard, ItemCardContent, ItemCardDescription, ItemCardMedia, ItemCardSelect, ItemCardSwitch, ItemCardTitle, ItemCardValue, } from "../item-card/item-card"; import { ItemCardGroup, ItemCardGroupDescription, ItemCardGroupHeader, ItemCardGroupList, ItemCardGroupSection, ItemCardGroupTitle, } from "./item-card-group"; import { settings } from "../_fixtures"; import { DemoPage, DemoSection } from "../../_shared/variant-frame"; function Block({ label, children }: { label: string; children: React.ReactNode }) { return {children}; } const nav = [ { icon: IconUser, title: "Profile", description: "Name, photo and bio" }, { icon: IconShieldLock, title: "Security", description: "Passkeys and recovery" }, { icon: IconDevices, title: "Devices", description: "Signed-in browsers and phones" }, { icon: IconClock, title: "Activity", description: "Recent sign-ins" }, { icon: IconLock, title: "Privacy", description: "Data and visibility" }, { icon: IconMail, title: "Email", description: "Addresses and aliases" }, ]; function NavCards({ count = nav.length }: { count?: number }) { return nav.slice(0, count).map((n) => ( {n.title} {n.description} )); } export function ItemCardGroupDemo() { const [on, setOn] = React.useState>( Object.fromEntries(settings.filter((s) => s.kind === "switch").map((s) => [s.id, !!s.on])), ); const language = settings.find((s) => s.id === "language")!; return ( Account Manage how you sign in and who can see you. {settings .filter((s) => s.kind === "switch") .map((s) => ( } className="cursor-pointer"> {s.id === "two-factor" ? : s.id === "digest" ? : } {s.title} {s.description} setOn((o) => ({ ...o, [s.id]: v }))} /> ))} {language.title} {language.description} Appearance Match the system or pick one. ); } export default ItemCardGroupDemo; 34:T525,import type { BlockMeta } from "../../../lib/block-meta"; export const itemCardGroupMeta: BlockMeta = { slug: "item-card-group", title: "Item card group", description: "Groups item cards as one fused list or a 2 or 3 column grid, with headers, multiple sections, shared variants and pressable cards.", group: "data", kobraDeps: ["button", "dropdown-menu", "item", "select", "separator", "switch"], files: ["blocks/data/item-card-group/item-card-group.tsx", "blocks/data/item-card/item-card.tsx"], props: [ { name: "variant / size / pressable", type: "ItemCard defaults", description: "Shared by every ItemCard inside; a card can still override." }, { name: "ItemCardGroupList layout", type: "'list' | 'grid'", default: "'list'", description: "Fused block with hairline dividers, or separate cards." }, { name: "ItemCardGroupList columns", type: "1 | 2 | 3", default: "2", description: "Grid columns from 640px up (3 from 1024px)." }, { name: "ItemCardGroupSection", type: "{ title, description, layout, columns }", description: "Header plus list in one call; stack several for sections." }, { name: "ItemCardGroupHeader / Title / Description", type: "parts", description: "Custom header composition." }, ], tags: ["item", "settings", "group", "grid"], status: "ready", }; 24:["$","article",null,{"className":"grid gap-6","children":[["$","header",null,{"className":"grid gap-3","children":[["$","nav",null,{"aria-label":"breadcrumb","data-slot":"breadcrumb","className":"","children":["$","ol",null,{"data-slot":"breadcrumb-list","className":"flex flex-wrap items-center gap-1.5 text-sm wrap-break-word text-muted-foreground","children":[["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","$L2d",null,{"href":"/","data-slot":"breadcrumb-link","className":"transition-colors hover:text-foreground","children":"Kobra Commerce"}]}],["$","li",null,{"data-slot":"breadcrumb-separator","role":"presentation","aria-hidden":"true","className":"[&>svg]:size-3.5","children":["$","svg",null,{"ref":"$undefined","xmlns":"http://www.w3.org/2000/svg","width":24,"height":24,"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":2,"strokeLinecap":"round","strokeLinejoin":"round","className":"tabler-icon tabler-icon-chevron-right rtl:-scale-x-100","children":["$undefined",["$","path","svg-0",{"d":"M9 6l6 6l-6 6"}],"$undefined"]}]}],["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","$L2d",null,{"href":"/#data","data-slot":"breadcrumb-link","className":"transition-colors hover:text-foreground","children":"Data display"}]}],["$","li",null,{"data-slot":"breadcrumb-separator","role":"presentation","aria-hidden":"true","className":"[&>svg]:size-3.5","children":["$","svg",null,{"ref":"$undefined","xmlns":"http://www.w3.org/2000/svg","width":24,"height":24,"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":2,"strokeLinecap":"round","strokeLinejoin":"round","className":"tabler-icon tabler-icon-chevron-right rtl:-scale-x-100","children":["$undefined",["$","path","svg-0",{"d":"M9 6l6 6l-6 6"}],"$undefined"]}]}],["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","span",null,{"data-slot":"breadcrumb-page","role":"link","aria-disabled":"true","aria-current":"page","className":"font-normal text-foreground","children":"Item card group"}]}]]}]}],["$","div",null,{"className":"flex flex-wrap items-center gap-3","children":[["$","h1",null,{"className":"text-2xl font-bold","children":"Item card group"}],["$","span",null,{"data-slot":"badge","data-variant":"green","className":"group/badge t-label relative isolate inline-flex w-fit shrink-0 items-center justify-center gap-1 rounded-full border border-transparent py-0.5 font-medium [--surface-calm:0.5] whitespace-nowrap transition-ring before:pointer-events-none before:absolute before:inset-0 before:-z-10 before:rounded-[inherit] before:border before:border-transparent before:transition-[scale,background-color,border-color] before:duration-150 before:ease-out focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 motion-reduce:before:transition-none has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [a,button]:active:before:scale-[0.97] motion-reduce:[a,button]:active:before:scale-100 [&>svg]:pointer-events-none [&>svg]:size-3! t-surface t-surface-success text-[var(--badge-green-fg)] h-5 px-1.5 text-xs","children":"Ready"}]]}],["$","p",null,{"className":"max-w-[65ch] text-sm text-muted-foreground","children":"Groups item cards as one fused list or a 2 or 3 column grid, with headers, multiple sections, shared variants and pressable cards."}]]}],["$","$L2e",null,{"preview":["$","$L2f",null,{"slug":"item-card-group","group":"data","minHeight":640,"fixedHeight":"$undefined"}],"code":["$","$L30",null,{"files":[{"path":"blocks/data/item-card-group/item-card-group.tsx","code":"$31"},{"path":"blocks/data/item-card/item-card.tsx","code":"$32"},{"path":"blocks/data/item-card-group/demo.tsx","code":"$33"},{"path":"blocks/data/item-card-group/meta.ts","code":"$34"}]}],"props":"$L35"}],"$L36"]}]