UNPKG

@insaic/neon

Version:

A Mobile UI Components built on Vue

433 lines (376 loc) 13.4 kB
module.exports = /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { /******/ configurable: false, /******/ enumerable: true, /******/ get: getter /******/ }); /******/ } /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = 309); /******/ }) /************************************************************************/ /******/ ({ /***/ 0: /***/ (function(module, exports) { /* globals __VUE_SSR_CONTEXT__ */ // IMPORTANT: Do NOT use ES2015 features in this file. // This module is a runtime utility for cleaner component module output and will // be included in the final webpack user bundle. module.exports = function normalizeComponent ( rawScriptExports, compiledTemplate, functionalTemplate, injectStyles, scopeId, moduleIdentifier /* server only */ ) { var esModule var scriptExports = rawScriptExports = rawScriptExports || {} // ES6 modules interop var type = typeof rawScriptExports.default if (type === 'object' || type === 'function') { esModule = rawScriptExports scriptExports = rawScriptExports.default } // Vue.extend constructor export interop var options = typeof scriptExports === 'function' ? scriptExports.options : scriptExports // render functions if (compiledTemplate) { options.render = compiledTemplate.render options.staticRenderFns = compiledTemplate.staticRenderFns options._compiled = true } // functional template if (functionalTemplate) { options.functional = true } // scopedId if (scopeId) { options._scopeId = scopeId } var hook if (moduleIdentifier) { // server build hook = function (context) { // 2.3 injection context = context || // cached call (this.$vnode && this.$vnode.ssrContext) || // stateful (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional // 2.2 with runInNewContext: true if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') { context = __VUE_SSR_CONTEXT__ } // inject component styles if (injectStyles) { injectStyles.call(this, context) } // register component module identifier for async chunk inferrence if (context && context._registeredComponents) { context._registeredComponents.add(moduleIdentifier) } } // used by ssr in case component is cached and beforeCreate // never gets called options._ssrRegister = hook } else if (injectStyles) { hook = injectStyles } if (hook) { var functional = options.functional var existing = functional ? options.render : options.beforeCreate if (!functional) { // inject component registration as beforeCreate hook options.beforeCreate = existing ? [].concat(existing, hook) : [hook] } else { // for template-only hot-reload because in that case the render fn doesn't // go through the normalizer options._injectStyles = hook // register for functioal component in vue file options.render = function renderWithStyleInjection (h, context) { hook.call(context) return existing(h, context) } } } return { esModule: esModule, exports: scriptExports, options: options } } /***/ }), /***/ 145: /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; // // // // // // // // // // // // // // // // // // // // // // // // /* harmony default export */ __webpack_exports__["a"] = ({ name: 'sq-tabs', props: { active: { type: [String, Number] }, sticky: { type: Boolean, default: false }, lineScale: { type: [String, Number], default: 1 }, titleHeight: { type: [String, Number], default: 48 }, fontSize: { type: [String, Number], default: 16 }, hideLine: { type: Boolean, default: false }, type: { type: String, default: 'line', validator: function validator(value) { return ['line', 'block'].indexOf(value) > -1; } }, autoActive: { type: Boolean, default: true } }, computed: { titleHeightStyles: function titleHeightStyles() { return { 'padding-top': this.titleHeight + 'px' }; }, headerWrapperStyles: function headerWrapperStyles() { return { 'position': this.sticky ? 'fixed' : 'absolute', 'height': this.titleHeight + 'px', 'font-size': this.fontSize + 'px' }; }, lineStyles: function lineStyles() { return { 'transform': this.tleft, 'width': this.lineWidth, 'display': this.lineDisplay }; } }, data: function data() { return { tleft: 'translate(0, 0) scaleX(' + this.lineScale + ')', tabList: [], currentActive: this.active, lineWidth: '0', lineDisplay: 'none', index: 0 }; }, methods: { handleClick: function handleClick(event, index) { var navName = this.tabList[index].name; if (navName === this.currentActive) { return; } this.autoActive && this.setActivePane(index); this.$emit('click', navName, index); }, setActivePane: function setActivePane(index) { this.index = index; this.currentActive = this.tabList[index].name; if (!this.hideLine && this.type === 'line') { var parentLeft = this.$refs.tabHeaderWrapper.getBoundingClientRect().left; var targetLeft = this.$refs.tabItemTitleWrapperRef[index].getBoundingClientRect().left; this.tleft = 'translate(' + (targetLeft - parentLeft) + 'px, 0) scaleX(' + this.lineScale + ')'; } }, getPane: function getPane() { return this.$children.filter(function (item) { return item.$options.name === 'sq-tabpane'; }); }, updateNav: function updateNav() { var _this = this; var children = this.getPane(); if (children.length === this.tabList.length) { return; } this.tabList = []; children.forEach(function (pane, index) { _this.tabList.push({ label: pane.label, name: pane.name }); }); !this.hideLine && this.type === 'line' && (this.lineWidth = 100 / this.tabList.length + '%'); }, renderTitle: function renderTitle(el, index) { var _this2 = this; this.$nextTick(function () { var title = _this2.$refs.title[index]; title.parentNode.replaceChild(el, title); }); }, listenResize: function listenResize() { var parentLeft = this.$refs.tabHeaderWrapper.getBoundingClientRect().left; var targetLeft = this.$refs.tabItemTitleWrapperRef[this.index].getBoundingClientRect().left; this.tleft = 'translate(' + (targetLeft - parentLeft) + 'px, 0) scaleX(' + this.lineScale + ')'; } }, mounted: function mounted() { var _this3 = this; var currentActive = this.currentActive; if (currentActive) { var length = this.tabList.length; var width = this.$refs.tabHeaderWrapper.clientWidth; this.tabList.forEach(function (item, index) { if (currentActive === item.name) { _this3.index = index; _this3.tleft = 'translate(' + index * (width / length) + 'px, 0) scaleX(' + _this3.lineScale + ')'; _this3.lineDisplay = 'block'; } }); } !this.hideLine && this.type === 'line' && window.addEventListener('resize', this.listenResize, false); }, beforeDestroy: function beforeDestroy() { !this.hideLine && this.type === 'line' && window.removeEventListener('resize', this.listenResize); } }); /***/ }), /***/ 309: /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__src_index_vue__ = __webpack_require__(310); __WEBPACK_IMPORTED_MODULE_0__src_index_vue__["a" /* default */].install = function (Vue) { Vue.component(__WEBPACK_IMPORTED_MODULE_0__src_index_vue__["a" /* default */].name, __WEBPACK_IMPORTED_MODULE_0__src_index_vue__["a" /* default */]); }; /* harmony default export */ __webpack_exports__["default"] = (__WEBPACK_IMPORTED_MODULE_0__src_index_vue__["a" /* default */]); /***/ }), /***/ 310: /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_index_vue__ = __webpack_require__(145); /* unused harmony namespace reexport */ /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_451a6e10_hasScoped_false_transformToRequire_video_src_poster_source_src_img_src_image_xlink_href_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_index_vue__ = __webpack_require__(312); function injectStyle (ssrContext) { __webpack_require__(311) } var normalizeComponent = __webpack_require__(0) /* script */ /* template */ /* template functional */ var __vue_template_functional__ = false /* styles */ var __vue_styles__ = injectStyle /* scopeId */ var __vue_scopeId__ = null /* moduleIdentifier (server only) */ var __vue_module_identifier__ = null var Component = normalizeComponent( __WEBPACK_IMPORTED_MODULE_0__babel_loader_node_modules_vue_loader_lib_selector_type_script_index_0_index_vue__["a" /* default */], __WEBPACK_IMPORTED_MODULE_1__node_modules_vue_loader_lib_template_compiler_index_id_data_v_451a6e10_hasScoped_false_transformToRequire_video_src_poster_source_src_img_src_image_xlink_href_buble_transforms_node_modules_vue_loader_lib_selector_type_template_index_0_index_vue__["a" /* default */], __vue_template_functional__, __vue_styles__, __vue_scopeId__, __vue_module_identifier__ ) /* harmony default export */ __webpack_exports__["a"] = (Component.exports); /***/ }), /***/ 311: /***/ (function(module, exports) { // removed by extract-text-webpack-plugin /***/ }), /***/ 312: /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"sq-tabs-wrapper",style:(_vm.titleHeightStyles)},[_c('div',{ref:"tabHeaderWrapper",staticClass:"sq-tabs-header",style:(_vm.headerWrapperStyles)},[(!_vm.hideLine && _vm.type === 'line')?_c('div',{staticClass:"sq-tabs-header-line",style:(_vm.lineStyles)}):_vm._e(),_vm._v(" "),_vm._l((_vm.tabList),function(tab,index){return _c('div',{key:index,ref:"tabItemTitleWrapperRef",refInFor:true,staticClass:"sq-tabs-header-item",class:{ 'sq-tabs-active-line': _vm.type === 'line' && _vm.currentActive === tab.name, 'sq-tabs-active-block': _vm.type === 'block' && _vm.currentActive === tab.name },on:{"click":function($event){_vm.handleClick($event, index)}}},[_c('span',{ref:"title",refInFor:true,staticClass:"sq-tabs-title"},[_vm._v(_vm._s(tab.label))])])})],2),_vm._v(" "),_c('div',{staticClass:"sq-tabs-content"},[_vm._t("default")],2)])} var staticRenderFns = [] var esExports = { render: render, staticRenderFns: staticRenderFns } /* harmony default export */ __webpack_exports__["a"] = (esExports); /***/ }) /******/ });