diff --git a/src/Anchorme.test.tsx b/src/Anchorme.test.tsx index 7b956c3..a645883 100644 --- a/src/Anchorme.test.tsx +++ b/src/Anchorme.test.tsx @@ -131,6 +131,33 @@ it('should render with custom component', () => { expect(customCallback).toHaveBeenCalledWith(URL) }) +it('should render mixed text node and expression children as links', () => { + const { container } = render(testa.com {'testb.com'}) + const links = container.querySelectorAll('a') + expect(links).toHaveLength(2) + expect(links[0]?.href).toBe('http://testa.com/') + expect(links[1]?.href).toBe('http://testb.com/') +}) + +it('should render expression children with surrounding spaces', () => { + const { container } = render({'testa.com'} testb.com) + const links = container.querySelectorAll('a') + expect(links).toHaveLength(2) + expect(links[0]?.href).toBe('http://testa.com/') + expect(links[1]?.href).toBe('http://testb.com/') +}) + +it('should render plain text mixed with expression URL', () => { + const { container, getByText } = render( + hello {'example.com'} world, + ) + const links = container.querySelectorAll('a') + expect(links).toHaveLength(1) + expect(links[0]?.href).toBe('http://example.com/') + expect(getByText(/hello/)).toBeInTheDocument() + expect(getByText(/world/)).toBeInTheDocument() +}) + it('should render with custom inline component', () => { const customCallback = jest.fn() diff --git a/src/Anchorme.tsx b/src/Anchorme.tsx index 85e3792..6f59c8b 100644 --- a/src/Anchorme.tsx +++ b/src/Anchorme.tsx @@ -5,12 +5,12 @@ import { AnchorProps, LinkComponent } from './types' import { Link } from './Link' type Props = { - children: string + children: string | string[] linkComponent?: LinkComponent } & AnchorProps const Anchorme = ({ children, ...rest }: Props) => { - const text = children + const text = Array.isArray(children) ? children.join('') : children const parse = useCallback(() => { const matches = anchorme.list(text)