refactor: 删除 use-safe-n-form-auto-imports.tsx 文件
All checks were successful
CI/CD Pipeline / playwright (push) Successful in 1m34s
CI/CD Pipeline / build-and-deploy (push) Successful in 2m5s

This commit is contained in:
严浩
2025-11-11 12:08:10 +08:00
parent 3429c75600
commit a2c49cf600

View File

@@ -1,121 +0,0 @@
/**
* https://www.naiveui.com/zh-CN/os-theme/components/form
*
* FIXME: `NForm` 和 `NFormItem` 的 slots 还没有实现。`NFormItemGi`组件。
*/
import { get, set } from 'lodash-es';
import type { FormInst, FormItemProps, FormProps } from 'naive-ui';
import { NForm, NFormItem, formItemProps, NInput, formProps } from 'naive-ui';
import type { Get, Paths } from 'type-fest';
import type { SlotsType } from 'vue';
import { Comment } from 'vue';
type UseSafeNFormOptions<FormValue> = {
initialFormValue?: FormValue;
};
export function useSafeNForm<T extends Record<string, any> = Record<string, unknown>>(
options: UseSafeNFormOptions<T> = {},
) {
const formInst = ref<FormInst | null>(null);
const formValue = ref<T>(structuredClone(toRaw(options.initialFormValue)) || ({} as T));
// 创建类型安全的 Form 组件
type SafeNFormProps = FormProps;
type SafeNFormSlots = SlotsType<{
default?: { count?: number };
}>;
const SafeNForm = defineComponent<SafeNFormProps, /* Emits */ [], /* EE */ never, SafeNFormSlots>(
(props, ctx) => {
return () => (
<NForm
{...props}
model={formValue.value}
ref={(inst) => {
formInst.value = inst as unknown as FormInst;
}}
>
{ctx.slots.default?.({})}
</NForm>
);
},
{
name: 'SafeNForm',
inheritAttrs: true,
props: formProps,
},
);
// <<<<<
// >>>>> 创建类型安全的 FormItem 组件
type SafeNFormItemProps<P extends Paths<T> & string> = FormItemProps & {
path: P;
};
type SafeNFormItemDefaultSlot<P extends Paths<T> & string> = {
value: Get<T, P>;
setValue: (val: Get<T, P>) => void;
};
const SafeNFormItemImpl = defineComponent<
SafeNFormItemProps<Paths<T> & string>,
/* Emits */ [],
/* EE */ never,
SlotsType<{ default: SafeNFormItemDefaultSlot<Paths<T> & string> }>
>(
(props, ctx) => {
return () => {
const value = get(formValue.value, props.path);
function setValue(val: typeof value) {
set(formValue.value, props.path, val);
}
const defaultSlotContent = ctx.slots.default?.({
value,
setValue,
});
// 如果没有提供默认 slot 内容,则渲染一个 NInput 作为默认输入组件
const renderDefaultNInput = defaultSlotContent?.some((v) => v.type !== Comment) ? null : (
<NInput value={value} onUpdate:value={setValue} />
);
return (
<NFormItem {...props} path={props.path}>
{defaultSlotContent}
{renderDefaultNInput}
</NFormItem>
);
};
},
{
name: 'SafeNFormItem',
inheritAttrs: false,
props: Object.keys(formItemProps) as unknown as [keyof FormItemProps],
},
);
// Expose a generic constructor so template literals narrow `path`.
type SafeNFormItemComponent = {
new <P extends Paths<T> & string>(
props: SafeNFormItemProps<P>,
): {
$props: SafeNFormItemProps<P>;
$slots: {
default?: (scope: SafeNFormItemDefaultSlot<P>) => VNode[];
};
};
};
const SafeNFormItem = SafeNFormItemImpl as SafeNFormItemComponent;
// <<<<<
return {
formValue,
SafeNForm,
SafeNFormItem,
formInst,
};
}