0
0
mirror of https://github.com/wagtail/wagtail.git synced 2024-11-29 01:22:07 +01:00

Add 'reset' value to TeleportController to allow resetting the target element

This commit is contained in:
Sage Abdullah 2024-01-23 10:33:40 +00:00 committed by Thibaud Colas
parent 08d5264088
commit 2b8d39ab0d

View File

@ -4,6 +4,8 @@ import { Controller } from '@hotwired/stimulus';
* 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.
@ -22,11 +24,14 @@ import { Controller } from '@hotwired/stimulus';
export class TeleportController extends Controller<HTMLTemplateElement> {
static values = {
keep: { default: false, type: Boolean },
reset: { default: false, type: Boolean },
target: { default: '', type: String },
};
/** If true, keep the original DOM element intact, otherwise remove it when cloned. */
declare keepValue: boolean;
/** If true, empty the target element's contents before appending the cloned element. */
declare resetValue: boolean;
/** A selector to determine the target location to clone the element. */
declare targetValue: string;
@ -40,6 +45,7 @@ export class TeleportController extends Controller<HTMLTemplateElement> {
const complete = () => {
if (completed) return;
if (this.resetValue) target.innerHTML = '';
target.append(this.templateElement);
this.dispatch('appended', { cancelable: false, detail: { target } });
completed = true;