@rpg-engine/long-bow 0.2.67 → 0.2.68
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/CraftBook/CraftBook.d.ts +15 -0
- package/dist/components/CraftBook/MockItems.d.ts +2 -0
- package/dist/components/itemSelector/ItemSelector.d.ts +1 -1
- package/dist/index.d.ts +5 -4
- package/dist/long-bow.cjs.development.js +260 -104
- 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 +261 -106
- package/dist/long-bow.esm.js.map +1 -1
- package/dist/stories/CraftBook.stories.d.ts +4 -0
- package/package.json +2 -2
- package/src/components/CraftBook/CraftBook.tsx +217 -0
- package/src/components/CraftBook/MockItems.ts +41 -0
- package/src/components/SkillsContainer.tsx +1 -0
- package/src/components/itemSelector/ItemSelector.tsx +5 -1
- package/src/index.tsx +5 -4
- package/src/stories/CraftBook.stories.tsx +40 -0
package/dist/long-bow.esm.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { Component, useState, useEffect, useRef } from 'react';
|
|
2
2
|
import styled from 'styled-components';
|
|
3
|
-
import { GRID_WIDTH, GRID_HEIGHT, ItemContainerType, ItemType, ItemSocketEventsDisplayLabels, ActionsForInventory, ActionsForEquipmentSet, ActionsForLoot, ActionsForMapContainer, getItemTextureKeyPath, ItemSlotType, getSPForLevel, PeriodOfDay } from '@rpg-engine/shared';
|
|
3
|
+
import { GRID_WIDTH, GRID_HEIGHT, ItemSubType, ItemContainerType, ItemType, ItemSocketEventsDisplayLabels, ActionsForInventory, ActionsForEquipmentSet, ActionsForLoot, ActionsForMapContainer, getItemTextureKeyPath, ItemSlotType, getSPForLevel, PeriodOfDay } from '@rpg-engine/shared';
|
|
4
4
|
import dayjs from 'dayjs';
|
|
5
5
|
import { ErrorBoundary as ErrorBoundary$1 } from 'react-error-boundary';
|
|
6
6
|
import Draggable from 'react-draggable';
|
|
@@ -27322,6 +27322,161 @@ var DropdownOptions = /*#__PURE__*/styled.ul.withConfig({
|
|
|
27322
27322
|
return props.opened ? 'block' : 'none';
|
|
27323
27323
|
});
|
|
27324
27324
|
|
|
27325
|
+
var CraftBook = function CraftBook(_ref) {
|
|
27326
|
+
var atlasIMG = _ref.atlasIMG,
|
|
27327
|
+
atlasJSON = _ref.atlasJSON,
|
|
27328
|
+
onClose = _ref.onClose,
|
|
27329
|
+
onSelect = _ref.onSelect,
|
|
27330
|
+
onCraftItem = _ref.onCraftItem,
|
|
27331
|
+
craftablesItems = _ref.craftablesItems;
|
|
27332
|
+
var optionsId = 0;
|
|
27333
|
+
var _useState = useState({
|
|
27334
|
+
show: false,
|
|
27335
|
+
index: 200
|
|
27336
|
+
}),
|
|
27337
|
+
isShown = _useState[0],
|
|
27338
|
+
setIsShown = _useState[1];
|
|
27339
|
+
var _useState2 = useState(),
|
|
27340
|
+
craftItem = _useState2[0],
|
|
27341
|
+
setCraftItem = _useState2[1];
|
|
27342
|
+
var getDropdownOptions = function getDropdownOptions() {
|
|
27343
|
+
var options = [];
|
|
27344
|
+
Object.keys(ItemSubType).forEach(function (key) {
|
|
27345
|
+
options.push({
|
|
27346
|
+
id: optionsId,
|
|
27347
|
+
value: key,
|
|
27348
|
+
option: key
|
|
27349
|
+
});
|
|
27350
|
+
optionsId += 1;
|
|
27351
|
+
});
|
|
27352
|
+
return options;
|
|
27353
|
+
};
|
|
27354
|
+
var modifyString = function modifyString(str) {
|
|
27355
|
+
// Split the string by "/" and "."
|
|
27356
|
+
var parts = str.split('/');
|
|
27357
|
+
var fileName = parts[parts.length - 1];
|
|
27358
|
+
parts = fileName.split('.');
|
|
27359
|
+
var name = parts[0];
|
|
27360
|
+
// Replace all occurrences of "-" with " "
|
|
27361
|
+
name = name.replace(/-/g, ' ');
|
|
27362
|
+
// Uppercase the first word
|
|
27363
|
+
var words = name.split(' ');
|
|
27364
|
+
var firstWord = words[0].slice(0, 1).toUpperCase() + words[0].slice(1);
|
|
27365
|
+
var modifiedWords = [firstWord].concat(words.slice(1));
|
|
27366
|
+
name = modifiedWords.join(' ');
|
|
27367
|
+
return name;
|
|
27368
|
+
};
|
|
27369
|
+
var handleClick = function handleClick() {
|
|
27370
|
+
var element = document.querySelector("input[name='test']:checked");
|
|
27371
|
+
var elementValue = element.value;
|
|
27372
|
+
setCraftItem(elementValue);
|
|
27373
|
+
};
|
|
27374
|
+
return React.createElement(DraggableContainer, {
|
|
27375
|
+
type: RPGUIContainerTypes.Framed,
|
|
27376
|
+
width: "500px",
|
|
27377
|
+
cancelDrag: ".equipment-container-body .arrow-selector",
|
|
27378
|
+
onCloseButton: function onCloseButton() {
|
|
27379
|
+
if (onClose) {
|
|
27380
|
+
onClose();
|
|
27381
|
+
}
|
|
27382
|
+
}
|
|
27383
|
+
}, React.createElement("div", {
|
|
27384
|
+
style: {
|
|
27385
|
+
width: '100%'
|
|
27386
|
+
}
|
|
27387
|
+
}, React.createElement(Title$1, null, 'Harvesting instruments'), React.createElement(Subtitle, null, 'Use the tool, you need it'), React.createElement("hr", {
|
|
27388
|
+
className: "golden"
|
|
27389
|
+
})), React.createElement(Dropdown, {
|
|
27390
|
+
options: getDropdownOptions(),
|
|
27391
|
+
onChange: function onChange(value) {
|
|
27392
|
+
return onSelect(value);
|
|
27393
|
+
}
|
|
27394
|
+
}), React.createElement(RadioInputScroller, null, craftablesItems == null ? void 0 : craftablesItems.map(function (option, index) {
|
|
27395
|
+
return React.createElement(RadioOptionsWrapper, {
|
|
27396
|
+
key: index
|
|
27397
|
+
}, React.createElement(SpriteAtlasWrapper, null, React.createElement(SpriteFromAtlas, {
|
|
27398
|
+
atlasIMG: atlasIMG,
|
|
27399
|
+
atlasJSON: atlasJSON,
|
|
27400
|
+
spriteKey: option.key,
|
|
27401
|
+
imgScale: 3,
|
|
27402
|
+
grayScale: !option.canCraft
|
|
27403
|
+
})), React.createElement("div", null, React.createElement("input", {
|
|
27404
|
+
className: "rpgui-radio",
|
|
27405
|
+
type: "radio",
|
|
27406
|
+
value: option.name,
|
|
27407
|
+
name: "test",
|
|
27408
|
+
disabled: !option.canCraft
|
|
27409
|
+
}), React.createElement("label", {
|
|
27410
|
+
onClick: handleClick,
|
|
27411
|
+
style: {
|
|
27412
|
+
display: 'flex',
|
|
27413
|
+
alignItems: 'center'
|
|
27414
|
+
},
|
|
27415
|
+
onMouseEnter: function onMouseEnter() {
|
|
27416
|
+
return setIsShown({
|
|
27417
|
+
show: true,
|
|
27418
|
+
index: index
|
|
27419
|
+
});
|
|
27420
|
+
},
|
|
27421
|
+
onMouseLeave: function onMouseLeave() {
|
|
27422
|
+
return setIsShown({
|
|
27423
|
+
show: false,
|
|
27424
|
+
index: index
|
|
27425
|
+
});
|
|
27426
|
+
}
|
|
27427
|
+
}, modifyString(option.name)), isShown && isShown.index === index && option.ingredients.map(function (option, index) {
|
|
27428
|
+
return React.createElement(Recipes, {
|
|
27429
|
+
key: index
|
|
27430
|
+
}, React.createElement(SpriteFromAtlas, {
|
|
27431
|
+
atlasIMG: atlasIMG,
|
|
27432
|
+
atlasJSON: atlasJSON,
|
|
27433
|
+
spriteKey: "" + option.key,
|
|
27434
|
+
imgScale: 1
|
|
27435
|
+
}), React.createElement(StyledItem, null, modifyString(option.key), " (", option.qty, "x)"));
|
|
27436
|
+
})));
|
|
27437
|
+
})), React.createElement(ButtonWrapper, null, React.createElement(Button, {
|
|
27438
|
+
buttonType: ButtonTypes.RPGUIButton,
|
|
27439
|
+
onClick: onClose
|
|
27440
|
+
}, "Cancel"), React.createElement(Button, {
|
|
27441
|
+
buttonType: ButtonTypes.RPGUIButton,
|
|
27442
|
+
onClick: function onClick() {
|
|
27443
|
+
return onCraftItem(craftItem);
|
|
27444
|
+
}
|
|
27445
|
+
}, "Craft")));
|
|
27446
|
+
};
|
|
27447
|
+
var StyledItem = /*#__PURE__*/styled.div.withConfig({
|
|
27448
|
+
displayName: "CraftBook__StyledItem",
|
|
27449
|
+
componentId: "sc-19q95ue-0"
|
|
27450
|
+
})(["margin-left:10px;"]);
|
|
27451
|
+
var Recipes = /*#__PURE__*/styled.div.withConfig({
|
|
27452
|
+
displayName: "CraftBook__Recipes",
|
|
27453
|
+
componentId: "sc-19q95ue-1"
|
|
27454
|
+
})(["font-size:0.6rem;color:yellow !important;margin-bottom:3px;display:flex;align-items:center;.sprite-from-atlas-img{top:0px;left:0px;}"]);
|
|
27455
|
+
var Title$1 = /*#__PURE__*/styled.h1.withConfig({
|
|
27456
|
+
displayName: "CraftBook__Title",
|
|
27457
|
+
componentId: "sc-19q95ue-2"
|
|
27458
|
+
})(["font-size:0.6rem;color:yellow !important;"]);
|
|
27459
|
+
var Subtitle = /*#__PURE__*/styled.h1.withConfig({
|
|
27460
|
+
displayName: "CraftBook__Subtitle",
|
|
27461
|
+
componentId: "sc-19q95ue-3"
|
|
27462
|
+
})(["font-size:0.4rem;color:yellow !important;"]);
|
|
27463
|
+
var RadioInputScroller = /*#__PURE__*/styled.div.withConfig({
|
|
27464
|
+
displayName: "CraftBook__RadioInputScroller",
|
|
27465
|
+
componentId: "sc-19q95ue-4"
|
|
27466
|
+
})(["padding-left:15px;padding-top:10px;width:100%;margin-top:1rem;align-items:center;margin-left:20px;align-items:flex-start;overflow-y:scroll;height:360px;"]);
|
|
27467
|
+
var SpriteAtlasWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
27468
|
+
displayName: "CraftBook__SpriteAtlasWrapper",
|
|
27469
|
+
componentId: "sc-19q95ue-5"
|
|
27470
|
+
})(["margin-right:40px;"]);
|
|
27471
|
+
var RadioOptionsWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
27472
|
+
displayName: "CraftBook__RadioOptionsWrapper",
|
|
27473
|
+
componentId: "sc-19q95ue-6"
|
|
27474
|
+
})(["display:flex;align-items:stretch;margin-bottom:40px;"]);
|
|
27475
|
+
var ButtonWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
27476
|
+
displayName: "CraftBook__ButtonWrapper",
|
|
27477
|
+
componentId: "sc-19q95ue-7"
|
|
27478
|
+
})(["display:flex;justify-content:space-around;padding-top:20px;width:100%;"]);
|
|
27479
|
+
|
|
27325
27480
|
var DropdownSelectorContainer = function DropdownSelectorContainer(_ref) {
|
|
27326
27481
|
var title = _ref.title,
|
|
27327
27482
|
onChange = _ref.onChange,
|
|
@@ -28346,6 +28501,92 @@ var ItemsContainer = /*#__PURE__*/styled.div.withConfig({
|
|
|
28346
28501
|
componentId: "sc-15y5p9l-0"
|
|
28347
28502
|
})(["max-width:280px;display:flex;justify-content:center;flex-wrap:wrap;"]);
|
|
28348
28503
|
|
|
28504
|
+
var ItemSelector = function ItemSelector(_ref) {
|
|
28505
|
+
var atlasIMG = _ref.atlasIMG,
|
|
28506
|
+
atlasJSON = _ref.atlasJSON,
|
|
28507
|
+
options = _ref.options,
|
|
28508
|
+
onClose = _ref.onClose,
|
|
28509
|
+
onSelect = _ref.onSelect;
|
|
28510
|
+
var _useState = useState(),
|
|
28511
|
+
selectedValue = _useState[0],
|
|
28512
|
+
setSelectedValue = _useState[1];
|
|
28513
|
+
var handleClick = function handleClick() {
|
|
28514
|
+
var element = document.querySelector("input[name='test']:checked");
|
|
28515
|
+
var elementValue = element.value;
|
|
28516
|
+
setSelectedValue(elementValue);
|
|
28517
|
+
};
|
|
28518
|
+
useEffect(function () {
|
|
28519
|
+
if (selectedValue) {
|
|
28520
|
+
onSelect(selectedValue);
|
|
28521
|
+
}
|
|
28522
|
+
}, [selectedValue]);
|
|
28523
|
+
return React.createElement(DraggableContainer, {
|
|
28524
|
+
type: RPGUIContainerTypes.Framed,
|
|
28525
|
+
width: "500px",
|
|
28526
|
+
cancelDrag: ".equipment-container-body .arrow-selector",
|
|
28527
|
+
onCloseButton: function onCloseButton() {
|
|
28528
|
+
if (onClose) {
|
|
28529
|
+
onClose();
|
|
28530
|
+
}
|
|
28531
|
+
}
|
|
28532
|
+
}, React.createElement("div", {
|
|
28533
|
+
style: {
|
|
28534
|
+
width: '100%'
|
|
28535
|
+
}
|
|
28536
|
+
}, React.createElement(Title$2, null, 'Harvesting instruments'), React.createElement(Subtitle$1, null, 'Use the tool, you need it'), React.createElement("hr", {
|
|
28537
|
+
className: "golden"
|
|
28538
|
+
})), React.createElement(RadioInputScroller$1, null, options == null ? void 0 : options.map(function (option, index) {
|
|
28539
|
+
return React.createElement(RadioOptionsWrapper$1, {
|
|
28540
|
+
key: index
|
|
28541
|
+
}, React.createElement(SpriteAtlasWrapper$1, null, React.createElement(SpriteFromAtlas, {
|
|
28542
|
+
atlasIMG: atlasIMG,
|
|
28543
|
+
atlasJSON: atlasJSON,
|
|
28544
|
+
spriteKey: option.imageKey,
|
|
28545
|
+
imgScale: 3
|
|
28546
|
+
})), React.createElement("div", null, React.createElement("input", {
|
|
28547
|
+
className: "rpgui-radio",
|
|
28548
|
+
type: "radio",
|
|
28549
|
+
value: option.name,
|
|
28550
|
+
name: "test"
|
|
28551
|
+
}), React.createElement("label", {
|
|
28552
|
+
onClick: handleClick,
|
|
28553
|
+
style: {
|
|
28554
|
+
display: 'flex',
|
|
28555
|
+
alignItems: 'center'
|
|
28556
|
+
}
|
|
28557
|
+
}, option.name, " ", React.createElement("br", null), option.description)));
|
|
28558
|
+
})), React.createElement(ButtonWrapper$1, null, React.createElement(Button, {
|
|
28559
|
+
buttonType: ButtonTypes.RPGUIButton,
|
|
28560
|
+
onClick: onClose
|
|
28561
|
+
}, "Cancel"), React.createElement(Button, {
|
|
28562
|
+
buttonType: ButtonTypes.RPGUIButton
|
|
28563
|
+
}, "Select")));
|
|
28564
|
+
};
|
|
28565
|
+
var Title$2 = /*#__PURE__*/styled.h1.withConfig({
|
|
28566
|
+
displayName: "ItemSelector__Title",
|
|
28567
|
+
componentId: "sc-gptoxp-0"
|
|
28568
|
+
})(["font-size:0.6rem;color:yellow !important;"]);
|
|
28569
|
+
var Subtitle$1 = /*#__PURE__*/styled.h1.withConfig({
|
|
28570
|
+
displayName: "ItemSelector__Subtitle",
|
|
28571
|
+
componentId: "sc-gptoxp-1"
|
|
28572
|
+
})(["font-size:0.4rem;color:yellow !important;"]);
|
|
28573
|
+
var RadioInputScroller$1 = /*#__PURE__*/styled.div.withConfig({
|
|
28574
|
+
displayName: "ItemSelector__RadioInputScroller",
|
|
28575
|
+
componentId: "sc-gptoxp-2"
|
|
28576
|
+
})(["padding-left:15px;padding-top:10px;width:100%;margin-top:1rem;align-items:center;margin-left:20px;align-items:flex-start;overflow-y:scroll;height:360px;"]);
|
|
28577
|
+
var SpriteAtlasWrapper$1 = /*#__PURE__*/styled.div.withConfig({
|
|
28578
|
+
displayName: "ItemSelector__SpriteAtlasWrapper",
|
|
28579
|
+
componentId: "sc-gptoxp-3"
|
|
28580
|
+
})(["margin-right:40px;"]);
|
|
28581
|
+
var RadioOptionsWrapper$1 = /*#__PURE__*/styled.div.withConfig({
|
|
28582
|
+
displayName: "ItemSelector__RadioOptionsWrapper",
|
|
28583
|
+
componentId: "sc-gptoxp-4"
|
|
28584
|
+
})(["display:flex;align-items:stretch;margin-bottom:40px;"]);
|
|
28585
|
+
var ButtonWrapper$1 = /*#__PURE__*/styled.div.withConfig({
|
|
28586
|
+
displayName: "ItemSelector__ButtonWrapper",
|
|
28587
|
+
componentId: "sc-gptoxp-5"
|
|
28588
|
+
})(["display:flex;justify-content:space-around;padding-top:20px;width:100%;"]);
|
|
28589
|
+
|
|
28349
28590
|
var ListMenu = function ListMenu(_ref) {
|
|
28350
28591
|
var options = _ref.options,
|
|
28351
28592
|
onSelected = _ref.onSelected,
|
|
@@ -28481,7 +28722,7 @@ var QuestInfo = function QuestInfo(_ref) {
|
|
|
28481
28722
|
onTouchStart: onRightClick
|
|
28482
28723
|
}), React.createElement(QuestContainer, null, React.createElement(TitleContainer$1, {
|
|
28483
28724
|
className: "drag-handler"
|
|
28484
|
-
}, React.createElement(Title$
|
|
28725
|
+
}, React.createElement(Title$3, null, React.createElement(Thumbnail, {
|
|
28485
28726
|
src: quests[currentIndex].thumbnail || img$8
|
|
28486
28727
|
}), quests[currentIndex].title), React.createElement(QuestSplitDiv, null, React.createElement("hr", {
|
|
28487
28728
|
className: "golden"
|
|
@@ -28500,7 +28741,7 @@ var QuestInfo = function QuestInfo(_ref) {
|
|
|
28500
28741
|
}, button.title);
|
|
28501
28742
|
})))) : React.createElement(QuestsContainer, null, React.createElement(QuestContainer, null, React.createElement(TitleContainer$1, {
|
|
28502
28743
|
className: "drag-handler"
|
|
28503
|
-
}, React.createElement(Title$
|
|
28744
|
+
}, React.createElement(Title$3, null, React.createElement(Thumbnail, {
|
|
28504
28745
|
src: quests[0].thumbnail || img$8
|
|
28505
28746
|
}), quests[0].title), React.createElement(QuestSplitDiv, null, React.createElement("hr", {
|
|
28506
28747
|
className: "golden"
|
|
@@ -28547,7 +28788,7 @@ var TitleContainer$1 = /*#__PURE__*/styled.div.withConfig({
|
|
|
28547
28788
|
displayName: "QuestInfo__TitleContainer",
|
|
28548
28789
|
componentId: "sc-15s2boc-6"
|
|
28549
28790
|
})(["width:100%;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;margin-top:1rem;"]);
|
|
28550
|
-
var Title$
|
|
28791
|
+
var Title$3 = /*#__PURE__*/styled.h1.withConfig({
|
|
28551
28792
|
displayName: "QuestInfo__Title",
|
|
28552
28793
|
componentId: "sc-15s2boc-7"
|
|
28553
28794
|
})(["color:white;z-index:22;font-size:", " !important;color:", " !important;"], uiFonts.size.medium, uiColors.yellow);
|
|
@@ -28569,7 +28810,7 @@ var QuestList = function QuestList(_ref) {
|
|
|
28569
28810
|
style: {
|
|
28570
28811
|
width: '100%'
|
|
28571
28812
|
}
|
|
28572
|
-
}, React.createElement(Title$
|
|
28813
|
+
}, React.createElement(Title$4, null, "Quests"), React.createElement("hr", {
|
|
28573
28814
|
className: "golden"
|
|
28574
28815
|
}), React.createElement(QuestListContainer, null, quests ? quests.map(function (quest, i) {
|
|
28575
28816
|
return React.createElement("div", {
|
|
@@ -28590,7 +28831,7 @@ var QuestDraggableContainer$1 = /*#__PURE__*/styled(DraggableContainer).withConf
|
|
|
28590
28831
|
displayName: "QuestList__QuestDraggableContainer",
|
|
28591
28832
|
componentId: "sc-1a2vx6q-0"
|
|
28592
28833
|
})([".container-close{top:10px;right:10px;}.quest-title{text-align:left;margin-left:44px;margin-top:20px;color:yellow;}.quest-desc{margin-top:12px;margin-left:44px;}.rpgui-progress{min-width:80%;margin:0 auto;}"]);
|
|
28593
|
-
var Title$
|
|
28834
|
+
var Title$4 = /*#__PURE__*/styled.h1.withConfig({
|
|
28594
28835
|
displayName: "QuestList__Title",
|
|
28595
28836
|
componentId: "sc-1a2vx6q-1"
|
|
28596
28837
|
})(["z-index:22;font-size:", " !important;color:yellow !important;"], uiFonts.size.medium);
|
|
@@ -28603,15 +28844,6 @@ var NoQuestContainer = /*#__PURE__*/styled.div.withConfig({
|
|
|
28603
28844
|
componentId: "sc-1a2vx6q-3"
|
|
28604
28845
|
})(["text-align:center;p{margin-top:5px;}"]);
|
|
28605
28846
|
|
|
28606
|
-
//@ts-ignore
|
|
28607
|
-
var _RPGUI = RPGUI;
|
|
28608
|
-
var RPGUIRoot = function RPGUIRoot(_ref) {
|
|
28609
|
-
var children = _ref.children;
|
|
28610
|
-
return React.createElement("div", {
|
|
28611
|
-
className: "rpgui-content"
|
|
28612
|
-
}, children);
|
|
28613
|
-
};
|
|
28614
|
-
|
|
28615
28847
|
var InputRadio = function InputRadio(_ref) {
|
|
28616
28848
|
var name = _ref.name,
|
|
28617
28849
|
items = _ref.items,
|
|
@@ -28644,6 +28876,15 @@ var InputRadio = function InputRadio(_ref) {
|
|
|
28644
28876
|
}));
|
|
28645
28877
|
};
|
|
28646
28878
|
|
|
28879
|
+
//@ts-ignore
|
|
28880
|
+
var _RPGUI = RPGUI;
|
|
28881
|
+
var RPGUIRoot = function RPGUIRoot(_ref) {
|
|
28882
|
+
var children = _ref.children;
|
|
28883
|
+
return React.createElement("div", {
|
|
28884
|
+
className: "rpgui-content"
|
|
28885
|
+
}, children);
|
|
28886
|
+
};
|
|
28887
|
+
|
|
28647
28888
|
var RangeSliderType;
|
|
28648
28889
|
(function (RangeSliderType) {
|
|
28649
28890
|
RangeSliderType["Slider"] = "rpgui-slider";
|
|
@@ -29079,7 +29320,7 @@ var TradingMenu = function TradingMenu(_ref) {
|
|
|
29079
29320
|
style: {
|
|
29080
29321
|
width: '100%'
|
|
29081
29322
|
}
|
|
29082
|
-
}, React.createElement(Title$
|
|
29323
|
+
}, React.createElement(Title$5, null, Capitalize(type), " Menu"), React.createElement("hr", {
|
|
29083
29324
|
className: "golden"
|
|
29084
29325
|
})), React.createElement(TradingComponentScrollWrapper, null, traderItems.map(function (tradeItem, index) {
|
|
29085
29326
|
var _qtyMap$get;
|
|
@@ -29092,7 +29333,7 @@ var TradingMenu = function TradingMenu(_ref) {
|
|
|
29092
29333
|
traderItem: tradeItem,
|
|
29093
29334
|
selectedQty: (_qtyMap$get = qtyMap.get(tradeItem.key)) != null ? _qtyMap$get : 0
|
|
29094
29335
|
}));
|
|
29095
|
-
})), React.createElement(GoldWrapper, null, React.createElement("p", null, "Available Gold:"), React.createElement("p", null, "$", characterAvailableGold)), React.createElement(TotalWrapper, null, React.createElement("p", null, "Total:"), React.createElement("p", null, "$", sum)), !hasGoldForSale() ? React.createElement(AlertWrapper, null, React.createElement("p", null, " Sorry, not enough money.")) : React.createElement(GoldWrapper, null, React.createElement("p", null, "Final Gold:"), React.createElement("p", null, "$", getFinalGold())), React.createElement(ButtonWrapper, null, React.createElement(Button, {
|
|
29336
|
+
})), React.createElement(GoldWrapper, null, React.createElement("p", null, "Available Gold:"), React.createElement("p", null, "$", characterAvailableGold)), React.createElement(TotalWrapper, null, React.createElement("p", null, "Total:"), React.createElement("p", null, "$", sum)), !hasGoldForSale() ? React.createElement(AlertWrapper, null, React.createElement("p", null, " Sorry, not enough money.")) : React.createElement(GoldWrapper, null, React.createElement("p", null, "Final Gold:"), React.createElement("p", null, "$", getFinalGold())), React.createElement(ButtonWrapper$2, null, React.createElement(Button, {
|
|
29096
29337
|
buttonType: ButtonTypes.RPGUIButton,
|
|
29097
29338
|
disabled: !hasGoldForSale(),
|
|
29098
29339
|
onClick: function onClick() {
|
|
@@ -29105,7 +29346,7 @@ var TradingMenu = function TradingMenu(_ref) {
|
|
|
29105
29346
|
}
|
|
29106
29347
|
}, "Cancel"))));
|
|
29107
29348
|
};
|
|
29108
|
-
var Title$
|
|
29349
|
+
var Title$5 = /*#__PURE__*/styled.h1.withConfig({
|
|
29109
29350
|
displayName: "TradingMenu__Title",
|
|
29110
29351
|
componentId: "sc-1wjsz1l-0"
|
|
29111
29352
|
})(["z-index:22;font-size:0.6rem;color:yellow !important;"]);
|
|
@@ -29129,7 +29370,7 @@ var AlertWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
|
29129
29370
|
displayName: "TradingMenu__AlertWrapper",
|
|
29130
29371
|
componentId: "sc-1wjsz1l-5"
|
|
29131
29372
|
})(["margin-top:1rem;display:flex;width:100%;justify-content:center;height:20px;p{color:red !important;}"]);
|
|
29132
|
-
var ButtonWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
29373
|
+
var ButtonWrapper$2 = /*#__PURE__*/styled.div.withConfig({
|
|
29133
29374
|
displayName: "TradingMenu__ButtonWrapper",
|
|
29134
29375
|
componentId: "sc-1wjsz1l-6"
|
|
29135
29376
|
})(["display:flex;justify-content:space-around;padding-top:20px;width:100%;margin-top:1rem;"]);
|
|
@@ -29150,91 +29391,5 @@ var Container$i = /*#__PURE__*/styled.div.withConfig({
|
|
|
29150
29391
|
return props.maxLines;
|
|
29151
29392
|
});
|
|
29152
29393
|
|
|
29153
|
-
|
|
29154
|
-
var atlasIMG = _ref.atlasIMG,
|
|
29155
|
-
atlasJSON = _ref.atlasJSON,
|
|
29156
|
-
options = _ref.options,
|
|
29157
|
-
onClose = _ref.onClose,
|
|
29158
|
-
onSelect = _ref.onSelect;
|
|
29159
|
-
var _useState = useState(),
|
|
29160
|
-
selectedValue = _useState[0],
|
|
29161
|
-
setSelectedValue = _useState[1];
|
|
29162
|
-
var handleClick = function handleClick() {
|
|
29163
|
-
var element = document.querySelector("input[name='test']:checked");
|
|
29164
|
-
var elementValue = element.value;
|
|
29165
|
-
setSelectedValue(elementValue);
|
|
29166
|
-
};
|
|
29167
|
-
useEffect(function () {
|
|
29168
|
-
if (selectedValue) {
|
|
29169
|
-
onSelect(selectedValue);
|
|
29170
|
-
}
|
|
29171
|
-
}, [selectedValue]);
|
|
29172
|
-
return React.createElement(DraggableContainer, {
|
|
29173
|
-
type: RPGUIContainerTypes.Framed,
|
|
29174
|
-
width: "500px",
|
|
29175
|
-
cancelDrag: ".equipment-container-body .arrow-selector",
|
|
29176
|
-
onCloseButton: function onCloseButton() {
|
|
29177
|
-
if (onClose) {
|
|
29178
|
-
onClose();
|
|
29179
|
-
}
|
|
29180
|
-
}
|
|
29181
|
-
}, React.createElement("div", {
|
|
29182
|
-
style: {
|
|
29183
|
-
width: '100%'
|
|
29184
|
-
}
|
|
29185
|
-
}, React.createElement(Title$4, null, 'Harvesting instruments'), React.createElement(Subtitle, null, 'Use the tool, you need it'), React.createElement("hr", {
|
|
29186
|
-
className: "golden"
|
|
29187
|
-
})), React.createElement(RadioInputScroller, null, options == null ? void 0 : options.map(function (option, index) {
|
|
29188
|
-
return React.createElement(RadioOptionsWrapper, {
|
|
29189
|
-
key: index
|
|
29190
|
-
}, React.createElement(SpriteAtlasWrapper, null, React.createElement(SpriteFromAtlas, {
|
|
29191
|
-
atlasIMG: atlasIMG,
|
|
29192
|
-
atlasJSON: atlasJSON,
|
|
29193
|
-
spriteKey: option.imageKey,
|
|
29194
|
-
imgScale: 3
|
|
29195
|
-
})), React.createElement("div", null, React.createElement("input", {
|
|
29196
|
-
className: "rpgui-radio",
|
|
29197
|
-
type: "radio",
|
|
29198
|
-
value: option.name,
|
|
29199
|
-
name: "test"
|
|
29200
|
-
}), React.createElement("label", {
|
|
29201
|
-
onClick: handleClick,
|
|
29202
|
-
style: {
|
|
29203
|
-
display: 'flex',
|
|
29204
|
-
alignItems: 'center'
|
|
29205
|
-
}
|
|
29206
|
-
}, option.name, " ", React.createElement("br", null), option.description)));
|
|
29207
|
-
})), React.createElement(ButtonWrapper$1, null, React.createElement(Button, {
|
|
29208
|
-
buttonType: ButtonTypes.RPGUIButton,
|
|
29209
|
-
onClick: onClose
|
|
29210
|
-
}, "Cancel"), React.createElement(Button, {
|
|
29211
|
-
buttonType: ButtonTypes.RPGUIButton
|
|
29212
|
-
}, "Select")));
|
|
29213
|
-
};
|
|
29214
|
-
var Title$4 = /*#__PURE__*/styled.h1.withConfig({
|
|
29215
|
-
displayName: "ItemSelector__Title",
|
|
29216
|
-
componentId: "sc-gptoxp-0"
|
|
29217
|
-
})(["font-size:0.6rem;color:yellow !important;"]);
|
|
29218
|
-
var Subtitle = /*#__PURE__*/styled.h1.withConfig({
|
|
29219
|
-
displayName: "ItemSelector__Subtitle",
|
|
29220
|
-
componentId: "sc-gptoxp-1"
|
|
29221
|
-
})(["font-size:0.4rem;color:yellow !important;"]);
|
|
29222
|
-
var RadioInputScroller = /*#__PURE__*/styled.div.withConfig({
|
|
29223
|
-
displayName: "ItemSelector__RadioInputScroller",
|
|
29224
|
-
componentId: "sc-gptoxp-2"
|
|
29225
|
-
})(["width:100%;margin-top:1rem;align-items:center;margin-left:20px;align-items:flex-start;overflow-y:scroll;height:360px;"]);
|
|
29226
|
-
var SpriteAtlasWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
29227
|
-
displayName: "ItemSelector__SpriteAtlasWrapper",
|
|
29228
|
-
componentId: "sc-gptoxp-3"
|
|
29229
|
-
})(["margin-right:40px;"]);
|
|
29230
|
-
var RadioOptionsWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
29231
|
-
displayName: "ItemSelector__RadioOptionsWrapper",
|
|
29232
|
-
componentId: "sc-gptoxp-4"
|
|
29233
|
-
})(["display:flex;align-items:stretch;margin-bottom:40px;"]);
|
|
29234
|
-
var ButtonWrapper$1 = /*#__PURE__*/styled.div.withConfig({
|
|
29235
|
-
displayName: "ItemSelector__ButtonWrapper",
|
|
29236
|
-
componentId: "sc-gptoxp-5"
|
|
29237
|
-
})(["display:flex;justify-content:space-around;padding-top:20px;width:100%;"]);
|
|
29238
|
-
|
|
29239
|
-
export { Button, ButtonTypes, CharacterSelection, Chat, CheckButton, DraggableContainer, Dropdown, DropdownSelectorContainer, DynamicText, EquipmentSet, HistoryDialog, ImgSide, Input, InputRadio, ItemContainer, ItemSelector, ItemSlot, ListMenu, NPCDialog, NPCDialogType, NPCMultiDialog, ProgressBar, PropertySelect, QuestInfo, QuestList, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, SkillProgressBar, SkillsContainer, SpriteFromAtlas, TextArea, TimeWidget, TradingMenu, Truncate, _RPGUI, useEventListener };
|
|
29394
|
+
export { Button, ButtonTypes, CharacterSelection, Chat, CheckButton, CraftBook, DraggableContainer, Dropdown, DropdownSelectorContainer, DynamicText, EquipmentSet, HistoryDialog, ImgSide, Input, InputRadio, ItemContainer, ItemSelector, ItemSlot, ListMenu, NPCDialog, NPCDialogType, NPCMultiDialog, ProgressBar, PropertySelect, QuestInfo, QuestList, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, SkillProgressBar, SkillsContainer, SpriteFromAtlas, TextArea, TimeWidget, TradingMenu, Truncate, _RPGUI, useEventListener };
|
|
29240
29395
|
//# sourceMappingURL=long-bow.esm.js.map
|