{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"grid-filler","type":"registry:component","description":"Grid filler component.","files":[{"path":"registry/components/grid-filler.tsx","type":"registry:component","content":"import { cn } from \"@/lib/utils\";\n\ntype GridFillerProps = React.ComponentProps<\"div\"> & {\n\t/**\n\t * The number of items in the grid.\n\t */\n\ttotalItems: number;\n\t/**\n\t * Number of columns for small screens.\n\t */\n\tsmColumns?: number;\n\t/**\n\t * Number of columns for medium screens.\n\t */\n\tmdColumns?: number;\n\t/**\n\t * Number of columns for large screens.\n\t */\n\tlgColumns?: number;\n};\n\nexport function GridFiller({\n\ttotalItems,\n\tclassName,\n\tsmColumns = 2,\n\tmdColumns,\n\tlgColumns,\n\t...props\n}: GridFillerProps) {\n\tconst actualMdColumns = mdColumns ?? smColumns;\n\tconst actualLgColumns = lgColumns ?? actualMdColumns;\n\n\t// We need enough iterations to cover the maximum possible remainder.\n\t// For N columns, the remainder can be at most N-1.\n\tconst maxFillers = Math.max(smColumns, actualMdColumns, actualLgColumns) - 1;\n\n\treturn (\n\t\t<>\n\t\t\t{Array.from({ length: maxFillers }).map((_, i) => {\n\t\t\t\tconst neededSm = (smColumns - (totalItems % smColumns)) % smColumns;\n\t\t\t\tconst neededMd =\n\t\t\t\t\t(actualMdColumns - (totalItems % actualMdColumns)) % actualMdColumns;\n\t\t\t\tconst neededLg =\n\t\t\t\t\t(actualLgColumns - (totalItems % actualLgColumns)) % actualLgColumns;\n\n\t\t\t\tconst showSm = i < neededSm ? \"sm:block\" : \"sm:hidden\";\n\t\t\t\tconst showMd = i < neededMd ? \"md:block\" : \"md:hidden\";\n\t\t\t\tconst showLg = i < neededLg ? \"lg:block\" : \"lg:hidden\";\n\n\t\t\t\tif (\n\t\t\t\t\tshowSm === \"sm:hidden\" &&\n\t\t\t\t\tshowMd === \"md:hidden\" &&\n\t\t\t\t\tshowLg === \"lg:hidden\"\n\t\t\t\t) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"pointer-events-none hidden\",\n\t\t\t\t\t\t\tshowSm,\n\t\t\t\t\t\t\tshowMd,\n\t\t\t\t\t\t\tshowLg,\n\t\t\t\t\t\t\tclassName\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tkey={`filler-${i}`}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</>\n\t);\n}\n"}]}