@ckeditor/ckeditor5-ui - npm Package Compare versions

Comparing version 10.0.0 to 10.1.0

CHANGELOG.md

 Changelog
 =========
 
+## [10.1.0](https://github.com/ckeditor/ckeditor5-ui/compare/v10.0.0...v10.1.0) (2018-06-21)
+
+### Features
+
+* Implemented list component separators (see [ckeditor/ckeditor5-table#24](https://github.com/ckeditor/ckeditor5-table/issues/24)). ([0808a8c](https://github.com/ckeditor/ckeditor5-ui/commit/0808a8c))
+* Introduced the `BlockToolbar` plugin. Closes [#391](https://github.com/ckeditor/ckeditor5-ui/issues/391). ([5868516](https://github.com/ckeditor/ckeditor5-ui/commit/5868516))
+
+### Bug fixes
+
+* The action should be executed upon the first click on a tooltip-enabled UI in iOS. Closes [ckeditor/ckeditor5#920](https://github.com/ckeditor/ckeditor5/issues/920). ([6508ba2](https://github.com/ckeditor/ckeditor5-ui/commit/6508ba2))
+* The balloon toolbar should be attached correctly in case of a multi-range selection. Closes [#385](https://github.com/ckeditor/ckeditor5-ui/issues/385). ([714ef21](https://github.com/ckeditor/ckeditor5-ui/commit/714ef21))
+* The buttons in the editor should provide basic accessibility. Closes [ckeditor/ckeditor5#1013](https://github.com/ckeditor/ckeditor5/issues/1013). ([9e17d13](https://github.com/ckeditor/ckeditor5-ui/commit/9e17d13))
+
+### Other changes
+
+* Disabling a `ListItemView` should be possible using the `isEnabled` property. Closes [#389](https://github.com/ckeditor/ckeditor5-ui/issues/389). ([76a4d47](https://github.com/ckeditor/ckeditor5-ui/commit/76a4d47))
+* Made the `ContextualBalloon` always use the position of the topmost view in the stack (see: [ckeditor/ckeditor5-table#28](https://github.com/ckeditor/ckeditor5-table/issues/28)). Closes [ckeditor/ckeditor5#900](https://github.com/ckeditor/ckeditor5/issues/900). ([a2ef073](https://github.com/ckeditor/ckeditor5-ui/commit/a2ef073))
+* Updated translations. ([084e8c6](https://github.com/ckeditor/ckeditor5-ui/commit/084e8c6))
+
+
 ## [10.0.0](https://github.com/ckeditor/ckeditor5-ui/compare/v1.0.0-beta.4...v10.0.0) (2018-04-25)
@@ -5,0 +25,0 @@

package.json

 {
   "name": "@ckeditor/ckeditor5-ui",
-  "version": "10.0.0",
+  "version": "10.1.0",
   "description": "The UI framework and standard UI library of CKEditor 5.",
@@ -12,19 +12,23 @@ "keywords": [
   "dependencies": {
-    "@ckeditor/ckeditor5-core": "^10.0.0",
-    "@ckeditor/ckeditor5-theme-lark": "^10.0.0",
-    "@ckeditor/ckeditor5-utils": "^10.0.0"
+    "@ckeditor/ckeditor5-core": "^10.1.0",
+    "@ckeditor/ckeditor5-theme-lark": "^10.1.0",
+    "@ckeditor/ckeditor5-utils": "^10.1.0"
   },
   "devDependencies": {
-    "@ckeditor/ckeditor5-basic-styles": "^10.0.0",
-    "@ckeditor/ckeditor5-cloud-services": "^10.0.0",
-    "@ckeditor/ckeditor5-editor-classic": "^10.0.0",
-    "@ckeditor/ckeditor5-engine": "^10.0.0",
-    "@ckeditor/ckeditor5-enter": "^10.0.0",
-    "@ckeditor/ckeditor5-easy-image": "^10.0.0",
-    "@ckeditor/ckeditor5-heading": "^10.0.0",
-    "@ckeditor/ckeditor5-image": "^10.0.0",
-    "@ckeditor/ckeditor5-link": "^10.0.0",
-    "@ckeditor/ckeditor5-paragraph": "^10.0.0",
-    "@ckeditor/ckeditor5-typing": "^10.0.0",
-    "@ckeditor/ckeditor5-undo": "^10.0.0",
+    "@ckeditor/ckeditor5-basic-styles": "^10.0.1",
+    "@ckeditor/ckeditor5-block-quote": "^10.0.1",
+    "@ckeditor/ckeditor5-cloud-services": "^10.0.1",
+    "@ckeditor/ckeditor5-editor-balloon": "^10.0.1",
+    "@ckeditor/ckeditor5-editor-classic": "^10.0.1",
+    "@ckeditor/ckeditor5-engine": "^10.1.0",
+    "@ckeditor/ckeditor5-enter": "^10.1.0",
+    "@ckeditor/ckeditor5-easy-image": "^10.0.1",
+    "@ckeditor/ckeditor5-essentials": "^10.1.0",
+    "@ckeditor/ckeditor5-heading": "^10.0.1",
+    "@ckeditor/ckeditor5-image": "^10.1.0",
+    "@ckeditor/ckeditor5-link": "^10.0.2",
+    "@ckeditor/ckeditor5-list": "^11.0.0",
+    "@ckeditor/ckeditor5-paragraph": "^10.0.1",
+    "@ckeditor/ckeditor5-typing": "^10.0.1",
+    "@ckeditor/ckeditor5-undo": "^10.0.1",
     "del": "^2.2.0",
@@ -31,0 +35,0 @@ "eslint": "^4.15.0",

README.md

@@ -7,3 +7,3 @@ CKEditor 5 UI framework
 [![Build Status](https://travis-ci.org/ckeditor/ckeditor5-ui.svg?branch=master)](https://travis-ci.org/ckeditor/ckeditor5-ui)
-[![BrowserStack Status](https://www.browserstack.com/automate/badge.svg?badge_key=d3hvenZqQVZERFQ5d09FWXdyT0ozVXhLaVltRFRjTTUyZGpvQWNmWVhUUT0tLUZqNlJ1YWRUd0RvdEVOaEptM1B2Q0E9PQ==--c9d3dee40b9b4471ff3fb516d9ecf8d09292c7e0)](https://www.browserstack.com/automate/public-build/d3hvenZqQVZERFQ5d09FWXdyT0ozVXhLaVltRFRjTTUyZGpvQWNmWVhUUT0tLUZqNlJ1YWRUd0RvdEVOaEptM1B2Q0E9PQ==--c9d3dee40b9b4471ff3fb516d9ecf8d09292c7e0)
+[![BrowserStack Status](https://automate.browserstack.com/automate/badge.svg?badge_key=d3hvenZqQVZERFQ5d09FWXdyT0ozVXhLaVltRFRjTTUyZGpvQWNmWVhUUT0tLUZqNlJ1YWRUd0RvdEVOaEptM1B2Q0E9PQ==--c9d3dee40b9b4471ff3fb516d9ecf8d09292c7e0)](https://automate.browserstack.com/public-build/d3hvenZqQVZERFQ5d09FWXdyT0ozVXhLaVltRFRjTTUyZGpvQWNmWVhUUT0tLUZqNlJ1YWRUd0RvdEVOaEptM1B2Q0E9PQ==--c9d3dee40b9b4471ff3fb516d9ecf8d09292c7e0)
 [![Coverage Status](https://coveralls.io/repos/github/ckeditor/ckeditor5-ui/badge.svg?branch=master)](https://coveralls.io/github/ckeditor/ckeditor5-ui?branch=master)
@@ -10,0 +10,0 @@ <br>

src/button/buttonview.js

@@ -14,2 +14,3 @@ /**
 
+import uid from '@ckeditor/ckeditor5-utils/src/uid';
 import { getEnvKeystrokeText } from '@ckeditor/ckeditor5-utils/src/keyboard';
@@ -46,2 +47,3 @@
 		const bind = this.bindTemplate;
+		const ariaLabelUid = uid();
 
@@ -83,3 +85,3 @@ // Implement the Button interface.
 		 */
-		this.labelView = this._createLabelView();
+		this.labelView = this._createLabelView( ariaLabelUid );
 
@@ -124,3 +126,3 @@ /**
 					'ck-button',
-					bind.to( 'isEnabled', value => value ? 'ck-enabled' : 'ck-disabled' ),
+					bind.if( 'isEnabled', 'ck-disabled', value => !value ),
 					bind.if( 'isVisible', 'ck-hidden', value => !value ),
@@ -131,3 +133,6 @@ bind.to( 'isOn', value => value ? 'ck-on' : 'ck-off' ),
 				type: bind.to( 'type', value => value ? value : 'button' ),
-				tabindex: bind.to( 'tabindex' )
+				tabindex: bind.to( 'tabindex' ),
+				'aria-labelledby': `ck-editor__aria-label_${ ariaLabelUid }`,
+				'aria-disabled': bind.if( 'isEnabled', true, value => !value ),
+				'aria-pressed': bind.if( 'isOn', true )
 			},
@@ -199,5 +204,6 @@
 	 * @private
+	 * @param {String} ariaLabelUid The aria label UID.
 	 * @returns {module:ui/view~View}
 	 */
-	_createLabelView() {
+	_createLabelView( ariaLabelUid ) {
 		const labelView = new View();
@@ -212,3 +218,4 @@
 					'ck-button__label'
-				]
+				],
+				id: `ck-editor__aria-label_${ ariaLabelUid }`,
 			},
@@ -215,0 +222,0 @@

src/dropdown/button/dropdownbuttonview.js

@@ -50,2 +50,8 @@ /**
 
+		this.extendTemplate( {
+			attributes: {
+				'aria-haspopup': true
+			}
+		} );
+
 		// The DropdownButton interface expects the open event upon which will open the dropdown.
@@ -52,0 +58,0 @@ this.delegate( 'execute' ).to( this, 'open' );

src/dropdown/button/splitbuttonview.js

@@ -210,3 +210,4 @@ /**
 			attributes: {
-				class: 'ck-splitbutton__arrow'
+				class: 'ck-splitbutton__arrow',
+				'aria-haspopup': true
 			}
@@ -213,0 +214,0 @@ } );

src/dropdown/dropdownview.js

@@ -150,3 +150,3 @@ /**
 					'ck-dropdown',
-					bind.to( 'isEnabled', isEnabled => isEnabled ? '' : 'ck-disabled' )
+					bind.if( 'isEnabled', 'ck-disabled', value => !value )
 				]
@@ -153,0 +153,0 @@ },

src/dropdown/utils.js

@@ -16,2 +16,3 @@ /**
 import ListItemView from '../list/listitemview';
+import ListSeparatorView from '../list/listseparatorview';
 
@@ -177,7 +178,13 @@ import clickOutsideHandler from '../bindings/clickoutsidehandler';
 	listView.items.bindTo( items ).using( itemModel => {
-		const item = new ListItemView( locale );
+		let item;
 
-		// Bind all attributes of the model to the item view.
-		item.bind( ...Object.keys( itemModel ) ).to( itemModel );
+		if ( itemModel.isSeparator ) {
+			item = new ListSeparatorView( locale );
+		} else {
+			item = new ListItemView( locale );
 
+			// Bind all attributes of the model to the item view.
+			item.bind( ...Object.keys( itemModel ) ).to( itemModel );
+		}
+
 		return item;
@@ -184,0 +191,0 @@ } );

src/list/listitemview.js

@@ -52,3 +52,4 @@ /**
 					bind.to( 'class' ),
-					bind.if( 'isActive', 'ck-list__item_active' )
+					bind.if( 'isActive', 'ck-list__item_active' ),
+					bind.if( 'isEnabled', 'ck-disabled', value => !value )
 				],
@@ -66,3 +67,13 @@ style: bind.to( 'style' ),
 			on: {
-				click: bind.to( 'execute' )
+				click: bind.to( evt => {
+					// We can't make the button disabled using the disabled attribute, because it won't be focusable.
+					// Though, shouldn't this condition be moved to the button controller?
+					if ( this.isEnabled ) {
+						this.fire( 'execute' );
+					} else {
+						// Prevent the default when button is disabled, to block e.g.
+						// automatic form submitting. See ckeditor/ckeditor5-link#74.
+						evt.preventDefault();
+					}
+				} )
 			}
@@ -72,2 +83,11 @@ } );
 		/**
+		 * (Optional) Controls whether the list item is enabled, i.e. it can be clicked and execute an action.
+		 *
+		 * @observable
+		 * @default true
+		 * @member {Boolean} #isEnabled
+		 */
+		this.set( 'isEnabled', true );
+
+		/**
 		 * The label of the list item.
@@ -74,0 +94,0 @@ *

src/panel/balloon/contextualballoon.js

@@ -13,3 +13,2 @@ /**
 import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
-import first from '@ckeditor/ckeditor5-utils/src/first';
 
@@ -217,3 +216,3 @@ /**
 	/**
-	 * Returns position options of the first view in the stack.
+	 * Returns position options of the last view in the stack.
 	 * This keeps the balloon in the same position when view is changed.
@@ -225,3 +224,3 @@ *
 	_getBalloonPosition() {
-		let position = first( this._stack.values() ).position;
+		let position = Array.from( this._stack.values() ).pop().position;
 
@@ -228,0 +227,0 @@ // Use the default limiter if none has been specified.

src/template.js

@@ -1023,3 +1023,3 @@ /**
 // @param {Node} node DOM Node updated when {@link module:utils/observablemixin~ObservableMixin} changes.
-// @return {Array}
+// @returns {Array}
 function getValueSchemaValue( schema, node ) {
@@ -1712,3 +1712,3 @@ return schema.map( schemaItem => {
  * @param {Function} [callback] Allows for processing of the value. Accepts `Node` and `value` as arguments.
- * @return {module:ui/template~TemplateBinding}
+ * @returns {module:ui/template~TemplateBinding}
  */
@@ -1748,3 +1748,3 @@
  * @param {Function} [callback] Allows for processing of the value. Accepts `Node` and `value` as arguments.
- * @return {module:ui/template~TemplateBinding}
+ * @returns {module:ui/template~TemplateBinding}
  */
@@ -1751,0 +1751,0 @@

src/toolbar/balloon/balloontoolbar.js

@@ -205,2 +205,3 @@ /**
 		const viewDocument = view.document;
+		const viewSelection = viewDocument.selection;
 
@@ -216,3 +217,3 @@ // Get direction of the selection.
 			target: () => {
-				const range = viewDocument.selection.getFirstRange();
+				const range = isBackward ? viewSelection.getFirstRange() : viewSelection.getLastRange();
 				const rangeRects = Rect.getDomRangeRects( view.domConverter.viewRangeToDom( range ) );
@@ -219,0 +220,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

279744

increased by6.45%

Number of package files

105

increased by5%

Lines of code

7573

increased by6.32%

Worsened metrics

Dev dependency count

22

increased by22.22%

Dependency changes

• - Removed@ckeditor/ckeditor5-ui@10.1.0(transitive)

• Updated@ckeditor/ckeditor5-core@^10.1.0

• Updated@ckeditor/ckeditor5-theme-lark@^10.1.0

• Updated@ckeditor/ckeditor5-utils@^10.1.0