npm - @ckeditor/ckeditor5-utils - Versions diffs - 47.4.0-alpha.6 → 47.5.0-alpha.0 - Mend

@ckeditor/ckeditor5-utils 47.4.0-alpha.6 → 47.5.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-utils",
-  "version": "47.4.0-alpha.6",
+  "version": "47.5.0-alpha.0",
   "description": "Miscellaneous utilities used by CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -12,7 +12,7 @@
   "type": "module",
   "main": "src/index.js",
   "dependencies": {
-    "@ckeditor/ckeditor5-ui": "47.4.0-alpha.6",
+    "@ckeditor/ckeditor5-ui": "47.5.0-alpha.0",
     "es-toolkit": "1.39.5"
   },
   "author": "CKSource (http://cksource.com/)",
@@ -51,4 +51,4 @@
     },
     "./package.json": "./package.json"
   }
-}
+}

package/src/dom/rect.js CHANGED Viewed

@@ -11,7 +11,8 @@ import { getBorderWidths } from './getborderwidths.js';
 import { isText } from './istext.js';
 import { getPositionedAncestor } from './getpositionedancestor.js';
 import { global } from './global.js';
-const rectProperties = ['top', 'right', 'bottom', 'left', 'width', 'height'];
+const RECT_PROPERTIES = ['top', 'right', 'bottom', 'left', 'width', 'height'];
+const POSITIONING_VALUES = new Set(['relative', 'absolute', 'fixed', 'sticky']);
 /**
  * A helper class representing a `ClientRect` object, e.g. value returned by
  * the native `object.getBoundingClientRect()` method. Provides a set of methods
@@ -236,50 +237,21 @@ export class Rect {
         }
         let child = source;
         let parent = source.parentNode || source.commonAncestorContainer;
-        let absolutelyPositionedChildElement;
+        let lastPositionedChildElement;
         // Check the ancestors all the way up to the <body>.
         while (parent && !isBody(parent)) {
-            const isParentOverflowVisible = getElementOverflow(parent) === 'visible';
-            if (child instanceof HTMLElement && getElementPosition(child) === 'absolute') {
-                absolutelyPositionedChildElement = child;
+            const isNonClippingParent = getElementOverflow(parent) === 'visible';
+            if (isPositioned(child)) {
+                lastPositionedChildElement = child;
             }
-            const parentElementPosition = getElementPosition(parent);
-            // The child will be cropped only if it has `position: absolute` and the parent has `position: relative` + some overflow.
-            // Otherwise there's no chance of visual clipping and the parent can be skipped
-            // https://github.com/ckeditor/ckeditor5/issues/14107.
-            //
-            // condition: isParentOverflowVisible
-            // 		+---------------------------+
-            //		| #parent					|
-            //		| (overflow: visible)		|
-            //		|				+-----------+---------------+
-            //		|				| child						|
-            //		|				+-----------+---------------+
-            //		+---------------------------+
+            // 1. If a parent has overflow: visible, it can be safely skipped in consideration for any parent-child configuration.
+            // 2. If a parent has any other overflow (it clips), for the actual clipping to happen the following must be true:
+            // * the last positioned child must have `position: absolute`,
+            // * the parent must have a position other than `position: static`.
             //
-            // condition: absolutelyPositionedChildElement && parentElementPosition === 'relative' && isParentOverflowVisible
-            // 		+---------------------------+
-            //		| parent					|
-            //		| (position: relative;)		|
-            //		| (overflow: visible;)		|
-            //		|				+-----------+---------------+
-            //		|				| child  					|
-            //		|				| (position: absolute;)		|
-            //		|				+-----------+---------------+
-            //		+---------------------------+
-            //
-            // condition: absolutelyPositionedChildElement && parentElementPosition !== 'relative'
-            // 		+---------------------------+
-            //		| parent					|
-            //		| (position: static;)		|
-            //		|				+-----------+---------------+
-            //		|				| child  					|
-            //		|				| (position: absolute;)		|
-            //		|				+-----------+---------------+
-            //		+---------------------------+
-            if (isParentOverflowVisible ||
-                absolutelyPositionedChildElement && ((parentElementPosition === 'relative' && isParentOverflowVisible) ||
-                    parentElementPosition !== 'relative')) {
+            // https://github.com/ckeditor/ckeditor5/issues/14107.
+            if (isNonClippingParent ||
+                (lastPositionedChildElement && getElementPosition(lastPositionedChildElement) === 'absolute' && !isPositioned(parent))) {
                 child = parent;
                 parent = parent.parentNode;
                 continue;
@@ -310,7 +282,7 @@ export class Rect {
      * @returns `true` when Rects are equal. `false` otherwise.
      */
     isEqual(anotherRect) {
-        for (const prop of rectProperties) {
+        for (const prop of RECT_PROPERTIES) {
             if (this[prop] !== anotherRect[prop]) {
                 return false;
             }
@@ -392,7 +364,11 @@ export class Rect {
         const clientRects = Array.from(range.getClientRects());
         if (clientRects.length) {
             for (const rect of clientRects) {
-                rects.push(new Rect(rect));
+                const r = new Rect(rect);
+                // Point the rect source to the DOM range instead of of the DOM client rect to allow proper clipping,
+                // in `Rect#getVisible()` method.
+                r._source = range;
+                rects.push(r);
             }
         }
         // If there's no client rects for the Range, use parent container's bounding rect
@@ -446,7 +422,7 @@ export class Rect {
  * Acquires all the rect properties from the passed source.
  */
 function copyRectProperties(rect, source) {
-    for (const p of rectProperties) {
+    for (const p of RECT_PROPERTIES) {
         rect[p] = source[p];
     }
 }
@@ -471,7 +447,7 @@ function isDomElement(value) {
  * Returns the value of the `position` style of an `HTMLElement`.
  */
 function getElementPosition(element) {
-    return element instanceof HTMLElement ? element.ownerDocument.defaultView.getComputedStyle(element).position : 'static';
+    return element.ownerDocument.defaultView.getComputedStyle(element).position;
 }
 /**
  * Returns the value of the `overflow` style of an `HTMLElement` or a `Range`.
@@ -479,6 +455,12 @@ function getElementPosition(element) {
 function getElementOverflow(element) {
     return element instanceof HTMLElement ? element.ownerDocument.defaultView.getComputedStyle(element).overflow : 'visible';
 }
+/**
+ * Checks if the given node is positioned in any other way than `position: static`.
+ */
+function isPositioned(node) {
+    return node instanceof HTMLElement && POSITIONING_VALUES.has(getElementPosition(node));
+}
 /**
  * For a given absolute Rect coordinates object and a positioned element ancestor, it updates its
  * coordinates that make up for the position and the scroll of the ancestor.

package/src/dom/scroll.d.ts CHANGED Viewed

@@ -68,5 +68,11 @@ export declare function scrollViewportToShowTarget<T extends boolean, U extends
  * to be maintained while scrolling.
  * @param limiterElement The outermost ancestor that should be scrolled. If specified, it can prevent
  * scrolling the whole page.
+ * @param alignToTop When set `true`, the function will make sure the `target` is scrolled up
+ * to the top boundary of the scrollable ancestors if scrolled up. When not set (default), the `target`
+ * will be revealed by scrolling as little as possible. This option will not affect target elements that must be
+ * scrolled down because they will appear at the top of the boundary anyway.
+ * @param forceScroll When set `true`, the `target` will be aligned to the top of scrollable ancestors
+ * whether it is already visible or not. This option will only work when `alignToTop` is `true`
  */
-export declare function scrollAncestorsToShowTarget(target: HTMLElement | Range, ancestorOffset?: number, limiterElement?: HTMLElement): void;
+export declare function scrollAncestorsToShowTarget(target: HTMLElement | Range, ancestorOffset?: number, limiterElement?: HTMLElement, alignToTop?: boolean, forceScroll?: true): void;

package/src/dom/scroll.js CHANGED Viewed

@@ -141,14 +141,22 @@ export function scrollViewportToShowTarget({ target, viewportOffset = 0, ancesto
  * to be maintained while scrolling.
  * @param limiterElement The outermost ancestor that should be scrolled. If specified, it can prevent
  * scrolling the whole page.
+ * @param alignToTop When set `true`, the function will make sure the `target` is scrolled up
+ * to the top boundary of the scrollable ancestors if scrolled up. When not set (default), the `target`
+ * will be revealed by scrolling as little as possible. This option will not affect target elements that must be
+ * scrolled down because they will appear at the top of the boundary anyway.
+ * @param forceScroll When set `true`, the `target` will be aligned to the top of scrollable ancestors
+ * whether it is already visible or not. This option will only work when `alignToTop` is `true`
  */
-export function scrollAncestorsToShowTarget(target, ancestorOffset, limiterElement) {
+export function scrollAncestorsToShowTarget(target, ancestorOffset, limiterElement, alignToTop, forceScroll) {
     const targetParent = getParentElement(target);
     scrollAncestorsToShowRect({
         parent: targetParent,
         getRect: () => new Rect(target),
         ancestorOffset,
-        limiterElement
+        limiterElement,
+        alignToTop,
+        forceScroll
     });
 }
 /**

package/src/version.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@
  * @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
  */
-export declare const version = "47.4.0-alpha.6";
+export declare const version = "47.5.0-alpha.0";
 export declare const releaseDate: Date;
 declare global {
     var CKEDITOR_VERSION: string;

package/src/version.js CHANGED Viewed

@@ -6,9 +6,9 @@
  * @module utils/version
  */
 import { CKEditorError } from './ckeditorerror.js';
-export const version = '47.4.0-alpha.6';
+export const version = '47.5.0-alpha.0';
 // The second argument is not a month. It is `monthIndex` and starts from `0`.
-export const releaseDate = new Date(2026, 0, 14);
+export const releaseDate = new Date(2026, 1, 4);
 /* istanbul ignore next -- @preserve */
 if (globalThis.CKEDITOR_VERSION) {
     /**