docs(components/column): add Column docs and preview image

Author: shadow3aaa

docs/en/components/column.md

@@ -0,0 +1,50 @@
+---
+title: Column
+order: 6
+---
+
+# Column
+
+```rust
+pub fn column<F>(args: ColumnArgs, scope_config: F)
+where
+    F: FnOnce(&mut ColumnScope<'_>),
+```
+
+The `column` component arranges a set of child components vertically.
+
+Unlike other container components, `column` requires adding children via methods on `ColumnScope` such as `child`, instead of calling child component functions directly inside the closure.
+
+::: warning
+If you try to call child component functions directly inside the closure, the `column` component will panic at runtime.
+:::
+
+Here is a correct example of using the `column` component:
+
+```rust
+use tessera_ui_basic_components::{
+    column::{column, ColumnArgs},
+    text::text,
+    spacer::{spacer, SpacerArgs},
+};
+
+column(ColumnArgs::default(), |scope| {
+    scope.child(|| text("First item".to_string()));
+    scope.child_weighted(|| spacer(SpacerArgs::default()), 1.0); // This spacer will be flexible
+    scope.child(|| text("Last item".to_string()));
+});
+```
+
+## Arguments
+
+- `args: ColumnArgs`
+
+  This argument configures the `column` component's style including width, height, alignment, etc. Use `ColumnArgsBuilder` to construct it.
+
+- `scope_config: F`
+
+  A closure used to add child components into the `column`. The closure receives a `&mut ColumnScope` and you should use its `child`, `child_weighted`, etc. methods to add children.
+
+## Preview
+
+![column](/column_example.png)

docs/public/column_example.png

@@ -0,0 +1,50 @@
+---
+title: Column 组件
+order: 6
+---
+
+# Column
+
+```rust
+pub fn column<F>(args: ColumnArgs, scope_config: F)
+where
+    F: FnOnce(&mut ColumnScope<'_>),
+```
+
+`column` 组件用于垂直排列一组子组件。
+
+不像别的容器组件，`column` 组件要求你使用 `ColumnScope::child` 等方法来添加子组件，而非直接在闭包中调用子组件函数。
+
+::: warning
+如果尝试在闭包中直接调用子组件函数，`column` 组件将在运行时崩溃。
+:::
+
+以下是一个正确使用 `column` 组件的例子：
+
+```rust
+use tessera_ui_basic_components::{
+    column::{column, ColumnArgs},
+    text::text,
+    spacer::{spacer, SpacerArgs},
+};
+
+column(ColumnArgs::default(), |scope| {
+    scope.child(|| text("First item".to_string()));
+    scope.child_weighted(|| spacer(SpacerArgs::default()), 1.0); // This spacer will be flexible
+    scope.child(|| text("Last item".to_string()));
+});
+```
+
+## 参数
+
+- `args: ColumnArgs`
+
+  该参数用于配置 `column` 组件的样式，包括宽高、对齐方式等。使用 `ColumnArgsBuilder` 来构建它。
+
+- `scope_config: F`
+
+  该参数是一个闭包，用于添加子组件到 `column` 组件中。闭包接收一个 `&mut ColumnScope` 参数，使用它的 `child`、`child_weighted` 等方法来添加子组件。
+
+## 预览
+
+![column](/column_example.png)