@lobehub/fluent-emoji
Version:
Fluent Emoji are a collection of familiar, friendly, and modern emoji from Microsoft
1 lines • 3.07 kB
Source Map (JSON)
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/FluentEmoji/index.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ElementType, createElement, forwardRef, useMemo, useState } from 'react';\nimport { type HTMLAttributes } from 'react';\n\nimport { getFluentEmojiCDN } from '@/getFluentEmojiCDN';\nimport { EmojiType } from '@/getFluentEmojiCDN/utils';\n\nimport { styles } from './style';\n\nconst createContainer = (as: ElementType) =>\n forwardRef((props: any, ref) => createElement(as, { ...props, ref }));\n\nexport interface FluentEmojiProps extends HTMLAttributes<HTMLDivElement> {\n as?: ElementType;\n cdn?: 'aliyun' | 'unpkg';\n emoji: string;\n size?: number;\n type?: EmojiType | 'pure';\n unoptimized?: boolean;\n}\n\nconst FluentEmoji = forwardRef<any, FluentEmojiProps>(\n (\n {\n emoji,\n className,\n style,\n type = '3d',\n cdn = 'aliyun',\n size = 40,\n unoptimized,\n as = 'img',\n onError,\n },\n ref,\n ) => {\n const [loadingFail, setLoadingFail] = useState(false);\n\n const ImgContainer = useMemo(() => createContainer(as), [as]);\n\n const emojiUrl = useMemo(() => {\n if (type === 'pure') return null;\n return getFluentEmojiCDN(emoji, { cdn, type });\n }, [type, emoji]);\n\n if (type === 'pure' || !emojiUrl || loadingFail)\n return (\n <div\n className={cx(styles.container, className)}\n style={{\n alignItems: 'center',\n display: 'inline-flex',\n fontSize: size,\n height: size,\n justifyContent: 'center',\n verticalAlign: 'middle',\n width: size,\n ...style,\n }}\n >\n {emoji}\n </div>\n );\n\n return (\n <ImgContainer\n alt={emoji}\n className={className}\n height={size}\n loading={'lazy'}\n onError={(e: any) => {\n setLoadingFail(true);\n onError?.(e);\n }}\n ref={ref}\n src={emojiUrl}\n style={{ flex: 'none', ...style }}\n unoptimized={unoptimized}\n width={size}\n />\n );\n },\n);\n\nexport default FluentEmoji;\n"],"mappings":";;;;;;;AAWA,MAAM,mBAAmB,OACvB,YAAY,OAAY,QAAQ,cAAc,IAAI;CAAE,GAAG;CAAO;AAAI,CAAC,CAAC;AAWtE,MAAM,cAAc,YAEhB,EACE,OACA,WACA,OACA,OAAO,MACP,MAAM,UACN,OAAO,IACP,aACA,KAAK,OACL,WAEF,QACG;CACH,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,eAAe,cAAc,gBAAgB,EAAE,GAAG,CAAC,EAAE,CAAC;CAE5D,MAAM,WAAW,cAAc;EAC7B,IAAI,SAAS,QAAQ,OAAO;EAC5B,OAAO,kBAAkB,OAAO;GAAE;GAAK;EAAK,CAAC;CAC/C,GAAG,CAAC,MAAM,KAAK,CAAC;CAEhB,IAAI,SAAS,UAAU,CAAC,YAAY,aAClC,OACE,oBAAC,OAAD;EACE,WAAW,GAAG,OAAO,WAAW,SAAS;EACzC,OAAO;GACL,YAAY;GACZ,SAAS;GACT,UAAU;GACV,QAAQ;GACR,gBAAgB;GAChB,eAAe;GACf,OAAO;GACP,GAAG;EACL;EAEC,UAAA;CACE,CAAA;CAGT,OACE,oBAAC,cAAD;EACE,KAAK;EACM;EACX,QAAQ;EACR,SAAS;EACT,UAAU,MAAW;GACnB,eAAe,IAAI;GACnB,UAAU,CAAC;EACb;EACK;EACL,KAAK;EACL,OAAO;GAAE,MAAM;GAAQ,GAAG;EAAM;EACnB;EACb,OAAO;CACR,CAAA;AAEL,CACF"}