diff --git a/packages/client/src/breadcrumbs/Breadcrumbs.test.tsx b/packages/client/src/breadcrumbs/Breadcrumbs.test.tsx
new file mode 100644
index 0000000..3f36513
--- /dev/null
+++ b/packages/client/src/breadcrumbs/Breadcrumbs.test.tsx
@@ -0,0 +1,32 @@
+import React from 'react'
+import {Breadcrumbs} from './Breadcrumbs'
+import {TestUtils} from '../test-utils'
+import {MemoryRouter} from 'react-router-dom'
+
+const t = new TestUtils()
+
+describe('Breadcrumbs', () => {
+
+ describe('render', () => {
+ it('renders', () => {
+ const {node} = t.render(
+
+
+ ,
+ )
+ expect(node.innerHTML).toMatch(/href="\/one"/)
+ expect(node.innerHTML).toMatch(/href="\/two"/)
+ expect(node.innerHTML).toMatch(/three/)
+ })
+ })
+
+})
diff --git a/packages/client/src/breadcrumbs/Breadcrumbs.tsx b/packages/client/src/breadcrumbs/Breadcrumbs.tsx
new file mode 100644
index 0000000..01d9afe
--- /dev/null
+++ b/packages/client/src/breadcrumbs/Breadcrumbs.tsx
@@ -0,0 +1,28 @@
+import React from 'react'
+import {Breadcrumb, BreadcrumbItem} from 'bloomer'
+import {Link} from 'react-router-dom'
+
+export interface IBreadcrumbsProps {
+ links: Array<{
+ name: string
+ to: string
+ }>
+ current: string
+}
+
+export class Breadcrumbs extends React.PureComponent {
+ render() {
+ return (
+
+
+ {this.props.links.map((link, i) => (
+
+ {link.name}
+
+ ))}
+ {this.props.current}
+
+
+ )
+ }
+}
diff --git a/packages/client/src/breadcrumbs/index.ts b/packages/client/src/breadcrumbs/index.ts
new file mode 100644
index 0000000..f35988d
--- /dev/null
+++ b/packages/client/src/breadcrumbs/index.ts
@@ -0,0 +1 @@
+export * from './Breadcrumbs'