@rpg-engine/long-bow 0.8.205 → 0.8.207

package/dist/components/Marketplace/CharacterListingModal.d.ts

@@ -4,6 +4,8 @@ export interface ICharacterListingModalProps {
     isOpen: boolean;
     onClose: () => void;
     accountCharacters: ICharacter[];
+    /** ID of the currently active/playing character — cannot be listed */
+    activeCharacterId?: string;
     /** Items atlas — for UI sprites like the DC coin */
     atlasJSON: any;
     atlasIMG: any;

package/dist/components/Marketplace/MyCharacterListingsPanel.d.ts

@@ -10,6 +10,8 @@ export interface IMyCharacterListingsPanelProps {
     /** Characters that can be listed (used for the List a Character modal) */
     accountCharacters: ICharacter[];
     onCharacterList: (characterId: string, price: number) => void;
+    /** ID of the currently active character */
+    activeCharacterId?: string;
     /** Items atlas — for UI sprites like the DC coin */
     atlasJSON: any;
     atlasIMG: any;

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

@@ -13821,6 +13821,7 @@ var CharacterListingModal = function CharacterListingModal(_ref) {
   var isOpen = _ref.isOpen,
     onClose = _ref.onClose,
     accountCharacters = _ref.accountCharacters,
+    activeCharacterId = _ref.activeCharacterId,
     atlasJSON = _ref.atlasJSON,
     atlasIMG = _ref.atlasIMG,
     characterAtlasJSON = _ref.characterAtlasJSON,
@@ -13837,11 +13838,17 @@ var CharacterListingModal = function CharacterListingModal(_ref) {
   var _useState3 = React.useState(false),
     isConfirming = _useState3[0],
     setIsConfirming = _useState3[1];
+  var stopPropagation = React.useCallback(function (e) {
+    e.stopPropagation();
+  }, []);
   if (!isOpen) return null;
   var eligibleCharacters = accountCharacters.filter(function (c) {
     return !c.isListedForSale && !c.tradedAt;
   });
-  var canList = !!selectedId && Number(price) > 0;
+  var isActiveCharacter = function isActiveCharacter(c) {
+    return !!activeCharacterId && c._id === activeCharacterId;
+  };
+  var canList = !!selectedId && Number(price) > 0 && selectedId !== activeCharacterId;
   var handleClose = function handleClose() {
     setSelectedId(null);
     setPrice('');
@@ -13860,9 +13867,6 @@ var CharacterListingModal = function CharacterListingModal(_ref) {
     enableHotkeys == null ? void 0 : enableHotkeys();
     onClose();
   };
-  var stopPropagation = React.useCallback(function (e) {
-    e.stopPropagation();
-  }, []);
   var getLevel = function getLevel(c) {
     var _c$skills;
     return ((_c$skills = c.skills) == null ? void 0 : _c$skills.level) || 1;
@@ -13886,23 +13890,27 @@ var CharacterListingModal = function CharacterListingModal(_ref) {
     type: "button"
   }, React__default.createElement(fa.FaTimes, null))), React__default.createElement(CharacterList$1, null, eligibleCharacters.length === 0 ? React__default.createElement(EmptyState$6, null, "No eligible characters to list.") : eligibleCharacters.map(function (character) {
     var isSelected = selectedId === character._id;
+    var isActive = isActiveCharacter(character);
     return React__default.createElement(CharacterRow, {
       key: character._id,
-      "$selected": isSelected,
+      "$selected": isSelected && !isActive,
+      "$disabled": isActive,
       onPointerDown: function onPointerDown() {
-        return setSelectedId(character._id);
+        return !isActive && setSelectedId(character._id);
       },
       role: "radio",
-      "aria-checked": isSelected,
-      tabIndex: 0,
+      "aria-checked": isSelected && !isActive,
+      "aria-disabled": isActive,
+      tabIndex: isActive ? -1 : 0,
       onKeyDown: function onKeyDown(e) {
-        if (e.key === 'Enter' || e.key === ' ') {
+        if (!isActive && (e.key === 'Enter' || e.key === ' ')) {
           e.preventDefault();
           setSelectedId(character._id);
         }
       }
     }, React__default.createElement(RadioCircle$1, {
-      "$selected": isSelected
+      "$selected": isSelected && !isActive,
+      "$disabled": isActive
     }), React__default.createElement(SpriteWrapper$3, null, React__default.createElement(SpriteFromAtlas, {
       atlasIMG: characterAtlasIMG,
       atlasJSON: characterAtlasJSON,
@@ -13910,7 +13918,7 @@ var CharacterListingModal = function CharacterListingModal(_ref) {
       imgScale: 2,
       height: 40,
       width: 40
-    })), React__default.createElement(CharacterInfo$1, null, React__default.createElement(CharacterName$3, null, character.name || 'Unknown'), React__default.createElement(CharacterMeta$1, null, "Level ", getLevel(character))));
+    })), React__default.createElement(CharacterInfo$1, null, React__default.createElement(CharacterName$3, null, character.name || 'Unknown'), React__default.createElement(CharacterMeta$1, null, "Level ", getLevel(character))), isActive && React__default.createElement(ActiveTag, null, "In-game"));
   })), React__default.createElement(PriceSection$1, null, React__default.createElement(PriceLabel, null, "Set Price (DC)"), React__default.createElement(PriceRow$1, null, React__default.createElement(Input, {
     onChange: function onChange(e) {
       return setPrice(e.target.value);
@@ -13972,76 +13980,94 @@ var CharacterList$1 = /*#__PURE__*/styled__default.div.withConfig({
 var CharacterRow = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__CharacterRow",
   componentId: "sc-1uxkx35-7"
-})(["display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid ", ";border-radius:6px;background:", ";cursor:pointer;transition:border-color 0.15s,background 0.15s;&:hover{border-color:", ";background:", ";}&:focus-visible{outline:2px solid rgba(245,158,11,0.6);outline-offset:2px;}"], function (_ref2) {
-  var $selected = _ref2.$selected;
-  return $selected ? '#f59e0b' : 'rgba(255,255,255,0.08)';
+})(["display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid ", ";border-radius:6px;background:", ";cursor:", ";opacity:", ";transition:border-color 0.15s,background 0.15s;&:hover{border-color:", ";background:", ";}&:focus-visible{outline:2px solid rgba(245,158,11,0.6);outline-offset:2px;}"], function (_ref2) {
+  var $selected = _ref2.$selected,
+    $disabled = _ref2.$disabled;
+  return $disabled ? 'rgba(255,255,255,0.04)' : $selected ? '#f59e0b' : 'rgba(255,255,255,0.08)';
 }, function (_ref3) {
-  var $selected = _ref3.$selected;
-  return $selected ? 'rgba(245,158,11,0.1)' : 'rgba(255,255,255,0.02)';
+  var $selected = _ref3.$selected,
+    $disabled = _ref3.$disabled;
+  return $disabled ? 'rgba(0,0,0,0.15)' : $selected ? 'rgba(245,158,11,0.1)' : 'rgba(255,255,255,0.02)';
 }, function (_ref4) {
-  var $selected = _ref4.$selected;
-  return $selected ? '#f59e0b' : 'rgba(245,158,11,0.4)';
+  var $disabled = _ref4.$disabled;
+  return $disabled ? 'not-allowed' : 'pointer';
 }, function (_ref5) {
-  var $selected = _ref5.$selected;
-  return $selected ? 'rgba(245,158,11,0.1)' : 'rgba(245,158,11,0.05)';
+  var $disabled = _ref5.$disabled;
+  return $disabled ? 0.5 : 1;
+}, function (_ref6) {
+  var $selected = _ref6.$selected,
+    $disabled = _ref6.$disabled;
+  return $disabled ? 'rgba(255,255,255,0.04)' : $selected ? '#f59e0b' : 'rgba(245,158,11,0.4)';
+}, function (_ref7) {
+  var $selected = _ref7.$selected,
+    $disabled = _ref7.$disabled;
+  return $disabled ? 'rgba(0,0,0,0.15)' : $selected ? 'rgba(245,158,11,0.1)' : 'rgba(245,158,11,0.05)';
 });
 var RadioCircle$1 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__RadioCircle",
   componentId: "sc-1uxkx35-8"
-})(["width:14px;height:14px;border-radius:50%;border:2px solid ", ";flex-shrink:0;display:flex;align-items:center;justify-content:center;&::after{content:'';width:6px;height:6px;border-radius:50%;background:#f59e0b;opacity:", ";transition:opacity 0.15s;}"], function (_ref6) {
-  var $selected = _ref6.$selected;
-  return $selected ? '#f59e0b' : 'rgba(255,255,255,0.4)';
-}, function (_ref7) {
-  var $selected = _ref7.$selected;
+})(["width:14px;height:14px;border-radius:50%;border:2px solid ", ";flex-shrink:0;display:flex;align-items:center;justify-content:center;&::after{content:'';width:6px;height:6px;border-radius:50%;background:", ";opacity:", ";transition:opacity 0.15s;}"], function (_ref8) {
+  var $selected = _ref8.$selected,
+    $disabled = _ref8.$disabled;
+  return $disabled ? 'rgba(255,255,255,0.15)' : $selected ? '#f59e0b' : 'rgba(255,255,255,0.4)';
+}, function (_ref9) {
+  var $disabled = _ref9.$disabled;
+  return $disabled ? 'rgba(255,255,255,0.15)' : '#f59e0b';
+}, function (_ref10) {
+  var $selected = _ref10.$selected;
   return $selected ? 1 : 0;
 });
+var ActiveTag = /*#__PURE__*/styled__default.span.withConfig({
+  displayName: "CharacterListingModal__ActiveTag",
+  componentId: "sc-1uxkx35-9"
+})(["font-family:'Press Start 2P',cursive !important;font-size:0.35rem !important;color:#666 !important;background:rgba(255,255,255,0.06);padding:3px 6px;border-radius:3px;white-space:nowrap;margin-left:auto;"]);
 var SpriteWrapper$3 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__SpriteWrapper",
-  componentId: "sc-1uxkx35-9"
+  componentId: "sc-1uxkx35-10"
 })(["display:flex;align-items:center;justify-content:center;image-rendering:pixelated;flex-shrink:0;width:40px;height:40px;"]);
 var CharacterInfo$1 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__CharacterInfo",
-  componentId: "sc-1uxkx35-10"
+  componentId: "sc-1uxkx35-11"
 })(["display:flex;flex-direction:column;gap:4px;flex:1;"]);
 var CharacterName$3 = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "CharacterListingModal__CharacterName",
-  componentId: "sc-1uxkx35-11"
+  componentId: "sc-1uxkx35-12"
 })(["font-family:'Press Start 2P',cursive !important;font-size:0.5rem !important;color:#f3f4f6 !important;"]);
 var CharacterMeta$1 = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "CharacterListingModal__CharacterMeta",
-  componentId: "sc-1uxkx35-12"
+  componentId: "sc-1uxkx35-13"
 })(["font-family:'Press Start 2P',cursive !important;font-size:0.4rem !important;color:#888 !important;text-transform:uppercase;letter-spacing:0.5px;"]);
 var PricePreview = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__PricePreview",
-  componentId: "sc-1uxkx35-13"
+  componentId: "sc-1uxkx35-14"
 })(["display:flex;align-items:center;gap:6px;"]);
 var DCCoinWrapper$4 = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "CharacterListingModal__DCCoinWrapper",
-  componentId: "sc-1uxkx35-14"
+  componentId: "sc-1uxkx35-15"
 })(["display:flex;align-items:center;justify-content:center;flex-shrink:0;"]);
 var PricePreviewAmount = /*#__PURE__*/styled__default.span.withConfig({
   displayName: "CharacterListingModal__PricePreviewAmount",
-  componentId: "sc-1uxkx35-15"
+  componentId: "sc-1uxkx35-16"
 })(["font-family:'Press Start 2P',cursive !important;font-size:0.55rem !important;color:#fef08a !important;"]);
 var PriceSection$1 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__PriceSection",
-  componentId: "sc-1uxkx35-16"
+  componentId: "sc-1uxkx35-17"
 })(["display:flex;flex-direction:column;gap:8px;border-top:1px solid rgba(255,255,255,0.06);padding-top:12px;"]);
 var PriceLabel = /*#__PURE__*/styled__default.p.withConfig({
   displayName: "CharacterListingModal__PriceLabel",
-  componentId: "sc-1uxkx35-17"
+  componentId: "sc-1uxkx35-18"
 })(["margin:0;font-family:'Press Start 2P',cursive !important;font-size:0.55rem !important;color:#888 !important;text-transform:uppercase;letter-spacing:0.5px;"]);
 var PriceRow$1 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__PriceRow",
-  componentId: "sc-1uxkx35-18"
+  componentId: "sc-1uxkx35-19"
 })(["display:flex;gap:8px;align-items:center;.price-input{flex:1;height:12px;}"]);
 var ListBtn = /*#__PURE__*/styled__default(CTAButton).withConfig({
   displayName: "CharacterListingModal__ListBtn",
-  componentId: "sc-1uxkx35-19"
+  componentId: "sc-1uxkx35-20"
 })(["flex-shrink:0;padding:10px 16px;height:32px;span{font-size:0.6rem;}svg{font-size:1.1rem;}"]);
 var EmptyState$6 = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "CharacterListingModal__EmptyState",
-  componentId: "sc-1uxkx35-20"
+  componentId: "sc-1uxkx35-21"
 })(["display:flex;align-items:center;justify-content:center;padding:32px 16px;font-family:'Press Start 2P',cursive !important;font-size:0.5rem !important;color:#666 !important;text-transform:uppercase;letter-spacing:1px;"]);
 
 var MyCharacterListingsPanel = function MyCharacterListingsPanel(_ref) {
@@ -14053,6 +14079,7 @@ var MyCharacterListingsPanel = function MyCharacterListingsPanel(_ref) {
     onCharacterDelist = _ref.onCharacterDelist,
     accountCharacters = _ref.accountCharacters,
     _onCharacterList = _ref.onCharacterList,
+    activeCharacterId = _ref.activeCharacterId,
     atlasJSON = _ref.atlasJSON,
     atlasIMG = _ref.atlasIMG,
     characterAtlasJSON = _ref.characterAtlasJSON,
@@ -14093,6 +14120,7 @@ var MyCharacterListingsPanel = function MyCharacterListingsPanel(_ref) {
       return setIsListingModalOpen(false);
     },
     accountCharacters: accountCharacters,
+    activeCharacterId: activeCharacterId,
     atlasJSON: atlasJSON,
     atlasIMG: atlasIMG,
     characterAtlasJSON: characterAtlasJSON,
@@ -14444,6 +14472,7 @@ var Marketplace = function Marketplace(props) {
     onCharacterDelist: onCharacterDelist != null ? onCharacterDelist : function () {},
     accountCharacters: accountCharacters != null ? accountCharacters : [],
     onCharacterList: onCharacterList != null ? onCharacterList : function () {},
+    activeCharacterId: props.characterId,
     atlasJSON: props.atlasJSON,
     atlasIMG: props.atlasIMG,
     characterAtlasJSON: characterAtlasJSON != null ? characterAtlasJSON : props.atlasJSON,