@syncfusion/ej2-vue-navigations 20.4.53 → 21.1.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -0
- package/README.md +211 -142
- package/dist/ej2-vue-navigations.umd.min.js +2 -2
- package/dist/ej2-vue-navigations.umd.min.js.map +1 -1
- package/dist/es6/ej2-vue-navigations.es2015.js +1195 -1613
- package/dist/es6/ej2-vue-navigations.es2015.js.map +1 -1
- package/dist/es6/ej2-vue-navigations.es5.js +1337 -1877
- package/dist/es6/ej2-vue-navigations.es5.js.map +1 -1
- package/dist/global/ej2-vue-navigations.min.js +2 -2
- package/package.json +9 -9
- package/src/accordion/accordion.component.d.ts +3 -31
- package/src/accordion/accordion.component.js +137 -168
- package/src/accordion/items.directive.d.ts +2 -12
- package/src/accordion/items.directive.js +22 -71
- package/src/appbar/appbar.component.d.ts +3 -22
- package/src/appbar/appbar.component.js +83 -112
- package/src/breadcrumb/breadcrumb.component.d.ts +3 -25
- package/src/breadcrumb/breadcrumb.component.js +119 -150
- package/src/breadcrumb/items.directive.d.ts +2 -12
- package/src/breadcrumb/items.directive.js +22 -71
- package/src/carousel/carousel.component.d.ts +3 -29
- package/src/carousel/carousel.component.js +131 -162
- package/src/carousel/items.directive.d.ts +2 -12
- package/src/carousel/items.directive.js +22 -71
- package/src/context-menu/contextmenu.component.d.ts +3 -32
- package/src/context-menu/contextmenu.component.js +113 -142
- package/src/menu/items.directive.d.ts +2 -12
- package/src/menu/items.directive.js +22 -71
- package/src/menu/menu.component.d.ts +3 -32
- package/src/menu/menu.component.js +113 -142
- package/src/sidebar/sidebar.component.d.ts +3 -28
- package/src/sidebar/sidebar.component.js +128 -159
- package/src/tab/items.directive.d.ts +2 -12
- package/src/tab/items.directive.js +22 -71
- package/src/tab/tab.component.d.ts +3 -32
- package/src/tab/tab.component.js +113 -142
- package/src/toolbar/items.directive.d.ts +2 -12
- package/src/toolbar/items.directive.js +22 -71
- package/src/toolbar/toolbar.component.d.ts +3 -28
- package/src/toolbar/toolbar.component.js +101 -130
- package/src/treeview/treeview.component.d.ts +3 -39
- package/src/treeview/treeview.component.js +134 -163
- package/styles/accordion/bootstrap-dark.css +0 -1
- package/styles/accordion/bootstrap.css +0 -1
- package/styles/accordion/bootstrap4.css +0 -1
- package/styles/accordion/bootstrap5-dark.css +3 -4
- package/styles/accordion/bootstrap5.css +3 -4
- package/styles/accordion/fabric-dark.css +0 -1
- package/styles/accordion/fabric.css +0 -1
- package/styles/accordion/fluent-dark.css +3 -4
- package/styles/accordion/fluent.css +3 -4
- package/styles/accordion/highcontrast-light.css +0 -1
- package/styles/accordion/highcontrast.css +0 -1
- package/styles/accordion/material-dark.css +0 -1
- package/styles/accordion/material.css +0 -1
- package/styles/accordion/tailwind-dark.css +3 -4
- package/styles/accordion/tailwind.css +3 -4
- package/styles/appbar/bootstrap-dark.css +3 -0
- package/styles/appbar/bootstrap.css +3 -0
- package/styles/appbar/bootstrap4.css +3 -0
- package/styles/appbar/bootstrap5-dark.css +3 -0
- package/styles/appbar/bootstrap5.css +3 -0
- package/styles/appbar/fabric-dark.css +3 -0
- package/styles/appbar/fabric.css +3 -0
- package/styles/appbar/fluent-dark.css +3 -0
- package/styles/appbar/fluent.css +3 -0
- package/styles/appbar/highcontrast-light.css +3 -0
- package/styles/appbar/highcontrast.css +3 -0
- package/styles/appbar/material-dark.css +3 -0
- package/styles/appbar/material.css +3 -0
- package/styles/appbar/tailwind-dark.css +3 -0
- package/styles/appbar/tailwind.css +3 -0
- package/styles/bootstrap-dark.css +669 -938
- package/styles/bootstrap.css +658 -927
- package/styles/bootstrap4.css +724 -993
- package/styles/bootstrap5-dark.css +685 -954
- package/styles/bootstrap5.css +686 -955
- package/styles/carousel/bootstrap-dark.css +4 -0
- package/styles/carousel/bootstrap.css +4 -0
- package/styles/carousel/bootstrap4.css +4 -0
- package/styles/carousel/bootstrap5-dark.css +4 -0
- package/styles/carousel/bootstrap5.css +4 -0
- package/styles/carousel/fabric-dark.css +4 -0
- package/styles/carousel/fabric.css +4 -0
- package/styles/carousel/fluent-dark.css +4 -0
- package/styles/carousel/fluent.css +4 -0
- package/styles/carousel/highcontrast-light.css +4 -0
- package/styles/carousel/highcontrast.css +4 -0
- package/styles/carousel/material-dark.css +4 -0
- package/styles/carousel/material.css +4 -0
- package/styles/carousel/tailwind-dark.css +4 -0
- package/styles/carousel/tailwind.css +4 -0
- package/styles/fabric-dark.css +669 -938
- package/styles/fabric.css +669 -938
- package/styles/fluent-dark.css +677 -946
- package/styles/fluent.css +677 -946
- package/styles/h-scroll/bootstrap-dark.css +1 -1
- package/styles/h-scroll/bootstrap.css +1 -1
- package/styles/h-scroll/bootstrap4.css +1 -1
- package/styles/h-scroll/bootstrap5-dark.css +1 -1
- package/styles/h-scroll/bootstrap5.css +1 -1
- package/styles/h-scroll/fabric-dark.css +1 -1
- package/styles/h-scroll/fabric.css +1 -1
- package/styles/h-scroll/fluent-dark.css +1 -1
- package/styles/h-scroll/fluent.css +1 -1
- package/styles/h-scroll/highcontrast-light.css +1 -1
- package/styles/h-scroll/highcontrast.css +1 -1
- package/styles/h-scroll/material-dark.css +1 -1
- package/styles/h-scroll/material.css +1 -1
- package/styles/h-scroll/tailwind-dark.css +1 -1
- package/styles/h-scroll/tailwind.css +1 -1
- package/styles/highcontrast-light.css +668 -937
- package/styles/highcontrast.css +675 -944
- package/styles/material-dark.css +669 -938
- package/styles/material.css +661 -930
- package/styles/menu/bootstrap-dark.css +7 -7
- package/styles/menu/bootstrap.css +7 -7
- package/styles/menu/bootstrap4.css +10 -10
- package/styles/menu/bootstrap5-dark.css +7 -7
- package/styles/menu/bootstrap5.css +7 -7
- package/styles/menu/fabric-dark.css +7 -7
- package/styles/menu/fabric.css +7 -7
- package/styles/menu/fluent-dark.css +7 -7
- package/styles/menu/fluent.css +7 -7
- package/styles/menu/highcontrast-light.css +7 -7
- package/styles/menu/highcontrast.css +7 -7
- package/styles/menu/material-dark.css +7 -7
- package/styles/menu/material.css +7 -7
- package/styles/menu/tailwind-dark.css +7 -7
- package/styles/menu/tailwind.css +7 -7
- package/styles/tab/bootstrap-dark.css +5 -2
- package/styles/tab/bootstrap.css +5 -2
- package/styles/tab/bootstrap4.css +12 -9
- package/styles/tab/bootstrap5-dark.css +11 -8
- package/styles/tab/bootstrap5.css +11 -8
- package/styles/tab/fabric-dark.css +7 -4
- package/styles/tab/fabric.css +7 -4
- package/styles/tab/fluent-dark.css +8 -5
- package/styles/tab/fluent.css +8 -5
- package/styles/tab/highcontrast-light.css +10 -7
- package/styles/tab/highcontrast.css +10 -7
- package/styles/tab/material-dark.css +4 -1
- package/styles/tab/material.css +4 -1
- package/styles/tab/tailwind-dark.css +8 -5
- package/styles/tab/tailwind.css +8 -5
- package/styles/tailwind-dark.css +668 -937
- package/styles/tailwind.css +668 -937
- package/styles/toolbar/bootstrap-dark.css +647 -925
- package/styles/toolbar/bootstrap.css +638 -916
- package/styles/toolbar/bootstrap4.css +657 -935
- package/styles/toolbar/bootstrap5-dark.css +658 -936
- package/styles/toolbar/bootstrap5.css +658 -936
- package/styles/toolbar/fabric-dark.css +645 -923
- package/styles/toolbar/fabric.css +651 -929
- package/styles/toolbar/fluent-dark.css +650 -928
- package/styles/toolbar/fluent.css +650 -928
- package/styles/toolbar/highcontrast-light.css +642 -920
- package/styles/toolbar/highcontrast.css +647 -925
- package/styles/toolbar/material-dark.css +649 -927
- package/styles/toolbar/material.css +646 -924
- package/styles/toolbar/tailwind-dark.css +647 -925
- package/styles/toolbar/tailwind.css +645 -923
|
@@ -1,32 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
extendStatics(d, b);
|
|
10
|
-
function __() { this.constructor = d; }
|
|
11
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
12
|
-
};
|
|
13
|
-
})();
|
|
14
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
15
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
16
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
17
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
18
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
19
|
-
};
|
|
20
|
-
import { ComponentBase, EJComponentDecorator, getProps, gh, isExecute } from '@syncfusion/ej2-vue-base';
|
|
1
|
+
import { ComponentBase, gh, getProps, isExecute, vueDefineComponent } from '@syncfusion/ej2-vue-base';
|
|
21
2
|
import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
|
|
22
3
|
import { AppBar } from '@syncfusion/ej2-navigations';
|
|
23
|
-
import { Options } from 'vue-class-component';
|
|
24
4
|
export var properties = ['isLazyUpdate', 'plugins', 'colorMode', 'cssClass', 'enablePersistence', 'enableRtl', 'htmlAttributes', 'isSticky', 'locale', 'mode', 'position', 'created', 'destroyed'];
|
|
25
5
|
export var modelProps = [];
|
|
26
6
|
export var testProp = getProps({ props: properties });
|
|
27
|
-
export var props = testProp[0];
|
|
28
|
-
export var watch = testProp[1];
|
|
29
|
-
export var emitProbs = Object.keys(watch);
|
|
7
|
+
export var props = testProp[0], watch = testProp[1], emitProbs = Object.keys(watch);
|
|
30
8
|
emitProbs.push('modelchanged', 'update:modelValue');
|
|
31
9
|
for (var _i = 0, modelProps_1 = modelProps; _i < modelProps_1.length; _i++) {
|
|
32
10
|
var props_1 = modelProps_1[_i];
|
|
@@ -38,102 +16,95 @@ for (var _i = 0, modelProps_1 = modelProps; _i < modelProps_1.length; _i++) {
|
|
|
38
16
|
* <ejs-appbar></ejs-appbar>
|
|
39
17
|
* ```
|
|
40
18
|
*/
|
|
41
|
-
var AppBarComponent =
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
19
|
+
export var AppBarComponent = vueDefineComponent({
|
|
20
|
+
name: 'AppBarComponent',
|
|
21
|
+
mixins: [ComponentBase],
|
|
22
|
+
props: props,
|
|
23
|
+
watch: watch,
|
|
24
|
+
emits: emitProbs,
|
|
25
|
+
provide: function () { return { custom: this.custom }; },
|
|
26
|
+
data: function () {
|
|
27
|
+
return {
|
|
28
|
+
ej2Instances: new AppBar({}),
|
|
29
|
+
propKeys: properties,
|
|
30
|
+
models: modelProps,
|
|
31
|
+
hasChildDirective: false,
|
|
32
|
+
hasInjectedModules: false,
|
|
33
|
+
tagMapper: {},
|
|
34
|
+
tagNameMapper: {},
|
|
35
|
+
isVue3: !isExecute,
|
|
36
|
+
templateCollection: {},
|
|
37
|
+
};
|
|
38
|
+
},
|
|
39
|
+
created: function () {
|
|
40
|
+
this.bindProperties();
|
|
41
|
+
this.ej2Instances._setProperties = this.ej2Instances.setProperties;
|
|
42
|
+
this.ej2Instances.setProperties = this.setProperties;
|
|
43
|
+
this.ej2Instances.clearTemplate = this.clearTemplate;
|
|
44
|
+
this.updated = this.updated;
|
|
45
|
+
},
|
|
46
|
+
render: function (createElement) {
|
|
47
|
+
var h = !isExecute ? gh : createElement;
|
|
48
|
+
var slots = null;
|
|
49
|
+
if (!isNullOrUndefined(this.$slots.default)) {
|
|
50
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
63
51
|
}
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
52
|
+
return h('header', slots);
|
|
53
|
+
},
|
|
54
|
+
methods: {
|
|
55
|
+
clearTemplate: function (templateNames) {
|
|
56
|
+
if (!templateNames) {
|
|
57
|
+
templateNames = Object.keys(this.templateCollection || {});
|
|
58
|
+
}
|
|
59
|
+
if (templateNames.length && this.templateCollection) {
|
|
60
|
+
for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
|
|
61
|
+
var tempName = templateNames_1[_i];
|
|
62
|
+
var elementCollection = this.templateCollection[tempName];
|
|
63
|
+
if (elementCollection && elementCollection.length) {
|
|
64
|
+
for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
|
|
65
|
+
var ele = elementCollection_1[_a];
|
|
66
|
+
var destroy = getValue('__vue__.$destroy', ele);
|
|
67
|
+
if (destroy) {
|
|
68
|
+
ele.__vue__.$destroy();
|
|
69
|
+
}
|
|
70
|
+
if (ele.innerHTML) {
|
|
71
|
+
ele.innerHTML = '';
|
|
72
|
+
}
|
|
77
73
|
}
|
|
74
|
+
delete this.templateCollection[tempName];
|
|
78
75
|
}
|
|
79
|
-
delete this.templateCollection[tempName];
|
|
80
76
|
}
|
|
81
77
|
}
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
78
|
+
},
|
|
79
|
+
setProperties: function (prop, muteOnChange) {
|
|
80
|
+
var _this = this;
|
|
81
|
+
if (this.isVue3) {
|
|
82
|
+
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
83
|
+
}
|
|
84
|
+
if (this.ej2Instances && this.ej2Instances._setProperties) {
|
|
85
|
+
this.ej2Instances._setProperties(prop, muteOnChange);
|
|
86
|
+
}
|
|
87
|
+
if (prop && this.models && this.models.length) {
|
|
88
|
+
Object.keys(prop).map(function (key) {
|
|
89
|
+
_this.models.map(function (model) {
|
|
90
|
+
if ((key === model) && !(/datasource/i.test(key))) {
|
|
91
|
+
if (_this.isVue3) {
|
|
92
|
+
_this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
|
|
93
|
+
}
|
|
94
|
+
else {
|
|
95
|
+
_this.$emit('update:' + key, prop[key]);
|
|
96
|
+
_this.$emit('modelchanged', prop[key]);
|
|
97
|
+
}
|
|
102
98
|
}
|
|
103
|
-
}
|
|
99
|
+
});
|
|
104
100
|
});
|
|
105
|
-
});
|
|
106
|
-
}
|
|
107
|
-
};
|
|
108
|
-
AppBarComponent.prototype.render = function (createElement) {
|
|
109
|
-
var h = !isExecute ? gh : createElement;
|
|
110
|
-
var slots = null;
|
|
111
|
-
if (!isNullOrUndefined(this.$slots.default)) {
|
|
112
|
-
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
113
|
-
}
|
|
114
|
-
return h('header', slots);
|
|
115
|
-
};
|
|
116
|
-
AppBarComponent.prototype.custom = function () {
|
|
117
|
-
this.updated();
|
|
118
|
-
};
|
|
119
|
-
AppBarComponent = __decorate([
|
|
120
|
-
EJComponentDecorator({
|
|
121
|
-
props: properties
|
|
122
|
-
}, isExecute)
|
|
123
|
-
,Options({
|
|
124
|
-
props: props,
|
|
125
|
-
watch: watch,
|
|
126
|
-
emits: emitProbs,
|
|
127
|
-
provide: function provide() {
|
|
128
|
-
return {
|
|
129
|
-
custom: this.custom
|
|
130
|
-
};
|
|
131
101
|
}
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
}
|
|
136
|
-
|
|
102
|
+
},
|
|
103
|
+
custom: function () {
|
|
104
|
+
this.updated();
|
|
105
|
+
},
|
|
106
|
+
}
|
|
107
|
+
});
|
|
137
108
|
export var AppBarPlugin = {
|
|
138
109
|
name: 'ejs-appbar',
|
|
139
110
|
install: function (Vue) {
|
|
@@ -1,37 +1,15 @@
|
|
|
1
|
-
import { ComponentBase } from '@syncfusion/ej2-vue-base';
|
|
2
1
|
export declare const properties: string[];
|
|
3
2
|
export declare const modelProps: string[];
|
|
4
3
|
export declare const testProp: any;
|
|
5
|
-
export declare const props: any;
|
|
6
|
-
export declare const watch: any;
|
|
7
|
-
export declare const emitProbs: any;
|
|
4
|
+
export declare const props: any, watch: any, emitProbs: any;
|
|
8
5
|
/**
|
|
9
6
|
* Represents the VueJS Breadcrumb Component.
|
|
10
7
|
* ```html
|
|
11
8
|
* <ejs-breadcrumb :items='breadcrumbItems'></ejs-breadcrumb>
|
|
12
9
|
* ```
|
|
13
10
|
*/
|
|
14
|
-
export declare
|
|
15
|
-
|
|
16
|
-
propKeys: string[];
|
|
17
|
-
models: string[];
|
|
18
|
-
hasChildDirective: boolean;
|
|
19
|
-
protected hasInjectedModules: boolean;
|
|
20
|
-
tagMapper: {
|
|
21
|
-
[key: string]: Object;
|
|
22
|
-
};
|
|
23
|
-
tagNameMapper: Object;
|
|
24
|
-
isVue3: boolean;
|
|
25
|
-
templateCollection: any;
|
|
26
|
-
constructor();
|
|
27
|
-
clearTemplate(templateNames?: string[]): any;
|
|
28
|
-
setProperties(prop: any, muteOnChange: boolean): void;
|
|
29
|
-
trigger(eventName: string, eventProp: {
|
|
30
|
-
[key: string]: Object;
|
|
31
|
-
}, successHandler?: Function): void;
|
|
32
|
-
render(createElement: any): any;
|
|
33
|
-
custom(): void;
|
|
34
|
-
}
|
|
11
|
+
export declare let BreadcrumbComponent: any;
|
|
12
|
+
export declare type BreadcrumbComponent = InstanceType<typeof BreadcrumbComponent>;
|
|
35
13
|
export declare const BreadcrumbPlugin: {
|
|
36
14
|
name: string;
|
|
37
15
|
install(Vue: any): void;
|
|
@@ -1,34 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
var extendStatics = function (d, b) {
|
|
3
|
-
extendStatics = Object.setPrototypeOf ||
|
|
4
|
-
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
-
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
|
6
|
-
return extendStatics(d, b);
|
|
7
|
-
};
|
|
8
|
-
return function (d, b) {
|
|
9
|
-
extendStatics(d, b);
|
|
10
|
-
function __() { this.constructor = d; }
|
|
11
|
-
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
12
|
-
};
|
|
13
|
-
})();
|
|
14
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
15
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
16
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
17
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
18
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
19
|
-
};
|
|
20
|
-
import { isUndefined } from '@syncfusion/ej2-base';
|
|
21
|
-
import { ComponentBase, EJComponentDecorator, getProps, gh, isExecute } from '@syncfusion/ej2-vue-base';
|
|
1
|
+
import { ComponentBase, gh, getProps, isExecute, vueDefineComponent } from '@syncfusion/ej2-vue-base';
|
|
22
2
|
import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
|
|
3
|
+
import { isUndefined } from '@syncfusion/ej2-base';
|
|
23
4
|
import { Breadcrumb } from '@syncfusion/ej2-navigations';
|
|
24
5
|
import { BreadcrumbItemsDirective, BreadcrumbItemDirective, BreadcrumbItemsPlugin, BreadcrumbItemPlugin } from './items.directive';
|
|
25
|
-
import { Options } from 'vue-class-component';
|
|
26
6
|
export var properties = ['isLazyUpdate', 'plugins', 'activeItem', 'cssClass', 'disabled', 'enableActiveItemNavigation', 'enableNavigation', 'enablePersistence', 'enableRtl', 'itemTemplate', 'items', 'locale', 'maxItems', 'overflowMode', 'separatorTemplate', 'url', 'beforeItemRender', 'created', 'itemClick'];
|
|
27
7
|
export var modelProps = ['activeItem'];
|
|
28
8
|
export var testProp = getProps({ props: properties });
|
|
29
|
-
export var props = testProp[0];
|
|
30
|
-
export var watch = testProp[1];
|
|
31
|
-
export var emitProbs = Object.keys(watch);
|
|
9
|
+
export var props = testProp[0], watch = testProp[1], emitProbs = Object.keys(watch);
|
|
32
10
|
emitProbs.push('modelchanged', 'update:modelValue');
|
|
33
11
|
for (var _i = 0, modelProps_1 = modelProps; _i < modelProps_1.length; _i++) {
|
|
34
12
|
var props_1 = modelProps_1[_i];
|
|
@@ -40,146 +18,137 @@ for (var _i = 0, modelProps_1 = modelProps; _i < modelProps_1.length; _i++) {
|
|
|
40
18
|
* <ejs-breadcrumb :items='breadcrumbItems'></ejs-breadcrumb>
|
|
41
19
|
* ```
|
|
42
20
|
*/
|
|
43
|
-
var BreadcrumbComponent =
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
21
|
+
export var BreadcrumbComponent = vueDefineComponent({
|
|
22
|
+
name: 'BreadcrumbComponent',
|
|
23
|
+
mixins: [ComponentBase],
|
|
24
|
+
props: props,
|
|
25
|
+
watch: watch,
|
|
26
|
+
emits: emitProbs,
|
|
27
|
+
model: { event: 'modelchanged' },
|
|
28
|
+
provide: function () { return { custom: this.custom }; },
|
|
29
|
+
data: function () {
|
|
30
|
+
return {
|
|
31
|
+
ej2Instances: new Breadcrumb({}),
|
|
32
|
+
propKeys: properties,
|
|
33
|
+
models: modelProps,
|
|
34
|
+
hasChildDirective: true,
|
|
35
|
+
hasInjectedModules: false,
|
|
36
|
+
tagMapper: { "e-breadcrumb-items": "e-breadcrumb-item" },
|
|
37
|
+
tagNameMapper: { "e-breadcrumb-items": "e-items" },
|
|
38
|
+
isVue3: !isExecute,
|
|
39
|
+
templateCollection: {},
|
|
40
|
+
};
|
|
41
|
+
},
|
|
42
|
+
created: function () {
|
|
43
|
+
this.ej2Instances._trigger = this.ej2Instances.trigger;
|
|
44
|
+
this.ej2Instances.trigger = this.trigger;
|
|
45
|
+
this.bindProperties();
|
|
46
|
+
this.ej2Instances._setProperties = this.ej2Instances.setProperties;
|
|
47
|
+
this.ej2Instances.setProperties = this.setProperties;
|
|
48
|
+
this.ej2Instances.clearTemplate = this.clearTemplate;
|
|
49
|
+
this.updated = this.updated;
|
|
50
|
+
},
|
|
51
|
+
render: function (createElement) {
|
|
52
|
+
var h = !isExecute ? gh : createElement;
|
|
53
|
+
var slots = null;
|
|
54
|
+
if (!isNullOrUndefined(this.$slots.default)) {
|
|
55
|
+
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
67
56
|
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
57
|
+
return h('nav', slots);
|
|
58
|
+
},
|
|
59
|
+
methods: {
|
|
60
|
+
clearTemplate: function (templateNames) {
|
|
61
|
+
if (!templateNames) {
|
|
62
|
+
templateNames = Object.keys(this.templateCollection || {});
|
|
63
|
+
}
|
|
64
|
+
if (templateNames.length && this.templateCollection) {
|
|
65
|
+
for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
|
|
66
|
+
var tempName = templateNames_1[_i];
|
|
67
|
+
var elementCollection = this.templateCollection[tempName];
|
|
68
|
+
if (elementCollection && elementCollection.length) {
|
|
69
|
+
for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
|
|
70
|
+
var ele = elementCollection_1[_a];
|
|
71
|
+
var destroy = getValue('__vue__.$destroy', ele);
|
|
72
|
+
if (destroy) {
|
|
73
|
+
ele.__vue__.$destroy();
|
|
74
|
+
}
|
|
75
|
+
if (ele.innerHTML) {
|
|
76
|
+
ele.innerHTML = '';
|
|
77
|
+
}
|
|
81
78
|
}
|
|
79
|
+
delete this.templateCollection[tempName];
|
|
82
80
|
}
|
|
83
|
-
delete this.templateCollection[tempName];
|
|
84
81
|
}
|
|
85
82
|
}
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
83
|
+
},
|
|
84
|
+
setProperties: function (prop, muteOnChange) {
|
|
85
|
+
var _this = this;
|
|
86
|
+
if (this.isVue3) {
|
|
87
|
+
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
88
|
+
}
|
|
89
|
+
if (this.ej2Instances && this.ej2Instances._setProperties) {
|
|
90
|
+
this.ej2Instances._setProperties(prop, muteOnChange);
|
|
91
|
+
}
|
|
92
|
+
if (prop && this.models && this.models.length) {
|
|
93
|
+
Object.keys(prop).map(function (key) {
|
|
94
|
+
_this.models.map(function (model) {
|
|
95
|
+
if ((key === model) && !(/datasource/i.test(key))) {
|
|
96
|
+
if (_this.isVue3) {
|
|
97
|
+
_this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
|
|
98
|
+
}
|
|
99
|
+
else {
|
|
100
|
+
_this.$emit('update:' + key, prop[key]);
|
|
101
|
+
_this.$emit('modelchanged', prop[key]);
|
|
102
|
+
}
|
|
102
103
|
}
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
104
|
+
});
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
},
|
|
108
|
+
trigger: function (eventName, eventProp, successHandler) {
|
|
109
|
+
if (!isExecute) {
|
|
110
|
+
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
111
|
+
}
|
|
112
|
+
if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
|
|
113
|
+
var key = this.models.toString().match(/checked|value/) || [];
|
|
114
|
+
var propKey = key[0];
|
|
115
|
+
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
116
|
+
if (!isExecute) {
|
|
117
|
+
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
118
|
+
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
119
|
+
this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
|
|
120
|
+
}
|
|
121
|
+
else {
|
|
122
|
+
if (eventName === 'change' || (this.$props && !this.$props.isLazyUpdate)) {
|
|
123
|
+
this.$emit('update:' + propKey, eventProp[propKey]);
|
|
124
|
+
this.$emit('modelchanged', eventProp[propKey]);
|
|
106
125
|
}
|
|
107
126
|
}
|
|
108
|
-
});
|
|
109
|
-
});
|
|
110
|
-
}
|
|
111
|
-
};
|
|
112
|
-
BreadcrumbComponent.prototype.trigger = function (eventName, eventProp, successHandler) {
|
|
113
|
-
if (!isExecute) {
|
|
114
|
-
this.models = !this.models ? this.ej2Instances.referModels : this.models;
|
|
115
|
-
}
|
|
116
|
-
if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
|
|
117
|
-
var key = this.models.toString().match(/checked|value/) || [];
|
|
118
|
-
var propKey = key[0];
|
|
119
|
-
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
120
|
-
if (!isExecute) {
|
|
121
|
-
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
122
|
-
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
123
|
-
this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
|
|
124
127
|
}
|
|
125
|
-
|
|
126
|
-
|
|
128
|
+
}
|
|
129
|
+
else if ((eventName === 'actionBegin' && eventProp.requestType === 'dateNavigate') && this.models && (this.models.length !== 0)) {
|
|
130
|
+
var key = this.models.toString().match(/currentView|selectedDate/) || [];
|
|
131
|
+
var propKey = key[0];
|
|
132
|
+
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
133
|
+
if (!isExecute) {
|
|
134
|
+
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
135
|
+
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
136
|
+
}
|
|
137
|
+
else {
|
|
127
138
|
this.$emit('update:' + propKey, eventProp[propKey]);
|
|
128
139
|
this.$emit('modelchanged', eventProp[propKey]);
|
|
129
140
|
}
|
|
130
141
|
}
|
|
131
142
|
}
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
var key = this.models.toString().match(/currentView|selectedDate/) || [];
|
|
135
|
-
var propKey = key[0];
|
|
136
|
-
if (eventProp && key && !isUndefined(eventProp[propKey])) {
|
|
137
|
-
if (!isExecute) {
|
|
138
|
-
this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
|
|
139
|
-
this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
|
|
140
|
-
}
|
|
141
|
-
else {
|
|
142
|
-
this.$emit('update:' + propKey, eventProp[propKey]);
|
|
143
|
-
this.$emit('modelchanged', eventProp[propKey]);
|
|
144
|
-
}
|
|
143
|
+
if ((this.ej2Instances && this.ej2Instances._trigger)) {
|
|
144
|
+
this.ej2Instances._trigger(eventName, eventProp, successHandler);
|
|
145
145
|
}
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
this.
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
var h = !isExecute ? gh : createElement;
|
|
153
|
-
var slots = null;
|
|
154
|
-
if (!isNullOrUndefined(this.$slots.default)) {
|
|
155
|
-
slots = !isExecute ? this.$slots.default() : this.$slots.default;
|
|
156
|
-
}
|
|
157
|
-
return h('nav', slots);
|
|
158
|
-
};
|
|
159
|
-
BreadcrumbComponent.prototype.custom = function () {
|
|
160
|
-
this.updated();
|
|
161
|
-
};
|
|
162
|
-
BreadcrumbComponent = __decorate([
|
|
163
|
-
EJComponentDecorator({
|
|
164
|
-
props: properties,
|
|
165
|
-
model: {
|
|
166
|
-
event: 'modelchanged'
|
|
167
|
-
}
|
|
168
|
-
}, isExecute)
|
|
169
|
-
,Options({
|
|
170
|
-
props: props,
|
|
171
|
-
watch: watch,
|
|
172
|
-
emits: emitProbs,
|
|
173
|
-
provide: function provide() {
|
|
174
|
-
return {
|
|
175
|
-
custom: this.custom
|
|
176
|
-
};
|
|
177
|
-
}
|
|
178
|
-
})
|
|
179
|
-
], BreadcrumbComponent);
|
|
180
|
-
return BreadcrumbComponent;
|
|
181
|
-
}(ComponentBase));
|
|
182
|
-
export { BreadcrumbComponent };
|
|
146
|
+
},
|
|
147
|
+
custom: function () {
|
|
148
|
+
this.updated();
|
|
149
|
+
},
|
|
150
|
+
}
|
|
151
|
+
});
|
|
183
152
|
export var BreadcrumbPlugin = {
|
|
184
153
|
name: 'ejs-breadcrumb',
|
|
185
154
|
install: function (Vue) {
|
|
@@ -1,10 +1,4 @@
|
|
|
1
|
-
declare let
|
|
2
|
-
export declare class BreadcrumbItemsDirective extends vueImport {
|
|
3
|
-
constructor();
|
|
4
|
-
render(createElement: any): void;
|
|
5
|
-
updated(): void;
|
|
6
|
-
getTag(): string;
|
|
7
|
-
}
|
|
1
|
+
export declare let BreadcrumbItemsDirective: any;
|
|
8
2
|
export declare const BreadcrumbItemsPlugin: {
|
|
9
3
|
name: string;
|
|
10
4
|
install(Vue: any): void;
|
|
@@ -21,12 +15,8 @@ export declare const BreadcrumbItemsPlugin: {
|
|
|
21
15
|
* </ejs-breadcrumb>
|
|
22
16
|
* ```
|
|
23
17
|
*/
|
|
24
|
-
export declare
|
|
25
|
-
render(): void;
|
|
26
|
-
getTag(): string;
|
|
27
|
-
}
|
|
18
|
+
export declare let BreadcrumbItemDirective: any;
|
|
28
19
|
export declare const BreadcrumbItemPlugin: {
|
|
29
20
|
name: string;
|
|
30
21
|
install(Vue: any): void;
|
|
31
22
|
};
|
|
32
|
-
export {};
|