@carefrees/form-utils-vue 0.0.8

package/lib/interface/layout.formItem.d.ts

@@ -0,0 +1,39 @@
+import { VNodeChild, StyleValue } from 'vue';
+import { ComputedRefBase } from '.';
+export interface LayoutFormItemProps {
+    /**规则校验失败错误提示位置*/
+    errorLayout?: 'left-bottom' | 'right-bottom' | 'top-right' | 'top-left';
+    /**必填样式*/
+    required?: boolean;
+    /**label显示模式*/
+    labelMode?: 'left' | 'top' | 'between' | 'hide';
+    /**只进行规则样式*/
+    onlyRuleStyle?: boolean;
+    label?: VNodeChild;
+    /**底部提示内容*/
+    helpText?: VNodeChild;
+    /**额外内容*/
+    extra?: VNodeChild;
+    /**是否显示label后的冒号*/
+    showColon?: boolean;
+    /**
+     * 表单项占据列数
+     * @default 1
+     */
+    colSpan?: number;
+    /**
+     * 表单项占据行数
+     * @default 1
+     */
+    rowSpan?: number;
+    htmlFor?: ComputedRefBase<string>;
+    /**规则验证结果*/
+    validateResult?: ComputedRefBase<{
+        tip: string | (string | undefined)[];
+        isInvalid: boolean;
+    }>;
+    style?: StyleValue;
+    class?: string;
+    labelStyle?: StyleValue;
+    labelClass?: string;
+}

package/lib/layout/index.d.ts

@@ -0,0 +1,65 @@
+export declare const Layout: import('../utils').SFCWithInstall<{
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('..').FormLayoutProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('..').FormLayoutProps> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & import('vue').ComponentOptionsBase<Readonly<import('..').FormLayoutProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: Readonly<{
+        default: any;
+        title: any;
+        extra: any;
+    }> & {
+        default: any;
+        title: any;
+        extra: any;
+    };
+})> & Record<string, any>;
+export declare const LayoutFormItem: import('../utils').SFCWithInstall<{
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('..').LayoutFormItemProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('..').LayoutFormItemProps> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & import('vue').ComponentOptionsBase<Readonly<import('..').LayoutFormItemProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: Readonly<{
+        default: any;
+        label: any;
+        helpText: any;
+        extra: any;
+    }> & {
+        default: any;
+        label: any;
+        helpText: any;
+        extra: any;
+    };
+})> & Record<string, any>;
+export declare const FormLayoutRows: import('../utils').SFCWithInstall<{
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').HTMLAttributes> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').HTMLAttributes> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').HTMLAttributes> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: {
+        default?(_: {}): any;
+    };
+})> & Record<string, any>;

package/lib/layout/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const layout_vue_vue_type_script_setup_true_lang = require("./layout.vue.js");
+const layout_formItem_vue_vue_type_script_setup_true_lang = require("./layout.formItem.vue.js");
+const layout_form_rows_vue_vue_type_script_setup_true_lang = require("./layout.form.rows.vue.js");
+const withInstall = require("../utils/withInstall.js");
+const Layout = withInstall.withInstall(layout_vue_vue_type_script_setup_true_lang.default);
+const LayoutFormItem = withInstall.withInstall(layout_formItem_vue_vue_type_script_setup_true_lang.default);
+const FormLayoutRows = withInstall.withInstall(layout_form_rows_vue_vue_type_script_setup_true_lang.default);
+exports.FormLayoutRows = FormLayoutRows;
+exports.Layout = Layout;
+exports.LayoutFormItem = LayoutFormItem;

package/lib/layout/layout.form.rows.vue.d.ts

@@ -0,0 +1,10 @@
+import { HTMLAttributes } from 'vue';
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<HTMLAttributes, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<HTMLAttributes> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/layout/layout.form.rows.vue.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const clx = require("classnames");
+const __default__ = vue.defineComponent({
+  name: "FormLayoutRows",
+  inheritAttrs: false
+  // 可选，防止属性自动应用到根元素
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  setup(__props) {
+    const preCls = "carefrees-form-layout";
+    const props = __props;
+    const cls = vue.computed(() => clx(preCls, props.class, {
+      "all-colspan": true
+    }));
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(
+        "div",
+        vue.mergeProps(props, { class: cls.value }),
+        [
+          vue.renderSlot(_ctx.$slots, "default")
+        ],
+        16
+        /* FULL_PROPS */
+      );
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/layout/layout.form.rows.vue2.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const layout_form_rows_vue_vue_type_script_setup_true_lang = require("./layout.form.rows.vue.js");
+exports.default = layout_form_rows_vue_vue_type_script_setup_true_lang.default;

package/lib/layout/layout.formItem.vue.d.ts

@@ -0,0 +1,18 @@
+import { LayoutFormItemProps } from '../interface/layout.formItem';
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<LayoutFormItemProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<LayoutFormItemProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, Readonly<{
+    default: any;
+    label: any;
+    helpText: any;
+    extra: any;
+}> & {
+    default: any;
+    label: any;
+    helpText: any;
+    extra: any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/layout/layout.formItem.vue.js

@@ -0,0 +1,216 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const clx = require("classnames");
+const useAttrs = require("../hooks/useAttrs.js");
+const _hoisted_1 = ["for"];
+const __default__ = vue.defineComponent({
+  name: "LayoutFormItem",
+  inheritAttrs: false
+  // 可选，防止属性自动应用到根元素
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: {
+    errorLayout: {},
+    required: { type: Boolean },
+    labelMode: {},
+    onlyRuleStyle: { type: Boolean },
+    label: { type: [Object, String, Number, Boolean, null, Array] },
+    helpText: { type: [Object, String, Number, Boolean, null, Array] },
+    extra: { type: [Object, String, Number, Boolean, null, Array] },
+    showColon: { type: Boolean },
+    colSpan: {},
+    rowSpan: {},
+    htmlFor: {},
+    validateResult: {},
+    style: { type: [Boolean, null, String, Object, Array] },
+    class: {},
+    labelStyle: { type: [Boolean, null, String, Object, Array] },
+    labelClass: {}
+  },
+  setup(__props) {
+    const preCls = "carefrees-form-item";
+    const attrs = useAttrs.useAttrsInject();
+    const props = __props;
+    const solts = vue.useSlots();
+    const labelMode = vue.computed(() => props.labelMode ?? vue.toValue(attrs.value.labelMode) ?? "top");
+    const showColon = vue.computed(() => props.showColon ?? vue.toValue(attrs.value.showColon));
+    const errorLayout = vue.computed(() => props.errorLayout ?? vue.toValue(attrs.value.errorLayout) ?? "left-bottom");
+    const tips = vue.computed(() => {
+      var _a;
+      const v = (_a = vue.toValue(props.validateResult)) == null ? void 0 : _a.tip;
+      if (Array.isArray(v)) {
+        return v.join(",");
+      }
+      return v;
+    });
+    const cls = vue.computed(() => {
+      var _a;
+      return clx(preCls, props.class, vue.toValue(attrs.value.formItemClass), { "dx-invalid": !!((_a = vue.toValue(props.validateResult)) == null ? void 0 : _a.isInvalid) });
+    });
+    const containerCls = vue.computed(() => clx(`${preCls}-container`, { [`${labelMode.value}`]: !!labelMode.value }));
+    const labelCls = vue.computed(() => clx(`${preCls}-label`, { required: !!props.required, "show-colon": showColon && (labelMode.value === "left" || labelMode.value === "between") }));
+    const labelWarpCls = vue.computed(() => clx(`${preCls}-label-warp`, vue.toValue(props.labelClass), vue.toValue(attrs.value.formItemLabelClass)));
+    const inputCls = vue.computed(() => clx(`${preCls}-body-input`));
+    const errorCls = vue.computed(() => clx(`${preCls}-body-error`, { [errorLayout.value]: !!errorLayout.value }));
+    const _isLabel = vue.computed(() => (props.label || solts.label) && labelMode.value !== "hide");
+    const style = vue.computed(() => {
+      const css = {};
+      if (props.onlyRuleStyle) {
+        css.padding = "0px";
+      }
+      if (props.colSpan) {
+        const colCount = vue.toValue(attrs.value.colCount) || 4;
+        const end = colCount > props.colSpan ? props.colSpan : colCount;
+        css.gridColumnEnd = `span ${end}`;
+      }
+      if (props.rowSpan) {
+        css.gridRowEnd = `span ${props.rowSpan}`;
+      }
+      return [vue.toValue(attrs.value.formItemStyle), props.style, css];
+    });
+    const labelStyle = vue.computed(() => {
+      return [vue.toValue(attrs.value.formItemLabelStyle), props.labelStyle];
+    });
+    const isHelpText = vue.computed(() => {
+      return !!props.helpText || solts.helpText;
+    });
+    const isExtra = vue.computed(() => {
+      return !!props.extra || solts.extra;
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(
+        "div",
+        {
+          class: vue.normalizeClass(cls.value),
+          style: vue.normalizeStyle(style.value)
+        },
+        [
+          vue.createElementVNode(
+            "div",
+            {
+              class: vue.normalizeClass(containerCls.value)
+            },
+            [
+              _isLabel.value ? (vue.openBlock(), vue.createElementBlock(
+                "div",
+                {
+                  key: 0,
+                  class: vue.normalizeClass(labelWarpCls.value)
+                },
+                [
+                  vue.createElementVNode("label", {
+                    style: vue.normalizeStyle(labelStyle.value),
+                    class: vue.normalizeClass(labelCls.value),
+                    for: vue.toValue(props.htmlFor)
+                  }, [
+                    props.label ? (vue.openBlock(), vue.createElementBlock(
+                      vue.Fragment,
+                      { key: 0 },
+                      [
+                        vue.createTextVNode(
+                          vue.toDisplayString(props.label),
+                          1
+                          /* TEXT */
+                        )
+                      ],
+                      64
+                      /* STABLE_FRAGMENT */
+                    )) : vue.renderSlot(_ctx.$slots, "label", { key: 1 })
+                  ], 14, _hoisted_1)
+                ],
+                2
+                /* CLASS */
+              )) : vue.createCommentVNode("v-if", true),
+              vue.createElementVNode(
+                "div",
+                {
+                  class: vue.normalizeClass(preCls + "-body")
+                },
+                [
+                  vue.createElementVNode(
+                    "div",
+                    {
+                      class: vue.normalizeClass(inputCls.value)
+                    },
+                    [
+                      vue.renderSlot(_ctx.$slots, "default")
+                    ],
+                    2
+                    /* CLASS */
+                  ),
+                  isHelpText.value ? (vue.openBlock(), vue.createElementBlock(
+                    "div",
+                    {
+                      key: 0,
+                      class: vue.normalizeClass(preCls + "-body-help")
+                    },
+                    [
+                      props.helpText ? (vue.openBlock(), vue.createElementBlock(
+                        vue.Fragment,
+                        { key: 0 },
+                        [
+                          vue.createTextVNode(
+                            vue.toDisplayString(props.helpText),
+                            1
+                            /* TEXT */
+                          )
+                        ],
+                        64
+                        /* STABLE_FRAGMENT */
+                      )) : vue.renderSlot(_ctx.$slots, "helpText", { key: 1 })
+                    ],
+                    2
+                    /* CLASS */
+                  )) : vue.createCommentVNode("v-if", true),
+                  !!tips.value ? (vue.openBlock(), vue.createElementBlock(
+                    "div",
+                    {
+                      key: 1,
+                      class: vue.normalizeClass(errorCls.value)
+                    },
+                    vue.toDisplayString(tips.value),
+                    3
+                    /* TEXT, CLASS */
+                  )) : vue.createCommentVNode("v-if", true)
+                ],
+                2
+                /* CLASS */
+              )
+            ],
+            2
+            /* CLASS */
+          ),
+          isExtra.value ? (vue.openBlock(), vue.createElementBlock(
+            "div",
+            {
+              key: 0,
+              class: vue.normalizeClass(preCls + "-extra")
+            },
+            [
+              props.extra ? (vue.openBlock(), vue.createElementBlock(
+                vue.Fragment,
+                { key: 0 },
+                [
+                  vue.createTextVNode(
+                    vue.toDisplayString(props.extra),
+                    1
+                    /* TEXT */
+                  )
+                ],
+                64
+                /* STABLE_FRAGMENT */
+              )) : vue.renderSlot(_ctx.$slots, "extra", { key: 1 })
+            ],
+            2
+            /* CLASS */
+          )) : vue.createCommentVNode("v-if", true)
+        ],
+        6
+        /* CLASS, STYLE */
+      );
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/layout/layout.formItem.vue2.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const layout_formItem_vue_vue_type_script_setup_true_lang = require("./layout.formItem.vue.js");
+exports.default = layout_formItem_vue_vue_type_script_setup_true_lang.default;

package/lib/layout/layout.vue.d.ts

@@ -0,0 +1,16 @@
+import { FormLayoutProps } from '../interface/layout';
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<FormLayoutProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<FormLayoutProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, Readonly<{
+    default: any;
+    title: any;
+    extra: any;
+}> & {
+    default: any;
+    title: any;
+    extra: any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/layout/layout.vue.js

@@ -0,0 +1,166 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const clx = require("classnames");
+const useAttrs = require("../hooks/useAttrs.js");
+const __default__ = vue.defineComponent({
+  name: "Layout",
+  inheritAttrs: false
+  // 可选，防止属性自动应用到根元素
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: {
+    title: { type: [Object, String, Number, Boolean, null, Array] },
+    extra: { type: [Object, String, Number, Boolean, null, Array] },
+    isAllColSpan: { type: Boolean },
+    class: {},
+    headerClass: {},
+    bodyClass: {},
+    style: { type: [Boolean, null, String, Object, Array] },
+    headerStyle: { type: [Boolean, null, String, Object, Array] },
+    bodyStyle: { type: [Boolean, null, String, Object, Array] },
+    bordered: { type: Boolean },
+    colCount: {},
+    gap: {},
+    errorLayout: {},
+    labelMode: {},
+    showColon: {},
+    formItemClass: {},
+    formItemStyle: {},
+    formItemLabelClass: {},
+    formItemLabelStyle: {}
+  },
+  setup(__props) {
+    const preCls = "carefrees-form-layout";
+    const attrs = useAttrs.useAttrsInject();
+    const props = __props;
+    const solts = vue.useSlots();
+    const colCount = vue.computed(() => vue.toValue(props.colCount) ?? vue.toValue(attrs.value.colCount));
+    const errorLayout = vue.computed(() => vue.toValue(props.errorLayout) ?? vue.toValue(attrs.value.errorLayout));
+    const labelMode = vue.computed(() => vue.toValue(props.labelMode) ?? vue.toValue(attrs.value.labelMode));
+    const showColon = vue.computed(() => vue.toValue(props.showColon) ?? vue.toValue(attrs.value.showColon));
+    const formItemClass = vue.computed(() => vue.toValue(props.formItemClass) ?? vue.toValue(attrs.value.formItemClass));
+    const formItemStyle = vue.computed(() => vue.toValue(props.formItemStyle) ?? vue.toValue(attrs.value.formItemStyle));
+    const formItemLabelClass = vue.computed(() => vue.toValue(props.formItemLabelClass) ?? vue.toValue(attrs.value.formItemLabelClass));
+    const formItemLabelStyle = vue.computed(() => vue.toValue(props.formItemLabelStyle) ?? vue.toValue(attrs.value.formItemLabelStyle));
+    useAttrs.useAttrsProvide({
+      colCount,
+      errorLayout,
+      labelMode,
+      showColon,
+      formItemClass,
+      formItemStyle,
+      formItemLabelClass,
+      formItemLabelStyle
+    });
+    const cls = vue.computed(() => clx(preCls, props.class, { "all-colspan": props.isAllColSpan, bordered: props.bordered }));
+    const bodyCls = vue.computed(() => clx(`${preCls}-body`, props.bodyClass));
+    const headerCls = vue.computed(() => clx(`${preCls}-header`, props.headerClass));
+    const headerTitleCls = vue.computed(() => clx(`${preCls}-header-title`));
+    const headerExtraCls = vue.computed(() => clx(`${preCls}-header-extra`));
+    const bodyStyle = vue.computed(() => {
+      const css = {};
+      if (typeof props.gap === "string") {
+        css.gap = props.gap;
+      }
+      if (typeof props.gap === "number") {
+        css.gap = `${props.gap}px`;
+      }
+      if (colCount.value) {
+        css.gridTemplateColumns = `repeat(${colCount.value}, auto)`;
+      }
+      return [css, props.bodyStyle];
+    });
+    const isTitle = vue.computed(() => {
+      return !!props.title || solts.title;
+    });
+    const isExtra = vue.computed(() => {
+      return !!props.extra || solts.extra;
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(
+        "div",
+        {
+          style: vue.normalizeStyle(props.style),
+          class: vue.normalizeClass(cls.value)
+        },
+        [
+          isExtra.value || isTitle.value ? (vue.openBlock(), vue.createElementBlock(
+            "div",
+            {
+              key: 0,
+              style: vue.normalizeStyle(_ctx.headerStyle),
+              class: vue.normalizeClass(headerCls.value)
+            },
+            [
+              vue.createElementVNode(
+                "div",
+                {
+                  class: vue.normalizeClass(headerTitleCls.value)
+                },
+                [
+                  props.title ? (vue.openBlock(), vue.createElementBlock(
+                    vue.Fragment,
+                    { key: 0 },
+                    [
+                      vue.createTextVNode(
+                        vue.toDisplayString(props.title),
+                        1
+                        /* TEXT */
+                      )
+                    ],
+                    64
+                    /* STABLE_FRAGMENT */
+                  )) : vue.renderSlot(_ctx.$slots, "title", { key: 1 })
+                ],
+                2
+                /* CLASS */
+              ),
+              vue.createElementVNode(
+                "div",
+                {
+                  class: vue.normalizeClass(headerExtraCls.value)
+                },
+                [
+                  props.extra ? (vue.openBlock(), vue.createElementBlock(
+                    vue.Fragment,
+                    { key: 0 },
+                    [
+                      vue.createTextVNode(
+                        vue.toDisplayString(props.extra),
+                        1
+                        /* TEXT */
+                      )
+                    ],
+                    64
+                    /* STABLE_FRAGMENT */
+                  )) : vue.renderSlot(_ctx.$slots, "extra", { key: 1 })
+                ],
+                2
+                /* CLASS */
+              )
+            ],
+            6
+            /* CLASS, STYLE */
+          )) : vue.createCommentVNode("v-if", true),
+          vue.createElementVNode(
+            "div",
+            {
+              style: vue.normalizeStyle(bodyStyle.value),
+              class: vue.normalizeClass(bodyCls.value)
+            },
+            [
+              vue.renderSlot(_ctx.$slots, "default")
+            ],
+            6
+            /* CLASS, STYLE */
+          )
+        ],
+        6
+        /* CLASS, STYLE */
+      );
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/layout/layout.vue2.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const layout_vue_vue_type_script_setup_true_lang = require("./layout.vue.js");
+exports.default = layout_vue_vue_type_script_setup_true_lang.default;

package/lib/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './withInstall';

package/lib/utils/withInstall.d.ts

@@ -0,0 +1,3 @@
+import { Plugin } from 'vue';
+export type SFCWithInstall<T> = T & Plugin;
+export declare const withInstall: <T, E extends Record<string, any> = Record<string, any>, K extends Record<string, any> = Record<string, any>>(main: T, extra?: E | undefined, childComponents?: K | undefined) => SFCWithInstall<T> & E & K;

package/lib/utils/withInstall.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const withInstall = (main, extra, childComponents) => {
+  main.install = (app) => {
+    for (const comp of [main, ...Object.values(childComponents ?? {})]) {
+      const name = comp.name || comp.__name;
+      app.component(name, comp);
+    }
+  };
+  if (childComponents) {
+    for (const [key, comp] of Object.entries(childComponents)) {
+      main[key] = comp;
+    }
+  }
+  if (extra) {
+    for (const [key, comp] of Object.entries(extra)) {
+      main[key] = comp;
+    }
+  }
+  return main;
+};
+exports.withInstall = withInstall;

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@carefrees/form-utils-vue",
+  "author": "SunLxy <1011771396@qq.com>",
+  "version": "0.0.8",
+  "description": "",
+  "main": "lib/index.js",
+  "module": "esm/index.mjs",
+  "types": "esm/index.d.ts",
+  "scripts": {
+    "build": "saqu-vue build",
+    "watch": "saqu-vue build --watch"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "assets",
+    "src",
+    "lib",
+    "esm"
+  ],
+  "keywords": [],
+  "license": "ISC",
+  "devDependencies": {
+    "@saqu-vue/core": "^1.0.1",
+    "vue": "^3.5.13"
+  },
+  "dependencies": {
+    "async-validator": "~4.2.5",
+    "@carefrees/form-utils": "^0.0.8",
+    "classnames": "2.5.1"
+  }
+}

package/src/component.ts

@@ -0,0 +1,3 @@
+export * from './form';
+export * from './formItem';
+export * from './layout';

package/src/form/index.ts

@@ -0,0 +1,3 @@
+import _Form from './index.vue';
+import { withInstall } from '../utils';
+export const Form = withInstall(_Form);