Wagtail client-side components
    Preparing search index...

    Class TeleportController

    Allows the controlled element's content to be copied and appended to another place in the DOM. Once copied, the original controlled element will be removed from the DOM unless keep is true. If reset is true, the target element will be emptied before the controlled element is appended. If a target selector isn't provided, a default target of document.body or the Shadow Root's first DOM node will be used. Depending on location of the controlled element.

    <aside>
      <template
        data-controller="w-teleport"
        data-w-teleport-target-value="#other-location"
      >
        <div class="content-to-clone">Some content</div>
      </template>
      <div id="other-location"></div>
    </aside>

    Hierarchy

    Index

    Constructors

    constructor

    Properties

    context keepValue modeValue resetValue targetValue blessings outlets targets values

    Accessors

    application classes data element identifier outlets scope target targets templateFragment shouldLoad

    Methods

    append connect disconnect dispatch initialize afterLoad

    Constructors

    • Parameters

      • context: Context

      Returns TeleportController

    Properties

    context: Context
    keepValue: boolean

    If true, keep the original DOM element intact, otherwise remove it when cloned.

    modeValue: TeleportMode

    The mode to use when inserting the cloned element into the target.

    TeleportMode for available modes. Defaults to beforeend to preserve legacy behavior.

    resetValue: boolean

    If true, empty the target element's contents before appending the cloned element.

    RemovedInWagtail80Warning Use modeValue with innerHTML or outerHTML instead.

    targetValue: string

    A selector to determine the target location to clone the element.

    blessings: (<T>(constructor: Constructor<T>) => any)[]
    outlets: string[]
    targets: string[]
    values: {
        keep: { default: boolean; type: BooleanConstructor };
        mode: { default: TeleportMode; type: StringConstructor };
        reset: { default: boolean; type: BooleanConstructor };
        target: { default: string; type: StringConstructor };
    } = ...

    Accessors

    • get application(): Application

      Returns Application

    • get classes(): ClassMap

      Returns ClassMap

    • get data(): DataMap

      Returns DataMap

    • get element(): ElementType

      Returns ElementType

    • get identifier(): string

      Returns string

    • get outlets(): OutletSet

      Returns OutletSet

    • get scope(): Scope

      Returns Scope

    • get targets(): TargetSet

      Returns TargetSet

    • get shouldLoad(): boolean

      Returns boolean

    Methods

    • Returns void

    • Parameters

      • eventName: string
      • Optional__namedParameters: Partial<
            {
                bubbles: boolean;
                cancelable: boolean;
                detail: Object;
                prefix: string;
                target: Element
                | Window
                | Document;
            },
        >

      Returns CustomEvent<Object>

    • Returns void

    • Parameters

      • _identifier: string
      • _application: Application

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Accessors
    Methods