@rpg-engine/long-bow 0.4.97 → 0.4.99

package/dist/long-bow.esm.js

@@ -15136,6 +15136,92 @@ var DialogContainer = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-u6oe75-1"
 })(["display:flex;justify-content:center;padding-top:200px;"]);
 
+var ImageCarousel = function ImageCarousel(_ref) {
+  var _textImageSelected$te, _textImageSelected$te2;
+  var textImage = _ref.textImage,
+    isTextFixed = _ref.isTextFixed;
+  var _useState = useState(textImage[0]),
+    textImageSelected = _useState[0],
+    setTextImageSelected = _useState[1];
+  var goToPreviousImage = function goToPreviousImage() {
+    var currentIndex = textImage.indexOf(textImageSelected);
+    if (currentIndex > 0) {
+      setTextImageSelected(textImage[currentIndex - 1]);
+    }
+  };
+  var goToNextImage = function goToNextImage() {
+    var currentIndex = textImage.indexOf(textImageSelected);
+    if (currentIndex < textImage.length - 1) {
+      setTextImageSelected(textImage[currentIndex + 1]);
+    }
+  };
+  return React.createElement(CarouselWrapper, {
+    type: RPGUIContainerTypes.Framed
+  }, isTextFixed ? React.createElement(React.Fragment, null, React.createElement(BackgroundImage, {
+    imagePath: textImageSelected.image,
+    isTextFixed: isTextFixed
+  }, React.createElement(ArrowContainer, null, textImageSelected !== textImage[0] && React.createElement(SelectArrow, {
+    direction: "left",
+    onPointerDown: function onPointerDown() {
+      return goToPreviousImage();
+    }
+  }), textImageSelected !== textImage[textImage.length - 1] && React.createElement(SelectArrow, {
+    direction: "right",
+    onPointerDown: function onPointerDown() {
+      return goToNextImage();
+    }
+  }))), React.createElement(Description$1, {
+    textPosition: (_textImageSelected$te = textImageSelected.textPosition) != null ? _textImageSelected$te : 'flex-start',
+    isTextFixed: isTextFixed
+  }, React.createElement(DynamicText, {
+    text: textImageSelected.text
+  }))) : React.createElement(BackgroundImage, {
+    imagePath: textImageSelected.image,
+    isTextFixed: isTextFixed
+  }, React.createElement(ArrowContainer, null, textImageSelected !== textImage[0] && React.createElement(SelectArrow, {
+    direction: "left",
+    onPointerDown: function onPointerDown() {
+      return goToPreviousImage();
+    }
+  }), React.createElement(Description$1, {
+    textPosition: (_textImageSelected$te2 = textImageSelected.textPosition) != null ? _textImageSelected$te2 : 'flex-start',
+    isTextFixed: isTextFixed
+  }, React.createElement(DynamicText, {
+    text: textImageSelected.text
+  })), textImageSelected !== textImage[textImage.length - 1] && React.createElement(SelectArrow, {
+    direction: "right",
+    onPointerDown: function onPointerDown() {
+      return goToNextImage();
+    }
+  }))));
+};
+var CarouselWrapper = /*#__PURE__*/styled(DraggableContainer).withConfig({
+  displayName: "ImageCarousel__CarouselWrapper",
+  componentId: "sc-jl6f8-0"
+})(["width:100%;height:100%;"]);
+var ArrowContainer = /*#__PURE__*/styled.span.withConfig({
+  displayName: "ImageCarousel__ArrowContainer",
+  componentId: "sc-jl6f8-1"
+})(["display:flex;height:100%;align-items:center;"]);
+var BackgroundImage = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ImageCarousel__BackgroundImage",
+  componentId: "sc-jl6f8-2"
+})(["background-image:url(", ");background-repeat:no-repeat;background-attachment:fixed;background-size:cover;width:100%;height:", ";"], function (props) {
+  return props.imagePath;
+}, function (props) {
+  return props.isTextFixed ? '80%' : '100%';
+});
+var Description$1 = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ImageCarousel__Description",
+  componentId: "sc-jl6f8-3"
+})(["width:100%;height:", ";display:flex;align-items:", ";p{background-color:", ";border-radius:5px;text-align:justify;height:auto;}"], function (props) {
+  return props.isTextFixed ? 'auto' : '100%';
+}, function (props) {
+  return props.textPosition;
+}, function (props) {
+  return props.isTextFixed ? 'none' : 'rgba(0, 0, 0, 0.6)';
+});
+
 var SlotsContainer = function SlotsContainer(_ref) {
   var children = _ref.children,
     title = _ref.title,
@@ -17300,7 +17386,7 @@ var SpellInfo = function SpellInfo(_ref) {
     className: "label"
   }, "Required Item:"), React.createElement("div", {
     className: "value"
-  }, requiredItem))), React.createElement(Description$1, null, description));
+  }, requiredItem))), React.createElement(Description$2, null, description));
 };
 var Container$o = /*#__PURE__*/styled.div.withConfig({
   displayName: "SpellInfo__Container",
@@ -17314,7 +17400,7 @@ var Type$1 = /*#__PURE__*/styled.div.withConfig({
   displayName: "SpellInfo__Type",
   componentId: "sc-4hbw3q-2"
 })(["font-size:", ";margin-top:0.2rem;color:", ";"], uiFonts.size.small, uiColors.lightGray);
-var Description$1 = /*#__PURE__*/styled.div.withConfig({
+var Description$2 = /*#__PURE__*/styled.div.withConfig({
   displayName: "SpellInfo__Description",
   componentId: "sc-4hbw3q-3"
 })(["margin-top:1.5rem;font-size:", ";color:", ";font-style:italic;"], uiFonts.size.small, uiColors.lightGray);
@@ -17490,7 +17576,7 @@ var Spell = function Spell(_ref) {
     return word[0];
   })), React.createElement(Info, null, React.createElement(Title$a, null, React.createElement("span", null, name), React.createElement("span", {
     className: "spell"
-  }, "(", magicWords, ")")), React.createElement(Description$2, null, description)), React.createElement(Divider, null), React.createElement(Cost, null, React.createElement("span", null, "Mana cost:"), React.createElement("span", {
+  }, "(", magicWords, ")")), React.createElement(Description$3, null, description)), React.createElement(Divider, null), React.createElement(Cost, null, React.createElement("span", null, "Mana cost:"), React.createElement("span", {
     className: "mana"
   }, manaCost))));
 };
@@ -17513,7 +17599,7 @@ var Title$a = /*#__PURE__*/styled.p.withConfig({
   displayName: "Spell__Title",
   componentId: "sc-j96fa2-3"
 })(["display:flex;flex-wrap:wrap;align-items:center;margin-bottom:5px;margin:0;span{font-size:", " !important;font-weight:bold !important;color:", " !important;margin-right:0.5rem;}.spell{font-size:", " !important;font-weight:normal !important;color:", " !important;}"], uiFonts.size.medium, uiColors.yellow, uiFonts.size.small, uiColors.lightGray);
-var Description$2 = /*#__PURE__*/styled.div.withConfig({
+var Description$3 = /*#__PURE__*/styled.div.withConfig({
   displayName: "Spell__Description",
   componentId: "sc-j96fa2-4"
 })(["font-size:", " !important;line-height:1.1 !important;"], uiFonts.size.small);
@@ -18003,5 +18089,5 @@ var ButtonWrapper$3 = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-gptoxp-5"
 })(["display:flex;justify-content:space-around;padding-top:20px;width:100%;"]);
 
-export { Button, ButtonTypes, CharacterSelection, Chat, ChatDeprecated, CheckButton, CircularController, CraftBook, DraggableContainer, Dropdown, DropdownSelectorContainer, DynamicText, EquipmentSet, EquipmentSlotSpriteByType, ErrorBoundary, HistoryDialog, ImgSide, Input, InputRadio$1 as InputRadio, ItemContainer$1 as ItemContainer, ItemSelector, ItemSlot, ListMenu, Marketplace, MarketplaceRows, NPCDialog, NPCDialogType, NPCMultiDialog, PartyCreate, PartyDashboard, PartyInvite, PartyManager, PartyManagerRow, PartyRow, PlayersRow, ProgressBar, PropertySelect, QuestInfo, QuestList, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, Shortcuts, SkillProgressBar, SkillsContainer, Spellbook, SpriteFromAtlas, TextArea, TimeWidget, TradingMenu, Truncate, _RPGUI, mockedPartyManager, mockedPartyRows, mockedPlayersRows, mockedPlayersRows2, rarityColor, useEventListener };
+export { Button, ButtonTypes, CharacterSelection, Chat, ChatDeprecated, CheckButton, CircularController, CraftBook, DraggableContainer, Dropdown, DropdownSelectorContainer, DynamicText, EquipmentSet, EquipmentSlotSpriteByType, ErrorBoundary, HistoryDialog, ImageCarousel, ImgSide, Input, InputRadio$1 as InputRadio, ItemContainer$1 as ItemContainer, ItemSelector, ItemSlot, ListMenu, Marketplace, MarketplaceRows, NPCDialog, NPCDialogType, NPCMultiDialog, PartyCreate, PartyDashboard, PartyInvite, PartyManager, PartyManagerRow, PartyRow, PlayersRow, ProgressBar, PropertySelect, QuestInfo, QuestList, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, Shortcuts, SkillProgressBar, SkillsContainer, Spellbook, SpriteFromAtlas, TextArea, TimeWidget, TradingMenu, Truncate, _RPGUI, mockedPartyManager, mockedPartyRows, mockedPlayersRows, mockedPlayersRows2, rarityColor, useEventListener };
 //# sourceMappingURL=long-bow.esm.js.map