intergalactic 15.129.0 → 15.130.0-prerelease.0

package/switch/lib/esm/Switch.mjs

@@ -1,216 +1,254 @@
-import N from "@babel/runtime/helpers/esm/slicedToArray";
-import W from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import h from "@babel/runtime/helpers/esm/objectSpread2";
-import L from "@babel/runtime/helpers/esm/classCallCheck";
-import z from "@babel/runtime/helpers/esm/createClass";
-import u from "@babel/runtime/helpers/esm/assertThisInitialized";
-import C from "@babel/runtime/helpers/esm/inherits";
-import A from "@babel/runtime/helpers/esm/createSuper";
-import o from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled as q } from 'intergalactic/utils/lib/core/index';
-import B, { sstyled as y, assignProps as I, Component as D } from 'intergalactic/core';
-import g from "react";
-import { Box as p } from 'intergalactic/flex-box';
-import k from 'intergalactic/neighbor-location';
-import H from 'intergalactic/utils/lib/enhances/keyboardFocusEnhance';
-import G from 'intergalactic/utils/lib/enhances/resolveColorEnhance';
-import J, { inputProps as O } from 'intergalactic/utils/lib/inputProps';
-import { inputProps as P_ } from 'intergalactic/utils/lib/inputProps';
-import { callAllEventHandlers as T } from 'intergalactic/utils/lib/assignProps';
-import Q from 'intergalactic/utils/lib/uniqueID';
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { sstyled } from 'intergalactic/utils/lib/core/index';
+import createComponent, { sstyled as sstyled$1, assignProps, Component } from 'intergalactic/core';
+import React from "react";
+import { Box } from 'intergalactic/flex-box';
+import NeighborLocation from 'intergalactic/neighbor-location';
+import keyboardFocusEnhance from 'intergalactic/utils/lib/enhances/keyboardFocusEnhance';
+import resolveColorEnhance from 'intergalactic/utils/lib/enhances/resolveColorEnhance';
+import getInputProps, { inputProps } from 'intergalactic/utils/lib/inputProps';
+import { inputProps as inputProps2 } from 'intergalactic/utils/lib/inputProps';
+import { callAllEventHandlers } from 'intergalactic/utils/lib/assignProps';
+import uniqueIDEnhancement from 'intergalactic/utils/lib/uniqueID';
 import "@semcore/utils/lib/canUseDOM";
-var Y = ["Children", "forwardRef", "styles", "includeInputProps", "keyboardFocused", "neighborLocation", "theme", "uid", "active", "resolveColor"], Z = (
+var _excluded = ["Children", "forwardRef", "styles", "includeInputProps", "keyboardFocused", "neighborLocation", "theme", "uid", "active", "resolveColor"];
+/*!__reshadow-styles__:"./style/switch.shadow.css"*/
+var style = (
   /*__reshadow_css_start__*/
-  (q.insert(
+  (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SSwitch_utncw_gg_{display:inline-flex;vertical-align:middle;align-items:center;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SSwitch_utncw_gg_.__size_utncw_gg_ .___SToggle_utncw_gg_{border-radius:var(--intergalactic-switch-rounded, 24px)}.___SSwitch_utncw_gg_._size_m_utncw_gg_{font-size:var(--intergalactic-fs-100, 12px);line-height:var(--intergalactic-lh-100, 133%)}.___SSwitch_utncw_gg_._size_m_utncw_gg_ .___SToggle_utncw_gg_{width:20px;height:12px;min-width:20px}.___SSwitch_utncw_gg_._size_m_utncw_gg_ .___SSlider_utncw_gg_{width:8px;height:8px;border-radius:4px}.___SSwitch_utncw_gg_._size_l_utncw_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SSwitch_utncw_gg_._size_l_utncw_gg_ .___SToggle_utncw_gg_{height:20px;width:36px;min-width:36px}.___SSwitch_utncw_gg_._size_l_utncw_gg_ .___SSlider_utncw_gg_{width:16px;height:16px;border-radius:8px}.___SSwitch_utncw_gg_._size_xl_utncw_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SSwitch_utncw_gg_._size_xl_utncw_gg_ .___SToggle_utncw_gg_{width:44px;height:24px;min-width:44px}.___SSwitch_utncw_gg_._size_xl_utncw_gg_ .___SSlider_utncw_gg_{width:20px;height:20px;border-radius:10px}.___SSwitch_utncw_gg_.__disabled_utncw_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3)}.___SSwitch_utncw_gg_.__disabled_utncw_gg_ .___SAddon_utncw_gg_,.___SSwitch_utncw_gg_.__disabled_utncw_gg_ .___SToggle_utncw_gg_{cursor:default}.___SSlider_utncw_gg_,.___SToggle_utncw_gg_{display:flex;align-items:center;justify-content:space-around}.___SToggle_utncw_gg_{background:var(--intergalactic-control-switch-bg, #a9abb6);position:relative;color:var(--intergalactic-icon-secondary-neutral, #a9abb6);cursor:pointer}.___SToggle_utncw_gg_.__checked_utncw_gg_._theme_info_utncw_gg_{color:var(--intergalactic-control-primary-info, #008ff8);background-color:var(--intergalactic-control-primary-info, #008ff8)}.___SToggle_utncw_gg_.__checked_utncw_gg_._theme_success_utncw_gg_{color:var(--intergalactic-control-primary-success, #009f81);background-color:var(--intergalactic-control-primary-success, #009f81)}.___SToggle_utncw_gg_.__checked_utncw_gg_._theme_custom_utncw_gg_{color:var(--color_utncw);background-color:var(--color_utncw)}.___SToggle_utncw_gg_.__keyboardFocused_utncw_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SToggle_utncw_gg_._neighborLocation_left_utncw_gg_{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SToggle_utncw_gg_._neighborLocation_both_utncw_gg_{margin-right:var(--intergalactic-spacing-2x, 8px);margin-left:var(--intergalactic-spacing-2x, 8px)}.___SToggle_utncw_gg_._neighborLocation_right_utncw_gg_{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SSlider_utncw_gg_{background:var(--intergalactic-bg-primary-neutral, #ffffff);transform:translateX(-50%) scaleX(1);transition:transform calc(var(--intergalactic-duration-switch, 100)*1ms) ease-in-out;pointer-events:none}.___SSlider_utncw_gg_.__checked_utncw_gg_{transform:translateX(50%) scaleX(1)}.___SToggle_utncw_gg_.__active_utncw_gg_ .___SSlider_utncw_gg_{transform:translateX(-50%) scaleX(1.15) translateX(1px)}.___SToggle_utncw_gg_.__active_utncw_gg_ .___SSlider_utncw_gg_.__checked_utncw_gg_{transform:translateX(50%) scaleX(1.15) translateX(-1px)}.___SInput_utncw_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SAddon_utncw_gg_{cursor:pointer}.___SAddon_utncw_gg_._neighborLocation_right_utncw_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SAddon_utncw_gg_._neighborLocation_left_utncw_gg_,.___SSwitch_utncw_gg_.__checked_utncw_gg_ .___SAddon_utncw_gg_._neighborLocation_right_utncw_gg_{color:var(--intergalactic-text-secondary, #6c6e79)}.___SAddon_utncw_gg_._neighborLocation_left_utncw_gg_:nth-child(2){color:var(--intergalactic-text-primary, #191b23)}.___SSwitch_utncw_gg_.__checked_utncw_gg_ .___SAddon_utncw_gg_._neighborLocation_right_utncw_gg_:nth-last-child(2){color:var(--intergalactic-text-primary, #191b23)}.___SSwitch_utncw_gg_.__checked_utncw_gg_ .___SAddon_utncw_gg_._neighborLocation_left_utncw_gg_{color:var(--intergalactic-text-primary, #191b23)}@media (prefers-reduced-motion){.___SSlider_utncw_gg_{transition:none}}",
-    "utncw_gg_"
-  ), {
-    __SSwitch: "___SSwitch_utncw_gg_",
-    __SToggle: "___SToggle_utncw_gg_",
-    _checked: "__checked_utncw_gg_",
-    _theme_info: "_theme_info_utncw_gg_",
-    _theme_success: "_theme_success_utncw_gg_",
-    _theme_custom: "_theme_custom_utncw_gg_",
-    "--color": "--color_utncw",
-    _keyboardFocused: "__keyboardFocused_utncw_gg_",
-    _neighborLocation_left: "_neighborLocation_left_utncw_gg_",
-    _neighborLocation_both: "_neighborLocation_both_utncw_gg_",
-    _neighborLocation_right: "_neighborLocation_right_utncw_gg_",
-    __SInput: "___SInput_utncw_gg_",
-    __SAddon: "___SAddon_utncw_gg_",
-    __SSlider: "___SSlider_utncw_gg_",
-    _size: "__size_utncw_gg_",
-    _size_m: "_size_m_utncw_gg_",
-    _size_l: "_size_l_utncw_gg_",
-    _size_xl: "_size_xl_utncw_gg_",
-    _disabled: "__disabled_utncw_gg_",
-    _active: "__active_utncw_gg_"
+    ".___SSwitch_1jym8_gg_{display:inline-flex;vertical-align:middle;align-items:center;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SSwitch_1jym8_gg_.__size_1jym8_gg_ .___SToggle_1jym8_gg_{border-radius:var(--intergalactic-switch-rounded, 24px)}.___SSwitch_1jym8_gg_._size_m_1jym8_gg_{font-size:var(--intergalactic-fs-100, 12px);line-height:var(--intergalactic-lh-100, 133%)}.___SSwitch_1jym8_gg_._size_m_1jym8_gg_ .___SToggle_1jym8_gg_{width:20px;height:12px;min-width:20px}.___SSwitch_1jym8_gg_._size_m_1jym8_gg_ .___SSlider_1jym8_gg_{width:8px;height:8px;border-radius:4px}.___SSwitch_1jym8_gg_._size_l_1jym8_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SSwitch_1jym8_gg_._size_l_1jym8_gg_ .___SToggle_1jym8_gg_{height:20px;width:36px;min-width:36px}.___SSwitch_1jym8_gg_._size_l_1jym8_gg_ .___SSlider_1jym8_gg_{width:16px;height:16px;border-radius:8px}.___SSwitch_1jym8_gg_._size_xl_1jym8_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SSwitch_1jym8_gg_._size_xl_1jym8_gg_ .___SToggle_1jym8_gg_{width:44px;height:24px;min-width:44px}.___SSwitch_1jym8_gg_._size_xl_1jym8_gg_ .___SSlider_1jym8_gg_{width:20px;height:20px;border-radius:10px}.___SSwitch_1jym8_gg_.__disabled_1jym8_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3)}.___SSwitch_1jym8_gg_.__disabled_1jym8_gg_ .___SAddon_1jym8_gg_,.___SSwitch_1jym8_gg_.__disabled_1jym8_gg_ .___SToggle_1jym8_gg_{cursor:default}.___SSlider_1jym8_gg_,.___SToggle_1jym8_gg_{display:flex;align-items:center;justify-content:space-around}.___SToggle_1jym8_gg_{background:var(--intergalactic-control-switch-bg, #a9abb6);position:relative;color:var(--intergalactic-icon-secondary-neutral, #a9abb6);cursor:pointer}.___SToggle_1jym8_gg_.__checked_1jym8_gg_._theme_info_1jym8_gg_{color:var(--intergalactic-control-primary-info, #008ff8);background-color:var(--intergalactic-control-primary-info, #008ff8)}.___SToggle_1jym8_gg_.__checked_1jym8_gg_._theme_success_1jym8_gg_{color:var(--intergalactic-control-primary-success, #009f81);background-color:var(--intergalactic-control-primary-success, #009f81)}.___SToggle_1jym8_gg_.__checked_1jym8_gg_._theme_custom_1jym8_gg_{color:var(--color_1jym8);background-color:var(--color_1jym8)}.___SToggle_1jym8_gg_.__keyboardFocused_1jym8_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___SToggle_1jym8_gg_._neighborLocation_left_1jym8_gg_{margin-left:var(--intergalactic-spacing-2x, 8px)}.___SToggle_1jym8_gg_._neighborLocation_both_1jym8_gg_{margin-right:var(--intergalactic-spacing-2x, 8px);margin-left:var(--intergalactic-spacing-2x, 8px)}.___SToggle_1jym8_gg_._neighborLocation_right_1jym8_gg_{margin-right:var(--intergalactic-spacing-2x, 8px)}.___SSlider_1jym8_gg_{background:var(--intergalactic-bg-primary-neutral, #ffffff);transform:translateX(-50%) scaleX(1);transition:transform calc(var(--intergalactic-duration-switch, 100)*1ms) ease-in-out;pointer-events:none}.___SSlider_1jym8_gg_.__checked_1jym8_gg_{transform:translateX(50%) scaleX(1)}.___SToggle_1jym8_gg_.__active_1jym8_gg_ .___SSlider_1jym8_gg_{transform:translateX(-50%) scaleX(1.15) translateX(1px)}.___SToggle_1jym8_gg_.__active_1jym8_gg_ .___SSlider_1jym8_gg_.__checked_1jym8_gg_{transform:translateX(50%) scaleX(1.15) translateX(-1px)}.___SInput_1jym8_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SAddon_1jym8_gg_{cursor:pointer}.___SAddon_1jym8_gg_._neighborLocation_right_1jym8_gg_{color:var(--intergalactic-text-primary, #191b23)}.___SAddon_1jym8_gg_._neighborLocation_left_1jym8_gg_,.___SSwitch_1jym8_gg_.__checked_1jym8_gg_ .___SAddon_1jym8_gg_._neighborLocation_right_1jym8_gg_{color:var(--intergalactic-text-secondary, #6c6e79)}.___SAddon_1jym8_gg_._neighborLocation_left_1jym8_gg_:nth-child(2){color:var(--intergalactic-text-primary, #191b23)}.___SSwitch_1jym8_gg_.__checked_1jym8_gg_ .___SAddon_1jym8_gg_._neighborLocation_right_1jym8_gg_:nth-last-child(2){color:var(--intergalactic-text-primary, #191b23)}.___SSwitch_1jym8_gg_.__checked_1jym8_gg_ .___SAddon_1jym8_gg_._neighborLocation_left_1jym8_gg_{color:var(--intergalactic-text-primary, #191b23)}@media (prefers-reduced-motion){.___SSlider_1jym8_gg_{transition:none}}",
+    /*__inner_css_end__*/
+    "1jym8_gg_"
+  ), /*__reshadow_css_end__*/
+  {
+    "__SSwitch": "___SSwitch_1jym8_gg_",
+    "__SToggle": "___SToggle_1jym8_gg_",
+    "_checked": "__checked_1jym8_gg_",
+    "_theme_info": "_theme_info_1jym8_gg_",
+    "_theme_success": "_theme_success_1jym8_gg_",
+    "_theme_custom": "_theme_custom_1jym8_gg_",
+    "--color": "--color_1jym8",
+    "_keyboardFocused": "__keyboardFocused_1jym8_gg_",
+    "_neighborLocation_left": "_neighborLocation_left_1jym8_gg_",
+    "_neighborLocation_both": "_neighborLocation_both_1jym8_gg_",
+    "_neighborLocation_right": "_neighborLocation_right_1jym8_gg_",
+    "__SInput": "___SInput_1jym8_gg_",
+    "__SAddon": "___SAddon_1jym8_gg_",
+    "__SSlider": "___SSlider_1jym8_gg_",
+    "_size": "__size_1jym8_gg_",
+    "_size_m": "_size_m_1jym8_gg_",
+    "_size_l": "_size_l_1jym8_gg_",
+    "_size_xl": "_size_xl_1jym8_gg_",
+    "_disabled": "__disabled_1jym8_gg_",
+    "_active": "__active_1jym8_gg_"
   })
 );
-function __(a) {
-  return !["info", "success"].includes(a);
+function isCustomTheme(theme) {
+  return !["info", "success"].includes(theme);
 }
-var w = /* @__PURE__ */ function(a) {
-  C(i, a);
-  var s = A(i);
-  function i(e) {
-    var _;
-    return L(this, i), _ = s.call(this, e), o(u(_), "inputRef", /* @__PURE__ */ g.createRef()), o(u(_), "state", {
-      active: !1
-    }), o(u(_), "handleMouseUp", function() {
-      _.setState({
-        active: !1
+var Switch = /* @__PURE__ */ function(_Component) {
+  _inherits(Switch2, _Component);
+  var _super = _createSuper(Switch2);
+  function Switch2(props) {
+    var _this;
+    _classCallCheck(this, Switch2);
+    _this = _super.call(this, props);
+    _defineProperty(_assertThisInitialized(_this), "inputRef", /* @__PURE__ */ React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "state", {
+      active: false
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleMouseUp", function() {
+      _this.setState({
+        active: false
       });
-    }), o(u(_), "handleMouseDown", function(t) {
-      (t == null ? void 0 : t.button) === 0 && _.setState({
-        active: !0
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleMouseDown", function(event) {
+      if ((event === null || event === void 0 ? void 0 : event.button) !== 0) return;
+      _this.setState({
+        active: true
       });
-    }), _.forceUpdate = _.forceUpdate.bind(u(_)), _;
+    });
+    _this.forceUpdate = _this.forceUpdate.bind(_assertThisInitialized(_this));
+    return _this;
   }
-  return z(i, [{
+  _createClass(Switch2, [{
     key: "getValueProps",
-    value: function() {
-      var _ = this.asProps, t = _.theme, n = _.uid, c = this.state.active;
+    value: function getValueProps() {
+      var _this$asProps = this.asProps, theme = _this$asProps.theme, uid = _this$asProps.uid;
+      var active = this.state.active;
       return {
-        theme: t,
+        theme,
         ref: this.inputRef,
         $rootForceUpdate: this.forceUpdate,
-        uid: n,
-        active: c
+        uid,
+        active
       };
     }
   }, {
     key: "getAddonProps",
-    value: function() {
-      var _ = this.asProps.uid;
+    value: function getAddonProps() {
+      var uid = this.asProps.uid;
       return {
-        uid: _
+        uid
       };
     }
   }, {
     key: "render",
-    value: function() {
-      var _ = this.asProps, t, n, c = p, r = this.asProps, f = r.Children, S = r.styles, v = r.controlsLength, b = (n = this.inputRef.current) === null || n === void 0 ? void 0 : n.checked;
-      return t = y(S), /* @__PURE__ */ g.createElement(c, t.cn("SSwitch", h({}, I({
-        tag: "label",
-        checked: b,
-        onMouseDown: this.handleMouseDown,
-        onMouseUp: this.handleMouseUp
-      }, _))), /* @__PURE__ */ g.createElement(k, t.cn("NeighborLocation", {
-        controlsLength: v
-      }), /* @__PURE__ */ g.createElement(f, t.cn("Children", {}))));
+    value: function render() {
+      var _ref = this.asProps, _ref3, _this$inputRef$curren;
+      var SSwitch = Box;
+      var _this$asProps2 = this.asProps, Children = _this$asProps2.Children, styles = _this$asProps2.styles, controlsLength = _this$asProps2.controlsLength;
+      var checked = (_this$inputRef$curren = this.inputRef.current) === null || _this$inputRef$curren === void 0 ? void 0 : _this$inputRef$curren.checked;
+      return _ref3 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SSwitch, _ref3.cn("SSwitch", _objectSpread({}, assignProps({
+        "tag": "label",
+        "checked": checked,
+        "onMouseDown": this.handleMouseDown,
+        "onMouseUp": this.handleMouseUp
+      }, _ref))), /* @__PURE__ */ React.createElement(NeighborLocation, _ref3.cn("NeighborLocation", {
+        "controlsLength": controlsLength
+      }), /* @__PURE__ */ React.createElement(Children, _ref3.cn("Children", {}))));
     }
-  }]), i;
-}(D);
-o(w, "displayName", "Switch");
-o(w, "style", Z);
-o(w, "enhance", [Q()]);
-o(w, "defaultProps", {
+  }]);
+  return Switch2;
+}(Component);
+_defineProperty(Switch, "displayName", "Switch");
+_defineProperty(Switch, "style", style);
+_defineProperty(Switch, "enhance", [uniqueIDEnhancement()]);
+_defineProperty(Switch, "defaultProps", {
   theme: "info",
   size: "m"
 });
-var m = /* @__PURE__ */ function(a) {
-  C(i, a);
-  var s = A(i);
-  function i() {
-    var e;
-    L(this, i);
-    for (var _ = arguments.length, t = new Array(_), n = 0; n < _; n++)
-      t[n] = arguments[n];
-    return e = s.call.apply(s, [this].concat(t)), o(u(e), "timer", null), o(u(e), "handleKeyDown", function(c) {
-      (c.key === "Enter" || c.key === " ") && (c.preventDefault(), e.handlers.checked(!e.asProps.checked, c));
-    }), o(u(e), "handlerInputClick", function(c) {
-      return c.stopPropagation();
-    }), e;
+var Value = /* @__PURE__ */ function(_Component2) {
+  _inherits(Value2, _Component2);
+  var _super2 = _createSuper(Value2);
+  function Value2() {
+    var _this2;
+    _classCallCheck(this, Value2);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this2 = _super2.call.apply(_super2, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this2), "timer", null);
+    _defineProperty(_assertThisInitialized(_this2), "handleKeyDown", function(event) {
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        _this2.handlers.checked(!_this2.asProps.checked, event);
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this2), "handlerInputClick", function(e) {
+      return e.stopPropagation();
+    });
+    return _this2;
   }
-  return z(i, [{
+  _createClass(Value2, [{
     key: "uncontrolledProps",
-    value: function() {
-      var _ = this;
+    value: function uncontrolledProps() {
+      var _this3 = this;
       return {
-        checked: [function(t) {
-          return t.target.checked;
+        checked: [function(e) {
+          return e.target.checked;
         }, function() {
-          clearTimeout(_.timer), _.timer = setTimeout(function() {
-            _.asProps.$rootForceUpdate();
+          clearTimeout(_this3.timer);
+          _this3.timer = setTimeout(function() {
+            _this3.asProps.$rootForceUpdate();
           }, 0);
         }]
       };
     }
   }, {
     key: "componentDidMount",
-    value: function() {
+    value: function componentDidMount() {
       this.asProps.$rootForceUpdate();
     }
   }, {
     key: "componentDidUpdate",
-    value: function(_) {
-      var t = _.checked;
-      t !== void 0 && t !== this.asProps.checked && this.asProps.$rootForceUpdate();
+    value: function componentDidUpdate(prevProps) {
+      var checked = prevProps.checked;
+      if (checked !== void 0 && checked !== this.asProps.checked) {
+        this.asProps.$rootForceUpdate();
+      }
     }
   }, {
     key: "componentWillUnmount",
-    value: function() {
+    value: function componentWillUnmount() {
       clearTimeout(this.timer);
     }
   }, {
     key: "render",
-    value: function() {
-      var _ = this, t = p, n = p, c = p, r = this.asProps, f = r.Children, S = r.forwardRef, v = r.styles, b = r.includeInputProps, E = r.keyboardFocused, U = r.neighborLocation, x = r.theme;
-      r.uid;
-      var F = r.active, $ = r.resolveColor, X = W(r, Y), R = J(X, b), P = N(R, 2), l = P[0], M = P[1], K = __(x) ? "custom" : x, V = $(x);
-      return /* @__PURE__ */ g.createElement(k.Detect, {
-        neighborLocation: U
-      }, function(j) {
-        var d;
-        return d = y(v), /* @__PURE__ */ g.createElement(t, d.cn("SToggle", h({
-          keyboardFocused: E,
-          neighborLocation: j,
-          checked: l.checked,
-          active: F,
-          "use:theme": K,
-          "use:color": V
-        }, M)), /* @__PURE__ */ g.createElement(n, d.cn("SInput", h(h({
-          tag: "input",
-          type: "checkbox",
-          ref: S,
-          role: "switch",
-          "aria-readonly": l.disabled
-        }, l), {}, {
-          onClick: T(_.handlerInputClick, l.click),
-          onKeyDown: T(_.handleKeyDown, l.onKeyDown)
-        }))), /* @__PURE__ */ g.createElement(c, d.cn("SSlider", {
-          checked: l.checked
-        }), /* @__PURE__ */ g.createElement(f, d.cn("Children", {}))));
+    value: function render() {
+      var _this4 = this;
+      var SToggle = Box;
+      var SInput = Box;
+      var SSlider = Box;
+      var _this$asProps3 = this.asProps, Children = _this$asProps3.Children, forwardRef = _this$asProps3.forwardRef, styles = _this$asProps3.styles, includeInputProps = _this$asProps3.includeInputProps, keyboardFocused = _this$asProps3.keyboardFocused, neighborLocation = _this$asProps3.neighborLocation, theme = _this$asProps3.theme;
+      _this$asProps3.uid;
+      var active = _this$asProps3.active, resolveColor = _this$asProps3.resolveColor, other = _objectWithoutProperties(_this$asProps3, _excluded);
+      var _getInputProps = getInputProps(other, includeInputProps), _getInputProps2 = _slicedToArray(_getInputProps, 2), inputProps22 = _getInputProps2[0], toggleProps = _getInputProps2[1];
+      var useTheme = isCustomTheme(theme) ? "custom" : theme;
+      var color = resolveColor(theme);
+      return /* @__PURE__ */ React.createElement(NeighborLocation.Detect, {
+        neighborLocation
+      }, function(neighborLocation2) {
+        var _ref4;
+        return _ref4 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SToggle, _ref4.cn("SToggle", _objectSpread({
+          "keyboardFocused": keyboardFocused,
+          "neighborLocation": neighborLocation2,
+          "checked": inputProps22.checked,
+          "active": active,
+          "use:theme": useTheme,
+          "use:color": color
+        }, toggleProps)), /* @__PURE__ */ React.createElement(SInput, _ref4.cn("SInput", _objectSpread(_objectSpread({
+          "tag": "input",
+          "type": "checkbox",
+          "ref": forwardRef,
+          "role": "switch",
+          "aria-readonly": inputProps22.disabled
+        }, inputProps22), {}, {
+          "onClick": callAllEventHandlers(_this4.handlerInputClick, inputProps22.click),
+          "onKeyDown": callAllEventHandlers(_this4.handleKeyDown, inputProps22.onKeyDown)
+        }))), /* @__PURE__ */ React.createElement(SSlider, _ref4.cn("SSlider", {
+          "checked": inputProps22.checked
+        }), /* @__PURE__ */ React.createElement(Children, _ref4.cn("Children", {}))));
       });
     }
-  }]), i;
-}(D);
-o(m, "hoistProps", ["checked", "disabled"]);
-o(m, "enhance", [H(), G()]);
-o(m, "defaultProps", {
-  includeInputProps: O,
-  defaultChecked: !1
+  }]);
+  return Value2;
+}(Component);
+_defineProperty(Value, "hoistProps", ["checked", "disabled"]);
+_defineProperty(Value, "enhance", [keyboardFocusEnhance(), resolveColorEnhance()]);
+_defineProperty(Value, "defaultProps", {
+  includeInputProps: inputProps,
+  defaultChecked: false
 });
-function t_(a) {
-  var s = arguments[0], i = p, e = a.styles, _ = a.neighborLocation, t = a.uid;
-  return /* @__PURE__ */ g.createElement(k.Detect, {
-    neighborLocation: _
-  }, function(n) {
-    var c;
-    return c = y(e), /* @__PURE__ */ g.createElement(i, c.cn("SAddon", h({}, I({
-      tag: "span",
-      neighborLocation: n,
-      id: "igc-".concat(t, "-switch-addon-").concat(n)
-    }, s))));
+function Addon(props) {
+  var _ref2 = arguments[0];
+  var SAddon = Box;
+  var styles = props.styles, neighborLocation = props.neighborLocation, uid = props.uid;
+  return /* @__PURE__ */ React.createElement(NeighborLocation.Detect, {
+    neighborLocation
+  }, function(neighborLocation2) {
+    var _ref5;
+    return _ref5 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SAddon, _ref5.cn("SAddon", _objectSpread({}, assignProps({
+      "tag": "span",
+      "neighborLocation": neighborLocation2,
+      "id": "igc-".concat(uid, "-switch-addon-").concat(neighborLocation2)
+    }, _ref2))));
   });
 }
-const x_ = B(w, {
-  Value: m,
-  Addon: t_
+const Switch$1 = createComponent(Switch, {
+  Value,
+  Addon
 });
 export {
-  x_ as default,
-  P_ as inputProps
+  Switch$1 as default,
+  inputProps2 as inputProps
 };

package/switch/lib/esm/index.mjs

@@ -1,6 +1,6 @@
-import { default as p } from "./Switch.mjs";
-import { inputProps as e } from 'intergalactic/utils/lib/inputProps';
+import { default as default2 } from "./Switch.mjs";
+import { inputProps } from 'intergalactic/utils/lib/inputProps';
 export {
-  p as default,
-  e as inputProps
+  default2 as default,
+  inputProps
 };

package/switch/lib/esm/style/switch.shadow.css

@@ -0,0 +1,177 @@
+SSwitch {
+  display: inline-flex;
+  vertical-align: middle;
+  align-items: center;
+  position: relative;
+  user-select: none;
+}
+
+SSwitch[size] {
+  & SToggle {
+    border-radius: var(--intergalactic-switch-rounded, 24px);
+  }
+}
+
+SSwitch[size='m'] {
+  font-size: var(--intergalactic-fs-100, 12px);
+  line-height: var(--intergalactic-lh-100, 133%);
+
+  & SToggle {
+    width: 20px;
+    height: 12px;
+    min-width: 20px;
+  }
+
+  & SSlider {
+    width: 8px;
+    height: 8px;
+    border-radius: 4px;
+  }
+}
+
+SSwitch[size='l'] {
+  font-size: var(--intergalactic-fs-200, 14px);
+  line-height: var(--intergalactic-lh-200, 142%);
+
+  & SToggle {
+    height: 20px;
+    width: 36px;
+    min-width: 36px;
+  }
+
+  & SSlider {
+    width: 16px;
+    height: 16px;
+    border-radius: 8px;
+  }
+}
+
+SSwitch[size='xl'] {
+  font-size: var(--intergalactic-fs-300, 16px);
+  line-height: var(--intergalactic-lh-300, 150%);
+
+  & SToggle {
+    width: 44px;
+    height: 24px;
+    min-width: 44px;
+  }
+
+  & SSlider {
+    width: 20px;
+    height: 20px;
+    border-radius: 10px;
+  }
+}
+
+SSwitch[disabled] {
+  opacity: var(--intergalactic-disabled-opacity, 0.3);
+
+  & SToggle {
+    cursor: default;
+  }
+  & SAddon {
+    cursor: default;
+  }
+}
+
+SToggle {
+  background: var(--intergalactic-control-switch-bg, #a9abb6);
+  position: relative;
+  color: var(--intergalactic-icon-secondary-neutral, #a9abb6);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+}
+
+SToggle[checked][theme='info'] {
+  color: var(--intergalactic-control-primary-info, #008ff8);
+  background-color: var(--intergalactic-control-primary-info, #008ff8);
+}
+SToggle[checked][theme='success'] {
+  color: var(--intergalactic-control-primary-success, #009f81);
+  background-color: var(--intergalactic-control-primary-success, #009f81);
+}
+
+SToggle[checked][theme='custom'] {
+  color: var(--color);
+  background-color: var(--color);
+}
+
+SToggle[keyboardFocused] {
+  box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
+}
+
+SToggle[neighborLocation='left'] {
+  margin-left: var(--intergalactic-spacing-2x, 8px);
+}
+
+SToggle[neighborLocation='both'] {
+  margin-right: var(--intergalactic-spacing-2x, 8px);
+  margin-left: var(--intergalactic-spacing-2x, 8px);
+}
+
+SToggle[neighborLocation='right'] {
+  margin-right: var(--intergalactic-spacing-2x, 8px);
+}
+
+SSlider {
+  /* margin: 0 var(--intergalactic-spacing-05x, 2px); */
+  background: var(--intergalactic-bg-primary-neutral, #ffffff);
+  transform: translateX(-50%) scaleX(1);
+  transition: transform calc(var(--intergalactic-duration-switch, 100) * 1ms) ease-in-out;
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  &[checked] {
+    transform: translateX(50%) scaleX(1);
+  }
+  pointer-events: none;
+}
+
+SToggle[active] SSlider {
+  transform: translateX(-50%) scaleX(1.15) translateX(1px);
+  &[checked] {
+    transform: translateX(50%) scaleX(1.15) translateX(-1px);
+  }
+}
+
+SInput {
+  position: absolute;
+  clip: rect(1px, 1px, 1px, 1px);
+}
+
+SAddon {
+  cursor: pointer;
+}
+
+SAddon[neighborLocation='right'] {
+  color: var(--intergalactic-text-primary, #191b23);
+}
+
+SAddon[neighborLocation='left'] {
+  color: var(--intergalactic-text-secondary, #6c6e79);
+}
+
+SAddon[neighborLocation='left']:nth-child(2) {
+  color: var(--intergalactic-text-primary, #191b23);
+}
+
+SSwitch[checked] {
+  & SAddon[neighborLocation='right'] {
+    color: var(--intergalactic-text-secondary, #6c6e79);
+  }
+  & SAddon[neighborLocation='right']:nth-last-child(2) {
+    color: var(--intergalactic-text-primary, #191b23);
+  }
+
+  & SAddon[neighborLocation='left'] {
+    color: var(--intergalactic-text-primary, #191b23);
+  }
+}
+
+@media (prefers-reduced-motion) {
+  SSlider {
+    transition: none;
+  }
+}

package/switch/package.json

@@ -1 +1 @@
-{"name":"intergalactic/switch","description":"Semrush Switch Component","version":"5.40.2","main":"lib/cjs/index.js","module":"lib/es6/index.js","typings":"lib/types/index.d.ts","sideEffects":false,"author":"UI-kit team <ui-kit-team@semrush.com>","license":"MIT","scripts":{"build":"pnpm semcore-builder --source=js && pnpm vite build"},"exports":{"require":"./lib/cjs/index.js","import":"./lib/esm/index.mjs","types":"./lib/types/index.d.ts"},"dependencies":{"@semcore/flex-box":"5.41.2","@semcore/neighbor-location":"4.40.2","@semcore/utils":"4.48.2"},"peerDependencies":{"@semcore/core":"^2.17.5","react":"16.8 - 18","react-dom":"16.8 - 18"},"repository":{"type":"git","url":"https://github.com/semrush/intergalactic.git","directory":"semcore/switch"},"devDependencies":{"@types/react":"18.0.21","@semcore/testing-utils":"1.0.0"}}
+{"name":"intergalactic/switch","description":"Semrush Switch Component","version":"5.40.3-prerelease.0","main":"lib/cjs/index.js","module":"lib/es6/index.js","typings":"lib/types/index.d.ts","sideEffects":false,"author":"UI-kit team <ui-kit-team@semrush.com>","license":"MIT","scripts":{"build":"pnpm semcore-builder --source=js && pnpm vite build"},"exports":{"require":"./lib/cjs/index.js","import":"./lib/esm/index.mjs","types":"./lib/types/index.d.ts"},"dependencies":{"@semcore/flex-box":"5.41.3-prerelease.0","@semcore/neighbor-location":"4.40.3-prerelease.0","@semcore/utils":"4.48.4-prerelease.0"},"peerDependencies":{"@semcore/core":"^2.39.3-prerelease.0","react":"16.8 - 18","react-dom":"16.8 - 18"},"repository":{"type":"git","url":"https://github.com/semrush/intergalactic.git","directory":"semcore/switch"},"devDependencies":{"@types/react":"18.0.21","@semcore/testing-utils":"1.0.0"}}