pds-dev-kit-web-test 2.4.48 → 2.4.50

package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useIsMounted.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useIsMounted = void 0;
+var react_1 = require("react");
+function useIsMounted() {
+    var isMounted = (0, react_1.useRef)(false);
+    (0, react_1.useEffect)(function () {
+        isMounted.current = true;
+        return function () {
+            isMounted.current = false;
+        };
+    }, []);
+    return (0, react_1.useCallback)(function () { return isMounted.current; }, []);
+}
+exports.useIsMounted = useIsMounted;

package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useResizableObserver.d.ts

@@ -0,0 +1,12 @@
+import type { RefObject } from 'react';
+type Size = {
+    width: number | undefined;
+    height: number | undefined;
+};
+type UseResizeObserverOptions<T extends HTMLElement = HTMLElement> = {
+    ref: RefObject<T>;
+    onResize?: (size: Size) => void;
+    box?: 'border-box' | 'content-box' | 'device-pixel-content-box';
+};
+export declare function useResizeObserver<T extends HTMLElement = HTMLElement>(options: UseResizeObserverOptions<T>): Size;
+export {};

package/dist/src/sub/DynamicLayout/sections/CustomSection/hooks/useResizableObserver.js

@@ -0,0 +1,74 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useResizeObserver = void 0;
+var react_1 = require("react");
+var useIsMounted_1 = require("./useIsMounted");
+var initialSize = {
+    width: undefined,
+    height: undefined
+};
+function useResizeObserver(options) {
+    var ref = options.ref, _a = options.box, box = _a === void 0 ? 'content-box' : _a;
+    var _b = (0, react_1.useState)(initialSize), _c = _b[0], width = _c.width, height = _c.height, setSize = _b[1];
+    var isMounted = (0, useIsMounted_1.useIsMounted)();
+    var previousSize = (0, react_1.useRef)(__assign({}, initialSize));
+    var onResize = (0, react_1.useRef)(undefined);
+    onResize.current = options.onResize;
+    (0, react_1.useEffect)(function () {
+        if (!ref.current)
+            return;
+        if (typeof window === 'undefined' || !('ResizeObserver' in window))
+            return;
+        var observer = new ResizeObserver(function (_a) {
+            var entry = _a[0];
+            var boxProp = box === 'border-box'
+                ? 'borderBoxSize'
+                : box === 'device-pixel-content-box'
+                    ? 'devicePixelContentBoxSize'
+                    : 'contentBoxSize';
+            var newWidth = extractSize(entry, boxProp, 'inlineSize');
+            var newHeight = extractSize(entry, boxProp, 'blockSize');
+            var hasChanged = previousSize.current.width !== newWidth || previousSize.current.height !== newHeight;
+            if (hasChanged) {
+                var newSize = { width: newWidth, height: newHeight };
+                previousSize.current.width = newWidth;
+                previousSize.current.height = newHeight;
+                if (onResize.current) {
+                    onResize.current(newSize);
+                }
+                else if (isMounted()) {
+                    setSize(newSize);
+                }
+            }
+        });
+        observer.observe(ref.current, { box: box });
+        return function () {
+            observer.disconnect();
+        };
+    }, [box, ref, isMounted]);
+    return { width: width, height: height };
+}
+exports.useResizeObserver = useResizeObserver;
+function extractSize(entry, box, sizeType) {
+    if (!entry[box]) {
+        if (box === 'contentBoxSize') {
+            return entry.contentRect[sizeType === 'inlineSize' ? 'width' : 'height'];
+        }
+        return undefined;
+    }
+    return Array.isArray(entry[box])
+        ? entry[box][0][sizeType]
+        : // @ts-ignore Support Firefox's non-standard behavior
+            entry[box][sizeType];
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web-test",
-  "version": "2.4.48",
+  "version": "2.4.50",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",
@@ -23,7 +23,7 @@
     "lottie-react": "^2.3.1",
     "nuka-carousel": "^4.8.4",
     "publ-echo": "^0.0.45",
-    "publ-echo-test": "^0.0.21",
+    "publ-echo-test": "^0.0.22",
     "react-hook-form": "^7.28.1",
     "react-i18next": "^11.12.0",
     "react-router-dom": "^5.2.0",