@rpg-engine/long-bow 0.2.61 → 0.2.63

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.
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ export interface IRadioProps {
3
+ title: string;
4
+ subtitle: string;
5
+ instrument: string | null;
6
+ setInstrument: (value: string) => void;
7
+ }
8
+ export declare const RadioButton: React.FC<IRadioProps>;
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ export interface IRadioItems {
3
+ title: string;
4
+ subtitle: string;
5
+ }
6
+ export interface IRadioInput {
7
+ title: string;
8
+ subtitle: string;
9
+ onSelect: (a: string) => void;
10
+ onCancel: () => void;
11
+ items: IRadioItems[];
12
+ }
13
+ export declare const RadioInput: React.FC<IRadioInput>;
@@ -0,0 +1,4 @@
1
+ export declare const Itools: {
2
+ title: string;
3
+ subtitle: string;
4
+ }[];
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ interface IServer {
3
+ id: string;
4
+ name: string;
5
+ }
6
+ export interface IServerSelectionProps {
7
+ onChange: (serverId: string) => void;
8
+ servers: IServer[];
9
+ details?: string;
10
+ }
11
+ export declare const ServerSelection: React.FC<IServerSelectionProps>;
12
+ export {};
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ export interface IOptionsItemSelectorProps {
3
+ name: string;
4
+ description: string;
5
+ imageKey: string;
6
+ }
7
+ export interface IItemSelectorProps {
8
+ atlasJSON: any;
9
+ atlasIMG: any;
10
+ options: IOptionsItemSelectorProps[];
11
+ onClose: () => void;
12
+ onSelect: (value: string) => void;
13
+ }
14
+ export declare const ItemSelector: React.FC<IItemSelectorProps>;
package/dist/index.d.ts CHANGED
@@ -9,6 +9,7 @@ export * from './components/HistoryDialog';
9
9
  export * from './components/Input';
10
10
  export * from './components/Item/Inventory/ItemContainer';
11
11
  export * from './components/Item/Inventory/ItemSlot';
12
+ export * from './components/itemSelector/ItemSelector';
12
13
  export * from './components/ListMenu';
13
14
  export * from './components/NPCDialog/NPCDialog';
14
15
  export * from './components/NPCDialog/NPCMultiDialog';
@@ -21,6 +22,7 @@ export * from './components/RadioButton';
21
22
  export * from './components/RangeSlider';
22
23
  export * from './components/RPGUIContainer';
23
24
  export * from './components/RPGUIRoot';
25
+ export * from './components/ServerSelection';
24
26
  export * from './components/shared/SpriteFromAtlas';
25
27
  export * from './components/SkillProgressBar';
26
28
  export * from './components/SkillsContainer';
@@ -27269,7 +27269,7 @@ var Dropdown = function Dropdown(_ref) {
27269
27269
  setOpened = _useState3[1];
27270
27270
  React.useEffect(function () {
27271
27271
  var firstOption = options[0];
27272
- if (firstOption) {
27272
+ if (firstOption && !selectedValue) {
27273
27273
  setSelectedValue(firstOption.value);
27274
27274
  setSelectedOption(firstOption.option);
27275
27275
  }
@@ -27770,7 +27770,20 @@ var NPCDialogText = function NPCDialogText(_ref) {
27770
27770
  onClose = _ref.onClose,
27771
27771
  onEndStep = _ref.onEndStep,
27772
27772
  onStartStep = _ref.onStartStep;
27773
- var textChunks = chunkString(text, 85);
27773
+ var windowSize = React.useRef([window.innerWidth, window.innerHeight]);
27774
+ function maxCharacters(width) {
27775
+ // Set the font size to 16 pixels
27776
+ var fontSize = 11.2;
27777
+ // Calculate the number of characters that can fit in one line
27778
+ var charactersPerLine = Math.floor(width / 2 / fontSize);
27779
+ // Calculate the number of lines that can fit in the div
27780
+ var linesPerDiv = Math.floor(180 / fontSize);
27781
+ // Calculate the maximum number of characters that can fit in the div
27782
+ var maxCharacters = charactersPerLine * linesPerDiv;
27783
+ // Return the maximum number of characters
27784
+ return Math.round(maxCharacters / 5);
27785
+ }
27786
+ var textChunks = chunkString(text, maxCharacters(windowSize.current[0]));
27774
27787
  var _useState = React.useState(0),
27775
27788
  chunkIndex = _useState[0],
27776
27789
  setChunkIndex = _useState[1];
@@ -28311,6 +28324,92 @@ var ItemsContainer = /*#__PURE__*/styled.div.withConfig({
28311
28324
  componentId: "sc-15y5p9l-0"
28312
28325
  })(["max-width:280px;display:flex;justify-content:center;flex-wrap:wrap;"]);
28313
28326
 
28327
+ var ItemSelector = function ItemSelector(_ref) {
28328
+ var atlasIMG = _ref.atlasIMG,
28329
+ atlasJSON = _ref.atlasJSON,
28330
+ options = _ref.options,
28331
+ onClose = _ref.onClose,
28332
+ onSelect = _ref.onSelect;
28333
+ var _useState = React.useState(),
28334
+ selectedValue = _useState[0],
28335
+ setSelectedValue = _useState[1];
28336
+ var handleClick = function handleClick() {
28337
+ var element = document.querySelector("input[name='test']:checked");
28338
+ var elementValue = element.value;
28339
+ setSelectedValue(elementValue);
28340
+ };
28341
+ React.useEffect(function () {
28342
+ if (selectedValue) {
28343
+ onSelect(selectedValue);
28344
+ }
28345
+ }, [selectedValue]);
28346
+ return React__default.createElement(DraggableContainer, {
28347
+ type: exports.RPGUIContainerTypes.Framed,
28348
+ width: "500px",
28349
+ cancelDrag: ".equipment-container-body .arrow-selector",
28350
+ onCloseButton: function onCloseButton() {
28351
+ if (onClose) {
28352
+ onClose();
28353
+ }
28354
+ }
28355
+ }, React__default.createElement("div", {
28356
+ style: {
28357
+ width: '100%'
28358
+ }
28359
+ }, React__default.createElement(Title$1, null, 'Harvesting instruments'), React__default.createElement(Subtitle, null, 'Use the tool, you need it'), React__default.createElement("hr", {
28360
+ className: "golden"
28361
+ })), React__default.createElement(RadioInputScroller, null, options == null ? void 0 : options.map(function (option, index) {
28362
+ return React__default.createElement(RadioOptionsWrapper, {
28363
+ key: index
28364
+ }, React__default.createElement(SpriteAtlasWrapper, null, React__default.createElement(SpriteFromAtlas, {
28365
+ atlasIMG: atlasIMG,
28366
+ atlasJSON: atlasJSON,
28367
+ spriteKey: option.imageKey,
28368
+ imgScale: 3
28369
+ })), React__default.createElement("div", null, React__default.createElement("input", {
28370
+ className: "rpgui-radio",
28371
+ type: "radio",
28372
+ value: option.name,
28373
+ name: "test"
28374
+ }), React__default.createElement("label", {
28375
+ onClick: handleClick,
28376
+ style: {
28377
+ display: 'flex',
28378
+ alignItems: 'center'
28379
+ }
28380
+ }, option.name, " ", React__default.createElement("br", null), option.description)));
28381
+ })), React__default.createElement(ButtonWrapper, null, React__default.createElement(Button, {
28382
+ buttonType: exports.ButtonTypes.RPGUIButton,
28383
+ onClick: onClose
28384
+ }, "Cancel"), React__default.createElement(Button, {
28385
+ buttonType: exports.ButtonTypes.RPGUIButton
28386
+ }, "Select")));
28387
+ };
28388
+ var Title$1 = /*#__PURE__*/styled.h1.withConfig({
28389
+ displayName: "ItemSelector__Title",
28390
+ componentId: "sc-gptoxp-0"
28391
+ })(["font-size:0.6rem;color:yellow !important;"]);
28392
+ var Subtitle = /*#__PURE__*/styled.h1.withConfig({
28393
+ displayName: "ItemSelector__Subtitle",
28394
+ componentId: "sc-gptoxp-1"
28395
+ })(["font-size:0.4rem;color:yellow !important;"]);
28396
+ var RadioInputScroller = /*#__PURE__*/styled.div.withConfig({
28397
+ displayName: "ItemSelector__RadioInputScroller",
28398
+ componentId: "sc-gptoxp-2"
28399
+ })(["width:100%;margin-top:1rem;align-items:center;margin-left:20px;align-items:flex-start;overflow-y:scroll;height:360px;"]);
28400
+ var SpriteAtlasWrapper = /*#__PURE__*/styled.div.withConfig({
28401
+ displayName: "ItemSelector__SpriteAtlasWrapper",
28402
+ componentId: "sc-gptoxp-3"
28403
+ })(["margin-right:40px;"]);
28404
+ var RadioOptionsWrapper = /*#__PURE__*/styled.div.withConfig({
28405
+ displayName: "ItemSelector__RadioOptionsWrapper",
28406
+ componentId: "sc-gptoxp-4"
28407
+ })(["display:flex;align-items:stretch;margin-bottom:40px;"]);
28408
+ var ButtonWrapper = /*#__PURE__*/styled.div.withConfig({
28409
+ displayName: "ItemSelector__ButtonWrapper",
28410
+ componentId: "sc-gptoxp-5"
28411
+ })(["display:flex;justify-content:space-around;padding-top:20px;width:100%;"]);
28412
+
28314
28413
  var ListMenu = function ListMenu(_ref) {
28315
28414
  var options = _ref.options,
28316
28415
  onSelected = _ref.onSelected,
@@ -28446,7 +28545,7 @@ var QuestInfo = function QuestInfo(_ref) {
28446
28545
  onTouchStart: onRightClick
28447
28546
  }), React__default.createElement(QuestContainer, null, React__default.createElement(TitleContainer$1, {
28448
28547
  className: "drag-handler"
28449
- }, React__default.createElement(Title$1, null, React__default.createElement(Thumbnail, {
28548
+ }, React__default.createElement(Title$2, null, React__default.createElement(Thumbnail, {
28450
28549
  src: quests[currentIndex].thumbnail || img$8
28451
28550
  }), quests[currentIndex].title), React__default.createElement(QuestSplitDiv, null, React__default.createElement("hr", {
28452
28551
  className: "golden"
@@ -28465,7 +28564,7 @@ var QuestInfo = function QuestInfo(_ref) {
28465
28564
  }, button.title);
28466
28565
  })))) : React__default.createElement(QuestsContainer, null, React__default.createElement(QuestContainer, null, React__default.createElement(TitleContainer$1, {
28467
28566
  className: "drag-handler"
28468
- }, React__default.createElement(Title$1, null, React__default.createElement(Thumbnail, {
28567
+ }, React__default.createElement(Title$2, null, React__default.createElement(Thumbnail, {
28469
28568
  src: quests[0].thumbnail || img$8
28470
28569
  }), quests[0].title), React__default.createElement(QuestSplitDiv, null, React__default.createElement("hr", {
28471
28570
  className: "golden"
@@ -28512,7 +28611,7 @@ var TitleContainer$1 = /*#__PURE__*/styled.div.withConfig({
28512
28611
  displayName: "QuestInfo__TitleContainer",
28513
28612
  componentId: "sc-15s2boc-6"
28514
28613
  })(["width:100%;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;margin-top:1rem;"]);
28515
- var Title$1 = /*#__PURE__*/styled.h1.withConfig({
28614
+ var Title$2 = /*#__PURE__*/styled.h1.withConfig({
28516
28615
  displayName: "QuestInfo__Title",
28517
28616
  componentId: "sc-15s2boc-7"
28518
28617
  })(["color:white;z-index:22;font-size:", " !important;color:", " !important;"], uiFonts.size.medium, uiColors.yellow);
@@ -28534,7 +28633,7 @@ var QuestList = function QuestList(_ref) {
28534
28633
  style: {
28535
28634
  width: '100%'
28536
28635
  }
28537
- }, React__default.createElement(Title$2, null, "Quests"), React__default.createElement("hr", {
28636
+ }, React__default.createElement(Title$3, null, "Quests"), React__default.createElement("hr", {
28538
28637
  className: "golden"
28539
28638
  }), React__default.createElement(QuestListContainer, null, quests ? quests.map(function (quest, i) {
28540
28639
  return React__default.createElement("div", {
@@ -28555,7 +28654,7 @@ var QuestDraggableContainer$1 = /*#__PURE__*/styled(DraggableContainer).withConf
28555
28654
  displayName: "QuestList__QuestDraggableContainer",
28556
28655
  componentId: "sc-1a2vx6q-0"
28557
28656
  })([".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;}"]);
28558
- var Title$2 = /*#__PURE__*/styled.h1.withConfig({
28657
+ var Title$3 = /*#__PURE__*/styled.h1.withConfig({
28559
28658
  displayName: "QuestList__Title",
28560
28659
  componentId: "sc-1a2vx6q-1"
28561
28660
  })(["z-index:22;font-size:", " !important;color:yellow !important;"], uiFonts.size.medium);
@@ -28643,6 +28742,26 @@ var Input$1 = /*#__PURE__*/styled.input.withConfig({
28643
28742
  componentId: "sc-v8mte9-0"
28644
28743
  })(["opacity:0;"]);
28645
28744
 
28745
+ var ServerSelection = function ServerSelection(_ref) {
28746
+ var onChange = _ref.onChange,
28747
+ servers = _ref.servers,
28748
+ details = _ref.details;
28749
+ return React__default.createElement("div", null, React__default.createElement("p", null, "Select server"), React__default.createElement(Dropdown, {
28750
+ options: servers.map(function (server, index) {
28751
+ return {
28752
+ option: server.name,
28753
+ value: server.id,
28754
+ id: index
28755
+ };
28756
+ }),
28757
+ onChange: onChange
28758
+ }), React__default.createElement(Details, null, details));
28759
+ };
28760
+ var Details = /*#__PURE__*/styled.p.withConfig({
28761
+ displayName: "ServerSelection__Details",
28762
+ componentId: "sc-ee18vv-0"
28763
+ })(["font-size:", " !important;"], uiFonts.size.xsmall);
28764
+
28646
28765
  var SimpleProgressBar = function SimpleProgressBar(_ref) {
28647
28766
  var value = _ref.value,
28648
28767
  _ref$bgColor = _ref.bgColor,
@@ -28886,7 +29005,7 @@ var TimeWidget = function TimeWidget(_ref) {
28886
29005
  var WidgetContainer = /*#__PURE__*/styled.div.withConfig({
28887
29006
  displayName: "TimeWidget__WidgetContainer",
28888
29007
  componentId: "sc-1ja236h-0"
28889
- })(["background-image:url(", ");background-size:10rem;background-repeat:no-repeat;width:10rem;position:absolute;"], img$c);
29008
+ })(["background-image:url(", ");background-size:10rem;background-repeat:no-repeat;width:10rem;position:absolute;height:100px;"], img$c);
28890
29009
  var Time = /*#__PURE__*/styled.div.withConfig({
28891
29010
  displayName: "TimeWidget__Time",
28892
29011
  componentId: "sc-1ja236h-1"
@@ -29043,7 +29162,7 @@ var TradingMenu = function TradingMenu(_ref) {
29043
29162
  style: {
29044
29163
  width: '100%'
29045
29164
  }
29046
- }, React__default.createElement(Title$3, null, Capitalize(type), " Menu"), React__default.createElement("hr", {
29165
+ }, React__default.createElement(Title$4, null, Capitalize(type), " Menu"), React__default.createElement("hr", {
29047
29166
  className: "golden"
29048
29167
  })), React__default.createElement(TradingComponentScrollWrapper, null, traderItems.map(function (tradeItem, index) {
29049
29168
  var _qtyMap$get;
@@ -29056,7 +29175,7 @@ var TradingMenu = function TradingMenu(_ref) {
29056
29175
  traderItem: tradeItem,
29057
29176
  selectedQty: (_qtyMap$get = qtyMap.get(tradeItem.key)) != null ? _qtyMap$get : 0
29058
29177
  }));
29059
- })), React__default.createElement(GoldWrapper, null, React__default.createElement("p", null, "Available Gold:"), React__default.createElement("p", null, "$", characterAvailableGold)), React__default.createElement(TotalWrapper, null, React__default.createElement("p", null, "Total:"), React__default.createElement("p", null, "$", sum)), !hasGoldForSale() ? React__default.createElement(AlertWrapper, null, React__default.createElement("p", null, " Sorry, not enough money.")) : React__default.createElement(GoldWrapper, null, React__default.createElement("p", null, "Final Gold:"), React__default.createElement("p", null, "$", getFinalGold())), React__default.createElement(ButtonWrapper, null, React__default.createElement(Button, {
29178
+ })), React__default.createElement(GoldWrapper, null, React__default.createElement("p", null, "Available Gold:"), React__default.createElement("p", null, "$", characterAvailableGold)), React__default.createElement(TotalWrapper, null, React__default.createElement("p", null, "Total:"), React__default.createElement("p", null, "$", sum)), !hasGoldForSale() ? React__default.createElement(AlertWrapper, null, React__default.createElement("p", null, " Sorry, not enough money.")) : React__default.createElement(GoldWrapper, null, React__default.createElement("p", null, "Final Gold:"), React__default.createElement("p", null, "$", getFinalGold())), React__default.createElement(ButtonWrapper$1, null, React__default.createElement(Button, {
29060
29179
  buttonType: exports.ButtonTypes.RPGUIButton,
29061
29180
  disabled: !hasGoldForSale(),
29062
29181
  onClick: function onClick() {
@@ -29069,7 +29188,7 @@ var TradingMenu = function TradingMenu(_ref) {
29069
29188
  }
29070
29189
  }, "Cancel"))));
29071
29190
  };
29072
- var Title$3 = /*#__PURE__*/styled.h1.withConfig({
29191
+ var Title$4 = /*#__PURE__*/styled.h1.withConfig({
29073
29192
  displayName: "TradingMenu__Title",
29074
29193
  componentId: "sc-1wjsz1l-0"
29075
29194
  })(["z-index:22;font-size:0.6rem;color:yellow !important;"]);
@@ -29093,7 +29212,7 @@ var AlertWrapper = /*#__PURE__*/styled.div.withConfig({
29093
29212
  displayName: "TradingMenu__AlertWrapper",
29094
29213
  componentId: "sc-1wjsz1l-5"
29095
29214
  })(["margin-top:1rem;display:flex;width:100%;justify-content:center;height:20px;p{color:red !important;}"]);
29096
- var ButtonWrapper = /*#__PURE__*/styled.div.withConfig({
29215
+ var ButtonWrapper$1 = /*#__PURE__*/styled.div.withConfig({
29097
29216
  displayName: "TradingMenu__ButtonWrapper",
29098
29217
  componentId: "sc-1wjsz1l-6"
29099
29218
  })(["display:flex;justify-content:space-around;padding-top:20px;width:100%;margin-top:1rem;"]);
@@ -29126,6 +29245,7 @@ exports.HistoryDialog = HistoryDialog;
29126
29245
  exports.Input = Input;
29127
29246
  exports.InputRadio = InputRadio;
29128
29247
  exports.ItemContainer = ItemContainer;
29248
+ exports.ItemSelector = ItemSelector;
29129
29249
  exports.ItemSlot = ItemSlot;
29130
29250
  exports.ListMenu = ListMenu;
29131
29251
  exports.NPCDialog = NPCDialog;
@@ -29138,6 +29258,7 @@ exports.QuestionDialog = QuestionDialog;
29138
29258
  exports.RPGUIContainer = RPGUIContainer;
29139
29259
  exports.RPGUIRoot = RPGUIRoot;
29140
29260
  exports.RangeSlider = RangeSlider;
29261
+ exports.ServerSelection = ServerSelection;
29141
29262
  exports.SkillProgressBar = SkillProgressBar;
29142
29263
  exports.SkillsContainer = SkillsContainer;
29143
29264
  exports.SpriteFromAtlas = SpriteFromAtlas;