koval-ui/dist/src/lib/Card/Card.cjs.map

React components collection with minimalistic design. Supports theming, layout, and input validation.

{"version":3,"file":"Card.cjs","sources":["../../../../src/lib/Card/Card.tsx"],"sourcesContent":["import type {ComponentProps, ReactNode} from 'react';\nimport {forwardRef, useMemo} from 'react';\nimport classNames from 'classnames';\nimport {useLocalTheme} from 'css-vars-hook';\n\nimport type {DataAttributes, LibraryProps} from '@/internal/LibraryAPI';\nimport {useInternalId} from '@/internal/hooks/useInternalId.ts';\nimport {useLinkRefs} from '@/internal/hooks/useLinkRefs.ts';\nimport {Picture} from '@/lib';\nimport type {ActionButton} from '@/internal/Actions';\nimport {ActionsTree} from '@/internal/Actions';\n\nimport classes from './Card.module.css';\n\nenum Variants {\n    horizontal = 'horizontal',\n    vertical = 'vertical',\n}\n\nexport type Props = DataAttributes &\n    LibraryProps & {\n        children?: ReactNode;\n        /** Provide an url for header image */\n        headerImageUrl?: string;\n        /** Provide an array of actions with callbacks */\n        actions?: (\n            | ComponentProps<typeof ActionButton>\n            | [ComponentProps<typeof ActionButton>, ComponentProps<typeof ActionButton>]\n        )[];\n        /** Set vertical or horizontal layout for the card */\n        variant?: keyof typeof Variants;\n        /** Provide width of the card. Applied in vertical mode */\n        width?: number;\n        /** Provide height of the card. Applied in horizontal mode */\n        height?: number;\n    };\n\nexport const Card = forwardRef<HTMLDivElement, Props>(\n    (\n        {\n            children,\n            className,\n            headerImageUrl,\n            actions = [],\n            id: idProp,\n            variant = 'vertical',\n            width,\n            height,\n            ...nativeProps\n        },\n        ref\n    ) => {\n        const id = useInternalId(idProp);\n        const {LocalRoot, ref: internalRef} = useLocalTheme<HTMLDivElement>();\n        useLinkRefs(ref, internalRef);\n        const theme = useMemo(\n            () => ({width: width ? `${width}px` : 'auto', height: height ? `${height}px` : 'auto'}),\n            [height, width]\n        );\n        return (\n            <LocalRoot\n                {...nativeProps}\n                theme={theme}\n                id={id}\n                className={classNames(\n                    classes.card,\n                    {\n                        [classes.vertical]: variant === Variants.vertical,\n                        [classes.horizontal]: variant === Variants.horizontal,\n                    },\n                    className\n                )}>\n                {headerImageUrl && <Picture className={classes.headerImage} src={headerImageUrl} />}\n                <div className={classes.body}>{children}</div>\n                <footer className={classes.actions}>\n                    <ActionsTree\n                        actions={actions}\n                        classNameAction={classes.actionButton}\n                        classNameRow={classes.row}\n                    />\n                </footer>\n            </LocalRoot>\n        );\n    }\n);\n\nCard.displayName = 'Card';\n"],"names":["Card","forwardRef","children","className","headerImageUrl","actions","idProp","variant","width","height","nativeProps","ref","id","useInternalId","LocalRoot","internalRef","useLocalTheme","useLinkRefs","theme","useMemo","jsxs","classNames","classes","Picture","jsx","ActionsTree"],"mappings":"gdAqCaA,EAAOC,EAAA,WAChB,CACI,CACI,SAAAC,EACA,UAAAC,EACA,eAAAC,EACA,QAAAC,EAAU,CAAC,EACX,GAAIC,EACJ,QAAAC,EAAU,WACV,MAAAC,EACA,OAAAC,EACA,GAAGC,GAEPC,IACC,CACK,MAAAC,EAAKC,gBAAcP,CAAM,EACzB,CAAC,UAAAQ,EAAW,IAAKC,CAAA,EAAeC,EAAAA,cAA8B,EACpEC,EAAA,YAAYN,EAAKI,CAAW,EAC5B,MAAMG,EAAQC,EAAA,QACV,KAAO,CAAC,MAAOX,EAAQ,GAAGA,CAAK,KAAO,OAAQ,OAAQC,EAAS,GAAGA,CAAM,KAAO,MAAM,GACrF,CAACA,EAAQD,CAAK,CAClB,EAEI,OAAAY,EAAA,KAACN,EAAA,CACI,GAAGJ,EACJ,MAAAQ,EACA,GAAAN,EACA,UAAWS,EACPC,EAAAA,QAAQ,KACR,CACI,CAACA,EAAA,QAAQ,QAAQ,EAAGf,IAAY,WAChC,CAACe,EAAA,QAAQ,UAAU,EAAGf,IAAY,YACtC,EACAJ,CACJ,EACC,SAAA,CAAAC,SAAmBmB,EAAAA,QAAQ,CAAA,UAAWD,EAAAA,QAAQ,YAAa,IAAKlB,EAAgB,EAChFoB,EAAA,IAAA,MAAA,CAAI,UAAWF,EAAAA,QAAQ,KAAO,SAAApB,EAAS,EACvCsB,EAAA,IAAA,SAAA,CAAO,UAAWF,EAAAA,QAAQ,QACvB,SAAAE,EAAA,IAACC,EAAA,YAAA,CACG,QAAApB,EACA,gBAAiBiB,EAAQ,QAAA,aACzB,aAAcA,EAAAA,QAAQ,GAAA,CAAA,CAE9B,CAAA,CAAA,CAAA,CACJ,CAAA,CAGZ,EAEAtB,EAAK,YAAc"}