Forráskód Böngészése

Merge branch 'master' into t/ckeditor5/416b

Aleksander Nowodzinski 6 éve
szülő
commit
5ecff50c99
100 módosított fájl, 2752 hozzáadás és 553 törlés
  1. 2 2
      packages/ckeditor5-ui/.eslintrc.js
  2. 11 13
      packages/ckeditor5-ui/.travis.yml
  3. 87 0
      packages/ckeditor5-ui/CHANGELOG.md
  4. 1 1
      packages/ckeditor5-ui/CONTRIBUTING.md
  5. 1 1
      packages/ckeditor5-ui/LICENSE.md
  6. 1 2
      packages/ckeditor5-ui/README.md
  7. 1 1
      packages/ckeditor5-ui/docs/_snippets/examples/bootstrap-ui-inner.html
  8. 57 51
      packages/ckeditor5-ui/docs/_snippets/examples/bootstrap-ui-inner.js
  9. 2 2
      packages/ckeditor5-ui/docs/_snippets/examples/bootstrap-ui.js
  10. 3 3
      packages/ckeditor5-ui/docs/_snippets/features/blocktoolbar.js
  11. 1 1
      packages/ckeditor5-ui/docs/api/ui.md
  12. 2 1
      packages/ckeditor5-ui/docs/examples/custom-ui.md
  13. 2 2
      packages/ckeditor5-ui/docs/features/blocktoolbar.md
  14. 54 46
      packages/ckeditor5-ui/docs/framework/guides/external-ui.md
  15. 4 1
      packages/ckeditor5-ui/lang/contexts.json
  16. 24 1
      packages/ckeditor5-ui/lang/translations/ar.po
  17. 24 1
      packages/ckeditor5-ui/lang/translations/ast.po
  18. 41 0
      packages/ckeditor5-ui/lang/translations/az.po
  19. 24 1
      packages/ckeditor5-ui/lang/translations/cs.po
  20. 24 1
      packages/ckeditor5-ui/lang/translations/da.po
  21. 24 1
      packages/ckeditor5-ui/lang/translations/de-ch.po
  22. 24 1
      packages/ckeditor5-ui/lang/translations/de.po
  23. 24 1
      packages/ckeditor5-ui/lang/translations/el.po
  24. 25 2
      packages/ckeditor5-ui/lang/translations/en-au.po
  25. 24 1
      packages/ckeditor5-ui/lang/translations/en.po
  26. 24 1
      packages/ckeditor5-ui/lang/translations/eo.po
  27. 25 2
      packages/ckeditor5-ui/lang/translations/es.po
  28. 25 2
      packages/ckeditor5-ui/lang/translations/et.po
  29. 24 1
      packages/ckeditor5-ui/lang/translations/eu.po
  30. 24 1
      packages/ckeditor5-ui/lang/translations/fa.po
  31. 24 1
      packages/ckeditor5-ui/lang/translations/fi.po
  32. 25 2
      packages/ckeditor5-ui/lang/translations/fr.po
  33. 25 2
      packages/ckeditor5-ui/lang/translations/gl.po
  34. 26 3
      packages/ckeditor5-ui/lang/translations/he.po
  35. 24 1
      packages/ckeditor5-ui/lang/translations/hr.po
  36. 24 1
      packages/ckeditor5-ui/lang/translations/hu.po
  37. 41 0
      packages/ckeditor5-ui/lang/translations/id.po
  38. 27 4
      packages/ckeditor5-ui/lang/translations/it.po
  39. 24 1
      packages/ckeditor5-ui/lang/translations/ja.po
  40. 24 1
      packages/ckeditor5-ui/lang/translations/km.po
  41. 24 1
      packages/ckeditor5-ui/lang/translations/kn.po
  42. 25 2
      packages/ckeditor5-ui/lang/translations/ku.po
  43. 41 0
      packages/ckeditor5-ui/lang/translations/lt.po
  44. 24 1
      packages/ckeditor5-ui/lang/translations/nb.po
  45. 25 2
      packages/ckeditor5-ui/lang/translations/ne.po
  46. 24 1
      packages/ckeditor5-ui/lang/translations/nl.po
  47. 25 2
      packages/ckeditor5-ui/lang/translations/no.po
  48. 27 4
      packages/ckeditor5-ui/lang/translations/pl.po
  49. 25 2
      packages/ckeditor5-ui/lang/translations/pt-br.po
  50. 24 1
      packages/ckeditor5-ui/lang/translations/pt.po
  51. 24 1
      packages/ckeditor5-ui/lang/translations/ro.po
  52. 24 1
      packages/ckeditor5-ui/lang/translations/ru.po
  53. 24 1
      packages/ckeditor5-ui/lang/translations/sk.po
  54. 24 1
      packages/ckeditor5-ui/lang/translations/sq.po
  55. 41 0
      packages/ckeditor5-ui/lang/translations/sr-latn.po
  56. 41 0
      packages/ckeditor5-ui/lang/translations/sr.po
  57. 24 1
      packages/ckeditor5-ui/lang/translations/sv.po
  58. 25 2
      packages/ckeditor5-ui/lang/translations/tr.po
  59. 24 1
      packages/ckeditor5-ui/lang/translations/ug.po
  60. 25 2
      packages/ckeditor5-ui/lang/translations/uk.po
  61. 25 2
      packages/ckeditor5-ui/lang/translations/zh-cn.po
  62. 25 2
      packages/ckeditor5-ui/lang/translations/zh.po
  63. 30 32
      packages/ckeditor5-ui/package.json
  64. 2 2
      packages/ckeditor5-ui/src/bindings/clickoutsidehandler.js
  65. 2 2
      packages/ckeditor5-ui/src/bindings/preventdefault.js
  66. 2 2
      packages/ckeditor5-ui/src/bindings/submithandler.js
  67. 2 2
      packages/ckeditor5-ui/src/button/button.jsdoc
  68. 2 2
      packages/ckeditor5-ui/src/button/buttonview.js
  69. 3 3
      packages/ckeditor5-ui/src/button/switchbuttonview.js
  70. 195 0
      packages/ckeditor5-ui/src/colorgrid/colorgridview.js
  71. 63 0
      packages/ckeditor5-ui/src/colorgrid/colortileview.js
  72. 8 4
      packages/ckeditor5-ui/src/componentfactory.js
  73. 2 2
      packages/ckeditor5-ui/src/dropdown/button/dropdownbutton.jsdoc
  74. 2 2
      packages/ckeditor5-ui/src/dropdown/button/dropdownbuttonview.js
  75. 2 2
      packages/ckeditor5-ui/src/dropdown/button/splitbuttonview.js
  76. 2 2
      packages/ckeditor5-ui/src/dropdown/dropdownpanelfocusable.jsdoc
  77. 2 2
      packages/ckeditor5-ui/src/dropdown/dropdownpanelview.js
  78. 2 2
      packages/ckeditor5-ui/src/dropdown/dropdownview.js
  79. 2 2
      packages/ckeditor5-ui/src/dropdown/utils.js
  80. 79 29
      packages/ckeditor5-ui/src/editableui/editableuiview.js
  81. 21 20
      packages/ckeditor5-ui/src/editableui/inline/inlineeditableuiview.js
  82. 2 2
      packages/ckeditor5-ui/src/editorui/boxed/boxededitoruiview.js
  83. 2 2
      packages/ckeditor5-ui/src/editorui/editoruiview.js
  84. 2 2
      packages/ckeditor5-ui/src/focuscycler.js
  85. 2 2
      packages/ckeditor5-ui/src/icon/iconview.js
  86. 13 2
      packages/ckeditor5-ui/src/iframe/iframeview.js
  87. 5 5
      packages/ckeditor5-ui/src/inputtext/inputtextview.js
  88. 2 2
      packages/ckeditor5-ui/src/label/labelview.js
  89. 59 22
      packages/ckeditor5-ui/src/labeledinput/labeledinputview.js
  90. 2 2
      packages/ckeditor5-ui/src/list/listitemview.js
  91. 2 2
      packages/ckeditor5-ui/src/list/listseparatorview.js
  92. 2 2
      packages/ckeditor5-ui/src/list/listview.js
  93. 2 2
      packages/ckeditor5-ui/src/model.js
  94. 69 66
      packages/ckeditor5-ui/src/notification/notification.js
  95. 28 22
      packages/ckeditor5-ui/src/panel/balloon/balloonpanelview.js
  96. 627 85
      packages/ckeditor5-ui/src/panel/balloon/contextualballoon.js
  97. 2 2
      packages/ckeditor5-ui/src/panel/sticky/stickypanelview.js
  98. 33 21
      packages/ckeditor5-ui/src/template.js
  99. 10 7
      packages/ckeditor5-ui/src/toolbar/balloon/balloontoolbar.js
  100. 2 1
      packages/ckeditor5-ui/src/toolbar/block/blockbuttonview.js

+ 2 - 2
packages/ckeditor5-ui/.eslintrc.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* eslint-env node */

+ 11 - 13
packages/ckeditor5-ui/.travis.yml

@@ -1,33 +1,31 @@
 sudo: required
 dist: trusty
 addons:
+  chrome: stable
   firefox: latest
-  apt:
-    sources:
-    - google-chrome
-    packages:
-    - google-chrome-stable
 language: node_js
 node_js:
 - '8'
 cache:
-- node_modules
+  yarn: true
 branches:
-   except:
-   - stable
+  except:
+  - stable
 before_install:
+- export START_TIME=$( date +%s )
 - export DISPLAY=:99.0
 - sh -e /etc/init.d/xvfb start
-- npm config set package-lock false
-- npm i -g npm@^5.7.1
+- npm i -g yarn
 install:
-- npm install @ckeditor/ckeditor5-dev-tests
+- yarn add @ckeditor/ckeditor5-dev-tests
 - ckeditor5-dev-tests-install-dependencies
 script:
 - ckeditor5-dev-tests-travis
 after_success:
 - ckeditor5-dev-tests-save-revision
+after_script:
+- export END_TIME=$( date +%s )
+- ckeditor5-dev-tests-notify-travis-status
 env:
   global:
-  - secure: W6VrPcKacfXYH/P5qjowRpGcq8UHwBpKIub7Tfj7pGaTfQHrUMbPb4jHJLQYd335eiIyVWzmwatYhRJwB5wtaPkfcByCqRqwXQsl3nkmEZYclQdhUgjhCJEPQlu93XNWkaITQnXaJzlJ5etzgyQBKVh+bmaTITCOli5rdLqO7Pge00boTDRevLZ+T6Fw4iNVwSPAwLpbgYfR7pujqPu6kulDrMSOKWcaMImuEGq9Bvps2LieF9KzvoNBCgoleZd+tFFtTvyQ1eE/UeTFQD8GXdKs7fSjj3evuyAm9FWqMBL+zT1EDJoTy4WljLJPwt6JRMazFSp9+j/0KNPuzksLTduGKAxjcc5OzbLxV3Ckh3A//szazAkgrJlK9BNYVLqj9lBns0nL2QbcyR8bY1w8mKVKIXVoCMAxuPWBYbEKKdODDUQXGbz/4wKxx2Ar0boo27v2ewBzo6BmwQYt7X4oTQTfkP7rpUHorKS9ztjHR0FiBAqLN4TQ0nCVqE93ajoGt5o9NO/ZTQbggMptym4JCkJle17K16kNPB96gkQkCIoa20n7/okkNclTl6g9NdD3oeWQMXz4S5Jx8lc3I/9kK5JqZL8KCTFZ//9UNuf6xaSf8g52usl+Kyv+A12u34SJ06n0KvmoA5aQfFHs4rioKL20e7RSI3edZqwp+THGTuk=
-  - secure: O0yOs6WG5YnrBbx7qyeG7sXsZW5pJN0ZvF/sZgHLWEZ4UYIxAGyW1FkM2v0nUroNo18v2X8IDaTOuSxBRXlJUlG8nPElHTIh/pJcVIXzDuVEW1sO4cQcqlUNAgIAK9g9y4aWBH0JXhSFeg1FwRP5Jjp73t9th7tMTjW3/qqOl+1rAjj6zXC+DAQEt8551ue2NZC5OEuIoPtfk57FBe1oAWyRSJIHNR5dj10E9JXlrdVJzcCFF25ikYQbhjl3RpIiFAdaKKK68GyPpx5hkb0rBDHyHcIYSanFZSY2cAKkhdKrjFqWN97scQEK3NtLepOt6cKtH69KG0mYgyKvkIQgoyXo9RDW3NUEO4mQwd2ADOBRwvda5ekFdaQtCr1Dznuw+wrNeHAg/uI/qBBJYJ3ZuZFcD5DTg/zbPtOQzZb/LuhJuOYMVBvQyG4X6IUfbK3yLooo8gZjVWoxyb4u9S/fe55gArzFE5aWbjBDdTNw5qVDu2qd21yd9B6ol6QupT+aCRoKBtgUEU1VeUWdVs+RkLdi+f+kJ11FPA/RwG4D6EBgTd4c1JRHkUxSQNVvkPM7lb/x+IoHtOakjQTVUE/C459KigW+kD4iMlUPrFHND0tC34K2E67wWV1O7KfStD84NqgFwX5V/48EUSrqyePpMegOIet6D36JXRh+NssU5rU=
+  - secure: rU6Tu6fffAXbs3vEbJIa9MN5foP02BiEC5iFWvVI9qEyOhHsDq69n6v3/qco579L/bvNZw60eB59oFFIlKsH1NqVsNipXppuC8ez4nwGG+3dPx1pr/VAZwoFYrodSIkbdcbf4yM783yEVE0eQBr8S/w2efqXutjxc7wzjk+Jg3aITIsSekbEfq+8Cs/bD3/0qCwOa9C3Vd9Sjn+TA+Lahkt/gbofKHrE1teFiR38R/E2I+q7pqyLIy0ZSCQnjYYcThc74q0tbiNExbouWMUOUaCPBo3FLG9o1aO0oPerMsinY5USvkWMuEdKzlzsFyfCYgwsYgHxA4Xzd9+E/hNNin7EBenRIaKIzMytYmo+SsS1YAj83n84j3eGPwmjiDfkWegY7o8PaOvP7D9cYUwMFp9gLMvFNGXNF2cHvZ2HBHle+Gr/beIGE72jYIJGntq9R+/8lqddekTIw18qPBsInrklFfGxSN60AZikhd9reqrxss8fVai6U6Yq8WgCXWx5Z54onG+FtJimcwDBxqTgu6wxpRl3B/v9L51WIYzbPmMXObAY/s5S7E9o/gw1qsP8cBxQ7UxElq/Tm4C52sopkJrTdUiADPhBq4ZrAdb075RWS2kA4YldnRCvyQPTfd4PWJfedD+qJFIVBfSoxCZIxohBP2J/y2INnFZEGXjE9wI=

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

@@ -1,6 +1,93 @@
 Changelog
 =========
 
+## [13.0.2](https://github.com/ckeditor/ckeditor5-ui/compare/v13.0.1...v13.0.2) (2019-07-10)
+
+### Other changes
+
+* Updated translations. ([ad189b6](https://github.com/ckeditor/ckeditor5-ui/commit/ad189b6)) 
+
+
+## [13.0.1](https://github.com/ckeditor/ckeditor5-ui/compare/v13.0.0...v13.0.1) (2019-07-04)
+
+### Other changes
+
+* Updated translations. ([1964cc0](https://github.com/ckeditor/ckeditor5-ui/commit/1964cc0)) ([11cfd41](https://github.com/ckeditor/ckeditor5-ui/commit/11cfd41))
+
+
+## [13.0.0](https://github.com/ckeditor/ckeditor5-ui/compare/v12.1.0...v13.0.0) (2019-06-05)
+
+### Features
+
+* Implemented the single view mode for the `ContextualBalloon` plugin. See https://github.com/ckeditor/ckeditor5-mention/issues/74. ([c000c93](https://github.com/ckeditor/ckeditor5-ui/commit/c000c93))
+* Introduced rotatable panels for `ContextualBalloon`. Closes https://github.com/ckeditor/ckeditor5-ui/issues/491. ([581d8f7](https://github.com/ckeditor/ckeditor5-ui/commit/581d8f7))
+
+### Other changes
+
+* Renamed a misspelled `InputTextViewariaDesribedById` property to `InputTextView#ariaDescribedById`. Closes [#483](https://github.com/ckeditor/ckeditor5-ui/issues/483). ([2288bf3](https://github.com/ckeditor/ckeditor5-ui/commit/2288bf3))
+* The `_rwd.css` mixin was moved to this package from `@ckeditor/ckeditor5-theme-lark`. See [ckeditor/ckeditor5#1662](https://github.com/ckeditor/ckeditor5/issues/1662). ([96e3a3c](https://github.com/ckeditor/ckeditor5-ui/commit/96e3a3c))
+* The `ContextualBalloon#add()` method should accept the `withArrow` option. Closes [#487](https://github.com/ckeditor/ckeditor5-ui/issues/487). ([0e7f670](https://github.com/ckeditor/ckeditor5-ui/commit/0e7f670))
+* Updated translations. ([4699d8b](https://github.com/ckeditor/ckeditor5-ui/commit/4699d8b)) ([d4c5714](https://github.com/ckeditor/ckeditor5-ui/commit/d4c5714))
+
+### BREAKING CHANGES
+
+* The (misspelled) `InputTextView#ariaDesribedById` property is no longer available. Use `ariaDescribedById` instead.
+
+
+## [12.1.0](https://github.com/ckeditor/ckeditor5-ui/compare/v12.0.0...v12.1.0) (2019-04-10)
+
+### Features
+
+* Implemented `ColorGridView` and `ColorTileView` components. See [ckeditor/ckeditor5#1457](https://github.com/ckeditor/ckeditor5/issues/1457). ([6be52b4](https://github.com/ckeditor/ckeditor5-ui/commit/6be52b4))
+
+### Bug fixes
+
+* Fixed `View#render` collision when moving focus from a one editable to the other in multi-root editor. Closes https://github.com/ckeditor/ckeditor5/issues/1676. ([17e86f9](https://github.com/ckeditor/ckeditor5-ui/commit/17e86f9))
+
+### Other changes
+
+* Optimized icons. ([5325ea8](https://github.com/ckeditor/ckeditor5-ui/commit/5325ea8))
+* Updated translations. ([dcdca2e](https://github.com/ckeditor/ckeditor5-ui/commit/dcdca2e))
+
+
+## [12.0.0](https://github.com/ckeditor/ckeditor5-ui/compare/v11.2.0...v12.0.0) (2019-02-28)
+
+### Bug fixes
+
+* Prevented from changing the view document during the render phase. Closes https://github.com/ckeditor/ckeditor5/issues/1530. ([7cf835e](https://github.com/ckeditor/ckeditor5-ui/commit/7cf835e))
+* Fixed memory leaks during editor initialization and destruction (see [ckeditor/ckeditor5#1341](https://github.com/ckeditor/ckeditor5/issues/1341)). ([fd18fb9](https://github.com/ckeditor/ckeditor5-ui/commit/fd18fb9))
+
+### Other changes
+
+* The `class` property should control the DOM class attribute in all UI components. Closes [#450](https://github.com/ckeditor/ckeditor5-ui/issues/450). ([b9b68c6](https://github.com/ckeditor/ckeditor5-ui/commit/b9b68c6))
+* Updated translations. ([b9caee9](https://github.com/ckeditor/ckeditor5-ui/commit/b9caee9)) ([a3afaaa](https://github.com/ckeditor/ckeditor5-ui/commit/a3afaaa)) ([909e676](https://github.com/ckeditor/ckeditor5-ui/commit/909e676))
+
+### BREAKING CHANGES
+
+* Upgraded minimal versions of Node to `8.0.0` and npm to `5.7.1`. See: [ckeditor/ckeditor5#1507](https://github.com/ckeditor/ckeditor5/issues/1507). ([612ea3c](https://github.com/ckeditor/ckeditor5-cloud-services/commit/612ea3c))
+* The `BallonPanelView#className` property was renamed to `#class`.
+* The `ToolbarView#className` property was renamed to `#class`.
+* The `EditableUIView#externalElement` property (which held the element on which the editor was created if it was explicitly passed) was removed.
+* The `EditorUIView#editableElement` property was made private. Use `editor.ui.getEditableElement()` method instead.
+
+
+## [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)
 
 ### Features

+ 1 - 1
packages/ckeditor5-ui/CONTRIBUTING.md

@@ -1,4 +1,4 @@
 Contributing
 ========================================
 
-Information about contributing can be found at the following page: <https://github.com/ckeditor/ckeditor5/blob/master/CONTRIBUTING.md>.
+See the [official contributors' guide to CKEditor 5](https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html) to learn more.

+ 1 - 1
packages/ckeditor5-ui/LICENSE.md

@@ -2,7 +2,7 @@ Software License Agreement
 ==========================
 
 **CKEditor 5 UI Framework** – https://github.com/ckeditor/ckeditor5-ui <br>
-Copyright (c) 2003-2018, [CKSource](http://cksource.com) Frederico Knabben. All rights reserved.
+Copyright (c) 2003-2019, [CKSource](http://cksource.com) Frederico Knabben. All rights reserved.
 
 Licensed under the terms of [GNU General Public License Version 2 or later](http://www.gnu.org/licenses/gpl.html).
 

+ 1 - 2
packages/ckeditor5-ui/README.md

@@ -4,7 +4,6 @@ CKEditor 5 UI framework
 [![Join the chat at https://gitter.im/ckeditor/ckeditor5](https://badges.gitter.im/ckeditor/ckeditor5.svg)](https://gitter.im/ckeditor/ckeditor5?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
 [![npm version](https://badge.fury.io/js/%40ckeditor%2Fckeditor5-ui.svg)](https://www.npmjs.com/package/@ckeditor/ckeditor5-ui)
 [![Build Status](https://travis-ci.org/ckeditor/ckeditor5-ui.svg?branch=master)](https://travis-ci.org/ckeditor/ckeditor5-ui)
-[![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)
 <br>
 [![Dependency Status](https://david-dm.org/ckeditor/ckeditor5-ui/status.svg)](https://david-dm.org/ckeditor/ckeditor5-ui)
@@ -18,4 +17,4 @@ See the [`@ckeditor/ckeditor5-ui` package](https://ckeditor.com/docs/ckeditor5/l
 
 ## License
 
-Licensed under the terms of [GNU General Public License Version 2 or later](http://www.gnu.org/licenses/gpl.html). For full details about the license, please check the `LICENSE.md` file.
+Licensed under the terms of [GNU General Public License Version 2 or later](http://www.gnu.org/licenses/gpl.html). For full details about the license, please check the `LICENSE.md` file or [https://ckeditor.com/legal/ckeditor-oss-license](https://ckeditor.com/legal/ckeditor-oss-license).

+ 1 - 1
packages/ckeditor5-ui/docs/_snippets/examples/bootstrap-ui-inner.html

@@ -71,7 +71,7 @@
 			}
 
 			/* When in read–only mode, the editable should fade out. */
-			.ck-editor .ck-editor__editable:not([contenteditable]) {
+			.ck-editor .ck-editor__editable.ck-read-only {
 				background: #fafafa;
 				color: hsl(0, 0%, 47%);
 			}

+ 57 - 51
packages/ckeditor5-ui/docs/_snippets/examples/bootstrap-ui-inner.js

@@ -1,15 +1,14 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals $, window, console:false */
 
 // Basic classes to create an editor.
 import Editor from '@ckeditor/ckeditor5-core/src/editor/editor';
+import EditorUI from '@ckeditor/ckeditor5-core/src/editor/editorui';
 import EditorUIView from '@ckeditor/ckeditor5-ui/src/editorui/editoruiview';
-import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
-import ComponentFactory from '@ckeditor/ckeditor5-ui/src/componentfactory';
 import InlineEditableUIView from '@ckeditor/ckeditor5-ui/src/editableui/inline/inlineeditableuiview';
 import HtmlDataProcessor from '@ckeditor/ckeditor5-engine/src/dataprocessor/htmldataprocessor';
 import ElementReplacer from '@ckeditor/ckeditor5-utils/src/elementreplacer';
@@ -64,22 +63,12 @@ export default class BootstrapEditor extends Editor {
 		// When editor#element is a textarea inside a form element
 		// then content of this textarea will be updated on form submit.
 		attachToForm( this );
-
-		// A helper to easily replace the editor#element with editor.editable#element.
-		this._elementReplacer = new ElementReplacer();
-	}
-
-	get element() {
-		return this.ui.view.element;
 	}
 
 	destroy() {
 		// When destroyed, editor sets the output of editor#getData() into editor#element...
 		this.updateSourceElement();
 
-		// ...and restores the original editor#element...
-		this._elementReplacer.restore();
-
 		// ...and destroys the UI.
 		this.ui.destroy();
 
@@ -89,29 +78,15 @@ export default class BootstrapEditor extends Editor {
 	static create( element, config ) {
 		return new Promise( resolve => {
 			const editor = new this( element, config );
-			const editable = editor.ui.view.editable;
 
 			resolve(
 				editor.initPlugins()
-					.then( () => {
-						// Initialize the UI first. See the BootstrapEditorUI class to learn more.
-						editor.ui.init();
-
-						// Replace the editor#element with editor.editable#element.
-						editor._elementReplacer.replace( element, editable.element );
-
-						// Tell the world that the UI of the editor is ready to use.
-						editor.fire( 'uiReady' );
-					} )
-					// Bind the editor editing layer to the editable in DOM.
-					.then( () => editor.editing.view.attachDomRoot( editable.element ) )
+					// Initialize the UI first. See the BootstrapEditorUI class to learn more.
+					.then( () => editor.ui.init( element ) )
 					// Fill the editable with the initial data.
 					.then( () => editor.data.init( getDataFromElement( element ) ) )
-					// Fire the events that announce that the editor is complete and ready to use.
-					.then( () => {
-						editor.fire( 'dataReady' );
-						editor.fire( 'ready' );
-					} )
+					// Fire the `editor#ready` event that announce the editor is complete and ready to use.
+					.then( () => editor.fire( 'ready' ) )
 					.then( () => editor )
 			);
 		} );
@@ -123,18 +98,21 @@ mix( BootstrapEditor, DataApiMixin );
 mix( BootstrapEditor, ElementApiMixin );
 
 // The class organizing the UI of the editor, binding it with existing Bootstrap elements in DOM.
-class BootstrapEditorUI {
+class BootstrapEditorUI extends EditorUI {
 	constructor( editor ) {
-		this.editor = editor;
+		super( editor );
+
+		// A helper to easily replace the editor#element with editor.editable#element.
+		this._elementReplacer = new ElementReplacer();
 
 		// The global UI view of the editor. It aggregates various Bootstrap DOM elements.
-		const view = this.view = new EditorUIView( editor.locale );
+		const view = this._view = new EditorUIView( editor.locale );
 
-		// This is the main editor element in DOM.
+		// This is the main editor element in the DOM.
 		view.element = $( '.ck-editor' );
 
-		// This is the editable view in DOM. It will replace the data container in DOM.
-		view.editable = new InlineEditableUIView( editor.locale );
+		// This is the editable view in the DOM. It will replace the data container in the DOM.
+		view.editable = new InlineEditableUIView( editor.locale, editor.editing.view );
 
 		// References to the dropdown elements for further usage. See #_setupBootstrapHeadingDropdown.
 		view.dropdownMenu = view.element.find( '.dropdown-menu' );
@@ -144,38 +122,66 @@ class BootstrapEditorUI {
 		view.toolbarButtons = {};
 
 		[ 'bold', 'italic', 'underline', 'undo', 'redo' ].forEach( name => {
-			// Retrieve the jQuery object corresponding with the button in DOM.
+			// Retrieve the jQuery object corresponding with the button in the DOM.
 			view.toolbarButtons[ name ] = view.element.find( `#${ name }` );
 		} );
+	}
 
-		// Mandatory EditorUI interface components.
-		this.componentFactory = new ComponentFactory( editor );
-		this.focusTracker = new FocusTracker();
+	// All EditorUI subclasses should expose their view instance
+	// so other UI classes can access it if necessary.
+	get view() {
+		return this._view;
 	}
 
-	init() {
+	init( replacementElement ) {
 		const editor = this.editor;
 		const view = this.view;
-
-		// Render the editable component in DOM first.
-		view.editable.render();
+		const editingView = editor.editing.view;
 
 		// Create an editing root in the editing layer. It will correspond with the
 		// document root created in the constructor().
-		const editingRoot = editor.editing.view.document.getRoot();
+		const editingRoot = editingView.document.getRoot();
 
-		// Bind the basic attributes of the editable in DOM with the editing layer.
-		view.editable.bind( 'isReadOnly' ).to( editingRoot );
-		view.editable.bind( 'isFocused' ).to( editor.editing.view.document );
+		// The editable UI and editing root should share the same name.
 		view.editable.name = editingRoot.rootName;
 
+		// Render the editable component in the DOM first.
+		view.editable.render();
+
+		const editableElement = view.editable.element;
+
+		// Register editable element so it is available via getEditableElement() method.
+		this.setEditableElement( view.editable.name, editableElement );
+
+		// Let the editable UI element respond to the changes in the global editor focus tracker
+		// and let the focus tracker know about the editable element.
+		this.focusTracker.add( editableElement );
+		view.editable.bind( 'isFocused' ).to( this.focusTracker );
+
+		// Bind the editable UI element to the editing view, making it an end– and entry–point
+		// of the editor's engine. This is where the engine meets the UI.
+		editingView.attachDomRoot( editableElement );
+
 		// Setup the existing, external Bootstrap UI so it works with the rest of the editor.
 		this._setupBootstrapToolbarButtons();
 		this._setupBootstrapHeadingDropdown();
+
+		// Replace the editor#element with editor.editable#element.
+		this._elementReplacer.replace( replacementElement, editableElement );
+
+		// Tell the world that the UI of the editor is ready to use.
+		this.fire( 'ready' );
 	}
 
 	destroy() {
-		this.view.editable.destroy();
+		// Restore the original editor#element.
+		this._elementReplacer.restore();
+
+		// Destroy the view.
+		this._view.editable.destroy();
+		this._view.destroy();
+
+		super.destroy();
 	}
 
 	// This method activates Bold, Italic, Underline, Undo and Redo buttons in the toolbar.

+ 2 - 2
packages/ckeditor5-ui/docs/_snippets/examples/bootstrap-ui.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* config { "dependencies": [ "examples/bootstrap-ui-inner" ] } */

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

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* globals console, window, document */
@@ -16,7 +16,7 @@ BalloonEditor
 		plugins: BalloonEditor.builtinPlugins.concat( [ BlockToolbar, ParagraphButtonUI, HeadingButtonsUI ] ),
 		toolbar: {
 			items: [ 'bold', 'italic', 'link', 'undo', 'redo' ],
-			viewportTopOffset: 60
+			viewportTopOffset: window.getViewportTopOffsetConfig()
 		},
 		blockToolbar: [
 			'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
 
-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.
 

+ 2 - 1
packages/ckeditor5-ui/docs/examples/custom-ui.md

@@ -1,9 +1,10 @@
 ---
-title: Custom UI (with Bootstrap)
 category: examples-framework
 order: 20
 ---
 
+# Custom UI (with Bootstrap)
+
 The editor below runs a completely custom user interface written in [Bootstrap](http://getbootstrap.com/), while the editing is provided by CKEditor 5. To learn more, check out the {@link framework/guides/external-ui detailed guide} on how to integrate an external UI with the editor.
 
 {@snippet examples/bootstrap-ui}

+ 2 - 2
packages/ckeditor5-ui/docs/features/blocktoolbar.md

@@ -5,12 +5,12 @@ category: features
 
 The {@link module:ui/toolbar/block/blocktoolbar~BlockToolbar} plugin provides an additional [configurable](#configuration) toolbar on the left-hand side of the content area (the gutter). The toolbar is represented by a button with a pilcrow (or a paragraph mark &mdash; &#182;). It is positioned next to the block element that the selection is anchored to (e.g. a paragraph), following the caret as the user edits the content and navigates the document.
 
-The block toolbar comes in handy when the main editor toolbar cannot be accessed. It complements the {@link builds/guides/overview#balloon-editor Balloon editor} when it falls short, for example when some content must be inserted (like an image) but the selection is collapsed, leaving the user unable to access the toolbar.
+The block toolbar comes in handy when the main editor toolbar cannot be accessed. It complements the {@link builds/guides/overview#balloon-editor Balloon editor} when it falls short, for example when some content must be inserted (like an image) but the selection is collapsed, leaving the user unable to access the toolbar. You can read more about it in the {@link builds/guides/overview#balloon-block-editor balloon block editor overview}.
 
 ## Example
 
 <info-box hint>
-	Move the caret around the content with the balloon editor below to see the block toolbar button following the selection. Click the button (&#182;) to use the toolbar, for example to create a header or insert an image.
+	Move the caret around the content with the balloon editor below to see the block toolbar button following the selection. Click the button (&#182;) to use the toolbar, for example, to create a header or insert an image. See the {@link examples/builds/balloon-block-editor balloon block editor example} page, too.
 </info-box>
 
 {@snippet features/blocktoolbar}

+ 54 - 46
packages/ckeditor5-ui/docs/framework/guides/external-ui.md

@@ -18,6 +18,7 @@ The ready–to–use builds of CKEditor like {@link examples/builds/classic-edit
 ```js
 // Basic classes to create an editor.
 import Editor from '@ckeditor/ckeditor5-core/src/editor/editor';
+import EditorUI from '@ckeditor/ckeditor5-core/src/editor/editorui';
 import EditorUIView from '@ckeditor/ckeditor5-ui/src/editorui/editoruiview';
 import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
 import ComponentFactory from '@ckeditor/ckeditor5-ui/src/componentfactory';
@@ -81,22 +82,12 @@ export default class BootstrapEditor extends Editor {
 		// When editor#element is a textarea inside a form element,
 		// the content of this textarea will be updated on form submit.
 		attachToForm( this );
-
-		// A helper to easily replace the editor#element with editor.editable#element.
-		this._elementReplacer = new ElementReplacer();
-	}
-
-	get element() {
-		return this.ui.view.element;
 	}
 
 	destroy() {
 		// When destroyed, the editor sets the output of editor#getData() into editor#element...
 		this.updateSourceElement();
 
-		// ...and restores the original editor#element...
-		this._elementReplacer.restore();
-
 		// ...and destroys the UI.
 		this.ui.destroy();
 
@@ -106,29 +97,15 @@ export default class BootstrapEditor extends Editor {
 	static create( element, config ) {
 		return new Promise( resolve => {
 			const editor = new this( element, config );
-			const editable = editor.ui.view.editable;
 
 			resolve(
 				editor.initPlugins()
-					.then( () => {
-						// Initialize the UI first. See the BootstrapEditorUI class to learn more.
-						editor.ui.init();
-
-						// Replace the editor#element with editor.editable#element.
-						editor._elementReplacer.replace( element, editable.element );
-
-						// Tell the world that the UI of the editor is ready to use.
-						editor.fire( 'uiReady' );
-					} )
-					// Bind the editor editing layer to the editable in the DOM.
-					.then( () => editor.editing.view.attachDomRoot( editable.element ) )
-					// Fill the editable with the intial data.
+					// Initialize the UI first. See the BootstrapEditorUI class to learn more.
+					.then( () => editor.ui.init( element ) )
+					// Fill the editable with the initial data.
 					.then( () => editor.data.init( getDataFromElement( element ) ) )
-					// Fire the events that announce that the editor is complete and ready to use.
-					.then( () => {
-						editor.fire( 'dataReady' );
-						editor.fire( 'ready' );
-					} )
+					// Fire the `editor#ready` event that announce the editor is complete and ready to use.
+					.then( () => editor.fire( 'ready' ) )
 					.then( () => editor )
 			);
 		} );
@@ -208,7 +185,7 @@ Although Bootstrap provides most of the CSS, it does not come with styles dedica
 }
 
 /* When in read–only mode, the editable should fade out. */
-.ck-editor .ck-editor__editable:not([contenteditable]) {
+.ck-editor .ck-editor__editable.ck-read-only {
 	background: hsl(0, 0%, 98%);
 	color: hsl(0, 0%, 47%);
 }
@@ -256,18 +233,21 @@ Define the `BootstrapEditorUI` and then have a closer look at the content of the
 
 ```js
 // The class organizing the UI of the editor, binding it with existing Bootstrap elements in the DOM.
-class BootstrapEditorUI {
+class BootstrapEditorUI extends EditorUI {
 	constructor( editor ) {
-		this.editor = editor;
+		super( editor );
+
+		// A helper to easily replace the editor#element with editor.editable#element.
+		this._elementReplacer = new ElementReplacer();
 
 		// The global UI view of the editor. It aggregates various Bootstrap DOM elements.
-		const view = this.view = new EditorUIView( editor.locale );
+		const view = this._view = new EditorUIView( editor.locale );
 
 		// This is the main editor element in the DOM.
 		view.element = $( '.ck-editor' );
 
 		// This is the editable view in the DOM. It will replace the data container in the DOM.
-		view.editable = new InlineEditableUIView( editor.locale );
+		view.editable = new InlineEditableUIView( editor.locale, editor.editing.view );
 
 		// References to the dropdown elements for further usage. See #_setupBootstrapHeadingDropdown.
 		view.dropdownMenu = view.element.find( '.dropdown-menu' );
@@ -280,35 +260,63 @@ class BootstrapEditorUI {
 			// Retrieve the jQuery object corresponding with the button in the DOM.
 			view.toolbarButtons[ name ] = view.element.find( `#${ name }` );
 		} );
+	}
 
-		// Mandatory EditorUI interface components.
-		this.componentFactory = new ComponentFactory( editor );
-		this.focusTracker = new FocusTracker();
+	// All EditorUI subclasses should expose their view instance
+	// so other UI classes can access it if necessary.
+	get view() {
+		return this._view;
 	}
 
-	init() {
+	init( replacementElement ) {
 		const editor = this.editor;
 		const view = this.view;
-
-		// Render the editable component in the DOM first.
-		view.editable.render();
+		const editingView = editor.editing.view;
 
 		// Create an editing root in the editing layer. It will correspond with the
 		// document root created in the constructor().
-		const editingRoot = editor.editing.view.document.getRoot();
+		const editingRoot = editingView.document.getRoot();
 
-		// Bind the basic attributes of the editable in the DOM with the editing layer.
-		view.editable.bind( 'isReadOnly' ).to( editingRoot );
-		view.editable.bind( 'isFocused' ).to( editor.editing.view.document );
+		// The editable UI and editing root should share the same name.
 		view.editable.name = editingRoot.rootName;
 
+		// Render the editable component in the DOM first.
+		view.editable.render();
+
+		const editableElement = view.editable.element;
+
+		// Register editable element so it is available via getEditableElement() method.
+		this.setEditableElement( view.editable.name, editableElement );
+
+		// Let the editable UI element respond to the changes in the global editor focus tracker
+		// and let the focus tracker know about the editable element.
+		this.focusTracker.add( editableElement );
+		view.editable.bind( 'isFocused' ).to( this.focusTracker );
+
+		// Bind the editable UI element to the editing view, making it an end– and entry–point
+		// of the editor's engine. This is where the engine meets the UI.
+		editingView.attachDomRoot( editableElement );
+
 		// Setup the existing, external Bootstrap UI so it works with the rest of the editor.
 		this._setupBootstrapToolbarButtons();
 		this._setupBootstrapHeadingDropdown();
+
+		// Replace the editor#element with editor.editable#element.
+		this._elementReplacer.replace( replacementElement, editableElement );
+
+		// Tell the world that the UI of the editor is ready to use.
+		this.fire( 'ready' );
 	}
 
 	destroy() {
-		this.view.editable.destroy();
+		// Restore the original editor#element.
+		this._elementReplacer.restore();
+
+		// Destroy the view.
+		this._view.editable.destroy();
+		this._view.destroy();
+
+		super.destroy();
 	}
 
 	// This method activates Bold, Italic, Underline, Undo and Redo buttons in the toolbar.

+ 4 - 1
packages/ckeditor5-ui/lang/contexts.json

@@ -1,5 +1,8 @@
 {
 	"Rich Text Editor, %0": "Title of the CKEditor5 editor.",
 	"Rich Text Editor": "Title of the CKEditor5 editor.",
-	"Edit block": "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)"
+	"Edit block": "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)",
+	"Next": "Label for a button showing the next thing (tab, page, etc.).",
+	"Previous": "Label for a button showing the previous thing (tab, page, etc.).",
+	"%0 of %1": "Label for a 'page X of Y' status of a typical next/previous page navigation."
 }

+ 24 - 1
packages/ckeditor5-ui/lang/translations/ar.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Arabic (https://www.transifex.com/ckeditor/teams/11143/ar/)\n"
@@ -16,3 +27,15 @@ msgstr "معالج نصوص"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/ast.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Asturian (https://www.transifex.com/ckeditor/teams/11143/ast/)\n"
@@ -16,3 +27,15 @@ msgstr "Editor de testu arriquecíu"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 41 - 0
packages/ckeditor5-ui/lang/translations/az.po

@@ -0,0 +1,41 @@
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
+msgid ""
+msgstr ""
+"Language-Team: Azerbaijani (https://www.transifex.com/ckeditor/teams/11143/az/)\n"
+"Language: az\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor, %0"
+msgstr "Rich Text Redaktoru, %0"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor"
+msgstr "Rich Text Redaktoru"
+
+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"
+msgstr "Redaktə etmək bloku"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Növbəti"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Əvvəlki"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 (Cəmi %1)"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/cs.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Czech (https://www.transifex.com/ckeditor/teams/11143/cs/)\n"
@@ -16,3 +27,15 @@ msgstr "Textový editor"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/da.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Danish (https://www.transifex.com/ckeditor/teams/11143/da/)\n"
@@ -16,3 +27,15 @@ msgstr "Wysiwyg editor"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/de-ch.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: German (Switzerland) (https://www.transifex.com/ckeditor/teams/11143/de_CH/)\n"
@@ -16,3 +27,15 @@ msgstr "Rich-Text-Edito"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/de.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: German (https://www.transifex.com/ckeditor/teams/11143/de/)\n"
@@ -16,3 +27,15 @@ msgstr "Rich Text Editor"
 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"
 msgstr "Absatz bearbeiten"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Nächste"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "vorherige"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 von %1"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/el.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Greek (https://www.transifex.com/ckeditor/teams/11143/el/)\n"
@@ -16,3 +27,15 @@ msgstr "Επεξεργαστής Πλούσιου Κειμένου"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/en-au.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: English (Australia) (https://www.transifex.com/ckeditor/teams/11143/en_AU/)\n"
@@ -15,4 +26,16 @@ msgstr "Rich Text Editor"
 
 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"
-msgstr ""
+msgstr "Edit block"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Next"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Previous"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 of %1"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/en.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language: \n"
@@ -16,3 +27,15 @@ msgstr "Rich Text Editor"
 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"
 msgstr "Edit block"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Next"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Previous"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 of %1"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/eo.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Esperanto (https://www.transifex.com/ckeditor/teams/11143/eo/)\n"
@@ -16,3 +27,15 @@ msgstr "Redaktilo de Riĉa Teksto"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/es.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Spanish (https://www.transifex.com/ckeditor/teams/11143/es/)\n"
@@ -15,4 +26,16 @@ msgstr "Editor de Texto Enriquecido"
 
 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"
-msgstr ""
+msgstr "Cuadro de edición"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Siguiente"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Anterior"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 de %1"

+ 25 - 2
packages/ckeditor5-ui/lang/translations/et.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Estonian (https://www.transifex.com/ckeditor/teams/11143/et/)\n"
@@ -15,4 +26,16 @@ msgstr "Tekstiredaktor"
 
 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"
-msgstr ""
+msgstr "Muuda plokki"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Järgmine"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Eelmine"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 / %1"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/eu.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Basque (https://www.transifex.com/ckeditor/teams/11143/eu/)\n"
@@ -16,3 +27,15 @@ msgstr "Testu aberastuaren editorea"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/fa.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Persian (https://www.transifex.com/ckeditor/teams/11143/fa/)\n"
@@ -15,4 +26,16 @@ msgstr "ویرایشگر متن غنی"
 
 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"
+msgstr "ویرایش قطعه"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
 msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/fi.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Finnish (https://www.transifex.com/ckeditor/teams/11143/fi/)\n"
@@ -15,4 +26,16 @@ msgstr "Rikas tekstieditori"
 
 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"
+msgstr "Muokkaa lohkoa"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
 msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/fr.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: French (https://www.transifex.com/ckeditor/teams/11143/fr/)\n"
@@ -15,4 +26,16 @@ 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)"
 msgid "Edit block"
-msgstr ""
+msgstr "Modifier le bloc"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Suivant"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Précedent"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 sur %1"

+ 25 - 2
packages/ckeditor5-ui/lang/translations/gl.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Galician (https://www.transifex.com/ckeditor/teams/11143/gl/)\n"
@@ -15,4 +26,16 @@ 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)"
 msgid "Edit block"
-msgstr ""
+msgstr "Editar bloque"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Seguinte"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Anterior"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 de %1"

+ 26 - 3
packages/ckeditor5-ui/lang/translations/he.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Hebrew (https://www.transifex.com/ckeditor/teams/11143/he/)\n"
@@ -7,12 +18,24 @@ msgstr ""
 
 msgctxt "Title of the CKEditor5 editor."
 msgid "Rich Text Editor, %0"
-msgstr "עורך טקסט עשיר"
+msgstr "עורך טקסט עשיר, %0"
 
 msgctxt "Title of the CKEditor5 editor."
 msgid "Rich Text Editor"
-msgstr ""
+msgstr "עורך טקסט עשיר"
 
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/hr.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Croatian (https://www.transifex.com/ckeditor/teams/11143/hr/)\n"
@@ -16,3 +27,15 @@ msgstr "Rich Text Editor"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/hu.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Hungarian (https://www.transifex.com/ckeditor/teams/11143/hu/)\n"
@@ -16,3 +27,15 @@ msgstr "Bővített szövegszerkesztő"
 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"
 msgstr "Blokk szerkesztése"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Következő"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Előző"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 / %1"

+ 41 - 0
packages/ckeditor5-ui/lang/translations/id.po

@@ -0,0 +1,41 @@
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
+msgid ""
+msgstr ""
+"Language-Team: Indonesian (https://www.transifex.com/ckeditor/teams/11143/id/)\n"
+"Language: id\n"
+"Plural-Forms: nplurals=1; plural=0;\n"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor, %0"
+msgstr "Editor Teks Kaya, %0"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor"
+msgstr "Editor Teks Kaya"
+
+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"
+msgstr "Sunting blok"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Berikutnya"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Sebelumnya"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 dari %1"

+ 27 - 4
packages/ckeditor5-ui/lang/translations/it.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Italian (https://www.transifex.com/ckeditor/teams/11143/it/)\n"
@@ -7,12 +18,24 @@ msgstr ""
 
 msgctxt "Title of the CKEditor5 editor."
 msgid "Rich Text Editor, %0"
-msgstr "Editor di testo Rich Text, %0"
+msgstr "Editor di testo formattato, %0"
 
 msgctxt "Title of the CKEditor5 editor."
 msgid "Rich Text Editor"
-msgstr "Editor di testo Rich Text"
+msgstr "Editor di testo formattato"
 
 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"
-msgstr ""
+msgstr "Modifica blocco"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Avanti"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Indietro"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 di %1"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/ja.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Japanese (https://www.transifex.com/ckeditor/teams/11143/ja/)\n"
@@ -16,3 +27,15 @@ msgstr "リッチテキストエディター"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/km.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Khmer (https://www.transifex.com/ckeditor/teams/11143/km/)\n"
@@ -16,3 +27,15 @@ msgstr "កម្មវិធី​កែសម្រួល​អត្ថបទ
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/kn.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Kannada (https://www.transifex.com/ckeditor/teams/11143/kn/)\n"
@@ -16,3 +27,15 @@ msgstr "‍ಸಮೃದ್ಧ ಪಠ್ಯ ಸಂಪಾದಕ‍‍"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/ku.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Kurdish (https://www.transifex.com/ckeditor/teams/11143/ku/)\n"
@@ -15,4 +26,16 @@ msgstr "سەرنوسەری دەقی بەپیت"
 
 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"
-msgstr ""
+msgstr "دەستکاری بلۆک"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "دواتر"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "پێشتر"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 لە %1"

+ 41 - 0
packages/ckeditor5-ui/lang/translations/lt.po

@@ -0,0 +1,41 @@
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
+msgid ""
+msgstr ""
+"Language-Team: Lithuanian (https://www.transifex.com/ckeditor/teams/11143/lt/)\n"
+"Language: lt\n"
+"Plural-Forms: nplurals=4; plural=(n % 10 == 1 && (n % 100 > 19 || n % 100 < 11) ? 0 : (n % 10 >= 2 && n % 10 <=9) && (n % 100 > 19 || n % 100 < 11) ? 1 : n % 1 != 0 ? 2: 3);\n"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor, %0"
+msgstr "Raiškiojo teksto redaktorius, %0"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor"
+msgstr "Raiškiojo teksto redaktorius"
+
+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"
+msgstr "Redaguoti bloką"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/nb.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Norwegian Bokmål (https://www.transifex.com/ckeditor/teams/11143/nb/)\n"
@@ -16,3 +27,15 @@ msgstr "Rikteksteditor"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/ne.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Nepali (Nepal) (https://www.transifex.com/ckeditor/teams/11143/ne_NP/)\n"
@@ -15,4 +26,16 @@ msgstr "धनी पाठ सम्पादक"
 
 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"
-msgstr ""
+msgstr "ब्लक सम्पादन गर्न"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "अर्को"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "अघिल्लो"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "०% मध्ये १%"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/nl.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Dutch (https://www.transifex.com/ckeditor/teams/11143/nl/)\n"
@@ -16,3 +27,15 @@ msgstr "Tekstbewerker"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/no.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Norwegian (https://www.transifex.com/ckeditor/teams/11143/no/)\n"
@@ -15,4 +26,16 @@ msgstr "Tekstredigeringsverktøy for rik tekst"
 
 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"
-msgstr ""
+msgstr "Rediger blokk"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Neste"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Forrige"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 av %1"

+ 27 - 4
packages/ckeditor5-ui/lang/translations/pl.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Polish (https://www.transifex.com/ckeditor/teams/11143/pl/)\n"
@@ -7,12 +18,24 @@ msgstr ""
 
 msgctxt "Title of the CKEditor5 editor."
 msgid "Rich Text Editor, %0"
-msgstr "Edytor tekstu RTF, %0"
+msgstr "Edytor tekstu sformatowanego, %0"
 
 msgctxt "Title of the CKEditor5 editor."
 msgid "Rich Text Editor"
-msgstr "Edytor tekstu RTF"
+msgstr "Edytor tekstu sformatowanego"
 
 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"
-msgstr ""
+msgstr "Edytuj blok"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Następny"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Poprzedni"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 z %1"

+ 25 - 2
packages/ckeditor5-ui/lang/translations/pt-br.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Portuguese (Brazil) (https://www.transifex.com/ckeditor/teams/11143/pt_BR/)\n"
@@ -15,4 +26,16 @@ msgstr "Editor de Formatação"
 
 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"
-msgstr ""
+msgstr "Editor de bloco"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Próximo"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Anterior"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 de %1"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/pt.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Portuguese (https://www.transifex.com/ckeditor/teams/11143/pt/)\n"
@@ -16,3 +27,15 @@ msgstr "Editor de texto avançado"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/ro.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Romanian (https://www.transifex.com/ckeditor/teams/11143/ro/)\n"
@@ -16,3 +27,15 @@ msgstr "Editor de text îmbunătățit"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/ru.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Russian (https://www.transifex.com/ckeditor/teams/11143/ru/)\n"
@@ -15,4 +26,16 @@ msgstr "Редактор"
 
 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"
+msgstr "Редактировать блок"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
 msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/sk.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Slovak (https://www.transifex.com/ckeditor/teams/11143/sk/)\n"
@@ -16,3 +27,15 @@ msgstr "Editor s formátovaním"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/sq.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Albanian (https://www.transifex.com/ckeditor/teams/11143/sq/)\n"
@@ -16,3 +27,15 @@ msgstr "Redaktues i Tekstit të Pasur"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 41 - 0
packages/ckeditor5-ui/lang/translations/sr-latn.po

@@ -0,0 +1,41 @@
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
+msgid ""
+msgstr ""
+"Language-Team: Serbian (Latin) (https://www.transifex.com/ckeditor/teams/11143/sr@latin/)\n"
+"Language: sr@latin\n"
+"Plural-Forms: nplurals=3; plural=(n%10==1 && n%100!=11 ? 0 : n%10>=2 && n%10<=4 && (n%100<10 || n%100>=20) ? 1 : 2);\n"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor, %0"
+msgstr "Prošireni uređivač teksta, %0"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor"
+msgstr "Prošireni uređivač teksta"
+
+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"
+msgstr "Blok uređivač"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 41 - 0
packages/ckeditor5-ui/lang/translations/sr.po

@@ -0,0 +1,41 @@
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
+msgid ""
+msgstr ""
+"Language-Team: Serbian (https://www.transifex.com/ckeditor/teams/11143/sr/)\n"
+"Language: sr\n"
+"Plural-Forms: nplurals=3; plural=(n%10==1 && n%100!=11 ? 0 : n%10>=2 && n%10<=4 && (n%100<10 || n%100>=20) ? 1 : 2);\n"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor, %0"
+msgstr "Проширени уређивач текста, %0"
+
+msgctxt "Title of the CKEditor5 editor."
+msgid "Rich Text Editor"
+msgstr "Проширен уређивач текста"
+
+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"
+msgstr "Блок уређивач"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 24 - 1
packages/ckeditor5-ui/lang/translations/sv.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Swedish (https://www.transifex.com/ckeditor/teams/11143/sv/)\n"
@@ -16,3 +27,15 @@ msgstr "Rich Text-editor"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/tr.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Turkish (https://www.transifex.com/ckeditor/teams/11143/tr/)\n"
@@ -15,4 +26,16 @@ msgstr "Zengin İçerik Editörü"
 
 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"
-msgstr ""
+msgstr "Bloğu Düzenle"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Sonraki"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Önceki"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0/%1"

+ 24 - 1
packages/ckeditor5-ui/lang/translations/ug.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Uighur (https://www.transifex.com/ckeditor/teams/11143/ug/)\n"
@@ -16,3 +27,15 @@ msgstr "تېكىست تەھرىرلىگۈچ"
 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"
 msgstr ""
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr ""
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr ""
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr ""

+ 25 - 2
packages/ckeditor5-ui/lang/translations/uk.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Ukrainian (https://www.transifex.com/ckeditor/teams/11143/uk/)\n"
@@ -15,4 +26,16 @@ msgstr "Розширений текстовий редактор"
 
 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"
-msgstr ""
+msgstr "Редагувати блок"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "Наступний"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "Попередній"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0 із %1"

+ 25 - 2
packages/ckeditor5-ui/lang/translations/zh-cn.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Chinese (China) (https://www.transifex.com/ckeditor/teams/11143/zh_CN/)\n"
@@ -15,4 +26,16 @@ msgstr "富文本编辑器"
 
 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"
-msgstr ""
+msgstr "编辑框"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "下一步"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "上一步"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "第 %0 步,共 %1 步"

+ 25 - 2
packages/ckeditor5-ui/lang/translations/zh.po

@@ -1,4 +1,15 @@
-# Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+# Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+#
+#                                     !!! IMPORTANT !!!
+#
+#         Before you edit this file, please keep in mind that contributing to the project
+#                translations is possible ONLY via the Transifex online service.
+#
+#         To submit your translations, visit https://www.transifex.com/ckeditor/ckeditor5.
+#
+#                   To learn more, check out the official contributor's guide:
+#     https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
 msgid ""
 msgstr ""
 "Language-Team: Chinese (Taiwan) (https://www.transifex.com/ckeditor/teams/11143/zh_TW/)\n"
@@ -15,4 +26,16 @@ msgstr "豐富文字編輯器"
 
 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"
-msgstr ""
+msgstr "編輯區塊"
+
+msgctxt "Label for a button showing the next thing (tab, page, etc.)."
+msgid "Next"
+msgstr "下一"
+
+msgctxt "Label for a button showing the previous thing (tab, page, etc.)."
+msgid "Previous"
+msgstr "上一"
+
+msgctxt "Label for a 'page X of Y' status of a typical next/previous page navigation."
+msgid "%0 of %1"
+msgstr "%0/%1"

+ 30 - 32
packages/ckeditor5-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-ui",
-  "version": "11.1.0",
+  "version": "13.0.2",
   "description": "The UI framework and standard UI library of CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -9,43 +9,37 @@
     "ckeditor5-lib"
   ],
   "dependencies": {
-    "@ckeditor/ckeditor5-core": "^11.0.1",
-    "@ckeditor/ckeditor5-theme-lark": "^11.1.0",
-    "@ckeditor/ckeditor5-utils": "^11.0.0",
+    "@ckeditor/ckeditor5-core": "^12.2.1",
+    "@ckeditor/ckeditor5-utils": "^13.0.1",
     "lodash-es": "^4.17.10"
   },
   "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-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-easy-image": "^10.0.3",
-    "@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",
-    "del": "^2.2.0",
+    "@ckeditor/ckeditor5-basic-styles": "^11.1.3",
+    "@ckeditor/ckeditor5-block-quote": "^11.1.2",
+    "@ckeditor/ckeditor5-editor-balloon": "^12.2.1",
+    "@ckeditor/ckeditor5-editor-classic": "^12.1.3",
+    "@ckeditor/ckeditor5-engine": "^13.2.1",
+    "@ckeditor/ckeditor5-enter": "^11.0.4",
+    "@ckeditor/ckeditor5-essentials": "^11.0.4",
+    "@ckeditor/ckeditor5-heading": "^11.0.4",
+    "@ckeditor/ckeditor5-image": "^13.1.2",
+    "@ckeditor/ckeditor5-link": "^11.1.1",
+    "@ckeditor/ckeditor5-list": "^12.0.4",
+    "@ckeditor/ckeditor5-mention": "^12.0.1",
+    "@ckeditor/ckeditor5-paragraph": "^11.0.4",
+    "@ckeditor/ckeditor5-typing": "^12.1.1",
     "eslint": "^5.5.0",
-    "eslint-config-ckeditor5": "^1.0.7",
-    "husky": "^0.14.3",
-    "lint-staged": "^7.0.0",
-    "lodash-cli": "^4"
+    "eslint-config-ckeditor5": "^2.0.0",
+    "husky": "^1.3.1",
+    "lint-staged": "^7.0.0"
   },
   "engines": {
-    "node": ">=6.9.0",
-    "npm": ">=3.0.0"
+    "node": ">=8.0.0",
+    "npm": ">=5.7.1"
   },
   "author": "CKSource (http://cksource.com/)",
   "license": "GPL-2.0-or-later",
-  "homepage": "https://ckeditor.com",
+  "homepage": "https://ckeditor.com/ckeditor-5",
   "bugs": "https://github.com/ckeditor/ckeditor5-ui/issues",
   "repository": {
     "type": "git",
@@ -57,8 +51,7 @@
     "theme"
   ],
   "scripts": {
-    "lint": "eslint --quiet '**/*.js'",
-    "precommit": "lint-staged"
+    "lint": "eslint --quiet '**/*.js'"
   },
   "lint-staged": {
     "**/*.js": [
@@ -68,5 +61,10 @@
   "eslintIgnore": [
     "src/lib/**",
     "packages/**"
-  ]
+  ],
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  }
 }

+ 2 - 2
packages/ckeditor5-ui/src/bindings/clickoutsidehandler.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/bindings/preventdefault.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/bindings/submithandler.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/button/button.jsdoc

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/button/buttonview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 3 - 3
packages/ckeditor5-ui/src/button/switchbuttonview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -26,7 +26,7 @@ import '../../theme/components/button/switchbutton.css';
  *
  *		document.body.append( view.element );
  *
- * @extends module:ui/buttonview~ButtonView
+ * @extends module:ui/button/buttonview~ButtonView
  */
 export default class SwitchButtonView extends ButtonView {
 	/**

+ 195 - 0
packages/ckeditor5-ui/src/colorgrid/colorgridview.js

@@ -0,0 +1,195 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module ui/colorgrid/colorgrid
+ */
+
+import View from '../view';
+import ColorTileView from './colortileview';
+import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
+import FocusCycler from '../focuscycler';
+import KeystrokeHandler from '@ckeditor/ckeditor5-utils/src/keystrokehandler';
+import '../../theme/components/colorgrid/colorgrid.css';
+
+/**
+ * A grid of {@link module:ui/colorgrid/colortile~ColorTileView color tiles}.
+ *
+ * @extends module:ui/view~View
+ */
+export default class ColorGridView extends View {
+	/**
+	 * Creates an instance of a color grid containing {@link module:ui/colorgrid/colortile~ColorTileView tiles}.
+	 *
+	 * @param {module:utils/locale~Locale} [locale] The localization services instance.
+	 * @param {Object} options Component configuration
+	 * @param {Array.<module:ui/colorgrid/colorgrid~ColorDefinition>} [options.colorDefinitions] Array with definitions
+	 * required to create the {@link module:ui/colorgrid/colortile~ColorTileView tiles}.
+	 * @param {Number} options.columns A number of columns to display the tiles.
+	 */
+	constructor( locale, options ) {
+		super( locale );
+
+		const colorDefinitions = options && options.colorDefinitions || [];
+		const viewStyleAttribute = {};
+
+		if ( options && options.columns ) {
+			viewStyleAttribute.gridTemplateColumns = `repeat( ${ options.columns }, 1fr)`;
+		}
+
+		/**
+		 * The color of the currently selected color tile in {@link #items}.
+		 *
+		 * @type {String}
+		 */
+		this.set( 'selectedColor' );
+
+		/**
+		 * Collection of the child tile views.
+		 *
+		 * @readonly
+		 * @member {module:ui/viewcollection~ViewCollection}
+		 */
+		this.items = this.createCollection();
+
+		/**
+		 * Tracks information about DOM focus in the grid.
+		 *
+		 * @readonly
+		 * @member {module:utils/focustracker~FocusTracker}
+		 */
+		this.focusTracker = new FocusTracker();
+
+		/**
+		 * Instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}.
+		 *
+		 * @readonly
+		 * @member {module:utils/keystrokehandler~KeystrokeHandler}
+		 */
+		this.keystrokes = new KeystrokeHandler();
+
+		/**
+		 * Helps cycling over focusable {@link #items} in the grid.
+		 *
+		 * @readonly
+		 * @protected
+		 * @member {module:ui/focuscycler~FocusCycler}
+		 */
+		this._focusCycler = new FocusCycler( {
+			focusables: this.items,
+			focusTracker: this.focusTracker,
+			keystrokeHandler: this.keystrokes,
+			actions: {
+				// Navigate grid items backwards using the arrowup key.
+				focusPrevious: 'arrowleft',
+
+				// Navigate grid items forwards using the arrowdown key.
+				focusNext: 'arrowright',
+			}
+		} );
+
+		colorDefinitions.forEach( item => {
+			const colorTile = new ColorTileView();
+
+			colorTile.set( {
+				color: item.color,
+				label: item.label,
+				tooltip: true,
+				hasBorder: item.options.hasBorder
+			} );
+
+			colorTile.on( 'execute', () => {
+				this.fire( 'execute', {
+					value: item.color,
+					hasBorder: item.options.hasBorder,
+					label: item.label
+				} );
+			} );
+
+			this.items.add( colorTile );
+		} );
+
+		this.setTemplate( {
+			tag: 'div',
+			children: this.items,
+			attributes: {
+				class: [
+					'ck',
+					'ck-color-grid'
+				],
+				style: viewStyleAttribute
+			}
+		} );
+
+		this.on( 'change:selectedColor', ( evt, name, selectedColor ) => {
+			for ( const item of this.items ) {
+				item.isOn = item.color === selectedColor;
+			}
+		} );
+	}
+
+	/**
+	 * Focuses the first focusable in {@link #items}.
+	 */
+	focus() {
+		if ( this.items.length ) {
+			this.items.first.focus();
+		}
+	}
+
+	/**
+	 * Focuses the last focusable in {@link #items}.
+	 */
+	focusLast() {
+		if ( this.items.length ) {
+			this.items.last.focus();
+		}
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	render() {
+		super.render();
+
+		// Items added before rendering should be known to the #focusTracker.
+		for ( const item of this.items ) {
+			this.focusTracker.add( item.element );
+		}
+
+		this.items.on( 'add', ( evt, item ) => {
+			this.focusTracker.add( item.element );
+		} );
+
+		this.items.on( 'remove', ( evt, item ) => {
+			this.focusTracker.remove( item.element );
+		} );
+
+		// Start listening for the keystrokes coming from #element.
+		this.keystrokes.listenTo( this.element );
+	}
+}
+
+/**
+ * A color definition used to create a {@link module:ui/colorgrid/colortile~ColorTileView}.
+ *
+ *		{
+ *			color: hsl(0, 0%, 75%),
+ *			label: 'Light Grey',
+ *			options: {
+ *				hasBorder: true
+ *			}
+ *		}
+ *
+ * @typedef {Object} module:ui/colorgrid/colorgrid~ColorDefinition
+ * @type Object
+ *
+ * @property {String} color String representing a color.
+ * It is used as value of background-color style in {@link module:ui/colorgrid/colortile~ColorTileView}.
+ * @property {String} label String used as label for {@link module:ui/colorgrid/colortile~ColorTileView}.
+ * @property {Object} options Additional options passed to create a {@link module:ui/colorgrid/colortile~ColorTileView}.
+ * @property {Boolean} options.hasBorder A flag that indicates if special a CSS class should be added
+ * to {@link module:ui/colorgrid/colortile~ColorTileView}, which renders a border around it.
+ */

+ 63 - 0
packages/ckeditor5-ui/src/colorgrid/colortileview.js

@@ -0,0 +1,63 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module ui/colorgrid/colortile
+ */
+
+import ButtonView from '../button/buttonview';
+import checkIcon from '../../theme/icons/color-tile-check.svg';
+
+/**
+ * This class represents a single color tile in the {@link module:ui/colorgrid/colorgrid~ColorGridView}.
+ *
+ * @extends module:ui/button/buttonview~ButtonView
+ */
+export default class ColorTileView extends ButtonView {
+	constructor( locale ) {
+		super( locale );
+
+		const bind = this.bindTemplate;
+
+		/**
+		 * String representing a color shown as tile's background.
+		 *
+		 * @type {String}
+		 */
+		this.set( 'color' );
+
+		/**
+		 * A flag that toggles a special CSS class responsible for displaying
+		 * a border around the button.
+		 *
+		 * @type {Boolean}
+		 */
+		this.set( 'hasBorder' );
+
+		this.icon = checkIcon;
+
+		this.extendTemplate( {
+			attributes: {
+				style: {
+					backgroundColor: bind.to( 'color' )
+				},
+				class: [
+					'ck',
+					'ck-color-grid__tile',
+					bind.if( 'hasBorder', 'ck-color-table__color-tile_bordered' )
+				]
+			}
+		} );
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	render() {
+		super.render();
+
+		this.iconView.fillColor = 'hsl(0, 0%, 100%)';
+	}
+}

+ 8 - 4
packages/ckeditor5-ui/src/componentfactory.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -85,7 +85,9 @@ export default class ComponentFactory {
 			 * @param {String} name The name of the component.
 			 */
 			throw new CKEditorError(
-				'componentfactory-item-exists: The item already exists in the component factory.', { name }
+				'componentfactory-item-exists: The item already exists in the component factory.',
+				this,
+				{ name }
 			);
 		}
 
@@ -113,7 +115,9 @@ export default class ComponentFactory {
 			 * @param {String} name The name of the missing component.
 			 */
 			throw new CKEditorError(
-				'componentfactory-item-missing: The required component is not registered in the factory.', { name }
+				'componentfactory-item-missing: The required component is not registered in the factory.',
+				this,
+				{ name }
 			);
 		}
 

+ 2 - 2
packages/ckeditor5-ui/src/dropdown/button/dropdownbutton.jsdoc

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/dropdown/button/dropdownbuttonview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/dropdown/button/splitbuttonview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/dropdown/dropdownpanelfocusable.jsdoc

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/dropdown/dropdownpanelview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/dropdown/dropdownview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/dropdown/utils.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 79 - 29
packages/ckeditor5-ui/src/editableui/editableuiview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -19,18 +19,13 @@ export default class EditableUIView extends View {
 	 * Creates an instance of EditableUIView class.
 	 *
 	 * @param {module:utils/locale~Locale} [locale] The locale instance.
+	 * @param {module:engine/view/view~View} editingView The editing view instance the editable is related to.
 	 * @param {HTMLElement} [editableElement] The editable element. If not specified, this view
 	 * should create it. Otherwise, the existing element should be used.
 	 */
-	constructor( locale, editableElement ) {
+	constructor( locale, editingView, editableElement ) {
 		super( locale );
 
-		const bind = this.bindTemplate;
-
-		if ( editableElement ) {
-			this.element = this.editableElement = editableElement;
-		}
-
 		this.setTemplate( {
 			tag: 'div',
 			attributes: {
@@ -38,20 +33,17 @@ export default class EditableUIView extends View {
 					'ck',
 					'ck-content',
 					'ck-editor__editable',
-					'ck-rounded-corners',
-					bind.to( 'isFocused', value => value ? 'ck-focused' : 'ck-blurred' )
-				],
-				contenteditable: bind.to( 'isReadOnly', value => !value ),
+					'ck-rounded-corners'
+				]
 			}
 		} );
 
 		/**
-		 * Controls whether the editable is writable or not.
+		 * The name of the editable UI view.
 		 *
-		 * @observable
-		 * @member {Boolean} #isReadOnly
+		 * @member {String} #name
 		 */
-		this.set( 'isReadOnly', false );
+		this.name = null;
 
 		/**
 		 * Controls whether the editable is focused, i.e. the user is typing in it.
@@ -62,43 +54,101 @@ export default class EditableUIView extends View {
 		this.set( 'isFocused', false );
 
 		/**
-		 * An external {@link #editableElement} passed into the constructor, which also means
+		 * The element which is the main editable element (usually the one with `contentEditable="true"`).
+		 *
+		 * @private
+		 * @member {HTMLElement} #_editableElement
+		 */
+		this._editableElement = editableElement;
+
+		/**
+		 * Whether an external {@link #_editableElement} was passed into the constructor, which also means
 		 * the view will not render its {@link #template}.
 		 *
-		 * @member {HTMLElement} #externalElement
+		 * @private
+		 * @member {Boolean} #_hasExternalElement
 		 */
-		this.externalElement = editableElement;
+		this._hasExternalElement = !!this._editableElement;
 
 		/**
-		 * The element which is the main editable element (usually the one with `contentEditable="true"`).
+		 * The editing view instance the editable is related to. Editable uses the editing
+		 * view to dynamically modify its certain DOM attributes after {@link #render rendering}.
 		 *
-		 * @readonly
-		 * @member {HTMLElement} #editableElement
+		 * **Note**: The DOM attributes are performed by the editing view and not UI
+		 * {@link module:ui/view~View#bindTemplate template bindings} because once rendered,
+		 * the editable DOM element must remain under the full control of the engine to work properly.
+		 *
+		 * @protected
+		 * @member {module:engine/view/view~View} #isFocused
 		 */
+		this._editingView = editingView;
 	}
 
 	/**
 	 * Renders the view by either applying the {@link #template} to the existing
-	 * {@link #editableElement} or assigning {@link #element} as {@link #editableElement}.
+	 * {@link #_editableElement} or assigning {@link #element} as {@link #_editableElement}.
 	 */
 	render() {
 		super.render();
 
-		if ( this.externalElement ) {
-			this.template.apply( this.element = this.externalElement );
+		if ( this._hasExternalElement ) {
+			this.template.apply( this.element = this._editableElement );
 		} else {
-			this.editableElement = this.element;
+			this._editableElement = this.element;
 		}
+
+		this.on( 'change:isFocused', () => this._updateIsFocusedClasses() );
+		this._updateIsFocusedClasses();
 	}
 
 	/**
 	 * @inheritDoc
 	 */
 	destroy() {
-		if ( this.externalElement ) {
-			this.template.revert( this.externalElement );
+		if ( this._hasExternalElement ) {
+			this.template.revert( this._editableElement );
 		}
 
 		super.destroy();
 	}
+
+	/**
+	 * Updates the `ck-focused` and `ck-blurred` CSS classes on the {@link #element} according to
+	 * the {@link #isFocused} property value using the {@link #_editingView editing view} API.
+	 *
+	 * @private
+	 */
+	_updateIsFocusedClasses() {
+		const editingView = this._editingView;
+
+		if ( editingView.isRenderingInProgress ) {
+			updateAfterRender( this );
+		} else {
+			update( this );
+		}
+
+		function update( view ) {
+			editingView.change( writer => {
+				const viewRoot = editingView.document.getRoot( view.name );
+
+				writer.addClass( view.isFocused ? 'ck-focused' : 'ck-blurred', viewRoot );
+				writer.removeClass( view.isFocused ? 'ck-blurred' : 'ck-focused', viewRoot );
+			} );
+		}
+
+		// In a case of a multi-root editor, a callback will be attached more than once (one callback for each root).
+		// While executing one callback the `isRenderingInProgress` observable is changing what causes executing another
+		// callback and render is called inside the already pending render.
+		// We need to be sure that callback is executed only when the value has changed from `true` to `false`.
+		// See https://github.com/ckeditor/ckeditor5/issues/1676.
+		function updateAfterRender( view ) {
+			editingView.once( 'change:isRenderingInProgress', ( evt, name, value ) => {
+				if ( !value ) {
+					update( view );
+				} else {
+					updateAfterRender( view );
+				}
+			} );
+		}
+	}
 }

+ 21 - 20
packages/ckeditor5-ui/src/editableui/inline/inlineeditableuiview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -19,34 +19,35 @@ export default class InlineEditableUIView extends EditableUIView {
 	 * Creates an instance of the InlineEditableUIView class.
 	 *
 	 * @param {module:utils/locale~Locale} [locale] The locale instance.
+	 * @param {module:engine/view/view~View} editingView The editing view instance the editable is related to.
 	 * @param {HTMLElement} [editableElement] The editable element. If not specified, the
 	 * {@link module:ui/editableui/editableuiview~EditableUIView}
 	 * will create it. Otherwise, the existing element will be used.
 	 */
-	constructor( locale, editableElement ) {
-		super( locale, editableElement );
-
-		const bind = this.bindTemplate;
-		const t = this.t;
-
-		/**
-		 * The name of the editable UI view.
-		 *
-		 * @observable
-		 * @member {String} #name
-		 */
-		this.set( 'name', null );
-
-		const getLabel = value => {
-			return t( 'Rich Text Editor, %0', [ value ] );
-		};
+	constructor( locale, editingView, editableElement ) {
+		super( locale, editingView, editableElement );
 
 		this.extendTemplate( {
 			attributes: {
 				role: 'textbox',
-				'aria-label': bind.to( 'name', getLabel ),
 				class: 'ck-editor__editable_inline'
 			}
 		} );
 	}
+
+	/**
+	 * @inheritDoc
+	 */
+	render() {
+		super.render();
+
+		const editingView = this._editingView;
+		const t = this.t;
+
+		editingView.change( writer => {
+			const viewRoot = editingView.document.getRoot( this.name );
+
+			writer.setAttribute( 'aria-label', t( 'Rich Text Editor, %0', [ this.name ] ), viewRoot );
+		} );
+	}
 }

+ 2 - 2
packages/ckeditor5-ui/src/editorui/boxed/boxededitoruiview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/editorui/editoruiview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/focuscycler.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/icon/iconview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /* global DOMParser */

+ 13 - 2
packages/ckeditor5-ui/src/iframe/iframeview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -12,6 +12,17 @@ import View from '../view';
 /**
  * The iframe view class.
  *
+ * 		const iframe = new IframeView();
+ *
+ *		iframe.render();
+ *		document.body.appendChild( iframe.element );
+ *
+ * 		iframe.on( 'loaded', () => {
+ *			console.log( 'The iframe has loaded', iframe.element.contentWindow );
+ *		} );
+ *
+ * 		iframe.element.src = 'https://ckeditor.com';
+ *
  * @extends module:ui/view~View
  */
 export default class IframeView extends View {

+ 5 - 5
packages/ckeditor5-ui/src/inputtext/inputtextview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -68,9 +68,9 @@ export default class InputTextView extends View {
 		 * some error, it helps screen readers read the error text.
 		 *
 		 * @observable
-		 * @member {Boolean} #ariaDesribedById
+		 * @member {Boolean} #ariaDescribedById
 		 */
-		this.set( 'ariaDesribedById' );
+		this.set( 'ariaDescribedById' );
 
 		const bind = this.bindTemplate;
 
@@ -88,7 +88,7 @@ export default class InputTextView extends View {
 				placeholder: bind.to( 'placeholder' ),
 				readonly: bind.to( 'isReadOnly' ),
 				'aria-invalid': bind.if( 'hasError', true ),
-				'aria-describedby': bind.to( 'ariaDesribedById' )
+				'aria-describedby': bind.to( 'ariaDescribedById' )
 			},
 			on: {
 				input: bind.to( 'input' )

+ 2 - 2
packages/ckeditor5-ui/src/label/labelview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 59 - 22
packages/ckeditor5-ui/src/labeledinput/labeledinputview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -28,7 +28,7 @@ export default class LabeledInputView extends View {
 		super( locale );
 
 		const inputUid = `ck-input-${ uid() }`;
-		const errorUid = `ck-error-${ uid() }`;
+		const statusUid = `ck-status-${ uid() }`;
 
 		/**
 		 * The text of the label.
@@ -72,6 +72,21 @@ export default class LabeledInputView extends View {
 		 */
 		this.set( 'errorText', null );
 
+		/**
+		 * The additional information text displayed next to the {@link #inputView} which can
+		 * be used to inform the user about the purpose of the input, provide help or hints.
+		 *
+		 * Set it to `null` to hide the message.
+		 *
+		 * **Note:** This text will be displayed in the same place as {@link #errorText} but the
+		 * latter always takes precedence: if the {@link #errorText} is set, it replaces
+		 * {@link #errorText} for as long as the value of the input is invalid.
+		 *
+		 * @observable
+		 * @member {String|null} #infoText
+		 */
+		this.set( 'infoText', null );
+
 		/**
 		 * The label view.
 		 *
@@ -84,14 +99,33 @@ export default class LabeledInputView extends View {
 		 *
 		 * @member {module:ui/inputtext/inputtextview~InputTextView} #inputView
 		 */
-		this.inputView = this._createInputView( InputView, inputUid, errorUid );
+		this.inputView = this._createInputView( InputView, inputUid, statusUid );
+
+		/**
+		 * The status view for the {@link #inputView}. It displays {@link #errorText} and
+		 * {@link #infoText}.
+		 *
+		 * @member {module:ui/view~View} #statusView
+		 */
+		this.statusView = this._createStatusView( statusUid );
 
 		/**
-		 * The error view for the {@link #inputView}.
+		 * The combined status text made of {@link #errorText} and {@link #infoText}.
+		 * Note that when present, {@link #errorText} always takes precedence in the
+		 * status.
 		 *
-		 * @member {module:ui/view~View} #errorView
+		 * @see #errorText
+		 * @see #infoText
+		 * @see #statusView
+		 * @private
+		 * @observable
+		 * @member {String|null} #_statusText
 		 */
-		this.errorView = this._createErrorView( errorUid );
+		this.bind( '_statusText' ).to(
+			this, 'errorText',
+			this, 'infoText',
+			( errorText, infoText ) => errorText || infoText
+		);
 
 		const bind = this.bindTemplate;
 
@@ -107,7 +141,7 @@ export default class LabeledInputView extends View {
 			children: [
 				this.labelView,
 				this.inputView,
-				this.errorView
+				this.statusView
 			]
 		} );
 	}
@@ -134,14 +168,14 @@ export default class LabeledInputView extends View {
 	 * @private
 	 * @param {Function} InputView Input view constructor.
 	 * @param {String} inputUid Unique id to set as inputView#id attribute.
-	 * @param {String} errorUid Unique id of the error for the input's `aria-describedby` attribute.
+	 * @param {String} statusUid Unique id of the status for the input's `aria-describedby` attribute.
 	 * @returns {module:ui/inputtext/inputtextview~InputTextView}
 	 */
-	_createInputView( InputView, inputUid, errorUid ) {
-		const inputView = new InputView( this.locale, errorUid );
+	_createInputView( InputView, inputUid, statusUid ) {
+		const inputView = new InputView( this.locale, statusUid );
 
 		inputView.id = inputUid;
-		inputView.ariaDesribedById = errorUid;
+		inputView.ariaDescribedById = statusUid;
 		inputView.bind( 'value' ).to( this );
 		inputView.bind( 'isReadOnly' ).to( this );
 		inputView.bind( 'hasError' ).to( this, 'errorText', value => !!value );
@@ -156,34 +190,37 @@ export default class LabeledInputView extends View {
 	}
 
 	/**
-	 * Creates the error view instance.
+	 * Creates the status view instance. It displays {@link #errorText} and {@link #infoText}
+	 * next to the {@link #inputView}. See {@link #_statusText}.
 	 *
 	 * @private
-	 * @param {String} errorUid Unique id of the error, shared with the input's `aria-describedby` attribute.
+	 * @param {String} statusUid Unique id of the status, shared with the input's `aria-describedby` attribute.
 	 * @returns {module:ui/view~View}
 	 */
-	_createErrorView( errorUid ) {
-		const errorView = new View( this.locale );
+	_createStatusView( statusUid ) {
+		const statusView = new View( this.locale );
 		const bind = this.bindTemplate;
 
-		errorView.setTemplate( 				{
+		statusView.setTemplate( {
 			tag: 'div',
 			attributes: {
 				class: [
 					'ck',
-					'ck-labeled-input__error',
-					bind.if( 'errorText', 'ck-hidden', value => !value )
+					'ck-labeled-input__status',
+					bind.if( 'errorText', 'ck-labeled-input__status_error' ),
+					bind.if( '_statusText', 'ck-hidden', value => !value )
 				],
-				id: errorUid
+				id: statusUid,
+				role: bind.if( 'errorText', 'alert' )
 			},
 			children: [
 				{
-					text: bind.to( 'errorText' )
+					text: bind.to( '_statusText' )
 				}
 			]
 		} );
 
-		return errorView;
+		return statusView;
 	}
 
 	/**

+ 2 - 2
packages/ckeditor5-ui/src/list/listitemview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/list/listseparatorview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/list/listview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 2 - 2
packages/ckeditor5-ui/src/model.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 69 - 66
packages/ckeditor5-ui/src/notification/notification.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -14,11 +14,11 @@ import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 /**
  * The Notification plugin.
  *
- * This plugin sends few base types of notifications: `success`, `info` and `warning`. This notifications need to be
- * handled and displayed by plugin responsible for showing UI of the notifications. Using this plugin for dispatching
- * notifications makes possible to switch the notifications UI.
+ * This plugin sends a few types of notifications: `success`, `info` and `warning`. The notifications need to be
+ * handled and displayed by a plugin responsible for showing the UI of the notifications. Using this plugin for dispatching
+ * notifications makes it possible to switch the notifications UI.
  *
- * Note that every unhandled and not stopped `warning` notification will be displayed as system alert.
+ * Note that every unhandled and not stopped `warning` notification will be displayed as a system alert.
  * See {@link module:ui/notification/notification~Notification#showWarning}.
  *
  * @extends module:core/plugin~Plugin
@@ -35,33 +35,34 @@ export default class Notification extends Plugin {
 	 * @inheritDoc
 	 */
 	init() {
-		// Each unhandled and not stopped `show:warning` event is displayed as system alert.
+		// Each unhandled and not stopped `show:warning` event is displayed as a system alert.
 		this.on( 'show:warning', ( evt, data ) => {
 			window.alert( data.message ); // eslint-disable-line no-alert
 		}, { priority: 'lowest' } );
 	}
 
 	/**
-	 * Shows success notification.
+	 * Shows a success notification.
 	 *
-	 * At default it fires `show:success` event with given data but event namespace can be extended
-	 * by `data.namespace` option e.g.
+	 * By default, it fires the {@link #event:show:success `show:success` event} with the given `data`. The event namespace can be extended
+	 * using the `data.namespace` option. For example:
 	 *
 	 * 		showSuccess( 'Image is uploaded.', {
 	 * 			namespace: 'upload:image'
 	 * 		} );
 	 *
-	 * will fire `show:success:upload:image` event.
-	 * Title of the notification can be provided:
+	 * will fire the `show:success:upload:image` event.
+	 *
+	 * You can provide the title of the notification:
 	 *
 	 *		showSuccess( 'Image is uploaded.', {
 	 *			title: 'Image upload success'
-	 *		});
+	 *		} );
 	 *
-	 * @param {String} message Content of the notification.
+	 * @param {String} message The content of the notification.
 	 * @param {Object} [data={}] Additional data.
 	 * @param {String} [data.namespace] Additional event namespace.
-	 * @param {String} [data.title] Title of the notification.
+	 * @param {String} [data.title] The title of the notification.
 	 */
 	showSuccess( message, data = {} ) {
 		this._showNotification( {
@@ -73,26 +74,27 @@ export default class Notification extends Plugin {
 	}
 
 	/**
-	 * Shows info notification.
+	 * Shows an information notification.
 	 *
-	 * At default it fires `show:info` event with given data but event namespace can be extended
-	 * by `data.namespace` option e.g.
+	 * By default, it fires the {@link #event:show:info `show:info` event} with the given `data`. The event namespace can be extended
+	 * using the `data.namespace` option. For example:
 	 *
 	 * 		showInfo( 'Editor is offline.', {
 	 * 			namespace: 'editor:status'
 	 * 		} );
 	 *
-	 * will fire `show:info:editor:status` event.
-	 * Title of the notification can be provided:
+	 * will fire the `show:info:editor:status` event.
+	 *
+	 * You can provide the title of the notification:
 	 *
 	 *		showInfo( 'Editor is offline.', {
 	 *			title: 'Network information'
-	 *		});
+	 *		} );
 	 *
-	 * @param {String} message Content of the notification.
+	 * @param {String} message The content of the notification.
 	 * @param {Object} [data={}] Additional data.
 	 * @param {String} [data.namespace] Additional event namespace.
-	 * @param {String} [data.title] Title of the notification.
+	 * @param {String} [data.title] The title of the notification.
 	 */
 	showInfo( message, data = {} ) {
 		this._showNotification( {
@@ -104,49 +106,50 @@ export default class Notification extends Plugin {
 	}
 
 	/**
-	 * Shows warning notification.
+	 * Shows a warning notification.
 	 *
-	 * At default it fires `show:warning` event with given data but event namespace can be extended
-	 * by `data.namespace` option e.g.
+	 * By default, it fires the {@link #event:show:warning `show:warning` event}
+	 * with the given `data`. The event namespace can be extended using the `data.namespace` option. For example:
 	 *
 	 * 		showWarning( 'Image upload error.', {
 	 * 			namespace: 'upload:image'
 	 * 		} );
 	 *
-	 * will fire `show:warning:upload:image` event.
-	 * Title of the notification can be provided:
+	 * will fire the `show:warning:upload:image` event.
+	 *
+	 * You can provide the title of the notification:
 	 *
 	 *		showWarning( 'Image upload error.', {
 	 *			title: 'Upload failed'
-	 *		});
+	 *		} );
 	 *
-	 * Note that each unhandled and not stopped `warning` notification will be displayed as system alert.
-	 * Plugin responsible for displaying warnings should `stop()` the event to prevent of displaying it as alert:
+	 * Note that each unhandled and not stopped `warning` notification will be displayed as a system alert.
+	 * The plugin responsible for displaying warnings should `stop()` the event to prevent displaying it as an alert:
 	 *
 	 * 		notifications.on( 'show:warning', ( evt, data ) => {
-	 * 			// Do something with data.
+	 * 			// Do something with the data.
 	 *
-	 * 			// Stop this event to prevent of displaying as alert.
+	 * 			// Stop this event to prevent displaying it as an alert.
 	 * 			evt.stop();
 	 * 		} );
 	 *
-	 * You can attach many listeners to the same event and `stop()` this event in the listener with the low priority:
+	 * You can attach many listeners to the same event and `stop()` this event in a listener with a low priority:
 	 *
 	 * 		notifications.on( 'show:warning', ( evt, data ) => {
-	 * 			// Show warning in the UI, but not stop it.
+	 * 			// Show the warning in the UI, but do not stop it.
 	 * 		} );
 	 *
 	 * 		notifications.on( 'show:warning', ( evt, data ) => {
-	 * 			// Log warning to some error tracker.
+	 * 			// Log the warning to some error tracker.
 	 *
-	 * 			// Stop this event to prevent of displaying as alert.
+	 * 			// Stop this event to prevent displaying it as an alert.
 	 * 			evt.stop();
 	 * 		}, { priority: 'low' } );
 	 *
-	 * @param {String} message Content of the notification.
+	 * @param {String} message The content of the notification.
 	 * @param {Object} [data={}] Additional data.
 	 * @param {String} [data.namespace] Additional event namespace.
-	 * @param {String} [data.title] Title of the notification.
+	 * @param {String} [data.title] The title of the notification.
 	 */
 	showWarning( message, data = {} ) {
 		this._showNotification( {
@@ -158,14 +161,14 @@ export default class Notification extends Plugin {
 	}
 
 	/**
-	 * Fires `show` event with specified type, namespace and message.
+	 * Fires the `show` event with the specified type, namespace and message.
 	 *
 	 * @private
-	 * @param {Object} data Message data.
-	 * @param {String} data.message Content of the notification.
-	 * @param {'success'|'info'|'warning'} data.type Type of message.
+	 * @param {Object} data The message data.
+	 * @param {String} data.message The content of the notification.
+	 * @param {'success'|'info'|'warning'} data.type The type of the message.
 	 * @param {String} [data.namespace] Additional event namespace.
-	 * @param {String} [data.title=''] Title of the notification.
+	 * @param {String} [data.title=''] The title of the notification.
 	 */
 	_showNotification( data ) {
 		const event = `show:${ data.type }` + ( data.namespace ? `:${ data.namespace }` : '' );
@@ -178,45 +181,45 @@ export default class Notification extends Plugin {
 	}
 
 	/**
-	 * Fired when one of `showSuccess`, `showInfo`, `showWarning` methods is called.
+	 * Fired when one of the `showSuccess()`, `showInfo()`, `showWarning()` methods is called.
 	 *
 	 * @event show
-	 * @param {Object} data Notification data.
-	 * @param {String} data.message Content of the notification.
-	 * @param {String} data.title Title of the notification.
-	 * @param {'success'|'info'|'warning'} data.type Type of notification.
+	 * @param {Object} data The notification data.
+	 * @param {String} data.message The content of the notification.
+	 * @param {String} data.title The title of the notification.
+	 * @param {'success'|'info'|'warning'} data.type The type of the notification.
 	 */
 
 	/**
-	 * Fired when `showSuccess` method is called.
+	 * Fired when the `showSuccess()` method is called.
 	 *
 	 * @event show:success
-	 * @param {Object} data Notification data.
-	 * @param {String} data.message Content of the notification.
-	 * @param {String} data.title Title of the notification.
-	 * @param {'success'} data.type Type of notification.
+	 * @param {Object} data The notification data.
+	 * @param {String} data.message The content of the notification.
+	 * @param {String} data.title The title of the notification.
+	 * @param {'success'} data.type The type of the notification.
 	 */
 
 	/**
-	 * Fired when `showInfo` method is called.
+	 * Fired when the `showInfo()` method is called.
 	 *
 	 * @event show:info
-	 * @param {Object} data Notification data.
-	 * @param {String} data.message Content of the notification.
-	 * @param {String} data.title Title of the notification.
-	 * @param {'info'} data.type Type of notification.
+	 * @param {Object} data The notification data.
+	 * @param {String} data.message The content of the notification.
+	 * @param {String} data.title The title of the notification.
+	 * @param {'info'} data.type The type of the notification.
 	 */
 
 	/**
-	 * Fired when `showWarning` method is called.
+	 * Fired when the `showWarning()` method is called.
 	 *
-	 * When this event won't be handled and stopped by `event.stop()` then data.message of this event will
-	 * be automatically displayed as system alert.
+	 * When this event is not handled or stopped by `event.stop()`, the `data.message` of this event will
+	 * be automatically displayed as a system alert.
 	 *
 	 * @event show:warning
-	 * @param {Object} data Notification data.
-	 * @param {String} data.message Content of the notification.
-	 * @param {String} data.title Title of the notification.
-	 * @param {'warning'} data.type Type of notification.
+	 * @param {Object} data The notification data.
+	 * @param {String} data.message The content of the notification.
+	 * @param {String} data.title The title of the notification.
+	 * @param {'warning'} data.type The type of the notification.
 	 */
 }

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

@@ -1,5 +1,5 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
  * For licensing, see LICENSE.md.
  */
 
@@ -24,7 +24,7 @@ const defaultLimiterElement = global.document.body;
  *
  * A floating container which can
  * {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView#pin pin} to any
- * {@link module:utils/dom/position~Options#target target} in DOM and remain in that position
+ * {@link module:utils/dom/position~Options#target target} in the DOM and remain in that position
  * e.g. when the web page is scrolled.
  *
  * The balloon panel can be used to display contextual, non-blocking UI like forms, toolbars and
@@ -86,9 +86,9 @@ export default class BalloonPanelView extends View {
 		this.set( 'left', 0 );
 
 		/**
-		 * Balloon panel's current position. The position name is reflected in the CSS class set
-		 * to the balloon, i.e. `.ck-balloon-panel_arrow_nw` for "arrow_nw" position. The class
-		 * controls the minor aspects of the balloon's visual appearance like placement
+		 * The balloon panel's current position. The position name is reflected in the CSS class set
+		 * to the balloon, i.e. `.ck-balloon-panel_arrow_nw` for the "arrow_nw" position. The class
+		 * controls the minor aspects of the balloon's visual appearance like the placement
 		 * of an {@link #withArrow arrow}. To support a new position, an additional CSS must be created.
 		 *
 		 * Default position names correspond with
@@ -113,7 +113,7 @@ export default class BalloonPanelView extends View {
 
 		/**
 		 * Controls whether the balloon panel has an arrow. The presence of the arrow
-		 * is reflected in `ck-balloon-panel_with-arrow` CSS class.
+		 * is reflected in the `ck-balloon-panel_with-arrow` CSS class.
 		 *
 		 * @observable
 		 * @default true
@@ -125,12 +125,12 @@ export default class BalloonPanelView extends View {
 		 * An additional CSS class added to the {@link #element}.
 		 *
 		 * @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 pinning the panel when {@link #isVisible} gets
 		 * `true`. Used by {@link #pin}.
 		 *
 		 * @private
@@ -138,7 +138,7 @@ export default class BalloonPanelView extends View {
 		 */
 
 		/**
-		 * Collection of the child views which creates balloon panel contents.
+		 * A collection of the child views that creates the balloon panel contents.
 		 *
 		 * @readonly
 		 * @member {module:ui/viewcollection~ViewCollection}
@@ -154,7 +154,7 @@ export default class BalloonPanelView extends View {
 					bind.to( 'position', value => `ck-balloon-panel_${ value }` ),
 					bind.if( 'isVisible', 'ck-balloon-panel_visible' ),
 					bind.if( 'withArrow', 'ck-balloon-panel_with-arrow' ),
-					bind.to( 'className' )
+					bind.to( 'class' )
 				],
 
 				style: {
@@ -187,11 +187,11 @@ export default class BalloonPanelView extends View {
 
 	/**
 	 * Attaches the panel to a specified {@link module:utils/dom/position~Options#target} with a
-	 * smart positioning heuristics that choses from available positions to make sure the panel
+	 * smart positioning heuristics that chooses from available positions to make sure the panel
 	 * is visible to the user i.e. within the limits of the viewport.
 	 *
 	 * This method accepts configuration {@link module:utils/dom/position~Options options}
-	 * to set the `target`, optional `limiter` and `positions` the balloon should chose from.
+	 * to set the `target`, optional `limiter` and `positions` the balloon should choose from.
 	 *
 	 *		const panel = new BalloonPanelView( locale );
 	 *		const positions = BalloonPanelView.defaultPositions;
@@ -210,7 +210,7 @@ export default class BalloonPanelView extends View {
 	 * **Note**: Attaching the panel will also automatically {@link #show} it.
 	 *
 	 * **Note**: An attached panel will not follow its target when the window is scrolled or resized.
-	 * See the {@link #pin} method for more permanent positioning strategy.
+	 * See the {@link #pin} method for a more permanent positioning strategy.
 	 *
 	 * @param {module:utils/dom/position~Options} options Positioning options compatible with
 	 * {@link module:utils/dom/position~getOptimalPosition}. Default `positions` array is
@@ -234,7 +234,13 @@ export default class BalloonPanelView extends View {
 			fitInViewport: true
 		}, options );
 
-		const { top, left, name: position } = BalloonPanelView._getOptimalPosition( positionOptions );
+		const optimalPosition = BalloonPanelView._getOptimalPosition( positionOptions );
+
+		// Usually browsers make some problems with super accurate values like 104.345px
+		// so it is better to use int values.
+		const left = parseInt( optimalPosition.left );
+		const top = parseInt( optimalPosition.top );
+		const position = optimalPosition.name;
 
 		Object.assign( this, { top, left, position } );
 	}
@@ -247,8 +253,8 @@ export default class BalloonPanelView extends View {
 	 * or {@link module:utils/dom/position~Options#limiter} is scrolled,
 	 * * the browser window gets resized or scrolled.
 	 *
-	 * Thanks to that, the panel always sticks to the {@link module:utils/dom/position~Options#target},
-	 * immune to the changing environment.
+	 * Thanks to that, the panel always sticks to the {@link module:utils/dom/position~Options#target}
+	 * and is immune to the changing environment.
 	 *
 	 *		const panel = new BalloonPanelView( locale );
 	 *		const positions = BalloonPanelView.defaultPositions;
@@ -356,8 +362,8 @@ export default class BalloonPanelView extends View {
 	}
 }
 
-// Returns the DOM element for given object or null, if there's none,
-// e.g. when passed object is a Rect instance or so.
+// Returns the DOM element for given object or null, if there is none,
+// e.g. when the passed object is a Rect instance or so.
 //
 // @private
 // @param {*} object
@@ -425,9 +431,9 @@ BalloonPanelView._getOptimalPosition = getOptimalPosition;
 
 /**
  * A default set of positioning functions used by the balloon panel view
- * when attaching using {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView#attachTo} method.
+ * when attaching using the {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView#attachTo} method.
  *
- * The available positioning functions are as follow:
+ * The available positioning functions are as follows:
  *
  * **North**
  *
@@ -589,7 +595,7 @@ BalloonPanelView._getOptimalPosition = getOptimalPosition;
  *
  * Positioning functions must be compatible with {@link module:utils/dom/position~Position}.
  *
- * The name that position function returns will be reflected in balloon panel's class that
+ * The name that the position function returns will be reflected in the balloon panel's class that
  * controls the placement of the "arrow". See {@link #position} to learn more.
  *
  * @member {Object} module:ui/panel/balloon/balloonpanelview~BalloonPanelView.defaultPositions

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

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -9,22 +9,55 @@
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import BalloonPanelView from './balloonpanelview';
+import View from '../../view';
+import ButtonView from '../../button/buttonview';
 import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
+import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
+import toUnit from '@ckeditor/ckeditor5-utils/src/dom/tounit';
+import Rect from '@ckeditor/ckeditor5-utils/src/dom/rect';
+
+import prevIcon from '../../../theme/icons/previous-arrow.svg';
+import nextIcon from '../../../theme/icons/next-arrow.svg';
+
+import '../../../theme/components/panel/balloonrotator.css';
+import '../../../theme/components/panel/fakepanel.css';
+
+const toPx = toUnit( 'px' );
 
 /**
- * Provides the common contextual balloon panel for the editor.
- *
- * This plugin allows reusing a single {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView} instance
- * to display multiple contextual balloon panels in the editor.
+ * Provides the common contextual balloon for the editor.
  *
- * Child views of such a panel are stored in the stack and the last one in the stack is visible. When the
- * visible view is removed from the stack, the previous view becomes visible, etc. If there are no more
- * views in the stack, the balloon panel will hide.
- *
- * It simplifies managing the views and helps
+ * The role of this plugin is to unify the contextual balloons logic, simplify views management and help
  * avoid the unnecessary complexity of handling multiple {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView}
  * instances in the editor.
  *
+ * This plugin allows for creating single or multiple panel stacks.
+ *
+ * Each stack may have multiple views, with the one on the top being visible. When the visible view is removed from the stack,
+ * the previous view becomes visible.
+ *
+ * It might be useful to implement nested navigation in a balloon. For instance, a toolbar view may contain a link button.
+ * When you click it, a link view (which lets you set the URL) is created and put on top of the toolbar view, so the link panel
+ * is displayed. When you finish editing the link and close (remove) the link view, the toolbar view is visible again.
+ *
+ * However, there are cases when there are multiple independent balloons to be displayed, for instance, if the selection
+ * is inside two inline comments at the same time. For such cases, you can create two independent panel stacks.
+ * The contextual balloon plugin will create a navigation bar to let the users switch between these panel stacks using the "Next"
+ * and "Previous" buttons.
+ *
+ * If there are no views in the current stack, the balloon panel will try to switch to the next stack. If there are no
+ * panels in any stack, the balloon panel will be hidden.
+ *
+ * **Note**: To force the balloon panel to show only one view, even if there are other stacks, use the `singleViewMode=true` option
+ * when {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon#add adding} a view to a panel.
+ *
+ * From the implementation point of view, the contextual ballon plugin is reusing a single
+ * {@link module:ui/panel/balloon/balloonpanelview~BalloonPanelView} instance to display multiple contextual balloon
+ * panels in the editor. It also creates a special {@link module:ui/panel/balloon/contextualballoon~RotatorView rotator view},
+ * used to manage multiple panel stacks. Rotator view is a child of the balloon panel view and the parent of the specific
+ * view you want to display. If there is more than one panel stack to be displayed, the rotator view will add a
+ * navigation bar. If there is only one stack, the rotator view is transparent (it does not add any UI elements).
+ *
  * @extends module:core/plugin~Plugin
  */
 export default class ContextualBalloon extends Plugin {
@@ -38,21 +71,15 @@ export default class ContextualBalloon extends Plugin {
 	/**
 	 * @inheritDoc
 	 */
-	init() {
-		/**
-		 * The common balloon panel view.
-		 *
-		 * @readonly
-		 * @member {module:ui/panel/balloon/balloonpanelview~BalloonPanelView} #view
-		 */
-		this.view = new BalloonPanelView();
+	constructor( editor ) {
+		super( editor );
 
 		/**
 		 * The {@link module:utils/dom/position~Options#limiter position limiter}
-		 * for the {@link #view}, used when no `limiter` has been passed into {@link #add}
+		 * for the {@link #view balloon}, used when no `limiter` has been passed into {@link #add}
 		 * or {@link #updatePosition}.
 		 *
-		 * By default, a function, which obtains the farthest DOM
+		 * By default, a function that obtains the farthest DOM
 		 * {@link module:engine/view/rooteditableelement~RootEditableElement}
 		 * of the {@link module:engine/view/document~Document#selection}.
 		 *
@@ -71,50 +98,99 @@ export default class ContextualBalloon extends Plugin {
 		};
 
 		/**
-		 * Stack of the views injected into the balloon. Last one in the stack is displayed
-		 * as a content of {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon#view}.
+		 * The currently visible view or `null` when there are no views in any stack.
+		 *
+		 * @readonly
+		 * @observable
+		 * @member {module:ui/view~View|null} #visibleView
+		 */
+		this.set( 'visibleView', null );
+
+		/**
+		 * The common balloon panel view.
+		 *
+		 * @readonly
+		 * @member {module:ui/panel/balloon/balloonpanelview~BalloonPanelView} #view
+		 */
+		this.view = new BalloonPanelView( editor.locale );
+		editor.ui.view.body.add( this.view );
+		editor.ui.focusTracker.add( this.view.element );
+
+		/**
+		 * The map of views and their stacks.
 		 *
 		 * @private
-		 * @member {Map} #_stack
+		 * @type {Map.<module:ui/view~View,Set>}
 		 */
-		this._stack = new Map();
+		this._viewToStack = new Map();
 
-		// Add balloon panel view to editor `body` collection and wait until view will be ready.
-		this.editor.ui.view.body.add( this.view );
+		/**
+		 * The map of IDs and stacks.
+		 *
+		 * @private
+		 * @type {Map.<String,Set>}
+		 */
+		this._idToStack = new Map();
 
-		// Editor should be focused when contextual balloon is focused.
-		this.editor.ui.focusTracker.add( this.view.element );
-	}
+		/**
+		 * A total number of all stacks in the balloon.
+		 *
+		 * @private
+		 * @readonly
+		 * @observable
+		 * @member {Number} #_numberOfStacks
+		 */
+		this.set( '_numberOfStacks', 0 );
 
-	/**
-	 * Returns the currently visible view or `null` when there are no
-	 * views in the stack.
-	 *
-	 * @returns {module:ui/view~View|null}
-	 */
-	get visibleView() {
-		const item = this._stack.get( this.view.content.get( 0 ) );
+		/**
+		 * A flag that controls the single view mode.
+		 *
+		 * @private
+		 * @readonly
+		 * @observable
+		 * @member {Boolean} #_singleViewMode
+		 */
+		this.set( '_singleViewMode', false );
+
+		/**
+		 * Rotator view embedded in the contextual balloon.
+		 * Displays the currently visible view in the balloon and provides navigation for switching stacks.
+		 *
+		 * @private
+		 * @type {module:ui/panel/balloon/contextualballoon~RotatorView}
+		 */
+		this._rotatorView = this._createRotatorView();
 
-		return item ? item.view : null;
+		/**
+		 * Displays fake panels under the balloon panel view when multiple stacks are added to the balloon.
+		 *
+		 * @private
+		 * @type {module:ui/view~View}
+		 */
+		this._fakePanelsView = this._createFakePanelsView();
 	}
 
 	/**
-	 * Returns `true` when the given view is in the stack. Otherwise returns `false`.
+	 * Returns `true` when the given view is in one of the stacks. Otherwise returns `false`.
 	 *
 	 * @param {module:ui/view~View} view
 	 * @returns {Boolean}
 	 */
 	hasView( view ) {
-		return this._stack.has( view );
+		return Array.from( this._viewToStack.keys() ).includes( view );
 	}
 
 	/**
-	 * Adds a new view to the stack and makes it visible.
+	 * Adds a new view to the stack and makes it visible if the current stack is visible
+	 * or it is the first view in the balloon.
 	 *
-	 * @param {Object} data Configuration of the view.
-	 * @param {module:ui/view~View} [data.view] Content of the balloon.
+	 * @param {Object} data The configuration of the view.
+	 * @param {String} [data.stackId='main'] The ID of the stack that the view is added to.
+	 * @param {module:ui/view~View} [data.view] The content of the balloon.
 	 * @param {module:utils/dom/position~Options} [data.position] Positioning options.
-	 * @param {String} [data.balloonClassName] Additional css class for {@link #view} added when given view is visible.
+	 * @param {String} [data.balloonClassName] An additional CSS class added to the {@link #view balloon} when visible.
+	 * @param {Boolean} [data.withArrow=true] Whether the {@link #view balloon} should be rendered with an arrow.
+	 * @param {Boolean} [data.singleViewMode=false] Whether the view should be the only visible view even if other stacks were added.
 	 */
 	add( data ) {
 		if ( this.hasView( data.view ) ) {
@@ -123,103 +199,303 @@ export default class ContextualBalloon extends Plugin {
 			 *
 			 * @error contextualballoon-add-view-exist
 			 */
-			throw new CKEditorError( 'contextualballoon-add-view-exist: Cannot add configuration of the same view twice.' );
+			throw new CKEditorError(
+				'contextualballoon-add-view-exist: Cannot add configuration of the same view twice.',
+				[ this, data ]
+			);
 		}
 
-		// When adding view to the not empty balloon.
-		if ( this.visibleView ) {
-			// Remove displayed content from the view.
-			this.view.content.remove( this.visibleView );
+		const stackId = data.stackId || 'main';
+
+		// If new stack is added, creates it and show view from this stack.
+		if ( !this._idToStack.has( stackId ) ) {
+			this._idToStack.set( stackId, new Map( [ [ data.view, data ] ] ) );
+			this._viewToStack.set( data.view, this._idToStack.get( stackId ) );
+			this._numberOfStacks = this._idToStack.size;
+
+			if ( !this._visibleStack || data.singleViewMode ) {
+				this.showStack( stackId );
+			}
+
+			return;
+		}
+
+		const stack = this._idToStack.get( stackId );
+
+		if ( data.singleViewMode ) {
+			this.showStack( stackId );
 		}
 
 		// Add new view to the stack.
-		this._stack.set( data.view, data );
+		stack.set( data.view, data );
+		this._viewToStack.set( data.view, stack );
 
-		// And display it.
-		this._show( data );
+		// And display it if is added to the currently visible stack.
+		if ( stack === this._visibleStack ) {
+			this._showView( data );
+		}
 	}
 
 	/**
 	 * Removes the given view from the stack. If the removed view was visible,
-	 * then the view preceding it in the stack will become visible instead.
-	 * When there is no view in the stack then balloon will hide.
+	 * the view preceding it in the stack will become visible instead.
+	 * When there is no view in the stack, the next stack will be displayed.
+	 * When there are no more stacks, the balloon will hide.
 	 *
 	 * @param {module:ui/view~View} view A view to be removed from the balloon.
 	 */
 	remove( view ) {
 		if ( !this.hasView( view ) ) {
 			/**
-			 * Trying to remove configuration of the view not defined in the stack.
+			 * Trying to remove the configuration of the view not defined in the stack.
 			 *
 			 * @error contextualballoon-remove-view-not-exist
 			 */
-			throw new CKEditorError( 'contextualballoon-remove-view-not-exist: Cannot remove configuration of not existing view.' );
+			throw new CKEditorError(
+				'contextualballoon-remove-view-not-exist: Cannot remove the configuration of a non-existent view.',
+				[ this, view ]
+			);
 		}
 
-		// When visible view is being removed.
-		if ( this.visibleView === view ) {
-			// We need to remove it from the view content.
-			this.view.content.remove( view );
-
-			// And then remove from the stack.
-			this._stack.delete( view );
+		const stack = this._viewToStack.get( view );
 
-			// Next we need to check if there is other view in stack to show.
-			const last = Array.from( this._stack.values() ).pop();
+		if ( this._singleViewMode && this.visibleView === view ) {
+			this._singleViewMode = false;
+		}
 
-			// If it is some other view.
-			if ( last ) {
-				// Just show it.
-				this._show( last );
+		// When visible view will be removed we need to show a preceding view or next stack
+		// if a view is the only view in the stack.
+		if ( this.visibleView === view ) {
+			if ( stack.size === 1 ) {
+				if ( this._idToStack.size > 1 ) {
+					this._showNextStack();
+				} else {
+					this.view.hide();
+					this.visibleView = null;
+					this._rotatorView.hideView();
+				}
 			} else {
-				// Hide the balloon panel.
-				this.view.hide();
+				this._showView( Array.from( stack.values() )[ stack.size - 2 ] );
 			}
+		}
+
+		if ( stack.size === 1 ) {
+			this._idToStack.delete( this._getStackId( stack ) );
+			this._numberOfStacks = this._idToStack.size;
 		} else {
-			// Just remove given view from the stack.
-			this._stack.delete( view );
+			stack.delete( view );
 		}
+
+		this._viewToStack.delete( view );
 	}
 
 	/**
-	 * Updates the position of the balloon using position data of the first visible view in the stack.
-	 * When new position data is given then position data of currently visible panel will be updated.
+	 * Updates the position of the balloon using the position data of the first visible view in the stack.
+	 * When new position data is given, the position data of the currently visible view will be updated.
 	 *
 	 * @param {module:utils/dom/position~Options} [position] position options.
 	 */
 	updatePosition( position ) {
 		if ( position ) {
-			this._stack.get( this.visibleView ).position = position;
+			this._visibleStack.get( this.visibleView ).position = position;
 		}
 
 		this.view.pin( this._getBalloonPosition() );
+		this._fakePanelsView.updatePosition();
+	}
+
+	/**
+	 * Shows the last view from the stack of a given ID.
+	 *
+	 * @param {String} id
+	 */
+	showStack( id ) {
+		this.visibleStack = id;
+		const stack = this._idToStack.get( id );
+
+		if ( !stack ) {
+			/**
+			 * Trying to show a stack that does not exist.
+			 *
+			 * @error contextualballoon-showstack-stack-not-exist
+			 */
+			throw new CKEditorError(
+				'contextualballoon-showstack-stack-not-exist: Cannot show a stack that does not exist.',
+				this
+			);
+		}
+
+		if ( this._visibleStack === stack ) {
+			return;
+		}
+
+		this._showView( Array.from( stack.values() ).pop() );
 	}
 
 	/**
-	 * Sets the view as a content of the balloon and attaches balloon using position
+	 * Returns the stack of the currently visible view.
+	 *
+	 * @private
+	 * @type {Set}
+	 */
+	get _visibleStack() {
+		return this._viewToStack.get( this.visibleView );
+	}
+
+	/**
+	 * Returns the ID of the given stack.
+	 *
+	 * @private
+	 * @param {Set} stack
+	 * @returns {String}
+	 */
+	_getStackId( stack ) {
+		const entry = Array.from( this._idToStack.entries() ).find( entry => entry[ 1 ] === stack );
+
+		return entry[ 0 ];
+	}
+
+	/**
+	 * Shows the last view from the next stack.
+	 *
+	 * @private
+	 */
+	_showNextStack() {
+		const stacks = Array.from( this._idToStack.values() );
+
+		let nextIndex = stacks.indexOf( this._visibleStack ) + 1;
+
+		if ( !stacks[ nextIndex ] ) {
+			nextIndex = 0;
+		}
+
+		this.showStack( this._getStackId( stacks[ nextIndex ] ) );
+	}
+
+	/**
+	 * Shows the last view from the previous stack.
+	 *
+	 * @private
+	 */
+	_showPrevStack() {
+		const stacks = Array.from( this._idToStack.values() );
+
+		let nextIndex = stacks.indexOf( this._visibleStack ) - 1;
+
+		if ( !stacks[ nextIndex ] ) {
+			nextIndex = stacks.length - 1;
+		}
+
+		this.showStack( this._getStackId( stacks[ nextIndex ] ) );
+	}
+
+	/**
+	 * Creates a rotator view.
+	 *
+	 * @private
+	 * @returns {module:ui/panel/balloon/contextualballoon~RotatorView}
+	 */
+	_createRotatorView() {
+		const view = new RotatorView( this.editor.locale );
+		const t = this.editor.locale.t;
+
+		this.view.content.add( view );
+
+		// Hide navigation when there is only a one stack & not in single view mode.
+		view.bind( 'isNavigationVisible' ).to( this, '_numberOfStacks', this, '_singleViewMode', ( value, isSingleViewMode ) => {
+			return !isSingleViewMode && value > 1;
+		} );
+
+		// Update balloon position after toggling navigation.
+		view.on( 'change:isNavigationVisible', () => ( this.updatePosition() ), { priority: 'low' } );
+
+		// Update stacks counter value.
+		view.bind( 'counter' ).to( this, 'visibleView', this, '_numberOfStacks', ( visibleView, numberOfStacks ) => {
+			if ( numberOfStacks < 2 ) {
+				return '';
+			}
+
+			const current = Array.from( this._idToStack.values() ).indexOf( this._visibleStack ) + 1;
+
+			return t( '%0 of %1', [ current, numberOfStacks ] );
+		} );
+
+		view.buttonNextView.on( 'execute', () => {
+			// When current view has a focus then move focus to the editable before removing it,
+			// otherwise editor will lost focus.
+			if ( view.focusTracker.isFocused ) {
+				this.editor.editing.view.focus();
+			}
+
+			this._showNextStack();
+		} );
+
+		view.buttonPrevView.on( 'execute', () => {
+			// When current view has a focus then move focus to the editable before removing it,
+			// otherwise editor will lost focus.
+			if ( view.focusTracker.isFocused ) {
+				this.editor.editing.view.focus();
+			}
+
+			this._showPrevStack();
+		} );
+
+		return view;
+	}
+
+	/**
+	 * @returns {module:ui/view~View}
+	 */
+	_createFakePanelsView() {
+		const view = new FakePanelsView( this.editor.locale, this.view );
+
+		view.bind( 'numberOfPanels' ).to( this, '_numberOfStacks', this, '_singleViewMode', ( number, isSingleViewMode ) => {
+			const showPanels = !isSingleViewMode && number >= 2;
+
+			return showPanels ? Math.min( number - 1, 2 ) : 0;
+		} );
+
+		view.listenTo( this.view, 'change:top', () => view.updatePosition() );
+		view.listenTo( this.view, 'change:left', () => view.updatePosition() );
+
+		this.editor.ui.view.body.add( view );
+
+		return view;
+	}
+
+	/**
+	 * Sets the view as the content of the balloon and attaches the balloon using position
 	 * options of the first view.
 	 *
 	 * @private
 	 * @param {Object} data Configuration.
-	 * @param {module:ui/view~View} [data.view] View to show in the balloon.
-	 * @param {String} [data.balloonClassName=''] Additional class name which will added to the {#_balloon} view.
+	 * @param {module:ui/view~View} [data.view] The view to show in the balloon.
+	 * @param {String} [data.balloonClassName=''] Additional class name which will be added to the {@link #view balloon}.
+	 * @param {Boolean} [data.withArrow=true] Whether the {@link #view balloon} should be rendered with an arrow.
 	 */
-	_show( { view, balloonClassName = '' } ) {
-		this.view.className = balloonClassName;
+	_showView( { view, balloonClassName = '', withArrow = true, singleViewMode = false } ) {
+		this.view.class = balloonClassName;
+		this.view.withArrow = withArrow;
 
-		this.view.content.add( view );
+		this._rotatorView.showView( view );
+		this.visibleView = view;
 		this.view.pin( this._getBalloonPosition() );
+		this._fakePanelsView.updatePosition();
+
+		if ( singleViewMode ) {
+			this._singleViewMode = true;
+		}
 	}
 
 	/**
 	 * Returns position options of the last view in the stack.
-	 * This keeps the balloon in the same position when view is changed.
+	 * This keeps the balloon in the same position when the view is changed.
 	 *
 	 * @private
 	 * @returns {module:utils/dom/position~Options}
 	 */
 	_getBalloonPosition() {
-		let position = Array.from( this._stack.values() ).pop().position;
+		let position = Array.from( this._visibleStack.values() ).pop().position;
 
 		// Use the default limiter if none has been specified.
 		if ( position && !position.limiter ) {
@@ -232,3 +508,269 @@ export default class ContextualBalloon extends Plugin {
 		return position;
 	}
 }
+
+/**
+ * Rotator view is a helper class for the {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon ContextualBalloon}.
+ * It is used for displaying the last view from the current stack and providing navigation buttons for switching stacks.
+ * See the {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon ContextualBalloon} documentation to learn more.
+ *
+ * @extends module:ui/view~View
+ */
+class RotatorView extends View {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( locale ) {
+		super( locale );
+
+		const t = locale.t;
+		const bind = this.bindTemplate;
+
+		/**
+		 * Defines whether navigation is visible or not.
+		 *
+		 * @member {Boolean} #isNavigationVisible
+		 */
+		this.set( 'isNavigationVisible', true );
+
+		/**
+		 * Used for checking if a view is focused or not.
+		 *
+		 * @type {module:utils/focustracker~FocusTracker}
+		 */
+		this.focusTracker = new FocusTracker();
+
+		/**
+		 * Navigation button for switching the stack to the previous one.
+		 *
+		 * @type {module:ui/button/buttonview~ButtonView}
+		 */
+		this.buttonPrevView = this._createButtonView( t( 'Previous' ), prevIcon );
+
+		/**
+		 * Navigation button for switching the stack to the next one.
+		 *
+		 * @type {module:ui/button/buttonview~ButtonView}
+		 */
+		this.buttonNextView = this._createButtonView( t( 'Next' ), nextIcon );
+
+		/**
+		 * A collection of the child views that creates the rotator content.
+		 *
+		 * @readonly
+		 * @type {module:ui/viewcollection~ViewCollection}
+		 */
+		this.content = this.createCollection();
+
+		this.setTemplate( {
+			tag: 'div',
+			attributes: {
+				class: [
+					'ck',
+					'ck-balloon-rotator'
+				],
+				'z-index': '-1'
+			},
+			children: [
+				{
+					tag: 'div',
+					attributes: {
+						class: [
+							'ck-balloon-rotator__navigation',
+							bind.to( 'isNavigationVisible', value => value ? '' : 'ck-hidden' )
+						]
+					},
+					children: [
+						this.buttonPrevView,
+						{
+							tag: 'span',
+
+							attributes: {
+								class: [
+									'ck-balloon-rotator__counter'
+								]
+							},
+
+							children: [
+								{
+									text: bind.to( 'counter' )
+								}
+							]
+						},
+						this.buttonNextView,
+					]
+				},
+				{
+					tag: 'div',
+					attributes: {
+						class: 'ck-balloon-rotator__content'
+					},
+					children: this.content
+				}
+			]
+		} );
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	render() {
+		super.render();
+
+		this.focusTracker.add( this.element );
+	}
+
+	/**
+	 * Shows a given view.
+	 *
+	 * @param {module:ui/view~View} view The view to show.
+	 */
+	showView( view ) {
+		this.hideView();
+		this.content.add( view );
+	}
+
+	/**
+	 * Hides the currently displayed view.
+	 */
+	hideView() {
+		this.content.clear();
+	}
+
+	/**
+	 * Creates a navigation button view.
+	 *
+	 * @private
+	 * @param {String} label The button label.
+	 * @param {String} icon The button icon.
+	 * @returns {module:ui/button/buttonview~ButtonView}
+	 */
+	_createButtonView( label, icon ) {
+		const view = new ButtonView( this.locale );
+
+		view.set( {
+			label,
+			icon,
+			tooltip: true
+		} );
+
+		return view;
+	}
+}
+
+// Displays additional layers under the balloon when multiple stacks are added to the balloon.
+//
+// @private
+// @extends module:ui/view~View
+class FakePanelsView extends View {
+	// @inheritDoc
+	constructor( locale, balloonPanelView ) {
+		super( locale );
+
+		const bind = this.bindTemplate;
+
+		// Fake panels top offset.
+		//
+		// @observable
+		// @member {Number} #top
+		this.set( 'top', 0 );
+
+		// Fake panels left offset.
+		//
+		// @observable
+		// @member {Number} #left
+		this.set( 'left', 0 );
+
+		// Fake panels height.
+		//
+		// @observable
+		// @member {Number} #height
+		this.set( 'height', 0 );
+
+		// Fake panels width.
+		//
+		// @observable
+		// @member {Number} #width
+		this.set( 'width', 0 );
+
+		// Number of rendered fake panels.
+		//
+		// @observable
+		// @member {Number} #numberOfPanels
+		this.set( 'numberOfPanels', 0 );
+
+		// Collection of the child views which creates fake panel content.
+		//
+		// @readonly
+		// @type {module:ui/viewcollection~ViewCollection}
+		this.content = this.createCollection();
+
+		// Context.
+		//
+		// @private
+		// @type {module:ui/panel/balloon/balloonpanelview~BalloonPanelView}
+		this._balloonPanelView = balloonPanelView;
+
+		this.setTemplate( {
+			tag: 'div',
+			attributes: {
+				class: [
+					'ck-fake-panel',
+					bind.to( 'numberOfPanels', number => number ? '' : 'ck-hidden' )
+				],
+				style: {
+					top: bind.to( 'top', toPx ),
+					left: bind.to( 'left', toPx ),
+					width: bind.to( 'width', toPx ),
+					height: bind.to( 'height', toPx )
+				}
+			},
+			children: this.content
+		} );
+
+		this.on( 'change:numberOfPanels', ( evt, name, next, prev ) => {
+			if ( next > prev ) {
+				this._addPanels( next - prev );
+			} else {
+				this._removePanels( prev - next );
+			}
+
+			this.updatePosition();
+		} );
+	}
+
+	// @private
+	// @param {Number} number
+	_addPanels( number ) {
+		while ( number-- ) {
+			const view = new View();
+
+			view.setTemplate( { tag: 'div' } );
+
+			this.content.add( view );
+			this.registerChild( view );
+		}
+	}
+
+	// @private
+	// @param {Number} number
+	_removePanels( number ) {
+		while ( number-- ) {
+			const view = this.content.last;
+
+			this.content.remove( view );
+			this.deregisterChild( view );
+			view.destroy();
+		}
+	}
+
+	// Updates coordinates of fake panels.
+	updatePosition() {
+		if ( this.numberOfPanels ) {
+			const { top, left } = this._balloonPanelView;
+			const { width, height } = new Rect( this._balloonPanelView.element );
+
+			Object.assign( this, { top, left, width, height } );
+		}
+	}
+}

+ 2 - 2
packages/ckeditor5-ui/src/panel/sticky/stickypanelview.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

+ 33 - 21
packages/ckeditor5-ui/src/template.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -15,7 +15,6 @@ import EmitterMixin from '@ckeditor/ckeditor5-utils/src/emittermixin';
 import View from './view';
 import ViewCollection from './viewcollection';
 import isNode from '@ckeditor/ckeditor5-utils/src/dom/isnode';
-import log from '@ckeditor/ckeditor5-utils/src/log';
 import { isObject, cloneDeepWith } from 'lodash-es';
 
 const xhtmlNs = 'http://www.w3.org/1999/xhtml';
@@ -39,7 +38,7 @@ const xhtmlNs = 'http://www.w3.org/1999/xhtml';
  *			},
  *			on: {
  *				click: bind.to( 'clicked' )
- *			}
+ *			},
  *			children: [
  *				'A paragraph.'
  *			]
@@ -147,9 +146,11 @@ export default class Template {
 	/**
 	 * Applies the template to an existing DOM Node, either HTML element or text.
 	 *
-	 * **Note:** No new DOM nodes will be created. Applying extends
-	 * {@link module:ui/template~TemplateDefinition attributes} and
-	 * {@link module:ui/template~TemplateDefinition event listeners} only.
+	 * **Note:** No new DOM nodes will be created. Applying extends:
+	 *
+	 * {@link module:ui/template~TemplateDefinition attributes},
+	 * {@link module:ui/template~TemplateDefinition event listeners}, and
+	 * `textContent` of {@link module:ui/template~TemplateDefinition children} only.
 	 *
 	 * **Note:** Existing `class` and `style` attributes are extended when a template
 	 * is applied to an HTML element, while other attributes and `textContent` are overridden.
@@ -158,22 +159,24 @@ export default class Template {
 	 * {@link module:ui/template~Template#revert} method.
 	 *
 	 *		const element = document.createElement( 'div' );
+	 *		const observable = new Model( { divClass: 'my-div' } );
+	 *		const emitter = Object.create( EmitterMixin );
 	 *		const bind = Template.bind( observable, emitter );
 	 *
 	 *		new Template( {
-	 *			attrs: {
+	 *			attributes: {
 	 *				id: 'first-div',
 	 *				class: bind.to( 'divClass' )
 	 *			},
 	 *			on: {
 	 *				click: bind( 'elementClicked' ) // Will be fired by the observable.
-	 *			}
+	 *			},
 	 *			children: [
 	 *				'Div text.'
 	 *			]
 	 *		} ).apply( element );
 	 *
-	 *		element.outerHTML == "<div id="first-div" class="my-div">Div text.</div>"
+	 *		console.log( element.outerHTML ); // -> '<div id="first-div" class="my-div"></div>'
 	 *
 	 * @see module:ui/template~Template#render
 	 * @see module:ui/template~Template#revert
@@ -204,7 +207,10 @@ export default class Template {
 			 *
 			 * @error ui-template-revert-not-applied
 			 */
-			throw new CKEditorError( 'ui-template-revert-not-applied: Attempting to revert a template which has not been applied yet.' );
+			throw new CKEditorError(
+				'ui-template-revert-not-applied: Attempting to revert a template which has not been applied yet.',
+				[ this, node ]
+			);
 		}
 
 		this._revertTemplateFromNode( node, this._revertData );
@@ -266,7 +272,7 @@ export default class Template {
 	 *		const bind = Template.bind( observable, emitter );
 	 *
 	 *		new Template( {
-	 *			attrs: {
+	 *			attributes: {
 	 *				// Binds the element "class" attribute to observable#classAttribute.
 	 *				class: bind.to( 'classAttribute' )
 	 *			}
@@ -374,7 +380,10 @@ export default class Template {
 			 *
 			 * @error template-extend-render
 			 */
-			log.warn( 'template-extend-render: Attempting to extend a template which has already been rendered.' );
+			throw new CKEditorError(
+				'template-extend-render: Attempting to extend a template which has already been rendered.',
+				[ this, template ]
+			);
 		}
 
 		extendTemplate( template, normalize( clone( def ) ) );
@@ -405,7 +414,8 @@ export default class Template {
 			 * @error ui-template-wrong-syntax
 			 */
 			throw new CKEditorError(
-				'ui-template-wrong-syntax: Node definition must have either "tag" or "text" when rendering a new Node.'
+				'ui-template-wrong-syntax: Node definition must have either "tag" or "text" when rendering a new Node.',
+				this
 			);
 		}
 
@@ -1211,14 +1221,14 @@ function normalize( def ) {
 //			}
 //		}
 //
-// @param {Object} attrs
-function normalizeAttributes( attrs ) {
-	for ( const a in attrs ) {
-		if ( attrs[ a ].value ) {
-			attrs[ a ].value = [].concat( attrs[ a ].value );
+// @param {Object} attributes
+function normalizeAttributes( attributes ) {
+	for ( const a in attributes ) {
+		if ( attributes[ a ].value ) {
+			attributes[ a ].value = [].concat( attributes[ a ].value );
 		}
 
-		arrayify( attrs, a );
+		arrayify( attributes, a );
 	}
 }
 
@@ -1352,6 +1362,7 @@ function extendObjectValueArray( obj, ext ) {
 //
 // @param {module:ui/template~Template} def A template instance to be extended.
 // @param {module:ui/template~TemplateDefinition} def A definition which is to extend the template instance.
+// @param {Object} Error context.
 function extendTemplate( template, def ) {
 	if ( def.attributes ) {
 		if ( !template.attributes ) {
@@ -1381,7 +1392,8 @@ function extendTemplate( template, def ) {
 			 * @error ui-template-extend-children-mismatch
 			 */
 			throw new CKEditorError(
-				'ui-template-extend-children-mismatch: The number of children in extended definition does not match.'
+				'ui-template-extend-children-mismatch: The number of children in extended definition does not match.',
+				template
 			);
 		}
 

+ 10 - 7
packages/ckeditor5-ui/src/toolbar/balloon/balloontoolbar.js

@@ -1,6 +1,6 @@
 /**
- * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**
@@ -52,7 +52,7 @@ export default class BalloonToolbar extends Plugin {
 		this.toolbarView = this._createToolbarView();
 
 		/**
-		 * Tracks the focus of the {@link module:ui/editableui/editableuiview~EditableUIView#editableElement}
+		 * Tracks the focus of the {@link module:core/editor/editorui~EditorUI#getEditableElement editable element}
 		 * and the {@link #toolbarView}. When both are blurred then the toolbar should hide.
 		 *
 		 * @readonly
@@ -61,8 +61,8 @@ export default class BalloonToolbar extends Plugin {
 		this.focusTracker = new FocusTracker();
 
 		// Wait for the EditorUI#init. EditableElement is not available before.
-		editor.once( 'uiReady', () => {
-			this.focusTracker.add( editor.ui.view.editableElement );
+		editor.ui.once( 'ready', () => {
+			this.focusTracker.add( editor.ui.getEditableElement() );
 			this.focusTracker.add( this.toolbarView.element );
 		} );
 
@@ -254,9 +254,12 @@ export default class BalloonToolbar extends Plugin {
 	 * @inheritDoc
 	 */
 	destroy() {
-		this._fireSelectionChangeDebounced.cancel();
-		this.stopListening();
 		super.destroy();
+
+		this.stopListening();
+		this._fireSelectionChangeDebounced.cancel();
+		this.toolbarView.destroy();
+		this.focusTracker.destroy();
 	}
 
 	/**

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

@@ -1,5 +1,6 @@
 /**
- * Copyright (c) 2016 - 2017, CKSource - Frederico Knabben. All rights reserved.
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

Nem az összes módosított fájl került megjelenítésre, mert túl sok fájl változott