@rpg-engine/long-bow 0.2.17 → 0.2.19
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/RPGUIForceRenderStart.d.ts +9 -0
- package/dist/long-bow.cjs.development.js +44 -21
- 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 +44 -21
- package/dist/long-bow.esm.js.map +1 -1
- package/package.json +2 -2
- package/src/components/Dropdown.tsx +19 -12
- package/src/components/Item/Inventory/ItemSlot.tsx +1 -1
- package/src/components/RPGUIForceRenderStart.tsx +45 -0
- package/src/components/RangeSlider.tsx +21 -27
- package/src/mocks/itemContainer.mocks.ts +7 -0
- package/src/stories/RangeSlider.stories.tsx +3 -0
package/dist/long-bow.esm.js
CHANGED
|
@@ -20837,6 +20837,36 @@ var RPGUIRoot = function RPGUIRoot(_ref) {
|
|
|
20837
20837
|
}, children);
|
|
20838
20838
|
};
|
|
20839
20839
|
|
|
20840
|
+
var RPGUIForceRenderStart = function RPGUIForceRenderStart(_ref) {
|
|
20841
|
+
var children = _ref.children,
|
|
20842
|
+
elementDOMId = _ref.elementDOMId,
|
|
20843
|
+
elementRenderedDOMKey = _ref.elementRenderedDOMKey,
|
|
20844
|
+
RPGUICreateFunction = _ref.RPGUICreateFunction;
|
|
20845
|
+
|
|
20846
|
+
var _useState = useState(false),
|
|
20847
|
+
isRendered = _useState[0],
|
|
20848
|
+
setIsRendered = _useState[1];
|
|
20849
|
+
|
|
20850
|
+
useEffect(function () {
|
|
20851
|
+
if (_RPGUI) {
|
|
20852
|
+
var element = document.getElementById(elementDOMId); // create an interval to wait for the element to be rendered
|
|
20853
|
+
// if it's not, trigger the rendering forcefully
|
|
20854
|
+
|
|
20855
|
+
var interval = setInterval(function () {
|
|
20856
|
+
var dropdown = document.querySelector(elementRenderedDOMKey);
|
|
20857
|
+
|
|
20858
|
+
if (!dropdown && !isRendered) {
|
|
20859
|
+
_RPGUI.__create_funcs[RPGUICreateFunction](element);
|
|
20860
|
+
|
|
20861
|
+
setIsRendered(true);
|
|
20862
|
+
clearInterval(interval);
|
|
20863
|
+
}
|
|
20864
|
+
}, 10);
|
|
20865
|
+
}
|
|
20866
|
+
}, []);
|
|
20867
|
+
return React.createElement(React.Fragment, null, children);
|
|
20868
|
+
};
|
|
20869
|
+
|
|
20840
20870
|
var Dropdown = function Dropdown(_ref) {
|
|
20841
20871
|
var options = _ref.options,
|
|
20842
20872
|
width = _ref.width,
|
|
@@ -20862,7 +20892,11 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
20862
20892
|
onChange(selectedValue);
|
|
20863
20893
|
}
|
|
20864
20894
|
}, [selectedValue]);
|
|
20865
|
-
return React.createElement(
|
|
20895
|
+
return React.createElement(RPGUIForceRenderStart, {
|
|
20896
|
+
elementDOMId: "rpgui-dropdown-" + dropdownId,
|
|
20897
|
+
elementRenderedDOMKey: '[data-rpguitype="dropdown"]',
|
|
20898
|
+
RPGUICreateFunction: "dropdown"
|
|
20899
|
+
}, React.createElement("select", {
|
|
20866
20900
|
id: "rpgui-dropdown-" + dropdownId,
|
|
20867
20901
|
style: {
|
|
20868
20902
|
width: width
|
|
@@ -20873,7 +20907,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
20873
20907
|
key: option.id,
|
|
20874
20908
|
value: option.value
|
|
20875
20909
|
}, option.option);
|
|
20876
|
-
}));
|
|
20910
|
+
})));
|
|
20877
20911
|
};
|
|
20878
20912
|
|
|
20879
20913
|
var frames$1 = {
|
|
@@ -27437,7 +27471,7 @@ var EquipmentSlotSpriteByType = {
|
|
|
27437
27471
|
Feet: 'boots/iron-boots.png',
|
|
27438
27472
|
Inventory: 'containers/bag.png',
|
|
27439
27473
|
RightHand: 'shields/plate-shield.png',
|
|
27440
|
-
Accessory: '
|
|
27474
|
+
Accessory: 'ranged-weapons/arrow.png'
|
|
27441
27475
|
};
|
|
27442
27476
|
var ItemSlot = /*#__PURE__*/observer(function (_ref) {
|
|
27443
27477
|
var slotIndex = _ref.slotIndex,
|
|
@@ -28457,18 +28491,6 @@ var RangeSlider = function RangeSlider(_ref) {
|
|
|
28457
28491
|
onChange = _ref.onChange;
|
|
28458
28492
|
var sliderId = v4();
|
|
28459
28493
|
|
|
28460
|
-
var _useState = useState(false),
|
|
28461
|
-
wasMouseDownFirst = _useState[0],
|
|
28462
|
-
setWasMouseDownFirst = _useState[1];
|
|
28463
|
-
|
|
28464
|
-
useEventListener('mouseup', function () {
|
|
28465
|
-
if (wasMouseDownFirst) {
|
|
28466
|
-
onHandleMouseUp();
|
|
28467
|
-
}
|
|
28468
|
-
|
|
28469
|
-
setWasMouseDownFirst(false);
|
|
28470
|
-
});
|
|
28471
|
-
|
|
28472
28494
|
var onHandleMouseUp = function onHandleMouseUp() {
|
|
28473
28495
|
var rpguiSlider = document.getElementById("rpgui-slider-" + sliderId);
|
|
28474
28496
|
|
|
@@ -28477,11 +28499,12 @@ var RangeSlider = function RangeSlider(_ref) {
|
|
|
28477
28499
|
onChange(Number(value));
|
|
28478
28500
|
};
|
|
28479
28501
|
|
|
28480
|
-
return React.createElement(
|
|
28481
|
-
|
|
28482
|
-
|
|
28483
|
-
|
|
28484
|
-
|
|
28502
|
+
return React.createElement(RPGUIForceRenderStart, {
|
|
28503
|
+
elementDOMId: "rpgui-slider-" + sliderId,
|
|
28504
|
+
elementRenderedDOMKey: "[data-rpguitype='slider']",
|
|
28505
|
+
RPGUICreateFunction: "slider"
|
|
28506
|
+
}, React.createElement("div", {
|
|
28507
|
+
onMouseUp: onHandleMouseUp
|
|
28485
28508
|
}, React.createElement(Input$1, {
|
|
28486
28509
|
className: type === RangeSliderType.Slider ? RangeSliderType.Slider : RangeSliderType.GoldSlider,
|
|
28487
28510
|
type: "range",
|
|
@@ -28491,7 +28514,7 @@ var RangeSlider = function RangeSlider(_ref) {
|
|
|
28491
28514
|
min: valueMin,
|
|
28492
28515
|
max: valueMax,
|
|
28493
28516
|
id: "rpgui-slider-" + sliderId
|
|
28494
|
-
}));
|
|
28517
|
+
})));
|
|
28495
28518
|
};
|
|
28496
28519
|
var Input$1 = /*#__PURE__*/styled.input.withConfig({
|
|
28497
28520
|
displayName: "RangeSlider__Input",
|