in packages/roosterjs-react-command-bar/lib/components/RoosterCommandBar.tsx [46:78]
public render(): JSX.Element {
const { className, calloutClassName, calloutOnDismiss, overflowMenuProps, commandBarClassName, ellipsisAriaLabel } = this.props;
// with the newest changes on the editor, refresh the buttons (e.g. bold button being selected if text selected is bold and header being checked if used)
this._buttons.forEach(this._refreshButtonStates);
return (
<div className={css("rooster-command-bar", className)}>
<CommandBar
className={css("rooster-command-bar-base", commandBarClassName)}
items={this._buttons}
overflowButtonProps={{
ariaLabel: ellipsisAriaLabel,
menuProps: {
...overflowMenuProps,
// we set items as empty to satisfy the type checker & because otherwise the component
// throws an error about an unexpected `undefined` value on first render.
//
// We expect it to be overridden by the commandBar when rendering the button
// after measuring.
items: [],
calloutProps: {
className: calloutClassName
},
onDismiss: calloutOnDismiss,
className: css("rooster-command-bar-overflow", overflowMenuProps && overflowMenuProps.className),
focusZoneProps: { direction: FocusZoneDirection.horizontal }
}
}}
/>
<input type="file" ref={this._fileInputOnRef} accept="image/*" style={DisplayNoneStyle} onChange={this._fileInputOnChange} />
</div>
);
}