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

package/dist/domains/dam/assetSelect/components/AssetImagePreview.vue.d.ts

@@ -11,6 +11,8 @@ type __VLS_Props = {
     iconColor?: string;
     showMetaIcons?: boolean;
     assetFileProperties?: AssetFileProperties | undefined;
+    /** 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;
@@ -25,6 +27,7 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
     src: string;
     assetFileProperties: AssetFileProperties;
     assetStatus: DamAssetStatusType;
+    licenceBadge: string;
     backgroundColor: string;
     fallbackHeight: number;
     showMetaIcons: boolean;

package/dist/domains/dam/assetSelect/components/AssetImagePreview.vue_vue_type_script_setup_true_lang.js

@@ -1,10 +1,10 @@
-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 { DamAssetStatus as e, DamAssetType as t } from "../../types/Asset.js";
+import n from "../../../../assets/image/placeholder16x9.js";
+import { isUndefined as r } from "../../../../shared/utils/common.js";
 import i from "../../assetDetail/components/AssetImageMetaIcons.js";
 import { computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, defineComponent as u, normalizeStyle as d, openBlock as f, unref as p } from "vue";
 import { VIcon as m } from "vuetify/components/VIcon";
-//#region src/domains/dam/assetSelect/components/AssetImagePreview.vue?vue&type=script&setup=true&lang.ts
+// src/domains/dam/assetSelect/components/AssetImagePreview.vue?vue&type=script&setup=true&lang.ts
 var h = [
 	"src",
 	"width",
@@ -19,8 +19,8 @@ var h = [
 	__name: "AssetImagePreview",
 	props: {
 		src: { default: void 0 },
-		assetType: { default: n.Image },
-		assetStatus: { default: t.WithFile },
+		assetType: { default: t.Image },
+		assetStatus: { default: e.WithFile },
 		backgroundColor: { default: "#ccc" },
 		width: { default: void 0 },
 		height: { default: void 0 },
@@ -31,23 +31,24 @@ var h = [
 			type: Boolean,
 			default: !1
 		},
-		assetFileProperties: { default: void 0 }
+		assetFileProperties: { default: void 0 },
+		licenceBadge: { default: "" }
 	},
 	emits: ["error"],
 	setup(u, { emit: v }) {
 		let y = u, b = v, x = () => {
 			b("error");
 		}, S = a(() => {
-			if (y.assetStatus === t.Deleting) return "mdi-trash-can";
+			if (y.assetStatus === e.Deleting) return "mdi-trash-can";
 			switch (y.assetType) {
-				case n.Audio: return y.assetStatus === t.WithFile ? "mdi-music" : "mdi-music-off";
-				case n.Document: return y.assetStatus === t.WithFile ? "mdi-note" : "mdi-note-off";
-				case n.Video: return y.assetStatus === t.WithFile ? "mdi-video" : "mdi-video-off";
-				case n.Image: return y.assetStatus === t.WithFile ? "mdi-image" : "mdi-image-off";
+				case t.Audio: return y.assetStatus === e.WithFile ? "mdi-music" : "mdi-music-off";
+				case t.Document: return y.assetStatus === e.WithFile ? "mdi-note" : "mdi-note-off";
+				case t.Video: return y.assetStatus === e.WithFile ? "mdi-video" : "mdi-video-off";
+				case t.Image: return y.assetStatus === e.WithFile ? "mdi-image" : "mdi-image-off";
 				default: return "";
 			}
-		}), C = a(() => e(y.src) ? r : y.src), w = a(() => !(y.assetType === n.Image && y.src));
-		return (e, n) => u.assetStatus === p(t).WithFile && u.src ? (f(), c("div", {
+		}), C = a(() => r(y.src) ? n : y.src), w = a(() => !(y.assetType === t.Image && y.src));
+		return (t, n) => u.assetStatus === p(e).WithFile && u.src ? (f(), c("div", {
 			key: 0,
 			class: "anzu-common-asset-image anzu-common-asset-image--img position-relative",
 			style: d({ width: u.width + "px" })
@@ -79,8 +80,13 @@ var h = [
 			u.showMetaIcons && u.assetFileProperties ? (f(), o(i, {
 				key: 1,
 				"asset-file-properties": u.assetFileProperties,
-				"asset-type": u.assetType
-			}, null, 8, ["asset-file-properties", "asset-type"])) : s("", !0)
+				"asset-type": u.assetType,
+				"licence-badge": u.licenceBadge
+			}, null, 8, [
+				"asset-file-properties",
+				"asset-type",
+				"licence-badge"
+			])) : s("", !0)
 		], 4)) : (f(), c("div", {
 			key: 1,
 			style: d([{
@@ -104,11 +110,15 @@ var h = [
 		])) : s("", !0)], 4)])) : s("", !0), u.showMetaIcons && u.assetFileProperties ? (f(), o(i, {
 			key: 1,
 			"asset-file-properties": u.assetFileProperties,
-			"asset-type": u.assetType
-		}, null, 8, ["asset-file-properties", "asset-type"])) : s("", !0)], 4));
+			"asset-type": u.assetType,
+			"licence-badge": u.licenceBadge
+		}, null, 8, [
+			"asset-file-properties",
+			"asset-type",
+			"licence-badge"
+		])) : s("", !0)], 4));
 	}
 });
-//#endregion
 export { v as default };
 
 //# sourceMappingURL=AssetImagePreview.vue_vue_type_script_setup_true_lang.js.map

package/dist/domains/dam/assetSelect/components/AssetImagePreview.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetImagePreview.vue_vue_type_script_setup_true_lang.js","names":["placeholder16x9","_unref","_openBlock","_createElementBlock","_normalizeStyle","_createElementVNode","_createBlock","_component_VIcon","_createCommentVNode","AssetImageMetaIcons","placeholder16x9_default","AssetImageMetaIcons_default","_hoisted_1","_hoisted_2","_hoisted_3","AssetImagePreview_vue_vue_type_script_setup_true_lang_default","DamAssetType","DamAssetStatus","__emit","props","__props","emit","onError","icon","computed","srcComputed","isUndefined","showIconComputed","unref","openBlock","createElementBlock","normalizeStyle","createElementVNode","createBlock","VIcon","createCommentVNode","\"width\""],"sources":["../../../../../src/domains/dam/assetSelect/components/AssetImagePreview.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport {\n  type AssetFileProperties,\n  DamAssetStatus,\n  type DamAssetStatusType,\n  DamAssetType,\n  type DamAssetTypeType,\n} from '@/domains/dam/types/Asset'\nimport placeholder16x9 from '@/assets/image/placeholder16x9.svg'\nimport { isUndefined } from '@/shared/utils/common'\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    iconColor?: string\n    showMetaIcons?: boolean\n    assetFileProperties?: AssetFileProperties | undefined\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    iconColor: '#505050',\n    showMetaIcons: false,\n    assetFileProperties: undefined,\n  }\n)\nconst emit = defineEmits<{\n  (e: 'error'): void\n}>()\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 srcComputed = computed(() => {\n  return isUndefined(props.src) ? placeholder16x9 : props.src\n})\n\nconst showIconComputed = computed(() => {\n  if (props.assetType === DamAssetType.Image && props.src) return false\n  return true\n})\n</script>\n\n<template>\n  <div\n    v-if=\"assetStatus === DamAssetStatus.WithFile && src\"\n    class=\"anzu-common-asset-image anzu-common-asset-image--img position-relative\"\n    :style=\"{ width: width + 'px' }\"\n  >\n    <img\n      class=\"anzu-common-asset-image__img\"\n      :src=\"srcComputed\"\n      :width=\"width\"\n      :height=\"height\"\n      alt=\"\"\n      loading=\"lazy\"\n      :style=\"'background-color:' + backgroundColor\"\n      @onerror=\"onError\"\n    />\n    <div\n      v-if=\"showIconComputed\"\n      class=\"anzu-common-asset-image__icon-wrapper\"\n    >\n      <div\n        class=\"anzu-common-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=\"anzu-common-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    />\n  </div>\n  <div\n    v-else\n    :style=\"{ height: fallbackHeight + 'px', backgroundColor: backgroundColor }\"\n    style=\"width: 100%\"\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    <AssetImageMetaIcons\n      v-if=\"showMetaIcons && assetFileProperties\"\n      :asset-file-properties=\"assetFileProperties\"\n      :asset-type=\"assetType\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\">\n.anzu-common-asset-image {\n  position: relative;\n\n  &__icon-wrapper {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  &__icon-circle {\n    border-radius: 100%;\n    background-color: rgb(204 204 204 / 50%);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAaA,IAAMmB,IAAQC,GA4BRC,IAAOH,GAIPI,UAAgB;GACpB,EAAK,OAAO;EACd,GAEMC,IAAOC,QAAe;GAC1B,IAAIL,EAAM,gBAAgBF,EAAe,UAAU,OAAO;GAC1D,QAAQE,EAAM,WAAd;IACE,KAAKH,EAAa,OAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,cAAc;IACvE,KAAKD,EAAa,UAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,aAAa;IACtE,KAAKD,EAAa,OAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,cAAc;IACvE,KAAKD,EAAa,OAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,cAAc;IACvE,SACE,OAAO;GACX;EACF,CAAC,GAEKQ,IAAcD,QACXE,EAAYP,EAAM,GAAG,IAAInB,IAAkBmB,EAAM,GACzD,GAEKQ,IAAmBH,QACvB,EAAIL,EAAM,cAAcH,EAAa,SAASG,EAAM,IAErD;E,iBAKSC,EAAA,gBAAgBnB,EAAAgB,CAAA,CAAc,CAAC,YAAYG,EAAA,OADnDlB,EAAA,GAAAC,EAqCM,OAAA;;GAnCJ,OAAM;GACL,OAAKC,EAAA,EAAA,OAAWgB,EAAA,QAAK,KAAA,CAAA;;GAEtBf,EASE,OAAA;IARA,OAAM;IACL,KAAKoB,EAAA;IACL,OAAOL,EAAA;IACP,QAAQA,EAAA;IACT,KAAI;IACJ,SAAQ;IACP,OAAKhB,EAAA,sBAAwBgB,EAAA,eAAe;IAC5C,WAASE;;GAGJK,EAAA,SADRzB,EAAA,GAAAC,EAgBM,OAhBNU,GAgBM,CAZJR,EAWM,OAAA;IAVJ,OAAM;IACL,OAAKD,EAAA,EAAA,SAAagB,EAAA,WAAQ,IAAA,KAAA,CAAA;G,IAGnBG,EAAA,MAAK,UADbrB,EAAA,GAAAI,EAMEC,GAAA;;IAJC,MAAMa,EAAA;IACN,MAAMG,EAAA;IACN,OAAOH,EAAA;IACR,OAAM;;;;;;GAKJA,EAAA,iBAAiBA,EAAA,uBADzBlB,EAAA,GAAAI,EAIEG,GAAA;;IAFC,yBAAuBW,EAAA;IACvB,cAAYA,EAAA;;E,UAGjBlB,EAAA,GAAAC,EA4BM,OAAA;;GA1BH,OAAKC,EAAA,CAAA;IAAA,QAAYgB,EAAA,iBAAc;IAAA,iBAA0BA,EAAA;GAAe,GACzE,EAAAgB,OAAA,OAAA,CAAmB,CAAA;GACnB,OAAM;E,IAGET,EAAA,SADRzB,EAAA,GAAAC,EAgBM,OAhBNW,GAgBM,CAZJT,EAWM,OAAA;GAVJ,OAAM;GACL,OAAKD,EAAA,EAAA,SAAagB,EAAA,WAAQ,IAAA,KAAA,CAAA;E,IAGnBG,EAAA,MAAK,UADbrB,EAAA,GAAAI,EAMEC,GAAA;;GAJC,MAAMa,EAAA;GACN,MAAMG,EAAA;GACN,OAAOH,EAAA;GACR,OAAM;;;;;E,qCAKJA,EAAA,iBAAiBA,EAAA,uBADzBlB,EAAA,GAAAI,EAIEG,GAAA;;GAFC,yBAAuBW,EAAA;GACvB,cAAYA,EAAA"}
+{"version":3,"file":"AssetImagePreview.vue_vue_type_script_setup_true_lang.js","names":["placeholder16x9","_unref","_openBlock","_createElementBlock","_normalizeStyle","_createElementVNode","_createBlock","_component_VIcon","_createCommentVNode","AssetImageMetaIcons","placeholder16x9_default","AssetImageMetaIcons_default","_hoisted_1","_hoisted_2","_hoisted_3","AssetImagePreview_vue_vue_type_script_setup_true_lang_default","DamAssetType","DamAssetStatus","__emit","props","__props","emit","onError","icon","computed","srcComputed","isUndefined","showIconComputed","unref","openBlock","createElementBlock","normalizeStyle","createElementVNode","createBlock","VIcon","createCommentVNode","\"width\""],"sources":["../../../../../src/domains/dam/assetSelect/components/AssetImagePreview.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport {\n  type AssetFileProperties,\n  DamAssetStatus,\n  type DamAssetStatusType,\n  DamAssetType,\n  type DamAssetTypeType,\n} from '@/domains/dam/types/Asset'\nimport placeholder16x9 from '@/assets/image/placeholder16x9.svg'\nimport { isUndefined } from '@/shared/utils/common'\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    iconColor?: string\n    showMetaIcons?: boolean\n    assetFileProperties?: AssetFileProperties | undefined\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    iconColor: '#505050',\n    showMetaIcons: false,\n    assetFileProperties: undefined,\n    licenceBadge: '',\n  }\n)\nconst emit = defineEmits<{\n  (e: 'error'): void\n}>()\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 srcComputed = computed(() => {\n  return isUndefined(props.src) ? placeholder16x9 : props.src\n})\n\nconst showIconComputed = computed(() => {\n  if (props.assetType === DamAssetType.Image && props.src) return false\n  return true\n})\n</script>\n\n<template>\n  <div\n    v-if=\"assetStatus === DamAssetStatus.WithFile && src\"\n    class=\"anzu-common-asset-image anzu-common-asset-image--img position-relative\"\n    :style=\"{ width: width + 'px' }\"\n  >\n    <img\n      class=\"anzu-common-asset-image__img\"\n      :src=\"srcComputed\"\n      :width=\"width\"\n      :height=\"height\"\n      alt=\"\"\n      loading=\"lazy\"\n      :style=\"'background-color:' + backgroundColor\"\n      @onerror=\"onError\"\n    />\n    <div\n      v-if=\"showIconComputed\"\n      class=\"anzu-common-asset-image__icon-wrapper\"\n    >\n      <div\n        class=\"anzu-common-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=\"anzu-common-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      :licence-badge=\"licenceBadge\"\n    />\n  </div>\n  <div\n    v-else\n    :style=\"{ height: fallbackHeight + 'px', backgroundColor: backgroundColor }\"\n    style=\"width: 100%\"\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    <AssetImageMetaIcons\n      v-if=\"showMetaIcons && assetFileProperties\"\n      :asset-file-properties=\"assetFileProperties\"\n      :asset-type=\"assetType\"\n      :licence-badge=\"licenceBadge\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\">\n.anzu-common-asset-image {\n  position: relative;\n\n  &__icon-wrapper {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  &__icon-circle {\n    border-radius: 100%;\n    background-color: rgb(204 204 204 / 50%);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAaA,IAAMmB,IAAQC,GA+BRC,IAAOH,GAIPI,UAAgB;GACpB,EAAK,OAAO;EACd,GAEMC,IAAOC,QAAe;GAC1B,IAAIL,EAAM,gBAAgBF,EAAe,UAAU,OAAO;GAC1D,QAAQE,EAAM,WAAd;IACE,KAAKH,EAAa,OAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,cAAc;IACvE,KAAKD,EAAa,UAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,aAAa;IACtE,KAAKD,EAAa,OAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,cAAc;IACvE,KAAKD,EAAa,OAChB,OAAOG,EAAM,gBAAgBF,EAAe,WAAW,cAAc;IACvE,SACE,OAAO;GACX;EACF,CAAC,GAEKQ,IAAcD,QACXE,EAAYP,EAAM,GAAG,IAAInB,IAAkBmB,EAAM,GACzD,GAEKQ,IAAmBH,QACvB,EAAIL,EAAM,cAAcH,EAAa,SAASG,EAAM,IAErD;E,iBAKSC,EAAA,gBAAgBnB,EAAAgB,CAAA,CAAc,CAAC,YAAYG,EAAA,OADnDlB,EAAA,GAAAC,EAsCM,OAAA;;GApCJ,OAAM;GACL,OAAKC,EAAA,EAAA,OAAWgB,EAAA,QAAK,KAAA,CAAA;;GAEtBf,EASE,OAAA;IARA,OAAM;IACL,KAAKoB,EAAA;IACL,OAAOL,EAAA;IACP,QAAQA,EAAA;IACT,KAAI;IACJ,SAAQ;IACP,OAAKhB,EAAA,sBAAwBgB,EAAA,eAAe;IAC5C,WAASE;;GAGJK,EAAA,SADRzB,EAAA,GAAAC,EAgBM,OAhBNU,GAgBM,CAZJR,EAWM,OAAA;IAVJ,OAAM;IACL,OAAKD,EAAA,EAAA,SAAagB,EAAA,WAAQ,IAAA,KAAA,CAAA;G,IAGnBG,EAAA,MAAK,UADbrB,EAAA,GAAAI,EAMEC,GAAA;;IAJC,MAAMa,EAAA;IACN,MAAMG,EAAA;IACN,OAAOH,EAAA;IACR,OAAM;;;;;;GAKJA,EAAA,iBAAiBA,EAAA,uBADzBlB,EAAA,GAAAI,EAKEG,GAAA;;IAHC,yBAAuBW,EAAA;IACvB,cAAYA,EAAA;IACZ,iBAAeA,EAAA;;;;;;E,UAGpBlB,EAAA,GAAAC,EA6BM,OAAA;;GA3BH,OAAKC,EAAA,CAAA;IAAA,QAAYgB,EAAA,iBAAc;IAAA,iBAA0BA,EAAA;GAAe,GACzE,EAAAgB,OAAA,OAAA,CAAmB,CAAA;GACnB,OAAM;E,IAGET,EAAA,SADRzB,EAAA,GAAAC,EAgBM,OAhBNW,GAgBM,CAZJT,EAWM,OAAA;GAVJ,OAAM;GACL,OAAKD,EAAA,EAAA,SAAagB,EAAA,WAAQ,IAAA,KAAA,CAAA;E,IAGnBG,EAAA,MAAK,UADbrB,EAAA,GAAAI,EAMEC,GAAA;;GAJC,MAAMa,EAAA;GACN,MAAMG,EAAA;GACN,OAAOH,EAAA;GACR,OAAM;;;;;E,qCAKJA,EAAA,iBAAiBA,EAAA,uBADzBlB,EAAA,GAAAI,EAKEG,GAAA;;GAHC,yBAAuBW,EAAA;GACvB,cAAYA,EAAA;GACZ,iBAAeA,EAAA"}

package/dist/domains/dam/assetSelect/components/AssetSelectFilter.js

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

package/dist/domains/dam/assetSelect/components/AssetSelectFilter.vue_vue_type_script_setup_true_lang.js

@@ -1,39 +1,39 @@
-import { FilterConfigKey as e, FilterDataKey as t } from "../../../filters/utils/filterInjectionKeys.js";
-import { useFilterHelpers as n } from "../../../filters/composables/filterFactory.js";
-import { useCommonAdminCoreDamOptions as r } from "../../composables/commonAdminCoreDamOptions.js";
-import { useDamConfigName as i } from "../../composables/damConfigName.js";
-import { useAssetListFilter as a } from "../filter/AssetFilter.js";
-import { useAssetSelectStore as o } from "../store/assetSelectStore.js";
-import { useSidebar as s } from "../composables/assetSelectFilterSidebar.js";
-import { useAssetSelectActions as c } from "../composables/assetSelectListActions.js";
-import l from "./AssetSelectFilterForm.js";
-import u from "../../../subjectSelect/components/AFilterWrapperSubjectSelect.js";
+import { useAssetSelectActions as e } from "../composables/assetSelectListActions.js";
+import { useAssetSelectStore as t } from "../store/assetSelectStore.js";
+import n from "./AssetSelectFilterForm.js";
+import { useAssetListFilter as r } from "../filter/AssetFilter.js";
+import { FilterConfigKey as i, FilterDataKey as a } from "../../../filters/utils/filterInjectionKeys.js";
+import o from "../../../subjectSelect/components/AFilterWrapperSubjectSelect.js";
+import { useFilterHelpers as s } from "../../../filters/composables/filterFactory.js";
+import { useCommonAdminCoreDamOptions as c } from "../../composables/commonAdminCoreDamOptions.js";
+import { useSidebar as l } from "../composables/assetSelectFilterSidebar.js";
+import { useDamConfigName as u } from "../../composables/damConfigName.js";
 import { computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createVNode as g, defineComponent as _, isRef as v, onMounted as y, openBlock as b, provide as x, resolveDynamicComponent 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 { useDisplay as k } from "vuetify";
 import { storeToRefs as A } from "pinia";
 import { VSelect as j } from "vuetify/components/VSelect";
-//#region src/domains/dam/assetSelect/components/AssetSelectFilter.vue?vue&type=script&setup=true&lang.ts
+// src/domains/dam/assetSelect/components/AssetSelectFilter.vue?vue&type=script&setup=true&lang.ts
 var M = { class: "subject-select-filter" }, N = { class: "subject-select-filter__content" }, P = /*@__PURE__*/ _({
 	__name: "AssetSelectFilter",
 	props: { configName: { default: void 0 } },
 	setup(_) {
-		let P = i(_.configName), { assetListEnabledFilters: F } = r(P), { t: I } = E(), { mdAndDown: L } = k(), { closeSidebarLeft: R } = s(), { fetchAssetListDebounced: z, resetAssetList: B, pagination: V } = c(P), H = o(), { selectedLicenceId: U, selectConfig: W } = A(H), { filterData: G, filterConfig: K } = a();
-		x(e, K), x(t, G);
-		let { resetFilter: q, submitFilter: J } = n(G, K, {
+		let P = u(_.configName), { assetListEnabledFilters: F } = c(P), { t: I } = E(), { mdAndDown: L } = k(), { closeSidebarLeft: R } = l(), { fetchAssetListDebounced: z, resetAssetList: B, pagination: V } = e(P), H = t(), { selectedLicenceId: U, selectConfig: W } = A(H), { filterData: G, filterConfig: K } = r();
+		x(i, K), x(a, G);
+		let { resetFilter: q, submitFilter: J } = s(G, K, {
 			populateUrlParams: !1,
 			storeFiltersLocalStorage: !1
 		}), Y = () => {
 			J(V, z), L.value && R();
 		}, X = () => {
 			q(V, B), L.value && R();
-		}, Z = d(() => (H.assetType, l));
+		}, Z = d(() => (H.assetType, n));
 		return w(U, (e, t) => {
 			e !== t && X();
 		}), y(() => {
 			z();
-		}), (e, t) => (b(), m("div", M, [h("div", N, [g(u, {
+		}), (e, t) => (b(), m("div", M, [h("div", N, [g(o, {
 			onSubmit: Y,
 			onReset: X
 		}, {
@@ -84,7 +84,6 @@ var M = { class: "subject-select-filter" }, N = { class: "subject-select-filter_
 		})])]));
 	}
 });
-//#endregion
 export { P as default };
 
 //# sourceMappingURL=AssetSelectFilter.vue_vue_type_script_setup_true_lang.js.map

package/dist/domains/dam/assetSelect/components/AssetSelectFilterForm.js

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

package/dist/domains/dam/assetSelect/components/AssetSelectFilterForm.vue_vue_type_script_setup_true_lang.js

@@ -1,20 +1,20 @@
-import { DamAssetType as e } from "../../types/Asset.js";
-import { useCommonAdminCoreDamOptions as t } from "../../composables/commonAdminCoreDamOptions.js";
-import { useDamConfigName as n } from "../../composables/damConfigName.js";
-import { useAssetSelectStore as r } from "../store/assetSelectStore.js";
-import { useAssetSelectActions as i } from "../composables/assetSelectListActions.js";
-import a from "../../../filters/components/AFilterBooleanSelect.js";
-import o from "../../../filters/components/AFilterString.js";
-import s from "../../keyword/components/DamKeywordFilterRemoteAutocomplete.js";
-import c from "../../author/components/DamAuthorFilterRemoteAutocomplete.js";
-import l from "../../user/components/DamUserFilterRemoteAutocomplete.js";
-import u from "./AssetDistributionServiceNameFilter.js";
-import d from "./FilterPodcastRemoteAutocomplete.js";
-import f from "../../../filters/components/AFilterTimeInterval.js";
+import { useAssetSelectActions as e } from "../composables/assetSelectListActions.js";
+import { useAssetSelectStore as t } from "../store/assetSelectStore.js";
+import n from "../../../filters/components/AFilterBooleanSelect.js";
+import r from "../../../filters/components/AFilterString.js";
+import i from "../../keyword/components/DamKeywordFilterRemoteAutocomplete.js";
+import a from "../../author/components/DamAuthorFilterRemoteAutocomplete.js";
+import o from "../../user/components/DamUserFilterRemoteAutocomplete.js";
+import s from "./AssetDistributionServiceNameFilter.js";
+import { DamAssetType as c } from "../../types/Asset.js";
+import l from "./FilterPodcastRemoteAutocomplete.js";
+import u from "../../../filters/components/AFilterTimeInterval.js";
+import { useCommonAdminCoreDamOptions as d } from "../../composables/commonAdminCoreDamOptions.js";
+import { useDamConfigName as f } from "../../composables/damConfigName.js";
 import { Fragment as p, computed as m, createBlock as h, createCommentVNode as g, createElementBlock as _, createVNode as v, defineComponent as y, mergeProps as b, normalizeProps as x, openBlock as S, unref as C, watch as w, withCtx as T } from "vue";
 import { VCol as E, VRow as D } from "vuetify/components/VGrid";
 import { storeToRefs as O } from "pinia";
-//#region src/domains/dam/assetSelect/components/AssetSelectFilterForm.vue?vue&type=script&setup=true&lang.ts
+// src/domains/dam/assetSelect/components/AssetSelectFilterForm.vue?vue&type=script&setup=true&lang.ts
 var k = /*@__PURE__*/ y({
 	__name: "AssetSelectFilterForm",
 	props: {
@@ -31,7 +31,7 @@ var k = /*@__PURE__*/ y({
 		configName: { default: void 0 }
 	},
 	setup(y) {
-		let k = y, A = n(k.configName), { filterData: j, filterConfig: M } = i(A), { assetListEnabledFilters: N } = t(A), P = (e) => {
+		let k = y, A = f(k.configName), { filterData: j, filterConfig: M } = e(A), { assetListEnabledFilters: N } = d(A), P = (e) => {
 			let t = k.enabledFilters ?? N;
 			return !t || t.includes(e);
 		}, F = (e) => {
@@ -44,31 +44,31 @@ var k = /*@__PURE__*/ y({
 				lg: t?.lg || 3,
 				xl: t?.xl || 2
 			};
-		}, I = r(), { selectConfig: L, selectedLicenceId: R, assetType: z } = O(I), B = m(() => {
+		}, I = t(), { selectConfig: L, selectedLicenceId: R, assetType: z } = O(I), B = m(() => {
 			let e = L.value.find((e) => e.licence === R.value);
 			if (e) return e.extSystem;
 		});
 		return w(B, (e, t) => {
 			e !== t && (j.keywordIds = [], j.authorIds = []);
-		}), (t, n) => (S(), h(D, null, {
+		}), (e, t) => (S(), h(D, null, {
 			default: T(() => [
 				!y.hideTextSearch && P("text") ? (S(), h(E, x(b({ key: 0 }, F("text"))), {
-					default: T(() => [v(o, { name: "text" })]),
+					default: T(() => [v(r, { name: "text" })]),
 					_: 1
 				}, 16)) : g("", !0),
 				P("assetAndMainFileIds") ? (S(), h(E, x(b({ key: 1 }, F("assetAndMainFileIds"))), {
-					default: T(() => [v(o, { name: "assetAndMainFileIds" })]),
+					default: T(() => [v(r, { name: "assetAndMainFileIds" })]),
 					_: 1
 				}, 16)) : g("", !0),
 				B.value ? (S(), _(p, { key: 2 }, [P("keywordIds") ? (S(), h(E, x(b({ key: 0 }, F("keywordIds"))), {
-					default: T(() => [(S(), h(s, {
+					default: T(() => [(S(), h(i, {
 						key: B.value,
 						name: "keywordIds",
 						"ext-system": B.value
 					}, null, 8, ["ext-system"]))]),
 					_: 1
 				}, 16)) : g("", !0), P("authorIds") ? (S(), h(E, x(b({ key: 1 }, F("authorIds"))), {
-					default: T(() => [(S(), h(c, {
+					default: T(() => [(S(), h(a, {
 						key: B.value,
 						name: "authorIds",
 						"ext-system": B.value
@@ -76,30 +76,30 @@ var k = /*@__PURE__*/ y({
 					_: 1
 				}, 16)) : g("", !0)], 64)) : g("", !0),
 				P("createdByIds") ? (S(), h(E, x(b({ key: 3 }, F("createdByIds"))), {
-					default: T(() => [v(l, { name: "createdByIds" })]),
+					default: T(() => [v(o, { name: "createdByIds" })]),
 					_: 1
 				}, 16)) : g("", !0),
 				P("described") ? (S(), h(E, x(b({ key: 4 }, F("described"))), {
-					default: T(() => [v(a, { name: "described" })]),
+					default: T(() => [v(n, { name: "described" })]),
 					_: 1
 				}, 16)) : g("", !0),
 				P("visible") ? (S(), h(E, x(b({ key: 5 }, F("visible"))), {
-					default: T(() => [v(a, { name: "visible" })]),
+					default: T(() => [v(n, { name: "visible" })]),
 					_: 1
 				}, 16)) : g("", !0),
 				P("generatedBySystem") ? (S(), h(E, x(b({ key: 6 }, F("generatedBySystem"))), {
-					default: T(() => [v(a, { name: "generatedBySystem" })]),
+					default: T(() => [v(n, { name: "generatedBySystem" })]),
 					_: 1
 				}, 16)) : g("", !0),
-				(C(z) === C(e).Audio || C(z) === C(e).Video) && P("distributedInServices") ? (S(), h(E, x(b({ key: 7 }, F("distributedInServices"))), {
-					default: T(() => [(S(), h(u, {
+				(C(z) === C(c).Audio || C(z) === C(c).Video) && P("distributedInServices") ? (S(), h(E, x(b({ key: 7 }, F("distributedInServices"))), {
+					default: T(() => [(S(), h(s, {
 						key: C(R),
 						name: "distributedInServices"
 					}))]),
 					_: 1
 				}, 16)) : g("", !0),
-				C(z) === C(e).Audio && P("podcastIds") ? (S(), h(E, x(b({ key: 8 }, F("podcastIds"))), {
-					default: T(() => [(S(), h(d, {
+				C(z) === C(c).Audio && P("podcastIds") ? (S(), h(E, x(b({ key: 8 }, F("podcastIds"))), {
+					default: T(() => [(S(), h(l, {
 						key: C(R),
 						"licence-id": C(R),
 						name: "podcastIds"
@@ -107,7 +107,7 @@ var k = /*@__PURE__*/ y({
 					_: 1
 				}, 16)) : g("", !0),
 				P("createdAtFrom") ? (S(), h(E, x(b({ key: 9 }, F("createdAtFrom"))), {
-					default: T(() => [v(f, {
+					default: T(() => [v(u, {
 						"name-from": "createdAtFrom",
 						"name-until": "createdAtUntil"
 					})]),
@@ -118,7 +118,6 @@ var k = /*@__PURE__*/ y({
 		}));
 	}
 });
-//#endregion
 export { k as default };
 
 //# sourceMappingURL=AssetSelectFilterForm.vue_vue_type_script_setup_true_lang.js.map

package/dist/domains/dam/assetSelect/components/AssetSelectListBar.js

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

package/dist/domains/dam/assetSelect/components/AssetSelectListBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetSelectListBar.js","names":["_sfc_main","AssetSelectListBar_vue_vue_type_script_setup_true_lang_default","AssetSelectListBar_default"],"sources":["../../../../../src/domains/dam/assetSelect/components/AssetSelectListBar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useI18n } from 'vue-i18n'\nimport {\n  AssetSelectGridView,\n  AssetSelectGridViewDefault,\n  useGridView,\n} from '@/domains/dam/assetSelect/composables/assetSelectGridView'\nimport { useSidebar } from '@/domains/dam/assetSelect/composables/assetSelectFilterSidebar'\nimport { computed, onMounted, type Ref, watch } from 'vue'\nimport { useDisplay } from 'vuetify'\nimport { DamAssetType, type DamAssetTypeType } from '@/domains/dam/types/Asset'\nimport { useAssetSelectStore } from '@/domains/dam/assetSelect/store/assetSelectStore'\nimport { storeToRefs } from 'pinia'\nimport ADatatableOrdering from '@/domains/filters/datatable/components/ADatatableOrdering.vue'\nimport {\n  type DatatableOrderingOption,\n  SORT_BY_SCORE_BEST,\n  SORT_BY_SCORE_DATE,\n} from '@/domains/filters/datatable/utils/datatableColumns'\nimport { SortOrder } from '@/domains/api/types/SortOrder'\nimport { useAssetListFilter } from '@/domains/dam/assetSelect/filter/AssetFilter'\nimport type { Pagination } from '@/domains/api/composables/pagination'\n\nconst props = withDefaults(\n  defineProps<{\n    showTypes?: boolean\n    disableSort?: boolean\n    hideFilterToggle?: boolean\n    preselectAssetType?: DamAssetTypeType | undefined\n    preselectInPodcast?: boolean | null | undefined\n  }>(),\n  {\n    showTypes: false,\n    disableSort: false,\n    hideFilterToggle: false,\n    preselectAssetType: undefined,\n    preselectInPodcast: undefined,\n  }\n)\nconst emit = defineEmits<{\n  (e: 'typeChange', data: { type: DamAssetTypeType; inPodcast: boolean | null }): void\n  (e: 'sortByChange', data: DatatableOrderingOption): void\n}>()\n\nconst sortModel = defineModel<number>('sort', { default: 1, required: false })\n\nconst { t } = useI18n()\nconst { gridView, setGridView } = useGridView()\nconst { mdAndDown } = useDisplay()\n\nwatch(\n  mdAndDown,\n  (isMobile) => {\n    if (isMobile && gridView.value === AssetSelectGridView.Table) {\n      setGridView(AssetSelectGridViewDefault)\n    }\n  },\n  { immediate: true }\n)\nconst { toggleSidebarLeft, sidebarLeft, toggleSidebarRight, sidebarRight } = useSidebar()\nconst assetSelectStore = useAssetSelectStore()\nconst { filterData } = useAssetListFilter()\nconst { assetType, inPodcast } = storeToRefs(assetSelectStore)\n\nconst isImageActive = computed(() => {\n  return assetType.value === DamAssetType.Image\n})\n\nconst isVideoActive = computed(() => {\n  return assetType.value === DamAssetType.Video\n})\n\nconst isPodcastActive = computed(() => {\n  return assetType.value === DamAssetType.Audio && inPodcast.value === true\n})\n\nconst setFilterImage = () => {\n  assetType.value = DamAssetType.Image\n  inPodcast.value = null\n  filterData.podcastIds = []\n  emit('typeChange', { type: DamAssetType.Image, inPodcast: null })\n}\n\nconst setFilterVideo = () => {\n  assetType.value = DamAssetType.Video\n  inPodcast.value = null\n  filterData.podcastIds = []\n  emit('typeChange', { type: DamAssetType.Video, inPodcast: null })\n}\n\nconst setFilterPodcast = () => {\n  assetType.value = DamAssetType.Audio\n  inPodcast.value = true\n  emit('typeChange', { type: DamAssetType.Audio, inPodcast: true })\n}\n\nconst customSortOptions = [\n  {\n    id: 3,\n    titleT: 'common.system.datatable.ordering.mostRelevant',\n    sortBy: { key: SORT_BY_SCORE_BEST, order: SortOrder.Desc },\n  },\n  {\n    id: 1,\n    titleT: 'common.system.datatable.ordering.mostRecent',\n    sortBy: { key: SORT_BY_SCORE_DATE, order: SortOrder.Desc },\n  },\n  {\n    id: 2,\n    titleT: 'common.system.datatable.ordering.oldest',\n    sortBy: { key: SORT_BY_SCORE_DATE, order: SortOrder.Asc },\n  },\n]\n\n// The pagination is shared by every asset select, so a dialog can open on a sort chosen in another one.\n// The ordering then adopts it, and that adoption must not reach the parent as a change -- it would fetch again.\nconst onSortUpdate = (option: DatatableOrderingOption, pagination: Ref<Pagination>) => {\n  const current = pagination.value.sortBy\n  if (current?.key === option.sortBy?.key && current?.order === option.sortBy?.order) return\n  emit('sortByChange', option)\n}\n\nonMounted(() => {\n  if (props.preselectAssetType === DamAssetType.Audio && props.preselectInPodcast) {\n    setFilterPodcast()\n    return\n  }\n  if (props.preselectAssetType === DamAssetType.Video) {\n    setFilterVideo()\n  }\n})\n</script>\n\n<template>\n  <VToolbar\n    density=\"compact\"\n    color=\"transparent\"\n    :height=\"46\"\n    elevation=\"0\"\n    :class=\"hideFilterToggle ? '' : 'border-b'\"\n    class=\"subject-select__second-bar\"\n  >\n    <slot name=\"second-bar\">\n      <div class=\"d-flex flex-column w-100 px-1 align-center\">\n        <div class=\"d-flex justify-space-between w-100 align-center\">\n          <div class=\"d-flex align-center\">\n            <VBtn\n              v-if=\"!hideFilterToggle\"\n              :aria-label=\"t('common.assetSelect.meta.filter.toggle')\"\n              icon\n              :width=\"30\"\n              :height=\"30\"\n              :active=\"sidebarLeft\"\n              @click=\"toggleSidebarLeft\"\n            >\n              <VIcon\n                icon=\"mdi-tune\"\n                :size=\"16\"\n              />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.filter.toggle') }}\n              </VTooltip>\n            </VBtn>\n            <template v-if=\"showTypes\">\n              <VDivider\n                vertical\n                class=\"ml-1 mr-2 my-2\"\n              />\n              <VBtn\n                :aria-label=\"t('common.assetSelect.assetType.image')\"\n                icon\n                :width=\"30\"\n                :height=\"30\"\n                class=\"mr-1\"\n                data-cy=\"button-image-types\"\n                :active=\"isImageActive\"\n                :color=\"isImageActive ? 'secondary' : ''\"\n                :variant=\"isImageActive ? 'flat' : 'text'\"\n                @click.stop=\"setFilterImage\"\n              >\n                <VIcon\n                  icon=\"mdi-image\"\n                  :size=\"16\"\n                />\n                <VTooltip\n                  activator=\"parent\"\n                  location=\"bottom\"\n                >\n                  {{ t('common.assetSelect.assetType.image') }}\n                </VTooltip>\n              </VBtn>\n              <VBtn\n                :aria-label=\"t('common.assetSelect.assetType.video')\"\n                icon\n                :width=\"30\"\n                :height=\"30\"\n                class=\"mr-1\"\n                data-cy=\"button-video-types\"\n                :active=\"isVideoActive\"\n                :color=\"isVideoActive ? 'secondary' : ''\"\n                :variant=\"isVideoActive ? 'flat' : 'text'\"\n                @click.stop=\"setFilterVideo\"\n              >\n                <VIcon\n                  icon=\"mdi-video\"\n                  :size=\"16\"\n                />\n                <VTooltip\n                  activator=\"parent\"\n                  location=\"bottom\"\n                >\n                  {{ t('common.assetSelect.assetType.video') }}\n                </VTooltip>\n              </VBtn>\n              <VBtn\n                :aria-label=\"t('common.assetSelect.filter.inPodcast')\"\n                icon\n                :width=\"30\"\n                :height=\"30\"\n                data-cy=\"button-in-podcast-types\"\n                :active=\"isPodcastActive\"\n                :color=\"isPodcastActive ? 'secondary' : ''\"\n                :variant=\"isPodcastActive ? 'flat' : 'text'\"\n                @click.stop=\"setFilterPodcast\"\n              >\n                <VIcon\n                  icon=\"mdi-podcast\"\n                  :size=\"16\"\n                />\n                <VTooltip\n                  activator=\"parent\"\n                  location=\"bottom\"\n                >\n                  {{ t('common.assetSelect.filter.inPodcast') }}\n                </VTooltip>\n              </VBtn>\n            </template>\n            <slot name=\"second-bar-left\" />\n          </div>\n          <div class=\"d-flex align-center\">\n            <slot name=\"second-bar-right\" />\n            <ADatatableOrdering\n              v-if=\"!disableSort\"\n              v-model=\"sortModel\"\n              :custom-options=\"customSortOptions\"\n              :pagination-update-custom-cb=\"onSortUpdate\"\n            />\n            <VBtn\n              :aria-label=\"t('common.assetSelect.meta.grid.masonry')\"\n              size=\"x-small\"\n              icon\n              class=\"text-medium-emphasis\"\n              variant=\"text\"\n              @click.stop=\"setGridView(AssetSelectGridView.Masonry)\"\n            >\n              <VIcon icon=\"mdi-view-compact\" />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.grid.masonry') }}\n              </VTooltip>\n            </VBtn>\n            <VBtn\n              :aria-label=\"t('common.assetSelect.meta.grid.thumbnail')\"\n              icon\n              class=\"text-medium-emphasis\"\n              size=\"x-small\"\n              variant=\"text\"\n              @click.stop=\"setGridView(AssetSelectGridView.Thumbnail)\"\n            >\n              <VIcon icon=\"mdi-view-grid\" />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.grid.thumbnail') }}\n              </VTooltip>\n            </VBtn>\n            <VBtn\n              v-if=\"!mdAndDown\"\n              :aria-label=\"t('common.assetSelect.meta.grid.table')\"\n              size=\"x-small\"\n              icon\n              class=\"text-medium-emphasis\"\n              variant=\"text\"\n              @click.stop=\"setGridView(AssetSelectGridView.Table)\"\n            >\n              <VIcon icon=\"mdi-view-headline\" />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.grid.table') }}\n              </VTooltip>\n            </VBtn>\n            <VDivider\n              vertical\n              class=\"mx-1 my-2\"\n            />\n            <VBtn\n              :aria-label=\"t('common.assetSelect.meta.info.toggle')\"\n              icon\n              class=\"text-medium-emphasis\"\n              :width=\"30\"\n              :height=\"30\"\n              :active=\"sidebarRight\"\n              @click=\"toggleSidebarRight\"\n            >\n              <VIcon\n                icon=\"mdi-information-outline\"\n                :size=\"16\"\n              />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.info.toggle') }}\n              </VTooltip>\n            </VBtn>\n          </div>\n        </div>\n      </div>\n    </slot>\n  </VToolbar>\n</template>\n"],"mappings":""}
+{"version":3,"file":"AssetSelectListBar.js","names":["_sfc_main","AssetSelectListBar_vue_vue_type_script_setup_true_lang_default","AssetSelectListBar_default"],"sources":["../../../../../src/domains/dam/assetSelect/components/AssetSelectListBar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useI18n } from 'vue-i18n'\nimport {\n  AssetSelectGridView,\n  AssetSelectGridViewDefault,\n  useGridView,\n} from '@/domains/dam/assetSelect/composables/assetSelectGridView'\nimport { useSidebar } from '@/domains/dam/assetSelect/composables/assetSelectFilterSidebar'\nimport { computed, onMounted, type Ref, watch } from 'vue'\nimport { useDisplay } from 'vuetify'\nimport { DamAssetType, type DamAssetTypeType } from '@/domains/dam/types/Asset'\nimport { useAssetSelectStore } from '@/domains/dam/assetSelect/store/assetSelectStore'\nimport { storeToRefs } from 'pinia'\nimport ADatatableOrdering from '@/domains/filters/datatable/components/ADatatableOrdering.vue'\nimport {\n  type DatatableOrderingOption,\n  SORT_BY_SCORE_BEST,\n  SORT_BY_SCORE_DATE,\n} from '@/domains/filters/datatable/utils/datatableColumns'\nimport { SortOrder } from '@/domains/api/types/SortOrder'\nimport { useAssetListFilter } from '@/domains/dam/assetSelect/filter/AssetFilter'\nimport type { Pagination } from '@/domains/api/composables/pagination'\n\nconst props = withDefaults(\n  defineProps<{\n    showTypes?: boolean\n    disableSort?: boolean\n    hideFilterToggle?: boolean\n    preselectAssetType?: DamAssetTypeType | undefined\n    preselectInPodcast?: boolean | null | undefined\n  }>(),\n  {\n    showTypes: false,\n    disableSort: false,\n    hideFilterToggle: false,\n    preselectAssetType: undefined,\n    preselectInPodcast: undefined,\n  }\n)\nconst emit = defineEmits<{\n  (e: 'typeChange', data: { type: DamAssetTypeType; inPodcast: boolean | null }): void\n  (e: 'sortByChange', data: DatatableOrderingOption): void\n}>()\n\nconst sortModel = defineModel<number>('sort', { default: 1, required: false })\n\nconst { t } = useI18n()\nconst { gridView, setGridView } = useGridView()\nconst { mdAndDown } = useDisplay()\n\nwatch(\n  mdAndDown,\n  (isMobile) => {\n    if (isMobile && gridView.value === AssetSelectGridView.Table) {\n      setGridView(AssetSelectGridViewDefault)\n    }\n  },\n  { immediate: true }\n)\nconst { toggleSidebarLeft, sidebarLeft, toggleSidebarRight, sidebarRight } = useSidebar()\nconst assetSelectStore = useAssetSelectStore()\nconst { filterData } = useAssetListFilter()\nconst { assetType, inPodcast } = storeToRefs(assetSelectStore)\n\nconst isImageActive = computed(() => {\n  return assetType.value === DamAssetType.Image\n})\n\nconst isVideoActive = computed(() => {\n  return assetType.value === DamAssetType.Video\n})\n\nconst isPodcastActive = computed(() => {\n  return assetType.value === DamAssetType.Audio && inPodcast.value === true\n})\n\nconst setFilterImage = () => {\n  assetType.value = DamAssetType.Image\n  inPodcast.value = null\n  filterData.podcastIds = []\n  emit('typeChange', { type: DamAssetType.Image, inPodcast: null })\n}\n\nconst setFilterVideo = () => {\n  assetType.value = DamAssetType.Video\n  inPodcast.value = null\n  filterData.podcastIds = []\n  emit('typeChange', { type: DamAssetType.Video, inPodcast: null })\n}\n\nconst setFilterPodcast = () => {\n  assetType.value = DamAssetType.Audio\n  inPodcast.value = true\n  emit('typeChange', { type: DamAssetType.Audio, inPodcast: true })\n}\n\nconst customSortOptions = [\n  {\n    id: 3,\n    titleT: 'common.system.datatable.ordering.mostRelevant',\n    sortBy: { key: SORT_BY_SCORE_BEST, order: SortOrder.Desc },\n  },\n  {\n    id: 1,\n    titleT: 'common.system.datatable.ordering.mostRecent',\n    sortBy: { key: SORT_BY_SCORE_DATE, order: SortOrder.Desc },\n  },\n  {\n    id: 2,\n    titleT: 'common.system.datatable.ordering.oldest',\n    sortBy: { key: SORT_BY_SCORE_DATE, order: SortOrder.Asc },\n  },\n]\n\n// Pagination is shared by every asset select, so a dialog can open with a sort chosen in another one.\n// The ordering then adopts it. That adoption must not be emitted as a change, or the parent would fetch again.\nconst onSortUpdate = (option: DatatableOrderingOption, pagination: Ref<Pagination>) => {\n  const current = pagination.value.sortBy\n  if (current?.key === option.sortBy?.key && current?.order === option.sortBy?.order) return\n  emit('sortByChange', option)\n}\n\nonMounted(() => {\n  if (props.preselectAssetType === DamAssetType.Audio && props.preselectInPodcast) {\n    setFilterPodcast()\n    return\n  }\n  if (props.preselectAssetType === DamAssetType.Video) {\n    setFilterVideo()\n  }\n})\n</script>\n\n<template>\n  <VToolbar\n    density=\"compact\"\n    color=\"transparent\"\n    :height=\"46\"\n    elevation=\"0\"\n    :class=\"hideFilterToggle ? '' : 'border-b'\"\n    class=\"subject-select__second-bar\"\n  >\n    <slot name=\"second-bar\">\n      <div class=\"d-flex flex-column w-100 px-1 align-center\">\n        <div class=\"d-flex justify-space-between w-100 align-center\">\n          <div class=\"d-flex align-center\">\n            <VBtn\n              v-if=\"!hideFilterToggle\"\n              :aria-label=\"t('common.assetSelect.meta.filter.toggle')\"\n              icon\n              :width=\"30\"\n              :height=\"30\"\n              :active=\"sidebarLeft\"\n              @click=\"toggleSidebarLeft\"\n            >\n              <VIcon\n                icon=\"mdi-tune\"\n                :size=\"16\"\n              />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.filter.toggle') }}\n              </VTooltip>\n            </VBtn>\n            <template v-if=\"showTypes\">\n              <VDivider\n                vertical\n                class=\"ml-1 mr-2 my-2\"\n              />\n              <VBtn\n                :aria-label=\"t('common.assetSelect.assetType.image')\"\n                icon\n                :width=\"30\"\n                :height=\"30\"\n                class=\"mr-1\"\n                data-cy=\"button-image-types\"\n                :active=\"isImageActive\"\n                :color=\"isImageActive ? 'secondary' : ''\"\n                :variant=\"isImageActive ? 'flat' : 'text'\"\n                @click.stop=\"setFilterImage\"\n              >\n                <VIcon\n                  icon=\"mdi-image\"\n                  :size=\"16\"\n                />\n                <VTooltip\n                  activator=\"parent\"\n                  location=\"bottom\"\n                >\n                  {{ t('common.assetSelect.assetType.image') }}\n                </VTooltip>\n              </VBtn>\n              <VBtn\n                :aria-label=\"t('common.assetSelect.assetType.video')\"\n                icon\n                :width=\"30\"\n                :height=\"30\"\n                class=\"mr-1\"\n                data-cy=\"button-video-types\"\n                :active=\"isVideoActive\"\n                :color=\"isVideoActive ? 'secondary' : ''\"\n                :variant=\"isVideoActive ? 'flat' : 'text'\"\n                @click.stop=\"setFilterVideo\"\n              >\n                <VIcon\n                  icon=\"mdi-video\"\n                  :size=\"16\"\n                />\n                <VTooltip\n                  activator=\"parent\"\n                  location=\"bottom\"\n                >\n                  {{ t('common.assetSelect.assetType.video') }}\n                </VTooltip>\n              </VBtn>\n              <VBtn\n                :aria-label=\"t('common.assetSelect.filter.inPodcast')\"\n                icon\n                :width=\"30\"\n                :height=\"30\"\n                data-cy=\"button-in-podcast-types\"\n                :active=\"isPodcastActive\"\n                :color=\"isPodcastActive ? 'secondary' : ''\"\n                :variant=\"isPodcastActive ? 'flat' : 'text'\"\n                @click.stop=\"setFilterPodcast\"\n              >\n                <VIcon\n                  icon=\"mdi-podcast\"\n                  :size=\"16\"\n                />\n                <VTooltip\n                  activator=\"parent\"\n                  location=\"bottom\"\n                >\n                  {{ t('common.assetSelect.filter.inPodcast') }}\n                </VTooltip>\n              </VBtn>\n            </template>\n            <slot name=\"second-bar-left\" />\n          </div>\n          <div class=\"d-flex align-center\">\n            <slot name=\"second-bar-right\" />\n            <ADatatableOrdering\n              v-if=\"!disableSort\"\n              v-model=\"sortModel\"\n              :custom-options=\"customSortOptions\"\n              :pagination-update-custom-cb=\"onSortUpdate\"\n            />\n            <VBtn\n              :aria-label=\"t('common.assetSelect.meta.grid.masonry')\"\n              size=\"x-small\"\n              icon\n              class=\"text-medium-emphasis\"\n              variant=\"text\"\n              @click.stop=\"setGridView(AssetSelectGridView.Masonry)\"\n            >\n              <VIcon icon=\"mdi-view-compact\" />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.grid.masonry') }}\n              </VTooltip>\n            </VBtn>\n            <VBtn\n              :aria-label=\"t('common.assetSelect.meta.grid.thumbnail')\"\n              icon\n              class=\"text-medium-emphasis\"\n              size=\"x-small\"\n              variant=\"text\"\n              @click.stop=\"setGridView(AssetSelectGridView.Thumbnail)\"\n            >\n              <VIcon icon=\"mdi-view-grid\" />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.grid.thumbnail') }}\n              </VTooltip>\n            </VBtn>\n            <VBtn\n              v-if=\"!mdAndDown\"\n              :aria-label=\"t('common.assetSelect.meta.grid.table')\"\n              size=\"x-small\"\n              icon\n              class=\"text-medium-emphasis\"\n              variant=\"text\"\n              @click.stop=\"setGridView(AssetSelectGridView.Table)\"\n            >\n              <VIcon icon=\"mdi-view-headline\" />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.grid.table') }}\n              </VTooltip>\n            </VBtn>\n            <VDivider\n              vertical\n              class=\"mx-1 my-2\"\n            />\n            <VBtn\n              :aria-label=\"t('common.assetSelect.meta.info.toggle')\"\n              icon\n              class=\"text-medium-emphasis\"\n              :width=\"30\"\n              :height=\"30\"\n              :active=\"sidebarRight\"\n              @click=\"toggleSidebarRight\"\n            >\n              <VIcon\n                icon=\"mdi-information-outline\"\n                :size=\"16\"\n              />\n              <VTooltip\n                activator=\"parent\"\n                location=\"bottom\"\n              >\n                {{ t('common.assetSelect.meta.info.toggle') }}\n              </VTooltip>\n            </VBtn>\n          </div>\n        </div>\n      </div>\n    </slot>\n  </VToolbar>\n</template>\n"],"mappings":""}

package/dist/domains/dam/assetSelect/components/AssetSelectListBar.vue.d.ts

@@ -11,14 +11,16 @@ type __VLS_ModelProps = {
     'sort'?: number;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_7: {}, __VLS_90: {}, __VLS_92: {};
-type __VLS_Slots = {} & {
-    'second-bar'?: (props: typeof __VLS_7) => any;
-} & {
-    'second-bar-left'?: (props: typeof __VLS_90) => any;
-} & {
-    'second-bar-right'?: (props: typeof __VLS_92) => any;
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        'second-bar'?: (props: {}) => any;
+    } & {
+        'second-bar-left'?: (props: {}) => any;
+    } & {
+        'second-bar-right'?: (props: {}) => any;
+    };
 };
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
 declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:sort": (value: number) => any;
 } & {