@rpg-engine/long-bow 0.8.217 → 0.8.219

package/dist/long-bow.esm.js

@@ -2468,6 +2468,10 @@ var DraggableContainer = function DraggableContainer(_ref) {
     height = _ref.height,
     minHeight = _ref.minHeight,
     minWidth = _ref.minWidth,
+    mobileWidth = _ref.mobileWidth,
+    mobileHeight = _ref.mobileHeight,
+    _ref$mobileBreakpoint = _ref.mobileBreakpoint,
+    mobileBreakpoint = _ref$mobileBreakpoint === void 0 ? 768 : _ref$mobileBreakpoint,
     className = _ref.className,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? RPGUIContainerTypes.FramedGold : _ref$type,
@@ -2544,6 +2548,9 @@ var DraggableContainer = function DraggableContainer(_ref) {
     height: height || 'auto',
     minWidth: minWidth,
     minHeight: minHeight,
+    mobileWidth: mobileWidth,
+    mobileHeight: mobileHeight,
+    mobileBreakpoint: mobileBreakpoint,
     className: "rpgui-container " + type + " " + className,
     isFullScreen: isFullScreen,
     opacity: opacity
@@ -2560,7 +2567,7 @@ var DraggableContainer = function DraggableContainer(_ref) {
 var Container$a = /*#__PURE__*/styled.div.withConfig({
   displayName: "DraggableContainer__Container",
   componentId: "sc-184mpyl-0"
-})(["height:", ";width:", ";min-width:", ";min-height:", ";display:flex;flex-wrap:wrap;image-rendering:pixelated;overflow-y:hidden;", " ", " &.rpgui-container{padding-top:1.5rem;}"], function (props) {
+})(["height:", ";width:", ";min-width:", ";min-height:", ";display:flex;flex-wrap:wrap;image-rendering:pixelated;overflow-y:hidden;", " ", " ", " &.rpgui-container{padding-top:1.5rem;}"], function (props) {
   return props.height;
 }, function (_ref2) {
   var width = _ref2.width;
@@ -2577,6 +2584,11 @@ var Container$a = /*#__PURE__*/styled.div.withConfig({
 }, function (_ref6) {
   var isFullScreen = _ref6.isFullScreen;
   return isFullScreen && css(["justify-content:center;align-items:flex-start;align-content:flex-start;"]);
+}, function (_ref7) {
+  var mobileWidth = _ref7.mobileWidth,
+    mobileHeight = _ref7.mobileHeight,
+    mobileBreakpoint = _ref7.mobileBreakpoint;
+  return (mobileWidth || mobileHeight) && css(["@media (max-width:", "px){", " ", "}"], mobileBreakpoint != null ? mobileBreakpoint : 768, mobileWidth && "width: " + mobileWidth + "; min-width: unset;", mobileHeight && "height: " + mobileHeight + "; min-height: unset;");
 });
 var CloseButton$4 = /*#__PURE__*/styled.div.withConfig({
   displayName: "DraggableContainer__CloseButton",
@@ -2593,8 +2605,8 @@ var Title$1 = /*#__PURE__*/styled.h1.withConfig({
 var Icon = /*#__PURE__*/styled.img.withConfig({
   displayName: "DraggableContainer__Icon",
   componentId: "sc-184mpyl-4"
-})(["color:white;z-index:22;font-size:", ";width:", ";margin-right:0.5rem;"], uiFonts.size.xsmall, function (_ref7) {
-  var width = _ref7.width;
+})(["color:white;z-index:22;font-size:", ";width:", ";margin-right:0.5rem;"], uiFonts.size.xsmall, function (_ref8) {
+  var width = _ref8.width;
   return width;
 });
 
@@ -39733,6 +39745,9 @@ var Store = function Store(_ref) {
     fullScreen = _ref$fullScreen === void 0 ? false : _ref$fullScreen,
     containerWidth = _ref.containerWidth,
     containerHeight = _ref.containerHeight,
+    mobileContainerWidth = _ref.mobileContainerWidth,
+    mobileContainerHeight = _ref.mobileContainerHeight,
+    mobileBreakpoint = _ref.mobileBreakpoint,
     _ref$packsTabLabel = _ref.packsTabLabel,
     packsTabLabel = _ref$packsTabLabel === void 0 ? 'Packs' : _ref$packsTabLabel,
     packsBadge = _ref.packsBadge,
@@ -40072,7 +40087,10 @@ var Store = function Store(_ref) {
     onCloseButton: onClose,
     width: containerWidth != null ? containerWidth : "1000px",
     minWidth: "700px",
-    height: containerHeight != null ? containerHeight : "auto",
+    height: containerHeight != null ? containerHeight : "min(85vh, 900px)",
+    mobileWidth: mobileContainerWidth != null ? mobileContainerWidth : "95vw",
+    mobileHeight: mobileContainerHeight != null ? mobileContainerHeight : "95vh",
+    mobileBreakpoint: mobileBreakpoint,
     type: RPGUIContainerTypes.Framed,
     cancelDrag: "[class*='Store__Container'], [class*='CartView'], [class*='StoreItemDetails'], .close-button",
     isFullScreen: fullScreen