@zero-bits/react-native-hot-update 1.0.0

package/lib/widget/footer.widget.js

@@ -0,0 +1,161 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = FooterWidget;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeUpdate = require("react-native-update");
+var _updateState = require("../updateState");
+var _reactNativeMarketLinking = require("react-native-market-linking");
+var _updateProvider = require("../updateProvider");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/**
+ * @description 更新弹窗底部操作按钮组件
+ * @returns 更新弹窗底部操作按钮组件
+ */
+function FooterWidget() {
+  var isAndroid = _reactNative.Platform.OS === 'android';
+  var _useUpdate = (0, _reactNativeUpdate.useUpdate)(),
+    updateInfo = _useUpdate.updateInfo;
+  var _useUpdateState = (0, _updateState.useUpdateState)(),
+    hideUpdateModal = _useUpdateState.hideUpdateModal,
+    startDownloadFlow = _useUpdateState.startDownloadFlow;
+  var config = (0, _react.useContext)(_updateProvider.HotUpdateContext);
+  var locale = config.localeText;
+  var primaryColor = config.themeColor || 'rgba(52,92,255,1)';
+  var isForceUpdate = (0, _react.useMemo)(function () {
+    try {
+      if (!(updateInfo !== null && updateInfo !== void 0 && updateInfo.metaInfo)) return false;
+      var meta = JSON.parse(updateInfo.metaInfo);
+      return meta.force === true || meta.forceUpdate === true;
+    } catch (_unused) {
+      return false;
+    }
+  }, [updateInfo === null || updateInfo === void 0 ? void 0 : updateInfo.metaInfo]);
+  function appStoreUpdate() {
+    if (!isForceUpdate) hideUpdateModal();
+    if (config.iosAppId) {
+      (0, _reactNativeMarketLinking.openAppStore)(config.iosAppId);
+    } else {
+      _reactNative.Alert.alert('提示', locale.alertMissingAppId);
+    }
+  }
+  function openH5ApkDownloadPage() {
+    if (!isForceUpdate) hideUpdateModal();
+    if (!(updateInfo !== null && updateInfo !== void 0 && updateInfo.downloadUrl)) {
+      _reactNative.Alert.alert('提示', locale.alertMissingDownloadUrl);
+      return;
+    }
+    _reactNative.Linking.canOpenURL(updateInfo === null || updateInfo === void 0 ? void 0 : updateInfo.downloadUrl).then(function (supported) {
+      if (supported) return _reactNative.Linking.openURL(updateInfo === null || updateInfo === void 0 ? void 0 : updateInfo.downloadUrl);
+      _reactNative.Alert.alert('提示', locale.alertCantOpenDownloadUrl);
+    }).catch(function () {
+      _reactNative.Alert.alert('提示', locale.alertDownloadUrlFailed);
+    });
+  }
+  var PrimaryBtn = function PrimaryBtn(_ref) {
+    var title = _ref.title,
+      onPress = _ref.onPress,
+      style = _ref.style;
+    return /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
+      style: [Style.button, {
+        backgroundColor: primaryColor
+      }, style],
+      onPress: onPress
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+      style: Style.primaryText
+    }, title));
+  };
+  var GhostBtn = function GhostBtn(_ref2) {
+    var title = _ref2.title,
+      onPress = _ref2.onPress,
+      style = _ref2.style;
+    return /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
+      style: [Style.button, Style.ghostButton, {
+        borderColor: primaryColor
+      }, style],
+      onPress: onPress
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+      style: [Style.ghostText, {
+        color: primaryColor
+      }]
+    }, title));
+  };
+  function renderActionButton() {
+    if (updateInfo !== null && updateInfo !== void 0 && updateInfo.upToDate) return /*#__PURE__*/_react.default.createElement(PrimaryBtn, {
+      title: locale.btnGotIt,
+      onPress: hideUpdateModal
+    });
+    if (updateInfo !== null && updateInfo !== void 0 && updateInfo.update) return [!isForceUpdate && /*#__PURE__*/_react.default.createElement(GhostBtn, {
+      key: "plus",
+      title: locale.btnUpdateLater,
+      onPress: hideUpdateModal,
+      style: {
+        marginRight: 15
+      }
+    }), /*#__PURE__*/_react.default.createElement(PrimaryBtn, {
+      key: "submit",
+      title: locale.btnUpdateNow,
+      onPress: startDownloadFlow
+    })];
+    if (updateInfo !== null && updateInfo !== void 0 && updateInfo.expired) return [!isForceUpdate && /*#__PURE__*/_react.default.createElement(GhostBtn, {
+      key: "unable",
+      title: locale.btnUpdateLater,
+      onPress: hideUpdateModal,
+      style: {
+        marginRight: 10
+      }
+    }), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
+      key: "store",
+      style: [Style.button, isAndroid ? [Style.ghostButton, {
+        borderColor: primaryColor
+      }] : {
+        backgroundColor: primaryColor
+      }],
+      onPress: appStoreUpdate
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+      style: isAndroid ? [Style.ghostText, {
+        color: primaryColor
+      }] : Style.primaryText
+    }, locale.btnAppStore)), isAndroid && /*#__PURE__*/_react.default.createElement(PrimaryBtn, {
+      key: "install",
+      title: locale.btnDownload,
+      onPress: openH5ApkDownloadPage,
+      style: {
+        marginLeft: 10
+      }
+    })];
+  }
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: Style.container
+  }, renderActionButton());
+}
+var Style = _reactNative.StyleSheet.create({
+  container: {
+    marginHorizontal: 15,
+    flexDirection: 'row',
+    marginTop: 20
+  },
+  button: {
+    flex: 1,
+    height: 40,
+    borderRadius: 4,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  ghostButton: {
+    backgroundColor: 'transparent',
+    borderWidth: 1
+  },
+  primaryText: {
+    color: '#fff',
+    fontSize: 14
+  },
+  ghostText: {
+    fontSize: 14
+  }
+});

package/lib/widget/title.widget.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @description 更新标题原子组件
+ * @returns 标题展示原子组件
+ */
+export default function TitleWidget(): any;

package/lib/widget/title.widget.js

@@ -0,0 +1,35 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = TitleWidget;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _updateProvider = require("../updateProvider");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/**
+ * @description 更新标题原子组件
+ * @returns 标题展示原子组件
+ */
+function TitleWidget() {
+  var config = (0, _react.useContext)(_updateProvider.HotUpdateContext);
+  var locale = config.localeText;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: Style.container
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: Style.title
+  }, locale.updateTitle));
+}
+var Style = _reactNative.StyleSheet.create({
+  container: {
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  title: {
+    fontSize: 18,
+    fontWeight: 'bold'
+  }
+});

package/lib/widget/update.modal.widget.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @description 更新弹窗组件
+ * @returns 更新弹窗组件
+ */
+export default function UpdateModalWidget(): any;

package/lib/widget/update.modal.widget.js

@@ -0,0 +1,59 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = UpdateModalWidget;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeUpdate = require("react-native-update");
+var _title = _interopRequireDefault(require("./title.widget"));
+var _description = _interopRequireDefault(require("./description.widget"));
+var _content = _interopRequireDefault(require("./content.widget"));
+var _footer = _interopRequireDefault(require("./footer.widget"));
+var _updateProvider = require("../updateProvider");
+var _updateState = require("../updateState");
+var _animated = _interopRequireDefault(require("./animated.overlay"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/**
+ * @description 更新弹窗组件
+ * @returns 更新弹窗组件
+ */
+function UpdateModalWidget() {
+  var config = (0, _react.useContext)(_updateProvider.HotUpdateContext);
+  var _useUpdate = (0, _reactNativeUpdate.useUpdate)(),
+    updateInfo = _useUpdate.updateInfo;
+  var _useUpdateState = (0, _updateState.useUpdateState)(),
+    isUpdateVisible = _useUpdateState.isUpdateVisible,
+    hideUpdateModal = _useUpdateState.hideUpdateModal,
+    startDownloadFlow = _useUpdateState.startDownloadFlow;
+  var content = null;
+  if (config.renderUpdateModal) {
+    content = config.renderUpdateModal(updateInfo, {
+      hideModal: hideUpdateModal,
+      doUpdate: startDownloadFlow
+    });
+  } else {
+    content = /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+      style: Style.content
+    }, /*#__PURE__*/_react.default.createElement(_title.default, null), /*#__PURE__*/_react.default.createElement(_description.default, null), /*#__PURE__*/_react.default.createElement(_content.default, null), /*#__PURE__*/_react.default.createElement(_footer.default, null));
+  }
+  return /*#__PURE__*/_react.default.createElement(_animated.default, {
+    visible: isUpdateVisible,
+    onAnimationComplete: function onAnimationComplete() {}
+  }, content);
+}
+var Style = _reactNative.StyleSheet.create({
+  content: {
+    backgroundColor: 'white',
+    marginHorizontal: 20,
+    borderRadius: 8,
+    paddingVertical: 20,
+    flexDirection: 'column',
+    width: '90%',
+    maxWidth: 400
+  }
+});

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "@zero-bits/react-native-hot-update",
+  "version": "1.0.0",
+  "description": "react-native热更新展示组件",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "module": "es/index.js",
+  "keywords": [
+    "react-native",
+    "hot-update",
+    "pushy",
+    "react-native-update"
+  ],
+  "files": [
+    "lib",
+    "es"
+  ],
+  "author": "641261604@qq.com",
+  "license": "ISC",
+  "peerDependencies": {
+    "react": ">=16.13.1",
+    "react-native": ">=0.63.4",
+    "react-native-market-linking": ">=0.0.8",
+    "react-native-update": ">=10.34.0"
+  }
+}