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

package/dist/domains/dam/assetDetail/components/AssetImage.vue.d.ts

@@ -0,0 +1,69 @@
+import { AssetFileProperties, DamAssetStatusType, DamAssetTypeType } from '../../types/Asset';
+import { DatetimeUTCNullable } from '../../../../shared/types/common';
+type __VLS_Props = {
+    src?: string;
+    assetType?: DamAssetTypeType;
+    assetStatus?: DamAssetStatusType;
+    backgroundColor?: string;
+    width?: number;
+    height?: number;
+    fallbackHeight?: number;
+    iconSize?: number;
+    useComponent?: boolean;
+    cover?: boolean;
+    aspectRatio?: number;
+    showUploading?: boolean;
+    showProcessing?: boolean;
+    showWaiting?: boolean;
+    showDone?: boolean;
+    uploadingColor?: string;
+    processingColor?: string;
+    disableProcessingText?: boolean;
+    uploadingProgress?: number | null;
+    remainingTime?: number | null;
+    hideIcon?: boolean;
+    showMetaIcons?: boolean;
+    assetFileProperties?: AssetFileProperties | undefined;
+    /** Passed to the meta icons: shows the synthesized audio (TTS) icon. */
+    showTts?: boolean;
+    /** Passed to the meta icons: shows the badge of the automatic deletion. */
+    autoDeleteAt?: DatetimeUTCNullable;
+    /** Passed to the meta icons: the badge of the asset's licence. */
+    licenceBadge?: string;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    error: () => any;
+    load: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onError?: (() => any) | undefined;
+    onLoad?: (() => any) | undefined;
+}>, {
+    assetType: DamAssetTypeType;
+    width: number;
+    height: number;
+    autoDeleteAt: DatetimeUTCNullable;
+    iconSize: number;
+    src: string;
+    assetFileProperties: AssetFileProperties;
+    assetStatus: DamAssetStatusType;
+    showTts: boolean;
+    licenceBadge: string;
+    backgroundColor: string;
+    fallbackHeight: number;
+    showMetaIcons: boolean;
+    remainingTime: number | null;
+    useComponent: boolean;
+    cover: boolean;
+    aspectRatio: number;
+    showUploading: boolean;
+    showProcessing: boolean;
+    showWaiting: boolean;
+    showDone: boolean;
+    uploadingColor: string;
+    processingColor: string;
+    disableProcessingText: boolean;
+    uploadingProgress: number | null;
+    hideIcon: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/domains/dam/assetDetail/components/AssetImage.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,314 @@
+import e from "../../../../assets/image/placeholder16x9.js";
+import { DamAssetStatus as t, DamAssetType as n } from "../../types/Asset.js";
+import { isUndefined as r } from "../../../../shared/utils/common.js";
+import { useRemainingTime as i } from "../../../ui/datetime/composables/remainingTime.js";
+import a from "./AssetImageMetaIcons.js";
+import { computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, normalizeStyle as m, openBlock as h, toDisplayString as g, unref as _, withCtx as v } from "vue";
+import { useI18n as y } from "vue-i18n";
+import { VIcon as b } from "vuetify/components/VIcon";
+import { VProgressCircular as x } from "vuetify/components/VProgressCircular";
+import { VImg as S } from "vuetify/components/VImg";
+// src/domains/dam/assetDetail/components/AssetImage.vue?vue&type=script&setup=true&lang.ts
+var C = {
+	key: 0,
+	class: "asset-image__progress"
+}, w = { class: "text-body-small text-center" }, T = {
+	key: 1,
+	class: "asset-image__progress"
+}, E = {
+	key: 0,
+	class: "text-body-small text-center"
+}, D = {
+	key: 2,
+	class: "asset-image__progress"
+}, O = { class: "text-body-small text-center" }, k = {
+	key: 0,
+	class: "font-weight-bold"
+}, A = {
+	key: 0,
+	class: "asset-image__icon-wrapper"
+}, j = {
+	key: 1,
+	class: "asset-image__progress asset-image__progress--animate-done"
+}, M = { class: "text-body-small text-center" }, N = {
+	key: 2,
+	class: "asset-image asset-image--img position-relative"
+}, P = [
+	"src",
+	"width",
+	"height"
+], F = {
+	key: 0,
+	class: "asset-image__icon-wrapper"
+}, I = {
+	key: 0,
+	class: "asset-image__icon-wrapper"
+}, L = {
+	key: 1,
+	class: "asset-image__progress asset-image__progress--animate-done"
+}, R = { class: "text-body-small text-center" }, z = /*@__PURE__*/ p({
+	__name: "AssetImage",
+	props: {
+		src: { default: void 0 },
+		assetType: { default: n.Image },
+		assetStatus: { default: t.WithFile },
+		backgroundColor: { default: "#ccc" },
+		width: { default: void 0 },
+		height: { default: void 0 },
+		fallbackHeight: { default: 200 },
+		iconSize: { default: 80 },
+		useComponent: {
+			type: Boolean,
+			default: !1
+		},
+		cover: {
+			type: Boolean,
+			default: !1
+		},
+		aspectRatio: { default: void 0 },
+		showUploading: {
+			type: Boolean,
+			default: !1
+		},
+		showProcessing: {
+			type: Boolean,
+			default: !1
+		},
+		showWaiting: {
+			type: Boolean,
+			default: !1
+		},
+		showDone: {
+			type: Boolean,
+			default: !1
+		},
+		uploadingColor: { default: "primary" },
+		processingColor: { default: "primary" },
+		disableProcessingText: {
+			type: Boolean,
+			default: !1
+		},
+		uploadingProgress: { default: null },
+		remainingTime: { default: null },
+		hideIcon: {
+			type: Boolean,
+			default: !1
+		},
+		showMetaIcons: {
+			type: Boolean,
+			default: !1
+		},
+		assetFileProperties: { default: void 0 },
+		showTts: {
+			type: Boolean,
+			default: !1
+		},
+		autoDeleteAt: { default: null },
+		licenceBadge: { default: "" }
+	},
+	emits: ["load", "error"],
+	setup(p, { emit: z }) {
+		let B = p, V = z, { t: H } = y(), U = () => {
+			V("load");
+		}, W = () => {
+			V("error");
+		}, G = o(() => {
+			if (B.assetStatus === t.Deleting) return "mdi-trash-can";
+			switch (B.assetType) {
+				case n.Audio: return B.assetStatus === t.WithFile ? "mdi-music" : "mdi-music-off";
+				case n.Document: return B.assetStatus === t.WithFile ? "mdi-note" : "mdi-note-off";
+				case n.Video: return B.assetStatus === t.WithFile ? "mdi-video" : "mdi-video-off";
+				case n.Image: return B.assetStatus === t.WithFile ? "mdi-image" : "mdi-image-off";
+				default: return "";
+			}
+		}), K = o(() => {
+			if (!B.uploadingProgress) return "0%";
+			let e = Math.ceil(B.uploadingProgress);
+			return e > 100 ? "100%" : e + "%";
+		}), q = o(() => [t.Deleting, t.Draft].includes(B.assetStatus) ? "#ccc" : B.backgroundColor), J = o(() => B.assetStatus === t.WithFile ? "#505050" : "#8f8f8f"), Y = o(() => r(B.src) ? e : B.src), X = o(() => !(B.hideIcon || B.assetType === n.Image && B.src)), { remainingTimeShort: Z } = i();
+		return (e, n) => p.showUploading || p.showProcessing || p.showWaiting ? (h(), s(S, {
+			key: 0,
+			"aspect-ratio": p.aspectRatio,
+			src: Y.value,
+			width: p.width,
+			height: p.height,
+			cover: p.cover,
+			class: "asset-image asset-image--loading-bg",
+			onError: W,
+			onLoad: U
+		}, {
+			placeholder: v(() => [...n[0] ||= []]),
+			default: v(() => [p.showWaiting ? (h(), l("div", C, [f(x, {
+				indeterminate: "",
+				size: p.iconSize,
+				width: p.iconSize / 10
+			}, null, 8, ["size", "width"]), u("div", w, g(_(H)("common.damImage.upload.waiting")), 1)])) : c("", !0), p.showProcessing ? (h(), l("div", T, [f(x, {
+				color: p.processingColor,
+				indeterminate: "",
+				size: p.iconSize,
+				width: p.iconSize / 10,
+				class: "ml-auto mr-auto"
+			}, null, 8, [
+				"color",
+				"size",
+				"width"
+			]), p.disableProcessingText ? c("", !0) : (h(), l("div", E, g(_(H)("common.damImage.upload.processing")), 1))])) : p.showUploading ? (h(), l("div", D, [f(x, {
+				color: p.uploadingColor,
+				size: p.iconSize,
+				width: p.iconSize / 10,
+				class: "ml-auto mr-auto",
+				"model-value": p.uploadingProgress === null ? void 0 : p.uploadingProgress
+			}, {
+				default: v(() => [d(g(K.value), 1)]),
+				_: 1
+			}, 8, [
+				"color",
+				"size",
+				"width",
+				"model-value"
+			]), u("div", O, [d(g(_(H)("common.damImage.upload.uploading")) + " ", 1), p.remainingTime ? (h(), l("span", k, g(_(Z)(p.remainingTime)), 1)) : c("", !0)])])) : c("", !0)]),
+			_: 1
+		}, 8, [
+			"aspect-ratio",
+			"src",
+			"width",
+			"height",
+			"cover"
+		])) : p.assetStatus === _(t).WithFile && p.src && p.useComponent ? (h(), s(S, {
+			key: 1,
+			src: Y.value,
+			width: p.width,
+			height: p.height,
+			class: "asset-image asset-image--component position-relative",
+			cover: p.cover,
+			"aspect-ratio": p.aspectRatio,
+			onLoad: U,
+			onError: W
+		}, {
+			placeholder: v(() => [...n[1] ||= []]),
+			default: v(() => [
+				X.value ? (h(), l("div", A, [u("div", {
+					class: "asset-image__icon-circle",
+					style: m({ padding: p.iconSize / 4 + "px" })
+				}, [G.value.length ? (h(), s(b, {
+					key: 0,
+					size: p.iconSize,
+					icon: G.value,
+					color: J.value
+				}, null, 8, [
+					"size",
+					"icon",
+					"color"
+				])) : c("", !0)], 4)])) : c("", !0),
+				p.showDone ? (h(), l("div", j, [f(b, {
+					icon: "mdi-check-circle",
+					color: "success",
+					size: p.iconSize
+				}, null, 8, ["size"]), u("div", M, g(_(H)("common.damImage.upload.done")), 1)])) : c("", !0),
+				p.showMetaIcons && p.assetFileProperties ? (h(), s(a, {
+					key: 2,
+					"asset-file-properties": p.assetFileProperties,
+					"asset-type": p.assetType,
+					"show-tts": p.showTts,
+					"auto-delete-at": p.autoDeleteAt,
+					"licence-badge": p.licenceBadge
+				}, null, 8, [
+					"asset-file-properties",
+					"asset-type",
+					"show-tts",
+					"auto-delete-at",
+					"licence-badge"
+				])) : c("", !0)
+			]),
+			_: 1
+		}, 8, [
+			"src",
+			"width",
+			"height",
+			"cover",
+			"aspect-ratio"
+		])) : p.assetStatus === _(t).WithFile && p.src ? (h(), l("div", N, [
+			u("img", {
+				src: Y.value,
+				width: p.width,
+				height: p.height,
+				alt: "",
+				style: m("background-color:" + q.value),
+				onOnerror: W
+			}, null, 44, P),
+			X.value ? (h(), l("div", F, [u("div", {
+				class: "asset-image__icon-circle",
+				style: m({ padding: p.iconSize / 4 + "px" })
+			}, [G.value.length ? (h(), s(b, {
+				key: 0,
+				size: p.iconSize,
+				icon: G.value,
+				color: J.value,
+				class: "asset-image__icon"
+			}, null, 8, [
+				"size",
+				"icon",
+				"color"
+			])) : c("", !0)], 4)])) : c("", !0),
+			p.showMetaIcons && p.assetFileProperties ? (h(), s(a, {
+				key: 1,
+				"asset-file-properties": p.assetFileProperties,
+				"asset-type": p.assetType,
+				"show-tts": p.showTts,
+				"auto-delete-at": p.autoDeleteAt,
+				"licence-badge": p.licenceBadge
+			}, null, 8, [
+				"asset-file-properties",
+				"asset-type",
+				"show-tts",
+				"auto-delete-at",
+				"licence-badge"
+			])) : c("", !0)
+		])) : (h(), l("div", {
+			key: 3,
+			style: m({
+				height: p.fallbackHeight + "px",
+				backgroundColor: q.value,
+				width: p.width + "px"
+			}),
+			class: "asset-image asset-image--placeholder d-flex align-center justify-center"
+		}, [
+			X.value ? (h(), l("div", I, [u("div", {
+				class: "asset-image__icon-circle",
+				style: m({ padding: p.iconSize / 4 + "px" })
+			}, [G.value.length ? (h(), s(b, {
+				key: 0,
+				size: p.iconSize,
+				icon: G.value,
+				color: J.value,
+				class: "asset-image__icon"
+			}, null, 8, [
+				"size",
+				"icon",
+				"color"
+			])) : c("", !0)], 4)])) : c("", !0),
+			p.showDone ? (h(), l("div", L, [f(b, {
+				icon: "mdi-check-circle",
+				color: "success",
+				size: p.iconSize
+			}, null, 8, ["size"]), u("div", R, g(_(H)("common.damImage.upload.done")), 1)])) : c("", !0),
+			p.showMetaIcons && p.assetFileProperties ? (h(), s(a, {
+				key: 2,
+				"asset-file-properties": p.assetFileProperties,
+				"asset-type": p.assetType,
+				"show-tts": p.showTts,
+				"auto-delete-at": p.autoDeleteAt,
+				"licence-badge": p.licenceBadge
+			}, null, 8, [
+				"asset-file-properties",
+				"asset-type",
+				"show-tts",
+				"auto-delete-at",
+				"licence-badge"
+			])) : c("", !0)
+		], 4));
+	}
+});
+export { z as default };
+
+//# sourceMappingURL=AssetImage.vue_vue_type_script_setup_true_lang.js.map

package/dist/domains/dam/assetDetail/components/AssetImage.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetImage.vue_vue_type_script_setup_true_lang.js","names":["placeholder16x9","_openBlock","_createBlock","_component_VImg","_withCtx","_createElementBlock","_createVNode","_component_VProgressCircular","_createElementVNode","_toDisplayString","_unref","_createCommentVNode","_createTextVNode","_normalizeStyle","_component_VIcon","AssetImageMetaIcons","placeholder16x9_default","AssetImageMetaIcons_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","_hoisted_15","_hoisted_16","AssetImage_vue_vue_type_script_setup_true_lang_default","DamAssetType","DamAssetStatus","__emit","props","__props","emit","useI18n","onLoad","onError","icon","computed","uploadingPercentage","value","backgroundColorComputed","iconColor","srcComputed","isUndefined","showIconComputed","useRemainingTime","openBlock","createBlock","VImg","withCtx","_cache","createElementBlock","createVNode","VProgressCircular","createElementVNode","toDisplayString","unref","t","createCommentVNode","createTextVNode","remainingTimeShort","normalizeStyle","VIcon"],"sources":["../../../../../src/domains/dam/assetDetail/components/AssetImage.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport placeholder16x9 from '@/assets/image/placeholder16x9.svg'\nimport {\n  type AssetFileProperties,\n  DamAssetStatus,\n  type DamAssetStatusType,\n  DamAssetType,\n  type DamAssetTypeType,\n} from '@/domains/dam/types/Asset'\nimport type { DatetimeUTCNullable } from '@/shared/types/common'\nimport { isUndefined } from '@/shared/utils/common'\nimport { useRemainingTime } from '@/domains/ui/datetime/composables/remainingTime'\nimport AssetImageMetaIcons from '@/domains/dam/assetDetail/components/AssetImageMetaIcons.vue'\n\nconst props = withDefaults(\n  defineProps<{\n    src?: string\n    assetType?: DamAssetTypeType\n    assetStatus?: DamAssetStatusType\n    backgroundColor?: string\n    width?: number\n    height?: number\n    fallbackHeight?: number\n    iconSize?: number\n    useComponent?: boolean\n    cover?: boolean\n    aspectRatio?: number\n    showUploading?: boolean\n    showProcessing?: boolean\n    showWaiting?: boolean\n    showDone?: boolean\n    uploadingColor?: string\n    processingColor?: string\n    disableProcessingText?: boolean\n    uploadingProgress?: number | null\n    remainingTime?: number | null\n    hideIcon?: boolean\n    showMetaIcons?: boolean\n    assetFileProperties?: AssetFileProperties | undefined\n    /** Passed to the meta icons: shows the synthesized audio (TTS) icon. */\n    showTts?: boolean\n    /** Passed to the meta icons: shows the badge of the automatic deletion. */\n    autoDeleteAt?: DatetimeUTCNullable\n    /** Passed to the meta icons: the badge of the asset's licence. */\n    licenceBadge?: string\n  }>(),\n  {\n    assetType: DamAssetType.Image,\n    assetStatus: DamAssetStatus.WithFile,\n    src: undefined,\n    backgroundColor: '#ccc',\n    width: undefined,\n    height: undefined,\n    fallbackHeight: 200,\n    iconSize: 80,\n    useComponent: false,\n    cover: false,\n    aspectRatio: undefined,\n    showUploading: false,\n    showProcessing: false,\n    showWaiting: false,\n    showDone: false,\n    uploadingColor: 'primary',\n    processingColor: 'primary',\n    disableProcessingText: false,\n    uploadingProgress: null,\n    remainingTime: null,\n    hideIcon: false,\n    showMetaIcons: false,\n    assetFileProperties: undefined,\n    showTts: false,\n    autoDeleteAt: null,\n    licenceBadge: '',\n  }\n)\nconst emit = defineEmits<{\n  (e: 'load'): void\n  (e: 'error'): void\n}>()\n\nconst { t } = useI18n()\n\nconst onLoad = () => {\n  emit('load')\n}\nconst onError = () => {\n  emit('error')\n}\n\nconst icon = computed(() => {\n  if (props.assetStatus === DamAssetStatus.Deleting) return 'mdi-trash-can'\n  switch (props.assetType) {\n    case DamAssetType.Audio:\n      return props.assetStatus === DamAssetStatus.WithFile ? 'mdi-music' : 'mdi-music-off'\n    case DamAssetType.Document:\n      return props.assetStatus === DamAssetStatus.WithFile ? 'mdi-note' : 'mdi-note-off'\n    case DamAssetType.Video:\n      return props.assetStatus === DamAssetStatus.WithFile ? 'mdi-video' : 'mdi-video-off'\n    case DamAssetType.Image:\n      return props.assetStatus === DamAssetStatus.WithFile ? 'mdi-image' : 'mdi-image-off'\n    default:\n      return ''\n  }\n})\n\nconst uploadingPercentage = computed(() => {\n  if (!props.uploadingProgress) return '0%'\n  const value = Math.ceil(props.uploadingProgress)\n  return value > 100 ? '100%' : value + '%'\n})\n\nconst backgroundColorComputed = computed(() => {\n  const grayBackgroundStatuses: readonly DamAssetStatusType[] = [DamAssetStatus.Deleting, DamAssetStatus.Draft]\n  return grayBackgroundStatuses.includes(props.assetStatus) ? '#ccc' : props.backgroundColor\n})\n\nconst iconColor = computed(() => {\n  return props.assetStatus === DamAssetStatus.WithFile ? '#505050' : '#8f8f8f'\n})\n\nconst srcComputed = computed(() => {\n  return isUndefined(props.src) ? placeholder16x9 : props.src\n})\n\nconst showIconComputed = computed(() => {\n  if (props.hideIcon) return false\n  else if (props.assetType === DamAssetType.Image && props.src) return false\n  return true\n})\n\nconst { remainingTimeShort } = useRemainingTime()\n</script>\n\n<template>\n  <VImg\n    v-if=\"showUploading || showProcessing || showWaiting\"\n    :aspect-ratio=\"aspectRatio\"\n    :src=\"srcComputed\"\n    :width=\"width\"\n    :height=\"height\"\n    :cover=\"cover\"\n    class=\"asset-image asset-image--loading-bg\"\n    @error=\"onError\"\n    @load=\"onLoad\"\n  >\n    <template #placeholder />\n    <template #default>\n      <div\n        v-if=\"showWaiting\"\n        class=\"asset-image__progress\"\n      >\n        <VProgressCircular\n          indeterminate\n          :size=\"iconSize\"\n          :width=\"iconSize / 10\"\n        />\n        <div class=\"text-body-small text-center\">\n          {{ t('common.damImage.upload.waiting') }}\n        </div>\n      </div>\n      <div\n        v-if=\"showProcessing\"\n        class=\"asset-image__progress\"\n      >\n        <VProgressCircular\n          :color=\"processingColor\"\n          indeterminate\n          :size=\"iconSize\"\n          :width=\"iconSize / 10\"\n          class=\"ml-auto mr-auto\"\n        />\n        <div\n          v-if=\"!disableProcessingText\"\n          class=\"text-body-small text-center\"\n        >\n          {{ t('common.damImage.upload.processing') }}\n        </div>\n      </div>\n      <div\n        v-else-if=\"showUploading\"\n        class=\"asset-image__progress\"\n      >\n        <VProgressCircular\n          :color=\"uploadingColor\"\n          :size=\"iconSize\"\n          :width=\"iconSize / 10\"\n          class=\"ml-auto mr-auto\"\n          :model-value=\"uploadingProgress === null ? undefined : uploadingProgress\"\n        >\n          {{ uploadingPercentage }}\n        </VProgressCircular>\n        <div class=\"text-body-small text-center\">\n          {{ t('common.damImage.upload.uploading') }}\n          <span\n            v-if=\"remainingTime\"\n            class=\"font-weight-bold\"\n          >\n            {{ remainingTimeShort(remainingTime) }}\n          </span>\n        </div>\n      </div>\n    </template>\n  </VImg>\n  <VImg\n    v-else-if=\"assetStatus === DamAssetStatus.WithFile && src && useComponent\"\n    :src=\"srcComputed\"\n    :width=\"width\"\n    :height=\"height\"\n    class=\"asset-image asset-image--component position-relative\"\n    :cover=\"cover\"\n    :aspect-ratio=\"aspectRatio\"\n    @load=\"onLoad\"\n    @error=\"onError\"\n  >\n    <template #placeholder />\n    <template #default>\n      <div\n        v-if=\"showIconComputed\"\n        class=\"asset-image__icon-wrapper\"\n      >\n        <div\n          class=\"asset-image__icon-circle\"\n          :style=\"{ padding: iconSize / 4 + 'px' }\"\n        >\n          <VIcon\n            v-if=\"icon.length\"\n            :size=\"iconSize\"\n            :icon=\"icon\"\n            :color=\"iconColor\"\n          />\n        </div>\n      </div>\n      <div\n        v-if=\"showDone\"\n        class=\"asset-image__progress asset-image__progress--animate-done\"\n      >\n        <VIcon\n          icon=\"mdi-check-circle\"\n          color=\"success\"\n          :size=\"iconSize\"\n        />\n        <div class=\"text-body-small text-center\">\n          {{ t('common.damImage.upload.done') }}\n        </div>\n      </div>\n      <AssetImageMetaIcons\n        v-if=\"showMetaIcons && assetFileProperties\"\n        :asset-file-properties=\"assetFileProperties\"\n        :asset-type=\"assetType\"\n        :show-tts=\"showTts\"\n        :auto-delete-at=\"autoDeleteAt\"\n        :licence-badge=\"licenceBadge\"\n      />\n    </template>\n  </VImg>\n  <div\n    v-else-if=\"assetStatus === DamAssetStatus.WithFile && src\"\n    class=\"asset-image asset-image--img position-relative\"\n  >\n    <img\n      :src=\"srcComputed\"\n      :width=\"width\"\n      :height=\"height\"\n      alt=\"\"\n      :style=\"'background-color:' + backgroundColorComputed\"\n      @onerror=\"onError\"\n    />\n    <div\n      v-if=\"showIconComputed\"\n      class=\"asset-image__icon-wrapper\"\n    >\n      <div\n        class=\"asset-image__icon-circle\"\n        :style=\"{ padding: iconSize / 4 + 'px' }\"\n      >\n        <VIcon\n          v-if=\"icon.length\"\n          :size=\"iconSize\"\n          :icon=\"icon\"\n          :color=\"iconColor\"\n          class=\"asset-image__icon\"\n        />\n      </div>\n    </div>\n    <AssetImageMetaIcons\n      v-if=\"showMetaIcons && assetFileProperties\"\n      :asset-file-properties=\"assetFileProperties\"\n      :asset-type=\"assetType\"\n      :show-tts=\"showTts\"\n      :auto-delete-at=\"autoDeleteAt\"\n      :licence-badge=\"licenceBadge\"\n    />\n  </div>\n  <div\n    v-else\n    :style=\"{\n      height: fallbackHeight + 'px',\n      backgroundColor: backgroundColorComputed,\n      width: width + 'px',\n    }\"\n    class=\"asset-image asset-image--placeholder d-flex align-center justify-center\"\n  >\n    <div\n      v-if=\"showIconComputed\"\n      class=\"asset-image__icon-wrapper\"\n    >\n      <div\n        class=\"asset-image__icon-circle\"\n        :style=\"{ padding: iconSize / 4 + 'px' }\"\n      >\n        <VIcon\n          v-if=\"icon.length\"\n          :size=\"iconSize\"\n          :icon=\"icon\"\n          :color=\"iconColor\"\n          class=\"asset-image__icon\"\n        />\n      </div>\n    </div>\n    <div\n      v-if=\"showDone\"\n      class=\"asset-image__progress asset-image__progress--animate-done\"\n    >\n      <VIcon\n        icon=\"mdi-check-circle\"\n        color=\"success\"\n        :size=\"iconSize\"\n      />\n      <div class=\"text-body-small text-center\">\n        {{ t('common.damImage.upload.done') }}\n      </div>\n    </div>\n    <AssetImageMetaIcons\n      v-if=\"showMetaIcons && assetFileProperties\"\n      :asset-file-properties=\"assetFileProperties\"\n      :asset-type=\"assetType\"\n      :show-tts=\"showTts\"\n      :auto-delete-at=\"autoDeleteAt\"\n      :licence-badge=\"licenceBadge\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/domains/dam/assetDetail/components/AssetImageMetaIcons.js

@@ -0,0 +1,7 @@
+import e from "./AssetImageMetaIcons.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                    */
+// src/domains/dam/assetDetail/components/AssetImageMetaIcons.vue
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=AssetImageMetaIcons.js.map

package/dist/domains/dam/assetDetail/components/AssetImageMetaIcons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetImageMetaIcons.js","names":["_sfc_main","AssetImageMetaIcons_vue_vue_type_script_setup_true_lang_default","AssetImageMetaIcons_default"],"sources":["../../../../../src/domains/dam/assetDetail/components/AssetImageMetaIcons.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport { type AssetFileProperties, DamAssetType, type DamAssetTypeType } from '@/domains/dam/types/Asset'\nimport {\n  DIMENSIONS_CONFIG,\n  ICON_LOW,\n  ICON_RSS,\n  ICON_SLOTS,\n  ICON_TTS,\n  LOW_DIMENSION,\n} from '@/domains/dam/assetDetail/utils/assetImageIconsConfig'\nimport { useDamConfigStoreOf } from '@/domains/dam/config/store/damConfigStore'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\nimport { useRemainingTime } from '@/domains/ui/datetime/composables/remainingTime'\nimport { useAutoDeleteTimeLeft } from '@/domains/dam/assetDetail/composables/autoDeleteTimeLeft'\nimport type { DatetimeUTCNullable } from '@/shared/types/common'\nimport { dateTimeFriendly } from '@/shared/utils/datetime'\n\nconst props = withDefaults(\n  defineProps<{\n    assetType: DamAssetTypeType\n    assetFileProperties: AssetFileProperties\n    disableAbsolute?: boolean\n    /** Shows the synthesized audio (TTS) icon. Off by default because the backend reports it to every admin. */\n    showTts?: boolean\n    /** DAM configuration whose distribution services name the icons. Inherited when not given. */\n    configName?: string\n    /** When DAM deletes the asset: a badge shows the time left. Only admin-dam passes it, the other admins show none. */\n    autoDeleteAt?: DatetimeUTCNullable\n    /** Badge of the asset's licence, shown as given. Empty shows none. */\n    licenceBadge?: string\n  }>(),\n  {\n    disableAbsolute: false,\n    showTts: false,\n    configName: undefined,\n    autoDeleteAt: null,\n    licenceBadge: '',\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigStore = useDamConfigStoreOf(useDamConfigName(props.configName))\n\nconst { t } = useI18n()\nconst { remainingTimeShort } = useRemainingTime()\n\nconst { secondsLeft } = useAutoDeleteTimeLeft(() => props.autoDeleteAt)\n\nconst autoDeleteBadge = computed(() => {\n  if (!props.autoDeleteAt || secondsLeft.value === null) return null\n  return {\n    text: remainingTimeShort(secondsLeft.value),\n    title: t('common.damImage.asset.metaIcons.autoDeleteAt', { date: dateTimeFriendly(props.autoDeleteAt) }),\n  }\n})\n\nconst checkDimensions = (icons: string[], titles: string[]) => {\n  if (props.assetFileProperties.width === 0 || props.assetFileProperties.height === 0) {\n    return\n  }\n  if (props.assetFileProperties.width < LOW_DIMENSION || props.assetFileProperties.height < LOW_DIMENSION) {\n    icons.push(ICON_LOW)\n    titles.push(t('common.damImage.asset.metaIcons.low'))\n    return\n  }\n  if (props.assetType !== DamAssetType.Video) return\n  for (const dimension of DIMENSIONS_CONFIG) {\n    if (props.assetFileProperties.width === dimension.width && props.assetFileProperties.height === dimension.height) {\n      icons.push(dimension.svgSrc)\n      titles.push(t(dimension.titleT))\n      break\n    }\n  }\n}\n\nconst checkDistributions = (icons: string[], titles: string[]) => {\n  for (const serviceName of props.assetFileProperties.distributesInServices) {\n    const service = damConfigStore.damPrvConfig.distributionServices[serviceName]\n    const iconPath = service?.iconPath\n    if (service && iconPath && iconPath.length > 0 && !icons.includes(iconPath)) {\n      icons.push(iconPath)\n      titles.push(service.title)\n    }\n  }\n}\n\nconst data = computed(() => {\n  const icons: string[] = []\n  const titles: string[] = []\n\n  if (props.assetFileProperties.slotNames.length > 1) {\n    icons.push(ICON_SLOTS)\n    titles.push(t('common.damImage.asset.metaIcons.slots'))\n  }\n  if (props.assetFileProperties.fromRss) {\n    icons.push(ICON_RSS)\n    titles.push(t('common.damImage.asset.metaIcons.rss'))\n  }\n  if (props.showTts && props.assetFileProperties.ttsAudio) {\n    icons.push(ICON_TTS)\n    titles.push(t('common.damImage.asset.metaIcons.tts'))\n  }\n  checkDimensions(icons, titles)\n  checkDistributions(icons, titles)\n\n  return { icons, titles }\n})\n</script>\n\n<template>\n  <div\n    v-show=\"data.icons.length > 0 || autoDeleteBadge || licenceBadge\"\n    class=\"asset-image__meta-icons\"\n    :class=\"{ 'asset-image__meta-icons-absolute': !disableAbsolute }\"\n  >\n    <span\n      v-if=\"licenceBadge\"\n      class=\"asset-image__licence-badge\"\n      data-cy=\"asset-licence-badge\"\n    >\n      {{ licenceBadge }}\n    </span>\n    <VChip\n      v-if=\"autoDeleteBadge\"\n      size=\"x-small\"\n      variant=\"flat\"\n      color=\"warning\"\n      class=\"ma-1 align-self-center\"\n      :title=\"autoDeleteBadge.title\"\n      data-cy=\"asset-auto-delete-badge\"\n    >\n      {{ autoDeleteBadge.text }}\n    </VChip>\n    <img\n      v-for=\"(item, index) in data.icons\"\n      :key=\"item\"\n      class=\"img-svg\"\n      :src=\"item\"\n      alt=\"\"\n      :title=\"data.titles[index] || ''\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\">\n.asset-image__meta-icons-absolute {\n  position: absolute;\n  left: 6px;\n  top: 163px;\n}\n\n.asset-image__meta-icons {\n  display: flex;\n\n  img.img-svg {\n    height: 30px;\n    padding: 2px;\n  }\n\n  // As the SVG meta icons: a half-transparent black circle with white bold letters.\n  .asset-image__licence-badge {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 26px;\n    height: 26px;\n    margin: 2px;\n    border-radius: 50%;\n    background-color: rgb(0 0 0 / 50%);\n    color: #fff;\n    font-size: 10px;\n    font-weight: 700;\n    line-height: 1;\n  }\n}\n</style>\n"],"mappings":""}

package/dist/domains/dam/assetDetail/components/AssetImageMetaIcons.vue.d.ts

@@ -0,0 +1,24 @@
+import { AssetFileProperties, DamAssetTypeType } from '../../types/Asset';
+import { DatetimeUTCNullable } from '../../../../shared/types/common';
+type __VLS_Props = {
+    assetType: DamAssetTypeType;
+    assetFileProperties: AssetFileProperties;
+    disableAbsolute?: boolean;
+    /** Shows the synthesized audio (TTS) icon. Off by default because the backend reports it to every admin. */
+    showTts?: boolean;
+    /** DAM configuration whose distribution services name the icons. Inherited when not given. */
+    configName?: string;
+    /** When DAM deletes the asset: a badge shows the time left. Only admin-dam passes it, the other admins show none. */
+    autoDeleteAt?: DatetimeUTCNullable;
+    /** Badge of the asset's licence, shown as given. Empty shows none. */
+    licenceBadge?: string;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    autoDeleteAt: DatetimeUTCNullable;
+    disableAbsolute: boolean;
+    showTts: boolean;
+    configName: string;
+    licenceBadge: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/domains/dam/assetDetail/components/AssetImageMetaIcons.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,85 @@
+import { DamAssetType as e } from "../../types/Asset.js";
+import { DIMENSIONS_CONFIG as t, ICON_LOW as n, ICON_RSS as r, ICON_SLOTS as i, ICON_TTS as a } from "../utils/assetImageIconsConfig.js";
+import { useDamConfigStoreOf as o } from "../../config/store/damConfigStore.js";
+import { useDamConfigName as s } from "../../composables/damConfigName.js";
+import { useRemainingTime as c } from "../../../ui/datetime/composables/remainingTime.js";
+import { useAutoDeleteTimeLeft as l } from "../composables/autoDeleteTimeLeft.js";
+import { dateTimeFriendly as u } from "../../../../shared/utils/datetime.js";
+import { Fragment as d, computed as f, createBlock as p, createCommentVNode as m, createElementBlock as h, createTextVNode as g, defineComponent as _, normalizeClass as v, openBlock as y, renderList as b, toDisplayString as x, vShow as S, withCtx as C, withDirectives as w } from "vue";
+import { useI18n as T } from "vue-i18n";
+import { VChip as E } from "vuetify/components/VChip";
+// src/domains/dam/assetDetail/components/AssetImageMetaIcons.vue?vue&type=script&setup=true&lang.ts
+var D = {
+	key: 0,
+	class: "asset-image__licence-badge",
+	"data-cy": "asset-licence-badge"
+}, O = ["src", "title"], k = /*@__PURE__*/ _({
+	__name: "AssetImageMetaIcons",
+	props: {
+		assetType: {},
+		assetFileProperties: {},
+		disableAbsolute: {
+			type: Boolean,
+			default: !1
+		},
+		showTts: {
+			type: Boolean,
+			default: !1
+		},
+		configName: { default: void 0 },
+		autoDeleteAt: { default: null },
+		licenceBadge: { default: "" }
+	},
+	setup(_) {
+		let k = _, A = o(s(k.configName)), { t: j } = T(), { remainingTimeShort: M } = c(), { secondsLeft: N } = l(() => k.autoDeleteAt), P = f(() => !k.autoDeleteAt || N.value === null ? null : {
+			text: M(N.value),
+			title: j("common.damImage.asset.metaIcons.autoDeleteAt", { date: u(k.autoDeleteAt) })
+		}), F = (r, i) => {
+			if (k.assetFileProperties.width !== 0 && k.assetFileProperties.height !== 0) {
+				if (k.assetFileProperties.width < 600 || k.assetFileProperties.height < 600) r.push(n), i.push(j("common.damImage.asset.metaIcons.low"));
+				else if (k.assetType === e.Video) {
+					for (let e of t) if (k.assetFileProperties.width === e.width && k.assetFileProperties.height === e.height) {
+						r.push(e.svgSrc), i.push(j(e.titleT));
+						break;
+					}
+				}
+			}
+		}, I = (e, t) => {
+			for (let n of k.assetFileProperties.distributesInServices) {
+				let r = A.damPrvConfig.distributionServices[n], i = r?.iconPath;
+				r && i && i.length > 0 && !e.includes(i) && (e.push(i), t.push(r.title));
+			}
+		}, L = f(() => {
+			let e = [], t = [];
+			return k.assetFileProperties.slotNames.length > 1 && (e.push(i), t.push(j("common.damImage.asset.metaIcons.slots"))), k.assetFileProperties.fromRss && (e.push(r), t.push(j("common.damImage.asset.metaIcons.rss"))), k.showTts && k.assetFileProperties.ttsAudio && (e.push(a), t.push(j("common.damImage.asset.metaIcons.tts"))), F(e, t), I(e, t), {
+				icons: e,
+				titles: t
+			};
+		});
+		return (e, t) => w((y(), h("div", { class: v(["asset-image__meta-icons", { "asset-image__meta-icons-absolute": !_.disableAbsolute }]) }, [
+			_.licenceBadge ? (y(), h("span", D, x(_.licenceBadge), 1)) : m("", !0),
+			P.value ? (y(), p(E, {
+				key: 1,
+				size: "x-small",
+				variant: "flat",
+				color: "warning",
+				class: "ma-1 align-self-center",
+				title: P.value.title,
+				"data-cy": "asset-auto-delete-badge"
+			}, {
+				default: C(() => [g(x(P.value.text), 1)]),
+				_: 1
+			}, 8, ["title"])) : m("", !0),
+			(y(!0), h(d, null, b(L.value.icons, (e, t) => (y(), h("img", {
+				key: e,
+				class: "img-svg",
+				src: e,
+				alt: "",
+				title: L.value.titles[t] || ""
+			}, null, 8, O))), 128))
+		], 2)), [[S, L.value.icons.length > 0 || P.value || _.licenceBadge]]);
+	}
+});
+export { k as default };
+
+//# sourceMappingURL=AssetImageMetaIcons.vue_vue_type_script_setup_true_lang.js.map

package/dist/domains/dam/assetDetail/components/AssetImageMetaIcons.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetImageMetaIcons.vue_vue_type_script_setup_true_lang.js","names":["_withDirectives","_openBlock","_createElementBlock","_normalizeClass","_toDisplayString","_createCommentVNode","_createBlock","_component_VChip","_withCtx","_createTextVNode","_Fragment","_renderList","_vShow","_hoisted_1","_hoisted_2","AssetImageMetaIcons_vue_vue_type_script_setup_true_lang_default","props","__props","damConfigStore","useDamConfigStoreOf","useDamConfigName","useI18n","useRemainingTime","useAutoDeleteTimeLeft","autoDeleteBadge","computed","secondsLeft","remainingTimeShort","t","dateTimeFriendly","checkDimensions","icons","ICON_LOW","titles","DamAssetType","dimension","DIMENSIONS_CONFIG","checkDistributions","serviceName","service","iconPath","data","ICON_SLOTS","ICON_RSS","ICON_TTS","withDirectives","openBlock","createElementBlock","normalizeClass","toDisplayString","createCommentVNode","createBlock","VChip","withCtx","createTextVNode","Fragment","renderList","item","index","vShow"],"sources":["../../../../../src/domains/dam/assetDetail/components/AssetImageMetaIcons.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport { type AssetFileProperties, DamAssetType, type DamAssetTypeType } from '@/domains/dam/types/Asset'\nimport {\n  DIMENSIONS_CONFIG,\n  ICON_LOW,\n  ICON_RSS,\n  ICON_SLOTS,\n  ICON_TTS,\n  LOW_DIMENSION,\n} from '@/domains/dam/assetDetail/utils/assetImageIconsConfig'\nimport { useDamConfigStoreOf } from '@/domains/dam/config/store/damConfigStore'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\nimport { useRemainingTime } from '@/domains/ui/datetime/composables/remainingTime'\nimport { useAutoDeleteTimeLeft } from '@/domains/dam/assetDetail/composables/autoDeleteTimeLeft'\nimport type { DatetimeUTCNullable } from '@/shared/types/common'\nimport { dateTimeFriendly } from '@/shared/utils/datetime'\n\nconst props = withDefaults(\n  defineProps<{\n    assetType: DamAssetTypeType\n    assetFileProperties: AssetFileProperties\n    disableAbsolute?: boolean\n    /** Shows the synthesized audio (TTS) icon. Off by default because the backend reports it to every admin. */\n    showTts?: boolean\n    /** DAM configuration whose distribution services name the icons. Inherited when not given. */\n    configName?: string\n    /** When DAM deletes the asset: a badge shows the time left. Only admin-dam passes it, the other admins show none. */\n    autoDeleteAt?: DatetimeUTCNullable\n    /** Badge of the asset's licence, shown as given. Empty shows none. */\n    licenceBadge?: string\n  }>(),\n  {\n    disableAbsolute: false,\n    showTts: false,\n    configName: undefined,\n    autoDeleteAt: null,\n    licenceBadge: '',\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigStore = useDamConfigStoreOf(useDamConfigName(props.configName))\n\nconst { t } = useI18n()\nconst { remainingTimeShort } = useRemainingTime()\n\nconst { secondsLeft } = useAutoDeleteTimeLeft(() => props.autoDeleteAt)\n\nconst autoDeleteBadge = computed(() => {\n  if (!props.autoDeleteAt || secondsLeft.value === null) return null\n  return {\n    text: remainingTimeShort(secondsLeft.value),\n    title: t('common.damImage.asset.metaIcons.autoDeleteAt', { date: dateTimeFriendly(props.autoDeleteAt) }),\n  }\n})\n\nconst checkDimensions = (icons: string[], titles: string[]) => {\n  if (props.assetFileProperties.width === 0 || props.assetFileProperties.height === 0) {\n    return\n  }\n  if (props.assetFileProperties.width < LOW_DIMENSION || props.assetFileProperties.height < LOW_DIMENSION) {\n    icons.push(ICON_LOW)\n    titles.push(t('common.damImage.asset.metaIcons.low'))\n    return\n  }\n  if (props.assetType !== DamAssetType.Video) return\n  for (const dimension of DIMENSIONS_CONFIG) {\n    if (props.assetFileProperties.width === dimension.width && props.assetFileProperties.height === dimension.height) {\n      icons.push(dimension.svgSrc)\n      titles.push(t(dimension.titleT))\n      break\n    }\n  }\n}\n\nconst checkDistributions = (icons: string[], titles: string[]) => {\n  for (const serviceName of props.assetFileProperties.distributesInServices) {\n    const service = damConfigStore.damPrvConfig.distributionServices[serviceName]\n    const iconPath = service?.iconPath\n    if (service && iconPath && iconPath.length > 0 && !icons.includes(iconPath)) {\n      icons.push(iconPath)\n      titles.push(service.title)\n    }\n  }\n}\n\nconst data = computed(() => {\n  const icons: string[] = []\n  const titles: string[] = []\n\n  if (props.assetFileProperties.slotNames.length > 1) {\n    icons.push(ICON_SLOTS)\n    titles.push(t('common.damImage.asset.metaIcons.slots'))\n  }\n  if (props.assetFileProperties.fromRss) {\n    icons.push(ICON_RSS)\n    titles.push(t('common.damImage.asset.metaIcons.rss'))\n  }\n  if (props.showTts && props.assetFileProperties.ttsAudio) {\n    icons.push(ICON_TTS)\n    titles.push(t('common.damImage.asset.metaIcons.tts'))\n  }\n  checkDimensions(icons, titles)\n  checkDistributions(icons, titles)\n\n  return { icons, titles }\n})\n</script>\n\n<template>\n  <div\n    v-show=\"data.icons.length > 0 || autoDeleteBadge || licenceBadge\"\n    class=\"asset-image__meta-icons\"\n    :class=\"{ 'asset-image__meta-icons-absolute': !disableAbsolute }\"\n  >\n    <span\n      v-if=\"licenceBadge\"\n      class=\"asset-image__licence-badge\"\n      data-cy=\"asset-licence-badge\"\n    >\n      {{ licenceBadge }}\n    </span>\n    <VChip\n      v-if=\"autoDeleteBadge\"\n      size=\"x-small\"\n      variant=\"flat\"\n      color=\"warning\"\n      class=\"ma-1 align-self-center\"\n      :title=\"autoDeleteBadge.title\"\n      data-cy=\"asset-auto-delete-badge\"\n    >\n      {{ autoDeleteBadge.text }}\n    </VChip>\n    <img\n      v-for=\"(item, index) in data.icons\"\n      :key=\"item\"\n      class=\"img-svg\"\n      :src=\"item\"\n      alt=\"\"\n      :title=\"data.titles[index] || ''\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\">\n.asset-image__meta-icons-absolute {\n  position: absolute;\n  left: 6px;\n  top: 163px;\n}\n\n.asset-image__meta-icons {\n  display: flex;\n\n  img.img-svg {\n    height: 30px;\n    padding: 2px;\n  }\n\n  // As the SVG meta icons: a half-transparent black circle with white bold letters.\n  .asset-image__licence-badge {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 26px;\n    height: 26px;\n    margin: 2px;\n    border-radius: 50%;\n    background-color: rgb(0 0 0 / 50%);\n    color: #fff;\n    font-size: 10px;\n    font-weight: 700;\n    line-height: 1;\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/domains/dam/assetDetail/components/AssetInfobox.js

@@ -0,0 +1,6 @@
+import e from "./AssetInfobox.vue_vue_type_script_setup_true_lang.js";
+// src/domains/dam/assetDetail/components/AssetInfobox.vue
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=AssetInfobox.js.map

package/dist/domains/dam/assetDetail/components/AssetInfobox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetInfobox.js","names":["_sfc_main","AssetInfobox_vue_vue_type_script_setup_true_lang_default","AssetInfobox_default"],"sources":["../../../../../src/domains/dam/assetDetail/components/AssetInfobox.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useI18n } from 'vue-i18n'\nimport {\n  AssetFileFailReason,\n  type AssetFileFailReasonType,\n  AssetFileProcessStatus,\n  type AssetFileProcessStatusType,\n} from '@/domains/dam/types/AssetFile'\nimport { DamAssetStatus, type DamAssetStatusType } from '@/domains/dam/types/Asset'\nimport AssetFileFailReasonChip from '@/domains/dam/assetDetail/components/AssetFileFailReasonChip.vue'\n\nwithDefaults(\n  defineProps<{\n    assetStatus: DamAssetStatusType\n    assetMainFileStatus?: AssetFileProcessStatusType | undefined\n    assetMainFileFailReason?: AssetFileFailReasonType | undefined\n  }>(),\n  {\n    assetMainFileStatus: undefined,\n    assetMainFileFailReason: undefined,\n  }\n)\n\nconst { t } = useI18n()\n</script>\n\n<template>\n  <div\n    v-if=\"assetMainFileStatus && assetMainFileStatus === AssetFileProcessStatus.Duplicate\"\n    class=\"w-100 pa-2 text-body-small\"\n  >\n    <VAlert type=\"warning\">\n      {{ t('common.damImage.asset.detail.info.status.duplicate') }}\n    </VAlert>\n  </div>\n  <div\n    v-if=\"assetMainFileStatus && assetMainFileStatus === AssetFileProcessStatus.Failed\"\n    class=\"w-100 pa-2 text-body-small\"\n  >\n    <VAlert type=\"error\">\n      {{ t('common.damImage.asset.detail.info.status.failed') }}\n      <!-- Like the queue row: no chip for the `None` reason. -->\n      <div v-if=\"assetMainFileFailReason && assetMainFileFailReason !== AssetFileFailReason.None\">\n        <br />\n        <AssetFileFailReasonChip :reason=\"assetMainFileFailReason\" />\n      </div>\n    </VAlert>\n  </div>\n  <div\n    v-else-if=\"assetStatus === DamAssetStatus.Deleting\"\n    class=\"w-100 pa-2 text-body-small\"\n  >\n    <VAlert type=\"error\">\n      {{ t('common.damImage.asset.detail.info.status.deleting') }}\n    </VAlert>\n  </div>\n  <div\n    v-else-if=\"assetStatus === DamAssetStatus.Draft\"\n    class=\"w-100 pa-2 text-body-small\"\n  >\n    <VAlert type=\"warning\">\n      {{ t('common.damImage.asset.detail.info.status.draft') }}\n    </VAlert>\n  </div>\n</template>\n"],"mappings":""}

package/dist/domains/dam/assetDetail/components/AssetInfobox.vue.d.ts

@@ -0,0 +1,13 @@
+import { AssetFileFailReasonType, AssetFileProcessStatusType } from '../../types/AssetFile';
+import { DamAssetStatusType } from '../../types/Asset';
+type __VLS_Props = {
+    assetStatus: DamAssetStatusType;
+    assetMainFileStatus?: AssetFileProcessStatusType | undefined;
+    assetMainFileFailReason?: AssetFileFailReasonType | undefined;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    assetMainFileStatus: AssetFileProcessStatusType;
+    assetMainFileFailReason: AssetFileFailReasonType;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;