@lobehub/ui/es/mdx/Cards/Card.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"Card.mjs","names":["cssVar","Card: FC<CardProps>","A","Block","Img","Flexbox","Tag","Icon"],"sources":["../../../src/mdx/Cards/Card.tsx"],"sourcesContent":["'use client';\n\nimport { createStaticStyles, cx } from 'antd-style';\nimport { FC } from 'react';\n\nimport A from '@/A';\nimport Block, { type BlockProps } from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport Icon, { type IconProps } from '@/Icon';\nimport Img from '@/Img';\nimport Tag, { type TagProps } from '@/Tag';\n\nconst styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    card: css`\n      --lobe-markdown-header-multiple: 0.2;\n      --lobe-markdown-margin-multiple: 1;\n\n      overflow: hidden;\n      height: 100%;\n      color: ${cssVar.colorText};\n\n      h3,\n      p {\n        margin-block: 0 !important;\n      }\n\n      p {\n        color: ${cssVar.colorTextDescription};\n        transition: color 0.2s ${cssVar.motionEaseInOut};\n      }\n\n      &:hover {\n        p {\n          color: ${cssVar.colorTextSecondary};\n        }\n\n        .mdx-card-icon {\n          opacity: 1;\n        }\n      }\n    `,\n    content: css`\n      width: 100%;\n      padding: 1.4em;\n    `,\n    icon: css`\n      margin-block: 0.1em;\n      opacity: 0.5;\n      transition: opacity 0.2s ${cssVar.motionEaseInOut};\n    `,\n  };\n});\n\nexport interface CardProps extends Omit<BlockProps, 'children'> {\n  desc?: string;\n  href?: string;\n  icon?: IconProps['icon'];\n  iconProps?: Omit<IconProps, 'icon'>;\n  image?: string;\n  tag?: string;\n  tagColor?: TagProps['color'];\n  title: string;\n}\n\nconst Card: FC<CardProps> = ({\n  tag,\n  tagColor = 'blue',\n  icon,\n  title,\n  desc,\n  href,\n  iconProps,\n  className,\n  image,\n  variant = 'filled',\n  ...rest\n}) => {\n  return (\n    <A href={href}>\n      <Block\n        align={'flex-start'}\n        className={cx(styles.card, className)}\n        clickable\n        variant={variant}\n        {...rest}\n      >\n        {image && (\n          <Img\n            alt={title}\n            height={100}\n            src={image}\n            style={{ height: 'auto', width: '100%' }}\n            width={250}\n          />\n        )}\n        {tag && (\n          <Flexbox\n            align={'flex-start'}\n            className={styles.content}\n            style={{ paddingBottom: '0.2em', paddingTop: '1.8em' }}\n          >\n            <Tag\n              color={tagColor}\n              style={{\n                borderRadius: '1em',\n                fontSize: '0.8em',\n                fontWeight: 500,\n                paddingBlock: '0.1em',\n                paddingInline: '0.6em',\n              }}\n            >\n              {tag}\n            </Tag>\n          </Flexbox>\n        )}\n        <Flexbox\n          align={desc ? 'flex-start' : 'center'}\n          className={styles.content}\n          gap={'0.75em'}\n          horizontal\n        >\n          {!image && icon && (\n            <Icon\n              className={cx(styles.icon, 'mdx-card-icon')}\n              icon={icon}\n              size={{ size: '1.5em' }}\n              {...iconProps}\n            />\n          )}\n          <Flexbox gap={'0.2em'}>\n            <h3>{title}</h3>\n            {desc && <p>{desc}</p>}\n          </Flexbox>\n        </Flexbox>\n      </Block>\n    </A>\n  );\n};\n\nCard.displayName = 'MdxCard';\n\nexport default Card;\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,SAAS,oBAAoB,EAAE,YAAK,uBAAa;AACrD,QAAO;EACL,MAAM,KAAG;;;;;;eAMEA,SAAO,UAAU;;;;;;;;iBAQfA,SAAO,qBAAqB;iCACZA,SAAO,gBAAgB;;;;;mBAKrCA,SAAO,mBAAmB;;;;;;;;EAQzC,SAAS,KAAG;;;;EAIZ,MAAM,KAAG;;;iCAGoBA,SAAO,gBAAgB;;EAErD;EACD;AAaF,MAAMC,QAAuB,EAC3B,KACA,WAAW,QACX,MACA,OACA,MACA,MACA,WACA,WACA,OACA,UAAU,UACV,GAAG,WACC;AACJ,QACE,oBAACC;EAAQ;YACP,qBAACC;GACC,OAAO;GACP,WAAW,GAAG,OAAO,MAAM,UAAU;GACrC;GACS;GACT,GAAI;;IAEH,SACC,oBAACC;KACC,KAAK;KACL,QAAQ;KACR,KAAK;KACL,OAAO;MAAE,QAAQ;MAAQ,OAAO;MAAQ;KACxC,OAAO;MACP;IAEH,OACC,oBAACC;KACC,OAAO;KACP,WAAW,OAAO;KAClB,OAAO;MAAE,eAAe;MAAS,YAAY;MAAS;eAEtD,oBAACC;MACC,OAAO;MACP,OAAO;OACL,cAAc;OACd,UAAU;OACV,YAAY;OACZ,cAAc;OACd,eAAe;OAChB;gBAEA;OACG;MACE;IAEZ,qBAACD;KACC,OAAO,OAAO,eAAe;KAC7B,WAAW,OAAO;KAClB,KAAK;KACL;gBAEC,CAAC,SAAS,QACT,oBAACE;MACC,WAAW,GAAG,OAAO,MAAM,gBAAgB;MACrC;MACN,MAAM,EAAE,MAAM,SAAS;MACvB,GAAI;OACJ,EAEJ,qBAACF;MAAQ,KAAK;iBACZ,oBAAC,kBAAI,QAAW,EACf,QAAQ,oBAAC,iBAAG,OAAS;OACd;MACF;;IACJ;GACN;;AAIR,KAAK,cAAc;AAEnB,mBAAe"}