chore: breadcrumb readme updated with props.children

packages/breadcrumbs/README.md

@@ -26,7 +26,7 @@ Breadcrumbs showing the ancestor pages and the current active page
 - **`active`**: String. Required. The name of the active page (the page the user is currently on).
 - **`crumbs`**: Array of Objects contains `name` (String) and `url` (string) properties. Optional. The ancestor pages.
 - **`emptyState`**: String. Optional. The value which will be display when the active page or an ancestor does not have a value. Default `…` (…)
-- **`renderCustomCrumbContent`**: Function. Optional. The value which will be display when the active page or an ancestor does not have a value.
+- **`children`**: BreadcrumbItem Components. Optional. The children must be reactstrap BreadcrumbItem components
 
 ##### Usage
 
@@ -38,22 +38,20 @@ import Breadcrumbs from '@availity/breadcrumbs';
 // ...
 ```
 
-Example with custom crumb
-NOTE: Currently you can only customize one breadcrumb: the breadcrumb farthest to the right. So this example would produce "Home > Grand Parent > Parent > Custom anchor > Current Page"
+Example with custom child breadcrumbs. This would create the Breadcrumbs "Home > Custom Bread Crumb > Current Page"
 ```javascript
 import React from 'react';
 import Breadcrumbs from '@availity/breadcrumbs';
+import { BreadcrumbItem } from 'reactstrap';
 // ...
 <Breadcrumbs
-      crumbs={[
-        { name: 'Grand Parent', url: '/grand-parent' },
-        { name: 'Parent', url: '/parent' },
-      ]}
-      active="Current Page"
-      renderCustomCrumbContent={() => (
-        <a href="/custom-url" className="custom-anchor" >Custom anchor</a>
-      )}
-    />
+  emptyState={text('Empty State', Breadcrumbs.defaultProps.emptyState)}
+  active={text('Active Page', 'Current Page')}
+>
+  <BreadcrumbItem>
+    <div>Custom Bread Crumb</div>
+  </BreadcrumbItem>
+</Breadcrumbs>
 // ...
 ```