feat: try add layoutAction

Author: itwillwork

src/lib/core/types/specs.ts

@@ -25,6 +25,7 @@ export interface ArraySpec<
         layout?: string;
         layoutTitle?: string;
         layoutDescription?: string;
+        layoutAction?: string;
         layoutOpen?: boolean;
         itemLabel?: string;
         itemPrefix?: string;
@@ -66,6 +67,7 @@ export interface BooleanSpec<
         layout?: string;
         layoutTitle?: string;
         layoutDescription?: string;
+        layoutAction?: string;
         layoutOpen?: boolean;
         link?: LinkType;
         hidden?: boolean;
@@ -92,6 +94,7 @@ export interface NumberSpec<
         layout?: string;
         layoutTitle?: string;
         layoutDescription?: string;
+        layoutAction?: string;
         layoutOpen?: boolean;
         link?: LinkType;
         placeholder?: string;
@@ -119,6 +122,7 @@ export interface ObjectSpec<
         layout?: string;
         layoutTitle?: string;
         layoutDescription?: string;
+        layoutAction?: string;
         layoutOpen?: boolean;
         order?: string[];
         link?: LinkType;
@@ -155,6 +159,7 @@ export interface StringSpec<
         layout?: string;
         layoutTitle?: string;
         layoutDescription?: string;
+        layoutAction?: string;
         layoutOpen?: boolean;
         link?: LinkType;
         sizeParams?: {

src/lib/kit/components/Layouts/Column/Column.scss

@@ -11,19 +11,19 @@
         min-height: var(--df-column-first-row-min-height, 28px);
         display: flex;
         margin-bottom: auto;
-        flex-direction: column;
+        flex-direction: row;
         flex-shrink: 0;
 
         &-inner {
-            display: inline;
+            flex-grow: 1;
             margin-top: auto;
             margin-bottom: auto;
         }
 
-        &::after {
-            content: '';
-            width: 100%;
-            flex-shrink: 1;
+        &-action {
+            padding-left: var(--g-spacing-2);
+            margin-top: auto;
+            margin-bottom: auto;
         }
     }
 

src/lib/kit/components/Layouts/Column/Column.tsx

@@ -47,6 +47,9 @@ const ColumnBase = <T extends FieldValue, S extends Spec>({
                         </span>
                     ) : null}
                 </div>
+                {Boolean(spec.viewSpec.layoutAction) && (
+                    <div className={b('first-row-action')}>{spec.viewSpec.layoutAction}</div>
+                )}
             </div>
             <div className={b('second-row')}>
                 <div className={b('second-row-inner')}>

src/lib/kit/components/Layouts/Row/Row.scss

@@ -24,6 +24,10 @@
             margin-bottom: auto;
         }
 
+        &-action {
+            padding-left: var(--g-spacing-2);
+        }
+
         &::after {
             content: '';
             width: 100%;

src/lib/kit/components/Layouts/Row/Row.tsx

@@ -49,6 +49,9 @@ const RowBase = <T extends FieldValue, S extends Spec>({
                             </Text>
                         </span>
                     ) : null}
+                    {Boolean(spec.viewSpec.layoutAction) && (
+                        <span className={b('left-action')}>{spec.viewSpec.layoutAction}</span>
+                    )}
                 </div>
             </div>
             <div className={b('right')}>