@splunk/react-ui 5.0.0-beta.2 → 5.0.0-beta.4

package/SlidingPanels.js

@@ -61,8 +61,8 @@
         e.r(n);
     // EXPORTS
         e.d(n, {
-        Panel: () => /* reexport */ x,
-        default: () => /* reexport */ Q
+        Panel: () => /* reexport */ I,
+        default: () => /* reexport */ L
     });
     // CONCATENATED MODULE: external "react"
     const r = require("react");
@@ -80,19 +80,17 @@
     // CONCATENATED MODULE: external "@splunk/react-ui/Box"
     const f = require("@splunk/react-ui/Box");
     var s =  e.n(f);
-    // CONCATENATED MODULE: external "react-spring"
-    const y = require("react-spring");
     // CONCATENATED MODULE: external "@splunk/themes"
-    const d = require("@splunk/themes");
+    const y = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/SlidingPanels/SlidingPanelsStyles.ts
-    var v = c()(s()).withConfig({
+    var d = c()(s()).withConfig({
         displayName: "SlidingPanelsStyles__StyledBox",
         componentId: "su6isq-0"
     })([ "overflow:hidden;position:relative;" ]);
-    var p = c()(y.animated.div).withConfig({
+    var v = c()(a.animated.div).withConfig({
         displayName: "SlidingPanelsStyles__StyledAnimatedDiv",
         componentId: "su6isq-1"
-    })([ "", ";", ";" ], d.mixins.reset("block"), d.mixins.clearfix());
+    })([ "", ";", ";" ], y.mixins.reset("block"), y.mixins.clearfix());
     // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
     /**
  * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
@@ -100,7 +98,7 @@
  * @param ref - The React callback or object ref. Can be `null` or `undefined`.
  * @param current - The new value of the ref.
  */
-    function m(e, n) {
+    function p(e, n) {
         if (e) {
             if (typeof e === "function") {
                 e(n);
@@ -113,8 +111,8 @@
         }
     }
     // CONCATENATED MODULE: ./src/SlidingPanels/Panel.tsx
-    function b() {
-        return b = Object.assign ? Object.assign.bind() : function(e) {
+    function m() {
+        return m = Object.assign ? Object.assign.bind() : function(e) {
             for (var n = 1; n < arguments.length; n++) {
                 var r = arguments[n];
                 for (var t in r) {
@@ -122,29 +120,29 @@
                 }
             }
             return e;
-        }, b.apply(null, arguments);
+        }, m.apply(null, arguments);
     }
-    function g(e, n) {
-        return w(e) || j(e, n) || h(e, n) || O();
+    function b(e, n) {
+        return j(e) || S(e, n) || O(e, n) || g();
     }
-    function O() {
+    function g() {
         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 h(e, n) {
+    function O(e, n) {
         if (e) {
-            if ("string" == typeof e) return S(e, n);
+            if ("string" == typeof e) return h(e, n);
             var r = {}.toString.call(e).slice(8, -1);
-            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? S(e, n) : void 0;
+            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? h(e, n) : void 0;
         }
     }
-    function S(e, n) {
+    function h(e, n) {
         (null == n || n > e.length) && (n = e.length);
         for (var r = 0, t = Array(n); r < n; r++) {
             t[r] = e[r];
         }
         return t;
     }
-    function j(e, n) {
+    function S(e, n) {
         var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
         if (null != r) {
             var t, o, i, a, u = [], l = !0, c = !1;
@@ -166,12 +164,12 @@
             return u;
         }
     }
-    function w(e) {
+    function j(e) {
         if (Array.isArray(e)) return e;
     }
-    function P(e, n) {
+    function w(e, n) {
         if (null == e) return {};
-        var r, t, o = E(e, n);
+        var r, t, o = P(e, n);
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
             for (t = 0; t < i.length; t++) {
@@ -180,7 +178,7 @@
         }
         return o;
     }
-    function E(e, n) {
+    function P(e, n) {
         if (null == e) return {};
         var r = {};
         for (var t in e) {
@@ -191,24 +189,24 @@
         }
         return r;
     }
-    var A = {
+    var E = {
         children: i().node,
         elementRef: i().oneOfType([ i().func, i().object ]),
         /** @private */
         onMount: i().func,
         /** @private */
         onUnmount: i().func,
-        panelId: i().any.isRequired
+        panelId: i().oneOfType([ i().string, i().number ]).isRequired
     };
     /**
  * Container for arbitrary content.
- */    function I(e) {
-        var n = e.children, o = e.elementRef, i = e.onMount, a = e.onUnmount, u = e.panelId, l = P(e, [ "children", "elementRef", "onMount", "onUnmount", "panelId" ]);
+ */    function A(e) {
+        var n = e.children, o = e.elementRef, i = e.onMount, a = e.onUnmount, u = e.panelId, l = w(e, [ "children", "elementRef", "onMount", "onUnmount", "panelId" ]);
         // @docs-props-type PanelPropsBase
-                var c = (0, r.useState)(null), f = g(c, 2), s = f[0], y = f[1];
+                var c = (0, r.useState)(null), f = b(c, 2), s = f[0], y = f[1];
         var d = (0, r.useCallback)((function(e) {
             y(e);
-            m(o, e);
+            p(o, e);
         }), [ o ]);
         (0, r.useEffect)((function() {
             i === null || i === void 0 ? void 0 : i(s, u);
@@ -217,26 +215,26 @@
             };
         }), [ i, a, s, u ]);
         
-        return t().createElement(p, b({
+        return t().createElement(v, m({
             "data-test": "panel",
             "data-test-panel-id": u
         }, l, {
             ref: d
         }), n);
     }
-    I.propTypes = A;
-    /* harmony default export */    const x = I;
+    A.propTypes = E;
+    /* harmony default export */    const I = A;
     // CONCATENATED MODULE: ./src/SlidingPanels/SlidingPanels.tsx
-    function C(e) {
+    function x(e) {
         "@babel/helpers - typeof";
-        return C = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
+        return x = "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;
-        }, C(e);
+        }, x(e);
     }
-    function M() {
-        return M = Object.assign ? Object.assign.bind() : function(e) {
+    function C() {
+        return C = Object.assign ? Object.assign.bind() : function(e) {
             for (var n = 1; n < arguments.length; n++) {
                 var r = arguments[n];
                 for (var t in r) {
@@ -244,29 +242,29 @@
                 }
             }
             return e;
-        }, M.apply(null, arguments);
+        }, C.apply(null, arguments);
     }
-    function N(e, n) {
-        return U(e) || k(e, n) || R(e, n) || q();
+    function M(e, n) {
+        return k(e) || R(e, n) || T(e, n) || N();
     }
-    function q() {
+    function N() {
         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 R(e, n) {
+    function T(e, n) {
         if (e) {
-            if ("string" == typeof e) return T(e, n);
+            if ("string" == typeof e) return q(e, n);
             var r = {}.toString.call(e).slice(8, -1);
-            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? T(e, n) : void 0;
+            return "Object" === r && e.constructor && (r = e.constructor.name), "Map" === r || "Set" === r ? Array.from(e) : "Arguments" === r || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r) ? q(e, n) : void 0;
         }
     }
-    function T(e, n) {
+    function q(e, n) {
         (null == n || n > e.length) && (n = e.length);
         for (var r = 0, t = Array(n); r < n; r++) {
             t[r] = e[r];
         }
         return t;
     }
-    function k(e, n) {
+    function R(e, n) {
         var r = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
         if (null != r) {
             var t, o, i, a, u = [], l = !0, c = !1;
@@ -288,12 +286,12 @@
             return u;
         }
     }
-    function U(e) {
+    function k(e) {
         if (Array.isArray(e)) return e;
     }
-    function _(e, n) {
+    function U(e, n) {
         if (null == e) return {};
-        var r, t, o = D(e, n);
+        var r, t, o = _(e, n);
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
             for (t = 0; t < i.length; t++) {
@@ -302,7 +300,7 @@
         }
         return o;
     }
-    function D(e, n) {
+    function _(e, n) {
         if (null == e) return {};
         var r = {};
         for (var t in e) {
@@ -313,7 +311,7 @@
         }
         return r;
     }
-    function B(e, n) {
+    function D(e, n) {
         var r = Object.keys(e);
         if (Object.getOwnPropertySymbols) {
             var t = Object.getOwnPropertySymbols(e);
@@ -323,42 +321,42 @@
         }
         return r;
     }
-    function V(e) {
+    function B(e) {
         for (var n = 1; n < arguments.length; n++) {
             var r = null != arguments[n] ? arguments[n] : {};
-            n % 2 ? B(Object(r), !0).forEach((function(n) {
-                $(e, n, r[n]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : B(Object(r)).forEach((function(n) {
+            n % 2 ? D(Object(r), !0).forEach((function(n) {
+                V(e, n, r[n]);
+            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : D(Object(r)).forEach((function(n) {
                 Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
             }));
         }
         return e;
     }
-    function $(e, n, r) {
-        return (n = W(n)) in e ? Object.defineProperty(e, n, {
+    function V(e, n, r) {
+        return (n = $(n)) in e ? Object.defineProperty(e, n, {
             value: r,
             enumerable: !0,
             configurable: !0,
             writable: !0
         }) : e[n] = r, e;
     }
-    function W(e) {
-        var n = z(e, "string");
-        return "symbol" == C(n) ? n : n + "";
+    function $(e) {
+        var n = W(e, "string");
+        return "symbol" == x(n) ? n : n + "";
     }
-    function z(e, n) {
-        if ("object" != C(e) || !e) return e;
+    function W(e, n) {
+        if ("object" != x(e) || !e) return e;
         var r = e[Symbol.toPrimitive];
         if (void 0 !== r) {
             var t = r.call(e, n || "default");
-            if ("object" != C(t)) return t;
+            if ("object" != x(t)) return t;
             throw new TypeError("@@toPrimitive must return a primitive value.");
         }
         return ("string" === n ? String : Number)(e);
     }
     // can't use PanelId as key type, because an index signature parameter type must be 'string', 'number', 'symbol', or a template literal type.
-        var F = {
-        activePanelId: i().any.isRequired,
+        var z = {
+        activePanelId: i().oneOfType([ i().string, i().number ]).isRequired,
         children: i().node,
         elementRef: i().oneOfType([ i().func, i().object ]),
         innerClassName: i().string,
@@ -368,7 +366,7 @@
         outerStyle: i().object,
         transition: i().oneOf([ "forward", "backward" ])
     };
-    var G = {
+    var F = {
         enter: {
             x: "0px"
         },
@@ -376,7 +374,7 @@
             x: "0px"
         }
     };
-    var H = function e(n, r) {
+    var G = function e(n, r) {
         var t = "".concat(n, "px");
         var o = "".concat(n * -1, "px");
         var i = r === "forward" ? t : o;
@@ -396,7 +394,7 @@
             }
         };
     };
-    var J = function e(n) {
+    var H = function e(n) {
         return Object.values(n).reduce((function(e, n) {
             if ((n === null || n === void 0 ? void 0 : n.tagName) === "DIV") {
                 return Math.max(e, n.clientWidth);
@@ -408,7 +406,7 @@
    we wrap each child panel in animated.div via StyledAnimatedDiv
    apply any custom inner styles or classnames that have been passed in
    apply styles coming from the transitions call that is rendering this component
-   you can see this being used below as `<PanelToRender style={style} />` */    var K = function e(n) {
+   you can see this being used below as `<PanelToRender style={style} />` */    var J = function e(n) {
         var o = n.validChildren, i = n.innerClassName, a = n.innerStyle, u = n.onMount, l = n.onUnmount;
         return o.map((function(e) {
             /* this is returning a function (component) that is rendered near bottom of file as <PanelToRender style={style} /> */
@@ -419,24 +417,24 @@
                     onUnmount: l
                 });
                 var f = (0, r.useMemo)((function() {
-                    return V(V({}, a), o);
+                    return B(B({}, a), o);
                 }), [ o ]);
                 
-                return t().createElement(p, {
+                return t().createElement(v, {
                     style: f,
                     className: i
                 }, c);
             };
         }));
     };
-    function L(e) {
-        var n = e.activePanelId, o = e.children, i = e.elementRef, l = e.innerClassName, c = e.innerStyle, f = e.onAnimationEnd, s = e.outerClassName, y = e.outerStyle, d = e.transition, p = d === void 0 ? "forward" : d, m = _(e, [ "activePanelId", "children", "elementRef", "innerClassName", "innerStyle", "onAnimationEnd", "outerClassName", "outerStyle", "transition" ]);
+    function K(e) {
+        var n = e.activePanelId, o = e.children, i = e.elementRef, l = e.innerClassName, c = e.innerStyle, f = e.onAnimationEnd, s = e.outerClassName, y = e.outerStyle, v = e.transition, p = v === void 0 ? "forward" : v, m = U(e, [ "activePanelId", "children", "elementRef", "innerClassName", "innerStyle", "onAnimationEnd", "outerClassName", "outerStyle", "transition" ]);
         // @docs-props-type SlidingPanelsPropsBase
-                var b = (0, r.useState)(0), g = N(b, 2), O = g[0], h = g[1];
-        var S = (0, r.useState)([]), j = N(S, 2), w = j[0], P = j[1];
-        var E = (0, r.useState)({}), A = N(E, 2), I = A[0], x = A[1];
-        var C = (0, a.useSpringRef)();
-        var q = (0, r.useMemo)((function() {
+                var b = (0, r.useState)(0), g = M(b, 2), O = g[0], h = g[1];
+        var S = (0, r.useState)([]), j = M(S, 2), w = j[0], P = j[1];
+        var E = (0, r.useState)({}), A = M(E, 2), I = A[0], x = A[1];
+        var N = (0, a.useSpringRef)();
+        var T = (0, r.useMemo)((function() {
             return r.Children.toArray(o).filter(r.isValidElement);
         }), [ o ]);
         /**
@@ -444,16 +442,16 @@
    * Without maxWidth, we run into a problem if the leaving panel width > the arriving panel width.
    * In this case, useAnimationTransition will only know to shift the leaving panel by the width of the arriving panel,
    * which would result in seeing part of the leaving panel's content on screen at the same time as the arriving panel's content.
-   */        var R = (0, r.useMemo)((function() {
-            return J(I);
+   */        var q = (0, r.useMemo)((function() {
+            return H(I);
         }), [ I ]);
-        /* determines what our transform translateX will look like based on is it transitioning forward or backward */        var T = (0, 
+        /* determines what our transform translateX will look like based on is it transitioning forward or backward */        var R = (0, 
         r.useMemo)((function() {
-            return H(R, p);
-        }), [ R, p ]);
-        var k = (0, u.useAnimationTransition)(O, V(V(V({
-            ref: C
-        }, G), T), {}, {
+            return G(q, p);
+        }), [ q, p ]);
+        var k = (0, u.useAnimationTransition)(O, B(B(B({
+            ref: N
+        }, F), R), {}, {
             onRest: function e() {
                 f === null || f === void 0 ? void 0 : f();
             }
@@ -464,26 +462,26 @@
         }), [ O ]);
         (0, r.useEffect)((function() {
             /* starts animation */
-            C.start();
-        }), [ C, O ]);
+            N.start();
+        }), [ N, O ]);
         (0, r.useEffect)((function() {
             /* sets the currentPanelIndex in state whenever activePanelId or children changes */
-            var e = q.findIndex((function(e) {
+            var e = T.findIndex((function(e) {
                 var r = e.props;
                 return r.panelId === n;
             }));
             h(e);
-        }), [ n, q ]);
-        var U = (0, r.useCallback)((function(e, n) {
+        }), [ n, T ]);
+        var _ = (0, r.useCallback)((function(e, n) {
             if (e != null && n != null) {
                 x((function(r) {
-                    return V(V({}, r), {}, $({}, n, e));
+                    return B(B({}, r), {}, V({}, n, e));
                 }));
             }
         }), []);
         var D = (0, r.useCallback)((function(e) {
             x((function(n) {
-                var r = V({}, n);
+                var r = B({}, n);
                 delete r[e];
                 return r;
             }));
@@ -493,16 +491,16 @@
      * use useMemo instead of useEffect to setPanels because we need panels to be populated before mount
      * so SlidingPanels will appear with a panel already inside the StyledBox
      */
-            P(K({
-                validChildren: q,
-                onMount: U,
+            P(J({
+                validChildren: T,
+                onMount: _,
                 onUnmount: D,
                 innerClassName: l,
                 innerStyle: c
             }));
-        }), [ q, U, D, l, c ]);
+        }), [ T, _, D, l, c ]);
         
-        return t().createElement(v, M({
+        return t().createElement(d, C({
             className: s,
             "data-test-active-panel-id": n,
             "data-test": "sliding-panels",
@@ -516,9 +514,9 @@
             }) : null;
         })));
     }
-    L.propTypes = F;
-    L.Panel = x;
-    /* harmony default export */    const Q = L;
+    K.propTypes = z;
+    K.Panel = I;
+    /* harmony default export */    const L = K;
     // CONCATENATED MODULE: ./src/SlidingPanels/index.ts
     module.exports = n;
     /******/})();