diff --git a/crates/story/examples/markdown.md b/crates/story/examples/markdown.md
index e3f204d6..7f8239b9 100644
--- a/crates/story/examples/markdown.md
+++ b/crates/story/examples/markdown.md
@@ -79,11 +79,11 @@ Here is a link to [Google](https://www.google.com), and another to [Rust](https:
### Table
-| Header 1 | Header 2 | Header 3 | Header 4 |
-| -------- | -------- | ------------------------------------ | -------- |
-| Cell 0 | Cell 1 | This is a long cell with line break. | Cell 3 |
-| Row 2 | Row 2 | Row 2
[Link](https://github.com) | Row 2 |
-| Row 3 | **Bold** | Row 3 | Row 3 |
+| Header 1 | Centered | Header 3 | Align Right |
+| -------- | :------: | ------------------------------------ | ----------: |
+| Cell 0 | Cell 1 | This is a long cell with line break. | Cell 3 |
+| Row 2 | Row 2 | Row 2
[Link](https://github.com) | Row 2 |
+| Row 3 | **Bold** | Row 3 | Row 3 |
#### Lists
diff --git a/crates/ui/src/text/element.rs b/crates/ui/src/text/element.rs
index a8c36c49..88573f4d 100644
--- a/crates/ui/src/text/element.rs
+++ b/crates/ui/src/text/element.rs
@@ -6,6 +6,7 @@ use gpui::{
IntoElement, Length, ObjectFit, ParentElement, RenderOnce, SharedString, SharedUri, Styled,
StyledImage as _, StyledText, Window,
};
+use markdown::mdast;
use crate::{h_flex, v_flex, ActiveTheme as _, Icon, IconName};
@@ -99,6 +100,32 @@ impl From for Paragraph {
#[derive(Debug, Default, Clone, PartialEq)]
pub struct Table {
pub children: Vec,
+ pub column_aligns: Vec,
+}
+
+impl Table {
+ pub(crate) fn column_align(&self, index: usize) -> TableColumnAlign {
+ self.column_aligns.get(index).copied().unwrap_or_default()
+ }
+}
+
+#[derive(Debug, Default, Copy, Clone, PartialEq)]
+pub enum TableColumnAlign {
+ #[default]
+ Left,
+ Center,
+ Right,
+}
+
+impl From for TableColumnAlign {
+ fn from(value: mdast::AlignKind) -> Self {
+ match value {
+ mdast::AlignKind::None => TableColumnAlign::Left,
+ mdast::AlignKind::Left => TableColumnAlign::Left,
+ mdast::AlignKind::Center => TableColumnAlign::Center,
+ mdast::AlignKind::Right => TableColumnAlign::Right,
+ }
+ }
}
#[derive(Debug, Default, Clone, PartialEq)]
@@ -461,6 +488,8 @@ impl Node {
.children({
let mut cells = Vec::with_capacity(row.children.len());
for (ix, cell) in row.children.iter().enumerate() {
+ let align = table.column_align(ix);
+ let is_last_col = ix == row.children.len() - 1;
let len = col_lens
.get(ix)
.copied()
@@ -470,9 +499,20 @@ impl Node {
cells.push(
div()
.id("cell")
+ .flex()
+ .when(align == TableColumnAlign::Center, |this| {
+ this.justify_center()
+ })
+ .when(align == TableColumnAlign::Right, |this| {
+ this.justify_end()
+ })
.w(Length::Definite(relative(len as f32)))
.px_2()
.py_1()
+ .when(!is_last_col, |this| {
+ this.border_r_1()
+ .border_color(cx.theme().border)
+ })
.truncate()
.child(cell.children.clone()),
)
diff --git a/crates/ui/src/text/markdown.rs b/crates/ui/src/text/markdown.rs
index 72a08947..984db6b0 100644
--- a/crates/ui/src/text/markdown.rs
+++ b/crates/ui/src/text/markdown.rs
@@ -437,6 +437,12 @@ impl From for element::Node {
Node::ThematicBreak(_) => element::Node::Divider,
Node::Table(val) => {
let mut table = Table::default();
+ table.column_aligns = val
+ .align
+ .clone()
+ .into_iter()
+ .map(|align| align.into())
+ .collect();
val.children.iter().for_each(|c| {
if let Node::TableRow(row) = c {
parse_table_row(&mut table, row);