# Toolbar Toolbar может отображаться в горизонтальном и вертикальном положении с разными размерами. ## Toolbar Props (свойства) для компонента Toolbar: [{"name":"view","type":{"name":"enum","raw":"\"default\"","value":[{"value":"\"default\""}]}},{"name":"size","type":{"name":"enum","raw":"\"m\" | \"s\" | \"l\" | \"xs\"","value":[{"value":"\"m\""},{"value":"\"s\""},{"value":"\"l\""},{"value":"\"xs\""}]}},{"name":"orientation","type":{"name":"enum","raw":"\"horizontal\" | \"vertical\"","value":[{"value":"\"horizontal\""},{"value":"\"vertical\""}]}},{"name":"hasShadow","type":{"name":"boolean"}}] ## Использование Компонент  `Toolbar`  должен содержать контент передаваемый в  `children` .
Для разделения элементов можно использовать ToolbarDivider. ```tsx
import React from 'react';
import { Toolbar } from '@salutejs/plasma-web';
import { IconEdit } from '@salutejs/plasma-icons';
export function App() {
return (
<Toolbar>
<Button square size="m" view="clear" contentLeft={<IconEdit />} />
<Button square size="m" view="clear" contentLeft={<IconEdit />} />
<Button square size="m" view="clear" contentLeft={<IconEdit />} />
<ToolbarDivider />
<Button square size="m" view="clear" contentLeft={<IconEdit />} />
<Button square size="m" view="clear" contentLeft={<IconEdit />} />
</Toolbar>
);
}
```