8
0
Просмотр исходного кода

Docs: Improved docs of the TableColorConfig.

Aleksander Nowodzinski 6 лет назад
Родитель
Сommit
048c209f9c

+ 7 - 55
packages/ckeditor5-table/src/table.js

@@ -65,26 +65,14 @@ export default class Table extends Plugin {
  */
 
 /**
- * Available colors defined as an array of strings or objects.
+ * An array of colors definitions (either strings or objects).
  *
- * Used by {@link module:table/table~TableConfig#tableProperties} and {@link module:table/table~TableConfig#tableCellProperties}
- * configurations.
- *
- * The default value registers the following colors:
- *
- *		const colorDefinitions = [
- *			{
- *				color: 'hsl(0, 0%, 0%)',
- *				label: 'Black'
- *			},
- *			{
- *				color: 'hsl(0, 0%, 30%)',
- *				label: 'Dim grey'
- *			},
+ *		const colors = [
  *			{
  *				color: 'hsl(0, 0%, 60%)',
  *				label: 'Grey'
  *			},
+ *			'hsl(0, 0%, 80%)',
  *			{
  *				color: 'hsl(0, 0%, 90%)',
  *				label: 'Light grey'
@@ -94,47 +82,11 @@ export default class Table extends Plugin {
  *				label: 'White',
  *				hasBorder: true
  *			},
- *			{
- *				color: 'hsl(0, 75%, 60%)',
- *				label: 'Red'
- *			},
- *			{
- *				color: 'hsl(30, 75%, 60%)',
- *				label: 'Orange'
- *			},
- *			{
- *				color: 'hsl(60, 75%, 60%)',
- *				label: 'Yellow'
- *			},
- *			{
- *				color: 'hsl(90, 75%, 60%)',
- *				label: 'Light green'
- *			},
- *			{
- *				color: 'hsl(120, 75%, 60%)',
- *				label: 'Green'
- *			},
- *			{
- *				color: 'hsl(150, 75%, 60%)',
- *				label: 'Aquamarine'
- *			},
- *			{
- *				color: 'hsl(180, 75%, 60%)',
- *				label: 'Turquoise'
- *			},
- *			{
- *				color: 'hsl(210, 75%, 60%)',
- *				label: 'Light blue'
- *			},
- *			{
- *				color: 'hsl(240, 75%, 60%)',
- *				label: 'Blue'
- *			},
- *			{
- *				color: 'hsl(270, 75%, 60%)',
- *				label: 'Purple'
- *			}
+ *			'#FF0000'
  *		]
  *
+ * Usually used as a configuration, for instance in {@link module:table/table~TableConfig#tableProperties}
+ * or {@link module:table/table~TableConfig#tableCellProperties}.
+ *
  * @typedef {Array.<String|Object>} module:table/table~TableColorConfig
  */

+ 66 - 0
packages/ckeditor5-table/src/tablecellproperties.js

@@ -50,6 +50,72 @@ export default class TableCellProperties extends Plugin {
  *
  * TODO: Mention {@link module:table/table~TableColorConfig}.
  *
+ * The default colors for both the background and the border are defined as follows:
+ *
+ *		[
+ *			{
+ *				color: 'hsl(0, 0%, 0%)',
+ *				label: 'Black'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 30%)',
+ *				label: 'Dim grey'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 60%)',
+ *				label: 'Grey'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 90%)',
+ *				label: 'Light grey'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 100%)',
+ *				label: 'White',
+ *				hasBorder: true
+ *			},
+ *			{
+ *				color: 'hsl(0, 75%, 60%)',
+ *				label: 'Red'
+ *			},
+ *			{
+ *				color: 'hsl(30, 75%, 60%)',
+ *				label: 'Orange'
+ *			},
+ *			{
+ *				color: 'hsl(60, 75%, 60%)',
+ *				label: 'Yellow'
+ *			},
+ *			{
+ *				color: 'hsl(90, 75%, 60%)',
+ *				label: 'Light green'
+ *			},
+ *			{
+ *				color: 'hsl(120, 75%, 60%)',
+ *				label: 'Green'
+ *			},
+ *			{
+ *				color: 'hsl(150, 75%, 60%)',
+ *				label: 'Aquamarine'
+ *			},
+ *			{
+ *				color: 'hsl(180, 75%, 60%)',
+ *				label: 'Turquoise'
+ *			},
+ *			{
+ *				color: 'hsl(210, 75%, 60%)',
+ *				label: 'Light blue'
+ *			},
+ *			{
+ *				color: 'hsl(240, 75%, 60%)',
+ *				label: 'Blue'
+ *			},
+ *			{
+ *				color: 'hsl(270, 75%, 60%)',
+ *				label: 'Purple'
+ *			}
+ *		]
+ *
  * **Note**: The colors configuration does not impact the data loaded into the editor;
  * it is reflected only in the UI.
  *

+ 68 - 0
packages/ckeditor5-table/src/tableproperties.js

@@ -49,6 +49,74 @@ export default class TableProperties extends Plugin {
  *			}
  *		};
  *
+ * TODO: Mention {@link module:table/table~TableColorConfig}.
+ *
+ * The default colors for both the background and the border are defined as follows:
+ *
+ *		[
+ *			{
+ *				color: 'hsl(0, 0%, 0%)',
+ *				label: 'Black'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 30%)',
+ *				label: 'Dim grey'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 60%)',
+ *				label: 'Grey'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 90%)',
+ *				label: 'Light grey'
+ *			},
+ *			{
+ *				color: 'hsl(0, 0%, 100%)',
+ *				label: 'White',
+ *				hasBorder: true
+ *			},
+ *			{
+ *				color: 'hsl(0, 75%, 60%)',
+ *				label: 'Red'
+ *			},
+ *			{
+ *				color: 'hsl(30, 75%, 60%)',
+ *				label: 'Orange'
+ *			},
+ *			{
+ *				color: 'hsl(60, 75%, 60%)',
+ *				label: 'Yellow'
+ *			},
+ *			{
+ *				color: 'hsl(90, 75%, 60%)',
+ *				label: 'Light green'
+ *			},
+ *			{
+ *				color: 'hsl(120, 75%, 60%)',
+ *				label: 'Green'
+ *			},
+ *			{
+ *				color: 'hsl(150, 75%, 60%)',
+ *				label: 'Aquamarine'
+ *			},
+ *			{
+ *				color: 'hsl(180, 75%, 60%)',
+ *				label: 'Turquoise'
+ *			},
+ *			{
+ *				color: 'hsl(210, 75%, 60%)',
+ *				label: 'Light blue'
+ *			},
+ *			{
+ *				color: 'hsl(240, 75%, 60%)',
+ *				label: 'Blue'
+ *			},
+ *			{
+ *				color: 'hsl(270, 75%, 60%)',
+ *				label: 'Purple'
+ *			}
+ *		]
+ *
  * **Note**: The colors configuration does not impact the data loaded into the editor;
  * it is reflected only in the UI.
  *