@splunk/react-ui 4.34.0 → 4.35.0

package/StepBar.js

@@ -61,8 +61,8 @@
         e.r(t);
     // EXPORTS
         e.d(t, {
-        Step: () => /* reexport */ $,
-        default: () => /* reexport */ z
+        Step: () => /* reexport */ q,
+        default: () => /* reexport */ V
     });
     // CONCATENATED MODULE: external "react"
     const r = require("react");
@@ -80,29 +80,29 @@
     var p =  e.n(c);
     // CONCATENATED MODULE: external "@splunk/react-icons/CheckCircle"
     const d = require("@splunk/react-icons/CheckCircle");
-    var u =  e.n(d);
+    var v =  e.n(d);
     // CONCATENATED MODULE: external "@splunk/react-icons/ExclamationCircle"
-    const v = require("@splunk/react-icons/ExclamationCircle");
-    var f =  e.n(v);
+    const u = require("@splunk/react-icons/ExclamationCircle");
+    var f =  e.n(u);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const m = require("@splunk/themes");
+    const y = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/StepBar/StepStyles.ts
-    var y = "#1A8929";
+    var m = "#1A8929";
  // SUI-2439 to meet WCAG AA compliance
         var x = p().li.withConfig({
         displayName: "StepStyles__Styled",
         componentId: "sc-756fxp-0"
-    })([ "", " ", ";text-align:center;padding:", ";", ";", "" ], m.mixins.reset("block"), (0, 
-    m.pick)({
+    })([ "", " ", ";text-align:center;padding:", ";", ";", "" ], y.mixins.reset("block"), (0, 
+    y.pick)({
         enterprise: (0, c.css)([ "position:relative;flex:1 1 0;" ]),
         prisma: (0, c.css)([ "display:flex;align-items:center;flex:0 1 auto;margin:0 12px 0 12px;" ])
-    }), (0, m.pick)({
+    }), (0, y.pick)({
         enterprise: "25px 15px 0",
         prisma: {
             comfortable: "8px 8px 8px 0",
             compact: "4px 8px 4px 0"
         }
-    }), (0, m.pick)({
+    }), (0, y.pick)({
         prisma: (0, c.css)([ "&::before{align-items:center;box-sizing:border-box;border-radius:50%;counter-increment:", ";content:counter(", ");display:inline-flex;flex-shrink:0;font-size:12px;height:20px;width:20px;justify-content:center;line-height:20px;margin:2px 16px 2px 18px;}" ], (function(e) {
             var t = e.$idCounter;
             return t;
@@ -110,47 +110,51 @@
             var t = e.$idCounter;
             return t;
         }))
-    }), (0, m.pickVariant)("$status", {
+    }), (0, y.pickVariant)("$status", {
         error: {
-            prisma: (0, c.css)([ "color:", ";&::before{visibility:hidden;position:absolute;}" ], m.variables.contentColorActive)
+            prisma: (0, c.css)([ "color:", ";&::before{visibility:hidden;position:absolute;}" ], y.variables.contentColorActive)
         },
         active: {
-            prisma: (0, c.css)([ "color:", ";&::before{color:", ";background:", ";border:1px solid ", ";}" ], m.variables.contentColorActive, m.variables.contentColorInverted, m.variables.contentColorActive, m.variables.contentColorActive)
+            prisma: (0, c.css)([ "color:", ";&::before{color:", ";background:", ";border:1px solid ", ";}" ], y.variables.contentColorActive, y.variables.contentColorInverted, y.variables.contentColorActive, y.variables.contentColorActive)
         },
         next: {
-            enterprise: (0, c.css)([ "color:", ";" ], m.variables.textColor),
-            prisma: (0, c.css)([ "color:", ";&::before{color:", ";border:1px solid ", ";}" ], m.variables.contentColorMuted, m.variables.contentColorMuted, m.variables.contentColorMuted)
+            enterprise: (0, c.css)([ "color:", ";" ], y.variables.textColor),
+            prisma: (0, c.css)([ "color:", ";&::before{color:", ";border:1px solid ", ";}" ], y.variables.contentColorMuted, y.variables.contentColorMuted, y.variables.contentColorMuted)
         },
         prev: {
-            prisma: (0, c.css)([ "color:", ";&::before{visibility:hidden;position:absolute;}" ], m.variables.contentColorDefault)
+            prisma: (0, c.css)([ "color:", ";&::before{visibility:hidden;position:absolute;}" ], y.variables.contentColorDefault)
         }
     }));
     var b = (0, c.css)([ "height:24px;width:24px;margin:0 14px 0 16px;" ]);
-    var h = p()(u()).withConfig({
+    var h = p()(v()).withConfig({
         displayName: "StepStyles__StyledCheckCircleIcon",
         componentId: "sc-756fxp-1"
-    })([ "", ";color:", ";" ], b, m.variables.accentColorPositive);
+    })([ "", ";color:", ";" ], b, y.variables.accentColorPositive);
     var g = p()(f()).withConfig({
         displayName: "StepStyles__StyledExclamationCircleIcon",
         componentId: "sc-756fxp-2"
-    })([ "", ";color:", ";" ], b, m.variables.accentColorNegative);
+    })([ "", ";color:", ";" ], b, y.variables.accentColorNegative);
     var S = p().svg.withConfig({
         displayName: "StepStyles__StyledSvg",
         componentId: "sc-756fxp-3"
     })([ "position:absolute;left:0;right:0;top:0;" ]);
-    var C = p().rect.withConfig({
+    var C = (0, c.css)([ "fill:", ";" ], m);
+    var w = p().rect.withConfig({
         displayName: "StepStyles__StyledPrevOrActiveRect",
         componentId: "sc-756fxp-4"
-    })([ "fill:", ";" ], y);
-    var w = C.withComponent("circle");
-    var O = p().rect.withConfig({
-        displayName: "StepStyles__StyledGray",
+    })([ "", "" ], C);
+    var O = p().circle.withConfig({
+        displayName: "StepStyles__StyledPrevOrActiveCircle",
         componentId: "sc-756fxp-5"
-    })([ "fill:", ";" ], m.variables.gray60);
-    var I = p().circle.withConfig({
-        displayName: "StepStyles__StyledNext",
+    })([ "", "" ], C);
+    var I = p().rect.withConfig({
+        displayName: "StepStyles__StyledGray",
         componentId: "sc-756fxp-6"
-    })([ "stroke:", ";stroke-width:3px;fill:", ";" ], m.variables.gray60, m.variables.backgroundColor);
+    })([ "fill:", ";" ], y.variables.gray60);
+    var _ = p().circle.withConfig({
+        displayName: "StepStyles__StyledNext",
+        componentId: "sc-756fxp-7"
+    })([ "stroke:", ";stroke-width:3px;fill:", ";" ], y.variables.gray60, y.variables.backgroundColor);
     // CONCATENATED MODULE: ./src/StepBar/StepBarContext.tsx
     var k =  (0, r.createContext)({
         activeStepId: 0
@@ -158,8 +162,8 @@
     k.displayName = "StepBar";
     /* harmony default export */    const E = k;
     // CONCATENATED MODULE: ./src/StepBar/Step.tsx
-    function _() {
-        _ = Object.assign || function(e) {
+    function j() {
+        j = Object.assign || function(e) {
             for (var t = 1; t < arguments.length; t++) {
                 var r = arguments[t];
                 for (var n in r) {
@@ -170,11 +174,11 @@
             }
             return e;
         };
-        return _.apply(this, arguments);
+        return j.apply(this, arguments);
     }
-    function j(e, t) {
+    function P(e, t) {
         if (e == null) return {};
-        var r = P(e, t);
+        var r = N(e, t);
         var n, i;
         if (Object.getOwnPropertySymbols) {
             var o = Object.getOwnPropertySymbols(e);
@@ -187,7 +191,7 @@
         }
         return r;
     }
-    function P(e, t) {
+    function N(e, t) {
         if (e == null) return {};
         var r = {};
         var n = Object.keys(e);
@@ -199,35 +203,35 @@
         }
         return r;
     }
-    var N = {
+    var R = {
         children: o().node,
         elementRef: o().oneOfType([ o().func, o().object ]),
         error: o().bool,
         stepId: o().any
     };
-    function R(e) {
-        var t = e.children, i = e.elementRef, o = e.error, a = o === void 0 ? false : o, l = e.stepId, c = j(e, [ "children", "elementRef", "error", "stepId" ]);
+    function $(e) {
+        var t = e.children, i = e.elementRef, o = e.error, a = o === void 0 ? false : o, l = e.stepId, c = P(e, [ "children", "elementRef", "error", "stepId" ]);
         // @docs-props-type StepPropsBase
-                var p = (0, r.useContext)(k), d = p.activeStepId, u = p.idCounter, v = p.lastChildIndex;
-        var f = s()(), m = f.isEnterprise;
-        var y = "next";
+                var p = (0, r.useContext)(k), d = p.activeStepId, v = p.idCounter, u = p.lastChildIndex;
+        var f = s()(), y = f.isEnterprise;
+        var m = "next";
         var b = d === l;
-        var E = l === 0;
-        var P = l === v;
+        var C = l === 0;
+        var E = l === u;
         if (l < d) {
-            y = "prev";
+            m = "prev";
         }
         if (b && !a) {
-            y = "active";
+            m = "active";
         }
         if (b && a) {
-            y = "error";
+            m = "error";
         }
-        if (m) {
+        if (y) {
             
-            return n().createElement(x, _({
-                $status: y,
-                "data-test-status": y,
+            return n().createElement(x, j({
+                $status: m,
+                "data-test-status": m,
                 "data-test": "step",
                 "data-test-step-id": l,
                 ref: i
@@ -238,18 +242,18 @@
                 viewBox: "0 0 100 15",
                 preserveAspectRatio: "none",
                 xmlns: "http://www.w3.org/2000/svg"
-            },  n().createElement(O, {
-                x: E ? "50" : "0",
+            },  n().createElement(I, {
+                x: C ? "50" : "0",
                 y: "6",
-                width: P || E ? "50%" : "100%",
+                width: E || C ? "50%" : "100%",
                 height: "3"
-            }), (y === "active" || y === "error") && !E &&  n().createElement(C, {
+            }), (m === "active" || m === "error") && !C &&  n().createElement(w, {
                 x: "0",
                 y: "6",
                 width: "50%",
                 height: "3"
-            }), y === "prev" &&  n().createElement(C, {
-                x: E ? "50%" : "0",
+            }), m === "prev" &&  n().createElement(w, {
+                x: C ? "50%" : "0",
                 y: "6",
                 width: "100%",
                 height: "3"
@@ -259,33 +263,33 @@
                 height: "15px",
                 viewBox: "0 0 15 15",
                 xmlns: "http://www.w3.org/2000/svg"
-            }, y !== "next" &&  n().createElement(w, {
+            }, m !== "next" &&  n().createElement(O, {
                 cx: "50%",
                 cy: "50%",
                 r: "7.5"
-            }), y === "next" &&  n().createElement(I, {
+            }), m === "next" &&  n().createElement(_, {
                 cx: "50%",
                 cy: "50%",
                 r: "6"
             })), t);
         }
         
-        return n().createElement(x, _({
-            $status: y,
-            "data-test-status": y,
+        return n().createElement(x, j({
+            $status: m,
+            "data-test-status": m,
             "data-test": "step",
             "data-test-step-id": l,
-            $idCounter: u,
+            $idCounter: v,
             ref: i
-        }, c), y === "prev" &&  n().createElement(h, null), y === "error" &&  n().createElement(g, null), t);
+        }, c), m === "prev" &&  n().createElement(h, null), m === "error" &&  n().createElement(g, null), t);
     }
-    R.propTypes = N;
-    /* harmony default export */    const $ = R;
+    $.propTypes = R;
+    /* harmony default export */    const q = $;
     // CONCATENATED MODULE: ./src/StepBar/StepBarStyles.ts
-    var q = p().ul.withConfig({
+    var A = p().ul.withConfig({
         displayName: "StepBarStyles__Styled",
         componentId: "sc-13bf2x4-0"
-    })([ "", ";", ";", ";" ], m.mixins.reset("flex"), (0, m.pick)({
+    })([ "", ";", ";", ";" ], y.mixins.reset("flex"), (0, y.pick)({
         prisma: (0, c.css)([ "position:relative;display:flex;counter-reset:", ";" ], (function(e) {
             var t = e.$idCounter;
             return t;
@@ -295,8 +299,8 @@
         return t && (0, c.css)([ "display:inline-flex;" ]);
     }));
     // CONCATENATED MODULE: ./src/StepBar/StepBar.tsx
-    function A() {
-        A = Object.assign || function(e) {
+    function M() {
+        M = Object.assign || function(e) {
             for (var t = 1; t < arguments.length; t++) {
                 var r = arguments[t];
                 for (var n in r) {
@@ -307,11 +311,11 @@
             }
             return e;
         };
-        return A.apply(this, arguments);
+        return M.apply(this, arguments);
     }
-    function M(e, t) {
+    function T(e, t) {
         if (e == null) return {};
-        var r = T(e, t);
+        var r = B(e, t);
         var n, i;
         if (Object.getOwnPropertySymbols) {
             var o = Object.getOwnPropertySymbols(e);
@@ -324,7 +328,7 @@
         }
         return r;
     }
-    function T(e, t) {
+    function B(e, t) {
         if (e == null) return {};
         var r = {};
         var n = Object.keys(e);
@@ -336,24 +340,24 @@
         }
         return r;
     }
-    var B = {
+    var D = {
         activeStepId: o().any.isRequired,
         children: o().node,
         elementRef: o().oneOfType([ o().func, o().object ]),
         inline: o().bool
     };
-    function D(e) {
-        var t = e.activeStepId, i = e.children, o = e.elementRef, l = e.inline, s = l === void 0 ? false : l, c = M(e, [ "activeStepId", "children", "elementRef", "inline" ]);
+    function z(e) {
+        var t = e.activeStepId, i = e.children, o = e.elementRef, l = e.inline, s = l === void 0 ? false : l, c = T(e, [ "activeStepId", "children", "elementRef", "inline" ]);
         // @docs-props-type StepBarPropsBase
                 var p = (0, r.useRef)((0, a.createDOMID)("stepbar")), d = p.current;
-        var u = 0;
-        var v = r.Children.toArray(i).filter(r.isValidElement);
-        var f = v.length - 1;
-        var m = v.map((function(e, n) {
+        var v = 0;
+        var u = r.Children.toArray(i).filter(r.isValidElement);
+        var f = u.length - 1;
+        var y = u.map((function(e, n) {
             var i = e.props.stepId || n;
             var o = e.props.error;
             if (i === t) {
-                u = n;
+                v = n;
             }
             
             return (0, r.cloneElement)(e, {
@@ -362,14 +366,14 @@
             });
         }));
         
-        return n().createElement(q, A({
+        return n().createElement(A, M({
             $inline: s,
             "data-test": "step-bar",
             "data-test-active-step-id": t,
             role: "progressbar",
             "aria-valuemin": 1,
             "aria-valuemax": f + 1,
-            "aria-valuenow": u + 1,
+            "aria-valuenow": v + 1,
             $idCounter: d,
             ref: o
         }, c),  n().createElement(E.Provider, {
@@ -378,11 +382,11 @@
                 lastChildIndex: f,
                 activeStepId: t
             }
-        }, m));
+        }, y));
     }
-    D.propTypes = B;
-    D.Step = $;
-    /* harmony default export */    const z = D;
+    z.propTypes = D;
+    z.Step = q;
+    /* harmony default export */    const V = z;
     // CONCATENATED MODULE: ./src/StepBar/index.ts
     module.exports = t;
     /******/})();