@ckeditor/ckeditor5-list 47.5.0 → 47.6.0-alpha.0

package/dist/index.js

@@ -9,7 +9,8 @@ import { toArray, first, uid, env, CKEditorError, FocusTracker, KeystrokeHandler
 import { _normalizeFontSizeOptions } from '@ckeditor/ckeditor5-font/dist/index.js';
 import { ClipboardPipeline } from '@ckeditor/ckeditor5-clipboard/dist/index.js';
 import { ButtonView, MenuBarMenuListItemButtonView, View, ViewCollection, FocusCycler, addKeyboardHandlingForGrid, CollapsibleView, LabeledFieldView, createLabeledInputNumber, SwitchButtonView, createDropdown, SplitButtonView, MenuBarMenuView, focusChildOnDropdownOpen } from '@ckeditor/ckeditor5-ui/dist/index.js';
-import { IconNumberedList, IconBulletedList, IconListStyleDisc, IconListStyleCircle, IconListStyleSquare, IconListStyleDecimal, IconListStyleDecimalLeadingZero, IconListStyleLowerRoman, IconListStyleUpperRoman, IconListStyleLowerLatin, IconListStyleUpperLatin, IconTodoList } from '@ckeditor/ckeditor5-icons/dist/index.js';
+import { IconNumberedList, IconBulletedList, IconListStyleDisc, IconListStyleCircle, IconListStyleSquare, IconListStyleDecimal, IconListStyleDecimalLeadingZero, IconListStyleLowerRoman, IconListStyleUpperRoman, IconListStyleLowerLatin, IconListStyleUpperLatin, IconListStyleArabicIndic, IconTodoList } from '@ckeditor/ckeditor5-icons/dist/index.js';
+import { pick } from 'es-toolkit/compat';
 import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from '@ckeditor/ckeditor5-engine/dist/index.js';
 
 /**
@@ -427,14 +428,15 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
  * @param options Additional options.
  * @param options.expand Whether should expand the list of blocks to include complete list items.
  * @param options.indentBy The number of levels the indentation should change (could be negative).
- */ function indentBlocks(blocks, writer, { expand, indentBy = 1 } = {}) {
+ * @param options.attributeNames List of attribute names to remove when a block leaves the list (when blockIndent < 0).
+ */ function indentBlocks(blocks, writer, { expand, indentBy = 1, attributeNames }) {
     blocks = toArray(blocks);
     // Expand the selected blocks to contain the whole list items.
     const allBlocks = expand ? expandListBlocksToCompleteItems(blocks) : blocks;
     for (const block of allBlocks){
         const blockIndent = block.getAttribute('listIndent') + indentBy;
         if (blockIndent < 0) {
-            removeListAttributes(block, writer);
+            removeListAttributes(block, writer, attributeNames);
         } else {
             writer.setAttribute('listIndent', blockIndent, block);
         }
@@ -448,7 +450,9 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
  * @internal
  * @param blocks The block or iterable of blocks.
  * @param writer The model writer.
- */ function outdentBlocksWithMerge(blocks, writer) {
+ * @param options Additional options.
+ * @param options.attributeNames List of attribute names to remove when a block leaves the list (when blockIndent < 0).
+ */ function outdentBlocksWithMerge(blocks, writer, { attributeNames }) {
     blocks = toArray(blocks);
     // Expand the selected blocks to contain the whole list items.
     const allBlocks = expandListBlocksToCompleteItems(blocks);
@@ -468,7 +472,7 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
         visited.add(block);
         const blockIndent = block.getAttribute('listIndent') - 1;
         if (blockIndent < 0) {
-            removeListAttributes(block, writer);
+            removeListAttributes(block, writer, attributeNames);
             continue;
         }
         // Merge with parent list item while outdenting and indent matches reference indent.
@@ -493,8 +497,9 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
  * @internal
  * @param blocks The block or iterable of blocks.
  * @param writer The model writer.
+ * @param attributeNames List of attribute names to remove.
  * @returns Array of altered blocks.
- */ function removeListAttributes(blocks, writer) {
+ */ function removeListAttributes(blocks, writer, attributeNames) {
     blocks = toArray(blocks);
     // Convert simple list items to plain paragraphs.
     for (const block of blocks){
@@ -505,7 +510,7 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
     // Remove list attributes.
     for (const block of blocks){
         for (const attributeKey of block.getAttributeKeys()){
-            if (attributeKey.startsWith('list')) {
+            if (attributeNames.includes(attributeKey)) {
                 writer.removeAttribute(attributeKey, block);
             }
         }
@@ -649,6 +654,18 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
  */ function isNumberedListType(listType) {
     return listType == 'numbered' || listType == 'customNumbered';
 }
+/**
+ * Checks if the given list item is the first item in the list.
+ *
+ * This function checks if there's any other list item before the given list item
+ * at the same indent level with the same list type.
+ */ function isFirstListItemInList(listItem) {
+    const previousItem = ListWalker.first(listItem, {
+        sameIndent: true,
+        sameAttributes: 'listType'
+    });
+    return !previousItem;
+}
 /**
  * Merges a given block to the given parent block if parent is a list item and there is no more blocks in the same item.
  */ function mergeListItemIfNotLast(block, parentBlock, writer) {
@@ -697,15 +714,20 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
 	 * @fires execute
 	 * @fires afterExecute
 	 */ execute() {
-        const model = this.editor.model;
+        const editor = this.editor;
+        const model = editor.model;
         const blocks = getSelectedListBlocks(model.document.selection);
+        const listEditing = editor.plugins.get('ListEditing');
+        const attributeNames = listEditing.getListAttributeNames();
         model.change((writer)=>{
             const changedBlocks = [];
             // Handle selection contained in the single list item and starting in the following blocks.
             if (isSingleListItem(blocks) && !isFirstBlockOfListItem(blocks[0])) {
                 // Allow increasing indent of following list item blocks.
                 if (this._direction == 'forward') {
-                    changedBlocks.push(...indentBlocks(blocks, writer));
+                    changedBlocks.push(...indentBlocks(blocks, writer, {
+                        attributeNames
+                    }));
                 }
                 // For indent make sure that indented blocks have a new ID.
                 // For outdent just split blocks from the list item (give them a new IDs).
@@ -714,10 +736,13 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
                 // Now just update the attributes of blocks.
                 if (this._direction == 'forward') {
                     changedBlocks.push(...indentBlocks(blocks, writer, {
-                        expand: true
+                        expand: true,
+                        attributeNames
                     }));
                 } else {
-                    changedBlocks.push(...outdentBlocksWithMerge(blocks, writer));
+                    changedBlocks.push(...outdentBlocksWithMerge(blocks, writer, {
+                        attributeNames
+                    }));
                 }
             }
             // Align the list item type to match the previous list item (from the same list).
@@ -841,6 +866,8 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
         model.change((writer)=>{
             if (turnOff) {
                 const lastBlock = blocks[blocks.length - 1];
+                const listEditing = this.editor.plugins.get('ListEditing');
+                const attributeNames = listEditing.getListAttributeNames();
                 // Split the first block from the list item.
                 const itemBlocks = getListItemBlocks(lastBlock, {
                     direction: 'forward'
@@ -850,7 +877,7 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
                     changedBlocks.push(...splitListItemBefore(itemBlocks[1], writer));
                 }
                 // Strip list attributes.
-                changedBlocks.push(...removeListAttributes(blocks, writer));
+                changedBlocks.push(...removeListAttributes(blocks, writer, attributeNames));
                 // Outdent items following the selected list item.
                 changedBlocks.push(...outdentFollowingItems(lastBlock, writer));
                 this._fireAfterExecute(changedBlocks);
@@ -976,9 +1003,12 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
 	 * with {@link module:engine/model/model~Model#deleteContent} to get rid of the inline content in the selection or take advantage
 	 * of the heuristics in `deleteContent()` that helps convert lists into paragraphs in certain cases.
 	 */ execute({ shouldMergeOnBlocksContentLevel = false } = {}) {
-        const model = this.editor.model;
+        const editor = this.editor;
+        const model = editor.model;
         const selection = model.document.selection;
         const changedBlocks = [];
+        const listEditing = editor.plugins.get('ListEditing');
+        const attributeNames = listEditing.getListAttributeNames();
         model.change((writer)=>{
             const { firstElement, lastElement } = this._getMergeSubjectElements(selection, shouldMergeOnBlocksContentLevel);
             const firstIndent = firstElement.getAttribute('listIndent') || 0;
@@ -992,7 +1022,8 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
                 ], writer, {
                     indentBy: firstIndent - lastIndent,
                     // If outdenting, the entire sub-tree that follows must be included.
-                    expand: firstIndent < lastIndent
+                    expand: firstIndent < lastIndent,
+                    attributeNames
                 }));
             }
             if (shouldMergeOnBlocksContentLevel) {
@@ -1868,6 +1899,11 @@ import { DomEventObserver, Matcher, ModelTreeWalker, getViewFillerOffset } from
 	 */ isNumberedListType(listType) {
         return isNumberedListType(listType);
     }
+    /**
+	 * Returns true if the given list item is the first item in the list.
+	 */ isFirstListItemInList(listItem) {
+        return isFirstListItemInList(listItem);
+    }
 }
 
 /**
@@ -3065,7 +3101,7 @@ function shouldUseBogusParagraph(item, attributeNames, blocks = getAllListItemBl
                     const allChildren = Array.from(data.content.getChildren());
                     const isSingleListItemSelected = isSingleListItem(allChildren);
                     if (isSingleListItemSelected) {
-                        removeListAttributes(allChildren, writer);
+                        removeListAttributes(allChildren, writer, this.getListAttributeNames());
                     }
                 }
             });
@@ -3498,6 +3534,11 @@ const LIST_STYLE_TYPES = [
         listStyle: 'upper-latin',
         typeAttribute: 'A',
         listType: 'numbered'
+    },
+    {
+        listStyle: 'arabic-indic',
+        typeAttribute: null,
+        listType: 'numbered'
     }
 ];
 for (const { listStyle, typeAttribute, listType } of LIST_STYLE_TYPES){
@@ -3824,20 +3865,39 @@ for (const { listStyle, typeAttribute, listType } of LIST_STYLE_TYPES){
             'bulleted',
             'numbered'
         ],
-        useAttribute: false
+        useAttribute: false,
+        listStyleTypes: {
+            numbered: [
+                'decimal',
+                'decimal-leading-zero',
+                'lower-roman',
+                'upper-roman',
+                'lower-latin',
+                'upper-latin'
+            ],
+            bulleted: [
+                'disc',
+                'circle',
+                'square'
+            ]
+        }
     };
     if (styles === true) {
         return normalizedConfig;
     }
     if (!styles) {
         normalizedConfig.listTypes = [];
+        normalizedConfig.listStyleTypes = {};
     } else if (Array.isArray(styles) || typeof styles == 'string') {
         normalizedConfig.listTypes = toArray(styles);
+        normalizedConfig.listStyleTypes = pick(normalizedConfig.listStyleTypes, normalizedConfig.listTypes);
     } else {
         normalizedConfig.listTypes = styles.listTypes ? toArray(styles.listTypes) : normalizedConfig.listTypes;
         normalizedConfig.useAttribute = !!styles.useAttribute;
         if (styles.listStyleTypes) {
             normalizedConfig.listStyleTypes = styles.listStyleTypes;
+        } else {
+            normalizedConfig.listStyleTypes = pick(normalizedConfig.listStyleTypes, normalizedConfig.listTypes);
         }
     }
     return normalizedConfig;
@@ -4509,6 +4569,12 @@ const DEFAULT_LIST_TYPE$1 = 'default';
                     tooltip: t('Upper-latin'),
                     type: 'upper-latin',
                     icon: IconListStyleUpperLatin
+                },
+                {
+                    label: t('Toggle the arabic-indic list style'),
+                    tooltip: t('Arabic-indic'),
+                    type: 'arabic-indic',
+                    icon: IconListStyleArabicIndic
                 }
             ];
             const buttonLabel = t('Numbered List');