Usage
import { LayoutItem } from 'nr1'
Props
Content to display inside the child item.
Appends class names to the component.
LayoutItem .SIZE_TYPE .MEDIUM
Determines the width of the layout item. We recommend you use the small size for navigation purposes (ex. sidebars) and the medium size for showing contextualized information (ex. activity stream).
Size type only works on SPLIT_LEFT and SPLIT_RIGHT items.
<One ofLayoutItem.SIZE_TYPE.MEDIUM,LayoutItem.SIZE_TYPE.SMALL,>
Inline style for custom styling.
Adds a data-test-id
attribute. Use it to target the component in unit and
E2E tests.
For a test id to be valid, prefix it with your nerdpack id, followed up by a dot.
For example, my-nerdpack.some-element
.
Note: You might not see data-test-id
attributes as they are removed
from the DOM, to debug them pass a e2e-test
query parameter to the URL.
LayoutItem .TYPE .MAIN
Type can be:
- Main — Used to place the main content on each view. It spans the full width of the layout area.
- Split left — Render as a fixed area on the left of the layout.
- Split right — Render as a fixed area on the right of the layout.
<One ofLayoutItem.TYPE.MAIN,LayoutItem.TYPE.SPLIT_LEFT,LayoutItem.TYPE.SPLIT_RIGHT,>