| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192 |
- /**
- * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
- /**
- * @module ui/dropdown/button/dropdownbuttonview
- */
- import ButtonView from '../../button/buttonview';
- import dropdownArrowIcon from '../../../theme/icons/dropdown-arrow.svg';
- import IconView from '../../icon/iconview';
- /**
- * The default dropdown button view class.
- *
- * const view = new DropdownButtonView();
- *
- * view.set( {
- * label: 'A button',
- * keystroke: 'Ctrl+B',
- * tooltip: true
- * } );
- *
- * view.render();
- *
- * document.body.append( view.element );
- *
- * Also see the {@link module:ui/dropdown/utils~createDropdown `createDropdown()` util}.
- *
- * @implements module:ui/dropdown/button/dropdownbutton~DropdownButton
- * @extends module:ui/button/buttonview~ButtonView
- */
- export default class DropdownButtonView extends ButtonView {
- /**
- * @inheritDoc
- */
- constructor( locale ) {
- super( locale );
- /**
- * An icon that displays arrow to indicate a dropdown button.
- *
- * @readonly
- * @member {module:ui/icon/iconview~IconView}
- */
- this.arrowView = this._createArrowView();
- this.extendTemplate( {
- attributes: {
- 'aria-haspopup': true
- }
- } );
- this.withArrow = true;
- // The DropdownButton interface expects the open event upon which will open the dropdown.
- this.delegate( 'execute' ).to( this, 'open' );
- }
- /**
- * @inheritDoc
- */
- render() {
- super.render();
- if ( this.withArrow ) {
- this.children.add( this.arrowView );
- }
- }
- /**
- * Creates a {@link module:ui/icon/iconview~IconView} instance as {@link #arrowView}.
- *
- * @private
- * @returns {module:ui/icon/iconview~IconView}
- */
- _createArrowView() {
- const arrowView = new IconView();
- arrowView.content = dropdownArrowIcon;
- arrowView.extendTemplate( {
- attributes: {
- class: 'ck-dropdown__arrow'
- }
- } );
- return arrowView;
- }
- }
|