@yoobic/yobi 8.6.51 → 8.6.53
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/cjs/yoo-photo-editor.cjs.entry.js +3 -2
- package/dist/cjs/yoo-zoom.cjs.entry.js +1 -3
- package/dist/collection/components/3.organisms/photo-editor/photo-editor.js +3 -2
- package/dist/collection/components/3.organisms/zoom/zoom.js +1 -3
- package/dist/design-system/yoo-photo-editor.entry.js +3 -2
- package/dist/design-system/yoo-zoom.entry.js +1 -3
- package/dist/esm/yoo-photo-editor.entry.js +3 -2
- package/dist/esm/yoo-zoom.entry.js +1 -3
- package/package.json +1 -1
|
@@ -1413,8 +1413,9 @@ const YooPhotoEditorComponent = class {
|
|
|
1413
1413
|
return !this.isPreview && this.isImageEditable && index.h(Actions, { submitButton: this.submitButton, onActionClick: (ev, btnContent) => this.optionsClick(ev, btnContent) });
|
|
1414
1414
|
}
|
|
1415
1415
|
renderContent() {
|
|
1416
|
-
|
|
1417
|
-
|
|
1416
|
+
var _a;
|
|
1417
|
+
const scaleFactor = this.isImageZoomable ? (_a = this.imageSize) === null || _a === void 0 ? void 0 : _a.scaleFactor : 1;
|
|
1418
|
+
return (index.h("yoo-zoom", { maxScale: this.isPreview ? scaleFactor : 1, allowWheelGesture: false, initScale: scaleFactor, minScale: scaleFactor, disabled: this.isPreview || !this.isImageZoomable, hidden: this.isLoading, animated: this.isReadonly && !this.isPreview, ref: e => this.zoomElement = e, references: ['#src', '#drawings'], disableZoomOnSelectors: ['.annotation'], ...{ mode: this.mode }, onZoom: (ev) => this.onImageZoom(ev) }, this.renderOverlay(), this.renderDrawingsCanvas(), this.isReadonly ? this.renderImage() : this.renderSrcCanvas(), this.renderCursorPicker(), this.renderAnnotations()));
|
|
1418
1419
|
}
|
|
1419
1420
|
renderLoader() {
|
|
1420
1421
|
return this.isLoading && index.h("yoo-loader", { class: "absolute", size: "large" });
|
|
@@ -88,13 +88,11 @@ const YooZoomComponent = class {
|
|
|
88
88
|
const { x, y, z } = current;
|
|
89
89
|
if (ref) {
|
|
90
90
|
!!duration && (ref.style.transition = `transform ${duration}s ease-in-out`);
|
|
91
|
-
|
|
92
|
-
let transformValue = `scale(${scaleValue}, ${scaleValue})`;
|
|
91
|
+
let transformValue = z === 1 ? '' : `scale(${z}, ${z})`;
|
|
93
92
|
if (x || y) {
|
|
94
93
|
transformValue += ` translate(${x}px, ${y}px)`;
|
|
95
94
|
}
|
|
96
95
|
ref.style.transform = transformValue;
|
|
97
|
-
this.disabled && ref.style.removeProperty('transform');
|
|
98
96
|
}
|
|
99
97
|
}));
|
|
100
98
|
const clampValue = (value, axis) => {
|
|
@@ -1227,8 +1227,9 @@ export class YooPhotoEditorComponent {
|
|
|
1227
1227
|
return !this.isPreview && this.isImageEditable && h(Actions, { submitButton: this.submitButton, onActionClick: (ev, btnContent) => this.optionsClick(ev, btnContent) });
|
|
1228
1228
|
}
|
|
1229
1229
|
renderContent() {
|
|
1230
|
-
|
|
1231
|
-
|
|
1230
|
+
var _a;
|
|
1231
|
+
const scaleFactor = this.isImageZoomable ? (_a = this.imageSize) === null || _a === void 0 ? void 0 : _a.scaleFactor : 1;
|
|
1232
|
+
return (h("yoo-zoom", { maxScale: this.isPreview ? scaleFactor : 1, allowWheelGesture: false, initScale: scaleFactor, minScale: scaleFactor, disabled: this.isPreview || !this.isImageZoomable, hidden: this.isLoading, animated: this.isReadonly && !this.isPreview, ref: e => this.zoomElement = e, references: ['#src', '#drawings'], disableZoomOnSelectors: ['.annotation'], ...{ mode: this.mode }, onZoom: (ev) => this.onImageZoom(ev) }, this.renderOverlay(), this.renderDrawingsCanvas(), this.isReadonly ? this.renderImage() : this.renderSrcCanvas(), this.renderCursorPicker(), this.renderAnnotations()));
|
|
1232
1233
|
}
|
|
1233
1234
|
renderLoader() {
|
|
1234
1235
|
return this.isLoading && h("yoo-loader", { class: "absolute", size: "large" });
|
|
@@ -75,13 +75,11 @@ export class YooZoomComponent {
|
|
|
75
75
|
const { x, y, z } = current;
|
|
76
76
|
if (ref) {
|
|
77
77
|
!!duration && (ref.style.transition = `transform ${duration}s ease-in-out`);
|
|
78
|
-
|
|
79
|
-
let transformValue = `scale(${scaleValue}, ${scaleValue})`;
|
|
78
|
+
let transformValue = z === 1 ? '' : `scale(${z}, ${z})`;
|
|
80
79
|
if (x || y) {
|
|
81
80
|
transformValue += ` translate(${x}px, ${y}px)`;
|
|
82
81
|
}
|
|
83
82
|
ref.style.transform = transformValue;
|
|
84
|
-
this.disabled && ref.style.removeProperty('transform');
|
|
85
83
|
}
|
|
86
84
|
}));
|
|
87
85
|
const clampValue = (value, axis) => {
|
|
@@ -1409,8 +1409,9 @@ const YooPhotoEditorComponent = class {
|
|
|
1409
1409
|
return !this.isPreview && this.isImageEditable && h(Actions, { submitButton: this.submitButton, onActionClick: (ev, btnContent) => this.optionsClick(ev, btnContent) });
|
|
1410
1410
|
}
|
|
1411
1411
|
renderContent() {
|
|
1412
|
-
|
|
1413
|
-
|
|
1412
|
+
var _a;
|
|
1413
|
+
const scaleFactor = this.isImageZoomable ? (_a = this.imageSize) === null || _a === void 0 ? void 0 : _a.scaleFactor : 1;
|
|
1414
|
+
return (h("yoo-zoom", { maxScale: this.isPreview ? scaleFactor : 1, allowWheelGesture: false, initScale: scaleFactor, minScale: scaleFactor, disabled: this.isPreview || !this.isImageZoomable, hidden: this.isLoading, animated: this.isReadonly && !this.isPreview, ref: e => this.zoomElement = e, references: ['#src', '#drawings'], disableZoomOnSelectors: ['.annotation'], ...{ mode: this.mode }, onZoom: (ev) => this.onImageZoom(ev) }, this.renderOverlay(), this.renderDrawingsCanvas(), this.isReadonly ? this.renderImage() : this.renderSrcCanvas(), this.renderCursorPicker(), this.renderAnnotations()));
|
|
1414
1415
|
}
|
|
1415
1416
|
renderLoader() {
|
|
1416
1417
|
return this.isLoading && h("yoo-loader", { class: "absolute", size: "large" });
|
|
@@ -84,13 +84,11 @@ const YooZoomComponent = class {
|
|
|
84
84
|
const { x, y, z } = current;
|
|
85
85
|
if (ref) {
|
|
86
86
|
!!duration && (ref.style.transition = `transform ${duration}s ease-in-out`);
|
|
87
|
-
|
|
88
|
-
let transformValue = `scale(${scaleValue}, ${scaleValue})`;
|
|
87
|
+
let transformValue = z === 1 ? '' : `scale(${z}, ${z})`;
|
|
89
88
|
if (x || y) {
|
|
90
89
|
transformValue += ` translate(${x}px, ${y}px)`;
|
|
91
90
|
}
|
|
92
91
|
ref.style.transform = transformValue;
|
|
93
|
-
this.disabled && ref.style.removeProperty('transform');
|
|
94
92
|
}
|
|
95
93
|
}));
|
|
96
94
|
const clampValue = (value, axis) => {
|
|
@@ -1409,8 +1409,9 @@ const YooPhotoEditorComponent = class {
|
|
|
1409
1409
|
return !this.isPreview && this.isImageEditable && h(Actions, { submitButton: this.submitButton, onActionClick: (ev, btnContent) => this.optionsClick(ev, btnContent) });
|
|
1410
1410
|
}
|
|
1411
1411
|
renderContent() {
|
|
1412
|
-
|
|
1413
|
-
|
|
1412
|
+
var _a;
|
|
1413
|
+
const scaleFactor = this.isImageZoomable ? (_a = this.imageSize) === null || _a === void 0 ? void 0 : _a.scaleFactor : 1;
|
|
1414
|
+
return (h("yoo-zoom", { maxScale: this.isPreview ? scaleFactor : 1, allowWheelGesture: false, initScale: scaleFactor, minScale: scaleFactor, disabled: this.isPreview || !this.isImageZoomable, hidden: this.isLoading, animated: this.isReadonly && !this.isPreview, ref: e => this.zoomElement = e, references: ['#src', '#drawings'], disableZoomOnSelectors: ['.annotation'], ...{ mode: this.mode }, onZoom: (ev) => this.onImageZoom(ev) }, this.renderOverlay(), this.renderDrawingsCanvas(), this.isReadonly ? this.renderImage() : this.renderSrcCanvas(), this.renderCursorPicker(), this.renderAnnotations()));
|
|
1414
1415
|
}
|
|
1415
1416
|
renderLoader() {
|
|
1416
1417
|
return this.isLoading && h("yoo-loader", { class: "absolute", size: "large" });
|
|
@@ -84,13 +84,11 @@ const YooZoomComponent = class {
|
|
|
84
84
|
const { x, y, z } = current;
|
|
85
85
|
if (ref) {
|
|
86
86
|
!!duration && (ref.style.transition = `transform ${duration}s ease-in-out`);
|
|
87
|
-
|
|
88
|
-
let transformValue = `scale(${scaleValue}, ${scaleValue})`;
|
|
87
|
+
let transformValue = z === 1 ? '' : `scale(${z}, ${z})`;
|
|
89
88
|
if (x || y) {
|
|
90
89
|
transformValue += ` translate(${x}px, ${y}px)`;
|
|
91
90
|
}
|
|
92
91
|
ref.style.transform = transformValue;
|
|
93
|
-
this.disabled && ref.style.removeProperty('transform');
|
|
94
92
|
}
|
|
95
93
|
}));
|
|
96
94
|
const clampValue = (value, axis) => {
|