@rpg-engine/long-bow 0.8.130 → 0.8.133
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/Store/PaymentMethodModal.d.ts +8 -0
- package/dist/components/Store/Store.d.ts +3 -0
- package/dist/index.d.ts +1 -0
- package/dist/long-bow.cjs.development.js +78 -10
- 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 +79 -12
- package/dist/long-bow.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Store/PaymentMethodModal.tsx +140 -0
- package/src/components/Store/Store.tsx +22 -7
- package/src/components/Store/StoreItemDetails.tsx +1 -0
- package/src/components/Store/StoreItemRow.tsx +4 -1
- package/src/index.tsx +1 -0
- package/src/stories/Features/store/Store.stories.tsx +2 -0
package/dist/long-bow.esm.js
CHANGED
|
@@ -5,7 +5,7 @@ import { v4 } from 'uuid';
|
|
|
5
5
|
import { GRID_WIDTH, GRID_HEIGHT, ShortcutType, getItemTextureKeyPath, ItemContainerType, ItemType, DepotSocketEvents, ItemSocketEvents, ItemSocketEventsDisplayLabels, ActionsForInventory, ActionsForEquipmentSet, ActionsForLoot, ActionsForMapContainer, ItemQualityLevel, ItemRarities, ItemSubType, isMobile, TaskType, TaskStatus, isMobileOrTablet, RewardType, ItemSlotType, NPCSubtype, EntityAttackType, NPCAlignment, VideoGuideCategory, VideoGuideLanguage, CharacterClass, QuestStatus, getLevelFromXP, getSkillConstants, getLevelFromSPTiered, getXPForLevel, getSPForLevelTiered, MetadataType, PurchaseType, UserAccountTypes, PaymentCurrency, PeriodOfDay } from '@rpg-engine/shared';
|
|
6
6
|
import dayjs from 'dayjs';
|
|
7
7
|
import { ErrorBoundary as ErrorBoundary$1 } from 'react-error-boundary';
|
|
8
|
-
import { FaTimes, FaDiscord, FaWhatsapp, FaSearch, FaThumbtack, FaBoxOpen, FaChevronLeft, FaChevronRight, FaClipboardList, FaChevronUp, FaChevronDown, FaReddit, FaTrash, FaShoppingBag, FaInfoCircle, FaCartPlus, FaArrowLeft, FaHistory, FaShoppingCart } from 'react-icons/fa';
|
|
8
|
+
import { FaTimes, FaDiscord, FaWhatsapp, FaSearch, FaThumbtack, FaBoxOpen, FaChevronLeft, FaChevronRight, FaClipboardList, FaChevronUp, FaChevronDown, FaReddit, FaTrash, FaShoppingBag, FaInfoCircle, FaCartPlus, FaArrowLeft, FaHistory, FaWallet, FaShoppingCart, FaCreditCard } from 'react-icons/fa';
|
|
9
9
|
import { RxMagnifyingGlass, RxCross2 } from 'react-icons/rx';
|
|
10
10
|
import { IoMdContract, IoMdExpand } from 'react-icons/io';
|
|
11
11
|
import Draggable from 'react-draggable';
|
|
@@ -16,6 +16,7 @@ import { AiFillFilter, AiOutlineFilter, AiFillCaretRight } from 'react-icons/ai'
|
|
|
16
16
|
import { HexColorPicker } from 'react-colorful';
|
|
17
17
|
import 'rpgui/rpgui.css';
|
|
18
18
|
import 'rpgui/rpgui.min.js';
|
|
19
|
+
import { GiCrystalBall } from 'react-icons/gi';
|
|
19
20
|
import capitalize from 'lodash-es/capitalize';
|
|
20
21
|
|
|
21
22
|
function asyncGeneratorStep(n, t, e, r, o, a, c) {
|
|
@@ -58644,7 +58645,7 @@ var StoreItemRow = function StoreItemRow(_ref) {
|
|
|
58644
58645
|
height: 32,
|
|
58645
58646
|
imgScale: 2,
|
|
58646
58647
|
centered: true
|
|
58647
|
-
})), React.createElement(ItemDetails$2, null, React.createElement(ItemName$2, null, item.name), React.createElement(ItemPrice$1, null, "$", item.price), React.createElement(ItemDescription, null, item.description)), React.createElement(Controls$1, null, showTextInput ? React.createElement(TextInput, {
|
|
58648
|
+
})), React.createElement(ItemDetails$2, null, React.createElement(ItemName$2, null, item.name), React.createElement(ItemPrice$1, null, "$", item.price, item.dcPrice ? " \xB7 " + item.dcPrice.toLocaleString() + " DC" : ''), React.createElement(ItemDescription, null, item.description)), React.createElement(Controls$1, null, showTextInput ? React.createElement(TextInput, {
|
|
58648
58649
|
type: "text",
|
|
58649
58650
|
value: textInputValue,
|
|
58650
58651
|
placeholder: textInputPlaceholder,
|
|
@@ -58950,7 +58951,7 @@ var StoreItemDetails = function StoreItemDetails(_ref) {
|
|
|
58950
58951
|
}, React.createElement(FaArrowLeft, null), React.createElement("span", null, "Back"))), React.createElement(Content$5, null, React.createElement(DetailsGrid, null, React.createElement(ItemIcon, null, React.createElement("img", {
|
|
58951
58952
|
src: getImageSrc(),
|
|
58952
58953
|
alt: item.name
|
|
58953
|
-
})), React.createElement(ItemInfo$2, null, React.createElement(ItemName$3, null, item.name), React.createElement(ItemPrice$2, null, "$", 'priceUSD' in item ? item.priceUSD : item.price), React.createElement(Description$6, null, item.description))), React.createElement(Actions, null, React.createElement(CTAButton, {
|
|
58954
|
+
})), React.createElement(ItemInfo$2, null, React.createElement(ItemName$3, null, item.name), React.createElement(ItemPrice$2, null, "$", 'priceUSD' in item ? item.priceUSD : item.price, item.dcPrice ? " \xB7 " + item.dcPrice.toLocaleString() + " DC" : ''), React.createElement(Description$6, null, item.description))), React.createElement(Actions, null, React.createElement(CTAButton, {
|
|
58954
58955
|
icon: React.createElement(FaCartPlus, null),
|
|
58955
58956
|
label: "Add to Cart",
|
|
58956
58957
|
onClick: function onClick() {
|
|
@@ -59012,6 +59013,8 @@ var Store = function Store(_ref) {
|
|
|
59012
59013
|
atlasIMG = _ref.atlasIMG,
|
|
59013
59014
|
_onPurchase2 = _ref.onPurchase,
|
|
59014
59015
|
onShowHistory = _ref.onShowHistory,
|
|
59016
|
+
onShowWallet = _ref.onShowWallet,
|
|
59017
|
+
walletLabel = _ref.walletLabel,
|
|
59015
59018
|
userAccountType = _ref.userAccountType,
|
|
59016
59019
|
_ref$loading = _ref.loading,
|
|
59017
59020
|
loading = _ref$loading === void 0 ? false : _ref$loading,
|
|
@@ -59024,7 +59027,9 @@ var Store = function Store(_ref) {
|
|
|
59024
59027
|
_ref$textInputItemKey = _ref.textInputItemKeys,
|
|
59025
59028
|
textInputItemKeys = _ref$textInputItemKey === void 0 ? [] : _ref$textInputItemKey,
|
|
59026
59029
|
customPacksContent = _ref.customPacksContent,
|
|
59027
|
-
customWalletContent = _ref.customWalletContent
|
|
59030
|
+
customWalletContent = _ref.customWalletContent,
|
|
59031
|
+
_ref$packsTabLabel = _ref.packsTabLabel,
|
|
59032
|
+
packsTabLabel = _ref$packsTabLabel === void 0 ? 'Packs' : _ref$packsTabLabel;
|
|
59028
59033
|
var _useState = useState(null),
|
|
59029
59034
|
selectedPack = _useState[0],
|
|
59030
59035
|
setSelectedPack = _useState[1];
|
|
@@ -59148,7 +59153,7 @@ var Store = function Store(_ref) {
|
|
|
59148
59153
|
},
|
|
59149
59154
|
packs: {
|
|
59150
59155
|
id: 'packs',
|
|
59151
|
-
title:
|
|
59156
|
+
title: packsTabLabel,
|
|
59152
59157
|
content: customPacksContent != null ? customPacksContent : React.createElement(StorePacksSection, {
|
|
59153
59158
|
packs: packs.filter(function (pack) {
|
|
59154
59159
|
return pack.priceUSD < 9.99;
|
|
@@ -59229,10 +59234,14 @@ var Store = function Store(_ref) {
|
|
|
59229
59234
|
onAddToCart: function onAddToCart() {
|
|
59230
59235
|
return handleAddPackToCart(selectedPack);
|
|
59231
59236
|
}
|
|
59232
|
-
}) : React.createElement(Container$N, null, React.createElement(TopBar$1, null, React.createElement(
|
|
59237
|
+
}) : React.createElement(Container$N, null, React.createElement(TopBar$1, null, React.createElement(LeftButtons, null, onShowHistory && React.createElement(CTAButton, {
|
|
59233
59238
|
icon: React.createElement(FaHistory, null),
|
|
59234
59239
|
label: "History",
|
|
59235
59240
|
onClick: onShowHistory
|
|
59241
|
+
}), onShowWallet && React.createElement(CTAButton, {
|
|
59242
|
+
icon: React.createElement(FaWallet, null),
|
|
59243
|
+
label: walletLabel != null ? walletLabel : 'DC Wallet',
|
|
59244
|
+
onClick: onShowWallet
|
|
59236
59245
|
})), React.createElement(CartButton, null, React.createElement(CTAButton, {
|
|
59237
59246
|
icon: React.createElement(FaShoppingCart, null),
|
|
59238
59247
|
label: getTotalItems() + " items ($" + getTotalPrice().toFixed(2) + ")",
|
|
@@ -59263,10 +59272,10 @@ var TopBar$1 = /*#__PURE__*/styled.div.withConfig({
|
|
|
59263
59272
|
displayName: "Store__TopBar",
|
|
59264
59273
|
componentId: "sc-64dj00-1"
|
|
59265
59274
|
})(["display:flex;align-items:center;justify-content:flex-end;gap:1rem;padding:0 1rem;flex-shrink:0;margin-top:0.5rem;"]);
|
|
59266
|
-
var
|
|
59267
|
-
displayName: "
|
|
59275
|
+
var LeftButtons = /*#__PURE__*/styled.div.withConfig({
|
|
59276
|
+
displayName: "Store__LeftButtons",
|
|
59268
59277
|
componentId: "sc-64dj00-2"
|
|
59269
|
-
})(["min-width:fit-content;margin-right:auto;"]);
|
|
59278
|
+
})(["display:flex;gap:0.5rem;min-width:fit-content;margin-right:auto;"]);
|
|
59270
59279
|
var CartButton = /*#__PURE__*/styled.div.withConfig({
|
|
59271
59280
|
displayName: "Store__CartButton",
|
|
59272
59281
|
componentId: "sc-64dj00-3"
|
|
@@ -59296,6 +59305,64 @@ var ErrorMessage$2 = /*#__PURE__*/styled.div.withConfig({
|
|
|
59296
59305
|
componentId: "sc-64dj00-9"
|
|
59297
59306
|
})(["text-align:center;color:", ";padding:2rem;"], uiColors.red);
|
|
59298
59307
|
|
|
59308
|
+
var PaymentMethodModal = function PaymentMethodModal(_ref) {
|
|
59309
|
+
var dcBalance = _ref.dcBalance,
|
|
59310
|
+
onPayWithDC = _ref.onPayWithDC,
|
|
59311
|
+
onPayWithCard = _ref.onPayWithCard,
|
|
59312
|
+
onClose = _ref.onClose;
|
|
59313
|
+
var stopPropagation = useCallback(function (e) {
|
|
59314
|
+
e.stopPropagation();
|
|
59315
|
+
}, []);
|
|
59316
|
+
return React.createElement(ModalPortal, null, React.createElement(Overlay$4, {
|
|
59317
|
+
onPointerDown: onClose
|
|
59318
|
+
}), React.createElement(ModalContainer$1, null, React.createElement(ModalContent$1, {
|
|
59319
|
+
onClick: stopPropagation,
|
|
59320
|
+
onTouchStart: stopPropagation,
|
|
59321
|
+
onPointerDown: stopPropagation
|
|
59322
|
+
}, React.createElement(Title$f, null, "How would you like to pay?"), React.createElement(OptionButton, {
|
|
59323
|
+
onClick: onPayWithDC,
|
|
59324
|
+
className: "rpgui-button"
|
|
59325
|
+
}, React.createElement(GiCrystalBall, null), React.createElement(OptionLabel, null, React.createElement("span", null, "Pay with DC"), React.createElement(OptionBalance, null, dcBalance.toLocaleString(), " DC available"))), React.createElement(OptionButton, {
|
|
59326
|
+
onClick: onPayWithCard,
|
|
59327
|
+
className: "rpgui-button"
|
|
59328
|
+
}, React.createElement(FaCreditCard, null), React.createElement(OptionLabel, null, React.createElement("span", null, "Pay with Credit Card"))), React.createElement(CancelWrapper, null, React.createElement(Button, {
|
|
59329
|
+
buttonType: ButtonTypes.RPGUIButton,
|
|
59330
|
+
onPointerDown: onClose
|
|
59331
|
+
}, "Cancel")))));
|
|
59332
|
+
};
|
|
59333
|
+
var Overlay$4 = /*#__PURE__*/styled.div.withConfig({
|
|
59334
|
+
displayName: "PaymentMethodModal__Overlay",
|
|
59335
|
+
componentId: "sc-1dxy6lr-0"
|
|
59336
|
+
})(["position:fixed;inset:0;background:rgba(0,0,0,0.65);z-index:1000;"]);
|
|
59337
|
+
var ModalContainer$1 = /*#__PURE__*/styled.div.withConfig({
|
|
59338
|
+
displayName: "PaymentMethodModal__ModalContainer",
|
|
59339
|
+
componentId: "sc-1dxy6lr-1"
|
|
59340
|
+
})(["position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none;"]);
|
|
59341
|
+
var ModalContent$1 = /*#__PURE__*/styled.div.withConfig({
|
|
59342
|
+
displayName: "PaymentMethodModal__ModalContent",
|
|
59343
|
+
componentId: "sc-1dxy6lr-2"
|
|
59344
|
+
})(["background:#1a1a2e;border:2px solid #f59e0b;border-radius:8px;padding:24px;min-width:320px;max-width:90%;display:flex;flex-direction:column;gap:12px;pointer-events:auto;animation:scaleIn 0.2s ease-out;@keyframes scaleIn{from{transform:scale(0.85);opacity:0;}to{transform:scale(1);opacity:1;}}"]);
|
|
59345
|
+
var Title$f = /*#__PURE__*/styled.h3.withConfig({
|
|
59346
|
+
displayName: "PaymentMethodModal__Title",
|
|
59347
|
+
componentId: "sc-1dxy6lr-3"
|
|
59348
|
+
})(["margin:0 0 8px;font-family:'Press Start 2P',cursive;font-size:0.75rem;color:#fef08a;text-align:center;"]);
|
|
59349
|
+
var OptionButton = /*#__PURE__*/styled.button.withConfig({
|
|
59350
|
+
displayName: "PaymentMethodModal__OptionButton",
|
|
59351
|
+
componentId: "sc-1dxy6lr-4"
|
|
59352
|
+
})(["display:flex;align-items:center;gap:12px;width:100%;padding:10px 14px;cursor:pointer;font-family:'Press Start 2P',cursive;font-size:0.65rem;svg{font-size:1.25rem;flex-shrink:0;}"]);
|
|
59353
|
+
var OptionLabel = /*#__PURE__*/styled.div.withConfig({
|
|
59354
|
+
displayName: "PaymentMethodModal__OptionLabel",
|
|
59355
|
+
componentId: "sc-1dxy6lr-5"
|
|
59356
|
+
})(["display:flex;flex-direction:column;align-items:flex-start;gap:4px;"]);
|
|
59357
|
+
var OptionBalance = /*#__PURE__*/styled.span.withConfig({
|
|
59358
|
+
displayName: "PaymentMethodModal__OptionBalance",
|
|
59359
|
+
componentId: "sc-1dxy6lr-6"
|
|
59360
|
+
})(["font-size:0.55rem;color:#fef08a;opacity:0.8;"]);
|
|
59361
|
+
var CancelWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
59362
|
+
displayName: "PaymentMethodModal__CancelWrapper",
|
|
59363
|
+
componentId: "sc-1dxy6lr-7"
|
|
59364
|
+
})(["display:flex;justify-content:center;margin-top:4px;filter:grayscale(0.6);"]);
|
|
59365
|
+
|
|
59299
59366
|
var TextArea = function TextArea(_ref) {
|
|
59300
59367
|
var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
|
|
59301
59368
|
return React.createElement("textarea", Object.assign({}, props));
|
|
@@ -59626,7 +59693,7 @@ var TradingMenu = function TradingMenu(_ref) {
|
|
|
59626
59693
|
width: "500px",
|
|
59627
59694
|
cancelDrag: "#TraderContainer",
|
|
59628
59695
|
scale: scale
|
|
59629
|
-
}, React.createElement(Container$O, null, React.createElement(Title$
|
|
59696
|
+
}, React.createElement(Container$O, null, React.createElement(Title$g, null, type.charAt(0).toUpperCase() + type.slice(1), " Menu"), React.createElement("hr", {
|
|
59630
59697
|
className: "golden"
|
|
59631
59698
|
}), React.createElement(ScrollWrapper, {
|
|
59632
59699
|
id: "TraderContainer"
|
|
@@ -59658,7 +59725,7 @@ var Container$O = /*#__PURE__*/styled.div.withConfig({
|
|
|
59658
59725
|
displayName: "TradingMenu__Container",
|
|
59659
59726
|
componentId: "sc-1wjsz1l-0"
|
|
59660
59727
|
})(["width:100%;"]);
|
|
59661
|
-
var Title$
|
|
59728
|
+
var Title$g = /*#__PURE__*/styled.h1.withConfig({
|
|
59662
59729
|
displayName: "TradingMenu__Title",
|
|
59663
59730
|
componentId: "sc-1wjsz1l-1"
|
|
59664
59731
|
})(["font-size:0.7rem !important;color:yellow !important;text-align:center;"]);
|
|
@@ -59838,5 +59905,5 @@ var LessonContainer = /*#__PURE__*/styled.div.withConfig({
|
|
|
59838
59905
|
componentId: "sc-7tgzv2-6"
|
|
59839
59906
|
})(["display:flex;flex-direction:column;justify-content:space-between;min-height:200px;p{font-size:0.7rem !important;}"]);
|
|
59840
59907
|
|
|
59841
|
-
export { ActionButtons, AsyncDropdown, Button, ButtonTypes, CartView, CharacterSelection, CharacterSkinSelectionModal, Chat, ChatDeprecated, ChatRevamp, CheckButton, CheckItem, CircularController, CraftBook, DailyTasks, DraggableContainer, Dropdown, DropdownSelectorContainer, DynamicText, EquipmentSet, EquipmentSlotSpriteByType, ErrorBoundary, FriendList, GemSelector, HistoryDialog, ImageCarousel, ImgSide, InformationCenter, Input, InputRadio, InternalTabs, ItemContainer$1 as ItemContainer, ItemPropertySimpleHandler, ItemQuantitySelectorModal, ItemSelector, ItemSlot, JoystickDPad, Leaderboard, ListMenu, LoginStreakPanel, Marketplace, MarketplaceRows, MetadataCollector, MultitabType, NPCDialog, NPCDialogType, NPCMultiDialog, PartyCreate, PartyDashboard, PartyInvite, PartyManager, PartyManagerRow, PartyRow, PlayersRow, ProgressBar$1 as ProgressBar, PropertySelect, QuantitySelectorModal, QuestInfo, QuestList, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, SelectArrow, Shortcuts, SimpleImageCarousel, SkillProgressBar, SkillsContainer, SocialModal, Spellbook, SpriteFromAtlas, Stepper, Store, TabBody, Table, TableCell, TableHeader, TableRow, TabsContainer, TextArea, TimeWidget, Tooltip, TradingMenu, Truncate, TutorialStepper, UserActionLink, _RPGUI, formatQuestStatus, formatQuestText, getMockedPlayersRowsLeader, getMockedPlayersRowsNotLeader, getQuestStatusColor, mockedPartyManager, mockedPartyRows, mockedPlayersRows, mockedPlayersRows2, useEventListener, useStoreCart };
|
|
59908
|
+
export { ActionButtons, AsyncDropdown, Button, ButtonTypes, CartView, CharacterSelection, CharacterSkinSelectionModal, Chat, ChatDeprecated, ChatRevamp, CheckButton, CheckItem, CircularController, CraftBook, DailyTasks, DraggableContainer, Dropdown, DropdownSelectorContainer, DynamicText, EquipmentSet, EquipmentSlotSpriteByType, ErrorBoundary, FriendList, GemSelector, HistoryDialog, ImageCarousel, ImgSide, InformationCenter, Input, InputRadio, InternalTabs, ItemContainer$1 as ItemContainer, ItemPropertySimpleHandler, ItemQuantitySelectorModal, ItemSelector, ItemSlot, JoystickDPad, Leaderboard, ListMenu, LoginStreakPanel, Marketplace, MarketplaceRows, MetadataCollector, MultitabType, NPCDialog, NPCDialogType, NPCMultiDialog, PartyCreate, PartyDashboard, PartyInvite, PartyManager, PartyManagerRow, PartyRow, PaymentMethodModal, PlayersRow, ProgressBar$1 as ProgressBar, PropertySelect, QuantitySelectorModal, QuestInfo, QuestList, QuestionDialog, RPGUIContainer, RPGUIContainerTypes, RPGUIRoot, RangeSlider, RangeSliderType, SelectArrow, Shortcuts, SimpleImageCarousel, SkillProgressBar, SkillsContainer, SocialModal, Spellbook, SpriteFromAtlas, Stepper, Store, TabBody, Table, TableCell, TableHeader, TableRow, TabsContainer, TextArea, TimeWidget, Tooltip, TradingMenu, Truncate, TutorialStepper, UserActionLink, _RPGUI, formatQuestStatus, formatQuestText, getMockedPlayersRowsLeader, getMockedPlayersRowsNotLeader, getQuestStatusColor, mockedPartyManager, mockedPartyRows, mockedPlayersRows, mockedPlayersRows2, useEventListener, useStoreCart };
|
|
59842
59909
|
//# sourceMappingURL=long-bow.esm.js.map
|