useSetInteractionMode

Returns a setter that changes the interaction mode: the active tool and, optionally, the content policy, in one atomic switch. See Building a PDF application for the interaction mode concept.

const setInteractionMode = useSetInteractionMode()

setInteractionMode(interactionTool, contentPolicy?)
  • interactionTool is one of the tools listed in useInteractionTool.
  • contentPolicy sets the permission level of each content kind, globally or per block. When it is omitted, the current policy is preserved. The format is described in CONTENT_POLICY_PRESET.
  • Changing the mode clears the selection. Setting a tool and policy equal to the current ones (compared field by field) changes nothing.
  • The setter's identity is stable, and the hook itself never re-renders the component: components that only switch the mode should use it instead of the reading hooks.
  • Combinations the SDK doesn't support yet, such as the textSelect tool with editable text, log a "not supported" warning.
  • The mode is local to each user: switching it affects this client only.

Example

import {
  CONTENT_POLICY_PRESET,
  InteractionTool,
  useSetInteractionMode,
} from '@sdk-pdf/react'

const textSelectTool: InteractionTool = { type: 'textSelect' }
const selectTool: InteractionTool = { type: 'select' }

function ModeSwitch() {
  const setInteractionMode = useSetInteractionMode()

  return (
    <div role="toolbar">
      <button
        onClick={() =>
          setInteractionMode(textSelectTool, CONTENT_POLICY_PRESET.PDF_PRINTER)
        }
      >
        Preview
      </button>
      <button
        onClick={() => setInteractionMode(selectTool, CONTENT_POLICY_PRESET.PDF_EDITOR)}
      >
        Edit
      </button>
    </div>
  )
}

Read the active tool back with useInteractionTool.

On this page