@uxf/cms 13.0.3 → 14.1.0

package/ui/copy-to-clipboard-button/copy-to-clipboard-button.js

@@ -1,58 +1,59 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CopyToClipboardButton = void 0;
+const compiler_runtime_1 = require("react/compiler-runtime");
 const copy_to_clipboard_1 = require("@uxf/core/utils/copy-to-clipboard");
 const translations_1 = require("@uxf/core-react/translations");
 const button_1 = require("@uxf/ui/button");
 const flash_messages_service_1 = require("@uxf/ui/flash-messages/flash-messages-service");
 const icon_1 = require("@uxf/ui/icon");
-const react_1 = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 // eslint-disable-next-line react/destructuring-assignment
-const CopyToClipboardButton = ({ color = "default", size = "sm", textToCopy }) => {
+const CopyToClipboardButton = t0 => {
+    const $ = (0, compiler_runtime_1.c)(8);
+    const { color: t1, size: t2, textToCopy } = t0;
+    const color = t1 === undefined ? "default" : t1;
+    const size = t2 === undefined ? "sm" : t2;
     const t = (0, translations_1.useUxfTranslation)();
-    const onCopy = (0, react_1.useCallback)(async () => {
-        const isCopied = await (0, copy_to_clipboard_1.copyToClipboard)(textToCopy);
-        (0, flash_messages_service_1.flashMessage)({
-            message: isCopied
-                ? t("uxf-cms-copy-to-clipboard-button:text-copied")
-                : t("uxf-cms-copy-to-clipboard-button:copy-failed"),
-            variant: isCopied ? "success" : "error",
-        });
-    }, [textToCopy, t]);
-    return (react_1.default.createElement(button_1.Button, { color: color, onClick: onCopy, size: size },
-        react_1.default.createElement(icon_1.Icon, { name: "copy" })));
+    let t3;
+    if ($[0] !== t || $[1] !== textToCopy) {
+        t3 = async () => {
+            const isCopied = await (0, copy_to_clipboard_1.copyToClipboard)(textToCopy);
+            (0, flash_messages_service_1.flashMessage)({
+                message: isCopied ? t("uxf-cms-copy-to-clipboard-button:text-copied") : t("uxf-cms-copy-to-clipboard-button:copy-failed"),
+                variant: isCopied ? "success" : "error"
+            });
+        };
+        $[0] = t;
+        $[1] = textToCopy;
+        $[2] = t3;
+    }
+    else {
+        t3 = $[2];
+    }
+    const onCopy = t3;
+    let t4;
+    if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+        t4 = react_1.default.createElement(icon_1.Icon, { name: "copy" });
+        $[3] = t4;
+    }
+    else {
+        t4 = $[3];
+    }
+    let t5;
+    if ($[4] !== color || $[5] !== onCopy || $[6] !== size) {
+        t5 = react_1.default.createElement(button_1.Button, { color: color, onClick: onCopy, size: size }, t4);
+        $[4] = color;
+        $[5] = onCopy;
+        $[6] = size;
+        $[7] = t5;
+    }
+    else {
+        t5 = $[7];
+    }
+    return t5;
 };
 exports.CopyToClipboardButton = CopyToClipboardButton;

package/utils/remove-confirm-handler.js

@@ -4,28 +4,97 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.removeConfirmHandler = removeConfirmHandler;
+const compiler_runtime_1 = require("react/compiler-runtime");
 const translations_1 = require("@uxf/core-react/translations");
 const button_1 = require("@uxf/ui/button");
 const modal_1 = require("@uxf/ui/modal");
 const modal_dialog_1 = require("@uxf/ui/modal-dialog/modal-dialog");
 const react_1 = __importDefault(require("react"));
 function removeConfirmHandler() {
-    return new Promise((resolve) => {
+    return new Promise(resolve => {
         const RemoveConfirmModal = () => {
+            const $ = (0, compiler_runtime_1.c)(16);
             const t = (0, translations_1.useUxfTranslation)();
-            return (react_1.default.createElement(modal_dialog_1.ModalDialog, { footer: react_1.default.createElement(react_1.default.Fragment, null,
-                    react_1.default.createElement(button_1.Button, { onClick: () => {
-                            resolve(false);
-                            (0, modal_1.closeModal)();
-                        } }, t("uxf-cms-remove-confirm-handler:cancel")),
-                    react_1.default.createElement(button_1.Button, { color: "negative", onClick: () => {
-                            resolve(true);
-                            (0, modal_1.closeModal)();
-                        } }, t("uxf-cms-remove-confirm-handler:confirm-delete"))), title: t("uxf-cms-remove-confirm-handler:confirm-delete-message"), width: "sm" }));
+            let t0;
+            if ($[0] !== t) {
+                t0 = t("uxf-cms-remove-confirm-handler:cancel");
+                $[0] = t;
+                $[1] = t0;
+            }
+            else {
+                t0 = $[1];
+            }
+            let t1;
+            if ($[2] !== t0) {
+                t1 = react_1.default.createElement(button_1.Button, { onClick: _temp }, t0);
+                $[2] = t0;
+                $[3] = t1;
+            }
+            else {
+                t1 = $[3];
+            }
+            let t2;
+            if ($[4] !== t) {
+                t2 = t("uxf-cms-remove-confirm-handler:confirm-delete");
+                $[4] = t;
+                $[5] = t2;
+            }
+            else {
+                t2 = $[5];
+            }
+            let t3;
+            if ($[6] !== t2) {
+                t3 = react_1.default.createElement(button_1.Button, { color: "negative", onClick: _temp2 }, t2);
+                $[6] = t2;
+                $[7] = t3;
+            }
+            else {
+                t3 = $[7];
+            }
+            let t4;
+            if ($[8] !== t1 || $[9] !== t3) {
+                t4 = react_1.default.createElement(react_1.default.Fragment, null,
+                    t1,
+                    t3);
+                $[8] = t1;
+                $[9] = t3;
+                $[10] = t4;
+            }
+            else {
+                t4 = $[10];
+            }
+            let t5;
+            if ($[11] !== t) {
+                t5 = t("uxf-cms-remove-confirm-handler:confirm-delete-message");
+                $[11] = t;
+                $[12] = t5;
+            }
+            else {
+                t5 = $[12];
+            }
+            let t6;
+            if ($[13] !== t4 || $[14] !== t5) {
+                t6 = react_1.default.createElement(modal_dialog_1.ModalDialog, { footer: t4, title: t5, width: "sm" });
+                $[13] = t4;
+                $[14] = t5;
+                $[15] = t6;
+            }
+            else {
+                t6 = $[15];
+            }
+            return t6;
         };
         (0, modal_1.openModal)({
             isBackdropCloseDisabled: true,
-            children: react_1.default.createElement(RemoveConfirmModal, null),
+            children: react_1.default.createElement(RemoveConfirmModal, null)
         });
     });
 }
+function _temp() {
+    resolve(false);
+    (0, modal_1.closeModal)();
+}
+function _temp2() {
+    resolve(true);
+    (0, modal_1.closeModal)();
+}

package/utils/use-viewport-height.js

@@ -1,28 +1,34 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useViewportHeight = useViewportHeight;
+const compiler_runtime_1 = require("react/compiler-runtime");
 const react_1 = require("react");
-function getHeight() {
-    var _a, _b;
-    if (typeof window === "undefined") {
-        return "100vh";
-    }
-    return (_b = (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.height) !== null && _b !== void 0 ? _b : "100vh";
-}
+const use_visual_viewport_height_1 = require("./use-visual-viewport-height");
 function useViewportHeight(scrollLock) {
-    const [height, setHeight] = (0, react_1.useState)(() => getHeight());
-    (0, react_1.useEffect)(() => {
-        if (scrollLock) {
-            document.body.classList.add("xl:overflow-hidden");
-        }
-        const handler = () => setHeight(getHeight());
-        window.addEventListener("resize", handler);
-        return () => {
-            if (scrollLock) {
-                document.body.classList.remove("xl:overflow-hidden");
+    var _a;
+    const $ = (0, compiler_runtime_1.c)(3);
+    let t0;
+    let t1;
+    if ($[0] !== scrollLock) {
+        t0 = () => {
+            if (!scrollLock) {
+                return;
             }
-            window.removeEventListener("resize", handler);
+            document.body.classList.add("xl:overflow-hidden");
+            return _temp;
         };
-    }, [scrollLock]);
-    return height;
+        t1 = [scrollLock];
+        $[0] = scrollLock;
+        $[1] = t0;
+        $[2] = t1;
+    }
+    else {
+        t0 = $[1];
+        t1 = $[2];
+    }
+    (0, react_1.useEffect)(t0, t1);
+    return (_a = (0, use_visual_viewport_height_1.useVisualViewportHeight)()) !== null && _a !== void 0 ? _a : "100vh";
+}
+function _temp() {
+    return document.body.classList.remove("xl:overflow-hidden");
 }

package/utils/use-viewport-height.test.d.ts

@@ -0,0 +1 @@
+export {};

package/utils/use-viewport-height.test.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("@testing-library/react");
+const use_viewport_height_1 = require("./use-viewport-height");
+class FakeVisualViewport extends EventTarget {
+    constructor() {
+        super(...arguments);
+        this.height = 700;
+        this.scale = 1;
+    }
+}
+let visualViewport;
+beforeEach(() => {
+    visualViewport = new FakeVisualViewport();
+    Object.defineProperty(window, "visualViewport", { configurable: true, value: visualViewport });
+});
+afterEach(() => {
+    Object.defineProperty(window, "visualViewport", { configurable: true, value: undefined });
+});
+test("follows the visual viewport, which shrinks when the on-screen keyboard opens", () => {
+    const { result } = (0, react_1.renderHook)(() => (0, use_viewport_height_1.useViewportHeight)());
+    (0, react_1.act)(() => {
+        visualViewport.height = 400;
+        // iOS fires this on the visual viewport only; window gets no resize event.
+        visualViewport.dispatchEvent(new Event("resize"));
+    });
+    expect(result.current).toBe(400);
+});
+test("ignores pinch zoom, which shrinks the visual viewport by the zoom scale", () => {
+    const { result } = (0, react_1.renderHook)(() => (0, use_viewport_height_1.useViewportHeight)());
+    (0, react_1.act)(() => {
+        visualViewport.scale = 2;
+        visualViewport.height = 350;
+        visualViewport.dispatchEvent(new Event("resize"));
+    });
+    expect(result.current).toBe(700);
+});

package/utils/use-visual-viewport-height.d.ts

@@ -0,0 +1,2 @@
+/** Height of the visual viewport in px, not counting pinch zoom; `undefined` on the server and while hydrating. */
+export declare function useVisualViewportHeight(): number | undefined;

package/utils/use-visual-viewport-height.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useVisualViewportHeight = useVisualViewportHeight;
+const react_1 = require("react");
+function subscribe(onStoreChange) {
+    var _a;
+    // The visual viewport has its own resize event: iOS fires it when the on-screen keyboard opens, and the window
+    // gets none.
+    const target = (_a = window.visualViewport) !== null && _a !== void 0 ? _a : window;
+    const controller = new AbortController();
+    target.addEventListener("resize", onStoreChange, {
+        signal: controller.signal
+    });
+    return () => controller.abort();
+}
+function getSnapshot() {
+    const viewport = window.visualViewport;
+    // Times the zoom scale: pinch zoom shrinks `height` by the scale, and the layout must not shrink with it. The
+    // on-screen keyboard shrinks it at scale 1, which is the change to follow.
+    return viewport ? viewport.height * viewport.scale : window.innerHeight;
+}
+/** Height of the visual viewport in px, not counting pinch zoom; `undefined` on the server and while hydrating. */
+function useVisualViewportHeight() {
+    return (0, react_1.useSyncExternalStore)(subscribe, getSnapshot, _temp);
+}
+function _temp() { }