@orca-fe/pocket
Version:
UI components by orca-team
109 lines (108 loc) • 2.88 kB
JavaScript
/**
* title: 基础用法
* desc: 这里展示了
*/
import React from 'react';
import { IconButton, SvgIcon } from "../..";
import { Space, Tooltip } from 'antd';
import { iconChat, iconList, iconLocationPointRed, iconPolygon } from "./icon";
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var Demo = () => /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsx("div", {
children: "\u6E32\u67D3\u6240\u6709\u56FE\u6807"
}), /*#__PURE__*/_jsx(Space, {
wrap: true,
children: iconList.map((icon, index) => /*#__PURE__*/_jsx(Tooltip, {
title: icon.name,
children: /*#__PURE__*/_jsx(IconButton, {
children: /*#__PURE__*/_jsx(SvgIcon, {
icon: icon
})
})
}, index))
}), /*#__PURE__*/_jsx("div", {
children: "\u4FEE\u6539\u56FE\u6807\u9ED8\u8BA4\u989C\u8272\uFF08\u4EC5\u65E0\u8272\u56FE\u6807\uFF09"
}), /*#__PURE__*/_jsx(Space, {
wrap: true,
children: iconList.map((icon, index) => /*#__PURE__*/_jsx(Tooltip, {
title: icon.name,
children: /*#__PURE__*/_jsx(SvgIcon, {
icon: icon,
color: "orange"
})
}, index))
}), /*#__PURE__*/_jsx("div", {
style: {
marginTop: 8
},
children: "\u81EA\u5B9A\u4E49\u5C3A\u5BF8"
}), /*#__PURE__*/_jsx(Space, {
wrap: true,
children: iconList.map((icon, index) => /*#__PURE__*/_jsx(Tooltip, {
title: icon.name,
children: /*#__PURE__*/_jsx(SvgIcon, {
icon: icon,
size: 32
})
}, index))
}), /*#__PURE__*/_jsx("div", {
style: {
marginTop: 8
},
children: "\u65CB\u8F6C\u56FE\u6807"
}), /*#__PURE__*/_jsx(SvgIcon, {
icon: iconPolygon,
spinning: true,
size: 20
}), /*#__PURE__*/_jsx("div", {
style: {
marginTop: 8
},
children: "\u4FEE\u6539\u591A\u8272\u56FE\u6807\u7684\u7279\u5B9A\u989C\u8272"
}), /*#__PURE__*/_jsxs(Space, {
wrap: true,
children: [/*#__PURE__*/_jsx(SvgIcon, {
icon: iconChat,
size: 20,
customPathProps: [{
fill: '#66cc66'
}]
}), /*#__PURE__*/_jsx(SvgIcon, {
icon: iconChat,
size: 20,
customPathProps: [{
fill: '#ff9911'
}]
}), /*#__PURE__*/_jsx(SvgIcon, {
icon: iconChat,
size: 20,
customPathProps: [{
fill: '#cc0000'
}, {
fill: '#ffc711'
}]
}), /*#__PURE__*/_jsx(SvgIcon, {
icon: iconLocationPointRed,
size: 32,
customPathProps: [{
fill: '#2f6b2f'
}, {
fill: '#16de16'
}, {
fill: '#359b35'
}]
}), /*#__PURE__*/_jsx(SvgIcon, {
icon: iconLocationPointRed,
size: 32,
customPathProps: [{
fill: '#6830ad'
}, {
fill: '#a637ff'
}, {
fill: '#1153cc'
}]
})]
})]
});
export default Demo;