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