33127bb6ab
* Copy the design-system app into a new one for ui-library. * Remove unneeded content. * Add supabase config. * Cleanup the css. * Add bunch of packages. * Cleanup the registry. * Regenerate the registry. * Add needed components for documenting components. * Add the pages for the components. * Fix the RegistryBlock. * Various fixes. * Add a turbo definition for ui-library. * Rename Remix to React Router. * Reorder the pages for all frameworks. * Remove the bottom pager. * Fix the pages and command menu. * Various fixes. * Minor fixes. * Add ai editor rules. * Various fixes. * Add local supabase env vars. * Try to fix a package error. * Bunch of various fixes. * Fix lint errors.
63 lines
1.4 KiB
TypeScript
63 lines
1.4 KiB
TypeScript
import { forwardRef } from 'react'
|
|
import { cn } from 'ui'
|
|
|
|
const Grid = forwardRef<HTMLDivElement, React.HTMLProps<HTMLDivElement>>(
|
|
({ children, ...props }, ref) => {
|
|
return (
|
|
<div
|
|
ref={ref}
|
|
{...props}
|
|
className={cn(
|
|
'grid grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 border-t border-l my-12',
|
|
props.className
|
|
)}
|
|
>
|
|
{children}
|
|
</div>
|
|
)
|
|
}
|
|
)
|
|
|
|
Grid.displayName = 'Grid'
|
|
|
|
const GridItem = forwardRef<HTMLDivElement, React.HTMLProps<HTMLDivElement>>(
|
|
({ children, ...props }, ref) => {
|
|
return (
|
|
<div
|
|
ref={ref}
|
|
{...props}
|
|
className={cn(
|
|
`
|
|
relative
|
|
min-h-32
|
|
flex gap-4 flex-col items-center p-4
|
|
border-b border-r
|
|
bg-surface-75/50
|
|
justify-center hover:bg-surface-100
|
|
group
|
|
cursor-pointer
|
|
`,
|
|
props.className
|
|
)}
|
|
>
|
|
<div
|
|
className="
|
|
absolute
|
|
w-full h-full box-content
|
|
transition
|
|
group-hover:border
|
|
group-hover:border-foreground-muted
|
|
group-data-[state=open]:border
|
|
group-data-[state=open]:border-foreground-muted
|
|
"
|
|
></div>
|
|
{children}
|
|
</div>
|
|
)
|
|
}
|
|
)
|
|
|
|
GridItem.displayName = 'GridItem'
|
|
|
|
export { Grid, GridItem }
|