@v-c/image 1.0.12 → 1.1.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/Image.js
CHANGED
|
@@ -166,7 +166,7 @@ var Image = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
|
|
|
166
166
|
}), null)]);
|
|
167
167
|
};
|
|
168
168
|
}, {
|
|
169
|
-
props:
|
|
169
|
+
props: /*@__PURE__*/ mergeDefaults({
|
|
170
170
|
prefixCls: {
|
|
171
171
|
type: String,
|
|
172
172
|
required: false,
|
|
@@ -198,16 +198,9 @@ var Image = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
|
|
|
198
198
|
default: void 0
|
|
199
199
|
},
|
|
200
200
|
placeholder: {
|
|
201
|
-
type:
|
|
202
|
-
Boolean,
|
|
203
|
-
Object,
|
|
204
|
-
Function,
|
|
205
|
-
String,
|
|
206
|
-
Number,
|
|
207
|
-
null,
|
|
208
|
-
Array
|
|
209
|
-
],
|
|
201
|
+
type: Boolean,
|
|
210
202
|
required: false,
|
|
203
|
+
skipCheck: true,
|
|
211
204
|
default: void 0
|
|
212
205
|
},
|
|
213
206
|
fallback: {
|
package/dist/Preview/CloseBtn.js
CHANGED
package/dist/Preview/index.d.ts
CHANGED
|
@@ -56,6 +56,8 @@ export interface InternalPreviewConfig {
|
|
|
56
56
|
scaleStep?: number;
|
|
57
57
|
minScale?: number;
|
|
58
58
|
maxScale?: number;
|
|
59
|
+
/** Whether to enable mouse wheel zoom. Default is true. */
|
|
60
|
+
wheel?: boolean;
|
|
59
61
|
motionName?: string;
|
|
60
62
|
open?: boolean;
|
|
61
63
|
getContainer?: PortalProps['getContainer'];
|
package/dist/Preview/index.js
CHANGED
|
@@ -30,7 +30,7 @@ var Preview = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
|
|
|
30
30
|
}
|
|
31
31
|
});
|
|
32
32
|
const { transform, resetTransform, updateTransform, dispatchZoomChange } = useImageTransform(imgEl, computed(() => props.minScale ?? 1), computed(() => props.maxScale ?? 50), (info) => props.onTransform?.(info));
|
|
33
|
-
const { isMoving, onMouseDown, onWheel } = useMouseEvent(imgEl, computed(() => props.movable ?? true), computed(() => !!props.open), computed(() => props.scaleStep ?? .5), transform, updateTransform, dispatchZoomChange);
|
|
33
|
+
const { isMoving, onMouseDown, onWheel } = useMouseEvent(imgEl, computed(() => props.movable ?? true), computed(() => !!props.open), computed(() => props.scaleStep ?? .5), transform, updateTransform, dispatchZoomChange, computed(() => props.wheel ?? true));
|
|
34
34
|
const { isTouching, onTouchStart, onTouchMove, onTouchEnd } = useTouchEvent(imgEl, computed(() => props.movable ?? true), computed(() => !!props.open), computed(() => props.minScale ?? 1), transform, updateTransform, dispatchZoomChange);
|
|
35
35
|
watch(imgEl, (el, _old, onCleanup) => {
|
|
36
36
|
if (!el) return;
|
|
@@ -251,7 +251,7 @@ var Preview = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
|
|
|
251
251
|
} })] });
|
|
252
252
|
};
|
|
253
253
|
}, {
|
|
254
|
-
props:
|
|
254
|
+
props: /*@__PURE__*/ mergeDefaults({
|
|
255
255
|
prefixCls: {
|
|
256
256
|
type: String,
|
|
257
257
|
required: true
|
|
@@ -345,6 +345,11 @@ var Preview = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
|
|
|
345
345
|
required: false,
|
|
346
346
|
default: void 0
|
|
347
347
|
},
|
|
348
|
+
wheel: {
|
|
349
|
+
type: Boolean,
|
|
350
|
+
required: false,
|
|
351
|
+
default: void 0
|
|
352
|
+
},
|
|
348
353
|
motionName: {
|
|
349
354
|
type: String,
|
|
350
355
|
required: false,
|
|
@@ -390,16 +395,9 @@ var Preview = /* @__PURE__ */ defineComponent((props, { attrs, slots }) => {
|
|
|
390
395
|
default: void 0
|
|
391
396
|
},
|
|
392
397
|
closeIcon: {
|
|
393
|
-
type: [
|
|
394
|
-
Object,
|
|
395
|
-
Function,
|
|
396
|
-
String,
|
|
397
|
-
Number,
|
|
398
|
-
null,
|
|
399
|
-
Boolean,
|
|
400
|
-
Array
|
|
401
|
-
],
|
|
398
|
+
type: [Boolean, null],
|
|
402
399
|
required: false,
|
|
400
|
+
skipCheck: true,
|
|
403
401
|
default: void 0
|
|
404
402
|
},
|
|
405
403
|
onTransform: {
|
package/dist/PreviewGroup.js
CHANGED
|
@@ -75,7 +75,7 @@ var PreviewGroup = /* @__PURE__ */ defineComponent((props, { slots, emit }) => {
|
|
|
75
75
|
}), slots)]);
|
|
76
76
|
};
|
|
77
77
|
}, {
|
|
78
|
-
props:
|
|
78
|
+
props: /*@__PURE__*/ mergeDefaults({
|
|
79
79
|
previewPrefixCls: {
|
|
80
80
|
type: String,
|
|
81
81
|
required: false,
|
|
@@ -111,15 +111,6 @@ var PreviewGroup = /* @__PURE__ */ defineComponent((props, { slots, emit }) => {
|
|
|
111
111
|
default: void 0
|
|
112
112
|
},
|
|
113
113
|
children: {
|
|
114
|
-
type: [
|
|
115
|
-
Object,
|
|
116
|
-
Function,
|
|
117
|
-
String,
|
|
118
|
-
Number,
|
|
119
|
-
null,
|
|
120
|
-
Boolean,
|
|
121
|
-
Array
|
|
122
|
-
],
|
|
123
114
|
required: false,
|
|
124
115
|
default: void 0
|
|
125
116
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Ref } from 'vue';
|
|
2
2
|
import { DispatchZoomChangeFunc, TransformType, UpdateTransformFunc } from './useImageTransform.ts';
|
|
3
|
-
export default function useMouseEvent(imgRef: Ref<HTMLImageElement>, movable: Ref<boolean>, open: Ref<boolean>, scaleStep: Ref<number>, transform: Ref<TransformType>, updateTransform: UpdateTransformFunc, dispatchZoomChange: DispatchZoomChangeFunc): {
|
|
3
|
+
export default function useMouseEvent(imgRef: Ref<HTMLImageElement>, movable: Ref<boolean>, open: Ref<boolean>, scaleStep: Ref<number>, transform: Ref<TransformType>, updateTransform: UpdateTransformFunc, dispatchZoomChange: DispatchZoomChangeFunc, wheel?: Ref<boolean>): {
|
|
4
4
|
isMoving: import('vue').ShallowRef<boolean, boolean>;
|
|
5
5
|
onMouseDown: (event: MouseEvent) => void;
|
|
6
6
|
onMouseMove: (event: MouseEvent) => void;
|
|
@@ -4,7 +4,7 @@ import { shallowRef, watch } from "vue";
|
|
|
4
4
|
import { warning } from "@v-c/util";
|
|
5
5
|
import canUseDom from "@v-c/util/dist/Dom/canUseDom";
|
|
6
6
|
//#region src/hooks/useMouseEvent.ts
|
|
7
|
-
function useMouseEvent(imgRef, movable, open, scaleStep, transform, updateTransform, dispatchZoomChange) {
|
|
7
|
+
function useMouseEvent(imgRef, movable, open, scaleStep, transform, updateTransform, dispatchZoomChange, wheel) {
|
|
8
8
|
const isMoving = shallowRef(false);
|
|
9
9
|
const startPositionInfo = shallowRef({
|
|
10
10
|
diffX: 0,
|
|
@@ -48,7 +48,7 @@ function useMouseEvent(imgRef, movable, open, scaleStep, transform, updateTransf
|
|
|
48
48
|
}
|
|
49
49
|
};
|
|
50
50
|
const onWheel = (event) => {
|
|
51
|
-
if (!open.value || event.deltaY === 0) return;
|
|
51
|
+
if (!open.value || !(wheel?.value ?? true) || event.deltaY === 0) return;
|
|
52
52
|
const scaleRatio = Math.abs(event.deltaY / 100);
|
|
53
53
|
let ratio = 1 + Math.min(scaleRatio, 1) * scaleStep.value;
|
|
54
54
|
if (event.deltaY > 0) ratio = 1 / ratio;
|
package/package.json
CHANGED
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@v-c/image",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.0
|
|
4
|
+
"version": "1.1.0",
|
|
5
5
|
"description": "image component",
|
|
6
6
|
"author": "",
|
|
7
7
|
"license": "MIT",
|
|
8
|
+
"homepage": "https://github.com/antdv-next/vue-components/tree/next/packages/image",
|
|
9
|
+
"repository": {
|
|
10
|
+
"type": "git",
|
|
11
|
+
"url": "https://github.com/antdv-next/vue-components.git"
|
|
12
|
+
},
|
|
8
13
|
"keywords": [
|
|
9
14
|
"image",
|
|
10
15
|
"vue-image",
|
|
@@ -33,7 +38,7 @@
|
|
|
33
38
|
},
|
|
34
39
|
"dependencies": {
|
|
35
40
|
"@v-c/portal": "^1.0.8",
|
|
36
|
-
"@v-c/util": "^1.0
|
|
41
|
+
"@v-c/util": "^1.1.0"
|
|
37
42
|
},
|
|
38
43
|
"devDependencies": {
|
|
39
44
|
"@ant-design/icons-vue": "^7.0.1"
|