dify/web/app/components/base/grid-mask/index.tsx
yyh af7d5e60b4
feat(ui): scaffold @langgenius/dify-ui and migrate design tokens (#35256)
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
2026-04-15 13:11:20 +00:00

27 lines
774 B
TypeScript

import type { FC } from 'react'
import { cn } from '@langgenius/dify-ui/cn'
import Style from './style.module.css'
type GridMaskProps = {
children: React.ReactNode
wrapperClassName?: string
canvasClassName?: string
gradientClassName?: string
}
const GridMask: FC<GridMaskProps> = ({
children,
wrapperClassName,
canvasClassName,
gradientClassName,
}) => {
return (
<div className={cn('relative bg-saas-background', wrapperClassName)}>
<div className={cn('absolute inset-0 z-0 h-full w-full opacity-70', canvasClassName, Style.gridBg)} />
<div className={cn('absolute z-1 h-full w-full rounded-lg bg-grid-mask-background', gradientClassName)} />
<div className="relative z-2">{children}</div>
</div>
)
}
export default GridMask