@splunk/react-ui 4.33.0 → 4.35.0

package/Card.js

@@ -64,7 +64,7 @@
         Body: () => /* reexport */ m,
         Footer: () => /* reexport */ k,
         Header: () => /* reexport */ Q,
-        default: () => /* reexport */ Be
+        default: () => /* reexport */ Re
     });
     // CONCATENATED MODULE: external "react"
     const t = require("react");
@@ -87,7 +87,7 @@
     })([ "flex:1 1 auto;overflow:auto;height:100%;", ";", "" ], (function(e) {
         var r = e.$inset;
         return r ? (0, a.css)([ "", "" ], (0, u.pick)({
-            enterprise: (0, a.css)([ "padding:", ";&:not(:first-child){padding-top:0;}" ], u.variables.spacing),
+            enterprise: (0, a.css)([ "padding:", ";&:not(:first-child){padding-top:0;}" ], u.variables.spacingLarge),
             prisma: {
                 comfortable: (0, a.css)([ "padding:12px 24px;&:first-child{padding-top:28px;}&:last-child{padding-bottom:28px;}" ]),
                 compact: (0, a.css)([ "padding:8px 24px;&:first-child{padding-top:20px;}&:last-child{padding-bottom:20px;}" ])
@@ -164,7 +164,7 @@
         displayName: "FooterStyles__StyledBox",
         componentId: "sc-1yu3r4s-0"
     })([ "", ";text-align:right;color:", ";", "" ], (0, u.pick)({
-        enterprise: (0, a.css)([ "padding:", ";&:first-child{border-top:none;}" ], u.variables.spacing),
+        enterprise: (0, a.css)([ "padding:", ";&:first-child{border-top:none;}" ], u.variables.spacingLarge),
         prisma: {
             comfortable: (0, a.css)([ "padding:24px;" ]),
             compact: "padding: 18px 24px"
@@ -242,19 +242,19 @@
     var P =  e.n(C);
     // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/MoreVertical"
     const _ = require("@splunk/react-icons/enterprise/MoreVertical");
-    var T =  e.n(_);
+    var E =  e.n(_);
     // CONCATENATED MODULE: external "@splunk/react-ui/Anchor"
-    const E = require("@splunk/react-ui/Anchor");
-    var B =  e.n(E);
+    const T = require("@splunk/react-ui/Anchor");
+    var B =  e.n(T);
     // CONCATENATED MODULE: external "@splunk/react-ui/Dropdown"
     const R = require("@splunk/react-ui/Dropdown");
     var I =  e.n(R);
     // CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
     const q = require("@splunk/react-ui/Tooltip");
-    var H =  e.n(q);
+    var N =  e.n(q);
     // CONCATENATED MODULE: external "@splunk/react-ui/Button"
-    const N = require("@splunk/react-ui/Button");
-    var $ =  e.n(N);
+    const H = require("@splunk/react-ui/Button");
+    var $ =  e.n(H);
     // CONCATENATED MODULE: ./src/Card/HeaderStyles.ts
     var A = l().div.withConfig({
         displayName: "HeaderStyles__StyledTitle",
@@ -282,10 +282,7 @@
         A, 
         /* sc-sel */
         W);
-    }), (0, u.pick)({
-        enterprise: u.variables.spacingHalf,
-        prisma: u.variables.spacingSmall
-    }));
+    }), u.variables.spacingSmall);
     var M = l().div.withConfig({
         displayName: "HeaderStyles__StyledActionContainer",
         componentId: "eqi6uk-3"
@@ -300,12 +297,12 @@
         displayName: "HeaderStyles__StyledSecondaryAction",
         componentId: "eqi6uk-4"
     })([ "margin-left:10px;" ]);
-    var z = l()(s()).withConfig({
+    var L = l()(s()).withConfig({
         displayName: "HeaderStyles__StyledBox",
         componentId: "eqi6uk-5"
     })([ "align-items:start;display:flex;flex:0 0 auto;justify-content:space-between;position:relative;min-height:30px;", " ", " >:not(", "):not(", "){flex:1 0 auto;}" ], (0, 
     u.pick)({
-        enterprise: (0, a.css)([ "padding:", ";" ], u.variables.spacing),
+        enterprise: (0, a.css)([ "padding:", ";" ], u.variables.spacingLarge),
         prisma: {
             comfortable: (0, a.css)([ "padding:16px 24px;&:last-child{padding-bottom:32px;}" ]),
             compact: (0, a.css)([ "padding:12px 24px;&:last-child{padding-bottom:24px;}" ])
@@ -318,7 +315,7 @@
     /* sc-sel */
     M);
     // CONCATENATED MODULE: ./src/Card/Header.tsx
-    function L(e, r) {
+    function z(e, r) {
         if (e == null) return {};
         var t = V(e, r);
         var n, o;
@@ -369,6 +366,10 @@
         title: i().node,
         truncateTitle: i().bool
     };
+ // The order of the interfaces is necessary to maintain proper error messages: HeaderWithActions then HeaderWithActionsRenderProp
+    // If the actions comes first the error will report that actions should be undefined
+    // when we want actions to be the intended use case
+    // type HeaderProps = ComponentProps<HeaderPropsBase, 'div'>;
     // `forwardRef` is used to enable focus on toggle when Dropdown is closing
         var J =  n().forwardRef((function(e, r) {
         var t = (0, u.useSplunkTheme)(), o = t.family, i = t.isCompact;
@@ -376,9 +377,9 @@
         var l = o === "prisma" ?  n().createElement(P(), {
             height: a,
             width: a
-        }) :  n().createElement(T(), null);
+        }) :  n().createElement(E(), null);
         
-        return n().createElement(H(), G({
+        return n().createElement(N(), G({
             content: (0, j._)("Actions"),
             contentRelationship: "label"
         }, e),  n().createElement(F, {
@@ -391,21 +392,28 @@
     /**
  * A styled container for `Card` header content.
  */    function K(e) {
-        var r = e.actionPrimary, t = e.actionsSecondary, o = e.anchor, i = e.children, a = e.subtitle, l = e.title, c = e.truncateTitle, s = c === void 0 ? true : c, p = L(e, [ "actionPrimary", "actionsSecondary", "anchor", "children", "subtitle", "title", "truncateTitle" ]);
+        var r = e.actions, t = e.actionPrimary, o = e.actionsSecondary, i = e.anchor, a = e.children, l = e.subtitle, c = e.title, s = e.truncateTitle, p = s === void 0 ? true : s, d = z(e, [ "actions", "actionPrimary", "actionsSecondary", "anchor", "children", "subtitle", "title", "truncateTitle" ]);
         // @docs-props-type HeaderPropsBase
-                var d = (0, u.useSplunkTheme)(), f = d.family;
-        var b = f === "prisma" ? "right" : "below";
+                var f = (0, u.useSplunkTheme)(), b = f.family;
+        var v = b === "prisma" ? "right" : "below";
+        if (false) {}
+        var y;
+        if (r) {
+            y = r();
+        } else if (t || o) {
+            y =  n().createElement(n().Fragment, null, t, o &&  n().createElement(I(), {
+                defaultPlacement: v,
+                toggle:  n().createElement(J, null)
+            }, o));
+        }
         
-        return n().createElement(z, G({
+        return n().createElement(L, G({
             "data-test": "header"
-        }, p), (l || a) &&  n().createElement(D, {
-            $truncateTitle: s
-        }, l &&  n().createElement(A, null, o ?  n().createElement(B(), {
-            name: o
-        }, l) : l), a &&  n().createElement(W, null, a)), i, (r || t) &&  n().createElement(M, null, r, t &&  n().createElement(I(), {
-            defaultPlacement: b,
-            toggle:  n().createElement(J, null)
-        }, t)));
+        }, d), (c || l) &&  n().createElement(D, {
+            $truncateTitle: p
+        }, c &&  n().createElement(A, null, i ?  n().createElement(B(), {
+            name: i
+        }, c) : c), l &&  n().createElement(W, null, l)), a, y &&  n().createElement(M, null, y));
     }
     K.propTypes = U;
     /* harmony default export */    const Q = K;
@@ -414,10 +422,7 @@
     var Y =  e.n(X);
     // CONCATENATED MODULE: ./src/Card/CardStyles.ts
     var Z = "0.2s";
-    var ee = l().div.withConfig({
-        displayName: "CardStyles__Styled",
-        componentId: "ola3x0-0"
-    })([ "", ";flex-direction:column;align-items:stretch;min-width:100px;flex:1;vertical-align:top;", " transition:height ", ",width ", ",min-width ", ",max-width ", ",margin ", ",box-shadow ", ",border-color ", ";", " &[data-clickable='true']{cursor:pointer;", " &:hover{", "}&:focus{", "}}" ], u.mixins.reset("inline-flex"), (0, 
+    var ee = (0, a.css)([ "", ";flex-direction:column;align-items:stretch;min-width:100px;flex:1;vertical-align:top;", " transition:height ", ",width ", ",min-width ", ",max-width ", ",margin ", ",box-shadow ", ",border-color ", ";", " &[data-clickable='true']{cursor:pointer;", " &:hover{", "}&:focus{", "}}" ], u.mixins.reset("inline-flex"), (0, 
     u.pick)({
         enterprise: (0, a.css)([ "background-color:", ";border:1px solid transparent;" ], u.variables.backgroundColor),
         prisma: (0, a.css)([ "background-color:", ";border-radius:", ";box-shadow:", ";" ], u.variables.backgroundColorSection, u.variables.borderRadius, u.variables.embossShadow)
@@ -439,36 +444,43 @@
         enterprise: (0, a.css)([ "box-shadow:", ";" ], u.variables.focusShadow),
         prisma: (0, a.css)([ "box-shadow:", ",", ";background-color:", ";" ], u.variables.embossShadow, u.variables.focusShadow, u.mixins.overlayColors(u.variables.backgroundColorSection, u.variables.interactiveColorOverlayHover))
     }));
-    var re = ee.withComponent(Y());
+    var re = l().article.withConfig({
+        displayName: "CardStyles__Styled",
+        componentId: "ola3x0-0"
+    })([ "", "" ], ee);
+    var te = l()(Y()).withConfig({
+        displayName: "CardStyles__StyledClickable",
+        componentId: "ola3x0-1"
+    })([ "", "" ], ee);
     /* A child element we add to <button>s to make flexbox work.
    Without this wrapper element, child elements won't flex
    in Firefox.
    This unfortunately exposes some fragility in IE (e.g., adding
    a flex: 1 style here will cause the card to collapse) so test
    across the supported browsers if making a change here.
-*/    var te = l().div.withConfig({
+*/    var ne = l().div.withConfig({
         displayName: "CardStyles__StyledFirefoxFlexHack",
-        componentId: "ola3x0-1"
+        componentId: "ola3x0-2"
     })([ "display:flex;flex:1 1 auto;flex-direction:column;align-items:stretch;justify-content:stretch;height:100%;", "" ], (0, 
     u.pick)({
         prisma: (0, a.css)([ "border-radius:", ";" ], u.variables.borderRadius)
     }));
     // CONCATENATED MODULE: ./src/Card/Card.tsx
-    function ne(e) {
+    function oe(e) {
         "@babel/helpers - typeof";
         if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-            ne = function e(r) {
+            oe = function e(r) {
                 return typeof r;
             };
         } else {
-            ne = function e(r) {
+            oe = function e(r) {
                 return r && typeof Symbol === "function" && r.constructor === Symbol && r !== Symbol.prototype ? "symbol" : typeof r;
             };
         }
-        return ne(e);
+        return oe(e);
     }
-    function oe() {
-        oe = Object.assign || function(e) {
+    function ie() {
+        ie = Object.assign || function(e) {
             for (var r = 1; r < arguments.length; r++) {
                 var t = arguments[r];
                 for (var n in t) {
@@ -479,30 +491,30 @@
             }
             return e;
         };
-        return oe.apply(this, arguments);
+        return ie.apply(this, arguments);
     }
-    function ie(e, r) {
-        return ue(e) || se(e, r) || le(e, r) || ae();
+    function ae(e, r) {
+        return pe(e) || ue(e, r) || ce(e, r) || le();
     }
-    function ae() {
+    function le() {
         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 le(e, r) {
+    function ce(e, r) {
         if (!e) return;
-        if (typeof e === "string") return ce(e, r);
+        if (typeof e === "string") return se(e, r);
         var t = Object.prototype.toString.call(e).slice(8, -1);
         if (t === "Object" && e.constructor) t = e.constructor.name;
         if (t === "Map" || t === "Set") return Array.from(e);
-        if (t === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)) return ce(e, r);
+        if (t === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)) return se(e, r);
     }
-    function ce(e, r) {
+    function se(e, r) {
         if (r == null || r > e.length) r = e.length;
         for (var t = 0, n = new Array(r); t < r; t++) {
             n[t] = e[t];
         }
         return n;
     }
-    function se(e, r) {
+    function ue(e, r) {
         if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(e))) return;
         var t = [];
         var n = true;
@@ -525,15 +537,15 @@
         }
         return t;
     }
-    function ue(e) {
+    function pe(e) {
         if (Array.isArray(e)) return e;
     }
-    function pe(e, r) {
+    function de(e, r) {
         if (!(e instanceof r)) {
             throw new TypeError("Cannot call a class as a function");
         }
     }
-    function de(e, r) {
+    function fe(e, r) {
         for (var t = 0; t < r.length; t++) {
             var n = r[t];
             n.enumerable = n.enumerable || false;
@@ -542,12 +554,12 @@
             Object.defineProperty(e, n.key, n);
         }
     }
-    function fe(e, r, t) {
-        if (r) de(e.prototype, r);
-        if (t) de(e, t);
+    function be(e, r, t) {
+        if (r) fe(e.prototype, r);
+        if (t) fe(e, t);
         return e;
     }
-    function be(e, r) {
+    function ve(e, r) {
         if (typeof r !== "function" && r !== null) {
             throw new TypeError("Super expression must either be null or a function");
         }
@@ -558,41 +570,41 @@
                 configurable: true
             }
         });
-        if (r) ve(e, r);
+        if (r) ye(e, r);
     }
-    function ve(e, r) {
-        ve = Object.setPrototypeOf || function e(r, t) {
+    function ye(e, r) {
+        ye = Object.setPrototypeOf || function e(r, t) {
             r.__proto__ = t;
             return r;
         };
-        return ve(e, r);
+        return ye(e, r);
     }
-    function ye(e) {
-        var r = ge();
+    function me(e) {
+        var r = we();
         return function t() {
-            var n = we(e), o;
+            var n = Oe(e), o;
             if (r) {
-                var i = we(this).constructor;
+                var i = Oe(this).constructor;
                 o = Reflect.construct(n, arguments, i);
             } else {
                 o = n.apply(this, arguments);
             }
-            return me(this, o);
+            return he(this, o);
         };
     }
-    function me(e, r) {
-        if (r && (ne(r) === "object" || typeof r === "function")) {
+    function he(e, r) {
+        if (r && (oe(r) === "object" || typeof r === "function")) {
             return r;
         }
-        return he(e);
+        return ge(e);
     }
-    function he(e) {
+    function ge(e) {
         if (e === void 0) {
             throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
         }
         return e;
     }
-    function ge() {
+    function we() {
         if (typeof Reflect === "undefined" || !Reflect.construct) return false;
         if (Reflect.construct.sham) return false;
         if (typeof Proxy === "function") return true;
@@ -603,13 +615,13 @@
             return false;
         }
     }
-    function we(e) {
-        we = Object.setPrototypeOf ? Object.getPrototypeOf : function e(r) {
+    function Oe(e) {
+        Oe = Object.setPrototypeOf ? Object.getPrototypeOf : function e(r) {
             return r.__proto__ || Object.getPrototypeOf(r);
         };
-        return we(e);
+        return Oe(e);
     }
-    function Oe(e, r) {
+    function xe(e, r) {
         var t = Object.keys(e);
         if (Object.getOwnPropertySymbols) {
             var n = Object.getOwnPropertySymbols(e);
@@ -620,24 +632,24 @@
         }
         return t;
     }
-    function xe(e) {
+    function Se(e) {
         for (var r = 1; r < arguments.length; r++) {
             var t = arguments[r] != null ? arguments[r] : {};
             if (r % 2) {
-                Oe(Object(t), true).forEach((function(r) {
-                    Se(e, r, t[r]);
+                xe(Object(t), true).forEach((function(r) {
+                    ke(e, r, t[r]);
                 }));
             } else if (Object.getOwnPropertyDescriptors) {
                 Object.defineProperties(e, Object.getOwnPropertyDescriptors(t));
             } else {
-                Oe(Object(t)).forEach((function(r) {
+                xe(Object(t)).forEach((function(r) {
                     Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
                 }));
             }
         }
         return e;
     }
-    function Se(e, r, t) {
+    function ke(e, r, t) {
         if (r in e) {
             Object.defineProperty(e, r, {
                 value: t,
@@ -650,9 +662,9 @@
         }
         return e;
     }
-    function ke(e, r) {
+    function je(e, r) {
         if (e == null) return {};
-        var t = je(e, r);
+        var t = Ce(e, r);
         var n, o;
         if (Object.getOwnPropertySymbols) {
             var i = Object.getOwnPropertySymbols(e);
@@ -665,7 +677,7 @@
         }
         return t;
     }
-    function je(e, r) {
+    function Ce(e, r) {
         if (e == null) return {};
         var t = {};
         var n = Object.keys(e);
@@ -677,7 +689,7 @@
         }
         return t;
     }
-    var Ce = {
+    var Pe = {
         children: i().node,
         elementRef: i().oneOfType([ i().func, i().object ]),
         /** @private */
@@ -691,18 +703,19 @@
         selected: i().bool,
         showBorder: i().bool,
         to: i().string,
-        value: i().any
+        value: i().any,
+        tag: i().oneOf([ "article", "div", "aside", "section" ])
     };
-    var Pe = {
+    var _e = {
         openInNewContext: false,
         showBorder: true
     };
-    function _e(e) {
+    function Ee(e) {
         return !!e.onClick || !!e.to;
     }
     function Te(e) {
-        var r = e.margin, t = e.maxWidth, n = e.minWidth, o = e.showBorder, i = e.style, a = ke(e, [ "margin", "maxWidth", "minWidth", "showBorder", "style" ]);
-        var l = xe({
+        var r = e.margin, t = e.maxWidth, n = e.minWidth, o = e.showBorder, i = e.style, a = je(e, [ "margin", "maxWidth", "minWidth", "showBorder", "style" ]);
+        var l = Se({
             minWidth: n,
             maxWidth: t,
             margin: r
@@ -714,17 +727,17 @@
         };
         return [ c, a ];
     }
-    var Ee =  function(e) {
-        be(t, e);
-        var r = ye(t);
+    var Be =  function(e) {
+        ve(t, e);
+        var r = me(t);
         function t() {
             var e;
-            pe(this, t);
+            de(this, t);
             for (var n = arguments.length, o = new Array(n), i = 0; i < n; i++) {
                 o[i] = arguments[i];
             }
             e = r.call.apply(r, [ this ].concat(o));
-            Se(he(e), "handleCardClick", (function(r) {
+            ke(ge(e), "handleCardClick", (function(r) {
                 var t, n;
                 var o = e.props, i = o.selected, a = o.value;
                 (t = (n = e.props).onClick) === null || t === void 0 ? void 0 : t.call(n, r, {
@@ -734,15 +747,15 @@
             }));
             return e;
         }
-        fe(t, [ {
+        be(t, [ {
             key: "render",
             value: function e() {
-                if (_e(this.props)) {
-                    var r = Te(this.props), t = ie(r, 2), o = t[0], i = t[1];
+                if (Ee(this.props)) {
+                    var r = Te(this.props), t = ae(r, 2), o = t[0], i = t[1];
                     var a = o.showBorder;
-                    var l = i.children, c = i.elementRef, s = i.onClick, u = i.openInNewContext, p = i.selected, d = i.to, f = ke(i, [ "children", "elementRef", "onClick", "openInNewContext", "selected", "to" ]);
+                    var l = i.children, c = i.elementRef, s = i.onClick, u = i.openInNewContext, p = i.selected, d = i.to, f = je(i, [ "children", "elementRef", "onClick", "openInNewContext", "selected", "to" ]);
                     
-                    return n().createElement(re, oe({
+                    return n().createElement(te, ie({
                         "data-clickable": true,
                         $selected: p || false,
                         $cardHasBorder: a,
@@ -751,27 +764,30 @@
                         onClick: s ? this.handleCardClick : undefined,
                         openInNewContext: u,
                         to: d || undefined
-                    }),  n().createElement(te, null, l));
+                    }),  n().createElement(ne, null, l));
                 }
-                var b = Te(this.props), v = ie(b, 2), y = v[0], m = v[1];
+                var b = Te(this.props), v = ae(b, 2), y = v[0], m = v[1];
                 var h = y.showBorder;
-                var g = m.children, w = m.elementRef, O = ke(m, [ "children", "elementRef" ]);
+                var g = m.children, w = m.elementRef, O = m.tag, x = je(m, [ "children", "elementRef", "tag" ]);
                 
-                return n().createElement(ee, oe({
+                return n().createElement(re, ie({
                     $selected: false,
                     $cardHasBorder: h,
-                    ref: w
-                }, y, O), g);
+                    ref: w,
+                    as: O
+                }, y, x, {
+                    onClick: undefined
+                }), g);
             }
         } ]);
         return t;
     }(t.Component);
-    Se(Ee, "propTypes", Ce);
-    Se(Ee, "defaultProps", Pe);
-    Se(Ee, "Header", Q);
-    Se(Ee, "Body", m);
-    Se(Ee, "Footer", k);
-    /* harmony default export */    const Be = Ee;
+    ke(Be, "propTypes", Pe);
+    ke(Be, "defaultProps", _e);
+    ke(Be, "Header", Q);
+    ke(Be, "Body", m);
+    ke(Be, "Footer", k);
+    /* harmony default export */    const Re = Be;
     // CONCATENATED MODULE: ./src/Card/index.ts
     module.exports = r;
     /******/})();