@rpg-engine/long-bow 0.7.81 → 0.7.83
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/hooks/useTouchTarget.d.ts +5 -0
- package/dist/long-bow.cjs.development.js +38 -9
- package/dist/long-bow.cjs.development.js.map +1 -1
- package/dist/long-bow.cjs.production.min.js +1 -1
- package/dist/long-bow.cjs.production.min.js.map +1 -1
- package/dist/long-bow.esm.js +39 -10
- package/dist/long-bow.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Item/Inventory/ItemSlot.tsx +9 -1
- package/src/components/Marketplace/MarketplaceRows.tsx +16 -0
- package/src/hooks/useTouchTarget.ts +38 -0
package/dist/long-bow.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useState, useEffect, Component, useRef, useContext, createContext,
|
|
1
|
+
import React, { useState, useEffect, Component, useRef, useCallback, useContext, createContext, useMemo, Fragment } from 'react';
|
|
2
2
|
import styled, { css, keyframes } from 'styled-components';
|
|
3
3
|
import { BeatLoader } from 'react-spinners';
|
|
4
4
|
import { v4 } from 'uuid';
|
|
@@ -27371,6 +27371,23 @@ var Container$8 = /*#__PURE__*/styled.div.withConfig({
|
|
|
27371
27371
|
componentId: "sc-dgmp04-0"
|
|
27372
27372
|
})(["position:static !important;"]);
|
|
27373
27373
|
|
|
27374
|
+
function useTouchTarget() {
|
|
27375
|
+
var getTouchTarget = useCallback(function (e) {
|
|
27376
|
+
// Check if it's a touch event
|
|
27377
|
+
if ('changedTouches' in e || 'touches' in e) {
|
|
27378
|
+
var _touchEvent$changedTo, _touchEvent$touches;
|
|
27379
|
+
var touchEvent = e;
|
|
27380
|
+
var touch = ((_touchEvent$changedTo = touchEvent.changedTouches) == null ? void 0 : _touchEvent$changedTo[0]) || ((_touchEvent$touches = touchEvent.touches) == null ? void 0 : _touchEvent$touches[0]);
|
|
27381
|
+
if (touch) {
|
|
27382
|
+
return document.elementFromPoint(touch.clientX, touch.clientY);
|
|
27383
|
+
}
|
|
27384
|
+
}
|
|
27385
|
+
// If it's not a touch event or touch is not available, fallback to target
|
|
27386
|
+
return e.target || document.body;
|
|
27387
|
+
}, []);
|
|
27388
|
+
return getTouchTarget;
|
|
27389
|
+
}
|
|
27390
|
+
|
|
27374
27391
|
var rarityColor = function rarityColor(item) {
|
|
27375
27392
|
switch (item == null ? void 0 : item.rarity) {
|
|
27376
27393
|
case ItemRarities.Uncommon:
|
|
@@ -27814,6 +27831,7 @@ var ItemSlot = /*#__PURE__*/observer(function (_ref) {
|
|
|
27814
27831
|
detailsState = _useItemSlotDetails.detailsState,
|
|
27815
27832
|
updateDetailsState = _useItemSlotDetails.updateDetailsState,
|
|
27816
27833
|
setContextActions = _useItemSlotDetails.setContextActions;
|
|
27834
|
+
var getTouchTarget = useTouchTarget();
|
|
27817
27835
|
var isContextMenuVisible = detailsState.isContextMenuVisible,
|
|
27818
27836
|
clearDetailsState = detailsState.clearDetailsState,
|
|
27819
27837
|
clearContextActions = detailsState.clearContextActions;
|
|
@@ -27870,6 +27888,9 @@ var ItemSlot = /*#__PURE__*/observer(function (_ref) {
|
|
|
27870
27888
|
item: null
|
|
27871
27889
|
});
|
|
27872
27890
|
var target = e.target;
|
|
27891
|
+
if (isMobile()) {
|
|
27892
|
+
target = getTouchTarget(e);
|
|
27893
|
+
}
|
|
27873
27894
|
handleShortcutSetter(target);
|
|
27874
27895
|
removeDraggingClass(target);
|
|
27875
27896
|
var shouldHandleDraggedItemResult = shouldHandleDraggedItem();
|
|
@@ -31115,13 +31136,16 @@ var MarketplaceRows = function MarketplaceRows(_ref) {
|
|
|
31115
31136
|
onMarketPlaceItemBuy = _ref.onMarketPlaceItemBuy,
|
|
31116
31137
|
onMarketPlaceItemRemove = _ref.onMarketPlaceItemRemove,
|
|
31117
31138
|
disabled = _ref.disabled;
|
|
31139
|
+
var renderGems = function renderGems(item) {
|
|
31140
|
+
return item.attachedGems && onRenderGems(item);
|
|
31141
|
+
};
|
|
31118
31142
|
return React.createElement(MarketplaceWrapper, null, React.createElement(ItemIconContainer, null, React.createElement(SpriteContainer$1, null, React.createElement(ItemInfoWrapper, {
|
|
31119
31143
|
item: item,
|
|
31120
31144
|
atlasIMG: atlasIMG,
|
|
31121
31145
|
atlasJSON: atlasJSON,
|
|
31122
31146
|
equipmentSet: equipmentSet,
|
|
31123
31147
|
scale: scale
|
|
31124
|
-
}, React.createElement(RarityContainer, {
|
|
31148
|
+
}, React.createElement(GemContainer, null, renderGems(item)), React.createElement(RarityContainer, {
|
|
31125
31149
|
item: item
|
|
31126
31150
|
}, React.createElement(SpriteFromAtlas, {
|
|
31127
31151
|
atlasIMG: atlasIMG,
|
|
@@ -31132,7 +31156,8 @@ var MarketplaceRows = function MarketplaceRows(_ref) {
|
|
|
31132
31156
|
texturePath: item.texturePath,
|
|
31133
31157
|
isStackable: item.isStackable
|
|
31134
31158
|
}, atlasJSON),
|
|
31135
|
-
imgScale: 2
|
|
31159
|
+
imgScale: 2,
|
|
31160
|
+
imgClassname: "sprite-from-atlas-img--item"
|
|
31136
31161
|
})), React.createElement(QuantityContainer, null, item.stackQty && item.stackQty > 1 && "x" + Math.round(item.stackQty * 10) / 10))), React.createElement(PriceValue, null, React.createElement("p", null, React.createElement(Ellipsis, {
|
|
31137
31162
|
maxLines: 1,
|
|
31138
31163
|
maxWidth: "200px",
|
|
@@ -31164,33 +31189,37 @@ var QuantityContainer = /*#__PURE__*/styled.p.withConfig({
|
|
|
31164
31189
|
displayName: "MarketplaceRows__QuantityContainer",
|
|
31165
31190
|
componentId: "sc-wmpr1o-1"
|
|
31166
31191
|
})(["position:absolute;display:block;top:15px;left:25px;font-size:", " !important;"], uiFonts.size.xsmall);
|
|
31192
|
+
var GemContainer = /*#__PURE__*/styled.p.withConfig({
|
|
31193
|
+
displayName: "MarketplaceRows__GemContainer",
|
|
31194
|
+
componentId: "sc-wmpr1o-2"
|
|
31195
|
+
})(["position:absolute;display:block;top:-5px;left:-10px;font-size:", " !important;"], uiFonts.size.xsmall);
|
|
31167
31196
|
var Flex$1 = /*#__PURE__*/styled.div.withConfig({
|
|
31168
31197
|
displayName: "MarketplaceRows__Flex",
|
|
31169
|
-
componentId: "sc-wmpr1o-
|
|
31198
|
+
componentId: "sc-wmpr1o-3"
|
|
31170
31199
|
})(["display:flex;gap:24px;"]);
|
|
31171
31200
|
var ItemIconContainer = /*#__PURE__*/styled.div.withConfig({
|
|
31172
31201
|
displayName: "MarketplaceRows__ItemIconContainer",
|
|
31173
|
-
componentId: "sc-wmpr1o-
|
|
31202
|
+
componentId: "sc-wmpr1o-4"
|
|
31174
31203
|
})(["display:flex;justify-content:flex-start;align-items:center;"]);
|
|
31175
31204
|
var GoldContainer = /*#__PURE__*/styled.div.withConfig({
|
|
31176
31205
|
displayName: "MarketplaceRows__GoldContainer",
|
|
31177
|
-
componentId: "sc-wmpr1o-
|
|
31206
|
+
componentId: "sc-wmpr1o-5"
|
|
31178
31207
|
})(["position:relative;top:-0.5rem;left:0.5rem;"]);
|
|
31179
31208
|
var SpriteContainer$1 = /*#__PURE__*/styled.div.withConfig({
|
|
31180
31209
|
displayName: "MarketplaceRows__SpriteContainer",
|
|
31181
|
-
componentId: "sc-wmpr1o-
|
|
31210
|
+
componentId: "sc-wmpr1o-6"
|
|
31182
31211
|
})(["position:relative;left:0.5rem;"]);
|
|
31183
31212
|
var PriceValue = /*#__PURE__*/styled.div.withConfig({
|
|
31184
31213
|
displayName: "MarketplaceRows__PriceValue",
|
|
31185
|
-
componentId: "sc-wmpr1o-
|
|
31214
|
+
componentId: "sc-wmpr1o-7"
|
|
31186
31215
|
})(["margin-left:40px;"]);
|
|
31187
31216
|
var ButtonContainer$2 = /*#__PURE__*/styled.div.withConfig({
|
|
31188
31217
|
displayName: "MarketplaceRows__ButtonContainer",
|
|
31189
|
-
componentId: "sc-wmpr1o-
|
|
31218
|
+
componentId: "sc-wmpr1o-8"
|
|
31190
31219
|
})(["margin:auto;"]);
|
|
31191
31220
|
var RarityContainer = /*#__PURE__*/styled.div.withConfig({
|
|
31192
31221
|
displayName: "MarketplaceRows__RarityContainer",
|
|
31193
|
-
componentId: "sc-wmpr1o-
|
|
31222
|
+
componentId: "sc-wmpr1o-9"
|
|
31194
31223
|
})(["border-color:", ";box-shadow:", " inset,", ";width:32px;height:32px;"], function (_ref2) {
|
|
31195
31224
|
var item = _ref2.item;
|
|
31196
31225
|
return rarityColor(item);
|