"Toggling between states with ease, that's what ToggleBars do best."
Q. Jones, 954
| open | boolean | |
| flow | preset-flow | |
| showHandle | boolean | |
| closeOnValidate | boolean | |
| hideAcceptButton | boolean | |
| hideCloseButton | boolean | |
| hideCancelButton | boolean |
<ToggleBar style="width:350px;" >
<Icon icon="carbon:progress-bar" slot="toggleBarIcon" />
<div slot="toggleBarButtons">
<Button>button</Button>
</div>
<IconButton icon="search" slot="contentSwitcherIcon" />
<Input size="full" value="a slotted input" />
</ToggleBar>
__propDef: {
props: {
class?: string | undefined;
element?: HTMLDivElement | null | undefined;
style?: string | null | undefined;
title: string | undefined;
icon?: string | undefined;
orientation?: "left" | "right" | undefined;
contentSwitcherIcon?: string | undefined;
};
events: {
[evt: string]: CustomEvent<any>;
};
slots: {
toggleBarIcon: {};
toggleBarTitle: {};
toggleBarButtons: {};
contentSwitcherIcon: {
slot: string;
};
contentSwitcherReveal: {
slot: string;
};
};
};