> ## Documentation Index
> Fetch the complete documentation index at: https://www.canva.dev/docs/apps/llms.txt
> Use this file to discover all available pages before exploring further.

# ui.startDragToCursor

API reference for the ui.startDragToCursor method.

Adds the specified element or content to responsive pages, which slot things into a text stream at the end of a drag event.

## Parameters

<Prop.List>
  <Prop name="event" required type="DragStartEvent<E>" sourceLineNumbers={[6635]}>
    A drag start event.

    <PillAccordion defaultExpanded={true} title={<>Properties of <strong>event</strong></>}>
      <Prop.List />
    </PillAccordion>
  </Prop>

  <Prop name="dragData" required type="object" sourceLineNumbers={[6635]}>
    Element or content to be added to the design at the end of the drag event.

    <Tabs>
      <Tab name="Embeds">
        Embed element to be added to the design at the end of a drag event.

        <Prop.List>
          <Prop name="type" required type="string" sourceLineNumbers={[3891]}>
            The type of element.

            The only valid value is `"embed"`.
          </Prop>

          <Prop name="previewSize" required type="Dimensions" sourceLineNumbers={[3895]}>
            The dimensions of the preview image.

            <PillAccordion defaultExpanded={false} title={<>Properties of <strong>previewSize</strong></>}>
              <Prop.List>
                <Prop name="width" required type="number" sourceLineNumbers={[3690]}>
                  A width, in pixels.
                </Prop>

                <Prop name="height" required type="number" sourceLineNumbers={[3694]}>
                  A height, in pixels.
                </Prop>
              </Prop.List>
            </PillAccordion>
          </Prop>

          <Prop name="previewUrl" required type="string" sourceLineNumbers={[3899]}>
            The URL of an image to display under the user's cursor during the drag and drop event.
          </Prop>

          <Prop name="embedUrl" required type="string" sourceLineNumbers={[3906]}>
            The URL of media that can be embedded, such as the URL of a YouTube video.

            This URL must be supported by the Iframely API.
          </Prop>
        </Prop.List>
      </Tab>

      <Tab name="Videos">
        Video element or content to be added to the design at the end of a drag event.

        <Prop.List>
          <Prop name="type" required type="string" sourceLineNumbers={[6691]}>
            The type of element.

            The only valid value is `"video"`.
          </Prop>

          <Prop name="resolveVideoRef" required type="function" sourceLineNumbers={[6695]}>
            A function that returns a reference (ref) to a video asset in Canva's backend.

            **Returns**

            A `Promise` that resolves with the following object:

            <Prop.List>
              <Prop name="ref" required type="VideoRef" sourceLineNumbers={[6696]}>
                A unique identifier that references a video asset in Canva's backend.
              </Prop>
            </Prop.List>
          </Prop>

          <Prop name="previewSize" required type="Dimensions" sourceLineNumbers={[6701]}>
            The dimensions of the preview image.

            <PillAccordion defaultExpanded={false} title={<>Properties of <strong>previewSize</strong></>}>
              <Prop.List>
                <Prop name="width" required type="number" sourceLineNumbers={[3690]}>
                  A width, in pixels.
                </Prop>

                <Prop name="height" required type="number" sourceLineNumbers={[3694]}>
                  A height, in pixels.
                </Prop>
              </Prop.List>
            </PillAccordion>
          </Prop>

          <Prop name="previewUrl" required type="string" sourceLineNumbers={[6713]}>
            The URL of an image to display under the user's cursor during the drag and drop event.
          </Prop>

          <Prop name="fullSize" type="Dimensions" sourceLineNumbers={[6709]}>
            The dimensions of the full-size video.

            * These dimensions are used when adding the video to the design
            * If omitted, the `previewSize` dimensions are used as a fallback.

            <PillAccordion defaultExpanded={false} title={<>Properties of <strong>fullSize</strong></>}>
              <Prop.List>
                <Prop name="width" required type="number" sourceLineNumbers={[3690]}>
                  A width, in pixels.
                </Prop>

                <Prop name="height" required type="number" sourceLineNumbers={[3694]}>
                  A height, in pixels.
                </Prop>
              </Prop.List>
            </PillAccordion>
          </Prop>
        </Prop.List>
      </Tab>

      <Tab name="Images">
        Image element or content to be added to the design at the end of a drag event.

        <Prop.List>
          <Prop name="type" required type="string" sourceLineNumbers={[1299]}>
            The type of element.

            The only valid value is `"image"`.
          </Prop>

          <Prop name="previewSize" required type="Dimensions" sourceLineNumbers={[1303]}>
            The dimensions of the preview image.

            <PillAccordion defaultExpanded={false} title={<>Properties of <strong>previewSize</strong></>}>
              <Prop.List>
                <Prop name="width" required type="number" sourceLineNumbers={[3690]}>
                  A width, in pixels.
                </Prop>

                <Prop name="height" required type="number" sourceLineNumbers={[3694]}>
                  A height, in pixels.
                </Prop>
              </Prop.List>
            </PillAccordion>
          </Prop>

          <Prop name="resolveImageRef" required type="function" sourceLineNumbers={[4085]}>
            A function that returns a reference (ref) to an audio asset in Canva's backend.

            **Returns**

            A `Promise` that resolves with the following object:

            <Prop.List>
              <Prop name="ref" required type="ImageRef" sourceLineNumbers={[4086]}>
                A unique identifier that references an image asset in Canva's backend.
              </Prop>
            </Prop.List>
          </Prop>

          <Prop name="previewUrl" required type="string" sourceLineNumbers={[4091]}>
            The URL of an image to display under the user's cursor during the drag and drop event.
          </Prop>

          <Prop name="fullSize" type="Dimensions" sourceLineNumbers={[4095]}>
            The dimensions of the full-size image.

            <PillAccordion defaultExpanded={false} title={<>Properties of <strong>fullSize</strong></>}>
              <Prop.List>
                <Prop name="width" required type="number" sourceLineNumbers={[3690]}>
                  A width, in pixels.
                </Prop>

                <Prop name="height" required type="number" sourceLineNumbers={[3694]}>
                  A height, in pixels.
                </Prop>
              </Prop.List>
            </PillAccordion>
          </Prop>
        </Prop.List>
      </Tab>
    </Tabs>
  </Prop>
</Prop.List>

## Returns

`Promise<void>`

## Permissions

To use this method, the `canva:design:content:write` permission must be enabled for the app. To learn more, see [Permissions](https://www.canva.dev/docs/apps/configuring-intents-permissions/).