qidian-vue-ui 2.8.7 → 2.8.9

package/dist/components/form/index.css

@@ -1,30 +1,30 @@
-.qd-form--small[data-v-5cc3a29f] {
+.qd-form--small[data-v-13cb7428] {
   font: var(--td-font-body-small);
 }
-.qd-form--small[data-v-5cc3a29f] .t-form__label--top {
+.qd-form--small[data-v-13cb7428] .t-form__label--top {
   min-height: var(--td-comp-margin-xxl);
   line-height: var(--td-comp-margin-xxl);
 }
-.qd-form--small[data-v-5cc3a29f] .t-form__controls,
-.qd-form--small[data-v-5cc3a29f] .t-form__controls-content {
+.qd-form--small[data-v-13cb7428] .t-form__controls,
+.qd-form--small[data-v-13cb7428] .t-form__controls-content {
   min-height: var(--td-comp-margin-xxl);
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-grid {
+.qd-form--descriptions[data-v-13cb7428] .qd-grid {
   border: 1px solid var(--td-component-border);
   background-color: var(--td-component-border);
   gap: 1px !important;
   overflow: hidden;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-grid-item {
+.qd-form--descriptions[data-v-13cb7428] .qd-grid-item {
   background-color: var(--td-bg-color-container);
 }
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__item {
+.qd-form--descriptions[data-v-13cb7428] .t-form__item {
   display: flex;
   align-items: stretch;
   height: 100%;
   margin-bottom: 0 !important;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__label {
+.qd-form--descriptions[data-v-13cb7428] .t-form__label {
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -33,60 +33,59 @@
   height: 100%;
   min-height: var(--td-comp-margin-xxl);
 }
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__label--top {
+.qd-form--descriptions[data-v-13cb7428] .t-form__label--top {
   border-bottom: 1px solid var(--td-component-border);
   height: var(--qd-form-description-label-height, auto);
   white-space: normal;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__controls {
+.qd-form--descriptions[data-v-13cb7428] .t-form__controls {
   flex: 1 1 0;
   overflow: hidden;
   display: flex;
   flex-direction: column;
-  justify-content: flex-start;
   padding: var(--td-comp-paddingLR-m) var(--td-comp-paddingLR-l);
   margin-left: 0 !important;
   height: 100%;
   min-height: var(--td-comp-margin-xxl);
 }
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__controls-content {
+.qd-form--descriptions[data-v-13cb7428] .t-form__controls-content {
   min-height: auto;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-form-item--label-top {
+.qd-form--descriptions[data-v-13cb7428] .qd-form-item--label-top {
   display: grid;
   grid-template-rows: auto minmax(min-content, 1fr);
   grid-row: span 2 !important;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-form-item--label-top > .t-form__item {
+.qd-form--descriptions[data-v-13cb7428] .qd-form-item--label-top > .t-form__item {
   display: contents;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-form-item--label-top .t-form__controls-content {
+.qd-form--descriptions[data-v-13cb7428] .qd-form-item--label-top .t-form__controls-content {
   white-space: normal;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-form-item--empty-content .t-form__controls {
+.qd-form--descriptions[data-v-13cb7428] .qd-form-item--empty-content .t-form__controls {
   padding: 0 !important;
   min-height: 0;
   height: 0;
   overflow: hidden;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__item-with-extra .t-form__controls,
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__item-with-help .t-form__controls {
+.qd-form--descriptions[data-v-13cb7428] .t-form__item-with-extra .t-form__controls,
+.qd-form--descriptions[data-v-13cb7428] .t-form__item-with-help .t-form__controls {
   height: auto;
   overflow: visible;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__item-with-extra .t-input__extra,
-.qd-form--descriptions[data-v-5cc3a29f] .t-form__item-with-help .t-input__extra {
+.qd-form--descriptions[data-v-13cb7428] .t-form__item-with-extra .t-input__extra,
+.qd-form--descriptions[data-v-13cb7428] .t-form__item-with-help .t-input__extra {
   position: static;
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-form-item:not(.qd-form-item--label-top):not(.qd-form-item--label-width-full) .t-form__label {
+.qd-form--descriptions[data-v-13cb7428] .qd-form-item:not(.qd-form-item--label-top):not(.qd-form-item--label-width-full) .t-form__label {
   border-right: 1px solid var(--td-component-border);
 }
-.qd-form--descriptions[data-v-5cc3a29f] .qd-form-item--filler,
-.qd-form--descriptions[data-v-5cc3a29f] .qd-grid-item--fill {
+.qd-form--descriptions[data-v-13cb7428] .qd-form-item--filler,
+.qd-form--descriptions[data-v-13cb7428] .qd-grid-item--fill {
   background-color: var(--td-bg-color-secondarycontainer);
 }
-.qd-form--descriptions-mini[data-v-5cc3a29f] .t-form__label,
-.qd-form--descriptions-mini[data-v-5cc3a29f] .t-form__controls {
+.qd-form--descriptions-mini[data-v-13cb7428] .t-form__label,
+.qd-form--descriptions-mini[data-v-13cb7428] .t-form__controls {
   padding: var(--td-comp-paddingTB-xxs) var(--td-comp-paddingLR-xxs);
   font: var(--td-font-body-small);
 }

package/dist/components/form/index.d.ts

@@ -2,4 +2,4 @@ export { PROVIDE_FORM_ADD_AFTER_SUBMIT_QUEUE, PROVIDE_FORM_ADD_BEFORE_SUBMIT_QUE
 export { default as QdForm } from './index.vue';
 export { default as QdFormItem } from './item.vue';
 export { qdFormGrid, qdFormGutter } from './props';
-export type { QdFormBeforeSubmitQueueItem, QdFormBeforeSubmitQueueResult, QdFormContentAlign, QdFormInstanceFunctions, QdFormLabelAlign, QdFormItemProps, QdFormProps, QdFormSubmitContext } from './types';
+export type { QdFormBeforeSubmitQueueItem, QdFormBeforeSubmitQueueResult, QdFormInstanceFunctions, QdFormItemProps, QdFormProps, QdFormSubmitContext } from './types';

package/dist/components/form/index.vue.mjs

@@ -2,7 +2,7 @@ import './index.css'
 import _sfc_main from "./index.vue2.mjs";
 /* empty css            */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const QdForm = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-5cc3a29f"]]);
+const QdForm = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-13cb7428"]]);
 export {
   QdForm as default
 };

package/dist/components/form/index.vue2.mjs

@@ -143,7 +143,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         small: componentSize === "small" && !(descriptions && mini),
         itemSize,
         labelAlignClass: !formOptions.labelAlign && descriptions ? "left" : formOptions.labelAlign ?? "top",
-        contentAlign: formOptions.contentAlign,
+        contentAlign: formOptions.contentAlign ?? (formOptions.labelAlign === "top" ? "left" : formOptions.labelAlign === "top-center" ? "center" : "left-center"),
         formOptions: {
           ...formOptions,
           size: componentSize,
@@ -393,11 +393,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       "crud-mode": __props.crudMode,
                       context: unref(data),
                       "default-clearable": __props.defaultClearable,
-                      "label-align": reProps.value.formItems?.[node.index].labelAlign ?? reProps.value.labelAlignClass
+                      "label-align": reProps.value.formItems?.[node.index].labelAlign ?? reProps.value.labelAlignClass,
+                      "content-align": reProps.value.formItems?.[node.index].contentAlign ?? reProps.value.contentAlign
                     }, { ref_for: true }, reProps.value.formItems?.[node.index], {
                       "grid-index": node.index,
                       size: reProps.value.formItems?.[node.index].size ?? reProps.value.itemSize
-                    }), null, 16, ["crud-mode", "context", "default-clearable", "label-align", "grid-index", "size"])) : (openBlock(), createBlock(unref(QdGridItem), {
+                    }), null, 16, ["crud-mode", "context", "default-clearable", "label-align", "content-align", "grid-index", "size"])) : (openBlock(), createBlock(unref(QdGridItem), {
                       key: 1,
                       class: "qd-form-item--filler",
                       col: node.span,

package/dist/components/form/item.css

@@ -1,22 +1,25 @@
-.qd-form-item--content-center[data-v-36688b06] .t-form__controls {
+.qd-form-item--content-center[data-v-f071ba7b] .t-form__controls {
   text-align: center;
   justify-content: center;
 }
-.qd-form-item--content-center[data-v-36688b06] .t-form__controls-content {
+.qd-form-item--content-center[data-v-f071ba7b] .t-form__controls-content {
   text-align: center;
   justify-content: center;
 }
-.qd-form-item--content-center-top[data-v-36688b06] .t-form__controls-content {
+.qd-form-item--content-center-top[data-v-f071ba7b] .t-form__controls-content {
   text-align: center;
   justify-content: center;
 }
-.qd-form-item--label-top-center[data-v-36688b06] .t-form__label {
+.qd-form-item--content-left-center[data-v-f071ba7b] .t-form__controls {
+  justify-content: center;
+}
+.qd-form-item--label-top-center[data-v-f071ba7b] .t-form__label {
   text-align: center;
   align-items: center;
 }
-.qd-form-item[data-v-36688b06] >  .t-form__item > .t-form__controls > .t-form__controls-content > *:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
+.qd-form-item[data-v-f071ba7b] >  .t-form__item > .t-form__controls > .t-form__controls-content > *:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
   width: 100%;
 }
-.qd-form-item__component[data-v-36688b06]:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
+.qd-form-item__component[data-v-f071ba7b]:not(.t-switch):not(.t-tag):not(.t-icon):not(.qd-file-icon) {
   width: 100%;
 }

package/dist/components/form/item.vue.mjs

@@ -2,7 +2,7 @@ import './item.css'
 import _sfc_main from "./item.vue2.mjs";
 /* empty css           */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const QdFormItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-36688b06"]]);
+const QdFormItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f071ba7b"]]);
 export {
   QdFormItem as default
 };

package/dist/components/form/item.vue2.mjs

@@ -57,6 +57,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const effectiveContentAlign = computed(
       () => props.contentAlign ?? injectedContentAlign?.value
     );
+    const effectiveDefaultContentAlign = computed(() => {
+      if (effectiveLabelAlign.value === "top-center") return "center";
+      if (effectiveLabelAlign.value === "top") return "left";
+      return "left-center";
+    });
     const reIfRender = computed(() => {
       const ifRender = props.ifRender;
       if (isEmpty(ifRender)) return true;
@@ -124,7 +129,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       });
       return {
         labelAlignClass: effectiveLabelAlign.value === "top-center" ? "qd-form-item--label-top qd-form-item--label-top-center" : effectiveLabelAlign.value === "top" ? "qd-form-item--label-top" : "",
-        contentAlignClass: effectiveContentAlign.value === "center-top" ? "qd-form-item--content-center-top" : effectiveContentAlign.value === "center" ? "qd-form-item--content-center" : "",
+        contentAlignClass: (effectiveContentAlign.value ?? effectiveDefaultContentAlign.value) === "center-top" ? "qd-form-item--content-center-top" : (effectiveContentAlign.value ?? effectiveDefaultContentAlign.value) === "center" ? "qd-form-item--content-center" : (effectiveContentAlign.value ?? effectiveDefaultContentAlign.value) === "left-center" ? "qd-form-item--content-left-center" : "qd-form-item--content-left",
         formItemOptions: {
           ...formItemOptions,
           labelAlign: effectiveLabelAlign.value === "top-center" ? "top" : effectiveLabelAlign.value,

package/dist/components/form/types.d.ts

@@ -3,7 +3,7 @@ import type { AllowedComponentProps } from 'vue';
 import type { QdComputeFunction, QdConfigRendererProps, QdConfigValue } from '../config-renderer';
 import type { QdGridItemProps, QdGridProps } from '../grid';
 export type QdFormLabelAlign = TdFormProps['labelAlign'] | 'top-center';
-export type QdFormContentAlign = 'left' | 'center' | 'center-top';
+export type QdFormContentAlign = 'left' | 'center' | 'center-top' | 'left-center';
 export interface QdFormRule<FD extends Data = Data> extends Omit<FormRule, 'validator'> {
     validator?: (val: ValueType, data: FD) => CustomValidateResolveType | Promise<CustomValidateResolveType>;
 }

package/dist/styles/index.css

@@ -173,6 +173,7 @@ p {
 }
 .t-form__label--top label {
   display: flex;
+  align-items: center;
   flex-wrap: wrap;
 }
 .t-form__controls .t-form__item {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "qidian-vue-ui",
-  "version": "2.8.7",
+  "version": "2.8.9",
   "description": "基于 TDesign 的 QiDian Vue UI 组件库",
   "author": "qidian",
   "license": "MIT",