VForm.mjs 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import { createVNode as _createVNode } from "vue";
  2. // Composables
  3. import { makeComponentProps } from "../../composables/component.mjs";
  4. import { createForm, makeFormProps } from "../../composables/form.mjs";
  5. import { forwardRefs } from "../../composables/forwardRefs.mjs"; // Utilities
  6. import { ref } from 'vue';
  7. import { genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
  8. export const makeVFormProps = propsFactory({
  9. ...makeComponentProps(),
  10. ...makeFormProps()
  11. }, 'VForm');
  12. export const VForm = genericComponent()({
  13. name: 'VForm',
  14. props: makeVFormProps(),
  15. emits: {
  16. 'update:modelValue': val => true,
  17. submit: e => true
  18. },
  19. setup(props, _ref) {
  20. let {
  21. slots,
  22. emit
  23. } = _ref;
  24. const form = createForm(props);
  25. const formRef = ref();
  26. function onReset(e) {
  27. e.preventDefault();
  28. form.reset();
  29. }
  30. function onSubmit(_e) {
  31. const e = _e;
  32. const ready = form.validate();
  33. e.then = ready.then.bind(ready);
  34. e.catch = ready.catch.bind(ready);
  35. e.finally = ready.finally.bind(ready);
  36. emit('submit', e);
  37. if (!e.defaultPrevented) {
  38. ready.then(_ref2 => {
  39. let {
  40. valid
  41. } = _ref2;
  42. if (valid) {
  43. formRef.value?.submit();
  44. }
  45. });
  46. }
  47. e.preventDefault();
  48. }
  49. useRender(() => _createVNode("form", {
  50. "ref": formRef,
  51. "class": ['v-form', props.class],
  52. "style": props.style,
  53. "novalidate": true,
  54. "onReset": onReset,
  55. "onSubmit": onSubmit
  56. }, [slots.default?.(form)]));
  57. return forwardRefs(form, formRef);
  58. }
  59. });
  60. //# sourceMappingURL=VForm.mjs.map