@bluepic/embed 0.6.21 → 0.6.22

package/dist/util/analytics.d.ts

@@ -159,6 +159,7 @@ export type SocialCheckoutEvent = ExportSessionContext & RenderOutcome & Deliver
     nativeShare: boolean;
     status: SocialShareStatus;
     captionLength: number;
+    /** @deprecated Never sent (AVV: the caption is user content). Use `captionLength`. */
     caption?: string;
     /** Only present for verifiable networks that return a post URL (LinkedIn). */
     postUrl?: string;
@@ -210,6 +211,7 @@ type SocialCheckoutArgs = {
     nativeShare: boolean;
     status: SocialShareStatus;
     captionLength: number;
+    /** @deprecated Never sent (AVV: the caption is user content). Use `captionLength`. */
     caption?: string;
     postUrl?: string;
     errorMessage?: string;

package/dist/util/fieldHints/useFieldHitboxes.d.ts

@@ -73,10 +73,10 @@ export declare function useFieldHitboxes(options: {
             } | undefined;
             frameIndex?: number | undefined;
             props: {
-                layout: "normal" | "compact" | (() => "normal" | "compact");
+                layout: "normal" | (() => "normal" | "compact") | "compact";
                 width: number | (() => number);
                 height: number | (() => number);
-                allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                 allowUploadFromDevice: boolean | (() => boolean);
                 uploadLabel: string | (() => string);
                 convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -188,7 +188,7 @@ export declare function useFieldHitboxes(options: {
                 maxY: number | (() => number);
                 minScale: number | (() => number);
                 maxScale: number | (() => number);
-                type: "popup" | "inline" | (() => "popup" | "inline");
+                type: "popup" | (() => "popup" | "inline") | "inline";
                 aspectRatio: number | (() => number);
             };
         } | {
@@ -210,7 +210,7 @@ export declare function useFieldHitboxes(options: {
             frameIndex?: number | undefined;
             props: {
                 card: boolean | (() => boolean);
-                layout: "list" | "flex" | (() => "list" | "flex");
+                layout: (() => "flex" | "list") | "flex" | "list";
                 fields: (() => BluepicField[]) | ({
                     type: "Image";
                     model: {
@@ -231,10 +231,10 @@ export declare function useFieldHitboxes(options: {
                     } | undefined;
                     frameIndex?: number | undefined;
                     props: {
-                        layout: "normal" | "compact" | (() => "normal" | "compact");
+                        layout: "normal" | (() => "normal" | "compact") | "compact";
                         width: number | (() => number);
                         height: number | (() => number);
-                        allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                        allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                         allowUploadFromDevice: boolean | (() => boolean);
                         uploadLabel: string | (() => string);
                         convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -346,7 +346,7 @@ export declare function useFieldHitboxes(options: {
                         maxY: number | (() => number);
                         minScale: number | (() => number);
                         maxScale: number | (() => number);
-                        type: "popup" | "inline" | (() => "popup" | "inline");
+                        type: "popup" | (() => "popup" | "inline") | "inline";
                         aspectRatio: number | (() => number);
                     };
                 } | /*elided*/ any | {
@@ -389,10 +389,10 @@ export declare function useFieldHitboxes(options: {
                             } | undefined;
                             frameIndex?: number | undefined;
                             props: {
-                                layout: "normal" | "compact" | (() => "normal" | "compact");
+                                layout: "normal" | (() => "normal" | "compact") | "compact";
                                 width: number | (() => number);
                                 height: number | (() => number);
-                                allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                                allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                                 allowUploadFromDevice: boolean | (() => boolean);
                                 uploadLabel: string | (() => string);
                                 convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -504,7 +504,7 @@ export declare function useFieldHitboxes(options: {
                                 maxY: number | (() => number);
                                 minScale: number | (() => number);
                                 maxScale: number | (() => number);
-                                type: "popup" | "inline" | (() => "popup" | "inline");
+                                type: "popup" | (() => "popup" | "inline") | "inline";
                                 aspectRatio: number | (() => number);
                             };
                         } | /*elided*/ any | /*elided*/ any | {
@@ -894,7 +894,7 @@ export declare function useFieldHitboxes(options: {
                                 autoCrop?: boolean | (() => boolean | undefined) | undefined;
                             };
                         })[];
-                        layout: "list" | "flex" | (() => "list" | "flex");
+                        layout: "flex" | "list" | (() => "flex" | "list");
                         min: number | (() => number);
                         max: number | (() => number);
                         defaultObject?: (() => {
@@ -1331,10 +1331,10 @@ export declare function useFieldHitboxes(options: {
                     } | undefined;
                     frameIndex?: number | undefined;
                     props: {
-                        layout: "normal" | "compact" | (() => "normal" | "compact");
+                        layout: "normal" | (() => "normal" | "compact") | "compact";
                         width: number | (() => number);
                         height: number | (() => number);
-                        allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                        allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                         allowUploadFromDevice: boolean | (() => boolean);
                         uploadLabel: string | (() => string);
                         convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -1446,7 +1446,7 @@ export declare function useFieldHitboxes(options: {
                         maxY: number | (() => number);
                         minScale: number | (() => number);
                         maxScale: number | (() => number);
-                        type: "popup" | "inline" | (() => "popup" | "inline");
+                        type: "popup" | (() => "popup" | "inline") | "inline";
                         aspectRatio: number | (() => number);
                     };
                 } | {
@@ -1468,7 +1468,7 @@ export declare function useFieldHitboxes(options: {
                     frameIndex?: number | undefined;
                     props: {
                         card: boolean | (() => boolean);
-                        layout: "list" | "flex" | (() => "list" | "flex");
+                        layout: (() => "flex" | "list") | "flex" | "list";
                         fields: (() => BluepicField[]) | ({
                             type: "Image";
                             model: {
@@ -1489,10 +1489,10 @@ export declare function useFieldHitboxes(options: {
                             } | undefined;
                             frameIndex?: number | undefined;
                             props: {
-                                layout: "normal" | "compact" | (() => "normal" | "compact");
+                                layout: "normal" | (() => "normal" | "compact") | "compact";
                                 width: number | (() => number);
                                 height: number | (() => number);
-                                allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                                allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                                 allowUploadFromDevice: boolean | (() => boolean);
                                 uploadLabel: string | (() => string);
                                 convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -1604,7 +1604,7 @@ export declare function useFieldHitboxes(options: {
                                 maxY: number | (() => number);
                                 minScale: number | (() => number);
                                 maxScale: number | (() => number);
-                                type: "popup" | "inline" | (() => "popup" | "inline");
+                                type: "popup" | (() => "popup" | "inline") | "inline";
                                 aspectRatio: number | (() => number);
                             };
                         } | /*elided*/ any | /*elided*/ any | {
@@ -2382,7 +2382,7 @@ export declare function useFieldHitboxes(options: {
                         autoCrop?: boolean | (() => boolean | undefined) | undefined;
                     };
                 })[];
-                layout: "list" | "flex" | (() => "list" | "flex");
+                layout: "flex" | "list" | (() => "flex" | "list");
                 min: number | (() => number);
                 max: number | (() => number);
                 defaultObject?: (() => {
@@ -2849,10 +2849,10 @@ export declare function useFieldHitboxes(options: {
             } | undefined;
             frameIndex?: number | undefined;
             props: {
-                layout: "normal" | "compact" | (() => "normal" | "compact");
+                layout: "normal" | (() => "normal" | "compact") | "compact";
                 width: number | (() => number);
                 height: number | (() => number);
-                allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                 allowUploadFromDevice: boolean | (() => boolean);
                 uploadLabel: string | (() => string);
                 convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -2964,7 +2964,7 @@ export declare function useFieldHitboxes(options: {
                 maxY: number | (() => number);
                 minScale: number | (() => number);
                 maxScale: number | (() => number);
-                type: "popup" | "inline" | (() => "popup" | "inline");
+                type: "popup" | (() => "popup" | "inline") | "inline";
                 aspectRatio: number | (() => number);
             };
         } | {
@@ -2986,7 +2986,7 @@ export declare function useFieldHitboxes(options: {
             frameIndex?: number | undefined;
             props: {
                 card: boolean | (() => boolean);
-                layout: "list" | "flex" | (() => "list" | "flex");
+                layout: (() => "flex" | "list") | "flex" | "list";
                 fields: (() => BluepicField[]) | ({
                     type: "Image";
                     model: {
@@ -3007,10 +3007,10 @@ export declare function useFieldHitboxes(options: {
                     } | undefined;
                     frameIndex?: number | undefined;
                     props: {
-                        layout: "normal" | "compact" | (() => "normal" | "compact");
+                        layout: "normal" | (() => "normal" | "compact") | "compact";
                         width: number | (() => number);
                         height: number | (() => number);
-                        allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                        allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                         allowUploadFromDevice: boolean | (() => boolean);
                         uploadLabel: string | (() => string);
                         convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -3122,7 +3122,7 @@ export declare function useFieldHitboxes(options: {
                         maxY: number | (() => number);
                         minScale: number | (() => number);
                         maxScale: number | (() => number);
-                        type: "popup" | "inline" | (() => "popup" | "inline");
+                        type: "popup" | (() => "popup" | "inline") | "inline";
                         aspectRatio: number | (() => number);
                     };
                 } | /*elided*/ any | {
@@ -3165,10 +3165,10 @@ export declare function useFieldHitboxes(options: {
                             } | undefined;
                             frameIndex?: number | undefined;
                             props: {
-                                layout: "normal" | "compact" | (() => "normal" | "compact");
+                                layout: "normal" | (() => "normal" | "compact") | "compact";
                                 width: number | (() => number);
                                 height: number | (() => number);
-                                allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                                allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                                 allowUploadFromDevice: boolean | (() => boolean);
                                 uploadLabel: string | (() => string);
                                 convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -3280,7 +3280,7 @@ export declare function useFieldHitboxes(options: {
                                 maxY: number | (() => number);
                                 minScale: number | (() => number);
                                 maxScale: number | (() => number);
-                                type: "popup" | "inline" | (() => "popup" | "inline");
+                                type: "popup" | (() => "popup" | "inline") | "inline";
                                 aspectRatio: number | (() => number);
                             };
                         } | /*elided*/ any | /*elided*/ any | {
@@ -3670,7 +3670,7 @@ export declare function useFieldHitboxes(options: {
                                 autoCrop?: boolean | (() => boolean | undefined) | undefined;
                             };
                         })[];
-                        layout: "list" | "flex" | (() => "list" | "flex");
+                        layout: "flex" | "list" | (() => "flex" | "list");
                         min: number | (() => number);
                         max: number | (() => number);
                         defaultObject?: (() => {
@@ -4107,10 +4107,10 @@ export declare function useFieldHitboxes(options: {
                     } | undefined;
                     frameIndex?: number | undefined;
                     props: {
-                        layout: "normal" | "compact" | (() => "normal" | "compact");
+                        layout: "normal" | (() => "normal" | "compact") | "compact";
                         width: number | (() => number);
                         height: number | (() => number);
-                        allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                        allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                         allowUploadFromDevice: boolean | (() => boolean);
                         uploadLabel: string | (() => string);
                         convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -4222,7 +4222,7 @@ export declare function useFieldHitboxes(options: {
                         maxY: number | (() => number);
                         minScale: number | (() => number);
                         maxScale: number | (() => number);
-                        type: "popup" | "inline" | (() => "popup" | "inline");
+                        type: "popup" | (() => "popup" | "inline") | "inline";
                         aspectRatio: number | (() => number);
                     };
                 } | {
@@ -4244,7 +4244,7 @@ export declare function useFieldHitboxes(options: {
                     frameIndex?: number | undefined;
                     props: {
                         card: boolean | (() => boolean);
-                        layout: "list" | "flex" | (() => "list" | "flex");
+                        layout: (() => "flex" | "list") | "flex" | "list";
                         fields: (() => BluepicField[]) | ({
                             type: "Image";
                             model: {
@@ -4265,10 +4265,10 @@ export declare function useFieldHitboxes(options: {
                             } | undefined;
                             frameIndex?: number | undefined;
                             props: {
-                                layout: "normal" | "compact" | (() => "normal" | "compact");
+                                layout: "normal" | (() => "normal" | "compact") | "compact";
                                 width: number | (() => number);
                                 height: number | (() => number);
-                                allowedTypes: Template.Fields.ImageMime[] | (() => Template.Fields.ImageMime[]);
+                                allowedTypes: (() => Template.Fields.ImageMime[]) | Template.Fields.ImageMime[];
                                 allowUploadFromDevice: boolean | (() => boolean);
                                 uploadLabel: string | (() => string);
                                 convertTo?: Template.Fields.ImageMime | (() => Template.Fields.ImageMime | undefined) | undefined;
@@ -4380,7 +4380,7 @@ export declare function useFieldHitboxes(options: {
                                 maxY: number | (() => number);
                                 minScale: number | (() => number);
                                 maxScale: number | (() => number);
-                                type: "popup" | "inline" | (() => "popup" | "inline");
+                                type: "popup" | (() => "popup" | "inline") | "inline";
                                 aspectRatio: number | (() => number);
                             };
                         } | /*elided*/ any | /*elided*/ any | {
@@ -5158,7 +5158,7 @@ export declare function useFieldHitboxes(options: {
                         autoCrop?: boolean | (() => boolean | undefined) | undefined;
                     };
                 })[];
-                layout: "list" | "flex" | (() => "list" | "flex");
+                layout: "flex" | "list" | (() => "flex" | "list");
                 min: number | (() => number);
                 max: number | (() => number);
                 defaultObject?: (() => {

package/dist/util/imageAspect/index.d.ts

@@ -0,0 +1,6 @@
+export { ASPECT_FIELD_TYPES, aspectFieldKey, conformCropToAspect, aspectReferenceElements, fixedAspectRatio, isUsableAspectRatio, pickAspectRatio, planImageAspects, resolveFieldAspectRatio, staticElementAspectRatio, } from './resolve';
+export type { AspectPlanEntry } from './resolve';
+export { elementSizeProbe } from './probe';
+export type { ElementSize, ElementSizeProbeResult } from './probe';
+export { IMAGE_ASPECT_KEY, provideImageAspect, useImageAspect, useImageAspects } from './useImageAspects';
+export type { ImageAspectController } from './useImageAspects';

package/dist/util/imageAspect/probe.d.ts

@@ -0,0 +1,36 @@
+/**
+ * Sandbox-side size probe for the image-field aspect ratio.
+ *
+ * The element's real size only exists after core resolved every expression,
+ * layout group, surface/edge connection and the active canvas — inside the
+ * sandbox iframe. Like the field-hint probe, this asks the frame that drew the
+ * pixels instead of linking @bluepic/core into this package.
+ *
+ * Measured in the element's OWN coordinate space (`getBBox`, no transform):
+ * that is the box core cover-fits a crop into, so its ratio is the crop ratio.
+ * For image elements core renders that box as a transparent
+ * `.bx-alt-bbox-source` rect (bluepic-core Image.vue: x/y/width/height of the
+ * element); other elements, and engines that predate the rect, fall back to the
+ * element group's own bbox.
+ */
+export type ElementSize = {
+    width: number;
+    height: number;
+};
+export type ElementSizeProbeResult = {
+    supported: false;
+    reason: 'no-root' | 'no-element-identity';
+} | {
+    supported: true;
+    sizes: {
+        [originalId: string]: ElementSize;
+    };
+};
+/**
+ * ⚠️ SHIPPED AS SOURCE TEXT, NOT AS A CLOSURE — `EmbeddedController.evaluate()`
+ * stringifies it and rebuilds it with `new Function` inside the iframe. One
+ * self-contained function, `document` as the only free variable, plain ES
+ * (`var`, no optional chaining), JSON in and JSON out. Enforced by
+ * `imageAspect.test.ts`.
+ */
+export declare function elementSizeProbe(originalIdsJson: string): ElementSizeProbeResult;

package/dist/util/imageAspect/resolve.d.ts

@@ -0,0 +1,91 @@
+import type { BluepicField, Template } from '@bluepic/types';
+/**
+ * Crop aspect ratio of an image field (ImageEdit / Logo), resolved at runtime.
+ *
+ * A fixed `aspectRatio` prop stopped being true once elements could be sized
+ * dynamically (edge / surface connections, expressions) and once one template
+ * could carry several canvases: the same field then drives frames of different
+ * shapes. So the ratio is only fixed when the author opts in with
+ * `enforceAspectRatio`; otherwise it is read off the element the field's
+ * binding drives:
+ *
+ *   field.model.modelValue  →  every element whose expressions reference that
+ *   binding (also through computedBindings)  →  image elements first  →  the
+ *   first one's width / height  →  fallback 1.
+ */
+/** Field types whose crop ratio this module resolves. */
+export declare const ASPECT_FIELD_TYPES: Set<"Image" | "Text" | "ImageAdjust" | "Group" | "Collection" | "Select" | "Checkbox" | "Number" | "Color" | "Map" | "ImageEdit" | "SelectColor" | "SelectImage" | "SelectText" | "Instruction" | "Logo">;
+export declare function isUsableAspectRatio(value: unknown): value is number;
+/**
+ * The author-pinned ratio, or `null` when the ratio is dynamic.
+ *
+ * Typed loosely on purpose: it reads stored field props, and every field
+ * authored before `enforceAspectRatio` existed has a number in `aspectRatio`
+ * but no flag — those are dynamic by design.
+ */
+export declare function fixedAspectRatio(props: {
+    aspectRatio?: unknown;
+    enforceAspectRatio?: unknown;
+} | undefined | null): number | null;
+/**
+ * Identity of an image field across serial swaps (canvas switch, re-mount):
+ * the binding it writes. Object identity would not survive — the fields tree
+ * the panel renders is not always the very array the serial holds.
+ */
+export declare function aspectFieldKey(field: Pick<BluepicField, 'type' | 'model'> | undefined | null): string | null;
+/**
+ * The elements that reference the field's binding, ordered as candidates for
+ * the reference frame: image elements first, then by how directly they use the
+ * binding (an `image` property beats an opacity), then document order.
+ */
+export declare function aspectReferenceElements(serial: Template.Serial, field: BluepicField): Template.Element[];
+/**
+ * Ratio straight from the serial, for when nothing is rendered to measure
+ * (no sandbox yet, a hidden element). Only literal sizes count — evaluating an
+ * expression would need @bluepic/core, which this package keeps out on purpose.
+ */
+export declare function staticElementAspectRatio(element: Template.Element): number | undefined;
+export type AspectPlanEntry = {
+    key: string;
+    /** Candidate element ids, best first. */
+    elementIds: string[];
+    /** Literal-size ratio per candidate id, where the serial has one. */
+    staticRatios: Record<string, number>;
+};
+/** Every dynamic image field in the serial with its reference candidates. */
+export declare function planImageAspects(serial: Template.Serial, fields: BluepicField[]): AspectPlanEntry[];
+/**
+ * Walk the candidates in order and take the first one with a known size —
+ * measured in the sandbox, else its literal size in the serial. Usually that is
+ * the 0th (the image element the field feeds); falling through only happens
+ * when it is not rendered right now (hidden, other canvas) and has no literal.
+ */
+export declare function pickAspectRatio(entry: AspectPlanEntry, measured: Record<string, {
+    width: number;
+    height: number;
+}> | undefined): number | undefined;
+/**
+ * The part of `crop` that is actually visible in a frame of `aspectRatio`.
+ *
+ * The ImageValue (and its crop) is shared by every canvas, but the frames are
+ * not: after a canvas switch the stored crop can have the previous frame's
+ * shape. Core then cover-fits it, centred (fitImageV2 'cover', align 0.5/0.5),
+ * so the visible region is the centred sub-rectangle with the new ratio. The
+ * cropper starts from exactly that, instead of a box it would have to snap.
+ * Returns the crop unchanged when it already matches (within 0.5%).
+ */
+export declare function conformCropToAspect<T extends {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}>(crop: T, aspectRatio: number): T;
+/**
+ * One-shot resolution for hosts that already hold live element sizes (the
+ * studio has core's composed elements in-process): same candidates and order
+ * as the sandbox path. `undefined` = nothing resolvable.
+ */
+export declare function resolveFieldAspectRatio(serial: Template.Serial, field: BluepicField, sizes: Record<string, {
+    width: number;
+    height: number;
+}> | undefined): number | undefined;

package/dist/util/imageAspect/useImageAspects.d.ts

@@ -0,0 +1,37 @@
+import { type InjectionKey, type Ref } from 'vue';
+import type { BluepicField, Template } from '@bluepic/types';
+type EvaluateFn = (func: Function, ...args: string[]) => Promise<unknown>;
+export type ImageAspectController = {
+    /**
+     * Dynamic crop ratio for an image field, or `undefined` when nothing could be
+     * resolved (the field then falls back to 1). Reactive: re-evaluates when the
+     * data, the serial or the active canvas change the reference element's size.
+     */
+    aspectRatioFor(field: BluepicField | undefined): number | undefined;
+    /** Re-measure now and resolve once the fresh sizes are in. */
+    refresh(): Promise<void>;
+};
+export declare const IMAGE_ASPECT_KEY: InjectionKey<ImageAspectController>;
+export declare function provideImageAspect(controller: ImageAspectController): void;
+/** Absent whenever the fields tree is rendered outside `BxTemplateEditor` (or a host provider). */
+export declare function useImageAspect(): ImageAspectController | undefined;
+/**
+ * Live crop ratios for every dynamic ImageEdit / Logo field of the serial.
+ *
+ * Independent of the field-hints gate: hints are a campaign option, cropping
+ * correctly is not.
+ */
+export declare function useImageAspects(options: {
+    serial: Ref<Template.Serial | undefined>;
+    /** Resolved lazily — the sandbox controller only exists once the iframe mounts. */
+    evaluate: () => EvaluateFn | undefined;
+    ready: Ref<boolean>;
+    data: Ref<{
+        [k: string]: unknown;
+    }>;
+}): {
+    controller: ImageAspectController;
+    ratios: import("vue").ComputedRef<Record<string, number>>;
+    dispose: () => void;
+};
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bluepic/embed",
-  "version": "0.6.21",
+  "version": "0.6.22",
   "description": "Bluepic embed sdk",
   "type": "module",
   "sideEffects": false,
@@ -43,7 +43,8 @@
     "test:gallery": "tsx src/util/gallery.test.ts",
     "test:fieldhints": "tsx src/util/fieldHints/fieldHints.test.ts",
     "test:clone": "tsx src/util/cloneDeep.test.ts",
-    "test:imagestates": "tsx src/util/imageStates/imageStates.test.ts"
+    "test:imagestates": "tsx src/util/imageStates/imageStates.test.ts",
+    "test:imageaspect": "tsx src/util/imageAspect/imageAspect.test.ts"
   },
   "peerDependencies": {
     "vue": "^3.5.23"