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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"AImageWidgetMultiple.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","ImageWidgetMultipleInner","_mergeProps","_createElementBlock","AImageWidgetMultipleSimple","_unref","_createCommentVNode","_createElementVNode","_toDisplayString","_component_VProgressCircular","ImageWidgetMultipleInner_default","AImageWidgetMultipleSimple_default","_hoisted_1","_hoisted_2","AImageWidgetMultiple_vue_vue_type_script_setup_true_lang_default","__expose","__emit","props","__props","emit","damConfigName","useDamConfigName","status","ref","uploadAllowed","useCommonAdminCoreDamOptions","useDamConfigState","damClient","uploadConfig","shallowRef","useExtSystemIdForCached","damConfigStore","useDamConfigStoreOf","getOrLoadDamConfigExtSystemByLicence","isUndefined","isImageWidgetUploadConfigAllowed","loadDamPrvConfig","promises","getOrLoadDamConfigExtSystemByLicences","getDamConfigAssetCustomFormElements","extSystem","DamAssetType","loadDamConfigAssetCustomFormElements","innerComponent","provide","ImageWidgetUploadConfigKey","useI18n","openBlock","createBlock","mergeProps","_cache","$event","createElementBlock","unref","createCommentVNode","createElementVNode","toDisplayString","t","VProgressCircular"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImageWidgetMultiple.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useCommonAdminCoreDamOptions } from '@/domains/dam/composables/commonAdminCoreDamOptions'\nimport { isImageWidgetUploadConfigAllowed } from '@/domains/dam/config/utils/damFilterUserAllowedUploadConfigs'\nimport { ImageWidgetUploadConfigKey } from '@/domains/dam/imageWidget/utils/imageWidgetInkectionKeys'\nimport ImageWidgetMultipleInner from '@/domains/dam/imageWidget/components/ImageWidgetMultipleInner.vue'\nimport AImageWidgetMultipleSimple from '@/domains/dam/imageWidget/components/AImageWidgetMultipleSimple.vue'\nimport { useDamConfigState } from '@/domains/dam/config/composables/damConfigState'\nimport { useDamConfigStoreOf } from '@/domains/dam/config/store/damConfigStore'\nimport type { IntegerId } from '@/shared/types/common'\nimport type { DamConfigLicenceExtSystemReturnType } from '@/domains/dam/types/DamConfig'\nimport type { UploadQueueKey } from '@/domains/dam/types/UploadQueue'\nimport { isUndefined } from '@/shared/utils/common'\nimport { onMounted, provide, ref, shallowRef } from 'vue'\nimport { useExtSystemIdForCached } from '@/domains/dam/composables/extSystemIdForCached'\nimport { DamAssetType } from '@/domains/dam/types/Asset'\nimport { useI18n } from 'vue-i18n'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: IntegerId[] // initial ids, updated only when save is called\n    queueKey: UploadQueueKey\n    uploadLicence: IntegerId\n    selectLicences: IntegerId[]\n    configName?: string\n    label?: string | undefined\n    readonly?: boolean\n    dataCy?: string | undefined\n    width?: number | undefined\n    callDeleteApiOnRemove?: boolean\n  }>(),\n  {\n    configName: undefined,\n    label: undefined,\n    image: undefined,\n    readonly: false,\n    lockable: false,\n    lockedById: undefined,\n    dataCy: undefined,\n    expandOptions: false,\n    width: undefined,\n    callDeleteApiOnRemove: false,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', data: IntegerId[]): void\n}>()\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\nconst status = ref<'loading' | 'ready' | 'error'>('loading')\n// Not being allowed to upload is no reason to hide the image that is already there: it is shown read-only.\nconst uploadAllowed = ref(true)\n\nconst { damClient } = useCommonAdminCoreDamOptions(damConfigName)\nconst {\n  loadDamPrvConfig,\n  loadDamConfigAssetCustomFormElements,\n  getDamConfigAssetCustomFormElements,\n  getOrLoadDamConfigExtSystemByLicence,\n  getOrLoadDamConfigExtSystemByLicences,\n} = useDamConfigState(damClient, damConfigName)\n\nconst uploadConfig = shallowRef<DamConfigLicenceExtSystemReturnType | undefined>(undefined)\n\nconst { cachedExtSystemId } = useExtSystemIdForCached(damConfigName)\n\nonMounted(async () => {\n  const damConfigStore = useDamConfigStoreOf(damConfigName)\n  uploadConfig.value = await getOrLoadDamConfigExtSystemByLicence(props.uploadLicence)\n  if (isUndefined(uploadConfig.value)) {\n    status.value = 'error'\n    return\n  }\n  cachedExtSystemId.value = uploadConfig.value.extSystem\n  if (!isImageWidgetUploadConfigAllowed(uploadConfig.value, damConfigName)) {\n    uploadAllowed.value = false\n    try {\n      if (!damConfigStore.initialized.damPrvConfig) await loadDamPrvConfig()\n      status.value = 'ready'\n    } catch (e) {\n      status.value = 'error'\n    }\n    return\n  }\n  const promises: Promise<any>[] = []\n  if (!damConfigStore.initialized.damPrvConfig) {\n    promises.push(loadDamPrvConfig())\n  }\n  promises.push(getOrLoadDamConfigExtSystemByLicences(props.selectLicences))\n  const { extSystem } = uploadConfig.value\n  // The custom fields of its images: every type of the ext system where it has none yet, else the image type alone\n  // where its read failed before. The types loaded are not read again.\n  if (isUndefined(getDamConfigAssetCustomFormElements(extSystem, DamAssetType.Image))) {\n    promises.push(\n      loadDamConfigAssetCustomFormElements(\n        extSystem,\n        getDamConfigAssetCustomFormElements(extSystem) ? [DamAssetType.Image] : undefined\n      )\n    )\n  }\n  try {\n    await Promise.all(promises)\n  } catch (e) {\n    status.value = 'error'\n  }\n  // The image type whose read failed beside types that answered is not loaded: its form would have no field.\n  if (isUndefined(getDamConfigAssetCustomFormElements(extSystem, DamAssetType.Image))) status.value = 'error'\n  if (status.value !== 'error') status.value = 'ready'\n})\n\nconst innerComponent = ref<InstanceType<typeof ImageWidgetMultipleInner> | null>(null)\n\nconst saveImages = async () => {\n  if (!innerComponent.value) return false\n  return (await innerComponent.value.saveImages()) as boolean\n}\n\nprovide(ImageWidgetUploadConfigKey, uploadConfig)\n\ndefineExpose({\n  saveImages,\n})\n\nconst { t } = useI18n()\n</script>\n\n<template>\n  <ImageWidgetMultipleInner\n    v-if=\"status === 'ready'\"\n    ref=\"innerComponent\"\n    v-bind=\"props\"\n    :readonly=\"readonly || !uploadAllowed\"\n    @update:model-value=\"emit('update:modelValue', $event)\"\n  />\n  <!-- The config fails also for a user without access to the licence: the image already there is still shown. -->\n  <div v-else-if=\"status === 'error'\">\n    <AImageWidgetMultipleSimple\n      v-if=\"modelValue.length\"\n      :model-value=\"modelValue\"\n      :config-name=\"damConfigName\"\n      :label=\"label\"\n      :width=\"width\"\n    />\n    <div class=\"text-error\">\n      {{ t('common.damImage.error.loadingConfig') }}\n    </div>\n  </div>\n  <VProgressCircular\n    v-else\n    :size=\"12\"\n    :width=\"2\"\n    indeterminate\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkBA,IAAMkB,IAAQC,GA2BRC,IAAOH,GAIPI,IAAgBC,EAAiBJ,EAAM,UAAU,GAEjDK,IAASC,EAAmC,SAAS,GAErDC,IAAgBD,EAAI,EAAI,GAExB,EAAE,iBAAcE,EAA6BL,CAAa,GAC1D,EACJ,qBACA,yCACA,wCACA,yCACA,6CACEM,EAAkBC,GAAWP,CAAa,GAExCQ,IAAeC,EAA4D,KAAA,CAAS,GAEpF,EAAE,yBAAsBC,EAAwBV,CAAa;EAEnE,EAAU,YAAY;GACpB,IAAMW,IAAiBC,EAAoBZ,CAAa;GAExD,IADA,EAAa,QAAQ,MAAMa,EAAqChB,EAAM,aAAa,GAC/EiB,EAAYN,EAAa,KAAK,GAAG;IACnC,EAAO,QAAQ;IACf;GACF;GAEA,IADA,EAAkB,QAAQA,EAAa,MAAM,WACzC,CAACO,EAAiCP,EAAa,OAAOR,CAAa,GAAG;IACxE,EAAc,QAAQ;IACtB,IAAI;KAEF,AADKW,EAAe,YAAY,gBAAc,MAAMK,EAAiB,GACrE,EAAO,QAAQ;IACjB,QAAY;KACV,EAAO,QAAQ;IACjB;IACA;GACF;GACA,IAAMC,IAA2B,CAAC;GAIlC,AAHKN,EAAe,YAAY,gBAC9BM,EAAS,KAAKD,EAAiB,CAAC,GAElCC,EAAS,KAAKC,EAAsCrB,EAAM,cAAc,CAAC;GACzE,IAAM,EAAE,iBAAcW,EAAa;GAGnC,AAAIM,EAAYK,EAAoCC,GAAWC,EAAa,KAAK,CAAC,KAChFJ,EAAS,KACPK,EACEF,GACAD,EAAoCC,CAAS,IAAI,CAACC,EAAa,KAAK,IAAI,KAAA,CAC1E,CACF;GAEF,IAAI;IACF,MAAM,QAAQ,IAAIJ,CAAQ;GAC5B,QAAY;IACV,EAAO,QAAQ;GACjB;GAGA,AADIH,EAAYK,EAAoCC,GAAWC,EAAa,KAAK,CAAC,MAAG,EAAO,QAAQ,UAChGnB,EAAO,UAAU,YAAS,EAAO,QAAQ;EAC/C,CAAC;EAED,IAAMqB,IAAiBpB,EAA0D,IAAI;EASrF,AAFAqB,EAAQC,GAA4BjB,CAAY,GAEhDb,EAAa,EACX,wBAPK4B,EAAe,QACZ,MAAMA,EAAe,MAAM,WAAW,IADZ,GAQpC,CAAC;EAED,IAAM,EAAE,SAAMG,EAAQ;E,iBAKZxB,EAAA,UAAM,WADdvB,EAAA,GAAAC,EAMEC,GANFC,EAME;;GAJI,SAAA;GAAJ,KAAIyC;EACI,GAAA1B,GAAK;GACZ,UAAUC,EAAA,YAAQ,CAAKM,EAAA;GACvB,uBAAkB,AAAA0B,EAAA,QAAA,MAAE/B,EAAI,qBAAsBgC,CAAM;E,+BAGvC7B,EAAA,UAAM,WAAtBvB,EAAA,GAAAI,EAWM,OAAAS,GAAA,CATIM,EAAA,WAAW,UADnBnB,EAAA,GAAAC,EAMEI,GAAA;;GAJC,eAAac,EAAA;GACb,eAAab,EAAAe,CAAA;GACb,OAAOF,EAAA;GACP,OAAOA,EAAA;;;;;;E,iBAEVX,EAEM,OAFNM,GAEML,EADDH,EAAAoD,CAAA,CAAC,CAAA,qCAAA,CAAA,GAAA,CAAA,C,OAGR1D,EAAA,GAAAC,EAKES,GAAA;;GAHC,MAAM;GACN,OAAO;GACR,eAAA"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"AImageWidgetMultipleSimple.js","names":["_sfc_main","AImageWidgetMultipleSimple_vue_vue_type_script_setup_true_lang_default","AImageWidgetMultipleSimple_default"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImageWidgetMultipleSimple.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { IntegerId } from '@/shared/types/common'\nimport type { ImageAware } from '@/domains/dam/types/ImageAware'\nimport AImageWidgetSimple from '@/domains/dam/imageWidget/components/AImageWidgetSimple.vue'\nimport { ref, toRefs, watch } from 'vue'\nimport { cloneDeep } from '@/shared/utils/common'\nimport { useAlerts } from '@/domains/system/composables/alerts'\nimport { useCommonAdminImageOptions } from '@/domains/dam/imageWidget/composables/commonAdminImageOptions'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: IntegerId[]\n    images?: ImageAware[]\n    configName?: string\n    label?: string | undefined\n    width?: number | undefined\n    disableAspectRatio?: boolean\n    aspectRatio?: number | string\n    showDescription?: boolean\n    showSource?: boolean\n  }>(),\n  {\n    images: () => [],\n    configName: undefined,\n    label: undefined,\n    image: undefined,\n    width: undefined,\n    disableAspectRatio: false,\n    aspectRatio: 1.777, // 16/9\n    showDescription: false,\n    showSource: false,\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\nconst { images, modelValue } = toRefs(props)\n\nconst resImages = ref<ImageAware[]>([])\n\nconst { showErrorsDefault } = useAlerts()\n\nconst imageOptions = useCommonAdminImageOptions(damConfigName)\nconst { imageClient, imageApi } = imageOptions\n\nwatch(\n  [images, modelValue],\n  async ([newImages, newImageIds]) => {\n    resImages.value = []\n    if (newImages && newImages.length > 0) {\n      resImages.value = cloneDeep(newImages).sort((a, b) => (a.position ?? 0) - (b.position ?? 0))\n      return\n    }\n    if (newImageIds && newImageIds.length > 0) {\n      try {\n        resImages.value = (await imageApi.fetchImageListByIds(imageClient, newImageIds)).sort(\n          (a, b) => (a.position ?? 0) - (b.position ?? 0)\n        )\n      } catch (error) {\n        showErrorsDefault(error)\n      }\n    }\n  },\n  { immediate: true }\n)\n</script>\n\n<template>\n  <div class=\"asset-list-tiles asset-list-tiles--thumbnail\">\n    <div\n      v-for=\"image in resImages\"\n      :key=\"image.id\"\n      class=\"asset-list-tiles__item\"\n    >\n      <div class=\"asset-list-tiles__item-card\">\n        <div class=\"ma-2\">\n          <AImageWidgetSimple\n            :model-value=\"image.id\"\n            :image=\"image\"\n            :config-name=\"damConfigName\"\n            :width=\"width\"\n            :disable-aspect-ratio=\"disableAspectRatio\"\n            :aspect-ratio=\"aspectRatio\"\n            :show-description=\"showDescription\"\n            :show-source=\"showSource\"\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,25 @@
+import { IntegerId } from '../../../../shared/types/common';
+import { ImageAware } from '../../types/ImageAware';
+type __VLS_Props = {
+    modelValue: IntegerId[];
+    images?: ImageAware[];
+    configName?: string;
+    label?: string | undefined;
+    width?: number | undefined;
+    disableAspectRatio?: boolean;
+    aspectRatio?: number | string;
+    showDescription?: boolean;
+    showSource?: boolean;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    label: string;
+    showSource: boolean;
+    width: number;
+    configName: string;
+    aspectRatio: string | number;
+    images: ImageAware[];
+    disableAspectRatio: boolean;
+    showDescription: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

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

@@ -0,0 +1,66 @@
+import { cloneDeep as e } from "../../../../shared/utils/common.js";
+import { useAlerts as t } from "../../../system/composables/alerts.js";
+import { useDamConfigName as n } from "../../composables/damConfigName.js";
+import { useCommonAdminImageOptions as r } from "../composables/commonAdminImageOptions.js";
+import i from "./AImageWidgetSimple.js";
+import { Fragment as a, createElementBlock as o, createElementVNode as s, createVNode as c, defineComponent as l, openBlock as u, ref as d, renderList as f, toRefs as p, unref as m, watch as h } from "vue";
+//#region src/domains/dam/imageWidget/components/AImageWidgetMultipleSimple.vue?vue&type=script&setup=true&lang.ts
+var g = { class: "asset-list-tiles asset-list-tiles--thumbnail" }, _ = { class: "asset-list-tiles__item-card" }, v = { class: "ma-2" }, y = /*@__PURE__*/ l({
+	__name: "AImageWidgetMultipleSimple",
+	props: {
+		modelValue: {},
+		images: { default: () => [] },
+		configName: { default: void 0 },
+		label: { default: void 0 },
+		width: { default: void 0 },
+		disableAspectRatio: {
+			type: Boolean,
+			default: !1
+		},
+		aspectRatio: { default: 1.777 },
+		showDescription: {
+			type: Boolean,
+			default: !1
+		},
+		showSource: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	setup(l) {
+		let y = l, b = n(y.configName), { images: x, modelValue: S } = p(y), C = d([]), { showErrorsDefault: w } = t(), { imageClient: T, imageApi: E } = r(b);
+		return h([x, S], async ([t, n]) => {
+			if (C.value = [], t && t.length > 0) C.value = e(t).sort((e, t) => (e.position ?? 0) - (t.position ?? 0));
+			else if (n && n.length > 0) try {
+				C.value = (await E.fetchImageListByIds(T, n)).sort((e, t) => (e.position ?? 0) - (t.position ?? 0));
+			} catch (e) {
+				w(e);
+			}
+		}, { immediate: !0 }), (e, t) => (u(), o("div", g, [(u(!0), o(a, null, f(C.value, (e) => (u(), o("div", {
+			key: e.id,
+			class: "asset-list-tiles__item"
+		}, [s("div", _, [s("div", v, [c(i, {
+			"model-value": e.id,
+			image: e,
+			"config-name": m(b),
+			width: l.width,
+			"disable-aspect-ratio": l.disableAspectRatio,
+			"aspect-ratio": l.aspectRatio,
+			"show-description": l.showDescription,
+			"show-source": l.showSource
+		}, null, 8, [
+			"model-value",
+			"image",
+			"config-name",
+			"width",
+			"disable-aspect-ratio",
+			"aspect-ratio",
+			"show-description",
+			"show-source"
+		])])])]))), 128))]));
+	}
+});
+//#endregion
+export { y as default };
+
+//# sourceMappingURL=AImageWidgetMultipleSimple.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AImageWidgetMultipleSimple.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_Fragment","_renderList","_createElementVNode","_createVNode","AImageWidgetSimple","_unref","AImageWidgetSimple_default","_hoisted_1","_hoisted_2","_hoisted_3","AImageWidgetMultipleSimple_vue_vue_type_script_setup_true_lang_default","props","__props","damConfigName","useDamConfigName","toRefs","resImages","ref","useAlerts","useCommonAdminImageOptions","watch","images","modelValue","newImages","newImageIds","cloneDeep","a","b","imageApi","imageClient","error","openBlock","createElementBlock","Fragment","renderList","image","createElementVNode","createVNode","unref"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImageWidgetMultipleSimple.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { IntegerId } from '@/shared/types/common'\nimport type { ImageAware } from '@/domains/dam/types/ImageAware'\nimport AImageWidgetSimple from '@/domains/dam/imageWidget/components/AImageWidgetSimple.vue'\nimport { ref, toRefs, watch } from 'vue'\nimport { cloneDeep } from '@/shared/utils/common'\nimport { useAlerts } from '@/domains/system/composables/alerts'\nimport { useCommonAdminImageOptions } from '@/domains/dam/imageWidget/composables/commonAdminImageOptions'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: IntegerId[]\n    images?: ImageAware[]\n    configName?: string\n    label?: string | undefined\n    width?: number | undefined\n    disableAspectRatio?: boolean\n    aspectRatio?: number | string\n    showDescription?: boolean\n    showSource?: boolean\n  }>(),\n  {\n    images: () => [],\n    configName: undefined,\n    label: undefined,\n    image: undefined,\n    width: undefined,\n    disableAspectRatio: false,\n    aspectRatio: 1.777, // 16/9\n    showDescription: false,\n    showSource: false,\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\nconst { images, modelValue } = toRefs(props)\n\nconst resImages = ref<ImageAware[]>([])\n\nconst { showErrorsDefault } = useAlerts()\n\nconst imageOptions = useCommonAdminImageOptions(damConfigName)\nconst { imageClient, imageApi } = imageOptions\n\nwatch(\n  [images, modelValue],\n  async ([newImages, newImageIds]) => {\n    resImages.value = []\n    if (newImages && newImages.length > 0) {\n      resImages.value = cloneDeep(newImages).sort((a, b) => (a.position ?? 0) - (b.position ?? 0))\n      return\n    }\n    if (newImageIds && newImageIds.length > 0) {\n      try {\n        resImages.value = (await imageApi.fetchImageListByIds(imageClient, newImageIds)).sort(\n          (a, b) => (a.position ?? 0) - (b.position ?? 0)\n        )\n      } catch (error) {\n        showErrorsDefault(error)\n      }\n    }\n  },\n  { immediate: true }\n)\n</script>\n\n<template>\n  <div class=\"asset-list-tiles asset-list-tiles--thumbnail\">\n    <div\n      v-for=\"image in resImages\"\n      :key=\"image.id\"\n      class=\"asset-list-tiles__item\"\n    >\n      <div class=\"asset-list-tiles__item-card\">\n        <div class=\"ma-2\">\n          <AImageWidgetSimple\n            :model-value=\"image.id\"\n            :image=\"image\"\n            :config-name=\"damConfigName\"\n            :width=\"width\"\n            :disable-aspect-ratio=\"disableAspectRatio\"\n            :aspect-ratio=\"aspectRatio\"\n            :show-description=\"showDescription\"\n            :show-source=\"showSource\"\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,IAAMa,IAAQC,GAyBRC,IAAgBC,EAAiBH,EAAM,UAAU,GAEjD,EAAE,WAAQ,kBAAeI,EAAOJ,CAAK,GAErCK,IAAYC,EAAkB,CAAC,CAAC,GAEhC,EAAE,yBAAsBC,EAAU,GAGlC,EAAE,gBAAa,gBADAC,EAA2BN,CACd;E,OAElCO,EACE,CAACC,GAAQC,CAAU,GACnB,OAAO,CAACC,GAAWC,OAAiB;GAElC,IADA,EAAU,QAAQ,CAAC,GACfD,KAAaA,EAAU,SAAS,GAClC,EAAU,QAAQE,EAAUF,CAAS,CAAC,CAAC,MAAM,GAAG,OAAOG,EAAE,YAAY,MAAMC,EAAE,YAAY,EAAE;QAG7F,IAAIH,KAAeA,EAAY,SAAS,GACtC,IAAI;IACF,EAAU,SAAS,MAAMI,EAAS,oBAAoBC,GAAaL,CAAW,EAAA,CAAG,MAC9E,GAAG,OAAOE,EAAE,YAAY,MAAMC,EAAE,YAAY,EAC/C;GACF,SAASG,GAAO;IACd,EAAkBA,CAAK;GACzB;EAEJ,GACA,EAAE,WAAW,GAAK,CACpB,I,UAIEhC,EAAA,GAAAC,EAqBM,OArBNQ,GAqBM,EApBJT,EAAA,EAAA,GAAAC,EAmBMC,GAAA,MAAAC,EAlBYe,EAAA,QAAT,OADTlB,EAAA,GAAAC,EAmBM,OAAA;GAjBH,KAAKoC,EAAM;GACZ,OAAM;E,IAENjC,EAaM,OAbNM,GAaM,CAZJN,EAWM,OAXNO,GAWM,CAVJN,EASEC,GAAA;GARC,eAAa+B,EAAM;GACZ;GACP,eAAa9B,EAAAQ,CAAA;GACb,OAAOD,EAAA;GACP,wBAAsBA,EAAA;GACtB,gBAAcA,EAAA;GACd,oBAAkBA,EAAA;GAClB,eAAaA,EAAA"}

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

@@ -0,0 +1,9 @@
+import e from "../../../../_virtual/_plugin-vue_export-helper.js";
+import t from "./AImageWidgetSimple.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                   */
+//#region src/domains/dam/imageWidget/components/AImageWidgetSimple.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-f4b74ecf"]]);
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=AImageWidgetSimple.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AImageWidgetSimple.js","names":["_sfc_main","_plugin_vue_export_helper_default","AImageWidgetSimple_vue_vue_type_script_setup_true_lang_default","AImageWidgetSimple_default"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImageWidgetSimple.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ref, toRefs, watch } from 'vue'\nimport imagePlaceholderPath from '@/assets/image/placeholder16x9.svg'\nimport type { ImageAware, ImageCreateUpdateAware } from '@/domains/dam/types/ImageAware'\nimport { cloneDeep, isNumber } from '@/shared/utils/common'\nimport { useCommonAdminImageOptions } from '@/domains/dam/imageWidget/composables/commonAdminImageOptions'\nimport { useImageActions } from '@/domains/dam/imageWidget/composables/imageActions'\nimport type { IntegerIdNullable } from '@/shared/types/common'\nimport { useAlerts } from '@/domains/system/composables/alerts'\nimport { useI18n } from 'vue-i18n'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: IntegerIdNullable | undefined\n    image?: ImageAware | ImageCreateUpdateAware | undefined | null // optional, if available, no need to fetch image data\n    configName?: string\n    label?: string | undefined\n    width?: number | undefined\n    height?: undefined | number\n    disableAspectRatio?: boolean\n    aspectRatio?: number | string\n    showDescription?: boolean\n    showSource?: boolean\n    damWidth?: undefined | number\n    damHeight?: undefined | number\n    useHtmlImg?: boolean\n    widgetClass?: string | undefined\n    sourceLabel?: string | undefined\n  }>(),\n  {\n    configName: undefined,\n    label: undefined,\n    image: undefined,\n    width: undefined,\n    height: undefined,\n    disableAspectRatio: false,\n    aspectRatio: 1.777, // 16/9\n    showDescription: false,\n    showSource: false,\n    damWidth: undefined,\n    damHeight: undefined,\n    useHtmlImg: false,\n    widgetClass: undefined,\n    sourceLabel: undefined,\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\nconst { showErrorsDefault } = useAlerts()\n\nconst imageOptions = useCommonAdminImageOptions(damConfigName)\nconst { imageClient, imageApi } = imageOptions\nconst { widgetImageToDamImageUrl } = useImageActions(imageOptions)\n\nconst resImage = ref<null | ImageAware | ImageCreateUpdateAware>(null)\n\nconst { image, modelValue } = toRefs(props)\n\nconst resolvedSrc = ref('')\n\nconst { t } = useI18n()\n\nconst getImageUrl = (image: ImageAware | ImageCreateUpdateAware) => {\n  if (isNumber(props.damWidth) && isNumber(props.damHeight)) {\n    return widgetImageToDamImageUrl(image, props.damWidth, props.damHeight)\n  }\n  return widgetImageToDamImageUrl(image, imageOptions.imageWidth, imageOptions.imageHeight)\n}\n\nwatch(\n  [image, modelValue],\n  async ([newImage, newImageId]) => {\n    resImage.value = null\n    resolvedSrc.value = imagePlaceholderPath\n    if (newImage) {\n      resImage.value = cloneDeep(newImage)\n      if (resImage.value) {\n        resolvedSrc.value = getImageUrl(resImage.value)\n      }\n      return\n    }\n    if (newImageId) {\n      try {\n        resImage.value = await imageApi.fetchImage(imageClient, newImageId)\n      } catch (error) {\n        showErrorsDefault(error)\n      }\n      if (resImage.value) {\n        resolvedSrc.value = getImageUrl(resImage.value)\n      }\n    }\n  },\n  { immediate: true }\n)\n</script>\n\n<template>\n  <div\n    v-if=\"label\"\n    class=\"label-container\"\n  >\n    <h4 class=\"font-weight-bold text-label-large\">\n      {{ label }}\n    </h4>\n  </div>\n  <img\n    v-if=\"useHtmlImg\"\n    alt=\"\"\n    :src=\"resolvedSrc\"\n    :width=\"width\"\n    :height=\"height\"\n    :class=\"widgetClass\"\n  />\n  <VImg\n    v-else\n    :lazy-src=\"imagePlaceholderPath\"\n    :src=\"resolvedSrc\"\n    :width=\"width\"\n    :height=\"height\"\n    cover\n    loading=\"lazy\"\n    max-width=\"100%\"\n    class=\"disable-radius\"\n    :class=\"widgetClass\"\n    :aspect-ratio=\"disableAspectRatio ? undefined : aspectRatio\"\n  >\n    <template #error>\n      <div class=\"d-flex align-center justify-center h-100\">\n        <VIcon icon=\"mdi-alert-circle-outline\" />\n      </div>\n    </template>\n    <template #placeholder>\n      <div class=\"d-flex align-center justify-center h-100\">\n        <VProgressCircular\n          indeterminate\n          color=\"grey-lighten-4\"\n        />\n      </div>\n    </template>\n  </VImg>\n  <div\n    v-if=\"resImage && (showDescription || showSource)\"\n    class=\"pa-2\"\n  >\n    <VRow\n      v-if=\"showDescription\"\n      density=\"compact\"\n    >\n      <VCol>\n        <span class=\"text-body-small text-medium-emphasis\">\n          {{ t('common.damImage.image.model.texts.description') }}:\n        </span>\n        <br />{{ resImage.texts.description }}\n      </VCol>\n    </VRow>\n    <VRow\n      v-if=\"showSource\"\n      density=\"compact\"\n    >\n      <VCol>\n        <span class=\"text-body-small text-medium-emphasis\">{{ sourceLabel }}:</span>\n        <br />{{ resImage.texts.source }}\n      </VCol>\n    </VRow>\n  </div>\n  <slot\n    name=\"append\"\n    :image=\"resImage\"\n  />\n</template>\n\n<style lang=\"scss\" scoped>\n:deep(.v-img.disable-radius .v-img__img) {\n  border-radius: 0;\n}\n\n.label-container {\n  display: flex;\n  height: 32px;\n  align-items: center;\n}\n</style>\n"],"mappings":""}

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

@@ -0,0 +1,85 @@
+import { ImageAware, ImageCreateUpdateAware } from '../../types/ImageAware';
+import { IntegerIdNullable } from '../../../../shared/types/common';
+type __VLS_Props = {
+    modelValue: IntegerIdNullable | undefined;
+    image?: ImageAware | ImageCreateUpdateAware | undefined | null;
+    configName?: string;
+    label?: string | undefined;
+    width?: number | undefined;
+    height?: undefined | number;
+    disableAspectRatio?: boolean;
+    aspectRatio?: number | string;
+    showDescription?: boolean;
+    showSource?: boolean;
+    damWidth?: undefined | number;
+    damHeight?: undefined | number;
+    useHtmlImg?: boolean;
+    widgetClass?: string | undefined;
+    sourceLabel?: string | undefined;
+};
+declare var __VLS_43: {
+    image: {
+        id?: import('../../../../shared/types/common').IntegerId | undefined;
+        texts: {
+            description: string;
+            source: string;
+        };
+        flags: {
+            showSource: boolean;
+            internal: boolean;
+            overrideInternal: boolean;
+        };
+        position?: number | undefined;
+        dam: {
+            damId: import('../../../../shared/types/common').DocId;
+            licenceId: import('../../../../shared/types/common').IntegerId;
+            regionPosition: number;
+            internal: boolean;
+        };
+    } | {
+        id: import('../../../../shared/types/common').IntegerId;
+        texts: {
+            description: string;
+            source: string;
+        };
+        dam: {
+            damId: import('../../../../shared/types/common').DocId;
+            licenceId: import('../../../../shared/types/common').IntegerId;
+            regionPosition: number;
+            internal: boolean;
+        };
+        flags: {
+            showSource: boolean;
+            internal: boolean;
+            overrideInternal: boolean;
+        };
+        position?: number | undefined;
+    } | null;
+};
+type __VLS_Slots = {} & {
+    append?: (props: typeof __VLS_43) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    label: string;
+    image: ImageAware | ImageCreateUpdateAware | null;
+    showSource: boolean;
+    width: number;
+    height: number;
+    configName: string;
+    aspectRatio: string | number;
+    disableAspectRatio: boolean;
+    showDescription: boolean;
+    damWidth: number;
+    damHeight: number;
+    useHtmlImg: boolean;
+    widgetClass: string;
+    sourceLabel: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,136 @@
+import { cloneDeep as e, isNumber as t } from "../../../../shared/utils/common.js";
+import { useAlerts as n } from "../../../system/composables/alerts.js";
+import { useDamConfigName as r } from "../../composables/damConfigName.js";
+import i from "../../../../assets/image/placeholder16x9.js";
+import { useCommonAdminImageOptions as a } from "../composables/commonAdminImageOptions.js";
+import { useImageActions as o } from "../composables/imageActions.js";
+import { Fragment as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, normalizeClass as h, openBlock as g, ref as _, renderSlot as v, toDisplayString as y, toRefs as b, unref as x, watch as S, withCtx as C } from "vue";
+import { useI18n as w } from "vue-i18n";
+import { VCol as T, VRow as E } from "vuetify/components/VGrid";
+import { VIcon as D } from "vuetify/components/VIcon";
+import { VProgressCircular as O } from "vuetify/components/VProgressCircular";
+import { VImg as k } from "vuetify/components/VImg";
+//#region src/domains/dam/imageWidget/components/AImageWidgetSimple.vue?vue&type=script&setup=true&lang.ts
+var A = {
+	key: 0,
+	class: "label-container"
+}, j = { class: "font-weight-bold text-label-large" }, M = [
+	"src",
+	"width",
+	"height"
+], N = { class: "d-flex align-center justify-center h-100" }, P = { class: "d-flex align-center justify-center h-100" }, F = {
+	key: 3,
+	class: "pa-2"
+}, I = { class: "text-body-small text-medium-emphasis" }, L = { class: "text-body-small text-medium-emphasis" }, R = /*@__PURE__*/ m({
+	__name: "AImageWidgetSimple",
+	props: {
+		modelValue: {},
+		image: { default: void 0 },
+		configName: { default: void 0 },
+		label: { default: void 0 },
+		width: { default: void 0 },
+		height: { default: void 0 },
+		disableAspectRatio: {
+			type: Boolean,
+			default: !1
+		},
+		aspectRatio: { default: 1.777 },
+		showDescription: {
+			type: Boolean,
+			default: !1
+		},
+		showSource: {
+			type: Boolean,
+			default: !1
+		},
+		damWidth: { default: void 0 },
+		damHeight: { default: void 0 },
+		useHtmlImg: {
+			type: Boolean,
+			default: !1
+		},
+		widgetClass: { default: void 0 },
+		sourceLabel: { default: void 0 }
+	},
+	setup(m) {
+		let R = m, z = r(R.configName), { showErrorsDefault: B } = n(), V = a(z), { imageClient: H, imageApi: U } = V, { widgetImageToDamImageUrl: W } = o(V), G = _(null), { image: K, modelValue: q } = b(R), J = _(""), { t: Y } = w(), X = (e) => t(R.damWidth) && t(R.damHeight) ? W(e, R.damWidth, R.damHeight) : W(e, V.imageWidth, V.imageHeight);
+		return S([K, q], async ([t, n]) => {
+			if (G.value = null, J.value = i, t) G.value = e(t), G.value && (J.value = X(G.value));
+			else if (n) {
+				try {
+					G.value = await U.fetchImage(H, n);
+				} catch (e) {
+					B(e);
+				}
+				G.value && (J.value = X(G.value));
+			}
+		}, { immediate: !0 }), (e, t) => (g(), u(s, null, [
+			m.label ? (g(), u("div", A, [d("h4", j, y(m.label), 1)])) : l("", !0),
+			m.useHtmlImg ? (g(), u("img", {
+				key: 1,
+				alt: "",
+				src: J.value,
+				width: m.width,
+				height: m.height,
+				class: h(m.widgetClass)
+			}, null, 10, M)) : (g(), c(k, {
+				key: 2,
+				"lazy-src": x(i),
+				src: J.value,
+				width: m.width,
+				height: m.height,
+				cover: "",
+				loading: "lazy",
+				"max-width": "100%",
+				class: h(["disable-radius", m.widgetClass]),
+				"aspect-ratio": m.disableAspectRatio ? void 0 : m.aspectRatio
+			}, {
+				error: C(() => [d("div", N, [p(D, { icon: "mdi-alert-circle-outline" })])]),
+				placeholder: C(() => [d("div", P, [p(O, {
+					indeterminate: "",
+					color: "grey-lighten-4"
+				})])]),
+				_: 1
+			}, 8, [
+				"lazy-src",
+				"src",
+				"width",
+				"height",
+				"class",
+				"aspect-ratio"
+			])),
+			G.value && (m.showDescription || m.showSource) ? (g(), u("div", F, [m.showDescription ? (g(), c(E, {
+				key: 0,
+				density: "compact"
+			}, {
+				default: C(() => [p(T, null, {
+					default: C(() => [
+						d("span", I, y(x(Y)("common.damImage.image.model.texts.description")) + ": ", 1),
+						t[0] ||= d("br", null, null, -1),
+						f(y(G.value.texts.description), 1)
+					]),
+					_: 1
+				})]),
+				_: 1
+			})) : l("", !0), m.showSource ? (g(), c(E, {
+				key: 1,
+				density: "compact"
+			}, {
+				default: C(() => [p(T, null, {
+					default: C(() => [
+						d("span", L, y(m.sourceLabel) + ":", 1),
+						t[1] ||= d("br", null, null, -1),
+						f(y(G.value.texts.source), 1)
+					]),
+					_: 1
+				})]),
+				_: 1
+			})) : l("", !0)])) : l("", !0),
+			v(e.$slots, "append", { image: G.value }, void 0, !0)
+		], 64));
+	}
+});
+//#endregion
+export { R as default };
+
+//# sourceMappingURL=AImageWidgetSimple.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AImageWidgetSimple.vue_vue_type_script_setup_true_lang.js","names":["imagePlaceholderPath","_openBlock","_createElementBlock","_Fragment","_createElementVNode","_toDisplayString","_createCommentVNode","_normalizeClass","_createBlock","_component_VImg","_unref","_withCtx","_createVNode","_component_VIcon","_component_VProgressCircular","_component_VRow","_component_VCol","_createTextVNode","_renderSlot","placeholder16x9_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","AImageWidgetSimple_vue_vue_type_script_setup_true_lang_default","props","__props","damConfigName","useDamConfigName","useAlerts","imageOptions","useCommonAdminImageOptions","useImageActions","resImage","ref","toRefs","resolvedSrc","useI18n","getImageUrl","isNumber","widgetImageToDamImageUrl","image","watch","modelValue","newImage","newImageId","cloneDeep","imageApi","imageClient","error","openBlock","createElementBlock","Fragment","createElementVNode","toDisplayString","createCommentVNode","normalizeClass","createBlock","VImg","unref","withCtx","createVNode","VIcon","VProgressCircular","VRow","VCol","t","_cache","createTextVNode","renderSlot","_ctx"],"sources":["../../../../../src/domains/dam/imageWidget/components/AImageWidgetSimple.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ref, toRefs, watch } from 'vue'\nimport imagePlaceholderPath from '@/assets/image/placeholder16x9.svg'\nimport type { ImageAware, ImageCreateUpdateAware } from '@/domains/dam/types/ImageAware'\nimport { cloneDeep, isNumber } from '@/shared/utils/common'\nimport { useCommonAdminImageOptions } from '@/domains/dam/imageWidget/composables/commonAdminImageOptions'\nimport { useImageActions } from '@/domains/dam/imageWidget/composables/imageActions'\nimport type { IntegerIdNullable } from '@/shared/types/common'\nimport { useAlerts } from '@/domains/system/composables/alerts'\nimport { useI18n } from 'vue-i18n'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: IntegerIdNullable | undefined\n    image?: ImageAware | ImageCreateUpdateAware | undefined | null // optional, if available, no need to fetch image data\n    configName?: string\n    label?: string | undefined\n    width?: number | undefined\n    height?: undefined | number\n    disableAspectRatio?: boolean\n    aspectRatio?: number | string\n    showDescription?: boolean\n    showSource?: boolean\n    damWidth?: undefined | number\n    damHeight?: undefined | number\n    useHtmlImg?: boolean\n    widgetClass?: string | undefined\n    sourceLabel?: string | undefined\n  }>(),\n  {\n    configName: undefined,\n    label: undefined,\n    image: undefined,\n    width: undefined,\n    height: undefined,\n    disableAspectRatio: false,\n    aspectRatio: 1.777, // 16/9\n    showDescription: false,\n    showSource: false,\n    damWidth: undefined,\n    damHeight: undefined,\n    useHtmlImg: false,\n    widgetClass: undefined,\n    sourceLabel: undefined,\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\nconst { showErrorsDefault } = useAlerts()\n\nconst imageOptions = useCommonAdminImageOptions(damConfigName)\nconst { imageClient, imageApi } = imageOptions\nconst { widgetImageToDamImageUrl } = useImageActions(imageOptions)\n\nconst resImage = ref<null | ImageAware | ImageCreateUpdateAware>(null)\n\nconst { image, modelValue } = toRefs(props)\n\nconst resolvedSrc = ref('')\n\nconst { t } = useI18n()\n\nconst getImageUrl = (image: ImageAware | ImageCreateUpdateAware) => {\n  if (isNumber(props.damWidth) && isNumber(props.damHeight)) {\n    return widgetImageToDamImageUrl(image, props.damWidth, props.damHeight)\n  }\n  return widgetImageToDamImageUrl(image, imageOptions.imageWidth, imageOptions.imageHeight)\n}\n\nwatch(\n  [image, modelValue],\n  async ([newImage, newImageId]) => {\n    resImage.value = null\n    resolvedSrc.value = imagePlaceholderPath\n    if (newImage) {\n      resImage.value = cloneDeep(newImage)\n      if (resImage.value) {\n        resolvedSrc.value = getImageUrl(resImage.value)\n      }\n      return\n    }\n    if (newImageId) {\n      try {\n        resImage.value = await imageApi.fetchImage(imageClient, newImageId)\n      } catch (error) {\n        showErrorsDefault(error)\n      }\n      if (resImage.value) {\n        resolvedSrc.value = getImageUrl(resImage.value)\n      }\n    }\n  },\n  { immediate: true }\n)\n</script>\n\n<template>\n  <div\n    v-if=\"label\"\n    class=\"label-container\"\n  >\n    <h4 class=\"font-weight-bold text-label-large\">\n      {{ label }}\n    </h4>\n  </div>\n  <img\n    v-if=\"useHtmlImg\"\n    alt=\"\"\n    :src=\"resolvedSrc\"\n    :width=\"width\"\n    :height=\"height\"\n    :class=\"widgetClass\"\n  />\n  <VImg\n    v-else\n    :lazy-src=\"imagePlaceholderPath\"\n    :src=\"resolvedSrc\"\n    :width=\"width\"\n    :height=\"height\"\n    cover\n    loading=\"lazy\"\n    max-width=\"100%\"\n    class=\"disable-radius\"\n    :class=\"widgetClass\"\n    :aspect-ratio=\"disableAspectRatio ? undefined : aspectRatio\"\n  >\n    <template #error>\n      <div class=\"d-flex align-center justify-center h-100\">\n        <VIcon icon=\"mdi-alert-circle-outline\" />\n      </div>\n    </template>\n    <template #placeholder>\n      <div class=\"d-flex align-center justify-center h-100\">\n        <VProgressCircular\n          indeterminate\n          color=\"grey-lighten-4\"\n        />\n      </div>\n    </template>\n  </VImg>\n  <div\n    v-if=\"resImage && (showDescription || showSource)\"\n    class=\"pa-2\"\n  >\n    <VRow\n      v-if=\"showDescription\"\n      density=\"compact\"\n    >\n      <VCol>\n        <span class=\"text-body-small text-medium-emphasis\">\n          {{ t('common.damImage.image.model.texts.description') }}:\n        </span>\n        <br />{{ resImage.texts.description }}\n      </VCol>\n    </VRow>\n    <VRow\n      v-if=\"showSource\"\n      density=\"compact\"\n    >\n      <VCol>\n        <span class=\"text-body-small text-medium-emphasis\">{{ sourceLabel }}:</span>\n        <br />{{ resImage.texts.source }}\n      </VCol>\n    </VRow>\n  </div>\n  <slot\n    name=\"append\"\n    :image=\"resImage\"\n  />\n</template>\n\n<style lang=\"scss\" scoped>\n:deep(.v-img.disable-radius .v-img__img) {\n  border-radius: 0;\n}\n\n.label-container {\n  display: flex;\n  height: 32px;\n  align-items: center;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,IAAM6B,IAAQC,GAoCRC,IAAgBC,EAAiBH,EAAM,UAAU,GAEjD,EAAE,yBAAsBI,EAAU,GAElCC,IAAeC,EAA2BJ,CAAa,GACvD,EAAE,gBAAa,gBAAaG,GAC5B,EAAE,gCAA6BE,EAAgBF,CAAY,GAE3DG,IAAWC,EAAgD,IAAI,GAE/D,EAAE,UAAO,kBAAeC,EAAOV,CAAK,GAEpCW,IAAcF,EAAI,EAAE,GAEpB,EAAE,SAAMG,EAAQ,GAEhBC,KAAe,MACfC,EAASd,EAAM,QAAQ,KAAKc,EAASd,EAAM,SAAS,IAC/Ce,EAAyBC,GAAOhB,EAAM,UAAUA,EAAM,SAAS,IAEjEe,EAAyBC,GAAOX,EAAa,YAAYA,EAAa,WAAW;E,OAG1FY,EACE,CAACD,GAAOE,CAAU,GAClB,OAAO,CAACC,GAAUC,OAAgB;GAGhC,IAFA,EAAS,QAAQ,MACjB,EAAY,QAAQjD,GAChBgD,GAEF,AADA,EAAS,QAAQE,EAAUF,CAAQ,GAC/BX,EAAS,UACX,EAAY,QAAQK,EAAYL,EAAS,KAAK;QAIlD,IAAIY,GAAY;IACd,IAAI;KACF,EAAS,QAAQ,MAAME,EAAS,WAAWC,GAAaH,CAAU;IACpE,SAASI,GAAO;KACd,EAAkBA,CAAK;IACzB;IACA,AAAIhB,EAAS,UACX,EAAY,QAAQK,EAAYL,EAAS,KAAK;GAElD;EACF,GACA,EAAE,WAAW,GAAK,CACpB,I;GAKUP,EAAA,SADR7B,EAAA,GAAAC,EAOM,OAPNkB,GAOM,CAHJhB,EAEK,MAFLiB,GAEKhB,EADAyB,EAAA,KAAK,GAAA,CAAA,C;GAIJA,EAAA,cADR7B,EAAA,GAAAC,EAOE,OAAA;;IALA,KAAI;IACH,KAAKsC,EAAA;IACL,OAAOV,EAAA;IACP,QAAQA,EAAA;IACR,OAAKvB,EAAEuB,EAAA,WAAW;G,oBAErB7B,EAAA,GAAAO,EA0BOC,GAAA;;IAxBJ,YAAUC,EAAAV,CAAA;IACV,KAAKwC,EAAA;IACL,OAAOV,EAAA;IACP,QAAQA,EAAA;IACT,OAAA;IACA,SAAQ;IACR,aAAU;IACV,OAAKvB,EAAA,CAAC,kBACEuB,EAAA,WAAW,CAAA;IAClB,gBAAcA,EAAA,qBAAqB,KAAA,IAAYA,EAAA;;IAErC,OAAKnB,QAGR,CAFNP,EAEM,OAFNmB,GAEM,CADJX,EAAyCC,GAAA,EAAlC,MAAK,2BAA0B,CAAA,C;IAG/B,aAAWF,QAMd,CALNP,EAKM,OALNoB,GAKM,CAJJZ,EAGEE,GAAA;KAFA,eAAA;KACA,OAAM;;;;;;;;;;;GAMNuB,EAAA,UAAaP,EAAA,mBAAmBA,EAAA,eADxC7B,EAAA,GAAAC,EAwBM,OAxBNuB,GAwBM,CAnBIK,EAAA,mBADR7B,EAAA,GAAAO,EAUOO,GAAA;;IARL,SAAQ;;IAER,SAAAJ,QAKO,CALPC,EAKOI,GAAA,MAAA;KAJL,SAAAL,QAEO;MAFPP,EAEO,QAFPsB,GAEOrB,EADFK,EAAA4D,CAAA,CAAC,CAAA,+CAAA,CAAA,IAAoD,MAC1D,CAAA;MACA,AAAAC,EAAA,OAAAnE,EAAM,MAAA,MAAA,MAAA,EAAA;MAAGa,EAAAZ,EAAAgC,EAAA,MAAS,MAAM,WAAW,GAAA,CAAA;;;;;G,iBAI/BP,EAAA,cADR7B,EAAA,GAAAO,EAQOO,GAAA;;IANL,SAAQ;;IAER,SAAAJ,QAGO,CAHPC,EAGOI,GAAA,MAAA;KAFL,SAAAL,QAA4E;MAA5EP,EAA4E,QAA5EuB,GAA4EtB,EAAtByB,EAAA,WAAW,IAAG,KAAC,CAAA;MACrE,AAAAyC,EAAA,OAAAnE,EAAM,MAAA,MAAA,MAAA,EAAA;MAAGa,EAAAZ,EAAAgC,EAAA,MAAS,MAAM,MAAM,GAAA,CAAA;;;;;;GAIpCnB,EAGEwD,EAAA,QAAA,UAAA,EADC,OAAOrC,EAAA,MAAQ,GAAA,KAAA,GAAA,EAAA"}

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

@@ -0,0 +1,9 @@
+import e from "../../../../_virtual/_plugin-vue_export-helper.js";
+import t from "./AMediaWidgetSimple.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                   */
+//#region src/domains/dam/imageWidget/components/AMediaWidgetSimple.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-0942d92c"]]);
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=AMediaWidgetSimple.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AMediaWidgetSimple.js","names":["_sfc_main","_plugin_vue_export_helper_default","AMediaWidgetSimple_vue_vue_type_script_setup_true_lang_default","AMediaWidgetSimple_default"],"sources":["../../../../../src/domains/dam/imageWidget/components/AMediaWidgetSimple.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, ref, watch } from 'vue'\nimport imagePlaceholderPath from '@/assets/image/placeholder16x9.svg'\nimport { cloneDeep, isNull, isNumber } from '@/shared/utils/common'\nimport { useCommonAdminImageOptions } from '@/domains/dam/imageWidget/composables/commonAdminImageOptions'\nimport { useImageActions } from '@/domains/dam/imageWidget/composables/imageActions'\nimport { DamMediaType, type MediaAware } from '@/domains/dam/types/MediaAware'\nimport { DamAssetType, type DamAssetTypeType } from '@/domains/dam/types/Asset'\nimport MediaWidgetSimpleDialog from '@/domains/dam/imageWidget/components/MediaWidgetSimpleDialog.vue'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    media?: MediaAware | null | undefined // optional, render media instead of image\n    configName?: string\n    label?: string | undefined\n    width?: number | undefined\n    height?: undefined | number\n    disableAspectRatio?: boolean\n    aspectRatio?: number | string\n    showDescription?: boolean\n    showSource?: boolean\n    damWidth?: undefined | number\n    damHeight?: undefined | number\n    useHtmlImg?: boolean\n    widgetClass?: string | undefined\n  }>(),\n  {\n    configName: undefined,\n    label: undefined,\n    media: undefined,\n    width: undefined,\n    height: undefined,\n    disableAspectRatio: false,\n    aspectRatio: 1.777, // 16/9\n    showDescription: false,\n    showSource: false,\n    damWidth: undefined,\n    damHeight: undefined,\n    useHtmlImg: false,\n    widgetClass: undefined,\n  }\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\nconst imageOptions = useCommonAdminImageOptions(damConfigName)\nconst { damImageIdToDamImageUrl } = useImageActions(imageOptions)\n\nconst resMedia = ref<null | MediaAware>(null)\nconst resolvedSrc = ref('')\nconst dialog = ref(false)\n\nconst getImageUrl = (media: MediaAware) => {\n  if (isNull(media.damMedia.imageFileId)) return imagePlaceholderPath\n  if (isNumber(props.damWidth) && isNumber(props.damHeight)) {\n    return damImageIdToDamImageUrl(media.damMedia.imageFileId, props.damWidth, props.damHeight)\n  }\n  return damImageIdToDamImageUrl(media.damMedia.imageFileId)\n}\n\nconst onDetailClick = () => {\n  if (resMedia.value?.damMedia.playable) {\n    dialog.value = true\n  }\n}\n\nconst onDialogClose = () => {\n  dialog.value = false\n}\n\nconst type = computed<DamAssetTypeType | null>(() => {\n  return resMedia.value?.damMedia.assetType === DamMediaType.Video ? DamAssetType.Video : DamAssetType.Audio\n})\n\nwatch(\n  [() => props.media],\n  async ([newMedia]) => {\n    resMedia.value = null\n    resolvedSrc.value = imagePlaceholderPath\n    if (newMedia) {\n      resMedia.value = cloneDeep(newMedia)\n      resolvedSrc.value = getImageUrl(newMedia)\n    }\n  },\n  { immediate: true }\n)\n</script>\n\n<template>\n  <div\n    v-if=\"label\"\n    class=\"label-container\"\n  >\n    <h4 class=\"font-weight-bold text-label-large\">\n      {{ label }}\n    </h4>\n  </div>\n  <div\n    class=\"position-relative\"\n    :class=\"{ 'cursor-pointer': resMedia?.damMedia.playable }\"\n    @click.stop=\"onDetailClick\"\n  >\n    <img\n      v-if=\"useHtmlImg\"\n      alt=\"\"\n      :src=\"resolvedSrc\"\n      :width=\"width\"\n      :height=\"height\"\n      :class=\"widgetClass\"\n    />\n    <VImg\n      v-else\n      :lazy-src=\"imagePlaceholderPath\"\n      :src=\"resolvedSrc\"\n      :width=\"width\"\n      :height=\"height\"\n      cover\n      max-width=\"100%\"\n      class=\"disable-radius\"\n      :class=\"widgetClass\"\n      :aspect-ratio=\"disableAspectRatio ? undefined : aspectRatio\"\n    >\n      <template #error>\n        <div class=\"d-flex align-center justify-center h-100\">\n          <VIcon icon=\"mdi-alert-circle-outline\" />\n        </div>\n      </template>\n      <template #placeholder>\n        <div class=\"d-flex align-center justify-center h-100\">\n          <VProgressCircular\n            indeterminate\n            color=\"grey-lighten-4\"\n          />\n        </div>\n      </template>\n    </VImg>\n    <div\n      v-if=\"type\"\n      class=\"a-image-widget__icon\"\n    >\n      <div v-if=\"type === DamAssetType.Audio\">\n        <VIcon\n          size=\"80\"\n          icon=\"mdi-music\"\n          color=\"#505050\"\n        />\n      </div>\n      <div v-else-if=\"type === DamAssetType.Video\">\n        <VIcon\n          size=\"80\"\n          icon=\"mdi-video\"\n          color=\"#505050\"\n        />\n      </div>\n    </div>\n  </div>\n  <slot\n    name=\"append\"\n    :media=\"resMedia\"\n  />\n  <MediaWidgetSimpleDialog\n    v-model=\"dialog\"\n    :media=\"resMedia\"\n    @close=\"onDialogClose\"\n  >\n    <template #preview=\"{ media: appendMedia }\">\n      <slot\n        name=\"preview\"\n        :media=\"appendMedia\"\n      />\n    </template>\n  </MediaWidgetSimpleDialog>\n</template>\n\n<style lang=\"scss\" scoped>\n:deep(.v-img.disable-radius .v-img__img) {\n  border-radius: 0;\n}\n\n.label-container {\n  display: flex;\n  height: 32px;\n  align-items: center;\n}\n</style>\n"],"mappings":""}

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

@@ -0,0 +1,69 @@
+import { MediaAware } from '../../types/MediaAware';
+type __VLS_Props = {
+    media?: MediaAware | null | undefined;
+    configName?: string;
+    label?: string | undefined;
+    width?: number | undefined;
+    height?: undefined | number;
+    disableAspectRatio?: boolean;
+    aspectRatio?: number | string;
+    showDescription?: boolean;
+    showSource?: boolean;
+    damWidth?: undefined | number;
+    damHeight?: undefined | number;
+    useHtmlImg?: boolean;
+    widgetClass?: string | undefined;
+};
+declare var __VLS_29: {
+    media: {
+        id?: import('../../../../lib').IntegerId | undefined;
+        damMedia: {
+            imageFileId: import('../../../../lib').DocIdNullable;
+            assetId: import('../../../../lib').DocIdNullable;
+            licenceId: import('../../../../lib').IntegerIdNullable;
+            assetType: import('../../types/MediaAware').DamMediaTypeType;
+            title: string;
+            description: string;
+            seriesName: string;
+            authorNames: string[];
+            publishedAt: import('../../../../lib').DatetimeUTCNullable;
+            duration: number;
+            mediaUrl: string | null;
+            playable: boolean;
+            syncedWithDam: boolean;
+            episodeName: string;
+            episodeNumber: number | null;
+        };
+        extService: "damVideo" | "damPodcast";
+    } | null;
+}, __VLS_40: {
+    media: MediaAware<import('../../types/MediaAware').DamMedia> | null;
+};
+type __VLS_Slots = {} & {
+    append?: (props: typeof __VLS_29) => any;
+} & {
+    preview?: (props: typeof __VLS_40) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    label: string;
+    media: MediaAware<import('../../types/MediaAware').DamMedia> | null;
+    showSource: boolean;
+    width: number;
+    height: number;
+    configName: string;
+    aspectRatio: string | number;
+    disableAspectRatio: boolean;
+    showDescription: boolean;
+    damWidth: number;
+    damHeight: number;
+    useHtmlImg: boolean;
+    widgetClass: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};