@rpgjs/client 5.0.0-alpha.9 → 5.0.0-beta.10

package/dist/components/gui/shop/shop.ce.js

@@ -0,0 +1,614 @@
+import { inject } from "../../../core/inject.js";
+import { RpgClientEngine } from "../../../RpgClientEngine.js";
+import { DOMContainer, DOMElement, DOMSprite, Navigation, computed, cond, createTabindexNavigator, effect, h, loop, signal, useDefineProps, useProps } from "canvasengine";
+//#region src/components/gui/shop/shop.ce
+function component($$props) {
+	useProps($$props);
+	const defineProps = useDefineProps($$props);
+	const engine = inject(RpgClientEngine);
+	const currentPlayer = engine.scene.currentPlayer;
+	const keyboardControls = engine.globalConfig.keyboardControls;
+	const iconSheet = (iconId) => ({
+		definition: engine.getSpriteSheet(iconId),
+		playing: "default"
+	});
+	const goldTerm = engine.globalConfig.goldTerm || "G";
+	const selectedItem = signal(0);
+	const selectedTab = signal(0);
+	const tradeMode = signal("buy");
+	const tradeView = signal("mode");
+	const selectedModeIndex = signal(0);
+	const quantity = signal(1);
+	const quantityDialogOpen = signal(false);
+	const defaultMessage = "Welcome to my shop!";
+	const tabs = [
+		{
+			id: "item",
+			label: "Items"
+		},
+		{
+			id: "weapon",
+			label: "Weapons"
+		},
+		{
+			id: "armor",
+			label: "Armor"
+		}
+	];
+	const { data, onInteraction, onFinish } = defineProps();
+	const resolveProp = (value) => typeof value === "function" ? value() : value;
+	const guiData = computed(() => resolveProp(data) || {});
+	const shopMessage = computed(() => {
+		const message = resolveProp(guiData().message);
+		return message ? String(message) : defaultMessage;
+	});
+	const face = computed(() => resolveProp(guiData().face));
+	const hasFace = computed(() => {
+		const value = face();
+		return value && value.id;
+	});
+	const buyItems = computed(() => guiData().items || []);
+	const sellItems = computed(() => guiData().sellItems || []);
+	const activeItems = computed(() => tradeMode() === "buy" ? buyItems() : sellItems());
+	const filteredItems = computed(() => {
+		const tab = tabs[selectedTab()];
+		const items = activeItems();
+		if (!tab) return [];
+		return items.filter((item) => item?.type === tab.id);
+	});
+	const currentItem = computed(() => filteredItems()[selectedItem()]);
+	const gold = computed(() => currentPlayer()._gold());
+	const actionLabel = computed(() => tradeMode() === "buy" ? "Buy" : "Sell");
+	const faceSheet = (graphicId, animationName) => ({
+		definition: engine.getSpriteSheet(graphicId),
+		playing: animationName || "default"
+	});
+	const maxQuantity = computed(() => {
+		const item = currentItem();
+		if (!item) return 0;
+		const price = item?.price || 0;
+		if (price <= 0) return 0;
+		if (tradeMode() === "sell") {
+			const qty = item?.quantity ?? 0;
+			return Math.max(0, qty);
+		}
+		return Math.max(1, Math.floor(gold() / price));
+	});
+	const totalPrice = computed(() => {
+		return (currentItem()?.price || 0) * quantity();
+	});
+	const displayStats = computed(() => {
+		const stats = currentItem()?.stats || {};
+		const params = guiData().playerParams || {};
+		const order = [
+			"atk",
+			"def",
+			"pdef",
+			"sdef",
+			"str",
+			"dex",
+			"int",
+			"agi",
+			"maxHp",
+			"maxSp"
+		];
+		const labels = {
+			atk: "ATK",
+			def: "DEF",
+			pdef: "PDEF",
+			sdef: "SDEF",
+			str: "STR",
+			dex: "DEX",
+			int: "INT",
+			agi: "AGI",
+			maxHp: "MAX HP",
+			maxSp: "MAX SP"
+		};
+		const orderedKeys = order.filter((key) => stats[key] !== void 0);
+		const extraKeys = Object.keys(stats).filter((key) => !order.includes(key));
+		const keys = orderedKeys.concat(extraKeys);
+		const list = [];
+		for (const key of keys) {
+			const delta = stats[key];
+			if (delta === void 0 || delta === 0) continue;
+			let current = params[key];
+			if (current === void 0 && key === "def") current = params.pdef;
+			const next = current !== void 0 ? current + delta : void 0;
+			list.push({
+				key,
+				label: labels[key] || key.toUpperCase(),
+				delta,
+				current,
+				next
+			});
+		}
+		return list;
+	});
+	const nav = createTabindexNavigator(selectedItem, { count: () => filteredItems().length }, "wrap");
+	const navTab = createTabindexNavigator(selectedTab, { count: () => tabs.length }, "wrap");
+	const navMode = createTabindexNavigator(selectedModeIndex, { count: () => 2 }, "wrap");
+	function selectItem(index) {
+		return function() {
+			selectedItem.set(index);
+			quantity.set(1);
+			if (!isItemDisabled(filteredItems()[index])) quantityDialogOpen.set(true);
+		};
+	}
+	function selectTab(index) {
+		return function() {
+			selectedTab.set(index);
+			selectedItem.set(0);
+		};
+	}
+	function selectMode(mode) {
+		return function() {
+			tradeMode.set(mode);
+			selectedModeIndex.set(mode === "buy" ? 0 : 1);
+			selectedItem.set(0);
+			quantity.set(1);
+			tradeView.set("items");
+		};
+	}
+	function isItemDisabled(item) {
+		if (!item) return true;
+		const price = item?.price || 0;
+		if (price <= 0) return true;
+		if (tradeMode() === "sell") return (item?.quantity ?? 0) <= 0;
+		return gold() < price;
+	}
+	function backToMode() {
+		return function() {
+			tradeView.set("mode");
+		};
+	}
+	function changeQuantity(delta) {
+		return function() {
+			const limit = maxQuantity();
+			if (limit <= 0) return;
+			const nextValue = Math.max(1, Math.min(limit, quantity() + delta));
+			if (nextValue !== quantity()) quantity.set(nextValue);
+		};
+	}
+	function closeQuantityDialog() {
+		return function() {
+			quantityDialogOpen.set(false);
+		};
+	}
+	function confirmTrade() {
+		return function() {
+			const item = currentItem();
+			if (!item || isItemDisabled(item)) {
+				quantityDialogOpen.set(false);
+				return;
+			}
+			onInteraction(tradeMode() === "buy" ? "buyItem" : "sellItem", {
+				id: item.id,
+				nb: quantity()
+			});
+			quantityDialogOpen.set(false);
+		};
+	}
+	effect(() => {
+		const count = filteredItems().length;
+		if (selectedItem() >= count) selectedItem.set(Math.max(0, count - 1));
+	});
+	const modeControls = signal({
+		left: {
+			repeat: true,
+			bind: keyboardControls.left,
+			throttle: 150,
+			keyDown() {
+				navMode.next(-1);
+			}
+		},
+		right: {
+			repeat: true,
+			bind: keyboardControls.right,
+			throttle: 150,
+			keyDown() {
+				navMode.next(1);
+			}
+		},
+		action: {
+			bind: keyboardControls.action,
+			keyDown() {
+				const mode = selectedModeIndex() === 0 ? "buy" : "sell";
+				tradeMode.set(mode);
+				selectedItem.set(0);
+				quantity.set(1);
+				tradeView.set("items");
+			}
+		},
+		escape: {
+			bind: keyboardControls.escape,
+			keyDown() {
+				onFinish();
+			}
+		},
+		gamepad: { enabled: true }
+	});
+	const itemControls = signal({
+		up: {
+			repeat: true,
+			bind: keyboardControls.up,
+			throttle: 150,
+			keyDown() {
+				if (quantityDialogOpen()) {
+					changeQuantity(1)();
+					return;
+				}
+				nav.next(-1);
+			}
+		},
+		down: {
+			repeat: true,
+			bind: keyboardControls.down,
+			throttle: 150,
+			keyDown() {
+				if (quantityDialogOpen()) {
+					changeQuantity(-1)();
+					return;
+				}
+				nav.next(1);
+			}
+		},
+		action: {
+			bind: keyboardControls.action,
+			keyDown() {
+				if (quantityDialogOpen()) {
+					const item = currentItem();
+					if (!item || isItemDisabled(item)) {
+						quantityDialogOpen.set(false);
+						return;
+					}
+					onInteraction(tradeMode() === "buy" ? "buyItem" : "sellItem", {
+						id: item.id,
+						nb: quantity()
+					});
+					quantityDialogOpen.set(false);
+					return;
+				}
+				if (!isItemDisabled(currentItem())) quantityDialogOpen.set(true);
+			}
+		},
+		escape: {
+			bind: keyboardControls.escape,
+			keyDown() {
+				if (quantityDialogOpen()) {
+					quantityDialogOpen.set(false);
+					return;
+				}
+				tradeView.set("mode");
+			}
+		},
+		gamepad: { enabled: true }
+	});
+	const tabControls = signal({
+		left: {
+			repeat: true,
+			bind: keyboardControls.left,
+			throttle: 150,
+			keyDown() {
+				if (quantityDialogOpen()) return;
+				navTab.next(-1);
+			}
+		},
+		right: {
+			repeat: true,
+			bind: keyboardControls.right,
+			throttle: 150,
+			keyDown() {
+				if (quantityDialogOpen()) return;
+				navTab.next(1);
+			}
+		},
+		gamepad: { enabled: true }
+	});
+	return h(DOMContainer, {
+		width: "100%",
+		height: "100%"
+	}, h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-container rpg-anim-fade-in" }
+	}, [h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-header" }
+	}, [h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-merchant" }
+	}, [h(DOMElement, { element: "div" }, cond(hasFace, () => h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-merchant-avatar" }
+	}, h(DOMSprite, {
+		sheet: computed(() => faceSheet(face().id, face().expression)),
+		width: "50px",
+		height: "50px",
+		objectFit: "contain"
+	})))), h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-merchant-info" }
+	}, h(DOMElement, {
+		element: "p",
+		textContent: computed(() => shopMessage())
+	}))]), h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-gold" },
+		textContent: computed(() => gold() + goldTerm)
+	})]), h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-body" }
+	}, h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-left" }
+	}, [cond(computed(() => tradeView() === "mode"), () => h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-content rpg-shop-content-mode" }
+	}, h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-details rpg-shop-details-mode" }
+	}, [h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-details-header" }
+	}, [h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-details-icon" },
+		textContent: "🛒"
+	}), h(DOMElement, {
+		element: "h2",
+		attrs: { style: "margin: 0;" },
+		textContent: "Choose an action"
+	})]), h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-trade" }
+	}, h(Navigation, {
+		tabindex: selectedModeIndex,
+		controls: modeControls
+	}, h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-tabs rpg-shop-trade-tabs" }
+	}, [h(DOMElement, {
+		element: "div",
+		attrs: {
+			class: ["rpg-shop-tab", computed(() => ({ active: selectedModeIndex() === 0 }))],
+			click: selectMode("buy")
+		},
+		textContent: "Buy"
+	}), h(DOMElement, {
+		element: "div",
+		attrs: {
+			class: ["rpg-shop-tab", computed(() => ({ active: selectedModeIndex() === 1 }))],
+			click: selectMode("sell")
+		},
+		textContent: "Sell"
+	})])))])), () => h(DOMElement, { element: "div" }, [h(Navigation, {
+		tabindex: selectedTab,
+		controls: tabControls
+	}, h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-tabs" }
+	}, loop(tabs, (tab, index) => h(DOMElement, {
+		element: "div",
+		attrs: {
+			class: ["rpg-shop-tab", computed(() => ({ active: selectedTab() === index }))],
+			tabindex: index,
+			click: selectTab(index)
+		},
+		textContent: tab.label
+	})))), h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-content" }
+	}, [h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-grid" }
+	}, h(Navigation, {
+		tabindex: selectedItem,
+		controls: itemControls
+	}, loop(filteredItems, (item, index) => h(DOMElement, {
+		element: "div",
+		attrs: {
+			class: ["rpg-shop-card", computed(() => ({
+				disabled: isItemDisabled(item),
+				selected: selectedItem() === index
+			}))],
+			tabindex: index,
+			click: selectItem(index)
+		}
+	}, [
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-card-icon" }
+		}, cond(item.icon, () => h(DOMSprite, {
+			sheet: computed(() => iconSheet(item.icon)),
+			playing: "default",
+			width: "48px",
+			height: "48px",
+			objectFit: "contain"
+		}))),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-card-name" },
+			textContent: item.name
+		}),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-card-price" },
+			textContent: item.price + goldTerm
+		}),
+		cond(computed(() => item.quantity !== void 0), () => h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-card-qty" },
+			textContent: "x" + item.quantity
+		})),
+		cond(item.equipped, () => h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-card-tag" },
+			textContent: "Equipped"
+		}))
+	])))), h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-details" }
+	}, [
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-details-header" }
+		}, [
+			h(DOMElement, {
+				element: "div",
+				attrs: { class: "rpg-shop-details-icon" }
+			}, h(DOMSprite, {
+				sheet: computed(() => iconSheet(currentItem()?.icon)),
+				playing: "default",
+				width: "80px",
+				height: "80px",
+				objectFit: "contain"
+			})),
+			h(DOMElement, {
+				element: "h2",
+				attrs: { style: "margin: 0;" },
+				textContent: computed(() => currentItem()?.name || "")
+			}),
+			h(DOMElement, {
+				element: "p",
+				attrs: { style: "color: #ffd700; font-weight: bold; margin: 8px 0;" },
+				textContent: computed(() => currentItem()?.price ?? 0 + goldTerm)
+			}),
+			cond(computed(() => currentItem()?.quantity !== void 0), () => h(DOMElement, {
+				element: "div",
+				attrs: { class: "rpg-shop-details-qty" },
+				textContent: computed(() => "Qty: x" + currentItem()?.quantity)
+			}))
+		]),
+		h(DOMElement, { element: "div" }, cond(computed(() => currentItem()?.equipped), () => h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-equipped" },
+			textContent: "Already equipped"
+		}))),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-details-desc" },
+			textContent: computed(() => currentItem()?.description || "")
+		}),
+		h(DOMElement, { element: "div" }, cond(computed(() => displayStats().length > 0), () => h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-stats" }
+		}, loop(displayStats, (stat, index) => h(DOMElement, {
+			element: "div",
+			attrs: { class: ["rpg-shop-stat", {
+				positive: stat.delta > 0,
+				negative: stat.delta < 0
+			}] }
+		}, [
+			h(DOMElement, {
+				element: "div",
+				attrs: { class: "rpg-shop-stat-key" },
+				textContent: stat.label
+			}),
+			h(DOMElement, {
+				element: "div",
+				attrs: { class: "rpg-shop-stat-value" },
+				textContent: stat.delta > 0 ? "+" : "" + stat.delta
+			}),
+			cond(computed(() => stat.current !== void 0), () => h(DOMElement, {
+				element: "div",
+				attrs: { class: "rpg-shop-stat-current" },
+				textContent: stat.current + " → " + stat.next
+			}))
+		]))))),
+		h(DOMElement, {
+			element: "button",
+			attrs: {
+				class: "rpg-shop-btn",
+				click: backToMode()
+			},
+			textContent: "Back"
+		})
+	])])])), cond(quantityDialogOpen, () => h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-modal" }
+	}, h(DOMElement, {
+		element: "div",
+		attrs: { class: "rpg-shop-modal-card" }
+	}, [
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-modal-title" },
+			textContent: actionLabel
+		}),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-modal-item" },
+			textContent: computed(() => currentItem()?.name || "")
+		}),
+		cond(computed(() => currentItem()?.quantity !== void 0), () => h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-modal-qty" },
+			textContent: computed(() => "Available: x" + currentItem()?.quantity)
+		})),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-quantity" }
+		}, [h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-quantity-label" },
+			textContent: "Quantity"
+		}), h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-quantity-controls" }
+		}, [
+			h(DOMElement, {
+				element: "button",
+				attrs: {
+					class: "rpg-shop-btn",
+					click: changeQuantity(-1)
+				},
+				textContent: "-"
+			}),
+			h(DOMElement, {
+				element: "div",
+				attrs: { class: "rpg-shop-quantity-value" },
+				textContent: quantity
+			}),
+			h(DOMElement, {
+				element: "button",
+				attrs: {
+					class: "rpg-shop-btn",
+					click: changeQuantity(1)
+				},
+				textContent: "+"
+			})
+		])]),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-modal-total" }
+		}, [h(DOMElement, {
+			element: "span",
+			textContent: "Total"
+		}), h(DOMElement, {
+			element: "span",
+			textContent: computed(() => totalPrice() + goldTerm)
+		})]),
+		h(DOMElement, {
+			element: "div",
+			attrs: { class: "rpg-shop-modal-actions" }
+		}, [h(DOMElement, {
+			element: "button",
+			attrs: {
+				class: "rpg-shop-btn rpg-shop-btn-secondary",
+				click: closeQuantityDialog()
+			},
+			textContent: "Cancel"
+		}), h(DOMElement, {
+			element: "button",
+			attrs: {
+				class: "rpg-shop-btn",
+				click: confirmTrade()
+			},
+			textContent: computed(() => actionLabel() + " x" + quantity())
+		})])
+	])))]))]));
+}
+var __ce_component = component;
+//#endregion
+export { __ce_component as default };
+
+//# sourceMappingURL=shop.ce.js.map

package/dist/components/gui/shop/shop.ce.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shop.ce.js","names":[],"sources":["../../../../src/components/gui/shop/shop.ce"],"sourcesContent":["    <DOMContainer width=\"100%\" height=\"100%\">\n        <div class=\"rpg-shop-container rpg-anim-fade-in\">\n            <div class=\"rpg-shop-header\">\n                <div class=\"rpg-shop-merchant\">\n                    <div>\n                        @if (hasFace) {\n                            <div class=\"rpg-shop-merchant-avatar\">\n                                <DOMSprite \n                                    sheet={faceSheet(face().id, face().expression)} \n                                    width=\"50px\"\n                                    height=\"50px\"\n                                    objectFit=\"contain\"\n                                />  \n                            </div>\n                        }\n                    </div>\n                    <div class=\"rpg-shop-merchant-info\">\n                        <p>{{ shopMessage() }}</p>\n                    </div>\n                </div>\n                <div class=\"rpg-shop-gold\">\n                     {{ gold() }} {{ goldTerm }}\n                </div>\n            </div>\n\n            <div class=\"rpg-shop-body\">\n                <div class=\"rpg-shop-left\">\n                @if (tradeView() === 'mode') {\n                    <div class=\"rpg-shop-content rpg-shop-content-mode\">\n                        <div class=\"rpg-shop-details rpg-shop-details-mode\">\n                            <div class=\"rpg-shop-details-header\">\n                            <div class=\"rpg-shop-details-icon\">🛒</div>\n                            <h2 style=\"margin: 0;\">Choose an action</h2>\n                        </div>\n                        <div class=\"rpg-shop-trade\">\n                            <Navigation tabindex={selectedModeIndex} controls={modeControls}>\n                                <div class=\"rpg-shop-tabs rpg-shop-trade-tabs\">\n                                    <div\n                                        class=\"rpg-shop-tab\"\n                                        class={{active: selectedModeIndex() === 0}}\n                                        click={selectMode('buy')}\n                                    >Buy</div>\n                                    <div\n                                        class=\"rpg-shop-tab\"\n                                        class={{active: selectedModeIndex() === 1}}\n                                        click={selectMode('sell')}\n                                    >Sell</div>\n                                </div>\n                            </Navigation>\n                        </div>\n                        </div>\n                    </div>\n                }\n                @else {\n                    <div>\n                    <Navigation tabindex={selectedTab} controls={tabControls}>  \n                        <div class=\"rpg-shop-tabs\">\n                            @for ((tab,index) of tabs) {\n                                <div \n                                    class=\"rpg-shop-tab\" \n                                    class={{active: selectedTab() === index}} \n                                    tabindex={index} \n                                    click={selectTab(index)}\n                                >{{ tab.label }}</div>\n                            }\n                        </div>\n                    </Navigation>\n\n                    <div class=\"rpg-shop-content\">\n                        <div class=\"rpg-shop-grid\">\n                            <Navigation tabindex={selectedItem} controls={itemControls}>     \n                                @for ((item,index) of filteredItems) { \n                                    <div class=\"rpg-shop-card\" class={{disabled: isItemDisabled(item), selected: selectedItem() === index}} tabindex={index} click={selectItem(index)}>\n                                        <div class=\"rpg-shop-card-icon\">\n                                            @if (item.icon) {\n                                                <DOMSprite \n                                                    sheet={iconSheet(item.icon)} \n                                                    playing=\"default\" \n                                                    width=\"48px\"\n                                                    height=\"48px\"\n                                                    objectFit=\"contain\"\n                                                />\n                                            }\n                                        </div>\n                                        <div class=\"rpg-shop-card-name\">{{ item.name }}</div>\n                                        <div class=\"rpg-shop-card-price\">{{ item.price }} {{ goldTerm }}</div>\n                                        @if (item.quantity !== undefined) {\n                                            <div class=\"rpg-shop-card-qty\">x{{ item.quantity }}</div>\n                                        }\n                                        @if (item.equipped) {\n                                            <div class=\"rpg-shop-card-tag\">Equipped</div>\n                                        }\n                                    </div>\n                                }\n                            </Navigation>\n                        </div>\n\n                        <div class=\"rpg-shop-details\">\n                            <div class=\"rpg-shop-details-header\">\n                                <div class=\"rpg-shop-details-icon\">\n                                    <DOMSprite \n                                        sheet={iconSheet(currentItem()?.icon)} \n                                        playing=\"default\" \n                                        width=\"80px\"\n                                        height=\"80px\"\n                                        objectFit=\"contain\"\n                                    />\n                                </div>\n                                <h2 style=\"margin: 0;\">{{ currentItem()?.name || \"\" }}</h2>\n                                <p style=\"color: #ffd700; font-weight: bold; margin: 8px 0;\">{{ currentItem()?.price ?? 0 }} {{ goldTerm }}</p>\n                                @if (currentItem()?.quantity !== undefined) {\n                                    <div class=\"rpg-shop-details-qty\">Qty: x{{ currentItem()?.quantity }}</div>\n                                }\n                            </div>\n                            <div>\n                                @if (currentItem()?.equipped) {\n                                    <div class=\"rpg-shop-equipped\">Already equipped</div>\n                                }\n                            </div>\n                            <div class=\"rpg-shop-details-desc\">\n                                {{ currentItem()?.description || \"\" }}\n                            </div>\n                            <div>\n                                @if (displayStats().length > 0) {\n                                    <div class=\"rpg-shop-stats\">\n                                        @for ((stat,index) of displayStats) {\n                                            <div class=\"rpg-shop-stat\" class={{positive: stat.delta > 0, negative: stat.delta < 0}}>\n                                                <div class=\"rpg-shop-stat-key\">{{ stat.label }}</div>\n                                                <div class=\"rpg-shop-stat-value\">\n                                                    {{ stat.delta > 0 ? '+' : '' }}{{ stat.delta }}\n                                                </div>\n                                                @if (stat.current !== undefined) {\n                                                    <div class=\"rpg-shop-stat-current\">{{ stat.current }} → {{ stat.next }}</div>\n                                                }\n                                            </div>\n                                        }\n                                    </div>\n                                }\n                            </div>\n                            <button class=\"rpg-shop-btn\" click={backToMode()}>Back</button>\n                        </div>\n                    </div>\n                    </div>\n                }\n                @if (quantityDialogOpen) {\n                    <div class=\"rpg-shop-modal\">\n                        <div class=\"rpg-shop-modal-card\">\n                            <div class=\"rpg-shop-modal-title\">{{ actionLabel }}</div>\n                            <div class=\"rpg-shop-modal-item\">{{ currentItem()?.name || \"\" }}</div>\n                            @if (currentItem()?.quantity !== undefined) {\n                                <div class=\"rpg-shop-modal-qty\">Available: x{{ currentItem()?.quantity }}</div>\n                            }\n                            <div class=\"rpg-shop-quantity\">\n                                <div class=\"rpg-shop-quantity-label\">Quantity</div>\n                                <div class=\"rpg-shop-quantity-controls\">\n                                    <button class=\"rpg-shop-btn\" click={changeQuantity(-1)}>-</button>\n                                    <div class=\"rpg-shop-quantity-value\">{{ quantity }}</div>\n                                    <button class=\"rpg-shop-btn\" click={changeQuantity(1)}>+</button>\n                                </div>\n                            </div>\n                            <div class=\"rpg-shop-modal-total\">\n                                <span>Total</span>\n                                <span>{{ totalPrice() }} {{ goldTerm }}</span>\n                            </div>\n                            <div class=\"rpg-shop-modal-actions\">\n                                <button class=\"rpg-shop-btn rpg-shop-btn-secondary\" click={closeQuantityDialog()}>Cancel</button>\n                                <button class=\"rpg-shop-btn\" click={confirmTrade()}>\n                                    {{ actionLabel() }} x{{ quantity() }}\n                                </button>\n                            </div>\n                        </div>\n                    </div>\n                }\n                </div>\n            </div>\n        </div>\n    </DOMContainer>\n\n<script>\n    import { mount, signal, computed, createTabindexNavigator, effect } from \"canvasengine\";\n    import { inject } from \"../../../core/inject\";\n    import { RpgClientEngine } from \"../../../RpgClientEngine\";\n\n    const engine = inject(RpgClientEngine)\n    const currentPlayer = engine.scene.currentPlayer\n    const keyboardControls = engine.globalConfig.keyboardControls\n    const iconSheet = (iconId) => ({\n        definition: engine.getSpriteSheet(iconId),\n        playing: \"default\"\n    })\n    const goldTerm = engine.globalConfig.goldTerm || 'G'\n\n    const selectedItem = signal(0)\n    const selectedTab = signal(0)\n    const tradeMode = signal('buy')\n    const tradeView = signal('mode')\n    const selectedModeIndex = signal(0)\n    const quantity = signal(1)\n    const quantityDialogOpen = signal(false)\n    const defaultMessage = 'Welcome to my shop!'\n    const tabs = [\n        { id: 'item', label: 'Items' },\n        { id: 'weapon', label: 'Weapons' },\n        { id: 'armor', label: 'Armor' }\n    ]\n\n    const { data, onInteraction , onFinish } = defineProps()\n\n    const resolveProp = (value) => typeof value === \"function\" ? value() : value\n    const guiData = computed(() => resolveProp(data) || {})\n    const shopMessage = computed(() => {\n        const message = resolveProp(guiData().message)\n        return message ? String(message) : defaultMessage\n    })\n    const face = computed(() => resolveProp(guiData().face))\n    const hasFace = computed(() => {\n        const value = face()\n        return value && value.id\n    })\n    const buyItems = computed(() => guiData().items || [])\n    const sellItems = computed(() => guiData().sellItems || [])\n    const activeItems = computed(() => tradeMode() === 'buy' ? buyItems() : sellItems())\n    const filteredItems = computed(() => {\n        const tab = tabs[selectedTab()]\n        const items = activeItems()\n        if (!tab) return []\n        return items.filter((item) => item?.type === tab.id)\n    })\n    const currentItem = computed(() => filteredItems()[selectedItem()])\n    const gold = computed(() => currentPlayer()._gold())\n    const actionLabel = computed(() => tradeMode() === 'buy' ? 'Buy' : 'Sell')\n    const faceSheet = (graphicId, animationName) => ({\n        definition: engine.getSpriteSheet(graphicId),\n        playing: animationName || \"default\"\n    })\n    const maxQuantity = computed(() => {\n        const item = currentItem()\n        if (!item) return 0\n        const price = item?.price || 0\n        if (price <= 0) return 0\n        if (tradeMode() === 'sell') {\n            const qty = item?.quantity ?? 0\n            return Math.max(0, qty)\n        }\n        return Math.max(1, Math.floor(gold() / price))\n    })\n    const totalPrice = computed(() => {\n        const price = currentItem()?.price || 0\n        return price * quantity()\n    })\n    const displayStats = computed(() => {\n        const stats = currentItem()?.stats || {}\n        const params = guiData().playerParams || {}\n        const order = ['atk', 'def', 'pdef', 'sdef', 'str', 'dex', 'int', 'agi', 'maxHp', 'maxSp']\n        const labels = {\n            atk: 'ATK',\n            def: 'DEF',\n            pdef: 'PDEF',\n            sdef: 'SDEF',\n            str: 'STR',\n            dex: 'DEX',\n            int: 'INT',\n            agi: 'AGI',\n            maxHp: 'MAX HP',\n            maxSp: 'MAX SP'\n        }\n        const orderedKeys = order.filter((key) => stats[key] !== undefined)\n        const extraKeys = Object.keys(stats).filter((key) => !order.includes(key))\n        const keys = orderedKeys.concat(extraKeys)\n        const list = []\n        for (const key of keys) {\n            const delta = stats[key]\n            if (delta === undefined || delta === 0) continue\n            let current = params[key]\n            if (current === undefined && key === 'def') current = params.pdef\n            const next = current !== undefined ? current + delta : undefined\n            list.push({\n                key,\n                label: labels[key] || key.toUpperCase(),\n                delta,\n                current,\n                next\n            })\n        }\n        return list\n    })\n    const nav = createTabindexNavigator(selectedItem, { count: () => filteredItems().length }, 'wrap')\n    const navTab = createTabindexNavigator(selectedTab, { count: () => tabs.length }, 'wrap')\n    const navMode = createTabindexNavigator(selectedModeIndex, { count: () => 2 }, 'wrap')\n\n    function selectItem(index) {\n       return function() {\n        selectedItem.set(index)\n        quantity.set(1)\n        if (!isItemDisabled(filteredItems()[index])) {\n            quantityDialogOpen.set(true)\n        }\n       }\n    }\n\n    function selectTab(index) {\n        return function() {\n            selectedTab.set(index)\n            selectedItem.set(0)\n        }\n    }\n\n    function selectMode(mode) {\n        return function() {\n            tradeMode.set(mode)\n            selectedModeIndex.set(mode === 'buy' ? 0 : 1)\n            selectedItem.set(0)\n            quantity.set(1)\n            tradeView.set('items')\n        }\n    }\n\n    function isItemDisabled(item) {\n        if (!item) return true\n        const price = item?.price || 0\n        if (price <= 0) return true\n        if (tradeMode() === 'sell') {\n            const qty = item?.quantity ?? 0\n            return qty <= 0\n        }\n        return gold() < price\n    }\n\n    function backToMode() {\n        return function() {\n            tradeView.set('mode')\n        }\n    }\n\n    function changeQuantity(delta) {\n        return function() {\n            const limit = maxQuantity()\n            if (limit <= 0) return\n            const nextValue = Math.max(1, Math.min(limit, quantity() + delta))\n            if (nextValue !== quantity()) {\n                quantity.set(nextValue)\n            }\n        }\n    }\n\n    function closeQuantityDialog() {\n        return function() {\n            quantityDialogOpen.set(false)\n        }\n    }\n\n    function confirmTrade() {\n        return function() {\n            const item = currentItem()\n            if (!item || isItemDisabled(item)) {\n                quantityDialogOpen.set(false)\n                return\n            }\n            const action = tradeMode() === 'buy' ? 'buyItem' : 'sellItem'\n            onInteraction(action, { id: item.id, nb: quantity() })\n            quantityDialogOpen.set(false)\n        }\n    }\n\n    effect(() => {\n        const count = filteredItems().length\n        if (selectedItem() >= count) {\n            selectedItem.set(Math.max(0, count - 1))\n        }\n    })\n\n    const modeControls = signal({\n        left: {\n            repeat: true,\n            bind: keyboardControls.left,\n            throttle: 150,\n            keyDown() {\n                navMode.next(-1)\n            }\n        },\n        right: {\n            repeat: true,\n            bind: keyboardControls.right,\n            throttle: 150,\n            keyDown() {\n                navMode.next(1)\n            }\n        },\n        action: {\n            bind: keyboardControls.action,\n            keyDown() {\n                const mode = selectedModeIndex() === 0 ? 'buy' : 'sell'\n                tradeMode.set(mode)\n                selectedItem.set(0)\n                quantity.set(1)\n                tradeView.set('items')\n            }\n        },\n        escape: {\n            bind: keyboardControls.escape,\n            keyDown() {\n                onFinish()\n            }\n        },\n        gamepad: {\n            enabled: true\n        }\n    });\n\n    const itemControls = signal({\n        up: {\n            repeat: true,\n            bind: keyboardControls.up,\n            throttle: 150,\n            keyDown() {\n                if (quantityDialogOpen()) {\n                    changeQuantity(1)()\n                    return\n                }\n                nav.next(-1)\n            }\n        },\n        down: {\n            repeat: true,\n            bind: keyboardControls.down,\n            throttle: 150,\n            keyDown() {\n                if (quantityDialogOpen()) {\n                    changeQuantity(-1)()\n                    return\n                }\n                nav.next(1)\n            }\n        },\n        action: {\n            bind: keyboardControls.action,\n            keyDown() {\n                if (quantityDialogOpen()) {\n                    const item = currentItem()\n                    if (!item || isItemDisabled(item)) {\n                        quantityDialogOpen.set(false)\n                        return\n                    }\n                    const action = tradeMode() === 'buy' ? 'buyItem' : 'sellItem'\n                    onInteraction(action, { id: item.id, nb: quantity() })\n                    quantityDialogOpen.set(false)\n                    return\n                }\n                const item = currentItem()\n                if (!isItemDisabled(item)) {\n                    quantityDialogOpen.set(true)\n                }\n            }\n        },\n        escape: {\n            bind: keyboardControls.escape,\n            keyDown() {\n                if (quantityDialogOpen()) {\n                    quantityDialogOpen.set(false)\n                    return\n                }\n                tradeView.set('mode')\n            }\n        },\n        gamepad: {\n            enabled: true\n        }\n    });\n\n    const tabControls = signal({\n        left: {\n            repeat: true,\n            bind: keyboardControls.left,\n            throttle: 150,\n            keyDown() {\n                if (quantityDialogOpen()) return\n                navTab.next(-1)\n            }\n        },\n        right: {\n            repeat: true,\n            bind: keyboardControls.right,\n            throttle: 150,\n            keyDown() {\n                if (quantityDialogOpen()) return\n                navTab.next(1)\n            }\n        },\n        gamepad: {\n            enabled: true\n        }\n    })\n</script>\n"],"mappings":"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"}