@splunk/react-ui 5.0.0 → 5.1.0

package/StepBar.js

@@ -72,81 +72,81 @@
     var o =  e.n(a);
     // CONCATENATED MODULE: external "@splunk/ui-utils/id"
     const i = require("@splunk/ui-utils/id");
+    // CONCATENATED MODULE: ./src/StepBar/StepBarContext.tsx
+    var l =  (0, r.createContext)({
+        activeStepId: 0
+    });
+    l.displayName = "StepBar";
+    /* harmony default export */    const c = l;
     // CONCATENATED MODULE: external "styled-components"
-    const l = require("styled-components");
-    var c =  e.n(l);
-    // CONCATENATED MODULE: external "@splunk/react-icons/CheckCircle"
-    const s = require("@splunk/react-icons/CheckCircle");
+    const s = require("styled-components");
     var p =  e.n(s);
-    // CONCATENATED MODULE: external "@splunk/react-icons/ExclamationCircle"
-    const d = require("@splunk/react-icons/ExclamationCircle");
+    // CONCATENATED MODULE: external "@splunk/react-icons/CheckCircle"
+    const d = require("@splunk/react-icons/CheckCircle");
     var u =  e.n(d);
+    // CONCATENATED MODULE: external "@splunk/react-icons/ExclamationCircle"
+    const v = require("@splunk/react-icons/ExclamationCircle");
+    var f =  e.n(v);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const v = require("@splunk/themes");
+    const b = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/StepBar/StepStyles.ts
-    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({
+    var y = "2px";
+    var m = "24px";
+    var g = "10px";
+ /* half of the actual rendered svg size (20px) */    var h = (0, 
+    s.css)([ "height:", ";width:", ";" ], m, m);
+    var C = p().div.withConfig({
         displayName: "StepStyles__StyledBar",
         componentId: "sc-756fxp-0"
-    })([ "position:absolute;top:10px;height:", ";width:100%;&::before,&::after{content:'';display:block;height:", ";}" ], f, f);
-    var h = c().li.withConfig({
+    })([ "position:absolute;top:10px;height:", ";width:100%;&::before,&::after{content:'';display:block;height:", ";}" ], y, y);
+    var S = p().li.withConfig({
         displayName: "StepStyles__Styled",
         componentId: "sc-756fxp-1"
-    })([ "", ";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.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% + ", ");}}}" ], b.mixins.typography("body", {
         weight: "semiBold"
-    }), v.variables.spacingXSmall, (0, v.pickVariant)("$status", {
-        error: v.variables.contentColorActive,
-        active: v.variables.contentColorAccent,
-        next: v.variables.contentColorDefault,
-        prev: v.variables.contentColorActive
+    }), b.variables.spacingXSmall, (0, b.pickVariant)("$status", {
+        error: b.variables.contentColorActive,
+        active: b.variables.contentColorAccent,
+        next: b.variables.contentColorDefault,
+        prev: b.variables.contentColorActive
     }), (function(e) {
         var t = e.$idCounter;
         return t;
-    }), /* sc-sel */ g, (0, v.pickVariant)("$status", {
-        error: v.variables.contentColorAccent,
-        active: v.variables.contentColorAccent,
-        next: v.variables.borderColor,
-        prev: v.variables.contentColorAccent
-    }), y, /* sc-sel */ g, (0, v.pickVariant)("$status", {
-        error: v.variables.borderColor,
-        active: v.variables.borderColor,
-        next: v.variables.borderColor,
-        prev: v.variables.contentColorAccent
-    }), y);
-    var C = "16px";
-    var S = c().span.withConfig({
+    }), /* sc-sel */ C, (0, b.pickVariant)("$status", {
+        error: b.variables.contentColorAccent,
+        active: b.variables.contentColorAccent,
+        next: b.variables.borderColor,
+        prev: b.variables.contentColorAccent
+    }), g, /* sc-sel */ C, (0, b.pickVariant)("$status", {
+        error: b.variables.borderColor,
+        active: b.variables.borderColor,
+        next: b.variables.borderColor,
+        prev: b.variables.contentColorAccent
+    }), g);
+    var x = "16px";
+    var w = p().span.withConfig({
         displayName: "StepStyles__StyledCircle",
         componentId: "sc-756fxp-2"
-    })([ "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)
+    })([ "display:grid;height:", ";width:", ";border-radius:50%;margin:2px;", " &::before{content:counter(", ");line-height:", ";}" ], x, x, (0, 
+    b.pickVariant)("$status", {
+        active: (0, s.css)([ "background-color:", ";border:2px solid ", ";color:", ";" ], b.variables.contentColorAccent, b.variables.contentColorAccent, b.variables.contentColorInverted),
+        next: (0, s.css)([ "border:2px solid ", ";color:", ";" ], b.variables.contentColorDefault, b.variables.contentColorDefault)
     }), (function(e) {
         var t = e.$idCounter;
         return t;
-    }), C);
-    var x = c()(p()).withConfig({
+    }), x);
+    var I = p()(u()).withConfig({
         displayName: "StepStyles__StyledCheckCircleIcon",
         componentId: "sc-756fxp-3"
-    })([ "", ";color:", ";" ], m, v.variables.contentColorAccent);
-    var w = c()(u()).withConfig({
+    })([ "", ";color:", ";" ], h, b.variables.contentColorAccent);
+    var O = p()(f()).withConfig({
         displayName: "StepStyles__StyledExclamationCircleIcon",
         componentId: "sc-756fxp-4"
-    })([ "", ";color:", ";" ], m, v.variables.contentColorNegative);
-    var I = c().span.withConfig({
+    })([ "", ";color:", ";" ], h, b.variables.contentColorNegative);
+    var _ = p().span.withConfig({
         displayName: "StepStyles__StyledStepLabel",
         componentId: "sc-756fxp-5"
-    })([ "padding-inline:calc(", " / 2);" ], v.variables.spacingXXLarge);
-    // CONCATENATED MODULE: ./src/StepBar/StepBarContext.tsx
-    var O =  (0, r.createContext)({
-        activeStepId: 0
-    });
-    O.displayName = "StepBar";
-    /* harmony default export */    const _ = O;
+    })([ "padding-inline:calc(", " / 2);" ], b.variables.spacingXXLarge);
     // CONCATENATED MODULE: ./src/StepBar/Step.tsx
     function $() {
         return $ = Object.assign ? Object.assign.bind() : function(e) {
@@ -188,57 +188,57 @@
         stepId: o().any
     };
     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" ]);
+        var t = e.children, a = e.elementRef, o = e.error, i = o === void 0 ? false : o, c = e.stepId, s = E(e, [ "children", "elementRef", "error", "stepId" ]);
         // @docs-props-type StepPropsBase
-                var s = (0, r.useContext)(O), p = s.activeStepId, d = s.idCounter;
-        var u = "next";
-        var v = p === l;
-        if (l != null && l < p) {
-            u = "prev";
+                var p = (0, r.useContext)(l), d = p.activeStepId, u = p.idCounter;
+        var v = "next";
+        var f = d === c;
+        if (c != null && c < d) {
+            v = "prev";
         }
-        if (v && !i) {
-            u = "active";
+        if (f && !i) {
+            v = "active";
         }
-        if (v && i) {
-            u = "error";
+        if (f && i) {
+            v = "error";
         }
-        var f = {
-            error:  n().createElement(w, null),
-            prev:  n().createElement(x, null),
-            next:  n().createElement(S, {
-                $status: u,
-                $idCounter: d
+        var b = {
+            error:  n().createElement(O, null),
+            prev:  n().createElement(I, null),
+            next:  n().createElement(w, {
+                $status: v,
+                $idCounter: u
             }),
-            active:  n().createElement(S, {
-                $status: u,
-                $idCounter: d
+            active:  n().createElement(w, {
+                $status: v,
+                $idCounter: u
             })
         };
         
-        return n().createElement(h, $({
-            $status: u,
-            "data-test-status": u,
+        return n().createElement(S, $({
+            $status: v,
+            "data-test-status": v,
             "data-test": "step",
-            "data-test-step-id": l,
+            "data-test-step-id": c,
             ref: a
-        }, c, {
-            $idCounter: d
-        }),  n().createElement(g, {
-            $status: u
-        }),  n().createElement("div", null, f[u]),  n().createElement(I, null, t));
+        }, s, {
+            $idCounter: u
+        }),  n().createElement(C, {
+            $status: v
+        }),  n().createElement("div", null, b[v]),  n().createElement(_, null, t));
     }
     k.propTypes = P;
     /* harmony default export */    const A = k;
     // CONCATENATED MODULE: ./src/StepBar/StepBarStyles.ts
-    var N = c().ul.withConfig({
+    var N = p().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) {
+    })([ "", ";grid-auto-flow:column;padding:", ";counter-reset:", ";", ";" ], b.mixins.reset("grid"), b.variables.spacingXLarge, (function(e) {
         var t = e.$idCounter;
         return t;
     }), (function(e) {
         var t = e.$inline;
-        return t && (0, l.css)([ "display:inline-flex;" ]);
+        return t && (0, s.css)([ "display:inline-flex;" ]);
     }));
     // CONCATENATED MODULE: ./src/StepBar/StepBar.tsx
     function q() {
@@ -281,17 +281,17 @@
         inline: o().bool
     };
     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" ]);
+        var t = e.activeStepId, a = e.children, o = e.elementRef, l = e.inline, s = l === void 0 ? false : l, p = 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;
-        var v = r.Children.toArray(a).filter(r.isValidElement);
-        var f = v.length - 1;
-        var b = v.map((function(e, n) {
+                var d = (0, r.useRef)((0, i.createDOMID)("stepbar")), u = d.current;
+        var v = 0;
+        var f = r.Children.toArray(a).filter(r.isValidElement);
+        var b = f.length - 1;
+        var y = f.map((function(e, n) {
             var a = e.props.stepId || n;
             var o = e.props.error;
             if (a === t) {
-                u = n;
+                v = n;
             }
             
             return (0, r.cloneElement)(e, {
@@ -299,27 +299,27 @@
                 error: o
             });
         }));
-        var y = (0, r.useMemo)((function() {
+        var m = (0, r.useMemo)((function() {
             return {
-                idCounter: d,
-                lastChildIndex: f,
+                idCounter: u,
+                lastChildIndex: b,
                 activeStepId: t
             };
-        }), [ t, d, f ]);
+        }), [ t, u, b ]);
         
         return n().createElement(N, q({
-            $inline: c,
+            $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,
-            $idCounter: d,
+            "aria-valuemax": b + 1,
+            "aria-valuenow": v + 1,
+            $idCounter: u,
             ref: o
-        }, s),  n().createElement(_.Provider, {
-            value: y
-        }, b));
+        }, p),  n().createElement(c.Provider, {
+            value: m
+        }, y));
     }
     M.propTypes = D;
     M.Step = A;

package/Switch.js

@@ -79,108 +79,108 @@
     // CONCATENATED MODULE: external "styled-components"
     const d = require("styled-components");
     var u =  e.n(d);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Box"
-    const b = require("@splunk/react-ui/Box");
+    // CONCATENATED MODULE: external "@splunk/react-icons/CheckBoxCompleted"
+    const b = require("@splunk/react-icons/CheckBoxCompleted");
     var v =  e.n(b);
-    // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
-    const f = require("@splunk/react-ui/Clickable");
+    // CONCATENATED MODULE: external "@splunk/react-icons/CheckBoxIndeterminate"
+    const f = require("@splunk/react-icons/CheckBoxIndeterminate");
     var p =  e.n(f);
+    // CONCATENATED MODULE: external "@splunk/react-ui/Box"
+    const g = require("@splunk/react-ui/Box");
+    var y =  e.n(g);
+    // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
+    const m = require("@splunk/react-ui/Clickable");
+    var h =  e.n(m);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const g = require("@splunk/themes");
-    // CONCATENATED MODULE: external "@splunk/react-icons/CheckBoxCompleted"
-    const y = require("@splunk/react-icons/CheckBoxCompleted");
-    var m =  e.n(y);
-    // CONCATENATED MODULE: external "@splunk/react-icons/CheckBoxIndeterminate"
-    const h = require("@splunk/react-icons/CheckBoxIndeterminate");
-    var k =  e.n(h);
+    const k = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Switch/SwitchStyles.ts
     var C = "20px";
     var S = "12px";
     var w = "4px";
  // diameter - toggleIndicatorDiameter / 2
-        var O = u()(v()).withConfig({
+        var O = u()(y()).withConfig({
         displayName: "SwitchStyles__StyledBox",
         componentId: "sc-844ieu-0"
-    })([ "display:inline;position:relative;flex-shrink:0;gap:", ";min-height:", ";align-items:center;color:", ";", "" ], g.variables.spacingSmall, g.variables.inputHeight, g.variables.contentColorActive, (function(e) {
+    })([ "display:inline;position:relative;flex-shrink:0;gap:", ";min-height:", ";align-items:center;color:", ";", "" ], k.variables.spacingSmall, k.variables.inputHeight, k.variables.contentColorActive, (function(e) {
         var r = e.$disabled;
-        return r && (0, d.css)([ "color:", ";" ], g.variables.contentColorDisabled);
+        return r && (0, d.css)([ "color:", ";" ], k.variables.contentColorDisabled);
     }));
-    var x = (0, d.css)([ "", " position:relative;width:", ";height:", ";line-height:", ";border-radius:", ";border:", " solid ", ";background-color:", ";cursor:pointer;flex:0 0 auto;&:not([disabled]){&:focus{box-shadow:", ";}color:", ";", "}&[disabled]{border-color:", ";background-color:", ";color:", ";cursor:not-allowed;", ";}" ], g.mixins.reset("inline"), C, C, C, g.variables.borderRadius, g.variables.inputBorderWidth, g.variables.interactiveColorBorder, g.variables.interactiveColorBackground, g.variables.focusShadow, (0, 
-    g.pick)({
-        light: g.variables.white,
-        dark: g.variables.black
+    var x = (0, d.css)([ "", " position:relative;width:", ";height:", ";line-height:", ";border-radius:", ";border:", " solid ", ";background-color:", ";cursor:pointer;flex:0 0 auto;&:not([disabled]){&:focus{box-shadow:", ";}color:", ";", "}&[disabled]{border-color:", ";background-color:", ";color:", ";cursor:not-allowed;", ";}" ], k.mixins.reset("inline"), C, C, C, k.variables.borderRadius, k.variables.inputBorderWidth, k.variables.interactiveColorBorder, k.variables.interactiveColorBackground, k.variables.focusShadow, (0, 
+    k.pick)({
+        light: k.variables.white,
+        dark: k.variables.black
     }), (function(e) {
         var r = e.$error, a = e.$selected;
         if (a && !r) {
-            return (0, d.css)([ "background-color:", ";border:none;" ], g.variables.interactiveColorAccent);
+            return (0, d.css)([ "background-color:", ";border:none;" ], k.variables.interactiveColorAccent);
         }
         if (!a && r) {
-            return (0, d.css)([ "border-color:", ";&:hover{border-color:", ";background-color:", ";}" ], g.variables.interactiveColorAccentError, g.mixins.overlayColors(g.variables.interactiveColorAccentError, g.variables.interactiveColorBorderHover), g.mixins.overlayColors(g.variables.interactiveColorBackground, g.variables.interactiveColorOverlayHover));
+            return (0, d.css)([ "border-color:", ";&:hover{border-color:", ";background-color:", ";}" ], k.variables.interactiveColorAccentError, k.mixins.overlayColors(k.variables.interactiveColorAccentError, k.variables.interactiveColorBorderHover), k.mixins.overlayColors(k.variables.interactiveColorBackground, k.variables.interactiveColorOverlayHover));
         }
         if (a && r) {
-            return (0, d.css)([ "background-color:", ";border:none;" ], g.variables.interactiveColorAccentError);
+            return (0, d.css)([ "background-color:", ";border:none;" ], k.variables.interactiveColorAccentError);
         }
-        return (0, d.css)([ "&:hover{border-color:", ";background-color:", ";}" ], g.variables.interactiveColorBorderHover, g.mixins.overlayColors(g.variables.interactiveColorBackground, g.variables.interactiveColorOverlayHover));
-    }), g.variables.interactiveColorBorderDisabled, g.variables.interactiveColorBackgroundDisabled, g.variables.contentColorDisabled, (function(e) {
+        return (0, d.css)([ "&:hover{border-color:", ";background-color:", ";}" ], k.variables.interactiveColorBorderHover, k.mixins.overlayColors(k.variables.interactiveColorBackground, k.variables.interactiveColorOverlayHover));
+    }), k.variables.interactiveColorBorderDisabled, k.variables.interactiveColorBackgroundDisabled, k.variables.contentColorDisabled, (function(e) {
         var r = e.$selected;
-        return r && (0, d.css)([ "border:none;background-color:", ";" ], g.variables.neutral100);
+        return r && (0, d.css)([ "border:none;background-color:", ";" ], k.variables.neutral100);
     }));
-    var B = u()(p()).withConfig({
+    var B = u()(h()).withConfig({
         displayName: "SwitchStyles__StyledCheckboxClickable",
         componentId: "sc-844ieu-1"
     })([ "", "" ], x);
     var j = (0, d.css)([ "display:block;height:", ";width:", ";" ], C, C);
-    var $ = u()(m()).withConfig({
+    var $ = u()(v()).withConfig({
         displayName: "SwitchStyles__StyledCheck",
         componentId: "sc-844ieu-2"
     })([ "", "" ], j);
-    var I = u()(k()).withConfig({
+    var I = u()(p()).withConfig({
         displayName: "SwitchStyles__StyledSome",
         componentId: "sc-844ieu-3"
     })([ "", "" ], j);
     var q = u().div.withConfig({
         displayName: "SwitchStyles__StyledToggleIndicator",
         componentId: "sc-844ieu-4"
-    })([ "--toggle-indicator-margin:calc(", " - ", ");background-color:", ";border-radius:50%;box-sizing:border-box;width:", ";height:", ";position:absolute;left:var(--toggle-indicator-margin);top:var(--toggle-indicator-margin);", ";", " ", " ", ";" ], w, g.variables.inputBorderWidth, (0, 
-    g.pick)({
-        light: g.variables.black,
-        dark: g.variables.white
+    })([ "--toggle-indicator-margin:calc(", " - ", ");background-color:", ";border-radius:50%;box-sizing:border-box;width:", ";height:", ";position:absolute;left:var(--toggle-indicator-margin);top:var(--toggle-indicator-margin);", ";", " ", " ", ";" ], w, k.variables.inputBorderWidth, (0, 
+    k.pick)({
+        light: k.variables.black,
+        dark: k.variables.white
     }), S, S, (function(e) {
         var r = e.$delay;
         return r && (0, d.css)([ "transition:left ", ";" ], r);
-    }), (0, g.pick)({
-        prisma: (0, d.css)([ "box-shadow:", ";" ], g.variables.embossShadow)
+    }), (0, k.pick)({
+        prisma: (0, d.css)([ "box-shadow:", ";" ], k.variables.embossShadow)
     }), (function(e) {
         var r = e.$selected, a = e.$disabled;
         return (0, d.css)([ "", " ", "" ], r && (0, d.css)([ "left:calc(100% - (", " + var(--toggle-indicator-margin)));" ], S), !a && r && (0, 
-        d.css)([ "background-color:", ";" ], (0, g.pick)({
-            light: g.variables.white,
-            dark: g.variables.black
+        d.css)([ "background-color:", ";" ], (0, k.pick)({
+            light: k.variables.white,
+            dark: k.variables.black
         })));
     }), (function(e) {
         var r = e.$disabled;
-        return r && (0, d.css)([ "background-color:", ";" ], g.variables.neutral400);
+        return r && (0, d.css)([ "background-color:", ";" ], k.variables.neutral400);
     }));
-    var E = (0, d.css)([ "position:relative;width:calc(", " * 2);height:", ";background-color:", ";transition:background-color ", ";flex:0 0 auto;border-radius:calc(", " / 2);border:", " solid ", ";&:not([disabled]){&:focus{box-shadow:", ";}", "}&[disabled]{border:", " solid ", ";background-color:", ";", "}" ], C, C, g.variables.interactiveColorBackground, (function(e) {
+    var E = (0, d.css)([ "position:relative;width:calc(", " * 2);height:", ";background-color:", ";transition:background-color ", ";flex:0 0 auto;border-radius:calc(", " / 2);border:", " solid ", ";&:not([disabled]){&:focus{box-shadow:", ";}", "}&[disabled]{border:", " solid ", ";background-color:", ";", "}" ], C, C, k.variables.interactiveColorBackground, (function(e) {
         return e.$delay;
-    }), C, g.variables.inputBorderWidth, g.variables.interactiveColorBorder, g.variables.focusShadow, (function(e) {
+    }), C, k.variables.inputBorderWidth, k.variables.interactiveColorBorder, k.variables.focusShadow, (function(e) {
         var r = e.$selected;
         if (!r) {
-            return (0, d.css)([ "&:hover{border-color:", ";background-color:", ";}" ], g.variables.interactiveColorBorderHover, g.mixins.overlayColors(g.variables.interactiveColorBackground, g.variables.interactiveColorOverlayHover));
+            return (0, d.css)([ "&:hover{border-color:", ";background-color:", ";}" ], k.variables.interactiveColorBorderHover, k.mixins.overlayColors(k.variables.interactiveColorBackground, k.variables.interactiveColorOverlayHover));
         }
-        return (0, d.css)([ "border-color:transparent;background-color:", ";" ], g.variables.interactiveColorAccent);
-    }), g.variables.inputBorderWidth, g.variables.interactiveColorBorderDisabled, g.variables.interactiveColorBackgroundDisabled, (function(e) {
+        return (0, d.css)([ "border-color:transparent;background-color:", ";" ], k.variables.interactiveColorAccent);
+    }), k.variables.inputBorderWidth, k.variables.interactiveColorBorderDisabled, k.variables.interactiveColorBackgroundDisabled, (function(e) {
         var r = e.$selected;
-        return r && (0, d.css)([ "background-color:", ";" ], g.variables.neutral100);
+        return r && (0, d.css)([ "background-color:", ";" ], k.variables.neutral100);
     }));
-    var P = u()(p()).withConfig({
+    var P = u()(h()).withConfig({
         displayName: "SwitchStyles__StyledToggleClickable",
         componentId: "sc-844ieu-5"
     })([ "", "" ], E);
     var _ = u().label.withConfig({
         displayName: "SwitchStyles__StyledLabel",
         componentId: "sc-844ieu-6"
-    })([ "", " flex:1 1 auto;color:inherit;line-height:", ";", ";" ], g.mixins.reset("inline-block"), g.variables.lineHeight, (function(e) {
+    })([ "", " flex:1 1 auto;color:inherit;line-height:", ";", ";" ], k.mixins.reset("inline-block"), k.variables.lineHeight, (function(e) {
         var r = e.$disabled;
         return !r && (0, d.css)([ "cursor:pointer;" ]);
     }));