feat: customIcon support slot

vagusX · Jan 30, 2021 · e53a0f6 · e53a0f6
1 parent 3b9992d
commit e53a0f6
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 3 deletions.
diff --git a/packages/icons-vue/examples/custom-icon.jsx b/packages/icons-vue/examples/custom-icon.jsx
@@ -56,7 +56,7 @@ const PandaSvg = (_, { attrs }) => (
 );
 
 const HeartIcon = (_, { attrs }) => {
-  return <Icon component={HeartSvg} {...attrs} />;
+  return <Icon {...attrs} v-slots={{ component: HeartSvg }} />;
 };
 
 const PandaIcon = (_, { attrs }) => {

diff --git a/packages/icons-vue/package.json b/packages/icons-vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ant-design/icons-vue",
-  "version": "6.0.0",
+  "version": "6.0.1",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "sideEffects": false,

diff --git a/packages/icons-vue/src/components/Icon.tsx b/packages/icons-vue/src/components/Icon.tsx
@@ -34,7 +34,11 @@ const Icon: IconType = (props, context) => {
   } = { ...props, ...attrs } as any;
   const children = slots.default && slots.default();
   const hasChildren = children && children.length;
-  warning(Boolean(Component || hasChildren), 'Should have `component` prop or `children`.');
+  const slotsComponent = slots.component;
+  warning(
+    Boolean(Component || hasChildren || slotsComponent),
+    'Should have `component` prop/slot or `children`.',
+  );
 
   useInsertStyles();
 
@@ -67,6 +71,9 @@ const Icon: IconType = (props, context) => {
     if (Component) {
       return <Component {...innerSvgProps}>{children}</Component>;
     }
+    if (slotsComponent) {
+      return slotsComponent(innerSvgProps);
+    }
     if (hasChildren) {
       warning(
         Boolean(viewBox) || (children.length === 1 && children[0] && children[0].type === 'use'),