diff --git a/src/_internal/icons/Cancel.tsx b/src/_internal/icons/Cancel.tsx index f93c15c9fba..15b27a69c36 100644 --- a/src/_internal/icons/Cancel.tsx +++ b/src/_internal/icons/Cancel.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'cancel', +export default replaceable('cancel', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/Clear.tsx b/src/_internal/icons/Clear.tsx index b3b86232406..8e1e88897e6 100644 --- a/src/_internal/icons/Clear.tsx +++ b/src/_internal/icons/Clear.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'clear', +export default replaceable('clear', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/Close.tsx b/src/_internal/icons/Close.tsx index f1c418222cc..b605e01eabf 100644 --- a/src/_internal/icons/Close.tsx +++ b/src/_internal/icons/Close.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'close', +export default replaceable('close', () => ( -) +)) diff --git a/src/_internal/icons/Date.tsx b/src/_internal/icons/Date.tsx index 6f930cd15f8..a475960a962 100644 --- a/src/_internal/icons/Date.tsx +++ b/src/_internal/icons/Date.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'date', +export default replaceable('date', () => ( -) +)) diff --git a/src/_internal/icons/Download.tsx b/src/_internal/icons/Download.tsx index c2ba5f7c4e6..a1926ce6a75 100644 --- a/src/_internal/icons/Download.tsx +++ b/src/_internal/icons/Download.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'download', +export default replaceable('download', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/Error.tsx b/src/_internal/icons/Error.tsx index b3af34e1edd..390b44f65f6 100644 --- a/src/_internal/icons/Error.tsx +++ b/src/_internal/icons/Error.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'error', +export default replaceable('error', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/Info.tsx b/src/_internal/icons/Info.tsx index 42e098d79ac..104e82a3021 100644 --- a/src/_internal/icons/Info.tsx +++ b/src/_internal/icons/Info.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'info', +export default replaceable('info', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/Retry.tsx b/src/_internal/icons/Retry.tsx index f272847ecd8..7bc2e29faef 100644 --- a/src/_internal/icons/Retry.tsx +++ b/src/_internal/icons/Retry.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'retry', +export default replaceable('retry', () => ( -) +)) diff --git a/src/_internal/icons/RotateClockwise.tsx b/src/_internal/icons/RotateClockwise.tsx index 82d7decc12f..fcc1f83dbff 100644 --- a/src/_internal/icons/RotateClockwise.tsx +++ b/src/_internal/icons/RotateClockwise.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'rotateClockwise', +export default replaceable('rotateClockwise', () => ( -) +)) diff --git a/src/_internal/icons/RotateCounterclockwise.tsx b/src/_internal/icons/RotateCounterclockwise.tsx index 9bae8b0f904..68d44e60d3d 100644 --- a/src/_internal/icons/RotateCounterclockwise.tsx +++ b/src/_internal/icons/RotateCounterclockwise.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'rotateClockwise', +export default replaceable('rotateClockwise', () => ( -) +)) diff --git a/src/_internal/icons/Success.tsx b/src/_internal/icons/Success.tsx index 9798473af31..2a6da757d01 100644 --- a/src/_internal/icons/Success.tsx +++ b/src/_internal/icons/Success.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'success', +export default replaceable('success', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/Time.tsx b/src/_internal/icons/Time.tsx index e3f40debee4..1d4a91a05a6 100644 --- a/src/_internal/icons/Time.tsx +++ b/src/_internal/icons/Time.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'time', +export default replaceable('time', () => ( -) +)) diff --git a/src/_internal/icons/To.tsx b/src/_internal/icons/To.tsx index da531afcb78..06d9996581a 100644 --- a/src/_internal/icons/To.tsx +++ b/src/_internal/icons/To.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'to', +export default replaceable('to', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/Trash.tsx b/src/_internal/icons/Trash.tsx index 9a803494994..bf92702daf2 100644 --- a/src/_internal/icons/Trash.tsx +++ b/src/_internal/icons/Trash.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'trash', +export default replaceable('trash', () => ( -) +)) diff --git a/src/_internal/icons/Warning.tsx b/src/_internal/icons/Warning.tsx index 9579fc33503..e921cdaef1f 100644 --- a/src/_internal/icons/Warning.tsx +++ b/src/_internal/icons/Warning.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'warning', +export default replaceable('warning', () => ( @@ -10,4 +9,4 @@ export default replaceable( -) +)) diff --git a/src/_internal/icons/ZoomIn.tsx b/src/_internal/icons/ZoomIn.tsx index 574003d0c46..02310e12aa7 100644 --- a/src/_internal/icons/ZoomIn.tsx +++ b/src/_internal/icons/ZoomIn.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'zoomIn', +export default replaceable('zoomIn', () => ( -) +)) diff --git a/src/_internal/icons/ZoomOut.tsx b/src/_internal/icons/ZoomOut.tsx index b56592b2279..14d1ccf21f7 100644 --- a/src/_internal/icons/ZoomOut.tsx +++ b/src/_internal/icons/ZoomOut.tsx @@ -1,8 +1,7 @@ import { h } from 'vue' import { replaceable } from './replaceable' -export default replaceable( - 'zoomOut', +export default replaceable('zoomOut', () => ( -) +)) diff --git a/src/_internal/icons/replaceable.tsx b/src/_internal/icons/replaceable.tsx index 377b3aa122d..7fdf7ce2fe2 100644 --- a/src/_internal/icons/replaceable.tsx +++ b/src/_internal/icons/replaceable.tsx @@ -1,9 +1,15 @@ +import type { VNode } from 'vue' import type { GlobalIconConfig } from '../../config-provider/src/internal-interface' import { upperFirst } from 'lodash-es' -import { defineComponent, inject } from 'vue' +import { defineComponent, h, inject } from 'vue' import { configProviderInjectionKey } from '../../config-provider/src/context' -export function replaceable(name: keyof GlobalIconConfig, icon: JSX.Element) { +export function replaceable(name: keyof GlobalIconConfig, icon: () => VNode) { + const IconComponent = defineComponent({ + render() { + return icon() + } + }) return defineComponent({ name: upperFirst(name), setup() { @@ -13,7 +19,7 @@ export function replaceable(name: keyof GlobalIconConfig, icon: JSX.Element) { )?.mergedIconsRef return () => { const iconOverride = mergedIconsRef?.value?.[name] - return iconOverride ? iconOverride() : icon + return iconOverride ? iconOverride() : } } }) diff --git a/test.html b/test.html new file mode 100644 index 00000000000..b87263cd573 --- /dev/null +++ b/test.html @@ -0,0 +1,117 @@ + + + + Just a moment... + + + + + + + + +
+
+ +
+
+ + +