@rpg-engine/long-bow 0.2.15 → 0.2.17

package/dist/components/HistoryDialog.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { NPCMultiDialogType } from './NPCDialog/NPCMultiDialog';
+import { IQuestionDialog, IQuestionDialogAnswer } from './NPCDialog/QuestionDialog/QuestionDialog';
+export interface IHistoryDialogProps {
+    backgroundImgPath: string;
+    fullCoverBackground: boolean;
+    questions?: IQuestionDialog[];
+    answers?: IQuestionDialogAnswer[];
+    text?: string;
+    imagePath?: string;
+    textAndTypeArray?: NPCMultiDialogType[];
+    onClose: () => void;
+}
+export declare const HistoryDialog: React.FC<IHistoryDialogProps>;

package/dist/components/NPCDialog/NPCMultiDialog.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+export declare enum ImgSide {
+    right = "right",
+    left = "left"
+}
+export interface NPCMultiDialogType {
+    text: string;
+    imagePath?: string;
+    imageSide: ImgSide;
+}
+export interface INPCMultiDialogProps {
+    onClose: () => void;
+    textAndTypeArray: NPCMultiDialogType[];
+}
+export declare const NPCMultiDialog: React.FC<INPCMultiDialogProps>;

package/dist/components/QuestList.d.ts

@@ -1,11 +1,7 @@
+import { IQuest } from '@rpg-engine/shared';
 import React from 'react';
 export interface IQuestListProps {
-    title: string;
-    description: string;
-    quests: {
-        title: string;
-        description: string;
-        completed: boolean;
-    }[];
+    quests: IQuest[];
+    onClose: () => void;
 }
 export declare const QuestList: React.FC<IQuestListProps>;

package/dist/index.d.ts

@@ -14,6 +14,7 @@ export * from './components/NPCDialog/QuestionDialog/QuestionDialog';
 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';
@@ -24,4 +25,6 @@ export * from './components/SkillsContainer';
 export * from './components/TextArea';
 export * from './components/Truncate';
 export * from './components/typography/DynamicText';
+export * from './components/NPCDialog/NPCMultiDialog';
+export * from './components/HistoryDialog';
 export { useEventListener } from './hooks/useEventListener';

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

@@ -28366,6 +28366,49 @@ var RightArrow$1 = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-15s2boc-10"
 })(["background-image:url(", ");right:0;position:absolute;width:40px;background-size:100% 100%;height:42px;:active{background-image:url(", ");}"], img$4, img$3);
 
+var QuestList = function QuestList(_ref) {
+  var quests = _ref.quests,
+      onClose = _ref.onClose;
+  return React__default.createElement(QuestDraggableContainer$1, {
+    type: exports.RPGUIContainerTypes.Framed,
+    onCloseButton: function onCloseButton() {
+      if (onClose) onClose();
+    },
+    width: "520px"
+  }, React__default.createElement("div", {
+    style: {
+      width: '100%'
+    }
+  }, React__default.createElement(Title$2, null, "Quests"), React__default.createElement("hr", {
+    className: "golden"
+  }), React__default.createElement(QuestListContainer, null, quests.map(function (quest, i) {
+    return React__default.createElement("div", {
+      className: "quest-item",
+      key: i
+    }, React__default.createElement("span", {
+      className: "quest-number"
+    }, i + 1), React__default.createElement("div", {
+      className: "quest-detail"
+    }, React__default.createElement("p", {
+      className: "quest-detail__title"
+    }, quest.title), React__default.createElement("p", {
+      className: "quest-detail__description"
+    }, quest.description)));
+  }))));
+};
+var QuestDraggableContainer$1 = /*#__PURE__*/styled(DraggableContainer).withConfig({
+  displayName: "QuestList__QuestDraggableContainer",
+  componentId: "sc-1a2vx6q-0"
+})([".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;}"]);
+var Title$2 = /*#__PURE__*/styled.h1.withConfig({
+  displayName: "QuestList__Title",
+  componentId: "sc-1a2vx6q-1"
+})(["z-index:22;font-size:0.6rem;color:yellow !important;"]);
+var QuestListContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "QuestList__QuestListContainer",
+  componentId: "sc-1a2vx6q-2"
+})(["margin-top:20px;margin-bottom:40px;overflow-y:auto;max-height:400px;.quest-item{display:flex;align-items:flex-start;margin-bottom:12px;}.quest-number{border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;margin-right:16px;background-color:brown;flex-shrink:0;}.quest-number.completed{background-color:yellow;}p{margin:0;}.quest-detail__title{color:yellow;}.quest-detail__description{margin-top:5px;}"]);
+
 var InputRadio = function InputRadio(_ref) {
   var name = _ref.name,
       items = _ref.items,
@@ -28673,6 +28716,160 @@ var Container$f = /*#__PURE__*/styled.div.withConfig({
   return props.maxLines;
 });
 
+(function (ImgSide) {
+  ImgSide["right"] = "right";
+  ImgSide["left"] = "left";
+})(exports.ImgSide || (exports.ImgSide = {}));
+
+var NPCMultiDialog = function NPCMultiDialog(_ref) {
+  var _textAndTypeArray$sli;
+
+  var _onClose = _ref.onClose,
+      textAndTypeArray = _ref.textAndTypeArray;
+
+  var _useState = React.useState(false),
+      showGoNextIndicator = _useState[0],
+      setShowGoNextIndicator = _useState[1];
+
+  var _useState2 = React.useState(0),
+      slide = _useState2[0],
+      setSlide = _useState2[1];
+
+  var onHandleSpacePress = function onHandleSpacePress(event) {
+    if (event.code === 'Space') {
+      if (slide < (textAndTypeArray == null ? void 0 : textAndTypeArray.length) - 1) {
+        setSlide(function (prev) {
+          return prev + 1;
+        });
+      } else {
+        // if there's no more text chunks, close the dialog
+        _onClose();
+      }
+    }
+  };
+
+  React.useEffect(function () {
+    document.addEventListener('keydown', onHandleSpacePress);
+    return function () {
+      return document.removeEventListener('keydown', onHandleSpacePress);
+    };
+  }, [slide]);
+  return React__default.createElement(RPGUIContainer, {
+    type: exports.RPGUIContainerTypes.FramedGold,
+    width: '50%',
+    height: '180px'
+  }, React__default.createElement(React__default.Fragment, null, React__default.createElement(Container$g, null, ((_textAndTypeArray$sli = textAndTypeArray[slide]) == null ? void 0 : _textAndTypeArray$sli.imageSide) === 'right' && React__default.createElement(React__default.Fragment, null, React__default.createElement(TextContainer$2, {
+    flex: '70%'
+  }, React__default.createElement(NPCDialogText, {
+    onStartStep: function onStartStep() {
+      return setShowGoNextIndicator(false);
+    },
+    onEndStep: function onEndStep() {
+      return setShowGoNextIndicator(true);
+    },
+    text: textAndTypeArray[slide].text || 'No text provided.',
+    onClose: function onClose() {
+      if (_onClose) {
+        _onClose();
+      }
+    }
+  })), React__default.createElement(ThumbnailContainer$1, null, React__default.createElement(NPCThumbnail$1, {
+    src: textAndTypeArray[slide].imagePath || img$6
+  })), showGoNextIndicator && React__default.createElement(PressSpaceIndicator$1, {
+    right: '10.5rem',
+    src: img$7
+  })), textAndTypeArray[slide].imageSide === 'left' && React__default.createElement(React__default.Fragment, null, React__default.createElement(ThumbnailContainer$1, null, React__default.createElement(NPCThumbnail$1, {
+    src: textAndTypeArray[slide].imagePath || img$6
+  })), React__default.createElement(TextContainer$2, {
+    flex: '70%'
+  }, React__default.createElement(NPCDialogText, {
+    onStartStep: function onStartStep() {
+      return setShowGoNextIndicator(false);
+    },
+    onEndStep: function onEndStep() {
+      return setShowGoNextIndicator(true);
+    },
+    text: textAndTypeArray[slide].text || 'No text provided.',
+    onClose: function onClose() {
+      if (_onClose) {
+        _onClose();
+      }
+    }
+  })), showGoNextIndicator && React__default.createElement(PressSpaceIndicator$1, {
+    right: '1rem',
+    src: img$7
+  }))), ")"));
+};
+var Container$g = /*#__PURE__*/styled.div.withConfig({
+  displayName: "NPCMultiDialog__Container",
+  componentId: "sc-rvu5wg-0"
+})(["display:flex;width:100%;height:100%;box-sizing:border-box;justify-content:center;align-items:flex-start;position:relative;"]);
+var TextContainer$2 = /*#__PURE__*/styled.div.withConfig({
+  displayName: "NPCMultiDialog__TextContainer",
+  componentId: "sc-rvu5wg-1"
+})(["flex:", " 0 0;width:355px;"], function (_ref2) {
+  var flex = _ref2.flex;
+  return flex;
+});
+var ThumbnailContainer$1 = /*#__PURE__*/styled.div.withConfig({
+  displayName: "NPCMultiDialog__ThumbnailContainer",
+  componentId: "sc-rvu5wg-2"
+})(["flex:30% 0 0;display:flex;justify-content:flex-end;"]);
+var NPCThumbnail$1 = /*#__PURE__*/styled.img.withConfig({
+  displayName: "NPCMultiDialog__NPCThumbnail",
+  componentId: "sc-rvu5wg-3"
+})(["image-rendering:pixelated;height:128px;width:128px;"]);
+var PressSpaceIndicator$1 = /*#__PURE__*/styled.img.withConfig({
+  displayName: "NPCMultiDialog__PressSpaceIndicator",
+  componentId: "sc-rvu5wg-4"
+})(["position:absolute;right:", ";bottom:1rem;height:20.7px;image-rendering:-webkit-optimize-contrast;"], function (_ref3) {
+  var right = _ref3.right;
+  return right;
+});
+
+var HistoryDialog = function HistoryDialog(_ref) {
+  var backgroundImgPath = _ref.backgroundImgPath,
+      fullCoverBackground = _ref.fullCoverBackground,
+      questions = _ref.questions,
+      answers = _ref.answers,
+      text = _ref.text,
+      imagePath = _ref.imagePath,
+      textAndTypeArray = _ref.textAndTypeArray,
+      onClose = _ref.onClose;
+  return React__default.createElement(BackgroundContainer, {
+    imgPath: backgroundImgPath,
+    fullImg: fullCoverBackground
+  }, React__default.createElement(DialogContainer, null, textAndTypeArray ? React__default.createElement(NPCMultiDialog, {
+    textAndTypeArray: textAndTypeArray,
+    onClose: onClose
+  }) : questions && answers ? React__default.createElement(QuestionDialog, {
+    questions: questions,
+    answers: answers,
+    onClose: onClose
+  }) : text && imagePath ? React__default.createElement(NPCDialog, {
+    text: text,
+    imagePath: imagePath,
+    onClose: onClose,
+    type: exports.NPCDialogType.TextAndThumbnail
+  }) : React__default.createElement(NPCDialog, {
+    text: text,
+    onClose: onClose,
+    type: exports.NPCDialogType.TextOnly
+  })));
+};
+var BackgroundContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "HistoryDialog__BackgroundContainer",
+  componentId: "sc-u6oe75-0"
+})(["width:100%;height:100%;background-image:url(", ");background-size:", ";display:flex;justify-content:space-evenly;align-items:center;"], function (props) {
+  return props.imgPath;
+}, function (props) {
+  return props.imgPath ? 'cover' : 'auto';
+});
+var DialogContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "HistoryDialog__DialogContainer",
+  componentId: "sc-u6oe75-1"
+})(["display:flex;justify-content:center;padding-top:200px;"]);
+
 exports.Button = Button;
 exports.CharacterSelection = CharacterSelection;
 exports.Chat = Chat;
@@ -28681,15 +28878,18 @@ exports.DraggableContainer = DraggableContainer;
 exports.Dropdown = Dropdown;
 exports.DynamicText = DynamicText;
 exports.EquipmentSet = EquipmentSet;
+exports.HistoryDialog = HistoryDialog;
 exports.Input = Input;
 exports.InputRadio = InputRadio;
 exports.ItemContainer = ItemContainer;
 exports.ItemSlot = ItemSlot;
 exports.ListMenu = ListMenu;
 exports.NPCDialog = NPCDialog;
+exports.NPCMultiDialog = NPCMultiDialog;
 exports.ProgressBar = ProgressBar;
 exports.PropertySelect = PropertySelect;
 exports.QuestInfo = QuestInfo;
+exports.QuestList = QuestList;
 exports.QuestionDialog = QuestionDialog;
 exports.RPGUIContainer = RPGUIContainer;
 exports.RPGUIRoot = RPGUIRoot;