diff --git a/canon-docs/src/app/(docs)/components/heading/page.mdx b/canon-docs/src/app/(docs)/components/heading/page.mdx
index 10fd60bef1..e09bae9945 100644
--- a/canon-docs/src/app/(docs)/components/heading/page.mdx
+++ b/canon-docs/src/app/(docs)/components/heading/page.mdx
@@ -62,6 +62,22 @@ appearance of the heading.
`}
/>
+### Truncate
+
+The `Heading` component has a `truncate` prop that can be used to truncate the
+heading.
+
+}
+ code={`
+ A man looks at a painting in a museum and says, “Brothers and sisters I
+ have none, but that man's father is my father's son.” Who is
+ in the painting?
+ `}
+/>
+
### Responsive
You can also use the `variant` prop to change the appearance of the text based
diff --git a/canon-docs/src/app/(docs)/components/heading/props.ts b/canon-docs/src/app/(docs)/components/heading/props.ts
index a3dd3288ff..6d62d2dee1 100644
--- a/canon-docs/src/app/(docs)/components/heading/props.ts
+++ b/canon-docs/src/app/(docs)/components/heading/props.ts
@@ -12,6 +12,10 @@ export const headingPropDefs: Record = {
values: ['ReactNode'],
responsive: false,
},
+ truncate: {
+ type: 'boolean',
+ default: 'false',
+ },
...classNamePropDefs,
...stylePropDefs,
};
diff --git a/canon-docs/src/app/(docs)/components/text/page.mdx b/canon-docs/src/app/(docs)/components/text/page.mdx
index 70d5de5504..85a783f4f3 100644
--- a/canon-docs/src/app/(docs)/components/text/page.mdx
+++ b/canon-docs/src/app/(docs)/components/text/page.mdx
@@ -102,6 +102,21 @@ appearance of the text.
`}
/>
+### Truncate
+
+The `Text` component has a `truncate` prop that can be used to truncate the
+text.
+
+}
+ code={`
+ A man looks at a painting in a museum and says, “Brothers and sisters I
+ have none, but that man's father is my father's son.” Who is
+ in the painting?
+ `}
+/>
+
### Responsive
You can also use the `variant` prop to change the appearance of the text based
diff --git a/canon-docs/src/app/(docs)/components/text/props.ts b/canon-docs/src/app/(docs)/components/text/props.ts
index 53413dc9e7..76c229af58 100644
--- a/canon-docs/src/app/(docs)/components/text/props.ts
+++ b/canon-docs/src/app/(docs)/components/text/props.ts
@@ -16,6 +16,10 @@ export const textPropDefs: Record = {
values: ['regular', 'bold'],
responsive: true,
},
+ truncate: {
+ type: 'boolean',
+ default: 'false',
+ },
...childrenPropDefs,
...classNamePropDefs,
...stylePropDefs,