@whitesev/pops 3.2.0 → 3.2.2

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.
Files changed (126) hide show
  1. package/README.md +249 -249
  2. package/dist/index.amd.js +702 -667
  3. package/dist/index.amd.js.map +1 -1
  4. package/dist/index.amd.min.js +1 -1
  5. package/dist/index.amd.min.js.map +1 -1
  6. package/dist/index.cjs.js +702 -667
  7. package/dist/index.cjs.js.map +1 -1
  8. package/dist/index.cjs.min.js +1 -1
  9. package/dist/index.cjs.min.js.map +1 -1
  10. package/dist/index.esm.js +702 -667
  11. package/dist/index.esm.js.map +1 -1
  12. package/dist/index.esm.min.js +1 -1
  13. package/dist/index.esm.min.js.map +1 -1
  14. package/dist/index.iife.js +702 -667
  15. package/dist/index.iife.js.map +1 -1
  16. package/dist/index.iife.min.js +1 -1
  17. package/dist/index.iife.min.js.map +1 -1
  18. package/dist/index.system.js +702 -667
  19. package/dist/index.system.js.map +1 -1
  20. package/dist/index.system.min.js +1 -1
  21. package/dist/index.system.min.js.map +1 -1
  22. package/dist/index.umd.js +702 -667
  23. package/dist/index.umd.js.map +1 -1
  24. package/dist/index.umd.min.js +1 -1
  25. package/dist/index.umd.min.js.map +1 -1
  26. package/dist/types/src/components/folder/types/index.d.ts +43 -13
  27. package/dist/types/src/types/PopsDOMUtilsEventType.d.ts +313 -313
  28. package/dist/types/src/types/animation.d.ts +19 -19
  29. package/dist/types/src/types/button.d.ts +94 -94
  30. package/dist/types/src/types/components.d.ts +211 -211
  31. package/dist/types/src/types/event.d.ts +43 -43
  32. package/dist/types/src/types/global.d.ts +31 -31
  33. package/dist/types/src/types/icon.d.ts +32 -32
  34. package/dist/types/src/types/inst.d.ts +28 -28
  35. package/dist/types/src/types/main.d.ts +66 -66
  36. package/dist/types/src/types/mask.d.ts +52 -52
  37. package/dist/types/src/types/position.d.ts +60 -60
  38. package/package.json +27 -25
  39. package/src/Pops.ts +206 -206
  40. package/src/PopsAnimation.ts +32 -32
  41. package/src/PopsCSS.ts +54 -54
  42. package/src/PopsCore.ts +37 -37
  43. package/src/PopsIcon.ts +95 -95
  44. package/src/PopsInst.ts +21 -21
  45. package/src/components/alert/defaultConfig.ts +62 -62
  46. package/src/components/alert/index.ts +163 -163
  47. package/src/components/alert/types/index.ts +23 -23
  48. package/src/components/confirm/defaultConfig.ts +90 -90
  49. package/src/components/confirm/index.ts +165 -165
  50. package/src/components/confirm/types/index.ts +13 -17
  51. package/src/components/drawer/defaultConfig.ts +89 -89
  52. package/src/components/drawer/index.css +37 -37
  53. package/src/components/drawer/index.ts +245 -245
  54. package/src/components/drawer/types/index.ts +62 -61
  55. package/src/components/folder/defaultConfig.ts +151 -151
  56. package/src/components/folder/folderIcon.ts +28 -28
  57. package/src/components/folder/index.css +303 -303
  58. package/src/components/folder/index.ts +953 -932
  59. package/src/components/folder/types/index.ts +143 -110
  60. package/src/components/iframe/defaultConfig.ts +60 -60
  61. package/src/components/iframe/index.css +76 -76
  62. package/src/components/iframe/index.ts +331 -331
  63. package/src/components/iframe/types/index.ts +96 -96
  64. package/src/components/loading/defaultConfig.ts +29 -29
  65. package/src/components/loading/index.css +66 -66
  66. package/src/components/loading/index.ts +101 -101
  67. package/src/components/loading/types/index.ts +36 -34
  68. package/src/components/panel/css/components-select.css +84 -84
  69. package/src/components/panel/defaultConfig.ts +868 -868
  70. package/src/components/panel/handlerComponents.ts +3993 -3993
  71. package/src/components/panel/index.css +1403 -1401
  72. package/src/components/panel/index.ts +221 -221
  73. package/src/components/panel/types/components-button.ts +56 -56
  74. package/src/components/panel/types/components-common.ts +73 -73
  75. package/src/components/panel/types/components-container.ts +25 -25
  76. package/src/components/panel/types/components-deepMenu.ts +64 -64
  77. package/src/components/panel/types/components-input.ts +90 -90
  78. package/src/components/panel/types/components-own.ts +16 -16
  79. package/src/components/panel/types/components-select.ts +169 -169
  80. package/src/components/panel/types/components-selectMultiple.ts +105 -104
  81. package/src/components/panel/types/components-slider.ts +55 -55
  82. package/src/components/panel/types/components-switch.ts +33 -33
  83. package/src/components/panel/types/components-textarea.ts +45 -45
  84. package/src/components/panel/types/index.ts +244 -244
  85. package/src/components/prompt/defaultConfig.ts +94 -94
  86. package/src/components/prompt/index.css +34 -34
  87. package/src/components/prompt/index.ts +187 -215
  88. package/src/components/prompt/types/index.ts +57 -56
  89. package/src/components/rightClickMenu/defaultConfig.ts +103 -103
  90. package/src/components/rightClickMenu/index.css +115 -115
  91. package/src/components/rightClickMenu/index.ts +662 -662
  92. package/src/components/rightClickMenu/types/index.ts +145 -143
  93. package/src/components/searchSuggestion/defaultConfig.ts +63 -63
  94. package/src/components/searchSuggestion/index.ts +813 -813
  95. package/src/components/searchSuggestion/types/index.ts +244 -242
  96. package/src/components/tooltip/defaultConfig.ts +33 -33
  97. package/src/components/tooltip/index.css +199 -199
  98. package/src/components/tooltip/index.ts +617 -617
  99. package/src/components/tooltip/types/index.ts +123 -121
  100. package/src/config/CommonCSSClassName.ts +17 -17
  101. package/src/config/GlobalConfig.ts +63 -63
  102. package/src/css/animation.css +987 -987
  103. package/src/css/button.css +551 -551
  104. package/src/css/common.css +54 -54
  105. package/src/css/index.css +253 -253
  106. package/src/css/ninePalaceGridPosition.css +50 -50
  107. package/src/css/scrollbar.css +22 -22
  108. package/src/handler/PopsElementHandler.ts +303 -303
  109. package/src/handler/PopsHandler.ts +611 -611
  110. package/src/types/PopsDOMUtilsEventType.d.ts +313 -313
  111. package/src/types/animation.d.ts +19 -19
  112. package/src/types/button.d.ts +94 -94
  113. package/src/types/components.d.ts +211 -211
  114. package/src/types/event.d.ts +43 -43
  115. package/src/types/global.d.ts +31 -31
  116. package/src/types/icon.d.ts +32 -32
  117. package/src/types/inst.d.ts +28 -28
  118. package/src/types/main.d.ts +66 -66
  119. package/src/types/mask.d.ts +52 -52
  120. package/src/types/position.d.ts +60 -60
  121. package/src/utils/PopsDOMUtils.ts +2483 -2483
  122. package/src/utils/PopsDOMUtilsEventsConfig.ts +4 -4
  123. package/src/utils/PopsInstanceUtils.ts +714 -714
  124. package/src/utils/PopsMathUtils.ts +71 -71
  125. package/src/utils/PopsSafeUtils.ts +22 -22
  126. package/src/utils/PopsUtils.ts +421 -421
@@ -1,143 +1,145 @@
1
- import type { PopsGeneralConfig } from "../../../types/components";
2
- import type { PopsIconType } from "../../../types/icon";
3
- import type { PopsPanelGeneralConfig } from "../../panel/types/components-common";
4
-
5
- /**
6
- * 存储在pops.rightClickMenu的右键菜单根元素上的属性
7
- */
8
- export type PopsRightClickMenuRootStoreNodeValue = {
9
- child: HTMLElement[];
10
- };
11
- /**
12
- * 存储在pops.rightClickMenu的右键菜单子菜单的根元素上的属性
13
- */
14
- export type PopsRightClickMenuChildRootStoreNodeValue = {
15
- parent: HTMLElement;
16
- root: HTMLElement;
17
- };
18
- /**
19
- * 存储在pops.rightClickMenu的右键菜单每一项元素上的属性
20
- */
21
- export type PopsRightClickMenuItemStoreNodeValue = {
22
- child?: HTMLElement;
23
- parent?: HTMLElement;
24
- root?: HTMLElement;
25
- };
26
-
27
- /**
28
- * pops.rightClickMenu的右键菜单配置
29
- */
30
- export interface PopsRightClickMenuDataConfig {
31
- /**
32
- * svg图标,留空则是没图标
33
- * @default ""
34
- */
35
- icon?: PopsIconType | string;
36
- /**
37
- * 图标是否旋转
38
- * @default false
39
- */
40
- iconIsLoading?: boolean;
41
- /**
42
- * 文字
43
- */
44
- text: IFunction<string>;
45
- /**
46
- * 点击的回调函数
47
- * @param clickEvent 点击菜单的click事件
48
- * @param contextMenuEvent 触发的contextmenu事件
49
- * @param $li <li>元素
50
- * @param $listenerRootNode 右键菜单监听的元素
51
- * @returns
52
- * + true(默认) 关闭菜单
53
- * + false 不关闭菜单
54
- *
55
- */
56
- callback?: (
57
- clickEvent: PointerEvent,
58
- contextMenuEvent: PointerEvent,
59
- $li: HTMLLIElement,
60
- $listenerRootNode: NonNullable<PopsRightClickMenuConfig["$target"]>
61
- ) => IPromise<boolean | void>;
62
- /**
63
- * 子项配置
64
- */
65
- item?: PopsRightClickMenuDataConfig[] | null;
66
- }
67
-
68
- /**
69
- * pops.rightClickMenu
70
- */
71
- export interface PopsRightClickMenuConfig
72
- extends Pick<PopsGeneralConfig, "useShadowRoot" | "beforeAppendToPageCallBack" | "zIndex" | "style" | "only"> {
73
- /**
74
- * 目标元素
75
- * @default document.documentElement
76
- */
77
- $target?: HTMLElement | Window | EventTarget | Node;
78
- /**
79
- * 目标的子元素选择器,默认为空
80
- * @default null
81
- */
82
- targetSelector?: string | null;
83
- /**
84
- * 位置
85
- * @default "fixed"
86
- */
87
- position?: "absolute" | "fixed";
88
- /**
89
- * 右键菜单数据
90
- */
91
- data: PopsRightClickMenuDataConfig[];
92
- /**
93
- * 子菜单的左右偏移距离
94
- * @default 0
95
- */
96
- chileMenuLeftOrRightDistance?: number;
97
- /**
98
- * 子菜单的上下偏移距离
99
- * @default 0
100
- */
101
- childMenuTopOrBottomDistance?: number;
102
- /**
103
- * (可选)元素的className,值为空的话就不设置
104
- * @default ""
105
- */
106
- className?: PopsPanelGeneralConfig<any>["className"];
107
- /**
108
- * 是否启用动画,默认false
109
- *
110
- * 该动画为从上往下展开
111
- * @default false
112
- */
113
- isAnimation?: boolean;
114
- /**
115
- * 是否使用打开动画,默认true
116
- *
117
- * 该动画为放大动画
118
- * @default true
119
- */
120
- useScaleAnimation?: boolean;
121
- /**
122
- * 是否阻止默认contextmenu事件
123
- * @default false
124
- */
125
- preventDefault?: boolean;
126
- /**
127
- * 限制x位置在当前视窗内
128
- * @default true
129
- */
130
- limitPositionXInView?: boolean;
131
- /**
132
- * 限制y位置在当前视窗内
133
- * @default true
134
- */
135
- limitPositionYInView?: boolean;
136
- /**
137
- * 菜单显示前的回调
138
- * @returns
139
- *
140
- * + `false`:阻止默认行为(显示菜单)
141
- */
142
- beforeShowCallBack?(event: PointerEvent): IPromise<false | void>;
143
- }
1
+ import type { PopsGeneralConfig } from "../../../types/components";
2
+ import type { PopsIconType } from "../../../types/icon";
3
+ import type { PopsPanelGeneralConfig } from "../../panel/types/components-common";
4
+
5
+ /**
6
+ * 存储在pops.rightClickMenu的右键菜单根元素上的属性
7
+ */
8
+ export type PopsRightClickMenuRootStoreNodeValue = {
9
+ child: HTMLElement[];
10
+ };
11
+ /**
12
+ * 存储在pops.rightClickMenu的右键菜单子菜单的根元素上的属性
13
+ */
14
+ export type PopsRightClickMenuChildRootStoreNodeValue = {
15
+ parent: HTMLElement;
16
+ root: HTMLElement;
17
+ };
18
+ /**
19
+ * 存储在pops.rightClickMenu的右键菜单每一项元素上的属性
20
+ */
21
+ export type PopsRightClickMenuItemStoreNodeValue = {
22
+ child?: HTMLElement;
23
+ parent?: HTMLElement;
24
+ root?: HTMLElement;
25
+ };
26
+
27
+ /**
28
+ * pops.rightClickMenu的右键菜单配置
29
+ */
30
+ export interface PopsRightClickMenuDataConfig {
31
+ /**
32
+ * svg图标,留空则是没图标
33
+ * @default ""
34
+ */
35
+ icon?: PopsIconType | string;
36
+ /**
37
+ * 图标是否旋转
38
+ * @default false
39
+ */
40
+ iconIsLoading?: boolean;
41
+ /**
42
+ * 文字
43
+ */
44
+ text: IFunction<string>;
45
+ /**
46
+ * 点击的回调函数
47
+ * @param clickEvent 点击菜单的click事件
48
+ * @param contextMenuEvent 触发的contextmenu事件
49
+ * @param $li <li>元素
50
+ * @param $listenerRootNode 右键菜单监听的元素
51
+ * @returns
52
+ * + true(默认) 关闭菜单
53
+ * + false 不关闭菜单
54
+ *
55
+ */
56
+ callback?: (
57
+ clickEvent: PointerEvent,
58
+ contextMenuEvent: PointerEvent,
59
+ $li: HTMLLIElement,
60
+ $listenerRootNode: NonNullable<PopsRightClickMenuConfig["$target"]>
61
+ ) => IPromise<boolean | void>;
62
+ /**
63
+ * 子项配置
64
+ */
65
+ item?: PopsRightClickMenuDataConfig[] | null;
66
+ }
67
+
68
+ /**
69
+ * pops.rightClickMenu
70
+ */
71
+ export interface PopsRightClickMenuConfig extends Pick<
72
+ PopsGeneralConfig,
73
+ "useShadowRoot" | "beforeAppendToPageCallBack" | "zIndex" | "style" | "only"
74
+ > {
75
+ /**
76
+ * 目标元素
77
+ * @default document.documentElement
78
+ */
79
+ $target?: HTMLElement | Window | EventTarget | Node;
80
+ /**
81
+ * 目标的子元素选择器,默认为空
82
+ * @default null
83
+ */
84
+ targetSelector?: string | null;
85
+ /**
86
+ * 位置
87
+ * @default "fixed"
88
+ */
89
+ position?: "absolute" | "fixed";
90
+ /**
91
+ * 右键菜单数据
92
+ */
93
+ data: PopsRightClickMenuDataConfig[];
94
+ /**
95
+ * 子菜单的左右偏移距离
96
+ * @default 0
97
+ */
98
+ chileMenuLeftOrRightDistance?: number;
99
+ /**
100
+ * 子菜单的上下偏移距离
101
+ * @default 0
102
+ */
103
+ childMenuTopOrBottomDistance?: number;
104
+ /**
105
+ * (可选)元素的className,值为空的话就不设置
106
+ * @default ""
107
+ */
108
+ className?: PopsPanelGeneralConfig<any>["className"];
109
+ /**
110
+ * 是否启用动画,默认false
111
+ *
112
+ * 该动画为从上往下展开
113
+ * @default false
114
+ */
115
+ isAnimation?: boolean;
116
+ /**
117
+ * 是否使用打开动画,默认true
118
+ *
119
+ * 该动画为放大动画
120
+ * @default true
121
+ */
122
+ useScaleAnimation?: boolean;
123
+ /**
124
+ * 是否阻止默认contextmenu事件
125
+ * @default false
126
+ */
127
+ preventDefault?: boolean;
128
+ /**
129
+ * 限制x位置在当前视窗内
130
+ * @default true
131
+ */
132
+ limitPositionXInView?: boolean;
133
+ /**
134
+ * 限制y位置在当前视窗内
135
+ * @default true
136
+ */
137
+ limitPositionYInView?: boolean;
138
+ /**
139
+ * 菜单显示前的回调
140
+ * @returns
141
+ *
142
+ * + `false`:阻止默认行为(显示菜单)
143
+ */
144
+ beforeShowCallBack?(event: PointerEvent): IPromise<false | void>;
145
+ }
@@ -1,63 +1,63 @@
1
- import type { PopsSearchSuggestionData, PopsSearchSuggestionConfig } from "./types/index";
2
-
3
- export const PopsSearchSuggestionDefaultConfig = (): DeepRequired<PopsSearchSuggestionConfig<any>> => {
4
- const data: DeepRequired<PopsSearchSuggestionData<any>>[] = [];
5
- for (let index = 0; index < 10; index++) {
6
- data.push({
7
- value: `测试${index}`,
8
- enableDeleteButton: true,
9
- deleteButtonClickCallback(event, $dataItem, dataItem, config) {
10
- const value = dataItem.value;
11
- console.log("删除当前项:" + value, [event, $dataItem, dataItem, config]);
12
- return true;
13
- },
14
- itemView(dateItem) {
15
- return `${dateItem.value}-html`;
16
- },
17
- clickCallback(event, $dataItem, dataItem, config) {
18
- const isUpdateInputValue = index % 2 === 0 ? true : false;
19
- const value = dataItem.value;
20
- if (isUpdateInputValue) {
21
- console.log("item项的点击回调,更新input内的值:" + value, [event, $dataItem, dataItem, config, value]);
22
- } else {
23
- console.log("item项的点击回调:" + value, [event, $dataItem, dataItem, config, value]);
24
- }
25
- return isUpdateInputValue;
26
- },
27
- selectCallback(event, $dataItem, dataItem, config) {
28
- const value = dataItem.value;
29
- console.log("item项的选中回调:" + value, [event, $dataItem, dataItem, config]);
30
- },
31
- });
32
- }
33
- return {
34
- // @ts-ignore
35
- $target: null,
36
- // @ts-ignore
37
- $inputTarget: null,
38
- $selfDocument: document,
39
- data: data,
40
- useShadowRoot: true,
41
- className: "",
42
- isAbsolute: true,
43
- isAnimation: false,
44
- useFoldAnimation: true,
45
- useArrow: false,
46
- width: "250px",
47
- maxHeight: "300px",
48
- followTargetWidth: true,
49
- topDistance: 0,
50
- position: "auto",
51
- positionTopToReverse: true,
52
- zIndex: 10000,
53
- searchingTip: "正在搜索中...",
54
- toSearhNotResultHTML: '<li data-none="true">暂无其它数据</li>',
55
- toHideWithNotResult: false,
56
- followPosition: "target",
57
- async inputTargetChangeRefreshShowDataCallback(value, data) {
58
- console.log("当前输入框的值是:", value);
59
- return data.filter((it) => it.value.includes(value));
60
- },
61
- style: "",
62
- };
63
- };
1
+ import type { PopsSearchSuggestionData, PopsSearchSuggestionConfig } from "./types/index";
2
+
3
+ export const PopsSearchSuggestionDefaultConfig = (): DeepRequired<PopsSearchSuggestionConfig<any>> => {
4
+ const data: DeepRequired<PopsSearchSuggestionData<any>>[] = [];
5
+ for (let index = 0; index < 10; index++) {
6
+ data.push({
7
+ value: `测试${index}`,
8
+ enableDeleteButton: true,
9
+ deleteButtonClickCallback(event, $dataItem, dataItem, config) {
10
+ const value = dataItem.value;
11
+ console.log("删除当前项:" + value, [event, $dataItem, dataItem, config]);
12
+ return true;
13
+ },
14
+ itemView(dateItem) {
15
+ return `${dateItem.value}-html`;
16
+ },
17
+ clickCallback(event, $dataItem, dataItem, config) {
18
+ const isUpdateInputValue = index % 2 === 0 ? true : false;
19
+ const value = dataItem.value;
20
+ if (isUpdateInputValue) {
21
+ console.log("item项的点击回调,更新input内的值:" + value, [event, $dataItem, dataItem, config, value]);
22
+ } else {
23
+ console.log("item项的点击回调:" + value, [event, $dataItem, dataItem, config, value]);
24
+ }
25
+ return isUpdateInputValue;
26
+ },
27
+ selectCallback(event, $dataItem, dataItem, config) {
28
+ const value = dataItem.value;
29
+ console.log("item项的选中回调:" + value, [event, $dataItem, dataItem, config]);
30
+ },
31
+ });
32
+ }
33
+ return {
34
+ // @ts-ignore
35
+ $target: null,
36
+ // @ts-ignore
37
+ $inputTarget: null,
38
+ $selfDocument: document,
39
+ data: data,
40
+ useShadowRoot: true,
41
+ className: "",
42
+ isAbsolute: true,
43
+ isAnimation: false,
44
+ useFoldAnimation: true,
45
+ useArrow: false,
46
+ width: "250px",
47
+ maxHeight: "300px",
48
+ followTargetWidth: true,
49
+ topDistance: 0,
50
+ position: "auto",
51
+ positionTopToReverse: true,
52
+ zIndex: 10000,
53
+ searchingTip: "正在搜索中...",
54
+ toSearhNotResultHTML: '<li data-none="true">暂无其它数据</li>',
55
+ toHideWithNotResult: false,
56
+ followPosition: "target",
57
+ async inputTargetChangeRefreshShowDataCallback(value, data) {
58
+ console.log("当前输入框的值是:", value);
59
+ return data.filter((it) => it.value.includes(value));
60
+ },
61
+ style: "",
62
+ };
63
+ };