vue-no-ssr - npm Package Compare versions

Comparing version 0.2.2 to 1.0.0

dist/vue-no-ssr.common.js

 /*!
- * vue-no-ssr v0.2.2
- * (c) 2017-present egoist <[e-mail]>
+ * vue-no-ssr v1.0.0
+ * (c) 2018-present egoist <[e-mail]>
  * Released under the MIT License.
@@ -10,28 +10,33 @@ */
   name: 'no-ssr',
-  props: ['placeholder'],
-  data: function data() {
-    return {
-      canRender: false
+  functional: true,
+  props: {
+    placeholder: String,
+    placeholderTag: {
+      type: String,
+      default: 'div'
     }
   },
-  mounted: function mounted() {
-    this.canRender = true;
-  },
-  render: function render(h) {
-    if (this.canRender) {
-      if (
-        process.env.NODE_ENV === 'development' &&
-        this.$slots.default &&
-        this.$slots.default.length > 1
-      ) {
-        throw new Error('[vue-no-ssr] You cannot use multiple child components')
-      }
-      return this.$slots.default && this.$slots.default[0]
+  render: function render(h, ref) {
+    var parent = ref.parent;
+    var slots = ref.slots;
+    var props = ref.props;
+
+    var ref$1 = slots();
+    var defaultSlot = ref$1.default;
+    var placeholderSlot = ref$1.placeholder;
+
+    if (parent._isMounted) {
+      return defaultSlot
     }
+
+    parent.$once('hook:mounted', function () {
+      parent.$forceUpdate();
+    });
+
     return h(
-      'div',
+      props.placeholderTag,
       {
         class: ['no-ssr-placeholder']
       },
-      this.$slots.placeholder || this.placeholder
+      props.placeholder || placeholderSlot
     )
@@ -38,0 +43,0 @@ }

dist/vue-no-ssr.js

 /*!
- * vue-no-ssr v0.2.2
- * (c) 2017-present egoist <[e-mail]>
+ * vue-no-ssr v1.0.0
+ * (c) 2018-present egoist <[e-mail]>
  * Released under the MIT License.
@@ -14,28 +14,33 @@ */
   name: 'no-ssr',
-  props: ['placeholder'],
-  data: function data() {
-    return {
-      canRender: false
+  functional: true,
+  props: {
+    placeholder: String,
+    placeholderTag: {
+      type: String,
+      default: 'div'
     }
   },
-  mounted: function mounted() {
-    this.canRender = true;
-  },
-  render: function render(h) {
-    if (this.canRender) {
-      if (
-        "production" === 'development' &&
-        this.$slots.default &&
-        this.$slots.default.length > 1
-      ) {
-        throw new Error('[vue-no-ssr] You cannot use multiple child components')
-      }
-      return this.$slots.default && this.$slots.default[0]
+  render: function render(h, ref) {
+    var parent = ref.parent;
+    var slots = ref.slots;
+    var props = ref.props;
+
+    var ref$1 = slots();
+    var defaultSlot = ref$1.default;
+    var placeholderSlot = ref$1.placeholder;
+
+    if (parent._isMounted) {
+      return defaultSlot
     }
+
+    parent.$once('hook:mounted', function () {
+      parent.$forceUpdate();
+    });
+
     return h(
-      'div',
+      props.placeholderTag,
       {
         class: ['no-ssr-placeholder']
       },
-      this.$slots.placeholder || this.placeholder
+      props.placeholder || placeholderSlot
     )
@@ -42,0 +47,0 @@ }

dist/vue-no-ssr.min.js

 /*!
- * vue-no-ssr v0.2.2
- * (c) 2017-present egoist <[e-mail]>
+ * vue-no-ssr v1.0.0
+ * (c) 2018-present egoist <[e-mail]>
  * Released under the MIT License.
  */
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.NoSSR=n()}(this,function(){"use strict";return{name:"no-ssr",props:["placeholder"],data:function(){return{canRender:!1}},mounted:function(){this.canRender=!0},render:function(e){return this.canRender?this.$slots.default&&this.$slots.default[0]:e("div",{class:["no-ssr-placeholder"]},this.$slots.placeholder||this.placeholder)}}});
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o():"function"==typeof define&&define.amd?define(o):e.NoSSR=o()}(this,function(){"use strict";return{name:"no-ssr",functional:!0,props:{placeholder:String,placeholderTag:{type:String,default:"div"}},render:function(e,o){var n=o.parent,t=o.slots,r=o.props,d=t(),l=d.default,p=d.placeholder;return n._isMounted?l:(n.$once("hook:mounted",function(){n.$forceUpdate()}),e(r.placeholderTag,{class:["no-ssr-placeholder"]},r.placeholder||p))}}});
 //# sourceMappingURL=vue-no-ssr.min.js.map

package.json

 {
   "name": "vue-no-ssr",
-  "version": "0.2.2",
+  "version": "1.0.0",
   "description": "Vue component to wrap non SSR friendly components",
@@ -5,0 +5,0 @@ "repository": {

README.md

@@ -35,4 +35,2 @@ # vue-no-ssr
 
-Note that `<no-ssr />` can only contain at most **ONE** child component/element.
-
 ### Placeholder
@@ -71,2 +69,18 @@
 
+By default the placeholder will be wrapped in a `div` tag, however you can use `placeholderTag` prop to customize it:
+
+```vue
+<no-ssr placeholder="loading" placeholader-tag="span">
+  <comments />
+</no-ssr>
+```
+
+And you get:
+
+```html
+<span class="no-ssr-placeholder">
+  loading
+</span>
+```
+
 ## Development
@@ -73,0 +87,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

7161

increased by3.83%

Lines of code

92

increased by3.37%

Number of low quality alerts

2

decreased by-33.33%

Number of lines in readme file

108

increased by14.89%

No dependency changes