@mantine/core
Version:
React components library focused on usability, accessibility and developer experience
1 lines • 4.31 kB
Source Map (JSON)
{"version":3,"file":"Card.cjs","names":["createVarsResolver","getSpacing","polymorphicFactory","useProps","useStyles","Children","CardSection","CardProvider","Paper","classes"],"sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n BoxProps,\n createVarsResolver,\n getSpacing,\n MantineRadius,\n MantineShadow,\n MantineSpacing,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Paper } from '../Paper';\nimport { CardProvider } from './Card.context';\nimport { CardSection } from './CardSection/CardSection';\nimport classes from './Card.module.css';\n\nexport type CardStylesNames = 'root' | 'section';\nexport type CardCssVariables = {\n root: '--card-padding';\n};\n\nexport interface CardProps extends BoxProps, StylesApiProps<CardFactory> {\n /** Key of `theme.shadows` or any valid CSS value to set `box-shadow` */\n shadow?: MantineShadow;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Adds border to the card */\n withBorder?: boolean;\n\n /** Key of `theme.spacing` or any valid CSS value to set padding @default 'md' */\n padding?: MantineSpacing;\n\n /** Card content */\n children?: React.ReactNode;\n\n /** Card orientation @default 'vertical' */\n orientation?: 'horizontal' | 'vertical';\n}\n\nexport type CardFactory = PolymorphicFactory<{\n props: CardProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: CardStylesNames;\n vars: CardCssVariables;\n staticComponents: {\n Section: typeof CardSection;\n };\n}>;\n\nconst varsResolver = createVarsResolver<CardFactory>((_, { padding }) => ({\n root: {\n '--card-padding': getSpacing(padding),\n },\n}));\n\nconst defaultProps = {\n orientation: 'vertical',\n} satisfies Partial<CardProps>;\n\nexport const Card = polymorphicFactory<CardFactory>((_props) => {\n const props = useProps('Card', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n padding,\n attributes,\n orientation,\n ...others\n } = props;\n\n const getStyles = useStyles<CardFactory>({\n name: 'Card',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const _children = Children.toArray(children);\n const content = _children.map((child, index) => {\n if (typeof child === 'object' && child && 'type' in child && child.type === CardSection) {\n return cloneElement(child, {\n 'data-orientation': orientation,\n 'data-first-section': index === 0 || undefined,\n 'data-last-section': index === _children.length - 1 || undefined,\n } as any);\n }\n\n return child;\n });\n\n return (\n <CardProvider value={{ getStyles }}>\n <Paper unstyled={unstyled} data-orientation={orientation} {...getStyles('root')} {...others}>\n {content}\n </Paper>\n </CardProvider>\n );\n});\n\nCard.classes = classes;\nCard.varsResolver = varsResolver;\nCard.displayName = '@mantine/core/Card';\nCard.Section = CardSection;\n"],"mappings":";;;;;;;;;;;;;;AAuDA,MAAM,eAAeA,6BAAAA,oBAAiC,GAAG,EAAE,eAAe,EACxE,MAAM,EACJ,kBAAkBC,iBAAAA,WAAW,QAAQ,EACtC,EACF,EAAE;AAEH,MAAM,eAAe,EACnB,aAAa,YACd;AAED,MAAa,OAAOC,4BAAAA,oBAAiC,WAAW;CAC9D,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,SACA,YACA,aACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN;EACA,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,YAAYC,MAAAA,SAAS,QAAQ,SAAS;CAC5C,MAAM,UAAU,UAAU,KAAK,OAAO,UAAU;AAC9C,MAAI,OAAO,UAAU,YAAY,SAAS,UAAU,SAAS,MAAM,SAASC,oBAAAA,YAC1E,SAAA,GAAA,MAAA,cAAoB,OAAO;GACzB,oBAAoB;GACpB,sBAAsB,UAAU,KAAK,KAAA;GACrC,qBAAqB,UAAU,UAAU,SAAS,KAAK,KAAA;GACxD,CAAQ;AAGX,SAAO;GACP;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,qBAAAA,cAAD;EAAc,OAAO,EAAE,WAAW;YAChC,iBAAA,GAAA,kBAAA,KAACC,cAAAA,OAAD;GAAiB;GAAU,oBAAkB;GAAa,GAAI,UAAU,OAAO;GAAE,GAAI;aAClF;GACK,CAAA;EACK,CAAA;EAEjB;AAEF,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,UAAUH,oBAAAA"}