Set pre-wrap for doc descriptions

src/components/BrickDocEvents/index.tsx

@@ -37,7 +37,7 @@ export default function BrickDocEvents({
                 {event.deprecated ? <del>{event.name}</del> : event.name}
               </code>
             </td>
-            <td>{event.description}</td>
+            <td className="pre-wrap">{event.description}</td>
             <td>
               <MaybeEmptyCode>
                 {event.detail?.annotation ? (

src/components/BrickDocInterface/index.tsx

@@ -58,7 +58,7 @@ export default function BrickDocInterface({
               <td style={{ textAlign: "center" }}>
                 {item.type === "indexSignature" || item.optional ? "" : "✅"}
               </td>
-              <td>{item.description}</td>
+              <td className="pre-wrap">{item.description}</td>
             </tr>
           ))}
         </tbody>

src/components/BrickDocMethods/index.tsx

@@ -45,7 +45,7 @@ export default function BrickDocMethods({
                 {method.deprecated ? <del>{method.name}</del> : method.name}
               </code>
             </td>
-            <td>{method.description}</td>
+            <td className="pre-wrap">{method.description}</td>
             <td>
               {method.params.map((param, index, array) => (
                 <React.Fragment key={index}>

src/components/BrickDocParts/index.tsx

@@ -20,7 +20,7 @@ export default function BrickDocParts({
             <td>
               <code>{part.name}</code>
             </td>
-            <td>{part.description}</td>
+            <td className="pre-wrap">{part.description}</td>
           </tr>
         ))}
       </tbody>

src/components/BrickDocProperties/index.tsx

@@ -37,7 +37,7 @@ export default function BrickDocProperties({
                 {prop.deprecated ? <del>{prop.name}</del> : prop.name}
               </code>
             </td>
-            <td>{prop.description}</td>
+            <td className="pre-wrap">{prop.description}</td>
             <td>
               <MaybeEmptyCode>
                 <GeneralType annotation={prop.annotation} />

src/components/BrickDocSlots/index.tsx

@@ -3,9 +3,9 @@ import type { SlotManifest } from "@next-core/brick-manifest";
 import MaybeEmptyCode from "@site/src/components/MaybeEmptyCode";
 
 export default function BrickDocSlots({
-  slots
+  slots,
 }: {
-  slots: SlotManifest[]
+  slots: SlotManifest[];
 }): JSX.Element {
   return (
     <table>
@@ -16,15 +16,15 @@ export default function BrickDocSlots({
         </tr>
       </thead>
       <tbody>
-        {
-          slots.map(slot => (
-            <tr key={slot.name}>
-              <td><MaybeEmptyCode fallback="(default)">{slot.name}</MaybeEmptyCode></td>
-              <td>{slot.description}</td>
-            </tr>
-          ))
-        }
+        {slots.map((slot) => (
+          <tr key={slot.name}>
+            <td>
+              <MaybeEmptyCode fallback="(default)">{slot.name}</MaybeEmptyCode>
+            </td>
+            <td className="pre-wrap">{slot.description}</td>
+          </tr>
+        ))}
       </tbody>
     </table>
-  )
+  );
 }

src/components/ProviderDocParams/index.tsx

@@ -40,7 +40,7 @@ export default function ProviderDocParams({
                 {param.name}
               </code>
             </td>
-            <td>{param.description}</td>
+            <td className="pre-wrap">{param.description}</td>
             <td>
               <MaybeEmptyCode>
                 <GeneralType annotation={param.annotation} />

src/css/custom.css

@@ -96,3 +96,7 @@ html[data-theme="dark"] .header-github-link::before {
 
 @media (max-width: 640px) {
 }
+
+.pre-wrap {
+  white-space: pre-wrap;
+}