<Breadcrumbs />
Component
, @webstencils/ui
Specialised breadcrumbs component to display a layout path to the selected element.
import { Editor } from '@webstencils/core';
import { Breadcrumbs } from '@webstencils/ui';
function MyComponent() {
return (
<Editor>
<Breadcrumbs />
<Frame>{/* ... */}</Frame>
</Editor>
)
}
Let's take the following layout as an example:
<App>
<Introduction>
<Heading>
<Text></Text>
</Heading>
</Introduction>
</App>
When clicking on the Text
element, you are going to see the following structure:
Clicking on each link of the breadcrumb selects the corresponding component.