UNPKG

@lobehub/ui

Version:

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

1 lines 1.55 kB
{"version":3,"file":"Folder.mjs","names":["Flexbox"],"sources":["../../../src/mdx/FileTree/Folder.tsx"],"sourcesContent":["'use client';\n\nimport { FolderIcon, FolderOpen } from 'lucide-react';\nimport { type FC, useState } from 'react';\n\nimport { Flexbox, type FlexboxProps } from '@/Flex';\nimport Icon, { type IconProps } from '@/Icon';\n\nimport { styles } from './style';\n\nexport interface FolderProps extends FlexboxProps {\n defaultOpen?: boolean;\n icon?: IconProps['icon'];\n name: string;\n}\n\nconst Folder: FC<FolderProps> = ({ name, defaultOpen, icon = FolderIcon, children, ...rest }) => {\n const [open, setOpen] = useState(defaultOpen);\n return (\n <Flexbox {...rest}>\n <Flexbox\n horizontal\n align={'center'}\n className={styles.folder}\n gap={4}\n onClick={() => setOpen(!open)}\n >\n <Icon icon={open ? FolderOpen : icon} />\n <span>{name}</span>\n </Flexbox>\n {open && <Flexbox className={styles.folderChildren}>{children}</Flexbox>}\n </Flexbox>\n );\n};\n\nFolder.displayName = 'MdxFolder';\n\nexport default Folder;\n"],"mappings":";;;;;;;;AAgBA,MAAM,UAA2B,EAAE,MAAM,aAAa,OAAO,YAAY,UAAU,GAAG,WAAW;CAC/F,MAAM,CAAC,MAAM,WAAW,SAAS,YAAY;AAC7C,QACE,qBAACA,mBAAD;EAAS,GAAI;YAAb,CACE,qBAACA,mBAAD;GACE,YAAA;GACA,OAAO;GACP,WAAW,OAAO;GAClB,KAAK;GACL,eAAe,QAAQ,CAAC,KAAK;aAL/B,CAOE,oBAAC,MAAD,EAAM,MAAM,OAAO,aAAa,MAAQ,CAAA,EACxC,oBAAC,QAAD,EAAA,UAAO,MAAY,CAAA,CACX;MACT,QAAQ,oBAACA,mBAAD;GAAS,WAAW,OAAO;GAAiB;GAAmB,CAAA,CAChE;;;AAId,OAAO,cAAc"}