Add no-wrap definition to BlockSelect component for proper inline `…

…ellipsis` rendering
stellar-expert · Apr 28, 2023 · c1462ca · c1462ca
1 parent 676b0a5
commit c1462ca
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/basic-styles/grid.scss b/basic-styles/grid.scss
@@ -237,6 +237,11 @@
   display: inline-block;
 }
 
+.inline-overflow {
+  display: inline-flex;
+  max-width: 100%;
+}
+
 .flex-row {
   display: flex;
   justify-content: space-between;

diff --git a/interaction/block-select.js b/interaction/block-select.js
@@ -34,6 +34,9 @@ export function BlockSelect({as = 'span', children, title, className, wrap, inli
     if (wrap) {
         props.style = {...props.style, whiteSpace: 'normal', overflow: 'visible'}
     }
+    if (wrap === false) {
+        props.style = {...props.style, whiteSpace: 'nowrap', overflow: 'hidden'}
+    }
     if (inline){
         props.style = {...props.style, display: 'inline'}
     }

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@stellar-expert/ui-framework",
-  "version": "1.3.5",
+  "version": "1.3.6",
   "private": true,
   "description": "StellarExpert shared UI components library",
   "main": "index.js",