@splunk/react-ui 5.3.0 → 5.5.0

package/useResizeObserver.js

@@ -1,48 +1,19 @@
 /******/ (() => {
     // webpackBootstrap
     /******/ "use strict";
-    /******/    var e = {
-        /***/ 9497: 
-        /***/ e => {
-            e.exports = require("react");
-            /***/
-            /******/        }
-    };
-    /************************************************************************/
-    /******/ // The module cache
-    /******/    var r = {};
-    /******/
-    /******/ // The require function
-    /******/    function t(n) {
-        /******/ // Check if module is in cache
-        /******/ var i = r[n];
-        /******/        if (i !== undefined) {
-            /******/ return i.exports;
-            /******/        }
-        /******/ // Create a new module (and put it into the cache)
-        /******/        var o = r[n] = {
-            /******/ // no module.id needed
-            /******/ // no module.loaded needed
-            /******/ exports: {}
-            /******/        };
-        /******/
-        /******/ // Execute the module function
-        /******/        e[n](o, o.exports, t);
-        /******/
-        /******/ // Return the exports of the module
-        /******/        return o.exports;
-        /******/    }
+    /******/ // The require scope
+    /******/    var e = {};
     /******/
     /************************************************************************/
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ t.d = (e, r) => {
-            /******/ for (var n in r) {
-                /******/ if (t.o(r, n) && !t.o(e, n)) {
-                    /******/ Object.defineProperty(e, n, {
+        /******/ e.d = (r, t) => {
+            /******/ for (var n in t) {
+                /******/ if (e.o(t, n) && !e.o(r, n)) {
+                    /******/ Object.defineProperty(r, n, {
                         enumerable: true,
-                        get: r[n]
+                        get: t[n]
                     });
                     /******/                }
                 /******/            }
@@ -51,14 +22,14 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ t.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
+        /******/ e.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
         /******/;
     })();
     /******/
     /******/ /* webpack/runtime/make namespace object */
     /******/    (() => {
         /******/ // define __esModule on exports
-        /******/ t.r = e => {
+        /******/ e.r = e => {
             /******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
                 /******/ Object.defineProperty(e, Symbol.toStringTag, {
                     value: "Module"
@@ -70,107 +41,71 @@
             /******/        };
         /******/    })();
     /******/
-    /************************************************************************/    var n = {};
-    // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
-        (() => {
-        // ESM COMPAT FLAG
-        t.r(n);
-        // EXPORTS
-                t.d(n, {
-            default: () => /* reexport */ c
-        });
-        // EXTERNAL MODULE: external "react"
-                var e = t(9497);
-        // CONCATENATED MODULE: ./src/useResizeObserver/useResizeObserver.ts
-        function r(e, r) {
-            return a(e) || l(e, r) || o(e, r) || i();
-        }
-        function i() {
-            throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-        }
-        function o(e, r) {
-            if (e) {
-                if ("string" == typeof e) return u(e, r);
-                var t = {}.toString.call(e).slice(8, -1);
-                return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? u(e, r) : void 0;
-            }
-        }
-        function u(e, r) {
-            (null == r || r > e.length) && (r = e.length);
-            for (var t = 0, n = Array(r); t < r; t++) {
-                n[t] = e[t];
-            }
-            return n;
-        }
-        function l(e, r) {
-            var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
-            if (null != t) {
-                var n, i, o, u, l = [], a = !0, f = !1;
-                try {
-                    if (o = (t = t.call(e)).next, 0 === r) {
-                        if (Object(t) !== t) return;
-                        a = !1;
-                    } else for (;!(a = (n = o.call(t)).done) && (l.push(n.value), l.length !== r); a = !0) {
-                    }
-                } catch (e) {
-                    f = !0, i = e;
-                } finally {
-                    try {
-                        if (!a && null != t["return"] && (u = t["return"](), Object(u) !== u)) return;
-                    } finally {
-                        if (f) throw i;
-                    }
-                }
-                return l;
-            }
-        }
-        function a(e) {
-            if (Array.isArray(e)) return e;
-        }
-        /**
+    /************************************************************************/    var r = {};
+    // ESM COMPAT FLAG
+        e.r(r);
+    // EXPORTS
+        e.d(r, {
+        default: () => /* reexport */ u
+    });
+    // CONCATENATED MODULE: external "react"
+    const t = require("react");
+    // CONCATENATED MODULE: external "use-sync-external-store/shim"
+    const n = require("use-sync-external-store/shim");
+    // CONCATENATED MODULE: ./src/useResizeObserver/useResizeObserver.ts
+    // This shim is here for React 16 support
+    // Cache the server snapshot to avoid creating new objects on every render
+    var i = {
+        width: 0,
+        height: 0
+    };
+    /**
  * Watches a React ref element for changes in size.
+ * Uses useSyncExternalStore for better React 18 concurrent rendering support.
  *
  * @param ref - The React ref to observe size changes on
- */        var f = function t(n, i) {
-            var o = (0, e.useState)({
-                width: 0,
-                height: 0
-            }), u = r(o, 2), l = u[0], a = u[1];
-            (0, e.useEffect)((function() {
-                var e = n.current;
-                if (typeof window !== "undefined" && window.ResizeObserver) {
-                    var r = new ResizeObserver((function(e) {
-                        if (e[0]) {
-                            var r, t;
-                            var o = {
-                                width: (n === null || n === void 0 ? void 0 : (r = n.current) === null || r === void 0 ? void 0 : r.getBoundingClientRect().width) || 0,
-                                height: (n === null || n === void 0 ? void 0 : (t = n.current) === null || t === void 0 ? void 0 : t.getBoundingClientRect().height) || 0
-                            };
-                            a((function(e) {
-                                if (e.height !== o.height || e.width !== o.width) {
-                                    i === null || i === void 0 ? void 0 : i(o);
-                                    return o;
-                                }
-                                return e;
-                            }));
-                        }
-                    }));
-                    if (e) {
-                        r.observe(e);
-                    }
-                    return function() {
-                        if (e) {
-                            r.unobserve(e);
+ * @param onResize - Callback function that receives the new dimensions
+ */    var o = function e(r, o) {
+        var u = (0, t.useRef)({
+            width: 0,
+            height: 0
+        });
+        var d = (0, t.useCallback)((function(e) {
+            var t = r.current;
+            if (!t || typeof window === "undefined" || !window.ResizeObserver) {
+                return function() {};
+ // No-op if not in browser or no ResizeObserver support
                         }
-                    };
+            var n = function t() {
+                var n, i;
+                var d = {
+                    width: (r === null || r === void 0 ? void 0 : (n = r.current) === null || n === void 0 ? void 0 : n.getBoundingClientRect().width) || 0,
+                    height: (r === null || r === void 0 ? void 0 : (i = r.current) === null || i === void 0 ? void 0 : i.getBoundingClientRect().height) || 0
+                };
+                if (u.current.width !== d.width || u.current.height !== d.height) {
+                    u.current = d;
+                    o === null || o === void 0 ? void 0 : o(d);
+                    e();
                 }
-                // Return a no-op function to satisfy consistent-return rule
-                                return function() {};
-            }), [ i, n ]);
-            return l;
-        };
-        /* harmony default export */        const c = f;
-    }) // CONCATENATED MODULE: ./src/useResizeObserver/index.ts
-    ();
-    module.exports = n;
+            };
+            var i = new ResizeObserver(n);
+            i.observe(t);
+            // Initial measurement
+                        n();
+            return function() {
+                i.disconnect();
+            };
+        }), [ r, o ]);
+        // Use useSyncExternalStore to handle the subscription to ensure proper synchronization with
+        // Reacts concurrent rendering, it handles cases where the resize event might be interrupted
+        // or batched with other updates
+                return (0, n.useSyncExternalStore)(d, (function() {
+            return u.current;
+        }), (function() {
+            return i;
+        }));
+    };
+    /* harmony default export */    const u = o;
+    // CONCATENATED MODULE: ./src/useResizeObserver/index.ts
+    module.exports = r;
     /******/})();

package/useRovingFocus.js

@@ -8,12 +8,12 @@
     /******/ /* webpack/runtime/define property getters */
     /******/    (() => {
         /******/ // define getter functions for harmony exports
-        /******/ e.d = (t, r) => {
-            /******/ for (var n in r) {
-                /******/ if (e.o(r, n) && !e.o(t, n)) {
-                    /******/ Object.defineProperty(t, n, {
+        /******/ e.d = (r, t) => {
+            /******/ for (var n in t) {
+                /******/ if (e.o(t, n) && !e.o(r, n)) {
+                    /******/ Object.defineProperty(r, n, {
                         enumerable: true,
-                        get: r[n]
+                        get: t[n]
                     });
                     /******/                }
                 /******/            }
@@ -22,7 +22,7 @@
     /******/
     /******/ /* webpack/runtime/hasOwnProperty shorthand */
     /******/    (() => {
-        /******/ e.o = (e, t) => Object.prototype.hasOwnProperty.call(e, t)
+        /******/ e.o = (e, r) => Object.prototype.hasOwnProperty.call(e, r)
         /******/;
     })();
     /******/
@@ -41,19 +41,70 @@
             /******/        };
         /******/    })();
     /******/
-    /************************************************************************/    var t = {};
+    /************************************************************************/    var r = {};
     // ESM COMPAT FLAG
-        e.r(t);
+        e.r(r);
     // EXPORTS
-        e.d(t, {
-        default: () => /* reexport */ u
+        e.d(r, {
+        default: () => /* reexport */ s
     });
     // CONCATENATED MODULE: external "react"
-    const r = require("react");
+    const t = require("react");
     // CONCATENATED MODULE: external "@splunk/ui-utils/focus"
     const n = require("@splunk/ui-utils/focus");
     // CONCATENATED MODULE: ./src/useRovingFocus/useRovingFocus.tsx
-    var a = {
+    function o(e) {
+        "@babel/helpers - typeof";
+        return o = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
+            return typeof e;
+        } : function(e) {
+            return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
+        }, o(e);
+    }
+    function u(e, r) {
+        var t = Object.keys(e);
+        if (Object.getOwnPropertySymbols) {
+            var n = Object.getOwnPropertySymbols(e);
+            r && (n = n.filter((function(r) {
+                return Object.getOwnPropertyDescriptor(e, r).enumerable;
+            }))), t.push.apply(t, n);
+        }
+        return t;
+    }
+    function i(e) {
+        for (var r = 1; r < arguments.length; r++) {
+            var t = null != arguments[r] ? arguments[r] : {};
+            r % 2 ? u(Object(t), !0).forEach((function(r) {
+                a(e, r, t[r]);
+            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : u(Object(t)).forEach((function(r) {
+                Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+            }));
+        }
+        return e;
+    }
+    function a(e, r, t) {
+        return (r = c(r)) in e ? Object.defineProperty(e, r, {
+            value: t,
+            enumerable: !0,
+            configurable: !0,
+            writable: !0
+        }) : e[r] = t, e;
+    }
+    function c(e) {
+        var r = f(e, "string");
+        return "symbol" == o(r) ? r : r + "";
+    }
+    function f(e, r) {
+        if ("object" != o(e) || !e) return e;
+        var t = e[Symbol.toPrimitive];
+        if (void 0 !== t) {
+            var n = t.call(e, r || "default");
+            if ("object" != o(n)) return n;
+            throw new TypeError("@@toPrimitive must return a primitive value.");
+        }
+        return ("string" === r ? String : Number)(e);
+    }
+    var l = {
         enableLoop: false,
         orientation: "horizontal",
         enableTab: false,
@@ -78,48 +129,52 @@
  *     <button type="button">second</button>
  * </div>
  * ```
- */    function o() {
-        var e = (0, r.useRef)(0);
-        var t = (0, r.useRef)([]);
-        var o = function r(n) {
-            e.current = n;
-            t.current.forEach((function(t, r) {
-                return r === e.current ? t.removeAttribute("tabindex") : t.setAttribute("tabindex", "-1");
+ */    function b() {
+        var e = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+        var r = (0, t.useRef)(0);
+        var o = (0, t.useRef)([]);
+        var u = i(i({}, l), e);
+        var a = function e(t) {
+            r.current = t;
+            o.current.forEach((function(e, t) {
+                return t === r.current ? e.removeAttribute("tabindex") : e.setAttribute("tabindex", "-1");
             }));
         };
-        var u = function r(a) {
-            t.current = a != null ? (0, n.getSortedTabbableElements)(a, {
+        var c = function e(t) {
+            o.current = t != null ? (0, n.getSortedTabbableElements)(t, {
                 ignoreTabIndex: true
             }) : [];
-            o(e.current);
+            a(r.current);
         };
-        var i = function e(r) {
-            var n = r.relatedTarget instanceof Element && t.current.includes(r.relatedTarget);
-            if (!n) {
-                o(0);
+        var f = function e(r) {
+            var t = r.relatedTarget instanceof HTMLElement && o.current.includes(r.relatedTarget);
+            if (!t) {
+                a(0);
             }
         };
-        var c = function e(r) {
-            var n = r.target instanceof Element ? t.current.indexOf(r.target) : -1;
-            if (n >= 0) {
-                o(n);
+        var b = function e(r) {
+            var t = r.target instanceof HTMLElement ? o.current.indexOf(r.target) : -1;
+            if (t >= 0) {
+                a(t);
             }
         };
-        var l = function e(r) {
-            var o = t.current.includes(r.nativeEvent.target);
-            /*  Only apply focus if we are among the navigable items in this container */            if (r.nativeEvent.target instanceof HTMLElement && o) {
-                var u = t.current.indexOf(r.nativeEvent.target);
-                (0, n.handleFocus)(r.key, t.current, u, a);
+        var s = function e(r) {
+            var t = r.nativeEvent.target;
+            var i = t instanceof HTMLElement ? o.current.indexOf(t) : -1;
+            if (i === -1) {
+                return;
             }
+            /*  Only apply focus if we are among the navigable items in this container */            (0, 
+            n.handleFocus)(r.key, o.current, i, u);
         };
         return {
-            ref: u,
-            onBlur: i,
-            onFocus: c,
-            onKeyDown: l
+            ref: c,
+            onBlur: f,
+            onFocus: b,
+            onKeyDown: s
         };
     }
-    /* harmony default export */    const u = o;
+    /* harmony default export */    const s = b;
     // CONCATENATED MODULE: ./src/useRovingFocus/index.ts
-    module.exports = t;
+    module.exports = r;
     /******/})();