vue-scrolling-table - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

dist/vue-scrolling-table.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("vue-scrolling-table",[],t):"object"==typeof exports?exports["vue-scrolling-table"]=t():e["vue-scrolling-table"]=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={name:"VueScrollingTable",props:{deadAreaColor:{type:String,required:!1,default:"#CCC"}},computed:{tableStyle:function(){return"background-color: "+this.deadAreaColor+";"},headStyle:function(){return"background-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-base-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-face-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-highlight-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-track-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-arrow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-shadow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-darkshadow-color: "+this.deadAreaColor+";"}},watch:{deadAreaColor:function(){this.setColors()}},mounted:function(){this.setColors()},methods:{syncTHeadScroll:function(){this.$refs.thead.scrollLeft=this.$refs.tbody.scrollLeft},setColors:function(){this.$refs.table.style.setProperty("--dead-area-color",this.deadAreaColor)}}}},function(e,t,n){"use strict";function o(e){s||n(2)}Object.defineProperty(t,"__esModule",{value:!0});var r=n(0),a=n.n(r);for(var l in r)"default"!==l&&function(e){n.d(t,e,function(){return r[e]})}(l);var i=n(8),s=!1,c=n(7),d=o,u=c(a.a,i.a,!1,d,null,null);u.options.__file="src/VueScrollingTable.vue",t.default=u.exports},function(e,t,n){var o=n(3);"string"==typeof o&&(o=[[e.i,o,""]]),o.locals&&(e.exports=o.locals);n(5)("508563c8",o,!1)},function(e,t,n){t=e.exports=n(4)(void 0),t.push([e.i,'\ntable.scrolling {\n\tdisplay: -webkit-box;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n\t-webkit-box-orient: vertical;\n\t-webkit-box-direction: normal;\n\t    -ms-flex-direction: column;\n\t        flex-direction: column;\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 1 auto;\n\t        flex: 1 1 auto;\n\twidth: 100%;\n\theight: 100%;\n\tborder-collapse: collapse;\n\toverflow: hidden;\n\t/* Use this to create a "dead" area color if table is too wide for cells */\n\tbackground-color: #ccc;\n\t--dead-area-color: #ccc;\n}\ntable.scrolling thead {\n\t/* Grow thead automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\t/* x-scrolling will be managed via JS */\n\toverflow-x: hidden;\n\t/* Keep header columns aligned with useless scrollbar. For IE11, use "dead area" color to hide scrollbar functions */\n\toverflow-y: scroll;\n}\n\n/*\nFor Webkit, use "dead area" color to hide scrollbar functions.\nSince WebKit supports CSS variables and style attributes don\'t support pseudo-classes, use variables.\nDisplay is set because otherwise Chrome ignores the other styling.\nTODO: on Chrome/Safari for Mac, scrollbars are not shown anyway and this creates an extra block. No impact on iOS Safari.\n*/\ntable.scrolling thead::-webkit-scrollbar {\n\tdisplay: block;\n\tbackground-color: var(--dead-area-color);\n}\ntable.scrolling thead::-webkit-scrollbar-track {\n\tbackground-color: var(--dead-area-color);\n}\n\n/* Scroll the actual tbody (second child on all browsers) */\ntable.scrolling tbody {\n\tdisplay: block;\n\toverflow: scroll;\n}\n\n/* IE11 adds an extra tbody, have to hide it */\ntable.scrolling tbody:nth-child(3) {\n\tdisplay: none;\n}\n\n/* The one caveat to scrolling this way: a hard-set width is required. Can override in thead/tbody slot. */\ntable.scrolling td,\ntable.scrolling th {\n\twidth: 10em;\n\tmin-width: 10em;\n\tborder: 1px solid #ddd;\n}\ntable.scrolling td {\n\tbackground-color: #fff;\n}\ntable.scrolling th {\n\tbackground-color: #f7f7f7;\n}\ntable.scrolling tfoot {\n\t/* Grow tfoot automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\toverflow: hidden;\n}\n',""])},function(e,t){function n(e,t){var n=e[1]||"",r=e[3];if(!r)return n;if(t&&"function"==typeof btoa){var a=o(r);return[n].concat(r.sources.map(function(e){return"/*# sourceURL="+r.sourceRoot+e+" */"})).concat([a]).join("\n")}return[n].join("\n")}function o(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var o=n(t,e);return t[2]?"@media "+t[2]+"{"+o+"}":o}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var o={},r=0;r<this.length;r++){var a=this[r][0];"number"==typeof a&&(o[a]=!0)}for(r=0;r<e.length;r++){var l=e[r];"number"==typeof l[0]&&o[l[0]]||(n&&!l[2]?l[2]=n:n&&(l[2]="("+l[2]+") and ("+n+")"),t.push(l))}},t}},function(e,t,n){function o(e){for(var t=0;t<e.length;t++){var n=e[t],o=d[n.id];if(o){o.refs++;for(var r=0;r<o.parts.length;r++)o.parts[r](n.parts[r]);for(;r<n.parts.length;r++)o.parts.push(a(n.parts[r]));o.parts.length>n.parts.length&&(o.parts.length=n.parts.length)}else{for(var l=[],r=0;r<n.parts.length;r++)l.push(a(n.parts[r]));d[n.id]={id:n.id,refs:1,parts:l}}}}function r(){var e=document.createElement("style");return e.type="text/css",u.appendChild(e),e}function a(e){var t,n,o=document.querySelector('style[data-vue-ssr-id~="'+e.id+'"]');if(o){if(h)return b;o.parentNode.removeChild(o)}if(v){var a=p++;o=f||(f=r()),t=l.bind(null,o,a,!1),n=l.bind(null,o,a,!0)}else o=r(),t=i.bind(null,o),n=function(){o.parentNode.removeChild(o)};return t(e),function(o){if(o){if(o.css===e.css&&o.media===e.media&&o.sourceMap===e.sourceMap)return;t(e=o)}else n()}}function l(e,t,n,o){var r=n?"":o.css;if(e.styleSheet)e.styleSheet.cssText=y(t,r);else{var a=document.createTextNode(r),l=e.childNodes;l[t]&&e.removeChild(l[t]),l.length?e.insertBefore(a,l[t]):e.appendChild(a)}}function i(e,t){var n=t.css,o=t.media,r=t.sourceMap;if(o&&e.setAttribute("media",o),r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}var s="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!s)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=n(6),d={},u=s&&(document.head||document.getElementsByTagName("head")[0]),f=null,p=0,h=!1,b=function(){},v="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,n){h=n;var r=c(e,t);return o(r),function(t){for(var n=[],a=0;a<r.length;a++){var l=r[a],i=d[l.id];i.refs--,n.push(i)}t?(r=c(e,t),o(r)):r=[];for(var a=0;a<n.length;a++){var i=n[a];if(0===i.refs){for(var s=0;s<i.parts.length;s++)i.parts[s]();delete d[i.id]}}}};var y=function(){var e=[];return function(t,n){return e[t]=n,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=function(e,t){for(var n=[],o={},r=0;r<t.length;r++){var a=t[r],l=a[0],i=a[1],s=a[2],c=a[3],d={id:e+":"+r,css:i,media:s,sourceMap:c};o[l]?o[l].parts.push(d):n.push(o[l]={id:l,parts:[d]})}return n}},function(e,t){e.exports=function(e,t,n,o,r,a){var l,i=e=e||{},s=typeof e.default;"object"!==s&&"function"!==s||(l=e,i=e.default);var c="function"==typeof i?i.options:i;t&&(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0),n&&(c.functional=!0),r&&(c._scopeId=r);var d;if(a?(d=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),o&&o.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(a)},c._ssrRegister=d):o&&(d=o),d){var u=c.functional,f=u?c.render:c.beforeCreate;u?(c._injectStyles=d,c.render=function(e,t){return d.call(t),f(e,t)}):c.beforeCreate=f?[].concat(f,d):[d]}return{esModule:l,exports:i,options:c}}},function(e,t,n){"use strict";var o=function(){var e=this,t=e.$createElement;return(e._self._c||t)("table",{ref:"table",staticClass:"scrolling",style:e.tableStyle},[e._t("thead"),e._v(" "),e._t("tbody"),e._v(" "),e._t("tfoot")],2)},r=[];o._withStripped=!0;var a={render:o,staticRenderFns:r};t.a=a}])});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("vue-scrolling-table",[],t):"object"==typeof exports?exports["vue-scrolling-table"]=t():e["vue-scrolling-table"]=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(n){if(o[n])return o[n].exports;var r=o[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var o={};return t.m=e,t.c=o,t.d=function(e,o,n){t.o(e,o)||Object.defineProperty(e,o,{configurable:!1,enumerable:!0,get:n})},t.n=function(e){var o=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(o,"a",o),o},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=1)}([function(e,t,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={name:"VueScrollingTable",props:{deadAreaColor:{type:String,required:!1,default:"#CCC"},includeFooter:{type:Boolean,required:!1,default:!1}},computed:{tableStyle:function(){return"background-color: "+this.deadAreaColor+";"},headStyle:function(){return"background-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-base-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-face-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-highlight-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-track-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-arrow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-shadow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-darkshadow-color: "+this.deadAreaColor+";"}},watch:{deadAreaColor:function(){this.setColors()}},mounted:function(){this.setColors(),this.syncTHeadScroll()},methods:{syncTHeadScroll:function(){var e=this.$refs.thead,t=this.$refs.tbody.scrollLeft;e.scrollLeft!==t&&(e.scrollLeft=t)},setColors:function(){this.$refs.table.style.setProperty("--dead-area-color",this.deadAreaColor)}}}},function(e,t,o){"use strict";function n(e){s||o(2)}Object.defineProperty(t,"__esModule",{value:!0});var r=o(0),a=o.n(r);for(var l in r)"default"!==l&&function(e){o.d(t,e,function(){return r[e]})}(l);var i=o(8),s=!1,c=o(7),d=n,u=c(a.a,i.a,!1,d,null,null);u.options.__file="src/VueScrollingTable.vue",t.default=u.exports},function(e,t,o){var n=o(3);"string"==typeof n&&(n=[[e.i,n,""]]),n.locals&&(e.exports=n.locals);o(5)("508563c8",n,!1)},function(e,t,o){t=e.exports=o(4)(void 0),t.push([e.i,'\ntable.scrolling {\n\tdisplay: -webkit-box;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n\t-webkit-box-orient: vertical;\n\t-webkit-box-direction: normal;\n\t    -ms-flex-direction: column;\n\t        flex-direction: column;\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 1 auto;\n\t        flex: 1 1 auto;\n\twidth: 100%;\n\theight: 100%;\n\tborder-collapse: collapse;\n\toverflow: hidden;\n\t/* Use this to create a "dead" area color if table is too wide for cells */\n\tbackground-color: #ccc;\n\t--dead-area-color: #ccc;\n}\ntable.scrolling thead {\n\t/* Grow thead automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\t/* x-scrolling will be managed via JS */\n\toverflow-x: hidden;\n\t/* Keep header columns aligned with useless scrollbar. For IE11, use "dead area" color to hide scrollbar functions */\n\toverflow-y: scroll;\n}\n\n/*\nFor Webkit, use "dead area" color to hide scrollbar functions.\nSince WebKit supports CSS variables and style attributes don\'t support pseudo-classes, use variables.\nDisplay is set because otherwise Chrome ignores the other styling.\nTODO: on Chrome/Safari for Mac, scrollbars are not shown anyway and this creates an extra block. No impact on iOS Safari.\n*/\ntable.scrolling thead::-webkit-scrollbar {\n\tdisplay: block;\n\tbackground-color: var(--dead-area-color);\n}\ntable.scrolling thead::-webkit-scrollbar-track {\n\tbackground-color: var(--dead-area-color);\n}\n\n/* Scroll the actual tbody (second child on all browsers) */\ntable.scrolling tbody {\n\tdisplay: block;\n\toverflow: scroll;\n}\n\n/* IE11 adds an extra tbody, have to hide it */\ntable.scrolling tbody:nth-child(3) {\n\tdisplay: none;\n}\n\n/* The one caveat to scrolling this way: a hard-set width is required. Can override in thead/tbody slot. */\ntable.scrolling td,\ntable.scrolling th {\n\tborder: 1px solid #ddd;\n\n\t/* These must all be set the same in your overriding CSS */\n\twidth: 10em;\n\tmin-width: 10em;\n\tmax-width: 10em;\n\n\t/* Important in case your data is too long for your cell */\n\toverflow: hidden;\n\tword-wrap: break-word;\n}\ntable.scrolling td {\n\tbackground-color: #fff;\n}\ntable.scrolling th {\n\tbackground-color: #f7f7f7;\n}\ntable.scrolling tfoot {\n\t/* Grow tfoot automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\toverflow: hidden;\n}\n',""])},function(e,t){function o(e,t){var o=e[1]||"",r=e[3];if(!r)return o;if(t&&"function"==typeof btoa){var a=n(r);return[o].concat(r.sources.map(function(e){return"/*# sourceURL="+r.sourceRoot+e+" */"})).concat([a]).join("\n")}return[o].join("\n")}function n(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var n=o(t,e);return t[2]?"@media "+t[2]+"{"+n+"}":n}).join("")},t.i=function(e,o){"string"==typeof e&&(e=[[null,e,""]]);for(var n={},r=0;r<this.length;r++){var a=this[r][0];"number"==typeof a&&(n[a]=!0)}for(r=0;r<e.length;r++){var l=e[r];"number"==typeof l[0]&&n[l[0]]||(o&&!l[2]?l[2]=o:o&&(l[2]="("+l[2]+") and ("+o+")"),t.push(l))}},t}},function(e,t,o){function n(e){for(var t=0;t<e.length;t++){var o=e[t],n=d[o.id];if(n){n.refs++;for(var r=0;r<n.parts.length;r++)n.parts[r](o.parts[r]);for(;r<o.parts.length;r++)n.parts.push(a(o.parts[r]));n.parts.length>o.parts.length&&(n.parts.length=o.parts.length)}else{for(var l=[],r=0;r<o.parts.length;r++)l.push(a(o.parts[r]));d[o.id]={id:o.id,refs:1,parts:l}}}}function r(){var e=document.createElement("style");return e.type="text/css",u.appendChild(e),e}function a(e){var t,o,n=document.querySelector('style[data-vue-ssr-id~="'+e.id+'"]');if(n){if(h)return b;n.parentNode.removeChild(n)}if(v){var a=p++;n=f||(f=r()),t=l.bind(null,n,a,!1),o=l.bind(null,n,a,!0)}else n=r(),t=i.bind(null,n),o=function(){n.parentNode.removeChild(n)};return t(e),function(n){if(n){if(n.css===e.css&&n.media===e.media&&n.sourceMap===e.sourceMap)return;t(e=n)}else o()}}function l(e,t,o,n){var r=o?"":n.css;if(e.styleSheet)e.styleSheet.cssText=y(t,r);else{var a=document.createTextNode(r),l=e.childNodes;l[t]&&e.removeChild(l[t]),l.length?e.insertBefore(a,l[t]):e.appendChild(a)}}function i(e,t){var o=t.css,n=t.media,r=t.sourceMap;if(n&&e.setAttribute("media",n),r&&(o+="\n/*# sourceURL="+r.sources[0]+" */",o+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),e.styleSheet)e.styleSheet.cssText=o;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(o))}}var s="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!s)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=o(6),d={},u=s&&(document.head||document.getElementsByTagName("head")[0]),f=null,p=0,h=!1,b=function(){},v="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,o){h=o;var r=c(e,t);return n(r),function(t){for(var o=[],a=0;a<r.length;a++){var l=r[a],i=d[l.id];i.refs--,o.push(i)}t?(r=c(e,t),n(r)):r=[];for(var a=0;a<o.length;a++){var i=o[a];if(0===i.refs){for(var s=0;s<i.parts.length;s++)i.parts[s]();delete d[i.id]}}}};var y=function(){var e=[];return function(t,o){return e[t]=o,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=function(e,t){for(var o=[],n={},r=0;r<t.length;r++){var a=t[r],l=a[0],i=a[1],s=a[2],c=a[3],d={id:e+":"+r,css:i,media:s,sourceMap:c};n[l]?n[l].parts.push(d):o.push(n[l]={id:l,parts:[d]})}return o}},function(e,t){e.exports=function(e,t,o,n,r,a){var l,i=e=e||{},s=typeof e.default;"object"!==s&&"function"!==s||(l=e,i=e.default);var c="function"==typeof i?i.options:i;t&&(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0),o&&(c.functional=!0),r&&(c._scopeId=r);var d;if(a?(d=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(a)},c._ssrRegister=d):n&&(d=n),d){var u=c.functional,f=u?c.render:c.beforeCreate;u?(c._injectStyles=d,c.render=function(e,t){return d.call(t),f(e,t)}):c.beforeCreate=f?[].concat(f,d):[d]}return{esModule:l,exports:i,options:c}}},function(e,t,o){"use strict";var n=function(){var e=this,t=e.$createElement,o=e._self._c||t;return o("table",{ref:"table",staticClass:"scrolling",style:e.tableStyle},[o("thead",{ref:"thead",style:e.headStyle,attrs:{name:"thead"}},[e._t("thead")],2),e._v(" "),o("tbody",{ref:"tbody",attrs:{name:"tbody"},on:{scroll:e.syncTHeadScroll}},[e._t("tbody")],2),e._v(" "),e.includeFooter?o("tfoot",{attrs:{name:"tfoot"}},[e._t("tfoot")],2):e._e()])},r=[];n._withStripped=!0;var a={render:n,staticRenderFns:r};t.a=a}])});

dist/vue-scrolling-table.min.js

@@ -1,1 +0,1 @@
-window.VueScrollingTable=function(t){function e(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:o})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=1)}([function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={name:"VueScrollingTable",props:{deadAreaColor:{type:String,required:!1,default:"#CCC"}},computed:{tableStyle:function(){return"background-color: "+this.deadAreaColor+";"},headStyle:function(){return"background-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-base-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-face-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-highlight-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-track-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-arrow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-shadow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-darkshadow-color: "+this.deadAreaColor+";"}},watch:{deadAreaColor:function(){this.setColors()}},mounted:function(){this.setColors()},methods:{syncTHeadScroll:function(){this.$refs.thead.scrollLeft=this.$refs.tbody.scrollLeft},setColors:function(){this.$refs.table.style.setProperty("--dead-area-color",this.deadAreaColor)}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(2);e.default={install:function(t){t.component("vue-scrolling-table",o.default)}}},function(t,e,n){"use strict";function o(t){i||n(3)}var r=n(0),a=n.n(r),l=n(9),i=!1,s=n(8),c=o,d=s(a.a,l.a,!1,c,null,null);d.options.__file="src/VueScrollingTable.vue",e.default=d.exports},function(t,e,n){var o=n(4);"string"==typeof o&&(o=[[t.i,o,""]]),o.locals&&(t.exports=o.locals);n(6)("508563c8",o,!1)},function(t,e,n){e=t.exports=n(5)(void 0),e.push([t.i,'\ntable.scrolling {\n\tdisplay: -webkit-box;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n\t-webkit-box-orient: vertical;\n\t-webkit-box-direction: normal;\n\t    -ms-flex-direction: column;\n\t        flex-direction: column;\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 1 auto;\n\t        flex: 1 1 auto;\n\twidth: 100%;\n\theight: 100%;\n\tborder-collapse: collapse;\n\toverflow: hidden;\n\t/* Use this to create a "dead" area color if table is too wide for cells */\n\tbackground-color: #ccc;\n\t--dead-area-color: #ccc;\n}\ntable.scrolling thead {\n\t/* Grow thead automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\t/* x-scrolling will be managed via JS */\n\toverflow-x: hidden;\n\t/* Keep header columns aligned with useless scrollbar. For IE11, use "dead area" color to hide scrollbar functions */\n\toverflow-y: scroll;\n}\n\n/*\nFor Webkit, use "dead area" color to hide scrollbar functions.\nSince WebKit supports CSS variables and style attributes don\'t support pseudo-classes, use variables.\nDisplay is set because otherwise Chrome ignores the other styling.\nTODO: on Chrome/Safari for Mac, scrollbars are not shown anyway and this creates an extra block. No impact on iOS Safari.\n*/\ntable.scrolling thead::-webkit-scrollbar {\n\tdisplay: block;\n\tbackground-color: var(--dead-area-color);\n}\ntable.scrolling thead::-webkit-scrollbar-track {\n\tbackground-color: var(--dead-area-color);\n}\n\n/* Scroll the actual tbody (second child on all browsers) */\ntable.scrolling tbody {\n\tdisplay: block;\n\toverflow: scroll;\n}\n\n/* IE11 adds an extra tbody, have to hide it */\ntable.scrolling tbody:nth-child(3) {\n\tdisplay: none;\n}\n\n/* The one caveat to scrolling this way: a hard-set width is required. Can override in thead/tbody slot. */\ntable.scrolling td,\ntable.scrolling th {\n\twidth: 10em;\n\tmin-width: 10em;\n\tborder: 1px solid #ddd;\n}\ntable.scrolling td {\n\tbackground-color: #fff;\n}\ntable.scrolling th {\n\tbackground-color: #f7f7f7;\n}\ntable.scrolling tfoot {\n\t/* Grow tfoot automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\toverflow: hidden;\n}\n',""])},function(t,e){function n(t,e){var n=t[1]||"",r=t[3];if(!r)return n;if(e&&"function"==typeof btoa){var a=o(r);return[n].concat(r.sources.map(function(t){return"/*# sourceURL="+r.sourceRoot+t+" */"})).concat([a]).join("\n")}return[n].join("\n")}function o(t){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */"}t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var o=n(e,t);return e[2]?"@media "+e[2]+"{"+o+"}":o}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var o={},r=0;r<this.length;r++){var a=this[r][0];"number"==typeof a&&(o[a]=!0)}for(r=0;r<t.length;r++){var l=t[r];"number"==typeof l[0]&&o[l[0]]||(n&&!l[2]?l[2]=n:n&&(l[2]="("+l[2]+") and ("+n+")"),e.push(l))}},e}},function(t,e,n){function o(t){for(var e=0;e<t.length;e++){var n=t[e],o=d[n.id];if(o){o.refs++;for(var r=0;r<o.parts.length;r++)o.parts[r](n.parts[r]);for(;r<n.parts.length;r++)o.parts.push(a(n.parts[r]));o.parts.length>n.parts.length&&(o.parts.length=n.parts.length)}else{for(var l=[],r=0;r<n.parts.length;r++)l.push(a(n.parts[r]));d[n.id]={id:n.id,refs:1,parts:l}}}}function r(){var t=document.createElement("style");return t.type="text/css",u.appendChild(t),t}function a(t){var e,n,o=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(o){if(h)return b;o.parentNode.removeChild(o)}if(v){var a=p++;o=f||(f=r()),e=l.bind(null,o,a,!1),n=l.bind(null,o,a,!0)}else o=r(),e=i.bind(null,o),n=function(){o.parentNode.removeChild(o)};return e(t),function(o){if(o){if(o.css===t.css&&o.media===t.media&&o.sourceMap===t.sourceMap)return;e(t=o)}else n()}}function l(t,e,n,o){var r=n?"":o.css;if(t.styleSheet)t.styleSheet.cssText=g(e,r);else{var a=document.createTextNode(r),l=t.childNodes;l[e]&&t.removeChild(l[e]),l.length?t.insertBefore(a,l[e]):t.appendChild(a)}}function i(t,e){var n=e.css,o=e.media,r=e.sourceMap;if(o&&t.setAttribute("media",o),r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}var s="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!s)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=n(7),d={},u=s&&(document.head||document.getElementsByTagName("head")[0]),f=null,p=0,h=!1,b=function(){},v="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,n){h=n;var r=c(t,e);return o(r),function(e){for(var n=[],a=0;a<r.length;a++){var l=r[a],i=d[l.id];i.refs--,n.push(i)}e?(r=c(t,e),o(r)):r=[];for(var a=0;a<n.length;a++){var i=n[a];if(0===i.refs){for(var s=0;s<i.parts.length;s++)i.parts[s]();delete d[i.id]}}}};var g=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var n=[],o={},r=0;r<e.length;r++){var a=e[r],l=a[0],i=a[1],s=a[2],c=a[3],d={id:t+":"+r,css:i,media:s,sourceMap:c};o[l]?o[l].parts.push(d):n.push(o[l]={id:l,parts:[d]})}return n}},function(t,e){t.exports=function(t,e,n,o,r,a){var l,i=t=t||{},s=typeof t.default;"object"!==s&&"function"!==s||(l=t,i=t.default);var c="function"==typeof i?i.options:i;e&&(c.render=e.render,c.staticRenderFns=e.staticRenderFns,c._compiled=!0),n&&(c.functional=!0),r&&(c._scopeId=r);var d;if(a?(d=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),o&&o.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(a)},c._ssrRegister=d):o&&(d=o),d){var u=c.functional,f=u?c.render:c.beforeCreate;u?(c._injectStyles=d,c.render=function(t,e){return d.call(e),f(t,e)}):c.beforeCreate=f?[].concat(f,d):[d]}return{esModule:l,exports:i,options:c}}},function(t,e,n){"use strict";var o=function(){var t=this,e=t.$createElement;return(t._self._c||e)("table",{ref:"table",staticClass:"scrolling",style:t.tableStyle},[t._t("thead"),t._v(" "),t._t("tbody"),t._v(" "),t._t("tfoot")],2)},r=[];o._withStripped=!0;var a={render:o,staticRenderFns:r};e.a=a}]);
+window.VueScrollingTable=function(t){function e(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:o})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=1)}([function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={name:"VueScrollingTable",props:{deadAreaColor:{type:String,required:!1,default:"#CCC"},includeFooter:{type:Boolean,required:!1,default:!1}},computed:{tableStyle:function(){return"background-color: "+this.deadAreaColor+";"},headStyle:function(){return"background-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-base-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-face-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-highlight-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-track-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-arrow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-shadow-color: "+this.deadAreaColor+";\n\t\t\t\tscrollbar-darkshadow-color: "+this.deadAreaColor+";"}},watch:{deadAreaColor:function(){this.setColors()}},mounted:function(){this.setColors(),this.syncTHeadScroll()},methods:{syncTHeadScroll:function(){var t=this.$refs.thead,e=this.$refs.tbody.scrollLeft;t.scrollLeft!==e&&(t.scrollLeft=e)},setColors:function(){this.$refs.table.style.setProperty("--dead-area-color",this.deadAreaColor)}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(2);e.default={install:function(t){t.component("vue-scrolling-table",o.default)}}},function(t,e,n){"use strict";function o(t){s||n(3)}var r=n(0),a=n.n(r),l=n(9),s=!1,i=n(8),c=o,d=i(a.a,l.a,!1,c,null,null);d.options.__file="src/VueScrollingTable.vue",e.default=d.exports},function(t,e,n){var o=n(4);"string"==typeof o&&(o=[[t.i,o,""]]),o.locals&&(t.exports=o.locals);n(6)("508563c8",o,!1)},function(t,e,n){e=t.exports=n(5)(void 0),e.push([t.i,'\ntable.scrolling {\n\tdisplay: -webkit-box;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n\t-webkit-box-orient: vertical;\n\t-webkit-box-direction: normal;\n\t    -ms-flex-direction: column;\n\t        flex-direction: column;\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 1 auto;\n\t        flex: 1 1 auto;\n\twidth: 100%;\n\theight: 100%;\n\tborder-collapse: collapse;\n\toverflow: hidden;\n\t/* Use this to create a "dead" area color if table is too wide for cells */\n\tbackground-color: #ccc;\n\t--dead-area-color: #ccc;\n}\ntable.scrolling thead {\n\t/* Grow thead automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\t/* x-scrolling will be managed via JS */\n\toverflow-x: hidden;\n\t/* Keep header columns aligned with useless scrollbar. For IE11, use "dead area" color to hide scrollbar functions */\n\toverflow-y: scroll;\n}\n\n/*\nFor Webkit, use "dead area" color to hide scrollbar functions.\nSince WebKit supports CSS variables and style attributes don\'t support pseudo-classes, use variables.\nDisplay is set because otherwise Chrome ignores the other styling.\nTODO: on Chrome/Safari for Mac, scrollbars are not shown anyway and this creates an extra block. No impact on iOS Safari.\n*/\ntable.scrolling thead::-webkit-scrollbar {\n\tdisplay: block;\n\tbackground-color: var(--dead-area-color);\n}\ntable.scrolling thead::-webkit-scrollbar-track {\n\tbackground-color: var(--dead-area-color);\n}\n\n/* Scroll the actual tbody (second child on all browsers) */\ntable.scrolling tbody {\n\tdisplay: block;\n\toverflow: scroll;\n}\n\n/* IE11 adds an extra tbody, have to hide it */\ntable.scrolling tbody:nth-child(3) {\n\tdisplay: none;\n}\n\n/* The one caveat to scrolling this way: a hard-set width is required. Can override in thead/tbody slot. */\ntable.scrolling td,\ntable.scrolling th {\n\tborder: 1px solid #ddd;\n\n\t/* These must all be set the same in your overriding CSS */\n\twidth: 10em;\n\tmin-width: 10em;\n\tmax-width: 10em;\n\n\t/* Important in case your data is too long for your cell */\n\toverflow: hidden;\n\tword-wrap: break-word;\n}\ntable.scrolling td {\n\tbackground-color: #fff;\n}\ntable.scrolling th {\n\tbackground-color: #f7f7f7;\n}\ntable.scrolling tfoot {\n\t/* Grow tfoot automatically to fit content, don\'t shrink it proportionately to the body. */\n\t-webkit-box-flex: 1;\n\t    -ms-flex: 1 0 auto;\n\t        flex: 1 0 auto;\n\tdisplay: block;\n\toverflow: hidden;\n}\n',""])},function(t,e){function n(t,e){var n=t[1]||"",r=t[3];if(!r)return n;if(e&&"function"==typeof btoa){var a=o(r);return[n].concat(r.sources.map(function(t){return"/*# sourceURL="+r.sourceRoot+t+" */"})).concat([a]).join("\n")}return[n].join("\n")}function o(t){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */"}t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var o=n(e,t);return e[2]?"@media "+e[2]+"{"+o+"}":o}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var o={},r=0;r<this.length;r++){var a=this[r][0];"number"==typeof a&&(o[a]=!0)}for(r=0;r<t.length;r++){var l=t[r];"number"==typeof l[0]&&o[l[0]]||(n&&!l[2]?l[2]=n:n&&(l[2]="("+l[2]+") and ("+n+")"),e.push(l))}},e}},function(t,e,n){function o(t){for(var e=0;e<t.length;e++){var n=t[e],o=d[n.id];if(o){o.refs++;for(var r=0;r<o.parts.length;r++)o.parts[r](n.parts[r]);for(;r<n.parts.length;r++)o.parts.push(a(n.parts[r]));o.parts.length>n.parts.length&&(o.parts.length=n.parts.length)}else{for(var l=[],r=0;r<n.parts.length;r++)l.push(a(n.parts[r]));d[n.id]={id:n.id,refs:1,parts:l}}}}function r(){var t=document.createElement("style");return t.type="text/css",u.appendChild(t),t}function a(t){var e,n,o=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(o){if(p)return b;o.parentNode.removeChild(o)}if(v){var a=h++;o=f||(f=r()),e=l.bind(null,o,a,!1),n=l.bind(null,o,a,!0)}else o=r(),e=s.bind(null,o),n=function(){o.parentNode.removeChild(o)};return e(t),function(o){if(o){if(o.css===t.css&&o.media===t.media&&o.sourceMap===t.sourceMap)return;e(t=o)}else n()}}function l(t,e,n,o){var r=n?"":o.css;if(t.styleSheet)t.styleSheet.cssText=y(e,r);else{var a=document.createTextNode(r),l=t.childNodes;l[e]&&t.removeChild(l[e]),l.length?t.insertBefore(a,l[e]):t.appendChild(a)}}function s(t,e){var n=e.css,o=e.media,r=e.sourceMap;if(o&&t.setAttribute("media",o),r&&(n+="\n/*# sourceURL="+r.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}var i="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!i)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=n(7),d={},u=i&&(document.head||document.getElementsByTagName("head")[0]),f=null,h=0,p=!1,b=function(){},v="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,n){p=n;var r=c(t,e);return o(r),function(e){for(var n=[],a=0;a<r.length;a++){var l=r[a],s=d[l.id];s.refs--,n.push(s)}e?(r=c(t,e),o(r)):r=[];for(var a=0;a<n.length;a++){var s=n[a];if(0===s.refs){for(var i=0;i<s.parts.length;i++)s.parts[i]();delete d[s.id]}}}};var y=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var n=[],o={},r=0;r<e.length;r++){var a=e[r],l=a[0],s=a[1],i=a[2],c=a[3],d={id:t+":"+r,css:s,media:i,sourceMap:c};o[l]?o[l].parts.push(d):n.push(o[l]={id:l,parts:[d]})}return n}},function(t,e){t.exports=function(t,e,n,o,r,a){var l,s=t=t||{},i=typeof t.default;"object"!==i&&"function"!==i||(l=t,s=t.default);var c="function"==typeof s?s.options:s;e&&(c.render=e.render,c.staticRenderFns=e.staticRenderFns,c._compiled=!0),n&&(c.functional=!0),r&&(c._scopeId=r);var d;if(a?(d=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),o&&o.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(a)},c._ssrRegister=d):o&&(d=o),d){var u=c.functional,f=u?c.render:c.beforeCreate;u?(c._injectStyles=d,c.render=function(t,e){return d.call(e),f(t,e)}):c.beforeCreate=f?[].concat(f,d):[d]}return{esModule:l,exports:s,options:c}}},function(t,e,n){"use strict";var o=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("table",{ref:"table",staticClass:"scrolling",style:t.tableStyle},[n("thead",{ref:"thead",style:t.headStyle,attrs:{name:"thead"}},[t._t("thead")],2),t._v(" "),n("tbody",{ref:"tbody",attrs:{name:"tbody"},on:{scroll:t.syncTHeadScroll}},[t._t("tbody")],2),t._v(" "),t.includeFooter?n("tfoot",{attrs:{name:"tfoot"}},[t._t("tfoot")],2):t._e()])},r=[];o._withStripped=!0;var a={render:o,staticRenderFns:r};e.a=a}]);

package.json

 {
 	"name": "vue-scrolling-table",
-	"version": "0.1.1",
+	"version": "0.1.2",
 	"description":
@@ -5,0 +5,0 @@ "A Vue component to create tables with vertical and horizontal scrolling. Flexbox-based.",

README.md

@@ -156,1 +156,2 @@ # vue-scrolling-table
 | 2017.12.24 | 0.1.1   | Patch based on sample app deveopment                                                       |
+| 2017.12.24 | 0.1.2   | Fix: old version went to npm                                                               |

No alert changes

Improved metrics

Total package byte prevSize

35085

3.38%

Number of lines in readme file

157

0.64%

No dependency changes