@rpg-engine/long-bow 0.5.16 → 0.5.18

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

@@ -12715,7 +12715,8 @@ var SearchCharacter = function SearchCharacter(_ref) {
     onFocus: onFocus,
     onBlur: onBlur,
     onPointerDown: onFocus,
-    autoFocus: true
+    autoFocus: true,
+    placeholder: "Type a character name..."
   })), React__default.createElement(Column, {
     justifyContent: "flex-end"
   }, React__default.createElement(SearchButton, {
@@ -13684,6 +13685,12 @@ var ItemSlot = /*#__PURE__*/mobxReactLite.observer(function (_ref) {
     dropPosition = _useState8[0],
     setDropPosition = _useState8[1];
   var dragContainer = React.useRef(null);
+  React.useEffect(function () {
+    // This fixes an issue where if you drag an item inside of a scrollable container (overflow), its cut out
+    if (dragContainer.current) {
+      dragContainer.current.style.position = 'fixed';
+    }
+  }, []);
   var _useState9 = React.useState([]),
     contextActions = _useState9[0],
     setContextActions = _useState9[1];
@@ -13987,7 +13994,7 @@ var rarityColor = function rarityColor(item) {
 var Container$a = /*#__PURE__*/styled.div.withConfig({
   displayName: "ItemSlot__Container",
   componentId: "sc-l2j5ef-0"
-})(["margin:0.1rem;.sprite-from-atlas-img--item{position:relative;top:1.5rem;left:1.5rem;border-color:", ";box-shadow:", " inset,", ";}position:relative;&::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;border-radius:12px;pointer-events:none;animation:", ";@keyframes bg-color-change{0%{background-color:rgba(255 255 255 / 0.5);}50%{background-color:transparent;}100%{background-color:rgba(255 255 255 / 0.5);}}}"], function (_ref2) {
+})(["margin:0.1rem;.react-draggable-dragging{opacity:0.5;}.sprite-from-atlas-img--item{position:relative;top:1.5rem;left:1.5rem;border-color:", ";box-shadow:", " inset,", ";}position:relative;&::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;border-radius:12px;pointer-events:none;animation:", ";@keyframes bg-color-change{0%{background-color:rgba(255 255 255 / 0.5);}50%{background-color:transparent;}100%{background-color:rgba(255 255 255 / 0.5);}}}"], function (_ref2) {
   var item = _ref2.item;
   return rarityColor(item);
 }, function (_ref3) {
@@ -14003,7 +14010,7 @@ var Container$a = /*#__PURE__*/styled.div.withConfig({
 var ItemContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "ItemSlot__ItemContainer",
   componentId: "sc-l2j5ef-1"
-})(["width:100%;height:100%;position:relative;", ""], function (props) {
+})(["width:64px;height:64px;", ""], function (props) {
   return props.isFocused && 'z-index: 100; pointer-events: none;';
 });
 var ItemQtyContainer = /*#__PURE__*/styled.div.withConfig({
@@ -15443,7 +15450,7 @@ var SlotsContainer = function SlotsContainer(_ref) {
         onClose();
       }
     },
-    width: "400px",
+    width: "450px",
     cancelDrag: ".item-container-body, #shortcuts_list",
     onPositionChange: function onPositionChange(_ref2) {
       var x = _ref2.x,
@@ -15852,7 +15859,7 @@ var ItemContainer$1 = function ItemContainer(_ref) {
 var ItemsContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "ItemContainer__ItemsContainer",
   componentId: "sc-15y5p9l-0"
-})(["display:flex;justify-content:center;flex-wrap:wrap;max-height:270px;overflow-y:auto;"]);
+})(["display:flex;justify-content:center;flex-wrap:wrap;max-height:270px;overflow-y:auto;overflow-x:hidden;width:450px;"]);
 var QuantitySelectorContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "ItemContainer__QuantitySelectorContainer",
   componentId: "sc-15y5p9l-1"