@cloudron/pankow 4.3.5 → 4.3.6

package/components/DirectoryView.vue

@@ -58,6 +58,7 @@
             :show-modified="showModified"
             :rename-handler="renameHandler"
             :share-indicator-property="shareIndicatorProperty"
+            :file-drop-indicator-property="fileDropIndicatorProperty"
             :select-handler="onSelectAndFocus"
             :drop-handler="onDrop"
             :can-drop-handler="onCanDropHandler"
@@ -77,6 +78,7 @@
             :show-star="showStar"
             :rename-handler="renameHandler"
             :share-indicator-property="shareIndicatorProperty"
+            :file-drop-indicator-property="fileDropIndicatorProperty"
             :select-handler="onSelectAndFocus"
             :drop-handler="onDrop"
             :can-drop-handler="onCanDropHandler"
@@ -198,6 +200,10 @@ const props = defineProps({
     type: String,
     default: '',
   },
+  fileDropIndicatorProperty: {
+    type: String,
+    default: '',
+  },
   editable: {
     type: Boolean,
     default: true,
@@ -694,8 +700,9 @@ function onSelectAndFocus(item, event, keepSelected = false) {
   invalidateSelected();
 }
 
-const contextMenuBodyModel = [
+const contextMenuBodyModel = ref([
   {
+    id: 'paste-body',
     label: props.tr('filemanager.list.menu.paste'),
     icon: 'fa-regular fa-paste',
     disabled: () => !clipboard.files || !clipboard.files.length,
@@ -704,56 +711,66 @@ const contextMenuBodyModel = [
     },
   },
   {
+    id: 'select-all-body',
     label: props.tr('filemanager.list.menu.selectAll'),
     icon: 'fa-solid fa-check-double',
     action: onSelectAll,
   },
   {
+    id: 'sep-body1',
     separator: true,
     visible: () => typeof props.refreshHandler === 'function',
   },
   {
+    id: 'refresh-body',
     label: props.tr('filemanager.toolbar.refresh'),
     icon: 'fa-solid fa-arrow-rotate-right',
     visible: () => typeof props.refreshHandler === 'function',
     action: props.refreshHandler,
   },
   {
+    id: 'sep-body2',
     separator: true,
     visible: () => props.showNewFile || props.showNewFolder,
   },
   {
+    id: 'new-file-body',
     label: props.tr('filemanager.toolbar.newFile'),
     icon: 'fa-solid fa-file-circle-plus',
     action: props.newFileHandler,
     visible: () => props.showNewFile,
   },
   {
+    id: 'new-folder-body',
     label: props.tr('filemanager.toolbar.newFolder'),
     icon: 'fa-solid fa-folder-plus',
     action: props.newFolderHandler,
     visible: () => props.showNewFolder,
   },
   {
+    id: 'sep-body3',
     separator: true,
     visible: () => props.showUploadFile || props.showUploadFolder,
   },
   {
+    id: 'upload-file-body',
     label: props.tr('filemanager.toolbar.uploadFile'),
     icon: 'fa-solid fa-file-arrow-up',
     action: props.uploadFileHandler,
     visible: () => props.showUploadFile,
   },
   {
+    id: 'upload-folder-body',
     label: props.tr('filemanager.toolbar.uploadFolder'),
     icon: 'fa-regular fa-folder-open',
     action: props.uploadFolderHandler,
     visible: () => props.showUploadFolder,
   },
-];
+]);
 
-const contextMenuModel = [
+const contextMenuModel = ref([
   {
+    id: 'open',
     label: props.tr('filemanager.list.menu.open'),
     icon: 'fa-regular fa-folder-open',
     disabled: () => selectedCount.value > 1,
@@ -762,6 +779,7 @@ const contextMenuModel = [
     },
   },
   {
+    id: 'sep-actions-top',
     separator: true,
     visible: () =>
       props.showDownload ||
@@ -772,6 +790,7 @@ const contextMenuModel = [
       props.showSelectAll,
   },
   {
+    id: 'download',
     label: props.tr('filemanager.list.menu.download'),
     icon: 'fa-solid fa-download',
     action: onItemDownload,
@@ -779,6 +798,7 @@ const contextMenuModel = [
     disabled: () => (props.multiDownload ? selectedCount.value === 0 : selectedCount.value !== 1),
   },
   {
+    id: 'share',
     label: props.tr('filemanager.list.menu.share'),
     icon: 'fa-solid fa-share-nodes',
     action: onItemShare,
@@ -786,18 +806,21 @@ const contextMenuModel = [
     visible: () => props.showShare,
   },
   {
+    id: 'copy',
     label: props.tr('filemanager.list.menu.copy'),
     icon: 'fa-regular fa-copy',
     action: onItemsCopy,
     visible: () => props.showCopy,
   },
   {
+    id: 'cut',
     label: props.tr('filemanager.list.menu.cut'),
     icon: 'fa-solid fa-scissors',
     action: onItemsCut,
     visible: () => props.showCut,
   },
   {
+    id: 'paste',
     label: props.tr('filemanager.list.menu.paste'),
     icon: 'fa-regular fa-paste',
     visible: () => props.showPaste,
@@ -811,12 +834,14 @@ const contextMenuModel = [
     },
   },
   {
+    id: 'select-all',
     label: props.tr('filemanager.list.menu.selectAll'),
     icon: 'fa-solid fa-check-double',
     visible: () => props.showSelectAll,
     action: onSelectAll,
   },
   {
+    id: 'rename',
     label: props.tr('filemanager.list.menu.rename'),
     icon: 'fa-regular fa-pen-to-square',
     action: onItemRenameBegin,
@@ -824,12 +849,14 @@ const contextMenuModel = [
     disabled: () => !props.editable || selectedCount.value > 1,
   },
   {
+    id: 'chown',
     label: props.tr('filemanager.list.menu.chown'),
     icon: 'fa-solid fa-user-pen',
     action: onItemsChangeOwner,
     visible: () => props.showOwner,
   },
   {
+    id: 'extract',
     label: props.tr('filemanager.list.menu.extract'),
     action: onItemExtract,
     visible: () => {
@@ -852,10 +879,12 @@ const contextMenuModel = [
     },
   },
   {
+    id: 'sep-actions-bottom',
     separator: true,
     visible: () => props.showDelete,
   },
   {
+    id: 'delete',
     label: props.tr('filemanager.list.menu.delete'),
     icon: 'fa-regular fa-trash-can',
     action: () => {
@@ -863,7 +892,7 @@ const contextMenuModel = [
     },
     visible: () => props.showDelete,
   },
-];
+]);
 
 const filteredSortedItems = computed(() => {
   invalidateSelected();
@@ -902,6 +931,9 @@ const filteredSortedItems = computed(() => {
 });
 
 defineExpose({
+  contextMenuModel,
+  contextMenuBodyModel,
+  focusItem,
   highlight,
   highlightByName,
 });

package/components/DirectoryViewGridItem.vue

@@ -19,6 +19,7 @@
         <template v-if="visible">
           <img :src="item.previewUrl || item.icon" ref="iconImage" @error="iconError($event)"/>
           <i v-show="shareIndicatorProperty !== '' && !!item[shareIndicatorProperty]" class="fa-solid fa-share-nodes is-shared"></i>
+          <i v-show="fileDropIndicatorProperty !== '' && !!item[fileDropIndicatorProperty]" class="fa-solid fa-cloud-arrow-up is-filedrop"></i>
         </template>
       </div>
 
@@ -62,6 +63,10 @@ const props = defineProps({
     type: String,
     default: '',
   },
+  fileDropIndicatorProperty: {
+    type: String,
+    default: '',
+  },
   fallbackIcon: String,
   renameHandler: {
     type: Function,
@@ -323,6 +328,13 @@ defineExpose({
   font-size: 1rem;
 }
 
+.is-filedrop {
+  position: absolute;
+  left: 2px;
+  bottom: 2px;
+  font-size: 1rem;
+}
+
 .grid-item-label {
   width: 100%;
   text-align: center;

package/components/DirectoryViewListItem.vue

@@ -14,6 +14,7 @@
       <div v-if="visible" class="col icon">
         <img :src="item.previewUrl || item.icon" ref="iconImage" @error="iconError($event)"/>
         <i v-show="shareIndicatorProperty !== '' && !!item[shareIndicatorProperty]" class="fa-solid fa-share-nodes is-shared"></i>
+        <i v-show="fileDropIndicatorProperty !== '' && !!item[fileDropIndicatorProperty]" class="fa-solid fa-cloud-arrow-up is-filedrop"></i>
       </div>
 
       <!-- this is just a placeholder label to allow the native browser search to work -->
@@ -81,6 +82,10 @@ const props = defineProps({
     type: String,
     default: '',
   },
+  fileDropIndicatorProperty: {
+    type: String,
+    default: '',
+  },
   fallbackIcon: String,
   renameHandler: {
     type: Function,
@@ -305,6 +310,7 @@ defineExpose({
   height: 45px;
   width: 45px;
   padding: 5px;
+  position: relative;
 }
 
 .icon > img {
@@ -341,6 +347,13 @@ defineExpose({
   font-size: 1.2rem
 }
 
+.is-filedrop {
+  position: absolute;
+  left: 2px;
+  bottom: 0;
+  font-size: 1.2rem
+}
+
 .label {
   padding-left: 5px;
   flex-grow: 1;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudron/pankow",
   "private": false,
-  "version": "4.3.5",
+  "version": "4.3.6",
   "description": "Vue 3 UI component library for Cloudron apps",
   "main": "index.js",
   "types": "types/index.d.ts",
@@ -37,10 +37,10 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@fontsource/inter": "^5.2.8",
+    "@fontsource/inter": "^5.3.0",
     "@fortawesome/fontawesome-free": "^7.3.1",
     "filesize": "^11.0.22",
-    "monaco-editor": "^0.55.1",
+    "monaco-editor": "^0.56.0",
     "online-3d-viewer": "^0.18.0"
   },
   "peerDependencies": {
@@ -48,7 +48,7 @@
   },
   "devDependencies": {
     "@highlightjs/vue-plugin": "^2.1.0",
-    "@unhead/vue": "^3.1.8",
+    "@unhead/vue": "^3.2.1",
     "@vitejs/plugin-vue": "^6.0.8",
     "highlight.js": "^11.11.1",
     "typescript": "^7.0.2",
@@ -56,5 +56,8 @@
     "vite-ssg": "^28.3.0",
     "vue": "^3.5.40",
     "vue-router": "^5.2.0"
+  },
+  "allowScripts": {
+    "core-js": false
   }
 }