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

package/dist/domains/dam/uploadQueue/components/UploadQueueEditable.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadQueueEditable.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_createVNode","_component_VRow","_withCtx","_Fragment","_renderList","_renderSlot","_unref","UploadQueueItemEditable","AssetQueueSelectedSidebar","_createCommentVNode","UploadQueueItemEditable_default","AssetQueueSelectedSidebar_default","_hoisted_1","_hoisted_2","UploadQueueEditable_vue_vue_type_script_setup_true_lang_default","__emit","props","__props","emit","damConfigName","useDamConfigName","queue","useLibraryUploadQueueListBinding","createUploadQueueItemRefresh","list","computed","scrollableContainer","ref","KEYLESS_INPUT_TYPES","isTypedIntoField","target","isInMenu","handleKeyboardNavigation","container","pageScrollAmount","cleanup","onMounted","useEventListener","onBeforeUnmount","openBlock","createElementBlock","normalizeClass","createElementVNode","\"outline\"","createVNode","VRow","withCtx","Fragment","renderList","renderSlot","_ctx","unref","refreshing","refreshItem","item","$event","_cache","createCommentVNode"],"sources":["../../../../../src/domains/dam/uploadQueue/components/UploadQueueEditable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, ref, onBeforeUnmount } from 'vue'\nimport type { UploadQueueItem, UploadQueueKey } from '@/domains/dam/types/UploadQueue'\nimport UploadQueueItemEditable from '@/domains/dam/uploadQueue/components/UploadQueueItemEditable.vue'\nimport AssetQueueSelectedSidebar from '@/domains/dam/uploadQueue/components/AssetQueueSelectedSidebar.vue'\nimport type { DocId, IntegerId } from '@/shared/types/common'\nimport {\n  type UploadQueueListBinding,\n  useLibraryUploadQueueListBinding,\n} from '@/domains/dam/uploadQueue/components/uploadQueueBindings'\nimport { createUploadQueueItemRefresh } from '@/domains/dam/uploadQueue/composables/uploadQueueItemRefresh'\nimport { useEventListener } from '@vueuse/core'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    queueKey: UploadQueueKey\n    extSystem: IntegerId\n    massOperations: boolean\n    configName?: string\n    disableDoneAnimation?: boolean\n    /** What the list asks of its host; without it the library's store, caches, alerts and options. */\n    queue?: UploadQueueListBinding\n    /** From how many rows the mass operations are beside the list. */\n    massOperationsFrom?: number\n    /** The arrow keys, PageUp, PageDown, Home and End scroll the list. */\n    keyboardScroll?: boolean\n  }>(),\n  {\n    configName: undefined,\n    disableDoneAnimation: false,\n    queue: undefined,\n    massOperationsFrom: 1,\n    keyboardScroll: true,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: 'showDetail', data: DocId): void\n}>()\n\ndefineSlots<{\n  /** Default: the library's row, its v-models on the item, as today. */\n  item?(props: {\n    item: UploadQueueItem\n    index: number\n    refreshDisabled: boolean\n    refresh: () => void\n    refreshMayHelp: boolean\n  }): unknown\n  /**\n   * Default: the library's mass operations of `queueKey`, over the library's store even when `queue` is bound: a host\n   * with its own store gives its sidebar here, as admin-dam does.\n   */\n  sidebar?(props: { queueKey: UploadQueueKey }): unknown\n}>()\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\n// Created only when the host binds none: a list with its own binding touches nothing of the library's.\nconst queue = props.queue ?? useLibraryUploadQueueListBinding(() => props.queueKey, damConfigName)\n\nconst { refreshing, refreshItem } = createUploadQueueItemRefresh(queue)\n\nconst list = computed(() => {\n  return queue.items()\n})\n\nconst scrollableContainer = ref<HTMLElement | null>(null)\n\n// Inputs that do nothing with these keys themselves, as a switch: on them the keys still scroll the list.\nconst KEYLESS_INPUT_TYPES = ['checkbox', 'button', 'submit', 'reset', 'image', 'file']\n\n// A key typed into a field of a row moves its caret or its value: it is left to the browser, and the list stays.\nconst isTypedIntoField = (target: EventTarget | null) =>\n  (target instanceof HTMLInputElement && !KEYLESS_INPUT_TYPES.includes(target.type)) ||\n  target instanceof HTMLTextAreaElement ||\n  target instanceof HTMLSelectElement ||\n  (target instanceof HTMLElement && target.isContentEditable)\n\n// So is one pressed in an open menu, as the one of a field: it moves through that menu. Other overlays, as the dialog\n// the list is in or a snackbar, leave the keys to the list.\nconst isInMenu = (target: EventTarget | null) => target instanceof Element && !!target.closest('.v-menu')\n\nconst handleKeyboardNavigation = (e: KeyboardEvent) => {\n  if (!scrollableContainer.value || isTypedIntoField(e.target) || isInMenu(e.target)) return\n\n  const container = scrollableContainer.value\n  const scrollAmount = 100\n  const pageScrollAmount = container.clientHeight - 50\n\n  switch (e.key) {\n    case 'ArrowDown':\n      container.scrollTop += scrollAmount\n      e.preventDefault()\n      break\n    case 'ArrowUp':\n      container.scrollTop -= scrollAmount\n      e.preventDefault()\n      break\n    case 'PageDown':\n      container.scrollTop += pageScrollAmount\n      e.preventDefault()\n      break\n    case 'PageUp':\n      container.scrollTop -= pageScrollAmount\n      e.preventDefault()\n      break\n    case 'Home':\n      container.scrollTop = 0\n      e.preventDefault()\n      break\n    case 'End':\n      container.scrollTop = container.scrollHeight\n      e.preventDefault()\n      break\n  }\n}\n\nlet cleanup: (() => void) | undefined\n\nonMounted(() => {\n  queue.prime(list.value)\n\n  if (props.keyboardScroll) cleanup = useEventListener(document, 'keydown', handleKeyboardNavigation)\n})\n\nonBeforeUnmount(() => {\n  if (cleanup) {\n    cleanup()\n  }\n})\n</script>\n\n<template>\n  <div\n    class=\"asset-queue-editable\"\n    :class=\"{ 'asset-queue-editable--sidebar-active': massOperations }\"\n  >\n    <div class=\"asset-queue-editable__left\">\n      <div\n        ref=\"scrollableContainer\"\n        class=\"overflow-y-auto overflow-x-hidden h-100 mr-md-4\"\n        style=\"outline: none\"\n      >\n        <VRow class=\"dam-upload-queue dam-upload-queue--editable pa-2 mb-5\">\n          <template\n            v-for=\"(item, index) in list\"\n            :key=\"item.key\"\n          >\n            <slot\n              name=\"item\"\n              :item=\"item\"\n              :index=\"index\"\n              :refresh-disabled=\"refreshing\"\n              :refresh=\"() => refreshItem(item)\"\n              :refresh-may-help=\"queue.refreshMayHelp(item)\"\n            >\n              <UploadQueueItemEditable\n                v-model:custom-data=\"item.customData\"\n                v-model:keywords=\"item.keywords\"\n                v-model:authors=\"item.authors\"\n                v-model:main-file-single-use=\"item.mainFileSingleUse\"\n                :main-file-single-use-enabled=\"queue.mainFileSingleUseEnabled\"\n                :ext-system=\"extSystem\"\n                :item=\"item\"\n                :index=\"index\"\n                :queue-key=\"queueKey\"\n                :disable-done-animation=\"disableDoneAnimation\"\n                :refresh-disabled=\"refreshing\"\n                :refresh-may-help=\"queue.refreshMayHelp(item)\"\n                @cancel-item=\"queue.cancel($event.item, $event.index, $event.queueKey)\"\n                @remove-item=\"queue.remove($event)\"\n                @refresh-item=\"refreshItem(item)\"\n                @show-detail=\"emit('showDetail', $event)\"\n              />\n            </slot>\n          </template>\n        </VRow>\n      </div>\n    </div>\n    <div\n      v-if=\"list.length >= massOperationsFrom\"\n      class=\"asset-queue-editable__sidebar border-s\"\n    >\n      <slot\n        name=\"sidebar\"\n        :queue-key=\"queueKey\"\n      >\n        <AssetQueueSelectedSidebar\n          :queue-key=\"queueKey\"\n          :ext-system=\"extSystem\"\n        />\n      </slot>\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"UploadQueueEditable.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_createVNode","_component_VRow","_withCtx","_Fragment","_renderList","_renderSlot","_unref","UploadQueueItemEditable","AssetQueueSelectedSidebar","_createCommentVNode","UploadQueueItemEditable_default","AssetQueueSelectedSidebar_default","_hoisted_1","_hoisted_2","UploadQueueEditable_vue_vue_type_script_setup_true_lang_default","__emit","props","__props","emit","damConfigName","useDamConfigName","queue","useLibraryUploadQueueListBinding","createUploadQueueItemRefresh","list","computed","scrollableContainer","ref","KEYLESS_INPUT_TYPES","isTypedIntoField","target","isInMenu","handleKeyboardNavigation","container","pageScrollAmount","cleanup","onMounted","useEventListener","onBeforeUnmount","openBlock","createElementBlock","normalizeClass","createElementVNode","\"outline\"","createVNode","VRow","withCtx","Fragment","renderList","renderSlot","_ctx","unref","refreshing","refreshItem","item","$event","_cache","createCommentVNode"],"sources":["../../../../../src/domains/dam/uploadQueue/components/UploadQueueEditable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, ref, onBeforeUnmount } from 'vue'\nimport type { UploadQueueItem, UploadQueueKey } from '@/domains/dam/types/UploadQueue'\nimport UploadQueueItemEditable from '@/domains/dam/uploadQueue/components/UploadQueueItemEditable.vue'\nimport AssetQueueSelectedSidebar from '@/domains/dam/uploadQueue/components/AssetQueueSelectedSidebar.vue'\nimport type { DocId, IntegerId } from '@/shared/types/common'\nimport {\n  type UploadQueueListBinding,\n  useLibraryUploadQueueListBinding,\n} from '@/domains/dam/uploadQueue/components/uploadQueueBindings'\nimport { createUploadQueueItemRefresh } from '@/domains/dam/uploadQueue/composables/uploadQueueItemRefresh'\nimport { useEventListener } from '@vueuse/core'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    queueKey: UploadQueueKey\n    extSystem: IntegerId\n    massOperations: boolean\n    configName?: string\n    disableDoneAnimation?: boolean\n    /** What the list needs from its host. Without it the library store, caches, alerts and options are used. */\n    queue?: UploadQueueListBinding\n    /** Minimum row count at which the mass operations are shown beside the list. */\n    massOperationsFrom?: number\n    /** Arrow keys, PageUp, PageDown, Home and End scroll the list. */\n    keyboardScroll?: boolean\n  }>(),\n  {\n    configName: undefined,\n    disableDoneAnimation: false,\n    queue: undefined,\n    massOperationsFrom: 1,\n    keyboardScroll: true,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: 'showDetail', data: DocId): void\n}>()\n\ndefineSlots<{\n  /** Default: the library row, with its v-models on the item. */\n  item?(props: {\n    item: UploadQueueItem\n    index: number\n    refreshDisabled: boolean\n    refresh: () => void\n    refreshMayHelp: boolean\n  }): unknown\n  /**\n   * Default: the library mass operations of `queueKey`, using the library store even when `queue` is bound.\n   * A host with its own store passes its sidebar here, as admin-dam does.\n   */\n  sidebar?(props: { queueKey: UploadQueueKey }): unknown\n}>()\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\n// Created only when the host binds none, so a list with its own binding touches nothing of the library.\nconst queue = props.queue ?? useLibraryUploadQueueListBinding(() => props.queueKey, damConfigName)\n\nconst { refreshing, refreshItem } = createUploadQueueItemRefresh(queue)\n\nconst list = computed(() => {\n  return queue.items()\n})\n\nconst scrollableContainer = ref<HTMLElement | null>(null)\n\n// Inputs that ignore these keys, such as a switch. On them the keys still scroll the list.\nconst KEYLESS_INPUT_TYPES = ['checkbox', 'button', 'submit', 'reset', 'image', 'file']\n\n// A key typed into a row field moves its caret or value. It is left to the browser and the list does not scroll.\nconst isTypedIntoField = (target: EventTarget | null) =>\n  (target instanceof HTMLInputElement && !KEYLESS_INPUT_TYPES.includes(target.type)) ||\n  target instanceof HTMLTextAreaElement ||\n  target instanceof HTMLSelectElement ||\n  (target instanceof HTMLElement && target.isContentEditable)\n\n// The same for a key pressed in an open menu, such as a field's menu: it navigates that menu.\n// Other overlays, such as the containing dialog or a snackbar, leave the keys to the list.\nconst isInMenu = (target: EventTarget | null) => target instanceof Element && !!target.closest('.v-menu')\n\nconst handleKeyboardNavigation = (e: KeyboardEvent) => {\n  if (!scrollableContainer.value || isTypedIntoField(e.target) || isInMenu(e.target)) return\n\n  const container = scrollableContainer.value\n  const scrollAmount = 100\n  const pageScrollAmount = container.clientHeight - 50\n\n  switch (e.key) {\n    case 'ArrowDown':\n      container.scrollTop += scrollAmount\n      e.preventDefault()\n      break\n    case 'ArrowUp':\n      container.scrollTop -= scrollAmount\n      e.preventDefault()\n      break\n    case 'PageDown':\n      container.scrollTop += pageScrollAmount\n      e.preventDefault()\n      break\n    case 'PageUp':\n      container.scrollTop -= pageScrollAmount\n      e.preventDefault()\n      break\n    case 'Home':\n      container.scrollTop = 0\n      e.preventDefault()\n      break\n    case 'End':\n      container.scrollTop = container.scrollHeight\n      e.preventDefault()\n      break\n  }\n}\n\nlet cleanup: (() => void) | undefined\n\nonMounted(() => {\n  queue.prime(list.value)\n\n  if (props.keyboardScroll) cleanup = useEventListener(document, 'keydown', handleKeyboardNavigation)\n})\n\nonBeforeUnmount(() => {\n  if (cleanup) {\n    cleanup()\n  }\n})\n</script>\n\n<template>\n  <div\n    class=\"asset-queue-editable\"\n    :class=\"{ 'asset-queue-editable--sidebar-active': massOperations }\"\n  >\n    <div class=\"asset-queue-editable__left\">\n      <div\n        ref=\"scrollableContainer\"\n        class=\"overflow-y-auto overflow-x-hidden h-100 mr-md-4\"\n        style=\"outline: none\"\n      >\n        <VRow class=\"dam-upload-queue dam-upload-queue--editable pa-2 mb-5\">\n          <template\n            v-for=\"(item, index) in list\"\n            :key=\"item.key\"\n          >\n            <slot\n              name=\"item\"\n              :item=\"item\"\n              :index=\"index\"\n              :refresh-disabled=\"refreshing\"\n              :refresh=\"() => refreshItem(item)\"\n              :refresh-may-help=\"queue.refreshMayHelp(item)\"\n            >\n              <UploadQueueItemEditable\n                v-model:custom-data=\"item.customData\"\n                v-model:keywords=\"item.keywords\"\n                v-model:authors=\"item.authors\"\n                v-model:main-file-single-use=\"item.mainFileSingleUse\"\n                :main-file-single-use-enabled=\"queue.mainFileSingleUseEnabled\"\n                :ext-system=\"extSystem\"\n                :item=\"item\"\n                :index=\"index\"\n                :queue-key=\"queueKey\"\n                :disable-done-animation=\"disableDoneAnimation\"\n                :refresh-disabled=\"refreshing\"\n                :refresh-may-help=\"queue.refreshMayHelp(item)\"\n                @cancel-item=\"queue.cancel($event.item, $event.index, $event.queueKey)\"\n                @remove-item=\"queue.remove($event)\"\n                @refresh-item=\"refreshItem(item)\"\n                @show-detail=\"emit('showDetail', $event)\"\n              />\n            </slot>\n          </template>\n        </VRow>\n      </div>\n    </div>\n    <div\n      v-if=\"list.length >= massOperationsFrom\"\n      class=\"asset-queue-editable__sidebar border-s\"\n    >\n      <slot\n        name=\"sidebar\"\n        :queue-key=\"queueKey\"\n      >\n        <AssetQueueSelectedSidebar\n          :queue-key=\"queueKey\"\n          :ext-system=\"extSystem\"\n        />\n      </slot>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAcA,IAAMoB,IAAQC,GAuBRC,IAAOH,GAoBPI,IAAgBC,EAAiBJ,EAAM,UAAU,GAGjDK,IAAQL,EAAM,SAASM,QAAuCN,EAAM,UAAUG,CAAa,GAE3F,EAAE,eAAY,mBAAgBI,EAA6BF,CAAK,GAEhEG,IAAOC,QACJJ,EAAM,MAAM,CACpB,GAEKK,IAAsBC,EAAwB,IAAI,GAGlDC,IAAsB;GAAC;GAAY;GAAU;GAAU;GAAS;GAAS;EAAM,GAG/EC,KAAoB,MACvBC,aAAkB,oBAAoB,CAACF,EAAoB,SAASE,EAAO,IAAI,KAChFA,aAAkB,uBAClBA,aAAkB,qBACjBA,aAAkB,eAAeA,EAAO,mBAIrCC,KAAY,MAA+BD,aAAkB,WAAW,CAAC,CAACA,EAAO,QAAQ,SAAS,GAElGE,KAA4B,MAAqB;GACrD,IAAI,CAACN,EAAoB,SAASG,EAAiB,EAAE,MAAM,KAAKE,EAAS,EAAE,MAAM,GAAG;GAEpF,IAAME,IAAYP,EAAoB,OAEhCQ,IAAmBD,EAAU,eAAe;GAElD,QAAQ,EAAE,KAAV;IACE,KAAK;KAEH,AADA,EAAU,aAAa,KACvB,EAAE,eAAe;KACjB;IACF,KAAK;KAEH,AADA,EAAU,aAAa,KACvB,EAAE,eAAe;KACjB;IACF,KAAK;KAEH,AADA,EAAU,aAAaC,GACvB,EAAE,eAAe;KACjB;IACF,KAAK;KAEH,AADA,EAAU,aAAaA,GACvB,EAAE,eAAe;KACjB;IACF,KAAK;KAEH,AADA,EAAU,YAAY,GACtB,EAAE,eAAe;KACjB;IACF,KAAK,OAEH,AADA,EAAU,YAAYD,EAAU,cAChC,EAAE,eAAe;GAErB;EACF,GAEIE;E,OAEJC,QAAgB;GAGd,AAFAf,EAAM,MAAMG,EAAK,KAAK,GAElBR,EAAM,mBAAgB,IAAUqB,EAAiB,UAAU,WAAWL,CAAwB;EACpG,CAAC,GAEDM,QAAsB;GACpB,AAAIH,KACFA,EAAQ;EAEZ,CAAC,I,UAICvC,EAAA,GAAAC,EA4DM,OAAA,EA3DJ,OAAKC,EAAA,CAAC,wBAAsB,EAAA,wCACsBmB,EAAA,eAAc,CAAA,CAAA,E,IAEhElB,EAyCM,OAzCNa,GAyCM,CAxCJb,EAuCM,OAAA;GAtCA,SAAA;GAAJ,KAAI2B;GACJ,OAAM;GACN,OAAA,EAAAiB,SAAA,OAAA;E,IAEA3C,EAiCOC,GAAA,EAjCD,OAAM,wDAAuD,GAAA;GAE/D,SAAAC,QAA6B,EAD/BN,EAAA,EAAA,GAAAC,EA+BWM,GAAA,MAAAC,EA9BeoB,EAAA,QAAhB,GAAM,MAGdnB,EA0BO6C,EAAA,QAAA,QAAA;IAxBE;IACC;IACP,iBAAkB5C,EAAA8C,CAAA;IAClB,eAAe9C,EAAA+C,CAAA,CAAW,CAACC,CAAI;IAC/B,gBAAkBhD,EAAAe,CAAA,CAAK,CAAC,eAAeiC,CAAI;GAN9C,SA0BO,CAlBLtD,EAiBEO,GAAA;IAhBQ,eAAa+C,EAAK;IAAL,wBAAA,MAAA,EAAK,aAAUC;IAC5B,UAAUD,EAAK;IAAL,sBAAA,MAAA,EAAK,WAAQC;IACvB,SAASD,EAAK;IAAL,qBAAA,MAAA,EAAK,UAAOC;IACrB,wBAAsBD,EAAK;IAAL,+BAAA,MAAA,EAAK,oBAAiBC;IACnD,gCAA8BjD,EAAAe,CAAA,CAAK,CAAC;IACpC,cAAYJ,EAAA;IACN;IACC;IACP,aAAWA,EAAA;IACX,0BAAwBA,EAAA;IACxB,oBAAkBX,EAAA8C,CAAA;IAClB,oBAAkB9C,EAAAe,CAAA,CAAK,CAAC,eAAeiC,CAAI;IAC3C,eAAW,MAAEhD,EAAAe,CAAA,CAAK,CAAC,OAAOkC,EAAO,MAAMA,EAAO,OAAOA,EAAO,QAAQ;IACpE,cAAW,AAAAC,EAAA,QAAA,MAAElD,EAAAe,CAAA,CAAK,CAAC,OAAOkC,CAAM;IAChC,gBAAY,MAAEjD,EAAA+C,CAAA,CAAW,CAACC,CAAI;IAC9B,cAAW,AAAAE,EAAA,QAAA,MAAEtC,EAAI,cAAeqC,CAAM;;;;;;;;;;;;;;;;;;;;G,EA1BrC,GAAA,KAAA,GAAAD,EAAK,GAAG,C;;E,aAkCd9B,EAAA,MAAK,UAAUP,EAAA,sBADvBrB,EAAA,GAAAC,EAaM,OAbNgB,GAaM,CATJR,EAQO6C,EAAA,QAAA,WAAA,EANJ,UAAWjC,EAAA,SAAQ,SAMf,CAJLjB,EAGEQ,GAAA;GAFC,aAAWS,EAAA;GACX,cAAYA,EAAA"}

package/dist/domains/dam/uploadQueue/components/UploadQueueItemEditable.js

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

package/dist/domains/dam/uploadQueue/components/UploadQueueItemEditable.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadQueueItemEditable.js","names":["_sfc_main","UploadQueueItemEditable_vue_vue_type_script_setup_true_lang_default","UploadQueueItemEditable_default"],"sources":["../../../../../src/domains/dam/uploadQueue/components/UploadQueueItemEditable.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, onUnmounted, ref, type Ref, watch } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport { type AssetCustomData, DamAssetStatusDefault } from '@/domains/dam/types/Asset'\nimport type { DocId, IntegerId } from '@/shared/types/common'\nimport {\n  type UploadQueueItem,\n  UploadQueueItemStatus,\n  type UploadQueueItemStatusType,\n  type UploadQueueKey,\n} from '@/domains/dam/types/UploadQueue'\nimport type { ValidationScope } from '@/shared/types/Validation'\nimport ATableCopyIdButton from '@/domains/ui/buttons/table/components/ATableCopyIdButton.vue'\nimport { prettyBytes } from '@/shared/utils/file'\nimport ASystemEntityScope from '@/domains/form/components/ASystemEntityScope.vue'\nimport AssetCustomMetadataForm from '@/domains/dam/assetDetail/components/AssetCustomMetadataForm.vue'\nimport AssetImage from '@/domains/dam/assetDetail/components/AssetImage.vue'\nimport AuthorRemoteAutocompleteWithCached from '@/domains/dam/author/components/AuthorRemoteAutocompleteWithCached.vue'\nimport { ADamAssetMetadataValidationScopeSymbol } from '@/domains/dam/composables/uploadValidations'\nimport KeywordRemoteAutocompleteWithCached from '@/domains/dam/keyword/components/KeywordRemoteAutocompleteWithCached.vue'\nimport { isNull } from '@/shared/utils/common'\nimport { useDamKeywordAssetTypeConfig } from '@/domains/dam/keyword/composables/damKeywordConfig'\nimport { useDamAuthorAssetTypeConfig } from '@/domains/dam/author/composables/damAuthorConfig'\nimport AActionDeleteButton from '@/domains/ui/buttons/action/components/AActionDeleteButton.vue'\nimport { SHOW_REFRESH_AFTER_SECONDS } from '@/domains/dam/uploadQueue/composables/uploadQueueItemRefresh'\nimport UploadQueueItemErrorOverlay from '@/domains/dam/uploadQueue/components/UploadQueueItemErrorOverlay.vue'\nimport type { DamFieldsDisabledAs } from '@/domains/dam/uploadQueue/components/uploadQueueBindings'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    index: number\n    queueKey: UploadQueueKey\n    extSystem: IntegerId\n    customData: AssetCustomData\n    keywords: DocId[]\n    authors: DocId[]\n    item: UploadQueueItem\n    refreshDisabled: boolean\n    mainFileSingleUse: boolean | null\n    mainFileSingleUseEnabled?: boolean\n    disableDoneAnimation?: boolean\n    /**\n     * A failed row a refresh may still change: its finish request went out and the server has said nothing final\n     * about it, or the original of its duplicate could not be read. The queue knows which rows those are; a row\n     * shown outside a queue has no such state.\n     */\n    refreshMayHelp?: boolean\n    /** Where \"cancel\" is offered. */\n    cancelStatuses?: readonly UploadQueueItemStatusType[]\n    /** The line \"The main file is a duplicate.\" under the title. */\n    duplicateNotice?: boolean\n    /** The form stays off on a duplicate whatever its metadata. */\n    disableFormOnDuplicate?: boolean\n    /** The scope the fields of an editable row report to; a row that cannot be edited reports to none. */\n    validationScope?: ValidationScope\n    /** How keywords and authors look while the row cannot be edited; handed to both inputs as `disabledAs`. */\n    disabledFieldsAs?: DamFieldsDisabledAs\n    /** A duplicate gets no edit button at all: neither the `edit` slot nor its default is drawn. */\n    hideEditOnDuplicate?: boolean\n    /** Whether the row offers refresh, worked out by its host. Without it the row works it out itself. */\n    refreshOffered?: boolean | undefined\n    /** The DAM configuration whose rules and forms the row follows; inherited when not given. */\n    configName?: string\n  }>(),\n  {\n    mainFileSingleUseEnabled: true,\n    disableDoneAnimation: false,\n    refreshMayHelp: false,\n    cancelStatuses: () => [\n      UploadQueueItemStatus.Loading,\n      UploadQueueItemStatus.Waiting,\n      UploadQueueItemStatus.Uploading,\n    ],\n    duplicateNotice: true,\n    disableFormOnDuplicate: false,\n    validationScope: ADamAssetMetadataValidationScopeSymbol,\n    disabledFieldsAs: 'chips',\n    hideEditOnDuplicate: false,\n    // Declared, or Vue would make an absent boolean `false` and the row would never offer refresh by itself.\n    refreshOffered: undefined,\n    configName: undefined,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: 'update:customData', data: AssetCustomData): void\n  (e: 'update:keywords', data: DocId[]): void\n  (e: 'update:authors', data: DocId[]): void\n  (e: 'update:mainFileSingleUse', data: boolean | null): void\n  (e: 'cancelItem', data: { index: number; item: UploadQueueItem; queueKey: UploadQueueKey }): void\n  (e: 'removeItem', index: number): void\n  (e: 'showDetail', data: DocId): void\n  (e: 'refreshItem', data: { index: number; assetId: DocId }): void\n}>()\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\ndefineSlots<{\n  /** Over the picture, under the error overlay. */\n  'image-overlay'?(props: { item: UploadQueueItem }): unknown\n  /** Left of the action line. Default: \"Edit in Media Library\", disabled without metadata, emits `showDetail`. */\n  edit?(props: { item: UploadQueueItem }): unknown\n  /** Last of the action line. Default: \"Remove from queue\" while it is offered, emits `removeItem`. */\n  remove?(props: { item: UploadQueueItem; index: number; offered: boolean }): unknown\n}>()\n\nconst IMAGE_ASPECT_RATIO = 16 / 9\n\nconst customData = computed({\n  get() {\n    return props.customData\n  },\n  set(newValue) {\n    emit('update:customData', { ...props.customData, ...newValue })\n  },\n})\n\nconst keywords = computed({\n  get() {\n    return props.keywords\n  },\n  set(newValue) {\n    emit('update:keywords', [...newValue])\n  },\n})\n\nconst authors = computed({\n  get() {\n    return props.authors\n  },\n  set(newValue) {\n    emit('update:authors', [...newValue])\n  },\n})\n\nconst mainFileSingleUse = computed({\n  get() {\n    return props.mainFileSingleUse\n  },\n  set(newValue) {\n    emit('update:mainFileSingleUse', newValue)\n  },\n})\n\nconst { t } = useI18n()\n\n// The save skips an item whose metadata cannot be edited, so nothing in its row is validated: it could not be\n// put right. A scope is read once, when a field is set up - hence the key on the form.\nconst metadataValidationScope = computed(() => {\n  return props.item.canEditMetadata ? props.validationScope : false\n})\n\nconst processingStatuses: readonly UploadQueueItemStatusType[] = [\n  UploadQueueItemStatus.Processing,\n  UploadQueueItemStatus.Loading,\n]\nconst processing = computed(() => {\n  return processingStatuses.includes(props.item.status)\n})\nconst waiting = computed(() => {\n  return props.item.status === UploadQueueItemStatus.Waiting\n})\nconst done = computed(() => {\n  return !props.disableDoneAnimation && props.item.status === UploadQueueItemStatus.Uploaded\n})\nconst uploading = computed(() => {\n  return props.item.status === UploadQueueItemStatus.Uploading\n})\nconst uploadProgress = computed(() => {\n  return props.item.progress.progressPercent\n})\n\nconst imageSrc = computed(() => {\n  return props.item.imagePreview ? props.item.imagePreview.url : undefined\n})\nconst assetType = computed(() => {\n  return props.item.assetType\n})\nconst status = computed(() => {\n  if (!props.item) return DamAssetStatusDefault\n  return props.item.assetStatus\n})\n\nconst cancelItem = () => {\n  emit('cancelItem', { index: props.index, item: props.item, queueKey: props.queueKey })\n}\n\nconst showCancel = computed(() => {\n  return props.cancelStatuses.includes(props.item.status)\n})\n\n// Of a row that has not failed: offered once it has waited, for its file or for its metadata.\nconst refreshDue = ref(false)\nconst refreshTimer: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined)\n// A failed row offers refresh only while one may still change it. One whose chunk the server never took, or\n// whose file the server has failed, has nothing a refresh could find.\nconst offeredByRow = computed(() => {\n  if (props.item.status === UploadQueueItemStatus.Failed) return props.refreshMayHelp && !isNull(props.item.assetId)\n  return refreshDue.value\n})\nconst showRefresh = computed(() => {\n  return props.refreshOffered ?? offeredByRow.value\n})\n// Remove comes with refresh, and a failed row has it at once: nothing else takes such a row out of the queue.\nconst showRemove = computed(() => {\n  return showRefresh.value || props.item.status === UploadQueueItemStatus.Failed\n})\n\nconst showDetail = async () => {\n  if (isNull(props.item.assetId)) return\n  emit('showDetail', props.item.assetId)\n}\n\nconst refresh = () => {\n  if (props.item.assetId) {\n    emit('refreshItem', { index: props.index, assetId: props.item.assetId })\n  }\n}\n\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst { keywordRequired, keywordEnabled } = useDamKeywordAssetTypeConfig(\n  // eslint-disable-next-line vue/no-ref-object-reactivity-loss\n  assetType.value,\n  props.extSystem,\n  damConfigName\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst { authorRequired, authorEnabled } = useDamAuthorAssetTypeConfig(\n  // eslint-disable-next-line vue/no-ref-object-reactivity-loss\n  assetType.value,\n  props.extSystem,\n  damConfigName\n)\n\nwatch(\n  () => props.item.status,\n  async (newValue) => {\n    if (newValue === UploadQueueItemStatus.Uploading || newValue === UploadQueueItemStatus.Processing) {\n      clearTimeout(refreshTimer.value)\n      refreshTimer.value = setTimeout(() => {\n        if (newValue === UploadQueueItemStatus.Uploading || newValue === UploadQueueItemStatus.Processing) {\n          refreshDue.value = true\n        }\n      }, SHOW_REFRESH_AFTER_SECONDS * 1000)\n    } else if (newValue === UploadQueueItemStatus.Uploaded) {\n      clearTimeout(refreshTimer.value)\n      refreshTimer.value = undefined\n      refreshDue.value = false\n      // An uploaded row whose metadata has not come by then has a disabled form, and the save skips it. Refresh\n      // loads the metadata.\n      refreshTimer.value = setTimeout(() => {\n        if (props.item.status !== UploadQueueItemStatus.Uploaded || props.item.canEditMetadata) return\n        refreshDue.value = true\n      }, SHOW_REFRESH_AFTER_SECONDS * 1000)\n    } else if (newValue === UploadQueueItemStatus.Failed) {\n      // Its wait is over: what a failed row offers follows `refreshMayHelp`, at once.\n      clearTimeout(refreshTimer.value)\n      refreshTimer.value = undefined\n      refreshDue.value = false\n    }\n  },\n  { immediate: true }\n)\n\nwatch(\n  () => props.item.canEditMetadata,\n  (canEdit) => {\n    // The metadata of an uploaded row came after all, by its notification or by that refresh.\n    if (canEdit && props.item.status === UploadQueueItemStatus.Uploaded) refreshDue.value = false\n  }\n)\n\nonUnmounted(() => {\n  clearTimeout(refreshTimer.value)\n  refreshTimer.value = undefined\n})\n</script>\n\n<template>\n  <VCol\n    xxl=\"2\"\n    xl=\"3\"\n    md=\"4\"\n    sm=\"6\"\n    cols=\"12\"\n  >\n    <div class=\"dam-upload-queue__item\">\n      <div class=\"dam-upload-queue__item-card\">\n        <div class=\"position-relative\">\n          <AssetImage\n            :asset-type=\"assetType\"\n            :asset-status=\"status\"\n            :src=\"imageSrc\"\n            background-color=\"#ccc\"\n            :show-uploading=\"uploading\"\n            :show-processing=\"processing\"\n            :show-waiting=\"waiting\"\n            :show-done=\"done\"\n            :uploading-progress=\"uploadProgress\"\n            :remaining-time=\"item.progress.remainingTime\"\n            use-component\n            cover\n            :aspect-ratio=\"IMAGE_ASPECT_RATIO\"\n          />\n          <slot\n            name=\"image-overlay\"\n            :item=\"item\"\n          />\n          <UploadQueueItemErrorOverlay\n            v-if=\"item.error.hasError\"\n            :error=\"item.error\"\n          />\n        </div>\n        <VRow\n          density=\"compact\"\n          class=\"my-2\"\n        >\n          <VCol>\n            <div class=\"w-100 d-flex justify-space-between align-center\">\n              <div>\n                <template v-if=\"!(hideEditOnDuplicate && item.isDuplicate)\">\n                  <slot\n                    name=\"edit\"\n                    :item=\"item\"\n                  >\n                    <VBtn\n                      size=\"small\"\n                      variant=\"text\"\n                      :disabled=\"!item.canEditMetadata\"\n                      @click.stop=\"showDetail\"\n                    >\n                      {{ t('common.damImage.image.button.editAsset') }}\n                    </VBtn>\n                  </slot>\n                </template>\n              </div>\n              <div>\n                <ATableCopyIdButton\n                  v-if=\"item.assetId\"\n                  :id=\"item.assetId\"\n                  button-t=\"common.damImage.queueItem.copyAssetId\"\n                  size=\"small\"\n                />\n                <VBtn\n                  v-if=\"showRefresh\"\n                  :aria-label=\"t('common.button.refresh')\"\n                  icon\n                  size=\"small\"\n                  variant=\"text\"\n                  :disabled=\"refreshDisabled\"\n                  @click.stop=\"refresh\"\n                >\n                  <VIcon icon=\"mdi-refresh\" />\n                  <VTooltip\n                    activator=\"parent\"\n                    location=\"bottom\"\n                  >\n                    {{ t('common.button.refresh') }}\n                  </VTooltip>\n                </VBtn>\n                <VBtn\n                  v-if=\"showCancel\"\n                  :aria-label=\"t('common.button.cancel')\"\n                  icon\n                  size=\"small\"\n                  variant=\"text\"\n                  @click.stop=\"cancelItem\"\n                >\n                  <VIcon icon=\"mdi-close-circle-outline\" />\n                  <VTooltip\n                    activator=\"parent\"\n                    location=\"bottom\"\n                  >\n                    {{ t('common.button.cancel') }}\n                  </VTooltip>\n                </VBtn>\n                <slot\n                  name=\"remove\"\n                  :item=\"item\"\n                  :index=\"index\"\n                  :offered=\"showRemove\"\n                >\n                  <AActionDeleteButton\n                    v-if=\"showRemove\"\n                    variant=\"icon\"\n                    button-class=\"\"\n                    dialog-message-t=\"common.damImage.queueItem.removeFromQueue\"\n                    @delete-record=\"emit('removeItem', index)\"\n                  />\n                </slot>\n              </div>\n            </div>\n          </VCol>\n        </VRow>\n        <VRow\n          v-if=\"item.displayTitle\"\n          density=\"compact\"\n          class=\"my-2 mb-3 mt-0 text-body-small\"\n        >\n          <VCol class=\"pt-0\">\n            {{ t('common.damImage.queueItem.displayTitle') }}: {{ item.displayTitle }}\n            <span v-if=\"item.file?.size\">&nbsp;({{ prettyBytes(item.file.size) }})</span>\n          </VCol>\n        </VRow>\n        <VRow\n          v-if=\"duplicateNotice && item.isDuplicate\"\n          class=\"text-body-small text-warning\"\n        >\n          <VCol class=\"pt-0\">\n            {{ t('common.damImage.asset.detail.info.status.duplicate') }}\n          </VCol>\n        </VRow>\n        <VForm :disabled=\"!item.canEditMetadata || (disableFormOnDuplicate && item.isDuplicate)\">\n          <AssetCustomMetadataForm\n            v-if=\"item\"\n            :key=\"item.canEditMetadata ? 'validated' : 'skipped'\"\n            v-model=\"customData\"\n            :ext-system=\"extSystem\"\n            :asset-type=\"assetType\"\n            :validation-scope=\"metadataValidationScope\"\n          >\n            <template #after-pinned>\n              <VRow\n                v-if=\"keywordEnabled\"\n                density=\"compact\"\n                class=\"my-2\"\n              >\n                <VCol>\n                  <ASystemEntityScope\n                    subject=\"keyword\"\n                    system=\"dam\"\n                  >\n                    <KeywordRemoteAutocompleteWithCached\n                      v-model=\"keywords\"\n                      :queue-id=\"queueKey\"\n                      :ext-system=\"extSystem\"\n                      :label=\"t('common.damImage.asset.model.keywords')\"\n                      clearable\n                      multiple\n                      :required=\"keywordRequired\"\n                      :validation-scope=\"metadataValidationScope\"\n                      :disabled=\"!item.canEditMetadata\"\n                      :disabled-as=\"disabledFieldsAs\"\n                    />\n                  </ASystemEntityScope>\n                </VCol>\n              </VRow>\n              <VRow\n                v-if=\"authorEnabled\"\n                density=\"compact\"\n                class=\"my-2\"\n              >\n                <VCol>\n                  <ASystemEntityScope\n                    subject=\"author\"\n                    system=\"dam\"\n                  >\n                    <AuthorRemoteAutocompleteWithCached\n                      v-model=\"authors\"\n                      :queue-id=\"queueKey\"\n                      :label=\"t('common.damImage.asset.model.authors')\"\n                      :author-conflicts=\"item.authorConflicts\"\n                      :ext-system=\"extSystem\"\n                      clearable\n                      multiple\n                      :required=\"authorRequired\"\n                      :validation-scope=\"metadataValidationScope\"\n                      :disabled=\"!item.canEditMetadata\"\n                      :disabled-as=\"disabledFieldsAs\"\n                    />\n                  </ASystemEntityScope>\n                </VCol>\n              </VRow>\n              <VRow\n                v-if=\"mainFileSingleUseEnabled\"\n                density=\"compact\"\n                class=\"my-2\"\n              >\n                <VCol>\n                  <VSwitch\n                    v-model=\"mainFileSingleUse\"\n                    :label=\"t('common.damImage.asset.model.mainFileSingleUse')\"\n                  />\n                </VCol>\n              </VRow>\n            </template>\n          </AssetCustomMetadataForm>\n        </VForm>\n      </div>\n    </div>\n  </VCol>\n</template>\n"],"mappings":""}
+{"version":3,"file":"UploadQueueItemEditable.js","names":["_sfc_main","UploadQueueItemEditable_vue_vue_type_script_setup_true_lang_default","UploadQueueItemEditable_default"],"sources":["../../../../../src/domains/dam/uploadQueue/components/UploadQueueItemEditable.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, onUnmounted, ref, type Ref, watch } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport { type AssetCustomData, DamAssetStatusDefault } from '@/domains/dam/types/Asset'\nimport type { DocId, IntegerId } from '@/shared/types/common'\nimport {\n  type UploadQueueItem,\n  UploadQueueItemStatus,\n  type UploadQueueItemStatusType,\n  type UploadQueueKey,\n} from '@/domains/dam/types/UploadQueue'\nimport type { ValidationScope } from '@/shared/types/Validation'\nimport ATableCopyIdButton from '@/domains/ui/buttons/table/components/ATableCopyIdButton.vue'\nimport { prettyBytes } from '@/shared/utils/file'\nimport ASystemEntityScope from '@/domains/form/components/ASystemEntityScope.vue'\nimport AssetCustomMetadataForm from '@/domains/dam/assetDetail/components/AssetCustomMetadataForm.vue'\nimport AssetImage from '@/domains/dam/assetDetail/components/AssetImage.vue'\nimport AuthorRemoteAutocompleteWithCached from '@/domains/dam/author/components/AuthorRemoteAutocompleteWithCached.vue'\nimport { ADamAssetMetadataValidationScopeSymbol } from '@/domains/dam/composables/uploadValidations'\nimport KeywordRemoteAutocompleteWithCached from '@/domains/dam/keyword/components/KeywordRemoteAutocompleteWithCached.vue'\nimport { isNull } from '@/shared/utils/common'\nimport { useDamKeywordAssetTypeConfig } from '@/domains/dam/keyword/composables/damKeywordConfig'\nimport { useDamAuthorAssetTypeConfig } from '@/domains/dam/author/composables/damAuthorConfig'\nimport AActionDeleteButton from '@/domains/ui/buttons/action/components/AActionDeleteButton.vue'\nimport { SHOW_REFRESH_AFTER_SECONDS } from '@/domains/dam/uploadQueue/composables/uploadQueueItemRefresh'\nimport UploadQueueItemErrorOverlay from '@/domains/dam/uploadQueue/components/UploadQueueItemErrorOverlay.vue'\nimport type { DamFieldsDisabledAs } from '@/domains/dam/uploadQueue/components/uploadQueueBindings'\nimport { useDamConfigName } from '@/domains/dam/composables/damConfigName'\n\nconst props = withDefaults(\n  defineProps<{\n    index: number\n    queueKey: UploadQueueKey\n    extSystem: IntegerId\n    customData: AssetCustomData\n    keywords: DocId[]\n    authors: DocId[]\n    item: UploadQueueItem\n    refreshDisabled: boolean\n    mainFileSingleUse: boolean | null\n    mainFileSingleUseEnabled?: boolean\n    disableDoneAnimation?: boolean\n    /**\n     * A failed row that a refresh may still change: its finish request went out and the\n     * server gave no final answer, or the original of its duplicate could not be read.\n     * The queue knows these rows. A row shown outside a queue has no such state.\n     */\n    refreshMayHelp?: boolean\n    /** Statuses in which \"cancel\" is offered. */\n    cancelStatuses?: readonly UploadQueueItemStatusType[]\n    /** Shows the line \"The main file is a duplicate.\" under the title. */\n    duplicateNotice?: boolean\n    /** Keeps the form disabled on a duplicate regardless of its metadata. */\n    disableFormOnDuplicate?: boolean\n    /** The scope the fields of an editable row report to. A non-editable row reports to none. */\n    validationScope?: ValidationScope\n    /** How keywords and authors look while the row is not editable. Passed to both inputs as `disabledAs`. */\n    disabledFieldsAs?: DamFieldsDisabledAs\n    /** A duplicate gets no edit button: neither the `edit` slot nor its default is rendered. */\n    hideEditOnDuplicate?: boolean\n    /** Whether the row offers refresh, decided by the host. Without it the row decides itself. */\n    refreshOffered?: boolean | undefined\n    /** The DAM configuration whose rules and forms the row follows. Inherited when not given. */\n    configName?: string\n  }>(),\n  {\n    mainFileSingleUseEnabled: true,\n    disableDoneAnimation: false,\n    refreshMayHelp: false,\n    cancelStatuses: () => [\n      UploadQueueItemStatus.Loading,\n      UploadQueueItemStatus.Waiting,\n      UploadQueueItemStatus.Uploading,\n    ],\n    duplicateNotice: true,\n    disableFormOnDuplicate: false,\n    validationScope: ADamAssetMetadataValidationScopeSymbol,\n    disabledFieldsAs: 'chips',\n    hideEditOnDuplicate: false,\n    // Declared explicitly, otherwise Vue casts an absent boolean to `false` and the row never offers refresh by itself.\n    refreshOffered: undefined,\n    configName: undefined,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: 'update:customData', data: AssetCustomData): void\n  (e: 'update:keywords', data: DocId[]): void\n  (e: 'update:authors', data: DocId[]): void\n  (e: 'update:mainFileSingleUse', data: boolean | null): void\n  (e: 'cancelItem', data: { index: number; item: UploadQueueItem; queueKey: UploadQueueKey }): void\n  (e: 'removeItem', index: number): void\n  (e: 'showDetail', data: DocId): void\n  (e: 'refreshItem', data: { index: number; assetId: DocId }): void\n}>()\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst damConfigName = useDamConfigName(props.configName)\n\ndefineSlots<{\n  /** Rendered over the picture, under the error overlay. */\n  'image-overlay'?(props: { item: UploadQueueItem }): unknown\n  /** Left of the action line. Default: \"Edit in Media Library\", disabled without metadata, emits `showDetail`. */\n  edit?(props: { item: UploadQueueItem }): unknown\n  /** Last in the action line. Default: \"Remove from queue\" while offered, emits `removeItem`. */\n  remove?(props: { item: UploadQueueItem; index: number; offered: boolean }): unknown\n}>()\n\nconst IMAGE_ASPECT_RATIO = 16 / 9\n\nconst customData = computed({\n  get() {\n    return props.customData\n  },\n  set(newValue) {\n    emit('update:customData', { ...props.customData, ...newValue })\n  },\n})\n\nconst keywords = computed({\n  get() {\n    return props.keywords\n  },\n  set(newValue) {\n    emit('update:keywords', [...newValue])\n  },\n})\n\nconst authors = computed({\n  get() {\n    return props.authors\n  },\n  set(newValue) {\n    emit('update:authors', [...newValue])\n  },\n})\n\nconst mainFileSingleUse = computed({\n  get() {\n    return props.mainFileSingleUse\n  },\n  set(newValue) {\n    emit('update:mainFileSingleUse', newValue)\n  },\n})\n\nconst { t } = useI18n()\n\n// The save skips an item whose metadata cannot be edited, so its row is not validated: the user could not fix it.\n// A field reads its scope only once at setup, hence the key on the form.\nconst metadataValidationScope = computed(() => {\n  return props.item.canEditMetadata ? props.validationScope : false\n})\n\nconst processingStatuses: readonly UploadQueueItemStatusType[] = [\n  UploadQueueItemStatus.Processing,\n  UploadQueueItemStatus.Loading,\n]\nconst processing = computed(() => {\n  return processingStatuses.includes(props.item.status)\n})\nconst waiting = computed(() => {\n  return props.item.status === UploadQueueItemStatus.Waiting\n})\nconst done = computed(() => {\n  return !props.disableDoneAnimation && props.item.status === UploadQueueItemStatus.Uploaded\n})\nconst uploading = computed(() => {\n  return props.item.status === UploadQueueItemStatus.Uploading\n})\nconst uploadProgress = computed(() => {\n  return props.item.progress.progressPercent\n})\n\nconst imageSrc = computed(() => {\n  return props.item.imagePreview ? props.item.imagePreview.url : undefined\n})\nconst assetType = computed(() => {\n  return props.item.assetType\n})\nconst status = computed(() => {\n  if (!props.item) return DamAssetStatusDefault\n  return props.item.assetStatus\n})\n\nconst cancelItem = () => {\n  emit('cancelItem', { index: props.index, item: props.item, queueKey: props.queueKey })\n}\n\nconst showCancel = computed(() => {\n  return props.cancelStatuses.includes(props.item.status)\n})\n\n// For a row that has not failed: refresh is offered after it has waited for its file or its metadata.\nconst refreshDue = ref(false)\nconst refreshTimer: Ref<ReturnType<typeof setTimeout> | undefined> = ref(undefined)\n// A failed row offers refresh only while a refresh can still change it.\n// A row whose chunk the server never took, or whose file the server failed, has nothing a refresh could find.\nconst offeredByRow = computed(() => {\n  if (props.item.status === UploadQueueItemStatus.Failed) return props.refreshMayHelp && !isNull(props.item.assetId)\n  return refreshDue.value\n})\nconst showRefresh = computed(() => {\n  return props.refreshOffered ?? offeredByRow.value\n})\n// Remove comes with refresh, and a failed row gets it at once: nothing else takes such a row out of the queue.\nconst showRemove = computed(() => {\n  return showRefresh.value || props.item.status === UploadQueueItemStatus.Failed\n})\n\nconst showDetail = async () => {\n  if (isNull(props.item.assetId)) return\n  emit('showDetail', props.item.assetId)\n}\n\nconst refresh = () => {\n  if (props.item.assetId) {\n    emit('refreshItem', { index: props.index, assetId: props.item.assetId })\n  }\n}\n\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst { keywordRequired, keywordEnabled } = useDamKeywordAssetTypeConfig(\n  // eslint-disable-next-line vue/no-ref-object-reactivity-loss\n  assetType.value,\n  props.extSystem,\n  damConfigName\n)\n// eslint-disable-next-line vue/no-setup-props-reactivity-loss\nconst { authorRequired, authorEnabled } = useDamAuthorAssetTypeConfig(\n  // eslint-disable-next-line vue/no-ref-object-reactivity-loss\n  assetType.value,\n  props.extSystem,\n  damConfigName\n)\n\nwatch(\n  () => props.item.status,\n  async (newValue) => {\n    if (newValue === UploadQueueItemStatus.Uploading || newValue === UploadQueueItemStatus.Processing) {\n      clearTimeout(refreshTimer.value)\n      refreshTimer.value = setTimeout(() => {\n        if (newValue === UploadQueueItemStatus.Uploading || newValue === UploadQueueItemStatus.Processing) {\n          refreshDue.value = true\n        }\n      }, SHOW_REFRESH_AFTER_SECONDS * 1000)\n    } else if (newValue === UploadQueueItemStatus.Uploaded) {\n      clearTimeout(refreshTimer.value)\n      refreshTimer.value = undefined\n      refreshDue.value = false\n      // An uploaded row whose metadata has not arrived by then has a\n      // disabled form and the save skips it. Refresh loads the metadata.\n      refreshTimer.value = setTimeout(() => {\n        if (props.item.status !== UploadQueueItemStatus.Uploaded || props.item.canEditMetadata) return\n        refreshDue.value = true\n      }, SHOW_REFRESH_AFTER_SECONDS * 1000)\n    } else if (newValue === UploadQueueItemStatus.Failed) {\n      // The wait is over. For a failed row, the offer follows `refreshMayHelp` immediately.\n      clearTimeout(refreshTimer.value)\n      refreshTimer.value = undefined\n      refreshDue.value = false\n    }\n  },\n  { immediate: true }\n)\n\nwatch(\n  () => props.item.canEditMetadata,\n  (canEdit) => {\n    // The metadata arrived after all, by notification or by refresh.\n    if (canEdit && props.item.status === UploadQueueItemStatus.Uploaded) refreshDue.value = false\n  }\n)\n\nonUnmounted(() => {\n  clearTimeout(refreshTimer.value)\n  refreshTimer.value = undefined\n})\n</script>\n\n<template>\n  <VCol\n    xxl=\"2\"\n    xl=\"3\"\n    md=\"4\"\n    sm=\"6\"\n    cols=\"12\"\n  >\n    <div class=\"dam-upload-queue__item\">\n      <div class=\"dam-upload-queue__item-card\">\n        <div class=\"position-relative\">\n          <AssetImage\n            :asset-type=\"assetType\"\n            :asset-status=\"status\"\n            :src=\"imageSrc\"\n            background-color=\"#ccc\"\n            :show-uploading=\"uploading\"\n            :show-processing=\"processing\"\n            :show-waiting=\"waiting\"\n            :show-done=\"done\"\n            :uploading-progress=\"uploadProgress\"\n            :remaining-time=\"item.progress.remainingTime\"\n            use-component\n            cover\n            :aspect-ratio=\"IMAGE_ASPECT_RATIO\"\n          />\n          <slot\n            name=\"image-overlay\"\n            :item=\"item\"\n          />\n          <UploadQueueItemErrorOverlay\n            v-if=\"item.error.hasError\"\n            :error=\"item.error\"\n          />\n        </div>\n        <VRow\n          density=\"compact\"\n          class=\"my-2\"\n        >\n          <VCol>\n            <div class=\"w-100 d-flex justify-space-between align-center\">\n              <div>\n                <template v-if=\"!(hideEditOnDuplicate && item.isDuplicate)\">\n                  <slot\n                    name=\"edit\"\n                    :item=\"item\"\n                  >\n                    <VBtn\n                      size=\"small\"\n                      variant=\"text\"\n                      :disabled=\"!item.canEditMetadata\"\n                      @click.stop=\"showDetail\"\n                    >\n                      {{ t('common.damImage.image.button.editAsset') }}\n                    </VBtn>\n                  </slot>\n                </template>\n              </div>\n              <div>\n                <ATableCopyIdButton\n                  v-if=\"item.assetId\"\n                  :id=\"item.assetId\"\n                  button-t=\"common.damImage.queueItem.copyAssetId\"\n                  size=\"small\"\n                />\n                <VBtn\n                  v-if=\"showRefresh\"\n                  :aria-label=\"t('common.button.refresh')\"\n                  icon\n                  size=\"small\"\n                  variant=\"text\"\n                  :disabled=\"refreshDisabled\"\n                  @click.stop=\"refresh\"\n                >\n                  <VIcon icon=\"mdi-refresh\" />\n                  <VTooltip\n                    activator=\"parent\"\n                    location=\"bottom\"\n                  >\n                    {{ t('common.button.refresh') }}\n                  </VTooltip>\n                </VBtn>\n                <VBtn\n                  v-if=\"showCancel\"\n                  :aria-label=\"t('common.button.cancel')\"\n                  icon\n                  size=\"small\"\n                  variant=\"text\"\n                  @click.stop=\"cancelItem\"\n                >\n                  <VIcon icon=\"mdi-close-circle-outline\" />\n                  <VTooltip\n                    activator=\"parent\"\n                    location=\"bottom\"\n                  >\n                    {{ t('common.button.cancel') }}\n                  </VTooltip>\n                </VBtn>\n                <slot\n                  name=\"remove\"\n                  :item=\"item\"\n                  :index=\"index\"\n                  :offered=\"showRemove\"\n                >\n                  <AActionDeleteButton\n                    v-if=\"showRemove\"\n                    variant=\"icon\"\n                    button-class=\"\"\n                    dialog-message-t=\"common.damImage.queueItem.removeFromQueue\"\n                    @delete-record=\"emit('removeItem', index)\"\n                  />\n                </slot>\n              </div>\n            </div>\n          </VCol>\n        </VRow>\n        <VRow\n          v-if=\"item.displayTitle\"\n          density=\"compact\"\n          class=\"my-2 mb-3 mt-0 text-body-small\"\n        >\n          <VCol class=\"pt-0\">\n            {{ t('common.damImage.queueItem.displayTitle') }}: {{ item.displayTitle }}\n            <span v-if=\"item.file?.size\">&nbsp;({{ prettyBytes(item.file.size) }})</span>\n          </VCol>\n        </VRow>\n        <VRow\n          v-if=\"duplicateNotice && item.isDuplicate\"\n          class=\"text-body-small text-warning\"\n        >\n          <VCol class=\"pt-0\">\n            {{ t('common.damImage.asset.detail.info.status.duplicate') }}\n          </VCol>\n        </VRow>\n        <VForm :disabled=\"!item.canEditMetadata || (disableFormOnDuplicate && item.isDuplicate)\">\n          <AssetCustomMetadataForm\n            v-if=\"item\"\n            :key=\"item.canEditMetadata ? 'validated' : 'skipped'\"\n            v-model=\"customData\"\n            :ext-system=\"extSystem\"\n            :asset-type=\"assetType\"\n            :validation-scope=\"metadataValidationScope\"\n          >\n            <template #after-pinned>\n              <VRow\n                v-if=\"keywordEnabled\"\n                density=\"compact\"\n                class=\"my-2\"\n              >\n                <VCol>\n                  <ASystemEntityScope\n                    subject=\"keyword\"\n                    system=\"dam\"\n                  >\n                    <KeywordRemoteAutocompleteWithCached\n                      v-model=\"keywords\"\n                      :queue-id=\"queueKey\"\n                      :ext-system=\"extSystem\"\n                      :label=\"t('common.damImage.asset.model.keywords')\"\n                      clearable\n                      multiple\n                      :required=\"keywordRequired\"\n                      :validation-scope=\"metadataValidationScope\"\n                      :disabled=\"!item.canEditMetadata\"\n                      :disabled-as=\"disabledFieldsAs\"\n                    />\n                  </ASystemEntityScope>\n                </VCol>\n              </VRow>\n              <VRow\n                v-if=\"authorEnabled\"\n                density=\"compact\"\n                class=\"my-2\"\n              >\n                <VCol>\n                  <ASystemEntityScope\n                    subject=\"author\"\n                    system=\"dam\"\n                  >\n                    <AuthorRemoteAutocompleteWithCached\n                      v-model=\"authors\"\n                      :queue-id=\"queueKey\"\n                      :label=\"t('common.damImage.asset.model.authors')\"\n                      :author-conflicts=\"item.authorConflicts\"\n                      :ext-system=\"extSystem\"\n                      clearable\n                      multiple\n                      :required=\"authorRequired\"\n                      :validation-scope=\"metadataValidationScope\"\n                      :disabled=\"!item.canEditMetadata\"\n                      :disabled-as=\"disabledFieldsAs\"\n                    />\n                  </ASystemEntityScope>\n                </VCol>\n              </VRow>\n              <VRow\n                v-if=\"mainFileSingleUseEnabled\"\n                density=\"compact\"\n                class=\"my-2\"\n              >\n                <VCol>\n                  <VSwitch\n                    v-model=\"mainFileSingleUse\"\n                    :label=\"t('common.damImage.asset.model.mainFileSingleUse')\"\n                  />\n                </VCol>\n              </VRow>\n            </template>\n          </AssetCustomMetadataForm>\n        </VForm>\n      </div>\n    </div>\n  </VCol>\n</template>\n"],"mappings":""}

package/dist/domains/dam/uploadQueue/components/UploadQueueItemEditable.vue.d.ts

@@ -16,30 +16,30 @@ type __VLS_Props = {
     mainFileSingleUseEnabled?: boolean;
     disableDoneAnimation?: boolean;
     /**
-     * A failed row a refresh may still change: its finish request went out and the server has said nothing final
-     * about it, or the original of its duplicate could not be read. The queue knows which rows those are; a row
-     * shown outside a queue has no such state.
+     * A failed row that a refresh may still change: its finish request went out and the
+     * server gave no final answer, or the original of its duplicate could not be read.
+     * The queue knows these rows. A row shown outside a queue has no such state.
      */
     refreshMayHelp?: boolean;
-    /** Where "cancel" is offered. */
+    /** Statuses in which "cancel" is offered. */
     cancelStatuses?: readonly UploadQueueItemStatusType[];
-    /** The line "The main file is a duplicate." under the title. */
+    /** Shows the line "The main file is a duplicate." under the title. */
     duplicateNotice?: boolean;
-    /** The form stays off on a duplicate whatever its metadata. */
+    /** Keeps the form disabled on a duplicate regardless of its metadata. */
     disableFormOnDuplicate?: boolean;
-    /** The scope the fields of an editable row report to; a row that cannot be edited reports to none. */
+    /** The scope the fields of an editable row report to. A non-editable row reports to none. */
     validationScope?: ValidationScope;
-    /** How keywords and authors look while the row cannot be edited; handed to both inputs as `disabledAs`. */
+    /** How keywords and authors look while the row is not editable. Passed to both inputs as `disabledAs`. */
     disabledFieldsAs?: DamFieldsDisabledAs;
-    /** A duplicate gets no edit button at all: neither the `edit` slot nor its default is drawn. */
+    /** A duplicate gets no edit button: neither the `edit` slot nor its default is rendered. */
     hideEditOnDuplicate?: boolean;
-    /** Whether the row offers refresh, worked out by its host. Without it the row works it out itself. */
+    /** Whether the row offers refresh, decided by the host. Without it the row decides itself. */
     refreshOffered?: boolean | undefined;
-    /** The DAM configuration whose rules and forms the row follows; inherited when not given. */
+    /** The DAM configuration whose rules and forms the row follows. Inherited when not given. */
     configName?: string;
 };
 type __VLS_Slots = {
-    /** Over the picture, under the error overlay. */
+    /** Rendered over the picture, under the error overlay. */
     'image-overlay'?(props: {
         item: UploadQueueItem;
     }): unknown;
@@ -47,7 +47,7 @@ type __VLS_Slots = {
     edit?(props: {
         item: UploadQueueItem;
     }): unknown;
-    /** Last of the action line. Default: "Remove from queue" while it is offered, emits `removeItem`. */
+    /** Last in the action line. Default: "Remove from queue" while offered, emits `removeItem`. */
     remove?(props: {
         item: UploadQueueItem;
         index: number;