npm - @ckeditor/ckeditor5-utils - Versions diffs - 38.0.1 → 38.1.0 - Mend

@ckeditor/ckeditor5-utils 38.0.1 → 38.1.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 (11) hide show

package/package.json +1 -16
package/src/dom/rect.d.ts +7 -0
package/src/dom/rect.js +51 -16
package/src/dom/resizeobserver.d.ts +4 -0
package/src/dom/resizeobserver.js +6 -0
package/src/dom/scroll.d.ts +6 -1
package/src/dom/scroll.js +28 -8
package/src/observablemixin.d.ts +24 -40
package/src/verifylicense.js +3 -9
package/src/version.d.ts +1 -1
package/src/version.js +2 -2

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-utils",
-  "version": "38.0.1",
+  "version": "38.1.0",
   "description": "Miscellaneous utilities used by CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -13,17 +13,6 @@
   "dependencies": {
     "lodash-es": "^4.17.15"
   },
-  "devDependencies": {
-    "@ckeditor/ckeditor5-build-classic": "^38.0.1",
-    "@ckeditor/ckeditor5-editor-classic": "^38.0.1",
-    "@ckeditor/ckeditor5-core": "^38.0.1",
-    "@ckeditor/ckeditor5-engine": "^38.0.1",
-    "@types/lodash-es": "^4.17.6",
-    "typescript": "^4.8.4"
-  },
-  "depcheckIgnore": [
-    "typescript"
-  ],
   "engines": {
     "node": ">=16.0.0",
     "npm": ">=5.7.1"
@@ -45,9 +34,5 @@
     "ckeditor5-metadata.json",
     "CHANGELOG.md"
   ],
-  "scripts": {
-    "build": "tsc -p ./tsconfig.json",
-    "postversion": "npm run build"
-  },
   "types": "src/index.d.ts"
 }

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

@@ -124,6 +124,13 @@ export default class Rect {
      * If there's no such visible rect, which is when the rect is limited by one or many of
      * the ancestors, `null` is returned.
      *
+     * **Note**: This method does not consider the boundaries of the viewport (window).
+     * To get a rect cropped by all ancestors and the viewport, use an intersection such as:
+     *
+     * ```ts
+     * const visibleInViewportRect = new Rect( window ).getIntersection( new Rect( source ).getVisible() );
+     * ```
+     *
      * @returns A visible rect instance or `null`, if there's none.
      */
     getVisible(): Rect | null;

package/src/dom/rect.js CHANGED Viewed

@@ -172,30 +172,53 @@ export default class Rect {
      * If there's no such visible rect, which is when the rect is limited by one or many of
      * the ancestors, `null` is returned.
      *
+     * **Note**: This method does not consider the boundaries of the viewport (window).
+     * To get a rect cropped by all ancestors and the viewport, use an intersection such as:
+     *
+     * ```ts
+     * const visibleInViewportRect = new Rect( window ).getIntersection( new Rect( source ).getVisible() );
+     * ```
+     *
      * @returns A visible rect instance or `null`, if there's none.
      */
     getVisible() {
         const source = this._source;
         let visibleRect = this.clone();
         // There's no ancestor to crop <body> with the overflow.
-        if (!isBody(source)) {
-            let parent = source.parentNode || source.commonAncestorContainer;
-            // Check the ancestors all the way up to the <body>.
-            while (parent && !isBody(parent)) {
-                const parentRect = new Rect(parent);
-                const intersectionRect = visibleRect.getIntersection(parentRect);
-                if (intersectionRect) {
-                    if (intersectionRect.getArea() < visibleRect.getArea()) {
-                        // Reduce the visible rect to the intersection.
-                        visibleRect = intersectionRect;
-                    }
-                }
-                else {
-                    // There's no intersection, the rect is completely invisible.
-                    return null;
-                }
+        if (isBody(source)) {
+            return visibleRect;
+        }
+        let child = source;
+        let parent = source.parentNode || source.commonAncestorContainer;
+        let absolutelyPositionedChildElement;
+        // Check the ancestors all the way up to the <body>.
+        while (parent && !isBody(parent)) {
+            if (child instanceof HTMLElement && getElementPosition(child) === 'absolute') {
+                absolutelyPositionedChildElement = child;
+            }
+            // 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.
+            if (absolutelyPositionedChildElement &&
+                (getElementPosition(parent) !== 'relative' || getElementOverflow(parent) === 'visible')) {
+                child = parent;
                 parent = parent.parentNode;
+                continue;
+            }
+            const parentRect = new Rect(parent);
+            const intersectionRect = visibleRect.getIntersection(parentRect);
+            if (intersectionRect) {
+                if (intersectionRect.getArea() < visibleRect.getArea()) {
+                    // Reduce the visible rect to the intersection.
+                    visibleRect = intersectionRect;
+                }
+            }
+            else {
+                // There's no intersection, the rect is completely invisible.
+                return null;
             }
+            child = parent;
+            parent = parent.parentNode;
         }
         return visibleRect;
     }
@@ -351,3 +374,15 @@ function isDomElement(value) {
     // it makes complicated checks to make sure that given value is a DOM element.
     return value !== null && typeof value === 'object' && value.nodeType === 1 && typeof value.getBoundingClientRect === 'function';
 }
+/**
+ * Returns the value of the `position` style of an `HTMLElement`.
+ */
+function getElementPosition(element) {
+    return element.ownerDocument.defaultView.getComputedStyle(element).position;
+}
+/**
+ * Returns the value of the `overflow` style of an `HTMLElement`.
+ */
+function getElementOverflow(element) {
+    return element.ownerDocument.defaultView.getComputedStyle(element).overflow;
+}

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

@@ -46,6 +46,10 @@ export default class ResizeObserver {
      * object with information about the resize event.
      */
     constructor(element: Element, callback: (entry: ResizeObserverEntry) => void);
+    /**
+     * The element observed by this observer.
+     */
+    get element(): Element;
     /**
      * Destroys the observer which disables the `callback` passed to the {@link #constructor}.
      */

package/src/dom/resizeobserver.js CHANGED Viewed

@@ -43,6 +43,12 @@ export default class ResizeObserver {
         ResizeObserver._addElementCallback(element, callback);
         ResizeObserver._observerInstance.observe(element);
     }
+    /**
+     * The element observed by this observer.
+     */
+    get element() {
+        return this._element;
+    }
     /**
      * Destroys the observer which disables the `callback` passed to the {@link #constructor}.
      */

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

@@ -49,7 +49,12 @@ type IfTrue<T> = T extends true ? true : never;
  */
 export declare function scrollViewportToShowTarget<T extends boolean, U extends IfTrue<T>>({ target, viewportOffset, ancestorOffset, alignToTop, forceScroll }: {
     readonly target: HTMLElement | Range;
-    readonly viewportOffset?: number;
+    readonly viewportOffset?: number | {
+        top: number;
+        bottom: number;
+        left: number;
+        right: number;
+    };
     readonly ancestorOffset?: number;
     readonly alignToTop?: T;
     readonly forceScroll?: U;

package/src/dom/scroll.js CHANGED Viewed

@@ -56,6 +56,7 @@ export function scrollViewportToShowTarget({ target, viewportOffset = 0, ancesto
     const targetWindow = getWindow(target);
     let currentWindow = targetWindow;
     let currentFrame = null;
+    viewportOffset = normalizeViewportOffset(viewportOffset);
     // Iterate over all windows, starting from target's parent window up to window#top.
     while (currentWindow) {
         let firstAncestorToScroll;
@@ -191,8 +192,8 @@ export function scrollAncestorsToShowTarget(target, ancestorOffset) {
  * whether it is already visible or not. This option will only work when `alignToTop` is `true`
  */
 function scrollWindowToShowRect({ window, rect, alignToTop, forceScroll, viewportOffset }) {
-    const targetShiftedDownRect = rect.clone().moveBy(0, viewportOffset);
-    const targetShiftedUpRect = rect.clone().moveBy(0, -viewportOffset);
+    const targetShiftedDownRect = rect.clone().moveBy(0, viewportOffset.bottom);
+    const targetShiftedUpRect = rect.clone().moveBy(0, -viewportOffset.top);
     const viewportRect = new Rect(window).excludeScrollbarsAndBorders();
     const rects = [targetShiftedUpRect, targetShiftedDownRect];
     const forceScrollToTop = alignToTop && forceScroll;
@@ -201,18 +202,18 @@ function scrollWindowToShowRect({ window, rect, alignToTop, forceScroll, viewpor
     const initialScrollX = scrollX;
     const initialScrollY = scrollY;
     if (forceScrollToTop) {
-        scrollY -= (viewportRect.top - rect.top) + viewportOffset;
+        scrollY -= (viewportRect.top - rect.top) + viewportOffset.top;
     }
     else if (!allRectsFitInViewport) {
         if (isAbove(targetShiftedUpRect, viewportRect)) {
-            scrollY -= viewportRect.top - rect.top + viewportOffset;
+            scrollY -= viewportRect.top - rect.top + viewportOffset.top;
         }
         else if (isBelow(targetShiftedDownRect, viewportRect)) {
             if (alignToTop) {
-                scrollY += rect.top - viewportRect.top - viewportOffset;
+                scrollY += rect.top - viewportRect.top - viewportOffset.top;
             }
             else {
-                scrollY += rect.bottom - viewportRect.bottom + viewportOffset;
+                scrollY += rect.bottom - viewportRect.bottom + viewportOffset.bottom;
             }
         }
     }
@@ -220,10 +221,10 @@ function scrollWindowToShowRect({ window, rect, alignToTop, forceScroll, viewpor
         // TODO: Web browsers scroll natively to place the target in the middle
         // of the viewport. It's not a very popular case, though.
         if (isLeftOf(rect, viewportRect)) {
-            scrollX -= viewportRect.left - rect.left + viewportOffset;
+            scrollX -= viewportRect.left - rect.left + viewportOffset.left;
         }
         else if (isRightOf(rect, viewportRect)) {
-            scrollX += rect.right - viewportRect.right + viewportOffset;
+            scrollX += rect.right - viewportRect.right + viewportOffset.right;
         }
     }
     if (scrollX != initialScrollX || scrollY !== initialScrollY) {
@@ -356,3 +357,22 @@ function getRectRelativeToWindow(target, relativeWindow) {
     }
     return rect;
 }
+/**
+ * A helper that explodes the `viewportOffset` configuration if defined as a plain number into an object
+ * with `top`, `bottom`, `left`, and `right` properties.
+ *
+ * If an object value is passed, this helper will pass it through.
+ *
+ * @param viewportOffset Viewport offset to be normalized.
+ */
+function normalizeViewportOffset(viewportOffset) {
+    if (typeof viewportOffset === 'number') {
+        return {
+            top: viewportOffset,
+            bottom: viewportOffset,
+            left: viewportOffset,
+            right: viewportOffset
+        };
+    }
+    return viewportOffset;
+}

package/src/observablemixin.d.ts CHANGED Viewed

@@ -521,52 +521,36 @@ export type DecoratedMethodEvent<TObservable extends Observable & {
 };
 interface SingleBindChain<TKey extends string, TVal> {
     toMany<O extends Observable, K extends keyof O>(observables: ReadonlyArray<O>, key: K, callback: (...values: Array<O[K]>) => TVal): void;
-    to<O extends Observable & {
-        [P in TKey]: TVal;
-    }>(observable: O): void;
-    to<O extends Observable & {
-        [P in TKey]: any;
-    }>(observable: O, callback: (value: O[TKey]) => TVal): void;
-    to<O extends Observable & {
-        [P in K]: TVal;
-    }, K extends keyof O>(observable: O, key: K): void;
+    to<O extends ObservableWithProperty<TKey, TVal>>(observable: O): void;
+    to<O extends ObservableWithProperty<TKey>>(observable: O, callback: (value: O[TKey]) => TVal): void;
+    to<O extends ObservableWithProperty<K, TVal>, K extends keyof O>(observable: O, key: K): void;
     to<O extends Observable, K extends keyof O>(observable: O, key: K, callback: (value: O[K]) => TVal): void;
-    to<O1 extends Observable & {
-        [P in TKey]: any;
-    }, O2 extends Observable & {
-        [P in TKey]: any;
-    }>(observable1: O1, observable2: O2, callback: (value1: O1[TKey], value2: O2[TKey]) => TVal): void;
+    to<O1 extends ObservableWithProperty<TKey>, O2 extends ObservableWithProperty<TKey>>(observable1: O1, observable2: O2, callback: (value1: O1[TKey], value2: O2[TKey]) => TVal): void;
     to<O1 extends Observable, K1 extends keyof O1, O2 extends Observable, K2 extends keyof O2>(observable1: O1, key1: K1, observable2: O2, key2: K2, callback: (value1: O1[K1], value2: O2[K2]) => TVal): void;
-    to<O1 extends Observable & {
-        [P in TKey]: any;
-    }, O2 extends Observable & {
-        [P in TKey]: any;
-    }, O3 extends Observable & {
-        [P in TKey]: any;
-    }>(observable1: O1, observable2: O2, observable3: O3, callback: (value1: O1[TKey], value2: O2[TKey], value3: O3[TKey]) => TVal): void;
+    to<O1 extends ObservableWithProperty<TKey>, O2 extends ObservableWithProperty<TKey>, O3 extends ObservableWithProperty<TKey>>(observable1: O1, observable2: O2, observable3: O3, callback: (value1: O1[TKey], value2: O2[TKey], value3: O3[TKey]) => TVal): void;
     to<O1 extends Observable, K1 extends keyof O1, O2 extends Observable, K2 extends keyof O2, O3 extends Observable, K3 extends keyof O3>(observable1: O1, key1: K1, observable2: O2, key2: K2, observable3: O3, key3: K3, callback: (value1: O1[K1], value2: O2[K2], value3: O3[K3]) => TVal): void;
-    to<O1 extends Observable & {
-        [P in TKey]: any;
-    }, O2 extends Observable & {
-        [P in TKey]: any;
-    }, O3 extends Observable & {
-        [P in TKey]: any;
-    }, O4 extends Observable & {
-        [P in TKey]: any;
-    }>(observable1: O1, observable2: O2, observable3: O3, observable4: O4, callback: (value1: O1[TKey], value2: O2[TKey], value3: O3[TKey], value4: O4[TKey]) => TVal): void;
+    to<O1 extends ObservableWithProperty<TKey>, O2 extends ObservableWithProperty<TKey>, O3 extends ObservableWithProperty<TKey>, O4 extends ObservableWithProperty<TKey>>(observable1: O1, observable2: O2, observable3: O3, observable4: O4, callback: (value1: O1[TKey], value2: O2[TKey], value3: O3[TKey], value4: O4[TKey]) => TVal): void;
     to<O1 extends Observable, K1 extends keyof O1, O2 extends Observable, K2 extends keyof O2, O3 extends Observable, K3 extends keyof O3, O4 extends Observable, K4 extends keyof O4>(observable1: O1, key1: K1, observable2: O2, key2: K2, observable3: O3, key3: K3, observable4: O4, key4: K4, callback: (value1: O1[K1], value2: O2[K2], value3: O3[K3], value4: O4[K4]) => TVal): void;
 }
+/**
+ * A helper type that can be used as a constraint, ensuring the type is both observable and have the given property.
+ *
+ * ```ts
+ * // Ensures that `obj` is `Observable` and have property named 'abc'.
+ * function f<O extends ObservableWithProperty<'abc'>>( obj: O ) {}
+ *
+ * // Ensures that `obj` is `Observable` and have property named 'abc' with value `number`.
+ * function f<O extends ObservableWithProperty<'abc', number>>( obj: O ) {}
+ * ```
+ */
+export type ObservableWithProperty<TKey extends PropertyKey, TVal = any> = undefined extends TVal ? Observable & {
+    [P in TKey]?: TVal;
+} : Observable & {
+    [P in TKey]: TVal;
+};
 interface DualBindChain<TKey1 extends string, TVal1, TKey2 extends string, TVal2> {
-    to<O extends Observable & {
-        [P in K1]: TVal1;
-    } & {
-        [P in K2]: TVal2;
-    }, K1 extends keyof O, K2 extends keyof O>(observable: O, key1: K1, key2: K2): void;
-    to<O extends Observable & {
-        [P in TKey1]: TVal1;
-    } & {
-        [P in TKey2]: TVal2;
-    }>(observable: O): void;
+    to<O extends ObservableWithProperty<K1, TVal1> & ObservableWithProperty<K2, TVal2>, K1 extends keyof O, K2 extends keyof O>(observable: O, key1: K1, key2: K2): void;
+    to<O extends ObservableWithProperty<TKey1, TVal1> & ObservableWithProperty<TKey2, TVal2>>(observable: O): void;
 }
 interface MultiBindChain {
     to<O extends Observable>(observable: O, ...properties: Array<keyof O>): void;

package/src/verifylicense.js CHANGED Viewed

@@ -24,7 +24,7 @@ export default function verifyLicense(token) {
     //
     // Please keep this code intact. Thank you for your understanding.
     function oldTokenCheck(token) {
-        if (token.match(/^[a-zA-Z0-9+/=$]+$/g) && (token.length >= 40 && token.length <= 255)) {
+        if (token.length >= 40 && token.length <= 255) {
             return 'VALID';
         }
         else {
@@ -32,11 +32,10 @@ export default function verifyLicense(token) {
         }
     }
     // TODO: issue ci#3175
-    let decryptedData = '';
-    let decryptedSecondElement = '';
     if (!token) {
         return 'INVALID';
     }
+    let decryptedData = '';
     try {
         decryptedData = atob(token);
     }
@@ -66,14 +65,9 @@ export default function verifyLicense(token) {
     if (firstElement.length < 40 || firstElement.length > 255) {
         return 'INVALID';
     }
+    let decryptedSecondElement = '';
     try {
-        // Must be a valid format.
         atob(firstElement);
-    }
-    catch (e) {
-        return 'INVALID';
-    }
-    try {
         decryptedSecondElement = atob(secondElement);
     }
     catch (e) {

package/src/version.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@
  * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
-declare const version = "38.0.1";
+declare const version = "38.1.0";
 export default version;
 export declare const releaseDate: Date;
 declare global {

package/src/version.js CHANGED Viewed

@@ -7,10 +7,10 @@
  */
 /* globals window, global */
 import CKEditorError from './ckeditorerror';
-const version = '38.0.1';
+const version = '38.1.0';
 export default version;
 // The second argument is not a month. It is `monthIndex` and starts from `0`.
-export const releaseDate = new Date(2023, 4, 23);
+export const releaseDate = new Date(2023, 5, 28);
 /* istanbul ignore next -- @preserve */
 const windowOrGlobal = typeof window === 'object' ? window : global;
 /* istanbul ignore next -- @preserve */