@anzusystems/common-admin 2.0.0-rc.7 → 2.0.0-rc.9

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

@@ -1,114 +1,141 @@
 import { dateTimePretty as e } from "../../../../shared/utils/datetime.js";
-import t from "../../../cached/components/ACachedUserChip.js";
-import n from "../../../ui/components/ACopyText.js";
-import { DamAssetType as r, DamAssetTypeDefault as i } from "../../types/Asset.js";
-import { useDamConfigName as a } from "../../composables/damConfigName.js";
-import { useDamCachedUsers as o } from "../../author/composables/cachedUsers.js";
-import { prettyBytes as s } from "../../../../shared/utils/file.js";
-import { assetFileIsImageFile as c } from "../../types/AssetFile.js";
-import l from "./AssetMetadataImageAttributes.js";
-import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, createVNode as _, defineComponent as v, openBlock as y, toDisplayString as b, unref as x, withCtx as S } from "vue";
-import { useI18n as C } from "vue-i18n";
-import { VCol as w, VRow as T } from "vuetify/components/VGrid";
-import { VExpansionPanel as E, VExpansionPanelText as D } from "vuetify/components/VExpansionPanel";
+import t from "../../../cached/components/ACachedChip.js";
+import n from "../../../cached/components/ACachedUserChip.js";
+import r from "../../../ui/components/ACopyText.js";
+import { DamAssetType as i, DamAssetTypeDefault as a } from "../../types/Asset.js";
+import { useDamConfigName as o } from "../../composables/damConfigName.js";
+import { useDamCachedUsers as s } from "../../author/composables/cachedUsers.js";
+import { useDamCachedAssetLicences as c } from "../../user/composables/cachedAssetLicences.js";
+import { prettyBytes as l } from "../../../../shared/utils/file.js";
+import { assetFileIsImageFile as u } from "../../types/AssetFile.js";
+import d from "./AssetMetadataImageAttributes.js";
+import { Fragment as f, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createTextVNode as v, createVNode as y, defineComponent as b, openBlock as x, toDisplayString as S, unref as C, watch as w, withCtx as T } from "vue";
+import { useI18n as E } from "vue-i18n";
+import { VCol as D, VRow as O } from "vuetify/components/VGrid";
+import { VExpansionPanel as k, VExpansionPanelText as A } from "vuetify/components/VExpansionPanel";
 // src/domains/dam/assetDetail/components/AssetFileInfoPanel.vue?vue&type=script&setup=true&lang.ts
-var O = /*@__PURE__*/ v({
+var j = /*@__PURE__*/ b({
 	__name: "AssetFileInfoPanel",
 	props: {
 		asset: {},
-		showUsers: { type: Boolean }
+		showUsers: { type: Boolean },
+		showLicence: {
+			type: Boolean,
+			default: !1
+		}
 	},
-	setup(v) {
-		let O = v, { t: k } = C(), A = d(() => (O.asset.attributes.assetType || i) === r.Image), { getCachedUser: j } = o(a());
-		return (r, i) => (y(), f(E, {
+	setup(b) {
+		let j = b, { t: M } = E(), N = p(() => (j.asset.attributes.assetType || a) === i.Image), P = o(), { getCachedUser: F } = s(P), { addToCachedAssetLicences: I, fetchCachedAssetLicences: L, getCachedAssetLicence: R } = c(P);
+		return w([() => j.showLicence, () => j.asset.licence], ([e, t]) => {
+			e && (I(t), L());
+		}, { immediate: !0 }), (i, a) => (x(), m(k, {
 			elevation: "0",
-			title: x(k)("common.damImage.asset.detail.info.file"),
+			title: C(M)("common.damImage.asset.detail.info.file"),
 			value: "file"
 		}, {
-			default: S(() => [_(D, { class: "text-body-small" }, {
-				default: S(() => [
-					_(T, null, {
-						default: S(() => [_(w, { cols: "3" }, {
-							default: S(() => [g(b(x(k)("common.damImage.asset.detail.info.field.id")), 1)]),
+			default: T(() => [y(A, { class: "text-body-small" }, {
+				default: T(() => [
+					y(O, null, {
+						default: T(() => [y(D, { cols: "3" }, {
+							default: T(() => [v(S(C(M)("common.damImage.asset.detail.info.field.id")), 1)]),
 							_: 1
-						}), _(w, { cols: "9" }, {
-							default: S(() => [_(n, { value: v.asset.id }, null, 8, ["value"])]),
+						}), y(D, { cols: "9" }, {
+							default: T(() => [y(r, { value: b.asset.id }, null, 8, ["value"])]),
 							_: 1
 						})]),
 						_: 1
 					}),
-					_(T, null, {
-						default: S(() => [_(w, { cols: "3" }, {
-							default: S(() => [g(b(x(k)("common.damImage.asset.detail.info.field.type")), 1)]),
+					y(O, null, {
+						default: T(() => [y(D, { cols: "3" }, {
+							default: T(() => [v(S(C(M)("common.damImage.asset.detail.info.field.type")), 1)]),
 							_: 1
-						}), _(w, { cols: "9" }, {
-							default: S(() => [g(b(v.asset.attributes.assetType), 1)]),
+						}), y(D, { cols: "9" }, {
+							default: T(() => [v(S(b.asset.attributes.assetType), 1)]),
 							_: 1
 						})]),
 						_: 1
 					}),
-					_(T, null, {
-						default: S(() => [_(w, { cols: "3" }, {
-							default: S(() => [g(b(x(k)("common.model.tracking.created")), 1)]),
+					b.showLicence ? (x(), m(O, {
+						key: 0,
+						"data-cy": "asset-licence"
+					}, {
+						default: T(() => [y(D, { cols: "3" }, {
+							default: T(() => [v(S(C(M)("common.damImage.asset.detail.info.field.licence")), 1)]),
 							_: 1
-						}), _(w, { cols: "9" }, {
-							default: S(() => [g(b(x(e)(v.asset.createdAt)) + " ", 1), v.showUsers ? (y(), m(u, { key: 0 }, [i[0] ||= h("br", null, null, -1), _(t, {
-								id: v.asset.createdBy,
-								"get-cached-fn": x(j)
-							}, null, 8, ["id", "get-cached-fn"])], 64)) : p("", !0)]),
+						}), y(D, { cols: "9" }, {
+							default: T(() => [y(t, {
+								id: b.asset.licence,
+								"get-cached-fn": C(R),
+								"display-text-path": "name",
+								route: "",
+								"disable-click": ""
+							}, null, 8, ["id", "get-cached-fn"])]),
+							_: 1
+						})]),
+						_: 1
+					})) : h("", !0),
+					y(O, null, {
+						default: T(() => [y(D, { cols: "3" }, {
+							default: T(() => [v(S(C(M)("common.model.tracking.created")), 1)]),
+							_: 1
+						}), y(D, { cols: "9" }, {
+							default: T(() => [v(S(C(e)(b.asset.createdAt)) + " ", 1), b.showUsers ? (x(), g(f, { key: 0 }, [a[0] ||= _("br", null, null, -1), y(n, {
+								id: b.asset.createdBy,
+								"get-cached-fn": C(F)
+							}, null, 8, ["id", "get-cached-fn"])], 64)) : h("", !0)]),
 							_: 1
 						})]),
 						_: 1
 					}),
-					_(T, null, {
-						default: S(() => [_(w, { cols: "3" }, {
-							default: S(() => [g(b(x(k)("common.model.tracking.modified")), 1)]),
+					y(O, null, {
+						default: T(() => [y(D, { cols: "3" }, {
+							default: T(() => [v(S(C(M)("common.model.tracking.modified")), 1)]),
 							_: 1
-						}), _(w, { cols: "9" }, {
-							default: S(() => [g(b(x(e)(v.asset.modifiedAt)) + " ", 1), v.showUsers ? (y(), m(u, { key: 0 }, [i[1] ||= h("br", null, null, -1), _(t, {
-								id: v.asset.modifiedBy,
-								"get-cached-fn": x(j)
-							}, null, 8, ["id", "get-cached-fn"])], 64)) : p("", !0)]),
+						}), y(D, { cols: "9" }, {
+							default: T(() => [v(S(C(e)(b.asset.modifiedAt)) + " ", 1), b.showUsers ? (x(), g(f, { key: 0 }, [a[1] ||= _("br", null, null, -1), y(n, {
+								id: b.asset.modifiedBy,
+								"get-cached-fn": C(F)
+							}, null, 8, ["id", "get-cached-fn"])], 64)) : h("", !0)]),
 							_: 1
 						})]),
 						_: 1
 					}),
-					v.asset.mainFile ? (y(), m(u, { key: 0 }, [
-						_(T, null, {
-							default: S(() => [_(w, { cols: "3" }, {
-								default: S(() => [g(b(x(k)("common.damImage.asset.detail.info.field.mainFileId")), 1)]),
+					b.asset.mainFile ? (x(), g(f, { key: 1 }, [
+						y(O, null, {
+							default: T(() => [y(D, { cols: "3" }, {
+								default: T(() => [v(S(C(M)("common.damImage.asset.detail.info.field.mainFileId")), 1)]),
 								_: 1
-							}), _(w, { cols: "9" }, {
-								default: S(() => [_(n, { value: v.asset.mainFile.id }, null, 8, ["value"])]),
+							}), y(D, { cols: "9" }, {
+								default: T(() => [y(r, { value: b.asset.mainFile.id }, null, 8, ["value"])]),
 								_: 1
 							})]),
 							_: 1
 						}),
-						_(T, null, {
-							default: S(() => [_(w, { cols: "3" }, {
-								default: S(() => [g(b(x(k)("common.damImage.asset.detail.info.field.mimeType")), 1)]),
+						y(O, null, {
+							default: T(() => [y(D, { cols: "3" }, {
+								default: T(() => [v(S(C(M)("common.damImage.asset.detail.info.field.mimeType")), 1)]),
 								_: 1
-							}), _(w, { cols: "9" }, {
-								default: S(() => [g(b(v.asset.mainFile.fileAttributes.mimeType), 1)]),
+							}), y(D, { cols: "9" }, {
+								default: T(() => [v(S(b.asset.mainFile.fileAttributes.mimeType), 1)]),
 								_: 1
 							})]),
 							_: 1
 						}),
-						_(T, null, {
-							default: S(() => [_(w, { cols: "3" }, {
-								default: S(() => [g(b(x(k)("common.damImage.asset.detail.info.field.size")), 1)]),
+						y(O, null, {
+							default: T(() => [y(D, { cols: "3" }, {
+								default: T(() => [v(S(C(M)("common.damImage.asset.detail.info.field.size")), 1)]),
 								_: 1
-							}), _(w, { cols: "9" }, {
-								default: S(() => [g(b(x(s)(v.asset.mainFile.fileAttributes.size)), 1)]),
+							}), y(D, { cols: "9" }, {
+								default: T(() => [v(S(C(l)(b.asset.mainFile.fileAttributes.size)), 1)]),
 								_: 1
 							})]),
 							_: 1
 						}),
-						A.value && x(c)(v.asset.mainFile) ? (y(), f(l, {
+						N.value && C(u)(b.asset.mainFile) ? (x(), m(d, {
 							key: 0,
-							file: v.asset.mainFile
-						}, null, 8, ["file"])) : p("", !0)
-					], 64)) : p("", !0)
+							file: b.asset.mainFile
+						}, null, 8, ["file"])) : h("", !0)
+					], 64)) : h("", !0)
 				]),
 				_: 1
 			})]),
@@ -116,6 +143,6 @@ var O = /*@__PURE__*/ v({
 		}, 8, ["title"]));
 	}
 });
-export { O as default };
+export { j as default };
 
 //# sourceMappingURL=AssetFileInfoPanel.vue_vue_type_script_setup_true_lang.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"AssetFileInfoPanel.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_component_VExpansionPanel","_unref","_withCtx","_createVNode","_component_VExpansionPanelText","_component_VRow","_component_VCol","_createTextVNode","_toDisplayString","ACopyText","_createElementBlock","_Fragment","_createElementVNode","ACachedUserChip","_createCommentVNode","AssetMetadataImageAttributes","ACachedUserChip_default","ACopyText_default","AssetMetadataImageAttributes_default","AssetFileInfoPanel_vue_vue_type_script_setup_true_lang_default","props","__props","useI18n","isTypeImage","computed","DamAssetTypeDefault","DamAssetType","useDamCachedUsers","useDamConfigName","openBlock","createBlock","VExpansionPanel","unref","t","withCtx","createVNode","VExpansionPanelText","VRow","VCol","createTextVNode","toDisplayString","dateTimePretty","createElementBlock","Fragment","_cache","createElementVNode","getCachedUser","createCommentVNode","prettyBytes","assetFileIsImageFile"],"sources":["../../../../../src/domains/dam/assetDetail/components/AssetFileInfoPanel.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport { type AssetDetailItemDto, DamAssetType, DamAssetTypeDefault } from '@/domains/dam/types/Asset'\nimport { assetFileIsImageFile } from '@/domains/dam/types/AssetFile'\nimport ACopyText from '@/domains/ui/components/ACopyText.vue'\nimport { prettyBytes } from '@/shared/utils/file'\nimport AssetMetadataImageAttributes from '@/domains/dam/assetDetail/components/AssetMetadataImageAttributes.vue'\nimport { dateTimePretty } from '@/shared/utils/datetime'\nimport ACachedUserChip from '@/domains/cached/components/ACachedUserChip.vue'\nimport { useDamCachedUsers } from '@/domains/dam/author/composables/cachedUsers'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\n// \"File\" metadata panel of the asset detail and the single-upload dialog.\n// It sets no overflow-wrap itself. The detail passes `style=\"overflow-wrap: normal\"`, which falls through to the root.\n\nconst props = defineProps<{\n  asset: AssetDetailItemDto\n  /** Shows creator and last modifier chips. */\n  showUsers: boolean\n}>()\n\nconst { t } = useI18n()\n\nconst isTypeImage = computed(() => (props.asset.attributes.assetType || DamAssetTypeDefault) === DamAssetType.Image)\n\nconst { getCachedUser } = useDamCachedUsers(useDamConfigName())\n</script>\n\n<template>\n  <VExpansionPanel\n    elevation=\"0\"\n    :title=\"t('common.damImage.asset.detail.info.file')\"\n    value=\"file\"\n  >\n    <VExpansionPanelText class=\"text-body-small\">\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.damImage.asset.detail.info.field.id') }}\n        </VCol>\n        <VCol cols=\"9\">\n          <ACopyText :value=\"asset.id\" />\n        </VCol>\n      </VRow>\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.damImage.asset.detail.info.field.type') }}\n        </VCol>\n        <VCol cols=\"9\">\n          {{ asset.attributes.assetType }}\n        </VCol>\n      </VRow>\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.model.tracking.created') }}\n        </VCol>\n        <VCol cols=\"9\">\n          {{ dateTimePretty(asset.createdAt) }}\n          <template v-if=\"showUsers\">\n            <br />\n            <ACachedUserChip\n              :id=\"asset.createdBy\"\n              :get-cached-fn=\"getCachedUser\"\n            />\n          </template>\n        </VCol>\n      </VRow>\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.model.tracking.modified') }}\n        </VCol>\n        <VCol cols=\"9\">\n          {{ dateTimePretty(asset.modifiedAt) }}\n          <template v-if=\"showUsers\">\n            <br />\n            <ACachedUserChip\n              :id=\"asset.modifiedBy\"\n              :get-cached-fn=\"getCachedUser\"\n            />\n          </template>\n        </VCol>\n      </VRow>\n      <template v-if=\"asset.mainFile\">\n        <VRow>\n          <VCol cols=\"3\">\n            {{ t('common.damImage.asset.detail.info.field.mainFileId') }}\n          </VCol>\n          <VCol cols=\"9\">\n            <ACopyText :value=\"asset.mainFile.id\" />\n          </VCol>\n        </VRow>\n        <VRow>\n          <VCol cols=\"3\">\n            {{ t('common.damImage.asset.detail.info.field.mimeType') }}\n          </VCol>\n          <VCol cols=\"9\">\n            {{ asset.mainFile.fileAttributes.mimeType }}\n          </VCol>\n        </VRow>\n        <VRow>\n          <VCol cols=\"3\">\n            {{ t('common.damImage.asset.detail.info.field.size') }}\n          </VCol>\n          <VCol cols=\"9\">\n            {{ prettyBytes(asset.mainFile.fileAttributes.size) }}\n          </VCol>\n        </VRow>\n        <AssetMetadataImageAttributes\n          v-if=\"isTypeImage && assetFileIsImageFile(asset.mainFile)\"\n          :file=\"asset.mainFile\"\n        />\n      </template>\n    </VExpansionPanelText>\n  </VExpansionPanel>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"AssetFileInfoPanel.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_component_VExpansionPanel","_unref","_withCtx","_createVNode","_component_VExpansionPanelText","_component_VRow","_component_VCol","_createTextVNode","_toDisplayString","ACopyText","ACachedChip","_createCommentVNode","_createElementBlock","_Fragment","_createElementVNode","ACachedUserChip","AssetMetadataImageAttributes","ACachedChip_default","ACachedUserChip_default","ACopyText_default","AssetMetadataImageAttributes_default","AssetFileInfoPanel_vue_vue_type_script_setup_true_lang_default","props","__props","useI18n","isTypeImage","computed","DamAssetTypeDefault","DamAssetType","damConfigName","useDamConfigName","useDamCachedUsers","useDamCachedAssetLicences","watch","showLicence","licence","addToCachedAssetLicences","fetchCachedAssetLicences","openBlock","createBlock","VExpansionPanel","unref","t","withCtx","createVNode","VExpansionPanelText","VRow","VCol","createTextVNode","toDisplayString","getCachedAssetLicence","createCommentVNode","dateTimePretty","createElementBlock","Fragment","_cache","createElementVNode","getCachedUser","prettyBytes","assetFileIsImageFile"],"sources":["../../../../../src/domains/dam/assetDetail/components/AssetFileInfoPanel.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, watch } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport { type AssetDetailItemDto, DamAssetType, DamAssetTypeDefault } from '@/domains/dam/types/Asset'\nimport { assetFileIsImageFile } from '@/domains/dam/types/AssetFile'\nimport ACopyText from '@/domains/ui/components/ACopyText.vue'\nimport { prettyBytes } from '@/shared/utils/file'\nimport AssetMetadataImageAttributes from '@/domains/dam/assetDetail/components/AssetMetadataImageAttributes.vue'\nimport { dateTimePretty } from '@/shared/utils/datetime'\nimport ACachedUserChip from '@/domains/cached/components/ACachedUserChip.vue'\nimport { useDamCachedUsers } from '@/domains/dam/author/composables/cachedUsers'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\nimport ACachedChip from '@/domains/cached/components/ACachedChip.vue'\nimport { useDamCachedAssetLicences } from '@/domains/dam/user/composables/cachedAssetLicences'\n\n// \"File\" metadata panel of the asset detail and the single-upload dialog.\n// It sets no overflow-wrap itself. The detail passes `style=\"overflow-wrap: normal\"`, which falls through to the root.\n\nconst props = withDefaults(\n  defineProps<{\n    asset: AssetDetailItemDto\n    /** Shows creator and last modifier chips. */\n    showUsers: boolean\n    /** Shows the asset's licence. */\n    showLicence?: boolean\n  }>(),\n  {\n    showLicence: false,\n  }\n)\n\nconst { t } = useI18n()\n\nconst isTypeImage = computed(() => (props.asset.attributes.assetType || DamAssetTypeDefault) === DamAssetType.Image)\n\nconst damConfigName = useDamConfigName()\nconst { getCachedUser } = useDamCachedUsers(damConfigName)\n\nconst { addToCachedAssetLicences, fetchCachedAssetLicences, getCachedAssetLicence } =\n  useDamCachedAssetLicences(damConfigName)\nwatch(\n  [() => props.showLicence, () => props.asset.licence],\n  ([showLicence, licence]) => {\n    if (!showLicence) return\n    addToCachedAssetLicences(licence)\n    fetchCachedAssetLicences()\n  },\n  { immediate: true }\n)\n</script>\n\n<template>\n  <VExpansionPanel\n    elevation=\"0\"\n    :title=\"t('common.damImage.asset.detail.info.file')\"\n    value=\"file\"\n  >\n    <VExpansionPanelText class=\"text-body-small\">\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.damImage.asset.detail.info.field.id') }}\n        </VCol>\n        <VCol cols=\"9\">\n          <ACopyText :value=\"asset.id\" />\n        </VCol>\n      </VRow>\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.damImage.asset.detail.info.field.type') }}\n        </VCol>\n        <VCol cols=\"9\">\n          {{ asset.attributes.assetType }}\n        </VCol>\n      </VRow>\n      <VRow\n        v-if=\"showLicence\"\n        data-cy=\"asset-licence\"\n      >\n        <VCol cols=\"3\">\n          {{ t('common.damImage.asset.detail.info.field.licence') }}\n        </VCol>\n        <VCol cols=\"9\">\n          <ACachedChip\n            :id=\"asset.licence\"\n            :get-cached-fn=\"getCachedAssetLicence\"\n            display-text-path=\"name\"\n            route=\"\"\n            disable-click\n          />\n        </VCol>\n      </VRow>\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.model.tracking.created') }}\n        </VCol>\n        <VCol cols=\"9\">\n          {{ dateTimePretty(asset.createdAt) }}\n          <template v-if=\"showUsers\">\n            <br />\n            <ACachedUserChip\n              :id=\"asset.createdBy\"\n              :get-cached-fn=\"getCachedUser\"\n            />\n          </template>\n        </VCol>\n      </VRow>\n      <VRow>\n        <VCol cols=\"3\">\n          {{ t('common.model.tracking.modified') }}\n        </VCol>\n        <VCol cols=\"9\">\n          {{ dateTimePretty(asset.modifiedAt) }}\n          <template v-if=\"showUsers\">\n            <br />\n            <ACachedUserChip\n              :id=\"asset.modifiedBy\"\n              :get-cached-fn=\"getCachedUser\"\n            />\n          </template>\n        </VCol>\n      </VRow>\n      <template v-if=\"asset.mainFile\">\n        <VRow>\n          <VCol cols=\"3\">\n            {{ t('common.damImage.asset.detail.info.field.mainFileId') }}\n          </VCol>\n          <VCol cols=\"9\">\n            <ACopyText :value=\"asset.mainFile.id\" />\n          </VCol>\n        </VRow>\n        <VRow>\n          <VCol cols=\"3\">\n            {{ t('common.damImage.asset.detail.info.field.mimeType') }}\n          </VCol>\n          <VCol cols=\"9\">\n            {{ asset.mainFile.fileAttributes.mimeType }}\n          </VCol>\n        </VRow>\n        <VRow>\n          <VCol cols=\"3\">\n            {{ t('common.damImage.asset.detail.info.field.size') }}\n          </VCol>\n          <VCol cols=\"9\">\n            {{ prettyBytes(asset.mainFile.fileAttributes.size) }}\n          </VCol>\n        </VRow>\n        <AssetMetadataImageAttributes\n          v-if=\"isTypeImage && assetFileIsImageFile(asset.mainFile)\"\n          :file=\"asset.mainFile\"\n        />\n      </template>\n    </VExpansionPanelText>\n  </VExpansionPanel>\n</template>\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"AssetImage.js","names":["_sfc_main","AssetImage_vue_vue_type_script_setup_true_lang_default","AssetImage_default"],"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 { 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  }>(),\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  }\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      />\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    />\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    />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"AssetImage.js","names":["_sfc_main","AssetImage_vue_vue_type_script_setup_true_lang_default","AssetImage_default"],"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":""}

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

@@ -1,4 +1,5 @@
 import { AssetFileProperties, DamAssetStatusType, DamAssetTypeType } from '../../types/Asset';
+import { DatetimeUTCNullable } from '../../../../shared/types/common';
 type __VLS_Props = {
     src?: string;
     assetType?: DamAssetTypeType;
@@ -25,6 +26,10 @@ type __VLS_Props = {
     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;
@@ -36,11 +41,13 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
     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;

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

@@ -1,8 +1,8 @@
 import { isUndefined as e } from "../../../../shared/utils/common.js";
 import { DamAssetStatus as t, DamAssetType as n } from "../../types/Asset.js";
 import r from "../../../../assets/image/placeholder16x9.js";
-import i from "./AssetImageMetaIcons.js";
-import { useRemainingTime as a } from "../../../ui/datetime/composables/remainingTime.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";
@@ -102,7 +102,9 @@ var C = {
 		showTts: {
 			type: Boolean,
 			default: !1
-		}
+		},
+		autoDeleteAt: { default: null },
+		licenceBadge: { default: "" }
 	},
 	emits: ["load", "error"],
 	setup(p, { emit: z }) {
@@ -123,7 +125,7 @@ var C = {
 			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(() => e(B.src) ? r : B.src), X = o(() => !(B.hideIcon || B.assetType === n.Image && B.src)), { remainingTimeShort: Z } = a();
+		}), q = o(() => [t.Deleting, t.Draft].includes(B.assetStatus) ? "#ccc" : B.backgroundColor), J = o(() => B.assetStatus === t.WithFile ? "#505050" : "#8f8f8f"), Y = o(() => e(B.src) ? r : 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,
@@ -203,15 +205,19 @@ var C = {
 					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(i, {
+				p.showMetaIcons && p.assetFileProperties ? (h(), s(a, {
 					key: 2,
 					"asset-file-properties": p.assetFileProperties,
 					"asset-type": p.assetType,
-					"show-tts": p.showTts
+					"show-tts": p.showTts,
+					"auto-delete-at": p.autoDeleteAt,
+					"licence-badge": p.licenceBadge
 				}, null, 8, [
 					"asset-file-properties",
 					"asset-type",
-					"show-tts"
+					"show-tts",
+					"auto-delete-at",
+					"licence-badge"
 				])) : c("", !0)
 			]),
 			_: 1
@@ -244,15 +250,19 @@ var C = {
 				"icon",
 				"color"
 			])) : c("", !0)], 4)])) : c("", !0),
-			p.showMetaIcons && p.assetFileProperties ? (h(), s(i, {
+			p.showMetaIcons && p.assetFileProperties ? (h(), s(a, {
 				key: 1,
 				"asset-file-properties": p.assetFileProperties,
 				"asset-type": p.assetType,
-				"show-tts": p.showTts
+				"show-tts": p.showTts,
+				"auto-delete-at": p.autoDeleteAt,
+				"licence-badge": p.licenceBadge
 			}, null, 8, [
 				"asset-file-properties",
 				"asset-type",
-				"show-tts"
+				"show-tts",
+				"auto-delete-at",
+				"licence-badge"
 			])) : c("", !0)
 		])) : (h(), l("div", {
 			key: 3,
@@ -282,15 +292,19 @@ var C = {
 				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(i, {
+			p.showMetaIcons && p.assetFileProperties ? (h(), s(a, {
 				key: 2,
 				"asset-file-properties": p.assetFileProperties,
 				"asset-type": p.assetType,
-				"show-tts": p.showTts
+				"show-tts": p.showTts,
+				"auto-delete-at": p.autoDeleteAt,
+				"licence-badge": p.licenceBadge
 			}, null, 8, [
 				"asset-file-properties",
 				"asset-type",
-				"show-tts"
+				"show-tts",
+				"auto-delete-at",
+				"licence-badge"
 			])) : c("", !0)
 		], 4));
 	}

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

@@ -1 +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 { 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  }>(),\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  }\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      />\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    />\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    />\n  </div>\n</template>\n"],"mappings":"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"}
+{"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.map

@@ -1 +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'\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  }>(),\n  {\n    disableAbsolute: false,\n    showTts: false,\n    configName: undefined,\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigStore = useDamConfigStoreOf(useDamConfigName(props.configName))\n\nconst { t } = useI18n()\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\"\n    class=\"asset-image__meta-icons\"\n    :class=\"{ 'asset-image__meta-icons-absolute': !disableAbsolute }\"\n  >\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</style>\n"],"mappings":""}
+{"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

@@ -1,4 +1,5 @@
 import { AssetFileProperties, DamAssetTypeType } from '../../types/Asset';
+import { DatetimeUTCNullable } from '../../../../shared/types/common';
 type __VLS_Props = {
     assetType: DamAssetTypeType;
     assetFileProperties: AssetFileProperties;
@@ -7,11 +8,17 @@ type __VLS_Props = {
     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;