import type { FormKitTypeDefinition } from '@formkit/core';
import { actions, submitInput, forms, disablesChildren, createSection } from '@formkit/inputs';
import { messages } from '../sections/messages';
import PButton from 'primevue/button';
import { markRaw } from 'vue';

const formInput = createSection('form', () => ({
  $el: 'form',
  bind: '$attrs',
  meta: {
    autoAnimate: true,
  },
  attrs: {
    'id': '$id',
    'name': '$node.name',
    'onSubmit': '$handlers.submit',
    'data-loading': '$state.loading || undefined',
  },
}));

const button = createSection(
  // https://formkit.com/playground?fkv=latest&fileTab=Playground.vue&files=jc%5B%28%27name%21%27Playground.vue%27%7Eeditor%21%27%3Cscripzsetup%3EBtestUgWasyncJEqawaiznew+Promise%7Br3%3E+setTimeout%7Br%2C+5000%7D%7D-%29-BsGW%5Bq%286%24formkit142*lX1LogU2%29-%5D%3B-B_W%28qY1Uput2sG8%5B6%286*%24cmp19xbUdZsHAttrsxprops8%286Nignore8true%2C6NY1sHx*OZOx*lXZsHLXx%29%2C6*V6N%22%24lXx*%286N*ifZOxN%24el1spanxNV%22+loadUg...%22%5D6N%29%2C6*%5D6%29q%5D%2C-%29-BC3JE%29--%2F%2F+Then+we+attach+a+library-C.library3JnodeEqifJnode.props.Y3%3D%3D+%224%22%7D+%286node.defUe%7B_%7Dq%29-%29--MscriptQ-%3Cj-+%3C96YRform76%3AplugUsR%5BC%5D76%3AactionsRfalse76%40sHRtestUg7q%3E6%3C9SG+%3AsGRsG7+%2F%3E6M9Q*M9QMj%27%7Eadded%21true%29%5D*++-%5Cn18%222%22%2CqW%3D4spUnUgSH6-N7%5C%278%3A+9FormKitB-conszCcustomInputsE%7D3%3E+%28GchemaHubmitJ+%7BM%3C%2FN**OdisabledQ%3E-R%3D7UinVchildren8%5BW3+XabelYtypeZ1%24_4DefUitionjtemplateQq-*x2Nzt+%01zxqj_ZYXWVURQONMJHGECB98764321-*_&imports=jc%28%27name%21%27ImportMap%27%7Eeditor%21%27%28*+1vue%5C%211https%3A%2F%2Fcdn.jsdelivr.net%2Fnpm%2Fvue%403%2Fdist%2Fvue.esm-browser.min.js0*%29*%27%29*%5Cn0%5C%271+0%0110*_&css-framework=genesis
  'button',
  () => ({
    $cmp: markRaw(PButton) as never,
    bind: '$submitAttrs',
    props: {
      type: 'submit',
      label: '$submitLabel',
      loading: '$state.loading || undefined',
    },
  }),
);

export const form: FormKitTypeDefinition = {
  type: 'group',
  schema: formInput(
    '$slots.default',
    messages(),
    actions(submitInput()),
    button(), //
  ),
  props: [
    'submitLabel',
    'submitAttrs',
    'submitBehavior',
    'incompleteMessage', // 抱歉，部分字段未被正确填写。
  ],
  features: [forms, disablesChildren],
  schemaMemoKey: 'i90xrn9dyre', // Math.random().toString(36).substring(2, 15)
};