@rpg-engine/long-bow 0.8.145 → 0.8.148

package/dist/long-bow.cjs.development.js

@@ -44510,7 +44510,79 @@ var TabButton$1 = /*#__PURE__*/styled__default.button.withConfig({
   return $active ? '#ffffff' : '#888888';
 });
 
+var BlueprintTable = function BlueprintTable(_ref) {
+  var blueprints = _ref.blueprints,
+    atlasJSON = _ref.atlasJSON,
+    atlasIMG = _ref.atlasIMG,
+    onSelect = _ref.onSelect;
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement(ResultsHeader, null, React__default.createElement("span", null), React__default.createElement(ColName, null, "Name"), React__default.createElement(ColType, null, "Type"), React__default.createElement(ColTier, null, "Tier")), blueprints.map(function (blueprint) {
+    return React__default.createElement(ResultRow, {
+      key: blueprint.key,
+      "$selectable": !!onSelect,
+      onPointerDown: onSelect ? function () {
+        return onSelect(blueprint);
+      } : undefined
+    }, React__default.createElement(SpriteWrapper$1, null, React__default.createElement(SpriteFromAtlas, {
+      atlasJSON: atlasJSON,
+      atlasIMG: atlasIMG,
+      spriteKey: blueprint.texturePath || blueprint.key,
+      width: 32,
+      height: 32,
+      imgScale: 2,
+      centered: true
+    })), React__default.createElement(ColName, null, React__default.createElement(BlueprintName, null, blueprint.name), (blueprint.type || blueprint.subType) && React__default.createElement(BlueprintMeta, null, [blueprint.type, blueprint.subType].filter(Boolean).filter(function (v, i, arr) {
+      return arr.indexOf(v) === i;
+    }).join(' · '))), React__default.createElement(ColType, null, React__default.createElement(TypeText, null, blueprint.type), blueprint.subType && blueprint.subType !== blueprint.type && React__default.createElement(SubTypeText, null, blueprint.subType)), React__default.createElement(ColTier, null, "T", blueprint.tier));
+  }));
+};
+var tableRowBase = "\n  display: grid;\n  grid-template-columns: 40px 1fr 120px 50px;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 12px;\n";
+var ResultsHeader = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintTable__ResultsHeader",
+  componentId: "sc-1ysxhx2-0"
+})(["", " background:rgba(0,0,0,0.4);border-bottom:1px solid rgba(255,255,255,0.1);position:sticky;top:0;z-index:1;> *{font-size:0.45rem;color:#888;text-transform:uppercase;letter-spacing:1px;}"], tableRowBase);
+var ResultRow = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintTable__ResultRow",
+  componentId: "sc-1ysxhx2-1"
+})(["", " border-bottom:1px solid rgba(255,255,255,0.04);cursor:", ";transition:background 0.1s;&:hover{background:", ";}&:last-child{border-bottom:none;}"], tableRowBase, function (p) {
+  return p.$selectable ? 'pointer' : 'default';
+}, function (p) {
+  return p.$selectable ? 'rgba(245, 158, 11, 0.08)' : 'none';
+});
+var SpriteWrapper$1 = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintTable__SpriteWrapper",
+  componentId: "sc-1ysxhx2-2"
+})(["display:flex;align-items:center;justify-content:center;width:40px;height:32px;"]);
+var ColName = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintTable__ColName",
+  componentId: "sc-1ysxhx2-3"
+})(["display:flex;flex-direction:column;gap:2px;overflow:hidden;"]);
+var BlueprintName = /*#__PURE__*/styled__default.span.withConfig({
+  displayName: "BlueprintTable__BlueprintName",
+  componentId: "sc-1ysxhx2-4"
+})(["font-size:0.5rem;color:#ddd;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
+var BlueprintMeta = /*#__PURE__*/styled__default.span.withConfig({
+  displayName: "BlueprintTable__BlueprintMeta",
+  componentId: "sc-1ysxhx2-5"
+})(["font-size:0.4rem;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
+var ColType = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintTable__ColType",
+  componentId: "sc-1ysxhx2-6"
+})(["display:flex;flex-direction:column;gap:2px;"]);
+var TypeText = /*#__PURE__*/styled__default.span.withConfig({
+  displayName: "BlueprintTable__TypeText",
+  componentId: "sc-1ysxhx2-7"
+})(["font-size:0.45rem;color:#aaa;"]);
+var SubTypeText = /*#__PURE__*/styled__default.span.withConfig({
+  displayName: "BlueprintTable__SubTypeText",
+  componentId: "sc-1ysxhx2-8"
+})(["font-size:0.4rem;color:#666;"]);
+var ColTier = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintTable__ColTier",
+  componentId: "sc-1ysxhx2-9"
+})(["font-size:0.5rem;color:#f59e0b;text-align:center;"]);
+
 var BLUEPRINTS_PER_PAGE = 10;
+var scaleIn = /*#__PURE__*/styled.keyframes(["from{transform:scale(0.85);opacity:0;}to{transform:scale(1);opacity:1;}"]);
 var typeOptions = /*#__PURE__*/[{
   id: 1,
   value: '',
@@ -44547,7 +44619,9 @@ var BlueprintSearchModal = function BlueprintSearchModal(_ref) {
     currentPage = _ref.currentPage,
     isLoading = _ref.isLoading,
     atlasJSON = _ref.atlasJSON,
-    atlasIMG = _ref.atlasIMG;
+    atlasIMG = _ref.atlasIMG,
+    enableHotkeys = _ref.enableHotkeys,
+    disableHotkeys = _ref.disableHotkeys;
   var _useState = React.useState(''),
     searchName = _useState[0],
     setSearchName = _useState[1];
@@ -44557,24 +44631,40 @@ var BlueprintSearchModal = function BlueprintSearchModal(_ref) {
   var _useState3 = React.useState(''),
     selectedSubType = _useState3[0],
     setSelectedSubType = _useState3[1];
-  if (!isOpen) return null;
-  var triggerSearch = function triggerSearch(overrides) {
+  var searchNameRef = React.useRef(searchName);
+  var selectedTypeRef = React.useRef(selectedType);
+  var selectedSubTypeRef = React.useRef(selectedSubType);
+  searchNameRef.current = searchName;
+  selectedTypeRef.current = selectedType;
+  selectedSubTypeRef.current = selectedSubType;
+  var triggerSearch = React.useCallback(function (overrides) {
     var _overrides$name, _overrides$itemType, _overrides$itemSubTyp, _overrides$page;
     onSearch({
       npcId: '',
-      name: (_overrides$name = overrides == null ? void 0 : overrides.name) != null ? _overrides$name : searchName,
-      itemType: (_overrides$itemType = overrides == null ? void 0 : overrides.itemType) != null ? _overrides$itemType : selectedType,
-      itemSubType: (_overrides$itemSubTyp = overrides == null ? void 0 : overrides.itemSubType) != null ? _overrides$itemSubTyp : selectedSubType,
+      name: (_overrides$name = overrides == null ? void 0 : overrides.name) != null ? _overrides$name : searchNameRef.current,
+      itemType: (_overrides$itemType = overrides == null ? void 0 : overrides.itemType) != null ? _overrides$itemType : selectedTypeRef.current,
+      itemSubType: (_overrides$itemSubTyp = overrides == null ? void 0 : overrides.itemSubType) != null ? _overrides$itemSubTyp : selectedSubTypeRef.current,
       page: (_overrides$page = overrides == null ? void 0 : overrides.page) != null ? _overrides$page : 1,
       limit: BLUEPRINTS_PER_PAGE
     });
-  };
+  }, [onSearch]);
+  var debouncedNameSearch = React.useMemo(function () {
+    return lodash.debounce(function (name) {
+      return triggerSearch({
+        name: name,
+        page: 1
+      });
+    }, 300);
+  }, [triggerSearch]);
+  React.useEffect(function () {
+    return function () {
+      debouncedNameSearch.cancel();
+    };
+  }, [debouncedNameSearch]);
+  if (!isOpen) return null;
   var handleNameChange = function handleNameChange(e) {
     setSearchName(e.target.value);
-    triggerSearch({
-      name: e.target.value,
-      page: 1
-    });
+    debouncedNameSearch(e.target.value);
   };
   var handleTypeChange = function handleTypeChange(value) {
     setSelectedType(value);
@@ -44614,7 +44704,9 @@ var BlueprintSearchModal = function BlueprintSearchModal(_ref) {
   }, React__default.createElement(fa.FaTimes, null))), React__default.createElement(InputWrapper, null, React__default.createElement("p", null, "SEARCH"), React__default.createElement(StyledInput$2, {
     value: searchName,
     onChange: handleNameChange,
-    placeholder: "Search by name..."
+    placeholder: "Search by name...",
+    onFocus: disableHotkeys,
+    onBlur: enableHotkeys
   })), React__default.createElement(FiltersRow, null, React__default.createElement(StyledDropdown$2, {
     key: "type-" + selectedType,
     options: typeOptions,
@@ -44625,22 +44717,14 @@ var BlueprintSearchModal = function BlueprintSearchModal(_ref) {
     options: subTypeOptions,
     onChange: handleSubTypeChange,
     width: "100%"
-  })), React__default.createElement(ResultsWrapper, null, isLoading ? React__default.createElement(EmptyState$2, null, "Loading...") : blueprints.length === 0 ? React__default.createElement(EmptyState$2, null, "No blueprints found") : React__default.createElement(React__default.Fragment, null, React__default.createElement(ResultsHeader, null, React__default.createElement(ColName, null, "Name"), React__default.createElement(ColType, null, "Type"), React__default.createElement(ColTier, null, "Tier")), blueprints.map(function (blueprint) {
-    return React__default.createElement(ResultRow, {
-      key: blueprint.key,
-      onPointerDown: function onPointerDown() {
-        return onSelect(blueprint);
-      }
-    }, React__default.createElement(SpriteWrapper$1, null, React__default.createElement(SpriteFromAtlas, {
-      atlasJSON: atlasJSON,
-      atlasIMG: atlasIMG,
-      spriteKey: blueprint.texturePath || blueprint.key,
-      width: 32,
-      height: 32,
-      imgScale: 2,
-      centered: true
-    })), React__default.createElement(ColName, null, React__default.createElement(BlueprintName, null, blueprint.name), React__default.createElement(BlueprintKey, null, blueprint.key)), React__default.createElement(ColType, null, React__default.createElement(TypeText, null, blueprint.type), blueprint.subType && blueprint.subType !== blueprint.type && React__default.createElement(SubTypeText, null, blueprint.subType)), React__default.createElement(ColTier, null, "T", blueprint.tier));
-  }))), React__default.createElement(PagerContainer$1, null, React__default.createElement(Pager, {
+  })), React__default.createElement(ResultsWrapper, null, blueprints.length === 0 && !isLoading ? React__default.createElement(EmptyState$2, null, "No items found") : React__default.createElement(ResultsContent, {
+    "$dimmed": isLoading
+  }, React__default.createElement(BlueprintTable, {
+    blueprints: blueprints,
+    atlasJSON: atlasJSON,
+    atlasIMG: atlasIMG,
+    onSelect: onSelect
+  })), isLoading && React__default.createElement(LoadingOverlay, null, React__default.createElement(LoadingText, null, "Loading..."))), React__default.createElement(PagerContainer$1, null, React__default.createElement(Pager, {
     totalItems: totalCount,
     currentPage: currentPage,
     itemsPerPage: BLUEPRINTS_PER_PAGE,
@@ -44658,7 +44742,7 @@ var ModalContainer$2 = /*#__PURE__*/styled__default.div.withConfig({
 var ModalContent$2 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BlueprintSearchModal__ModalContent",
   componentId: "sc-i7bssq-2"
-})(["background:#1a1a2e;border:2px solid #f59e0b;border-radius:8px;padding:20px 24px;width:600px;max-width:90%;display:flex;flex-direction:column;gap:12px;pointer-events:auto;animation:scaleIn 0.15s ease-out;@keyframes scaleIn{from{transform:scale(0.85);opacity:0;}to{transform:scale(1);opacity:1;}}"]);
+})(["background:#1a1a2e;border:2px solid #f59e0b;border-radius:8px;padding:20px 24px;width:600px;max-width:90%;display:flex;flex-direction:column;gap:12px;pointer-events:auto;animation:", " 0.15s ease-out;"], scaleIn);
 var Header$8 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BlueprintSearchModal__Header",
   componentId: "sc-i7bssq-3"
@@ -44678,7 +44762,7 @@ var InputWrapper = /*#__PURE__*/styled__default.div.withConfig({
 var StyledInput$2 = /*#__PURE__*/styled__default(Input).withConfig({
   displayName: "BlueprintSearchModal__StyledInput",
   componentId: "sc-i7bssq-7"
-})(["flex:1;height:10px;"]);
+})(["flex:1;"]);
 var FiltersRow = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BlueprintSearchModal__FiltersRow",
   componentId: "sc-i7bssq-8"
@@ -44690,57 +44774,67 @@ var StyledDropdown$2 = /*#__PURE__*/styled__default(Dropdown).withConfig({
 var ResultsWrapper = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BlueprintSearchModal__ResultsWrapper",
   componentId: "sc-i7bssq-10"
-})(["overflow-y:auto;max-height:320px;background:rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.05);border-radius:4px;"]);
-var tableRowBase = "\n  display: grid;\n  grid-template-columns: 32px 1fr 120px 60px;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 12px;\n";
-var ResultsHeader = /*#__PURE__*/styled__default.div.withConfig({
-  displayName: "BlueprintSearchModal__ResultsHeader",
+})(["position:relative;overflow-y:auto;height:320px;background:rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.05);border-radius:4px;"]);
+var ResultsContent = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintSearchModal__ResultsContent",
   componentId: "sc-i7bssq-11"
-})(["", " background:rgba(0,0,0,0.4);border-bottom:1px solid rgba(255,255,255,0.1);position:sticky;top:0;z-index:1;> *{font-size:0.45rem;color:#888;text-transform:uppercase;letter-spacing:1px;}"], tableRowBase);
-var ResultRow = /*#__PURE__*/styled__default.div.withConfig({
-  displayName: "BlueprintSearchModal__ResultRow",
+})(["opacity:", ";transition:opacity 0.15s ease;"], function (p) {
+  return p.$dimmed ? 0.4 : 1;
+});
+var LoadingOverlay = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BlueprintSearchModal__LoadingOverlay",
   componentId: "sc-i7bssq-12"
-})(["", " border-bottom:1px solid rgba(255,255,255,0.04);cursor:pointer;transition:background 0.1s;&:hover{background:rgba(245,158,11,0.08);}&:last-child{border-bottom:none;}"], tableRowBase);
-var SpriteWrapper$1 = /*#__PURE__*/styled__default.div.withConfig({
-  displayName: "BlueprintSearchModal__SpriteWrapper",
+})(["position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;"]);
+var LoadingText = /*#__PURE__*/styled__default.span.withConfig({
+  displayName: "BlueprintSearchModal__LoadingText",
   componentId: "sc-i7bssq-13"
-})(["display:flex;align-items:center;justify-content:center;width:32px;height:32px;"]);
-var ColName = /*#__PURE__*/styled__default.div.withConfig({
-  displayName: "BlueprintSearchModal__ColName",
-  componentId: "sc-i7bssq-14"
-})(["display:flex;flex-direction:column;gap:2px;overflow:hidden;"]);
-var BlueprintName = /*#__PURE__*/styled__default.span.withConfig({
-  displayName: "BlueprintSearchModal__BlueprintName",
-  componentId: "sc-i7bssq-15"
-})(["font-size:0.5rem;color:#ddd;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
-var BlueprintKey = /*#__PURE__*/styled__default.span.withConfig({
-  displayName: "BlueprintSearchModal__BlueprintKey",
-  componentId: "sc-i7bssq-16"
-})(["font-size:0.4rem;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
-var ColType = /*#__PURE__*/styled__default.div.withConfig({
-  displayName: "BlueprintSearchModal__ColType",
-  componentId: "sc-i7bssq-17"
-})(["display:flex;flex-direction:column;gap:2px;"]);
-var TypeText = /*#__PURE__*/styled__default.span.withConfig({
-  displayName: "BlueprintSearchModal__TypeText",
-  componentId: "sc-i7bssq-18"
-})(["font-size:0.45rem;color:#aaa;"]);
-var SubTypeText = /*#__PURE__*/styled__default.span.withConfig({
-  displayName: "BlueprintSearchModal__SubTypeText",
-  componentId: "sc-i7bssq-19"
-})(["font-size:0.4rem;color:#666;"]);
-var ColTier = /*#__PURE__*/styled__default.div.withConfig({
-  displayName: "BlueprintSearchModal__ColTier",
-  componentId: "sc-i7bssq-20"
-})(["font-size:0.5rem;color:#f59e0b;text-align:center;"]);
+})(["font-size:0.55rem;color:#f59e0b;text-transform:uppercase;letter-spacing:1px;"]);
 var EmptyState$2 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BlueprintSearchModal__EmptyState",
-  componentId: "sc-i7bssq-21"
-})(["display:flex;align-items:center;justify-content:center;height:100px;font-size:0.55rem;color:#666;text-transform:uppercase;letter-spacing:1px;"]);
+  componentId: "sc-i7bssq-14"
+})(["display:flex;align-items:center;justify-content:center;height:100%;font-size:0.55rem;color:#666;text-transform:uppercase;letter-spacing:1px;"]);
 var PagerContainer$1 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BlueprintSearchModal__PagerContainer",
-  componentId: "sc-i7bssq-22"
+  componentId: "sc-i7bssq-15"
 })(["display:flex;justify-content:center;align-items:center;"]);
 
+var SegmentedToggle = function SegmentedToggle(_ref) {
+  var options = _ref.options,
+    activeId = _ref.activeId,
+    onChange = _ref.onChange,
+    className = _ref.className;
+  return React__default.createElement(Container$B, {
+    className: className
+  }, options.map(function (option) {
+    return React__default.createElement(OptionButton, {
+      key: option.id,
+      type: "button",
+      "$active": option.id === activeId,
+      onClick: function onClick() {
+        return onChange(option.id);
+      }
+    }, option.label);
+  }));
+};
+var Container$B = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "SegmentedToggle__Container",
+  componentId: "sc-1itx2kn-0"
+})(["display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;"]);
+var OptionButton = /*#__PURE__*/styled__default.button.withConfig({
+  displayName: "SegmentedToggle__OptionButton",
+  componentId: "sc-1itx2kn-1"
+})(["border:1px solid ", ";background:", ";color:", ";border-radius:999px;padding:8px 12px;cursor:pointer;font-size:0.56rem;text-transform:uppercase;letter-spacing:0.8px;transition:background 0.15s ease,border-color 0.15s ease,color 0.15s ease;&:hover{border-color:rgba(245,158,11,0.45);color:#fde68a;}"], function (_ref2) {
+  var $active = _ref2.$active;
+  return $active ? 'rgba(245, 158, 11, 0.75)' : 'rgba(255, 255, 255, 0.08)';
+}, function (_ref3) {
+  var $active = _ref3.$active;
+  return $active ? 'rgba(245, 158, 11, 0.16)' : 'rgba(0, 0, 0, 0.18)';
+}, function (_ref4) {
+  var $active = _ref4.$active;
+  return $active ? '#fde68a' : '#cfcfcf';
+});
+
+var scaleIn$1 = /*#__PURE__*/styled.keyframes(["from{transform:scale(0.85);opacity:0;}to{transform:scale(1);opacity:1;}"]);
 var rarityOptions = [{
   id: 1,
   value: 'Common',
@@ -44774,7 +44868,9 @@ var BuyOrderDetailsModal = function BuyOrderDetailsModal(_ref) {
     onRarityChange = _ref.onRarityChange,
     onConfirm = _ref.onConfirm,
     atlasJSON = _ref.atlasJSON,
-    atlasIMG = _ref.atlasIMG;
+    atlasIMG = _ref.atlasIMG,
+    enableHotkeys = _ref.enableHotkeys,
+    disableHotkeys = _ref.disableHotkeys;
   if (!isOpen || !blueprint) return null;
   var stopPropagation = function stopPropagation(e) {
     e.stopPropagation();
@@ -44799,14 +44895,18 @@ var BuyOrderDetailsModal = function BuyOrderDetailsModal(_ref) {
     width: 32,
     height: 32,
     imgScale: 2
-  })), React__default.createElement(ItemInfo$1, null, React__default.createElement(ItemName, null, blueprint.name), React__default.createElement(ItemKey, null, blueprint.type, " - ", blueprint.subType, " - T", blueprint.tier))), React__default.createElement(FormSection, null, React__default.createElement(FieldRow, null, React__default.createElement(Label$4, null, "Quantity"), React__default.createElement(StyledInput$3, {
+  })), React__default.createElement(ItemInfo$1, null, React__default.createElement(ItemName, null, blueprint.name), React__default.createElement(ItemMeta, null, [blueprint.type, blueprint.subType].filter(Boolean).filter(function (v, i, arr) {
+    return arr.indexOf(v) === i;
+  }).join(' · '), " \xB7 T", blueprint.tier))), React__default.createElement(FormSection, null, React__default.createElement(FieldRow, null, React__default.createElement(Label$4, null, "Quantity"), React__default.createElement(StyledInput$3, {
     value: quantity || '',
     onChange: function onChange(e) {
       return onQuantityChange(Number(e.target.value));
     },
     placeholder: "Qty",
     type: "number",
-    min: 1
+    min: 1,
+    onFocus: disableHotkeys,
+    onBlur: enableHotkeys
   })), React__default.createElement(FieldRow, null, React__default.createElement(Label$4, null, "Max Gold"), React__default.createElement(StyledInput$3, {
     value: maxPrice || '',
     onChange: function onChange(e) {
@@ -44814,7 +44914,9 @@ var BuyOrderDetailsModal = function BuyOrderDetailsModal(_ref) {
     },
     placeholder: "Max gold",
     type: "number",
-    min: 1
+    min: 1,
+    onFocus: disableHotkeys,
+    onBlur: enableHotkeys
   })), React__default.createElement(FieldRow, null, React__default.createElement(Label$4, null, "Rarity"), React__default.createElement(StyledDropdown$3, {
     key: rarity,
     options: rarityOptions,
@@ -44843,7 +44945,7 @@ var ModalContainer$3 = /*#__PURE__*/styled__default.div.withConfig({
 var ModalContent$3 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderDetailsModal__ModalContent",
   componentId: "sc-6bghe9-2"
-})(["background:#1a1a2e;border:2px solid #f59e0b;border-radius:8px;padding:20px 24px;width:400px;max-width:90%;display:flex;flex-direction:column;gap:16px;pointer-events:auto;animation:scaleIn 0.15s ease-out;@keyframes scaleIn{from{transform:scale(0.85);opacity:0;}to{transform:scale(1);opacity:1;}}"]);
+})(["background:#1a1a2e;border:2px solid #f59e0b;border-radius:8px;padding:20px 24px;width:400px;max-width:90%;display:flex;flex-direction:column;gap:16px;pointer-events:auto;animation:", " 0.15s ease-out;"], scaleIn$1);
 var Header$9 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderDetailsModal__Header",
   componentId: "sc-6bghe9-3"
@@ -44872,8 +44974,8 @@ var ItemName = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "BuyOrderDetailsModal__ItemName",
   componentId: "sc-6bghe9-9"
 })(["font-size:0.55rem;color:#ddd;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
-var ItemKey = /*#__PURE__*/styled__default.span.withConfig({
-  displayName: "BuyOrderDetailsModal__ItemKey",
+var ItemMeta = /*#__PURE__*/styled__default.span.withConfig({
+  displayName: "BuyOrderDetailsModal__ItemMeta",
   componentId: "sc-6bghe9-10"
 })(["font-size:0.4rem;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
 var FormSection = /*#__PURE__*/styled__default.div.withConfig({
@@ -44891,7 +44993,7 @@ var Label$4 = /*#__PURE__*/styled__default.label.withConfig({
 var StyledInput$3 = /*#__PURE__*/styled__default(Input).withConfig({
   displayName: "BuyOrderDetailsModal__StyledInput",
   componentId: "sc-6bghe9-14"
-})(["height:10px;width:100%;"]);
+})(["width:100%;"]);
 var StyledDropdown$3 = /*#__PURE__*/styled__default(Dropdown).withConfig({
   displayName: "BuyOrderDetailsModal__StyledDropdown",
   componentId: "sc-6bghe9-15"
@@ -44937,9 +45039,9 @@ var Pill = /*#__PURE__*/styled__default.span.withConfig({
 
 var RPGUIScrollbar = function RPGUIScrollbar(_ref) {
   var children = _ref.children;
-  return React__default.createElement(Container$B, null, children);
+  return React__default.createElement(Container$C, null, children);
 };
-var Container$B = /*#__PURE__*/styled__default.div.withConfig({
+var Container$C = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "RPGUIScrollbar__Container",
   componentId: "sc-p3msmb-0"
 })([".rpgui-content ::-webkit-scrollbar,.rpgui-content::-webkit-scrollbar{width:25px !important;}.rpgui-content ::-webkit-scrollbar-track,.rpgui-content::-webkit-scrollbar-track{background-size:25px 60px !important;}"]);
@@ -45268,18 +45370,45 @@ var BuyOrderPanel = function BuyOrderPanel(props) {
     yourBuyOrdersTotal = props.yourBuyOrdersTotal,
     yourBuyOrdersPage = props.yourBuyOrdersPage,
     onYourBuyOrdersPageChange = props.onYourBuyOrdersPageChange,
-    onCancelBuyOrder = props.onCancelBuyOrder;
+    onCancelBuyOrder = props.onCancelBuyOrder,
+    enableHotkeys = props.enableHotkeys,
+    disableHotkeys = props.disableHotkeys;
+  // Local blueprint display: cleared immediately on Place Request so the
+  // panel returns to "Select Item" without waiting for the consumer to update
+  // the prop. Cancel keeps it shown so the user can reopen the modal.
+  var _useState = React.useState(selectedBlueprint),
+    displayedBlueprint = _useState[0],
+    setDisplayedBlueprint = _useState[1];
+  var _useState2 = React.useState(!!selectedBlueprint),
+    isDetailsOpen = _useState2[0],
+    setIsDetailsOpen = _useState2[1];
+  var _useState3 = React.useState('Active'),
+    statusFilter = _useState3[0],
+    setStatusFilter = _useState3[1];
+  // Sync when consumer provides a new blueprint (e.g. after search selection)
+  React.useEffect(function () {
+    if (selectedBlueprint) {
+      setDisplayedBlueprint(selectedBlueprint);
+      setIsDetailsOpen(true);
+    }
+  }, [selectedBlueprint]);
+  // Place request: clear display + close modal, then notify consumer
   var handleConfirm = function handleConfirm() {
     onPlaceBuyOrder();
+    setDisplayedBlueprint(undefined);
+    setIsDetailsOpen(false);
     onCloseDetails == null ? void 0 : onCloseDetails();
+    enableHotkeys == null ? void 0 : enableHotkeys();
   };
+  // Cancel: just close the modal, keep blueprint displayed for reopening
   var handleCloseDetails = function handleCloseDetails() {
-    onCloseDetails == null ? void 0 : onCloseDetails();
+    setIsDetailsOpen(false);
+    enableHotkeys == null ? void 0 : enableHotkeys();
   };
-  return React__default.createElement(PanelWrapper, null, selectedBlueprint && React__default.createElement(BuyOrderDetailsModal, {
+  return React__default.createElement(PanelWrapper, null, displayedBlueprint && isDetailsOpen && React__default.createElement(BuyOrderDetailsModal, {
     isOpen: true,
     onClose: handleCloseDetails,
-    blueprint: selectedBlueprint,
+    blueprint: displayedBlueprint,
     quantity: currentQuantity,
     maxPrice: currentMaxPrice,
     rarity: selectedRarity,
@@ -45288,20 +45417,22 @@ var BuyOrderPanel = function BuyOrderPanel(props) {
     onRarityChange: onRarityChange,
     onConfirm: handleConfirm,
     atlasJSON: atlasJSON,
-    atlasIMG: atlasIMG
-  }), React__default.createElement(FormRow, null, selectedBlueprint ? React__default.createElement(SelectedBlueprintDisplay, {
+    atlasIMG: atlasIMG,
+    enableHotkeys: enableHotkeys,
+    disableHotkeys: disableHotkeys
+  }), React__default.createElement(FormRow, null, displayedBlueprint ? React__default.createElement(SelectedBlueprintDisplay, {
     onPointerDown: onOpenBlueprintSearch
   }, React__default.createElement(RarityContainer, {
     "$rarity": selectedRarity
   }, React__default.createElement(SpriteFromAtlas, {
     atlasIMG: atlasIMG,
     atlasJSON: atlasJSON,
-    spriteKey: selectedBlueprint.texturePath || selectedBlueprint.key,
+    spriteKey: displayedBlueprint.texturePath || displayedBlueprint.key,
     width: 32,
     height: 32,
     imgScale: 2,
     centered: true
-  })), React__default.createElement(ChangeTextWrapper, null, React__default.createElement(BlueprintName$1, null, selectedBlueprint.name), React__default.createElement(ChangeText, null, "change"))) : React__default.createElement(CTAButton, {
+  })), React__default.createElement(ChangeTextWrapper, null, React__default.createElement(BlueprintName$1, null, displayedBlueprint.name), React__default.createElement(ChangeText, null, "change"))) : React__default.createElement(CTAButton, {
     icon: React__default.createElement(Search.Search, {
       width: 18,
       height: 18
@@ -45309,18 +45440,41 @@ var BuyOrderPanel = function BuyOrderPanel(props) {
     label: "Select Item",
     iconColor: "#f59e0b",
     onClick: onOpenBlueprintSearch
+  })), React__default.createElement(FilterRow$1, null, React__default.createElement(SectionTitle$1, null, "Your Buy Requests"), React__default.createElement(SegmentedToggle, {
+    options: [{
+      id: 'Active',
+      label: 'Active'
+    }, {
+      id: 'Fulfilled',
+      label: 'Fulfilled'
+    }, {
+      id: 'Expired',
+      label: 'Expired'
+    }, {
+      id: 'All',
+      label: 'All'
+    }],
+    activeId: statusFilter,
+    onChange: function onChange(id) {
+      return setStatusFilter(id);
+    }
   })), React__default.createElement(ScrollArea, {
     id: "MarketContainer"
-  }, React__default.createElement(Section$1, null, React__default.createElement(SectionTitle$1, null, "Your Buy Requests"), yourBuyOrders.length === 0 ? React__default.createElement(EmptyState$3, null, "No requests yet") : yourBuyOrders.map(function (order) {
-    return React__default.createElement(BuyOrderRow, {
-      key: order._id,
-      buyOrder: order,
-      atlasJSON: atlasJSON,
-      atlasIMG: atlasIMG,
-      isOwn: true,
-      onCancel: onCancelBuyOrder
+  }, React__default.createElement(Section$1, null, function () {
+    var filtered = statusFilter === 'All' ? yourBuyOrders : yourBuyOrders.filter(function (o) {
+      return o.status === shared.MarketplaceBuyOrderStatus[statusFilter];
     });
-  }), yourBuyOrdersTotal > BUY_ORDERS_PER_PAGE && React__default.createElement(PagerRow, null, React__default.createElement(Pager, {
+    return filtered.length === 0 ? React__default.createElement(EmptyState$3, null, "No requests yet") : filtered.map(function (order) {
+      return React__default.createElement(BuyOrderRow, {
+        key: order._id,
+        buyOrder: order,
+        atlasJSON: atlasJSON,
+        atlasIMG: atlasIMG,
+        isOwn: true,
+        onCancel: onCancelBuyOrder
+      });
+    });
+  }(), yourBuyOrdersTotal > BUY_ORDERS_PER_PAGE && React__default.createElement(PagerRow, null, React__default.createElement(Pager, {
     totalItems: yourBuyOrdersTotal,
     currentPage: yourBuyOrdersPage,
     itemsPerPage: BUY_ORDERS_PER_PAGE,
@@ -45335,25 +45489,29 @@ var FormRow = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderPanel__FormRow",
   componentId: "sc-1eb11ct-1"
 })(["display:flex;gap:8px;align-items:center;background:rgba(0,0,0,0.15);border-radius:4px;border:1px solid rgba(255,255,255,0.05);padding:8px 12px;overflow:visible;"]);
+var FilterRow$1 = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "BuyOrderPanel__FilterRow",
+  componentId: "sc-1eb11ct-2"
+})(["display:flex;align-items:center;justify-content:space-between;padding:0 4px;"]);
 var ScrollArea = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderPanel__ScrollArea",
-  componentId: "sc-1eb11ct-2"
+  componentId: "sc-1eb11ct-3"
 })(["display:flex;flex-direction:column;gap:6px;overflow-y:scroll;max-height:420px;"]);
 var Section$1 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderPanel__Section",
-  componentId: "sc-1eb11ct-3"
+  componentId: "sc-1eb11ct-4"
 })(["display:flex;flex-direction:column;gap:2px;"]);
 var SectionTitle$1 = /*#__PURE__*/styled__default.p.withConfig({
   displayName: "BuyOrderPanel__SectionTitle",
-  componentId: "sc-1eb11ct-4"
+  componentId: "sc-1eb11ct-5"
 })(["margin:0 0 2px 0;font-size:0.45rem;color:#666;text-transform:uppercase;letter-spacing:1px;"]);
 var SelectedBlueprintDisplay = /*#__PURE__*/styled__default.button.withConfig({
   displayName: "BuyOrderPanel__SelectedBlueprintDisplay",
-  componentId: "sc-1eb11ct-5"
+  componentId: "sc-1eb11ct-6"
 })(["background:rgba(245,158,11,0.08);border:1px solid rgba(245,158,11,0.4);border-radius:4px;padding:6px 10px;cursor:pointer;text-align:left;display:flex;align-items:center;gap:8px;transition:background 0.1s;> div:first-child{position:relative;top:2px;left:2px;}&:hover{background:rgba(245,158,11,0.15);}"]);
 var RarityContainer = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderPanel__RarityContainer",
-  componentId: "sc-1eb11ct-6"
+  componentId: "sc-1eb11ct-7"
 })(["border-color:", ";box-shadow:", " inset,", ";width:32px;height:32px;"], function (_ref) {
   var $rarity = _ref.$rarity;
   return rarityColor({
@@ -45372,61 +45530,25 @@ var RarityContainer = /*#__PURE__*/styled__default.div.withConfig({
 });
 var ChangeTextWrapper = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderPanel__ChangeTextWrapper",
-  componentId: "sc-1eb11ct-7"
+  componentId: "sc-1eb11ct-8"
 })(["display:flex;flex-direction:column;gap:2px;min-width:0;"]);
 var BlueprintName$1 = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "BuyOrderPanel__BlueprintName",
-  componentId: "sc-1eb11ct-8"
+  componentId: "sc-1eb11ct-9"
 })(["font-size:0.5rem;color:#ddd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"]);
 var ChangeText = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "BuyOrderPanel__ChangeText",
-  componentId: "sc-1eb11ct-9"
+  componentId: "sc-1eb11ct-10"
 })(["font-size:0.4rem;color:#f59e0b;"]);
 var EmptyState$3 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderPanel__EmptyState",
-  componentId: "sc-1eb11ct-10"
+  componentId: "sc-1eb11ct-11"
 })(["display:flex;align-items:center;justify-content:center;height:45px;font-size:0.45rem;color:#555;text-transform:uppercase;letter-spacing:1px;background:rgba(0,0,0,0.15);border-radius:4px;"]);
 var PagerRow = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "BuyOrderPanel__PagerRow",
-  componentId: "sc-1eb11ct-11"
+  componentId: "sc-1eb11ct-12"
 })(["display:flex;justify-content:center;margin-top:4px;"]);
 
-var SegmentedToggle = function SegmentedToggle(_ref) {
-  var options = _ref.options,
-    activeId = _ref.activeId,
-    onChange = _ref.onChange,
-    className = _ref.className;
-  return React__default.createElement(Container$C, {
-    className: className
-  }, options.map(function (option) {
-    return React__default.createElement(OptionButton, {
-      key: option.id,
-      type: "button",
-      "$active": option.id === activeId,
-      onClick: function onClick() {
-        return onChange(option.id);
-      }
-    }, option.label);
-  }));
-};
-var Container$C = /*#__PURE__*/styled__default.div.withConfig({
-  displayName: "SegmentedToggle__Container",
-  componentId: "sc-1itx2kn-0"
-})(["display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;"]);
-var OptionButton = /*#__PURE__*/styled__default.button.withConfig({
-  displayName: "SegmentedToggle__OptionButton",
-  componentId: "sc-1itx2kn-1"
-})(["border:1px solid ", ";background:", ";color:", ";border-radius:999px;padding:8px 12px;cursor:pointer;font-size:0.56rem;text-transform:uppercase;letter-spacing:0.8px;transition:background 0.15s ease,border-color 0.15s ease,color 0.15s ease;&:hover{border-color:rgba(245,158,11,0.45);color:#fde68a;}"], function (_ref2) {
-  var $active = _ref2.$active;
-  return $active ? 'rgba(245, 158, 11, 0.75)' : 'rgba(255, 255, 255, 0.08)';
-}, function (_ref3) {
-  var $active = _ref3.$active;
-  return $active ? 'rgba(245, 158, 11, 0.16)' : 'rgba(0, 0, 0, 0.18)';
-}, function (_ref4) {
-  var $active = _ref4.$active;
-  return $active ? '#fde68a' : '#cfcfcf';
-});
-
 var MarketplaceBuyModal = function MarketplaceBuyModal(_ref) {
   var goldPrice = _ref.goldPrice,
     dcEquivalentPrice = _ref.dcEquivalentPrice,
@@ -46270,7 +46392,7 @@ var HistoryPanel = function HistoryPanel(_ref) {
   var getDCEquivalentPrice = function getDCEquivalentPrice(goldPrice) {
     return dcToGoldSwapRate > 0 ? shared.goldToDC(goldPrice) : 0;
   };
-  return React__default.createElement(PanelWrapper$1, null, React__default.createElement(FilterRow$1, null, React__default.createElement(FilterLabel$1, null, "FILTER BY TYPE"), React__default.createElement(StyledDropdown$5, {
+  return React__default.createElement(PanelWrapper$1, null, React__default.createElement(FilterRow$2, null, React__default.createElement(FilterLabel$1, null, "FILTER BY TYPE"), React__default.createElement(StyledDropdown$5, {
     key: selectedType,
     options: transactionTypeOptions,
     onChange: onTypeChange,
@@ -46278,6 +46400,7 @@ var HistoryPanel = function HistoryPanel(_ref) {
   })), React__default.createElement(ScrollArea$1, {
     id: "MarketContainer"
   }, transactions.length === 0 ? React__default.createElement(EmptyState$5, null, "No transactions yet") : transactions.map(function (tx, index) {
+    var _tx$metadata;
     return React__default.createElement(RowWrapper$1, {
       key: index,
       "$even": index % 2 === 0,
@@ -46288,7 +46411,7 @@ var HistoryPanel = function HistoryPanel(_ref) {
       fontSize: "10px"
     }, tx.itemName)) : React__default.createElement(ItemName$3, null, React__default.createElement(NoItemText, null, tx.type === shared.MarketplaceTransactionType.Withdrawal ? 'Gold Withdrawal' : '--')), React__default.createElement(MetaRow$1, null, React__default.createElement(Label$5, {
       "$bg": TRANSACTION_TYPE_COLORS$1[tx.type]
-    }, formatTransactionLabel(tx.type)), React__default.createElement(SecondaryText, null, formatDate(tx.createdAt)), tx.counterpartName && React__default.createElement(SecondaryText, null, "w/ ", tx.counterpartName)))), tx.goldAmount > 0 && React__default.createElement(PriceSection, null, tx.currency === 'dc' ?
+    }, formatTransactionLabel(tx.type)), React__default.createElement(SecondaryText, null, formatDate(tx.createdAt)), tx.counterpartName && React__default.createElement(SecondaryText, null, "w/ ", tx.counterpartName)))), tx.goldAmount > 0 && React__default.createElement(PriceSection, null, ((_tx$metadata = tx.metadata) == null ? void 0 : _tx$metadata['currency']) === 'dc' ?
     // Show DC only
     React__default.createElement(DCPriceRow$1, null, atlasIMG && atlasJSON && React__default.createElement(DCCoinWrapper$1, null, React__default.createElement(SimpleTooltip, {
       content: "Definya Coin",
@@ -46325,7 +46448,7 @@ var PanelWrapper$1 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "HistoryPanel__PanelWrapper",
   componentId: "sc-74mioa-0"
 })(["display:flex;flex-direction:column;gap:8px;padding:0 2.5%;width:100%;box-sizing:border-box;"]);
-var FilterRow$1 = /*#__PURE__*/styled__default.div.withConfig({
+var FilterRow$2 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "HistoryPanel__FilterRow",
   componentId: "sc-74mioa-1"
 })(["display:flex;align-items:center;gap:12px;background:rgba(0,0,0,0.15);border-radius:4px;border:1px solid rgba(255,255,255,0.05);padding:8px 12px;"]);
@@ -46777,6 +46900,7 @@ var Marketplace = function Marketplace(props) {
   };
   var handleBlueprintSelect = function handleBlueprintSelect(blueprint) {
     setIsBlueprintSearchOpen(false);
+    props.enableHotkeys == null ? void 0 : props.enableHotkeys();
     onBlueprintSelect == null ? void 0 : onBlueprintSelect(blueprint);
   };
   var showSharedPager = activeTab === 'sell';
@@ -46848,11 +46972,14 @@ var Marketplace = function Marketplace(props) {
     yourBuyOrdersTotal: yourBuyOrdersTotal,
     yourBuyOrdersPage: yourBuyOrdersPage,
     onYourBuyOrdersPageChange: onYourBuyOrdersPageChange != null ? onYourBuyOrdersPageChange : function () {},
-    onCancelBuyOrder: onCancelBuyOrder != null ? onCancelBuyOrder : function () {}
+    onCancelBuyOrder: onCancelBuyOrder != null ? onCancelBuyOrder : function () {},
+    enableHotkeys: props.enableHotkeys,
+    disableHotkeys: props.disableHotkeys
   }), React__default.createElement(BlueprintSearchModal, {
     isOpen: isBlueprintSearchOpen,
     onClose: function onClose() {
-      return setIsBlueprintSearchOpen(false);
+      setIsBlueprintSearchOpen(false);
+      props.enableHotkeys == null ? void 0 : props.enableHotkeys();
     },
     onSelect: handleBlueprintSelect,
     onSearch: onBlueprintSearch != null ? onBlueprintSearch : function () {},
@@ -46861,7 +46988,9 @@ var Marketplace = function Marketplace(props) {
     currentPage: blueprintSearchCurrentPage,
     isLoading: blueprintSearchIsLoading,
     atlasJSON: props.atlasJSON,
-    atlasIMG: props.atlasIMG
+    atlasIMG: props.atlasIMG,
+    enableHotkeys: props.enableHotkeys,
+    disableHotkeys: props.disableHotkeys
   })), activeTab === 'history' && React__default.createElement(HistoryPanel, {
     transactions: historyTransactions,
     totalCount: historyTotalCount,