feat: 添加 @formkit/pro 插件，更新 FormKit 配置以支持切换功能

formkit.config.ts

@@ -3,6 +3,7 @@ import type { FormKitOptions } from '@formkit/core'
 import { createI18nPlugin, zh } from '@formkit/i18n'
 import { genesisIcons } from '@formkit/icons'
 import { checkbox, createLibraryPlugin, form, group, list, number, range, submit, text, textarea } from '@formkit/inputs'
+import { createProPlugin, toggle } from '@formkit/pro'
 import * as defaultRules from '@formkit/rules'
 import { createThemePlugin } from '@formkit/themes'
 import { createValidationPlugin } from '@formkit/validation'
@@ -17,10 +18,14 @@ const theme = undefined;
 const icons = genesisIcons;
 const themePlugin = createThemePlugin(theme, icons/* , iconLoaderUrl, iconLoader */)
 
-
+const apiKey = 'fk-6cdd5192223'
 export default {
   plugins: [
-    library, themePlugin, bindings, i18n, validation, addAsteriskPlugin,
+    createProPlugin(apiKey, { toggle }),
+
+    library,
+
+    themePlugin, bindings, i18n, validation, addAsteriskPlugin,
 
     // https://github.com/formkit/formkit/blob/ac1947a305eb5082ba95f53800305d080787cb32/packages/addons/src/plugins/autoHeightTextarea.ts
     createAutoHeightTextareaPlugin(),

package.json

@@ -13,6 +13,7 @@
     "@formkit/addons": "^1.6.9",
     "@formkit/core": "latest",
     "@formkit/icons": "latest",
+    "@formkit/pro": "^0.127.7",
     "@formkit/themes": "latest",
     "@formkit/vue": "latest",
     "@formkit/zod": "^1.6.9",

pnpm-lock.yaml

@@ -17,6 +17,9 @@ importers:
       '@formkit/icons':
         specifier: latest
         version: 1.6.9
+      '@formkit/pro':
+        specifier: ^0.127.7
+        version: 0.127.7(@formkit/core@1.6.9)(@formkit/inputs@1.6.9)(@formkit/utils@1.6.9)
       '@formkit/themes':
         specifier: latest
         version: 1.6.9(tailwindcss@3.4.15)
@@ -235,6 +238,9 @@ packages:
   '@formkit/dev@1.6.9':
     resolution: {integrity: sha512-4ueBpZAOiKr8/LZnq3mNePCX4ZB1j1JuJscBEwugWMnDeDwCNo5XWBrng1ER/LlitTRQ3mtEBNy2Qpm0yAHlwA==}
 
+  '@formkit/drag-and-drop@0.0.38':
+    resolution: {integrity: sha512-3uJFcqz1xL7x/5pClDnyqEDfyFRDFH+75MFpJYXnVF17oekxLrwbUaOBN7ttKGn1jW2MdojRw4WMnSN1iLryvw==}
+
   '@formkit/i18n@1.6.9':
     resolution: {integrity: sha512-8NA5bALlspCBEwInuZVgBqgQr0lDfproZdmbs2LciQpGi2B15u74JCjAkEwaKlMs+qgf/ds3QcIgUv2ztyyVEA==}
 
@@ -247,9 +253,19 @@ packages:
   '@formkit/observer@1.6.9':
     resolution: {integrity: sha512-p3MCmzp6jwzXIuV3gI9uTJTJl+sN5689C7qf7gdrS8jb1fbX1snKiTyWA8FXOrBXu+ne5z/sA/yBWqYFTSLy8A==}
 
+  '@formkit/pro@0.127.7':
+    resolution: {integrity: sha512-IfrOL1hZg3hX+pY5tAi08hkzTdchEO1o3b1j3MCgJJUdOJ6Gf1hdm36qK8gAFM1fQVEv6+NwEFwDeq6zAqfVpw==}
+    peerDependencies:
+      '@formkit/core': ^1.6.5
+      '@formkit/inputs': ^1.6.5
+      '@formkit/utils': ^1.6.5
+
   '@formkit/rules@1.6.9':
     resolution: {integrity: sha512-5Vu3JACKyws1kw02qF+024WkS7L9kYZ0lmdSpsaTqg5Wf7+InsxWXFYaG6vCzqIh4Lk9NeffIzq/xyGpGxf5uQ==}
 
+  '@formkit/tempo@0.1.2':
+    resolution: {integrity: sha512-jNPPbjL8oj7hK3eHX++CwbR6X4GKQt+x00/q4yeXkwynXHGKL27dylYhpEgwrmediPP4y7s0XtN1if/M/JYujg==}
+
   '@formkit/themes@1.6.9':
     resolution: {integrity: sha512-/UD+MehQEdcCEadt73eIBGGAMEK8ODN0yq9r9299WvQxIELCOP2MbcxuWCV/g2Vd15Xhl8YFdn4KCzQi4X7QXA==}
     peerDependencies:
@@ -1103,6 +1119,8 @@ snapshots:
       '@formkit/core': 1.6.9
       '@formkit/utils': 1.6.9
 
+  '@formkit/drag-and-drop@0.0.38': {}
+
   '@formkit/i18n@1.6.9':
     dependencies:
       '@formkit/core': 1.6.9
@@ -1123,12 +1141,22 @@ snapshots:
       '@formkit/core': 1.6.9
       '@formkit/utils': 1.6.9
 
+  '@formkit/pro@0.127.7(@formkit/core@1.6.9)(@formkit/inputs@1.6.9)(@formkit/utils@1.6.9)':
+    dependencies:
+      '@formkit/core': 1.6.9
+      '@formkit/drag-and-drop': 0.0.38
+      '@formkit/inputs': 1.6.9
+      '@formkit/tempo': 0.1.2
+      '@formkit/utils': 1.6.9
+
   '@formkit/rules@1.6.9':
     dependencies:
       '@formkit/core': 1.6.9
       '@formkit/utils': 1.6.9
       '@formkit/validation': 1.6.9
 
+  '@formkit/tempo@0.1.2': {}
+
   '@formkit/themes@1.6.9(tailwindcss@3.4.15)':
     dependencies:
       '@formkit/core': 1.6.9

src/tutorial-form/index.vue

@@ -134,7 +134,8 @@ onMounted(() => {
             v-if="attributes?.name"
             :preserve="false"
             name="confirmName"
-            type="checkbox"
+            type="toggle"
+            thumb-icon="star"
             :value="true"
             :label="`如果清空 name 输入框，这个确认框及其值将被移除。`"
           />