@cicada/render - npm Package Compare versions

Comparing version 1.1.1 to 1.1.2

lib/__test__/integration/visible.test.js

@@ -148,4 +148,3 @@ 'use strict';
         bind: 'demo',
-        type: 'Demo',
-        visible: true
+        type: 'Demo'
       }
@@ -161,2 +160,15 @@ }));
 
+  test('set visible false in register', function () {
+    var container = (0, _enzyme.mount)(_react2.default.createElement(_Render2.default, {
+      stateTree: stateTree,
+      appearance: appearance,
+      components: { Demo: (0, _connect2.default)(DemoComponent, 'Demo') },
+      config: {
+        bind: 'demo',
+        type: 'Demo',
+        visible: false
+      }
+    }));
+    expect(container.html()).toEqual('<div class="' + DISPLAY_NONE + '"></div>');
+  });
   test('basic set and reset', function () {
@@ -186,3 +198,2 @@ var _checkComponentDispla = checkComponentDisplay({ render: function render() {
   });
-
   // 嵌套多层
@@ -194,7 +205,14 @@ test('nestedInner set', function () {
   });
-  /*  test.skip('stateless set', () => {
-      const Stateless = () => <div>stateless</div>
-      // Stateless function components cannot support visible appearance.
-      checkComponentDisplay({ render: () => <Stateless /> }, '<div>stateless</div>')
-    }) */
+  test('stateless set', function () {
+    var Stateless = function Stateless() {
+      return _react2.default.createElement(
+        'div',
+        null,
+        'stateless'
+      );
+    };
+    checkComponentDisplay({ render: function render() {
+        return _react2.default.createElement(Stateless, null);
+      } }, '<div class="' + DISPLAY_NONE + '">stateless</div>');
+  });
 });
@@ -201,0 +219,0 @@

lib/createAppearance.js

@@ -12,2 +12,22 @@ 'use strict';
 
+var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
+
+var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
+
+var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
+
+var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
+
+var _createClass2 = require('babel-runtime/helpers/createClass');
+
+var _createClass3 = _interopRequireDefault(_createClass2);
+
+var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
+
+var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
+
+var _inherits2 = require('babel-runtime/helpers/inherits');
+
+var _inherits3 = _interopRequireDefault(_inherits2);
+
 exports.default = createAppearance;
@@ -37,3 +57,21 @@
 
+var RefProxy = function (_React$Component) {
+  (0, _inherits3.default)(RefProxy, _React$Component);
+
+  function RefProxy() {
+    (0, _classCallCheck3.default)(this, RefProxy);
+    return (0, _possibleConstructorReturn3.default)(this, (RefProxy.__proto__ || (0, _getPrototypeOf2.default)(RefProxy)).apply(this, arguments));
+  }
+
+  (0, _createClass3.default)(RefProxy, [{
+    key: 'render',
+    value: function render() {
+      return this.props.children;
+    }
+  }]);
+  return RefProxy;
+}(_react2.default.Component);
 /* eslint-disable no-use-before-define */
+
+
 function createAppearance(stateTree) {
@@ -90,2 +128,12 @@ var externalProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
+  function updateRefById(id, ref) {
+    ref = _reactDom2.default.findDOMNode(ref);
+    if (!ref || !ref.classList) {
+      delete refCache[id];
+      return;
+    }
+    refCache[id] = ref;
+    updateAppearanceRef(id);
+  }
+
   function hijack(id, render, display) {
@@ -105,24 +153,7 @@ var props = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
 
-      var comp = render(componentArg);
-      // maybe null
-      if (!comp) {
-        delete refCache[id];
-        return comp;
-      }
-      if ((0, _util.isStatelessComponent)(comp)) {
-        console.error('Stateless function components cannot support visible appearance.');
-        delete refCache[id];
-        return comp;
-      }
-      return _react2.default.cloneElement(comp, (0, _extends3.default)({}, comp.props, {
-        ref: function ref(_ref) {
-          _ref = _reactDom2.default.findDOMNode(_ref);
-          if (!_ref || !_ref.classList) {
-            delete refCache[id];
-            return;
-          }
-          refCache[id] = _ref;
-          updateAppearanceRef(id);
-        }
-      }));
+      return _react2.default.createElement(
+        RefProxy,
+        { ref: (0, _util.partial)(updateRefById, id) },
+        render(componentArg)
+      );
     };
@@ -153,8 +184,10 @@ }
   return {
-    register: function register(id, _ref2, fn) {
-      var componentPath = _ref2.path;
+    register: function register(id, _ref, fn) {
+      var componentPath = _ref.path,
+          _ref$visible = _ref.visible,
+          visible = _ref$visible === undefined ? true : _ref$visible;
 
       var unsubscribe = (0, _util.concat)([subscribeById(id, fn), subscribeById(id, (0, _util.partial)(updateAppearanceRef, id))]);
       var componentPathKey = componentPath !== undefined ? componentPath.join('.') : undefined;
-      appearance[id] = { visible: true, styleList: [], componentPath: componentPath
+      appearance[id] = { visible: visible, styleList: [], componentPath: componentPath
         // CAUTION 在与 react-router 这样的库结合使用时，由于会动态创建组件，
@@ -161,0 +194,0 @@ // 所以  Render 无法给组件打上 path, 要兼容这种情况。

package.json

 {
   "name": "@cicada/render",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "main": "./lib/index.js",
@@ -5,0 +5,0 @@ "scripts": {

No alert changes

Improved metrics

Total package byte prevSize

337921

increased by0.47%

Lines of code

8133

increased by0.46%

No dependency changes