@syncfusion/ej2-filemanager 33.2.4 → 33.2.6
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/dist/ej2-filemanager.min.js +2 -2
- package/dist/ej2-filemanager.umd.min.js +2 -2
- package/dist/ej2-filemanager.umd.min.js.map +1 -1
- package/dist/es6/ej2-filemanager.es2015.js +49 -22
- package/dist/es6/ej2-filemanager.es2015.js.map +1 -1
- package/dist/es6/ej2-filemanager.es5.js +49 -22
- package/dist/es6/ej2-filemanager.es5.js.map +1 -1
- package/dist/global/ej2-filemanager.min.js +2 -2
- package/dist/global/ej2-filemanager.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +8 -8
- package/src/file-manager/actions/breadcrumb-bar.d.ts +5 -0
- package/src/file-manager/actions/breadcrumb-bar.js +41 -19
- package/src/file-manager/base/file-manager.d.ts +1 -0
- package/src/file-manager/base/file-manager.js +3 -0
- package/src/file-manager/base/interface.d.ts +1 -0
- package/src/file-manager/layout/large-icons-view.js +5 -3
package/dist/global/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* filename: index.d.ts
|
|
3
|
-
* version : 33.2.
|
|
3
|
+
* version : 33.2.6
|
|
4
4
|
* Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
|
|
5
5
|
* Use of this code is subject to the terms of our license.
|
|
6
6
|
* A copy of the current license can be obtained at any time by e-mailing
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@syncfusion/ej2-filemanager",
|
|
3
|
-
"version": "33.2.
|
|
3
|
+
"version": "33.2.6",
|
|
4
4
|
"description": "Essential JS 2 FileManager Component",
|
|
5
5
|
"author": "Syncfusion Inc.",
|
|
6
6
|
"license": "SEE LICENSE IN license",
|
|
@@ -9,15 +9,15 @@
|
|
|
9
9
|
"es2015": "./dist/es6/ej2-filemanager.es5.js",
|
|
10
10
|
"dependencies": {
|
|
11
11
|
"@syncfusion/ej2-base": "~33.2.3",
|
|
12
|
-
"@syncfusion/ej2-buttons": "~33.2.
|
|
13
|
-
"@syncfusion/ej2-data": "~33.2.
|
|
14
|
-
"@syncfusion/ej2-grids": "~33.2.
|
|
15
|
-
"@syncfusion/ej2-inputs": "~33.2.
|
|
12
|
+
"@syncfusion/ej2-buttons": "~33.2.5",
|
|
13
|
+
"@syncfusion/ej2-data": "~33.2.5",
|
|
14
|
+
"@syncfusion/ej2-grids": "~33.2.5",
|
|
15
|
+
"@syncfusion/ej2-inputs": "~33.2.5",
|
|
16
16
|
"@syncfusion/ej2-layouts": "~33.2.3",
|
|
17
17
|
"@syncfusion/ej2-lists": "~33.2.3",
|
|
18
|
-
"@syncfusion/ej2-navigations": "~33.2.
|
|
19
|
-
"@syncfusion/ej2-popups": "~33.2.
|
|
20
|
-
"@syncfusion/ej2-splitbuttons": "~33.2.
|
|
18
|
+
"@syncfusion/ej2-navigations": "~33.2.6",
|
|
19
|
+
"@syncfusion/ej2-popups": "~33.2.5",
|
|
20
|
+
"@syncfusion/ej2-splitbuttons": "~33.2.6"
|
|
21
21
|
},
|
|
22
22
|
"devDependencies": {},
|
|
23
23
|
"keywords": [
|
|
@@ -13,6 +13,10 @@ export declare class BreadCrumbBar {
|
|
|
13
13
|
private searchTimer;
|
|
14
14
|
private keyConfigs;
|
|
15
15
|
private searchWrapWidth;
|
|
16
|
+
private boundSearchChangeHandler;
|
|
17
|
+
private boundOnKeyUp;
|
|
18
|
+
private searchIcon;
|
|
19
|
+
private searchSibling;
|
|
16
20
|
/**
|
|
17
21
|
* constructor for addressbar module
|
|
18
22
|
*
|
|
@@ -24,6 +28,7 @@ export declare class BreadCrumbBar {
|
|
|
24
28
|
constructor(parent?: IFileManager);
|
|
25
29
|
private onPropertyChanged;
|
|
26
30
|
private render;
|
|
31
|
+
private setBreadcrumbNavAttributes;
|
|
27
32
|
onPathChange(): void;
|
|
28
33
|
private updateBreadCrumbBar;
|
|
29
34
|
private onFocus;
|
|
@@ -23,10 +23,14 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
23
23
|
this.addressBarLink = '';
|
|
24
24
|
this.searchTimer = null;
|
|
25
25
|
this.searchWrapWidth = null;
|
|
26
|
+
this.searchIcon = null;
|
|
27
|
+
this.searchSibling = null;
|
|
26
28
|
this.parent = parent;
|
|
27
29
|
this.keyConfigs = {
|
|
28
30
|
enter: 'enter'
|
|
29
31
|
};
|
|
32
|
+
this.boundSearchChangeHandler = this.searchChangeHandler.bind(this);
|
|
33
|
+
this.boundOnKeyUp = this.onKeyUp.bind(this);
|
|
30
34
|
this.render();
|
|
31
35
|
}
|
|
32
36
|
BreadCrumbBar.prototype.onPropertyChanged = function (e) {
|
|
@@ -51,8 +55,15 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
51
55
|
}
|
|
52
56
|
};
|
|
53
57
|
BreadCrumbBar.prototype.render = function () {
|
|
58
|
+
this.setBreadcrumbNavAttributes();
|
|
54
59
|
this.addEventListener();
|
|
55
60
|
};
|
|
61
|
+
BreadCrumbBar.prototype.setBreadcrumbNavAttributes = function () {
|
|
62
|
+
var navElement = this.parent && this.parent.breadCrumbNavElement;
|
|
63
|
+
if (navElement) {
|
|
64
|
+
navElement.setAttribute('aria-label', 'Breadcrumb');
|
|
65
|
+
}
|
|
66
|
+
};
|
|
56
67
|
BreadCrumbBar.prototype.onPathChange = function () {
|
|
57
68
|
var pathNames = this.parent.pathNames;
|
|
58
69
|
var paths = this.parent.path.split('/');
|
|
@@ -73,7 +84,6 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
73
84
|
addressbarLI.appendChild(icon);
|
|
74
85
|
}
|
|
75
86
|
addressbarLI.setAttribute('tabindex', '0');
|
|
76
|
-
addressbarLI.setAttribute('role', 'link');
|
|
77
87
|
var pathLabel = pathNames.slice(0, i + 1).join(' / ');
|
|
78
88
|
addressbarLI.setAttribute('aria-label', pathLabel);
|
|
79
89
|
if (pathNamesLen - i === 1) {
|
|
@@ -81,24 +91,24 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
81
91
|
}
|
|
82
92
|
id = '';
|
|
83
93
|
addressATag = createElement('a', { className: CLS.LIST_TEXT });
|
|
84
|
-
addressATag.setAttribute('role', '
|
|
94
|
+
addressATag.setAttribute('role', 'link');
|
|
85
95
|
addressATag.innerText = pathNames[i];
|
|
86
96
|
addressbarLI.appendChild(addressATag);
|
|
87
97
|
addressbarUL.appendChild(addressbarLI);
|
|
88
98
|
}
|
|
89
|
-
var ulElement = this.parent.
|
|
99
|
+
var ulElement = this.parent.breadCrumbNavElement.querySelector('.e-addressbar-ul');
|
|
90
100
|
if (!isNullOrUndefined(ulElement)) {
|
|
91
101
|
if (!isNullOrUndefined(this.subMenuObj)) {
|
|
92
102
|
this.subMenuObj.destroy();
|
|
93
103
|
}
|
|
94
104
|
remove(ulElement);
|
|
95
105
|
}
|
|
96
|
-
var searchWrap = this.parent.
|
|
106
|
+
var searchWrap = this.parent.breadCrumbNavElement.querySelector('.e-search-wrap');
|
|
97
107
|
if (!searchWrap) {
|
|
98
|
-
this.parent.
|
|
108
|
+
this.parent.breadCrumbNavElement.insertBefore(addressbarUL, searchWrap);
|
|
99
109
|
}
|
|
100
110
|
else {
|
|
101
|
-
this.parent.
|
|
111
|
+
this.parent.breadCrumbNavElement.appendChild(addressbarUL);
|
|
102
112
|
}
|
|
103
113
|
this.updateBreadCrumbBar(addressbarUL);
|
|
104
114
|
}
|
|
@@ -106,7 +116,7 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
106
116
|
/* istanbul ignore next */
|
|
107
117
|
BreadCrumbBar.prototype.updateBreadCrumbBar = function (addresBarUL) {
|
|
108
118
|
var liElements = addresBarUL.querySelectorAll('li');
|
|
109
|
-
var ulElement = this.parent.
|
|
119
|
+
var ulElement = this.parent.breadCrumbNavElement.querySelector('.e-addressbar-ul');
|
|
110
120
|
var style = window.getComputedStyle(ulElement, null);
|
|
111
121
|
var pRight = parseFloat(style.getPropertyValue('padding-right'));
|
|
112
122
|
var pLeft = parseFloat(style.getPropertyValue('padding-left'));
|
|
@@ -128,12 +138,12 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
128
138
|
var searchInput = createElement('input', { id: id,
|
|
129
139
|
attrs: { autocomplete: 'off', 'aria-label': getLocaleText(this.parent, 'Search') } });
|
|
130
140
|
searchContainer.appendChild(searchInput);
|
|
131
|
-
var searchEle = this.parent.
|
|
141
|
+
var searchEle = this.parent.breadCrumbNavElement.querySelector('.e-search-wrap .e-input');
|
|
132
142
|
if (isNullOrUndefined(searchEle)) {
|
|
133
|
-
this.parent.
|
|
134
|
-
|
|
135
|
-
EventHandler.add(
|
|
136
|
-
searchInput.parentElement.insertBefore(
|
|
143
|
+
this.parent.breadCrumbNavElement.appendChild(searchContainer);
|
|
144
|
+
this.searchIcon = createElement('span', { className: 'e-icons e-fe-search' });
|
|
145
|
+
EventHandler.add(this.searchIcon, 'click', this.onShowInput, this);
|
|
146
|
+
searchInput.parentElement.insertBefore(this.searchIcon, searchInput);
|
|
137
147
|
this.searchObj = new TextBox({
|
|
138
148
|
value: '',
|
|
139
149
|
showClearButton: true,
|
|
@@ -143,11 +153,11 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
143
153
|
});
|
|
144
154
|
this.searchObj.appendTo('#' + this.parent.element.id + CLS.SEARCH_ID);
|
|
145
155
|
this.searchEventBind(this.parent.searchSettings.allowSearchOnTyping);
|
|
146
|
-
|
|
147
|
-
EventHandler.add(
|
|
148
|
-
EventHandler.add(this.searchObj.element, 'keyup', this.
|
|
156
|
+
this.searchSibling = this.searchObj.element.nextElementSibling;
|
|
157
|
+
EventHandler.add(this.searchSibling, 'mousedown', this.boundSearchChangeHandler, this);
|
|
158
|
+
EventHandler.add(this.searchObj.element, 'keyup', this.boundOnKeyUp, this);
|
|
149
159
|
}
|
|
150
|
-
var searchWrap = this.parent.
|
|
160
|
+
var searchWrap = this.parent.breadCrumbNavElement.querySelector('.e-search-wrap');
|
|
151
161
|
breadCrumbBarWidth = breadCrumbBarWidth - (this.searchWrapWidth ? this.searchWrapWidth : searchWrap.offsetWidth);
|
|
152
162
|
if (liElementsWidth > breadCrumbBarWidth) {
|
|
153
163
|
var i = liElements.length;
|
|
@@ -185,10 +195,10 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
185
195
|
break;
|
|
186
196
|
}
|
|
187
197
|
}
|
|
188
|
-
this.parent.
|
|
198
|
+
this.parent.breadCrumbNavElement.insertBefore(addressbarUL, searchWrap);
|
|
189
199
|
}
|
|
190
200
|
else {
|
|
191
|
-
this.parent.
|
|
201
|
+
this.parent.breadCrumbNavElement.insertBefore(addresBarUL, searchWrap);
|
|
192
202
|
}
|
|
193
203
|
};
|
|
194
204
|
/* istanbul ignore next */
|
|
@@ -267,7 +277,7 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
267
277
|
this.searchWrapWidth = null;
|
|
268
278
|
}
|
|
269
279
|
else {
|
|
270
|
-
var searchWrap = this.parent.
|
|
280
|
+
var searchWrap = this.parent.breadCrumbNavElement.querySelector('.e-search-wrap');
|
|
271
281
|
this.searchWrapWidth = searchWrap.offsetWidth;
|
|
272
282
|
addClass([this.parent.element], CLS.FILTER);
|
|
273
283
|
this.searchObj.element.focus();
|
|
@@ -368,6 +378,18 @@ var BreadCrumbBar = /** @class */ (function () {
|
|
|
368
378
|
this.parent.off(events.dropInit, this.onDropInit);
|
|
369
379
|
this.parent.off(events.layoutRefresh, this.onResize);
|
|
370
380
|
this.parent.off(events.dropPath, this.onPathChange);
|
|
381
|
+
if (this.parent.breadCrumbBarNavigation) {
|
|
382
|
+
EventHandler.remove(this.parent.breadCrumbBarNavigation, 'click', this.addressPathClickHandler);
|
|
383
|
+
}
|
|
384
|
+
if (this.searchIcon) {
|
|
385
|
+
EventHandler.remove(this.searchIcon, 'click', this.onShowInput);
|
|
386
|
+
}
|
|
387
|
+
if (this.searchSibling) {
|
|
388
|
+
EventHandler.remove(this.searchSibling, 'mousedown', this.boundSearchChangeHandler);
|
|
389
|
+
}
|
|
390
|
+
if (this.searchObj && this.searchObj.element) {
|
|
391
|
+
EventHandler.remove(this.searchObj.element, 'keyup', this.boundOnKeyUp);
|
|
392
|
+
}
|
|
371
393
|
};
|
|
372
394
|
/* istanbul ignore next */
|
|
373
395
|
BreadCrumbBar.prototype.onDropInit = function (args) {
|
|
@@ -119,6 +119,7 @@ export declare class FileManager extends Component<HTMLElement> implements INoti
|
|
|
119
119
|
splitterObj: Splitter;
|
|
120
120
|
persistData: boolean;
|
|
121
121
|
breadCrumbBarNavigation: HTMLElement;
|
|
122
|
+
breadCrumbNavElement: HTMLElement;
|
|
122
123
|
localeObj: L10n;
|
|
123
124
|
uploadObj: Uploader;
|
|
124
125
|
uploadDialogObj: Dialog;
|
|
@@ -289,6 +289,8 @@ var FileManager = /** @class */ (function (_super) {
|
|
|
289
289
|
id: this.element.id + CLS.BREADCRUMBBAR_ID,
|
|
290
290
|
className: CLS.BREADCRUMBS
|
|
291
291
|
});
|
|
292
|
+
this.breadCrumbNavElement = this.createElement('nav');
|
|
293
|
+
this.breadCrumbBarNavigation.appendChild(this.breadCrumbNavElement);
|
|
292
294
|
contentWrap.appendChild(this.breadCrumbBarNavigation);
|
|
293
295
|
var gridWrap = this.createElement('div', {
|
|
294
296
|
id: this.element.id + CLS.GRID_ID
|
|
@@ -1157,6 +1159,7 @@ var FileManager = /** @class */ (function (_super) {
|
|
|
1157
1159
|
removeClass([this.element], [CLS.RTL, CLS.MOBILE, CLS.CHECK_SELECT]);
|
|
1158
1160
|
this.element.innerHTML = '';
|
|
1159
1161
|
this.breadCrumbBarNavigation = null;
|
|
1162
|
+
this.breadCrumbNavElement = null;
|
|
1160
1163
|
this.activeElements = null;
|
|
1161
1164
|
this.virtualDragElement = null;
|
|
1162
1165
|
this.visitedItem = null;
|
|
@@ -822,6 +822,7 @@ export interface IFileManager extends Component<HTMLElement> {
|
|
|
822
822
|
extDialogObj: Dialog;
|
|
823
823
|
splitterObj: Splitter;
|
|
824
824
|
breadCrumbBarNavigation: HTMLElement;
|
|
825
|
+
breadCrumbNavElement: HTMLElement;
|
|
825
826
|
searchSettings: SearchSettingsModel;
|
|
826
827
|
activeElements: Element[];
|
|
827
828
|
contextMenuSettings: ContextMenuSettingsModel;
|
|
@@ -762,13 +762,15 @@ var LargeIconsView = /** @class */ (function () {
|
|
|
762
762
|
}
|
|
763
763
|
};
|
|
764
764
|
LargeIconsView.prototype.destroy = function () {
|
|
765
|
-
if (this.parent.isDestroyed) {
|
|
766
|
-
return;
|
|
767
|
-
}
|
|
768
765
|
this.removeEventListener();
|
|
769
766
|
if (this.listObj) {
|
|
770
767
|
this.unWireEvents();
|
|
771
768
|
}
|
|
769
|
+
if (this.itemList) {
|
|
770
|
+
this.itemList.forEach(function (el) {
|
|
771
|
+
el.ondragstart = null;
|
|
772
|
+
});
|
|
773
|
+
}
|
|
772
774
|
this.startItem = null;
|
|
773
775
|
this.listElements = null;
|
|
774
776
|
};
|