feat: 更新自定义切换组件,重命名为 headlessui-switch 并调整类型定义
All checks were successful
/ test (push) Successful in 26s
/ surge (push) Successful in 24s

This commit is contained in:
严浩
2024-11-21 14:35:44 +08:00
parent 213aac2d3c
commit da379a71eb
3 changed files with 7 additions and 9 deletions

View File

@ -2,7 +2,7 @@ import { createAutoAnimatePlugin, createAutoHeightTextareaPlugin } from '@formki
import type { FormKitOptions } from '@formkit/core' import type { FormKitOptions } from '@formkit/core'
import { createI18nPlugin, zh } from '@formkit/i18n' import { createI18nPlugin, zh } from '@formkit/i18n'
import { genesisIcons } from '@formkit/icons' import { genesisIcons } from '@formkit/icons'
import { checkbox, createLibraryPlugin, form, group, list, number, range, submit, text, textarea } from '@formkit/inputs' import { checkbox, createLibraryPlugin, form, group, list, number, range, submit, text, textarea, } from '@formkit/inputs'
import { createProPlugin, toggle } from '@formkit/pro' import { createProPlugin, toggle } from '@formkit/pro'
import * as defaultRules from '@formkit/rules' import * as defaultRules from '@formkit/rules'
import { createThemePlugin } from '@formkit/themes' import { createThemePlugin } from '@formkit/themes'
@ -10,12 +10,12 @@ import { createValidationPlugin } from '@formkit/validation'
import { /* defaultConfig, */ bindings, createInput } from '@formkit/vue' import { /* defaultConfig, */ bindings, createInput } from '@formkit/vue'
import { addAsteriskPlugin } from './formkit.addAsteriskPlugin' import { addAsteriskPlugin } from './formkit.addAsteriskPlugin'
import { rootClasses } from "./formkit.config.theme" import { rootClasses } from "./formkit.config.theme"
import FormKitToggle from "./src/headlessui-switch.vue"; import HeadlessuiToggle from "./src/headlessui-switch.vue";
const library = createLibraryPlugin({ const library = createLibraryPlugin({
text, form, submit, group, checkbox, range, list, number, textarea, text, form, submit, group, checkbox, range, list, number, textarea,
mytoggle: createInput(FormKitToggle) 'headlessuiSwitch': createInput(HeadlessuiToggle)
}) })
const validation = createValidationPlugin(defaultRules) const validation = createValidationPlugin(defaultRules)
const i18n = createI18nPlugin({ zh }) const i18n = createI18nPlugin({ zh })

View File

@ -6,9 +6,9 @@ declare module '@formkit/inputs' {
// https://formkit.com/essentials/custom-inputs#typescript-support // https://formkit.com/essentials/custom-inputs#typescript-support
interface FormKitInputProps<Props extends FormKitInputs<Props>> { interface FormKitInputProps<Props extends FormKitInputs<Props>> {
// This key and the `type` should match: // This key and the `type` should match:
'mytoggle': { 'headlessui-switch': {
// Define your input `type`: // Define your input `type`:
type: 'mytoggle', type: 'headlessui-switch',
someProp: string, someProp: string,
} }
} }
@ -21,9 +21,7 @@ declare module '@formkit/inputs' {
import { Switch, SwitchGroup, SwitchLabel } from '@headlessui/vue'; import { Switch, SwitchGroup, SwitchLabel } from '@headlessui/vue';
import { computed } from 'vue'; import { computed } from 'vue';
const props = defineProps<{ const props = defineProps<{ context: FormKitFrameworkContext; }>();
context: FormKitFrameworkContext;
}>();
const value = computed({ const value = computed({

View File

@ -148,7 +148,7 @@ onMounted(() => {
<FormKit <FormKit
label="headlessui" label="headlessui"
type="mytoggle" type="headlessui-switch"
/> />
<FormKit <FormKit