UNPKG

@lobehub/ui

Version:

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

1 lines 2.03 kB
{"version":3,"file":"ScaleRow.mjs","names":["Flexbox"],"sources":["../../../src/color/CssVar/ScaleRow.tsx"],"sourcesContent":["import { Space, message } from 'antd';\nimport { memo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport { copyToClipboard } from '@/utils/copyToClipboard';\n\nimport { styles } from './style';\n\nexport interface IScaleRow {\n name: string;\n scale: string[];\n title: 'light' | 'dark';\n}\n\nconst ScaleRow = memo<IScaleRow>(({ name, title, scale }) => {\n let style = {};\n let isAlpha = false;\n\n return (\n <Space size={2}>\n <div className={styles.scaleRowTitle} key={title}>\n <div className={styles.text}>{title}</div>\n </div>\n {scale.map((color, index) => {\n if (index === 0 || index === 12) return false;\n\n return (\n <div\n className={styles.scaleBox}\n key={index}\n onClick={async () => {\n const content = `token.${name}${index}${isAlpha ? 'A' : ''} /* ${color} */`;\n\n await copyToClipboard(content);\n message.success(content);\n }}\n style={style}\n title={color}\n >\n <Flexbox\n align={'center'}\n className={styles.scaleItem}\n horizontal\n justify={'center'}\n style={{ backgroundColor: color }}\n />\n </div>\n );\n })}\n </Space>\n );\n});\n\nexport default ScaleRow;\n"],"mappings":";;;;;;;;AAcA,MAAM,WAAW,MAAiB,EAAE,MAAM,OAAO,YAAY;CAC3D,IAAI,QAAQ,EAAE;AAGd,QACE,qBAAC;EAAM,MAAM;aACX,oBAAC;GAAI,WAAW,OAAO;aACrB,oBAAC;IAAI,WAAW,OAAO;cAAO;KAAY;KADD,MAErC,EACL,MAAM,KAAK,OAAO,UAAU;AAC3B,OAAI,UAAU,KAAK,UAAU,GAAI,QAAO;AAExC,UACE,oBAAC;IACC,WAAW,OAAO;IAElB,SAAS,YAAY;KACnB,MAAM,UAAU,SAAS,OAAO,YAAiC,MAAM;AAEvE,WAAM,gBAAgB,QAAQ;AAC9B,aAAQ,QAAQ,QAAQ;;IAEnB;IACP,OAAO;cAEP,oBAACA;KACC,OAAO;KACP,WAAW,OAAO;KAClB;KACA,SAAS;KACT,OAAO,EAAE,iBAAiB,OAAO;MACjC;MAhBG,MAiBD;IAER;GACI;EAEV;AAEF,uBAAe"}