UNPKG

@lobehub/ui

Version:

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

1 lines • 6.32 kB
{"version":3,"file":"Empty.mjs","names":[],"sources":["../../src/Empty/Empty.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { Plus } from 'lucide-react';\nimport { type KeyboardEvent, memo, useMemo } from 'react';\n\nimport FluentEmoji from '@/FluentEmoji';\nimport Icon from '@/Icon';\nimport Text from '@/Text';\n\nimport { styles } from './style';\nimport type { EmptyProps } from './type';\n\nconst Empty = memo<EmptyProps>(\n ({\n title,\n description,\n icon,\n iconColor,\n emoji,\n image,\n imageSize = 48,\n action,\n actionProps,\n titleProps,\n descriptionProps,\n align,\n imageProps,\n children,\n type = 'default',\n variant = 'default',\n className,\n onClick,\n ref,\n style,\n ...rest\n }) => {\n const isPage = type === 'page';\n const alignValue = align || (isPage ? 'flex-start' : 'center');\n const isCenter = alignValue === 'center';\n\n const isClickable = !isPage && variant === 'dashed' && !!onClick;\n const resolvedIcon = icon ?? (isClickable ? Plus : undefined);\n\n const iconSize = isPage ? 36 : variant === 'dashed' ? 20 : 32;\n\n const cover = useMemo(() => {\n if (image) return image;\n if (emoji) return <FluentEmoji emoji={emoji} size={imageSize} type={'anim'} />;\n if (!resolvedIcon) return null;\n\n return (\n <Icon\n color={iconColor}\n icon={resolvedIcon}\n size={{ size: iconSize, strokeWidth: isPage ? 1.25 : 2 }}\n />\n );\n }, [image, emoji, imageSize, resolvedIcon, isPage, iconColor, iconSize]);\n\n const rootClassName = cx(\n isPage ? styles.rootPage : styles.root,\n !isPage && variant === 'dashed' && styles.dashed,\n isClickable && styles.dashedClickable,\n className,\n );\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (!isClickable) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n\n event.preventDefault();\n (onClick as (event: unknown) => void)?.(event);\n };\n\n const rootStyle: EmptyProps['style'] = {\n color:\n !isPage && variant === 'dashed' ? cssVar.colorTextTertiary : cssVar.colorTextQuaternary,\n ...style,\n };\n\n const titleNode = title && (\n <Text\n align={isCenter ? 'center' : undefined}\n color={cssVar.colorText}\n fontSize={isPage ? 18 : 14}\n weight={isPage ? 600 : 500}\n style={{\n marginBottom: isPage ? 4 : 0,\n marginTop: isPage ? 0 : variant === 'dashed' ? 6 : 8,\n }}\n {...titleProps}\n >\n {title}\n </Text>\n );\n\n const descriptionNode = description && (\n <Text\n align={isCenter ? 'center' : undefined}\n color={cssVar.colorTextTertiary}\n fontSize={13}\n style={{ maxWidth: isPage ? '52ch' : '34ch' }}\n {...descriptionProps}\n >\n {description}\n </Text>\n );\n\n if (isPage) {\n return (\n <div\n className={rootClassName}\n ref={ref}\n style={{ alignItems: alignValue, ...rootStyle }}\n onClick={onClick}\n {...rest}\n >\n {cover && <div {...imageProps}>{cover}</div>}\n <div>\n {titleNode}\n {descriptionNode}\n {children}\n {action && (\n <div className={styles.extraPage} {...actionProps}>\n {action}\n </div>\n )}\n </div>\n </div>\n );\n }\n\n return (\n <div\n className={rootClassName}\n ref={ref}\n role={isClickable ? 'button' : undefined}\n style={{ alignItems: alignValue, textAlign: isCenter ? 'center' : undefined, ...rootStyle }}\n tabIndex={isClickable ? 0 : undefined}\n onClick={onClick}\n onKeyDown={handleKeyDown}\n {...rest}\n >\n {cover && <div {...imageProps}>{cover}</div>}\n {titleNode}\n {descriptionNode}\n {children}\n {action && (\n <div className={styles.action} {...actionProps}>\n {action}\n </div>\n )}\n </div>\n );\n },\n);\n\nEmpty.displayName = 'Empty';\n\nexport default Empty;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,QAAQ,MACX,EACC,OACA,aACA,MACA,WACA,OACA,OACA,YAAY,IACZ,QACA,aACA,YACA,kBACA,OACA,YACA,UACA,OAAO,WACP,UAAU,WACV,WACA,SACA,KACA,OACA,GAAG,WACC;CACJ,MAAM,SAAS,SAAS;CACxB,MAAM,aAAa,UAAU,SAAS,eAAe;CACrD,MAAM,WAAW,eAAe;CAEhC,MAAM,cAAc,CAAC,UAAU,YAAY,YAAY,CAAC,CAAC;CACzD,MAAM,eAAe,SAAS,cAAc,OAAO,KAAA;CAEnD,MAAM,WAAW,SAAS,KAAK,YAAY,WAAW,KAAK;CAE3D,MAAM,QAAQ,cAAc;EAC1B,IAAI,OAAO,OAAO;EAClB,IAAI,OAAO,OAAO,oBAAC,aAAD;GAAoB;GAAO,MAAM;GAAW,MAAM;EAAS,CAAA;EAC7E,IAAI,CAAC,cAAc,OAAO;EAE1B,OACE,oBAAC,MAAD;GACE,OAAO;GACP,MAAM;GACN,MAAM;IAAE,MAAM;IAAU,aAAa,SAAS,OAAO;GAAE;EACxD,CAAA;CAEL,GAAG;EAAC;EAAO;EAAO;EAAW;EAAc;EAAQ;EAAW;CAAQ,CAAC;CAEvE,MAAM,gBAAgB,GACpB,SAAS,OAAO,WAAW,OAAO,MAClC,CAAC,UAAU,YAAY,YAAY,OAAO,QAC1C,eAAe,OAAO,iBACtB,SACF;CAEA,MAAM,iBAAiB,UAAyC;EAC9D,IAAI,CAAC,aAAa;EAClB,IAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;EAEhD,MAAM,eAAe;EACrB,UAAwC,KAAK;CAC/C;CAEA,MAAM,YAAiC;EACrC,OACE,CAAC,UAAU,YAAY,WAAW,OAAO,oBAAoB,OAAO;EACtE,GAAG;CACL;CAEA,MAAM,YAAY,SAChB,oBAAC,MAAD;EACE,OAAO,WAAW,WAAW,KAAA;EAC7B,OAAO,OAAO;EACd,UAAU,SAAS,KAAK;EACxB,QAAQ,SAAS,MAAM;EACvB,OAAO;GACL,cAAc,SAAS,IAAI;GAC3B,WAAW,SAAS,IAAI,YAAY,WAAW,IAAI;EACrD;EACA,GAAI;EAEH,UAAA;CACG,CAAA;CAGR,MAAM,kBAAkB,eACtB,oBAAC,MAAD;EACE,OAAO,WAAW,WAAW,KAAA;EAC7B,OAAO,OAAO;EACd,UAAU;EACV,OAAO,EAAE,UAAU,SAAS,SAAS,OAAO;EAC5C,GAAI;EAEH,UAAA;CACG,CAAA;CAGR,IAAI,QACF,OACE,qBAAC,OAAD;EACE,WAAW;EACN;EACL,OAAO;GAAE,YAAY;GAAY,GAAG;EAAU;EACrC;EACT,GAAI;EALN,UAAA,CAOG,SAAS,oBAAC,OAAD;GAAK,GAAI;GAAa,UAAA;EAAW,CAAA,GAC3C,qBAAC,OAAD,EAAA,UAAA;GACG;GACA;GACA;GACA,UACC,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAW,GAAI;IACnC,UAAA;GACE,CAAA;EAEJ,EAAA,CAAA,CACF;;CAIT,OACE,qBAAC,OAAD;EACE,WAAW;EACN;EACL,MAAM,cAAc,WAAW,KAAA;EAC/B,OAAO;GAAE,YAAY;GAAY,WAAW,WAAW,WAAW,KAAA;GAAW,GAAG;EAAU;EAC1F,UAAU,cAAc,IAAI,KAAA;EACnB;EACT,WAAW;EACX,GAAI;EARN,UAAA;GAUG,SAAS,oBAAC,OAAD;IAAK,GAAI;IAAa,UAAA;GAAW,CAAA;GAC1C;GACA;GACA;GACA,UACC,oBAAC,OAAD;IAAK,WAAW,OAAO;IAAQ,GAAI;IAChC,UAAA;GACE,CAAA;EAEJ;;AAET,CACF;AAEA,MAAM,cAAc"}