@rpgjs/client 5.0.0-alpha.43 → 5.0.0-alpha.44

package/dist/components/gui/dialogbox/index.ce.js

@@ -1,152 +1,205 @@
-import { useProps, useDefineProps, signal, computed, mount, effect, createTabindexNavigator, h, DOMContainer, DOMElement, cond, Navigation, loop, DOMSprite } from 'canvasengine';
-import { inject } from '../../../core/inject.js';
-import { RpgClientEngine } from '../../../RpgClientEngine.js';
-import { delay } from '@rpgjs/common';
-
+import { inject } from "../../../core/inject.js";
+import { RpgClientEngine } from "../../../RpgClientEngine.js";
+import { DOMContainer, DOMElement, DOMSprite, Navigation, computed, cond, createTabindexNavigator, effect, h, loop, mount, signal, useDefineProps, useProps } from "canvasengine";
+import { delay } from "@rpgjs/common";
+//#region src/components/gui/dialogbox/index.ce
 function component($$props) {
-        useProps($$props);
-        const defineProps = useDefineProps($$props);
-        var engine = inject(RpgClientEngine);
-engine.scene.currentPlayer;
-var keyboardControls = engine.globalConfig.keyboardControls;
-engine.stopProcessingInput = true;
-var selectedItem = signal(0);
-var _a = defineProps(), data = _a.data, onFinish = _a.onFinish; _a.onInteraction;
-var _b = data(), message = _b.message, choices = _b.choices, face = _b.face, speaker = _b.speaker, position = _b.position, typewriterEffect = _b.typewriterEffect; _b.autoClose;
-var fullWidth = computed(function () { return data().fullWidth || false; });
-var resolveProp = function (value) { return typeof value === "function" ? value() : value; };
-var speakerName = computed(function () {
-    var value = resolveProp(speaker);
-    return value ? String(value) : "";
-});
-var dialogPosition = computed(function () { return resolveProp(position) || "bottom"; });
-var isFullWidth = computed(function () { return resolveProp(fullWidth) !== false; });
-var hasFace = computed(function () { return !!resolveProp(face); });
-var displayMessage = signal("");
-var fullMessage = signal("");
-var isTyping = signal(false);
-var typewriterTimer = null;
-mount(function (element) {
-});
-var startTypewriter = function (text) {
-    if (typewriterTimer)
-        clearInterval(typewriterTimer);
-    displayMessage.set("");
-    if (!text)
-        return;
-    var index = 0;
-    isTyping.set(true);
-    typewriterTimer = setInterval(function () {
-        index += 1;
-        displayMessage.set(text.slice(0, index));
-        if (index >= text.length) {
-            clearInterval(typewriterTimer);
-            typewriterTimer = null;
-            isTyping.set(false);
-        }
-    }, 20);
-};
-var finishTyping = function () {
-    if (typewriterTimer)
-        clearInterval(typewriterTimer);
-    typewriterTimer = null;
-    displayMessage.set(fullMessage());
-    isTyping.set(false);
-};
-effect(function () {
-    var text = resolveProp(message) || "";
-    fullMessage.set(text);
-    var useTypewriter = resolveProp(typewriterEffect) !== false;
-    if (!useTypewriter) {
-        finishTyping();
-        return;
-    }
-    startTypewriter(text);
-});
-var hasChoices = computed(function () { return choices.length > 0; });
-var showIndicator = computed(function () { return !hasChoices() && !isTyping(); });
-var nav = createTabindexNavigator(selectedItem, { count: function () { return choices.length; } }, 'wrap');
-function selectChoice(index) {
-    return function () {
-        selectedItem.set(index);
-        onSelect(index);
-    };
-}
-function _onFinish(value) {
-    if (onFinish)
-        onFinish(value);
+	useProps($$props);
+	const defineProps = useDefineProps($$props);
+	var engine = inject(RpgClientEngine);
+	engine.scene.currentPlayer;
+	var keyboardControls = engine.globalConfig.keyboardControls;
+	engine.stopProcessingInput = true;
+	var selectedItem = signal(0), _a = defineProps(), data = _a.data, onFinish = _a.onFinish;
+	_a.onInteraction;
+	var _b = data(), message = _b.message, choices = _b.choices, face = _b.face, speaker = _b.speaker, position = _b.position, typewriterEffect = _b.typewriterEffect;
+	_b.autoClose;
+	var fullWidth = computed(function() {
+		return data().fullWidth || false;
+	});
+	var resolveProp = function(value) {
+		return typeof value === "function" ? value() : value;
+	};
+	var speakerName = computed(function() {
+		var value = resolveProp(speaker);
+		return value ? String(value) : "";
+	});
+	var dialogPosition = computed(function() {
+		return resolveProp(position) || "bottom";
+	});
+	var isFullWidth = computed(function() {
+		return resolveProp(fullWidth) !== false;
+	});
+	var hasFace = computed(function() {
+		return !!resolveProp(face);
+	});
+	var displayMessage = signal("");
+	var fullMessage = signal("");
+	var isTyping = signal(false);
+	var typewriterTimer = null;
+	mount(function(element) {});
+	var startTypewriter = function(text) {
+		if (typewriterTimer) clearInterval(typewriterTimer);
+		displayMessage.set("");
+		if (!text) return;
+		var index = 0;
+		isTyping.set(true);
+		typewriterTimer = setInterval(function() {
+			index += 1;
+			displayMessage.set(text.slice(0, index));
+			if (index >= text.length) {
+				clearInterval(typewriterTimer);
+				typewriterTimer = null;
+				isTyping.set(false);
+			}
+		}, 20);
+	};
+	var finishTyping = function() {
+		if (typewriterTimer) clearInterval(typewriterTimer);
+		typewriterTimer = null;
+		displayMessage.set(fullMessage());
+		isTyping.set(false);
+	};
+	effect(function() {
+		var text = resolveProp(message) || "";
+		fullMessage.set(text);
+		if (!(resolveProp(typewriterEffect) !== false)) {
+			finishTyping();
+			return;
+		}
+		startTypewriter(text);
+	});
+	var hasChoices = computed(function() {
+		return choices.length > 0;
+	});
+	var showIndicator = computed(function() {
+		return !hasChoices() && !isTyping();
+	});
+	var nav = createTabindexNavigator(selectedItem, { count: function() {
+		return choices.length;
+	} }, "wrap");
+	function selectChoice(index) {
+		return function() {
+			selectedItem.set(index);
+			onSelect(index);
+		};
+	}
+	function _onFinish(value) {
+		if (onFinish) onFinish(value);
+	}
+	var onSelect = function(index) {
+		_onFinish(index);
+	};
+	var controls = signal({
+		up: {
+			repeat: true,
+			bind: keyboardControls.up,
+			throttle: 150,
+			keyDown: function() {
+				if (!hasChoices()) return;
+				nav.next(-1);
+			}
+		},
+		down: {
+			repeat: true,
+			bind: keyboardControls.down,
+			throttle: 150,
+			keyDown: function() {
+				if (!hasChoices()) return;
+				nav.next(1);
+			}
+		},
+		action: {
+			bind: keyboardControls.action,
+			keyDown: function() {
+				if (isTyping()) {
+					finishTyping();
+					return;
+				}
+				if (!hasChoices()) return;
+				onSelect(selectedItem());
+			}
+		},
+		gamepad: { enabled: true }
+	});
+	var dialogControls = signal({ action: {
+		bind: keyboardControls.action,
+		keyDown: function() {
+			if (isTyping()) {
+				finishTyping();
+				return;
+			}
+			if (hasChoices()) return;
+			_onFinish();
+		}
+	} });
+	var faceSheet = function(graphicId, animationName) {
+		return {
+			definition: engine.getSpriteSheet(graphicId),
+			playing: animationName
+		};
+	};
+	mount(function(element) {
+		return function() {
+			delay(function() {
+				engine.stopProcessingInput = false;
+			});
+		};
+	});
+	return h(DOMContainer, {
+		width: "100%",
+		height: "100%",
+		controls: dialogControls
+	}, h(DOMElement, {
+		element: "div",
+		attrs: {
+			class: "rpg-ui-dialog-container",
+			"data-position": computed(() => dialogPosition()),
+			"data-full-width": computed(() => isFullWidth() ? "true" : "false"),
+			"data-has-face": computed(() => hasFace() ? "true" : "false")
+		}
+	}, h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-ui-dialog rpg-anim-fade-in" }
+	}, [h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-ui-dialog-body" }
+	}, [h(DOMElement, { element: "div" }, [
+		cond(speakerName(), () => h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-ui-dialog-speaker" },
+			textContent: computed(() => speakerName())
+		})),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-ui-dialog-content" },
+			textContent: computed(() => displayMessage())
+		}),
+		cond(hasChoices(), () => h(Navigation, {
+			tabindex: selectedItem,
+			controls
+		}, h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-ui-dialog-choices" }
+		}, loop(choices, (choice, index) => h(DOMElement, {
+			element: "div",
+			attrs: {
+				class: ["rpg-ui-dialog-choice", computed(() => ({ active: selectedItem() === index }))],
+				tabindex: index,
+				"data-choice-index": index,
+				click: selectChoice(index)
+			},
+			textContent: choice.text
+		})))))
+	]), cond(hasFace(), () => h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-ui-dialog-face" }
+	}, h(DOMSprite, { sheet: computed(() => faceSheet(face.id, face.expression)) })))]), cond(showIndicator, () => h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-ui-dialog-indicator" }
+	}))])));
 }
-var onSelect = function (index) {
-    _onFinish(index);
-};
-var controls = signal({
-    up: {
-        repeat: true,
-        bind: keyboardControls.up,
-        throttle: 150,
-        keyDown: function () {
-            if (!hasChoices())
-                return;
-            nav.next(-1);
-        }
-    },
-    down: {
-        repeat: true,
-        bind: keyboardControls.down,
-        throttle: 150,
-        keyDown: function () {
-            if (!hasChoices())
-                return;
-            nav.next(1);
-        }
-    },
-    action: {
-        bind: keyboardControls.action,
-        keyDown: function () {
-            if (isTyping()) {
-                finishTyping();
-                return;
-            }
-            if (!hasChoices())
-                return;
-            onSelect(selectedItem());
-        }
-    },
-    gamepad: {
-        enabled: true
-    }
-});
-var dialogControls = signal({
-    action: {
-        bind: keyboardControls.action,
-        keyDown: function () {
-            if (isTyping()) {
-                finishTyping();
-                return;
-            }
-            if (hasChoices())
-                return;
-            _onFinish();
-        }
-    },
-});
-var faceSheet = function (graphicId, animationName) {
-    return {
-        definition: engine.getSpriteSheet(graphicId),
-        playing: animationName,
-    };
-};
-mount(function (element) {
-    return function () {
-        // Wait destroy is finished before start processing input
-        delay(function () {
-            engine.stopProcessingInput = false;
-        });
-    };
-});
-        let $this = h(DOMContainer, { width: '100%', height: '100%', controls: dialogControls }, h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog-container', 'data-position': computed(() => dialogPosition()), 'data-full-width': computed(() => isFullWidth() ? "true" : "false"), 'data-has-face': computed(() => hasFace() ? "true" : "false") } }, h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog rpg-anim-fade-in' } }, [h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog-body' } }, [h(DOMElement, { element: "div" }, [cond(speakerName(), () => h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog-speaker' }, textContent: computed(() => speakerName()) })), h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog-content' }, textContent: computed(() => displayMessage()) }), cond(hasChoices(), () => h(Navigation, { tabindex: selectedItem, controls: controls }, h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog-choices' } }, loop(choices, (choice, index) => h(DOMElement, { element: "div", attrs: { class: ['rpg-ui-dialog-choice', computed(() => ({ active: selectedItem() === index }))], tabindex: index, 'data-choice-index': index, click: selectChoice(index) }, textContent: choice.text })))))]), cond(hasFace(), () => h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog-face' } }, h(DOMSprite, { sheet: computed(() => faceSheet(face.id, face.expression)) })))]), cond(showIndicator, () => h(DOMElement, { element: "div", attrs: { class: 'rpg-ui-dialog-indicator' } }))])));
-        return $this
-      }
-
+//#endregion
 export { component as default };
-//# sourceMappingURL=index.ce.js.map
+
+//# sourceMappingURL=index.ce.js.map

package/dist/components/gui/dialogbox/index.ce.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.ce.js","sources":["../../../../src/components/gui/dialogbox/index.ce"],"sourcesContent":["<DOMContainer width=\"100%\" height=\"100%\" controls={dialogControls}>\n    <div\n        class=\"rpg-ui-dialog-container\"\n        data-position={dialogPosition()}\n        data-full-width={isFullWidth() ? \"true\" : \"false\"}\n        data-has-face={hasFace() ? \"true\" : \"false\"}\n    >\n        <div class=\"rpg-ui-dialog rpg-anim-fade-in\">\n            <div class=\"rpg-ui-dialog-body\">\n               <div>\n                    @if (speakerName()) {\n                        <div class=\"rpg-ui-dialog-speaker\">{speakerName()}</div>\n                    }\n                    <div class=\"rpg-ui-dialog-content\">\n                        {displayMessage()}\n                    </div>\n                    @if (hasChoices()) {\n                        <Navigation tabindex={selectedItem} controls={controls}>\n                            <div class=\"rpg-ui-dialog-choices\">\n                                @for ((choice,index) of choices) {\n                                    <div\n                                        class=\"rpg-ui-dialog-choice\"\n                                        class={{active: selectedItem() === index}}\n                                        tabindex={index}\n                                        data-choice-index={index}\n                                        click={selectChoice(index)}\n                                    >{{ choice.text }}</div>\n                                }\n                            </div>\n                        </Navigation>\n                    }\n               </div>\n                @if (hasFace()) {\n                    <div class=\"rpg-ui-dialog-face\">\n                        <DOMSprite sheet={faceSheet(face.id, face.expression)} />\n                    </div>\n                }\n            </div>\n            @if (showIndicator) {\n                <div class=\"rpg-ui-dialog-indicator\"></div>\n            }\n        </div>\n    </div>\n</DOMContainer>\n    \n<script>\n    import { effect, signal, computed, createTabindexNavigator, mount } from \"canvasengine\";\n    import { inject } from \"../../../core/inject\";\n    import { RpgClientEngine } from \"../../../RpgClientEngine\";\n    import { delay } from \"@rpgjs/common\";\n\n    const engine = inject(RpgClientEngine);\n    const currentPlayer = engine.scene.currentPlayer\n    const keyboardControls = engine.globalConfig.keyboardControls;\n\n    engine.stopProcessingInput = true;\n\n    const selectedItem = signal(0)\n    let isDestroyed = false;\n\n    const {\n        data,\n        onFinish,\n        onInteraction\n    } = defineProps();\n\n    const { message, choices, face, speaker, position, typewriterEffect, autoClose } = data();\n    const fullWidth = computed(() => data().fullWidth || false);\n\n    const resolveProp = (value) => typeof value === \"function\" ? value() : value;\n\n    const speakerName = computed(() => {\n        const value = resolveProp(speaker);\n        return value ? String(value) : \"\";\n    });\n\n    const dialogPosition = computed(() => resolveProp(position) || \"bottom\");\n    const isFullWidth = computed(() => resolveProp(fullWidth) !== false);\n    const hasFace = computed(() => !!resolveProp(face));\n\n    const displayMessage = signal(\"\");\n    const fullMessage = signal(\"\");\n    const isTyping = signal(false);\n    let typewriterTimer = null;\n    let rootElement = null;\n\n    mount((element) => {\n        rootElement = element;\n    });\n\n    const startTypewriter = (text) => {\n        if (typewriterTimer) clearInterval(typewriterTimer);\n        displayMessage.set(\"\");\n        if (!text) return;\n        let index = 0;\n        isTyping.set(true);\n        typewriterTimer = setInterval(() => {\n            index += 1;\n            displayMessage.set(text.slice(0, index));\n            if (index >= text.length) {\n                clearInterval(typewriterTimer);\n                typewriterTimer = null;\n                isTyping.set(false);\n            }\n        }, 20);\n    };\n\n    const finishTyping = () => {\n        if (typewriterTimer) clearInterval(typewriterTimer);\n        typewriterTimer = null;\n        displayMessage.set(fullMessage());\n        isTyping.set(false);\n    };\n\n    effect(() => {\n        const text = resolveProp(message) || \"\";\n        fullMessage.set(text);\n        const useTypewriter = resolveProp(typewriterEffect) !== false;\n        if (!useTypewriter) {\n            finishTyping();\n            return;\n        }\n        startTypewriter(text);\n    });\n\n\n    const hasChoices = computed(() => choices.length > 0);\n    const showIndicator = computed(() => !hasChoices() && !isTyping());\n    const nav = createTabindexNavigator(selectedItem, { count: () => choices.length }, 'wrap');\n\n    function selectChoice(index) {\n        return function() {\n            selectedItem.set(index);\n            onSelect(index);\n        }\n    }\n\n    function _onFinish(value) {\n        if (onFinish) onFinish(value);\n    }\n\n    const onSelect = (index) => {\n        _onFinish(index);\n    };\n\n    const controls = signal({\n        up: {\n            repeat: true,\n            bind: keyboardControls.up,\n            throttle: 150,\n            keyDown() {\n                if (!hasChoices()) return;\n                nav.next(-1);\n            }\n        },\n        down: {\n            repeat: true,\n            bind: keyboardControls.down,\n            throttle: 150,\n            keyDown() {\n                if (!hasChoices()) return;\n                nav.next(1);\n            }\n        },\n        action: {\n            bind: keyboardControls.action,\n            keyDown() {\n                if (isTyping()) {\n                    finishTyping();\n                    return;\n                }\n                if (!hasChoices()) return;\n                onSelect(selectedItem());\n            }\n        },\n        gamepad: {\n            enabled: true\n        }\n    });\n    \n    const dialogControls = signal({\n        action: {\n            bind: keyboardControls.action,\n            keyDown() {\n                if (isTyping()) {\n                    finishTyping();\n                    return;\n                }\n                if (hasChoices()) return;\n                _onFinish();\n            }\n        },\n    })\n\n    const faceSheet = (graphicId, animationName) => {\n        return {\n            definition: engine.getSpriteSheet(graphicId),\n            playing: animationName,\n        };\n    }\n\n    mount((element) => {\n        return () => {\n            isDestroyed = true;\n            // Wait destroy is finished before start processing input\n            delay(() => {\n                engine.stopProcessingInput = false;\n            })\n        }\n  })\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.ce.js","names":[],"sources":["../../../../src/components/gui/dialogbox/index.ce"],"sourcesContent":["<DOMContainer width=\"100%\" height=\"100%\" controls={dialogControls}>\n    <div\n        class=\"rpg-ui-dialog-container\"\n        data-position={dialogPosition()}\n        data-full-width={isFullWidth() ? \"true\" : \"false\"}\n        data-has-face={hasFace() ? \"true\" : \"false\"}\n    >\n        <div class=\"rpg-ui-dialog rpg-anim-fade-in\">\n            <div class=\"rpg-ui-dialog-body\">\n               <div>\n                    @if (speakerName()) {\n                        <div class=\"rpg-ui-dialog-speaker\">{speakerName()}</div>\n                    }\n                    <div class=\"rpg-ui-dialog-content\">\n                        {displayMessage()}\n                    </div>\n                    @if (hasChoices()) {\n                        <Navigation tabindex={selectedItem} controls={controls}>\n                            <div class=\"rpg-ui-dialog-choices\">\n                                @for ((choice,index) of choices) {\n                                    <div\n                                        class=\"rpg-ui-dialog-choice\"\n                                        class={{active: selectedItem() === index}}\n                                        tabindex={index}\n                                        data-choice-index={index}\n                                        click={selectChoice(index)}\n                                    >{{ choice.text }}</div>\n                                }\n                            </div>\n                        </Navigation>\n                    }\n               </div>\n                @if (hasFace()) {\n                    <div class=\"rpg-ui-dialog-face\">\n                        <DOMSprite sheet={faceSheet(face.id, face.expression)} />\n                    </div>\n                }\n            </div>\n            @if (showIndicator) {\n                <div class=\"rpg-ui-dialog-indicator\"></div>\n            }\n        </div>\n    </div>\n</DOMContainer>\n    \n<script>\n    import { effect, signal, computed, createTabindexNavigator, mount } from \"canvasengine\";\n    import { inject } from \"../../../core/inject\";\n    import { RpgClientEngine } from \"../../../RpgClientEngine\";\n    import { delay } from \"@rpgjs/common\";\n\n    const engine = inject(RpgClientEngine);\n    const currentPlayer = engine.scene.currentPlayer\n    const keyboardControls = engine.globalConfig.keyboardControls;\n\n    engine.stopProcessingInput = true;\n\n    const selectedItem = signal(0)\n    let isDestroyed = false;\n\n    const {\n        data,\n        onFinish,\n        onInteraction\n    } = defineProps();\n\n    const { message, choices, face, speaker, position, typewriterEffect, autoClose } = data();\n    const fullWidth = computed(() => data().fullWidth || false);\n\n    const resolveProp = (value) => typeof value === \"function\" ? value() : value;\n\n    const speakerName = computed(() => {\n        const value = resolveProp(speaker);\n        return value ? String(value) : \"\";\n    });\n\n    const dialogPosition = computed(() => resolveProp(position) || \"bottom\");\n    const isFullWidth = computed(() => resolveProp(fullWidth) !== false);\n    const hasFace = computed(() => !!resolveProp(face));\n\n    const displayMessage = signal(\"\");\n    const fullMessage = signal(\"\");\n    const isTyping = signal(false);\n    let typewriterTimer = null;\n    let rootElement = null;\n\n    mount((element) => {\n        rootElement = element;\n    });\n\n    const startTypewriter = (text) => {\n        if (typewriterTimer) clearInterval(typewriterTimer);\n        displayMessage.set(\"\");\n        if (!text) return;\n        let index = 0;\n        isTyping.set(true);\n        typewriterTimer = setInterval(() => {\n            index += 1;\n            displayMessage.set(text.slice(0, index));\n            if (index >= text.length) {\n                clearInterval(typewriterTimer);\n                typewriterTimer = null;\n                isTyping.set(false);\n            }\n        }, 20);\n    };\n\n    const finishTyping = () => {\n        if (typewriterTimer) clearInterval(typewriterTimer);\n        typewriterTimer = null;\n        displayMessage.set(fullMessage());\n        isTyping.set(false);\n    };\n\n    effect(() => {\n        const text = resolveProp(message) || \"\";\n        fullMessage.set(text);\n        const useTypewriter = resolveProp(typewriterEffect) !== false;\n        if (!useTypewriter) {\n            finishTyping();\n            return;\n        }\n        startTypewriter(text);\n    });\n\n\n    const hasChoices = computed(() => choices.length > 0);\n    const showIndicator = computed(() => !hasChoices() && !isTyping());\n    const nav = createTabindexNavigator(selectedItem, { count: () => choices.length }, 'wrap');\n\n    function selectChoice(index) {\n        return function() {\n            selectedItem.set(index);\n            onSelect(index);\n        }\n    }\n\n    function _onFinish(value) {\n        if (onFinish) onFinish(value);\n    }\n\n    const onSelect = (index) => {\n        _onFinish(index);\n    };\n\n    const controls = signal({\n        up: {\n            repeat: true,\n            bind: keyboardControls.up,\n            throttle: 150,\n            keyDown() {\n                if (!hasChoices()) return;\n                nav.next(-1);\n            }\n        },\n        down: {\n            repeat: true,\n            bind: keyboardControls.down,\n            throttle: 150,\n            keyDown() {\n                if (!hasChoices()) return;\n                nav.next(1);\n            }\n        },\n        action: {\n            bind: keyboardControls.action,\n            keyDown() {\n                if (isTyping()) {\n                    finishTyping();\n                    return;\n                }\n                if (!hasChoices()) return;\n                onSelect(selectedItem());\n            }\n        },\n        gamepad: {\n            enabled: true\n        }\n    });\n    \n    const dialogControls = signal({\n        action: {\n            bind: keyboardControls.action,\n            keyDown() {\n                if (isTyping()) {\n                    finishTyping();\n                    return;\n                }\n                if (hasChoices()) return;\n                _onFinish();\n            }\n        },\n    })\n\n    const faceSheet = (graphicId, animationName) => {\n        return {\n            definition: engine.getSpriteSheet(graphicId),\n            playing: animationName,\n        };\n    }\n\n    mount((element) => {\n        return () => {\n            isDestroyed = true;\n            // Wait destroy is finished before start processing input\n            delay(() => {\n                engine.stopProcessingInput = false;\n            })\n        }\n  })\n</script>\n"],"mappings":"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"}