@anzusystems/common-admin 1.49.0 → 2.0.0-rc.2

package/dist/domains/dam/cropper/utils/cropperGeometry.d.ts

@@ -0,0 +1,70 @@
+export interface Size {
+    width: number;
+    height: number;
+}
+export interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+/**
+ * Which edge of the selection stays put while the other one moves. Resizing from the west handle
+ * pins the east edge, resizing from the north-east corner pins the south-west one, and the side
+ * handles grow symmetrically around the perpendicular centre — this mirrors how cropper.js v2
+ * computes a resize, and it is what lets a clamped selection stop at the image border instead of
+ * sliding along it.
+ *
+ * `fit` is the anchor-less case (a programmatic `setData`, a plain move, a re-fit after the
+ * container changed): the box may be as large as the image allows anywhere, and is slid back into
+ * view afterwards, which is what cropper.js v1's `limitCropBox` did.
+ */
+export type AnchorSide = 'start' | 'center' | 'end' | 'fit';
+export type Anchor = [AnchorSide, AnchorSide];
+/** Anchors per cropper.js action name. Anything missing is treated as a plain "fit it in" clamp. */
+export declare const RESIZE_ANCHORS: Readonly<Record<string, Anchor>>;
+export declare const isUsableAspectRatio: (aspectRatio: number) => boolean;
+/**
+ * The largest box of `aspectRatio` that fits inside `size`. With no usable ratio the size is
+ * returned untouched, which is how a free-form crop behaves.
+ */
+export declare const fitAspectRatio: (size: Size, aspectRatio: number) => Size;
+/**
+ * The box the crop starts out as: cropper.js v1's `autoCropArea` applied to the aspect-fitted
+ * image, centred. Because `fitAspectRatio` scales linearly this is the same rectangle whether it is
+ * computed in natural pixels or in displayed ones — which is why the crop data a user sees does not
+ * depend on how wide their window happens to be.
+ */
+export declare const initialSelectionRect: (bounds: Size, aspectRatio: number, coverage: number) => Rect;
+/**
+ * Grows a box to the given ratio, by calling the very function cropper.js' `$change` will call on
+ * it. Doing it here first means a rectangle is already the shape the library will make it *before*
+ * it is measured against the image: a crop that names a new height keeps its old width through the
+ * clamp otherwise, and cropper.js then widens it to suit the ratio — straight past the image edge.
+ *
+ * The guard is not redundant. `getAdjustedSizes` has no notion of a free-form crop and answers a
+ * `NaN` ratio with a `NaN` dimension.
+ */
+export declare const coverAspectRatio: (size: Size, aspectRatio: number) => Size;
+/**
+ * Keeps `rect` inside `bounds` the way cropper.js v1's `viewMode: 1` did: a selection that has
+ * grown past an edge is shrunk rather than pushed, so the edge the user is not dragging stays where
+ * they put it, and a selection that is merely out of position is slid back in whole.
+ *
+ * `anchor` says which edges the current gesture is holding still. Leaving it out (a programmatic
+ * `setData`, the initial layout, a re-fit after a resize) caps the size at the bounds, keeps the
+ * top-left corner it was given and slides the result into view — what v1's `limitCropBox` did.
+ */
+export declare const clampRectInside: (rect: Rect, bounds: Rect, aspectRatio: number, anchor?: Anchor) => Rect;
+export declare const rectsAreClose: (a: Rect, b: Rect, epsilon?: number) => boolean;
+/**
+ * The box the cropper canvas takes. This is the frame, not the picture: cropper.js v1 let its
+ * container fill the width it was given and then centred the image inside it, so a source narrower
+ * than the container sat between two shaded margins rather than stretching to fill them. The height
+ * comes from the image at its displayed size, which is its natural size unless that is wider than
+ * the space available — v1 never enlarged a source either, its `<img>` being capped at `max-width`.
+ *
+ * The image is fitted into this box with `contain`, so image pixels and canvas pixels differ by one
+ * uniform scale factor and an offset.
+ */
+export declare const canvasSizeFor: (natural: Size, availableWidth: number, minWidth: number, minHeight: number) => Size;

package/dist/domains/dam/cropper/utils/cropperGeometry.js

@@ -0,0 +1,72 @@
+import { getAdjustedSizes as e } from "../../../../vendor/@cropper/utils/dist/utils.esm.raw.js";
+import "../../../../vendor/cropperjs/dist/cropper.esm.raw.js";
+//#region src/domains/dam/cropper/utils/cropperGeometry.ts
+var t = {
+	"n-resize": ["center", "end"],
+	"s-resize": ["center", "start"],
+	"e-resize": ["start", "center"],
+	"w-resize": ["end", "center"],
+	"ne-resize": ["start", "end"],
+	"nw-resize": ["end", "end"],
+	"se-resize": ["start", "start"],
+	"sw-resize": ["end", "start"],
+	select: ["start", "start"]
+}, n = (e) => Number.isFinite(e) && e > 0, r = (e, t, n) => Math.min(Math.max(e, t), n), i = (e, t) => n(t) ? e.height * t > e.width ? {
+	width: e.width,
+	height: e.width / t
+} : {
+	width: e.height * t,
+	height: e.height
+} : {
+	width: e.width,
+	height: e.height
+}, a = (e, t, n) => {
+	let r = i(e, t), a = r.width * n, o = r.height * n;
+	return {
+		x: (e.width - a) / 2,
+		y: (e.height - o) / 2,
+		width: a,
+		height: o
+	};
+}, o = (t, r) => n(r) ? e({
+	width: t.width,
+	height: t.height,
+	aspectRatio: r
+}, "cover") : {
+	width: t.width,
+	height: t.height
+}, s = (e, t, n, r, i) => {
+	let a = n + r;
+	return i === "start" ? Math.max(0, a - Math.max(e, n)) : i === "end" ? Math.max(0, Math.min(e + t, a) - n) : r;
+}, c = (e, t, n, r) => r === "end" ? e + t - n : r === "center" ? e + t / 2 - n / 2 : e, l = (e, t, i, a) => {
+	let [l, u] = a ?? ["fit", "fit"], d = {
+		...e,
+		...o(e, i)
+	}, f = s(d.x, d.width, t.x, t.width, l), p = s(d.y, d.height, t.y, t.height, u), { width: m, height: h } = d;
+	if (n(i)) {
+		let e = Math.min(1, m > 0 ? f / m : 1, h > 0 ? p / h : 1);
+		m *= e, h *= e;
+	} else m = Math.min(m, f), h = Math.min(h, p);
+	let g = c(d.x, d.width, m, l), _ = c(d.y, d.height, h, u);
+	return {
+		x: r(g, t.x, t.x + t.width - m),
+		y: r(_, t.y, t.y + t.height - h),
+		width: m,
+		height: h
+	};
+}, u = (e, t, n = .01) => Math.abs(e.x - t.x) < n && Math.abs(e.y - t.y) < n && Math.abs(e.width - t.width) < n && Math.abs(e.height - t.height) < n, d = (e, t, n, r) => {
+	let i = Math.max(t, n);
+	if (!(e.width > 0) || !(e.height > 0)) return {
+		width: i,
+		height: r
+	};
+	let a = Math.min(e.width, t) * e.height / e.width;
+	return {
+		width: i,
+		height: Math.max(a, r)
+	};
+};
+//#endregion
+export { t as RESIZE_ANCHORS, d as canvasSizeFor, l as clampRectInside, o as coverAspectRatio, i as fitAspectRatio, a as initialSelectionRect, n as isUsableAspectRatio, u as rectsAreClose };
+
+//# sourceMappingURL=cropperGeometry.js.map

package/dist/domains/dam/cropper/utils/cropperGeometry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cropperGeometry.js","names":["RESIZE_ANCHORS","isUsableAspectRatio","aspectRatio","clamp","value","min","max","fitAspectRatio","size","initialSelectionRect","fitted","bounds","width","coverage","height","coverAspectRatio","getAdjustedSizes","availableAlong","boundsEnd","boundsStart","boundsLength","side","start","length","placeAlong","newLength","clampRectInside","anchorX","anchorY","anchor","asked","rect","maxWidth","maxHeight","scale","x","y","rectsAreClose","a","b","epsilon","canvasSizeFor","availableWidth","minWidth","natural","minHeight","displayedHeight"],"sources":["../../../../../src/domains/dam/cropper/utils/cropperGeometry.ts"],"sourcesContent":["/**\n * The geometry behind `ACropper`: how big the canvas is, where the initial crop box lands, and how a\n * crop box is kept inside the image. cropper.js v1 did all of this internally and v2 does none of\n * it, so it has to live somewhere — and here, away from the DOM, it can be tested directly rather\n * than through a mounted component.\n */\nimport { getAdjustedSizes } from 'cropperjs'\n\nexport interface Size {\n  width: number\n  height: number\n}\n\nexport interface Rect {\n  x: number\n  y: number\n  width: number\n  height: number\n}\n\n/**\n * Which edge of the selection stays put while the other one moves. Resizing from the west handle\n * pins the east edge, resizing from the north-east corner pins the south-west one, and the side\n * handles grow symmetrically around the perpendicular centre — this mirrors how cropper.js v2\n * computes a resize, and it is what lets a clamped selection stop at the image border instead of\n * sliding along it.\n *\n * `fit` is the anchor-less case (a programmatic `setData`, a plain move, a re-fit after the\n * container changed): the box may be as large as the image allows anywhere, and is slid back into\n * view afterwards, which is what cropper.js v1's `limitCropBox` did.\n */\nexport type AnchorSide = 'start' | 'center' | 'end' | 'fit'\n\nexport type Anchor = [AnchorSide, AnchorSide]\n\n/** Anchors per cropper.js action name. Anything missing is treated as a plain \"fit it in\" clamp. */\nexport const RESIZE_ANCHORS: Readonly<Record<string, Anchor>> = {\n  'n-resize': ['center', 'end'],\n  's-resize': ['center', 'start'],\n  'e-resize': ['start', 'center'],\n  'w-resize': ['end', 'center'],\n  'ne-resize': ['start', 'end'],\n  'nw-resize': ['end', 'end'],\n  'se-resize': ['start', 'start'],\n  'sw-resize': ['end', 'start'],\n  // Drawing a brand new selection grows it away from the point the drag started at.\n  select: ['start', 'start'],\n}\n\nexport const isUsableAspectRatio = (aspectRatio: number): boolean => Number.isFinite(aspectRatio) && aspectRatio > 0\n\nconst clamp = (value: number, min: number, max: number): number => Math.min(Math.max(value, min), max)\n\n/**\n * The largest box of `aspectRatio` that fits inside `size`. With no usable ratio the size is\n * returned untouched, which is how a free-form crop behaves.\n */\nexport const fitAspectRatio = (size: Size, aspectRatio: number): Size => {\n  if (!isUsableAspectRatio(aspectRatio)) return { width: size.width, height: size.height }\n  return size.height * aspectRatio > size.width\n    ? { width: size.width, height: size.width / aspectRatio }\n    : { width: size.height * aspectRatio, height: size.height }\n}\n\n/**\n * The box the crop starts out as: cropper.js v1's `autoCropArea` applied to the aspect-fitted\n * image, centred. Because `fitAspectRatio` scales linearly this is the same rectangle whether it is\n * computed in natural pixels or in displayed ones — which is why the crop data a user sees does not\n * depend on how wide their window happens to be.\n */\nexport const initialSelectionRect = (bounds: Size, aspectRatio: number, coverage: number): Rect => {\n  const fitted = fitAspectRatio(bounds, aspectRatio)\n  const width = fitted.width * coverage\n  const height = fitted.height * coverage\n  return {\n    x: (bounds.width - width) / 2,\n    y: (bounds.height - height) / 2,\n    width,\n    height,\n  }\n}\n\n/**\n * Grows a box to the given ratio, by calling the very function cropper.js' `$change` will call on\n * it. Doing it here first means a rectangle is already the shape the library will make it *before*\n * it is measured against the image: a crop that names a new height keeps its old width through the\n * clamp otherwise, and cropper.js then widens it to suit the ratio — straight past the image edge.\n *\n * The guard is not redundant. `getAdjustedSizes` has no notion of a free-form crop and answers a\n * `NaN` ratio with a `NaN` dimension.\n */\nexport const coverAspectRatio = (size: Size, aspectRatio: number): Size =>\n  isUsableAspectRatio(aspectRatio)\n    ? getAdjustedSizes({ width: size.width, height: size.height, aspectRatio }, 'cover')\n    : { width: size.width, height: size.height }\n\n/** How much room an axis has left once the anchored edge is held still. */\nconst availableAlong = (start: number, length: number, boundsStart: number, boundsLength: number, side: AnchorSide) => {\n  const boundsEnd = boundsStart + boundsLength\n  if (side === 'start') return Math.max(0, boundsEnd - Math.max(start, boundsStart))\n  if (side === 'end') return Math.max(0, Math.min(start + length, boundsEnd) - boundsStart)\n  // `center` and `fit` are both free to use the whole span; only where they land differs.\n  return boundsLength\n}\n\n/** Where the axis ends up once its length is known and the anchored edge has to stay put. */\nconst placeAlong = (start: number, length: number, newLength: number, side: AnchorSide) => {\n  if (side === 'end') return start + length - newLength\n  if (side === 'center') return start + length / 2 - newLength / 2\n  return start\n}\n\n/**\n * Keeps `rect` inside `bounds` the way cropper.js v1's `viewMode: 1` did: a selection that has\n * grown past an edge is shrunk rather than pushed, so the edge the user is not dragging stays where\n * they put it, and a selection that is merely out of position is slid back in whole.\n *\n * `anchor` says which edges the current gesture is holding still. Leaving it out (a programmatic\n * `setData`, the initial layout, a re-fit after a resize) caps the size at the bounds, keeps the\n * top-left corner it was given and slides the result into view — what v1's `limitCropBox` did.\n */\nexport const clampRectInside = (rect: Rect, bounds: Rect, aspectRatio: number, anchor?: Anchor): Rect => {\n  const [anchorX, anchorY] = anchor ?? ['fit', 'fit']\n\n  // Measure the rectangle cropper.js would end up with, not the one that was asked for. A rectangle\n  // already in the right proportion — which is everything a drag produces — is untouched by this.\n  const asked = { ...rect, ...coverAspectRatio(rect, aspectRatio) }\n\n  const maxWidth = availableAlong(asked.x, asked.width, bounds.x, bounds.width, anchorX)\n  const maxHeight = availableAlong(asked.y, asked.height, bounds.y, bounds.height, anchorY)\n\n  let { width, height } = asked\n  if (isUsableAspectRatio(aspectRatio)) {\n    // Shrink both axes by the same factor, otherwise the crop silently changes shape at the border.\n    const scale = Math.min(1, width > 0 ? maxWidth / width : 1, height > 0 ? maxHeight / height : 1)\n    width *= scale\n    height *= scale\n  } else {\n    width = Math.min(width, maxWidth)\n    height = Math.min(height, maxHeight)\n  }\n\n  const x = placeAlong(asked.x, asked.width, width, anchorX)\n  const y = placeAlong(asked.y, asked.height, height, anchorY)\n\n  return {\n    x: clamp(x, bounds.x, bounds.x + bounds.width - width),\n    y: clamp(y, bounds.y, bounds.y + bounds.height - height),\n    width,\n    height,\n  }\n}\n\nexport const rectsAreClose = (a: Rect, b: Rect, epsilon = 0.01): boolean =>\n  Math.abs(a.x - b.x) < epsilon &&\n  Math.abs(a.y - b.y) < epsilon &&\n  Math.abs(a.width - b.width) < epsilon &&\n  Math.abs(a.height - b.height) < epsilon\n\n/**\n * The box the cropper canvas takes. This is the frame, not the picture: cropper.js v1 let its\n * container fill the width it was given and then centred the image inside it, so a source narrower\n * than the container sat between two shaded margins rather than stretching to fill them. The height\n * comes from the image at its displayed size, which is its natural size unless that is wider than\n * the space available — v1 never enlarged a source either, its `<img>` being capped at `max-width`.\n *\n * The image is fitted into this box with `contain`, so image pixels and canvas pixels differ by one\n * uniform scale factor and an offset.\n */\nexport const canvasSizeFor = (natural: Size, availableWidth: number, minWidth: number, minHeight: number): Size => {\n  const width = Math.max(availableWidth, minWidth)\n  if (!(natural.width > 0) || !(natural.height > 0)) {\n    return { width, height: minHeight }\n  }\n  const displayedWidth = Math.min(natural.width, availableWidth)\n  const displayedHeight = (displayedWidth * natural.height) / natural.width\n  return { width, height: Math.max(displayedHeight, minHeight) }\n}\n"],"mappings":"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"}

package/dist/domains/dam/cropper/utils/cropperJsService.d.ts

@@ -0,0 +1,13 @@
+import { RegionOfInterest } from '../../types/Roi';
+import { CropRect } from './cropperTypes';
+/**
+ * A stored region of interest as a crop rectangle, and back.
+ *
+ * Both are pure arithmetic on the source image's own dimensions — no cropper involved. The region
+ * already keeps its size as fractions, and its anchor is a fraction of the source in all but name,
+ * so nothing here needs to know how large the picture the cropper happens to be showing is. That
+ * used to matter: the conversion went through the displayed image's natural size, which cancelled
+ * out of every sum it appeared in and took a rounding correction of its own to patch up.
+ */
+export declare const regionToCrop: (regionOfInterest: RegionOfInterest, originalImageWidth: number, originalImageHeight: number) => CropRect;
+export declare const cropToRegion: (crop: CropRect, regionOfInterest: RegionOfInterest, originalImageWidth: number, originalImageHeight: number) => RegionOfInterest;

package/dist/domains/dam/cropper/utils/cropperJsService.js

@@ -0,0 +1,19 @@
+//#region src/domains/dam/cropper/utils/cropperJsService.ts
+var e = (e, t) => {
+	let n = 10 ** t;
+	return Math.round(e * n) / n;
+}, t = (e) => Math.min(Math.max(e, 0), 1), n = (e, n, r) => !(n > 0) || !(r > 0) ? {
+	x: 0,
+	y: 0,
+	width: 1,
+	height: 1
+} : {
+	x: t(e.pointX / n),
+	y: t(e.pointY / r),
+	width: t(e.percentageWidth),
+	height: t(e.percentageHeight)
+}, r = (n, r, i, a) => (r.pointX = Math.max(0, Math.round(n.x * i)), r.pointY = Math.max(0, Math.round(n.y * a)), r.percentageWidth = e(t(n.width), 3), r.percentageHeight = e(t(n.height), 3), r);
+//#endregion
+export { r as cropToRegion, n as regionToCrop };
+
+//# sourceMappingURL=cropperJsService.js.map

package/dist/domains/dam/cropper/utils/cropperJsService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cropperJsService.js","names":["roundTo","factor","decimals","value","clampFraction","regionToCrop","originalImageWidth","originalImageHeight","regionOfInterest","cropToRegion","crop"],"sources":["../../../../../src/domains/dam/cropper/utils/cropperJsService.ts"],"sourcesContent":["import type { RegionOfInterest } from '@/domains/dam/types/Roi'\nimport type { CropRect } from '@/domains/dam/cropper/utils/cropperTypes'\n\nconst PRECISION = 3\n\nconst roundTo = (value: number, decimals: number) => {\n  const factor = 10 ** decimals\n  return Math.round(value * factor) / factor\n}\n\nconst clampFraction = (value: number) => Math.min(Math.max(value, 0), 1)\n\n/**\n * A stored region of interest as a crop rectangle, and back.\n *\n * Both are pure arithmetic on the source image's own dimensions — no cropper involved. The region\n * already keeps its size as fractions, and its anchor is a fraction of the source in all but name,\n * so nothing here needs to know how large the picture the cropper happens to be showing is. That\n * used to matter: the conversion went through the displayed image's natural size, which cancelled\n * out of every sum it appeared in and took a rounding correction of its own to patch up.\n */\nexport const regionToCrop = (\n  regionOfInterest: RegionOfInterest,\n  originalImageWidth: number,\n  originalImageHeight: number\n): CropRect => {\n  if (!(originalImageWidth > 0) || !(originalImageHeight > 0)) {\n    return { x: 0, y: 0, width: 1, height: 1 }\n  }\n  return {\n    x: clampFraction(regionOfInterest.pointX / originalImageWidth),\n    y: clampFraction(regionOfInterest.pointY / originalImageHeight),\n    width: clampFraction(regionOfInterest.percentageWidth),\n    height: clampFraction(regionOfInterest.percentageHeight),\n  }\n}\n\nexport const cropToRegion = (\n  crop: CropRect,\n  regionOfInterest: RegionOfInterest,\n  originalImageWidth: number,\n  originalImageHeight: number\n): RegionOfInterest => {\n  regionOfInterest.pointX = Math.max(0, Math.round(crop.x * originalImageWidth))\n  regionOfInterest.pointY = Math.max(0, Math.round(crop.y * originalImageHeight))\n  regionOfInterest.percentageWidth = roundTo(clampFraction(crop.width), PRECISION)\n  regionOfInterest.percentageHeight = roundTo(clampFraction(crop.height), PRECISION)\n\n  return regionOfInterest\n}\n"],"mappings":";AAGA,IAEMA,KAAW,GAAe,MAAqB;CACnD,IAAMC,IAAS,MAAMC;CACrB,OAAO,KAAK,MAAMC,IAAQF,CAAM,IAAIA;AACtC,GAEMG,KAAiB,MAAkB,KAAK,IAAI,KAAK,IAAID,GAAO,CAAC,GAAG,CAAC,GAW1DE,KACX,GACA,GACA,MAEI,EAAEC,IAAqB,MAAM,EAAEC,IAAsB,KAChD;CAAE,GAAG;CAAG,GAAG;CAAG,OAAO;CAAG,QAAQ;AAAE,IAEpC;CACL,GAAGH,EAAcI,EAAiB,SAASF,CAAkB;CAC7D,GAAGF,EAAcI,EAAiB,SAASD,CAAmB;CAC9D,OAAOH,EAAcI,EAAiB,eAAe;CACrD,QAAQJ,EAAcI,EAAiB,gBAAgB;AACzD,GAGWC,KACX,GACA,GACA,GACA,OAEA,EAAiB,SAAS,KAAK,IAAI,GAAG,KAAK,MAAMC,EAAK,IAAIJ,CAAkB,CAAC,GAC7E,EAAiB,SAAS,KAAK,IAAI,GAAG,KAAK,MAAMI,EAAK,IAAIH,CAAmB,CAAC,GAC9E,EAAiB,kBAAkBP,EAAQI,EAAcM,EAAK,KAAK,GAAG,CAAS,GAC/E,EAAiB,mBAAmBV,EAAQI,EAAcM,EAAK,MAAM,GAAG,CAAS,GAE1EF"}

package/dist/domains/dam/cropper/utils/cropperTypes.d.ts

@@ -0,0 +1,14 @@
+/**
+ * A crop rectangle, as fractions of the image between 0 and 1.
+ *
+ * Fractions rather than pixels on purpose: the region of interest the DAM stores is already
+ * expressed that way for its size, and its anchor is a fraction of the source in all but name. Using
+ * them here means nothing has to know how large the picture the cropper happens to have loaded is —
+ * a detail rendition is a scaled copy of the original, and the scale cancels out of every sum.
+ */
+export interface CropRect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}

package/dist/domains/dam/cropper/utils/damAssetImageRoiSelectLoader.d.ts

@@ -0,0 +1,10 @@
+import { Component } from 'vue';
+export declare const ROI_SELECT_LOAD_TIMEOUT = 15000;
+/**
+ * The region editor the upload queue's detail dialogs show, loaded when it first shows: it and
+ * cropper.js under it would otherwise ride along with every page that has an upload queue.
+ * Gives up after `timeout`, so a chunk that never arrives ends in an error the user can retry.
+ * A retry helps when the chunk was only slow. After a failed fetch it helps only where the browser fetches
+ * again: Chrome and Firefox kept the failure until the page reloaded, until the 2026 spec change (whatwg/html#10327).
+ */
+export declare const loadDamAssetImageRoiSelect: (timeout?: number) => Promise<Component>;

package/dist/domains/dam/cropper/utils/damAssetImageRoiSelectLoader.js

@@ -0,0 +1,7 @@
+import { withTimeout as e } from "../../../listEditor/utils/listEditorLoader.js";
+//#region src/domains/dam/cropper/utils/damAssetImageRoiSelectLoader.ts
+var t = 15e3, n = (n = t) => e(import("../components/DamAssetImageRoiSelect.js").then((e) => e.default), n, `The region editor did not load within ${n} ms.`);
+//#endregion
+export { t as ROI_SELECT_LOAD_TIMEOUT, n as loadDamAssetImageRoiSelect };
+
+//# sourceMappingURL=damAssetImageRoiSelectLoader.js.map

package/dist/domains/dam/cropper/utils/damAssetImageRoiSelectLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"damAssetImageRoiSelectLoader.js","names":["ROI_SELECT_LOAD_TIMEOUT","loadDamAssetImageRoiSelect","withTimeout","module","timeout"],"sources":["../../../../../src/domains/dam/cropper/utils/damAssetImageRoiSelectLoader.ts"],"sourcesContent":["import type { Component } from 'vue'\nimport { withTimeout } from '@/domains/listEditor/utils/listEditorLoader'\n\nexport const ROI_SELECT_LOAD_TIMEOUT = 15_000\n\n/**\n * The region editor the upload queue's detail dialogs show, loaded when it first shows: it and\n * cropper.js under it would otherwise ride along with every page that has an upload queue.\n * Gives up after `timeout`, so a chunk that never arrives ends in an error the user can retry.\n * A retry helps when the chunk was only slow. After a failed fetch it helps only where the browser fetches\n * again: Chrome and Firefox kept the failure until the page reloaded, until the 2026 spec change (whatwg/html#10327).\n */\nexport const loadDamAssetImageRoiSelect = (timeout = ROI_SELECT_LOAD_TIMEOUT): Promise<Component> =>\n  withTimeout(\n    import('@/domains/dam/cropper/components/DamAssetImageRoiSelect.vue').then((module) => module.default),\n    timeout,\n    `The region editor did not load within ${timeout} ms.`\n  )\n"],"mappings":";;AAGA,IAAaA,IAA0B,MAS1BC,KAA8B,IAAUD,MACnDE,EACE,OAAO,0CAA8D,CAAC,MAAM,MAAWC,EAAO,OAAO,GACrGC,GACA,yCAAyCA,EAAQ,KACnD"}

package/dist/domains/dam/imageWidget/components/AImageMediaWidget.js

@@ -0,0 +1,7 @@
+import e from "./AImageMediaWidget.vue_vue_type_script_setup_true_lang.js";
+//#region src/domains/dam/imageWidget/components/AImageMediaWidget.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=AImageMediaWidget.js.map

package/dist/domains/dam/imageWidget/components/AImageMediaWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AImageMediaWidget.js","names":["_sfc_main","AImageMediaWidget_vue_vue_type_script_setup_true_lang_default","AImageMediaWidget_default"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImageMediaWidget.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { IntegerId, IntegerIdNullable } from '@/shared/types/common'\nimport { onMounted, provide, ref, shallowRef } from 'vue'\nimport { useDamConfigState } from '@/domains/dam/config/composables/damConfigState'\nimport { useCommonAdminCoreDamOptions } from '@/domains/dam/composables/commonAdminCoreDamOptions'\nimport type { ImageAware, ImageCreateUpdateAware } from '@/domains/dam/types/ImageAware'\nimport type { UploadQueueKey } from '@/domains/dam/types/UploadQueue'\nimport ImageWidgetInner from '@/domains/dam/imageWidget/components/ImageWidgetInner.vue'\nimport { ImageWidgetUploadConfigKey } from '@/domains/dam/imageWidget/utils/imageWidgetInkectionKeys'\nimport { isUndefined } from '@/shared/utils/common'\nimport { isImageWidgetUploadConfigAllowed } from '@/domains/dam/config/utils/damFilterUserAllowedUploadConfigs'\nimport { type CollabComponentConfig, CollabStatus, type CollabStatusType } from '@/domains/collab/types/Collab'\nimport type { DamConfigLicenceExtSystemReturnType } from '@/domains/dam/types/DamConfig'\nimport { useDamConfigStoreOf } from '@/domains/dam/config/store/damConfigStore'\nimport ImageMediaWidgetInner from '@/domains/dam/imageWidget/components/ImageMediaWidgetInner.vue'\nimport AImageWidgetSimple from '@/domains/dam/imageWidget/components/AImageWidgetSimple.vue'\nimport AMediaWidgetSimple from '@/domains/dam/imageWidget/components/AMediaWidgetSimple.vue'\nimport type { MediaAware } from '@/domains/dam/types/MediaAware'\nimport { useI18n } from 'vue-i18n'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\nimport { useExtSystemIdForCached } from '@/domains/dam/composables/extSystemIdForCached'\nimport { DamAssetType } from '@/domains/dam/types/Asset'\n\nconst props = withDefaults(\n  defineProps<{\n    queueKey: UploadQueueKey\n    uploadLicence: IntegerId\n    selectLicences: IntegerId[]\n    initialImage?: ImageAware | undefined // optional, if available, no need to fetch image data\n    configName?: string\n    collab?: CollabComponentConfig\n    collabStatus?: CollabStatusType\n    label?: string | undefined\n    readonly?: boolean\n    required?: boolean\n    dataCy?: string | undefined\n    expandOptions?: boolean\n    expandMetadata?: boolean\n    disableOnClickMenu?: boolean\n    width?: number | undefined\n    maxWidth?: number | undefined\n    height?: number | undefined\n    callDeleteApiOnRemove?: boolean\n    damWidth?: undefined | number\n    damHeight?: undefined | number\n  }>(),\n  {\n    configName: undefined,\n    collab: undefined,\n    collabStatus: CollabStatus.Inactive,\n    label: undefined,\n    initialImage: undefined,\n    initialMedia: undefined,\n    readonly: false,\n    required: false,\n    lockable: false,\n    lockedById: undefined,\n    dataCy: undefined,\n    expandOptions: false,\n    expandMetadata: false,\n    disableOnClickMenu: false,\n    width: undefined,\n    maxWidth: undefined,\n    height: undefined,\n    callDeleteApiOnRemove: false,\n    damWidth: undefined,\n    damHeight: undefined,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: 'afterMetadataSaveSuccess'): void\n}>()\n\nconst mediaModel = defineModel<MediaAware | null>('media', { required: true })\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n// Declared: the read-only fallback renders the slots too, and inferred they would take its looser types.\ndefineSlots<{\n  append?: (props: { imageMedia: ImageCreateUpdateAware | MediaAware | null }) => unknown\n  preview?: (props: { imageMedia: MediaAware }) => unknown\n}>()\nconst imageModel = defineModel<IntegerIdNullable>('image', { required: true })\nconst status = ref<'loading' | 'ready' | 'error'>('loading')\n// Not being allowed to upload is no reason to hide the image that is already there: it is shown read-only.\nconst uploadAllowed = ref(true)\n\nconst { damClient } = useCommonAdminCoreDamOptions(damConfigName)\nconst {\n  loadDamPrvConfig,\n  loadDamConfigAssetCustomFormElements,\n  getDamConfigAssetCustomFormElements,\n  getOrLoadDamConfigExtSystemByLicence,\n  getOrLoadDamConfigExtSystemByLicences,\n} = useDamConfigState(damClient, damConfigName)\n\nconst uploadConfig = shallowRef<DamConfigLicenceExtSystemReturnType | undefined>(undefined)\n\nconst { cachedExtSystemId } = useExtSystemIdForCached(damConfigName)\n\nonMounted(async () => {\n  const damConfigStore = useDamConfigStoreOf(damConfigName)\n  uploadConfig.value = await getOrLoadDamConfigExtSystemByLicence(props.uploadLicence)\n  if (isUndefined(uploadConfig.value)) {\n    status.value = 'error'\n    return\n  }\n  // As the gallery's root: the ext system of its upload licence, till a pick, a drop or \"edit asset\" writes another.\n  cachedExtSystemId.value = uploadConfig.value.extSystem\n  if (!isImageWidgetUploadConfigAllowed(uploadConfig.value, damConfigName)) {\n    uploadAllowed.value = false\n    try {\n      if (!damConfigStore.initialized.damPrvConfig) await loadDamPrvConfig()\n      status.value = 'ready'\n    } catch (e) {\n      status.value = 'error'\n    }\n    return\n  }\n  const promises: Promise<any>[] = []\n  if (!damConfigStore.initialized.damPrvConfig) {\n    promises.push(loadDamPrvConfig())\n  }\n  promises.push(getOrLoadDamConfigExtSystemByLicences(props.selectLicences))\n  const { extSystem } = uploadConfig.value\n  // The custom fields of its images: every type of the ext system where it has none yet, else the image type alone\n  // where its read failed before. The types loaded are not read again.\n  if (isUndefined(getDamConfigAssetCustomFormElements(extSystem, DamAssetType.Image))) {\n    promises.push(\n      loadDamConfigAssetCustomFormElements(\n        extSystem,\n        getDamConfigAssetCustomFormElements(extSystem) ? [DamAssetType.Image] : undefined\n      )\n    )\n  }\n  try {\n    await Promise.all(promises)\n  } catch (e) {\n    status.value = 'error'\n  }\n  // The image type whose read failed beside types that answered is not loaded: its form would have no field.\n  if (isUndefined(getDamConfigAssetCustomFormElements(extSystem, DamAssetType.Image))) status.value = 'error'\n  if (status.value !== 'error') status.value = 'ready'\n})\n\nprovide(ImageWidgetUploadConfigKey, uploadConfig)\n\nconst innerComponent = ref<InstanceType<typeof ImageWidgetInner> | null>(null)\n\nconst metadataConfirm = () => {\n  innerComponent.value?.metadataConfirm()\n}\n\ndefineExpose({\n  metadataConfirm,\n})\n\nconst { t } = useI18n()\n</script>\n\n<template>\n  <ImageMediaWidgetInner\n    v-if=\"status === 'ready'\"\n    ref=\"innerComponent\"\n    v-model:media=\"mediaModel\"\n    v-model:image=\"imageModel\"\n    v-bind=\"props\"\n    :readonly=\"readonly || !uploadAllowed\"\n    @after-metadata-save-success=\"emit('afterMetadataSaveSuccess')\"\n  >\n    <template #append=\"{ imageMedia: appendImage }\">\n      <slot\n        name=\"append\"\n        :image-media=\"appendImage\"\n      />\n    </template>\n    <template #preview=\"{ imageMedia: appendImage }\">\n      <slot\n        name=\"preview\"\n        :image-media=\"appendImage\"\n      />\n    </template>\n  </ImageMediaWidgetInner>\n  <!-- The config fails also for a user without access to the licence: the media or image already there is still shown. -->\n  <div v-else-if=\"status === 'error'\">\n    <AMediaWidgetSimple\n      v-if=\"mediaModel\"\n      :media=\"mediaModel\"\n      :config-name=\"damConfigName\"\n      :label=\"label\"\n      :width=\"width\"\n      :height=\"height\"\n      :dam-width=\"damWidth\"\n      :dam-height=\"damHeight\"\n    >\n      <template #append=\"{ media: appendMedia }\">\n        <slot\n          name=\"append\"\n          :image-media=\"appendMedia\"\n        />\n      </template>\n      <template #preview=\"{ media: previewMedia }\">\n        <slot\n          v-if=\"previewMedia\"\n          name=\"preview\"\n          :image-media=\"previewMedia\"\n        />\n      </template>\n    </AMediaWidgetSimple>\n    <AImageWidgetSimple\n      v-else-if=\"imageModel || initialImage\"\n      :model-value=\"imageModel\"\n      :image=\"initialImage\"\n      :config-name=\"damConfigName\"\n      :label=\"label\"\n      :width=\"width\"\n      :height=\"height\"\n      :dam-width=\"damWidth\"\n      :dam-height=\"damHeight\"\n    >\n      <template #append=\"{ image: appendImage }\">\n        <slot\n          name=\"append\"\n          :image-media=\"appendImage\"\n        />\n      </template>\n    </AImageWidgetSimple>\n    <div class=\"text-error\">\n      {{ t('common.damImage.error.loadingConfig') }}\n    </div>\n  </div>\n  <VProgressCircular\n    v-else\n    :size=\"12\"\n    :width=\"2\"\n    indeterminate\n  />\n</template>\n"],"mappings":""}

package/dist/domains/dam/imageWidget/components/AImageMediaWidget.vue.d.ts

@@ -0,0 +1,82 @@
+import { IntegerId, IntegerIdNullable } from '../../../../shared/types/common';
+import { ImageAware, ImageCreateUpdateAware } from '../../types/ImageAware';
+import { UploadQueueKey } from '../../types/UploadQueue';
+import { CollabComponentConfig, CollabStatusType } from '../../../collab/types/Collab';
+import { MediaAware } from '../../types/MediaAware';
+type __VLS_Props = {
+    queueKey: UploadQueueKey;
+    uploadLicence: IntegerId;
+    selectLicences: IntegerId[];
+    initialImage?: ImageAware | undefined;
+    configName?: string;
+    collab?: CollabComponentConfig;
+    collabStatus?: CollabStatusType;
+    label?: string | undefined;
+    readonly?: boolean;
+    required?: boolean;
+    dataCy?: string | undefined;
+    expandOptions?: boolean;
+    expandMetadata?: boolean;
+    disableOnClickMenu?: boolean;
+    width?: number | undefined;
+    maxWidth?: number | undefined;
+    height?: number | undefined;
+    callDeleteApiOnRemove?: boolean;
+    damWidth?: undefined | number;
+    damHeight?: undefined | number;
+};
+type __VLS_Slots = {
+    append?: (props: {
+        imageMedia: ImageCreateUpdateAware | MediaAware | null;
+    }) => unknown;
+    preview?: (props: {
+        imageMedia: MediaAware;
+    }) => unknown;
+};
+type __VLS_ModelProps = {
+    'media': MediaAware | null;
+    'image': IntegerIdNullable;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {
+    metadataConfirm: () => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:image": (value: IntegerIdNullable) => any;
+    "update:media": (value: MediaAware<import('../../types/MediaAware').DamMedia> | null) => any;
+} & {
+    afterMetadataSaveSuccess: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onAfterMetadataSaveSuccess?: (() => any) | undefined;
+    "onUpdate:image"?: ((value: IntegerIdNullable) => any) | undefined;
+    "onUpdate:media"?: ((value: MediaAware<import('../../types/MediaAware').DamMedia> | null) => any) | undefined;
+}>, {
+    collab: {
+        room: import('../../../collab/types/Collab').CollabRoom;
+        field: import('../../../collab/types/Collab').CollabFieldName;
+        cachedUsers: import('../../../../lib').CollabCachedUsersMap;
+    };
+    label: string;
+    width: number;
+    height: number;
+    required: boolean;
+    dataCy: string;
+    maxWidth: number;
+    readonly: boolean;
+    configName: string;
+    damWidth: number;
+    damHeight: number;
+    collabStatus: CollabStatusType;
+    expandOptions: boolean;
+    expandMetadata: boolean;
+    disableOnClickMenu: boolean;
+    callDeleteApiOnRemove: boolean;
+    initialImage: ImageAware;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/domains/dam/imageWidget/components/AImageMediaWidget.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,172 @@
+import { isUndefined as e } from "../../../../shared/utils/common.js";
+import { CollabStatus as t } from "../../../collab/types/Collab.js";
+import { DamAssetType as n } from "../../types/Asset.js";
+import { useDamConfigStoreOf as r } from "../../config/store/damConfigStore.js";
+import { useCommonAdminCoreDamOptions as i } from "../../composables/commonAdminCoreDamOptions.js";
+import { useDamConfigName as a } from "../../composables/damConfigName.js";
+import { useDamConfigState as o } from "../../config/composables/damConfigState.js";
+import { useExtSystemIdForCached as s } from "../../composables/extSystemIdForCached.js";
+import { isImageWidgetUploadConfigAllowed as c } from "../../config/utils/damFilterUserAllowedUploadConfigs.js";
+import { ImageWidgetUploadConfigKey as l } from "../utils/imageWidgetInkectionKeys.js";
+import u from "./AImageWidgetSimple.js";
+import d from "./ImageMediaWidgetInner.js";
+import f from "./AMediaWidgetSimple.js";
+import { createBlock as p, createCommentVNode as m, createElementBlock as h, createElementVNode as g, defineComponent as _, mergeModels as v, mergeProps as y, onMounted as b, openBlock as x, provide as S, ref as C, renderSlot as w, shallowRef as T, toDisplayString as E, unref as D, useModel as O, withCtx as k } from "vue";
+import { useI18n as A } from "vue-i18n";
+import { VProgressCircular as j } from "vuetify/components/VProgressCircular";
+//#region src/domains/dam/imageWidget/components/AImageMediaWidget.vue?vue&type=script&setup=true&lang.ts
+var M = { key: 1 }, N = { class: "text-error" }, P = /*@__PURE__*/ _({
+	__name: "AImageMediaWidget",
+	props: /*@__PURE__*/ v({
+		queueKey: {},
+		uploadLicence: {},
+		selectLicences: {},
+		initialImage: { default: void 0 },
+		configName: { default: void 0 },
+		collab: { default: void 0 },
+		collabStatus: { default: t.Inactive },
+		label: { default: void 0 },
+		readonly: {
+			type: Boolean,
+			default: !1
+		},
+		required: {
+			type: Boolean,
+			default: !1
+		},
+		dataCy: { default: void 0 },
+		expandOptions: {
+			type: Boolean,
+			default: !1
+		},
+		expandMetadata: {
+			type: Boolean,
+			default: !1
+		},
+		disableOnClickMenu: {
+			type: Boolean,
+			default: !1
+		},
+		width: { default: void 0 },
+		maxWidth: { default: void 0 },
+		height: { default: void 0 },
+		callDeleteApiOnRemove: {
+			type: Boolean,
+			default: !1
+		},
+		damWidth: { default: void 0 },
+		damHeight: { default: void 0 }
+	}, {
+		media: { required: !0 },
+		mediaModifiers: {},
+		image: { required: !0 },
+		imageModifiers: {}
+	}),
+	emits: /*@__PURE__*/ v(["afterMetadataSaveSuccess"], ["update:media", "update:image"]),
+	setup(t, { expose: _, emit: v }) {
+		let P = t, F = v, I = O(t, "media"), L = a(P.configName), R = O(t, "image"), z = C("loading"), B = C(!0), { damClient: V } = i(L), { loadDamPrvConfig: H, loadDamConfigAssetCustomFormElements: U, getDamConfigAssetCustomFormElements: W, getOrLoadDamConfigExtSystemByLicence: G, getOrLoadDamConfigExtSystemByLicences: K } = o(V, L), q = T(void 0), { cachedExtSystemId: J } = s(L);
+		b(async () => {
+			let t = r(L);
+			if (q.value = await G(P.uploadLicence), e(q.value)) {
+				z.value = "error";
+				return;
+			}
+			if (J.value = q.value.extSystem, !c(q.value, L)) {
+				B.value = !1;
+				try {
+					t.initialized.damPrvConfig || await H(), z.value = "ready";
+				} catch {
+					z.value = "error";
+				}
+				return;
+			}
+			let i = [];
+			t.initialized.damPrvConfig || i.push(H()), i.push(K(P.selectLicences));
+			let { extSystem: a } = q.value;
+			e(W(a, n.Image)) && i.push(U(a, W(a) ? [n.Image] : void 0));
+			try {
+				await Promise.all(i);
+			} catch {
+				z.value = "error";
+			}
+			e(W(a, n.Image)) && (z.value = "error"), z.value !== "error" && (z.value = "ready");
+		}), S(l, q);
+		let Y = C(null);
+		_({ metadataConfirm: () => {
+			Y.value?.metadataConfirm();
+		} });
+		let { t: X } = A();
+		return (e, n) => z.value === "ready" ? (x(), p(d, y({
+			key: 0,
+			ref_key: "innerComponent",
+			ref: Y,
+			media: I.value,
+			"onUpdate:media": n[0] ||= (e) => I.value = e,
+			image: R.value,
+			"onUpdate:image": n[1] ||= (e) => R.value = e
+		}, P, {
+			readonly: t.readonly || !B.value,
+			onAfterMetadataSaveSuccess: n[2] ||= (e) => F("afterMetadataSaveSuccess")
+		}), {
+			append: k(({ imageMedia: t }) => [w(e.$slots, "append", { imageMedia: t })]),
+			preview: k(({ imageMedia: t }) => [w(e.$slots, "preview", { imageMedia: t })]),
+			_: 3
+		}, 16, [
+			"media",
+			"image",
+			"readonly"
+		])) : z.value === "error" ? (x(), h("div", M, [I.value ? (x(), p(f, {
+			key: 0,
+			media: I.value,
+			"config-name": D(L),
+			label: t.label,
+			width: t.width,
+			height: t.height,
+			"dam-width": t.damWidth,
+			"dam-height": t.damHeight
+		}, {
+			append: k(({ media: t }) => [w(e.$slots, "append", { imageMedia: t })]),
+			preview: k(({ media: t }) => [t ? w(e.$slots, "preview", { imageMedia: t }, void 0, void 0, 0) : m("", !0)]),
+			_: 3
+		}, 8, [
+			"media",
+			"config-name",
+			"label",
+			"width",
+			"height",
+			"dam-width",
+			"dam-height"
+		])) : R.value || t.initialImage ? (x(), p(u, {
+			key: 1,
+			"model-value": R.value,
+			image: t.initialImage,
+			"config-name": D(L),
+			label: t.label,
+			width: t.width,
+			height: t.height,
+			"dam-width": t.damWidth,
+			"dam-height": t.damHeight
+		}, {
+			append: k(({ image: t }) => [w(e.$slots, "append", { imageMedia: t })]),
+			_: 3
+		}, 8, [
+			"model-value",
+			"image",
+			"config-name",
+			"label",
+			"width",
+			"height",
+			"dam-width",
+			"dam-height"
+		])) : m("", !0), g("div", N, E(D(X)("common.damImage.error.loadingConfig")), 1)])) : (x(), p(j, {
+			key: 2,
+			size: 12,
+			width: 2,
+			indeterminate: ""
+		}));
+	}
+});
+//#endregion
+export { P as default };
+
+//# sourceMappingURL=AImageMediaWidget.vue_vue_type_script_setup_true_lang.js.map

package/dist/domains/dam/imageWidget/components/AImageMediaWidget.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AImageMediaWidget.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createBlock","ImageMediaWidgetInner","_mergeProps","_withCtx","_renderSlot","_createElementBlock","AMediaWidgetSimple","_unref","_createCommentVNode","AImageWidgetSimple","_createElementVNode","_toDisplayString","_component_VProgressCircular","AImageWidgetSimple_default","ImageMediaWidgetInner_default","AMediaWidgetSimple_default","_hoisted_1","_hoisted_2","AImageMediaWidget_vue_vue_type_script_setup_true_lang_default","CollabStatus","\"media\"","\"mediaModifiers\"","\"image\"","\"imageModifiers\"","__expose","__emit","props","__props","emit","mediaModel","useModel","damConfigName","useDamConfigName","imageModel","status","ref","uploadAllowed","useCommonAdminCoreDamOptions","useDamConfigState","damClient","uploadConfig","shallowRef","useExtSystemIdForCached","onMounted","damConfigStore","useDamConfigStoreOf","getOrLoadDamConfigExtSystemByLicence","isUndefined","isImageWidgetUploadConfigAllowed","loadDamPrvConfig","promises","getOrLoadDamConfigExtSystemByLicences","getDamConfigAssetCustomFormElements","extSystem","DamAssetType","loadDamConfigAssetCustomFormElements","provide","ImageWidgetUploadConfigKey","innerComponent","useI18n","openBlock","createBlock","mergeProps","_cache","$event","withCtx","appendImage","renderSlot","_ctx","createElementBlock","unref","appendMedia","previewMedia","createCommentVNode","createElementVNode","toDisplayString","t","VProgressCircular"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImageMediaWidget.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { IntegerId, IntegerIdNullable } from '@/shared/types/common'\nimport { onMounted, provide, ref, shallowRef } from 'vue'\nimport { useDamConfigState } from '@/domains/dam/config/composables/damConfigState'\nimport { useCommonAdminCoreDamOptions } from '@/domains/dam/composables/commonAdminCoreDamOptions'\nimport type { ImageAware, ImageCreateUpdateAware } from '@/domains/dam/types/ImageAware'\nimport type { UploadQueueKey } from '@/domains/dam/types/UploadQueue'\nimport ImageWidgetInner from '@/domains/dam/imageWidget/components/ImageWidgetInner.vue'\nimport { ImageWidgetUploadConfigKey } from '@/domains/dam/imageWidget/utils/imageWidgetInkectionKeys'\nimport { isUndefined } from '@/shared/utils/common'\nimport { isImageWidgetUploadConfigAllowed } from '@/domains/dam/config/utils/damFilterUserAllowedUploadConfigs'\nimport { type CollabComponentConfig, CollabStatus, type CollabStatusType } from '@/domains/collab/types/Collab'\nimport type { DamConfigLicenceExtSystemReturnType } from '@/domains/dam/types/DamConfig'\nimport { useDamConfigStoreOf } from '@/domains/dam/config/store/damConfigStore'\nimport ImageMediaWidgetInner from '@/domains/dam/imageWidget/components/ImageMediaWidgetInner.vue'\nimport AImageWidgetSimple from '@/domains/dam/imageWidget/components/AImageWidgetSimple.vue'\nimport AMediaWidgetSimple from '@/domains/dam/imageWidget/components/AMediaWidgetSimple.vue'\nimport type { MediaAware } from '@/domains/dam/types/MediaAware'\nimport { useI18n } from 'vue-i18n'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\nimport { useExtSystemIdForCached } from '@/domains/dam/composables/extSystemIdForCached'\nimport { DamAssetType } from '@/domains/dam/types/Asset'\n\nconst props = withDefaults(\n  defineProps<{\n    queueKey: UploadQueueKey\n    uploadLicence: IntegerId\n    selectLicences: IntegerId[]\n    initialImage?: ImageAware | undefined // optional, if available, no need to fetch image data\n    configName?: string\n    collab?: CollabComponentConfig\n    collabStatus?: CollabStatusType\n    label?: string | undefined\n    readonly?: boolean\n    required?: boolean\n    dataCy?: string | undefined\n    expandOptions?: boolean\n    expandMetadata?: boolean\n    disableOnClickMenu?: boolean\n    width?: number | undefined\n    maxWidth?: number | undefined\n    height?: number | undefined\n    callDeleteApiOnRemove?: boolean\n    damWidth?: undefined | number\n    damHeight?: undefined | number\n  }>(),\n  {\n    configName: undefined,\n    collab: undefined,\n    collabStatus: CollabStatus.Inactive,\n    label: undefined,\n    initialImage: undefined,\n    initialMedia: undefined,\n    readonly: false,\n    required: false,\n    lockable: false,\n    lockedById: undefined,\n    dataCy: undefined,\n    expandOptions: false,\n    expandMetadata: false,\n    disableOnClickMenu: false,\n    width: undefined,\n    maxWidth: undefined,\n    height: undefined,\n    callDeleteApiOnRemove: false,\n    damWidth: undefined,\n    damHeight: undefined,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: 'afterMetadataSaveSuccess'): void\n}>()\n\nconst mediaModel = defineModel<MediaAware | null>('media', { required: true })\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n// Declared: the read-only fallback renders the slots too, and inferred they would take its looser types.\ndefineSlots<{\n  append?: (props: { imageMedia: ImageCreateUpdateAware | MediaAware | null }) => unknown\n  preview?: (props: { imageMedia: MediaAware }) => unknown\n}>()\nconst imageModel = defineModel<IntegerIdNullable>('image', { required: true })\nconst status = ref<'loading' | 'ready' | 'error'>('loading')\n// Not being allowed to upload is no reason to hide the image that is already there: it is shown read-only.\nconst uploadAllowed = ref(true)\n\nconst { damClient } = useCommonAdminCoreDamOptions(damConfigName)\nconst {\n  loadDamPrvConfig,\n  loadDamConfigAssetCustomFormElements,\n  getDamConfigAssetCustomFormElements,\n  getOrLoadDamConfigExtSystemByLicence,\n  getOrLoadDamConfigExtSystemByLicences,\n} = useDamConfigState(damClient, damConfigName)\n\nconst uploadConfig = shallowRef<DamConfigLicenceExtSystemReturnType | undefined>(undefined)\n\nconst { cachedExtSystemId } = useExtSystemIdForCached(damConfigName)\n\nonMounted(async () => {\n  const damConfigStore = useDamConfigStoreOf(damConfigName)\n  uploadConfig.value = await getOrLoadDamConfigExtSystemByLicence(props.uploadLicence)\n  if (isUndefined(uploadConfig.value)) {\n    status.value = 'error'\n    return\n  }\n  // As the gallery's root: the ext system of its upload licence, till a pick, a drop or \"edit asset\" writes another.\n  cachedExtSystemId.value = uploadConfig.value.extSystem\n  if (!isImageWidgetUploadConfigAllowed(uploadConfig.value, damConfigName)) {\n    uploadAllowed.value = false\n    try {\n      if (!damConfigStore.initialized.damPrvConfig) await loadDamPrvConfig()\n      status.value = 'ready'\n    } catch (e) {\n      status.value = 'error'\n    }\n    return\n  }\n  const promises: Promise<any>[] = []\n  if (!damConfigStore.initialized.damPrvConfig) {\n    promises.push(loadDamPrvConfig())\n  }\n  promises.push(getOrLoadDamConfigExtSystemByLicences(props.selectLicences))\n  const { extSystem } = uploadConfig.value\n  // The custom fields of its images: every type of the ext system where it has none yet, else the image type alone\n  // where its read failed before. The types loaded are not read again.\n  if (isUndefined(getDamConfigAssetCustomFormElements(extSystem, DamAssetType.Image))) {\n    promises.push(\n      loadDamConfigAssetCustomFormElements(\n        extSystem,\n        getDamConfigAssetCustomFormElements(extSystem) ? [DamAssetType.Image] : undefined\n      )\n    )\n  }\n  try {\n    await Promise.all(promises)\n  } catch (e) {\n    status.value = 'error'\n  }\n  // The image type whose read failed beside types that answered is not loaded: its form would have no field.\n  if (isUndefined(getDamConfigAssetCustomFormElements(extSystem, DamAssetType.Image))) status.value = 'error'\n  if (status.value !== 'error') status.value = 'ready'\n})\n\nprovide(ImageWidgetUploadConfigKey, uploadConfig)\n\nconst innerComponent = ref<InstanceType<typeof ImageWidgetInner> | null>(null)\n\nconst metadataConfirm = () => {\n  innerComponent.value?.metadataConfirm()\n}\n\ndefineExpose({\n  metadataConfirm,\n})\n\nconst { t } = useI18n()\n</script>\n\n<template>\n  <ImageMediaWidgetInner\n    v-if=\"status === 'ready'\"\n    ref=\"innerComponent\"\n    v-model:media=\"mediaModel\"\n    v-model:image=\"imageModel\"\n    v-bind=\"props\"\n    :readonly=\"readonly || !uploadAllowed\"\n    @after-metadata-save-success=\"emit('afterMetadataSaveSuccess')\"\n  >\n    <template #append=\"{ imageMedia: appendImage }\">\n      <slot\n        name=\"append\"\n        :image-media=\"appendImage\"\n      />\n    </template>\n    <template #preview=\"{ imageMedia: appendImage }\">\n      <slot\n        name=\"preview\"\n        :image-media=\"appendImage\"\n      />\n    </template>\n  </ImageMediaWidgetInner>\n  <!-- The config fails also for a user without access to the licence: the media or image already there is still shown. -->\n  <div v-else-if=\"status === 'error'\">\n    <AMediaWidgetSimple\n      v-if=\"mediaModel\"\n      :media=\"mediaModel\"\n      :config-name=\"damConfigName\"\n      :label=\"label\"\n      :width=\"width\"\n      :height=\"height\"\n      :dam-width=\"damWidth\"\n      :dam-height=\"damHeight\"\n    >\n      <template #append=\"{ media: appendMedia }\">\n        <slot\n          name=\"append\"\n          :image-media=\"appendMedia\"\n        />\n      </template>\n      <template #preview=\"{ media: previewMedia }\">\n        <slot\n          v-if=\"previewMedia\"\n          name=\"preview\"\n          :image-media=\"previewMedia\"\n        />\n      </template>\n    </AMediaWidgetSimple>\n    <AImageWidgetSimple\n      v-else-if=\"imageModel || initialImage\"\n      :model-value=\"imageModel\"\n      :image=\"initialImage\"\n      :config-name=\"damConfigName\"\n      :label=\"label\"\n      :width=\"width\"\n      :height=\"height\"\n      :dam-width=\"damWidth\"\n      :dam-height=\"damHeight\"\n    >\n      <template #append=\"{ image: appendImage }\">\n        <slot\n          name=\"append\"\n          :image-media=\"appendImage\"\n        />\n      </template>\n    </AImageWidgetSimple>\n    <div class=\"text-error\">\n      {{ t('common.damImage.error.loadingConfig') }}\n    </div>\n  </div>\n  <VProgressCircular\n    v-else\n    :size=\"12\"\n    :width=\"2\"\n    indeterminate\n  />\n</template>\n"],"mappings":"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"}

package/dist/domains/dam/imageWidget/components/AImagePublicInput.js

@@ -0,0 +1,7 @@
+import e from "./AImagePublicInput.vue_vue_type_script_setup_true_lang.js";
+//#region src/domains/dam/imageWidget/components/AImagePublicInput.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=AImagePublicInput.js.map

package/dist/domains/dam/imageWidget/components/AImagePublicInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AImagePublicInput.js","names":["_sfc_main","AImagePublicInput_vue_vue_type_script_setup_true_lang_default","AImagePublicInput_default"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImagePublicInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ImageAware, ImageCreateUpdateAware } from '@/domains/dam/types/ImageAware'\nimport { useCommonAdminCoreDamOptions } from '@/domains/dam/composables/commonAdminCoreDamOptions'\nimport { fetchAssetByFileId } from '@/domains/dam/api/damAssetApi'\nimport { cloneDeep, isDocId, isNull, isString } from '@/shared/utils/common'\nimport { computed, ref, toRaw, watch } from 'vue'\nimport type { AssetDetailItemDto } from '@/domains/dam/types/Asset'\nimport type { IntegerId, IntegerIdNullable } from '@/shared/types/common'\nimport { useImageActions } from '@/domains/dam/imageWidget/composables/imageActions'\nimport { useCommonAdminImageOptions } from '@/domains/dam/imageWidget/composables/commonAdminImageOptions'\nimport { useAlerts } from '@/domains/system/composables/alerts'\nimport { useI18n } from 'vue-i18n'\nimport AFormTextField from '@/domains/form/components/AFormTextField.vue'\nimport AFormTextarea from '@/domains/form/components/AFormTextarea.vue'\nimport ARow from '@/domains/ui/components/ARow.vue'\nimport useVuelidate from '@vuelidate/core'\nimport { useValidate } from '@/shared/validators/vuelidate/useValidate'\nimport { buildFieldRules } from '@/domains/dam/composables/uploadValidations'\nimport { createDamImage } from '@/domains/dam/imageWidget/utils/damImage'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    selectLicences: IntegerId[]\n    image?: ImageAware | undefined // optional, if available, no need to fetch image data\n    configName?: string\n    labelT?: string | undefined\n    dataCy?: string | undefined\n  }>(),\n  {\n    image: undefined,\n    configName: undefined,\n    labelT: 'common.damImage.public.idOrUrl',\n    dataCy: undefined,\n  }\n)\nconst modelValue = defineModel<IntegerIdNullable>({ default: null, required: true })\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\nconst inputField = ref('')\nconst meta = ref({ description: '', source: '' })\n\nconst resolvedSrc = ref('')\nconst resImage = ref<null | ImageCreateUpdateAware>(null)\n// The id of the image this input has just created. Its model changes to that id, and the fields are filled from the\n// answer to the create: the image is not read again. Any other change of the id is read as before.\nlet createdImageId: IntegerIdNullable = null\n\nconst isValid = ref(true)\nconst isDirty = ref(false)\n\nconst imageOptions = useCommonAdminImageOptions(damConfigName)\nconst { imageClient, imageApi } = imageOptions\nconst { damClient, endPointAsset, sourceLabel, descriptionValidation, sourceValidation } =\n  useCommonAdminCoreDamOptions(damConfigName)\nconst { widgetImageToDamImageOriginalUrl } = useImageActions(imageOptions)\n\nconst { showErrorsDefault, showValidationError } = useAlerts()\nconst { t } = useI18n()\n\nconst extractUUID = (url: string): string | undefined => {\n  const regex = /\\/image\\/original\\/([0-9a-fA-F-]+)\\.jpg/\n  const match = url.match(regex)\n\n  return match ? match[1] : undefined\n}\n\nconst validateAssetData = (asset: AssetDetailItemDto, licences: IntegerId[]) => {\n  return licences.some((licence) => licence === asset.licence)\n}\n\nconst validators = useValidate()\n\nconst rules = {\n  meta: {\n    description: buildFieldRules(descriptionValidation, validators),\n    source: buildFieldRules(sourceValidation, validators),\n  },\n}\nconst v$ = useVuelidate(rules, { meta }, { $stopPropagation: true })\n\nconst validateField = async () => {\n  isDirty.value = true\n  isValid.value = true\n  inputField.value = inputField.value.trim()\n  if (inputField.value.startsWith('http')) {\n    const extracted = extractUUID(inputField.value)\n    if (isString(extracted)) inputField.value = extracted\n  }\n  if (!isDocId(inputField.value)) {\n    isValid.value = false\n    return Promise.reject('Incorrect URL/ID provided')\n  }\n  try {\n    const assetRes = await fetchAssetByFileId(damClient, endPointAsset, inputField.value)\n    if (isNull(assetRes.mainFile)) {\n      isValid.value = false\n      return Promise.reject('Incorrect asset mainFile')\n    }\n    if (validateAssetData(assetRes, props.selectLicences)) {\n      isValid.value = true\n      return Promise.resolve(assetRes)\n    }\n    isValid.value = false\n    return Promise.reject('Incorrect asset or no access')\n  } catch (e) {\n    isValid.value = false\n    return Promise.reject('Incorrect asset or no access')\n  }\n}\n\nconst submit = async () => {\n  try {\n    const asset = await validateField()\n    v$.value.$touch()\n    if (v$.value.$invalid) {\n      showValidationError()\n      return Promise.reject('Invalid source or description')\n    }\n    const data = createDamImage(\n      { fileId: asset.mainFile!.id, licenceId: asset.licence, internal: asset.mainFileInternal },\n      { description: meta.value.description.trim(), source: meta.value.source.trim() },\n      { position: 0, id: resImage.value?.id || undefined }\n    )\n    const imageRes = resImage.value?.id\n      ? await imageApi.updateImage(imageClient, resImage.value.id, data)\n      : await imageApi.createImage(imageClient, data)\n    resImage.value = imageRes\n    if (!data.id) createdImageId = imageRes.id\n    modelValue.value = imageRes.id\n    // What the read of the created image used to put into the fields, from the answer to its create.\n    if (!data.id) await reload(imageRes, imageRes.id, true)\n    return Promise.resolve({ asset: asset, image: imageRes })\n  } catch (e) {\n    showErrorsDefault(e)\n    return undefined\n  }\n}\n\nconst updatePreviewAndTexts = () => {\n  resolvedSrc.value = widgetImageToDamImageOriginalUrl(createDamImage({ fileId: inputField.value, licenceId: 0 }))\n}\n\nconst onBlur = async () => {\n  try {\n    await validateField()\n    updatePreviewAndTexts()\n  } catch (e) {\n    //\n  }\n}\n\nconst reload = async (newImage: ImageCreateUpdateAware | undefined, newImageId: IntegerIdNullable, force = false) => {\n  resolvedSrc.value = ''\n  if ((newImage && isNull(resImage.value)) || (newImage && force)) {\n    resImage.value = cloneDeep(newImage)\n    if (resImage.value) {\n      inputField.value = resImage.value.dam.damId\n      resolvedSrc.value = widgetImageToDamImageOriginalUrl(toRaw(resImage.value))\n      meta.value.description = resImage.value.texts.description\n      meta.value.source = resImage.value.texts.source\n      onBlur()\n    }\n    return\n  }\n  if (newImageId) {\n    try {\n      resImage.value = await imageApi.fetchImage(imageClient, newImageId)\n    } catch (error) {\n      showErrorsDefault(error)\n    }\n    if (!isNull(resImage.value)) {\n      inputField.value = resImage.value.dam.damId\n      resolvedSrc.value = widgetImageToDamImageOriginalUrl(toRaw(resImage.value))\n      meta.value.description = resImage.value.texts.description\n      meta.value.source = resImage.value.texts.source\n      onBlur()\n    }\n    return\n  }\n  resImage.value = null\n  meta.value.description = ''\n  meta.value.source = ''\n}\n\nconst disabled = computed(() => !(isValid.value && isDirty.value))\n\nwatch(\n  [() => props.image, modelValue],\n  async ([newImage, newImageId], [oldImage]) => {\n    const created = createdImageId\n    createdImageId = null\n    if (!isNull(created) && newImageId === created && newImage === oldImage) return\n    await reload(newImage, newImageId)\n  },\n  { immediate: true }\n)\n\ndefineExpose({\n  submit,\n})\n</script>\n\n<template>\n  <ARow>\n    <AFormTextField\n      v-model=\"inputField\"\n      :label=\"labelT ? t(labelT) : undefined\"\n      :error=\"!isValid\"\n      :error-message=\"isValid ? undefined : t('common.damImage.public.inputError')\"\n      required\n      @blur=\"onBlur\"\n      @keyup.enter=\"onBlur\"\n    />\n  </ARow>\n  <ARow>\n    <AFormTextarea\n      v-model=\"meta.description\"\n      :label=\"t('common.damImage.image.model.texts.description')\"\n      :v=\"v$.meta.description\"\n      :disabled=\"disabled\"\n    />\n  </ARow>\n  <ARow>\n    <AFormTextarea\n      v-model=\"meta.source\"\n      :label=\"sourceLabel\"\n      :v=\"v$.meta.source\"\n      :disabled=\"disabled\"\n    />\n  </ARow>\n  <ARow style=\"min-height: 50px\">\n    <div>{{ t('common.damImage.public.imagePreview') }}:</div>\n    <img\n      v-if=\"resolvedSrc.length > 0\"\n      :src=\"resolvedSrc\"\n      alt=\"\"\n    />\n  </ARow>\n</template>\n"],"mappings":""}