@fangzhongya/fang-ui 0.1.4 → 0.1.6

package/dist/components/forms/index.css

@@ -599,8 +599,8 @@
 }
 .forms-div--query .forms-li {
   height: fit-content;
-  margin-top: var(--forms-query-interval);
-  margin-bottom: var(--forms-query-interval);
+  margin-top: var(--forms-interval);
+  margin-bottom: var(--forms-interval);
   margin-right: var(--forms-inline-right);
 }
 .forms-div--query .forms-li .el-form-item {

package/dist/components/forms/index.scss

@@ -65,8 +65,8 @@ $forms: 'forms';
 		}
 		.#{z($forms, 'li')} {
 			height: fit-content;
-			margin-top: var(vdm('query-interval', $forms));
-			margin-bottom: var(vdm('query-interval', $forms));
+			margin-top: var(vdm('interval', $forms));
+			margin-bottom: var(vdm('interval', $forms));
 			margin-right: var(vdm('inline-right', $forms));
 			.#{e()}form-item {
 				margin-bottom: 0;

package/dist/components/forms/src/data.cjs

@@ -109,13 +109,20 @@ const dataProps = {
     type: Boolean
   },
   /**
-   * @props { String } queryInterval='6px'
+   * @props { String } interval='6px'
    * 查询模式的上下间距
    */
-  queryInterval: {
+  interval: {
     type: String,
     default: "6px"
   },
+  /**
+   * @props { String } intervalHorizon
+   * 查询模式的左右间距
+   */
+  intervalHorizon: {
+    type: String
+  },
   /**
    * @props { String } inlineRight='32px'
    * 内连接右间距

package/dist/components/forms/src/data.d.ts

@@ -119,13 +119,20 @@ export declare const dataProps: {
         type: BooleanConstructor;
     };
     /**
-     * @props { String } queryInterval='6px'
+     * @props { String } interval='6px'
      * 查询模式的上下间距
      */
-    queryInterval: {
+    interval: {
         type: StringConstructor;
         default: string;
     };
+    /**
+     * @props { String } intervalHorizon
+     * 查询模式的左右间距
+     */
+    intervalHorizon: {
+        type: StringConstructor;
+    };
     /**
      * @props { String } inlineRight='32px'
      * 内连接右间距

package/dist/components/forms/src/data.js

@@ -107,13 +107,20 @@ const dataProps = {
     type: Boolean
   },
   /**
-   * @props { String } queryInterval='6px'
+   * @props { String } interval='6px'
    * 查询模式的上下间距
    */
-  queryInterval: {
+  interval: {
     type: String,
     default: "6px"
   },
+  /**
+   * @props { String } intervalHorizon
+   * 查询模式的左右间距
+   */
+  intervalHorizon: {
+    type: String
+  },
   /**
    * @props { String } inlineRight='32px'
    * 内连接右间距

package/dist/components/forms/src/index2.cjs

@@ -78,7 +78,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         style: vue.unref(cs).vdo({
           itemBottom: _ctx.itemBottom,
           inlineRight: _ctx.inlineRight,
-          queryInterval: _ctx.queryInterval,
+          interval: _ctx.interval,
           rowHeight: _ctx.rowHeight
         })
       }, vue.unref(attrs).root), [

package/dist/components/forms/src/index2.js

@@ -76,7 +76,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         style: unref(cs).vdo({
           itemBottom: _ctx.itemBottom,
           inlineRight: _ctx.inlineRight,
-          queryInterval: _ctx.queryInterval,
+          interval: _ctx.interval,
           rowHeight: _ctx.rowHeight
         })
       }, unref(attrs).root), [

package/dist/components/forms-drag/src/index2.cjs

@@ -106,7 +106,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         style: vue.unref(cs).vdo({
           itemBottom: _ctx.itemBottom,
           inlineRight: _ctx.inlineRight,
-          queryInterval: _ctx.queryInterval,
+          interval: _ctx.interval,
           rowHeight: _ctx.rowHeight
         })
       }, vue.unref(attrs).root), [

package/dist/components/forms-drag/src/index2.js

@@ -104,7 +104,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         style: unref(cs).vdo({
           itemBottom: _ctx.itemBottom,
           inlineRight: _ctx.inlineRight,
-          queryInterval: _ctx.queryInterval,
+          interval: _ctx.interval,
           rowHeight: _ctx.rowHeight
         })
       }, unref(attrs).root), [

package/dist/components/index.scss

@@ -116,5 +116,5 @@
 @use './paging/index.scss' as *;
 @use './tables/index.scss' as *;
 @use './tablesp/index.scss' as *;
-@use './tabless/index.scss' as *;
-@use './tablesv/index.scss' as *;
+@use './tablesv/index.scss' as *;
+@use './tablesvp/index.scss' as *;

package/dist/components/index2.scss

@@ -116,5 +116,5 @@
 @use './paging/style/index2.scss' as *;
 @use './tables/style/index2.scss' as *;
 @use './tablesp/style/index2.scss' as *;
-@use './tabless/style/index2.scss' as *;
-@use './tablesv/style/index2.scss' as *;
+@use './tablesv/style/index2.scss' as *;
+@use './tablesvp/style/index2.scss' as *;

package/dist/components/list/index.css

@@ -31,17 +31,20 @@
 }
 .list-div .list-table .list-table-td,
 .list-div .list-table .list-table-th {
-  padding: 6px;
+  padding: var(--list-interval) var(--list-interval-horizon, var(--list-interval));
 }
 .list-div .list-table .list-table-auto {
   width: 100%;
   display: inline-flex;
-  align-items: center;
   word-break: break-all;
 }
 .list-div .list-table .list-table-auto .list-table-td {
   flex: 1;
 }
+.list-div .list-table .list-table-auto .is-width .list-table-label {
+  word-break: break-all;
+  white-space: normal;
+}
 .list-div .list-table .list-table-auto .list-table-label {
   white-space: nowrap;
 }
@@ -54,9 +57,6 @@
 .list-div .list-table.center .list-table-th {
   text-align: center;
 }
-.list-div .list-table.auto .list-table-th {
-  padding-right: 0;
-}
 .list-div .list-table.top .list-table-th {
   padding-bottom: 0;
 }

package/dist/components/list/index.scss

@@ -23,17 +23,26 @@ $list: 'list';
 			}
 			.#{z($list, 'table-td')},
 			.#{z($list, 'table-th')} {
-				padding: 6px;
+				padding: var(vdm('interval', $list))
+					var(
+						vdm('interval-horizon', $list),
+						var(vdm('interval', $list))
+					);
 			}
 
 			.#{z($list, 'table-auto')} {
 				width: 100%;
 				display: inline-flex;
-				align-items: center;
 				word-break: break-all;
 				.#{z($list, 'table-td')} {
 					flex: 1;
 				}
+				.#{is('width')} {
+					.#{z($list, 'table-label')} {
+						word-break: break-all;
+						white-space: normal;
+					}
+				}
 				.#{z($list, 'table-label')} {
 					white-space: nowrap;
 				}
@@ -52,11 +61,11 @@ $list: 'list';
 				}
 			}
 
-			&.auto {
-				.#{z($list, 'table-th')} {
-					padding-right: 0;
-				}
-			}
+			// &.auto {
+			// 	.#{z($list, 'table-th')} {
+			// 		padding-right: 0;
+			// 	}
+			// }
 			&.top {
 				.#{z($list, 'table-th')} {
 					padding-bottom: 0;

package/dist/components/list/src/data.cjs

@@ -68,12 +68,28 @@ const dataProps = {
     type: [Number, String]
     // default: '60px',
   },
+  /**
+   * @props { String } align ( )
+   * 左右位置
+   */
   align: {
     type: String
   },
+  /**
+   * @props { String } labelAlign ( )
+   * 标签展示左右位置
+   */
   labelAlign: {
     type: String
   },
+  /**
+   * @props { String } labelItems=center ( )
+   * 标签展示上下位置
+   */
+  labelItems: {
+    type: String,
+    default: "center"
+  },
   /**
    * @props { Boolean, String } border=true ( )
    * 是否需要边框，边框颜色
@@ -101,6 +117,21 @@ const dataProps = {
    */
   emptyDisplay: {
     type: String
+  },
+  /**
+   * @props { String } interval='8px'
+   * 查询模式的上下间距
+   */
+  interval: {
+    type: String,
+    default: "8px"
+  },
+  /**
+   * @props { String } intervalHorizon
+   * 查询模式的左右间距
+   */
+  intervalHorizon: {
+    type: String
   }
 };
 const dataEmits = ["list-events"];

package/dist/components/list/src/data.d.ts

@@ -73,12 +73,28 @@ export declare const dataProps: {
     labelWidth: {
         type: (StringConstructor | NumberConstructor)[];
     };
+    /**
+     * @props { String } align ( )
+     * 左右位置
+     */
     align: {
         type: StringConstructor;
     };
+    /**
+     * @props { String } labelAlign ( )
+     * 标签展示左右位置
+     */
     labelAlign: {
         type: StringConstructor;
     };
+    /**
+     * @props { String } labelItems=center ( )
+     * 标签展示上下位置
+     */
+    labelItems: {
+        type: StringConstructor;
+        default: string;
+    };
     /**
      * @props { Boolean, String } border=true ( )
      * 是否需要边框，边框颜色
@@ -106,6 +122,21 @@ export declare const dataProps: {
     emptyDisplay: {
         type: StringConstructor;
     };
+    /**
+     * @props { String } interval='8px'
+     * 查询模式的上下间距
+     */
+    interval: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @props { String } intervalHorizon
+     * 查询模式的左右间距
+     */
+    intervalHorizon: {
+        type: StringConstructor;
+    };
 };
 export type DataProps = ExtractPropTypes<typeof dataProps>;
 export declare const dataEmits: string[];

package/dist/components/list/src/data.js

@@ -66,12 +66,28 @@ const dataProps = {
     type: [Number, String]
     // default: '60px',
   },
+  /**
+   * @props { String } align ( )
+   * 左右位置
+   */
   align: {
     type: String
   },
+  /**
+   * @props { String } labelAlign ( )
+   * 标签展示左右位置
+   */
   labelAlign: {
     type: String
   },
+  /**
+   * @props { String } labelItems=center ( )
+   * 标签展示上下位置
+   */
+  labelItems: {
+    type: String,
+    default: "center"
+  },
   /**
    * @props { Boolean, String } border=true ( )
    * 是否需要边框，边框颜色
@@ -99,6 +115,21 @@ const dataProps = {
    */
   emptyDisplay: {
     type: String
+  },
+  /**
+   * @props { String } interval='8px'
+   * 查询模式的上下间距
+   */
+  interval: {
+    type: String,
+    default: "8px"
+  },
+  /**
+   * @props { String } intervalHorizon
+   * 查询模式的左右间距
+   */
+  intervalHorizon: {
+    type: String
   }
 };
 const dataEmits = ["list-events"];

package/dist/components/list/src/index2.cjs

@@ -142,6 +142,10 @@ const _sfc_main = vue.defineComponent({
           class: [
             cs.z("table-th"),
             cs.is("whole", obj.whole),
+            cs.is(
+              "width",
+              Boolean(obj.labelWidth || props.labelWidth)
+            ),
             obj.class ?? ""
           ].join(" "),
           colspan: props.labelPosition == "top" ? setColspan(obj) : void 0,
@@ -251,7 +255,10 @@ const _sfc_main = vue.defineComponent({
               vue.h(
                 "div",
                 {
-                  class: cs.z("table-auto")
+                  class: cs.z("table-auto"),
+                  style: {
+                    alignItems: obj.labelItems || props.labelItems
+                  }
                 },
                 arr
               )
@@ -289,7 +296,8 @@ const _sfc_main = vue.defineComponent({
           {
             class: cs.z("div"),
             style: cs.vdo({
-              borderColor: borderColor.value
+              borderColor: borderColor.value,
+              interval: props.interval
             })
             // onClick(event: Event) {
             // 	isfocus.value = true;

package/dist/components/list/src/index2.js

@@ -140,6 +140,10 @@ const _sfc_main = defineComponent({
           class: [
             cs.z("table-th"),
             cs.is("whole", obj.whole),
+            cs.is(
+              "width",
+              Boolean(obj.labelWidth || props.labelWidth)
+            ),
             obj.class ?? ""
           ].join(" "),
           colspan: props.labelPosition == "top" ? setColspan(obj) : void 0,
@@ -249,7 +253,10 @@ const _sfc_main = defineComponent({
               h(
                 "div",
                 {
-                  class: cs.z("table-auto")
+                  class: cs.z("table-auto"),
+                  style: {
+                    alignItems: obj.labelItems || props.labelItems
+                  }
                 },
                 arr
               )
@@ -287,7 +294,8 @@ const _sfc_main = defineComponent({
           {
             class: cs.z("div"),
             style: cs.vdo({
-              borderColor: borderColor.value
+              borderColor: borderColor.value,
+              interval: props.interval
             })
             // onClick(event: Event) {
             // 	isfocus.value = true;

package/dist/components/lists/style/index2.scss

@@ -1,2 +1,3 @@
 @use '../../card/style/index2.scss' as *;
+@use '../../loading/style/index2.scss' as *;
 @use '../index.scss' as *;

package/dist/components/page/index.css

@@ -599,8 +599,8 @@
 }
 .forms-div--query .forms-li {
   height: fit-content;
-  margin-top: var(--forms-query-interval);
-  margin-bottom: var(--forms-query-interval);
+  margin-top: var(--forms-interval);
+  margin-bottom: var(--forms-interval);
   margin-right: var(--forms-inline-right);
 }
 .forms-div--query .forms-li .el-form-item {
@@ -643,17 +643,20 @@
 }
 .list-div .list-table .list-table-td,
 .list-div .list-table .list-table-th {
-  padding: 6px;
+  padding: var(--list-interval) var(--list-interval-horizon, var(--list-interval));
 }
 .list-div .list-table .list-table-auto {
   width: 100%;
   display: inline-flex;
-  align-items: center;
   word-break: break-all;
 }
 .list-div .list-table .list-table-auto .list-table-td {
   flex: 1;
 }
+.list-div .list-table .list-table-auto .is-width .list-table-label {
+  word-break: break-all;
+  white-space: normal;
+}
 .list-div .list-table .list-table-auto .list-table-label {
   white-space: nowrap;
 }
@@ -666,9 +669,6 @@
 .list-div .list-table.center .list-table-th {
   text-align: center;
 }
-.list-div .list-table.auto .list-table-th {
-  padding-right: 0;
-}
 .list-div .list-table.top .list-table-th {
   padding-bottom: 0;
 }
@@ -728,6 +728,12 @@
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
 }
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
+}
 
 .paging {
   padding: 10px;

package/dist/components/tables/index.css

@@ -27,4 +27,10 @@
 .tables-table {
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
+}
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
 }

package/dist/components/tables/index.scss

@@ -18,6 +18,20 @@ $tables: 'tables';
 		// width: 100%;
 		// 去掉背景色
 		background-color: transparent;
-		--#{e()}table-header-bg-color: rgb(248, 248, 249);
+
+		#{v(e()+'table-header-bg-color')}: rgb(248, 248, 249);
+
+		&.#{el('table', '', '', 'default')} {
+			.#{el('table', '', 'cell')} {
+				padding: var(vdm('interval', $tables)) 0;
+			}
+			.cell {
+				padding: 0
+					var(
+						vdm('interval-horizon', $tables),
+						var(vdm('interval', $tables))
+					);
+			}
+		}
 	}
 }

package/dist/components/tables/src/data.cjs

@@ -81,6 +81,21 @@ const dataProps = {
     default() {
       return {};
     }
+  },
+  /**
+   * @props { String } interval='6px'
+   * 查询模式的上下间距
+   */
+  interval: {
+    type: String,
+    default: "6px"
+  },
+  /**
+   * @props { String } intervalHorizon
+   * 查询模式的左右间距
+   */
+  intervalHorizon: {
+    type: String
   }
 };
 const dataEmits = [

package/dist/components/tables/src/data.d.ts

@@ -110,6 +110,21 @@ export declare const dataProps: {
         };
         default(): {};
     };
+    /**
+     * @props { String } interval='6px'
+     * 查询模式的上下间距
+     */
+    interval: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @props { String } intervalHorizon
+     * 查询模式的左右间距
+     */
+    intervalHorizon: {
+        type: StringConstructor;
+    };
 };
 export type DataProps = ExtractPropTypes<typeof dataProps>;
 /**

package/dist/components/tables/src/data.js

@@ -79,6 +79,21 @@ const dataProps = {
     default() {
       return {};
     }
+  },
+  /**
+   * @props { String } interval='6px'
+   * 查询模式的上下间距
+   */
+  interval: {
+    type: String,
+    default: "6px"
+  },
+  /**
+   * @props { String } intervalHorizon
+   * 查询模式的左右间距
+   */
+  intervalHorizon: {
+    type: String
   }
 };
 const dataEmits = [

package/dist/components/tables/src/index2.cjs

@@ -128,7 +128,12 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         class: vue.unref(cs).z()
-      }, vue.unref(attrs).root), [
+      }, vue.unref(attrs).root, {
+        style: vue.unref(cs).vdo({
+          interval: _ctx.interval,
+          intervalHorizon: _ctx.intervalHorizon
+        })
+      }), [
         vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(index$2.Table), vue.mergeProps(vue.unref(attrs).assem, {
           align: "left",
           ref_key: "tableRef",

package/dist/components/tables/src/index2.js

@@ -126,7 +126,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", mergeProps({
         class: unref(cs).z()
-      }, unref(attrs).root), [
+      }, unref(attrs).root, {
+        style: unref(cs).vdo({
+          interval: _ctx.interval,
+          intervalHorizon: _ctx.intervalHorizon
+        })
+      }), [
         withDirectives((openBlock(), createBlock(unref(Table), mergeProps(unref(attrs).assem, {
           align: "left",
           ref_key: "tableRef",

package/dist/components/tablesp/index.css

@@ -28,6 +28,12 @@
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
 }
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
+}
 
 .paging {
   padding: 10px;

package/dist/css/forms.css

@@ -599,8 +599,8 @@
 }
 .forms-div--query .forms-li {
   height: fit-content;
-  margin-top: var(--forms-query-interval);
-  margin-bottom: var(--forms-query-interval);
+  margin-top: var(--forms-interval);
+  margin-bottom: var(--forms-interval);
   margin-right: var(--forms-inline-right);
 }
 .forms-div--query .forms-li .el-form-item {

package/dist/css/index.css

@@ -599,8 +599,8 @@
 }
 .forms-div--query .forms-li {
   height: fit-content;
-  margin-top: var(--forms-query-interval);
-  margin-bottom: var(--forms-query-interval);
+  margin-top: var(--forms-interval);
+  margin-bottom: var(--forms-interval);
   margin-right: var(--forms-inline-right);
 }
 .forms-div--query .forms-li .el-form-item {
@@ -1050,17 +1050,20 @@
 }
 .list-div .list-table .list-table-td,
 .list-div .list-table .list-table-th {
-  padding: 6px;
+  padding: var(--list-interval) var(--list-interval-horizon, var(--list-interval));
 }
 .list-div .list-table .list-table-auto {
   width: 100%;
   display: inline-flex;
-  align-items: center;
   word-break: break-all;
 }
 .list-div .list-table .list-table-auto .list-table-td {
   flex: 1;
 }
+.list-div .list-table .list-table-auto .is-width .list-table-label {
+  word-break: break-all;
+  white-space: normal;
+}
 .list-div .list-table .list-table-auto .list-table-label {
   white-space: nowrap;
 }
@@ -1073,9 +1076,6 @@
 .list-div .list-table.center .list-table-th {
   text-align: center;
 }
-.list-div .list-table.auto .list-table-th {
-  padding-right: 0;
-}
 .list-div .list-table.top .list-table-th {
   padding-bottom: 0;
 }
@@ -1135,6 +1135,12 @@
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
 }
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
+}
 
 .paging {
   padding: 10px;
@@ -1620,28 +1626,6 @@
   justify-content: flex-end;
 }
 
-.tabless {
-  width: 100%;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-}
-.tabless-main {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  width: 100%;
-}
-.tabless-main.is-radio .el-table__header .el-table-column--selection .el-checkbox {
-  display: none;
-}
-.tabless-paginat {
-  overflow: hidden;
-}
-.tabless-paginat .el-pagination {
-  justify-content: flex-end;
-}
-
 .tablesv {
   width: 100%;
   min-height: 100px;
@@ -1723,4 +1707,26 @@
   left: 0;
   z-index: 1;
   opacity: 0;
+}
+
+.tablesvp {
+  width: 100%;
+  height: var(--tablesvp-height);
+  display: flex;
+  flex-direction: column;
+}
+.tablesvp-main {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  width: 100%;
+}
+.tablesvp-main.is-radio .el-table__header .el-table-column--selection .el-checkbox {
+  display: none;
+}
+.tablesvp-paginat {
+  overflow: hidden;
+}
+.tablesvp-paginat .el-pagination {
+  justify-content: flex-end;
 }

package/dist/css/list.css

@@ -31,17 +31,20 @@
 }
 .list-div .list-table .list-table-td,
 .list-div .list-table .list-table-th {
-  padding: 6px;
+  padding: var(--list-interval) var(--list-interval-horizon, var(--list-interval));
 }
 .list-div .list-table .list-table-auto {
   width: 100%;
   display: inline-flex;
-  align-items: center;
   word-break: break-all;
 }
 .list-div .list-table .list-table-auto .list-table-td {
   flex: 1;
 }
+.list-div .list-table .list-table-auto .is-width .list-table-label {
+  word-break: break-all;
+  white-space: normal;
+}
 .list-div .list-table .list-table-auto .list-table-label {
   white-space: nowrap;
 }
@@ -54,9 +57,6 @@
 .list-div .list-table.center .list-table-th {
   text-align: center;
 }
-.list-div .list-table.auto .list-table-th {
-  padding-right: 0;
-}
 .list-div .list-table.top .list-table-th {
   padding-bottom: 0;
 }

package/dist/css/page.css

@@ -599,8 +599,8 @@
 }
 .forms-div--query .forms-li {
   height: fit-content;
-  margin-top: var(--forms-query-interval);
-  margin-bottom: var(--forms-query-interval);
+  margin-top: var(--forms-interval);
+  margin-bottom: var(--forms-interval);
   margin-right: var(--forms-inline-right);
 }
 .forms-div--query .forms-li .el-form-item {
@@ -643,17 +643,20 @@
 }
 .list-div .list-table .list-table-td,
 .list-div .list-table .list-table-th {
-  padding: 6px;
+  padding: var(--list-interval) var(--list-interval-horizon, var(--list-interval));
 }
 .list-div .list-table .list-table-auto {
   width: 100%;
   display: inline-flex;
-  align-items: center;
   word-break: break-all;
 }
 .list-div .list-table .list-table-auto .list-table-td {
   flex: 1;
 }
+.list-div .list-table .list-table-auto .is-width .list-table-label {
+  word-break: break-all;
+  white-space: normal;
+}
 .list-div .list-table .list-table-auto .list-table-label {
   white-space: nowrap;
 }
@@ -666,9 +669,6 @@
 .list-div .list-table.center .list-table-th {
   text-align: center;
 }
-.list-div .list-table.auto .list-table-th {
-  padding-right: 0;
-}
 .list-div .list-table.top .list-table-th {
   padding-bottom: 0;
 }
@@ -728,6 +728,12 @@
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
 }
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
+}
 
 .paging {
   padding: 10px;

package/dist/css/tables.css

@@ -27,4 +27,10 @@
 .tables-table {
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
+}
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
 }

package/dist/css/tablesp.css

@@ -28,6 +28,12 @@
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
 }
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
+}
 
 .paging {
   padding: 10px;

package/dist/icons/index.json

@@ -1,7 +1,7 @@
 {
     "prefix": "fang-ui",
     "info": {},
-    "lastModified": 1762504164985,
+    "lastModified": 1762509205185,
     "icons": {
         "bar": {
             "body": " <path fill=\"currentColor\" d=\"M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z\" ></path> "

package/dist/index.css

@@ -599,8 +599,8 @@
 }
 .forms-div--query .forms-li {
   height: fit-content;
-  margin-top: var(--forms-query-interval);
-  margin-bottom: var(--forms-query-interval);
+  margin-top: var(--forms-interval);
+  margin-bottom: var(--forms-interval);
   margin-right: var(--forms-inline-right);
 }
 .forms-div--query .forms-li .el-form-item {
@@ -1050,17 +1050,20 @@
 }
 .list-div .list-table .list-table-td,
 .list-div .list-table .list-table-th {
-  padding: 6px;
+  padding: var(--list-interval) var(--list-interval-horizon, var(--list-interval));
 }
 .list-div .list-table .list-table-auto {
   width: 100%;
   display: inline-flex;
-  align-items: center;
   word-break: break-all;
 }
 .list-div .list-table .list-table-auto .list-table-td {
   flex: 1;
 }
+.list-div .list-table .list-table-auto .is-width .list-table-label {
+  word-break: break-all;
+  white-space: normal;
+}
 .list-div .list-table .list-table-auto .list-table-label {
   white-space: nowrap;
 }
@@ -1073,9 +1076,6 @@
 .list-div .list-table.center .list-table-th {
   text-align: center;
 }
-.list-div .list-table.auto .list-table-th {
-  padding-right: 0;
-}
 .list-div .list-table.top .list-table-th {
   padding-bottom: 0;
 }
@@ -1135,6 +1135,12 @@
   background-color: transparent;
   --el-table-header-bg-color: rgb(248, 248, 249);
 }
+.tables-table.el-table--default .el-table__cell {
+  padding: var(--tables-interval) 0;
+}
+.tables-table.el-table--default .cell {
+  padding: 0 var(--tables-interval-horizon, var(--tables-interval));
+}
 
 .paging {
   padding: 10px;
@@ -1620,28 +1626,6 @@
   justify-content: flex-end;
 }
 
-.tabless {
-  width: 100%;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-}
-.tabless-main {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  width: 100%;
-}
-.tabless-main.is-radio .el-table__header .el-table-column--selection .el-checkbox {
-  display: none;
-}
-.tabless-paginat {
-  overflow: hidden;
-}
-.tabless-paginat .el-pagination {
-  justify-content: flex-end;
-}
-
 .tablesv {
   width: 100%;
   min-height: 100px;
@@ -1723,4 +1707,26 @@
   left: 0;
   z-index: 1;
   opacity: 0;
+}
+
+.tablesvp {
+  width: 100%;
+  height: var(--tablesvp-height);
+  display: flex;
+  flex-direction: column;
+}
+.tablesvp-main {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  width: 100%;
+}
+.tablesvp-main.is-radio .el-table__header .el-table-column--selection .el-checkbox {
+  display: none;
+}
+.tablesvp-paginat {
+  overflow: hidden;
+}
+.tablesvp-paginat .el-pagination {
+  justify-content: flex-end;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fangzhongya/fang-ui",
   "private": false,
-  "version": "0.1.4",
+  "version": "0.1.6",
   "type": "module",
   "description ": "fang-ui",
   "keywords": [
@@ -49,14 +49,14 @@
     "vue-tsc": "^3.1.3",
     "vuedraggable": "4.1.0",
     "vxe-table": "4.17.10",
-    "@fang-ui/components": "0.0.1-0",
     "@fang-ui/directives": "0.0.1-0",
-    "@fang-ui/icons": "0.0.1-0",
-    "@fang-ui/locale": "0.0.1-0",
     "@fang-ui/hooks": "0.0.1-0",
+    "@fang-ui/components": "0.0.1-0",
+    "@fang-ui/icons": "0.0.1-0",
     "@fang-ui/theme": "0.0.1-0",
-    "@fang-ui/types": "0.0.1-0",
-    "@fang-ui/utils": "0.0.1-0"
+    "@fang-ui/locale": "0.0.1-0",
+    "@fang-ui/utils": "0.0.1-0",
+    "@fang-ui/types": "0.0.1-0"
   },
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",