From 02f310afdf34efd5ec3179839a5eb55376e2d167 Mon Sep 17 00:00:00 2001
From: lipemat <mat@matlipe.com>
Date: Mon, 15 Feb 2021 17:21:25 -0500
Subject: [PATCH] Add Truncate helper to @wordpress/components

Use to truncate text contents to a particular length or number of lines.

Available as of Gutenberg 9.9

https://make.wordpress.org/core/2021/02/05/whats-new-in-gutenberg-9-9-5-february/

https://github.com/WordPress/gutenberg/pull/28176
---
 wordpress__components/index.d.ts | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/wordpress__components/index.d.ts b/wordpress__components/index.d.ts
index b2ad187..1b29556 100644
--- a/wordpress__components/index.d.ts
+++ b/wordpress__components/index.d.ts
@@ -490,6 +490,23 @@ declare module '@wordpress/components' {
 		type?: string;
 	}
 
+	/**
+	 * Truncate is a typography primitive that trims text content.
+	 * For almost all cases, it is recommended that Text, Heading, or Subheading is used to render text content.
+	 *
+	 * However, Truncate is available for custom implementations.
+	 */
+	interface Truncate {
+		// The ellipsis string when truncate is set.
+		ellipsis?: string;
+		// Determines where to truncate. For example, we can truncate text right in the middle. To do this, we need to set ellipsizeMode to middle and a text limit.
+		ellipsizeMode?: 'auto' | 'head' | 'middle' | 'tail';
+		// Determines the max characters when truncate is set.
+		limit?: number;
+		// Clamps the text content to the specifiec numberOfLines, adding the ellipsis at the end.
+		numberOfLines?: number;
+	}
+
 	export interface withSpokenMessages {
 		speak?: ( message: string, ariaLive?: 'polite' | 'assertive' ) => void;
 		debouncedSpeak?: ( message: string, ariaLive?: 'polite' | 'assertive' ) => void;
@@ -510,6 +527,7 @@ declare module '@wordpress/components' {
 	export const Spinner: ComponentType<{}>;
 	export const TextControl: ComponentType<TextControl>;
 	export const Tooltip: Tooltip;
+	export const Truncate: Truncate;
 
 	export default interface Components {
 		Button: ComponentType<ButtonLink | ButtonButton>;
@@ -527,6 +545,7 @@ declare module '@wordpress/components' {
 		Spinner: ComponentType<{}>;
 		TextControl: ComponentType<TextControl>;
 		Tooltip: ComponentType<Tooltip>;
+		Truncate: Truncate;
 	}
 }