@splunk/react-ui 5.0.0-beta.2 → 5.0.0-beta.4

package/StaticContent.js

@@ -61,7 +61,7 @@
         e.r(n);
     // EXPORTS
         e.d(n, {
-        default: () => /* reexport */ y
+        default: () => /* reexport */ b
     });
     // CONCATENATED MODULE: external "react"
     const r = require("react");
@@ -70,12 +70,12 @@
     const i = require("prop-types");
     var l =  e.n(i);
     // CONCATENATED MODULE: external "styled-components"
-    const o = require("styled-components");
-    var a =  e.n(o);
+    const a = require("styled-components");
+    var o =  e.n(a);
     // CONCATENATED MODULE: external "@splunk/themes"
     const s = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/StaticContent/StaticContentStyles.ts
-    var u = a().div.withConfig({
+    var u = o().div.withConfig({
         displayName: "StaticContentStyles__StyledDiv",
         componentId: "sxqyrp-0"
     })([ "", " position:relative;margin:0;font-weight:", ";word-wrap:break-word;min-height:", ";padding:0 ", ";align-items:center;" ], (function(e) {
@@ -94,9 +94,9 @@
             return e;
         }, c.apply(null, arguments);
     }
-    function f(e, n) {
+    function d(e, n) {
         if (null == e) return {};
-        var r, t, i = p(e, n);
+        var r, t, i = f(e, n);
         if (Object.getOwnPropertySymbols) {
             var l = Object.getOwnPropertySymbols(e);
             for (t = 0; t < l.length; t++) {
@@ -105,7 +105,7 @@
         }
         return i;
     }
-    function p(e, n) {
+    function f(e, n) {
         if (null == e) return {};
         var r = {};
         for (var t in e) {
@@ -116,26 +116,28 @@
         }
         return r;
     }
-    var d = {
+    var p = {
         children: l().node,
         elementRef: l().oneOfType([ l().func, l().object ]),
-        inline: l().bool
+        inline: l().bool,
+        labelledBy: l().string
     };
     /**
  * This component is intended for use in a control group, either to display a static value or
  * between two controls.
- */    function v(e) {
-        var n = e.children, r = e.elementRef, i = e.inline, l = i === void 0 ? false : i, o = f(e, [ "children", "elementRef", "inline" ]);
+ */    function y(e) {
+        var n = e.children, r = e.elementRef, i = e.inline, l = i === void 0 ? false : i, a = e.labelledBy, o = d(e, [ "children", "elementRef", "inline", "labelledBy" ]);
         // @docs-props-type StaticContentPropsBase
                 
         return t().createElement(u, c({
+            "aria-labelledby": a,
             "data-test": "static-content",
             $inline: l,
             ref: r
         }, o),  t().createElement("span", null, n));
     }
-    v.propTypes = d;
-    /* harmony default export */    const y = v;
+    y.propTypes = p;
+    /* harmony default export */    const b = y;
     // CONCATENATED MODULE: ./src/StaticContent/index.ts
     module.exports = n;
     /******/})();

package/StepBar.js

@@ -61,8 +61,8 @@
         e.r(t);
     // EXPORTS
         e.d(t, {
-        Step: () => /* reexport */ k,
-        default: () => /* reexport */ M
+        Step: () => /* reexport */ A,
+        default: () => /* reexport */ V
     });
     // CONCATENATED MODULE: external "react"
     const r = require("react");
@@ -84,18 +84,19 @@
     // CONCATENATED MODULE: external "@splunk/themes"
     const v = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/StepBar/StepStyles.ts
-    var f = "24px";
-    var b = "10px";
- /* half of the actual rendered svg size (20px) */    var y = (0, 
-    l.css)([ "height:", ";width:", ";" ], f, f);
-    var m = c().div.withConfig({
+    var f = "2px";
+    var b = "24px";
+    var y = "10px";
+ /* half of the actual rendered svg size (20px) */    var m = (0, 
+    l.css)([ "height:", ";width:", ";" ], b, b);
+    var g = c().div.withConfig({
         displayName: "StepStyles__StyledBar",
         componentId: "sc-756fxp-0"
-    })([ "position:absolute;top:10px;height:3px;width:100%;&::before,&::after{content:'';display:block;height:3px;}" ]);
-    var g = c().li.withConfig({
+    })([ "position:absolute;top:10px;height:", ";width:100%;&::before,&::after{content:'';display:block;height:", ";}" ], f, f);
+    var h = c().li.withConfig({
         displayName: "StepStyles__Styled",
         componentId: "sc-756fxp-1"
-    })([ "display:grid;gap:", ";justify-items:center;min-width:min-content;position:relative;overflow:hidden;", ";text-align:center;color:", ";counter-increment:", ";&:not(:first-of-type){", "{&::before{box-shadow:inset 500px 0 ", ";width:calc(50% - ", ");}}}&:not(:last-of-type){", "{&::after{width:50%;position:absolute;top:0;box-shadow:inset 500px 0 ", ";left:calc(50% + ", ");}}}" ], v.variables.spacingXSmall, v.mixins.typography("body", {
+    })([ "display:grid;gap:", ";grid-template-rows:auto 1fr;justify-items:center;min-width:min-content;position:relative;overflow:hidden;", ";text-align:center;color:", ";counter-increment:", ";&:not(:first-of-type){", "{&::before{box-shadow:inset 500px 0 ", ";width:calc(50% - ", ");}}}&:not(:last-of-type){", "{&::after{width:50%;position:absolute;top:0;box-shadow:inset 500px 0 ", ";left:calc(50% + ", ");}}}" ], v.variables.spacingXSmall, v.mixins.typography("body", {
         weight: "semiBold"
     }), (0, v.pickVariant)("$status", {
         error: v.variables.contentColorActive,
@@ -105,50 +106,50 @@
     }), (function(e) {
         var t = e.$idCounter;
         return t;
-    }), /* sc-sel */ m, (0, v.pickVariant)("$status", {
+    }), /* sc-sel */ g, (0, v.pickVariant)("$status", {
         error: v.variables.contentColorAccent,
         active: v.variables.contentColorAccent,
         next: v.variables.borderColor,
         prev: v.variables.contentColorAccent
-    }), b, /* sc-sel */ m, (0, v.pickVariant)("$status", {
+    }), y, /* sc-sel */ g, (0, v.pickVariant)("$status", {
         error: v.variables.borderColor,
         active: v.variables.borderColor,
         next: v.variables.borderColor,
         prev: v.variables.contentColorAccent
-    }), b);
-    var h = "16px";
-    var C = c().span.withConfig({
+    }), y);
+    var C = "16px";
+    var S = c().span.withConfig({
         displayName: "StepStyles__StyledCircle",
         componentId: "sc-756fxp-2"
-    })([ "display:grid;height:", ";width:", ";border-radius:50%;margin:2px;", " &::before{content:counter(", ");line-height:", ";}" ], h, h, (0, 
+    })([ "display:grid;height:", ";width:", ";border-radius:50%;margin:2px;", " &::before{content:counter(", ");line-height:", ";}" ], C, C, (0, 
     v.pickVariant)("$status", {
         active: (0, l.css)([ "background-color:", ";border:2px solid ", ";color:", ";" ], v.variables.contentColorAccent, v.variables.contentColorAccent, v.variables.contentColorInverted),
         next: (0, l.css)([ "border:2px solid ", ";color:", ";" ], v.variables.contentColorDefault, v.variables.contentColorDefault)
     }), (function(e) {
         var t = e.$idCounter;
         return t;
-    }), h);
-    var S = c()(p()).withConfig({
+    }), C);
+    var x = c()(p()).withConfig({
         displayName: "StepStyles__StyledCheckCircleIcon",
         componentId: "sc-756fxp-3"
-    })([ "", ";color:", ";" ], y, v.variables.contentColorAccent);
-    var x = c()(u()).withConfig({
+    })([ "", ";color:", ";" ], m, v.variables.contentColorAccent);
+    var w = c()(u()).withConfig({
         displayName: "StepStyles__StyledExclamationCircleIcon",
         componentId: "sc-756fxp-4"
-    })([ "", ";color:", ";" ], y, v.variables.contentColorNegative);
-    var w = c().span.withConfig({
+    })([ "", ";color:", ";" ], m, v.variables.contentColorNegative);
+    var I = c().span.withConfig({
         displayName: "StepStyles__StyledStepLabel",
         componentId: "sc-756fxp-5"
     })([ "padding-inline:calc(", " / 2);" ], v.variables.spacingXXLarge);
     // CONCATENATED MODULE: ./src/StepBar/StepBarContext.tsx
-    var I =  (0, r.createContext)({
+    var O =  (0, r.createContext)({
         activeStepId: 0
     });
-    I.displayName = "StepBar";
-    /* harmony default export */    const O = I;
+    O.displayName = "StepBar";
+    /* harmony default export */    const _ = O;
     // CONCATENATED MODULE: ./src/StepBar/Step.tsx
-    function _() {
-        return _ = Object.assign ? Object.assign.bind() : function(e) {
+    function $() {
+        return $ = Object.assign ? Object.assign.bind() : function(e) {
             for (var t = 1; t < arguments.length; t++) {
                 var r = arguments[t];
                 for (var n in r) {
@@ -156,11 +157,11 @@
                 }
             }
             return e;
-        }, _.apply(null, arguments);
+        }, $.apply(null, arguments);
     }
-    function $(e, t) {
+    function E(e, t) {
         if (null == e) return {};
-        var r, n, a = E(e, t);
+        var r, n, a = j(e, t);
         if (Object.getOwnPropertySymbols) {
             var o = Object.getOwnPropertySymbols(e);
             for (n = 0; n < o.length; n++) {
@@ -169,7 +170,7 @@
         }
         return a;
     }
-    function E(e, t) {
+    function j(e, t) {
         if (null == e) return {};
         var r = {};
         for (var n in e) {
@@ -180,19 +181,19 @@
         }
         return r;
     }
-    var j = {
+    var P = {
         children: o().node,
         elementRef: o().oneOfType([ o().func, o().object ]),
         error: o().bool,
         stepId: o().any
     };
-    function P(e) {
-        var t = e.children, a = e.elementRef, o = e.error, i = o === void 0 ? false : o, l = e.stepId, c = $(e, [ "children", "elementRef", "error", "stepId" ]);
+    function k(e) {
+        var t = e.children, a = e.elementRef, o = e.error, i = o === void 0 ? false : o, l = e.stepId, c = E(e, [ "children", "elementRef", "error", "stepId" ]);
         // @docs-props-type StepPropsBase
-                var s = (0, r.useContext)(I), p = s.activeStepId, d = s.idCounter;
+                var s = (0, r.useContext)(O), p = s.activeStepId, d = s.idCounter;
         var u = "next";
         var v = p === l;
-        if (l < p) {
+        if (l != null && l < p) {
             u = "prev";
         }
         if (v && !i) {
@@ -202,19 +203,19 @@
             u = "error";
         }
         var f = {
-            error:  n().createElement(x, null),
-            prev:  n().createElement(S, null),
-            next:  n().createElement(C, {
+            error:  n().createElement(w, null),
+            prev:  n().createElement(x, null),
+            next:  n().createElement(S, {
                 $status: u,
                 $idCounter: d
             }),
-            active:  n().createElement(C, {
+            active:  n().createElement(S, {
                 $status: u,
                 $idCounter: d
             })
         };
         
-        return n().createElement(g, _({
+        return n().createElement(h, $({
             $status: u,
             "data-test-status": u,
             "data-test": "step",
@@ -222,14 +223,14 @@
             ref: a
         }, c, {
             $idCounter: d
-        }),  n().createElement(m, {
+        }),  n().createElement(g, {
             $status: u
-        }),  n().createElement("div", null, f[u]),  n().createElement(w, null, t));
+        }),  n().createElement("div", null, f[u]),  n().createElement(I, null, t));
     }
-    P.propTypes = j;
-    /* harmony default export */    const k = P;
+    k.propTypes = P;
+    /* harmony default export */    const A = k;
     // CONCATENATED MODULE: ./src/StepBar/StepBarStyles.ts
-    var A = c().ul.withConfig({
+    var N = c().ul.withConfig({
         displayName: "StepBarStyles__Styled",
         componentId: "sc-13bf2x4-0"
     })([ "", ";grid-auto-flow:column;padding:", ";counter-reset:", ";", ";" ], v.mixins.reset("grid"), v.variables.spacingXLarge, (function(e) {
@@ -240,8 +241,8 @@
         return t && (0, l.css)([ "display:inline-flex;" ]);
     }));
     // CONCATENATED MODULE: ./src/StepBar/StepBar.tsx
-    function N() {
-        return N = Object.assign ? Object.assign.bind() : function(e) {
+    function q() {
+        return q = Object.assign ? Object.assign.bind() : function(e) {
             for (var t = 1; t < arguments.length; t++) {
                 var r = arguments[t];
                 for (var n in r) {
@@ -249,11 +250,11 @@
                 }
             }
             return e;
-        }, N.apply(null, arguments);
+        }, q.apply(null, arguments);
     }
-    function q(e, t) {
+    function R(e, t) {
         if (null == e) return {};
-        var r, n, a = R(e, t);
+        var r, n, a = T(e, t);
         if (Object.getOwnPropertySymbols) {
             var o = Object.getOwnPropertySymbols(e);
             for (n = 0; n < o.length; n++) {
@@ -262,7 +263,7 @@
         }
         return a;
     }
-    function R(e, t) {
+    function T(e, t) {
         if (null == e) return {};
         var r = {};
         for (var n in e) {
@@ -273,14 +274,14 @@
         }
         return r;
     }
-    var T = {
+    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, a = e.children, o = e.elementRef, l = e.inline, c = l === void 0 ? false : l, s = q(e, [ "activeStepId", "children", "elementRef", "inline" ]);
+    function M(e) {
+        var t = e.activeStepId, a = e.children, o = e.elementRef, l = e.inline, c = l === void 0 ? false : l, s = R(e, [ "activeStepId", "children", "elementRef", "inline" ]);
         // @docs-props-type StepBarPropsBase
                 var p = (0, r.useRef)((0, i.createDOMID)("stepbar")), d = p.current;
         var u = 0;
@@ -306,7 +307,7 @@
             };
         }), [ t, d, f ]);
         
-        return n().createElement(A, N({
+        return n().createElement(N, q({
             $inline: c,
             "data-test": "step-bar",
             "data-test-active-step-id": t,
@@ -316,13 +317,13 @@
             "aria-valuenow": u + 1,
             $idCounter: d,
             ref: o
-        }, s),  n().createElement(O.Provider, {
+        }, s),  n().createElement(_.Provider, {
             value: y
         }, b));
     }
-    D.propTypes = T;
-    D.Step = k;
-    /* harmony default export */    const M = D;
+    M.propTypes = D;
+    M.Step = A;
+    /* harmony default export */    const V = M;
     // CONCATENATED MODULE: ./src/StepBar/index.ts
     module.exports = t;
     /******/})();