@ckeditor/ckeditor5-list-multi-level 47.6.1-alpha.1 → 48.0.0-alpha.0

package/ckeditor5-metadata.json

@@ -5,7 +5,7 @@
 			"className": "MultiLevelList",
 			"description": "Multi-level lists allow the user to set different markers (symbols, text or numbers) to display at each level of the list.",
 			"docs": "features/lists/multi-level-lists.html",
-			"path": "src/multilevellist.js",
+			"path": "src/multilevellist.ts",
 			"requires": [
 				"List"
 			],
@@ -14,7 +14,7 @@
 					"type": "Button",
 					"name": "multiLevelList",
 					"label": "Multi-level List",
-					"iconPath": "@ckeditor/ckeditor5-icons/theme/icons/multi-level-list.svg"
+					"iconName": "IconMultiLevelList"
 				}
 			],
 			"htmlOutput": [
@@ -26,7 +26,10 @@
 					"attributes": [
 						"start"
 					],
-					"classes": [ "multi-level-list", "legal-list" ],
+					"classes": [
+						"multi-level-list",
+						"legal-list"
+					],
 					"styles": "list-style-type"
 				},
 				{

package/dist/index-content.css

@@ -3,87 +3,76 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
 .ck-content .multi-level-list{
-	list-style:none;
+  list-style:none;
 }
 
 .ck-content .multi-level-list li{
-		position:relative;
-	}
+  position:relative;
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker{
-			pointer-events:none;
-		}
+  pointer-events:none;
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker::selection{
-				background-color:transparent;
-			}
+  background-color:#0000;
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker:not(:has(span)){
-				position:absolute;
-				padding-inline-end:5px;
-				transform:translate(-100%, 0);
-			}
+  padding-inline-end:5px;
+  position:absolute;
+  transform:translate(-100%);
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker:has(span){
-				position:relative;
-				width:0;
-				display:inline-block;
-				text-wrap:nowrap;
-			}
-
-.ck-content .multi-level-list li .multi-level-list__marker:has(span)::before,
-				.ck-content .multi-level-list li .multi-level-list__marker:has(span) > span{
-					position:absolute;
-					padding-inline-end:5px;
-					transform:translate(-100%, 0);
-				}
-
-.ck-content .multi-level-list li.ck-list-marker-bold > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-bold > * > .multi-level-list__marker{
-			font-weight:bold;
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-italic > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-italic > * > .multi-level-list__marker{
-			font-style:italic;
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-color > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-color > * > .multi-level-list__marker{
-			color:var(--ck-content-list-marker-color);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-family > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-family > * > .multi-level-list__marker{
-			font-family:var(--ck-content-list-marker-font-family);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size > * > .multi-level-list__marker{
-			font-size:var(--ck-content-list-marker-font-size);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-tiny > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-tiny > * > .multi-level-list__marker{
-			font-size:var(--ck-content-font-size-tiny);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-small > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-small > * > .multi-level-list__marker{
-			font-size:var(--ck-content-font-size-small);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-big > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-big > * > .multi-level-list__marker{
-			font-size:var(--ck-content-font-size-big);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-huge > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-huge > * > .multi-level-list__marker{
-			font-size:var(--ck-content-font-size-huge);
-		}
-
-.ck-content[dir='rtl'] .multi-level-list li .multi-level-list__marker:not(:has(span)),
-			.ck-content[dir='rtl'] .multi-level-list li .multi-level-list__marker > span{
-				transform:translate(100%, 0);
-			}
+  text-wrap:nowrap;
+  width:0;
+  display:inline-block;
+  position:relative;
+}
+
+.ck-content .multi-level-list li .multi-level-list__marker:has(span):before, .ck-content .multi-level-list li .multi-level-list__marker:has(span) > span{
+  padding-inline-end:5px;
+  position:absolute;
+  transform:translate(-100%);
+}
+
+.ck-content .multi-level-list li.ck-list-marker-bold > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-bold > * > .multi-level-list__marker{
+  font-weight:bold;
+}
+
+.ck-content .multi-level-list li.ck-list-marker-italic > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-italic > * > .multi-level-list__marker{
+  font-style:italic;
+}
+
+.ck-content .multi-level-list li.ck-list-marker-color > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-color > * > .multi-level-list__marker{
+  color:var(--ck-content-list-marker-color);
+}
+
+.ck-content .multi-level-list li.ck-list-marker-font-family > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-family > * > .multi-level-list__marker{
+  font-family:var(--ck-content-list-marker-font-family);
+}
+
+.ck-content .multi-level-list li.ck-list-marker-font-size > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size > * > .multi-level-list__marker{
+  font-size:var(--ck-content-list-marker-font-size);
+}
+
+.ck-content .multi-level-list li.ck-list-marker-font-size-tiny > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-tiny > * > .multi-level-list__marker{
+  font-size:var(--ck-content-font-size-tiny);
+}
+
+.ck-content .multi-level-list li.ck-list-marker-font-size-small > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-small > * > .multi-level-list__marker{
+  font-size:var(--ck-content-font-size-small);
+}
+
+.ck-content .multi-level-list li.ck-list-marker-font-size-big > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-big > * > .multi-level-list__marker{
+  font-size:var(--ck-content-font-size-big);
+}
+
+.ck-content .multi-level-list li.ck-list-marker-font-size-huge > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-huge > * > .multi-level-list__marker{
+  font-size:var(--ck-content-font-size-huge);
+}
+
+.ck-content[dir="rtl"] .multi-level-list li .multi-level-list__marker:not(:has(span)), .ck-content[dir="rtl"] .multi-level-list li .multi-level-list__marker:before, .ck-content[dir="rtl"] .multi-level-list li .multi-level-list__marker > span{
+  transform:translate(100%);
+}

package/dist/index-editor.css

@@ -2,55 +2,39 @@
  * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
-.ck-editor__editable .multi-level-list li .multi-level-list__marker::before{
-				content:attr(data-multi-level-list-marker);
-			}
-
-[dir="rtl"] .ck-content .multi-level-list li .multi-level-list__marker:not(:has(span)){
-					transform:translate(100%, 0);
-	}
-
-[dir="rtl"] .ck-content .multi-level-list li .multi-level-list__marker:has(span)::before, [dir="rtl"] .ck-content .multi-level-list li .multi-level-list__marker:has(span) > span{
-						transform:translate(100%, 0);
-	}
-
+.ck-editor__editable .multi-level-list li .multi-level-list__marker:before{
+  content:attr(data-multi-level-list-marker);
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles{
-		padding:var(--ck-spacing-large);
-	}
-
+  padding:var(--ck-spacing-large);
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles > *{
-			min-width:14em;
-		}
-
+  min-width:14em;
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles > * + *{
-				margin-top:var(--ck-spacing-standard);
-			}
-
+  margin-top:var(--ck-spacing-standard);
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-multi-level-list-styles{
-			grid-template-columns:repeat( 4, auto);
-		}
-
+  grid-template-columns:repeat(4, auto);
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-collapsible{
-			border-top:1px solid var(--ck-color-base-border);
-		}
-
+  border-top:1px solid var(--ck-color-base-border);
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-collapsible > .ck-collapsible__children > *{
-					width:100%;
-				}
-
+  width:100%;
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-collapsible > .ck-collapsible__children > * + *{
-						margin-top:var(--ck-spacing-standard);
-					}
-
+  margin-top:var(--ck-spacing-standard);
+}
 
 .ck.ck-multi-level-list-properties .ck.ck-multi-level-list-properties__start-index .ck-input{
-		min-width:auto;
-		width:100%;
-	}
+  width:100%;
+  min-width:auto;
+}

package/dist/index.css

@@ -2,188 +2,114 @@
  * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
  */
-/*
- * What you're currently looking at is the source code of a legally protected, proprietary software.
- * CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
- * all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
- *
- * Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
-
-/*
- * Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
-
-.ck-editor__editable .multi-level-list li .multi-level-list__marker::before {
-				/* Use CSS to display multi-level list markers to prevent breaking the composition.
-				See https://github.com/ckeditor/ckeditor5-commercial/issues/6873. */
-				content: attr(data-multi-level-list-marker);
-			}
+.ck-editor__editable .multi-level-list li .multi-level-list__marker:before {
+  content: attr(data-multi-level-list-marker);
+}
 
 .ck-content .multi-level-list {
-	list-style: none;
+  list-style: none;
 }
 
 .ck-content .multi-level-list li {
-		position: relative;
-	}
+  position: relative;
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker {
-			pointer-events: none;
-
-			/* Do not show list markers as selected. */
-		}
+  pointer-events: none;
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker::selection {
-				background-color: transparent;
-			}
-
-/* Marker next to a block widget or old marker format (legacy content without span element in marker) */
+  background-color: #0000;
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker:not(:has(span)) {
-				position: absolute;
-				padding-inline-end: 5px;
-				transform: translate(-100%, 0);
-
-				/* RTL styles */
-			}
-
-[dir="rtl"] .ck-content .multi-level-list li .multi-level-list__marker:not(:has(span)) {
-					transform: translate(100%, 0);
-	}
-
-/* Marker next to a paragraph like element in a new marker format with marker styling */
+  padding-inline-end: 5px;
+  position: absolute;
+  transform: translate(-100%);
+}
 
 .ck-content .multi-level-list li .multi-level-list__marker:has(span) {
-				position: relative;
-				width: 0;
-				display: inline-block;
-				text-wrap: nowrap;
-			}
-
-.ck-content .multi-level-list li .multi-level-list__marker:has(span)::before,
-				.ck-content .multi-level-list li .multi-level-list__marker:has(span) > span {
-					position: absolute;
-					padding-inline-end: 5px;
-					transform: translate(-100%, 0);
-
-					/* RTL styles */
-				}
-
-[dir="rtl"] .ck-content .multi-level-list li .multi-level-list__marker:has(span)::before, [dir="rtl"] .ck-content .multi-level-list li .multi-level-list__marker:has(span) > span {
-						transform: translate(100%, 0);
-	}
-
-.ck-content .multi-level-list li.ck-list-marker-bold > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-bold > * > .multi-level-list__marker {
-			font-weight: bold;
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-italic > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-italic > * > .multi-level-list__marker {
-			font-style: italic;
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-color > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-color > * > .multi-level-list__marker {
-			color: var(--ck-content-list-marker-color);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-family > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-family > * > .multi-level-list__marker {
-			font-family: var(--ck-content-list-marker-font-family);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size > * > .multi-level-list__marker {
-			font-size: var(--ck-content-list-marker-font-size);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-tiny > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-tiny > * > .multi-level-list__marker {
-			font-size: var(--ck-content-font-size-tiny);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-small > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-small > * > .multi-level-list__marker {
-			font-size: var(--ck-content-font-size-small);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-big > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-big > * > .multi-level-list__marker {
-			font-size: var(--ck-content-font-size-big);
-		}
-
-.ck-content .multi-level-list li.ck-list-marker-font-size-huge > .multi-level-list__marker,
-		.ck-content .multi-level-list li.ck-list-marker-font-size-huge > * > .multi-level-list__marker {
-			font-size: var(--ck-content-font-size-huge);
-		}
-
-.ck-content[dir='rtl'] .multi-level-list li .multi-level-list__marker:not(:has(span)),
-			.ck-content[dir='rtl'] .multi-level-list li .multi-level-list__marker > span {
-				transform: translate(100%, 0);
-			}
-
-/*
- * What you're currently looking at is the source code of a legally protected, proprietary software.
- * CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
- * all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
- *
- * Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
+  text-wrap: nowrap;
+  width: 0;
+  display: inline-block;
+  position: relative;
+}
 
+.ck-content .multi-level-list li .multi-level-list__marker:has(span):before, .ck-content .multi-level-list li .multi-level-list__marker:has(span) > span {
+  padding-inline-end: 5px;
+  position: absolute;
+  transform: translate(-100%);
+}
 
-/* When there are no list styles and there is no collapsible. */
+.ck-content .multi-level-list li.ck-list-marker-bold > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-bold > * > .multi-level-list__marker {
+  font-weight: bold;
+}
 
+.ck-content .multi-level-list li.ck-list-marker-italic > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-italic > * > .multi-level-list__marker {
+  font-style: italic;
+}
 
-.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles {
-		padding: var(--ck-spacing-large);
-	}
+.ck-content .multi-level-list li.ck-list-marker-color > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-color > * > .multi-level-list__marker {
+  color: var(--ck-content-list-marker-color);
+}
 
+.ck-content .multi-level-list li.ck-list-marker-font-family > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-family > * > .multi-level-list__marker {
+  font-family: var(--ck-content-list-marker-font-family);
+}
 
-.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles > * {
-			min-width: 14em;
-		}
+.ck-content .multi-level-list li.ck-list-marker-font-size > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size > * > .multi-level-list__marker {
+  font-size: var(--ck-content-list-marker-font-size);
+}
 
+.ck-content .multi-level-list li.ck-list-marker-font-size-tiny > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-tiny > * > .multi-level-list__marker {
+  font-size: var(--ck-content-font-size-tiny);
+}
 
-.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles > * + * {
-				margin-top: var(--ck-spacing-standard);
-			}
+.ck-content .multi-level-list li.ck-list-marker-font-size-small > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-small > * > .multi-level-list__marker {
+  font-size: var(--ck-content-font-size-small);
+}
 
+.ck-content .multi-level-list li.ck-list-marker-font-size-big > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-big > * > .multi-level-list__marker {
+  font-size: var(--ck-content-font-size-big);
+}
 
-/*
-	* When the numbered list property field (start at) should be displayed,
-	* more horizontal space is needed. Reconfigure the style grid to create that space.
-	*/
+.ck-content .multi-level-list li.ck-list-marker-font-size-huge > .multi-level-list__marker, .ck-content .multi-level-list li.ck-list-marker-font-size-huge > * > .multi-level-list__marker {
+  font-size: var(--ck-content-font-size-huge);
+}
 
+.ck-content[dir="rtl"] .multi-level-list li .multi-level-list__marker:not(:has(span)), .ck-content[dir="rtl"] .multi-level-list li .multi-level-list__marker:before, .ck-content[dir="rtl"] .multi-level-list li .multi-level-list__marker > span {
+  transform: translate(100%);
+}
 
-.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-multi-level-list-styles {
-			grid-template-columns: repeat( 4, auto );
-		}
+.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles {
+  padding: var(--ck-spacing-large);
+}
 
+.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles > * {
+  min-width: 14em;
+}
 
-/* When list styles are rendered and property fields are in a collapsible. */
+.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_without-styles > * + * {
+  margin-top: var(--ck-spacing-standard);
+}
 
+.ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-multi-level-list-styles {
+  grid-template-columns: repeat(4, auto);
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-collapsible {
-			border-top: 1px solid var(--ck-color-base-border);
-		}
-
+  border-top: 1px solid var(--ck-color-base-border);
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-collapsible > .ck-collapsible__children > * {
-					width: 100%;
-				}
-
+  width: 100%;
+}
 
 .ck.ck-multi-level-list-properties.ck-multi-level-list-properties_with-multi-level-properties > .ck-collapsible > .ck-collapsible__children > * + * {
-						margin-top: var(--ck-spacing-standard);
-					}
-
+  margin-top: var(--ck-spacing-standard);
+}
 
 .ck.ck-multi-level-list-properties .ck.ck-multi-level-list-properties__start-index .ck-input {
-		min-width: auto;
-		width: 100%;
-	}
+  width: 100%;
+  min-width: auto;
+}