npm - @rpgjs/client - Versions diffs - 5.0.0-beta.8 → 5.0.0-beta.9 - Mend

@rpgjs/client 5.0.0-beta.8 → 5.0.0-beta.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (115) hide show

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

	@@ -1 +1 @@
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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"}
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":";;;;AAWM,SAAS,UAAU,SAAS;CACX,SAAS,OAAG;CAC3B,MAAM,cAAc,eAAK,OAAA;CACzB,MAAM,SAAS,OAAC,eAAA;CACxB,MAAM,gBAAgB,OAAG,MAAA;CACzB,MAAM,mBAAmB,OAAO,aAAS;CACzC,MAAM,aAAa,YAAW;EAC1B,YAAY,OAAM,eAAG,MAAA;EACrB,SAAS;CACb;CACA,MAAM,WAAW,OAAO,aAAa,YAAU;CAC/C,MAAM,eAAe,OAAA,CAAA;CACrB,MAAM,cAAW,OAAA,CAAA;;CAEjB,MAAM,YAAW,OAAO,MAAI;CAC5B,MAAM,oBAAoB,OAAM,CAAA;CAChC,MAAM,WAAW,OAAI,CAAA;CACrB,MAAM,qBAAmB,OAAO,KAAI;CACpC,MAAM,iBAAiB;CACvB,MAAM,OAAO;EACT;GAAE,IAAI;GAAQ,OAAO;EAAQ;EAC7B;GAAE,IAAI;GAAU,OAAO;EAAU;EACjC;GAAE,IAAI;GAAS,OAAO;EAAG;CAC7B;CACA,MAAM,EAAE,MAAM,eAAe,aAAW,YAAU;CAClD,MAAM,eAAe,UAAU,OAAM,UAAW,aAAa,MAAM,IAAA;CACnE,MAAM,UAAU,eAAe,YAAM,IAAA,KAAA,CAAA,CAAA;CACrC,MAAM,cAAc,eAAe;EAC/B,MAAM,UAAU,YAAY,QAAQ,EAAA,OAAQ;EAC5C,OAAO,UAAU,OAAO,OAAO,IAAI;CACvC,CAAC;CACD,MAAM,OAAO,eAAe,YAAS,QAAA,EAAA,IAAA,CAAA;CACrC,MAAM,UAAU,eAAe;EAC3B,MAAM,QAAQ,KAAK;EACnB,OAAO,SAAS,MAAM;CAC1B,CAAC;CACD,MAAM,WAAW,eAAe,QAAK,EAAA,SAAA,CAAA,CAAA;CACrC,MAAM,YAAY,eAAY,QAAU,EAAA,aAAA,CAAA,CAAA;CACxC,MAAM,cAAc,eAAS,UAAA,MAAA,QAAA,SAAA,IAAA,UAAA,CAAA;CAC7B,MAAM,gBAAgB,eAAO;EACzB,MAAM,MAAM,KAAK,YAAI;EACrB,MAAM,QAAM,YAAA;EACZ,IAAI,CAAC,KACD,OAAO,CAAC;EACZ,OAAO,MAAM,QAAI,SAAW,MAAQ,SAAE,IAAW,EAAE;CACvD,CAAC;CACD,MAAM,cAAc,eAAe,cAAc,EAAA,aAAM,EAAA;CACvD,MAAM,OAAO,eAAe,cAAQ,EAAA,MAAA,CAAA;CACpC,MAAM,cAAc,eAAe,UAAQ,MAAQ,QAAK,QAAA,MAAA;CACxD,MAAM,aAAa,WAAW,mBAAc;EACxC,YAAY,OAAO,eAAa,SAAU;EAC1C,SAAS,iBAAiB;CAC9B;CACA,MAAM,cAAc,eAAQ;EACxB,MAAM,OAAO,YAAY;EACzB,IAAI,CAAC,MAAA,OAAA;EAEL,MAAM,QAAQ,MAAM,SAAQ;EAC5B,IAAI,SAAS,GACT,OAAO;EACX,IAAI,UAAU,MAAM,QAAQ;GACxB,MAAM,MAAM,MAAM,YAAW;GAC7B,OAAO,KAAK,IAAI,GAAG,GAAG;EAC1B;EACA,OAAO,KAAK,IAAI,GAAG,KAAK,MAAM,KAAK,IAAI,KAAK,CAAC;CACjD,CAAC;CACD,MAAM,aAAa,eAAe;EAE9B,QADc,YAAY,GAAG,SAAS,KACvB,SAAS;CAC5B,CAAC;CACD,MAAM,eAAe,eAAe;EAChC,MAAM,QAAQ,YAAY,GAAG,SAAS,CAAC;EACvC,MAAM,SAAS,QAAQ,EAAE,gBAAgB,CAAA;EACzC,MAAM,QAAQ;GAAC;GAAO;GAAO;GAAQ;GAAI;GAAW;GAAK;GAAS;GAAK;GAAW;EAAM;EACxF,MAAM,SAAS;GACX,KAAK;GACL,KAAK;GACL,MAAM;GACN,MAAM;GACN,KAAK;GACL,KAAK;GACL,KAAK;GACL,KAAK;GACL,OAAO;GACP,OAAO;;EAEX,MAAM,cAAc,MAAK,QAAO,QAAS,MAAO,SAAC,KAAA,CAAA;EACjD,MAAM,YAAY,OAAO,KAAI,KAAM,EAAC,QAAS,QAAQ,CAAA,MAAO,SAAA,GAAA,CAAA;EAC5D,MAAM,OAAO,YAAY,OAAO,SAAQ;EACxC,MAAM,OAAO,CAAC;EACd,KAAK,MAAM,OAAO,MAAM;GACpB,MAAM,QAAQ,MAAM;GACpB,IAAI,UAAU,KAAA,KAAa,UAAU,GACjC;GACJ,IAAI,UAAU,OAAO;GACrB,IAAI,YAAY,KAAA,KAAa,QAAA,OACzB,UAAU,OAAO;GACrB,MAAM,OAAO,YAAY,KAAA,IAAU,UAAY,QAAG,KAAA;GAClD,KAAK,KAAK;IACN;IACA,OAAO,OAAO,QAAQ,IAAG,YAAW;IACpC;IACA;IACA;GACJ,CAAC;EACL;EACA,OAAO;CACX,CAAC;CACD,MAAM,MAAM,wBAAqB,cAAgB,EAAA,aAAa,cAAA,EAAA,OAAA,GAAA,MAAA;CAC9D,MAAM,SAAS,wBAAoB,aAAe,EAAA,aAAiB,KAAE,OAAA,GAAA,MAAA;CACrE,MAAM,UAAU,wBAAiB,mBAAA,EAAA,aAAA,EAAA,GAAA,MAAA;CACjC,SAAS,WAAW,OAAO;EACvB,OAAO,WAAY;GACf,aAAa,IAAI,KAAK;GACtB,SAAS,IAAI,CAAC;GACd,IAAI,CAAC,eAAe,cAAc,EAAE,MAAK,GACrC,mBAAmB,IAAI,IAAI;EAEnC;CACJ;CACA,SAAS,UAAU,OAAO;EACtB,OAAO,WAAY;GACf,YAAY,IAAI,KAAK;GACrB,aAAa,IAAI,CAAC;EACtB;CACJ;CACA,SAAS,WAAW,MAAM;EACtB,OAAO,WAAY;GACf,UAAU,IAAI,IAAI;GAClB,kBAAkB,IAAG,SAAA,QAAA,IAAA,CAAA;GACrB,aAAa,IAAI,CAAA;GACjB,SAAS,IAAI,CAAC;GACd,UAAQ,IAAA,OAAA;EACZ;CACJ;CACA,SAAS,eAAe,MAAK;EACzB,IAAI,CAAC,MACD,OAAO;EACX,MAAM,QAAQ,MAAM,SAAS;EAC7B,IAAI,SAAS,GACT,OAAO;EACX,IAAI,UAAU,MAAM,QAEhB,QADY,MAAM,YAAW,MACf;EAElB,OAAO,KAAK,IAAI;CACpB;CACA,SAAS,aAAa;EAClB,OAAO,WAAY;GACf,UAAU,IAAI,MAAM;EACxB;CACJ;CACA,SAAS,eAAe,OAAM;EAC1B,OAAO,WAAY;GACf,MAAM,QAAQ,YAAW;GACzB,IAAI,SAAS,GACT;GACJ,MAAM,YAAY,KAAK,IAAG,GAAA,KAAM,IAAA,OAAA,SAAA,IAAA,KAAA,CAAA;GAChC,IAAI,cAAc,SAAO,GACrB,SAAS,IAAI,SAAI;EAEzB;CACJ;CACA,SAAS,sBAAQ;EACb,OAAM,WAAG;GACP,mBAAY,IAAA,KAAA;;CAElB;CACA,SAAI,eAAgB;EAChB,OAAO,WAAW;GAClB,MAAS,OAAA,YAAkB;;IAErB,mBAAgB,IAAA,KAAA;IAChB;GACN;GAEI,cADe,UAAU,MAAE,QAAA,YAAA,YACR;IAAA,IAAA,KAAc;IAAC,IAAO,SAAA;GAAA,CAAA;GACzC,mBAAiB,IAAA,KAAA;EACrB;CACJ;;EAEI,MAAM,QAAA,cAAsB,EAAC;EAC7B,IAAA,aAAiB,KAAG,OACpB,aAAiB,IAAC,KAAQ,IAAI,GAAA,QAAA,CAAA,CAAA;CAElC,CAAC;CACD,MAAI,eAAiB,OAAO;EACxB,MAAM;GACN,QAAM;GACN,MAAU,iBAAG;GACT,UAAO;GACP,UAAO;IACH,QAAQ,KAAG,EAAA;GACnB;;EAEA,OAAO;;GAEP,MAAM,iBAAqB;GAC3B,UAAc;GACd,UAAM;IACF,QAAM,KAAU,CAAA;GAChB;EACJ;EACA,QAAM;GACN,MAAM,iBAAqB;GACvB,UAAM;IACN,MAAO,OAAS,kBAAM,MAAA,IAAA,QAAA;IACzB,UAAA,IAAA,IAAA;IACK,aAAW,IAAQ,CAAC;IACpB,SAAW,IAAC,CAAA;IACZ,UAAY,IAAE,OAAS;GAC7B;EACA;EACA,QAAI;GACA,MAAK,iBAAa;GAClB,UAAO;IACV,SAAA;GACD;EACA;EACA,SAAM,EACN,SAAM,KACN;CACJ,CAAC;CACD,MAAK,eAAA,OAAA;EACD,IAAA;GACI,QAAM;GACN,MAAK,iBAAa;GAClB,UAAM;GACN,UAAU;IACN,IAAA,mBAAuB,GAAC;KACxB,eAAkB,CAAA,EAAA;KAClB;IACJ;IACA,IAAO,KAAK,EAAG;GAClB;EACD;EACA,MAAI;GACA,QAAO;GACV,MAAA,iBAAA;GACD,UAAM;GACF,UAAM;IACN,IAAM,mBAAmB,GAAA;KACnB,eAAiB,EAAA,EAAI;KACrB;IACF;IACA,IAAI,KAAK,CAAC;GACd;EACJ;EACA,QAAQ;GACJ,MAAI,iBAAU;GACd,UAAU;IACN,IAAI,mBAAM,GAAA;KACV,MAAQ,OAAO,YAAA;KACf,IAAQ,CAAA,QAAM,eAAA,IAAA,GAAA;MAClB,mBAAA,IAAA,KAAA;MACM;KACA;KAEA,cADO,UAAmB,MAAA,QAAS,YAAA,YAC3B;MAAA,IAAA,KAAA;MAAA,IAAA,SAAA;KAAA,CAAA;KACT,mBAAmB,IAAA,KAAA;KACpB;IACA;IAEA,IAAI,CAAA,eADS,YACG,CAAA,GAChB,mBAAuB,IAAE,IAAA;GAE7B;EACJ;EACA,QAAQ;GACJ,MAAM,iBAAS;GACf,UAAQ;IACJ,IAAC,mBAAA,GAAA;KACL,mBAAA,IAAA,KAAA;KACO;IACV;IACK,UAAM,IAAA,MAAA;GACZ;EACA;aAEA,SAAS,KACT;CACJ,CAAC;CACD,MAAM,cAAc,OAAE;EAClB,MAAM;GACF,QAAI;GACJ,MAAA,iBAAA;GACD,UAAA;GACH,UAAA;8BAES;IACL,OAAO,KAAS,EAAE;GAClB;EACJ;EACA,OAAI;GACJ,QAAA;;GAEA,UAAS;GACL,UAAO;IACH,IAAA,mBAAkB,GAClB;IACA,OAAA,KAAY,CAAC;GACjB;EACJ;EACA,SAAI,EACJ,SAAA,KAAA;CAEJ,CAAC;CAEO,OADW,EAAA,cAAO;EAAA,OAAA;EAAA,QAAA;CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,sCAAA;CAAA,GAAA,CAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,kBAAA;CAAA,GAAA,CAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,oBAAA;CAAA,GAAA,CAAA,EAAA,YAAA,EAAA,SAAA,MAAA,GAAA,KAAA,eAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,2BAAA;CAAA,GAAA,EAAA,WAAA;EAAA,OAAA,eAAA,UAAA,KAAA,EAAA,IAAA,KAAA,EAAA,UAAA,CAAA;EAAA,OAAA;EAAA,QAAA;EAAA,WAAA;CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,yBAAA;CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,aAAA,eAAA,YAAA,CAAA;CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,gBAAA;EAAA,aAAA,eAAA,KAAA,IAAA,QAAA;CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,gBAAA;CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,gBAAA;CAAA,GAAA,CAAA,KAAA,eAAA,UAAA,MAAA,MAAA,SAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,yCAAA;CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,yCAAA;CAAA,GAAA,CAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,0BAAA;CAAA,GAAA,CAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,wBAAA;EAAA,aAAA;CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,aAAA;EAAA,aAAA;CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,iBAAA;CAAA,GAAA,EAAA,YAAA;EAAA,UAAA;EAAA,UAAA;CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,oCAAA;CAAA,GAAA,CAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA;GAAA,OAAA,CAAA,gBAAA,gBAAA,EAAA,QAAA,kBAAA,MAAA,EAAA,EAAA,CAAA;GAAA,OAAA,WAAA,KAAA;EAAA;EAAA,aAAA;CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA;GAAA,OAAA,CAAA,gBAAA,gBAAA,EAAA,QAAA,kBAAA,MAAA,EAAA,EAAA,CAAA;GAAA,OAAA,WAAA,MAAA;EAAA;EAAA,aAAA;CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,SAAA,EAAA,YAAA,EAAA,SAAA,MAAA,GAAA,CAAA,EAAA,YAAA;EAAA,UAAA;EAAA,UAAA;CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,gBAAA;CAAA,GAAA,KAAA,OAAA,KAAA,UAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA;GAAA,OAAA,CAAA,gBAAA,gBAAA,EAAA,QAAA,YAAA,MAAA,MAAA,EAAA,CAAA;GAAA,UAAA;GAAA,OAAA,UAAA,KAAA;EAAA;EAAA,aAAA,IAAA;CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,mBAAA;CAAA,GAAA,CAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,gBAAA;CAAA,GAAA,EAAA,YAAA;EAAA,UAAA;EAAA,UAAA;CAAA,GAAA,KAAA,gBAAA,MAAA,UAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA;GAAA,OAAA,CAAA,iBAAA,gBAAA;IAAA,UAAA,eAAA,IAAA;IAAA,UAAA,aAAA,MAAA;GAAA,EAAA,CAAA;GAAA,UAAA;GAAA,OAAA,WAAA,KAAA;EAAA;CAAA,GAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,qBAAA;EAAA,GAAA,KAAA,KAAA,YAAA,EAAA,WAAA;GAAA,OAAA,eAAA,UAAA,KAAA,IAAA,CAAA;GAAA,SAAA;GAAA,OAAA;GAAA,QAAA;GAAA,WAAA;EAAA,CAAA,CAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,qBAAA;GAAA,aAAA,KAAA;EAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,sBAAA;GAAA,aAAA,KAAA,QAAA;EAAA,CAAA;EAAA,KAAA,eAAA,KAAA,aAAA,KAAA,CAAA,SAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,oBAAA;GAAA,aAAA,MAAA,KAAA;EAAA,CAAA,CAAA;EAAA,KAAA,KAAA,gBAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,oBAAA;GAAA,aAAA;EAAA,CAAA,CAAA;CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,mBAAA;CAAA,GAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,0BAAA;EAAA,GAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,wBAAA;GAAA,GAAA,EAAA,WAAA;IAAA,OAAA,eAAA,UAAA,YAAA,GAAA,IAAA,CAAA;IAAA,SAAA;IAAA,OAAA;IAAA,QAAA;IAAA,WAAA;GAAA,CAAA,CAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,aAAA;IAAA,aAAA,eAAA,YAAA,GAAA,QAAA,EAAA;GAAA,CAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,oDAAA;IAAA,aAAA,eAAA,YAAA,GAAA,SAAA,IAAA,QAAA;GAAA,CAAA;GAAA,KAAA,eAAA,YAAA,GAAA,aAAA,KAAA,CAAA,SAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,uBAAA;IAAA,aAAA,eAAA,WAAA,YAAA,GAAA,QAAA;GAAA,CAAA,CAAA;EAAA,CAAA;EAAA,EAAA,YAAA,EAAA,SAAA,MAAA,GAAA,KAAA,eAAA,YAAA,GAAA,QAAA,SAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,oBAAA;GAAA,aAAA;EAAA,CAAA,CAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,wBAAA;GAAA,aAAA,eAAA,YAAA,GAAA,eAAA,EAAA;EAAA,CAAA;EAAA,EAAA,YAAA,EAAA,SAAA,MAAA,GAAA,KAAA,eAAA,aAAA,EAAA,SAAA,CAAA,SAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,iBAAA;EAAA,GAAA,KAAA,eAAA,MAAA,UAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,CAAA,iBAAA;IAAA,UAAA,KAAA,QAAA;IAAA,UAAA,KAAA,QAAA;GAAA,CAAA,EAAA;EAAA,GAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,oBAAA;IAAA,aAAA,KAAA;GAAA,CAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,sBAAA;IAAA,aAAA,KAAA,QAAA,IAAA,MAAA,KAAA,KAAA;GAAA,CAAA;GAAA,KAAA,eAAA,KAAA,YAAA,KAAA,CAAA,SAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,wBAAA;IAAA,aAAA,KAAA,UAAA,QAAA,KAAA;GAAA,CAAA,CAAA;EAAA,CAAA,CAAA,CAAA,CAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA;IAAA,OAAA;IAAA,OAAA,WAAA;GAAA;GAAA,aAAA;EAAA,CAAA;CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,KAAA,0BAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,iBAAA;CAAA,GAAA,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,sBAAA;CAAA,GAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,uBAAA;GAAA,aAAA;EAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,sBAAA;GAAA,aAAA,eAAA,YAAA,GAAA,QAAA,EAAA;EAAA,CAAA;EAAA,KAAA,eAAA,YAAA,GAAA,aAAA,KAAA,CAAA,SAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,qBAAA;GAAA,aAAA,eAAA,iBAAA,YAAA,GAAA,QAAA;EAAA,CAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,oBAAA;EAAA,GAAA,CAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,0BAAA;GAAA,aAAA;EAAA,CAAA,GAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,6BAAA;EAAA,GAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA;KAAA,OAAA;KAAA,OAAA,eAAA,EAAA;IAAA;IAAA,aAAA;GAAA,CAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA,EAAA,OAAA,0BAAA;IAAA,aAAA;GAAA,CAAA;GAAA,EAAA,YAAA;IAAA,SAAA;IAAA,OAAA;KAAA,OAAA;KAAA,OAAA,eAAA,CAAA;IAAA;IAAA,aAAA;GAAA,CAAA;EAAA,CAAA,CAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,uBAAA;EAAA,GAAA,CAAA,EAAA,YAAA;GAAA,SAAA;GAAA,aAAA;EAAA,CAAA,GAAA,EAAA,YAAA;GAAA,SAAA;GAAA,aAAA,eAAA,WAAA,IAAA,QAAA;EAAA,CAAA,CAAA,CAAA;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,yBAAA;EAAA,GAAA,CAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA;IAAA,OAAA;IAAA,OAAA,oBAAA;GAAA;GAAA,aAAA;EAAA,CAAA,GAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA;IAAA,OAAA;IAAA,OAAA,aAAA;GAAA;GAAA,aAAA,eAAA,YAAA,IAAA,OAAA,SAAA,CAAA;EAAA,CAAA,CAAA,CAAA;CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CACP;AACb;AAEA,IAAM,iBAEJ"}

package/dist/components/gui/title-screen.ce.js CHANGED Viewed

@@ -129,7 +129,7 @@ function component($$props) {
 			element: "div",
 			attrs: { class: "rpg-ui-title-screen-title" },
 			textContent: computed(() => titleText())
-		}), cond(subtitleText(), () => h(DOMElement, {
+		}), cond(computed(() => subtitleText()), () => h(DOMElement, {
 			element: "div",
 			attrs: { class: "rpg-ui-title-screen-subtitle" },
 			textContent: computed(() => subtitleText())
@@ -150,7 +150,7 @@ function component($$props) {
 			},
 			textContent: entry.label
 		})))),
-		cond(versionText(), () => h(DOMElement, {
+		cond(computed(() => versionText()), () => h(DOMElement, {
 			element: "div",
 			attrs: { class: "rpg-ui-title-screen-version" },
 			textContent: computed(() => versionText())

package/dist/components/gui/title-screen.ce.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"title-screen.ce.js","names":[],"sources":["../../../src/components/gui/title-screen.ce"],"sourcesContent":["<DOMContainer width=\"100%\" height=\"100%\">\n <div class=\"rpg-ui-title-screen rpg-anim-fade-in\">\n <div class=\"rpg-ui-title-screen-header rpg-anim-float\">\n <div class=\"rpg-ui-title-screen-title\">{titleText()}</div>\n @if (subtitleText()) {\n <div class=\"rpg-ui-title-screen-subtitle\">{subtitleText()}</div>\n }\n </div>\n <Navigation tabindex={selectedEntry} controls={controls}>\n <div class=\"rpg-ui-menu rpg-ui-title-screen-menu rpg-anim-slide-up\">\n @for ((entry,index) of entryList()) {\n <div\n class=\"rpg-ui-menu-item\"\n class={{disabled: isEntryDisabled(entry)}}\n data-selected={selectedEntry() === index ? \"true\" : \"false\"}\n tabindex={index}\n click={selectEntry(index)}\n >{entry.label}</div>\n }\n </div>\n </Navigation>\n @if (versionText()) {\n <div class=\"rpg-ui-title-screen-version\">{versionText()}</div>\n }\n </div>\n</DOMContainer>\n\n<script>\n import { signal, computed, effect } from \"canvasengine\";\n import { PrebuiltGui } from \"@rpgjs/common\";\n import { inject } from \"../../core/inject\";\n import { RpgClientEngine } from \"../../RpgClientEngine\";\n import { RpgGui } from \"../../Gui/Gui\";\n\n const engine = inject(RpgClientEngine);\n const guiService = inject(RpgGui);\n const keyboardControls = engine.globalConfig.keyboardControls;\n\n const { data, onInteraction } = defineProps({\n entries: {\n default: () => []\n },\n saveLoad: {\n default: () => ({})\n },\n localActions: {\n default: false\n }\n });\n\n const { entries, title, subtitle, version, saveLoad, localActions } = data();\n\n const defaultEntries = [\n { id: \"start\", label: \"Start\" },\n { id: \"load\", label: \"Load\" }\n ];\n\n const resolveProp = (value) => typeof value === \"function\" ? value() : value;\n const titleText = computed(() => resolveProp(title) \|\| \"RPG\");\n const subtitleText = computed(() => resolveProp(subtitle) \|\| \"\");\n const versionText = computed(() => resolveProp(version) \|\| \"\");\n const localActionsEnabled = computed(() => resolveProp(localActions) === true);\n\n const entryList = computed(() => {\n const list = resolveProp(entries);\n if (Array.isArray(list) && list.length) return list;\n return defaultEntries;\n });\n\n const isEntryDisabled = (entry) => {\n if (!entry) return true;\n if (entry.disabled) return true;\n if (entry.enabled === false) return true;\n return false;\n };\n\n const selectedEntry = signal(0);\n const selectableIndexes = computed(() => {\n const list = entryList();\n return list\n .map((entry, index) => (isEntryDisabled(entry) ? null : index))\n .filter((value) => value !== null);\n });\n\n effect(() => {\n const available = selectableIndexes();\n if (!available.length) return;\n const current = selectedEntry();\n if (!available.includes(current)) {\n selectedEntry.set(available[0]);\n }\n });\n\n const moveSelection = (delta) => {\n const available = selectableIndexes();\n if (!available.length) return;\n const current = selectedEntry();\n const currentIndex = Math.max(0, available.indexOf(current));\n const nextIndex = (currentIndex + delta + available.length) % available.length;\n selectedEntry.set(available[nextIndex]);\n };\n\n const triggerSelect = (index) => {\n const list = entryList();\n const entry = list[index];\n if (!entry \|\| isEntryDisabled(entry)) return;\n if (localActionsEnabled()) {\n if (entry.id === \"start\") {\n guiService.hide(PrebuiltGui.TitleScreen);\n }\n if (entry.id === \"load\") {\n const config = resolveProp(saveLoad) \|\| {};\n const slots = Array.isArray(config.slots) ? config.slots : [null, null, null];\n guiService.display(PrebuiltGui.Save, {\n ...config,\n mode: config.mode \|\| \"load\",\n slots\n });\n }\n }\n if (onInteraction) {\n onInteraction(\"select\", { id: entry.id, index, entry });\n }\n };\n\n function selectEntry(index) {\n return function() {\n selectedEntry.set(index);\n triggerSelect(index);\n };\n }\n\n const controls = signal({\n up: {\n repeat: true,\n bind: keyboardControls.up,\n throttle: 150,\n keyDown() {\n if (guiService.isDisplaying(PrebuiltGui.Save)) return;\n moveSelection(-1);\n }\n },\n down: {\n repeat: true,\n bind: keyboardControls.down,\n throttle: 150,\n keyDown() {\n if (guiService.isDisplaying(PrebuiltGui.Save)) return;\n moveSelection(1);\n }\n },\n action: {\n bind: keyboardControls.action,\n keyDown() {\n if (guiService.isDisplaying(PrebuiltGui.Save)) return;\n triggerSelect(selectedEntry());\n }\n },\n gamepad: {\n enabled: true\n }\n });\n</script>\n"],"mappings":";;;;;;AAYM,SAAS,UAAS,SAAU;CACX,SAAS,~~QAAQ~~;~~CAChC~~,MAAM,cAAc,eAAW,~~QAAA~~;CAC/B,MAAM,SAAS,OAAC,~~gBAAe~~;CACvC,MAAM,aAAa,OAAK,~~OAAO~~;CAC/B,MAAM,mBAAgB,OAAM,aAAW;CACvC,MAAM,EAAE,MAAM,kBAAE,YAAA;EACZ,SAAS,EACL,eAAY,~~EAAA~~,~~EACf~~;~~EACD~~,UAAS,EACL,gBAAA,~~EAAA~~,~~GACH~~;~~EACH~~,cAAY,EAAA,SAAA,~~OAEb~~;~~EACA~~,CAAC;~~CACF~~,MAAI,EAAA,SAAS,OAAW,UAAU,SAAM,UAAO,iBAAA,~~MAAA~~;CAC/C,MAAI,iBAAkB,CAClB;EAAA,IAAM;EAAG,OAAA;~~EAAsB~~,~~EAC/B~~;EAAA,IAAM;EAAG,OAAS;~~EAAW~~,CAAA;~~CAEjC~~,MAAI,eAAe,UAAO,OAAA,UAAgB,aAAA,~~OAAA~~,~~GAAA~~;CAC1C,MAAI,YAAM,eAAoB,YAAO,~~MAAA~~,~~IAAA~~,~~MAAA~~;CACrC,MAAI,eAAM,eAA0B,YAAY,~~SAAC~~,~~IAAA~~,~~GAAA~~;;CAEjD,MAAI,sBAAc,eAAkB,YAAY,~~aAAA~~,~~KAAA~~,~~KAAA~~;CAChD,MAAM,YAAW,eAAA;EACb,MAAM,OAAE,YAAgB,~~QAAA~~;EACxB,IAAI,MAAC,QAAA,~~KAAA,~~IAAA,KAAA,QACD,OAAA;EACJ,OAAO;~~GACT~~;~~CACF~~,MAAM,mBAAgB,UAAA;EAClB,IAAI,CAAC,OACD,OAAA;EACJ,IAAE,MAAA,UAAA,OAAA;EAEF,IAAA,MAAQ,YAAc,OAAA,OAAA;EAEtB,OAAM~~;;CAEV~~,MAAM,gBAAgB,OAAO,~~EAAC~~;CAC9B,MAAK,oBAAA,eAAA;EAED,OAAA,~~WAAM~~,~~CACD~~,KAAC,OAAW,UAAW,gBAAgB,~~MAAM~~,~~GAAG~~,OAAO,~~MAAC~~,~~CACxD~~,QAAC,UAAe,UAAY,~~KAAG~~;~~GACtC~~;~~CACF~~,aAAU;;EAEN,IAAA,CAAK,UAAU,QACX;EACJ,MAAM,UAAQ,~~eAAiB~~;~~EAC/B~~,IAAI,CAAA,UAAO,SAAA,~~QAAc~~,~~EACvB~~,cAAA,IAAA,UAAA,~~GAAA~~;~~GAEJ~~;~~CACF~~,MAAM,iBAAc,UAAW;EAC3B,MAAM,YAAQ,~~mBAAqB~~;EACnC,IAAI,CAAA,UAAU,QACV;EACJ,MAAC,UAAA,~~eAAA~~;EAED,MAAM,aAAA,KAAA,IAAA,GAAA,UAAA,QAAA,~~QAAA~~,~~CAAyB~~,~~GAAA~~,QAAA,UAAA,UAAA,UAAA;EAC/B,cAAM,IAAA,UAAoB,~~WAAa;;CAE3C~~,MAAM,iBAAS,UAAA;EAEX,MAAM,QADO,~~WACI~~,~~CAAA~~;EACjB,IAAE,CAAA,SAAA,gBAAA,~~MAAA~~,~~EAAA~~;EAEF,IAAA,~~qBAAa~~,~~EAAA~~;GACT,IAAA,MAAM,OAAW,SACb,WAAW,KAAA,YAAc,~~YAAA~~;GAE7B,IAAI,MAAC,OAAU,QAAS;IACpB,MAAA,SAAc,YAAa,~~SAAI~~,~~IAAA~~,~~EAAA~~;IACnC,MAAA,QAAA,MAAA,QAAA,OAAA,~~MAAA~~,~~GAAA~~,OAAA,QAAA;KAAA;KAAA;KAAA;~~KAAA~~;IACF,WAAA,QAAA,YAAA,MAAA;;KAEI,MAAA,OAAiB,QAAU;KACvB;~~KACD~~,~~CAAA;;;EAGT~~,IAAI,eACA,cAAc,UAAI;GAAA,IAAU,MAAA;GAAW;GAAA;~~GAAA~~,CAAA;;CAG/C,SAAS,YAAC,OAAiB;EACvB,OAAI,WAAa;GACb,cAAc,IAAI,~~MAAM~~;~~GACxB~~,cAAc,~~MAAA;;;CAGtB~~,MAAM,WAAU,OAAA;EACZ,IAAI;GACA,QAAQ;GACR,MAAM,iBAAiB;GACvB,UAAQ;GACR,UAAQ;IACJ,IAAI,WAAO,aAAM,YAAA,~~KAAA~~,~~EACb~~;IACJ,cAAQ,~~GAAA;;GAEf~~;~~EACD~~,MAAI;GACA,QAAI;GACJ,MAAI,iBAAe;GACnB,UAAA;GACH,UAAA;mDAEQ;IACL,cAAkB,~~EAAA;;GAErB~~;~~EACD~~,QAAK;GACL,MAAA,iBAAA;;IAEM,IAAA,WAAiB,aAAC,YAAA,~~KAAA~~,~~EAChB~~;IACA,cAAY,~~eAAA~~,CAAA~~;;GAEnB~~;~~EACD~~,SAAQ,EACJ,SAAQ,~~MACX~~;~~EACJ~~,CAAC;~~CAEM~~,OADC,EAAA,cAAA;EAAA,OAAA;EAAA,QAAA;~~EAAA~~,~~EAAA~~,EAAA,YAAA;EAAA,SAAA;EAAA,OAAA,EAAA,OAAA,~~wCAAA~~;~~EAAA~~,~~EAAA~~;EAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,~~6CAAA~~;GAAA,~~EAAA,~~CAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,~~6BAAA~~;GAAA,aAAA,eAAA,~~WAAA~~,CAAA;~~GAAA~~,CAAA,~~EAAA~~,KAAA,~~cAAA~~,~~QAAA~~,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA~~,gCAAA~~;GAAA,aAAA,eAAA,~~cAAA~~,CAAA;~~GAAA~~,CAAA,CAAA,CAAA,CAAA;EAAA,EAAA,YAAA;GAAA,UAAA;GAAA;GAAA,EAAA,~~EAAA,~~YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA,~~0DAAA~~;GAAA,~~EAAA,~~KAAA,~~WAAA~~,~~GAAA~~,OAAA,UAAA,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA;IAAA,OAAA,CAAA,oBAAA,gBAAA,EAAA,UAAA,gBAAA,~~MAAA~~,EAAA,EAAA,CAAA;IAAA,iBAAA,eAAA,~~eAAA~~,~~KAAA~~,QAAA,SAAA,~~QAAA~~;IAAA,UAAA;IAAA,OAAA,YAAA,~~MAAA~~;~~IAAA~~;GAAA,aAAA,MAAA;~~GAAA~~,CAAA,CAAA,CAAA,CAAA;EAAA,KAAA,~~aAAA~~,~~QAAA~~,EAAA,YAAA;GAAA,SAAA;GAAA,OAAA,EAAA,OAAA~~,+BAAA~~;GAAA,aAAA,eAAA,~~aAAA~~,CAAA;~~GAAA~~,CAAA,CAAA;~~EAAA~~,CAAA,CACK~~;;AAGR~~,IAAM,iBAEF"}
1	+ {"version":3,"file":"title-screen.ce.js","names":[],"sources":["../../../src/components/gui/title-screen.ce"],"sourcesContent":["<DOMContainer width=\"100%\" height=\"100%\">\n <div class=\"rpg-ui-title-screen rpg-anim-fade-in\">\n <div class=\"rpg-ui-title-screen-header rpg-anim-float\">\n <div class=\"rpg-ui-title-screen-title\">{titleText()}</div>\n @if (subtitleText()) {\n <div class=\"rpg-ui-title-screen-subtitle\">{subtitleText()}</div>\n }\n </div>\n <Navigation tabindex={selectedEntry} controls={controls}>\n <div class=\"rpg-ui-menu rpg-ui-title-screen-menu rpg-anim-slide-up\">\n @for ((entry,index) of entryList()) {\n <div\n class=\"rpg-ui-menu-item\"\n class={{disabled: isEntryDisabled(entry)}}\n data-selected={selectedEntry() === index ? \"true\" : \"false\"}\n tabindex={index}\n click={selectEntry(index)}\n >{entry.label}</div>\n }\n </div>\n </Navigation>\n @if (versionText()) {\n <div class=\"rpg-ui-title-screen-version\">{versionText()}</div>\n }\n </div>\n</DOMContainer>\n\n<script>\n import { signal, computed, effect } from \"canvasengine\";\n import { PrebuiltGui } from \"@rpgjs/common\";\n import { inject } from \"../../core/inject\";\n import { RpgClientEngine } from \"../../RpgClientEngine\";\n import { RpgGui } from \"../../Gui/Gui\";\n\n const engine = inject(RpgClientEngine);\n const guiService = inject(RpgGui);\n const keyboardControls = engine.globalConfig.keyboardControls;\n\n const { data, onInteraction } = defineProps({\n entries: {\n default: () => []\n },\n saveLoad: {\n default: () => ({})\n },\n localActions: {\n default: false\n }\n });\n\n const { entries, title, subtitle, version, saveLoad, localActions } = data();\n\n const defaultEntries = [\n { id: \"start\", label: \"Start\" },\n { id: \"load\", label: \"Load\" }\n ];\n\n const resolveProp = (value) => typeof value === \"function\" ? value() : value;\n const titleText = computed(() => resolveProp(title) \|\| \"RPG\");\n const subtitleText = computed(() => resolveProp(subtitle) \|\| \"\");\n const versionText = computed(() => resolveProp(version) \|\| \"\");\n const localActionsEnabled = computed(() => resolveProp(localActions) === true);\n\n const entryList = computed(() => {\n const list = resolveProp(entries);\n if (Array.isArray(list) && list.length) return list;\n return defaultEntries;\n });\n\n const isEntryDisabled = (entry) => {\n if (!entry) return true;\n if (entry.disabled) return true;\n if (entry.enabled === false) return true;\n return false;\n };\n\n const selectedEntry = signal(0);\n const selectableIndexes = computed(() => {\n const list = entryList();\n return list\n .map((entry, index) => (isEntryDisabled(entry) ? null : index))\n .filter((value) => value !== null);\n });\n\n effect(() => {\n const available = selectableIndexes();\n if (!available.length) return;\n const current = selectedEntry();\n if (!available.includes(current)) {\n selectedEntry.set(available[0]);\n }\n });\n\n const moveSelection = (delta) => {\n const available = selectableIndexes();\n if (!available.length) return;\n const current = selectedEntry();\n const currentIndex = Math.max(0, available.indexOf(current));\n const nextIndex = (currentIndex + delta + available.length) % available.length;\n selectedEntry.set(available[nextIndex]);\n };\n\n const triggerSelect = (index) => {\n const list = entryList();\n const entry = list[index];\n if (!entry \|\| isEntryDisabled(entry)) return;\n if (localActionsEnabled()) {\n if (entry.id === \"start\") {\n guiService.hide(PrebuiltGui.TitleScreen);\n }\n if (entry.id === \"load\") {\n const config = resolveProp(saveLoad) \|\| {};\n const slots = Array.isArray(config.slots) ? config.slots : [null, null, null];\n guiService.display(PrebuiltGui.Save, {\n ...config,\n mode: config.mode \|\| \"load\",\n slots\n });\n }\n }\n if (onInteraction) {\n onInteraction(\"select\", { id: entry.id, index, entry });\n }\n };\n\n function selectEntry(index) {\n return function() {\n selectedEntry.set(index);\n triggerSelect(index);\n };\n }\n\n const controls = signal({\n up: {\n repeat: true,\n bind: keyboardControls.up,\n throttle: 150,\n keyDown() {\n if (guiService.isDisplaying(PrebuiltGui.Save)) return;\n moveSelection(-1);\n }\n },\n down: {\n repeat: true,\n bind: keyboardControls.down,\n throttle: 150,\n keyDown() {\n if (guiService.isDisplaying(PrebuiltGui.Save)) return;\n moveSelection(1);\n }\n },\n action: {\n bind: keyboardControls.action,\n keyDown() {\n if (guiService.isDisplaying(PrebuiltGui.Save)) return;\n triggerSelect(selectedEntry());\n }\n },\n gamepad: {\n enabled: true\n }\n });\n</script>\n"],"mappings":"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"}

package/dist/components/player-components-utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"player-components-utils.js","names":[],"sources":["../../src/components/player-components-utils.ts"],"sourcesContent":["export const DEFAULT_HP_BAR_STYLE = { fillColor: '#ef4444' };\nexport const DEFAULT_SP_BAR_STYLE = { fillColor: '#3b82f6' };\n\nconst DEFAULT_CELL_HEIGHT = 16;\nconst DEFAULT_CELL_WIDTH = 32;\n\ntype NumberResolver = (value: any, fallback?: number) => number;\n\nconst defaultToNumber: NumberResolver = (value, fallback = 0) => {\n const num = typeof value === 'number' ? value : parseFloat(value);\n return Number.isFinite(num) ? num : fallback;\n};\n\nexport function getPointBounds(points: any[] = [], toNumber: NumberResolver = defaultToNumber) {\n if (!Array.isArray(points) \|\| points.length < 2) {\n return { width: 1, height: 1 };\n }\n\n let minX = Infinity;\n let minY = Infinity;\n let maxX = -Infinity;\n let maxY = -Infinity;\n\n for (let i = 0; i < points.length; i += 2) {\n const x = toNumber(points[i], 0);\n const y = toNumber(points[i + 1], 0);\n minX = Math.min(minX, x);\n minY = Math.min(minY, y);\n maxX = Math.max(maxX, x);\n maxY = Math.max(maxY, y);\n }\n\n return {\n width: Math.max(1, maxX - minX),\n height: Math.max(1, maxY - minY)\n };\n}\n\nexport function getComponentId(definition: any) {\n if (!definition) return undefined;\n if (definition.id) return definition.id;\n if (definition.type === 'text') return 'rpg:text';\n if (definition.type === 'hpBar') return 'rpg:hpBar';\n if (definition.type === 'spBar') return 'rpg:spBar';\n if (definition.type === 'bar') return 'rpg:bar';\n if (definition.type === 'shape') return 'rpg:shape';\n if (definition.type === 'image') return 'rpg:image';\n if (definition.type === 'tile') return 'rpg:tile';\n return definition.type;\n}\n\nexport function getComponentProps(definition: any) {\n if (definition.props) return definition.props;\n\n if (definition.type === 'text') {\n return { value: definition.value, style: definition.style };\n }\n if (definition.type === 'hpBar') {\n return { current: '{hp}', max: '{param.maxHp}', style: { ...DEFAULT_HP_BAR_STYLE, ...definition.style }, text: definition.text };\n }\n if (definition.type === 'spBar') {\n return { current: '{sp}', max: '{param.maxSp}', style: { ...DEFAULT_SP_BAR_STYLE, ...definition.style }, text: definition.text };\n }\n if (definition.type === 'bar') {\n return { current: `{${definition.current}}`, max: `{${definition.max}}`, style: definition.style, text: definition.text };\n }\n if (definition.type === 'shape') {\n return definition.value;\n }\n if (definition.type === 'image' \|\| definition.type === 'tile') {\n return { value: definition.value };\n }\n\n return {};\n}\n\nexport function estimateComponentSize(\n definition: any,\n {\n toNumber = defaultToNumber,\n estimateTextWidth = (value: any) => String(value ?? '').length * 8\n }: {\n toNumber?: NumberResolver;\n estimateTextWidth?: (value: any, style?: any) => number;\n } = {}\n) {\n const props = getComponentProps(definition);\n const style = props?.style ?? definition?.style ?? {};\n\n if (definition?.type === 'text' \|\| definition?.id === 'rpg:text') {\n return {\n width: estimateTextWidth(props.value ?? definition.value, style),\n height: toNumber(style.fontSize, 12)\n };\n }\n\n if (definition?.type === 'hpBar' \|\| definition?.type === 'spBar' \|\| definition?.type === 'bar' \|\| definition?.id === 'rpg:hpBar' \|\| definition?.id === 'rpg:spBar' \|\| definition?.id === 'rpg:bar') {\n const barHeight = toNumber(style.height, 8);\n const labelHeight = props.text != null && props.text !== '' ? toNumber(style.fontSize, 10) + 2 : 0;\n return {\n width: toNumber(style.width, 50),\n height: barHeight + labelHeight\n };\n }\n\n if (definition?.type === 'shape' \|\| definition?.id === 'rpg:shape') {\n const shape = props ?? {};\n if (shape.type === 'circle') {\n const radius = toNumber(shape.radius, 8);\n return { width: radius * 2, height: radius * 2 };\n }\n if (shape.type === 'line') {\n return {\n width: Math.max(1, Math.abs(toNumber(shape.x2, 16) - toNumber(shape.x1, 0))),\n height: Math.max(1, Math.abs(toNumber(shape.y2, 0) - toNumber(shape.y1, 0)))\n };\n }\n if (shape.type === 'polygon') {\n return getPointBounds(shape.points, toNumber);\n }\n return {\n width: toNumber(shape.width, 16),\n height: toNumber(shape.height, 16)\n };\n }\n\n return {\n width: toNumber(definition?.props?.width, DEFAULT_CELL_WIDTH),\n height: toNumber(definition?.props?.height, DEFAULT_CELL_HEIGHT)\n };\n}\n\nexport function computeBlockSize({\n position,\n layout = {},\n rowMetrics,\n gap = { row: 0, column: 0 },\n graphic,\n hitbox\n}: {\n position: string;\n layout?: any;\n rowMetrics: Array<{ width: number; height: number; cells: any[] }>;\n gap?: { row: number; column: number };\n graphic: { width: number; height: number };\n hitbox: { w: number; h: number };\n}) {\n const rowGapTotal = Math.max(0, rowMetrics.length - 1) * gap.row;\n const maxColumns = rowMetrics.reduce((max, row) => Math.max(max, row.cells.length), 0);\n const columnGapTotal = Math.max(0, maxColumns - 1) * gap.column;\n const contentWidth = rowMetrics.reduce((max, row) => Math.max(max, row.width), 0) + columnGapTotal;\n const contentHeight = rowMetrics.reduce((sum, row) => sum + row.height, 0) + rowGapTotal;\n const width = layout.width ?? Math.max(contentWidth, position === 'bottom' ? hitbox.w : position === 'top' \|\| position === 'center' ? graphic.width : contentWidth);\n const height = layout.height ?? Math.max(contentHeight, position === 'bottom' ? hitbox.h : position === 'left' \|\| position === 'right' \|\| position === 'center' ? graphic.height : contentHeight);\n\n return { width, height };\n}\n\nexport function computeBlockPosition({\n position,\n size,\n layout = {},\n graphic,\n hitbox\n}: {\n position: string;\n size: { width: number; height: number };\n layout?: any;\n graphic: { left: number; top: number; right: number; centerX: number; centerY: number };\n hitbox: { w: number; h: number };\n}) {\n const marginLeft = layout.marginLeft ?? 0;\n const marginRight = layout.marginRight ?? 0;\n const marginTop = layout.marginTop ?? 0;\n const marginBottom = layout.marginBottom ?? 0;\n\n switch (position) {\n case 'bottom':\n return {\n x: (hitbox.w / 2) - (size.width / 2) + marginLeft - marginRight,\n y: (hitbox.h / 2) - (size.height / 2) + marginBottom - marginTop\n };\n case 'center':\n return {\n x: graphic.centerX - (size.width / 2) + marginLeft - marginRight,\n y: graphic.centerY - (size.height / 2) + marginTop - marginBottom\n };\n case 'left':\n return {\n x: graphic.left - size.width + marginLeft - marginRight,\n y: graphic.centerY - (size.height / 2) + marginTop - marginBottom\n };\n case 'right':\n return {\n x: graphic.right + marginLeft - marginRight,\n y: graphic.centerY - (size.height / 2) + marginTop - marginBottom\n };\n case 'top':\n default:\n return {\n x: graphic.centerX - (size.width / 2) + marginLeft - marginRight,\n y: graphic.top - size.height + marginTop - marginBottom\n };\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"player-components-utils.js","names":[],"sources":["../../src/components/player-components-utils.ts"],"sourcesContent":["export const DEFAULT_HP_BAR_STYLE = { fillColor: '#ef4444' };\nexport const DEFAULT_SP_BAR_STYLE = { fillColor: '#3b82f6' };\n\nconst DEFAULT_CELL_HEIGHT = 16;\nconst DEFAULT_CELL_WIDTH = 32;\n\ntype NumberResolver = (value: any, fallback?: number) => number;\n\nconst defaultToNumber: NumberResolver = (value, fallback = 0) => {\n const num = typeof value === 'number' ? value : parseFloat(value);\n return Number.isFinite(num) ? num : fallback;\n};\n\nexport function getPointBounds(points: any[] = [], toNumber: NumberResolver = defaultToNumber) {\n if (!Array.isArray(points) \|\| points.length < 2) {\n return { width: 1, height: 1 };\n }\n\n let minX = Infinity;\n let minY = Infinity;\n let maxX = -Infinity;\n let maxY = -Infinity;\n\n for (let i = 0; i < points.length; i += 2) {\n const x = toNumber(points[i], 0);\n const y = toNumber(points[i + 1], 0);\n minX = Math.min(minX, x);\n minY = Math.min(minY, y);\n maxX = Math.max(maxX, x);\n maxY = Math.max(maxY, y);\n }\n\n return {\n width: Math.max(1, maxX - minX),\n height: Math.max(1, maxY - minY)\n };\n}\n\nexport function getComponentId(definition: any) {\n if (!definition) return undefined;\n if (definition.id) return definition.id;\n if (definition.type === 'text') return 'rpg:text';\n if (definition.type === 'hpBar') return 'rpg:hpBar';\n if (definition.type === 'spBar') return 'rpg:spBar';\n if (definition.type === 'bar') return 'rpg:bar';\n if (definition.type === 'shape') return 'rpg:shape';\n if (definition.type === 'image') return 'rpg:image';\n if (definition.type === 'tile') return 'rpg:tile';\n return definition.type;\n}\n\nexport function getComponentProps(definition: any) {\n if (definition.props) return definition.props;\n\n if (definition.type === 'text') {\n return { value: definition.value, style: definition.style };\n }\n if (definition.type === 'hpBar') {\n return { current: '{hp}', max: '{param.maxHp}', style: { ...DEFAULT_HP_BAR_STYLE, ...definition.style }, text: definition.text };\n }\n if (definition.type === 'spBar') {\n return { current: '{sp}', max: '{param.maxSp}', style: { ...DEFAULT_SP_BAR_STYLE, ...definition.style }, text: definition.text };\n }\n if (definition.type === 'bar') {\n return { current: `{${definition.current}}`, max: `{${definition.max}}`, style: definition.style, text: definition.text };\n }\n if (definition.type === 'shape') {\n return definition.value;\n }\n if (definition.type === 'image' \|\| definition.type === 'tile') {\n return { value: definition.value };\n }\n\n return {};\n}\n\nexport function estimateComponentSize(\n definition: any,\n {\n toNumber = defaultToNumber,\n estimateTextWidth = (value: any) => String(value ?? '').length * 8\n }: {\n toNumber?: NumberResolver;\n estimateTextWidth?: (value: any, style?: any) => number;\n } = {}\n) {\n const props = getComponentProps(definition);\n const style = props?.style ?? definition?.style ?? {};\n\n if (definition?.type === 'text' \|\| definition?.id === 'rpg:text') {\n return {\n width: estimateTextWidth(props.value ?? definition.value, style),\n height: toNumber(style.fontSize, 12)\n };\n }\n\n if (definition?.type === 'hpBar' \|\| definition?.type === 'spBar' \|\| definition?.type === 'bar' \|\| definition?.id === 'rpg:hpBar' \|\| definition?.id === 'rpg:spBar' \|\| definition?.id === 'rpg:bar') {\n const barHeight = toNumber(style.height, 8);\n const labelHeight = props.text != null && props.text !== '' ? toNumber(style.fontSize, 10) + 2 : 0;\n return {\n width: toNumber(style.width, 50),\n height: barHeight + labelHeight\n };\n }\n\n if (definition?.type === 'shape' \|\| definition?.id === 'rpg:shape') {\n const shape = props ?? {};\n if (shape.type === 'circle') {\n const radius = toNumber(shape.radius, 8);\n return { width: radius * 2, height: radius * 2 };\n }\n if (shape.type === 'line') {\n return {\n width: Math.max(1, Math.abs(toNumber(shape.x2, 16) - toNumber(shape.x1, 0))),\n height: Math.max(1, Math.abs(toNumber(shape.y2, 0) - toNumber(shape.y1, 0)))\n };\n }\n if (shape.type === 'polygon') {\n return getPointBounds(shape.points, toNumber);\n }\n return {\n width: toNumber(shape.width, 16),\n height: toNumber(shape.height, 16)\n };\n }\n\n return {\n width: toNumber(definition?.props?.width, DEFAULT_CELL_WIDTH),\n height: toNumber(definition?.props?.height, DEFAULT_CELL_HEIGHT)\n };\n}\n\nexport function computeBlockSize({\n position,\n layout = {},\n rowMetrics,\n gap = { row: 0, column: 0 },\n graphic,\n hitbox\n}: {\n position: string;\n layout?: any;\n rowMetrics: Array<{ width: number; height: number; cells: any[] }>;\n gap?: { row: number; column: number };\n graphic: { width: number; height: number };\n hitbox: { w: number; h: number };\n}) {\n const rowGapTotal = Math.max(0, rowMetrics.length - 1) * gap.row;\n const maxColumns = rowMetrics.reduce((max, row) => Math.max(max, row.cells.length), 0);\n const columnGapTotal = Math.max(0, maxColumns - 1) * gap.column;\n const contentWidth = rowMetrics.reduce((max, row) => Math.max(max, row.width), 0) + columnGapTotal;\n const contentHeight = rowMetrics.reduce((sum, row) => sum + row.height, 0) + rowGapTotal;\n const width = layout.width ?? Math.max(contentWidth, position === 'bottom' ? hitbox.w : position === 'top' \|\| position === 'center' ? graphic.width : contentWidth);\n const height = layout.height ?? Math.max(contentHeight, position === 'bottom' ? hitbox.h : position === 'left' \|\| position === 'right' \|\| position === 'center' ? graphic.height : contentHeight);\n\n return { width, height };\n}\n\nexport function computeBlockPosition({\n position,\n size,\n layout = {},\n graphic,\n hitbox\n}: {\n position: string;\n size: { width: number; height: number };\n layout?: any;\n graphic: { left: number; top: number; right: number; centerX: number; centerY: number };\n hitbox: { w: number; h: number };\n}) {\n const marginLeft = layout.marginLeft ?? 0;\n const marginRight = layout.marginRight ?? 0;\n const marginTop = layout.marginTop ?? 0;\n const marginBottom = layout.marginBottom ?? 0;\n\n switch (position) {\n case 'bottom':\n return {\n x: (hitbox.w / 2) - (size.width / 2) + marginLeft - marginRight,\n y: (hitbox.h / 2) - (size.height / 2) + marginBottom - marginTop\n };\n case 'center':\n return {\n x: graphic.centerX - (size.width / 2) + marginLeft - marginRight,\n y: graphic.centerY - (size.height / 2) + marginTop - marginBottom\n };\n case 'left':\n return {\n x: graphic.left - size.width + marginLeft - marginRight,\n y: graphic.centerY - (size.height / 2) + marginTop - marginBottom\n };\n case 'right':\n return {\n x: graphic.right + marginLeft - marginRight,\n y: graphic.centerY - (size.height / 2) + marginTop - marginBottom\n };\n case 'top':\n default:\n return {\n x: graphic.centerX - (size.width / 2) + marginLeft - marginRight,\n y: graphic.top - size.height + marginTop - marginBottom\n };\n }\n}\n"],"mappings":"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"}

package/dist/components/player-components.ce.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"player-components.ce.js","names":[],"sources":["../../src/components/player-components.ce"],"sourcesContent":["<Container\n x={blockPosition().x}\n y={blockPosition().y}\n width={blockSize().width}\n height={blockSize().height}\n minWidth={blockSize().width}\n minHeight={blockSize().height}\n display=\"flex\"\n flexDirection=\"column\"\n justifyContent=\"center\"\n alignItems=\"center\"\n rowGap={gap().row}\n>\n @for (row of renderedRows) {\n <Container\n width=\"100%\"\n height={row.height}\n display=\"flex\"\n flexDirection=\"row\"\n justifyContent=\"center\"\n alignItems=\"center\"\n columnGap={gap().column}\n >\n @for (entry of row.entries) {\n <Container\n width={entry.width}\n height={entry.height}\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n <entry.component object ...entry.props />\n </Container>\n }\n </Container>\n }\n</Container>\n\n<script>\nimport { computed } from \"canvasengine\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\nimport { inject } from \"../core/inject\";\nimport { resolveDynamicProps, resolveDynamicValue } from \"./dynamics/parse-value\";\nimport {\n computeBlockPosition,\n computeBlockSize,\n estimateComponentSize,\n getComponentId,\n getComponentProps\n} from \"./player-components-utils\";\n\nconst { object, position, graphicBounds } = defineProps({\n position: {\n default: 'top'\n }\n});\n\nconst client = inject(RpgClientEngine);\nconst warnedComponents = new Set();\n\nconst readPosition = computed(() => position?.() ?? 'top');\n\nconst componentSource = computed(() => {\n switch (readPosition()) {\n case 'bottom':\n return object.componentsBottom?.();\n case 'center':\n return object.componentsCenter?.();\n case 'left':\n return object.componentsLeft?.();\n case 'right':\n return object.componentsRight?.();\n case 'top':\n default:\n return object.componentsTop?.();\n }\n});\n\nconst componentData = computed(() => {\n const value = componentSource();\n if (!value) {\n return { components: [], layout: {} };\n }\n\n if (typeof value !== 'string') {\n return value;\n }\n\n try {\n return JSON.parse(value);\n } catch (error) {\n if (typeof process === 'undefined' \|\| process.env?.NODE_ENV !== 'production') {\n console.warn('[RPGJS] Invalid server sprite component payload', error);\n }\n return { components: [], layout: {} };\n }\n});\n\nconst layout = computed(() => componentData()?.layout ?? {});\nconst rows = computed(() => componentData()?.components ?? []);\nconst hitbox = object.hitbox;\n\nconst toNumber = (value, fallback = 0) => {\n const resolved = resolveDynamicValue(value, object);\n const num = typeof resolved === 'number' ? resolved : parseFloat(resolved);\n return Number.isFinite(num) ? num : fallback;\n};\n\nconst estimateTextWidth = (value, style = {}) => {\n const text = String(resolveDynamicValue(value ?? '', object) ?? '');\n const fontSize = toNumber(style.fontSize, 12);\n return Math.max(1, Math.ceil(text.length * fontSize * 0.6));\n};\n\nconst rowMetrics = computed(() => {\n return rows().map((row) => {\n const cells = row.map((definition) => {\n const intrinsic = estimateComponentSize(definition, { toNumber, estimateTextWidth });\n return {\n definition,\n width: intrinsic.width,\n height: intrinsic.height\n };\n });\n\n return {\n cells,\n width: cells.reduce((sum, cell) => sum + cell.width, 0),\n height: cells.reduce((max, cell) => Math.max(max, cell.height), 0)\n };\n });\n});\n\nconst gap = computed(() => ({\n row: toNumber(layout().rowGap ?? layout().gap, 0),\n column: toNumber(layout().columnGap ?? layout().gap, 0)\n}));\n\nconst fallbackBounds = computed(() => {\n const box = hitbox();\n const width = box?.w ?? 0;\n const height = box?.h ?? 0;\n\n return {\n left: 0,\n top: 0,\n right: width,\n bottom: height,\n width,\n height,\n centerX: width / 2,\n centerY: height / 2\n };\n});\n\nconst bounds = computed(() => {\n const resolvedBounds = typeof graphicBounds === 'function' ? graphicBounds() : undefined;\n return resolvedBounds ?? fallbackBounds();\n});\n\nconst blockSize = computed(() => {\n const box = hitbox() ?? { w: 0, h: 0 };\n const graphic = bounds();\n return computeBlockSize({\n position: readPosition(),\n layout: layout(),\n rowMetrics: rowMetrics(),\n gap: gap(),\n graphic,\n hitbox: box\n });\n});\n\nconst blockPosition = computed(() => {\n const box = hitbox() ?? { w: 0, h: 0 };\n const graphic = bounds();\n return computeBlockPosition({\n position: readPosition(),\n size: blockSize(),\n layout: layout(),\n graphic,\n hitbox: box\n });\n});\n\nconst warnMissingComponent = (id) => {\n if (!id \|\| warnedComponents.has(id)) return;\n if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'production') return;\n warnedComponents.add(id);\n console.warn(`[RPGJS] Server sprite component \"${id}\" is not registered on the client.`);\n};\n\nconst renderedRows = computed(() => {\n return rowMetrics().map((row) => {\n const entries = [];\n\n row.cells.forEach((cell) => {\n const definition = cell.definition;\n const id = getComponentId(definition);\n const component = client.getSpriteComponent(id);\n\n if (!component) {\n warnMissingComponent(id);\n return;\n }\n\n entries.push({\n component,\n props: resolveDynamicProps(getComponentProps(definition), object),\n width: cell.width,\n height: cell.height\n });\n });\n\n return {\n height: row.height,\n entries\n };\n });\n});\n</script>\n"],"mappings":";;;;;;AAUE,SAAY,UAAM,SAAA;CACD,SAAA,~~QAAA~~;CAEX,MAAM,EAAC,QAAA,UAAc,kBAD7B,eAAA,~~QAC6B~~,~~CAAA~~,EACzB,UAAC,EACC,SAAW,~~OACZ~~,EACJ,CAAC;~~CACF~~,MAAM,SAAA,OAAe,~~gBAAG~~;CACxB,MAAM,mCAAgB,IAAM,~~KAAA~~;CAC5B,MAAM,eAAY,eAAM,~~YAAA~~,~~IAAA~~,~~MAAA~~;CACxB,MAAM,kBAAiB,eAAM;EACzB,QAAA,~~cAAA~~,~~EAAA~~;GACG,KAAK,UACH,OAAA,OAAA,~~oBAAA~~;GACD,KAAE,UACA,OAAQ,OAAM,~~oBAAM~~;GACtB,KAAE,QACA,OAAA,OAAgB,~~kBAAM~~;GACxB,KAAE,SACF,OAAA,OAAA,~~mBAAA~~;GAEA,SACF,OAAA,OAAA,~~iBAAA;;GAEJ~~;~~CACF~~,MAAE,gBAAS,eAAA;;EAEV,IAAM,CAAA,OACC,OAAC;GAAQ,YAAS,~~EAAA~~;GAAA,QAAa,EAAA;~~GAAA;~~EAEvC,IAAQ,OAAO,UAAU,UACjB,OAAC;EAEP,IAAA;GACA,OAAA,KAAgB,MAAA,~~MAAA~~;~~WAEhB~~,OAAc;GACd,IAAA,OAAA,YAAA,eAAA,QAAA,IAAA,aAAA,cACQ,QAAO,KAAA,mDAAiB,~~MAAA~~;GAE1B,OAAO;IAAC,YAAU,~~EAAA~~;IAAA,QAAe,~~EAAE~~;~~IAAC;;GAE1C~~;CACF,MAAE,SAAA,eAAA,~~eAAA~~,~~EAAA~~,UAAA,~~EAAA~~,CAAA;CACF,MAAE,OAAA,eAAA,~~eAAA~~,~~EAAA~~,cAAA,~~EAAA~~,CAAA;;CAEF,MAAM,YAAS,OAAO,WAAA,MAAgB;EACtC,MAAM,WAAA,oBAA4B,OAAA,~~OAAA~~;;EAElC,OAAM,OAAY,SAAG,~~IAAU~~,~~GAAG~~,MAAE;;CAEpC,MAAM,qBAAkB,OAAU,QAAK,~~EAAA~~,~~KAAA~~;EACrC,MAAQ,OAAA,OAAc,oBAAE,SAAA,IAAA,~~OAAA~~,~~IAAA~~,~~GAAA~~;EACtB,MAAM,WAAO,SAAA,MAAA,UAAA,~~GAAA~~;EACb,OAAE,KAAO,IAAO,GAAA,KAAA,KAAA,KAAkB,SAAE,WAAA,~~GAAA~~,CAAA~~;;CAExC~~,MAAM,aAAa,eAAC;EAChB,OAAM,~~MAAK~~,~~CAAA~~,KAAA,QAAA;GACT,MAAO,QAAO,IAAA,KAAA,eAAkB;IAC5B,MAAM,YAAA,sBAAA,YAAA;KAAA;KAAA;~~KAAA~~,CAAA;IACJ,OAAO;KACL;KACH,OAAA,UAAA;KACE,QAAO,UAAc;~~KAChC~~;~~KACA~~;;IAEI;IACE,OAAQ,MAAA,QAAiB,KAAA,SAAA,MAAA,KAAA,OAAA,~~EAAA~~;IACrB,QAAE,MAAA,QAAA,KAAA,SAAA,KAAA,IAAA,KAAA,KAAA,~~OAAA~~,~~EAAA~~,~~EAAA~~;~~IACV~~;~~IACF~~;;CAEF,MAAM,MAAM,gBAAY;EACpB,KAAA,SAAY,~~QAAA~~,~~CAAA~~,UAAA,~~QAAA~~,~~CAAA~~,KAAA,~~EAAA~~;EACd,QAAA,SAAA,~~QAAA~~,~~CAAA~~,aAAA,~~QAAA~~,~~CAAA~~,KAAA,~~EAAA~~;;CAEF,MAAM,iBAAA,eAAA;EACF,MAAM,MAAM,~~QAAM~~;EAClB,MAAM,QAAQ,KAAA,KAAA;EACd,MAAI,SAAO,KAAS,KAAI;EACxB,OAAE;GACF,MAAA;GACA,KAAS;GACX,OAAA;GACA,QAAA;;GAEI;GACA,SAAO,QAAY;GACnB,SAAS,SAAO;;~~GAEtB~~;CACA,MAAE,SAAM,eAAW;EAEjB,QADmB,OAAa,kBAAW,aAAW,~~eAAoB~~,~~GAAA~~,KAAA,MAC/C,~~gBAAS~~;~~GACrC~~;;EAED,MAAM,MAAA,~~QAAkB~~,~~IAAG~~;GAAA,GAAM;GAAC,GAAK;~~GAAG~~;~~EACxC~~,MAAM,UAAO,~~QAAO~~;EACpB,OAAM,iBAAoB;GACpB,UAAU,~~cAAa~~;GAC9B,QAAA,~~QAAA~~;;GAEK,KAAA,~~KAAY~~;~~GACV~~;GACJ,QAAY;~~GACX~~,CAAC;~~GACJ~~;~~CACF~~,MAAM,gBAAY,eAAA;EACd,MAAI,MAAO,~~QAAS~~,~~IAAC~~;GAAK,GAAA;GAAA,GAAA;~~GAAA~~;EAC1B,MAAI,UAAQ,~~QAAU~~;EACtB,OAAG,qBAAA;GACD,UAAA,~~cAAA~~;;GAEF,QAAO,~~QAAA~~;GACL;GACA,QAAO;~~GACR~~,CAAC;~~GACJ~~;~~CACF~~,MAAI,wBAAA,OAAA;EACF,IAAA,CAAA,MAAA,iBAAA,IAAA,GAAA~~,EAAA~~;EAEF,IAAM,OAAM,YAAe,eAAA,QAAA,IAAA,aAAC,cACrB;EACL,iBAAiB,IAAM,~~GAAG~~;~~EACzB~~,QAAA,KAAA,oCAAA,GAAA,~~oCAAA~~;;CAEH,MAAM,eAAe,eAAe;EAClC,OAAS,~~YAAW~~,~~CAAA~~,KAAA,QAAA;GACd,MAAM,UAAU,~~EAAE~~;~~GAClB~~,IAAA,MAAS,SAAU,SAAC;;IAEnB,MAAA,KAAA,eAAA,~~WAAA~~;IACE,MAAA,YAAA,OAAA,mBAAA,~~GAAA~~;IACD,IAAA,CAAA,WAAA;KACM,qBAAA,~~GAAA~~;KACJ~~;;IAEF~~,QAAA,KAAA;KACG;KACA,OAAS,oBAAA,kBAAA,~~WAAA~~,~~EAAA~~,~~OAAA~~;KACnB,OAAA,KAAA;KACD,QAAA,KAAA;;~~KAEI~~;GACE,OAAA;IACC,QAAA,IAAe;IACtB;;~~IAEI~~;~~GACJ~~;~~CAEM~~,OADU,EAAA,WAAQ;EAAA,GAAA,eAAA,~~eAAA~~,CAAA~~,EAAA~~;EAAA,GAAA,eAAA,~~eAAA~~,CAAA~~,EAAA~~;EAAA,OAAA,eAAA,~~WAAA~~,~~CAAA~~,~~MAAA~~;EAAA,QAAA,eAAA,~~WAAA~~,~~CAAA~~,~~OAAA~~;EAAA,UAAA,eAAA,~~WAAA~~,~~CAAA~~,~~MAAA~~;EAAA,WAAA,eAAA,~~WAAA~~,~~CAAA~~,~~OAAA~~;EAAA,SAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,YAAA;EAAA,QAAA,eAAA,~~KAAA~~,~~CAAA~~,~~IAAA~~;~~EAAA~~,~~EAAA~~,KAAA,eAAA,QAAA,EAAA,WAAA;EAAA,OAAA;EAAA,QAAA,IAAA;EAAA,SAAA;EAAA,eAAA;EAAA,gBAAA;EAAA,YAAA;EAAA,WAAA,eAAA,~~KAAA~~,~~CAAA~~,~~OAAA~~;~~EAAA~~,~~EAAA~~,KAAA,IAAA,UAAA,UAAA,EAAA,WAAA;EAAA,OAAA,MAAA;EAAA,QAAA,MAAA;EAAA,SAAA;EAAA,gBAAA;EAAA,YAAA;~~EAAA~~,~~EAAA~~,EAAA,MAAA,WAAA;EAAA;EAAA,GAAA,MAAA;~~EAAA~~,CAAA,CAAA,CAAA,CAAA,CAAA,CACjB~~;;AAGL~~,IAAA,iBAEA"}
1	+ {"version":3,"file":"player-components.ce.js","names":[],"sources":["../../src/components/player-components.ce"],"sourcesContent":["<Container\n x={blockPosition().x}\n y={blockPosition().y}\n width={blockSize().width}\n height={blockSize().height}\n minWidth={blockSize().width}\n minHeight={blockSize().height}\n display=\"flex\"\n flexDirection=\"column\"\n justifyContent=\"center\"\n alignItems=\"center\"\n rowGap={gap().row}\n>\n @for (row of renderedRows) {\n <Container\n width=\"100%\"\n height={row.height}\n display=\"flex\"\n flexDirection=\"row\"\n justifyContent=\"center\"\n alignItems=\"center\"\n columnGap={gap().column}\n >\n @for (entry of row.entries) {\n <Container\n width={entry.width}\n height={entry.height}\n display=\"flex\"\n justifyContent=\"center\"\n alignItems=\"center\"\n >\n <entry.component object ...entry.props />\n </Container>\n }\n </Container>\n }\n</Container>\n\n<script>\nimport { computed } from \"canvasengine\";\nimport { RpgClientEngine } from \"../RpgClientEngine\";\nimport { inject } from \"../core/inject\";\nimport { resolveDynamicProps, resolveDynamicValue } from \"./dynamics/parse-value\";\nimport {\n computeBlockPosition,\n computeBlockSize,\n estimateComponentSize,\n getComponentId,\n getComponentProps\n} from \"./player-components-utils\";\n\nconst { object, position, graphicBounds } = defineProps({\n position: {\n default: 'top'\n }\n});\n\nconst client = inject(RpgClientEngine);\nconst warnedComponents = new Set();\n\nconst readPosition = computed(() => position?.() ?? 'top');\n\nconst componentSource = computed(() => {\n switch (readPosition()) {\n case 'bottom':\n return object.componentsBottom?.();\n case 'center':\n return object.componentsCenter?.();\n case 'left':\n return object.componentsLeft?.();\n case 'right':\n return object.componentsRight?.();\n case 'top':\n default:\n return object.componentsTop?.();\n }\n});\n\nconst componentData = computed(() => {\n const value = componentSource();\n if (!value) {\n return { components: [], layout: {} };\n }\n\n if (typeof value !== 'string') {\n return value;\n }\n\n try {\n return JSON.parse(value);\n } catch (error) {\n if (typeof process === 'undefined' \|\| process.env?.NODE_ENV !== 'production') {\n console.warn('[RPGJS] Invalid server sprite component payload', error);\n }\n return { components: [], layout: {} };\n }\n});\n\nconst layout = computed(() => componentData()?.layout ?? {});\nconst rows = computed(() => componentData()?.components ?? []);\nconst hitbox = object.hitbox;\n\nconst toNumber = (value, fallback = 0) => {\n const resolved = resolveDynamicValue(value, object);\n const num = typeof resolved === 'number' ? resolved : parseFloat(resolved);\n return Number.isFinite(num) ? num : fallback;\n};\n\nconst estimateTextWidth = (value, style = {}) => {\n const text = String(resolveDynamicValue(value ?? '', object) ?? '');\n const fontSize = toNumber(style.fontSize, 12);\n return Math.max(1, Math.ceil(text.length * fontSize * 0.6));\n};\n\nconst rowMetrics = computed(() => {\n return rows().map((row) => {\n const cells = row.map((definition) => {\n const intrinsic = estimateComponentSize(definition, { toNumber, estimateTextWidth });\n return {\n definition,\n width: intrinsic.width,\n height: intrinsic.height\n };\n });\n\n return {\n cells,\n width: cells.reduce((sum, cell) => sum + cell.width, 0),\n height: cells.reduce((max, cell) => Math.max(max, cell.height), 0)\n };\n });\n});\n\nconst gap = computed(() => ({\n row: toNumber(layout().rowGap ?? layout().gap, 0),\n column: toNumber(layout().columnGap ?? layout().gap, 0)\n}));\n\nconst fallbackBounds = computed(() => {\n const box = hitbox();\n const width = box?.w ?? 0;\n const height = box?.h ?? 0;\n\n return {\n left: 0,\n top: 0,\n right: width,\n bottom: height,\n width,\n height,\n centerX: width / 2,\n centerY: height / 2\n };\n});\n\nconst bounds = computed(() => {\n const resolvedBounds = typeof graphicBounds === 'function' ? graphicBounds() : undefined;\n return resolvedBounds ?? fallbackBounds();\n});\n\nconst blockSize = computed(() => {\n const box = hitbox() ?? { w: 0, h: 0 };\n const graphic = bounds();\n return computeBlockSize({\n position: readPosition(),\n layout: layout(),\n rowMetrics: rowMetrics(),\n gap: gap(),\n graphic,\n hitbox: box\n });\n});\n\nconst blockPosition = computed(() => {\n const box = hitbox() ?? { w: 0, h: 0 };\n const graphic = bounds();\n return computeBlockPosition({\n position: readPosition(),\n size: blockSize(),\n layout: layout(),\n graphic,\n hitbox: box\n });\n});\n\nconst warnMissingComponent = (id) => {\n if (!id \|\| warnedComponents.has(id)) return;\n if (typeof process !== 'undefined' && process.env?.NODE_ENV === 'production') return;\n warnedComponents.add(id);\n console.warn(`[RPGJS] Server sprite component \"${id}\" is not registered on the client.`);\n};\n\nconst renderedRows = computed(() => {\n return rowMetrics().map((row) => {\n const entries = [];\n\n row.cells.forEach((cell) => {\n const definition = cell.definition;\n const id = getComponentId(definition);\n const component = client.getSpriteComponent(id);\n\n if (!component) {\n warnMissingComponent(id);\n return;\n }\n\n entries.push({\n component,\n props: resolveDynamicProps(getComponentProps(definition), object),\n width: cell.width,\n height: cell.height\n });\n });\n\n return {\n height: row.height,\n entries\n };\n });\n});\n</script>\n"],"mappings":"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"}

package/dist/components/prebuilt/hp-bar.ce.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"hp-bar.ce.js","names":[],"sources":["../../../src/components/prebuilt/hp-bar.ce"],"sourcesContent":["<!-- \n HP Bar Component\n \n A beautiful, animated health bar component for displaying player HP above sprites.\n Features a gradient color based on HP level, smooth animations, and modern styling.\n \n ## Design\n \n The bar changes color dynamically based on HP percentage:\n - Green (#4ade80) when HP > 60% - Healthy state\n - Yellow (#facc15) when HP 30-60% - Caution state \n - Orange (#fb923c) when HP 15-30% - Danger state\n - Red (#ef4444) when HP < 15% - Critical state\n \n @example\n ```ts\n import HpBar from './hp-bar.ce';\n \n // In module configuration\n export default defineModule<RpgClient>({\n sprite: {\n componentsInFront: [HpBar]\n }\n })\n ```\n-->\n\n<Container x={position.x} y={position.y}>\n <!-- Background shadow for depth effect -->\n <Graphics draw={drawShadow} x={1} y={1} />\n \n <!-- Main background -->\n <Graphics draw={drawBackground} />\n \n <!-- HP fill bar -->\n <Graphics draw={drawFill} />\n \n <!-- Highlight overlay for 3D effect -->\n <Graphics draw={drawHighlight} />\n \n <!-- Border frame -->\n <Graphics draw={drawBorder} />\n</Container>\n\n<script>\nimport { computed, animatedSignal, effect } from \"canvasengine\";\n\nconst { object } = defineProps();\n\n// ====================\n// Configuration\n// ====================\n\n/** Total width of the HP bar in pixels /\nconst barWidth = 50;\n\n/* Total height of the HP bar in pixels /\nconst barHeight = 8;\n\n/* Border radius for rounded corners /\nconst borderRadius = 4;\n\n/* Inner border radius for the fill bar /\nconst innerRadius = 3;\n\n/* Padding between background and fill /\nconst padding = 1;\n\n/* Background color (dark theme) /\nconst bgColor = 0x16213e;\n\n/* Shadow color /\nconst shadowColor = 0x000000;\n\n/* Border color /\nconst borderColor = 0x4a5568;\n\n// ====================\n// Calculated dimensions\n// ====================\n\n/* Maximum fill width /\nconst maxFillWidth = barWidth - (padding 2);\n\n/** Fill height /\nconst fillHeight = barHeight - (padding 2);\n\n/** Highlight height (half of fill) /\nconst highlightHeight = Math.floor(fillHeight / 2);\n\n// ====================\n// Reactive HP values\n// ====================\n\n/* Gets hitbox dimensions for positioning /\nconst hitbox = object.hitbox;\n\n/\n Gets the current HP value from the player object\n * Uses hpSignal which is synchronized from the server\n /\nconst currentHp = computed(() => {\n return object.hpSignal?.() ?? 0;\n});\n\n/\n Gets the maximum HP value from player parameters\n * Reads from _param.maxHp which contains calculated stats\n /\nconst maxHp = computed(() => {\n const params = object._param?.() ?? {};\n return params.maxHp ?? 100;\n});\n\n/\n Calculates HP percentage (0 to 1)\n /\nconst hpPercent = computed(() => {\n const max = maxHp();\n if (max <= 0) return 0;\n const percent = currentHp() / max;\n return Math.max(0, Math.min(1, percent));\n});\n\n// ====================\n// Animated values\n// ====================\n\n/\n Animated percentage for smooth bar transitions\n /\nconst animatedPercent = animatedSignal(hpPercent(), {\n duration: 300,\n easing: 'easeOutCubic'\n});\n\n// Update animated value when HP changes\neffect(() => {\n const newPercent = hpPercent();\n animatedPercent.set(newPercent);\n});\n\n// ====================\n// Visual calculations\n// ====================\n\n/\n Position of the bar relative to the sprite\n /\nconst position = computed(() => ({\n x: (hitbox().w / 2) - (barWidth / 2),\n y: -barHeight - 8\n}));\n\n/\n Current width of the HP fill based on animated percentage\n /\nconst fillWidth = computed(() => {\n const percent = animatedPercent();\n const width = maxFillWidth percent;\n // Ensure minimum visible width when HP > 0\n if (percent > 0 && width < innerRadius * 2) {\n return innerRadius * 2;\n }\n return Math.max(0, width);\n});\n\n/*\n Determines HP bar color based on current HP percentage\n * Returns hex color number for PixiJS\n * \n * ## Color Thresholds\n * - Green (0x4ade80): HP > 60% - Healthy\n * - Yellow (0xfacc15): HP 30-60% - Caution\n * - Orange (0xfb923c): HP 15-30% - Danger\n * - Red (0xef4444): HP < 15% - Critical\n /\nconst hpColorHex = computed(() => {\n const percent = hpPercent();\n \n if (percent > 0.6) {\n return 0x4ade80; // Green - healthy\n } else if (percent > 0.3) {\n return 0xfacc15; // Yellow - caution\n } else if (percent > 0.15) {\n return 0xfb923c; // Orange - danger\n } else {\n return 0xef4444; // Red - critical\n }\n});\n\n// ====================\n// Drawing functions\n// ====================\n\n/\n Draws the shadow behind the HP bar for depth effect\n /\nconst drawShadow = (g) => {\n g.roundRect(0, 0, barWidth, barHeight, borderRadius);\n g.fill({ color: shadowColor, alpha: 0.3 });\n};\n\n/\n Draws the main background of the HP bar\n /\nconst drawBackground = (g) => {\n g.roundRect(0, 0, barWidth, barHeight, borderRadius);\n g.fill({ color: bgColor, alpha: 0.9 });\n};\n\n/\n Draws the HP fill bar with dynamic color\n /\nconst drawFill = (g) => {\n const width = fillWidth();\n if (width > 0) {\n g.roundRect(padding, padding, width, fillHeight, innerRadius);\n g.fill({ color: hpColorHex() });\n }\n};\n\n/\n Draws the highlight overlay for 3D effect\n /\nconst drawHighlight = (g) => {\n const width = fillWidth();\n if (width > 0) {\n g.roundRect(padding, padding, width, highlightHeight, innerRadius);\n g.fill({ color: 0xffffff, alpha: 0.25 });\n }\n};\n\n/\n Draws the border frame around the HP bar\n * \n * Uses PixiJS Graphics API to create a rounded rectangle stroke\n * that serves as a visual border for the bar.\n * \n * @param g - PixiJS Graphics object\n * \n * @example\n * ```html\n * <Graphics draw={drawBorder} />\n * ```\n */\nconst drawBorder = (g) => {\n g.roundRect(0, 0, barWidth, barHeight, borderRadius);\n g.stroke({ \n color: borderColor, \n width: 1,\n alpha: 0.7\n });\n};\n</script>\n"],"mappings":";;AAOC,SAAA,UAAA,SAAA;CACsB,SAAC,~~QAAY~~;CAEhC,MAAS,EAAA,WADe,eAAe,~~QACL~~,~~EAAA~~;CACtC,MAAI,WAAS;CACb,MAAI,YAAc;CAClB,MAAC,eAAA;CACD,MAAG,cAAA;CACH,MAAK,UAAA;CACL,MAAE,UAAa;CACf,MAAC,cAAA;CACD,MAAK,cAAU;CACf,MAAE,eAAe,WAAa,UAAW;CACzC,MAAI,aAAQ,YAAA,UAAA;CACZ,MAAM,kBAAkB,KAAE,MAAK,aAAA,~~EAAA~~;CAC/B,MAAI,SAAA,OAAA;CACJ,MAAG,YAAA,eAAA;EACC,OAAA,OAAA,~~YAAA~~,~~IAAA~~;~~GACF~~;;~~EAGE~~,QADU,OAAY,~~UAAG~~,~~IAAW~~,~~EAAA~~,~~EACtB~~,SAAO;~~GACvB~~;~~CACF~~,MAAC,YAAA,eAAA;EACG,MAAG,MAAK,~~OAAW~~;~~EACpB~~,IAAA,OAAS,GACX,OAAA;EACG,MAAM,UAAU,~~WAAC~~,~~GAAA~~;EAClB,OAAQ,KAAK,IAAE,GAAA,KAAU,IAAC,GAAA,~~QAAA~~,CAAA;~~GAC5B~~;CACD,MAAM,kBAAkB,eAAe,~~WAAE~~,~~EAAA~~;EACtC,UAAS;EACX,QAAA;~~EACA~~,CAAC;~~CACF~~,aAAY;EACV,MAAA,aAAS,~~WAAA~~;;~~GAEV~~;CACD,MAAM,WAAW,gBAAgB;;EAEjC,GAAO,CAAC,YAAW;;CAEnB,MAAM,YAAY,eAAI;EACnB,MAAA,UAAA,~~iBAAA~~;EACC,MAAM,QAAQ,eAAI;EAElB,IAAA,UAAc,KAAK,QAAO,cAAW,GACnC,OAAS,cAAI;EAEf,OAAM,KAAM,IAAI,GAAG,~~MAAI~~;~~GAC3B~~;;EAEI,MAAM,UAAQ,~~WAAY~~;EAC9B,IAAM,UAAY,IAAA,OAAA;OAGZ,IAAA,UAAe,IAAA,OAAA;OAGf,IAAO,UAAI,KAAA,OAAA;;~~GAMjB~~;;EAEI,EAAA,UAAY,GAAE,GAAA,UAAA,WAAA,~~aAAA~~;EAClB,EAAM,KAAA;GAAA,OAAc;GAAQ,OAAA;~~GAAA~~,CAAA;;CAE5B,MAAM,kBAAgB,MAAA;EACnB,EAAA,UAAW,GAAA,GAAA,UAAA,WAAA,~~aAAA~~;EACV,EAAE,KAAK;GAAE,OAAO;GAAE,OAAA;~~GAAA~~,CAAA;;CAEtB,MAAI,YAAa,MAAO;EACxB,MAAM,QAAY,~~WAAW~~;;~~GAErB~~,EAAC,UAAQ,SAAA,SAAA,OAAA,YAAA,~~YAAA~~;GACX,EAAA,KAAA,EAAW,OAAE,~~YAAa~~,EAAA,~~CAAO;;;CAGvC~~,MAAM,iBAAiB,MAAM;;EAEzB,IAAI,QAAQ,GAAG;GAChB,EAAA,UAAY,SAAA,SAAA,OAAA,iBAAA,~~YAAA~~;GACP,EAAE,KAAK;IAAE,OAAK;IAAA,OAAA;~~IAAA~~,CAAA~~;;;CAGtB~~,MAAM,cAAS,MAAO;;EAEpB,EAAA,OAAA;GACM,OAAI;GACJ,OAAA;GACN,OAAA;~~GACG~~,~~CAAC;;WAEJ~~,EAAA,WAAA;EAAA,GAAA,SAAA;EAAA,GAAA,SAAA;~~EAAA~~,~~EAAA~~;EAAA,EAAA,UAAA;GAAA,MAAA;GAAA,GAAA;GAAA,GAAA;~~GAAA~~,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,~~gBAAA~~,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,~~UAAA~~,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,~~eAAA~~,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,~~YAAA~~,CAAA;~~EAAA~~,CAAA,CAAA~~;;AAIC~~,IAAM,iBAEH"}
1	+ {"version":3,"file":"hp-bar.ce.js","names":[],"sources":["../../../src/components/prebuilt/hp-bar.ce"],"sourcesContent":["<!-- \n HP Bar Component\n \n A beautiful, animated health bar component for displaying player HP above sprites.\n Features a gradient color based on HP level, smooth animations, and modern styling.\n \n ## Design\n \n The bar changes color dynamically based on HP percentage:\n - Green (#4ade80) when HP > 60% - Healthy state\n - Yellow (#facc15) when HP 30-60% - Caution state \n - Orange (#fb923c) when HP 15-30% - Danger state\n - Red (#ef4444) when HP < 15% - Critical state\n \n @example\n ```ts\n import HpBar from './hp-bar.ce';\n \n // In module configuration\n export default defineModule<RpgClient>({\n sprite: {\n componentsInFront: [HpBar]\n }\n })\n ```\n-->\n\n<Container x={position.x} y={position.y}>\n <!-- Background shadow for depth effect -->\n <Graphics draw={drawShadow} x={1} y={1} />\n \n <!-- Main background -->\n <Graphics draw={drawBackground} />\n \n <!-- HP fill bar -->\n <Graphics draw={drawFill} />\n \n <!-- Highlight overlay for 3D effect -->\n <Graphics draw={drawHighlight} />\n \n <!-- Border frame -->\n <Graphics draw={drawBorder} />\n</Container>\n\n<script>\nimport { computed, animatedSignal, effect } from \"canvasengine\";\n\nconst { object } = defineProps();\n\n// ====================\n// Configuration\n// ====================\n\n/** Total width of the HP bar in pixels /\nconst barWidth = 50;\n\n/* Total height of the HP bar in pixels /\nconst barHeight = 8;\n\n/* Border radius for rounded corners /\nconst borderRadius = 4;\n\n/* Inner border radius for the fill bar /\nconst innerRadius = 3;\n\n/* Padding between background and fill /\nconst padding = 1;\n\n/* Background color (dark theme) /\nconst bgColor = 0x16213e;\n\n/* Shadow color /\nconst shadowColor = 0x000000;\n\n/* Border color /\nconst borderColor = 0x4a5568;\n\n// ====================\n// Calculated dimensions\n// ====================\n\n/* Maximum fill width /\nconst maxFillWidth = barWidth - (padding 2);\n\n/** Fill height /\nconst fillHeight = barHeight - (padding 2);\n\n/** Highlight height (half of fill) /\nconst highlightHeight = Math.floor(fillHeight / 2);\n\n// ====================\n// Reactive HP values\n// ====================\n\n/* Gets hitbox dimensions for positioning /\nconst hitbox = object.hitbox;\n\n/\n Gets the current HP value from the player object\n * Uses hpSignal which is synchronized from the server\n /\nconst currentHp = computed(() => {\n return object.hpSignal?.() ?? 0;\n});\n\n/\n Gets the maximum HP value from player parameters\n * Reads from _param.maxHp which contains calculated stats\n /\nconst maxHp = computed(() => {\n const params = object._param?.() ?? {};\n return params.maxHp ?? 100;\n});\n\n/\n Calculates HP percentage (0 to 1)\n /\nconst hpPercent = computed(() => {\n const max = maxHp();\n if (max <= 0) return 0;\n const percent = currentHp() / max;\n return Math.max(0, Math.min(1, percent));\n});\n\n// ====================\n// Animated values\n// ====================\n\n/\n Animated percentage for smooth bar transitions\n /\nconst animatedPercent = animatedSignal(hpPercent(), {\n duration: 300,\n easing: 'easeOutCubic'\n});\n\n// Update animated value when HP changes\neffect(() => {\n const newPercent = hpPercent();\n animatedPercent.set(newPercent);\n});\n\n// ====================\n// Visual calculations\n// ====================\n\n/\n Position of the bar relative to the sprite\n /\nconst position = computed(() => ({\n x: (hitbox().w / 2) - (barWidth / 2),\n y: -barHeight - 8\n}));\n\n/\n Current width of the HP fill based on animated percentage\n /\nconst fillWidth = computed(() => {\n const percent = animatedPercent();\n const width = maxFillWidth percent;\n // Ensure minimum visible width when HP > 0\n if (percent > 0 && width < innerRadius * 2) {\n return innerRadius * 2;\n }\n return Math.max(0, width);\n});\n\n/*\n Determines HP bar color based on current HP percentage\n * Returns hex color number for PixiJS\n * \n * ## Color Thresholds\n * - Green (0x4ade80): HP > 60% - Healthy\n * - Yellow (0xfacc15): HP 30-60% - Caution\n * - Orange (0xfb923c): HP 15-30% - Danger\n * - Red (0xef4444): HP < 15% - Critical\n /\nconst hpColorHex = computed(() => {\n const percent = hpPercent();\n \n if (percent > 0.6) {\n return 0x4ade80; // Green - healthy\n } else if (percent > 0.3) {\n return 0xfacc15; // Yellow - caution\n } else if (percent > 0.15) {\n return 0xfb923c; // Orange - danger\n } else {\n return 0xef4444; // Red - critical\n }\n});\n\n// ====================\n// Drawing functions\n// ====================\n\n/\n Draws the shadow behind the HP bar for depth effect\n /\nconst drawShadow = (g) => {\n g.roundRect(0, 0, barWidth, barHeight, borderRadius);\n g.fill({ color: shadowColor, alpha: 0.3 });\n};\n\n/\n Draws the main background of the HP bar\n /\nconst drawBackground = (g) => {\n g.roundRect(0, 0, barWidth, barHeight, borderRadius);\n g.fill({ color: bgColor, alpha: 0.9 });\n};\n\n/\n Draws the HP fill bar with dynamic color\n /\nconst drawFill = (g) => {\n const width = fillWidth();\n if (width > 0) {\n g.roundRect(padding, padding, width, fillHeight, innerRadius);\n g.fill({ color: hpColorHex() });\n }\n};\n\n/\n Draws the highlight overlay for 3D effect\n /\nconst drawHighlight = (g) => {\n const width = fillWidth();\n if (width > 0) {\n g.roundRect(padding, padding, width, highlightHeight, innerRadius);\n g.fill({ color: 0xffffff, alpha: 0.25 });\n }\n};\n\n/\n Draws the border frame around the HP bar\n * \n * Uses PixiJS Graphics API to create a rounded rectangle stroke\n * that serves as a visual border for the bar.\n * \n * @param g - PixiJS Graphics object\n * \n * @example\n * ```html\n * <Graphics draw={drawBorder} />\n * ```\n */\nconst drawBorder = (g) => {\n g.roundRect(0, 0, barWidth, barHeight, borderRadius);\n g.stroke({ \n color: borderColor, \n width: 1,\n alpha: 0.7\n });\n};\n</script>\n"],"mappings":";;AAOC,SAAA,UAAA,SAAA;CACsB,SAAC,OAAY;CAEhC,MAAS,EAAA,WADe,eAAe,OACN,EAAC;CACtC,MAAI,WAAS;CACb,MAAI,YAAc;CAClB,MAAC,eAAA;CACD,MAAG,cAAA;CACH,MAAK,UAAA;CACL,MAAE,UAAa;CACf,MAAC,cAAA;CACD,MAAK,cAAU;CACf,MAAE,eAAe,WAAa,UAAW;CACzC,MAAI,aAAQ,YAAA,UAAA;CACZ,MAAM,kBAAkB,KAAE,MAAK,aAAA,CAAA;CAC/B,MAAI,SAAA,OAAA;CACJ,MAAG,YAAA,eAAA;EACC,OAAA,OAAA,WAAA,KAAA;CACJ,CAAC;;EAGG,QADU,OAAY,SAAG,KAAW,CAAA,GACtB,SAAO;CACzB,CAAC;CACD,MAAC,YAAA,eAAA;EACG,MAAG,MAAK,MAAU;EACnB,IAAA,OAAS,GACX,OAAA;EACG,MAAM,UAAU,UAAC,IAAA;EAClB,OAAQ,KAAK,IAAE,GAAA,KAAU,IAAC,GAAA,OAAA,CAAA;CAC7B,CAAC;CACD,MAAM,kBAAkB,eAAe,UAAE,GAAA;EACtC,UAAS;EACX,QAAA;CACD,CAAC;CACD,aAAY;EACV,MAAA,aAAS,UAAA;;CAEX,CAAC;CACD,MAAM,WAAW,gBAAgB;;EAEjC,GAAO,CAAC,YAAW;;CAEnB,MAAM,YAAY,eAAI;EACnB,MAAA,UAAA,gBAAA;EACC,MAAM,QAAQ,eAAI;EAElB,IAAA,UAAc,KAAK,QAAO,cAAW,GACnC,OAAS,cAAI;EAEf,OAAM,KAAM,IAAI,GAAG,KAAI;CAC3B,CAAA;;EAEI,MAAM,UAAQ,UAAY;EAC9B,IAAM,UAAY,IAAA,OAAA;OAGZ,IAAA,UAAe,IAAA,OAAA;OAGf,IAAO,UAAI,KAAA,OAAA;;CAMjB,CAAA;;EAEI,EAAA,UAAY,GAAE,GAAA,UAAA,WAAA,YAAA;EAClB,EAAM,KAAA;GAAA,OAAc;GAAQ,OAAA;EAAA,CAAA;;CAE5B,MAAM,kBAAgB,MAAA;EACnB,EAAA,UAAW,GAAA,GAAA,UAAA,WAAA,YAAA;EACV,EAAE,KAAK;GAAE,OAAO;GAAE,OAAA;EAAA,CAAA;;CAEtB,MAAI,YAAa,MAAO;EACxB,MAAM,QAAY,UAAG;;GAEb,EAAC,UAAQ,SAAA,SAAA,OAAA,YAAA,WAAA;GACX,EAAA,KAAA,EAAW,OAAE,WAAa,EAAA,CAAA;;CAEhC;CACA,MAAM,iBAAiB,MAAM;;EAEzB,IAAI,QAAQ,GAAG;GAChB,EAAA,UAAY,SAAA,SAAA,OAAA,iBAAA,WAAA;GACP,EAAE,KAAK;IAAE,OAAK;IAAA,OAAA;GAAA,CAAA;;CAEtB;CACA,MAAM,cAAS,MAAO;;EAEpB,EAAA,OAAA;GACM,OAAI;GACJ,OAAA;GACN,OAAA;EACF,CAAK;CACL;WACE,EAAA,WAAA;EAAA,GAAA,SAAA;EAAA,GAAA,SAAA;CAAA,GAAA;EAAA,EAAA,UAAA;GAAA,MAAA;GAAA,GAAA;GAAA,GAAA;EAAA,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,eAAA,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,SAAA,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,cAAA,CAAA;EAAA,EAAA,UAAA,EAAA,MAAA,WAAA,CAAA;CAAA,CAAA,CAAA;AAEA;AAEC,IAAM,iBAEH"}

package/dist/components/prebuilt/light-halo.ce.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"light-halo.ce.js","names":[],"sources":["../../../src/components/prebuilt/light-halo.ce"],"sourcesContent":["<Container x={position.x} y={position.y}>\n <Graphics draw={drawHalo} />\n</Container>\n\n<script>\nimport { computed, signal, tick, mount } from \"canvasengine\";\nimport { BlurFilter } from \"pixi.js\";\n\n/*\n Component props for LightHalo\n * \n * All props are signals (even static ones) and must be read with `()`.\n * Props are optional and will use default values if not provided.\n * \n * @property {Object} object - The sprite object (required)\n * @property {number\|Signal<number>} [baseRadius] - Base radius of the light halo in pixels (default: 30)\n * @property {number\|Signal<number>} [radiusVariation] - Radius variation range (halo will pulse between baseRadius ± radiusVariation) (default: 10)\n * @property {number\|Signal<number>} [baseOpacity] - Base opacity of the light halo (0 to 1) (default: 0.6)\n * @property {number\|Signal<number>} [opacityVariation] - Opacity variation range (halo will fade between baseOpacity ± opacityVariation) (default: 0.3)\n * @property {number\|Signal<number>} [sizeSpeed] - Animation speed for size pulsing (higher = faster) (default: 0.002)\n * @property {number\|Signal<number>} [opacitySpeed] - Animation speed for opacity fading (higher = faster) (default: 0.003)\n * @property {number\|Signal<number>} [lightColor] - Color of the light halo (hex value, warm yellow-white by default: 0xffffaa)\n /\nconst { \n object, \n baseRadius,\n radiusVariation,\n baseOpacity,\n opacityVariation,\n sizeSpeed,\n opacitySpeed,\n lightColor\n} = defineProps();\n\n// ====================\n// Props with default values\n// ====================\n\nconst getBaseRadius = computed(() => baseRadius?.() ?? 30);\nconst getRadiusVariation = computed(() => radiusVariation?.() ?? 10);\nconst getBaseOpacity = computed(() => baseOpacity?.() ?? 0.6);\nconst getOpacityVariation = computed(() => opacityVariation?.() ?? 0.3);\nconst getSizeSpeed = computed(() => sizeSpeed?.() ?? 0.002);\nconst getOpacitySpeed = computed(() => opacitySpeed?.() ?? 0.003);\nconst getLightColor = computed(() => lightColor?.() ?? 0xffffaa);\n\n// ====================\n// Animation state\n// ====================\n\n/* Time counter for animations /\nconst time = signal(0);\n\n/\n Current radius of the halo with pulsing animation\n * Uses multiple sine waves for more organic movement\n /\nconst currentRadius = computed(() => {\n const t = time();\n const base = getBaseRadius();\n const variation = getRadiusVariation();\n const speed = getSizeSpeed();\n \n // Combine two sine waves for less predictable pulsing\n const pulse1 = Math.sin(t speed);\n const pulse2 = Math.sin(t * speed * 1.5) * 0.5;\n const combinedPulse = (pulse1 + pulse2) / 1.5;\n \n return base + (combinedPulse * variation);\n});\n\n/*\n Current opacity of the halo with fading animation\n * Includes a subtle flicker effect\n /\nconst currentOpacity = computed(() => {\n const t = time();\n const base = getBaseOpacity();\n const variation = getOpacityVariation();\n const speed = getOpacitySpeed();\n \n // Main breathing cycle\n const fade = Math.sin(t speed);\n \n // Subtle high-frequency flicker (candle-like)\n const flicker = (Math.random() - 0.5) * 0.1;\n \n return Math.max(0, Math.min(1, base + (fade * variation) + flicker));\n});\n\n// ====================\n// Position calculations\n// ====================\n\nconst hitbox = object.hitbox;\n\nconst position = computed(() => ({\n x: hitbox().w / 2,\n y: hitbox().h / 2\n}));\n\n// ====================\n// Drawing function\n// ====================\n\n// Create filters once to avoid recreation on every frame\nconst blurFilter = new BlurFilter({ strength: 20, quality: 3 });\n\n/*\n Draws the light halo effect with realistic diffusion\n /\nconst drawHalo = (g) => {\n const radius = currentRadius();\n const opacity = currentOpacity();\n const color = getLightColor();\n \n if (opacity <= 0 \|\| radius <= 0) return;\n\n // Set blend mode to ADD for glowing light effect\n g.blendMode = 'add';\n \n // Apply blur filter for soft light diffusion\n g.filters = [blurFilter];\n \n // Draw main light source\n // The blur filter will spread this out into a nice gradient\n g.circle(0, 0, radius);\n g.fill({ \n color: color, \n alpha: opacity \n });\n \n // Draw a smaller, brighter core\n g.circle(0, 0, radius 0.4);\n g.fill({ \n color: 0xffffff, \n alpha: opacity * 0.5 \n });\n};\n\n// ====================\n// Animation loop\n// ====================\ntick(() => {\n time.update(t => t + 1);\n});\n</script>\n\n"],"mappings":";;;AAQE,SAAA,UAAA,SAAA;CACqB,SAAA,~~QAAA~~;CAEhB,MAAM,EAAG,QAAQ,YAAO,iBAAsB,aAAa,kBAAI,WAAA,cAAA,eADpE,eAAA,~~QACoE~~,EAAA;CACtE,MAAG,gBAAmB,eAAa,~~cAAe~~,~~IAAG~~,~~GAAI~~;CACzD,MAAE,qBAAA,eAAA,~~mBAAA~~,~~IAAA~~,~~GAAA~~;CACF,MAAI,iBAAkB,eAAa,~~eAAe~~,~~IAAA~~,~~GAAQ~~;CAC1D,MAAI,sBAAwB,eAAU,~~oBAAyB~~,~~IAAI~~,~~GAAI~~;~~CACvE~~,MAAI,eAAiB,eAAe,~~aAAE~~,~~IAAe~~,~~KAAI~~;CACzD,MAAI,kBAAiB,eAAiB,~~gBAAe~~,~~IAAK~~,~~KAAO~~;~~CACjE~~,MAAI,gBAAiB,eAAgB,~~cAAC~~,~~IAAiB~~,~~SAAG~~;CAC1D,MAAI,OAAS,OAAO,~~EAAC~~;CACrB,MAAI,gBAAiB,eAAgB;EACjC,MAAA,IAAU,~~MAAM~~;~~EAClB~~,MAAA,OAAA,~~eAAA~~;EACF,MAAO,YAAA,~~oBAAA~~;EACL,MAAO,QAAA,~~cAAA~~;EAKP,OAAS,QAHM,KAAA,IAAA,IAAA,~~MAEC~~,~~GADL~~,KAAA,IAAA,IAAA,QAAA,IAAA,~~GAAA,~~MACK,MACP;~~GACT~~;~~CACF~~,MAAE,iBAAA,eAAA;EACE,MAAA,IAAA,~~MAAa~~;;EAEb,MAAM,YAAY,~~qBAAA~~;EACnB,MAAM,QAAK,~~iBAAQ~~;;EAItB,MAAM,WAAA,KAAoB,~~QAAC~~,~~GAAU~~,MAAK;EAC1C,OAAM,KAAA,IAAc,GAAG,KAAA,IAAS,GAAG,OAAG,OAAY,YAAW,~~QAAA~~,CAAA;~~GAC7D~~;CACA,MAAM,SAAA,OAAe;CACrB,MAAM,WAAA,gBAA2B;EACjC,GAAM,~~QAAA~~,~~CAAA~~,IAAc;;~~EAEnB~~,EAAE;~~CACH~~,MAAG,aAAU,IAAA,WAAA;EAAA,UAAA;EAAA,SAAA;~~EAAA~~,CAAA;CACb,MAAM,YAAY,MAAI;;EAElB,MAAK,UAAW,~~gBAAa~~;EACjC,MAAU,QAAG,~~eAAS~~;mCAEpB;EAEC,EAAA,YAAc;EAEjB,EAAM,UAAA,CAAA,~~WAAgB~~;EAGpB,EAAA,OAAM,GAAA,GAAW,~~OAAC~~;EAClB,EAAA,KAAM;GACP;GACI,OAAQ;~~GACX~~,CAAA;EAEA,EAAA,OAAM,GAAA,GAAA,SAAiB,~~GAAO~~;~~EAC/B~~,EAAA,KAAA;GACO,OAAO;GACb,OAAA,UAAA~~;;;CAGF~~,WAAW;EACR,KAAA,QAAW,MAAO,IAAA,~~EAAA~~;~~GACnB~~;~~CAEM~~,OADY,EAAE,WAAW;EAAE,GAAG,SAAA;EAAA,GAAA,SAAA;~~EAAA~~,~~EAAA~~,EAAA,UAAA,EAAA,MAAA,~~UAAA~~,CAAA,CACpB~~;;AAGhB~~,IAAM,iBAEE"}
1	+ {"version":3,"file":"light-halo.ce.js","names":[],"sources":["../../../src/components/prebuilt/light-halo.ce"],"sourcesContent":["<Container x={position.x} y={position.y}>\n <Graphics draw={drawHalo} />\n</Container>\n\n<script>\nimport { computed, signal, tick, mount } from \"canvasengine\";\nimport { BlurFilter } from \"pixi.js\";\n\n/*\n Component props for LightHalo\n * \n * All props are signals (even static ones) and must be read with `()`.\n * Props are optional and will use default values if not provided.\n * \n * @property {Object} object - The sprite object (required)\n * @property {number\|Signal<number>} [baseRadius] - Base radius of the light halo in pixels (default: 30)\n * @property {number\|Signal<number>} [radiusVariation] - Radius variation range (halo will pulse between baseRadius ± radiusVariation) (default: 10)\n * @property {number\|Signal<number>} [baseOpacity] - Base opacity of the light halo (0 to 1) (default: 0.6)\n * @property {number\|Signal<number>} [opacityVariation] - Opacity variation range (halo will fade between baseOpacity ± opacityVariation) (default: 0.3)\n * @property {number\|Signal<number>} [sizeSpeed] - Animation speed for size pulsing (higher = faster) (default: 0.002)\n * @property {number\|Signal<number>} [opacitySpeed] - Animation speed for opacity fading (higher = faster) (default: 0.003)\n * @property {number\|Signal<number>} [lightColor] - Color of the light halo (hex value, warm yellow-white by default: 0xffffaa)\n /\nconst { \n object, \n baseRadius,\n radiusVariation,\n baseOpacity,\n opacityVariation,\n sizeSpeed,\n opacitySpeed,\n lightColor\n} = defineProps();\n\n// ====================\n// Props with default values\n// ====================\n\nconst getBaseRadius = computed(() => baseRadius?.() ?? 30);\nconst getRadiusVariation = computed(() => radiusVariation?.() ?? 10);\nconst getBaseOpacity = computed(() => baseOpacity?.() ?? 0.6);\nconst getOpacityVariation = computed(() => opacityVariation?.() ?? 0.3);\nconst getSizeSpeed = computed(() => sizeSpeed?.() ?? 0.002);\nconst getOpacitySpeed = computed(() => opacitySpeed?.() ?? 0.003);\nconst getLightColor = computed(() => lightColor?.() ?? 0xffffaa);\n\n// ====================\n// Animation state\n// ====================\n\n/* Time counter for animations /\nconst time = signal(0);\n\n/\n Current radius of the halo with pulsing animation\n * Uses multiple sine waves for more organic movement\n /\nconst currentRadius = computed(() => {\n const t = time();\n const base = getBaseRadius();\n const variation = getRadiusVariation();\n const speed = getSizeSpeed();\n \n // Combine two sine waves for less predictable pulsing\n const pulse1 = Math.sin(t speed);\n const pulse2 = Math.sin(t * speed * 1.5) * 0.5;\n const combinedPulse = (pulse1 + pulse2) / 1.5;\n \n return base + (combinedPulse * variation);\n});\n\n/*\n Current opacity of the halo with fading animation\n * Includes a subtle flicker effect\n /\nconst currentOpacity = computed(() => {\n const t = time();\n const base = getBaseOpacity();\n const variation = getOpacityVariation();\n const speed = getOpacitySpeed();\n \n // Main breathing cycle\n const fade = Math.sin(t speed);\n \n // Subtle high-frequency flicker (candle-like)\n const flicker = (Math.random() - 0.5) * 0.1;\n \n return Math.max(0, Math.min(1, base + (fade * variation) + flicker));\n});\n\n// ====================\n// Position calculations\n// ====================\n\nconst hitbox = object.hitbox;\n\nconst position = computed(() => ({\n x: hitbox().w / 2,\n y: hitbox().h / 2\n}));\n\n// ====================\n// Drawing function\n// ====================\n\n// Create filters once to avoid recreation on every frame\nconst blurFilter = new BlurFilter({ strength: 20, quality: 3 });\n\n/*\n Draws the light halo effect with realistic diffusion\n /\nconst drawHalo = (g) => {\n const radius = currentRadius();\n const opacity = currentOpacity();\n const color = getLightColor();\n \n if (opacity <= 0 \|\| radius <= 0) return;\n\n // Set blend mode to ADD for glowing light effect\n g.blendMode = 'add';\n \n // Apply blur filter for soft light diffusion\n g.filters = [blurFilter];\n \n // Draw main light source\n // The blur filter will spread this out into a nice gradient\n g.circle(0, 0, radius);\n g.fill({ \n color: color, \n alpha: opacity \n });\n \n // Draw a smaller, brighter core\n g.circle(0, 0, radius 0.4);\n g.fill({ \n color: 0xffffff, \n alpha: opacity * 0.5 \n });\n};\n\n// ====================\n// Animation loop\n// ====================\ntick(() => {\n time.update(t => t + 1);\n});\n</script>\n\n"],"mappings":";;;AAQE,SAAA,UAAA,SAAA;CACqB,SAAA,OAAA;CAEhB,MAAM,EAAG,QAAQ,YAAO,iBAAsB,aAAa,kBAAI,WAAA,cAAA,eADpE,eAAA,OACoE,EAAA;CACtE,MAAG,gBAAmB,eAAa,aAAe,KAAG,EAAI;CACzD,MAAE,qBAAA,eAAA,kBAAA,KAAA,EAAA;CACF,MAAI,iBAAkB,eAAa,cAAe,KAAA,EAAQ;CAC1D,MAAI,sBAAwB,eAAU,mBAAmB,KAAU,EAAG;CACtE,MAAI,eAAiB,eAAe,YAAE,KAAe,IAAI;CACzD,MAAI,kBAAiB,eAAiB,eAAe,KAAK,IAAA;CAC1D,MAAI,gBAAiB,eAAgB,aAAC,KAAiB,QAAG;CAC1D,MAAI,OAAS,OAAO,CAAC;CACrB,MAAI,gBAAiB,eAAgB;EACjC,MAAA,IAAU,KAAA;EACZ,MAAA,OAAA,cAAA;EACF,MAAO,YAAA,mBAAA;EACL,MAAO,QAAA,aAAA;EAKP,OAAS,QAHM,KAAA,IAAA,IAAA,KAEC,IADL,KAAA,IAAA,IAAA,QAAA,GAAA,IAAA,MACK,MACP;CACX,CAAC;CACD,MAAE,iBAAA,eAAA;EACE,MAAA,IAAA,KAAa;;EAEb,MAAM,YAAY,oBAAA;EACnB,MAAM,QAAK,gBAAQ;;EAItB,MAAM,WAAA,KAAoB,OAAC,IAAU,MAAK;EAC1C,OAAM,KAAA,IAAc,GAAG,KAAA,IAAS,GAAG,OAAG,OAAY,YAAW,OAAA,CAAA;CAC7D,CAAA;CACA,MAAM,SAAA,OAAe;CACrB,MAAM,WAAA,gBAA2B;EACjC,GAAM,OAAA,EAAA,IAAc;;CAEpB,EAAE;CACF,MAAG,aAAU,IAAA,WAAA;EAAA,UAAA;EAAA,SAAA;CAAA,CAAA;CACb,MAAM,YAAY,MAAI;;EAElB,MAAK,UAAW,eAAa;EACjC,MAAU,QAAG,cAAS;mCAEpB;EAEC,EAAA,YAAc;EAEjB,EAAM,UAAA,CAAA,UAAgB;EAGpB,EAAA,OAAM,GAAA,GAAW,MAAC;EAClB,EAAA,KAAM;GACP;GACI,OAAQ;EACX,CAAA;EAEA,EAAA,OAAM,GAAA,GAAA,SAAiB,EAAM;EAC9B,EAAA,KAAA;GACO,OAAO;GACb,OAAA,UAAA;;CAEF;CACA,WAAW;EACR,KAAA,QAAW,MAAO,IAAA,CAAA;CACrB,CAAC;CAEO,OADY,EAAE,WAAW;EAAE,GAAG,SAAA;EAAA,GAAA,SAAA;CAAA,GAAA,EAAA,UAAA,EAAA,MAAA,SAAA,CAAA,CACpB;AAChB;AAEA,IAAM,iBAEE"}

package/dist/components/scenes/canvas.ce.js CHANGED Viewed

@@ -3,6 +3,7 @@ import __ce_component$1 from "./draw-map.ce.js";
 import { RpgGui } from "../../Gui/Gui.js";
 import { RpgClientEngine } from "../../RpgClientEngine.js";
 import { Canvas, Container, Viewport, computed, cond, effect, h, loop, useDefineProps, useProps } from "canvasengine";
+import { NightAmbiant, SpriteShadows } from "@canvasengine/presets";
 import { delay } from "@rpgjs/common";
 //#region src/components/scenes/canvas.ce
 function component($$props) {
@@ -11,11 +12,20 @@ function component($$props) {
 	const engine = inject(RpgClientEngine);
 	const guiService = inject(RpgGui);
 	const sceneData = engine.sceneMap.data;
+	const lighting = engine.sceneMap.lighting;
 	const guiList = computed(() => {
 		return Object.values(guiService.gui()).filter((gui) => !gui.attachToSprite);
 	});
-	const worldWidth = computed(() => sceneData()?.width);
-	const worldHeight = computed(() => sceneData()?.height);
+	const worldWidth = computed(() => {
+		const data = sceneData?.();
+		const scale = Number(data?.params?.scale ?? 1) || 1;
+		return Number(data?.width ?? data?.params?.width ?? 2048) * scale;
+	});
+	const worldHeight = computed(() => {
+		const data = sceneData?.();
+		const scale = Number(data?.params?.scale ?? 1) || 1;
+		return Number(data?.height ?? data?.params?.height ?? 2048) * scale;
+	});
 	effect(() => {
 		if (sceneData() && !sceneData().component) throw new Error("Warning ! You need to define a component for the scene. Use provideLoadMap() to define a component for the scene.");
 	});
@@ -27,15 +37,148 @@ function component($$props) {
 	const onGuiInteraction = (gui, name, data) => {
 		guiService.guiInteraction(gui.name, name, data);
 	};
+	const clamp = { direction: "all" };
+	const NIGHT_SPOT_RADIUS_SCALE = 4.25;
+	const NIGHT_SPOT_MIN_RADIUS = 170;
+	const NIGHT_SPOT_MIN_INTENSITY = 1;
+	const SHADOW_SPOT_RADIUS_SCALE = 12;
+	const SHADOW_SPOT_MIN_RADIUS = 480;
+	const SHADOW_SPOT_MIN_INTENSITY = 1.35;
+	const nightSpotRadius = (radius) => Math.max(radius * NIGHT_SPOT_RADIUS_SCALE, NIGHT_SPOT_MIN_RADIUS);
+	const shadowSpotRadius = (radius) => Math.max(radius * SHADOW_SPOT_RADIUS_SCALE, SHADOW_SPOT_MIN_RADIUS);
+	const nightSpotIntensity = (intensity, fallback) => Math.max(intensity ?? fallback, NIGHT_SPOT_MIN_INTENSITY);
+	const shadowSpotIntensity = (intensity) => Math.max(intensity ?? 1.3, SHADOW_SPOT_MIN_INTENSITY);
+	const lightingAmbient = computed(() => {
+		return (lighting?.())?.ambient ?? {};
+	});
+	const nightLights = computed(() => {
+		return ((lighting?.())?.spots ?? []).map((spot, index) => {
+			const radius = spot.radius ?? 180;
+			return {
+				x: spot.x,
+				y: spot.y,
+				radius: nightSpotRadius(radius),
+				intensity: nightSpotIntensity(spot.intensity, index === 0 ? 1 : .92),
+				flicker: spot.flicker,
+				flickerSpeed: spot.flickerSpeed ?? 14,
+				pulse: spot.pulse,
+				pulseSpeed: spot.pulseSpeed,
+				phase: spot.phase
+			};
+		});
+	});
+	const hasLightSpots = computed(() => {
+		return ((lighting?.())?.spots?.length ?? 0) > 0;
+	});
+	const lightingDarkness = computed(() => {
+		const darkness = lightingAmbient().darkness;
+		return typeof darkness === "number" ? darkness : 0;
+	});
+	const lightingAmbientEnabled = computed(() => {
+		const state = lighting?.();
+		return Boolean(state && lightingDarkness() > 0);
+	});
+	const lightingDarknessProps = computed(() => ({
+		opacity: lightingDarkness(),
+		color: lightingAmbient().darkColor ?? "#080a12"
+	}));
+	const lightingHaze = computed(() => ({
+		color: lightingAmbient().fogColor ?? "#12182a",
+		radius: lightingAmbient().fogRadius ?? .44,
+		softness: lightingAmbient().fogSoftness ?? .3,
+		opacity: lightingAmbient().fogOpacity ?? .35
+	}));
+	const defaultSunLight = () => {
+		const data = sceneData?.();
+		const width = Number(data?.width ?? data?.params?.width ?? 2048);
+		const height = Number(data?.height ?? data?.params?.height ?? 2048);
+		const scale = Number(data?.params?.scale ?? 1) || 1;
+		const mapWidth = width * scale;
+		const mapHeight = height * scale;
+		return {
+			x: -mapWidth * .35,
+			y: -mapHeight * .45,
+			z: 520,
+			radius: Math.max(mapWidth, mapHeight) * 2.5,
+			intensity: .85,
+			shadowWeight: lightingDarkness() > 0 ? 2.2 : 1,
+			enabled: true
+		};
+	};
+	const shadowState = computed(() => {
+		return (lighting?.())?.shadows ?? null;
+	});
+	const shadowLights = computed(() => {
+		const state = lighting?.();
+		const defaultSun = defaultSunLight();
+		const sun = {
+			...defaultSun,
+			...state?.sun ?? {},
+			shadowWeight: state?.sun?.shadowWeight ?? defaultSun.shadowWeight
+		};
+		const spotLights = (state?.spots ?? []).map((spot) => {
+			const radius = spot.radius ?? 180;
+			return {
+				x: spot.x,
+				y: spot.y,
+				z: 170,
+				radius: shadowSpotRadius(radius),
+				intensity: shadowSpotIntensity(spot.intensity),
+				shadowWeight: 2.4,
+				enabled: true
+			};
+		});
+		return [...sun.enabled === false || sun.intensity <= 0 ? [] : [sun], ...spotLights];
+	});
+	const shadowAmbientLight = computed(() => {
+		const shadows = shadowState();
+		if (shadows?.ambientLight === null || shadows?.ambientLight?.enabled === false) return null;
+		return shadows?.ambientLight ?? {
+			x: -.18,
+			y: -1,
+			z: 420,
+			intensity: .32,
+			shadowWeight: 1
+		};
+	});
+	const shadowEnabled = computed(() => {
+		const shadows = shadowState();
+		return Boolean((shadows?.enabled || hasLightSpots()) && (shadowLights().length > 0 || shadowAmbientLight()));
+	});
+	const shadowMode = computed(() => shadowState()?.mode ?? "strongest");
+	const shadowUpdateHz = computed(() => shadowState()?.updateHz ?? 60);
+	const shadowScanHz = computed(() => shadowState()?.scanHz ?? 8);
+	const shadowCullToViewport = computed(() => shadowState()?.cullToViewport ?? true);
+	const shadowMinInfluence = computed(() => shadowState()?.minInfluence ?? .24);
+	const shadowFalloffPower = computed(() => shadowState()?.falloffPower ?? .85);
+	const shadowColor = computed(() => shadowState()?.shadowColor ?? "#05070d");
 	return h(Canvas, {
 		width: engine.width,
 		height: engine.height
 	}, [h(Viewport, {
 		worldWidth,
 		worldHeight,
-		clamp: { direction: "all" },
+		clamp,
 		sortableChildren: true
-	}, cond(sceneData, () => h(__ce_component$1))), loop(guiList, (gui) => h(Container, { display: "flex" }, cond(gui.display, () => h(gui.component, {
+	}, [
+		cond(computed(() => lightingAmbientEnabled()), () => h(NightAmbiant, {
+			spots: nightLights,
+			darkness: lightingDarknessProps,
+			haze: lightingHaze
+		})),
+		cond(computed(() => shadowEnabled()), () => h(SpriteShadows, {
+			lights: shadowLights,
+			ambientLight: shadowAmbientLight,
+			minInfluence: shadowMinInfluence,
+			falloffPower: shadowFalloffPower,
+			mode: shadowMode,
+			updateHz: shadowUpdateHz,
+			scanHz: shadowScanHz,
+			cullToViewport: shadowCullToViewport,
+			shadowColor
+		})),
+		h(__ce_component$1)
+	]), loop(guiList, (gui) => h(Container, { display: "flex" }, cond(gui.display, () => h(gui.component, {
 		data: gui.data,
 		dependencies: gui.dependencies,
 		onFinish: (data) => {