@rpg-engine/long-bow 0.7.26 → 0.7.27

package/dist/components/Multitab/TabsContainer.d.ts

@@ -22,6 +22,7 @@ export interface ITabsContainer {
         imgSrc?: string;
         imgWidth?: string;
     };
+    isDraggableModal: boolean;
 }
 export declare const TabsContainer: React.FC<ITabsContainer>;
 export {};

package/dist/long-bow.cjs.development.js

@@ -31434,10 +31434,12 @@ var TabsContainer = function TabsContainer(_ref) {
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? exports.MultitabType.Brown : _ref$type,
     _ref$styles = _ref.styles,
-    styles = _ref$styles === void 0 ? {} : _ref$styles;
+    styles = _ref$styles === void 0 ? {} : _ref$styles,
+    _ref$isDraggableModal = _ref.isDraggableModal,
+    isDraggableModal = _ref$isDraggableModal === void 0 ? false : _ref$isDraggableModal;
   var _useState = React.useState(tabs[0].id),
     selectedTab = _useState[0],
-    setSelectedTab = _useState[1]; // by default the first one
+    setSelectedTab = _useState[1];
   var onRenderTabs = function onRenderTabs() {
     return tabs.map(function (tab, index) {
       return React__default.createElement(Tab$1, {
@@ -31461,23 +31463,33 @@ var TabsContainer = function TabsContainer(_ref) {
         return exports.RPGUIContainerTypes.Framed;
     }
   };
-  return React__default.createElement(DraggableContainer, {
-    onCloseButton: onCloseButton,
-    type: onGetContainerType(),
-    cancelDrag: ".tabs-container *" // Disable drag on all elements inside .tabs-container
-    ,
+  var TabsCore = function TabsCore() {
+    return React__default.createElement(React__default.Fragment, null, onRenderTabs(), React__default.createElement(BodyContainer, {
+      selectedTab: selectedTab,
+      className: type + " tabs-container"
+    }, children));
+  };
+  if (isDraggableModal) {
+    return React__default.createElement(DraggableContainer, {
+      onCloseButton: onCloseButton,
+      type: onGetContainerType(),
+      cancelDrag: ".tabs-container *",
+      width: styles == null ? void 0 : styles.width,
+      height: styles == null ? void 0 : styles.height,
+      minWidth: styles == null ? void 0 : styles.minWidth,
+      minHeight: styles == null ? void 0 : styles.minHeight,
+      className: styles == null ? void 0 : styles.className,
+      title: styles == null ? void 0 : styles.title,
+      imgSrc: styles == null ? void 0 : styles.imgSrc,
+      imgWidth: styles == null ? void 0 : styles.imgWidth
+    }, TabsCore());
+  }
+  return React__default.createElement(NonDraggableWrapper, {
     width: styles == null ? void 0 : styles.width,
     height: styles == null ? void 0 : styles.height,
     minWidth: styles == null ? void 0 : styles.minWidth,
-    minHeight: styles == null ? void 0 : styles.minHeight,
-    className: styles == null ? void 0 : styles.className,
-    title: styles == null ? void 0 : styles.title,
-    imgSrc: styles == null ? void 0 : styles.imgSrc,
-    imgWidth: styles == null ? void 0 : styles.imgWidth
-  }, onRenderTabs(), React__default.createElement(BodyContainer, {
-    selectedTab: selectedTab,
-    className: type + " tabs-container"
-  }, children));
+    minHeight: styles == null ? void 0 : styles.minHeight
+  }, TabsCore());
 };
 var BodyContainer = /*#__PURE__*/styled__default.div.withConfig({
   displayName: "TabsContainer__BodyContainer",
@@ -31485,6 +31497,18 @@ var BodyContainer = /*#__PURE__*/styled__default.div.withConfig({
 })(["display:flex;width:100%;height:100%;justify-content:space-between;& > *:not([data-tab-id=", "]){display:none;}&.brown{border:0.25rem solid #996D55;background-color:#BF886A;}&.gray{border:0.25rem solid rgba(0,0,0,0.25);background-color:#4E4A4E;}border-radius:5px;padding:0.5rem;"], function (props) {
   return props.selectedTab;
 });
+var NonDraggableWrapper = /*#__PURE__*/styled__default.div.withConfig({
+  displayName: "TabsContainer__NonDraggableWrapper",
+  componentId: "sc-s81iap-1"
+})(["height:", ";width:", ";min-width:", ";min-height:", ";display:flex;flex-wrap:wrap;image-rendering:pixelated;overflow-y:hidden;padding-top:1.5rem;position:relative;"], function (props) {
+  return props.height || 'auto';
+}, function (props) {
+  return props.width || '50%';
+}, function (props) {
+  return props.minWidth || 'auto';
+}, function (props) {
+  return props.minHeight || 'auto';
+});
 
 var PartyCreate = function PartyCreate(_ref) {
   var onClose = _ref.onClose,