		Changelog
		=========

		## [1.0.0-beta.1](https://github.com/ckeditor/ckeditor5-heading/compare/v1.0.0-alpha.2...v1.0.0-beta.1) (2018-03-15)

		### Other changes

		* Aligned feature class naming to the new scheme. ([511a9d8](https://github.com/ckeditor/ckeditor5-heading/commit/511a9d8))
		* Migrated package styles to PostCSS. Moved visual styles to `@ckeditor/ckeditor5-theme-lark` (see [ckeditor/ckeditor5-ui#144](https://github.com/ckeditor/ckeditor5-ui/issues/144)). ([965179e](https://github.com/ckeditor/ckeditor5-heading/commit/965179e))
		* Updated naming of UI components & commands. ([72ee3d6](https://github.com/ckeditor/ckeditor5-heading/commit/72ee3d6))

		### BREAKING CHANGES

		* Renamed the `'headings'` dropdown UI component to `'heading'`.
		* The `'heading1'`, `'heading2'` and `'heading3'` commands are no longer available. They were replaced by the `'heading'` command that accepts heading model element name as a value.
		* The `HeadingCommand#value` is no longer a boolean only. Now it stores a name of the heading model element when selection is inside a heading.
		* The `HeadingCommand` constructor's second parameter is now an array of supported model elements.


		## [1.0.0-alpha.2](https://github.com/ckeditor/ckeditor5-heading/compare/v1.0.0-alpha.1...v1.0.0-alpha.2) (2017-11-14)
		@@ -50,8 +66,8 @@

		* Changed the default heading drop-down title to a more meaningful one. Closes [#68](https://github.com/ckeditor/ckeditor5-heading/issues/68). Closes [#62](https://github.com/ckeditor/ckeditor5-heading/issues/62). ([1c16e96](https://github.com/ckeditor/ckeditor5-heading/commit/1c16e96)) and ([e58dadc](https://github.com/ckeditor/ckeditor5-heading/commit/e58dadc))
		* Drop-down should be inactive when none of the commands can be applied to the current selection. Closes [#66](https://github.com/ckeditor/ckeditor5-heading/issues/66). ([0ebd5cd](https://github.com/ckeditor/ckeditor5-heading/commit/0ebd5cd))
		* Changed the default heading dropdown title to a more meaningful one. Closes [#68](https://github.com/ckeditor/ckeditor5-heading/issues/68). Closes [#62](https://github.com/ckeditor/ckeditor5-heading/issues/62). ([1c16e96](https://github.com/ckeditor/ckeditor5-heading/commit/1c16e96)) and ([e58dadc](https://github.com/ckeditor/ckeditor5-heading/commit/e58dadc))
		* Dropdown should be inactive when none of the commands can be applied to the current selection. Closes [#66](https://github.com/ckeditor/ckeditor5-heading/issues/66). ([0ebd5cd](https://github.com/ckeditor/ckeditor5-heading/commit/0ebd5cd))

		### Features

		* Active heading is marked in the drop-down list. Closes [#26](https://github.com/ckeditor/ckeditor5-heading/issues/26). ([39ba14b](https://github.com/ckeditor/ckeditor5-heading/commit/39ba14b))
		* Active heading is marked in the dropdown list. Closes [#26](https://github.com/ckeditor/ckeditor5-heading/issues/26). ([39ba14b](https://github.com/ckeditor/ckeditor5-heading/commit/39ba14b))
		* Enabled the tooltip for the 'headings' component in editor.ui#componentFactory. Closes [#55](https://github.com/ckeditor/ckeditor5-heading/issues/55). ([794e6df](https://github.com/ckeditor/ckeditor5-heading/commit/794e6df))
		@@ -58,0 +74,0 @@ * Named existing plugin(s). ([7d512cd](https://github.com/ckeditor/ckeditor5-heading/commit/7d512cd))

lang/contexts.json

		{
		"Paragraph": "Drop-down option label for the paragraph format.",
		"Heading": "Tooltip for the heading drop-down.",
		"Choose heading": "Default label for the heading drop-down.",
		"Heading 1": "Drop-down option label for the heading level 1 format.",
		"Heading 2": "Drop-down option label for the heading level 2 format.",
		"Heading 3": "Drop-down option label for the heading level 3 format."
		"Paragraph": "Dropdown option label for the paragraph format.",
		"Heading": "Tooltip for the heading dropdown.",
		"Choose heading": "Default label for the heading dropdown.",
		"Heading 1": "Dropdown option label for the heading level 1 format.",
		"Heading 2": "Dropdown option label for the heading level 2 format.",
		"Heading 3": "Dropdown option label for the heading level 3 format."
		}

LICENSE.md

		@@ -5,3 +5,3 @@ Software License Agreement
		CKEditor 5 Headings Feature – https://github.com/ckeditor/ckeditor5-heading <br>
		Copyright (c) 2003-2017, [CKSource](http://cksource.com) Frederico Knabben. All rights reserved.
		Copyright (c) 2003-2018, [CKSource](http://cksource.com) Frederico Knabben. All rights reserved.

		@@ -8,0 +8,0 @@ Licensed under the terms of any of the following licenses at your choice:

package.json

		{
		"name": "@ckeditor/ckeditor5-heading",
		"version": "1.0.0-alpha.2",
		"version": "1.0.0-beta.1",
		"description": "Headings feature for CKEditor 5.",
		@@ -10,19 +10,20 @@ "keywords": [
		"dependencies": {
		"@ckeditor/ckeditor5-core": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-ui": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-utils": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-engine": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-paragraph": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-theme-lark": "^1.0.0-alpha.2"
		"@ckeditor/ckeditor5-core": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-ui": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-utils": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-engine": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-paragraph": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-theme-lark": "^1.0.0-beta.1"
		},
		"devDependencies": {
		"@ckeditor/ckeditor5-editor-classic": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-enter": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-image": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-typing": "^1.0.0-alpha.2",
		"@ckeditor/ckeditor5-undo": "^1.0.0-alpha.2",
		"eslint": "^4.8.0",
		"eslint-config-ckeditor5": "^1.0.6",
		"@ckeditor/ckeditor5-cloudservices": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-editor-classic": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-enter": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-image": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-typing": "^1.0.0-beta.1",
		"@ckeditor/ckeditor5-undo": "^1.0.0-beta.1",
		"eslint": "^4.15.0",
		"eslint-config-ckeditor5": "^1.0.7",
		"husky": "^0.14.3",
		"lint-staged": "^4.2.3"
		"lint-staged": "^6.0.0"
		},
		@@ -29,0 +30,0 @@ "engines": {

README.md

		@@ -7,3 +7,5 @@ CKEditor 5 headings feature
		[![Build Status](https://travis-ci.org/ckeditor/ckeditor5-heading.svg?branch=master)](https://travis-ci.org/ckeditor/ckeditor5-heading)
		[![Test Coverage](https://codeclimate.com/github/ckeditor/ckeditor5-heading/badges/coverage.svg)](https://codeclimate.com/github/ckeditor/ckeditor5-heading/coverage)
		[![BrowserStack Status](https://www.browserstack.com/automate/badge.svg?badge_key=d3hvenZqQVZERFQ5d09FWXdyT0ozVXhLaVltRFRjTTUyZGpvQWNmWVhUUT0tLUZqNlJ1YWRUd0RvdEVOaEptM1B2Q0E9PQ==--c9d3dee40b9b4471ff3fb516d9ecf8d09292c7e0)](https://www.browserstack.com/automate/public-build/d3hvenZqQVZERFQ5d09FWXdyT0ozVXhLaVltRFRjTTUyZGpvQWNmWVhUUT0tLUZqNlJ1YWRUd0RvdEVOaEptM1B2Q0E9PQ==--c9d3dee40b9b4471ff3fb516d9ecf8d09292c7e0)
		[![Coverage Status](https://coveralls.io/repos/github/ckeditor/ckeditor5-heading/badge.svg?branch=master)](https://coveralls.io/github/ckeditor/ckeditor5-heading?branch=master)
		<br>
		[![Dependency Status](https://david-dm.org/ckeditor/ckeditor5-heading/status.svg)](https://david-dm.org/ckeditor/ckeditor5-heading)
		@@ -10,0 +12,0 @@ [![devDependency Status](https://david-dm.org/ckeditor/ckeditor5-heading/dev-status.svg)](https://david-dm.org/ckeditor/ckeditor5-heading?type=dev)

181

src/heading.js

		/**
		* @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
		* @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
		* For licensing, see LICENSE.md.
		@@ -10,15 +10,14 @@ */

		import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
		import HeadingEngine from './headingengine';
		import HeadingEditing from './headingediting';
		import HeadingUI from './headingui';
		import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
		import Model from '@ckeditor/ckeditor5-ui/src/model';
		import createListDropdown from '@ckeditor/ckeditor5-ui/src/dropdown/list/createlistdropdown';
		import Collection from '@ckeditor/ckeditor5-utils/src/collection';

		import '../theme/theme.scss';
		import '../theme/heading.css';

		/**
		* The headings feature. It introduces the `headings` drop-down and the `heading1`-`headingN` commands which allow
		* to convert paragraphs into headings.
		* The headings feature.
		*
		* It loads the {@link module:heading/headingediting~HeadingEditing heading editing feature}
		* and {@link module:heading/headingui~HeadingUI heading UI feature}.
		*
		* For a detailed overview, check the {@glink features/headings Headings feature documentation}.
		@@ -33,3 +32,3 @@ *
		static get requires() {
		return [ Paragraph, HeadingEngine ];
		return [ HeadingEditing, HeadingUI ];
		}
		@@ -43,138 +42,7 @@
		}

		/**
		* @inheritDoc
		*/
		init() {
		const editor = this.editor;
		const dropdownItems = new Collection();
		const options = this._getLocalizedOptions();
		const commands = [];
		const t = editor.t;
		const defaultTitle = t( 'Choose heading' );
		const dropdownTooltip = t( 'Heading' );

		for ( const option of options ) {
		const command = editor.commands.get( option.modelElement );
		const itemModel = new Model( {
		commandName: option.modelElement,
		label: option.title,
		class: option.class
		} );

		itemModel.bind( 'isActive' ).to( command, 'value' );

		// Add the option to the collection.
		dropdownItems.add( itemModel );

		commands.push( command );
		}

		// Create dropdown model.
		const dropdownModel = new Model( {
		withText: true,
		items: dropdownItems,
		tooltip: dropdownTooltip
		} );

		dropdownModel.bind( 'isEnabled' ).to(
		// Bind to #isEnabled of each command...
		...getCommandsBindingTargets( commands, 'isEnabled' ),
		// ...and set it true if any command #isEnabled is true.
		( ...areEnabled ) => areEnabled.some( isEnabled => isEnabled )
		);

		dropdownModel.bind( 'label' ).to(
		// Bind to #value of each command...
		...getCommandsBindingTargets( commands, 'value' ),
		// ...and chose the title of the first one which #value is true.
		( ...areActive ) => {
		const index = areActive.findIndex( value => value );

		// If none of the commands is active, display default title.
		return options[ index ] ? options[ index ].title : defaultTitle;
		}
		);

		// Register UI component.
		editor.ui.componentFactory.add( 'headings', locale => {
		const dropdown = createListDropdown( dropdownModel, locale );

		dropdown.extendTemplate( {
		attributes: {
		class: [
		'ck-heading-dropdown'
		]
		}
		} );

		// Execute command when an item from the dropdown is selected.
		this.listenTo( dropdown, 'execute', evt => {
		editor.execute( evt.source.commandName );
		editor.editing.view.focus();
		} );

		return dropdown;
		} );
		}

		/**
		* Returns heading options as defined in `config.heading.options` but processed to consider
		* editor localization, i.e. to display {@link module:heading/heading~HeadingOption}
		* in the correct language.
		*
		* Note: The reason behind this method is that there's no way to use {@link module:utils/locale~Locale#t}
		* when the user config is defined because the editor does not exist yet.
		*
		* @private
		* @returns {Array.<module:heading/heading~HeadingOption>}.
		*/
		_getLocalizedOptions() {
		const editor = this.editor;
		const t = editor.t;
		const localizedTitles = {
		Paragraph: t( 'Paragraph' ),
		'Heading 1': t( 'Heading 1' ),
		'Heading 2': t( 'Heading 2' ),
		'Heading 3': t( 'Heading 3' )
		};

		return editor.config.get( 'heading.options' ).map( option => {
		const title = localizedTitles[ option.title ];

		if ( title && title != option.title ) {
		// Clone the option to avoid altering the original `config.heading.options`.
		option = Object.assign( {}, option, { title } );
		}

		return option;
		} );
		}
		}

		// Returns an array of binding components for
		// {@link module:utils/observablemixin~Observable#bind} from a set of iterable
		// commands.
		//
		// @private
		// @param {Iterable.<module:core/command~Command>} commands
		// @param {String} attribute
		// @returns {Array.<String>}
		function getCommandsBindingTargets( commands, attribute ) {
		return Array.prototype.concat( ...commands.map( c => [ c, attribute ] ) );
		}

		/**
		* Heading option descriptor.
		* The configuration of the heading feature. Introduced by the {@link module:heading/headingediting~HeadingEditing} feature.
		*
		* @typedef {Object} module:heading/heading~HeadingOption
		* @property {String} modelElement Element's name in the model.
		* @property {String} viewElement The name of the view element that will be used to represent the model element in the view.
		* @property {String} title The user-readable title of the option.
		* @property {String} class The class which will be added to the dropdown item representing this option.
		*/

		/**
		* The configuration of the heading feature. Introduced by the {@link module:heading/headingengine~HeadingEngine} feature.
		*
		* Read more in {@link module:heading/heading~HeadingConfig}.
		@@ -187,3 +55,3 @@ *
		* The configuration of the heading feature.
		* The option is used by the {@link module:heading/headingengine~HeadingEngine} feature.
		* The option is used by the {@link module:heading/headingediting~HeadingEditing} feature.
		*
		@@ -209,6 +77,6 @@ * ClassicEditor
		* options: [
		* { modelElement: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
		* { modelElement: 'heading1', viewElement: 'h2', title: 'Heading 1', class: 'ck-heading_heading1' },
		* { modelElement: 'heading2', viewElement: 'h3', title: 'Heading 2', class: 'ck-heading_heading2' },
		* { modelElement: 'heading3', viewElement: 'h4', title: 'Heading 3', class: 'ck-heading_heading3' }
		* { model: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
		* { model: 'heading1', view: 'h2', title: 'Heading 1', class: 'ck-heading_heading1' },
		* { model: 'heading2', view: 'h3', title: 'Heading 2', class: 'ck-heading_heading2' },
		* { model: 'heading3', view: 'h4', title: 'Heading 3', class: 'ck-heading_heading3' }
		* ]
		@@ -226,4 +94,7 @@ * };
		* the {@link module:paragraph/paragraph~Paragraph} feature (which is required by
		* the {@link module:heading/headingengine~HeadingEngine} feature).
		* the {@link module:heading/headingediting~HeadingEditing} feature).
		*
		* You can read more about configuring heading levels and see more examples in
		* the {@glink features/headings Headings} guide.
		*
		* Note: In the model you should always start from `heading1`, regardless of how the headings are represented in the view.
		@@ -233,8 +104,18 @@ * That's assumption is used by features like {@link module:autoformat/autoformat~Autoformat} to know which element
		*
		* The defined headings are also available in {@link module:core/commandcollection~CommandCollection} under their model names.
		* The defined headings are also available as values passed to `heading` command under their model names.
		* For example, the below code will apply `<heading1>` to the current selection:
		*
		* editor.execute( 'heading1' );
		* editor.execute( 'heading', { value: 'heading1' } );
		*
		* @member {Array.<module:heading/heading~HeadingOption>} module:heading/heading~HeadingConfig#options
		*/

		/**
		* Heading option descriptor.
		*
		* @typedef {Object} module:heading/heading~HeadingOption
		* @property {String} model Name of the model element to convert.
		* @property {module:engine/view/elementdefinition~ElementDefinition} view Definition of a view element to convert from/to.
		* @property {String} title The user-readable title of the option.
		* @property {String} class The class which will be added to the dropdown item representing this option.
		*/

src/headingcommand.js

		/**
		* @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
		* @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
		* For licensing, see LICENSE.md.
		@@ -11,3 +11,2 @@ */
		import Command from '@ckeditor/ckeditor5-core/src/command';
		import Position from '@ckeditor/ckeditor5-engine/src/model/position';
		import first from '@ckeditor/ckeditor5-utils/src/first';
		@@ -25,23 +24,25 @@
		* @param {module:core/editor/editor~Editor} editor Editor instance.
		* @param {String} modelElement Name of the element which this command will apply in the model.
		* @param {Array.<String>} modelElements Names of the element which this command can apply in the model.
		*/
		constructor( editor, modelElement ) {
		constructor( editor, modelElements ) {
		super( editor );

		/**
		* Whether the selection starts in a heading of {@link #modelElement this level}.
		* If the selection starts in a heading (which {@link #modelElements is supported by this command})
		* the value is set to the name of that heading model element.
		* It is set to `false` otherwise.
		*
		* @observable
		* @readonly
		* @member {Boolean} #value
		* @member {Boolean\|String} #value
		*/

		/**
		* Unique identifier of the command, also element's name in the model.
		* Set of defined model's elements names that this command support.
		* See {@link module:heading/heading~HeadingOption}.
		*
		* @readonly
		* @member {String}
		* @member {Array.<String>}
		*/
		this.modelElement = modelElement;
		this.modelElements = modelElements;
		}
		@@ -53,6 +54,6 @@
		refresh() {
		const block = first( this.editor.document.selection.getSelectedBlocks() );
		const block = first( this.editor.model.document.selection.getSelectedBlocks() );

		this.value = !!block && block.is( this.modelElement );
		this.isEnabled = !!block && checkCanBecomeHeading( block, this.modelElement, this.editor.document.schema );
		this.value = !!block && this.modelElements.includes( block.name ) && block.name;
		this.isEnabled = !!block && this.modelElements.some( heading => checkCanBecomeHeading( block, heading, this.editor.model.schema ) );
		}
		@@ -64,21 +65,25 @@
		*
		* @param {Object} options
		* @param {String} options.value Name of the element which this command will apply in the model.
		* @fires execute
		* @param {Object} [options] Options for executed command.
		* @param {module:engine/model/batch~Batch} [options.batch] Batch to collect all the change steps.
		* New batch will be created if this option is not set.
		*/
		execute( options = {} ) {
		const editor = this.editor;
		const document = editor.document;
		const model = this.editor.model;
		const document = model.document;

		document.enqueueChanges( () => {
		const batch = options.batch \|\| document.batch();
		const modelElement = options.value;

		if ( !this.modelElements.includes( modelElement ) ) {
		return;
		}

		model.change( writer => {
		const blocks = Array.from( document.selection.getSelectedBlocks() )
		.filter( block => {
		return checkCanBecomeHeading( block, this.modelElement, document.schema );
		return checkCanBecomeHeading( block, modelElement, model.schema );
		} );

		for ( const block of blocks ) {
		if ( !block.is( this.modelElement ) ) {
		batch.rename( block, this.modelElement );
		if ( !block.is( modelElement ) ) {
		writer.rename( block, modelElement );
		}
		@@ -98,6 +103,3 @@ }
		function checkCanBecomeHeading( block, heading, schema ) {
		return schema.check( {
		name: heading,
		inside: Position.createBefore( block )
		} );
		return schema.checkChild( block.parent, heading ) && !schema.isObject( block );
		}

src/headingengine.js

theme/theme.scss

lang/translations/bg.po