@splunk/react-ui 5.0.0-beta.5 → 5.0.0-rc.2

package/Dropdown.js

@@ -69,16 +69,14 @@
     // CONCATENATED MODULE: external "prop-types"
     const t = require("prop-types");
     var a =  e.n(t);
-    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
-    const l = require("@splunk/ui-utils/id");
-    // CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
-    const i = require("@splunk/ui-utils/keyboard");
     // CONCATENATED MODULE: external "@splunk/react-ui/Popover"
-    const u = require("@splunk/react-ui/Popover");
-    var c =  e.n(u);
+    const l = require("@splunk/react-ui/Popover");
+    var i =  e.n(l);
     // CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
-    const s = require("@splunk/react-ui/useControlled");
-    var f =  e.n(s);
+    const u = require("@splunk/react-ui/useControlled");
+    var c =  e.n(u);
+    // CONCATENATED MODULE: external "@splunk/ui-utils/id"
+    const s = require("@splunk/ui-utils/id");
     // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
     /**
  * Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
@@ -86,7 +84,7 @@
  * @param ref - The React callback or object ref. Can be `null` or `undefined`.
  * @param current - The new value of the ref.
  */
-    function d(e, o) {
+    function f(e, o) {
         if (e) {
             if (typeof e === "function") {
                 e(o);
@@ -99,27 +97,27 @@
         }
     }
     // CONCATENATED MODULE: ./src/Dropdown/Dropdown.tsx
-    function p(e, o) {
-        return m(e) || b(e, o) || y(e, o) || v();
+    function d(e, o) {
+        return b(e) || g(e, o) || v(e, o) || p();
     }
-    function v() {
+    function p() {
         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 y(e, o) {
+    function v(e, o) {
         if (e) {
-            if ("string" == typeof e) return g(e, o);
+            if ("string" == typeof e) return y(e, o);
             var n = {}.toString.call(e).slice(8, -1);
-            return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? g(e, o) : void 0;
+            return "Object" === n && e.constructor && (n = e.constructor.name), "Map" === n || "Set" === n ? Array.from(e) : "Arguments" === n || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n) ? y(e, o) : void 0;
         }
     }
-    function g(e, o) {
+    function y(e, o) {
         (null == o || o > e.length) && (o = e.length);
         for (var n = 0, r = Array(o); n < o; n++) {
             r[n] = e[n];
         }
         return r;
     }
-    function b(e, o) {
+    function g(e, o) {
         var n = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
         if (null != n) {
             var r, t, a, l, i = [], u = !0, c = !1;
@@ -141,7 +139,7 @@
             return i;
         }
     }
-    function m(e) {
+    function b(e) {
         if (Array.isArray(e)) return e;
     }
     /** @public */
@@ -150,16 +148,18 @@
     /** @public */
     /** @public */
     /** @public */
-    /** @public */    var k = [ "clickAway", "contentClick", "escapeKey", "offScreen", "tabKey", "toggleClick" ];
-    var C = [ "contentClick", "escapeKey", "tabKey", "toggleClick" ];
+    /** @public */
+    /** @public */    var m = [ "toggleClick", "toggleKeydown" ];
+    var C = [ "clickAway", "contentClick", "escapeKey", "offScreen", "tabKey", "toggleClick" ];
+    var k = [ "contentClick", "escapeKey", "tabKey", "toggleClick" ];
     var h = {
         align: a().oneOf([ "center", "edge", "end" ]),
         canCoverAnchor: a().bool,
         children: a().oneOfType([ a().node, a().func ]),
-        closeReasons: a().arrayOf(a().oneOf(k)),
+        closeReasons: a().arrayOf(a().oneOf(C)),
         defaultPlacement: a().oneOf([ "above", "below", "left", "right", "vertical", "horizontal" ]),
         elementRef: a().oneOfType([ a().func, a().object ]),
-        focusToggleReasons: a().arrayOf(a().oneOf(k)),
+        focusToggleReasons: a().arrayOf(a().oneOf(C)),
         inputId: a().string,
         onRequestClose: a().func,
         onRequestOpen: a().func,
@@ -171,12 +171,12 @@
         toggle: a().element.isRequired
     };
     function O(e) {
-        var o = e["aria-labelledby"], t = e.align, a = t === void 0 ? "center" : t, u = e.canCoverAnchor, s = u === void 0 ? true : u, v = e.children, y = e.closeReasons, g = y === void 0 ? k : y, b = e.defaultPlacement, m = b === void 0 ? "below" : b, h = e.elementRef, O = e.focusToggleReasons, w = O === void 0 ? C : O, S = e.inputId, R = e.open, A = e.openWithArrowKeys, q = e.onRequestClose, I = e.onRequestOpen, P = e.repositionMode, j = P === void 0 ? "flip" : P, K = e.retainFocus, M = K === void 0 ? false : K, D = e.takeFocus, T = D === void 0 ? true : D, E = e.toggle;
+        var o = e["aria-labelledby"], t = e.align, a = t === void 0 ? "center" : t, l = e.canCoverAnchor, u = l === void 0 ? true : l, p = e.children, v = e.closeReasons, y = v === void 0 ? C : v, g = e.defaultPlacement, b = g === void 0 ? "below" : g, m = e.elementRef, h = e.focusToggleReasons, O = h === void 0 ? k : h, w = e.inputId, R = e.open, S = e.openWithArrowKeys, A = e.onRequestClose, q = e.onRequestOpen, I = e.repositionMode, P = I === void 0 ? "flip" : I, K = e.retainFocus, j = K === void 0 ? false : K, D = e.takeFocus, M = D === void 0 ? true : D, T = e.toggle;
         // @docs-props-type DropdownPropsBase
-                var F = (0, n.useState)(null), N = p(F, 2), _ = N[0], x = N[1];
-        var W = (0, n.useState)(false), z = p(W, 2), U = z[0], V = z[1];
-        var $ = (0, n.useRef)(null);
-        var B = f()({
+                var F = (0, n.useState)(null), E = d(F, 2), N = E[0], _ = E[1];
+        var x = (0, n.useState)(false), W = d(x, 2), U = W[0], z = W[1];
+        var V = (0, n.useRef)(null);
+        var $ = c()({
             componentName: "Dropdown",
             /* eslint-disable-next-line prefer-rest-params */
             componentProps: arguments[0],
@@ -184,125 +184,126 @@
             defaultValuePropName: "defaultOpen",
             valuePropName: "open"
         });
-        var G = B ? R : U;
-        var H = (0, n.useState)((function() {
+        var B = $ ? R : U;
+        var G = (0, n.useState)((function() {
             return {
-                popoverId: (0, l.createDOMID)("popover"),
-                toggleId: (0, l.createDOMID)("toggle")
+                popoverId: (0, s.createDOMID)("popover"),
+                toggleId: (0, s.createDOMID)("toggle")
             };
-        })), J = p(H, 1), L = J[0], Q = L.popoverId, X = L.toggleId;
-        var Y = S || E.props.id || X;
-        var Z = (0, n.useCallback)((function(e) {
-            $.current = e;
-            x(e);
+        })), H = d(G, 1), J = H[0], L = J.popoverId, Q = J.toggleId;
+        var X = w || T.props.id || Q;
+        var Y = (0, n.useCallback)((function(e) {
+            V.current = e;
+            _(e);
             // TS: ref does not exist on React.ReactElement - technically, this is undocumented API
-                        d(E.ref, e);
-        }), [ E ]);
-        var ee = (0, n.useCallback)((function(e) {
+                        f(T.ref, e);
+        }), [ T ]);
+        var Z = (0, n.useCallback)((function(e) {
             var o, n;
-            (o = (n = E.props).onKeyDown) === null || o === void 0 ? void 0 : o.call(n, e);
-            if (!A) {
+            (o = (n = T.props).onKeyDown) === null || o === void 0 ? void 0 : o.call(n, e);
+            if (!S) {
                 return;
             }
-            var r = (0, i.keycode)(e.nativeEvent);
-            if (r === "up" || r === "down") {
+            var r = e.key;
+            if (r === "ArrowUp" || r === "ArrowDown") {
                 e.preventDefault();
-                I === null || I === void 0 ? void 0 : I(e, {
+                q === null || q === void 0 ? void 0 : q(e, {
                     reason: "toggleKeydown"
                 });
-                if (!B) {
-                    V(true);
+                if (!$) {
+                    z(true);
                 }
             }
-        }), [ B, A, I, E ]);
-        var oe = (0, n.useCallback)((function(e) {
+        }), [ $, S, q, T ]);
+        var ee = (0, n.useCallback)((function(e) {
             var o = e.event, n = e.reason;
             if (o && n === "clickAway") {
                 var r = o.target;
                 while (r) {
                     // Ignore clicks on toggle.
-                    if (r.id === Y) {
+                    if (r.id === X) {
                         return;
                     }
                     r = r.parentNode;
                 }
             }
-            if (G && g.includes(n)) {
-                if (w.includes(n)) {
+            if (B && y.includes(n)) {
+                if (O.includes(n)) {
                     var t;
-                    (t = $.current) === null || t === void 0 ? void 0 : t.focus();
+                    (t = V.current) === null || t === void 0 ? void 0 : t.focus();
                 }
-                if (!B) {
-                    V(false);
+                if (!$) {
+                    z(false);
                 }
-                q === null || q === void 0 ? void 0 : q(e);
+                A === null || A === void 0 ? void 0 : A(e);
             }
-        }), [ g, w, B, G, q, Y ]);
-        var ne = (0, n.useCallback)((function(e) {
-            oe({
+        }), [ y, O, $, B, A, X ]);
+        var oe = (0, n.useCallback)((function(e) {
+            ee({
                 reason: "contentClick",
                 event: e
             });
-        }), [ oe ]);
-        var re = (0, n.useCallback)((function(e) {
+        }), [ ee ]);
+        var ne = (0, n.useCallback)((function(e) {
             var o, n;
-            (o = (n = E.props).onClick) === null || o === void 0 ? void 0 : o.call(n, e);
-            if (G) {
-                oe({
+            (o = (n = T.props).onClick) === null || o === void 0 ? void 0 : o.call(n, e);
+            if (B) {
+                ee({
                     reason: "toggleClick",
                     event: e
                 });
             } else {
-                I === null || I === void 0 ? void 0 : I(e, {
+                q === null || q === void 0 ? void 0 : q(e, {
                     reason: "toggleClick"
                 });
-                if (!B) {
-                    V(true);
+                if (!$) {
+                    z(true);
                 }
             }
-        }), [ oe, B, G, I, E ]);
-        var te =  (0, n.cloneElement)(E, {
-            onClick: re,
-            onKeyDown: ee,
-            ref: Z,
-            "aria-controls": G ? Q : undefined,
-            "aria-haspopup": E.props["aria-haspopup"] || true,
-            "aria-expanded": G,
-            "data-test": E.props["data-test"] || "dropdown",
-            "data-test-popover-id": Q,
-            id: Y
+        }), [ ee, $, B, q, T ]);
+        var re =  (0, n.cloneElement)(T, {
+            onClick: ne,
+            onKeyDown: Z,
+            ref: Y,
+            "aria-controls": B ? L : undefined,
+            "aria-haspopup": T.props["aria-haspopup"] || true,
+            "aria-expanded": B,
+            "data-test": T.props["data-test"] || "dropdown",
+            "data-test-popover-id": L,
+            id: X
         });
         
-        return r().createElement(r().Fragment, null, te,  r().createElement(c(), {
+        return r().createElement(r().Fragment, null, re,  r().createElement(i(), {
             align: a,
-            open: !!_ && G,
-            autoCloseWhenOffScreen: g.includes("offScreen"),
-            anchor: _,
-            canCoverAnchor: s,
-            elementRef: h,
-            retainFocus: M,
-            defaultPlacement: m,
-            onRequestClose: oe,
-            repositionMode: j,
-            id: Q,
-            "aria-labelledby": "".concat(o !== null && o !== void 0 ? o : "", " ").concat(Y).trim(),
-            takeFocus: T
-        }, typeof v === "function" ? 
+            open: !!N && B,
+            autoCloseWhenOffScreen: y.includes("offScreen"),
+            anchor: N,
+            canCoverAnchor: u,
+            elementRef: m,
+            retainFocus: j,
+            defaultPlacement: b,
+            onRequestClose: ee,
+            repositionMode: P,
+            id: L,
+            "aria-labelledby": "".concat(o !== null && o !== void 0 ? o : "", " ").concat(X).trim(),
+            takeFocus: M
+        }, typeof p === "function" ? 
         // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
         function() {
             
             return r().createElement("div", {
-                onClick: ne
-            }, v.apply(void 0, arguments));
+                onClick: oe
+            }, p.apply(void 0, arguments));
         } : 
         
         // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
         r().createElement("div", {
-            onClick: ne
-        }, v)));
+            onClick: oe
+        }, p)));
     }
     O.propTypes = h;
-    O.possibleCloseReasons = k;
+    O.possibleOpenReasons = m;
+    O.possibleCloseReasons = C;
     /* harmony default export */    const w = O;
     // CONCATENATED MODULE: ./src/Dropdown/index.ts
     module.exports = o;