@rpg-engine/long-bow 0.8.33 → 0.8.34

package/dist/long-bow.esm.js

@@ -31879,6 +31879,12 @@ var InformationCenterNPCDetails = function InformationCenterNPCDetails(_ref) {
   var _useState2 = useState(1),
     currentLootPage = _useState2[0],
     setCurrentLootPage = _useState2[1];
+  var _useState3 = useState(null),
+    selectedItem = _useState3[0],
+    setSelectedItem = _useState3[1];
+  useEffect(function () {
+    setCurrentLootPage(1);
+  }, [lootSearchQuery]);
   var formatText = function formatText(text) {
     if (typeof text === 'number') {
       return text.toString();
@@ -31910,6 +31916,25 @@ var InformationCenterNPCDetails = function InformationCenterNPCDetails(_ref) {
   })) || [];
   var totalLootPages = Math.ceil(filteredLoots.length / ITEMS_PER_PAGE$1);
   var paginatedLoots = filteredLoots.slice((currentLootPage - 1) * ITEMS_PER_PAGE$1, currentLootPage * ITEMS_PER_PAGE$1);
+  var handleItemClick = function handleItemClick(loot) {
+    var item = {
+      key: loot.itemBlueprintKey,
+      name: formatItemName(loot.itemBlueprintKey),
+      texturePath: loot.itemBlueprintKey,
+      textureAtlas: 'items',
+      type: ItemType.Weapon,
+      subType: ItemSubType.Sword,
+      tier: 1,
+      rarity: ItemRarities.Common,
+      weight: 0,
+      maxStackSize: loot.quantityRange ? loot.quantityRange[1] : 1,
+      canSell: true,
+      description: 'A basic item.',
+      basePrice: 100,
+      allowedEquipSlotType: []
+    };
+    setSelectedItem(item);
+  };
   return React.createElement(BaseInformationDetails, {
     name: npc.name,
     spriteKey: npc.key,
@@ -31924,11 +31949,17 @@ var InformationCenterNPCDetails = function InformationCenterNPCDetails(_ref) {
     defaultOpen: !isMobile
   }, React.createElement(LootSearchContainer, null, React.createElement(StyledSearchBar$1, {
     value: lootSearchQuery,
-    onChange: setLootSearchQuery,
+    onChange: function onChange(query) {
+      setLootSearchQuery(query);
+      setCurrentLootPage(1);
+    },
     placeholder: "Search loot..."
   })), React.createElement(LootGrid, null, paginatedLoots.map(function (loot, index) {
     return React.createElement(LootItem, {
-      key: index
+      key: loot.itemBlueprintKey + "-" + index,
+      onClick: function onClick() {
+        return handleItemClick(loot);
+      }
     }, React.createElement(SpriteFromAtlas, {
       atlasJSON: itemsAtlasJSON,
       atlasIMG: itemsAtlasIMG,
@@ -31962,7 +31993,15 @@ var InformationCenterNPCDetails = function InformationCenterNPCDetails(_ref) {
       height: 24,
       imgScale: 1
     })), React.createElement(SpellContent, null, React.createElement(SpellName, null, formatText(spell.spellKey)), React.createElement(SpellDetails, null, "Power: ", React.createElement(SpellValue, null, formatText(spell.power)), React.createElement(Separator, null, "\u2022"), "Chance: ", React.createElement(SpellValue, null, spell.probability, "%"))));
-  }))));
+  }))), selectedItem && React.createElement(Portal, null, React.createElement(InformationCenterItemDetails, {
+    item: selectedItem,
+    itemsAtlasJSON: itemsAtlasJSON,
+    itemsAtlasIMG: itemsAtlasIMG,
+    droppedBy: [npc],
+    onBack: function onBack() {
+      return setSelectedItem(null);
+    }
+  })));
 };
 var InfoSection$1 = /*#__PURE__*/styled.div.withConfig({
   displayName: "InformationCenterNPCDetails__InfoSection",
@@ -32047,27 +32086,27 @@ var LootGrid = /*#__PURE__*/styled.div.withConfig({
 var LootItem = /*#__PURE__*/styled.div.withConfig({
   displayName: "InformationCenterNPCDetails__LootItem",
   componentId: "sc-fdu3xl-20"
-})(["display:flex;align-items:center;gap:4px;background:rgba(255,255,255,0.05);padding:4px;border-radius:4px;min-width:0;"]);
+})(["display:flex;align-items:center;gap:4px;background:rgba(255,255,255,0.05);padding:4px;border-radius:4px;min-width:0;cursor:pointer;user-select:none;transition:background-color 0.2s ease;&:hover{background:rgba(255,255,255,0.1);}"]);
 var LootDetails = /*#__PURE__*/styled.div.withConfig({
   displayName: "InformationCenterNPCDetails__LootDetails",
   componentId: "sc-fdu3xl-21"
-})(["flex:1;display:flex;flex-direction:column;gap:4px;"]);
+})(["flex:1;display:flex;flex-direction:column;gap:4px;user-select:none;"]);
 var LootName = /*#__PURE__*/styled.div.withConfig({
   displayName: "InformationCenterNPCDetails__LootName",
   componentId: "sc-fdu3xl-22"
-})(["color:", ";font-size:0.5rem;"], uiColors.white);
+})(["color:", ";font-size:0.5rem;user-select:none;"], uiColors.white);
 var LootInfo = /*#__PURE__*/styled.div.withConfig({
   displayName: "InformationCenterNPCDetails__LootInfo",
   componentId: "sc-fdu3xl-23"
-})(["display:flex;align-items:center;gap:8px;"]);
+})(["display:flex;align-items:center;gap:8px;user-select:none;"]);
 var LootChance = /*#__PURE__*/styled.span.withConfig({
   displayName: "InformationCenterNPCDetails__LootChance",
   componentId: "sc-fdu3xl-24"
-})(["color:", ";font-size:0.45rem;"], uiColors.yellow);
+})(["color:", ";font-size:0.45rem;user-select:none;"], uiColors.yellow);
 var LootQuantity = /*#__PURE__*/styled.span.withConfig({
   displayName: "InformationCenterNPCDetails__LootQuantity",
   componentId: "sc-fdu3xl-25"
-})(["color:", ";font-size:0.45rem;"], uiColors.lightGray);
+})(["color:", ";font-size:0.45rem;user-select:none;"], uiColors.lightGray);
 var PaginationContainer$2 = /*#__PURE__*/styled.div.withConfig({
   displayName: "InformationCenterNPCDetails__PaginationContainer",
   componentId: "sc-fdu3xl-26"