# useWidgetById

Source: https://sdk.pdf.net/docs/v1/reference/useWidgetById



Returns the snapshot of one widget by id and re-renders the component when the widget changes.

```ts
const widget = useWidgetById(widgetId) // Widget | undefined
```

* The value is a `Widget` snapshot, the same as the entries of [useWidgets](https://sdk.pdf.net/docs/v1/reference/useWidgets): a plain object that doesn't update with the document and doesn't change the document when mutated.
* The value is `undefined` when the id is unknown, the block is not a widget, or the widget is deleted. A deleted widget can come back with an undo, and the value follows it.
* The widget's page must be loaded for the widget to be found; [useWidgets](https://sdk.pdf.net/docs/v1/reference/useWidgets) tells when all widgets are loaded.

## Example [#example]

```tsx
import { useWidgetById } from '@sdk-pdf/react'

function WidgetLabel({ widgetId }: { widgetId: string }) {
  const widget = useWidgetById(widgetId)

  if (!widget) return null

  return (
    <span>
      {widget.fieldName} ({widget.widgetType})
    </span>
  )
}
```

To change the widget, see [useSetWidgetProps](https://sdk.pdf.net/docs/v1/reference/useSetWidgetProps).