@rpg-engine/long-bow 0.8.199 → 0.8.202
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/components/NPCDialog/NPCDialog.d.ts +1 -0
- package/dist/components/NPCDialog/NPCDialogText.d.ts +2 -1
- package/dist/long-bow.cjs.development.js +45 -22
- 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 +45 -22
- package/dist/long-bow.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Marketplace/BuyPanel.tsx +4 -3
- package/src/components/Marketplace/__test__/BuyPanel.spec.tsx +45 -3
- package/src/components/NPCDialog/NPCDialog.tsx +3 -0
- package/src/components/NPCDialog/NPCDialogText.tsx +43 -15
- package/src/components/NPCDialog/__test__/NPCDialogText.spec.tsx +68 -0
- package/src/components/Store/Store.tsx +4 -3
- package/src/components/Store/__test__/Store.spec.tsx +191 -0
- package/src/stories/Features/store/Store.stories.tsx +62 -0
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { NPCDialogType } from '
|
|
2
|
+
import type { NPCDialogType } from './NPCDialog';
|
|
3
3
|
interface IProps {
|
|
4
4
|
text: string;
|
|
5
5
|
onClose: () => void;
|
|
6
6
|
onEndStep?: () => void;
|
|
7
7
|
onStartStep?: () => void;
|
|
8
8
|
type?: NPCDialogType;
|
|
9
|
+
isTranslated?: boolean;
|
|
9
10
|
}
|
|
10
11
|
export declare const NPCDialogText: React.FC<IProps>;
|
|
11
12
|
export {};
|
|
@@ -40972,7 +40972,9 @@ var NPCDialogText = function NPCDialogText(_ref) {
|
|
|
40972
40972
|
onClose = _ref.onClose,
|
|
40973
40973
|
onEndStep = _ref.onEndStep,
|
|
40974
40974
|
onStartStep = _ref.onStartStep,
|
|
40975
|
-
type = _ref.type
|
|
40975
|
+
type = _ref.type,
|
|
40976
|
+
_ref$isTranslated = _ref.isTranslated,
|
|
40977
|
+
isTranslated = _ref$isTranslated === void 0 ? false : _ref$isTranslated;
|
|
40976
40978
|
var windowSize = React.useRef([window.innerWidth, window.innerHeight]);
|
|
40977
40979
|
function maxCharacters(width) {
|
|
40978
40980
|
// Set the font size to 16 pixels
|
|
@@ -40990,6 +40992,9 @@ var NPCDialogText = function NPCDialogText(_ref) {
|
|
|
40990
40992
|
var _useState = React.useState(0),
|
|
40991
40993
|
chunkIndex = _useState[0],
|
|
40992
40994
|
setChunkIndex = _useState[1];
|
|
40995
|
+
React.useEffect(function () {
|
|
40996
|
+
setChunkIndex(0);
|
|
40997
|
+
}, [text]);
|
|
40993
40998
|
var onHandleSpacePress = function onHandleSpacePress(event) {
|
|
40994
40999
|
if (event.code === 'Space') {
|
|
40995
41000
|
goToNextStep();
|
|
@@ -41015,7 +41020,14 @@ var NPCDialogText = function NPCDialogText(_ref) {
|
|
|
41015
41020
|
var _useState2 = React.useState(false),
|
|
41016
41021
|
showGoNextIndicator = _useState2[0],
|
|
41017
41022
|
setShowGoNextIndicator = _useState2[1];
|
|
41018
|
-
|
|
41023
|
+
React.useEffect(function () {
|
|
41024
|
+
setShowGoNextIndicator(isTranslated);
|
|
41025
|
+
if (isTranslated) {
|
|
41026
|
+
onStartStep && onStartStep();
|
|
41027
|
+
onEndStep && onEndStep();
|
|
41028
|
+
}
|
|
41029
|
+
}, [chunkIndex, isTranslated, onEndStep, onStartStep, text]);
|
|
41030
|
+
return React__default.createElement(Container$o, null, isTranslated ? React__default.createElement(TextContainer$1, null, (textChunks == null ? void 0 : textChunks[chunkIndex]) || '') : React__default.createElement(DynamicText, {
|
|
41019
41031
|
text: (textChunks == null ? void 0 : textChunks[chunkIndex]) || '',
|
|
41020
41032
|
onFinish: function onFinish() {
|
|
41021
41033
|
setShowGoNextIndicator(true);
|
|
@@ -41026,7 +41038,7 @@ var NPCDialogText = function NPCDialogText(_ref) {
|
|
|
41026
41038
|
onStartStep && onStartStep();
|
|
41027
41039
|
}
|
|
41028
41040
|
}), showGoNextIndicator && React__default.createElement(PressSpaceIndicator, {
|
|
41029
|
-
right: type ===
|
|
41041
|
+
right: type === 'TextOnly' ? '1rem' : '10.5rem',
|
|
41030
41042
|
src: IS_MOBILE_OR_TABLET ? img$5 : img$6,
|
|
41031
41043
|
onPointerDown: function onPointerDown() {
|
|
41032
41044
|
goToNextStep();
|
|
@@ -41037,9 +41049,13 @@ var Container$o = /*#__PURE__*/styled__default.div.withConfig({
|
|
|
41037
41049
|
displayName: "NPCDialogText__Container",
|
|
41038
41050
|
componentId: "sc-1cxkdh9-0"
|
|
41039
41051
|
})([""]);
|
|
41052
|
+
var TextContainer$1 = /*#__PURE__*/styled__default.p.withConfig({
|
|
41053
|
+
displayName: "NPCDialogText__TextContainer",
|
|
41054
|
+
componentId: "sc-1cxkdh9-1"
|
|
41055
|
+
})(["font-size:0.7rem !important;color:white;text-shadow:1px 1px 0px #000000;letter-spacing:1.2px;word-break:normal;"]);
|
|
41040
41056
|
var PressSpaceIndicator = /*#__PURE__*/styled__default.img.withConfig({
|
|
41041
41057
|
displayName: "NPCDialogText__PressSpaceIndicator",
|
|
41042
|
-
componentId: "sc-1cxkdh9-
|
|
41058
|
+
componentId: "sc-1cxkdh9-2"
|
|
41043
41059
|
})(["position:absolute;right:", ";bottom:1rem;height:20.7px;image-rendering:-webkit-optimize-contrast;"], function (_ref2) {
|
|
41044
41060
|
var right = _ref2.right;
|
|
41045
41061
|
return right;
|
|
@@ -41235,6 +41251,8 @@ var NPCDialog = function NPCDialog(_ref) {
|
|
|
41235
41251
|
type = _ref.type,
|
|
41236
41252
|
_onClose = _ref.onClose,
|
|
41237
41253
|
imagePath = _ref.imagePath,
|
|
41254
|
+
_ref$isTranslated = _ref.isTranslated,
|
|
41255
|
+
isTranslated = _ref$isTranslated === void 0 ? false : _ref$isTranslated,
|
|
41238
41256
|
_ref$isQuestionDialog = _ref.isQuestionDialog,
|
|
41239
41257
|
isQuestionDialog = _ref$isQuestionDialog === void 0 ? false : _ref$isQuestionDialog,
|
|
41240
41258
|
questions = _ref.questions,
|
|
@@ -41243,7 +41261,7 @@ var NPCDialog = function NPCDialog(_ref) {
|
|
|
41243
41261
|
type: exports.RPGUIContainerTypes.FramedGold,
|
|
41244
41262
|
width: isQuestionDialog ? '600px' : '80%',
|
|
41245
41263
|
height: '180px'
|
|
41246
|
-
}, isQuestionDialog && questions && answers ? React__default.createElement(React__default.Fragment, null, React__default.createElement(TextContainer$
|
|
41264
|
+
}, isQuestionDialog && questions && answers ? React__default.createElement(React__default.Fragment, null, React__default.createElement(TextContainer$2, {
|
|
41247
41265
|
flex: type === exports.NPCDialogType.TextAndThumbnail ? '70%' : '100%'
|
|
41248
41266
|
}, React__default.createElement(QuestionDialog, {
|
|
41249
41267
|
questions: questions,
|
|
@@ -41257,11 +41275,12 @@ var NPCDialog = function NPCDialog(_ref) {
|
|
|
41257
41275
|
src: imagePath || img$7
|
|
41258
41276
|
}))) : React__default.createElement(React__default.Fragment, null, React__default.createElement(Container$q, null, React__default.createElement(CloseIcon, {
|
|
41259
41277
|
onPointerDown: _onClose
|
|
41260
|
-
}, "X"), React__default.createElement(TextContainer$
|
|
41278
|
+
}, "X"), React__default.createElement(TextContainer$2, {
|
|
41261
41279
|
flex: type === exports.NPCDialogType.TextAndThumbnail ? '70%' : '100%'
|
|
41262
41280
|
}, React__default.createElement(NPCDialogText, {
|
|
41263
41281
|
type: type,
|
|
41264
41282
|
text: text || 'No text provided.',
|
|
41283
|
+
isTranslated: isTranslated,
|
|
41265
41284
|
onClose: function onClose() {
|
|
41266
41285
|
if (_onClose) {
|
|
41267
41286
|
_onClose();
|
|
@@ -41279,7 +41298,7 @@ var CloseIcon = /*#__PURE__*/styled__default.p.withConfig({
|
|
|
41279
41298
|
displayName: "NPCDialog__CloseIcon",
|
|
41280
41299
|
componentId: "sc-1b4aw74-1"
|
|
41281
41300
|
})(["position:absolute;top:-1.5rem;right:-0.4rem;cursor:pointer;color:white;font-size:1.1rem !important;"]);
|
|
41282
|
-
var TextContainer$
|
|
41301
|
+
var TextContainer$2 = /*#__PURE__*/styled__default.div.withConfig({
|
|
41283
41302
|
displayName: "NPCDialog__TextContainer",
|
|
41284
41303
|
componentId: "sc-1b4aw74-2"
|
|
41285
41304
|
})(["flex:", " 0 0;width:355px;"], function (_ref2) {
|
|
@@ -41331,7 +41350,7 @@ var NPCMultiDialog = function NPCMultiDialog(_ref) {
|
|
|
41331
41350
|
type: exports.RPGUIContainerTypes.FramedGold,
|
|
41332
41351
|
width: '50%',
|
|
41333
41352
|
height: '180px'
|
|
41334
|
-
}, React__default.createElement(React__default.Fragment, null, React__default.createElement(Container$r, null, ((_textAndTypeArray$sli = textAndTypeArray[slide]) == null ? void 0 : _textAndTypeArray$sli.imageSide) === 'right' && React__default.createElement(React__default.Fragment, null, React__default.createElement(TextContainer$
|
|
41353
|
+
}, React__default.createElement(React__default.Fragment, null, React__default.createElement(Container$r, null, ((_textAndTypeArray$sli = textAndTypeArray[slide]) == null ? void 0 : _textAndTypeArray$sli.imageSide) === 'right' && React__default.createElement(React__default.Fragment, null, React__default.createElement(TextContainer$3, {
|
|
41335
41354
|
flex: '70%'
|
|
41336
41355
|
}, React__default.createElement(NPCDialogText, {
|
|
41337
41356
|
onStartStep: function onStartStep() {
|
|
@@ -41353,7 +41372,7 @@ var NPCMultiDialog = function NPCMultiDialog(_ref) {
|
|
|
41353
41372
|
src: img$6
|
|
41354
41373
|
})), textAndTypeArray[slide].imageSide === 'left' && React__default.createElement(React__default.Fragment, null, React__default.createElement(ThumbnailContainer$1, null, React__default.createElement(NPCThumbnail$1, {
|
|
41355
41374
|
src: textAndTypeArray[slide].imagePath || img$7
|
|
41356
|
-
})), React__default.createElement(TextContainer$
|
|
41375
|
+
})), React__default.createElement(TextContainer$3, {
|
|
41357
41376
|
flex: '70%'
|
|
41358
41377
|
}, React__default.createElement(NPCDialogText, {
|
|
41359
41378
|
onStartStep: function onStartStep() {
|
|
@@ -41377,7 +41396,7 @@ var Container$r = /*#__PURE__*/styled__default.div.withConfig({
|
|
|
41377
41396
|
displayName: "NPCMultiDialog__Container",
|
|
41378
41397
|
componentId: "sc-rvu5wg-0"
|
|
41379
41398
|
})(["display:flex;width:100%;height:100%;box-sizing:border-box;justify-content:center;align-items:flex-start;position:relative;"]);
|
|
41380
|
-
var TextContainer$
|
|
41399
|
+
var TextContainer$3 = /*#__PURE__*/styled__default.div.withConfig({
|
|
41381
41400
|
displayName: "NPCMultiDialog__TextContainer",
|
|
41382
41401
|
componentId: "sc-rvu5wg-1"
|
|
41383
41402
|
})(["flex:", " 0 0;width:355px;"], function (_ref2) {
|
|
@@ -46184,6 +46203,8 @@ var orderByOptions = /*#__PURE__*/Object.values(OrderByType).flatMap(function (o
|
|
|
46184
46203
|
});
|
|
46185
46204
|
|
|
46186
46205
|
var BUY_REQUESTS_PER_PAGE = 5;
|
|
46206
|
+
var MARKETPLACE_PANEL_HEIGHT = '390px';
|
|
46207
|
+
var MARKETPLACE_PANEL_MOBILE_HEIGHT = '250px';
|
|
46187
46208
|
var formatBlueprintKey$1 = function formatBlueprintKey(key) {
|
|
46188
46209
|
var name = key.includes('/') ? key.split('/').pop() : key;
|
|
46189
46210
|
return name.replace(/[-_]/g, ' ').replace(/\b\w/g, function (c) {
|
|
@@ -46602,7 +46623,7 @@ var WrapperContainer$1 = /*#__PURE__*/styled__default.div.withConfig({
|
|
|
46602
46623
|
var ItemComponentScrollWrapper$1 = /*#__PURE__*/styled__default.div.withConfig({
|
|
46603
46624
|
displayName: "BuyPanel__ItemComponentScrollWrapper",
|
|
46604
46625
|
componentId: "sc-1si8t7i-7"
|
|
46605
|
-
})(["display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;
|
|
46626
|
+
})(["display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;height:", ";width:95%;margin:1rem auto 0 auto;background:rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.05);border-radius:4px;@media (max-width:950px){height:", ";}"], MARKETPLACE_PANEL_HEIGHT, MARKETPLACE_PANEL_MOBILE_HEIGHT);
|
|
46606
46627
|
var MarketSection = /*#__PURE__*/styled__default.div.withConfig({
|
|
46607
46628
|
displayName: "BuyPanel__MarketSection",
|
|
46608
46629
|
componentId: "sc-1si8t7i-8"
|
|
@@ -48784,7 +48805,7 @@ var PartyRow = function PartyRow(_ref) {
|
|
|
48784
48805
|
playerQty = _ref.playerQty,
|
|
48785
48806
|
isInvited = _ref.isInvited,
|
|
48786
48807
|
partyName = _ref.partyName;
|
|
48787
|
-
return React__default.createElement(PartyWrapper, null, React__default.createElement(TextContainer$
|
|
48808
|
+
return React__default.createElement(PartyWrapper, null, React__default.createElement(TextContainer$4, null, partyName), React__default.createElement(TextContainer$4, null, charName), React__default.createElement(TextContainer$4, null, charClass), React__default.createElement(TextContainer$4, null, charLevel), React__default.createElement(TextContainer$4, null, playerQty, "/5"), isInvited ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Button, {
|
|
48788
48809
|
buttonType: exports.ButtonTypes.RPGUIButton
|
|
48789
48810
|
}, "Accept"), React__default.createElement("div", {
|
|
48790
48811
|
className: "cancel-button"
|
|
@@ -48798,7 +48819,7 @@ var PartyWrapper = /*#__PURE__*/styled__default.div.withConfig({
|
|
|
48798
48819
|
displayName: "PartyRows__PartyWrapper",
|
|
48799
48820
|
componentId: "sc-xzuhrw-0"
|
|
48800
48821
|
})(["width:100%;display:flex;align-items:center;justify-content:space-around;.cancel-button{filter:grayscale(0.7);}"]);
|
|
48801
|
-
var TextContainer$
|
|
48822
|
+
var TextContainer$4 = /*#__PURE__*/styled__default.div.withConfig({
|
|
48802
48823
|
displayName: "PartyRows__TextContainer",
|
|
48803
48824
|
componentId: "sc-xzuhrw-1"
|
|
48804
48825
|
})(["color:", ";"], uiColors.white);
|
|
@@ -48854,15 +48875,15 @@ var PlayersRow = function PlayersRow(_ref) {
|
|
|
48854
48875
|
charClass = _ref.charClass,
|
|
48855
48876
|
charLevel = _ref.charLevel,
|
|
48856
48877
|
isNotInvited = _ref.isNotInvited;
|
|
48857
|
-
return React__default.createElement(PartyWrapper$1, null, React__default.createElement(TextContainer$
|
|
48878
|
+
return React__default.createElement(PartyWrapper$1, null, React__default.createElement(TextContainer$5, null, charName), React__default.createElement(TextContainer$5, null, charClass), React__default.createElement(TextContainer$5, null, charLevel), isNotInvited ? React__default.createElement(React__default.Fragment, null, React__default.createElement(Button, {
|
|
48858
48879
|
buttonType: exports.ButtonTypes.RPGUIButton
|
|
48859
|
-
}, "Invite")) : React__default.createElement(TextContainer$
|
|
48880
|
+
}, "Invite")) : React__default.createElement(TextContainer$5, null, "Invited"));
|
|
48860
48881
|
};
|
|
48861
48882
|
var PartyWrapper$1 = /*#__PURE__*/styled__default.div.withConfig({
|
|
48862
48883
|
displayName: "PlayersRows__PartyWrapper",
|
|
48863
48884
|
componentId: "sc-1ji7yc1-0"
|
|
48864
48885
|
})(["width:100%;display:flex;align-items:center;justify-content:space-around;flex-direction:row;flex:auto;"]);
|
|
48865
|
-
var TextContainer$
|
|
48886
|
+
var TextContainer$5 = /*#__PURE__*/styled__default.div.withConfig({
|
|
48866
48887
|
displayName: "PlayersRows__TextContainer",
|
|
48867
48888
|
componentId: "sc-1ji7yc1-1"
|
|
48868
48889
|
})(["color:", ";flex:auto;margin:auto;"], uiColors.white);
|
|
@@ -48931,10 +48952,10 @@ var PartyManagerRow = function PartyManagerRow(_ref) {
|
|
|
48931
48952
|
onChangeLeader = _ref.onChangeLeader;
|
|
48932
48953
|
var isCurrentUser = id === userId;
|
|
48933
48954
|
var canRemove = leaderId === userId || isCurrentUser;
|
|
48934
|
-
return React__default.createElement(PartyWrapper$2, null, React__default.createElement(TextContainer$
|
|
48955
|
+
return React__default.createElement(PartyWrapper$2, null, React__default.createElement(TextContainer$6, null, React__default.createElement(Ellipsis, {
|
|
48935
48956
|
maxLines: 1,
|
|
48936
48957
|
maxWidth: "300px"
|
|
48937
|
-
}, charName, " ", isCurrentUser ? '(You)' : '', " ", isLeader ? '(Leader)' : '')), React__default.createElement(TextContainer$
|
|
48958
|
+
}, charName, " ", isCurrentUser ? '(You)' : '', " ", isLeader ? '(Leader)' : '')), React__default.createElement(TextContainer$6, null, React__default.createElement(Ellipsis, {
|
|
48938
48959
|
maxLines: 1,
|
|
48939
48960
|
maxWidth: "300px"
|
|
48940
48961
|
}, charClass)), React__default.createElement(ButtonContainer$3, null, canRemove && React__default.createElement(HighlightedText, {
|
|
@@ -48951,7 +48972,7 @@ var PartyWrapper$2 = /*#__PURE__*/styled__default.div.withConfig({
|
|
|
48951
48972
|
displayName: "PartyManagerRows__PartyWrapper",
|
|
48952
48973
|
componentId: "sc-uqajew-0"
|
|
48953
48974
|
})(["display:grid;grid-template-columns:2fr 1fr 1fr;align-items:center;padding:0.5rem;min-height:50px;box-sizing:border-box;width:100%;border-bottom:1px solid ", ";&:hover{background-color:", ";cursor:pointer;}"], uiColors.darkGray, uiColors.darkGray);
|
|
48954
|
-
var TextContainer$
|
|
48975
|
+
var TextContainer$6 = /*#__PURE__*/styled__default.div.withConfig({
|
|
48955
48976
|
displayName: "PartyManagerRows__TextContainer",
|
|
48956
48977
|
componentId: "sc-uqajew-1"
|
|
48957
48978
|
})(["color:", ";overflow:hidden;white-space:nowrap;text-overflow:ellipsis;"], uiColors.white);
|
|
@@ -73467,17 +73488,19 @@ var Store = function Store(_ref) {
|
|
|
73467
73488
|
onRedeem = _ref.onRedeem,
|
|
73468
73489
|
onRedeemInputFocus = _ref.onRedeemInputFocus,
|
|
73469
73490
|
onRedeemInputBlur = _ref.onRedeemInputBlur;
|
|
73491
|
+
var defaultTabOrder = ['premium', 'packs', 'items'];
|
|
73470
73492
|
var _useState = React.useState(null),
|
|
73471
73493
|
selectedPack = _useState[0],
|
|
73472
73494
|
setSelectedPack = _useState[1];
|
|
73473
73495
|
var _useState2 = React.useState(function () {
|
|
73474
|
-
var
|
|
73496
|
+
var _initialTabs$;
|
|
73497
|
+
var initialTabs = (tabOrder != null ? tabOrder : defaultTabOrder).filter(function (id) {
|
|
73475
73498
|
return !(hidePremiumTab && id === 'premium');
|
|
73476
73499
|
});
|
|
73477
73500
|
if (defaultActiveTab && initialTabs.includes(defaultActiveTab)) {
|
|
73478
73501
|
return defaultActiveTab;
|
|
73479
73502
|
}
|
|
73480
|
-
return hidePremiumTab ? 'items' : 'premium';
|
|
73503
|
+
return (_initialTabs$ = initialTabs[0]) != null ? _initialTabs$ : hidePremiumTab ? 'items' : 'premium';
|
|
73481
73504
|
}),
|
|
73482
73505
|
activeTab = _useState2[0],
|
|
73483
73506
|
setActiveTab = _useState2[1];
|
|
@@ -73588,7 +73611,7 @@ var Store = function Store(_ref) {
|
|
|
73588
73611
|
return React__default.createElement(ErrorMessage$3, null, error);
|
|
73589
73612
|
}
|
|
73590
73613
|
// Build tabs dynamically based on props
|
|
73591
|
-
var tabIds = [].concat(tabOrder != null ? tabOrder :
|
|
73614
|
+
var tabIds = [].concat(tabOrder != null ? tabOrder : defaultTabOrder, onRedeem ? ['redeem'] : [], onShowWallet || customWalletContent ? ['wallet'] : [], onShowHistory || customHistoryContent ? ['history'] : []);
|
|
73592
73615
|
var availableTabIds = Array.from(new Set(tabIds.filter(function (id) {
|
|
73593
73616
|
return !(hidePremiumTab && id === 'premium');
|
|
73594
73617
|
})));
|