@rpg-engine/long-bow 0.5.7 → 0.5.9
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/Leaderboard/Leaderboard.d.ts +13 -0
- package/dist/components/Leaderboard/LeaderboardTable.d.ts +7 -0
- package/dist/index.d.ts +1 -0
- package/dist/long-bow.cjs.development.js +128 -9
- 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 +128 -10
- package/dist/long-bow.esm.js.map +1 -1
- package/dist/mocks/leaderboard.mocks.d.ts +4 -0
- package/dist/stories/Leaderboard.stories.d.ts +7 -0
- package/package.json +2 -2
- package/src/components/Leaderboard/Leaderboard.tsx +128 -0
- package/src/components/Leaderboard/LeaderboardTable.tsx +100 -0
- package/src/index.tsx +1 -0
- package/src/mocks/leaderboard.mocks.ts +119 -0
- package/src/stories/Leaderboard.stories.tsx +63 -0
package/dist/long-bow.esm.js
CHANGED
|
@@ -15692,6 +15692,124 @@ var QuantitySelectorContainer = /*#__PURE__*/styled.div.withConfig({
|
|
|
15692
15692
|
componentId: "sc-15y5p9l-1"
|
|
15693
15693
|
})(["position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:100;display:flex;justify-content:center;align-items:center;background-color:rgba(0,0,0,0.5);"]);
|
|
15694
15694
|
|
|
15695
|
+
var LeaderboardTable = function LeaderboardTable(props) {
|
|
15696
|
+
var items = props.items,
|
|
15697
|
+
rankType = props.rankType;
|
|
15698
|
+
if (!items) return null;
|
|
15699
|
+
function isTopSkillEntry(entry) {
|
|
15700
|
+
return 'skill' in entry;
|
|
15701
|
+
}
|
|
15702
|
+
return React.createElement(React.Fragment, null, React.createElement("thead", null, React.createElement(TableRowWrapper, null, React.createElement(TableRowValue, null, React.createElement("p", null, React.createElement(Ellipsis, {
|
|
15703
|
+
maxLines: 1,
|
|
15704
|
+
maxWidth: "200px",
|
|
15705
|
+
fontSize: "14px"
|
|
15706
|
+
}, "Name"))), rankType === 'Skill' ? React.createElement(TableRowValue, null, React.createElement("p", null, React.createElement(Ellipsis, {
|
|
15707
|
+
maxLines: 1,
|
|
15708
|
+
maxWidth: "200px",
|
|
15709
|
+
fontSize: "14px"
|
|
15710
|
+
}, "Skill"))) : null, React.createElement(TableRowValue, null, React.createElement("p", null, React.createElement(Ellipsis, {
|
|
15711
|
+
maxLines: 1,
|
|
15712
|
+
maxWidth: "200px",
|
|
15713
|
+
fontSize: "14px"
|
|
15714
|
+
}, "Level"))))), React.createElement("tbody", null, Array.from(items).map(function (entry) {
|
|
15715
|
+
return React.createElement(TableRowWrapper, {
|
|
15716
|
+
key: entry.name
|
|
15717
|
+
}, React.createElement(TableRowValue, null, React.createElement("p", null, React.createElement(Ellipsis, {
|
|
15718
|
+
maxLines: 1,
|
|
15719
|
+
maxWidth: "200px",
|
|
15720
|
+
fontSize: "10px"
|
|
15721
|
+
}, entry.name))), isTopSkillEntry(entry) ? React.createElement(TableRowValue, null, React.createElement("p", null, React.createElement(Ellipsis, {
|
|
15722
|
+
maxLines: 1,
|
|
15723
|
+
maxWidth: "200px",
|
|
15724
|
+
fontSize: "10px"
|
|
15725
|
+
}, entry.skill))) : null, React.createElement(TableRowValue, null, React.createElement("p", null, React.createElement(Ellipsis, {
|
|
15726
|
+
maxLines: 1,
|
|
15727
|
+
maxWidth: "200px",
|
|
15728
|
+
fontSize: "10px"
|
|
15729
|
+
}, entry.level))));
|
|
15730
|
+
})));
|
|
15731
|
+
};
|
|
15732
|
+
var TableRowWrapper = /*#__PURE__*/styled.tr.withConfig({
|
|
15733
|
+
displayName: "LeaderboardTable__TableRowWrapper",
|
|
15734
|
+
componentId: "sc-kk017f-0"
|
|
15735
|
+
})(["margin:auto;padding:0.5rem;&:hover{background-color:", ";}p{font-size:0.8rem;}"], uiColors.darkGray);
|
|
15736
|
+
var TableRowValue = /*#__PURE__*/styled.td.withConfig({
|
|
15737
|
+
displayName: "LeaderboardTable__TableRowValue",
|
|
15738
|
+
componentId: "sc-kk017f-1"
|
|
15739
|
+
})(["padding:0 20px;"]);
|
|
15740
|
+
|
|
15741
|
+
var Leaderboard = function Leaderboard(props) {
|
|
15742
|
+
var items = props.items,
|
|
15743
|
+
onChangeRankType = props.onChangeRankType,
|
|
15744
|
+
onChangeClassType = props.onChangeClassType,
|
|
15745
|
+
rankType = props.rankType,
|
|
15746
|
+
skillOptions = props.skillOptions,
|
|
15747
|
+
onChangeSkillType = props.onChangeSkillType,
|
|
15748
|
+
classOptions = props.classOptions,
|
|
15749
|
+
rankOptions = props.rankOptions;
|
|
15750
|
+
var itemsContainer = useRef(null);
|
|
15751
|
+
useEffect(function () {
|
|
15752
|
+
var _itemsContainer$curre;
|
|
15753
|
+
(_itemsContainer$curre = itemsContainer.current) == null ? void 0 : _itemsContainer$curre.scrollTo(0, 0);
|
|
15754
|
+
}, []);
|
|
15755
|
+
var rankTypeOptions = rankOptions.map(function (itemType, index) {
|
|
15756
|
+
return {
|
|
15757
|
+
id: index + 1,
|
|
15758
|
+
value: itemType,
|
|
15759
|
+
option: itemType
|
|
15760
|
+
};
|
|
15761
|
+
});
|
|
15762
|
+
var skillTypeOptions = skillOptions.map(function (itemType, index) {
|
|
15763
|
+
return {
|
|
15764
|
+
id: index + 1,
|
|
15765
|
+
value: itemType,
|
|
15766
|
+
option: itemType
|
|
15767
|
+
};
|
|
15768
|
+
});
|
|
15769
|
+
var classTypeOptions = classOptions.map(function (itemType, index) {
|
|
15770
|
+
return {
|
|
15771
|
+
id: index + 1,
|
|
15772
|
+
value: itemType,
|
|
15773
|
+
option: itemType
|
|
15774
|
+
};
|
|
15775
|
+
});
|
|
15776
|
+
return React.createElement(React.Fragment, null, React.createElement(WrapperContainer, null, React.createElement(StyledDropdown, {
|
|
15777
|
+
options: rankTypeOptions,
|
|
15778
|
+
onChange: onChangeRankType,
|
|
15779
|
+
width: "80%"
|
|
15780
|
+
}), rankType === 'Class' ? React.createElement(StyledDropdown, {
|
|
15781
|
+
options: classTypeOptions,
|
|
15782
|
+
onChange: onChangeClassType,
|
|
15783
|
+
width: "100%"
|
|
15784
|
+
}) : null, rankType === 'Skill' ? React.createElement(StyledDropdown, {
|
|
15785
|
+
options: skillTypeOptions,
|
|
15786
|
+
onChange: onChangeSkillType,
|
|
15787
|
+
width: "100%"
|
|
15788
|
+
}) : null), React.createElement(ItemComponentScrollWrapper, {
|
|
15789
|
+
id: "LeaderboardContainer",
|
|
15790
|
+
ref: itemsContainer
|
|
15791
|
+
}, React.createElement(TableWrapper, null, React.createElement(LeaderboardTable, {
|
|
15792
|
+
items: items,
|
|
15793
|
+
rankType: rankType
|
|
15794
|
+
}))));
|
|
15795
|
+
};
|
|
15796
|
+
var WrapperContainer = /*#__PURE__*/styled.div.withConfig({
|
|
15797
|
+
displayName: "Leaderboard__WrapperContainer",
|
|
15798
|
+
componentId: "sc-1wdsq7i-0"
|
|
15799
|
+
})(["display:grid;grid-template-columns:50% 50%;justify-content:space-between;width:calc(100% - 40px);margin-left:10px;.rpgui-content .rpgui-dropdown-imp-header{padding:0px 10px 0 !important;}"]);
|
|
15800
|
+
var StyledDropdown = /*#__PURE__*/styled(Dropdown).withConfig({
|
|
15801
|
+
displayName: "Leaderboard__StyledDropdown",
|
|
15802
|
+
componentId: "sc-1wdsq7i-1"
|
|
15803
|
+
})(["margin:3px !important;width:170px !important;"]);
|
|
15804
|
+
var ItemComponentScrollWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
15805
|
+
displayName: "Leaderboard__ItemComponentScrollWrapper",
|
|
15806
|
+
componentId: "sc-1wdsq7i-2"
|
|
15807
|
+
})(["overflow-y:scroll;height:390px;width:100%;margin-top:1rem;@media (max-width:950px){height:250px;}"]);
|
|
15808
|
+
var TableWrapper = /*#__PURE__*/styled.table.withConfig({
|
|
15809
|
+
displayName: "Leaderboard__TableWrapper",
|
|
15810
|
+
componentId: "sc-1wdsq7i-3"
|
|
15811
|
+
})(["margin:auto;width:100%;"]);
|
|
15812
|
+
|
|
15695
15813
|
var ListMenu = function ListMenu(_ref) {
|
|
15696
15814
|
var options = _ref.options,
|
|
15697
15815
|
onSelected = _ref.onSelected,
|
|
@@ -16052,19 +16170,19 @@ var BuyPanel = function BuyPanel(_ref) {
|
|
|
16052
16170
|
className: "big-input",
|
|
16053
16171
|
onBlur: enableHotkeys,
|
|
16054
16172
|
onFocus: disableHotkeys
|
|
16055
|
-
}))), React.createElement(WrapperContainer, null, React.createElement(StyledDropdown, {
|
|
16173
|
+
}))), React.createElement(WrapperContainer$1, null, React.createElement(StyledDropdown$1, {
|
|
16056
16174
|
options: itemTypeOptions,
|
|
16057
16175
|
onChange: onChangeType,
|
|
16058
16176
|
width: "95%"
|
|
16059
|
-
}), React.createElement(StyledDropdown, {
|
|
16177
|
+
}), React.createElement(StyledDropdown$1, {
|
|
16060
16178
|
options: itemRarityOptions,
|
|
16061
16179
|
onChange: onChangeRarity,
|
|
16062
16180
|
width: "95%"
|
|
16063
|
-
}), React.createElement(StyledDropdown, {
|
|
16181
|
+
}), React.createElement(StyledDropdown$1, {
|
|
16064
16182
|
options: orderByOptions,
|
|
16065
16183
|
onChange: onChangeOrder,
|
|
16066
16184
|
width: "100%"
|
|
16067
|
-
}))), React.createElement(ItemComponentScrollWrapper, {
|
|
16185
|
+
}))), React.createElement(ItemComponentScrollWrapper$1, {
|
|
16068
16186
|
id: "MarketContainer",
|
|
16069
16187
|
ref: itemsContainer
|
|
16070
16188
|
}, items == null ? void 0 : items.map(function (_ref2, index) {
|
|
@@ -16096,15 +16214,15 @@ var FilterInputsWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
|
16096
16214
|
displayName: "BuyPanel__FilterInputsWrapper",
|
|
16097
16215
|
componentId: "sc-1si8t7i-2"
|
|
16098
16216
|
})(["width:95%;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;margin-left:10px;gap:5px;color:white;flex-wrap:wrap;p{width:auto;margin:0;}input{width:75px;height:10px;}.big-input{width:130px;}"]);
|
|
16099
|
-
var WrapperContainer = /*#__PURE__*/styled.div.withConfig({
|
|
16217
|
+
var WrapperContainer$1 = /*#__PURE__*/styled.div.withConfig({
|
|
16100
16218
|
displayName: "BuyPanel__WrapperContainer",
|
|
16101
16219
|
componentId: "sc-1si8t7i-3"
|
|
16102
16220
|
})(["display:grid;grid-template-columns:40% 30% 30%;justify-content:space-between;width:calc(100% - 40px);margin-left:10px;.rpgui-content .rpgui-dropdown-imp-header{padding:0px 10px 0 !important;}"]);
|
|
16103
|
-
var ItemComponentScrollWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
16221
|
+
var ItemComponentScrollWrapper$1 = /*#__PURE__*/styled.div.withConfig({
|
|
16104
16222
|
displayName: "BuyPanel__ItemComponentScrollWrapper",
|
|
16105
16223
|
componentId: "sc-1si8t7i-4"
|
|
16106
16224
|
})(["overflow-y:scroll;height:390px;width:100%;margin-top:1rem;@media (max-width:950px){height:250px;}"]);
|
|
16107
|
-
var StyledDropdown = /*#__PURE__*/styled(Dropdown).withConfig({
|
|
16225
|
+
var StyledDropdown$1 = /*#__PURE__*/styled(Dropdown).withConfig({
|
|
16108
16226
|
displayName: "BuyPanel__StyledDropdown",
|
|
16109
16227
|
componentId: "sc-1si8t7i-5"
|
|
16110
16228
|
})(["margin:3px !important;width:170px !important;"]);
|
|
@@ -16206,7 +16324,7 @@ var ManagmentPanel = function ManagmentPanel(_ref) {
|
|
|
16206
16324
|
onPointerDown: function onPointerDown() {
|
|
16207
16325
|
return availableGold > 0 && onMoneyWithdraw();
|
|
16208
16326
|
}
|
|
16209
|
-
}, "Withdraw")))), React.createElement(ItemComponentScrollWrapper$
|
|
16327
|
+
}, "Withdraw")))), React.createElement(ItemComponentScrollWrapper$2, {
|
|
16210
16328
|
id: "MarketContainer",
|
|
16211
16329
|
ref: itemsContainer
|
|
16212
16330
|
}, items == null ? void 0 : items.map(function (_ref2, index) {
|
|
@@ -16240,7 +16358,7 @@ var InnerOptionsWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
|
16240
16358
|
displayName: "ManagmentPanel__InnerOptionsWrapper",
|
|
16241
16359
|
componentId: "sc-1yyi6jn-3"
|
|
16242
16360
|
})(["display:flex;justify-content:space-between;flex-direction:column;height:100%;"]);
|
|
16243
|
-
var ItemComponentScrollWrapper$
|
|
16361
|
+
var ItemComponentScrollWrapper$2 = /*#__PURE__*/styled.div.withConfig({
|
|
16244
16362
|
displayName: "ManagmentPanel__ItemComponentScrollWrapper",
|
|
16245
16363
|
componentId: "sc-1yyi6jn-4"
|
|
16246
16364
|
})(["overflow-y:scroll;height:390px;width:100%;margin-top:1rem;@media (max-width:950px){height:250px;}"]);
|
|
@@ -18168,5 +18286,5 @@ var ButtonWrapper$3 = /*#__PURE__*/styled.div.withConfig({
|
|
|
18168
18286
|
componentId: "sc-gptoxp-5"
|
|
18169
18287
|
})(["display:flex;justify-content:space-around;padding-top:20px;width:100%;"]);
|
|
18170
18288
|
|
|
18171
|
-
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 };
|
|
18289
|
+
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, Leaderboard, 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 };
|
|
18172
18290
|
//# sourceMappingURL=long-bow.esm.js.map
|