@splunk/react-ui 4.31.0 → 4.33.0

package/Button.js

@@ -73,9 +73,9 @@
     const o = require("lodash/isString");
     var l =  e.n(o);
     // CONCATENATED MODULE: external "@splunk/react-ui/Dropdown"
-    const c = require("@splunk/react-ui/Dropdown");
+    const s = require("@splunk/react-ui/Dropdown");
     // CONCATENATED MODULE: external "@splunk/ui-utils/style"
-    const s = require("@splunk/ui-utils/style");
+    const c = require("@splunk/ui-utils/style");
     // CONCATENATED MODULE: external "styled-components"
     const p = require("styled-components");
     var u =  e.n(p);
@@ -88,15 +88,15 @@
     var v = u().span.withConfig({
         displayName: "ButtonStyles__StyledIcon",
         componentId: "eqxqs2-0"
-    })([ "display:flex;align-items:center;flex-shrink:0;font-size:", ";", ";" ], (0, 
+    })([ "display:flex;align-items:center;flex-shrink:0;font-size:", ";", "" ], (0, 
     m.pick)({
         enterprise: "inherit",
         prisma: {
             comfortable: "21px",
             compact: "16px"
         }
-    }), (0, m.pickVariant)("$isIconOnly", {
-        false: {
+    }), (0, m.pickVariant)("$isStartIcon", {
+        true: {
             enterprise: (0, p.css)([ "padding-right:3px;" ]),
             prisma: (0, p.css)([ "padding-right:8px;" ])
         }
@@ -104,7 +104,7 @@
     var y = u()(d()).withConfig({
         displayName: "ButtonStyles__StyledButtonSimple",
         componentId: "eqxqs2-1"
-    })([ "text-align:center;vertical-align:middle;text-decoration:none;white-space:nowrap;flex-grow:1;min-width:0;max-width:100%;line-height:", ";min-height:", ";padding:", ";", " ", " &[data-inline]{display:inline-block;vertical-align:middle;", "}[data-inline] + &&[data-inline]{margin-bottom:0;", "}" ], m.variables.lineHeight, m.variables.inputHeight, (0, 
+    })([ "text-decoration:none;white-space:nowrap;flex-grow:1;min-width:0;max-width:100%;line-height:", ";min-height:", ";padding:", ";", " ", " &[data-inline]{:where(:not(a)){display:inline-block;}:where(a){display:inline-flex;}vertical-align:middle;", "}[data-inline] + &&[data-inline]{margin-bottom:0;", "}" ], m.variables.lineHeight, m.variables.inputHeight, (0, 
     m.pick)({
         enterprise: {
             comfortable: "5px 14px",
@@ -149,7 +149,7 @@
     var b = u().span.withConfig({
         displayName: "ButtonStyles__StyledContentWrapper",
         componentId: "eqxqs2-2"
-    })([ "display:flex;flex-direction:row;justify-content:center;align-items:center;max-width:100%;padding:", ";" ], (0, 
+    })([ "display:flex;flex-direction:row;justify-content:center;align-items:center;flex:1 0 auto;max-width:100%;box-sizing:border-box;padding:", ";" ], (0, 
     m.pick)({
         enterprise: function e(t) {
             var n = t.$error;
@@ -164,7 +164,9 @@
                 pill: "0",
                 toggle: "0",
                 // === default
-                flat: "0"
+                flat: "0",
+                // === default
+                subtle: "0"
             });
         },
         prisma: (0, m.pickVariant)("$appearance", {
@@ -175,7 +177,8 @@
             pill: "1px 0",
             // === secondary
             toggle: "0",
-            flat: "1px 0"
+            flat: "1px 0",
+            subtle: "1px 0"
         })
     }));
     var h = u().span.withConfig({
@@ -226,27 +229,20 @@
     /* harmony default export */    const C = O;
     // CONCATENATED MODULE: external "@splunk/react-icons/ArrowSquareTopRightInset"
     const q = require("@splunk/react-icons/ArrowSquareTopRightInset");
-    var _ =  e.n(q);
+    var $ =  e.n(q);
     // CONCATENATED MODULE: external "@splunk/react-icons/enterprise/External"
-    const $ = require("@splunk/react-icons/enterprise/External");
-    var I =  e.n($);
+    const _ = require("@splunk/react-icons/enterprise/External");
+    var I =  e.n(_);
     // CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
     const E = require("@splunk/ui-utils/i18n");
     // CONCATENATED MODULE: ./src/Button/icons/External.tsx
     var P = (0, E._)("Open externally");
     function j() {
-        var e = (0, m.useSplunkTheme)(), t = e.isEnterprise, n = e.isCompact;
-        var i = n ? "20px" : "24px";
+        var e = (0, m.useSplunkTheme)(), t = e.isEnterprise;
         return t ?  r().createElement(I(), {
-            screenReaderText: P,
-            size: .8,
-            style: {
-                verticalAlign: "baseline"
-            }
-        }) :  r().createElement(_(), {
-            "aria-label": P,
-            height: i,
-            width: i
+            screenReaderText: P
+        }) :  r().createElement($(), {
+            "aria-label": P
         },  r().createElement("title", null, P));
     }
     /* harmony default export */    const N = j;
@@ -327,16 +323,16 @@
             } else {
                 i = r.apply(this, arguments);
             }
-            return A(this, i);
+            return W(this, i);
         };
     }
-    function A(e, t) {
+    function W(e, t) {
         if (t && (M(t) === "object" || typeof t === "function")) {
             return t;
         }
-        return W(e);
+        return A(e);
     }
-    function W(e) {
+    function A(e) {
         if (e === void 0) {
             throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
         }
@@ -374,7 +370,7 @@
     }
     var J = {
         action: a().string,
-        appearance: a().oneOf([ "default", "secondary", "primary", "destructive", "pill", "toggle", "flat" ]),
+        appearance: a().oneOf([ "default", "secondary", "primary", "destructive", "pill", "toggle", "flat", "subtle" ]),
         append: a().bool,
         children: a().node,
         /** @private An additional className to add to the button. */
@@ -401,8 +397,7 @@
         inline: true,
         isMenu: false,
         openInNewContext: false,
-        prepend: false,
-        selected: false
+        prepend: false
     };
     var Q =  function(e) {
         H(n, e);
@@ -412,8 +407,8 @@
             var r;
             R(this, n);
             r = t.call(this, e);
-            G(W(r), "component", null);
-            G(W(r), "handleClick", (function(e) {
+            G(A(r), "component", null);
+            G(A(r), "handleClick", (function(e) {
                 var t = r.props, n = t.label, i = t.icon, a = t.value, o = t.action, l = t.onClick;
                 l === null || l === void 0 ? void 0 : l(e, {
                     label: n,
@@ -422,7 +417,7 @@
                     action: o
                 });
             }));
-            G(W(r), "handleMount", (function(e) {
+            G(A(r), "handleMount", (function(e) {
                 r.component = e;
             }));
             if (false) {}
@@ -440,13 +435,13 @@
         }, {
             key: "render",
             value: function e() {
-                var t = this.props, n = t.action, i = t.appearance, a = t.append, o = t.className, c = t.classNamePrivate, p = t.disabled, u = t.error, f = t.icon, d = t.inline, m = t.isMenu, g = t.onClick, w = t.openInNewContext, k = t.prepend, S = t.to, O = t.value;
-                var q = this.props, _ = q.children, $ = q.label;
-                if (!$ && l()(_)) {
-                    $ = _;
-                    _ = null;
+                var t = this.props, n = t.action, i = t.appearance, a = t.append, o = t.className, s = t.classNamePrivate, p = t.disabled, u = t.error, f = t.icon, d = t.inline, m = t.isMenu, g = t.onClick, w = t.openInNewContext, k = t.prepend, S = t.to, O = t.value;
+                var q = this.props, $ = q.children, _ = q.label;
+                if (!_ && l()($)) {
+                    _ = $;
+                    $ = null;
                 }
-                var I = !!(f && !$ && !m && !_);
+                var I = !!(f && !_ && !m && !$);
                 var E = S && w || m || !!f;
                 
                 return r().createElement(y, T({
@@ -454,7 +449,7 @@
                     "aria-invalid": u || undefined,
                     "data-test": "button"
                 }, this.props, {
-                    className: (0, s.toClassName)(o, c),
+                    className: (0, c.toClassName)(o, s),
                     "data-action": n,
                     "data-inline": d || null,
                     disabled: p,
@@ -473,21 +468,23 @@
                     $appearance: i,
                     $error: u
                 }, f &&  r().createElement(v, {
-                    $isIconOnly: I
-                }, f), $ &&  r().createElement(h, {
+                    $isStartIcon: !I
+                }, f), _ &&  r().createElement(h, {
                     "data-test": "label",
                     $isMenu: m
-                }, $), _, m &&  r().createElement(x, {
+                }, _), $, m &&  r().createElement(x, {
                     $disabled: p,
                     $primary: i === "primary"
-                },  r().createElement(C, null)), w &&  r().createElement(N, null)));
+                },  r().createElement(C, null)), w &&  r().createElement(v, {
+                    $isStartIcon: false
+                },  r().createElement(N, null))));
             }
         } ]);
         return n;
     }(n.Component);
     G(Q, "propTypes", J);
     G(Q, "defaultProps", K);
-    G(Q, c.legacyRefMode, true);
+    G(Q, s.legacyRefMode, true);
     /* harmony default export */    const U = Q;
     // CONCATENATED MODULE: ./src/Button/index.ts
     module.exports = t;