@splunk/react-ui 5.2.0 → 5.3.0

package/DefinitionList.js

@@ -61,64 +61,73 @@
         e.r(r);
     // EXPORTS
         e.d(r, {
-        Description: () => /* reexport */ g,
-        Term: () => /* reexport */ S,
-        default: () => /* reexport */ R
+        Description: () => /* reexport */ b,
+        Term: () => /* reexport */ j,
+        default: () => /* reexport */ T
     });
     // CONCATENATED MODULE: external "react"
     const t = require("react");
     var n =  e.n(t);
+    // CONCATENATED MODULE: external "lodash/has"
+    const i = require("lodash/has");
     // CONCATENATED MODULE: external "prop-types"
-    const i = require("prop-types");
-    var a =  e.n(i);
+    const a = require("prop-types");
+    var o =  e.n(a);
     // CONCATENATED MODULE: ./src/DefinitionList/DefinitionListContext.tsx
-    var o =  (0, t.createContext)({
+    var s =  (0, t.createContext)({
         layout: "fixed"
     });
     // CONCATENATED MODULE: external "styled-components"
     const l = require("styled-components");
-    var s =  e.n(l);
+    var c =  e.n(l);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const c = require("@splunk/themes");
+    const d = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/DefinitionList/DefinitionListStyles.ts
-    var d = s().dt.withConfig({
+    var p = c().dt.withConfig({
         displayName: "DefinitionListStyles__StyledTerm",
         componentId: "sc-1pqfrgm-0"
     })([ "", "" ], (function(e) {
         var r = e.$separatorCharacter, t = e.$termWidth;
-        return (0, c.pickVariant)("$layout", {
-            fixed: (0, l.css)([ "", ";", ";float:left;overflow:hidden;white-space:nowrap;word-wrap:normal;width:", ";", "" ], c.mixins.reset("block"), c.mixins.typography("body", {
+        return (0, d.pickVariant)("$layout", {
+            fixed: (0, l.css)([ "", ";", ";float:left;overflow:hidden;white-space:nowrap;word-wrap:normal;width:", ";", "" ], d.mixins.reset("block"), d.mixins.typography("body", {
                 color: "muted"
             }), t, r && (0, l.css)([ "&::after{content:'", "';}" ], " ".concat(r.repeat(100)))),
-            auto: (0, l.css)([ "", ";", ";grid-template-columns:[term] auto [separator] 1fr;grid-column:term;overflow:hidden;white-space:normal;word-break:break-word;width:", ";", "" ], c.mixins.reset("grid"), c.mixins.typography("body", {
+            auto: (0, l.css)([ "", ";", ";grid-template-columns:[term] auto [separator] 1fr;grid-column:term;overflow:hidden;white-space:normal;word-break:break-word;width:", ";", "" ], d.mixins.reset("grid"), d.mixins.typography("body", {
                 color: "muted"
-            }), t, r && (0, l.css)([ "&::after{grid-column:separator;content:'", "';margin-inline-start:", ";min-width:", ";overflow:hidden;white-space:nowrap;}" ], " ".concat(r.repeat(100)), c.variables.spacingXSmall, c.variables.spacingLarge))
+            }), t, r && (0, l.css)([ "&::after{grid-column:separator;content:'", "';margin-inline-start:", ";min-width:", ";overflow:hidden;white-space:nowrap;}" ], " ".concat(r.repeat(250)), d.variables.spacingXSmall, d.variables.spacingLarge)),
+            stacked: (0, l.css)([ "", ";", ";grid-column:definitionList;white-space:normal;word-break:break-word;&:not(:first-of-type){margin-block-start:", ";}" ], d.mixins.reset("grid"), d.mixins.typography("body", {
+                color: "muted"
+            }), d.variables.spacingLarge)
         });
     }));
-    var p = s().dd.withConfig({
+    var f = c().dd.withConfig({
         displayName: "DefinitionListStyles__StyledDescription",
         componentId: "sc-1pqfrgm-1"
     })([ "", "" ], (function(e) {
         var r = e.$descriptionWidth, t = e.$termWidth;
-        return (0, c.pickVariant)("$layout", {
-            fixed: (0, l.css)([ "", ";", ";padding-inline-start:", ";margin-inline-start:", ";white-space:normal;word-break:break-word;width:", ";" ], c.mixins.reset("block"), c.mixins.typography("body", {
+        return (0, d.pickVariant)("$layout", {
+            fixed: (0, l.css)([ "", ";", ";padding-inline-start:", ";margin-inline-start:", ";white-space:normal;word-break:break-word;width:", ";" ], d.mixins.reset("block"), d.mixins.typography("body", {
+                color: "active"
+            }), d.variables.spacingSmall, t, r),
+            auto: (0, l.css)([ "", ";", ";grid-column:description;white-space:normal;word-break:break-word;width:", ";" ], d.mixins.reset("grid"), d.mixins.typography("body", {
                 color: "active"
-            }), c.variables.spacingSmall, t, r),
-            auto: (0, l.css)([ "", ";", ";grid-column:description;white-space:normal;word-break:break-word;width:", ";" ], c.mixins.reset("grid"), c.mixins.typography("body", {
+            }), r),
+            stacked: (0, l.css)([ "", ";", ";grid-column:definitionList;white-space:normal;word-break:break-word;" ], d.mixins.reset("grid"), d.mixins.typography("body", {
                 color: "active"
-            }), r)
+            }))
         });
     }));
-    var u = s().dl.withConfig({
+    var u = c().dl.withConfig({
         displayName: "DefinitionListStyles__Styled",
         componentId: "sc-1pqfrgm-2"
-    })([ "", "" ], (0, c.pickVariant)("$layout", {
-        fixed: (0, l.css)([ "", ";", ";" ], c.mixins.reset("block"), c.mixins.typography("body")),
-        auto: (0, l.css)([ "", ";grid-template-columns:[term] fit-content(", ") [description] fit-content( ", " );column-gap:", ";row-gap:", ";" ], c.mixins.reset("grid"), c.variables.lineLength, c.variables.lineLength, c.variables.spacingXLarge, c.variables.spacingMedium)
+    })([ "", "" ], (0, d.pickVariant)("$layout", {
+        fixed: (0, l.css)([ "", ";", ";" ], d.mixins.reset("block"), d.mixins.typography("body")),
+        auto: (0, l.css)([ "", ";grid-template-columns:[term] fit-content(", ") [description] fit-content( ", " );column-gap:", ";row-gap:", ";" ], d.mixins.reset("grid"), d.variables.lineLength, d.variables.lineLength, d.variables.spacingXLarge, d.variables.spacingMedium),
+        stacked: (0, l.css)([ "", ";grid-template-columns:[definitionList] fit-content(", ");row-gap:", ";" ], d.mixins.reset("grid"), d.variables.lineLength, d.variables.spacingXSmall)
     }));
     // CONCATENATED MODULE: ./src/DefinitionList/Description.tsx
-    function f() {
-        return f = Object.assign ? Object.assign.bind() : function(e) {
+    function m() {
+        return m = Object.assign ? Object.assign.bind() : function(e) {
             for (var r = 1; r < arguments.length; r++) {
                 var t = arguments[r];
                 for (var n in t) {
@@ -126,11 +135,11 @@
                 }
             }
             return e;
-        }, f.apply(null, arguments);
+        }, m.apply(null, arguments);
     }
-    function m(e, r) {
+    function y(e, r) {
         if (null == e) return {};
-        var t, n, i = y(e, r);
+        var t, n, i = h(e, r);
         if (Object.getOwnPropertySymbols) {
             var a = Object.getOwnPropertySymbols(e);
             for (n = 0; n < a.length; n++) {
@@ -139,7 +148,7 @@
         }
         return i;
     }
-    function y(e, r) {
+    function h(e, r) {
         if (null == e) return {};
         var t = {};
         for (var n in e) {
@@ -150,30 +159,30 @@
         }
         return t;
     }
-    var h = {
-        children: a().node.isRequired,
-        elementRef: a().oneOfType([ a().func, a().object ])
+    var g = {
+        children: o().node.isRequired,
+        elementRef: o().oneOfType([ o().func, o().object ])
     };
     /**
  * Container component for a `DefinitionList` description.
  */    function v(e) {
-        var r = e.children, i = e.elementRef, a = m(e, [ "children", "elementRef" ]);
+        var r = e.children, i = e.elementRef, a = y(e, [ "children", "elementRef" ]);
         // @docs-props-type DescriptionPropsBase
-                var l = (0, t.useContext)(o), s = l.descriptionWidth, c = l.layout, d = l.termWidth;
+                var o = (0, t.useContext)(s), l = o.descriptionWidth, c = o.layout, d = o.termWidth;
         
-        return n().createElement(p, f({
+        return n().createElement(f, m({
             "data-test": "description",
             ref: i,
-            $descriptionWidth: s,
+            $descriptionWidth: l,
             $layout: c,
             $termWidth: d
         }, a), r);
     }
-    v.propTypes = h;
-    /* harmony default export */    const g = v;
+    v.propTypes = g;
+    /* harmony default export */    const b = v;
     // CONCATENATED MODULE: ./src/DefinitionList/Term.tsx
-    function b() {
-        return b = Object.assign ? Object.assign.bind() : function(e) {
+    function w() {
+        return w = Object.assign ? Object.assign.bind() : function(e) {
             for (var r = 1; r < arguments.length; r++) {
                 var t = arguments[r];
                 for (var n in t) {
@@ -181,11 +190,11 @@
                 }
             }
             return e;
-        }, b.apply(null, arguments);
+        }, w.apply(null, arguments);
     }
-    function w(e, r) {
+    function O(e, r) {
         if (null == e) return {};
-        var t, n, i = O(e, r);
+        var t, n, i = x(e, r);
         if (Object.getOwnPropertySymbols) {
             var a = Object.getOwnPropertySymbols(e);
             for (n = 0; n < a.length; n++) {
@@ -194,7 +203,7 @@
         }
         return i;
     }
-    function O(e, r) {
+    function x(e, r) {
         if (null == e) return {};
         var t = {};
         for (var n in e) {
@@ -205,27 +214,27 @@
         }
         return t;
     }
-    var x = {
-        children: a().node.isRequired,
-        elementRef: a().oneOfType([ a().func, a().object ])
+    var k = {
+        children: o().node.isRequired,
+        elementRef: o().oneOfType([ o().func, o().object ])
     };
     /**
  * Container component for a `DefinitionList` term.
- */    function j(e) {
-        var r = e.children, i = e.elementRef, a = w(e, [ "children", "elementRef" ]);
+ */    function S(e) {
+        var r = e.children, i = e.elementRef, a = O(e, [ "children", "elementRef" ]);
         // @docs-props-type TermPropsBase
-                var l = (0, t.useContext)(o), s = l.layout, c = l.separatorCharacter, p = l.termWidth;
+                var o = (0, t.useContext)(s), l = o.layout, c = o.separatorCharacter, d = o.termWidth;
         
-        return n().createElement(d, b({
+        return n().createElement(p, w({
             "data-test": "term",
             ref: i,
-            $layout: s,
+            $layout: l,
             $separatorCharacter: c,
-            $termWidth: p
+            $termWidth: d
         }, a), r);
     }
-    j.propTypes = x;
-    /* harmony default export */    const S = j;
+    S.propTypes = k;
+    /* harmony default export */    const j = S;
     // CONCATENATED MODULE: ./src/DefinitionList/DefinitionList.tsx
     function P() {
         return P = Object.assign ? Object.assign.bind() : function(e) {
@@ -260,39 +269,53 @@
         }
         return t;
     }
-    var k = {
-        children: a().node,
-        descriptionWidth: a().string,
-        elementRef: a().oneOfType([ a().func, a().object ]),
-        layout: a().oneOf([ "fixed", "auto" ]),
-        separatorCharacter: a().string,
-        termWidth: a().string
+    var C = {
+        children: o().node,
+        descriptionWidth: o().string,
+        elementRef: o().oneOfType([ o().func, o().object ]),
+        layout: o().oneOf([ "fixed", "auto", "stacked" ]),
+        separatorCharacter: o().string,
+        termWidth: o().string
     };
-    function C(e) {
-        var r = e.children, i = e.descriptionWidth, a = e.elementRef, l = e.layout, s = l === void 0 ? "fixed" : l, c = e.separatorCharacter, d = e.termWidth, p = d === void 0 ? "120px" : d, f = W(e, [ "children", "descriptionWidth", "elementRef", "layout", "separatorCharacter", "termWidth" ]);
+    var L = "120px";
+    function R(e) {
+        var r = e.children, i = e.descriptionWidth, a = e.elementRef, o = e.layout, l = o === void 0 ? "fixed" : o, c = e.separatorCharacter, d = e.termWidth, p = d === void 0 ? L : d, f = W(e, [ "children", "descriptionWidth", "elementRef", "layout", "separatorCharacter", "termWidth" ]);
         // @docs-props-type DefinitionListPropsBase
-                var m = s !== "fixed" && p === "120px" ? undefined : p;
-        var y = (0, t.useMemo)((function() {
+        /* eslint-disable-next-line prefer-rest-params */        var m = arguments[0];
+        (0, t.useEffect)((function() {
+            if (false) {}
+        }), [ l, c, m, i ]);
+        var y;
+        var h;
+        // termWidth and descriptionWidth are not supported in stacked layout
+                if (l === "stacked") {
+            y = undefined;
+            h = undefined;
+        } else {
+            y = l !== "fixed" && p === L ? undefined : p;
+            h = i;
+        }
+        var g = (0, t.useMemo)((function() {
             return {
-                descriptionWidth: i,
-                layout: s,
+                descriptionWidth: h,
+                layout: l,
                 separatorCharacter: c,
-                termWidth: m
+                termWidth: y
             };
-        }), [ i, s, c, m ]);
+        }), [ h, l, c, y ]);
         
         return n().createElement(u, P({
             "data-test": "definition-list",
             ref: a,
-            $layout: s
-        }, f),  n().createElement(o.Provider, {
-            value: y
+            $layout: l
+        }, f),  n().createElement(s.Provider, {
+            value: g
         }, r));
     }
-    C.propTypes = k;
-    C.Description = g;
-    C.Term = S;
-    /* harmony default export */    const R = C;
+    R.propTypes = C;
+    R.Description = b;
+    R.Term = j;
+    /* harmony default export */    const T = R;
     // CONCATENATED MODULE: ./src/DefinitionList/index.ts
     module.exports = r;
     /******/})();

package/Dropdown.js

@@ -221,7 +221,7 @@
                 var r = o.target;
                 while (r) {
                     // Ignore clicks on toggle.
-                    if (r.id === X) {
+                    if (V.current === r) {
                         return;
                     }
                     r = r.parentNode;
@@ -237,7 +237,7 @@
                 }
                 A === null || A === void 0 ? void 0 : A(e);
             }
-        }), [ y, O, $, B, A, X ]);
+        }), [ y, O, $, B, A ]);
         var oe = (0, n.useCallback)((function(e) {
             ee({
                 reason: "contentClick",