@sheinx/base 3.0.0-alpha.1

package/cjs/sticky/sticky.js

@@ -0,0 +1,282 @@
+"use strict";
+
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.array.concat.js");
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _hooks = require("@sheinx/hooks");
+var _reactDom = require("react-dom");
+var _react = _interopRequireWildcard(require("react"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var cssSupport = _hooks.util.cssSupport;
+var supportSticky = cssSupport('position', 'sticky');
+var defaultZIndex = 900;
+var getFirstScrollParent = function getFirstScrollParent(el) {
+  var parent = el.parentNode;
+  while (parent) {
+    if (parent === document.body || parent === document.documentElement) {
+      parent = document.body;
+      break;
+    }
+    var _window$getComputedSt = window.getComputedStyle(parent),
+      overflowY = _window$getComputedSt.overflowY;
+    if (overflowY === 'scroll' || overflowY === 'auto') {
+      break;
+    }
+    parent = parent.parentNode;
+  }
+  return parent;
+};
+var Sticky = function Sticky(props) {
+  var _props$style;
+  var css = props.css,
+    children = props.children,
+    top = props.top,
+    bottom = props.bottom;
+  var _useRef = (0, _react.useRef)({
+      target: null,
+      div: null,
+      observer: null,
+      parentObserver: null,
+      isTop: false
+    }),
+    context = _useRef.current;
+  var _useState = (0, _react.useState)({}),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    style = _useState2[0],
+    setStyle = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    show = _useState4[0],
+    setShow = _useState4[1];
+  var _useState5 = (0, _react.useState)(true),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    parentVisible = _useState6[0],
+    setParentVisible = _useState6[1];
+  var forceRender = (0, _hooks.useRender)();
+  var elementRef = (0, _react.useRef)(null);
+  var elementSize = (0, _hooks.useResize)({
+    targetRef: elementRef,
+    timer: 0
+  });
+  var getTarget = function getTarget() {
+    var target = props.target;
+    if (typeof props.target === 'string') {
+      target = document.querySelector(props.target);
+    }
+    // 判断是否是dom元素
+    if (target && target.nodeType === 1) {
+      return target;
+    }
+    return getFirstScrollParent(elementRef.current);
+  };
+  var updateStyle = (0, _hooks.usePersistFn)(function () {
+    if (context.div && !context.isTop && show) {
+      var shouldFixed = context.target === document.body;
+      var scrollRect = context.target.getBoundingClientRect();
+      var targetRect = elementRef.current.getBoundingClientRect();
+      var targetLeft = targetRect.left;
+      var width = targetRect.width,
+        height = targetRect.height;
+      if (typeof bottom === 'number') {
+        var outRootRect = context.target.getBoundingClientRect();
+        var _style = {
+          position: shouldFixed ? 'fixed' : 'absolute',
+          width: "".concat(width, "px"),
+          height: "".concat(height, "px"),
+          top: "".concat(scrollRect.bottom - (props.bottom || 0) - outRootRect.top, "px"),
+          left: "".concat(targetLeft - outRootRect.left, "px"),
+          transform: 'translateY(-100%)'
+        };
+        setStyle(_style);
+      }
+    }
+  });
+  var handlePosition = (0, _hooks.usePersistFn)(function (entries) {
+    var entry = entries[0];
+    var scrollRect = entry.rootBounds;
+    var targetRect = entry.boundingClientRect;
+    var shouldFixed = context.target === document.body;
+    if (!entry.isIntersecting) {
+      var targetLeft = targetRect.left;
+      var outRootRect = shouldFixed ? {
+        top: 0,
+        bottom: 0,
+        left: 0,
+        right: 0
+      } : context.div.getBoundingClientRect();
+      var width = targetRect.width,
+        height = targetRect.height;
+      if (scrollRect && targetRect.bottom < scrollRect.bottom) {
+        // top in
+        context.isTop = true;
+        if (typeof top === 'number') {
+          setShow(true);
+          var _style2 = {
+            position: shouldFixed ? 'fixed' : 'absolute',
+            width: "".concat(width, "px"),
+            height: "".concat(height, "px"),
+            top: "".concat(scrollRect.top - outRootRect.top, "px"),
+            left: "".concat(targetLeft - outRootRect.left, "px")
+          };
+          setStyle(_style2);
+        }
+      } else if (scrollRect) {
+        // bottom in
+        context.isTop = false;
+        if (typeof bottom === 'number') {
+          setShow(true);
+          var _outRootRect = context.target.getBoundingClientRect();
+          var _style3 = {
+            position: shouldFixed ? 'fixed' : 'absolute',
+            width: "".concat(width, "px"),
+            height: "".concat(height, "px"),
+            top: "".concat(scrollRect.bottom - _outRootRect.top, "px"),
+            left: "".concat(targetLeft - _outRootRect.left, "px"),
+            transform: 'translateY(-100%)'
+          };
+          setStyle(_style3);
+        }
+      }
+    }
+    if (entry.isIntersecting) {
+      setShow(false);
+    }
+  });
+  var handleParentVisible = (0, _hooks.usePersistFn)(function (entries) {
+    var entry = entries[0];
+    if (entry.isIntersecting) {
+      setParentVisible(true);
+    } else {
+      setParentVisible(false);
+    }
+  });
+  var cleanEvents = function cleanEvents() {
+    if (context.observer) {
+      context.observer.disconnect();
+      context.observer = null;
+    }
+    if (context.parentObserver) {
+      context.parentObserver.disconnect();
+      context.parentObserver = null;
+    }
+    window.removeEventListener('resize', updateStyle);
+  };
+  var createObserver = function createObserver() {
+    var target = getTarget();
+    if (!context.div) {
+      context.div = document.createElement('div');
+      context.div.style.position = 'relative';
+    }
+    if (target && target !== context.target) {
+      forceRender();
+      context.target = target;
+      cleanEvents();
+      if (target === document.body) {
+        document.body.appendChild(context.div);
+      } else {
+        target.parentNode.insertBefore(context.div, target);
+      }
+      if (window.IntersectionObserver) {
+        var observer = new IntersectionObserver(handlePosition, {
+          root: target,
+          rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
+          threshold: 1.0
+        });
+        context.observer = observer;
+        context.parentObserver = new IntersectionObserver(handleParentVisible, {
+          root: target,
+          rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
+          threshold: 0
+        });
+      }
+    }
+  };
+  var handleElementRef = function handleElementRef(el) {
+    if (el) {
+      elementRef.current = el;
+      if (el && context.observer) {
+        context.observer.observe(el);
+      }
+    }
+  };
+  (0, _react.useEffect)(function () {
+    if (!css) {
+      createObserver();
+      window.addEventListener('resize', updateStyle);
+    }
+    return function () {
+      cleanEvents();
+      if (context.div) {
+        context.div.remove();
+        context.div = null;
+      }
+    };
+  }, [css]);
+  (0, _react.useEffect)(function () {
+    if (props.parent && context.parentObserver) {
+      context.parentObserver.observe(props.parent);
+    }
+    return function () {
+      if (context.parentObserver) {
+        context.parentObserver.disconnect();
+      }
+    };
+  }, [props.parent]);
+
+  // 纯css方法 直接使用css
+  // js方法
+  // 1. 不指定滚动容器 基于document.body 使用fixed + js计算
+  // 2. 指定滚动容器 在滚动容器上方插入一个dom占位 基于该dom渲染和定位
+  // 3. 使用 intersectionObserver 来判断是否需要sticky
+  if (css && supportSticky) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: props.className,
+      style: _objectSpread(_objectSpread({
+        zIndex: defaultZIndex
+      }, props.style), {}, {
+        position: 'sticky',
+        top: top,
+        bottom: bottom
+      }),
+      children: children
+    });
+  }
+  var StickyEl = show && parentVisible ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: _objectSpread(_objectSpread({
+      zIndex: defaultZIndex
+    }, style), elementSize),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: props.className,
+      style: props.style,
+      children: children
+    })
+  }) : null;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [context.target && context.div && /*#__PURE__*/(0, _reactDom.createPortal)(StickyEl, context.div), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: props.className,
+      style: _objectSpread(_objectSpread({}, props.style), {}, {
+        opacity: show && parentVisible ? 0 : (_props$style = props.style) === null || _props$style === void 0 ? void 0 : _props$style.opacity
+      }),
+      ref: handleElementRef,
+      children: children
+    })]
+  });
+};
+var _default = Sticky;
+exports.default = _default;

package/cjs/sticky/sticky.type.d.ts

@@ -0,0 +1,52 @@
+/// <reference types="react" />
+import { CommonType } from '../common/type';
+export interface StickyClasses {
+    wrapper: string;
+}
+export interface StickyProps extends Pick<CommonType, 'className' | 'style'> {
+    jssStyle?: {
+        sticky: () => StickyClasses;
+    };
+    /**
+     * @en Extend style. The default z-Index after triggering the float is 900, and you can modify the z-Index of the style to change.
+     * @cn 扩展样式。触发浮动后的默认 zIndex 为900，修改 style的 zIndex 来改变。
+     */
+    style?: React.CSSProperties;
+    /**
+     * @en Offsets from the bottom.
+     * @cn 距离底部多少偏移量触发
+     */
+    bottom?: number;
+    /**
+     * @en Attached target. the default is the document.body. You can pass in an HTMLElement or css selector, and the target must be an ancestor node of the Sticky component.
+     * @cn 附着的目标，默认为 document.body。可以传入 HTMLElement 或者 css selector，target 必须为 Sticky 组件的祖先节点
+     */
+    target?: string | HTMLElement | null;
+    /**
+     * @cn sticky 父级元素, 当父元素离开视窗时，sticky 将失效
+     * @en sticky parent, when the parent element leaves the viewport, the sticky will be invalid
+     */
+    parent?: HTMLElement | null;
+    /**
+     * @en Offsets from the top.
+     * @cn 距离顶部多少偏移量触发
+     */
+    top?: number;
+    /**
+     * @en use css position:sticky while target is ordered
+     * @cn 是否采用 css 方式实现附着效果
+     * @default false
+     */
+    css?: boolean;
+    /**
+     * @en When the adsorption effect, trigger the callback，this method is invalid when native sticky is used
+     * @cn 吸附效果时，触发该回调，当使用原生 sticky 时该方法无效
+     */
+    onChange?: (isSticky: boolean) => void;
+    /**
+     * @en children
+     * @cn 子元素
+     */
+    children?: React.ReactNode;
+}
+//# sourceMappingURL=sticky.type.d.ts.map

package/cjs/sticky/sticky.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sticky.type.d.ts","sourceRoot":"","sources":["sticky.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IAC1E,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IAEF;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CAAC;IAErC;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B"}

package/cjs/sticky/sticky.type.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/cjs/switch/__example__/01-base.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;
+//# sourceMappingURL=01-base.d.ts.map

package/cjs/switch/__example__/01-base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"01-base.d.ts","sourceRoot":"","sources":["01-base.tsx"],"names":[],"mappings":";;AAUA,wBAyBE"}

package/cjs/switch/__example__/01-base.js

@@ -0,0 +1,80 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _shineoutStyle = require("@sheinx/shineout-style");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 基本用法
+ *    --
+ * en - Basic
+ *    --
+ */
+var _default = function _default() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        },
+        content: ['开', '关']
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        }
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      children: ["\u7981\u7528", /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        disabled: true,
+        checked: true,
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        },
+        content: ['开', '关']
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        disabled: true,
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        },
+        content: ['开', '关']
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      children: ["loading", /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        loading: true,
+        checked: true,
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        },
+        content: ['开', '关']
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        loading: true,
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        },
+        content: ['开', '关']
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      children: ["\u5927\u5C0F", /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        },
+        size: 'large'
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Switch, {
+        jssStyle: {
+          switch: _shineoutStyle.useSwitchStyle
+        },
+        size: 'small'
+      })]
+    })]
+  });
+};
+exports.default = _default;

package/cjs/switch/index.d.ts

@@ -0,0 +1,3 @@
+export { default, default as Switch } from './switch';
+export type { SwitchProps } from './switch.type';
+//# sourceMappingURL=index.d.ts.map

package/cjs/switch/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AACtD,YAAY,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/cjs/switch/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Switch", {
+  enumerable: true,
+  get: function get() {
+    return _switch.default;
+  }
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _switch.default;
+  }
+});
+var _switch = _interopRequireDefault(require("./switch"));

package/cjs/switch/switch.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { SwitchProps } from './switch.type';
+declare const Switch: (props: SwitchProps) => JSX.Element;
+export default Switch;
+//# sourceMappingURL=switch.d.ts.map

package/cjs/switch/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["switch.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,QAAA,MAAM,MAAM,UAAW,WAAW,gBAmDjC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/cjs/switch/switch.js

@@ -0,0 +1,82 @@
+"use strict";
+
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _hooks = require("@sheinx/hooks");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = _interopRequireDefault(require("react"));
+var _jsxRuntime = require("react/jsx-runtime");
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var Switch = function Switch(props) {
+  var _jssStyle$switch;
+  var jssStyle = props.jssStyle,
+    content = props.content,
+    size = props.size,
+    loading = props.loading,
+    className = props.className,
+    style = props.style;
+  var switchClasses = jssStyle === null || jssStyle === void 0 ? void 0 : (_jssStyle$switch = jssStyle.switch) === null || _jssStyle$switch === void 0 ? void 0 : _jssStyle$switch.call(jssStyle);
+  var disabled = props.disabled || props.loading;
+  var _useInputAble = (0, _hooks.useInputAble)({
+      value: props.value,
+      onChange: props.onChange,
+      defaultValue: props.defaultValue,
+      control: 'value' in props,
+      beforeChange: props.beforeChange
+    }),
+    value = _useInputAble.value,
+    onChange = _useInputAble.onChange;
+  var getChecked = function getChecked() {
+    if (props.checked !== undefined) {
+      return props.checked;
+    }
+    return !!value;
+  };
+  var _useCheck = (0, _hooks.useCheck)({
+      checked: getChecked(),
+      onChange: onChange,
+      onClick: props.onClick,
+      disabled: disabled,
+      inputRef: props.inputRef
+    }),
+    getInputProps = _useCheck.getInputProps,
+    getRootProps = _useCheck.getRootProps,
+    checked = _useCheck.checked;
+  var _ref = content || [],
+    _ref2 = (0, _slicedToArray2.default)(_ref, 2),
+    checkedContent = _ref2[0],
+    unCheckedContent = _ref2[1];
+  var rootClassName = (0, _classnames.default)(className, switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.wrapper, !!checked && (switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.wrapperChecked), disabled && (switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.wrapperDisabled), size === 'small' && (switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.wrapperSmall), size === 'large' && (switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.wrapperLarge));
+  var rootProps = getRootProps({
+    className: rootClassName,
+    style: style
+  });
+  var inputProps = getInputProps();
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", _objectSpread(_objectSpread({
+    type: 'button',
+    role: 'switch'
+  }, rootProps), {}, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", _objectSpread(_objectSpread({}, inputProps), {}, {
+      type: 'checkbox'
+    })), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.indicator,
+      children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.loading
+      }) : null
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: switchClasses === null || switchClasses === void 0 ? void 0 : switchClasses.content,
+      children: checked ? checkedContent : unCheckedContent
+    })]
+  }));
+};
+var _default = Switch;
+exports.default = _default;

package/cjs/switch/switch.type.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import { BaseCheckProps } from '@sheinx/hooks';
+import { CommonType } from '../common/type';
+export interface SwitchClasses {
+    /**
+     * 最外层class
+     */
+    wrapper: string;
+    wrapperSmall: string;
+    wrapperLarge: string;
+    indicator: string;
+    content: string;
+    wrapperChecked: string;
+    wrapperDisabled: string;
+    loading: string;
+}
+export interface SwitchProps extends Omit<BaseCheckProps, 'defaultChecked'>, Pick<CommonType, 'style' | 'className' | 'size'> {
+    jssStyle?: {
+        switch?: () => SwitchClasses;
+    };
+    content?: [React.ReactNode, React.ReactNode];
+    loading?: boolean;
+    value?: boolean;
+    defaultValue?: boolean;
+    onChange?: (value: boolean) => void;
+    beforeChange?: (value: boolean) => boolean | undefined;
+}
+//# sourceMappingURL=switch.type.d.ts.map

package/cjs/switch/switch.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.type.d.ts","sourceRoot":"","sources":["switch.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,cAAc,EAAE,gBAAgB,CAAC,EAC5C,IAAI,CAAC,UAAU,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM,CAAC;IAClD,QAAQ,CAAC,EAAE;QACT,MAAM,CAAC,EAAE,MAAM,aAAa,CAAC;KAC9B,CAAC;IACF,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,OAAO,GAAG,SAAS,CAAC;CACxD"}

package/cjs/switch/switch.type.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/cjs/table/__example__/01-base.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;
+//# sourceMappingURL=01-base.d.ts.map

package/cjs/table/__example__/01-base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"01-base.d.ts","sourceRoot":"","sources":["01-base.tsx"],"names":[],"mappings":";;AA8GA,wBAgDE"}