@pooder/kit 6.3.0 → 6.3.1

package/.test-dist/src/extensions/image/ImageTool.js

@@ -12,6 +12,7 @@ const layers_1 = require("../../shared/constants/layers");
 const commands_1 = require("./commands");
 const config_1 = require("./config");
 const imageOperations_1 = require("./imageOperations");
+const imagePlacement_1 = require("./imagePlacement");
 const sessionOverlay_1 = require("./sessionOverlay");
 const IMAGE_DEFAULT_CONTROL_CAPABILITIES = [
     "rotate",
@@ -63,6 +64,7 @@ class ImageTool {
         this.activeSnapX = null;
         this.activeSnapY = null;
         this.movingImageId = null;
+        this.sessionNotice = null;
         this.hasRenderedSnapGuides = false;
         this.subscriptions = new subscriptions_1.SubscriptionBag();
         this.imageControlsByCapabilityKey = new Map();
@@ -228,7 +230,11 @@ class ImageTool {
                 }
                 if (e.key.startsWith("size.") ||
                     e.key.startsWith("image.frame.") ||
+                    e.key.startsWith("image.session.") ||
                     e.key.startsWith("image.control.")) {
+                    if (e.key === "image.session.placementPolicy") {
+                        this.clearSessionNotice();
+                    }
                     if (e.key.startsWith("image.control.")) {
                         this.imageControlsByCapabilityKey.clear();
                     }
@@ -648,6 +654,7 @@ class ImageTool {
                     interaction: "session",
                     commands: {
                         begin: "imageSessionReset",
+                        validate: "validateImageSession",
                         commit: "completeImages",
                         rollback: "imageSessionReset",
                     },
@@ -690,6 +697,34 @@ class ImageTool {
     getViewItems() {
         return this.isToolActive ? this.workingItems : this.items;
     }
+    getPlacementPolicy() {
+        const policy = this.getConfig("image.session.placementPolicy", "free");
+        return policy === "warn" || policy === "strict" ? policy : "free";
+    }
+    areSessionNoticesEqual(a, b) {
+        if (!a && !b)
+            return true;
+        if (!a || !b)
+            return false;
+        return (a.code === b.code &&
+            a.level === b.level &&
+            a.message === b.message &&
+            a.policy === b.policy &&
+            JSON.stringify(a.imageIds) === JSON.stringify(b.imageIds));
+    }
+    setSessionNotice(notice, options = {}) {
+        if (this.areSessionNoticesEqual(this.sessionNotice, notice)) {
+            return;
+        }
+        this.sessionNotice = notice;
+        if (options.emit !== false) {
+            this.context?.eventBus.emit("image:session:notice", this.sessionNotice);
+            this.emitImageStateChange();
+        }
+    }
+    clearSessionNotice(options = {}) {
+        this.setSessionNotice(null, options);
+    }
     getImageViewState() {
         this.syncToolActiveFromWorkbench();
         const items = this.cloneItems(this.getViewItems());
@@ -705,6 +740,8 @@ class ImageTool {
             isImageSelectionActive: this.isImageSelectionActive,
             hasWorkingChanges: this.hasWorkingChanges,
             source: this.isToolActive ? "working" : "committed",
+            placementPolicy: this.getPlacementPolicy(),
+            sessionNotice: this.sessionNotice,
         };
     }
     emitImageStateChange() {
@@ -754,6 +791,7 @@ class ImageTool {
     }
     async addImageEntry(url, options, operation) {
         this.syncToolActiveFromWorkbench();
+        this.clearSessionNotice({ emit: false });
         const id = this.generateId();
         const newItem = this.normalizeItem({
             id,
@@ -855,6 +893,7 @@ class ImageTool {
     updateConfig(newItems, skipCanvasUpdate = false) {
         if (!this.context)
             return;
+        this.clearSessionNotice({ emit: false });
         this.applyCommittedItems(newItems);
         (0, sessionState_1.runDeferredConfigUpdate)(this, () => {
             const configService = this.context?.services.get("ConfigurationService");
@@ -947,6 +986,72 @@ class ImageTool {
     getCoverScale(frame, size) {
         return (0, sourceSizeCache_1.getCoverScale)(frame, size);
     }
+    resolvePlacementState(item) {
+        return {
+            left: Number.isFinite(item.left) ? item.left : 0.5,
+            top: Number.isFinite(item.top) ? item.top : 0.5,
+            scale: Math.max(0.05, item.scale ?? 1),
+            angle: Number.isFinite(item.angle) ? item.angle : 0,
+        };
+    }
+    async validatePlacementForItem(item) {
+        const frame = this.getFrameRect();
+        if (!frame.width || !frame.height) {
+            return true;
+        }
+        const src = item.sourceUrl || item.url;
+        if (!src) {
+            return true;
+        }
+        const source = await this.resolveImageSourceSize(item.id, src);
+        if (!source) {
+            return true;
+        }
+        return (0, imagePlacement_1.validateImagePlacement)({
+            frame,
+            source,
+            placement: this.resolvePlacementState(item),
+        }).ok;
+    }
+    async validateImageSession() {
+        const policy = this.getPlacementPolicy();
+        if (policy === "free") {
+            this.clearSessionNotice();
+            return { ok: true, policy };
+        }
+        const invalidImageIds = [];
+        for (const item of this.workingItems) {
+            const valid = await this.validatePlacementForItem(item);
+            if (!valid) {
+                invalidImageIds.push(item.id);
+            }
+        }
+        if (!invalidImageIds.length) {
+            this.clearSessionNotice();
+            return { ok: true, policy };
+        }
+        const notice = {
+            code: "image-outside-frame",
+            level: policy === "strict" ? "error" : "warning",
+            message: policy === "strict"
+                ? "图片位置不能超出 frame，请调整后再提交。"
+                : "图片位置已超出 frame，建议调整后再提交。",
+            imageIds: invalidImageIds,
+            policy,
+        };
+        this.setSessionNotice(notice);
+        this.setImageFocus(invalidImageIds[0], {
+            syncCanvasSelection: true,
+            skipRender: true,
+        });
+        return {
+            ok: policy !== "strict",
+            reason: notice.code,
+            message: notice.message,
+            imageIds: notice.imageIds,
+            policy: notice.policy,
+        };
+    }
     getFrameVisualConfig() {
         const strokeStyleRaw = (this.getConfig("image.frame.strokeStyle", "dashed") || "dashed");
         const strokeStyle = strokeStyleRaw === "dashed" || strokeStyleRaw === "hidden"
@@ -1228,6 +1333,7 @@ class ImageTool {
         await this.updateImage(id, next, options);
     }
     resetImageSession() {
+        this.clearSessionNotice({ emit: false });
         this.workingItems = this.cloneItems(this.items);
         this.hasWorkingChanges = false;
         this.updateImages();
@@ -1237,6 +1343,7 @@ class ImageTool {
         const index = this.workingItems.findIndex((item) => item.id === id);
         if (index < 0)
             return;
+        this.clearSessionNotice({ emit: false });
         const next = [...this.workingItems];
         next[index] = this.normalizeItem({ ...next[index], ...updates });
         this.workingItems = next;
@@ -1254,6 +1361,7 @@ class ImageTool {
         const index = this.items.findIndex((item) => item.id === id);
         if (index < 0)
             return;
+        this.clearSessionNotice({ emit: false });
         const replacingSource = typeof updates.url === "string" && updates.url.length > 0;
         const next = [...this.items];
         const base = next[index];
@@ -1372,11 +1480,19 @@ class ImageTool {
             }
         }
         this.hasWorkingChanges = false;
+        this.clearSessionNotice({ emit: false });
         this.workingItems = this.cloneItems(next);
         this.updateConfig(next);
         this.emitWorkingChange(this.focusedImageId);
         return { ok: true };
     }
+    async completeImageSession() {
+        const validation = await this.validateImageSession();
+        if (!validation.ok) {
+            return validation;
+        }
+        return await this.commitWorkingImagesAsCropped();
+    }
     async exportCroppedImageByIds(imageIds, options) {
         if (!this.canvasService) {
             throw new Error("CanvasService not initialized");

package/.test-dist/src/extensions/image/commands.js

@@ -55,12 +55,20 @@ function createImageCommands(tool) {
                 tool.resetImageSession();
             },
         },
+        {
+            command: "validateImageSession",
+            id: "validateImageSession",
+            title: "Validate Image Session",
+            handler: async () => {
+                return await tool.validateImageSession();
+            },
+        },
         {
             command: "completeImages",
             id: "completeImages",
             title: "Complete Images",
             handler: async () => {
-                return await tool.commitWorkingImagesAsCropped();
+                return await tool.completeImageSession();
             },
         },
         {

package/.test-dist/src/extensions/image/config.js

@@ -125,5 +125,12 @@ function createImageConfigurations() {
             label: "Image Frame Outer Background",
             default: "#f5f5f5",
         },
+        {
+            id: "image.session.placementPolicy",
+            type: "select",
+            label: "Image Session Placement Policy",
+            options: ["free", "warn", "strict"],
+            default: "free",
+        },
     ];
 }

package/.test-dist/src/extensions/image/imagePlacement.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateImagePlacement = validateImagePlacement;
+const sourceSizeCache_1 = require("../../shared/imaging/sourceSizeCache");
+function toRadians(angle) {
+    return (angle * Math.PI) / 180;
+}
+function validateImagePlacement(args) {
+    const { frame, source, placement } = args;
+    if (frame.width <= 0 ||
+        frame.height <= 0 ||
+        source.width <= 0 ||
+        source.height <= 0) {
+        return { ok: true };
+    }
+    const coverScale = (0, sourceSizeCache_1.getCoverScale)(frame, source);
+    const imageWidth = source.width * coverScale * Math.max(0.05, Number(placement.scale || 1));
+    const imageHeight = source.height * coverScale * Math.max(0.05, Number(placement.scale || 1));
+    if (imageWidth <= 0 || imageHeight <= 0) {
+        return { ok: true };
+    }
+    const centerX = frame.left + placement.left * frame.width;
+    const centerY = frame.top + placement.top * frame.height;
+    const halfWidth = imageWidth / 2;
+    const halfHeight = imageHeight / 2;
+    const radians = toRadians(placement.angle || 0);
+    const cos = Math.cos(radians);
+    const sin = Math.sin(radians);
+    const frameCorners = [
+        { x: frame.left, y: frame.top },
+        { x: frame.left + frame.width, y: frame.top },
+        { x: frame.left + frame.width, y: frame.top + frame.height },
+        { x: frame.left, y: frame.top + frame.height },
+    ];
+    const coversFrame = frameCorners.every((corner) => {
+        const dx = corner.x - centerX;
+        const dy = corner.y - centerY;
+        const localX = dx * cos + dy * sin;
+        const localY = -dx * sin + dy * cos;
+        return (Math.abs(localX) <= halfWidth + 1e-6 &&
+            Math.abs(localY) <= halfHeight + 1e-6);
+    });
+    return { ok: coversFrame };
+}

package/.test-dist/tests/run.js

@@ -67,10 +67,12 @@ function testMaskOps() {
     assert(filled[4 * 9 + 4] === 1, "hole should be filled");
     const imgW = 2;
     const imgH = 1;
-    const rgba = new Uint8ClampedArray([
-        255, 255, 255, 255, 10, 10, 10, 254,
-    ]);
-    const imageData = { width: imgW, height: imgH, data: rgba };
+    const rgba = new Uint8ClampedArray([255, 255, 255, 255, 10, 10, 10, 254]);
+    const imageData = {
+        width: imgW,
+        height: imgH,
+        data: rgba,
+    };
     const paddedWidth = imgW + 4;
     const paddedHeight = imgH + 4;
     const created = (0, maskOps_1.createMask)(imageData, {
@@ -181,6 +183,8 @@ function testImageViewStateHelper() {
         isImageSelectionActive: false,
         hasWorkingChanges: false,
         source: "committed",
+        placementPolicy: "free",
+        sessionNotice: null,
     }) === false, "empty image state should report false");
     assert((0, model_1.hasAnyImageInViewState)({
         items: [
@@ -201,6 +205,8 @@ function testImageViewStateHelper() {
         isImageSelectionActive: true,
         hasWorkingChanges: true,
         source: "working",
+        placementPolicy: "free",
+        sessionNotice: null,
     }) === true, "non-empty image state should report true");
 }
 function testContributionCompatibility() {
@@ -217,6 +223,7 @@ function testContributionCompatibility() {
         "getImageViewState",
         "setImageTransform",
         "imageSessionReset",
+        "validateImageSession",
         "completeImages",
         "exportUserCroppedImage",
         "focusImage",
@@ -282,6 +289,7 @@ function testContributionCompatibility() {
         "image.frame.dashLength",
         "image.frame.innerBackground",
         "image.frame.outerBackground",
+        "image.session.placementPolicy",
     ];
     const expectedWhiteInkConfigKeys = [
         "whiteInk.items",

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @pooder/kit
 
+## 6.3.1
+
+### Patch Changes
+
+- image placement constraint
+- Updated dependencies
+  - @pooder/core@2.2.2
+
 ## 6.3.0
 
 ### Minor Changes

package/dist/index.d.mts

@@ -103,6 +103,16 @@ interface ImageViewState {
     isImageSelectionActive: boolean;
     hasWorkingChanges: boolean;
     source: "working" | "committed";
+    placementPolicy: ImageSessionPlacementPolicy;
+    sessionNotice: ImageSessionNotice | null;
+}
+type ImageSessionPlacementPolicy = "free" | "warn" | "strict";
+interface ImageSessionNotice {
+    code: "image-outside-frame";
+    level: "warning" | "error";
+    message: string;
+    imageIds: string[];
+    policy: ImageSessionPlacementPolicy;
 }
 declare class ImageTool implements Extension {
     id: string;
@@ -130,6 +140,7 @@ declare class ImageTool implements Extension {
     private activeSnapX;
     private activeSnapY;
     private movingImageId;
+    private sessionNotice;
     private hasRenderedSnapGuides;
     private canvasObjectMovingHandler?;
     private canvasMouseUpHandler?;
@@ -178,6 +189,7 @@ declare class ImageTool implements Extension {
             interaction: string;
             commands: {
                 begin: string;
+                validate: string;
                 commit: string;
                 rollback: string;
             };
@@ -193,6 +205,10 @@ declare class ImageTool implements Extension {
     private normalizeItems;
     private cloneItems;
     private getViewItems;
+    private getPlacementPolicy;
+    private areSessionNoticesEqual;
+    private setSessionNotice;
+    private clearSessionNotice;
     private getImageViewState;
     private emitImageStateChange;
     private emitWorkingChange;
@@ -217,6 +233,9 @@ declare class ImageTool implements Extension {
     private ensureSourceSize;
     private loadImageSize;
     private getCoverScale;
+    private resolvePlacementState;
+    private validatePlacementForItem;
+    private validateImageSession;
     private getFrameVisualConfig;
     private resolveSessionOverlayState;
     private getCropShapeHatchPattern;
@@ -238,6 +257,7 @@ declare class ImageTool implements Extension {
     private resolveImageSourceSize;
     private applyImageOperation;
     private commitWorkingImagesAsCropped;
+    private completeImageSession;
     private exportCroppedImageByIds;
     private exportUserCroppedImage;
 }
@@ -1146,4 +1166,4 @@ declare function createWhiteInkCommands(tool: any): CommandContribution[];
 
 declare function createWhiteInkConfigurations(): ConfigurationContribution[];
 
-export { type BackgroundConfig, type BackgroundFitMode, type BackgroundLayer, type BackgroundLayerKind, type BackgroundRegionUnit, type BackgroundRegistration, type BackgroundRegistrationFrame, type BackgroundRegistrationRegion, BackgroundTool, CanvasService, type ComputeImageOperationArgs, type DielineGeometry, type DielineState, DielineTool, FeatureTool, FilmTool, type ImageItem, type ImageOperation, type ImageOperationArea, type ImageOperationAreaSpec, type ImageOperationViewport, ImageTool, type ImageTransformUpdates, type ImageViewState, type LayerObjectCountComparator, type LineStyle, MirrorTool, type RenderClipPathEffectSpec, type RenderCoordinateSpace, type RenderEffectSpec, type RenderLayoutAlign, type RenderLayoutInsets, type RenderLayoutLength, type RenderLayoutRect, type RenderLayoutReference, type RenderObjectLayoutSpec, type RenderObjectSpec, type RenderObjectType, type RenderPassSpec, type RenderProps, RulerTool, SceneLayoutService, SizeTool, ViewportSystem, type VisibilityEvalContext, type VisibilityExpr, type VisibilityLayerState, type WhiteInkItem, WhiteInkTool, getCoverScale as computeImageCoverScale, computeImageOperationUpdates, getCoverScale as computeWhiteInkCoverScale, createDefaultDielineState, createDielineCommands, createDielineConfigurations, createImageCommands, createImageConfigurations, createWhiteInkCommands, createWhiteInkConfigurations, evaluateVisibilityExpr, hasAnyImageInViewState, readDielineState, resolveImageOperationArea };
+export { type BackgroundConfig, type BackgroundFitMode, type BackgroundLayer, type BackgroundLayerKind, type BackgroundRegionUnit, type BackgroundRegistration, type BackgroundRegistrationFrame, type BackgroundRegistrationRegion, BackgroundTool, CanvasService, type ComputeImageOperationArgs, type DielineGeometry, type DielineState, DielineTool, FeatureTool, FilmTool, type ImageItem, type ImageOperation, type ImageOperationArea, type ImageOperationAreaSpec, type ImageOperationViewport, type ImageSessionNotice, type ImageSessionPlacementPolicy, ImageTool, type ImageTransformUpdates, type ImageViewState, type LayerObjectCountComparator, type LineStyle, MirrorTool, type RenderClipPathEffectSpec, type RenderCoordinateSpace, type RenderEffectSpec, type RenderLayoutAlign, type RenderLayoutInsets, type RenderLayoutLength, type RenderLayoutRect, type RenderLayoutReference, type RenderObjectLayoutSpec, type RenderObjectSpec, type RenderObjectType, type RenderPassSpec, type RenderProps, RulerTool, SceneLayoutService, SizeTool, ViewportSystem, type VisibilityEvalContext, type VisibilityExpr, type VisibilityLayerState, type WhiteInkItem, WhiteInkTool, getCoverScale as computeImageCoverScale, computeImageOperationUpdates, getCoverScale as computeWhiteInkCoverScale, createDefaultDielineState, createDielineCommands, createDielineConfigurations, createImageCommands, createImageConfigurations, createWhiteInkCommands, createWhiteInkConfigurations, evaluateVisibilityExpr, hasAnyImageInViewState, readDielineState, resolveImageOperationArea };

package/dist/index.d.ts

@@ -103,6 +103,16 @@ interface ImageViewState {
     isImageSelectionActive: boolean;
     hasWorkingChanges: boolean;
     source: "working" | "committed";
+    placementPolicy: ImageSessionPlacementPolicy;
+    sessionNotice: ImageSessionNotice | null;
+}
+type ImageSessionPlacementPolicy = "free" | "warn" | "strict";
+interface ImageSessionNotice {
+    code: "image-outside-frame";
+    level: "warning" | "error";
+    message: string;
+    imageIds: string[];
+    policy: ImageSessionPlacementPolicy;
 }
 declare class ImageTool implements Extension {
     id: string;
@@ -130,6 +140,7 @@ declare class ImageTool implements Extension {
     private activeSnapX;
     private activeSnapY;
     private movingImageId;
+    private sessionNotice;
     private hasRenderedSnapGuides;
     private canvasObjectMovingHandler?;
     private canvasMouseUpHandler?;
@@ -178,6 +189,7 @@ declare class ImageTool implements Extension {
             interaction: string;
             commands: {
                 begin: string;
+                validate: string;
                 commit: string;
                 rollback: string;
             };
@@ -193,6 +205,10 @@ declare class ImageTool implements Extension {
     private normalizeItems;
     private cloneItems;
     private getViewItems;
+    private getPlacementPolicy;
+    private areSessionNoticesEqual;
+    private setSessionNotice;
+    private clearSessionNotice;
     private getImageViewState;
     private emitImageStateChange;
     private emitWorkingChange;
@@ -217,6 +233,9 @@ declare class ImageTool implements Extension {
     private ensureSourceSize;
     private loadImageSize;
     private getCoverScale;
+    private resolvePlacementState;
+    private validatePlacementForItem;
+    private validateImageSession;
     private getFrameVisualConfig;
     private resolveSessionOverlayState;
     private getCropShapeHatchPattern;
@@ -238,6 +257,7 @@ declare class ImageTool implements Extension {
     private resolveImageSourceSize;
     private applyImageOperation;
     private commitWorkingImagesAsCropped;
+    private completeImageSession;
     private exportCroppedImageByIds;
     private exportUserCroppedImage;
 }
@@ -1146,4 +1166,4 @@ declare function createWhiteInkCommands(tool: any): CommandContribution[];
 
 declare function createWhiteInkConfigurations(): ConfigurationContribution[];
 
-export { type BackgroundConfig, type BackgroundFitMode, type BackgroundLayer, type BackgroundLayerKind, type BackgroundRegionUnit, type BackgroundRegistration, type BackgroundRegistrationFrame, type BackgroundRegistrationRegion, BackgroundTool, CanvasService, type ComputeImageOperationArgs, type DielineGeometry, type DielineState, DielineTool, FeatureTool, FilmTool, type ImageItem, type ImageOperation, type ImageOperationArea, type ImageOperationAreaSpec, type ImageOperationViewport, ImageTool, type ImageTransformUpdates, type ImageViewState, type LayerObjectCountComparator, type LineStyle, MirrorTool, type RenderClipPathEffectSpec, type RenderCoordinateSpace, type RenderEffectSpec, type RenderLayoutAlign, type RenderLayoutInsets, type RenderLayoutLength, type RenderLayoutRect, type RenderLayoutReference, type RenderObjectLayoutSpec, type RenderObjectSpec, type RenderObjectType, type RenderPassSpec, type RenderProps, RulerTool, SceneLayoutService, SizeTool, ViewportSystem, type VisibilityEvalContext, type VisibilityExpr, type VisibilityLayerState, type WhiteInkItem, WhiteInkTool, getCoverScale as computeImageCoverScale, computeImageOperationUpdates, getCoverScale as computeWhiteInkCoverScale, createDefaultDielineState, createDielineCommands, createDielineConfigurations, createImageCommands, createImageConfigurations, createWhiteInkCommands, createWhiteInkConfigurations, evaluateVisibilityExpr, hasAnyImageInViewState, readDielineState, resolveImageOperationArea };
+export { type BackgroundConfig, type BackgroundFitMode, type BackgroundLayer, type BackgroundLayerKind, type BackgroundRegionUnit, type BackgroundRegistration, type BackgroundRegistrationFrame, type BackgroundRegistrationRegion, BackgroundTool, CanvasService, type ComputeImageOperationArgs, type DielineGeometry, type DielineState, DielineTool, FeatureTool, FilmTool, type ImageItem, type ImageOperation, type ImageOperationArea, type ImageOperationAreaSpec, type ImageOperationViewport, type ImageSessionNotice, type ImageSessionPlacementPolicy, ImageTool, type ImageTransformUpdates, type ImageViewState, type LayerObjectCountComparator, type LineStyle, MirrorTool, type RenderClipPathEffectSpec, type RenderCoordinateSpace, type RenderEffectSpec, type RenderLayoutAlign, type RenderLayoutInsets, type RenderLayoutLength, type RenderLayoutRect, type RenderLayoutReference, type RenderObjectLayoutSpec, type RenderObjectSpec, type RenderObjectType, type RenderPassSpec, type RenderProps, RulerTool, SceneLayoutService, SizeTool, ViewportSystem, type VisibilityEvalContext, type VisibilityExpr, type VisibilityLayerState, type WhiteInkItem, WhiteInkTool, getCoverScale as computeImageCoverScale, computeImageOperationUpdates, getCoverScale as computeWhiteInkCoverScale, createDefaultDielineState, createDielineCommands, createDielineConfigurations, createImageCommands, createImageConfigurations, createWhiteInkCommands, createWhiteInkConfigurations, evaluateVisibilityExpr, hasAnyImageInViewState, readDielineState, resolveImageOperationArea };