vue-frag
Version:
Vue 2 fragment directive to return multiple root elements
2 lines (1 loc) • 3.04 kB
JavaScript
"use strict";var e,r=Symbol(),t=Symbol(),n=Symbol(),i=Symbol(),o=function(e){return"frag"in e},a={get:function(){return this[t]||this.parentElement},configurable:!0},f=function(e,r){t in e||(e[t]=r,Object.defineProperty(e,"parentNode",a))},s={get:function(){var e=this.parentNode.childNodes,r=e.indexOf(this);return r>-1&&e[r+1]||null}},c=function(e){n in e||(e[n]=!0,Object.defineProperty(e,"nextSibling",s))},u=function(r){if(!e){var t=Object.getOwnPropertyDescriptor(Node.prototype,"childNodes");e=t.get}var n=e.apply(r),i=Array.from(n).map((function(e){return function(e,r){for(;e.parentNode!==r;){var t=e.parentNode;t&&(e=t)}return e}(e,r)}));return i.filter((function(e,r){return e!==i[r-1]}))},h={get:function(){return this.frag||u(this)}},l={get:function(){return this.childNodes[0]||null}};function p(){return this.childNodes.length>0}var d=function(e){i in e||(e[i]=!0,Object.defineProperties(e,{childNodes:h,firstChild:l}),e.hasChildNodes=p)};function g(){var e;(e=this.frag[0]).before.apply(e,arguments)}function v(){var e=this.frag;e.splice(0,e.length).forEach((function(e){e.remove()}))}var m=function e(r){var t;return(t=Array.prototype).concat.apply(t,r.map((function(r){return o(r)?e(r.frag):r})))};function y(e){if(o(this)){var t=this.frag.indexOf(e);if(t>-1){var n=this.frag.splice(t,1)[0];0===this.frag.length&&function(e,t){var n=e[r];t.before(n),f(n,e),e.frag.unshift(n)}(this,n),e.remove()}}else{u(this).indexOf(e)>-1&&e.remove()}return e}function b(e,r){var n=this,i=e.frag||[e];if(o(this)){if(e[t]===this&&e.parentElement)return e;var a=this.frag;if(r){var s=a.indexOf(r);s>-1&&(a.splice.apply(a,[s,0].concat(i)),r.before.apply(r,i))}else{var u=a[a.length-1];a.push.apply(a,i),u.after.apply(u,i)}O(this)}else r?this.childNodes.includes(r)&&r.before.apply(r,i):this.append.apply(this,i);i.forEach((function(e){f(e,n)}));var h=i[i.length-1];return c(h),e}function N(e){if(e[t]===this&&e.parentElement)return e;var r=this.frag;return r[r.length-1].after(e),f(e,this),O(this),r.push(e),e}var O=function(e){var t=e[r];e.frag[0]===t&&(e.frag.shift(),t.remove())},E={set:function(e){var t=this;if(this.frag[0]!==this[r]&&this.frag.slice().forEach((function(e){return t.removeChild(e)})),e){var n=document.createElement("div");n.innerHTML=e,Array.from(n.childNodes).forEach((function(e){t.appendChild(e)}))}},get:function(){return""}},C={inserted:function(e){var t=e.parentNode,n=e.nextSibling,i=e.previousSibling,o=Array.from(e.childNodes),a=document.createComment("");0===o.length&&o.push(a),e.frag=o,e[r]=a;var s=document.createDocumentFragment();s.append.apply(s,m(o)),e.replaceWith(s),o.forEach((function(r){f(r,e),c(r)})),d(e),Object.assign(e,{remove:v,appendChild:N,insertBefore:b,removeChild:y,before:g}),Object.defineProperty(e,"innerHTML",E),t&&(Object.assign(t,{removeChild:y,insertBefore:b}),f(e,t),d(t)),n&&c(e),i&&c(i)},unbind:function(e){e.remove()}},j={name:"Fragment",directives:{frag:C},render:function(e){return e("div",{directives:[{name:"frag"}]},this.$slots.default)}};C.Fragment=j,module.exports=C;