Jelajahi Sumber

Merge branch 'master' into ckeditor5/t/1214

Piotrek Koszuliński 7 tahun lalu
induk
melakukan
2ad7e16707

+ 17 - 0
packages/ckeditor5-ui/CHANGELOG.md

@@ -1,6 +1,23 @@
 Changelog
 Changelog
 =========
 =========
 
 
+## [11.2.0](https://github.com/ckeditor/ckeditor5-ui/compare/v11.1.0...v11.2.0) (2018-12-05)
+
+### Features
+
+* Added the `.ck-read-only` CSS class to the `EditableUIView` when `#isReadOnly` is `true`. ([4119822](https://github.com/ckeditor/ckeditor5-ui/commit/4119822))
+* Added the optional `DropdownView#class` property to set a custom CSS class on the main element in DOM. Closes [#447](https://github.com/ckeditor/ckeditor5-ui/issues/447). ([9cdcd4a](https://github.com/ckeditor/ckeditor5-ui/commit/9cdcd4a))
+
+  Thanks to [@lucasreppewelander](https://github.com/lucasreppewelander)!
+* Implemented `LabeledInputView#infoText` to display useful hints next to the input (see [ckeditor/ckeditor5-media-embed#35](https://github.com/ckeditor/ckeditor5-media-embed/issues/35)). ([6ac03ea](https://github.com/ckeditor/ckeditor5-ui/commit/6ac03ea))
+* Implemented configurable, smart `DropdownView` panel positioning. Closes [#123](https://github.com/ckeditor/ckeditor5-ui/issues/123). ([8094f19](https://github.com/ckeditor/ckeditor5-ui/commit/8094f19))
+
+### Other changes
+
+* Improved SVG icons size. See [ckeditor/ckeditor5-theme-lark#206](https://github.com/ckeditor/ckeditor5-theme-lark/issues/206). ([ed88305](https://github.com/ckeditor/ckeditor5-ui/commit/ed88305))
+* Updated translations. ([2e409a9](https://github.com/ckeditor/ckeditor5-ui/commit/2e409a9)) ([611bd04](https://github.com/ckeditor/ckeditor5-ui/commit/611bd04)) ([c6689e4](https://github.com/ckeditor/ckeditor5-ui/commit/c6689e4)) ([07c4fdb](https://github.com/ckeditor/ckeditor5-ui/commit/07c4fdb))
+
+
 ## [11.1.0](https://github.com/ckeditor/ckeditor5-ui/compare/v11.0.0...v11.1.0) (2018-10-08)
 ## [11.1.0](https://github.com/ckeditor/ckeditor5-ui/compare/v11.0.0...v11.1.0) (2018-10-08)
 
 
 ### Features
 ### Features

+ 1 - 1
packages/ckeditor5-ui/docs/_snippets/features/blocktoolbar.js

@@ -16,7 +16,7 @@ BalloonEditor
 		plugins: BalloonEditor.builtinPlugins.concat( [ BlockToolbar, ParagraphButtonUI, HeadingButtonsUI ] ),
 		plugins: BalloonEditor.builtinPlugins.concat( [ BlockToolbar, ParagraphButtonUI, HeadingButtonsUI ] ),
 		toolbar: {
 		toolbar: {
 			items: [ 'bold', 'italic', 'link', 'undo', 'redo' ],
 			items: [ 'bold', 'italic', 'link', 'undo', 'redo' ],
-			viewportTopOffset: 100
+			viewportTopOffset: window.getViewportTopOffsetConfig()
 		},
 		},
 		blockToolbar: [
 		blockToolbar: [
 			'paragraph', 'heading1', 'heading2', 'heading3',
 			'paragraph', 'heading1', 'heading2', 'heading3',

+ 1 - 1
packages/ckeditor5-ui/docs/api/ui.md

@@ -12,7 +12,7 @@ Together with the {@link api/engine editing engine} and the {@link api/core core
 
 
 ## Documentation
 ## Documentation
 
 
-See the introduction to the {@link framework/guides/architecture/intro#ui-library UI library's architecture}.
+See the introduction to the {@link framework/guides/architecture/ui-library UI library's architecture}.
 
 
 You can also browse the API documentation of this package by using the module tree on the left.
 You can also browse the API documentation of this package by using the module tree on the left.
 
 

+ 1 - 1
packages/ckeditor5-ui/lang/translations/fr.po

@@ -15,4 +15,4 @@ msgstr "Éditeur de texte enrichi"
 
 
 msgctxt "Label of the block toolbar icon (a block toolbar is displayed next to each paragraph, heading, list item, etc. and contains e.g. block formatting options)"
 msgctxt "Label of the block toolbar icon (a block toolbar is displayed next to each paragraph, heading, list item, etc. and contains e.g. block formatting options)"
 msgid "Edit block"
 msgid "Edit block"
-msgstr ""
+msgstr "Modifier le bloc"

+ 1 - 1
packages/ckeditor5-ui/lang/translations/gl.po

@@ -15,4 +15,4 @@ msgstr "Editor de texto mellorado"
 
 
 msgctxt "Label of the block toolbar icon (a block toolbar is displayed next to each paragraph, heading, list item, etc. and contains e.g. block formatting options)"
 msgctxt "Label of the block toolbar icon (a block toolbar is displayed next to each paragraph, heading, list item, etc. and contains e.g. block formatting options)"
 msgid "Edit block"
 msgid "Edit block"
-msgstr ""
+msgstr "Editar bloque"

+ 1 - 1
packages/ckeditor5-ui/lang/translations/pl.po

@@ -15,4 +15,4 @@ msgstr "Edytor tekstu RTF"
 
 
 msgctxt "Label of the block toolbar icon (a block toolbar is displayed next to each paragraph, heading, list item, etc. and contains e.g. block formatting options)"
 msgctxt "Label of the block toolbar icon (a block toolbar is displayed next to each paragraph, heading, list item, etc. and contains e.g. block formatting options)"
 msgid "Edit block"
 msgid "Edit block"
-msgstr ""
+msgstr "Edytuj block"

+ 22 - 22
packages/ckeditor5-ui/package.json

@@ -1,6 +1,6 @@
 {
 {
   "name": "@ckeditor/ckeditor5-ui",
   "name": "@ckeditor/ckeditor5-ui",
-  "version": "11.1.0",
+  "version": "11.2.0",
   "description": "The UI framework and standard UI library of CKEditor 5.",
   "description": "The UI framework and standard UI library of CKEditor 5.",
   "keywords": [
   "keywords": [
     "ckeditor",
     "ckeditor",
@@ -9,32 +9,32 @@
     "ckeditor5-lib"
     "ckeditor5-lib"
   ],
   ],
   "dependencies": {
   "dependencies": {
-    "@ckeditor/ckeditor5-core": "^11.0.1",
-    "@ckeditor/ckeditor5-theme-lark": "^11.1.0",
-    "@ckeditor/ckeditor5-utils": "^11.0.0",
+    "@ckeditor/ckeditor5-core": "^11.1.0",
+    "@ckeditor/ckeditor5-theme-lark": "^12.0.0",
+    "@ckeditor/ckeditor5-utils": "^11.1.0",
     "lodash-es": "^4.17.10"
     "lodash-es": "^4.17.10"
   },
   },
   "devDependencies": {
   "devDependencies": {
-    "@ckeditor/ckeditor5-basic-styles": "^10.0.3",
-    "@ckeditor/ckeditor5-block-quote": "^10.1.0",
-    "@ckeditor/ckeditor5-build-balloon": "^11.1.0",
-    "@ckeditor/ckeditor5-cloud-services": "^10.1.0",
-    "@ckeditor/ckeditor5-easy-image": "^10.0.3",
-    "@ckeditor/ckeditor5-editor-balloon": "^11.0.1",
-    "@ckeditor/ckeditor5-editor-classic": "^11.0.1",
-    "@ckeditor/ckeditor5-engine": "^11.0.0",
-    "@ckeditor/ckeditor5-enter": "^10.1.2",
-    "@ckeditor/ckeditor5-essentials": "^10.1.2",
-    "@ckeditor/ckeditor5-heading": "^10.1.0",
-    "@ckeditor/ckeditor5-image": "^11.0.0",
-    "@ckeditor/ckeditor5-link": "^10.0.4",
-    "@ckeditor/ckeditor5-list": "^11.0.2",
-    "@ckeditor/ckeditor5-paragraph": "^10.0.3",
-    "@ckeditor/ckeditor5-typing": "^11.0.1",
-    "@ckeditor/ckeditor5-undo": "^10.0.3",
+    "@ckeditor/ckeditor5-basic-styles": "^10.1.0",
+    "@ckeditor/ckeditor5-block-quote": "^10.1.1",
+    "@ckeditor/ckeditor5-build-balloon": "^11.2.0",
+    "@ckeditor/ckeditor5-cloud-services": "^10.1.1",
+    "@ckeditor/ckeditor5-easy-image": "^10.0.4",
+    "@ckeditor/ckeditor5-editor-balloon": "^11.0.2",
+    "@ckeditor/ckeditor5-editor-classic": "^11.0.2",
+    "@ckeditor/ckeditor5-engine": "^12.0.0",
+    "@ckeditor/ckeditor5-enter": "^10.1.3",
+    "@ckeditor/ckeditor5-essentials": "^10.1.3",
+    "@ckeditor/ckeditor5-heading": "^10.1.1",
+    "@ckeditor/ckeditor5-image": "^12.0.0",
+    "@ckeditor/ckeditor5-link": "^10.1.0",
+    "@ckeditor/ckeditor5-list": "^11.0.3",
+    "@ckeditor/ckeditor5-paragraph": "^10.0.4",
+    "@ckeditor/ckeditor5-typing": "^11.0.2",
+    "@ckeditor/ckeditor5-undo": "^10.0.4",
     "del": "^2.2.0",
     "del": "^2.2.0",
     "eslint": "^5.5.0",
     "eslint": "^5.5.0",
-    "eslint-config-ckeditor5": "^1.0.7",
+    "eslint-config-ckeditor5": "^1.0.9",
     "husky": "^0.14.3",
     "husky": "^0.14.3",
     "lint-staged": "^7.0.0",
     "lint-staged": "^7.0.0",
     "lodash-cli": "^4"
     "lodash-cli": "^4"

+ 3 - 1
packages/ckeditor5-ui/src/editableui/editableuiview.js

@@ -39,7 +39,9 @@ export default class EditableUIView extends View {
 					'ck-content',
 					'ck-content',
 					'ck-editor__editable',
 					'ck-editor__editable',
 					'ck-rounded-corners',
 					'ck-rounded-corners',
-					bind.to( 'isFocused', value => value ? 'ck-focused' : 'ck-blurred' )
+					bind.to( 'isFocused', value => value ? 'ck-focused' : 'ck-blurred' ),
+					bind.if( 'isReadOnly', 'ck-read-only' )
+
 				],
 				],
 				contenteditable: bind.to( 'isReadOnly', value => !value ),
 				contenteditable: bind.to( 'isReadOnly', value => !value ),
 			}
 			}

+ 3 - 3
packages/ckeditor5-ui/src/panel/balloon/balloonpanelview.js

@@ -125,9 +125,9 @@ export default class BalloonPanelView extends View {
 		 * An additional CSS class added to the {@link #element}.
 		 * An additional CSS class added to the {@link #element}.
 		 *
 		 *
 		 * @observable
 		 * @observable
-		 * @member {String} #className
+		 * @member {String} #class
 		 */
 		 */
-		this.set( 'className' );
+		this.set( 'class' );
 
 
 		/**
 		/**
 		 * A callback that starts pining the panel when {@link #isVisible} gets
 		 * A callback that starts pining the panel when {@link #isVisible} gets
@@ -154,7 +154,7 @@ export default class BalloonPanelView extends View {
 					bind.to( 'position', value => `ck-balloon-panel_${ value }` ),
 					bind.to( 'position', value => `ck-balloon-panel_${ value }` ),
 					bind.if( 'isVisible', 'ck-balloon-panel_visible' ),
 					bind.if( 'isVisible', 'ck-balloon-panel_visible' ),
 					bind.if( 'withArrow', 'ck-balloon-panel_with-arrow' ),
 					bind.if( 'withArrow', 'ck-balloon-panel_with-arrow' ),
-					bind.to( 'className' )
+					bind.to( 'class' )
 				],
 				],
 
 
 				style: {
 				style: {

+ 1 - 1
packages/ckeditor5-ui/src/panel/balloon/contextualballoon.js

@@ -205,7 +205,7 @@ export default class ContextualBalloon extends Plugin {
 	 * @param {String} [data.balloonClassName=''] Additional class name which will added to the {#_balloon} view.
 	 * @param {String} [data.balloonClassName=''] Additional class name which will added to the {#_balloon} view.
 	 */
 	 */
 	_show( { view, balloonClassName = '' } ) {
 	_show( { view, balloonClassName = '' } ) {
-		this.view.className = balloonClassName;
+		this.view.class = balloonClassName;
 
 
 		this.view.content.add( view );
 		this.view.content.add( view );
 		this.view.pin( this._getBalloonPosition() );
 		this.view.pin( this._getBalloonPosition() );

+ 1 - 1
packages/ckeditor5-ui/src/toolbar/block/blocktoolbar.js

@@ -187,7 +187,7 @@ export default class BlockToolbar extends Plugin {
 		const panelView = new BalloonPanelView( editor.locale );
 		const panelView = new BalloonPanelView( editor.locale );
 
 
 		panelView.content.add( this.toolbarView );
 		panelView.content.add( this.toolbarView );
-		panelView.className = 'ck-toolbar-container';
+		panelView.class = 'ck-toolbar-container';
 		editor.ui.view.body.add( panelView );
 		editor.ui.view.body.add( panelView );
 		editor.ui.focusTracker.add( panelView.element );
 		editor.ui.focusTracker.add( panelView.element );
 
 

+ 3 - 3
packages/ckeditor5-ui/src/toolbar/toolbarview.js

@@ -68,9 +68,9 @@ export default class ToolbarView extends View {
 		 * An additional CSS class added to the {@link #element}.
 		 * An additional CSS class added to the {@link #element}.
 		 *
 		 *
 		 * @observable
 		 * @observable
-		 * @member {String} #className
+		 * @member {String} #class
 		 */
 		 */
-		this.set( 'className' );
+		this.set( 'class' );
 
 
 		/**
 		/**
 		 * Helps cycling over focusable {@link #items} in the toolbar.
 		 * Helps cycling over focusable {@link #items} in the toolbar.
@@ -99,7 +99,7 @@ export default class ToolbarView extends View {
 					'ck',
 					'ck',
 					'ck-toolbar',
 					'ck-toolbar',
 					bind.if( 'isVertical', 'ck-toolbar_vertical' ),
 					bind.if( 'isVertical', 'ck-toolbar_vertical' ),
-					bind.to( 'className' )
+					bind.to( 'class' )
 				]
 				]
 			},
 			},
 
 

+ 2 - 0
packages/ckeditor5-ui/tests/editableui/editableuiview.js

@@ -75,9 +75,11 @@ describe( 'EditableUIView', () => {
 			it( 'reacts on view#isReadOnly', () => {
 			it( 'reacts on view#isReadOnly', () => {
 				view.isReadOnly = true;
 				view.isReadOnly = true;
 				expect( view.element.hasAttribute( 'contenteditable' ) ).to.be.false;
 				expect( view.element.hasAttribute( 'contenteditable' ) ).to.be.false;
+				expect( view.element.classList.contains( 'ck-read-only' ) ).to.be.true;
 
 
 				view.isReadOnly = false;
 				view.isReadOnly = false;
 				expect( view.element.hasAttribute( 'contenteditable' ) ).to.be.true;
 				expect( view.element.hasAttribute( 'contenteditable' ) ).to.be.true;
+				expect( view.element.classList.contains( 'ck-read-only' ) ).to.be.false;
 			} );
 			} );
 		} );
 		} );
 	} );
 	} );

+ 3 - 3
packages/ckeditor5-ui/tests/panel/balloon/balloonpanelview.js

@@ -97,13 +97,13 @@ describe( 'BalloonPanelView', () => {
 			} );
 			} );
 		} );
 		} );
 
 
-		describe( 'className', () => {
+		describe( 'class', () => {
 			it( 'should set additional class to the view#element', () => {
 			it( 'should set additional class to the view#element', () => {
-				view.className = 'foo';
+				view.class = 'foo';
 
 
 				expect( view.element.classList.contains( 'foo' ) ).to.true;
 				expect( view.element.classList.contains( 'foo' ) ).to.true;
 
 
-				view.className = '';
+				view.class = '';
 
 
 				expect( view.element.classList.contains( 'foo' ) ).to.false;
 				expect( view.element.classList.contains( 'foo' ) ).to.false;
 			} );
 			} );

+ 7 - 8
packages/ckeditor5-ui/tests/panel/balloon/contextualballoon.js

@@ -10,7 +10,6 @@ import View from '../../../src/view';
 import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
 import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
-import { downcastElementToElement } from '@ckeditor/ckeditor5-engine/src/conversion/downcast-converters';
 import { setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
 import { setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
 
 
 /* global document, Event */
 /* global document, Event */
@@ -101,15 +100,15 @@ describe( 'ContextualBalloon', () => {
 				model.schema.register( 'nestedEditable', { allowIn: 'widget' } );
 				model.schema.register( 'nestedEditable', { allowIn: 'widget' } );
 				model.schema.extend( '$text', { allowIn: 'nestedEditable' } );
 				model.schema.extend( '$text', { allowIn: 'nestedEditable' } );
 
 
-				editor.conversion.for( 'downcast' ).add( downcastElementToElement( {
+				editor.conversion.for( 'downcast' ).elementToElement( {
 					model: 'widget',
 					model: 'widget',
 					view: ( modelElement, viewWriter ) => viewWriter.createContainerElement( 'figure', { contenteditable: 'false' } )
 					view: ( modelElement, viewWriter ) => viewWriter.createContainerElement( 'figure', { contenteditable: 'false' } )
-				} ) );
+				} );
 
 
-				editor.conversion.for( 'downcast' ).add( downcastElementToElement( {
+				editor.conversion.for( 'downcast' ).elementToElement( {
 					model: 'nestedEditable',
 					model: 'nestedEditable',
 					view: ( modelElement, viewWriter ) => viewWriter.createContainerElement( 'figcaption', { contenteditable: 'true' } )
 					view: ( modelElement, viewWriter ) => viewWriter.createContainerElement( 'figcaption', { contenteditable: 'true' } )
-				} ) );
+				} );
 
 
 				setModelData( model, '<widget><nestedEditable>[]foo</nestedEditable></widget>' );
 				setModelData( model, '<widget><nestedEditable>[]foo</nestedEditable></widget>' );
 
 
@@ -287,7 +286,7 @@ describe( 'ContextualBalloon', () => {
 				balloonClassName: 'foo'
 				balloonClassName: 'foo'
 			} );
 			} );
 
 
-			expect( balloon.view.className ).to.equal( 'foo' );
+			expect( balloon.view.class ).to.equal( 'foo' );
 
 
 			balloon.add( {
 			balloon.add( {
 				view: viewB,
 				view: viewB,
@@ -298,7 +297,7 @@ describe( 'ContextualBalloon', () => {
 				balloonClassName: 'bar'
 				balloonClassName: 'bar'
 			} );
 			} );
 
 
-			expect( balloon.view.className ).to.equal( 'bar' );
+			expect( balloon.view.class ).to.equal( 'bar' );
 		} );
 		} );
 	} );
 	} );
 
 
@@ -392,7 +391,7 @@ describe( 'ContextualBalloon', () => {
 
 
 			balloon.remove( viewB );
 			balloon.remove( viewB );
 
 
-			expect( balloon.view.className ).to.equal( 'foo' );
+			expect( balloon.view.class ).to.equal( 'foo' );
 		} );
 		} );
 	} );
 	} );
 
 

+ 1 - 1
packages/ckeditor5-ui/tests/toolbar/block/blocktoolbar.js

@@ -58,7 +58,7 @@ describe( 'BlockToolbar', () => {
 			} );
 			} );
 
 
 			it( 'should have an additional class name', () => {
 			it( 'should have an additional class name', () => {
-				expect( blockToolbar.panelView.className ).to.equal( 'ck-toolbar-container' );
+				expect( blockToolbar.panelView.class ).to.equal( 'ck-toolbar-container' );
 			} );
 			} );
 
 
 			it( 'should be added to the ui.view.body collection', () => {
 			it( 'should be added to the ui.view.body collection', () => {

+ 4 - 4
packages/ckeditor5-ui/tests/toolbar/toolbarview.js

@@ -85,14 +85,14 @@ describe( 'ToolbarView', () => {
 				expect( view.element.classList.contains( 'ck-toolbar_vertical' ) ).to.be.true;
 				expect( view.element.classList.contains( 'ck-toolbar_vertical' ) ).to.be.true;
 			} );
 			} );
 
 
-			it( 'reacts on view#className', () => {
-				view.className = 'foo';
+			it( 'reacts on view#class', () => {
+				view.class = 'foo';
 				expect( view.element.classList.contains( 'foo' ) ).to.be.true;
 				expect( view.element.classList.contains( 'foo' ) ).to.be.true;
 
 
-				view.className = 'bar';
+				view.class = 'bar';
 				expect( view.element.classList.contains( 'bar' ) ).to.be.true;
 				expect( view.element.classList.contains( 'bar' ) ).to.be.true;
 
 
-				view.className = false;
+				view.class = false;
 				expect( view.element.classList.contains( 'foo' ) ).to.be.false;
 				expect( view.element.classList.contains( 'foo' ) ).to.be.false;
 				expect( view.element.classList.contains( 'bar' ) ).to.be.false;
 				expect( view.element.classList.contains( 'bar' ) ).to.be.false;
 			} );
 			} );

+ 1 - 1
packages/ckeditor5-ui/theme/icons/dropdown-arrow.svg

@@ -1 +1 @@
-<svg width="10" height="10" viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg"><path d="M.941 4.523a.75.75 0 1 1 1.06-1.06l3.006 3.005 3.005-3.005a.75.75 0 1 1 1.06 1.06l-3.549 3.55a.75.75 0 0 1-1.168-.136L.941 4.523z" fill="#000" fill-rule="evenodd"/></svg>
+<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg"><path d="M.941 4.523a.75.75 0 1 1 1.06-1.06l3.006 3.005 3.005-3.005a.75.75 0 1 1 1.06 1.06l-3.549 3.55a.75.75 0 0 1-1.168-.136L.941 4.523z"/></svg>