diff --git a/packages/lucide-react-native/src/Icon.ts b/packages/lucide-react-native/src/Icon.ts index 270b67ae1..f9ac4c8f6 100644 --- a/packages/lucide-react-native/src/Icon.ts +++ b/packages/lucide-react-native/src/Icon.ts @@ -97,9 +97,11 @@ const Icon = forwardRef( }); const customAttrs = { + fill: svgAttributes['fill'], stroke: svgAttributes['stroke'], strokeWidth: svgAttributes['strokeWidth'], - ...rest, + strokeLinecap: svgAttributes['strokeLinecap'], + strokeLinejoin: svgAttributes['strokeLinejoin'], }; return createElement( diff --git a/packages/lucide-react-native/tests/Icon.spec.tsx b/packages/lucide-react-native/tests/Icon.spec.tsx index 09d044cd7..c4baa08d1 100644 --- a/packages/lucide-react-native/tests/Icon.spec.tsx +++ b/packages/lucide-react-native/tests/Icon.spec.tsx @@ -1,4 +1,4 @@ -import { describe, it, expect, vi } from 'vitest'; +import { describe, it, expect, vi, afterEach } from 'vitest'; import { render } from '@testing-library/react'; import { airVent } from './testIconNodes'; @@ -7,6 +7,8 @@ import { Icon } from '../src/lucide-react-native'; vi.mock('react-native-svg'); describe('Using Icon Component', () => { + afterEach(() => vi.restoreAllMocks()); + const airVentIcon = { name: 'air-vent', node: airVent }; it('should render icon based on a iconNode', async () => { @@ -71,4 +73,52 @@ describe('Using Icon Component', () => { expect(container.firstChild?.firstChild).toHaveAttribute('vector-effect', 'non-scaling-stroke'); }); + + it('should not forward arbitrary rest props (e.g. onPress) to child shape elements, only to the parent Svg', async () => { + const RNSvg = await import('react-native-svg'); + const pathSpy = vi.spyOn(RNSvg, 'Path'); + const svgSpy = vi.spyOn(RNSvg, 'Svg'); + const onPress = vi.fn(); + + render( + , + ); + + expect(pathSpy).toHaveBeenCalled(); + for (const call of pathSpy.mock.calls) { + const childProps = call[0] as Record; + expect(childProps.onPress).toBeUndefined(); + } + + expect(svgSpy).toHaveBeenCalled(); + const svgProps = svgSpy.mock.calls[0][0] as Record; + expect(svgProps.onPress).toBe(onPress); + }); + + it('should apply strokeLinecap and strokeLinejoin overrides to child shape elements', async () => { + const { container } = render( + , + ); + + const { children = [] } = (container.firstChild ?? {}) as unknown as { + children: HTMLCollection; + }; + expect(children.length).toBeGreaterThan(0); + for (let i = 0; i < children.length; i++) { + const child = children[i]; + expect(child.getAttribute('stroke-linecap')).toBe('butt'); + expect(child.getAttribute('stroke-linejoin')).toBe('miter'); + } + }); });