@rpg-engine/long-bow 0.3.38 → 0.3.39
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/long-bow.cjs.development.js +41 -12
- 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 +41 -12
- package/dist/long-bow.esm.js.map +1 -1
- package/package.json +2 -2
- package/src/components/TradingMenu/TradingItemRow.tsx +35 -5
- package/src/components/TradingMenu/TradingMenu.tsx +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rpg-engine/long-bow",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.39",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"typings": "dist/index.d.ts",
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
},
|
|
84
84
|
"dependencies": {
|
|
85
85
|
"@rollup/plugin-image": "^2.1.1",
|
|
86
|
-
"@rpg-engine/shared": "^0.6.
|
|
86
|
+
"@rpg-engine/shared": "^0.6.74",
|
|
87
87
|
"dayjs": "^1.11.2",
|
|
88
88
|
"font-awesome": "^4.7.0",
|
|
89
89
|
"fs-extra": "^10.1.0",
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { getItemTextureKeyPath, ITradeResponseItem } from '@rpg-engine/shared';
|
|
2
2
|
import capitalize from 'lodash/capitalize';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import styled from 'styled-components';
|
|
@@ -37,6 +37,18 @@ export const TradingItemRow: React.FC<ITradeComponentProps> = ({
|
|
|
37
37
|
onQuantityChange(traderItem, newQuantity);
|
|
38
38
|
}
|
|
39
39
|
};
|
|
40
|
+
const onLeftOutClick = () => {
|
|
41
|
+
if (selectedQty >= 10) {
|
|
42
|
+
const newQuantity = selectedQty - 10;
|
|
43
|
+
onQuantityChange(traderItem, newQuantity);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
const onRightOutClick = () => {
|
|
47
|
+
if (selectedQty < (traderItem.qty ?? 999)) {
|
|
48
|
+
const newQuantity = selectedQty + 10;
|
|
49
|
+
onQuantityChange(traderItem, newQuantity);
|
|
50
|
+
}
|
|
51
|
+
};
|
|
40
52
|
|
|
41
53
|
return (
|
|
42
54
|
<ItemWrapper>
|
|
@@ -70,29 +82,47 @@ export const TradingItemRow: React.FC<ITradeComponentProps> = ({
|
|
|
70
82
|
|
|
71
83
|
<QuantityContainer>
|
|
72
84
|
<SelectArrow
|
|
85
|
+
size={32}
|
|
86
|
+
className="arrow-selector"
|
|
87
|
+
direction="left"
|
|
88
|
+
onClick={onLeftOutClick}
|
|
89
|
+
onTouchStart={onLeftOutClick}
|
|
90
|
+
/>
|
|
91
|
+
<StyledArrow
|
|
73
92
|
size={32}
|
|
74
93
|
className="arrow-selector"
|
|
75
94
|
direction="left"
|
|
76
95
|
onClick={onLeftClick}
|
|
77
96
|
onTouchStart={onLeftClick}
|
|
78
|
-
|
|
97
|
+
/>
|
|
79
98
|
<QuantityDisplay>
|
|
80
99
|
<TextOverlay>
|
|
81
100
|
<Item>{selectedQty}</Item>
|
|
82
101
|
</TextOverlay>
|
|
83
102
|
</QuantityDisplay>
|
|
84
|
-
<
|
|
103
|
+
<StyledArrow
|
|
85
104
|
size={32}
|
|
86
105
|
className="arrow-selector"
|
|
87
106
|
direction="right"
|
|
88
107
|
onClick={onRightClick}
|
|
89
108
|
onTouchStart={onRightClick}
|
|
90
|
-
|
|
109
|
+
/>
|
|
110
|
+
<SelectArrow
|
|
111
|
+
size={32}
|
|
112
|
+
className="arrow-selector"
|
|
113
|
+
direction="right"
|
|
114
|
+
onClick={onRightOutClick}
|
|
115
|
+
onTouchStart={onRightOutClick}
|
|
116
|
+
/>
|
|
91
117
|
</QuantityContainer>
|
|
92
118
|
</ItemWrapper>
|
|
93
119
|
);
|
|
94
120
|
};
|
|
95
121
|
|
|
122
|
+
const StyledArrow = styled(SelectArrow)`
|
|
123
|
+
margin: 40px;
|
|
124
|
+
`;
|
|
125
|
+
|
|
96
126
|
const ItemWrapper = styled.div`
|
|
97
127
|
width: 100%;
|
|
98
128
|
margin: auto;
|
|
@@ -159,7 +189,7 @@ const QuantityContainer = styled.div<IContainerProps>`
|
|
|
159
189
|
justify-content: center;
|
|
160
190
|
align-items: center;
|
|
161
191
|
|
|
162
|
-
flex:
|
|
192
|
+
flex: 40%;
|
|
163
193
|
`;
|
|
164
194
|
|
|
165
195
|
const QuantityDisplay = styled.div`
|