function-call.mjs 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
  2. import { extend, inBrowser, withInstall } from "../utils/index.mjs";
  3. import { mountComponent, usePopupState } from "../utils/mount-component.mjs";
  4. import VanImagePreview from "./ImagePreview.mjs";
  5. let instance;
  6. const defaultConfig = {
  7. loop: true,
  8. images: [],
  9. maxZoom: 3,
  10. minZoom: 1 / 3,
  11. onScale: void 0,
  12. onClose: void 0,
  13. onChange: void 0,
  14. teleport: "body",
  15. className: "",
  16. showIndex: true,
  17. closeable: false,
  18. closeIcon: "clear",
  19. transition: void 0,
  20. beforeClose: void 0,
  21. overlayStyle: void 0,
  22. overlayClass: void 0,
  23. startPosition: 0,
  24. swipeDuration: 300,
  25. showIndicators: false,
  26. closeOnPopstate: true,
  27. closeIconPosition: "top-right"
  28. };
  29. function initInstance() {
  30. ({
  31. instance
  32. } = mountComponent({
  33. setup() {
  34. const {
  35. state,
  36. toggle
  37. } = usePopupState();
  38. const onClosed = () => {
  39. state.images = [];
  40. };
  41. return () => _createVNode(VanImagePreview, _mergeProps(state, {
  42. "onClosed": onClosed,
  43. "onUpdate:show": toggle
  44. }), null);
  45. }
  46. }));
  47. }
  48. const ImagePreview = (options, startPosition = 0) => {
  49. if (!inBrowser) {
  50. return;
  51. }
  52. if (!instance) {
  53. initInstance();
  54. }
  55. options = Array.isArray(options) ? {
  56. images: options,
  57. startPosition
  58. } : options;
  59. instance.open(extend({}, defaultConfig, options));
  60. return instance;
  61. };
  62. ImagePreview.Component = withInstall(VanImagePreview);
  63. ImagePreview.install = (app) => {
  64. app.use(ImagePreview.Component);
  65. };
  66. export {
  67. ImagePreview
  68. };