@rpg-engine/long-bow 0.2.47 → 0.2.48

package/dist/components/shared/Ellipsis.d.ts

@@ -2,8 +2,9 @@ import React from 'react';
 interface IProps {
     children: React.ReactNode;
     maxLines: 1 | 2 | 3;
-    maxWidth: number;
+    maxWidth: string;
     fontSize?: string;
+    center?: boolean;
 }
-export declare const Ellipsis: ({ children, maxLines, maxWidth, fontSize, }: IProps) => JSX.Element;
+export declare const Ellipsis: ({ children, maxLines, maxWidth, fontSize, center, }: IProps) => JSX.Element;
 export {};

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

@@ -27350,10 +27350,12 @@ var Ellipsis = function Ellipsis(_ref) {
   var children = _ref.children,
     maxLines = _ref.maxLines,
     maxWidth = _ref.maxWidth,
-    fontSize = _ref.fontSize;
+    fontSize = _ref.fontSize,
+    center = _ref.center;
   return React__default.createElement(Container$1, {
     maxWidth: maxWidth,
-    fontSize: fontSize
+    fontSize: fontSize,
+    center: center
   }, React__default.createElement("div", {
     className: "ellipsis-" + maxLines + "-lines"
   }, children));
@@ -27361,10 +27363,10 @@ var Ellipsis = function Ellipsis(_ref) {
 var Container$1 = /*#__PURE__*/styled.div.withConfig({
   displayName: "Ellipsis__Container",
   componentId: "sc-ysrlju-0"
-})(["p{font-size:", ";}.ellipsis-1-lines{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:", "px;}.ellipsis-2-lines{display:-webkit-box;max-width:", "px;height:25px;margin:0 auto;line-height:1;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis;overflow:hidden;}.ellipsis-3-lines{display:-webkit-box;max-width:", "px;height:43px;margin:0 auto;line-height:1;-webkit-line-clamp:3;-webkit-box-orient:vertical;text-overflow:ellipsis;overflow:hidden;}"], function (props) {
-  return props.fontSize || '1rem';
-}, function (props) {
+})([".ellipsis-1-lines{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:", ";", "}.ellipsis-2-lines{display:-webkit-box;max-width:", "px;height:25px;margin:0 auto;line-height:1;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis;overflow:hidden;}.ellipsis-3-lines{display:-webkit-box;max-width:", "px;height:43px;margin:0 auto;line-height:1;-webkit-line-clamp:3;-webkit-box-orient:vertical;text-overflow:ellipsis;overflow:hidden;}"], function (props) {
   return props.maxWidth;
+}, function (props) {
+  return props.center && "margin: 0 auto;";
 }, function (props) {
   return props.maxWidth;
 }, function (props) {
@@ -27401,10 +27403,11 @@ var PropertySelect = function PropertySelect(_ref) {
     }
     return '';
   };
-  return React__default.createElement(Container$2, null, React__default.createElement(TextOverlay, null, React__default.createElement(Item, null, React__default.createElement(Ellipsis, {
+  return React__default.createElement(Container$2, null, React__default.createElement(TextOverlay, null, React__default.createElement("p", null, React__default.createElement(Item, null, React__default.createElement(Ellipsis, {
     maxLines: 1,
-    maxWidth: 200
-  }, getCurrentSelectionName()))), React__default.createElement("div", {
+    maxWidth: "60%",
+    center: true
+  }, getCurrentSelectionName())))), React__default.createElement("div", {
     className: "rpgui-progress-track"
   }), React__default.createElement(SelectArrow, {
     direction: "left",
@@ -28060,7 +28063,7 @@ var ItemSlot = /*#__PURE__*/mobxReactLite.observer(function (_ref) {
         key: "qty-" + itemId
       }, React__default.createElement(Ellipsis, {
         maxLines: 1,
-        maxWidth: 48
+        maxWidth: "48px"
       }, React__default.createElement(ItemQty, {
         className: isFractionalStackQty || isLargerThan999 ? 'small' : 'regular'
       }, ' ', stackQty, ' ')));
@@ -29436,10 +29439,10 @@ var TradingItemRow = function TradingItemRow(_ref) {
     atlasJSON: atlasJSON,
     spriteKey: traderItem.texturePath,
     imgScale: 2.5
-  }))), React__default.createElement(ItemNameContainer, null, React__default.createElement(NameValue, null, React__default.createElement(Ellipsis, {
+  }))), React__default.createElement(ItemNameContainer, null, React__default.createElement(NameValue, null, React__default.createElement("p", null, React__default.createElement(Ellipsis, {
     maxLines: 1,
-    maxWidth: 250
-  }, capitalize(traderItem.name)), React__default.createElement("p", null, "$", traderItem.price))), React__default.createElement(QuantityContainer, null, React__default.createElement(SelectArrow, {
+    maxWidth: "250px"
+  }, capitalize(traderItem.name))), React__default.createElement("p", null, "$", traderItem.price))), React__default.createElement(QuantityContainer, null, React__default.createElement(SelectArrow, {
     size: 32,
     className: "arrow-selector",
     direction: "left",