vue-popup-plus-plugin-preset 1.4.0 → 1.5.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/README.md ADDED
@@ -0,0 +1,86 @@
1
+ # Vue Popup Plus 🚀
2
+
3
+ 一个功能强大、灵活易用的 Vue 3 弹窗组件库,让弹窗管理变得简单而优雅。
4
+
5
+ [![Vue 3](https://img.shields.io/badge/Vue-3.x-brightgreen.svg)](https://vuejs.org/)
6
+ [![TypeScript](https://img.shields.io/badge/TypeScript-5.x-blue.svg)](https://www.typescriptlang.org/)
7
+ [![License](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
8
+ [![Version](https://img.shields.io/badge/version-1.0.0-orange.svg)](https://github.com/yourusername/vue-popup-plus)
9
+
10
+ ## ✨ 特性
11
+
12
+ - 🎯 **简单易用** - 简洁的 API,快速集成到您的项目中
13
+ - 🔌 **可扩展** - 自定义弹窗内容和样式,满足各种场景需求
14
+ - 🎭 **动画支持** - 内置多种动画效果,让弹窗展示更生动
15
+ - 📱 **响应式设计** - 完美适配各种屏幕尺寸
16
+ - 🧩 **TypeScript 支持** - 完整的类型定义,提供良好的开发体验
17
+
18
+ ## 📦 安装
19
+
20
+ ```bash
21
+ # 使用 npm
22
+ npm install vue-popup-plus
23
+
24
+ # 使用 yarn
25
+ yarn add vue-popup-plus
26
+
27
+ # 使用 pnpm
28
+ pnpm add vue-popup-plus
29
+ ```
30
+
31
+ ## 📚 文档
32
+
33
+ 查看我们的[在线文档](http://vue-popup-plus.styzy.cn)获取更多详细信息和高级用法。
34
+
35
+ ## 🚀 快速开始
36
+
37
+ ### 全局注册
38
+
39
+ ```js
40
+ import { createApp } from 'vue'
41
+ import { createPopup } from 'vue-popup-plus'
42
+ import App from './App.vue'
43
+
44
+ const app = createApp(App)
45
+ const popup = createPopup()
46
+
47
+ app.use(popup)
48
+
49
+ app.mount('#app')
50
+ ```
51
+
52
+ ### 基本使用
53
+
54
+ ```vue
55
+ <template>
56
+ <button @click="showPopup">显示弹窗</button>
57
+ </template>
58
+
59
+ <script setup>
60
+ import { usePopup } from 'vue-popup-plus'
61
+
62
+ const popup = usePopup()
63
+
64
+ const showPopup = () => {
65
+ popup.render({
66
+ // 组件
67
+ component: () => import('./components/Demo.vue'),
68
+ // 组件属性
69
+ componentProps: {
70
+ // 根据你的组件属性传入
71
+ },
72
+ width: 400,
73
+ maxHeight: 600,
74
+ mask: false,
75
+ })
76
+ }
77
+ </script>
78
+ ```
79
+
80
+ ## 🤝 贡献
81
+
82
+ 欢迎贡献代码、报告问题或提出新功能建议!请查看[贡献指南](CONTRIBUTING.md)了解更多信息。
83
+
84
+ ## 📄 许可证
85
+
86
+ [MIT](LICENSE) © Your Name
@@ -1,28 +1,28 @@
1
- import { defineComponent as ee, inject as te, ref as c, computed as g, watch as ne, onBeforeMount as le, onMounted as oe, onBeforeUnmount as se, createElementBlock as o, openBlock as s, createElementVNode as d, createCommentVNode as v, Fragment as N, renderList as ae, normalizeStyle as re, normalizeClass as ie, toDisplayString as B } from "vue";
2
- import { usePopup as ue, POPUP_COMPONENT_INJECTS as ce } from "vue-popup-plus";
3
- import { _ as de } from "./_plugin-vue_export-helper-CHgC5LLL.js";
4
- function ve(n) {
1
+ import { defineComponent as ne, inject as le, ref as c, computed as y, watch as oe, onBeforeMount as se, onMounted as ae, onBeforeUnmount as re, createElementBlock as o, openBlock as s, normalizeClass as X, createElementVNode as d, createCommentVNode as v, Fragment as N, renderList as ie, normalizeStyle as ue, toDisplayString as B } from "vue";
2
+ import { usePopup as ce, POPUP_COMPONENT_INJECTS as de } from "vue-popup-plus";
3
+ import { _ as ve } from "./_plugin-vue_export-helper-CHgC5LLL.js";
4
+ function pe(n) {
5
5
  const t = Object.prototype.toString.call(n).match(/\s+(\w+)/);
6
6
  return t ? t[1] : "Null";
7
7
  }
8
- function pe(n, {
8
+ function me(n, {
9
9
  allowCrossOrigin: t = !1,
10
- fileName: l = fe(n),
10
+ fileName: l = ge(n),
11
11
  headers: u = {},
12
12
  onSuccess: h = () => {
13
13
  }
14
14
  } = {}) {
15
15
  try {
16
- me(n) ? P() : t ? I() : window.open(n);
16
+ fe(n) ? O() : t ? S() : window.open(n);
17
17
  } catch (a) {
18
- console.error(`free download error:
18
+ console.error(`download error:
19
19
  `, a);
20
20
  }
21
- function P() {
21
+ function O() {
22
22
  const a = document.createElement("a");
23
23
  a.setAttribute("download", l), a.href = n, a.click(), h(l);
24
24
  }
25
- function I() {
25
+ function S() {
26
26
  let a;
27
27
  try {
28
28
  a = new XMLHttpRequest();
@@ -45,7 +45,7 @@ function pe(n, {
45
45
  }
46
46
  }
47
47
  }
48
- function me(n) {
48
+ function fe(n) {
49
49
  const t = new URL(window.location.href);
50
50
  try {
51
51
  const l = new URL(n);
@@ -54,13 +54,13 @@ function me(n) {
54
54
  throw new Error(`错误的下载地址:${n}`);
55
55
  }
56
56
  }
57
- function fe(n) {
57
+ function ge(n) {
58
58
  return n.split("/")[n.split("/").length - 1] || "";
59
59
  }
60
60
  function ye(n) {
61
61
  return n.split(".")[n.split(".").length - 1] || "";
62
62
  }
63
- function ge(n, t = !0) {
63
+ function be(n, t = !0) {
64
64
  try {
65
65
  const l = document.createElement(t ? "textarea" : "input");
66
66
  return l.style.opacity = "0", l.style.height = "0px", l.style.border = "none", l.style.color = "transparent", l.style.position = "fixed", l.style.top = "-1000px", l.style.left = "-1000px", document.body.appendChild(l), l.value = n, l.focus(), l.select(), document.execCommand("copy"), l.blur(), document.body.removeChild(l), !0;
@@ -80,7 +80,7 @@ const p = {
80
80
  EXE: "exe",
81
81
  UNKNOWN: "unknown"
82
82
  /* UNKNOWN */
83
- }, X = /* @__PURE__ */ new Map([
83
+ }, A = /* @__PURE__ */ new Map([
84
84
  [p.IMAGE, ["jpg", "jpeg", "png", "gif"]],
85
85
  [
86
86
  p.VIDEO,
@@ -97,11 +97,11 @@ const p = {
97
97
  [p.TXT, ["txt"]],
98
98
  [p.EXE, ["exe"]]
99
99
  ]);
100
- class x {
100
+ class I {
101
101
  // 文件类型
102
102
  static FILE_TYPES = p;
103
103
  // 文件类型后缀映射
104
- static FILE_TYPE_SUFFIX_MAP = X;
104
+ static FILE_TYPE_SUFFIX_MAP = A;
105
105
  // 文件id
106
106
  id = "";
107
107
  // 文件地址
@@ -120,14 +120,14 @@ class x {
120
120
  }
121
121
  // 类型
122
122
  get type() {
123
- for (const [t, l] of X)
123
+ for (const [t, l] of A)
124
124
  if (l.some((u) => u === this.suffix))
125
125
  return t;
126
126
  return p.UNKNOWN;
127
127
  }
128
128
  constructor(t) {
129
- if (t instanceof x) return t;
130
- switch (ve(t)) {
129
+ if (t instanceof I) return t;
130
+ switch (pe(t)) {
131
131
  case "String":
132
132
  this.createdByUrl(t);
133
133
  break;
@@ -174,34 +174,35 @@ class x {
174
174
  return this.url.split("/")[this.url.split("/").length - 1] || "";
175
175
  }
176
176
  }
177
- const be = ["src"], he = ["poster", "src"], we = {
177
+ const he = ["src"], we = ["poster", "src"], Ee = {
178
178
  key: 0,
179
179
  class: "tools top"
180
- }, Ee = {
180
+ }, ke = {
181
181
  key: 0,
182
182
  class: "info count"
183
- }, ke = { class: "number current" }, xe = { class: "number" }, Pe = {
183
+ }, xe = { class: "number current" }, Pe = { class: "number" }, Ie = {
184
184
  key: 1,
185
185
  class: "emyty"
186
- }, Ie = {
186
+ }, Oe = {
187
187
  key: 1,
188
188
  class: "tools left"
189
- }, Oe = {
189
+ }, Se = {
190
190
  key: 2,
191
191
  class: "tools right"
192
- }, Se = {
192
+ }, De = {
193
193
  key: 3,
194
194
  class: "tools bottom"
195
- }, De = {
195
+ }, Ce = {
196
196
  key: 1,
197
197
  class: "emyty"
198
- }, Ce = { class: "center" }, Ue = {
198
+ }, Ue = { class: "center" }, Me = {
199
199
  key: 3,
200
200
  class: "emyty"
201
- }, Me = /* @__PURE__ */ ee({
201
+ }, Ne = /* @__PURE__ */ ne({
202
202
  name: "PAlbum",
203
203
  __name: "PAlbum",
204
204
  props: {
205
+ skin: {},
205
206
  sources: {},
206
207
  defaultIndex: {},
207
208
  disableCounter: { type: Boolean },
@@ -212,94 +213,97 @@ const be = ["src"], he = ["poster", "src"], we = {
212
213
  disableDrag: { type: Boolean }
213
214
  },
214
215
  setup(n) {
215
- const t = ue(), l = te(ce.INSTANCE_ID), u = c(n.defaultIndex), h = c(1), P = c(30), I = c(0.01), a = c(3), f = c(1.5), m = c(h.value), k = c(!1), O = c(0), S = c(0), L = c(0), T = c(0), D = c(0), C = c(0), y = c(!1), w = g(() => x.FILE_TYPES), b = g(
216
- () => n.sources.map((i) => new x(i)).filter(
216
+ const t = ce(), l = le(de.INSTANCE_ID), u = c(n.defaultIndex), h = c(1), O = c(30), S = c(0.01), a = c(3), f = c(1.5), m = c(h.value), k = c(!1), D = c(0), C = c(0), L = c(0), T = c(0), x = c(0), P = c(0), g = c(!1), w = y(() => I.FILE_TYPES), b = y(
217
+ () => n.sources.map((i) => new I(i)).filter(
217
218
  (i) => [w.value.IMAGE, w.value.VIDEO].includes(i.type)
218
219
  )
219
- ), E = g(() => b.value[u.value]), A = g(() => ({
220
- transform: `translate(${D.value}px, ${C.value}px) scale(${m.value})`,
220
+ ), E = y(() => b.value[u.value]), j = y(() => ({
221
+ transform: `translate(${x.value}px, ${P.value}px) scale(${m.value})`,
221
222
  transitionDuration: k.value ? "0s" : void 0
222
- })), j = g(() => u.value !== 0), R = g(
223
+ })), R = y(() => u.value !== 0), Y = y(
223
224
  () => u.value !== b.value.length - 1 && b.value.length
224
- ), U = g(
225
+ ), U = y(
225
226
  () => E.value && E.value.type === w.value.IMAGE
226
227
  );
227
- ne(u, () => {
228
- V();
229
- }), le(() => {
228
+ oe(u, () => {
229
+ W(), q();
230
+ }), se(() => {
230
231
  n.defaultIndex >= 0 && n.defaultIndex < b.value.length && (u.value = n.defaultIndex);
231
- }), oe(() => {
232
+ }), ae(() => {
232
233
  window.addEventListener("mousemove", F), window.addEventListener("mouseup", $);
233
- }), se(() => {
234
+ }), re(() => {
234
235
  window.removeEventListener("mousemove", F), window.removeEventListener("mouseup", $);
235
236
  });
236
- function Y() {
237
+ function G() {
237
238
  u.value--;
238
239
  }
239
- function G() {
240
+ function V() {
240
241
  u.value++;
241
242
  }
242
243
  function M(i, e = a.value) {
243
244
  U.value && (i ? m.value = Math.min(
244
245
  m.value * e,
245
- P.value
246
+ O.value
246
247
  ) : m.value = Math.max(
247
248
  m.value / e,
248
- I.value
249
+ S.value
249
250
  ));
250
251
  }
251
- function V() {
252
+ function W() {
252
253
  m.value = h.value;
253
254
  }
254
- function W(i) {
255
+ function q() {
256
+ x.value = 0, P.value = 0;
257
+ }
258
+ function H(i) {
255
259
  if (n.disableScale) return;
256
260
  const e = i.wheelDelta > 0;
257
261
  M(e, f.value);
258
262
  }
259
- function q(i) {
260
- n.disableDrag || (O.value = i.clientX, S.value = i.clientY, k.value = !0, i.stopPropagation(), i.preventDefault());
263
+ function J(i) {
264
+ n.disableDrag || (D.value = i.clientX, C.value = i.clientY, k.value = !0, i.stopPropagation(), i.preventDefault());
261
265
  }
262
266
  function F(i) {
263
- k.value && (D.value = L.value + i.clientX - O.value, C.value = T.value + i.clientY - S.value);
267
+ k.value && (x.value = L.value + i.clientX - D.value, P.value = T.value + i.clientY - C.value);
264
268
  }
265
269
  function $() {
266
- O.value = 0, S.value = 0, L.value = D.value, T.value = C.value, k.value = !1;
267
- }
268
- function H() {
269
- ge(E.value.name), t.toast("复制成功");
270
- }
271
- function J() {
272
- y.value = !0, t.toast("开启纯净模式,双击即可退出");
270
+ D.value = 0, C.value = 0, L.value = x.value, T.value = P.value, k.value = !1;
273
271
  }
274
272
  function K() {
275
- y.value && (y.value = !1, t.toast("退出纯净模式"));
273
+ be(E.value.name), t.toast("复制成功");
276
274
  }
277
275
  function Z() {
278
- n.disableDownload || pe(E.value.url, {
276
+ g.value = !0, t.toast("开启纯净模式,双击即可退出");
277
+ }
278
+ function Q() {
279
+ g.value && (g.value = !1, t.toast("退出纯净模式"));
280
+ }
281
+ function _() {
282
+ n.disableDownload || me(E.value.url, {
279
283
  allowCrossOrigin: !0
280
284
  });
281
285
  }
282
- function Q() {
286
+ function ee() {
283
287
  t.destroy(l);
284
288
  }
285
289
  return (i, e) => (s(), o("div", {
286
- class: "p-media-album",
287
- onDblclick: e[10] || (e[10] = (r) => K())
290
+ class: X(["p-media-album", `is-skin-${n.skin}`]),
291
+ onDblclick: e[10] || (e[10] = (r) => Q())
288
292
  }, [
289
293
  d("div", {
290
294
  class: "media",
291
- onWheel: e[1] || (e[1] = (r) => W(r))
295
+ onWheel: e[1] || (e[1] = (r) => H(r))
292
296
  }, [
293
- (s(!0), o(N, null, ae(b.value, (r, z) => (s(), o(N, null, [
297
+ (s(!0), o(N, null, ie(b.value, (r, z) => (s(), o(N, null, [
294
298
  z === u.value ? (s(), o(N, { key: 0 }, [
295
299
  r.type === w.value.IMAGE ? (s(), o("img", {
296
- class: ie({ "is-draggable": !n.disableDrag }),
300
+ class: X({ "is-draggable": !n.disableDrag }),
297
301
  key: `media-${z}-${r.url}`,
298
302
  src: r.url,
299
- style: re(A.value),
300
- onMousedown: e[0] || (e[0] = (_) => q(_)),
303
+ style: ue(j.value),
304
+ onMousedown: e[0] || (e[0] = (te) => J(te)),
301
305
  dragable: "false"
302
- }, null, 46, be)) : v("", !0),
306
+ }, null, 46, he)) : v("", !0),
303
307
  r.type === w.value.VIDEO ? (s(), o("video", {
304
308
  key: 1,
305
309
  poster: r.poster,
@@ -308,55 +312,55 @@ const be = ["src"], he = ["poster", "src"], we = {
308
312
  controlslist: "nodownload noremoteplayback noplaybackrate",
309
313
  disablePictureInPicture: "",
310
314
  disableRemotePlayback: ""
311
- }, null, 8, he)) : v("", !0)
315
+ }, null, 8, we)) : v("", !0)
312
316
  ], 64)) : v("", !0)
313
317
  ], 64))), 256))
314
318
  ], 32),
315
- y.value ? v("", !0) : (s(), o("div", we, [
316
- n.disableCounter ? (s(), o("div", Pe)) : (s(), o("div", Ee, [
317
- d("span", ke, B(`${u.value + 1} `), 1),
319
+ g.value ? v("", !0) : (s(), o("div", Ee, [
320
+ n.disableCounter ? (s(), o("div", Ie)) : (s(), o("div", ke, [
321
+ d("span", xe, B(`${u.value + 1} `), 1),
318
322
  e[11] || (e[11] = d("span", { class: "connect" }, "/", -1)),
319
- d("span", xe, B(b.value.length), 1)
323
+ d("span", Pe, B(b.value.length), 1)
320
324
  ])),
321
325
  n.disableName ? v("", !0) : (s(), o("div", {
322
326
  key: 2,
323
327
  class: "control name",
324
- onClick: e[2] || (e[2] = (r) => H())
328
+ onClick: e[2] || (e[2] = (r) => K())
325
329
  }, B(E.value.name), 1)),
326
330
  d("div", {
327
331
  class: "control close",
328
- onClick: e[3] || (e[3] = (r) => Q())
332
+ onClick: e[3] || (e[3] = (r) => ee())
329
333
  }, [...e[12] || (e[12] = [
330
334
  d("i", { class: "iconfont-popup-plugin-preset album-close" }, null, -1)
331
335
  ])])
332
336
  ])),
333
- y.value ? v("", !0) : (s(), o("div", Ie, [
334
- j.value ? (s(), o("div", {
337
+ g.value ? v("", !0) : (s(), o("div", Oe, [
338
+ R.value ? (s(), o("div", {
335
339
  key: 0,
336
340
  class: "control back",
337
- onClick: e[4] || (e[4] = (r) => Y())
341
+ onClick: e[4] || (e[4] = (r) => G())
338
342
  }, [...e[13] || (e[13] = [
339
343
  d("i", { class: "iconfont-popup-plugin-preset album-prev" }, null, -1)
340
344
  ])])) : v("", !0)
341
345
  ])),
342
- y.value ? v("", !0) : (s(), o("div", Oe, [
343
- R.value ? (s(), o("div", {
346
+ g.value ? v("", !0) : (s(), o("div", Se, [
347
+ Y.value ? (s(), o("div", {
344
348
  key: 0,
345
349
  class: "control next",
346
- onClick: e[5] || (e[5] = (r) => G())
350
+ onClick: e[5] || (e[5] = (r) => V())
347
351
  }, [...e[14] || (e[14] = [
348
352
  d("i", { class: "iconfont-popup-plugin-preset album-next" }, null, -1)
349
353
  ])])) : v("", !0)
350
354
  ])),
351
- y.value ? v("", !0) : (s(), o("div", Se, [
352
- n.disablePure ? (s(), o("div", De)) : (s(), o("div", {
355
+ g.value ? v("", !0) : (s(), o("div", De, [
356
+ n.disablePure ? (s(), o("div", Ce)) : (s(), o("div", {
353
357
  key: 0,
354
358
  class: "control",
355
- onClick: e[6] || (e[6] = (r) => J())
359
+ onClick: e[6] || (e[6] = (r) => Z())
356
360
  }, [...e[15] || (e[15] = [
357
361
  d("i", { class: "iconfont-popup-plugin-preset album-pure" }, null, -1)
358
362
  ])])),
359
- d("div", Ce, [
363
+ d("div", Ue, [
360
364
  !n.disableScale && U.value ? (s(), o("div", {
361
365
  key: 0,
362
366
  class: "control",
@@ -372,17 +376,17 @@ const be = ["src"], he = ["poster", "src"], we = {
372
376
  d("i", { class: "iconfont-popup-plugin-preset album-narrow" }, null, -1)
373
377
  ])])) : v("", !0)
374
378
  ]),
375
- n.disableDownload ? (s(), o("div", Ue)) : (s(), o("div", {
379
+ n.disableDownload ? (s(), o("div", Me)) : (s(), o("div", {
376
380
  key: 2,
377
381
  class: "control download",
378
- onClick: e[9] || (e[9] = (r) => Z())
382
+ onClick: e[9] || (e[9] = (r) => _())
379
383
  }, [...e[18] || (e[18] = [
380
384
  d("i", { class: "iconfont-popup-plugin-preset download" }, null, -1)
381
385
  ])]))
382
386
  ]))
383
- ], 32));
387
+ ], 34));
384
388
  }
385
- }), Te = /* @__PURE__ */ de(Me, [["__scopeId", "data-v-e03b9968"]]);
389
+ }), Fe = /* @__PURE__ */ ve(Ne, [["__scopeId", "data-v-f011d0c2"]]);
386
390
  export {
387
- Te as default
391
+ Fe as default
388
392
  };
@@ -0,0 +1,71 @@
1
+ import { defineComponent as d, inject as c, createElementBlock as f, openBlock as m, normalizeClass as u, createVNode as o, withCtx as t, createElementVNode as P, toDisplayString as l, createTextVNode as C } from "vue";
2
+ import { usePopup as p, POPUP_COMPONENT_INJECTS as g } from "vue-popup-plus";
3
+ import { P as k, a as B, b as N } from "./PBody-Cotuzlbw.js";
4
+ import { P as x, a as b, b as h } from "./PButtonGroup-8zbI-6Gv.js";
5
+ import { _ as y } from "./_plugin-vue_export-helper-CHgC5LLL.js";
6
+ const I = { class: "content" }, T = /* @__PURE__ */ d({
7
+ name: "PAlert",
8
+ __name: "PAlert",
9
+ props: {
10
+ skin: {},
11
+ title: {},
12
+ headerClose: { type: Boolean },
13
+ content: {},
14
+ confirmText: {},
15
+ draggable: { type: Boolean }
16
+ },
17
+ setup(e) {
18
+ const r = p(), s = c(g.INSTANCE_ID);
19
+ function a() {
20
+ r.destroy(s);
21
+ }
22
+ return (v, n) => (m(), f("div", {
23
+ class: u(["p-alert", `is-skin-${e.skin}`])
24
+ }, [
25
+ o(k, { skin: e.skin }, {
26
+ header: t(() => [
27
+ o(N, {
28
+ draggable: e.draggable,
29
+ hasCloseButton: e.headerClose,
30
+ title: e.title,
31
+ onClose: n[0] || (n[0] = (i) => a()),
32
+ iconClass: "alert"
33
+ }, null, 8, ["draggable", "hasCloseButton", "title"])
34
+ ]),
35
+ footer: t(() => [
36
+ o(x, null, {
37
+ default: t(() => [
38
+ o(b, { align: "end" }, {
39
+ default: t(() => [
40
+ o(h, {
41
+ onClick: n[1] || (n[1] = (i) => a()),
42
+ theme: "primary"
43
+ }, {
44
+ default: t(() => [
45
+ C(l(e.confirmText), 1)
46
+ ]),
47
+ _: 1
48
+ })
49
+ ]),
50
+ _: 1
51
+ })
52
+ ]),
53
+ _: 1
54
+ })
55
+ ]),
56
+ default: t(() => [
57
+ o(B, { fitIcon: "" }, {
58
+ default: t(() => [
59
+ P("div", I, l(e.content), 1)
60
+ ]),
61
+ _: 1
62
+ })
63
+ ]),
64
+ _: 1
65
+ }, 8, ["skin"])
66
+ ], 2));
67
+ }
68
+ }), V = /* @__PURE__ */ y(T, [["__scopeId", "data-v-0c05cd49"]]);
69
+ export {
70
+ V as default
71
+ };
@@ -0,0 +1,129 @@
1
+ import { _ as g } from "./_plugin-vue_export-helper-CHgC5LLL.js";
2
+ import { defineComponent as h, provide as H, createElementBlock as f, openBlock as l, normalizeClass as s, renderSlot as c, createElementVNode as r, inject as u, computed as T, withModifiers as L, ref as a, watch as V, unref as Y, createCommentVNode as S, toDisplayString as j, createBlock as U } from "vue";
3
+ import { usePopup as x, POPUP_COMPONENT_INJECTS as M } from "vue-popup-plus";
4
+ const z = { class: "body" }, k = Symbol("skin"), A = /* @__PURE__ */ h({
5
+ name: "PScaffold",
6
+ __name: "PScaffold",
7
+ props: {
8
+ skin: {}
9
+ },
10
+ setup(e) {
11
+ return H(k, e.skin), (t, o) => (l(), f("div", {
12
+ class: s(["p-scaffold", `is-skin-${e.skin}`])
13
+ }, [
14
+ c(t.$slots, "header", {}, void 0, !0),
15
+ r("div", z, [
16
+ c(t.$slots, "default", {}, void 0, !0)
17
+ ]),
18
+ c(t.$slots, "footer", {}, void 0, !0)
19
+ ], 2));
20
+ }
21
+ }), ee = /* @__PURE__ */ g(A, [["__scopeId", "data-v-bc605f70"]]), J = /* @__PURE__ */ h({
22
+ name: "PHeaderButton",
23
+ __name: "PHeaderButton",
24
+ props: {
25
+ iconClass: { default: "" },
26
+ theme: { default: "primary" },
27
+ disabled: { type: Boolean, default: !1 },
28
+ actived: { type: Boolean, default: !1 }
29
+ },
30
+ emits: ["click"],
31
+ setup(e, { emit: t }) {
32
+ const o = u(k, "modern"), m = t, v = T(() => ({
33
+ [`is-skin-${o}`]: !0,
34
+ [`is-theme-${e.theme}`]: !0,
35
+ "is-disabled": e.disabled,
36
+ "is-active": e.actived
37
+ }));
38
+ function C() {
39
+ e.disabled || m("click");
40
+ }
41
+ return ($, d) => (l(), f("div", {
42
+ class: s(["p-header-button", v.value]),
43
+ onClick: d[0] || (d[0] = L((P) => C(), ["stop"]))
44
+ }, [
45
+ r("i", {
46
+ class: s(["iconfont-popup-plugin-preset", e.iconClass])
47
+ }, null, 2)
48
+ ], 2));
49
+ }
50
+ }), W = /* @__PURE__ */ g(J, [["__scopeId", "data-v-41a6ff2b"]]), q = { class: "title" }, F = { class: "btn-ctn" }, G = /* @__PURE__ */ h({
51
+ name: "PHeader",
52
+ __name: "PHeader",
53
+ props: {
54
+ title: { default: "" },
55
+ iconClass: { default: "" },
56
+ iconTheme: { default: "primary" },
57
+ hasCloseButton: { type: Boolean, default: !0 },
58
+ draggable: { type: Boolean, default: !1 }
59
+ },
60
+ emits: ["close"],
61
+ setup(e, { emit: t }) {
62
+ const o = x(), m = u(M.INSTANCE_ID), v = u(M.COMPUTED_VIEW_STYLE), C = u(k, "modern"), $ = t, d = a(0), P = a(0), w = a(0), O = a(0), b = a(0), y = a(0), B = a(!1), _ = T(() => !!e.iconClass);
63
+ V([b, y], N);
64
+ function D() {
65
+ e.hasCloseButton && $("close");
66
+ }
67
+ function X(n) {
68
+ e.draggable && (d.value = n.clientX, P.value = n.clientY, w.value = v.value.translateX, O.value = v.value.translateY, B.value = !0, n.preventDefault(), window.addEventListener("mousemove", E), window.addEventListener("mouseup", I));
69
+ }
70
+ function E(n) {
71
+ if (!B.value) return;
72
+ const i = Math.ceil(n.clientX - d.value), p = Math.ceil(n.clientY - P.value);
73
+ b.value = w.value + i, y.value = O.value + p;
74
+ }
75
+ function I(n) {
76
+ B.value = !1, window.removeEventListener("mousemove", E), window.removeEventListener("mouseup", I);
77
+ }
78
+ function N() {
79
+ o.update(m, {
80
+ viewTranslateX: b.value,
81
+ viewTranslateY: y.value
82
+ });
83
+ }
84
+ return (n, i) => (l(), f("div", {
85
+ class: s(["p-header", [`is-skin-${Y(C)}`, { "is-draggable": e.draggable }]]),
86
+ onMousedown: i[1] || (i[1] = (p) => X(p))
87
+ }, [
88
+ _.value ? (l(), f("div", {
89
+ key: 0,
90
+ class: s(["icon", `is-theme-${e.iconTheme}`])
91
+ }, [
92
+ r("i", {
93
+ class: s(["iconfont-popup-plugin-preset", e.iconClass])
94
+ }, null, 2)
95
+ ], 2)) : S("", !0),
96
+ r("div", q, j(e.title), 1),
97
+ r("div", F, [
98
+ c(n.$slots, "buttons", {}, void 0, !0),
99
+ e.hasCloseButton ? (l(), U(W, {
100
+ key: 0,
101
+ onClick: i[0] || (i[0] = (p) => D()),
102
+ iconClass: "close",
103
+ theme: "danger"
104
+ })) : S("", !0)
105
+ ])
106
+ ], 34));
107
+ }
108
+ }), te = /* @__PURE__ */ g(G, [["__scopeId", "data-v-f8f28375"]]), K = /* @__PURE__ */ h({
109
+ name: "PBody",
110
+ __name: "PBody",
111
+ props: {
112
+ withPadding: { type: Boolean, default: !0 },
113
+ fitIcon: { type: Boolean }
114
+ },
115
+ setup(e) {
116
+ const t = u(k, "modern");
117
+ return (o, m) => (l(), f("div", {
118
+ class: s(["p-body", [`is-skin-${Y(t)}`, { "has-padding": e.withPadding, "is-fit-icon": e.fitIcon }]])
119
+ }, [
120
+ c(o.$slots, "default", {}, void 0, !0)
121
+ ], 2));
122
+ }
123
+ }), ne = /* @__PURE__ */ g(K, [["__scopeId", "data-v-ae7d6884"]]);
124
+ export {
125
+ ee as P,
126
+ ne as a,
127
+ te as b,
128
+ W as c
129
+ };