added prop

elastic · May 12, 2020 · faaa6ad · faaa6ad
1 parent c4d93cd
commit faaa6ad
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/src-docs/src/views/expression/truncate.tsx b/src-docs/src/views/expression/truncate.tsx
@@ -72,6 +72,7 @@ export default class extends Component<TruncateProps, TruncateState> {
       <EuiPopover
         button={
           <EuiExpression
+            truncate={true}
             style={{ maxWidth: '220px' }}
             description="Average of"
             value={this.state.value}

diff --git a/src/components/expression/_expression.scss b/src/components/expression/_expression.scss
@@ -6,7 +6,6 @@
   // @include euiTextBreakWord; /* 1 */
   @include euiFontSizeS;
   @include euiCodeFont;
-  @include euiTextTruncate;
 
   display: inline-block; /* 1 */
   text-align: left;
@@ -25,9 +24,14 @@
 }
 
 .euiExpression-isUppercase .euiExpression__description {
+  @include euiTextTruncate;
   text-transform: uppercase;
 }
 
+.euiExpression-isTruncate {
+  @include euiTextTruncate;
+}
+
 .euiExpression-isClickable {
   cursor: pointer;
   border-bottom: $euiBorderEditable;

diff --git a/src/components/expression/expression.tsx b/src/components/expression/expression.tsx
@@ -66,6 +66,10 @@ export type EuiExpressionProps = CommonProps & {
    * Turns the component into a button and adds an editable style border at the bottom
    */
   onClick?: MouseEventHandler<HTMLButtonElement>;
+  /**
+   * Truncates text
+   */
+  truncate?: boolean;
 };
 
 type Buttonlike = EuiExpressionProps &
@@ -85,6 +89,7 @@ export const EuiExpression: React.FunctionComponent<
   valueProps,
   color = 'secondary',
   uppercase = true,
+  truncate = false,
   isActive = false,
   onClick,
   ...rest
@@ -96,6 +101,7 @@ export const EuiExpression: React.FunctionComponent<
       'euiExpression-isActive': isActive,
       'euiExpression-isClickable': onClick,
       'euiExpression-isUppercase': uppercase,
+      'euiExpression-isTruncate': truncate,
     },
     colorToClassNameMap[color]
   );