@splunk/react-ui 5.2.0 → 5.3.0

package/Switch.js

@@ -24,11 +24,11 @@
     /******/    (() => {
         /******/ // define getter functions for harmony exports
         /******/ e.d = (r, a) => {
-            /******/ for (var t in a) {
-                /******/ if (e.o(a, t) && !e.o(r, t)) {
-                    /******/ Object.defineProperty(r, t, {
+            /******/ for (var i in a) {
+                /******/ if (e.o(a, i) && !e.o(r, i)) {
+                    /******/ Object.defineProperty(r, i, {
                         enumerable: true,
-                        get: a[t]
+                        get: a[i]
                     });
                     /******/                }
                 /******/            }
@@ -61,24 +61,24 @@
         e.r(r);
     // EXPORTS
         e.d(r, {
-        default: () => /* reexport */ Q
+        default: () => /* reexport */ G
     });
     // CONCATENATED MODULE: external "react"
     const a = require("react");
-    var t =  e.n(a);
+    var i =  e.n(a);
     // CONCATENATED MODULE: external "prop-types"
-    const i = require("prop-types");
-    var o =  e.n(i);
+    const o = require("prop-types");
+    var t =  e.n(o);
     // CONCATENATED MODULE: external "@splunk/react-ui/AnimationToggle"
     const l = require("@splunk/react-ui/AnimationToggle");
     // CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
     const n = require("@splunk/react-ui/ScreenReaderContent");
     var c =  e.n(n);
     // CONCATENATED MODULE: external "@splunk/ui-utils/id"
-    const s = require("@splunk/ui-utils/id");
+    const d = require("@splunk/ui-utils/id");
     // CONCATENATED MODULE: external "styled-components"
-    const d = require("styled-components");
-    var u =  e.n(d);
+    const s = require("styled-components");
+    var u =  e.n(s);
     // CONCATENATED MODULE: external "@splunk/react-icons/CheckBoxCompleted"
     const b = require("@splunk/react-icons/CheckBoxCompleted");
     var v =  e.n(b);
@@ -87,102 +87,102 @@
     var p =  e.n(f);
     // CONCATENATED MODULE: external "@splunk/react-ui/Box"
     const g = require("@splunk/react-ui/Box");
-    var y =  e.n(g);
+    var m =  e.n(g);
     // CONCATENATED MODULE: external "@splunk/react-ui/Clickable"
-    const m = require("@splunk/react-ui/Clickable");
-    var h =  e.n(m);
+    const h = require("@splunk/react-ui/Clickable");
+    var k =  e.n(h);
     // CONCATENATED MODULE: external "@splunk/themes"
-    const k = require("@splunk/themes");
+    const y = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Switch/SwitchStyles.ts
     var C = "20px";
     var S = "12px";
-    var w = "4px";
+    var x = "4px";
  // diameter - toggleIndicatorDiameter / 2
-        var O = u()(y()).withConfig({
+        var w = u()(m()).withConfig({
         displayName: "SwitchStyles__StyledBox",
         componentId: "sc-844ieu-0"
-    })([ "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) {
+    })([ "display:inline;position:relative;flex-shrink:0;gap:", ";min-height:", ";align-items:center;color:", ";", "" ], y.variables.spacingSmall, y.variables.inputHeight, y.variables.contentColorActive, (function(e) {
         var r = e.$disabled;
-        return r && (0, d.css)([ "color:", ";" ], k.variables.contentColorDisabled);
+        return r && (0, s.css)([ "color:", ";" ], y.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;", ";}" ], 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
+    var B = (0, s.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:", ";", ";}" ], y.mixins.reset("inline"), C, C, C, y.variables.borderRadius, y.variables.inputBorderWidth, y.variables.interactiveColorBorder, y.variables.interactiveColorBackground, y.variables.focusShadow, (0, 
+    y.pick)({
+        light: y.variables.white,
+        dark: y.variables.black
     }), (function(e) {
         var r = e.$error, a = e.$selected;
         if (a && !r) {
-            return (0, d.css)([ "background-color:", ";border:none;" ], k.variables.interactiveColorAccent);
+            return (0, s.css)([ "background-color:", ";border:none;" ], y.variables.interactiveColorAccent);
         }
         if (!a && r) {
-            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));
+            return (0, s.css)([ "border-color:", ";&:hover{border-color:", ";background-color:", ";}" ], y.variables.interactiveColorAccentError, y.mixins.overlayColors(y.variables.interactiveColorAccentError, y.variables.interactiveColorBorderHover), y.mixins.overlayColors(y.variables.interactiveColorBackground, y.variables.interactiveColorOverlayHover));
         }
         if (a && r) {
-            return (0, d.css)([ "background-color:", ";border:none;" ], k.variables.interactiveColorAccentError);
+            return (0, s.css)([ "background-color:", ";border:none;" ], y.variables.interactiveColorAccentError);
         }
-        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) {
+        return (0, s.css)([ "&:hover{border-color:", ";background-color:", ";}" ], y.variables.interactiveColorBorderHover, y.mixins.overlayColors(y.variables.interactiveColorBackground, y.variables.interactiveColorOverlayHover));
+    }), y.variables.interactiveColorBorderDisabled, y.variables.interactiveColorBackgroundDisabled, (function(e) {
         var r = e.$selected;
-        return r && (0, d.css)([ "border:none;background-color:", ";" ], k.variables.neutral100);
+        return r && (0, s.css)([ "border:none;background-color:", ";" ], y.variables.neutral100);
     }));
-    var B = u()(h()).withConfig({
+    var O = u()(k()).withConfig({
         displayName: "SwitchStyles__StyledCheckboxClickable",
         componentId: "sc-844ieu-1"
-    })([ "", "" ], x);
-    var j = (0, d.css)([ "display:block;height:", ";width:", ";" ], C, C);
-    var $ = u()(v()).withConfig({
+    })([ "", "" ], B);
+    var $ = (0, s.css)([ "display:block;height:", ";width:", ";" ], C, C);
+    var I = u()(v()).withConfig({
         displayName: "SwitchStyles__StyledCheck",
         componentId: "sc-844ieu-2"
-    })([ "", "" ], j);
-    var I = u()(p()).withConfig({
+    })([ "", "" ], $);
+    var q = u()(p()).withConfig({
         displayName: "SwitchStyles__StyledSome",
         componentId: "sc-844ieu-3"
-    })([ "", "" ], j);
-    var q = u().div.withConfig({
+    })([ "", "" ], $);
+    var E = 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, k.variables.inputBorderWidth, (0, 
-    k.pick)({
-        light: k.variables.black,
-        dark: k.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);", ";", " ", " ", ";" ], x, y.variables.inputBorderWidth, (0, 
+    y.pick)({
+        light: y.variables.black,
+        dark: y.variables.white
     }), S, S, (function(e) {
         var r = e.$delay;
-        return r && (0, d.css)([ "transition:left ", ";" ], r);
-    }), (0, k.pick)({
-        prisma: (0, d.css)([ "box-shadow:", ";" ], k.variables.embossShadow)
+        return r && (0, s.css)([ "transition:left ", ";" ], r);
+    }), (0, y.pick)({
+        prisma: (0, s.css)([ "box-shadow:", ";" ], y.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, k.pick)({
-            light: k.variables.white,
-            dark: k.variables.black
+        return (0, s.css)([ "", " ", "" ], r && (0, s.css)([ "left:calc(100% - (", " + var(--toggle-indicator-margin)));" ], S), !a && r && (0, 
+        s.css)([ "background-color:", ";" ], (0, y.pick)({
+            light: y.variables.white,
+            dark: y.variables.black
         })));
     }), (function(e) {
         var r = e.$disabled;
-        return r && (0, d.css)([ "background-color:", ";" ], k.variables.neutral400);
+        return r && (0, s.css)([ "background-color:", ";" ], y.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, k.variables.interactiveColorBackground, (function(e) {
+    var _ = (0, s.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, y.variables.interactiveColorBackground, (function(e) {
         return e.$delay;
-    }), C, k.variables.inputBorderWidth, k.variables.interactiveColorBorder, k.variables.focusShadow, (function(e) {
+    }), C, y.variables.inputBorderWidth, y.variables.interactiveColorBorder, y.variables.focusShadow, (function(e) {
         var r = e.$selected;
         if (!r) {
-            return (0, d.css)([ "&:hover{border-color:", ";background-color:", ";}" ], k.variables.interactiveColorBorderHover, k.mixins.overlayColors(k.variables.interactiveColorBackground, k.variables.interactiveColorOverlayHover));
+            return (0, s.css)([ "&:hover{border-color:", ";background-color:", ";}" ], y.variables.interactiveColorBorderHover, y.mixins.overlayColors(y.variables.interactiveColorBackground, y.variables.interactiveColorOverlayHover));
         }
-        return (0, d.css)([ "border-color:transparent;background-color:", ";" ], k.variables.interactiveColorAccent);
-    }), k.variables.inputBorderWidth, k.variables.interactiveColorBorderDisabled, k.variables.interactiveColorBackgroundDisabled, (function(e) {
+        return (0, s.css)([ "border-color:transparent;background-color:", ";" ], y.variables.interactiveColorAccent);
+    }), y.variables.inputBorderWidth, y.variables.interactiveColorBorderDisabled, y.variables.interactiveColorBackgroundDisabled, (function(e) {
         var r = e.$selected;
-        return r && (0, d.css)([ "background-color:", ";" ], k.variables.neutral100);
+        return r && (0, s.css)([ "background-color:", ";" ], y.variables.neutral100);
     }));
-    var P = u()(h()).withConfig({
+    var R = u()(k()).withConfig({
         displayName: "SwitchStyles__StyledToggleClickable",
         componentId: "sc-844ieu-5"
-    })([ "", "" ], E);
-    var _ = u().label.withConfig({
+    })([ "", "" ], _);
+    var N = u().label.withConfig({
         displayName: "SwitchStyles__StyledLabel",
         componentId: "sc-844ieu-6"
-    })([ "", " flex:1 1 auto;color:inherit;line-height:", ";", ";" ], k.mixins.reset("inline-block"), k.variables.lineHeight, (function(e) {
+    })([ "", " flex:1 1 auto;color:inherit;line-height:", ";", ";" ], y.mixins.reset("inline-block"), y.variables.lineHeight, (function(e) {
         var r = e.$disabled;
-        return !r && (0, d.css)([ "cursor:pointer;" ]);
+        return !r && (0, s.css)([ "cursor:pointer;" ]);
     }));
     // CONCATENATED MODULE: ./src/utils/updateReactRef.ts
     /**
@@ -191,7 +191,7 @@
  * @param ref - The React callback or object ref. Can be `null` or `undefined`.
  * @param current - The new value of the ref.
  */
-    function R(e, r) {
+    function L(e, r) {
         if (e) {
             if (typeof e === "function") {
                 e(r);
@@ -203,248 +203,216 @@
                         }
         }
     }
+    // CONCATENATED MODULE: ./src/utils/useDeprecate.tsx
+    var T = "is deprecated and will be removed in the next major version.";
+    var j = function e(r) {
+        var a = r.additionalMessage, i = a === void 0 ? "" : a, o = r.componentName;
+        useEffect((function() {
+            if (false) {}
+        }), [ i, o ]);
+    };
+    var P = function e(r) {
+        var a = r.additionalMessage, i = a === void 0 ? "" : a, o = r.componentName, t = r.propName, l = r.propValue;
+        useEffect((function() {
+            if (false) {}
+        }), [ i, o, t, l ]);
+    };
+    var D = function e(r) {
+        var i = r.additionalMessage, o = i === void 0 ? "" : i, t = r.componentName, l = r.deprecatedPropValue, n = r.propName, c = r.propValue;
+        (0, a.useEffect)((function() {
+            if (false) {}
+        }), [ o, t, n, c, l ]);
+    };
     // CONCATENATED MODULE: ./src/Switch/Switch.tsx
-    function D(e) {
-        "@babel/helpers - typeof";
-        return D = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
-            return typeof e;
-        } : function(e) {
-            return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-        }, D(e);
-    }
-    function L(e, r) {
-        var a = Object.keys(e);
-        if (Object.getOwnPropertySymbols) {
-            var t = Object.getOwnPropertySymbols(e);
-            r && (t = t.filter((function(r) {
-                return Object.getOwnPropertyDescriptor(e, r).enumerable;
-            }))), a.push.apply(a, t);
-        }
-        return a;
-    }
-    function T(e) {
-        for (var r = 1; r < arguments.length; r++) {
-            var a = null != arguments[r] ? arguments[r] : {};
-            r % 2 ? L(Object(a), !0).forEach((function(r) {
-                A(e, r, a[r]);
-            })) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(a)) : L(Object(a)).forEach((function(r) {
-                Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(a, r));
-            }));
-        }
-        return e;
-    }
-    function A(e, r, a) {
-        return (r = H(r)) in e ? Object.defineProperty(e, r, {
-            value: a,
-            enumerable: !0,
-            configurable: !0,
-            writable: !0
-        }) : e[r] = a, e;
-    }
-    function H(e) {
-        var r = N(e, "string");
-        return "symbol" == D(r) ? r : r + "";
-    }
-    function N(e, r) {
-        if ("object" != D(e) || !e) return e;
-        var a = e[Symbol.toPrimitive];
-        if (void 0 !== a) {
-            var t = a.call(e, r || "default");
-            if ("object" != D(t)) return t;
-            throw new TypeError("@@toPrimitive must return a primitive value.");
-        }
-        return ("string" === r ? String : Number)(e);
+    function A() {
+        return A = Object.assign ? Object.assign.bind() : function(e) {
+            for (var r = 1; r < arguments.length; r++) {
+                var a = arguments[r];
+                for (var i in a) {
+                    ({}).hasOwnProperty.call(a, i) && (e[i] = a[i]);
+                }
+            }
+            return e;
+        }, A.apply(null, arguments);
     }
-    function M(e, r) {
+    function H(e, r) {
         if (null == e) return {};
-        var a, t, i = W(e, r);
+        var a, i, o = M(e, r);
         if (Object.getOwnPropertySymbols) {
-            var o = Object.getOwnPropertySymbols(e);
-            for (t = 0; t < o.length; t++) {
-                a = o[t], -1 === r.indexOf(a) && {}.propertyIsEnumerable.call(e, a) && (i[a] = e[a]);
+            var t = Object.getOwnPropertySymbols(e);
+            for (i = 0; i < t.length; i++) {
+                a = t[i], -1 === r.indexOf(a) && {}.propertyIsEnumerable.call(e, a) && (o[a] = e[a]);
             }
         }
-        return i;
+        return o;
     }
-    function W(e, r) {
+    function M(e, r) {
         if (null == e) return {};
         var a = {};
-        for (var t in e) {
-            if ({}.hasOwnProperty.call(e, t)) {
-                if (-1 !== r.indexOf(t)) continue;
-                a[t] = e[t];
+        for (var i in e) {
+            if ({}.hasOwnProperty.call(e, i)) {
+                if (-1 !== r.indexOf(i)) continue;
+                a[i] = e[i];
             }
         }
         return a;
     }
-    function F() {
-        return F = Object.assign ? Object.assign.bind() : function(e) {
-            for (var r = 1; r < arguments.length; r++) {
-                var a = arguments[r];
-                for (var t in a) {
-                    ({}).hasOwnProperty.call(a, t) && (e[t] = a[t]);
-                }
-            }
-            return e;
-        }, F.apply(null, arguments)
-        /** @public */
-        /** @public */;
-    }
-    var z = {
-        appearance: o().oneOf([ "checkbox", "toggle" ]),
-        children: o().node,
-        disabled: o().bool,
-        elementRef: o().oneOfType([ o().func, o().object ]),
-        error: o().bool,
-        id: o().string,
-        inline: o().bool,
-        labelledBy: o().string,
-        onClick: o().func,
+    /** @public */
+    /** @public */    var V = {
+        appearance: t().oneOf([ "checkbox", "toggle" ]),
+        children: t().node,
+        disabled: t().bool,
+        elementRef: t().oneOfType([ t().func, t().object ]),
+        error: t().bool,
+        id: t().string,
+        inline: t().bool,
+        labelledBy: t().string,
+        onClick: t().func,
         /** @private. */
-        required: o().bool,
-        selected: o().oneOf([ true, false, "some" ]),
-        selectedLabel: o().string,
-        toggleRef: o().oneOfType([ o().func, o().object ]),
-        someSelectedLabel: o().string,
-        unselectedLabel: o().string,
-        value: o().any
+        required: t().bool,
+        selected: t().oneOf([ true, false, "some" ]),
+        selectedLabel: t().string,
+        toggleRef: t().oneOfType([ t().func, t().object ]),
+        someSelectedLabel: t().string,
+        unselectedLabel: t().string,
+        value: t().any
     };
-    var G = function e(r) {
-        var a = r.ariaChecked, i = r.ariaInvalid, o = r.ariaLabelledBy, n = r.ariaRequired, c = r.dataTest, s = r.dataSelected, d = r.disabled, u = r.elementRef, b = r.id, v = r.onClick, f = r.selected;
-        var p = d === true ? "disabled" : undefined;
+    // eslint-disable-next-line docs-props-type-match
+    // eslint-disable-next-line docs-props-type-match
+        var W = function e(r) {
+        var a = r.ariaChecked, o = r.ariaInvalid, t = r.ariaLabelledBy, n = r.ariaRequired, c = r.dataTest, d = r.dataSelected, s = r.disabled, u = r.elementRef, b = r.id, v = r.onClick, f = r.selected;
+        var p = s === true ? "disabled" : undefined;
         var g = (0, l.useAnimationToggle)();
-        var y = g === "on" ? "200ms" : undefined;
-        var m =  t().createElement(q, {
-            $delay: y,
+        var m = g === "on" ? "200ms" : undefined;
+        var h =  i().createElement(E, {
+            $delay: m,
             $disabled: !!p,
             $selected: f
         });
         
-        return t().createElement(P, {
+        return i().createElement(R, {
             role: "switch",
             "aria-checked": a,
-            "aria-invalid": i,
-            "aria-labelledby": o,
+            "aria-invalid": o,
+            "aria-labelledby": t,
             "aria-required": n,
-            "data-selected": s,
+            "data-selected": d,
             "data-test": c,
             disabled: p,
             elementRef: u,
             id: b,
             onClick: v,
-            $delay: y,
+            $delay: m,
             $selected: f || false
-        }, m);
+        }, h);
     };
-    var J = function e(r) {
-        var a = r.ariaChecked, i = r.ariaInvalid, o = r.ariaLabelledBy, l = r.ariaRequired, n = r.dataTest, c = r.dataSelected, s = r.disabled, d = r.error, u = r.id, b = r.elementRef, v = r.onClick, f = r.role, p = r.selected, g = r.tabIndex;
+    var F = function e(r) {
+        var a = r.ariaChecked, o = r.ariaInvalid, t = r.ariaLabelledBy, l = r.ariaRequired, n = r.dataTest, c = r.dataSelected, d = r.disabled, s = r.error, u = r.id, b = r.elementRef, v = r.onClick, f = r.role, p = r.selected, g = r.tabIndex;
         /* Setting viewbox to rescale the icons to appear larger. Cannot directly adjust svg
    * width and height without the svg being larger than the checkbox and box-model.
-   */        var y = "4 4 16 16";
-        var m =  t().createElement(t().Fragment, null, p === true &&  t().createElement($, {
-            viewBox: y
-        }), p === "some" &&  t().createElement(I, {
-            viewBox: y
+   */        var m = "4 4 16 16";
+        var h =  i().createElement(i().Fragment, null, p === true &&  i().createElement(I, {
+            viewBox: m
+        }), p === "some" &&  i().createElement(q, {
+            viewBox: m
         }));
-        var h = s === true ? "disabled" : undefined;
+        var k = d === true ? "disabled" : undefined;
         
-        return t().createElement(B, F({
-            as: f === "presentation" ? "div" : undefined,
+        return i().createElement(O, {
             "aria-checked": a,
-            "aria-invalid": i,
-            "aria-labelledby": o,
+            "aria-invalid": o,
+            "aria-labelledby": t,
             "aria-required": l,
             "data-selected": c,
             "data-test": n,
-            disabled: h
-        }, {
-            elementRef: f === "presentation" ? undefined : b
-        }, {
+            disabled: k,
+            elementRef: b,
             id: u,
             onClick: v,
             role: f || "checkbox",
             tabIndex: g,
-            $error: d || false,
+            $error: s || false,
             $selected: p === "some" || p || false
-        }, {
-            inert: f === "presentation" ? "true" : undefined
-        }), m);
+        }, h);
     };
     /**
  * `Switch` is a basic form control with an on/off state.
- */    function K(e) {
-        var r = e.appearance, i = r === void 0 ? "checkbox" : r, o = e.children, l = e.disabled, n = e.elementRef, d = e.error, u = e.id, b = e.inline, v = e.labelledBy, f = e.onClick, p = e.required, g = e.selected, y = e.selectedLabel, m = e.someSelectedLabel, h = e.toggleRef, k = e.unselectedLabel, C = e.value, S = M(e, [ "appearance", "children", "disabled", "elementRef", "error", "id", "inline", "labelledBy", "onClick", "required", "selected", "selectedLabel", "someSelectedLabel", "toggleRef", "unselectedLabel", "value" ]);
+ */    function z(e) {
+        var r = e.appearance, o = r === void 0 ? "checkbox" : r, t = e.children, l = e.disabled, n = e.elementRef, s = e.error, u = e.id, b = e.inline, v = e.labelledBy, f = e.onClick, p = e.required, g = e.selected, m = e.selectedLabel, h = e.someSelectedLabel, k = e.role, y = e.tabIndex, C = e.toggleRef, S = e.unselectedLabel, x = e.value, B = H(e, [ "appearance", "children", "disabled", "elementRef", "error", "id", "inline", "labelledBy", "onClick", "required", "selected", "selectedLabel", "someSelectedLabel", "role", "tabIndex", "toggleRef", "unselectedLabel", "value" ]);
         // @docs-props-type SwitchPropsBase
+                D({
+            componentName: "Switch",
+            deprecatedPropValue: "checkbox",
+            propName: "appearance",
+            propValue: o
+        });
         /* If has internal label defined with children, must have an id and must use generated labelId.
    * Otherwise, use customer defined id and external label.
-   */        var w = o && u == null ? (0, s.createDOMID)("clickable") : u;
-        var x = o ? (0, s.createDOMID)("label") : v;
+   */        var O = t && u == null ? (0, d.createDOMID)("clickable") : u;
+        var $ = t ? (0, d.createDOMID)("label") : v;
         (0, a.useEffect)((function() {
             if (false) {}
             if (false) {}
-        }), [ g, i, d ]);
-        var B = (0, a.useCallback)((function(e) {
+        }), [ g, o, s ]);
+        var I = (0, a.useCallback)((function(e) {
             f === null || f === void 0 ? void 0 : f(e, {
-                value: C,
+                value: x,
                 // @ts-expect-error - safe due to individual prop interfaces
                 selected: g
             });
-        }), [ f, C, g ]);
-        var j = (0, a.useCallback)((function(e) {
-            R(h, e);
-        }), [ h ]);
-        var $ = g === "some" ? "mixed" : g;
-        var I = {
-            true: y,
-            false: k,
-            some: m
+        }), [ f, x, g ]);
+        var q = (0, a.useCallback)((function(e) {
+            L(C, e);
+        }), [ C ]);
+        var E = g === "some" ? "mixed" : g;
+        var _ = {
+            true: m,
+            false: S,
+            some: h
         };
-        var q = T(T({
-            id: w,
-            onClick: l ? undefined : B,
-            elementRef: j,
-            ariaLabelledBy: x,
-            ariaChecked: $,
-            ariaInvalid: d ? true : undefined,
+        var R = {
+            id: O,
+            onClick: l ? undefined : I,
+            elementRef: q,
+            ariaLabelledBy: $,
+            ariaChecked: E,
+            ariaInvalid: s ? true : undefined,
             ariaRequired: p,
-            // TODO(SUI-7658): Hopefully handled cleaner when Checkbox is removed out of Switch and NonInteractiveCheckbox uptakes that. For now intentionally not spread like others and access directly from otherProps to stress not specific to Switch but base HTML element props.
-            dataTest: S.role === "presentation" ? "presentation-toggle" : "toggle",
-            dataSelected: g
-        }, S.role != null && {
-            role: S.role
-        }), S.tabIndex != null && {
-            tabIndex: S.tabIndex
-        });
-        var E = !!y || !!m || !!k;
+            dataTest: "toggle",
+            dataSelected: g,
+            role: k,
+            tabIndex: y
+        };
+        var T = !!m || !!h || !!S;
         
-        return t().createElement(O, F({
+        return i().createElement(w, A({
             flex: true,
             inline: b,
             "data-test": "switch",
             "data-test-selected": g,
-            "data-test-value": C,
-            "data-test-error": d ? true : undefined,
-            "data-error": d ? true : undefined,
+            "data-test-value": x,
+            "data-test-error": s ? true : undefined,
+            "data-error": s ? true : undefined,
             "data-test-disabled": l ? "disabled" : undefined,
             elementRef: n,
             $disabled: l || false
-        }, S), i === "toggle" ?  t().createElement(G, F({
+        }, B), o === "toggle" ?  i().createElement(W, A({
             disabled: l || false,
             selected: !!g
-        }, q)) :  t().createElement(J, F({
-            error: d || false,
+        }, R)) :  i().createElement(F, A({
+            error: s || false,
             disabled: l || false,
             selected: g
-        }, q)), E &&  t().createElement(c(), null, I["".concat(g)]), o &&  t().createElement(_, {
+        }, R)), T &&  i().createElement(c(), null, _["".concat(g)]), t &&  i().createElement(N, {
             $disabled: l || false,
             "data-test": "label",
-            id: x,
-            htmlFor: w,
+            id: $,
+            htmlFor: O,
             "data-disabled": l || null
-        }, o));
+        }, t));
     }
-    K.propTypes = z;
-    /* harmony default export */    const Q = K;
+    z.propTypes = V;
+    /* harmony default export */    const G = z;
     // CONCATENATED MODULE: ./src/Switch/index.ts
     module.exports = r;
     /******/})();