@apicart/vue-components
Version:
Apicart Vue.Js components for simple e-commerce platform development
268 lines (241 loc) • 9.6 kB
JavaScript
/**
* @apicart/vue-components v1.0.0-alpha7
* (c) 2018-2020 Apicart Company
* Released under the MIT License.
*/
import Apicart from '@apicart/core-sdk';
import { Translator } from '../..';
var translator = Apicart.VueComponentsTranslator || Translator;
var i18n = translator.getI18n();
var defaultLevelValue = 1;
var findFirstCategorySubcategoryChildWithoutChildren = function (subcategories) {
var subcategory = null;
Apicart.Utils.Loops.forEach(subcategories, function (value, key) {
if (Object.keys(value.subcategories).length) {
subcategory = findFirstCategorySubcategoryChildWithoutChildren(value.subcategories);
}
else {
subcategory = value.keyPath;
}
return false;
});
return subcategory;
};
var script = {
name: 'apicart-category-item',
i18n: i18n,
components: {
'apicart-categories-list': function () { return Promise.resolve(__vue_component__$1); }
},
props: {
categoryData: {
type: Object,
default: {}
},
level: {
type: Number,
default: defaultLevelValue
},
toggled: {
type: Boolean,
default: false
},
selectedCategoryKeyPath: {
type: String,
default: ''
}
},
data: function () {
return {
listLevel: defaultLevelValue,
};
},
methods: {
toggle: function () {
Apicart.Utils.EventDispatcher.dispatchEvent('apicart:category:selected', Object.keys(this.categoryData.subcategories).length
? findFirstCategorySubcategoryChildWithoutChildren(this.categoryData.subcategories)
: this.categoryData.keyPath);
}
}
};
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = ".apicart-category__categories-item--level-1{font-size:20px;margin-bottom:12px}.apicart-category__categories-item--level-2{font-size:16px}.apicart-category__categories-item--level-3{font-size:14px}.apicart-category__categories-link{text-decoration:none;color:#121212;display:block;transition:color .1s linear;line-height:32px}.apicart-category__categories-link:active,.apicart-category__categories-link:hover{color:#121212}.apicart-category__categories-link--selected{font-weight:700}.apicart-category__categories-link--selected:active,.apicart-category__categories-link--selected:hover{color:#121212}";
styleInject(css_248z);
function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
if (typeof shadowMode !== 'boolean') {
createInjectorSSR = createInjector;
createInjector = shadowMode;
shadowMode = false;
}
// Vue.extend constructor export interop.
const options = typeof script === 'function' ? script.options : script;
// render functions
if (template && template.render) {
options.render = template.render;
options.staticRenderFns = template.staticRenderFns;
options._compiled = true;
// functional template
if (isFunctionalTemplate) {
options.functional = true;
}
}
// scopedId
if (scopeId) {
options._scopeId = scopeId;
}
let 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 (style) {
style.call(this, createInjectorSSR(context));
}
// register component module identifier for async chunk inference
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 (style) {
hook = shadowMode
? function (context) {
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
}
: function (context) {
style.call(this, createInjector(context));
};
}
if (hook) {
if (options.functional) {
// register for functional component in vue file
const originalRender = options.render;
options.render = function renderWithStyleInjection(h, context) {
hook.call(context);
return originalRender(h, context);
};
}
else {
// inject component registration as beforeCreate hook
const existing = options.beforeCreate;
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
}
}
return script;
}
/* script */
const __vue_script__ = script;
/* template */
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('li',{class:'apicart-category__categories-item apicart-category__categories-item--level-' + _vm.level},[_c('a',{class:[{'apicart-category__categories-link--selected': _vm.selectedCategoryKeyPath.indexOf(_vm.categoryData.keyPath) !== -1}, 'apicart-category__categories-link'],attrs:{"href":"#"},on:{"click":_vm.toggle}},[_vm._v(" "+_vm._s(_vm.$t('categories.' + _vm.categoryData.keyPath + '.menu'))+" ")]),(Object.keys(_vm.categoryData.subcategories).length)?_c('apicart-categories-list',{attrs:{"selectedCategoryKeyPath":_vm.selectedCategoryKeyPath,"toggled":_vm.selectedCategoryKeyPath.indexOf(_vm.categoryData.keyPath) !== -1,"categories":_vm.categoryData.subcategories,"level":_vm.level + 1}}):_vm._e()],1)};
var __vue_staticRenderFns__ = [];
/* style */
const __vue_inject_styles__ = undefined;
/* scoped */
const __vue_scope_id__ = undefined;
/* module identifier */
const __vue_module_identifier__ = undefined;
/* functional template */
const __vue_is_functional_template__ = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__ = normalizeComponent(
{ render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
__vue_inject_styles__,
__vue_script__,
__vue_scope_id__,
__vue_is_functional_template__,
__vue_module_identifier__,
false,
undefined,
undefined,
undefined
);
var script$1 = {
name: 'apicart-categories-list',
components: {
'apicart-category-item': __vue_component__
},
props: {
categories: {
type: Object,
default: {}
},
level: {
type: Number,
default: 1
},
toggled: {
type: Boolean,
default: false
},
selectedCategoryKeyPath: {
type: String,
default: ''
}
}
};
var css_248z$1 = ".apicart-category__categories{list-style:none;display:none;padding-left:10px;margin-top:0}.apicart-category__categories.apicart-category__categories--toggled{list-style:none;display:block}";
styleInject(css_248z$1);
/* script */
const __vue_script__$1 = script$1;
/* template */
var __vue_render__$1 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('ul',{class:[{'apicart-category__categories--toggled': _vm.toggled}, 'apicart-category__categories'],attrs:{"data-number":_vm.number}},_vm._l((_vm.categories),function(categoryData,index){return _c('apicart-category-item',{key:index,attrs:{"level":_vm.level,"selectedCategoryKeyPath":_vm.selectedCategoryKeyPath,"categoryData":categoryData}})}),1)};
var __vue_staticRenderFns__$1 = [];
/* style */
const __vue_inject_styles__$1 = undefined;
/* scoped */
const __vue_scope_id__$1 = undefined;
/* module identifier */
const __vue_module_identifier__$1 = undefined;
/* functional template */
const __vue_is_functional_template__$1 = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$1 = normalizeComponent(
{ render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 },
__vue_inject_styles__$1,
__vue_script__$1,
__vue_scope_id__$1,
__vue_is_functional_template__$1,
__vue_module_identifier__$1,
false,
undefined,
undefined,
undefined
);
export default __vue_component__$1;