= {
+ 'Themeable': (
+
+ Provides a simple way to customize default themes, you can change the colors, fonts,
+ breakpoints and everything you need.
+
+ ),
+ 'Fast': (
+
+ voids unnecessary styles props at runtime, making it more performant than other UI
+ libraries.
+
+ ),
+ 'Light & Dark UI': (
+
+ Automatic dark mode recognition, NextUI automatically changes the theme when detects HTML
+ theme prop changes.
+
+ ),
+ };
+ return (
+ More}
+ tabList={tabList}
+ tabProps={{
+ size: 'middle',
+ }}
+ >
+ {contentList[activeTabKey]}
+
+ );
+};
diff --git a/src/Card/demos/index.tsx b/src/Card/demos/index.tsx
new file mode 100644
index 0000000..b2624e3
--- /dev/null
+++ b/src/Card/demos/index.tsx
@@ -0,0 +1,29 @@
+import { EditOutlined, EllipsisOutlined, SettingOutlined } from '@ant-design/icons';
+import { Card } from '@yuntijs/ui';
+
+export default () => {
+ return (
+ ,
+ ,
+ ,
+ ]}
+ bordered={true}
+ cover={
+
+ }
+ extra="extra"
+ hoverable={true}
+ loading={false}
+ title="YuntiUI Card"
+ >
+ The YuntiUI components are inspired by LobeUI and developed based on Antd components, fully
+ compatible with Antd components, and it is recommended to use antd-style as the default
+ css-in-js styling solution.
+
+ );
+};
diff --git a/src/Card/index.md b/src/Card/index.md
new file mode 100644
index 0000000..623d7ad
--- /dev/null
+++ b/src/Card/index.md
@@ -0,0 +1,51 @@
+---
+nav: Components
+group: Data Display
+title: Card
+description: A container for displaying information.
+---
+
+## Usage
+
+based on antd [Card](https://ant.design/components/card-cn/) component.
+
+### Simple usage
+
+```jsx | pure
+import { Card } from '@yuntijs/ui';
+
+export default () => {
+ return (
+
+ The YuntiUI components are inspired by LobeUI and developed based on Antd components, fully compatible with Antd components, and it is recommended to use antd-style as the default css-in-js styling solution.
+
+ );
+};
+```
+
+
+
+### Card.Meta usage
+
+
+
+### Card.Grid usage
+
+
+
+### Card.Tab usage
+
+
+
+## Playground
+
+
+
+## APIs
+
+
diff --git a/src/Card/index.tsx b/src/Card/index.tsx
new file mode 100644
index 0000000..c045814
--- /dev/null
+++ b/src/Card/index.tsx
@@ -0,0 +1 @@
+export { Card, type CardProps } from 'antd';
diff --git a/src/index.ts b/src/index.ts
index e3f8a4e..93e0e78 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -7,6 +7,7 @@ export * from './Tree';
// ~ custom antd
export * from './Alert';
+export * from './Card';
// ~ antd
export {
@@ -20,6 +21,20 @@ export {
type AutoCompleteProps,
Avatar,
type AvatarProps,
+ BackTop,
+ type BackTopProps,
+ Badge, // @todo composed type
+ type BadgeProps,
+ Button, // @todo dependence unifiedLink. link type, hover primary color, back button
+ type ButtonProps,
+ Calendar,
+ type CalendarProps,
+ Carousel,
+ type CarouselProps,
+ Checkbox,
+ type CheckboxProps,
+ ColorPicker,
+ type ColorPickerProps,
} from 'antd';
// ~ antd-style