@whitesev/pops 1.9.7 → 2.0.0
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/index.amd.js +225 -173
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +225 -173
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +225 -173
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +225 -173
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +225 -173
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +225 -173
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/utils/PopsSafeUtils.d.ts +6 -0
- package/package.json +1 -1
- package/src/Pops.ts +4 -3
- package/src/components/folder/index.ts +45 -32
- package/src/components/panel/PanelHandleContentDetails.ts +176 -132
- package/src/components/rightClickMenu/index.ts +9 -3
- package/src/components/searchSuggestion/index.ts +13 -4
- package/src/components/tooltip/index.ts +2 -1
- package/src/utils/PopsDOMUtils.ts +9 -3
- package/src/utils/PopsSafeUtils.ts +22 -0
package/dist/index.system.js
CHANGED
|
@@ -315,6 +315,31 @@ System.register('pops', [], (function (exports) {
|
|
|
315
315
|
}
|
|
316
316
|
const popsUtils = new PopsUtils();
|
|
317
317
|
|
|
318
|
+
const PopsSafeUtils = {
|
|
319
|
+
/**
|
|
320
|
+
* 设置安全的html
|
|
321
|
+
*/
|
|
322
|
+
setSafeHTML($el, text) {
|
|
323
|
+
// 创建 TrustedHTML 策略（需 CSP 允许）
|
|
324
|
+
try {
|
|
325
|
+
$el.innerHTML = text;
|
|
326
|
+
}
|
|
327
|
+
catch (error) {
|
|
328
|
+
// @ts-ignore
|
|
329
|
+
if (globalThis.trustedTypes) {
|
|
330
|
+
// @ts-ignore
|
|
331
|
+
const policy = globalThis.trustedTypes.createPolicy("safe-innerHTML", {
|
|
332
|
+
createHTML: (html) => html,
|
|
333
|
+
});
|
|
334
|
+
$el.innerHTML = policy.createHTML(text);
|
|
335
|
+
}
|
|
336
|
+
else {
|
|
337
|
+
throw new Error("trustedTypes is not defined");
|
|
338
|
+
}
|
|
339
|
+
}
|
|
340
|
+
},
|
|
341
|
+
};
|
|
342
|
+
|
|
318
343
|
class PopsDOMUtilsEvent {
|
|
319
344
|
on(element, eventType, selector, callback, option) {
|
|
320
345
|
/**
|
|
@@ -1252,7 +1277,7 @@ System.register('pops', [], (function (exports) {
|
|
|
1252
1277
|
attributes) {
|
|
1253
1278
|
let tempElement = PopsCore.document.createElement(tagName);
|
|
1254
1279
|
if (typeof property === "string") {
|
|
1255
|
-
tempElement
|
|
1280
|
+
PopsSafeUtils.setSafeHTML(tempElement, property);
|
|
1256
1281
|
return tempElement;
|
|
1257
1282
|
}
|
|
1258
1283
|
if (property == null) {
|
|
@@ -1263,6 +1288,11 @@ System.register('pops', [], (function (exports) {
|
|
|
1263
1288
|
}
|
|
1264
1289
|
Object.keys(property).forEach((key) => {
|
|
1265
1290
|
let value = property[key];
|
|
1291
|
+
if (key === "innerHTML") {
|
|
1292
|
+
PopsSafeUtils.setSafeHTML(tempElement, value);
|
|
1293
|
+
return;
|
|
1294
|
+
}
|
|
1295
|
+
// @ts-ignore
|
|
1266
1296
|
tempElement[key] = value;
|
|
1267
1297
|
});
|
|
1268
1298
|
Object.keys(attributes).forEach((key) => {
|
|
@@ -1465,7 +1495,7 @@ System.register('pops', [], (function (exports) {
|
|
|
1465
1495
|
}
|
|
1466
1496
|
function parseHTMLByCreateDom() {
|
|
1467
1497
|
let tempDIV = PopsCore.document.createElement("div");
|
|
1468
|
-
tempDIV
|
|
1498
|
+
PopsSafeUtils.setSafeHTML(tempDIV, html);
|
|
1469
1499
|
if (isComplete) {
|
|
1470
1500
|
return tempDIV;
|
|
1471
1501
|
}
|
|
@@ -4861,26 +4891,29 @@ System.register('pops', [], (function (exports) {
|
|
|
4861
4891
|
fileNameElement.className = "pops-folder-list-table__body-td";
|
|
4862
4892
|
fileTimeElement.className = "pops-folder-list-table__body-td";
|
|
4863
4893
|
fileFormatSize.className = "pops-folder-list-table__body-td";
|
|
4864
|
-
fileNameElement
|
|
4865
|
-
|
|
4866
|
-
|
|
4867
|
-
|
|
4868
|
-
|
|
4869
|
-
|
|
4870
|
-
|
|
4871
|
-
|
|
4872
|
-
|
|
4873
|
-
|
|
4874
|
-
|
|
4875
|
-
|
|
4876
|
-
|
|
4877
|
-
|
|
4878
|
-
|
|
4879
|
-
|
|
4880
|
-
|
|
4881
|
-
|
|
4882
|
-
|
|
4883
|
-
|
|
4894
|
+
PopsSafeUtils.setSafeHTML(fileNameElement,
|
|
4895
|
+
/*html*/ `
|
|
4896
|
+
<div class="pops-folder-list-file-name cursor-p">
|
|
4897
|
+
<div>
|
|
4898
|
+
<img src="${fileIcon}" alt="${fileType}" class="pops-folder-list-file-icon u-file-icon u-file-icon--list">
|
|
4899
|
+
<a title="${fileName}" class="pops-folder-list-file-name-title-text inline-block-v-middle text-ellip list-name-text">
|
|
4900
|
+
${fileName}
|
|
4901
|
+
</a>
|
|
4902
|
+
</div>
|
|
4903
|
+
</div>
|
|
4904
|
+
`);
|
|
4905
|
+
PopsSafeUtils.setSafeHTML(fileTimeElement,
|
|
4906
|
+
/*html*/ `
|
|
4907
|
+
<div class="pops-folder-list__time">
|
|
4908
|
+
<span>${latestTime}</span>
|
|
4909
|
+
</div>
|
|
4910
|
+
`);
|
|
4911
|
+
PopsSafeUtils.setSafeHTML(fileFormatSize,
|
|
4912
|
+
/*html*/ `
|
|
4913
|
+
<div class="pops-folder-list-format-size">
|
|
4914
|
+
<span>${fileSize}</span>
|
|
4915
|
+
</div>
|
|
4916
|
+
`);
|
|
4884
4917
|
/* 存储原来的值 */
|
|
4885
4918
|
let __value__ = {
|
|
4886
4919
|
fileName: origin_fileName,
|
|
@@ -4941,17 +4974,18 @@ System.register('pops', [], (function (exports) {
|
|
|
4941
4974
|
}
|
|
4942
4975
|
folderELement.className = "pops-folder-list-table__body-row";
|
|
4943
4976
|
fileNameElement.className = "pops-folder-list-table__body-td";
|
|
4944
|
-
fileNameElement
|
|
4945
|
-
|
|
4946
|
-
|
|
4947
|
-
|
|
4948
|
-
|
|
4949
|
-
|
|
4950
|
-
|
|
4951
|
-
|
|
4952
|
-
|
|
4953
|
-
|
|
4954
|
-
|
|
4977
|
+
PopsSafeUtils.setSafeHTML(fileNameElement,
|
|
4978
|
+
/*html*/ `
|
|
4979
|
+
<div class="pops-folder-list-file-name pops-mobile-folder-list-file-name cursor-p">
|
|
4980
|
+
<img src="${fileIcon}" alt="${fileType}" class="pops-folder-list-file-icon u-file-icon u-file-icon--list">
|
|
4981
|
+
<div>
|
|
4982
|
+
<a title="${fileName}" class="pops-folder-list-file-name-title-text inline-block-v-middle text-ellip list-name-text">
|
|
4983
|
+
${fileName}
|
|
4984
|
+
</a>
|
|
4985
|
+
<span>${latestTime} ${fileSize}</span>
|
|
4986
|
+
</div>
|
|
4987
|
+
</div>
|
|
4988
|
+
`);
|
|
4955
4989
|
/* 存储原来的值 */
|
|
4956
4990
|
let __value__ = {
|
|
4957
4991
|
fileName: origin_fileName,
|
|
@@ -4971,7 +5005,7 @@ System.register('pops', [], (function (exports) {
|
|
|
4971
5005
|
* 清空每行的元素
|
|
4972
5006
|
*/
|
|
4973
5007
|
function clearFolerRow() {
|
|
4974
|
-
folderListBodyElement
|
|
5008
|
+
PopsSafeUtils.setSafeHTML(folderListBodyElement, "");
|
|
4975
5009
|
}
|
|
4976
5010
|
function getArrowIconElement() {
|
|
4977
5011
|
let iconArrowElement = popsDOMUtils.createElement("div", {
|
|
@@ -5970,8 +6004,8 @@ System.register('pops', [], (function (exports) {
|
|
|
5970
6004
|
* 清空container容器的元素
|
|
5971
6005
|
*/
|
|
5972
6006
|
clearContainer() {
|
|
5973
|
-
this.sectionContainerHeaderULElement
|
|
5974
|
-
this.sectionContainerULElement
|
|
6007
|
+
PopsSafeUtils.setSafeHTML(this.sectionContainerHeaderULElement, "");
|
|
6008
|
+
PopsSafeUtils.setSafeHTML(this.sectionContainerULElement, "");
|
|
5975
6009
|
this.$el.$content
|
|
5976
6010
|
?.querySelectorAll("section.pops-panel-deepMenu-container")
|
|
5977
6011
|
.forEach((ele) => ele.remove());
|
|
@@ -6057,8 +6091,9 @@ System.register('pops', [], (function (exports) {
|
|
|
6057
6091
|
createAsideItem(asideConfig) {
|
|
6058
6092
|
let liElement = document.createElement("li");
|
|
6059
6093
|
liElement.id = asideConfig.id;
|
|
6094
|
+
// @ts-ignore
|
|
6060
6095
|
liElement["__forms__"] = asideConfig.forms;
|
|
6061
|
-
liElement
|
|
6096
|
+
PopsSafeUtils.setSafeHTML(liElement, asideConfig.title);
|
|
6062
6097
|
/* 处理className */
|
|
6063
6098
|
this.setElementClassName(liElement, asideConfig.className);
|
|
6064
6099
|
this.setElementAttributes(liElement, asideConfig.attributes);
|
|
@@ -6081,18 +6116,19 @@ System.register('pops', [], (function (exports) {
|
|
|
6081
6116
|
if (Boolean(formConfig.description)) {
|
|
6082
6117
|
leftDescriptionText = /*html*/ `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
6083
6118
|
}
|
|
6084
|
-
liElement
|
|
6085
|
-
|
|
6086
|
-
<
|
|
6087
|
-
|
|
6088
|
-
|
|
6089
|
-
|
|
6090
|
-
<
|
|
6091
|
-
|
|
6092
|
-
<
|
|
6093
|
-
|
|
6094
|
-
|
|
6095
|
-
|
|
6119
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
6120
|
+
/*html*/ `
|
|
6121
|
+
<div class="pops-panel-item-left-text">
|
|
6122
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6123
|
+
${leftDescriptionText}
|
|
6124
|
+
</div>
|
|
6125
|
+
<div class="pops-panel-switch">
|
|
6126
|
+
<input class="pops-panel-switch__input" type="checkbox">
|
|
6127
|
+
<span class="pops-panel-switch__core">
|
|
6128
|
+
<div class="pops-panel-switch__action">
|
|
6129
|
+
</div>
|
|
6130
|
+
</span>
|
|
6131
|
+
</div>`);
|
|
6096
6132
|
const PopsPanelSwitch = {
|
|
6097
6133
|
[Symbol.toStringTag]: "PopsPanelSwitch",
|
|
6098
6134
|
$data: {
|
|
@@ -6182,14 +6218,16 @@ System.register('pops', [], (function (exports) {
|
|
|
6182
6218
|
if (Boolean(formConfig.description)) {
|
|
6183
6219
|
leftDescriptionText = `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
6184
6220
|
}
|
|
6185
|
-
liElement
|
|
6186
|
-
|
|
6187
|
-
<
|
|
6188
|
-
|
|
6189
|
-
|
|
6190
|
-
|
|
6191
|
-
<
|
|
6192
|
-
|
|
6221
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
6222
|
+
/*html*/ `
|
|
6223
|
+
<div class="pops-panel-item-left-text">
|
|
6224
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6225
|
+
${leftDescriptionText}
|
|
6226
|
+
</div>
|
|
6227
|
+
<div class="pops-panel-slider">
|
|
6228
|
+
<input type="range" min="${formConfig.min}" max="${formConfig.max}">
|
|
6229
|
+
</div>
|
|
6230
|
+
`);
|
|
6193
6231
|
let rangeInputElement = liElement.querySelector(".pops-panel-slider input[type=range]");
|
|
6194
6232
|
if (formConfig.step) {
|
|
6195
6233
|
rangeInputElement.setAttribute("step", formConfig.step.toString());
|
|
@@ -6245,19 +6283,20 @@ System.register('pops', [], (function (exports) {
|
|
|
6245
6283
|
if (Boolean(formConfig.description)) {
|
|
6246
6284
|
leftDescriptionText = /*html*/ `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
6247
6285
|
}
|
|
6248
|
-
liElement
|
|
6249
|
-
|
|
6250
|
-
<
|
|
6251
|
-
|
|
6252
|
-
|
|
6253
|
-
<div class="pops-slider pops-slider-width">
|
|
6254
|
-
<div class="pops-slider__runway">
|
|
6255
|
-
<div class="pops-slider__bar" style="width: 0%; left: 0%"></div>
|
|
6256
|
-
<div class="pops-slider__button-wrapper" style="left: 0%">
|
|
6257
|
-
<div class="pops-slider__button"></div>
|
|
6258
|
-
</div>
|
|
6286
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
6287
|
+
/*html*/ `
|
|
6288
|
+
<div class="pops-panel-item-left-text" style="flex: 1;">
|
|
6289
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6290
|
+
${leftDescriptionText}
|
|
6259
6291
|
</div>
|
|
6260
|
-
|
|
6292
|
+
<div class="pops-slider pops-slider-width">
|
|
6293
|
+
<div class="pops-slider__runway">
|
|
6294
|
+
<div class="pops-slider__bar" style="width: 0%; left: 0%"></div>
|
|
6295
|
+
<div class="pops-slider__button-wrapper" style="left: 0%">
|
|
6296
|
+
<div class="pops-slider__button"></div>
|
|
6297
|
+
</div>
|
|
6298
|
+
</div>
|
|
6299
|
+
</div>`);
|
|
6261
6300
|
const PopsPanelSlider = {
|
|
6262
6301
|
[Symbol.toStringTag]: "PopsPanelSlider",
|
|
6263
6302
|
/**
|
|
@@ -6807,15 +6846,16 @@ System.register('pops', [], (function (exports) {
|
|
|
6807
6846
|
if (Boolean(formConfig.description)) {
|
|
6808
6847
|
leftDescriptionText = `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
6809
6848
|
}
|
|
6810
|
-
liElement
|
|
6811
|
-
|
|
6812
|
-
<
|
|
6813
|
-
|
|
6814
|
-
|
|
6815
|
-
|
|
6816
|
-
<
|
|
6817
|
-
|
|
6818
|
-
|
|
6849
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
6850
|
+
/*html*/ `
|
|
6851
|
+
<div class="pops-panel-item-left-text">
|
|
6852
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
6853
|
+
${leftDescriptionText}
|
|
6854
|
+
</div>
|
|
6855
|
+
<div class="pops-panel-input pops-user-select-none">
|
|
6856
|
+
<input type="${inputType}" placeholder="${formConfig.placeholder}">
|
|
6857
|
+
</div>
|
|
6858
|
+
`);
|
|
6819
6859
|
const PopsPanelInput = {
|
|
6820
6860
|
[Symbol.toStringTag]: "PopsPanelInput",
|
|
6821
6861
|
$ele: {
|
|
@@ -6858,11 +6898,12 @@ System.register('pops', [], (function (exports) {
|
|
|
6858
6898
|
initEle() {
|
|
6859
6899
|
this.$ele.input.parentElement.insertBefore(this.$ele.inputSpanIcon, this.$ele.input.nextSibling);
|
|
6860
6900
|
this.$ele.inputSpanIcon.className = "pops-panel-input__suffix";
|
|
6861
|
-
this.$ele.inputSpanIcon
|
|
6862
|
-
|
|
6863
|
-
<
|
|
6864
|
-
|
|
6865
|
-
|
|
6901
|
+
PopsSafeUtils.setSafeHTML(this.$ele.inputSpanIcon,
|
|
6902
|
+
/*html*/ `
|
|
6903
|
+
<span class="pops-panel-input__suffix-inner">
|
|
6904
|
+
<i class="pops-panel-icon"></i>
|
|
6905
|
+
</span>
|
|
6906
|
+
`);
|
|
6866
6907
|
this.$ele.inputSpanIconInner =
|
|
6867
6908
|
this.$ele.inputSpanIcon.querySelector(".pops-panel-input__suffix-inner");
|
|
6868
6909
|
this.$ele.icon =
|
|
@@ -6897,7 +6938,7 @@ System.register('pops', [], (function (exports) {
|
|
|
6897
6938
|
},
|
|
6898
6939
|
/**
|
|
6899
6940
|
* 设置input元素的type
|
|
6900
|
-
* @param
|
|
6941
|
+
* @param [typeValue="text"] type值
|
|
6901
6942
|
*/
|
|
6902
6943
|
setInputType(typeValue = "text") {
|
|
6903
6944
|
this.$ele.input.setAttribute("type", typeValue);
|
|
@@ -6906,14 +6947,14 @@ System.register('pops', [], (function (exports) {
|
|
|
6906
6947
|
* 删除图标按钮
|
|
6907
6948
|
*/
|
|
6908
6949
|
removeCircleIcon() {
|
|
6909
|
-
this.$ele.icon
|
|
6950
|
+
PopsSafeUtils.setSafeHTML(this.$ele.icon, "");
|
|
6910
6951
|
},
|
|
6911
6952
|
/**
|
|
6912
6953
|
* 添加清空图标按钮
|
|
6913
|
-
* @param
|
|
6954
|
+
* @param [svgHTML=pops.config.iconSVG.circleClose] svg图标，默认为清空的图标
|
|
6914
6955
|
*/
|
|
6915
6956
|
setCircleIcon(svgHTML = pops.config.iconSVG.circleClose) {
|
|
6916
|
-
this.$ele.icon
|
|
6957
|
+
PopsSafeUtils.setSafeHTML(this.$ele.icon, svgHTML);
|
|
6917
6958
|
},
|
|
6918
6959
|
/**
|
|
6919
6960
|
* 添加图标按钮的点击事件
|
|
@@ -7002,16 +7043,17 @@ System.register('pops', [], (function (exports) {
|
|
|
7002
7043
|
if (Boolean(formConfig.description)) {
|
|
7003
7044
|
leftDescriptionText = `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
7004
7045
|
}
|
|
7005
|
-
liElement
|
|
7006
|
-
|
|
7007
|
-
<
|
|
7008
|
-
|
|
7009
|
-
|
|
7010
|
-
|
|
7011
|
-
<
|
|
7012
|
-
|
|
7013
|
-
|
|
7014
|
-
|
|
7046
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
7047
|
+
/*html*/ `
|
|
7048
|
+
<div class="pops-panel-item-left-text">
|
|
7049
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7050
|
+
${leftDescriptionText}
|
|
7051
|
+
</div>
|
|
7052
|
+
<div class="pops-panel-textarea">
|
|
7053
|
+
<textarea placeholder="${formConfig.placeholder ?? ""}">
|
|
7054
|
+
</textarea>
|
|
7055
|
+
</div>
|
|
7056
|
+
`);
|
|
7015
7057
|
const PopsPanelTextArea = {
|
|
7016
7058
|
[Symbol.toStringTag]: "PopsPanelTextArea",
|
|
7017
7059
|
$ele: {
|
|
@@ -7076,15 +7118,16 @@ System.register('pops', [], (function (exports) {
|
|
|
7076
7118
|
if (Boolean(formConfig.description)) {
|
|
7077
7119
|
leftDescriptionText = /*html*/ `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
7078
7120
|
}
|
|
7079
|
-
liElement
|
|
7080
|
-
|
|
7081
|
-
<
|
|
7082
|
-
|
|
7083
|
-
|
|
7084
|
-
|
|
7085
|
-
<select
|
|
7086
|
-
|
|
7087
|
-
|
|
7121
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
7122
|
+
/*html*/ `
|
|
7123
|
+
<div class="pops-panel-item-left-text">
|
|
7124
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7125
|
+
${leftDescriptionText}
|
|
7126
|
+
</div>
|
|
7127
|
+
<div class="pops-panel-select pops-user-select-none">
|
|
7128
|
+
<select></select>
|
|
7129
|
+
</div>
|
|
7130
|
+
`);
|
|
7088
7131
|
const PopsPanelSelect = {
|
|
7089
7132
|
[Symbol.toStringTag]: "PopsPanelSelect",
|
|
7090
7133
|
$ele: {
|
|
@@ -7271,33 +7314,34 @@ System.register('pops', [], (function (exports) {
|
|
|
7271
7314
|
if (Boolean(formConfig.description)) {
|
|
7272
7315
|
leftDescriptionText = /*html*/ `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
7273
7316
|
}
|
|
7274
|
-
liElement
|
|
7275
|
-
|
|
7276
|
-
<
|
|
7277
|
-
|
|
7278
|
-
|
|
7279
|
-
|
|
7280
|
-
<div class="
|
|
7281
|
-
<div class="el-
|
|
7282
|
-
|
|
7283
|
-
|
|
7284
|
-
|
|
7317
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
7318
|
+
/*html*/ `
|
|
7319
|
+
<div class="pops-panel-item-left-text">
|
|
7320
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7321
|
+
${leftDescriptionText}
|
|
7322
|
+
</div>
|
|
7323
|
+
<div class="pops-panel-select-multiple">
|
|
7324
|
+
<div class="el-select__wrapper">
|
|
7325
|
+
<div class="el-select__selection">
|
|
7326
|
+
<!-- 这个是用于手动输入的，这里暂不适配 -->
|
|
7327
|
+
<div class="el-select__selected-item el-select__input-wrapper">
|
|
7328
|
+
|
|
7329
|
+
</div>
|
|
7330
|
+
<!-- 这个是placeholder -->
|
|
7331
|
+
<div class="el-select__selected-item el-select__placeholder">
|
|
7332
|
+
</div>
|
|
7285
7333
|
</div>
|
|
7286
|
-
<!--
|
|
7287
|
-
<div class="el-
|
|
7334
|
+
<!-- 下拉箭头 -->
|
|
7335
|
+
<div class="el-select__suffix">
|
|
7336
|
+
<i class="el-icon el-select__caret el-select__icon">
|
|
7337
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
|
7338
|
+
<path fill="currentColor" d="M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"></path>
|
|
7339
|
+
</svg>
|
|
7340
|
+
</i>
|
|
7288
7341
|
</div>
|
|
7289
7342
|
</div>
|
|
7290
|
-
<!-- 下拉箭头 -->
|
|
7291
|
-
<div class="el-select__suffix">
|
|
7292
|
-
<i class="el-icon el-select__caret el-select__icon">
|
|
7293
|
-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
|
7294
|
-
<path fill="currentColor" d="M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"></path>
|
|
7295
|
-
</svg>
|
|
7296
|
-
</i>
|
|
7297
|
-
</div>
|
|
7298
7343
|
</div>
|
|
7299
|
-
|
|
7300
|
-
`;
|
|
7344
|
+
`);
|
|
7301
7345
|
const PopsPanelSelectMultiple = {
|
|
7302
7346
|
[Symbol.toStringTag]: "PopsPanelSelectMultiple",
|
|
7303
7347
|
$el: {
|
|
@@ -7422,7 +7466,7 @@ System.register('pops', [], (function (exports) {
|
|
|
7422
7466
|
/** 关闭图标 */
|
|
7423
7467
|
const $closeIcon = $selectedItem.querySelector(".el-icon.el-tag__close");
|
|
7424
7468
|
if (data.isHTML) {
|
|
7425
|
-
$tagText
|
|
7469
|
+
PopsSafeUtils.setSafeHTML($tagText, data.text);
|
|
7426
7470
|
}
|
|
7427
7471
|
else {
|
|
7428
7472
|
$tagText.innerText = data.text;
|
|
@@ -7829,18 +7873,19 @@ System.register('pops', [], (function (exports) {
|
|
|
7829
7873
|
if (Boolean(formConfig.description)) {
|
|
7830
7874
|
leftDescriptionText = /*html*/ `<p class="pops-panel-item-left-desc-text">${formConfig.description}</p>`;
|
|
7831
7875
|
}
|
|
7832
|
-
liElement
|
|
7833
|
-
|
|
7834
|
-
<
|
|
7835
|
-
|
|
7836
|
-
|
|
7837
|
-
|
|
7838
|
-
<
|
|
7839
|
-
<
|
|
7840
|
-
|
|
7841
|
-
|
|
7842
|
-
|
|
7843
|
-
|
|
7876
|
+
PopsSafeUtils.setSafeHTML(liElement,
|
|
7877
|
+
/*html*/ `
|
|
7878
|
+
<div class="pops-panel-item-left-text">
|
|
7879
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
7880
|
+
${leftDescriptionText}
|
|
7881
|
+
</div>
|
|
7882
|
+
<div class="pops-panel-button">
|
|
7883
|
+
<button class="pops-panel-button_inner">
|
|
7884
|
+
<i class="pops-bottom-icon"></i>
|
|
7885
|
+
<span class="pops-panel-button-text"></span>
|
|
7886
|
+
</button>
|
|
7887
|
+
</div>
|
|
7888
|
+
`);
|
|
7844
7889
|
const PopsPanelButton = {
|
|
7845
7890
|
[Symbol.toStringTag]: "PopsPanelButton",
|
|
7846
7891
|
$ele: {
|
|
@@ -7910,7 +7955,7 @@ System.register('pops', [], (function (exports) {
|
|
|
7910
7955
|
* 设置icon图标的svg
|
|
7911
7956
|
*/
|
|
7912
7957
|
setIconSVG(svgHTML) {
|
|
7913
|
-
this.$ele.icon
|
|
7958
|
+
PopsSafeUtils.setSafeHTML(this.$ele.icon, svgHTML);
|
|
7914
7959
|
},
|
|
7915
7960
|
/**
|
|
7916
7961
|
* 设置icon图标是否旋转
|
|
@@ -7949,7 +7994,7 @@ System.register('pops', [], (function (exports) {
|
|
|
7949
7994
|
* @param text
|
|
7950
7995
|
*/
|
|
7951
7996
|
setButtonText(text) {
|
|
7952
|
-
this.$ele.spanText
|
|
7997
|
+
PopsSafeUtils.setSafeHTML(this.$ele.spanText, text);
|
|
7953
7998
|
},
|
|
7954
7999
|
setClickEvent() {
|
|
7955
8000
|
popsDOMUtils.on(this.$ele.button, "click", void 0, (event) => {
|
|
@@ -7995,16 +8040,17 @@ System.register('pops', [], (function (exports) {
|
|
|
7995
8040
|
if (formConfig.rightText) {
|
|
7996
8041
|
rightText = /*html*/ `<p class="pops-panel-item-right-text">${formConfig.rightText}</p>`;
|
|
7997
8042
|
}
|
|
7998
|
-
$li
|
|
7999
|
-
|
|
8000
|
-
<
|
|
8001
|
-
|
|
8002
|
-
|
|
8003
|
-
|
|
8004
|
-
|
|
8005
|
-
|
|
8006
|
-
|
|
8007
|
-
|
|
8043
|
+
PopsSafeUtils.setSafeHTML($li,
|
|
8044
|
+
/*html*/ `
|
|
8045
|
+
<div class="pops-panel-item-left-text">
|
|
8046
|
+
<p class="pops-panel-item-left-main-text">${formConfig.text}</p>
|
|
8047
|
+
${leftDescriptionText}
|
|
8048
|
+
</div>
|
|
8049
|
+
<div class="pops-panel-deepMenu">
|
|
8050
|
+
${rightText}
|
|
8051
|
+
${arrowRightIconHTML}
|
|
8052
|
+
</div>
|
|
8053
|
+
`);
|
|
8008
8054
|
const PopsPanelDeepMenu = {
|
|
8009
8055
|
[Symbol.toStringTag]: "PopsPanelDeepMenu",
|
|
8010
8056
|
$ele: {
|
|
@@ -8034,19 +8080,19 @@ System.register('pops', [], (function (exports) {
|
|
|
8034
8080
|
let formHeaderDivElement = popsDOMUtils.createElement("div", {
|
|
8035
8081
|
className: "pops-panel-forms-container-item-header-text",
|
|
8036
8082
|
});
|
|
8037
|
-
formHeaderDivElement
|
|
8083
|
+
PopsSafeUtils.setSafeHTML(formHeaderDivElement, formConfig_forms["text"]);
|
|
8038
8084
|
if (formConfig_forms.isFold) {
|
|
8039
8085
|
/* 添加第一个 */
|
|
8040
8086
|
/* 加进容器内 */
|
|
8041
|
-
formHeaderDivElement
|
|
8087
|
+
PopsSafeUtils.setSafeHTML(formHeaderDivElement,
|
|
8088
|
+
/*html*/ `
|
|
8042
8089
|
<p>${formConfig_forms.text}</p>
|
|
8043
8090
|
<i class="pops-panel-forms-fold-container-icon">
|
|
8044
8091
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
|
8045
8092
|
<path d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path>
|
|
8046
8093
|
</svg>
|
|
8047
8094
|
</i>
|
|
8048
|
-
|
|
8049
|
-
`;
|
|
8095
|
+
`);
|
|
8050
8096
|
// 添加点击事件
|
|
8051
8097
|
popsDOMUtils.on(formHeaderDivElement, "click", (event) => {
|
|
8052
8098
|
if (formContainerListElement.hasAttribute("data-fold-enable")) {
|
|
@@ -8244,18 +8290,18 @@ System.register('pops', [], (function (exports) {
|
|
|
8244
8290
|
let formHeaderDivElement = popsDOMUtils.createElement("div", {
|
|
8245
8291
|
className: "pops-panel-forms-container-item-header-text",
|
|
8246
8292
|
});
|
|
8247
|
-
formHeaderDivElement
|
|
8293
|
+
PopsSafeUtils.setSafeHTML(formHeaderDivElement, formConfig_forms["text"]);
|
|
8248
8294
|
if (formConfig_forms.isFold) {
|
|
8249
8295
|
/* 加进容器内 */
|
|
8250
|
-
formHeaderDivElement
|
|
8296
|
+
PopsSafeUtils.setSafeHTML(formHeaderDivElement,
|
|
8297
|
+
/*html*/ `
|
|
8251
8298
|
<p>${formConfig_forms.text}</p>
|
|
8252
8299
|
<i class="pops-panel-forms-fold-container-icon">
|
|
8253
8300
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
|
|
8254
8301
|
<path d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path>
|
|
8255
8302
|
</svg>
|
|
8256
8303
|
</i>
|
|
8257
|
-
|
|
8258
|
-
`;
|
|
8304
|
+
`);
|
|
8259
8305
|
// 添加点击事件
|
|
8260
8306
|
popsDOMUtils.on(formHeaderDivElement, "click", (event) => {
|
|
8261
8307
|
if (formContainerListElement.hasAttribute("data-fold-enable")) {
|
|
@@ -8341,7 +8387,7 @@ System.register('pops', [], (function (exports) {
|
|
|
8341
8387
|
let containerHeaderTitleLIElement = document.createElement("li");
|
|
8342
8388
|
containerHeaderTitleLIElement["__asideConfig__"] =
|
|
8343
8389
|
asideConfig;
|
|
8344
|
-
containerHeaderTitleLIElement
|
|
8390
|
+
PopsSafeUtils.setSafeHTML(containerHeaderTitleLIElement, headerTitleText);
|
|
8345
8391
|
this.sectionContainerHeaderULElement.appendChild(containerHeaderTitleLIElement);
|
|
8346
8392
|
}
|
|
8347
8393
|
let __forms__ = asideLiElement["__forms__"];
|
|
@@ -8630,9 +8676,11 @@ System.register('pops', [], (function (exports) {
|
|
|
8630
8676
|
pops.config.cssText.rightClickMenu,
|
|
8631
8677
|
]);
|
|
8632
8678
|
if (config.style != null) {
|
|
8633
|
-
let cssNode =
|
|
8634
|
-
|
|
8635
|
-
|
|
8679
|
+
let cssNode = popsDOMUtils.createElement("style", {
|
|
8680
|
+
innerHTML: config.style,
|
|
8681
|
+
}, {
|
|
8682
|
+
type: "text/css",
|
|
8683
|
+
});
|
|
8636
8684
|
$shadowRoot.appendChild(cssNode);
|
|
8637
8685
|
}
|
|
8638
8686
|
const PopsContextMenu = {
|
|
@@ -9114,8 +9162,11 @@ System.register('pops', [], (function (exports) {
|
|
|
9114
9162
|
]);
|
|
9115
9163
|
if (config.style != null) {
|
|
9116
9164
|
let cssNode = document.createElement("style");
|
|
9117
|
-
|
|
9118
|
-
|
|
9165
|
+
popsDOMUtils.createElement("style", {
|
|
9166
|
+
innerHTML: config.style,
|
|
9167
|
+
}, {
|
|
9168
|
+
type: "text/css",
|
|
9169
|
+
});
|
|
9119
9170
|
$shadowRoot.appendChild(cssNode);
|
|
9120
9171
|
}
|
|
9121
9172
|
const SearchSuggestion = {
|
|
@@ -9492,7 +9543,7 @@ System.register('pops', [], (function (exports) {
|
|
|
9492
9543
|
* 清空所有的搜索结果
|
|
9493
9544
|
*/
|
|
9494
9545
|
clearAllSearchItemLi() {
|
|
9495
|
-
SearchSuggestion.$el.$hintULContainer
|
|
9546
|
+
PopsSafeUtils.setSafeHTML(SearchSuggestion.$el.$hintULContainer, "");
|
|
9496
9547
|
},
|
|
9497
9548
|
/**
|
|
9498
9549
|
* 更新搜索建议框的位置(top、left)
|
|
@@ -9574,7 +9625,8 @@ System.register('pops', [], (function (exports) {
|
|
|
9574
9625
|
* 动态更新CSS
|
|
9575
9626
|
*/
|
|
9576
9627
|
updateDynamicCSS() {
|
|
9577
|
-
|
|
9628
|
+
let cssText = this.getDynamicCSS();
|
|
9629
|
+
PopsSafeUtils.setSafeHTML(this.$el.$dynamicCSS, cssText);
|
|
9578
9630
|
},
|
|
9579
9631
|
/**
|
|
9580
9632
|
* 更新页面显示的搜索结果
|
|
@@ -9764,7 +9816,7 @@ System.register('pops', [], (function (exports) {
|
|
|
9764
9816
|
if (text == null) {
|
|
9765
9817
|
text = this.getContent();
|
|
9766
9818
|
}
|
|
9767
|
-
this.$el.$content
|
|
9819
|
+
PopsSafeUtils.setSafeHTML(this.$el.$content, text);
|
|
9768
9820
|
}
|
|
9769
9821
|
/**
|
|
9770
9822
|
* 获取z-index
|
|
@@ -10136,7 +10188,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10136
10188
|
/** 配置 */
|
|
10137
10189
|
config = {
|
|
10138
10190
|
/** 版本号 */
|
|
10139
|
-
version: "2025.
|
|
10191
|
+
version: "2025.3.2",
|
|
10140
10192
|
cssText: {
|
|
10141
10193
|
/** 主CSS */
|
|
10142
10194
|
index: indexCSS,
|
|
@@ -10241,7 +10293,7 @@ System.register('pops', [], (function (exports) {
|
|
|
10241
10293
|
/* 处理获取当前所有的动画名 */
|
|
10242
10294
|
this.config.isInit = true;
|
|
10243
10295
|
let animationStyle = document.createElement("style");
|
|
10244
|
-
animationStyle
|
|
10296
|
+
PopsSafeUtils.setSafeHTML(animationStyle, this.config.cssText.anim);
|
|
10245
10297
|
popsDOMUtils.appendHead(animationStyle);
|
|
10246
10298
|
this.config.animation = null;
|
|
10247
10299
|
this.config.animation = PopsInstanceUtils.getKeyFrames(animationStyle.sheet);
|