Skip to main content

DocumentManager

DocumentManager renders a file/folder browser with actions (upload, rename, move, duplicate, delete, copy link, custom actions). Like DataTable, it's props-driven UI: you pass items and toggle the actions you want, and a /spfx or /codeapps adapter hook supplies the data and the operations.

When to use​

  • Present a SharePoint document library (or Dataverse file column) with a familiar file-explorer UX.
  • Any folder-based file browser where you control which actions are available.

Import​

import { DocumentManager } from '@spartanfx/react';

Standalone (bring your own data)​

items is the only required prop; enable the actions you want.

<DocumentManager
  items={documents}
  currentPath="/Shared Documents/Projects"
  enableUpload
  enableRename
  enableDelete
  allowedFileTypes={['pdf', 'docx', 'xlsx']}
/>

With the SharePoint adapter​

The adapter hook returns the items plus operations; wire them into the component:

import { DocumentManager } from '@spartanfx/react';
import { useSharePointDocumentManager } from '@spartanfx/react/spfx';

function LibraryBrowser({ sp }) {
  const { items, loading, uploadFiles, deleteItems, refresh } =
    useSharePointDocumentManager({
      sp,
      libraryName: 'Documents',
      rootFolderPath: '/sites/mysite/Shared Documents',
    });

  return (
    <DocumentManager
      items={items}
      enableUpload
      enableDelete
      onUpload={uploadFiles}
      onDelete={deleteItems}
    />
  );
}

For Power Apps Code Apps, swap the hook for useCASharePointDocumentManager. See Architecture for how adapters map to targets.

Key props​

PropTypeNotes
items (required)IDocumentItem[]Documents and folders to display.
currentPathstringFolder currently shown.
enableUpload / enableRename / enableDelete / enableMove / enableDuplicatebooleanToggle each action.
enableMultiSelectbooleanAllow selecting multiple items.
allowedFileTypesstring[]Restrict uploads by extension.
customActionsICustomAction[]Add your own per-item actions.

See the full generated reference: DocumentManager API ↗ and the adapter hook useSharePointDocumentManager.

See also​