@conduction/nextcloud-vue 2.96.0 → 2.98.0

package/dist/esm/components/CnFilesBrowser/CnFilesBrowser.vue3.js

@@ -1,4 +1,4 @@
-import { resolveComponent, openBlock, createElementBlock, normalizeClass, withModifiers, createElementVNode, createVNode, toDisplayString, createCommentVNode, withCtx, Fragment, renderList, createBlock, createTextVNode, resolveDynamicComponent } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, withModifiers, createElementVNode, createVNode, toDisplayString, createCommentVNode, withCtx, Fragment, renderList, createBlock, createTextVNode, resolveDynamicComponent, createSlots } from 'vue';
 
 const _hoisted_1 = {
   key: 0,
@@ -38,10 +38,10 @@ const _hoisted_13 = { class: "cn-files-browser__facet-count" };
 const _hoisted_14 = ["aria-label"];
 const _hoisted_15 = {
   class: "cn-files-browser__bulk-count",
-  "aria-live": "polite"
+  "aria-live": "polite",
+  "data-testid": "cn-files-browser-bulk-count"
 };
 const _hoisted_16 = {
-  key: 8,
   class: "cn-files-browser__table",
   "data-testid": "cn-files-browser-table"
 };
@@ -98,12 +98,23 @@ const _hoisted_42 = {
   class: "cn-files-browser__note"
 };
 const _hoisted_43 = ["href"];
-const _hoisted_44 = {
+const _hoisted_44 = ["aria-label"];
+const _hoisted_45 = ["data-testid"];
+const _hoisted_46 = { class: "cn-files-browser__side-title" };
+const _hoisted_47 = {
+  key: 0,
+  class: "cn-files-browser__side-facts"
+};
+const _hoisted_48 = {
+  key: 1,
+  class: "cn-files-browser__side-actions"
+};
+const _hoisted_49 = {
   key: 9,
   class: "cn-files-browser__drop-hint",
   "data-testid": "cn-files-browser-drop-hint"
 };
-const _hoisted_45 = {
+const _hoisted_50 = {
   key: 0,
   class: "cn-files-browser__upload-error",
   role: "alert"
@@ -371,7 +382,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           "aria-label": $options.t('nextcloud-vue', 'Actions for the selected files'),
           "data-testid": "cn-files-browser-bulk-bar"
         }, [
-          createElementVNode("span", _hoisted_15, toDisplayString($options.t('nextcloud-vue', '{count} selected', { count: $data.selectedIds.length })), 1 /* TEXT */),
+          createElementVNode("span", _hoisted_15, toDisplayString($options.selectionCountText), 1 /* TEXT */),
           (openBlock(true), createElementBlock(Fragment, null, renderList($props.bulkActions, (action) => {
             return (openBlock(), createBlock(_component_NcButton, {
               key: action.id,
@@ -390,16 +401,19 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               _: 2 /* DYNAMIC */
             }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["data-testid", "onClick"]))
           }), 128 /* KEYED_FRAGMENT */)),
-          createVNode(_component_NcButton, {
-            variant: "tertiary",
-            "data-testid": "cn-files-browser-bulk-clear",
-            onClick: $options.clearSelection
-          }, {
-            default: withCtx(() => [
-              createTextVNode(toDisplayString($options.t('nextcloud-vue', 'Clear selection')), 1 /* TEXT */)
-            ]),
-            _: 1 /* STABLE */
-          }, 8 /* PROPS */, ["onClick"])
+          ($props.showClearSelection)
+            ? (openBlock(), createBlock(_component_NcButton, {
+                key: 0,
+                variant: "tertiary",
+                "data-testid": "cn-files-browser-bulk-clear",
+                onClick: $options.clearSelection
+              }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString($options.t('nextcloud-vue', 'Clear selection')), 1 /* TEXT */)
+                ]),
+                _: 1 /* STABLE */
+              }, 8 /* PROPS */, ["onClick"]))
+            : createCommentVNode("v-if", true)
         ], 8 /* PROPS */, _hoisted_14))
       : createCommentVNode("v-if", true),
     ($data.loading)
@@ -440,406 +454,481 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
               ]),
               _: 1 /* STABLE */
             }, 8 /* PROPS */, ["name", "description"]))
-          : (openBlock(), createElementBlock("table", _hoisted_16, [
-              createElementVNode("thead", null, [
-                createElementVNode("tr", null, [
-                  ($options.bulkEnabled)
-                    ? (openBlock(), createElementBlock("th", _hoisted_17, [
-                        createElementVNode("input", {
-                          type: "checkbox",
-                          class: "cn-files-browser__select",
-                          checked: $options.allSelected,
-                          ".indeterminate": $options.someSelected && !$options.allSelected,
-                          disabled: $options.selectableIds.length === 0,
-                          "aria-label": $options.t('nextcloud-vue', 'Select all files'),
-                          "data-testid": "cn-files-browser-select-all",
-                          onChange: _cache[1] || (_cache[1] = $event => ($options.toggleAll($event.target.checked)))
-                        }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_18)
-                      ]))
-                    : createCommentVNode("v-if", true),
-                  createElementVNode("th", _hoisted_19, [
-                    createElementVNode("span", _hoisted_20, toDisplayString($options.t('nextcloud-vue', 'Type')), 1 /* TEXT */)
-                  ]),
-                  (openBlock(true), createElementBlock(Fragment, null, renderList($options.renderedColumns, (column) => {
-                    return (openBlock(), createElementBlock("th", {
-                      key: column.key,
-                      scope: "col",
-                      class: normalizeClass(`cn-files-browser__col-${column.key}`),
-                      "aria-sort": $options.ariaSort($options.sortTokenOf(column)),
-                      "data-testid": `cn-files-browser-header-${column.key}`
-                    }, [
-                      (column.sortable !== false)
-                        ? (openBlock(), createElementBlock("button", {
-                            key: 0,
-                            type: "button",
-                            class: "cn-files-browser__sort",
-                            onClick: $event => ($options.sortBy($options.sortTokenOf(column)))
-                          }, [
-                            createTextVNode(toDisplayString($options.columnLabel(column)) + " ", 1 /* TEXT */),
-                            ($data.sortKey === $options.sortTokenOf(column))
-                              ? (openBlock(), createBlock(resolveDynamicComponent($options.sortIcon($options.sortTokenOf(column))), {
-                                  key: 0,
-                                  size: 16
-                                }))
-                              : createCommentVNode("v-if", true)
-                          ], 8 /* PROPS */, _hoisted_22))
-                        : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                            createTextVNode(toDisplayString($options.columnLabel(column)), 1 /* TEXT */)
-                          ], 64 /* STABLE_FRAGMENT */))
-                    ], 10 /* CLASS, PROPS */, _hoisted_21))
-                  }), 128 /* KEYED_FRAGMENT */)),
-                  createElementVNode("th", _hoisted_23, [
-                    createElementVNode("span", _hoisted_24, toDisplayString($options.t('nextcloud-vue', 'Actions')), 1 /* TEXT */)
+          : (openBlock(), createElementBlock("div", {
+              key: 8,
+              class: normalizeClass(["cn-files-browser__body", { 'cn-files-browser__body--with-side': $options.sideNode !== null }])
+            }, [
+              createElementVNode("table", _hoisted_16, [
+                createElementVNode("thead", null, [
+                  createElementVNode("tr", null, [
+                    ($options.bulkEnabled)
+                      ? (openBlock(), createElementBlock("th", _hoisted_17, [
+                          createElementVNode("input", {
+                            type: "checkbox",
+                            class: "cn-files-browser__select",
+                            checked: $options.allSelected,
+                            ".indeterminate": $options.someSelected && !$options.allSelected,
+                            disabled: $options.selectableIds.length === 0,
+                            "aria-label": $options.t('nextcloud-vue', 'Select all files'),
+                            "data-testid": "cn-files-browser-select-all",
+                            onChange: _cache[1] || (_cache[1] = $event => ($options.toggleAll($event.target.checked)))
+                          }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_18)
+                        ]))
+                      : createCommentVNode("v-if", true),
+                    createElementVNode("th", _hoisted_19, [
+                      createElementVNode("span", _hoisted_20, toDisplayString($options.t('nextcloud-vue', 'Type')), 1 /* TEXT */)
+                    ]),
+                    (openBlock(true), createElementBlock(Fragment, null, renderList($options.renderedColumns, (column) => {
+                      return (openBlock(), createElementBlock("th", {
+                        key: column.key,
+                        scope: "col",
+                        class: normalizeClass(`cn-files-browser__col-${column.key}`),
+                        "aria-sort": $options.ariaSort($options.sortTokenOf(column)),
+                        "data-testid": `cn-files-browser-header-${column.key}`
+                      }, [
+                        (column.sortable !== false)
+                          ? (openBlock(), createElementBlock("button", {
+                              key: 0,
+                              type: "button",
+                              class: "cn-files-browser__sort",
+                              onClick: $event => ($options.sortBy($options.sortTokenOf(column)))
+                            }, [
+                              createTextVNode(toDisplayString($options.columnLabel(column)) + " ", 1 /* TEXT */),
+                              ($data.sortKey === $options.sortTokenOf(column))
+                                ? (openBlock(), createBlock(resolveDynamicComponent($options.sortIcon($options.sortTokenOf(column))), {
+                                    key: 0,
+                                    size: 16
+                                  }))
+                                : createCommentVNode("v-if", true)
+                            ], 8 /* PROPS */, _hoisted_22))
+                          : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                              createTextVNode(toDisplayString($options.columnLabel(column)), 1 /* TEXT */)
+                            ], 64 /* STABLE_FRAGMENT */))
+                      ], 10 /* CLASS, PROPS */, _hoisted_21))
+                    }), 128 /* KEYED_FRAGMENT */)),
+                    createElementVNode("th", _hoisted_23, [
+                      createElementVNode("span", _hoisted_24, toDisplayString($options.t('nextcloud-vue', 'Actions')), 1 /* TEXT */)
+                    ])
                   ])
-                ])
-              ]),
-              createElementVNode("tbody", null, [
-                (openBlock(true), createElementBlock(Fragment, null, renderList($options.displayRows, ({ key, group, node }) => {
-                  return (openBlock(), createElementBlock(Fragment, { key: key }, [
-                    group
-                      ? (openBlock(), createElementBlock("tr", _hoisted_25, [
-                          createElementVNode("th", {
-                            colspan: $options.columnCount,
-                            scope: "rowgroup",
-                            class: "cn-files-browser__group-heading"
+                ]),
+                createElementVNode("tbody", null, [
+                  (openBlock(true), createElementBlock(Fragment, null, renderList($options.displayRows, ({ key, group, node }) => {
+                    return (openBlock(), createElementBlock(Fragment, { key: key }, [
+                      group
+                        ? (openBlock(), createElementBlock("tr", _hoisted_25, [
+                            createElementVNode("th", {
+                              colspan: $options.columnCount,
+                              scope: "rowgroup",
+                              class: "cn-files-browser__group-heading"
+                            }, [
+                              createTextVNode(toDisplayString(group.label) + " ", 1 /* TEXT */),
+                              createElementVNode("span", _hoisted_27, toDisplayString(group.count), 1 /* TEXT */)
+                            ], 8 /* PROPS */, _hoisted_26)
+                          ]))
+                        : (openBlock(), createElementBlock("tr", {
+                            key: key,
+                            class: normalizeClass(["cn-files-browser__row", { 'cn-files-browser__row--folder': $options.isFolder(node) }]),
+                            "data-testid": "cn-files-browser-row",
+                            "data-name": node.basename,
+                            onClick: $event => ($options.onRowClick(node, $event)),
+                            onMousedown: _cache[6] || (_cache[6] = (...args) => ($options.preventMiddleClickAutoscroll && $options.preventMiddleClickAutoscroll(...args))),
+                            onAuxclick: $event => ($options.onRowAuxClick(node, $event))
                           }, [
-                            createTextVNode(toDisplayString(group.label) + " ", 1 /* TEXT */),
-                            createElementVNode("span", _hoisted_27, toDisplayString(group.count), 1 /* TEXT */)
-                          ], 8 /* PROPS */, _hoisted_26)
-                        ]))
-                      : (openBlock(), createElementBlock("tr", {
-                          key: key,
-                          class: normalizeClass(["cn-files-browser__row", { 'cn-files-browser__row--folder': $options.isFolder(node) }]),
-                          "data-testid": "cn-files-browser-row",
-                          "data-name": node.basename,
-                          onClick: $event => ($options.onRowClick(node, $event)),
-                          onMousedown: _cache[6] || (_cache[6] = (...args) => ($options.preventMiddleClickAutoscroll && $options.preventMiddleClickAutoscroll(...args))),
-                          onAuxclick: $event => ($options.onRowAuxClick(node, $event))
-                        }, [
-                          ($options.bulkEnabled)
-                            ? (openBlock(), createElementBlock("td", {
-                                key: 0,
-                                class: "cn-files-browser__col-select",
-                                onClick: _cache[2] || (_cache[2] = withModifiers(() => {}, ["stop"])),
-                                onAuxclick: _cache[3] || (_cache[3] = withModifiers(() => {}, ["stop"]))
-                              }, [
-                                (!$options.isFolder(node))
-                                  ? (openBlock(), createElementBlock("input", {
-                                      key: 0,
-                                      type: "checkbox",
-                                      class: "cn-files-browser__select",
-                                      checked: $options.isSelected(node),
-                                      "aria-label": $options.t('nextcloud-vue', 'Select {name}', { name: node.basename }),
-                                      "data-testid": "cn-files-browser-select",
-                                      onChange: $event => ($options.toggleSelected(node, $event.target.checked))
-                                    }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_29))
-                                  : createCommentVNode("v-if", true)
-                              ], 32 /* NEED_HYDRATION */))
-                            : createCommentVNode("v-if", true),
-                          createElementVNode("td", _hoisted_30, [
-                            ($options.previewUrlFor(node))
-                              ? (openBlock(), createElementBlock("img", {
+                            ($options.bulkEnabled)
+                              ? (openBlock(), createElementBlock("td", {
                                   key: 0,
-                                  class: "cn-files-browser__thumb",
-                                  src: $options.previewUrlFor(node),
-                                  alt: "",
-                                  loading: "lazy",
-                                  onError: $event => ($options.onPreviewError(node))
-                                }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_31))
-                              : ($options.mimeIconFor(node))
+                                  class: "cn-files-browser__col-select",
+                                  onClick: _cache[2] || (_cache[2] = withModifiers(() => {}, ["stop"])),
+                                  onAuxclick: _cache[3] || (_cache[3] = withModifiers(() => {}, ["stop"]))
+                                }, [
+                                  (!$options.isFolder(node))
+                                    ? (openBlock(), createElementBlock("input", {
+                                        key: 0,
+                                        type: "checkbox",
+                                        class: "cn-files-browser__select",
+                                        checked: $options.isSelected(node),
+                                        "aria-label": $options.t('nextcloud-vue', 'Select {name}', { name: node.basename }),
+                                        "data-testid": "cn-files-browser-select",
+                                        onChange: $event => ($options.toggleSelected(node, $event.target.checked))
+                                      }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_29))
+                                    : createCommentVNode("v-if", true)
+                                ], 32 /* NEED_HYDRATION */))
+                              : createCommentVNode("v-if", true),
+                            createElementVNode("td", _hoisted_30, [
+                              ($options.previewUrlFor(node))
                                 ? (openBlock(), createElementBlock("img", {
-                                    key: 1,
-                                    class: "cn-files-browser__mime",
-                                    src: $options.mimeIconFor(node),
-                                    alt: ""
-                                  }, null, 8 /* PROPS */, _hoisted_32))
-                                : ($options.isFolder(node))
-                                  ? (openBlock(), createBlock(_component_FolderOutline, {
-                                      key: 2,
-                                      size: 32
-                                    }))
-                                  : (openBlock(), createBlock(_component_FileOutline, {
-                                      key: 3,
-                                      size: 32
-                                    }))
-                          ]),
-                          (openBlock(true), createElementBlock(Fragment, null, renderList($options.renderedColumns, (column) => {
-                            return (openBlock(), createElementBlock("td", {
-                              key: column.key,
-                              class: normalizeClass(`cn-files-browser__col-${column.key}`),
-                              "data-testid": `cn-files-browser-cell-${column.key}`
+                                    key: 0,
+                                    class: "cn-files-browser__thumb",
+                                    src: $options.previewUrlFor(node),
+                                    alt: "",
+                                    loading: "lazy",
+                                    onError: $event => ($options.onPreviewError(node))
+                                  }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_31))
+                                : ($options.mimeIconFor(node))
+                                  ? (openBlock(), createElementBlock("img", {
+                                      key: 1,
+                                      class: "cn-files-browser__mime",
+                                      src: $options.mimeIconFor(node),
+                                      alt: ""
+                                    }, null, 8 /* PROPS */, _hoisted_32))
+                                  : ($options.isFolder(node))
+                                    ? (openBlock(), createBlock(_component_FolderOutline, {
+                                        key: 2,
+                                        size: 32
+                                      }))
+                                    : (openBlock(), createBlock(_component_FileOutline, {
+                                        key: 3,
+                                        size: 32
+                                      }))
+                            ]),
+                            (openBlock(true), createElementBlock(Fragment, null, renderList($options.renderedColumns, (column) => {
+                              return (openBlock(), createElementBlock("td", {
+                                key: column.key,
+                                class: normalizeClass(`cn-files-browser__col-${column.key}`),
+                                "data-testid": `cn-files-browser-cell-${column.key}`
+                              }, [
+                                (column.key === 'name')
+                                  ? (openBlock(), createElementBlock("span", _hoisted_34, toDisplayString(node.basename), 1 /* TEXT */))
+                                  : (column.key === 'size')
+                                    ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                                        createTextVNode(toDisplayString($options.isFolder(node) ? '' : $options.formatSize(node.size)), 1 /* TEXT */)
+                                      ], 64 /* STABLE_FRAGMENT */))
+                                    : (column.key === 'modified')
+                                      ? (openBlock(), createBlock(_component_NcDateTime, {
+                                          key: 2,
+                                          timestamp: node.mtime,
+                                          ignoreSeconds: true
+                                        }, null, 8 /* PROPS */, ["timestamp"]))
+                                      : (openBlock(), createBlock(_component_CnCellRenderer, {
+                                          key: 3,
+                                          class: normalizeClass(column.widget !== 'badge' && $options.toneOf(column, node) ? `cn-files-browser__tone cn-files-browser__tone--${$options.toneOf(column, node)}` : null),
+                                          value: $options.cellValue(column, node),
+                                          formatter: column.formatter || null,
+                                          formatterOptions: column.formatterOptions || null,
+                                          widget: column.widget || null,
+                                          widgetProps: $options.cellWidgetProps(column, node),
+                                          row: node
+                                        }, null, 8 /* PROPS */, ["class", "value", "formatter", "formatterOptions", "widget", "widgetProps", "row"]))
+                              ], 10 /* CLASS, PROPS */, _hoisted_33))
+                            }), 128 /* KEYED_FRAGMENT */)),
+                            createElementVNode("td", {
+                              class: "cn-files-browser__col-actions",
+                              onClick: _cache[4] || (_cache[4] = withModifiers(() => {}, ["stop"])),
+                              onAuxclick: _cache[5] || (_cache[5] = withModifiers(() => {}, ["stop"]))
                             }, [
-                              (column.key === 'name')
-                                ? (openBlock(), createElementBlock("span", _hoisted_34, toDisplayString(node.basename), 1 /* TEXT */))
-                                : (column.key === 'size')
-                                  ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                                      createTextVNode(toDisplayString($options.isFolder(node) ? '' : $options.formatSize(node.size)), 1 /* TEXT */)
-                                    ], 64 /* STABLE_FRAGMENT */))
-                                  : (column.key === 'modified')
-                                    ? (openBlock(), createBlock(_component_NcDateTime, {
+                              createVNode(_component_NcActions, {
+                                forceMenu: true,
+                                ariaLabel: $options.t('nextcloud-vue', 'Actions for {name}', { name: node.basename })
+                              }, {
+                                default: withCtx(() => [
+                                  (openBlock(true), createElementBlock(Fragment, null, renderList($options.actionsFor(node), (action) => {
+                                    return (openBlock(), createBlock(_component_NcActionButton, {
+                                      key: action.id,
+                                      closeAfterClick: true,
+                                      "data-testid": `cn-files-browser-action-${action.id}`,
+                                      onClick: $event => ($options.run(action, node))
+                                    }, {
+                                      icon: withCtx(() => [
+                                        createVNode(_component_NcIconSvgWrapper, {
+                                          svg: $options.iconOf(action, node)
+                                        }, null, 8 /* PROPS */, ["svg"])
+                                      ]),
+                                      default: withCtx(() => [
+                                        createTextVNode(" " + toDisplayString($options.labelOf(action, node)), 1 /* TEXT */)
+                                      ]),
+                                      _: 2 /* DYNAMIC */
+                                    }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["data-testid", "onClick"]))
+                                  }), 128 /* KEYED_FRAGMENT */)),
+                                  (!$options.isFolder(node))
+                                    ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList($options.hostActionsFor(node), (action) => {
+                                        return (openBlock(), createBlock(_component_NcActionButton, {
+                                          key: `host-${action.id}`,
+                                          closeAfterClick: true,
+                                          "data-testid": `cn-files-browser-host-action-${action.id}`,
+                                          onClick: $event => ($options.runHostAction(action, node))
+                                        }, {
+                                          icon: withCtx(() => [
+                                            createVNode(_component_CnIcon, {
+                                              name: action.icon || 'FileDocumentEditOutline',
+                                              size: 20
+                                            }, null, 8 /* PROPS */, ["name"])
+                                          ]),
+                                          default: withCtx(() => [
+                                            createTextVNode(" " + toDisplayString($options.hostLabel(action)), 1 /* TEXT */)
+                                          ]),
+                                          _: 2 /* DYNAMIC */
+                                        }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["data-testid", "onClick"]))
+                                      }), 128 /* KEYED_FRAGMENT */))
+                                    : createCommentVNode("v-if", true),
+                                  ($options.actionsFor(node).length > 0 || (!$options.isFolder(node) && $options.hostActionsFor(node).length > 0))
+                                    ? (openBlock(), createBlock(_component_NcActionSeparator, { key: 1 }))
+                                    : createCommentVNode("v-if", true),
+                                  ($props.source && $options.sourceDownloadUrl(node))
+                                    ? (openBlock(), createBlock(_component_NcActionLink, {
                                         key: 2,
-                                        timestamp: node.mtime,
-                                        ignoreSeconds: true
-                                      }, null, 8 /* PROPS */, ["timestamp"]))
-                                    : (openBlock(), createBlock(_component_CnCellRenderer, {
+                                        href: $options.sourceDownloadUrl(node),
+                                        download: node.basename,
+                                        closeAfterClick: true,
+                                        "data-testid": "cn-files-browser-action-download"
+                                      }, {
+                                        icon: withCtx(() => [
+                                          createVNode(_component_Download, { size: 20 })
+                                        ]),
+                                        default: withCtx(() => [
+                                          createTextVNode(" " + toDisplayString($props.downloadLabel), 1 /* TEXT */)
+                                        ]),
+                                        _: 1 /* STABLE */
+                                      }, 8 /* PROPS */, ["href", "download"]))
+                                    : createCommentVNode("v-if", true),
+                                  ($props.source && $options.canChange)
+                                    ? (openBlock(), createBlock(_component_NcActionButton, {
                                         key: 3,
-                                        value: $options.cellValue(column, node),
-                                        formatter: column.formatter || null,
-                                        formatterOptions: column.formatterOptions || null,
-                                        widget: column.widget || null,
-                                        row: node
-                                      }, null, 8 /* PROPS */, ["value", "formatter", "formatterOptions", "widget", "row"]))
-                            ], 10 /* CLASS, PROPS */, _hoisted_33))
-                          }), 128 /* KEYED_FRAGMENT */)),
-                          createElementVNode("td", {
-                            class: "cn-files-browser__col-actions",
-                            onClick: _cache[4] || (_cache[4] = withModifiers(() => {}, ["stop"])),
-                            onAuxclick: _cache[5] || (_cache[5] = withModifiers(() => {}, ["stop"]))
-                          }, [
-                            createVNode(_component_NcActions, {
-                              forceMenu: true,
-                              ariaLabel: $options.t('nextcloud-vue', 'Actions for {name}', { name: node.basename })
-                            }, {
-                              default: withCtx(() => [
-                                (openBlock(true), createElementBlock(Fragment, null, renderList($options.actionsFor(node), (action) => {
-                                  return (openBlock(), createBlock(_component_NcActionButton, {
-                                    key: action.id,
-                                    closeAfterClick: true,
-                                    "data-testid": `cn-files-browser-action-${action.id}`,
-                                    onClick: $event => ($options.run(action, node))
-                                  }, {
-                                    icon: withCtx(() => [
-                                      createVNode(_component_NcIconSvgWrapper, {
-                                        svg: $options.iconOf(action, node)
-                                      }, null, 8 /* PROPS */, ["svg"])
-                                    ]),
-                                    default: withCtx(() => [
-                                      createTextVNode(" " + toDisplayString($options.labelOf(action, node)), 1 /* TEXT */)
-                                    ]),
-                                    _: 2 /* DYNAMIC */
-                                  }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["data-testid", "onClick"]))
-                                }), 128 /* KEYED_FRAGMENT */)),
-                                (!$options.isFolder(node))
-                                  ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList($options.hostActionsFor(node), (action) => {
-                                      return (openBlock(), createBlock(_component_NcActionButton, {
-                                        key: `host-${action.id}`,
                                         closeAfterClick: true,
-                                        "data-testid": `cn-files-browser-host-action-${action.id}`,
-                                        onClick: $event => ($options.runHostAction(action, node))
+                                        "data-testid": "cn-files-browser-action-delete",
+                                        onClick: $event => ($options.askRemove(node))
                                       }, {
                                         icon: withCtx(() => [
-                                          createVNode(_component_CnIcon, {
-                                            name: action.icon || 'FileDocumentEditOutline',
-                                            size: 20
-                                          }, null, 8 /* PROPS */, ["name"])
+                                          createVNode(_component_TrashCanOutline, { size: 20 })
                                         ]),
                                         default: withCtx(() => [
-                                          createTextVNode(" " + toDisplayString($options.hostLabel(action)), 1 /* TEXT */)
+                                          createTextVNode(" " + toDisplayString($props.deleteLabel), 1 /* TEXT */)
                                         ]),
-                                        _: 2 /* DYNAMIC */
-                                      }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["data-testid", "onClick"]))
-                                    }), 128 /* KEYED_FRAGMENT */))
-                                  : createCommentVNode("v-if", true),
-                                ($options.actionsFor(node).length > 0 || (!$options.isFolder(node) && $options.hostActionsFor(node).length > 0))
-                                  ? (openBlock(), createBlock(_component_NcActionSeparator, { key: 1 }))
-                                  : createCommentVNode("v-if", true),
-                                ($props.source && $options.sourceDownloadUrl(node))
-                                  ? (openBlock(), createBlock(_component_NcActionLink, {
-                                      key: 2,
-                                      href: $options.sourceDownloadUrl(node),
-                                      download: node.basename,
-                                      closeAfterClick: true,
-                                      "data-testid": "cn-files-browser-action-download"
-                                    }, {
-                                      icon: withCtx(() => [
-                                        createVNode(_component_Download, { size: 20 })
-                                      ]),
-                                      default: withCtx(() => [
-                                        createTextVNode(" " + toDisplayString($props.downloadLabel), 1 /* TEXT */)
-                                      ]),
-                                      _: 1 /* STABLE */
-                                    }, 8 /* PROPS */, ["href", "download"]))
-                                  : createCommentVNode("v-if", true),
-                                ($props.source && $options.canChange)
-                                  ? (openBlock(), createBlock(_component_NcActionButton, {
-                                      key: 3,
-                                      closeAfterClick: true,
-                                      "data-testid": "cn-files-browser-action-delete",
-                                      onClick: $event => ($options.askRemove(node))
-                                    }, {
-                                      icon: withCtx(() => [
-                                        createVNode(_component_TrashCanOutline, { size: 20 })
-                                      ]),
-                                      default: withCtx(() => [
-                                        createTextVNode(" " + toDisplayString($props.deleteLabel), 1 /* TEXT */)
-                                      ]),
-                                      _: 1 /* STABLE */
-                                    }, 8 /* PROPS */, ["onClick"]))
-                                  : createCommentVNode("v-if", true),
-                                ($options.canChange)
-                                  ? (openBlock(), createBlock(_component_NcActionButton, {
-                                      key: 4,
-                                      closeAfterClick: true,
-                                      "data-testid": "cn-files-browser-action-rename",
-                                      onClick: $event => ($options.askRename(node))
-                                    }, {
-                                      icon: withCtx(() => [
-                                        createVNode(_component_Pencil, { size: 20 })
-                                      ]),
-                                      default: withCtx(() => [
-                                        createTextVNode(" " + toDisplayString($props.renameLabel), 1 /* TEXT */)
-                                      ]),
-                                      _: 1 /* STABLE */
-                                    }, 8 /* PROPS */, ["onClick"]))
-                                  : createCommentVNode("v-if", true),
-                                (node.fileid && !$props.source)
-                                  ? (openBlock(), createBlock(_component_NcActionLink, {
-                                      key: 5,
-                                      href: $options.permalink(node),
-                                      target: "_blank",
-                                      closeAfterClick: true
-                                    }, {
-                                      icon: withCtx(() => [
-                                        createVNode(_component_OpenInNew, { size: 20 })
-                                      ]),
-                                      default: withCtx(() => [
-                                        createTextVNode(" " + toDisplayString($props.showInFilesLabel), 1 /* TEXT */)
-                                      ]),
-                                      _: 1 /* STABLE */
-                                    }, 8 /* PROPS */, ["href"]))
+                                        _: 1 /* STABLE */
+                                      }, 8 /* PROPS */, ["onClick"]))
+                                    : createCommentVNode("v-if", true),
+                                  ($options.canChange)
+                                    ? (openBlock(), createBlock(_component_NcActionButton, {
+                                        key: 4,
+                                        closeAfterClick: true,
+                                        "data-testid": "cn-files-browser-action-rename",
+                                        onClick: $event => ($options.askRename(node))
+                                      }, {
+                                        icon: withCtx(() => [
+                                          createVNode(_component_Pencil, { size: 20 })
+                                        ]),
+                                        default: withCtx(() => [
+                                          createTextVNode(" " + toDisplayString($props.renameLabel), 1 /* TEXT */)
+                                        ]),
+                                        _: 1 /* STABLE */
+                                      }, 8 /* PROPS */, ["onClick"]))
+                                    : createCommentVNode("v-if", true),
+                                  (node.fileid && !$props.source)
+                                    ? (openBlock(), createBlock(_component_NcActionLink, {
+                                        key: 5,
+                                        href: $options.permalink(node),
+                                        target: "_blank",
+                                        closeAfterClick: true
+                                      }, {
+                                        icon: withCtx(() => [
+                                          createVNode(_component_OpenInNew, { size: 20 })
+                                        ]),
+                                        default: withCtx(() => [
+                                          createTextVNode(" " + toDisplayString($props.showInFilesLabel), 1 /* TEXT */)
+                                        ]),
+                                        _: 1 /* STABLE */
+                                      }, 8 /* PROPS */, ["href"]))
+                                    : createCommentVNode("v-if", true)
+                                ]),
+                                _: 2 /* DYNAMIC */
+                              }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["ariaLabel"])
+                            ], 32 /* NEED_HYDRATION */)
+                          ], 42 /* CLASS, PROPS, NEED_HYDRATION */, _hoisted_28))
+                    ], 64 /* STABLE_FRAGMENT */))
+                  }), 128 /* KEYED_FRAGMENT */)),
+                  ($options.facetActive && $options.filteredFiles.length === 0)
+                    ? (openBlock(), createElementBlock("tr", _hoisted_35, [
+                        createElementVNode("td", {
+                          colspan: $options.columnCount,
+                          class: "cn-files-browser__no-match",
+                          "data-testid": "cn-files-browser-no-match"
+                        }, toDisplayString($options.t('nextcloud-vue', 'No files match the filter.')), 9 /* TEXT, PROPS */, _hoisted_36)
+                      ]))
+                    : createCommentVNode("v-if", true),
+                  (openBlock(true), createElementBlock(Fragment, null, renderList($props.linkedItems, (item) => {
+                    return (openBlock(), createElementBlock("tr", {
+                      key: `linked-${item.id}`,
+                      class: "cn-files-browser__row cn-files-browser__row--linked",
+                      "data-testid": "cn-files-browser-linked-row",
+                      "data-name": item.name,
+                      onClick: $event => ($options.openLinked(item)),
+                      onMousedown: _cache[10] || (_cache[10] = (...args) => ($options.preventMiddleClickAutoscroll && $options.preventMiddleClickAutoscroll(...args))),
+                      onAuxclick: $event => ($options.onLinkedAuxClick(item, $event))
+                    }, [
+                      ($options.bulkEnabled)
+                        ? (openBlock(), createElementBlock("td", _hoisted_38))
+                        : createCommentVNode("v-if", true),
+                      createElementVNode("td", _hoisted_39, [
+                        ($options.mimeIconFor({ mime: item.mime }))
+                          ? (openBlock(), createElementBlock("img", {
+                              key: 0,
+                              class: "cn-files-browser__mime",
+                              src: $options.mimeIconFor({ mime: item.mime }),
+                              alt: ""
+                            }, null, 8 /* PROPS */, _hoisted_40))
+                          : (openBlock(), createBlock(_component_FileOutline, {
+                              key: 1,
+                              size: 32
+                            }))
+                      ]),
+                      (openBlock(true), createElementBlock(Fragment, null, renderList($options.renderedColumns, (column) => {
+                        return (openBlock(), createElementBlock("td", {
+                          key: column.key,
+                          class: normalizeClass(`cn-files-browser__col-${column.key}`)
+                        }, [
+                          (column.key === 'name')
+                            ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                                createElementVNode("span", _hoisted_41, toDisplayString(item.name), 1 /* TEXT */),
+                                (item.note)
+                                  ? (openBlock(), createElementBlock("span", _hoisted_42, [
+                                      (item.noteHref)
+                                        ? (openBlock(), createElementBlock("a", {
+                                            key: 0,
+                                            href: item.noteHref,
+                                            class: "cn-files-browser__note-link",
+                                            onClick: _cache[7] || (_cache[7] = withModifiers(() => {}, ["stop"]))
+                                          }, toDisplayString(item.note), 9 /* TEXT, PROPS */, _hoisted_43))
+                                        : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                                            createTextVNode(toDisplayString(item.note), 1 /* TEXT */)
+                                          ], 64 /* STABLE_FRAGMENT */))
+                                    ]))
                                   : createCommentVNode("v-if", true)
-                              ]),
-                              _: 2 /* DYNAMIC */
-                            }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["ariaLabel"])
-                          ], 32 /* NEED_HYDRATION */)
-                        ], 42 /* CLASS, PROPS, NEED_HYDRATION */, _hoisted_28))
-                  ], 64 /* STABLE_FRAGMENT */))
-                }), 128 /* KEYED_FRAGMENT */)),
-                ($options.facetActive && $options.filteredFiles.length === 0)
-                  ? (openBlock(), createElementBlock("tr", _hoisted_35, [
+                              ], 64 /* STABLE_FRAGMENT */))
+                            : (column.key === 'size')
+                              ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                                  createTextVNode(toDisplayString(item.size ? $options.formatSize(item.size) : ''), 1 /* TEXT */)
+                                ], 64 /* STABLE_FRAGMENT */))
+                              : (column.key === 'modified' && item.mtime)
+                                ? (openBlock(), createBlock(_component_NcDateTime, {
+                                    key: 2,
+                                    timestamp: item.mtime,
+                                    ignoreSeconds: true
+                                  }, null, 8 /* PROPS */, ["timestamp"]))
+                                : createCommentVNode("v-if", true)
+                        ], 2 /* CLASS */))
+                      }), 128 /* KEYED_FRAGMENT */)),
                       createElementVNode("td", {
-                        colspan: $options.columnCount,
-                        class: "cn-files-browser__no-match",
-                        "data-testid": "cn-files-browser-no-match"
-                      }, toDisplayString($options.t('nextcloud-vue', 'No files match the filter.')), 9 /* TEXT, PROPS */, _hoisted_36)
-                    ]))
-                  : createCommentVNode("v-if", true),
-                (openBlock(true), createElementBlock(Fragment, null, renderList($props.linkedItems, (item) => {
-                  return (openBlock(), createElementBlock("tr", {
-                    key: `linked-${item.id}`,
-                    class: "cn-files-browser__row cn-files-browser__row--linked",
-                    "data-testid": "cn-files-browser-linked-row",
-                    "data-name": item.name,
-                    onClick: $event => ($options.openLinked(item)),
-                    onMousedown: _cache[10] || (_cache[10] = (...args) => ($options.preventMiddleClickAutoscroll && $options.preventMiddleClickAutoscroll(...args))),
-                    onAuxclick: $event => ($options.onLinkedAuxClick(item, $event))
-                  }, [
-                    ($options.bulkEnabled)
-                      ? (openBlock(), createElementBlock("td", _hoisted_38))
-                      : createCommentVNode("v-if", true),
-                    createElementVNode("td", _hoisted_39, [
-                      ($options.mimeIconFor({ mime: item.mime }))
-                        ? (openBlock(), createElementBlock("img", {
-                            key: 0,
-                            class: "cn-files-browser__mime",
-                            src: $options.mimeIconFor({ mime: item.mime }),
-                            alt: ""
-                          }, null, 8 /* PROPS */, _hoisted_40))
-                        : (openBlock(), createBlock(_component_FileOutline, {
-                            key: 1,
-                            size: 32
-                          }))
-                    ]),
-                    (openBlock(true), createElementBlock(Fragment, null, renderList($options.renderedColumns, (column) => {
-                      return (openBlock(), createElementBlock("td", {
-                        key: column.key,
-                        class: normalizeClass(`cn-files-browser__col-${column.key}`)
+                        class: "cn-files-browser__col-actions",
+                        onClick: _cache[8] || (_cache[8] = withModifiers(() => {}, ["stop"])),
+                        onAuxclick: _cache[9] || (_cache[9] = withModifiers(() => {}, ["stop"]))
                       }, [
-                        (column.key === 'name')
-                          ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-                              createElementVNode("span", _hoisted_41, toDisplayString(item.name), 1 /* TEXT */),
-                              (item.note)
-                                ? (openBlock(), createElementBlock("span", _hoisted_42, [
-                                    (item.noteHref)
-                                      ? (openBlock(), createElementBlock("a", {
-                                          key: 0,
-                                          href: item.noteHref,
-                                          class: "cn-files-browser__note-link",
-                                          onClick: _cache[7] || (_cache[7] = withModifiers(() => {}, ["stop"]))
-                                        }, toDisplayString(item.note), 9 /* TEXT, PROPS */, _hoisted_43))
-                                      : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                                          createTextVNode(toDisplayString(item.note), 1 /* TEXT */)
-                                        ], 64 /* STABLE_FRAGMENT */))
-                                  ]))
-                                : createCommentVNode("v-if", true)
-                            ], 64 /* STABLE_FRAGMENT */))
-                          : (column.key === 'size')
-                            ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                                createTextVNode(toDisplayString(item.size ? $options.formatSize(item.size) : ''), 1 /* TEXT */)
-                              ], 64 /* STABLE_FRAGMENT */))
-                            : (column.key === 'modified' && item.mtime)
-                              ? (openBlock(), createBlock(_component_NcDateTime, {
-                                  key: 2,
-                                  timestamp: item.mtime,
-                                  ignoreSeconds: true
-                                }, null, 8 /* PROPS */, ["timestamp"]))
+                        createVNode(_component_NcActions, {
+                          forceMenu: true,
+                          ariaLabel: $options.t('nextcloud-vue', 'Actions for {name}', { name: item.name })
+                        }, {
+                          default: withCtx(() => [
+                            (item.href)
+                              ? (openBlock(), createBlock(_component_NcActionLink, {
+                                  key: 0,
+                                  href: item.href,
+                                  target: "_blank",
+                                  closeAfterClick: true,
+                                  "data-testid": "cn-files-browser-linked-open"
+                                }, {
+                                  icon: withCtx(() => [
+                                    createVNode(_component_OpenInNew, { size: 20 })
+                                  ]),
+                                  default: withCtx(() => [
+                                    createTextVNode(" " + toDisplayString($props.openLinkedLabel), 1 /* TEXT */)
+                                  ]),
+                                  _: 1 /* STABLE */
+                                }, 8 /* PROPS */, ["href"]))
+                              : createCommentVNode("v-if", true),
+                            (item.downloadHref)
+                              ? (openBlock(), createBlock(_component_NcActionLink, {
+                                  key: 1,
+                                  href: item.downloadHref,
+                                  download: item.name,
+                                  closeAfterClick: true,
+                                  "data-testid": "cn-files-browser-linked-download"
+                                }, {
+                                  icon: withCtx(() => [
+                                    createVNode(_component_Download, { size: 20 })
+                                  ]),
+                                  default: withCtx(() => [
+                                    createTextVNode(" " + toDisplayString($props.downloadLabel), 1 /* TEXT */)
+                                  ]),
+                                  _: 1 /* STABLE */
+                                }, 8 /* PROPS */, ["href", "download"]))
                               : createCommentVNode("v-if", true)
-                      ], 2 /* CLASS */))
-                    }), 128 /* KEYED_FRAGMENT */)),
-                    createElementVNode("td", {
-                      class: "cn-files-browser__col-actions",
-                      onClick: _cache[8] || (_cache[8] = withModifiers(() => {}, ["stop"])),
-                      onAuxclick: _cache[9] || (_cache[9] = withModifiers(() => {}, ["stop"]))
-                    }, [
-                      createVNode(_component_NcActions, {
-                        forceMenu: true,
-                        ariaLabel: $options.t('nextcloud-vue', 'Actions for {name}', { name: item.name })
-                      }, {
-                        default: withCtx(() => [
-                          (item.href)
-                            ? (openBlock(), createBlock(_component_NcActionLink, {
-                                key: 0,
-                                href: item.href,
-                                target: "_blank",
-                                closeAfterClick: true,
-                                "data-testid": "cn-files-browser-linked-open"
-                              }, {
-                                icon: withCtx(() => [
-                                  createVNode(_component_OpenInNew, { size: 20 })
-                                ]),
-                                default: withCtx(() => [
-                                  createTextVNode(" " + toDisplayString($props.openLinkedLabel), 1 /* TEXT */)
-                                ]),
-                                _: 1 /* STABLE */
-                              }, 8 /* PROPS */, ["href"]))
-                            : createCommentVNode("v-if", true),
-                          (item.downloadHref)
-                            ? (openBlock(), createBlock(_component_NcActionLink, {
-                                key: 1,
-                                href: item.downloadHref,
-                                download: item.name,
-                                closeAfterClick: true,
-                                "data-testid": "cn-files-browser-linked-download"
-                              }, {
-                                icon: withCtx(() => [
-                                  createVNode(_component_Download, { size: 20 })
-                                ]),
-                                default: withCtx(() => [
-                                  createTextVNode(" " + toDisplayString($props.downloadLabel), 1 /* TEXT */)
-                                ]),
-                                _: 1 /* STABLE */
-                              }, 8 /* PROPS */, ["href", "download"]))
-                            : createCommentVNode("v-if", true)
-                        ]),
-                        _: 2 /* DYNAMIC */
-                      }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["ariaLabel"])
-                    ], 32 /* NEED_HYDRATION */)
-                  ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_37))
-                }), 128 /* KEYED_FRAGMENT */))
-              ])
-            ])),
+                          ]),
+                          _: 2 /* DYNAMIC */
+                        }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["ariaLabel"])
+                      ], 32 /* NEED_HYDRATION */)
+                    ], 40 /* PROPS, NEED_HYDRATION */, _hoisted_37))
+                  }), 128 /* KEYED_FRAGMENT */))
+                ])
+              ]),
+              ($options.sideNode !== null)
+                ? (openBlock(), createElementBlock("aside", {
+                    key: 0,
+                    class: "cn-files-browser__side",
+                    "aria-label": $options.t('nextcloud-vue', 'About {name}', { name: $options.sideNode.basename }),
+                    "data-testid": "cn-files-browser-side"
+                  }, [
+                    (openBlock(true), createElementBlock(Fragment, null, renderList($options.sideCardsFor($options.sideNode), (card) => {
+                      return (openBlock(), createElementBlock("section", {
+                        key: card.id,
+                        class: "cn-files-browser__side-card",
+                        "data-testid": `cn-files-browser-side-card-${card.id}`
+                      }, [
+                        createElementVNode("h3", _hoisted_46, toDisplayString(card.title), 1 /* TEXT */),
+                        (card.fields.length > 0)
+                          ? (openBlock(), createElementBlock("dl", _hoisted_47, [
+                              (openBlock(true), createElementBlock(Fragment, null, renderList(card.fields, (field) => {
+                                return (openBlock(), createElementBlock(Fragment, {
+                                  key: field.key
+                                }, [
+                                  createElementVNode("dt", null, toDisplayString(field.label), 1 /* TEXT */),
+                                  createElementVNode("dd", {
+                                    class: normalizeClass(field.tone ? `cn-files-browser__tone cn-files-browser__tone--${field.tone}` : '')
+                                  }, [
+                                    createVNode(_component_CnCellRenderer, {
+                                      value: field.value,
+                                      formatter: field.formatter || null,
+                                      formatterOptions: field.formatterOptions || null,
+                                      row: $options.sideNode
+                                    }, null, 8 /* PROPS */, ["value", "formatter", "formatterOptions", "row"])
+                                  ], 2 /* CLASS */)
+                                ], 64 /* STABLE_FRAGMENT */))
+                              }), 128 /* KEYED_FRAGMENT */))
+                            ]))
+                          : createCommentVNode("v-if", true),
+                        (card.actions.length > 0)
+                          ? (openBlock(), createElementBlock("div", _hoisted_48, [
+                              (openBlock(true), createElementBlock(Fragment, null, renderList(card.actions, (action) => {
+                                return (openBlock(), createBlock(_component_NcButton, {
+                                  key: action.id,
+                                  "data-testid": `cn-files-browser-side-action-${action.id}`,
+                                  onClick: $event => ($options.runHostAction(action, $options.sideNode))
+                                }, createSlots({
+                                  default: withCtx(() => [
+                                    createTextVNode(" " + toDisplayString($options.hostLabel(action)), 1 /* TEXT */)
+                                  ]),
+                                  _: 2 /* DYNAMIC */
+                                }, [
+                                  (action.icon)
+                                    ? {
+                                        name: "icon",
+                                        fn: withCtx(() => [
+                                          createVNode(_component_CnIcon, {
+                                            name: action.icon,
+                                            size: 20
+                                          }, null, 8 /* PROPS */, ["name"])
+                                        ]),
+                                        key: "0"
+                                      }
+                                    : undefined
+                                ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["data-testid", "onClick"]))
+                              }), 128 /* KEYED_FRAGMENT */))
+                            ]))
+                          : createCommentVNode("v-if", true)
+                      ], 8 /* PROPS */, _hoisted_45))
+                    }), 128 /* KEYED_FRAGMENT */))
+                  ], 8 /* PROPS */, _hoisted_44))
+                : createCommentVNode("v-if", true)
+            ], 2 /* CLASS */)),
     ($props.dropHint && $options.canChange && !$data.loading && $data.error === '')
-      ? (openBlock(), createElementBlock("p", _hoisted_44, [
+      ? (openBlock(), createElementBlock("p", _hoisted_49, [
           createVNode(_component_Upload, { size: 16 }),
           createTextVNode(" " + toDisplayString($props.dropHintLabel), 1 /* TEXT */)
         ]))
@@ -922,7 +1011,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           default: withCtx(() => [
             createElementVNode("p", null, toDisplayString($options.t('nextcloud-vue', 'Delete {name}? This cannot be undone here.', { name: $data.removing.basename })), 1 /* TEXT */),
             ($data.removeError)
-              ? (openBlock(), createElementBlock("p", _hoisted_45, toDisplayString($data.removeError), 1 /* TEXT */))
+              ? (openBlock(), createElementBlock("p", _hoisted_50, toDisplayString($data.removeError), 1 /* TEXT */))
               : createCommentVNode("v-if", true)
           ]),
           _: 1 /* STABLE */