@rpg-engine/long-bow 0.2.62 → 0.2.64

package/dist/components/DropdownSelectorContainer.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IDropdownSelectorOption {
+    id: string;
+    name: string;
+}
+export interface IDropdownSelectorContainer {
+    onChange: (id: string) => void;
+    options: IDropdownSelectorOption[];
+    details?: string;
+    title: string;
+}
+export declare const DropdownSelectorContainer: React.FC<IDropdownSelectorContainer>;
+export {};

package/dist/components/RadioInput/RadioButton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface IRadioProps {
+    title: string;
+    subtitle: string;
+    instrument: string | null;
+    setInstrument: (value: string) => void;
+}
+export declare const RadioButton: React.FC<IRadioProps>;

package/dist/components/RadioInput/RadioInput.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface IRadioItems {
+    title: string;
+    subtitle: string;
+}
+export interface IRadioInput {
+    title: string;
+    subtitle: string;
+    onSelect: (a: string) => void;
+    onCancel: () => void;
+    items: IRadioItems[];
+}
+export declare const RadioInput: React.FC<IRadioInput>;

package/dist/components/RadioInput/instruments.d.ts

@@ -0,0 +1,4 @@
+export declare const Itools: {
+    title: string;
+    subtitle: string;
+}[];

package/dist/components/itemSelector/ItemSelector.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+export interface IOptionsItemSelectorProps {
+    name: string;
+    description: string;
+    imageKey: string;
+}
+export interface IItemSelectorProps {
+    atlasJSON: any;
+    atlasIMG: any;
+    options: IOptionsItemSelectorProps[];
+    onClose: () => void;
+    onSelect: (value: string) => void;
+}
+export declare const ItemSelector: React.FC<IItemSelectorProps>;

package/dist/index.d.ts

@@ -4,6 +4,7 @@ export * from './components/Chat/Chat';
 export * from './components/CheckButton';
 export * from './components/DraggableContainer';
 export * from './components/Dropdown';
+export * from './components/DropdownSelectorContainer';
 export * from './components/Equipment/EquipmentSet';
 export * from './components/HistoryDialog';
 export * from './components/Input';
@@ -17,16 +18,17 @@ export * from './components/ProgressBar';
 export * from './components/PropertySelect/PropertySelect';
 export * from './components/QuestInfo/QuestInfo';
 export * from './components/QuestList';
-export * from './components/RadioButton';
-export * from './components/RangeSlider';
 export * from './components/RPGUIContainer';
 export * from './components/RPGUIRoot';
-export * from './components/shared/SpriteFromAtlas';
+export * from './components/RadioButton';
+export * from './components/RangeSlider';
 export * from './components/SkillProgressBar';
 export * from './components/SkillsContainer';
 export * from './components/TextArea';
 export * from './components/TimeWidget/TimeWidget';
 export * from './components/TradingMenu/TradingMenu';
 export * from './components/Truncate';
+export * from './components/itemSelector/ItemSelector';
+export * from './components/shared/SpriteFromAtlas';
 export * from './components/typography/DynamicText';
 export { useEventListener } from './hooks/useEventListener';

package/dist/long-bow.cjs.development.js

@@ -27269,7 +27269,7 @@ var Dropdown = function Dropdown(_ref) {
     setOpened = _useState3[1];
   React.useEffect(function () {
     var firstOption = options[0];
-    if (firstOption) {
+    if (firstOption && !selectedValue) {
       setSelectedValue(firstOption.value);
       setSelectedOption(firstOption.option);
     }
@@ -27323,6 +27323,27 @@ var DropdownOptions = /*#__PURE__*/styled.ul.withConfig({
   return props.opened ? 'block' : 'none';
 });
 
+var DropdownSelectorContainer = function DropdownSelectorContainer(_ref) {
+  var title = _ref.title,
+    onChange = _ref.onChange,
+    options = _ref.options,
+    details = _ref.details;
+  return React__default.createElement("div", null, React__default.createElement("p", null, title), React__default.createElement(Dropdown, {
+    options: options.map(function (option, index) {
+      return {
+        option: option.name,
+        value: option.id,
+        id: index
+      };
+    }),
+    onChange: onChange
+  }), React__default.createElement(Details, null, details));
+};
+var Details = /*#__PURE__*/styled.p.withConfig({
+  displayName: "DropdownSelectorContainer__Details",
+  componentId: "sc-kaa0h9-0"
+})(["font-size:", " !important;"], uiFonts.size.xsmall);
+
 var RelativeListMenu = function RelativeListMenu(_ref) {
   var options = _ref.options,
     onSelected = _ref.onSelected,
@@ -27770,7 +27791,20 @@ var NPCDialogText = function NPCDialogText(_ref) {
     onClose = _ref.onClose,
     onEndStep = _ref.onEndStep,
     onStartStep = _ref.onStartStep;
-  var textChunks = chunkString(text, 200);
+  var windowSize = React.useRef([window.innerWidth, window.innerHeight]);
+  function maxCharacters(width) {
+    // Set the font size to 16 pixels
+    var fontSize = 11.2;
+    // Calculate the number of characters that can fit in one line
+    var charactersPerLine = Math.floor(width / 2 / fontSize);
+    // Calculate the number of lines that can fit in the div
+    var linesPerDiv = Math.floor(180 / fontSize);
+    // Calculate the maximum number of characters that can fit in the div
+    var maxCharacters = charactersPerLine * linesPerDiv;
+    // Return the maximum number of characters
+    return Math.round(maxCharacters / 5);
+  }
+  var textChunks = chunkString(text, maxCharacters(windowSize.current[0]));
   var _useState = React.useState(0),
     chunkIndex = _useState[0],
     setChunkIndex = _useState[1];
@@ -28568,6 +28602,15 @@ var NoQuestContainer = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-1a2vx6q-3"
 })(["text-align:center;p{margin-top:5px;}"]);
 
+//@ts-ignore
+var _RPGUI = RPGUI;
+var RPGUIRoot = function RPGUIRoot(_ref) {
+  var children = _ref.children;
+  return React__default.createElement("div", {
+    className: "rpgui-content"
+  }, children);
+};
+
 var InputRadio = function InputRadio(_ref) {
   var name = _ref.name,
     items = _ref.items,
@@ -28600,15 +28643,6 @@ var InputRadio = function InputRadio(_ref) {
   }));
 };
 
-//@ts-ignore
-var _RPGUI = RPGUI;
-var RPGUIRoot = function RPGUIRoot(_ref) {
-  var children = _ref.children;
-  return React__default.createElement("div", {
-    className: "rpgui-content"
-  }, children);
-};
-
 (function (RangeSliderType) {
   RangeSliderType["Slider"] = "rpgui-slider";
   RangeSliderType["GoldSlider"] = "rpgui-slider golden";
@@ -28886,7 +28920,7 @@ var TimeWidget = function TimeWidget(_ref) {
 var WidgetContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "TimeWidget__WidgetContainer",
   componentId: "sc-1ja236h-0"
-})(["background-image:url(", ");background-size:10rem;background-repeat:no-repeat;width:10rem;position:absolute;"], img$c);
+})(["background-image:url(", ");background-size:10rem;background-repeat:no-repeat;width:10rem;position:absolute;height:100px;"], img$c);
 var Time = /*#__PURE__*/styled.div.withConfig({
   displayName: "TimeWidget__Time",
   componentId: "sc-1ja236h-1"
@@ -29114,18 +29148,106 @@ var Container$i = /*#__PURE__*/styled.div.withConfig({
   return props.maxLines;
 });
 
+var ItemSelector = function ItemSelector(_ref) {
+  var atlasIMG = _ref.atlasIMG,
+    atlasJSON = _ref.atlasJSON,
+    options = _ref.options,
+    onClose = _ref.onClose,
+    onSelect = _ref.onSelect;
+  var _useState = React.useState(),
+    selectedValue = _useState[0],
+    setSelectedValue = _useState[1];
+  var handleClick = function handleClick() {
+    var element = document.querySelector("input[name='test']:checked");
+    var elementValue = element.value;
+    setSelectedValue(elementValue);
+  };
+  React.useEffect(function () {
+    if (selectedValue) {
+      onSelect(selectedValue);
+    }
+  }, [selectedValue]);
+  return React__default.createElement(DraggableContainer, {
+    type: exports.RPGUIContainerTypes.Framed,
+    width: "500px",
+    cancelDrag: ".equipment-container-body .arrow-selector",
+    onCloseButton: function onCloseButton() {
+      if (onClose) {
+        onClose();
+      }
+    }
+  }, React__default.createElement("div", {
+    style: {
+      width: '100%'
+    }
+  }, React__default.createElement(Title$4, null, 'Harvesting instruments'), React__default.createElement(Subtitle, null, 'Use the tool, you need it'), React__default.createElement("hr", {
+    className: "golden"
+  })), React__default.createElement(RadioInputScroller, null, options == null ? void 0 : options.map(function (option, index) {
+    return React__default.createElement(RadioOptionsWrapper, {
+      key: index
+    }, React__default.createElement(SpriteAtlasWrapper, null, React__default.createElement(SpriteFromAtlas, {
+      atlasIMG: atlasIMG,
+      atlasJSON: atlasJSON,
+      spriteKey: option.imageKey,
+      imgScale: 3
+    })), React__default.createElement("div", null, React__default.createElement("input", {
+      className: "rpgui-radio",
+      type: "radio",
+      value: option.name,
+      name: "test"
+    }), React__default.createElement("label", {
+      onClick: handleClick,
+      style: {
+        display: 'flex',
+        alignItems: 'center'
+      }
+    }, option.name, " ", React__default.createElement("br", null), option.description)));
+  })), React__default.createElement(ButtonWrapper$1, null, React__default.createElement(Button, {
+    buttonType: exports.ButtonTypes.RPGUIButton,
+    onClick: onClose
+  }, "Cancel"), React__default.createElement(Button, {
+    buttonType: exports.ButtonTypes.RPGUIButton
+  }, "Select")));
+};
+var Title$4 = /*#__PURE__*/styled.h1.withConfig({
+  displayName: "ItemSelector__Title",
+  componentId: "sc-gptoxp-0"
+})(["font-size:0.6rem;color:yellow !important;"]);
+var Subtitle = /*#__PURE__*/styled.h1.withConfig({
+  displayName: "ItemSelector__Subtitle",
+  componentId: "sc-gptoxp-1"
+})(["font-size:0.4rem;color:yellow !important;"]);
+var RadioInputScroller = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ItemSelector__RadioInputScroller",
+  componentId: "sc-gptoxp-2"
+})(["width:100%;margin-top:1rem;align-items:center;margin-left:20px;align-items:flex-start;overflow-y:scroll;height:360px;"]);
+var SpriteAtlasWrapper = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ItemSelector__SpriteAtlasWrapper",
+  componentId: "sc-gptoxp-3"
+})(["margin-right:40px;"]);
+var RadioOptionsWrapper = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ItemSelector__RadioOptionsWrapper",
+  componentId: "sc-gptoxp-4"
+})(["display:flex;align-items:stretch;margin-bottom:40px;"]);
+var ButtonWrapper$1 = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ItemSelector__ButtonWrapper",
+  componentId: "sc-gptoxp-5"
+})(["display:flex;justify-content:space-around;padding-top:20px;width:100%;"]);
+
 exports.Button = Button;
 exports.CharacterSelection = CharacterSelection;
 exports.Chat = Chat;
 exports.CheckButton = CheckButton;
 exports.DraggableContainer = DraggableContainer;
 exports.Dropdown = Dropdown;
+exports.DropdownSelectorContainer = DropdownSelectorContainer;
 exports.DynamicText = DynamicText;
 exports.EquipmentSet = EquipmentSet;
 exports.HistoryDialog = HistoryDialog;
 exports.Input = Input;
 exports.InputRadio = InputRadio;
 exports.ItemContainer = ItemContainer;
+exports.ItemSelector = ItemSelector;
 exports.ItemSlot = ItemSlot;
 exports.ListMenu = ListMenu;
 exports.NPCDialog = NPCDialog;