@rpg-engine/long-bow 0.1.76 → 0.1.79

package/dist/long-bow.esm.js

@@ -11,7 +11,7 @@ import { observer } from 'mobx-react';
 import { makeAutoObservable, toJS } from 'mobx';
 
 function _extends() {
-  _extends = Object.assign || function (target) {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
 
@@ -24,7 +24,6 @@ function _extends() {
 
     return target;
   };
-
   return _extends.apply(this, arguments);
 }
 
@@ -5975,6 +5974,10 @@ var initialHoverState = {
   posY: 0,
   item: null
 };
+var initialPosition = {
+  x: 0,
+  y: 0
+};
 
 var UIStore = /*#__PURE__*/function () {
   function UIStore() {
@@ -5982,6 +5985,7 @@ var UIStore = /*#__PURE__*/function () {
 
     this.contextMenu = initialState;
     this.onHoverDetail = initialHoverState;
+    this.draggablePosition = initialPosition;
 
     this.handleOnItemClick = function (item, posX, posY, slotContainerType) {
       var _this$contextMenu;
@@ -6096,6 +6100,10 @@ var UIStore = /*#__PURE__*/function () {
     this.clearContextMenu();
   };
 
+  _proto.setDraggablePosition = function setDraggablePosition(currentPosition) {
+    this.draggablePosition = _extends({}, currentPosition);
+  };
+
   return UIStore;
 }();
 
@@ -6126,9 +6134,9 @@ var EquipmentSet = /*#__PURE__*/observer(function (_ref) {
   var equipmentData = [neck, leftHand, ring, head, armor, legs, boot, inventory, rightHand, accessory];
   var equipmentMaskSlots = [ItemSlotType.Neck, ItemSlotType.LeftHand, ItemSlotType.Ring, ItemSlotType.Head, ItemSlotType.Torso, ItemSlotType.Legs, ItemSlotType.Feet, ItemSlotType.Inventory, ItemSlotType.RightHand, ItemSlotType.Accessory]; // we use this draggable position to offset the menu position, after the container is dragged (otherwise, it bugs!)
 
-  var _useState = useState(initialPosition),
-      draggablePosition = _useState[0],
-      setDraggablePosition = _useState[1];
+  uiStore.setDraggablePosition(initialPosition); // const [draggablePosition, setDraggablePosition] = useState<IPosition>(
+  //   initialPosition
+  // );
 
   var handleOnMouseHover = function handleOnMouseHover(event, slotIndex, item, x, y) {
     uiStore.handleOnMouseHover(event, slotIndex, item, x, y, onMouseOver);
@@ -6176,7 +6184,8 @@ var EquipmentSet = /*#__PURE__*/observer(function (_ref) {
     onPositionChange: function onPositionChange(_ref3) {
       var x = _ref3.x,
           y = _ref3.y;
-      setDraggablePosition({
+      // setDraggablePosition({ x, y });
+      uiStore.setDraggablePosition({
         x: x,
         y: y
       });
@@ -6188,14 +6197,14 @@ var EquipmentSet = /*#__PURE__*/observer(function (_ref) {
   }, React.createElement(EquipmentSetContainer, {
     className: "equipment-container-body"
   }, React.createElement(EquipmentColumn, null, onRenderEquipmentSlotRange(0, 3)), React.createElement(EquipmentColumn, null, onRenderEquipmentSlotRange(3, 7)), React.createElement(EquipmentColumn, null, onRenderEquipmentSlotRange(7, 10))), (_uiStore$contextMenu = uiStore.contextMenu) != null && _uiStore$contextMenu.visible ? React.createElement(ListMenu, {
-    x: uiStore.contextMenu.posX - draggablePosition.x,
-    y: uiStore.contextMenu.posY - draggablePosition.y,
+    x: uiStore.contextMenu.posX - uiStore.draggablePosition.x,
+    y: uiStore.contextMenu.posY - uiStore.draggablePosition.y,
     options: uiStore.contextMenu.contextActions,
     onSelected: onSelected
   }) : null, (_uiStore$onHoverDetai = uiStore.onHoverDetail) != null && _uiStore$onHoverDetai.visible ? React.createElement(ItemCard, {
     item: uiStore.onHoverDetail.item,
-    x: uiStore.onHoverDetail.posX - draggablePosition.x,
-    y: uiStore.onHoverDetail.posY - draggablePosition.y
+    x: uiStore.onHoverDetail.posX - uiStore.draggablePosition.x,
+    y: uiStore.onHoverDetail.posY - uiStore.draggablePosition.y
   }) : null);
 });
 var EquipmentSetContainer = /*#__PURE__*/styled.div.withConfig({
@@ -7300,6 +7309,150 @@ var ProgressTitle = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-5vuroc-8"
 })(["width:100%;display:flex;flex-direction:row;justify-content:space-between;span{font-size:0.6rem;}margin-top:10px;"]);
 
+var SkillsContainer = function SkillsContainer(_ref) {
+  var _skill$first, _skill$first2, _skill$first3, _skill$club, _skill$club2, _skill$club3, _skill$sword, _skill$sword2, _skill$sword3, _skill$axe, _skill$axe2, _skill$axe3, _skill$distance, _skill$distance2, _skill$distance3, _skill$shielding, _skill$shielding2, _skill$shielding3, _skill$fishing, _skill$fishing2, _skill$fishing3, _skill$mining, _skill$mining2, _skill$mining3, _skill$lumberjacking, _skill$lumberjacking2, _skill$lumberjacking3, _skill$cooking, _skill$cooking2, _skill$cooking3, _skill$alchemy, _skill$alchemy2, _skill$alchemy3, _skill$stamina, _skill$stamina2, _skill$stamina3, _skill$magic, _skill$magic2, _skill$magic3, _skill$magicResistanc, _skill$magicResistanc2, _skill$magicResistanc3, _skill$strength, _skill$strength2, _skill$strength3, _skill$resistance, _skill$resistance2, _skill$resistance3, _skill$dexterity, _skill$dexterity2, _skill$dexterity3;
+
+  var onCloseButton = _ref.onCloseButton,
+      skill = _ref.skill;
+  return React.createElement(SkillsDraggableContainer, {
+    title: "Skills",
+    onCloseButton: onCloseButton
+  }, React.createElement(SkillSplitDiv, null, React.createElement("p", null, "Combat Skills"), React.createElement("hr", {
+    className: "golden"
+  })), React.createElement(SkillProgressBar, {
+    skillName: 'First',
+    bgColor: colors.cardinal,
+    level: (skill == null ? void 0 : (_skill$first = skill.first) == null ? void 0 : _skill$first.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$first2 = skill.first) == null ? void 0 : _skill$first2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$first3 = skill.first) == null ? void 0 : _skill$first3.skillPointsToNextLevel) || 0,
+    texturePath: 'gloves/leather-gloves.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Club',
+    bgColor: colors.cardinal,
+    level: (skill == null ? void 0 : (_skill$club = skill.club) == null ? void 0 : _skill$club.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$club2 = skill.club) == null ? void 0 : _skill$club2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$club3 = skill.club) == null ? void 0 : _skill$club3.skillPointsToNextLevel) || 0,
+    texturePath: 'maces/club.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Sword',
+    bgColor: colors.cardinal,
+    level: (skill == null ? void 0 : (_skill$sword = skill.sword) == null ? void 0 : _skill$sword.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$sword2 = skill.sword) == null ? void 0 : _skill$sword2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$sword3 = skill.sword) == null ? void 0 : _skill$sword3.skillPointsToNextLevel) || 0,
+    texturePath: 'swords/double-edged-sword.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Axe',
+    bgColor: colors.cardinal,
+    level: (skill == null ? void 0 : (_skill$axe = skill.axe) == null ? void 0 : _skill$axe.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$axe2 = skill.axe) == null ? void 0 : _skill$axe2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$axe3 = skill.axe) == null ? void 0 : _skill$axe3.skillPointsToNextLevel) || 0,
+    texturePath: 'axes/double-axe.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Distance',
+    bgColor: colors.cardinal,
+    level: (skill == null ? void 0 : (_skill$distance = skill.distance) == null ? void 0 : _skill$distance.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$distance2 = skill.distance) == null ? void 0 : _skill$distance2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$distance3 = skill.distance) == null ? void 0 : _skill$distance3.skillPointsToNextLevel) || 0,
+    texturePath: 'bows/horse-bow.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Shielding',
+    bgColor: colors.cardinal,
+    level: (skill == null ? void 0 : (_skill$shielding = skill.shielding) == null ? void 0 : _skill$shielding.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$shielding2 = skill.shielding) == null ? void 0 : _skill$shielding2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$shielding3 = skill.shielding) == null ? void 0 : _skill$shielding3.skillPointsToNextLevel) || 0,
+    texturePath: 'shields/studded-shield.png'
+  }), React.createElement(SkillSplitDiv, null, React.createElement("p", null, "Crafting Skills"), React.createElement("hr", {
+    className: "golden"
+  })), React.createElement(SkillProgressBar, {
+    skillName: 'Fishing',
+    bgColor: colors.blue,
+    level: (skill == null ? void 0 : (_skill$fishing = skill.fishing) == null ? void 0 : _skill$fishing.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$fishing2 = skill.fishing) == null ? void 0 : _skill$fishing2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$fishing3 = skill.fishing) == null ? void 0 : _skill$fishing3.skillPointsToNextLevel) || 0,
+    texturePath: 'foods/fish.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Mining',
+    bgColor: colors.blue,
+    level: (skill == null ? void 0 : (_skill$mining = skill.mining) == null ? void 0 : _skill$mining.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$mining2 = skill.mining) == null ? void 0 : _skill$mining2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$mining3 = skill.mining) == null ? void 0 : _skill$mining3.skillPointsToNextLevel) || 0,
+    texturePath: 'crafting-resources/iron-ingot.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Lumberjacking',
+    bgColor: colors.blue,
+    level: (skill == null ? void 0 : (_skill$lumberjacking = skill.lumberjacking) == null ? void 0 : _skill$lumberjacking.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$lumberjacking2 = skill.lumberjacking) == null ? void 0 : _skill$lumberjacking2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$lumberjacking3 = skill.lumberjacking) == null ? void 0 : _skill$lumberjacking3.skillPointsToNextLevel) || 0,
+    texturePath: 'crafting-resources/greater-wood-log.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Cooking',
+    bgColor: colors.blue,
+    level: (skill == null ? void 0 : (_skill$cooking = skill.cooking) == null ? void 0 : _skill$cooking.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$cooking2 = skill.cooking) == null ? void 0 : _skill$cooking2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$cooking3 = skill.cooking) == null ? void 0 : _skill$cooking3.skillPointsToNextLevel) || 0,
+    texturePath: 'foods/chickens-meat.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Alchemy',
+    bgColor: colors.blue,
+    level: (skill == null ? void 0 : (_skill$alchemy = skill.alchemy) == null ? void 0 : _skill$alchemy.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$alchemy2 = skill.alchemy) == null ? void 0 : _skill$alchemy2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$alchemy3 = skill.alchemy) == null ? void 0 : _skill$alchemy3.skillPointsToNextLevel) || 0,
+    texturePath: 'potions/greater-mana-potion.png'
+  }), React.createElement(SkillSplitDiv, null, React.createElement("p", null, "Basic Attributes"), React.createElement("hr", {
+    className: "golden"
+  })), React.createElement(SkillProgressBar, {
+    skillName: 'Stamina',
+    bgColor: colors.darkYellow,
+    level: (skill == null ? void 0 : (_skill$stamina = skill.stamina) == null ? void 0 : _skill$stamina.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$stamina2 = skill.stamina) == null ? void 0 : _skill$stamina2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$stamina3 = skill.stamina) == null ? void 0 : _skill$stamina3.skillPointsToNextLevel) || 0,
+    texturePath: 'spell-icons/regenerate.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Magic',
+    bgColor: colors.purple,
+    level: (skill == null ? void 0 : (_skill$magic = skill.magic) == null ? void 0 : _skill$magic.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$magic2 = skill.magic) == null ? void 0 : _skill$magic2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$magic3 = skill.magic) == null ? void 0 : _skill$magic3.skillPointsToNextLevel) || 0,
+    texturePath: 'spell-icons/fireball.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Magic Resistance',
+    bgColor: colors.navyBlue,
+    level: (skill == null ? void 0 : (_skill$magicResistanc = skill.magicResistance) == null ? void 0 : _skill$magicResistanc.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$magicResistanc2 = skill.magicResistance) == null ? void 0 : _skill$magicResistanc2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$magicResistanc3 = skill.magicResistance) == null ? void 0 : _skill$magicResistanc3.skillPointsToNextLevel) || 0,
+    texturePath: 'spell-icons/freeze.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Strength',
+    bgColor: colors.cardinal,
+    level: (skill == null ? void 0 : (_skill$strength = skill.strength) == null ? void 0 : _skill$strength.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$strength2 = skill.strength) == null ? void 0 : _skill$strength2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$strength3 = skill.strength) == null ? void 0 : _skill$strength3.skillPointsToNextLevel) || 0,
+    texturePath: 'spell-icons/enchanted-blow.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Resistance',
+    bgColor: colors.raisinBlack,
+    level: (skill == null ? void 0 : (_skill$resistance = skill.resistance) == null ? void 0 : _skill$resistance.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$resistance2 = skill.resistance) == null ? void 0 : _skill$resistance2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$resistance3 = skill.resistance) == null ? void 0 : _skill$resistance3.skillPointsToNextLevel) || 0,
+    texturePath: 'spell-icons/magic-shield.png'
+  }), React.createElement(SkillProgressBar, {
+    skillName: 'Dexterity',
+    bgColor: colors.blue,
+    level: (skill == null ? void 0 : (_skill$dexterity = skill.dexterity) == null ? void 0 : _skill$dexterity.level) || 0,
+    skillPoints: (skill == null ? void 0 : (_skill$dexterity2 = skill.dexterity) == null ? void 0 : _skill$dexterity2.skillPoints) || 0,
+    skillPointsToNextLevel: (skill == null ? void 0 : (_skill$dexterity3 = skill.dexterity) == null ? void 0 : _skill$dexterity3.skillPointsToNextLevel) || 0,
+    texturePath: 'spell-icons/haste.png'
+  }));
+};
+var SkillsDraggableContainer = /*#__PURE__*/styled(DraggableContainer).withConfig({
+  displayName: "SkillsContainer__SkillsDraggableContainer",
+  componentId: "sc-1g0c67q-0"
+})(["border:1px solid black;width:400px;height:800px;overflow-y:scroll;.DraggableContainer__TitleContainer-sc-184mpyl-2{width:auto;height:auto;}"]);
+var SkillSplitDiv = /*#__PURE__*/styled.div.withConfig({
+  displayName: "SkillsContainer__SkillSplitDiv",
+  componentId: "sc-1g0c67q-1"
+})(["width:100%;font-size:11px;margin-top:10px;hr{margin:0px;padding:0px;}p{margin-bottom:0px;}"]);
+
 var TextArea = function TextArea(_ref) {
   var props = _extends({}, _ref);
 
@@ -7322,5 +7475,5 @@ var Container$d = /*#__PURE__*/styled.div.withConfig({
   return props.maxLines;
 });
 
-export { Button, ButtonTypes, Chat, CheckButton, DraggableContainer, Dropdown, DynamicText, EquipmentSet, Input, InputRadio, ItemContainer, ItemSlot, ListMenu, NPCDialog, NPCDialogType, ProgressBar, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, SkillProgressBar, SlotContainerType, SpriteFromAtlas, SpriteIcon, TextArea, Truncate, _RPGUI, useEventListener };
+export { Button, ButtonTypes, Chat, CheckButton, DraggableContainer, Dropdown, DynamicText, EquipmentSet, Input, InputRadio, ItemContainer, ItemSlot, ListMenu, NPCDialog, NPCDialogType, ProgressBar, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, SkillProgressBar, SkillsContainer, SlotContainerType, SpriteFromAtlas, SpriteIcon, TextArea, Truncate, _RPGUI, useEventListener };
 //# sourceMappingURL=long-bow.esm.js.map