@arcblock/ux 1.15.32 → 1.15.36

package/lib/Blocklet/index.js

@@ -196,7 +196,8 @@ function Blocklet(_ref2) {
     variant: "caption",
     className: "arcblock-blocklet__addons--item" // eslint-disable-next-line react/no-array-index-key
     ,
-    key: index
+    key: index,
+    title: item.title
   }, item.empty ? null : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(BlockletIcon, {
     name: item.icon
   }), item.pretty ? prettySize(item.value) : item.value)))));

package/lib/Switch/index.js

@@ -0,0 +1,107 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _FormControlLabel = _interopRequireDefault(require("@material-ui/core/FormControlLabel"));
+
+var _Switch = _interopRequireDefault(require("@material-ui/core/Switch"));
+
+const _excluded = ["classes"],
+      _excluded2 = ["labelProps"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+// 参考: https://v4.mui.com/components/switches/
+const IOSSwitch = (0, _styles.withStyles)(theme => ({
+  root: {
+    width: 42,
+    height: 26,
+    padding: 0,
+    margin: theme.spacing(1)
+  },
+  switchBase: {
+    padding: 1,
+    '&$checked': {
+      transform: 'translateX(16px)',
+      color: theme.palette.common.white,
+      '& + $track': {
+        backgroundColor: '#52d869',
+        opacity: 1,
+        border: 'none'
+      }
+    },
+    '&$focusVisible $thumb': {
+      color: '#52d869',
+      border: '6px solid #fff'
+    }
+  },
+  thumb: {
+    width: 24,
+    height: 24
+  },
+  track: {
+    // fix: 下边框截断问题
+    boxSizing: 'border-box',
+    borderRadius: 26 / 2,
+    border: "1px solid ".concat(theme.palette.grey[400]),
+    backgroundColor: theme.palette.grey[50],
+    opacity: 1,
+    transition: theme.transitions.create(['background-color', 'border'])
+  },
+  checked: {},
+  focusVisible: {}
+}))(_ref => {
+  let {
+    classes
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/_react.default.createElement(_Switch.default, Object.assign({
+    focusVisibleClassName: classes.focusVisible,
+    disableRipple: true,
+    classes: {
+      root: classes.root,
+      switchBase: classes.switchBase,
+      thumb: classes.thumb,
+      track: classes.track,
+      checked: classes.checked
+    }
+  }, props));
+});
+/**
+ * 抽取 blocklet server 中使用的 iOS 风格的 Switch, 该组件把 FormControlLabel 和 MuiSwitch 组合在一起,
+ * 兼容 mui Switch props, 使用 labelProps 控制 FormControlLabel
+ */
+
+function Switch(_ref2) {
+  let {
+    labelProps
+  } = _ref2,
+      rest = _objectWithoutProperties(_ref2, _excluded2);
+
+  return /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, Object.assign({
+    control: /*#__PURE__*/_react.default.createElement(IOSSwitch, rest)
+  }, labelProps));
+}
+
+Switch.propTypes = {
+  labelProps: _propTypes.default.object
+};
+Switch.defaultProps = {
+  labelProps: {}
+};
+var _default = Switch;
+exports.default = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "1.15.32",
+  "version": "1.15.36",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -52,10 +52,10 @@
     "react": ">=16.12.0",
     "react-ga": "^2.7.0"
   },
-  "gitHead": "88b454352f15cd5747c14f162b324ace630f1bfd",
+  "gitHead": "5a9a4d5d808072f3953b020b735830a40d0e8d0f",
   "dependencies": {
-    "@arcblock/icons": "^1.15.32",
-    "@arcblock/react-hooks": "^1.15.32",
+    "@arcblock/icons": "^1.15.36",
+    "@arcblock/react-hooks": "^1.15.36",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@material-ui/core": "^4.12.3",
     "@material-ui/icons": "4.11.2",