From 3a5c29fe0dcfa624519e06eca2bd1409f0367c42 Mon Sep 17 00:00:00 2001
From: zestack <simplism.dev@gmail.com>
Date: Wed, 29 Nov 2023 12:32:39 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=87=AA=E5=8A=A8=E5=BC=B9=E6=80=A7?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/engineer/render.ts | 12 ++++++++++--
 src/engineer/types.ts  | 12 ++++++++++--
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/src/engineer/render.ts b/src/engineer/render.ts
index bd34b58..732546e 100644
--- a/src/engineer/render.ts
+++ b/src/engineer/render.ts
@@ -8,7 +8,7 @@ import { defineComponent, h } from 'vue'
 import type {
   Axis,
   Block,
-  DataRefer,
+  DataRefer, Theme,
   View,
   ViewChildren,
   Widget,
@@ -55,6 +55,14 @@ function isRefer(s: any): s is DataRefer {
     && typeof s.key === 'string'
 }
 
+export const isFlexible = (theme: Theme) => {
+  return theme.axis != null
+    || theme.mainAlign != null
+    || theme.crossAlign != null
+    || theme.wrap != null
+    || theme.gap != null
+}
+
 export function render(view?: ViewChildren, axis?: Axis): VNodeChild {
   if (view == null)
     return null
@@ -135,7 +143,7 @@ export function render(view?: ViewChildren, axis?: Axis): VNodeChild {
   // 所以在这里复用它用于子视图构建
   axis = theme?.axis
 
-  if (theme?.flexible) {
+  if (theme?.flexible || (theme && theme.flexible == null && isFlexible(theme))) {
     Object.assign(css, {
       display: 'flex',
       flexDirection: axis === 'y' ? 'column' : undefined,
diff --git a/src/engineer/types.ts b/src/engineer/types.ts
index d5bc145..58f12d1 100644
--- a/src/engineer/types.ts
+++ b/src/engineer/types.ts
@@ -264,9 +264,17 @@ export type ClipBehavior =
  * 描述了视图的基本布局和外观表现。
  */
 export interface Theme extends Textual, Flexible, Boxed, Decoration, Spatial, Flexible {
-  /** 是否开启弹性布局,todo 删除改属性，根据属性判断是否启用 flex 布局 */
+  /**
+   * 是否强制开启弹性布局
+   *
+   * 当未给出该属性时，如果指定了 Flexible 中的属性，引擎会自动启用弹性布局。
+   */
   flexible?: boolean
-  /** 超出视图剪切方式，对应 overflow 属性 */
+  /**
+   * 超出视图剪切方式
+   *
+   * 对应 overflow 属性
+   */
   clip?: ClipBehavior
 }