@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":["Flexbox"],"sources":["../../../src/mdx/Cards/Card.tsx"],"sourcesContent":["'use client';\n\nimport { createStaticStyles, cx } from 'antd-style';\nimport type { 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        clickable\n        align={'flex-start'}\n        className={cx(styles.card, className)}\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          horizontal\n          align={desc ? 'flex-start' : 'center'}\n          className={styles.content}\n          gap={'0.75em'}\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,KAAK,aAAa;AACrD,QAAO;EACL,MAAM,GAAG;;;;;;eAME,OAAO,UAAU;;;;;;;;iBAQf,OAAO,qBAAqB;iCACZ,OAAO,gBAAgB;;;;;mBAKrC,OAAO,mBAAmB;;;;;;;;EAQzC,SAAS,GAAG;;;;EAIZ,MAAM,GAAG;;;iCAGoB,OAAO,gBAAgB;;EAErD;EACD;AAaF,MAAM,QAAuB,EAC3B,KACA,WAAW,QACX,MACA,OACA,MACA,MACA,WACA,WACA,OACA,UAAU,UACV,GAAG,WACC;AACJ,QACE,oBAAC,GAAD;EAAS;YACP,qBAAC,OAAD;GACE,WAAA;GACA,OAAO;GACP,WAAW,GAAG,OAAO,MAAM,UAAU;GAC5B;GACT,GAAI;aALN;IAOG,SACC,oBAAC,KAAD;KACE,KAAK;KACL,QAAQ;KACR,KAAK;KACL,OAAO;MAAE,QAAQ;MAAQ,OAAO;MAAQ;KACxC,OAAO;KACP,CAAA;IAEH,OACC,oBAACA,mBAAD;KACE,OAAO;KACP,WAAW,OAAO;KAClB,OAAO;MAAE,eAAe;MAAS,YAAY;MAAS;eAEtD,oBAAC,KAAD;MACE,OAAO;MACP,OAAO;OACL,cAAc;OACd,UAAU;OACV,YAAY;OACZ,cAAc;OACd,eAAe;OAChB;gBAEA;MACG,CAAA;KACE,CAAA;IAEZ,qBAACA,mBAAD;KACE,YAAA;KACA,OAAO,OAAO,eAAe;KAC7B,WAAW,OAAO;KAClB,KAAK;eAJP,CAMG,CAAC,SAAS,QACT,oBAAC,MAAD;MACE,WAAW,GAAG,OAAO,MAAM,gBAAgB;MACrC;MACN,MAAM,EAAE,MAAM,SAAS;MACvB,GAAI;MACJ,CAAA,EAEJ,qBAACA,mBAAD;MAAS,KAAK;gBAAd,CACE,oBAAC,MAAD,EAAA,UAAK,OAAW,CAAA,EACf,QAAQ,oBAAC,KAAD,EAAA,UAAI,MAAS,CAAA,CACd;QACF;;IACJ;;EACN,CAAA;;AAIR,KAAK,cAAc"}