@formkit/inertia/dist/index.js

FormKit + Inertia = ❤️

"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/index.ts
var src_exports = {};
__export(src_exports, {
  useForm: () => useForm
});
module.exports = __toCommonJS(src_exports);

// src/inertia.ts
var import_vue3 = require("@inertiajs/vue3");
var import_vue4 = require("vue");

// src/eventManager.ts
var createEventManager = () => {
  const events = {};
  const on = (name, cb) => {
    if (typeof events[name] === "undefined")
      events[name] = [];
    events[name]?.push(cb);
  };
  const run = (name, ...args) => {
    let promiseResolver = Promise.resolve();
    for (const event of events[name] || []) {
      const res = event(...args);
      if (name === "before" && typeof res === "boolean")
        return res;
      else if (name === "success" || name === "finish") {
        if (res instanceof Promise) {
          promiseResolver = res;
        } else {
          promiseResolver = Promise.resolve(res);
        }
      }
    }
    if (name === "success" || name === "finish")
      return promiseResolver;
  };
  return {
    events,
    on,
    run
  };
};

// src/addons/formkit.ts
var import_vue = require("vue");
var import_core = require("@formkit/core");
var formkit_default = (initialFields, formLevelErrorName) => {
  const state = (0, import_vue.reactive)({
    node: null,
    dirty: false,
    errors: false,
    valid: false
  });
  return {
    state,
    addon: (on) => {
      on("start", (_, node) => {
        node.store.set((0, import_core.createMessage)({
          key: "loading",
          visible: false,
          value: true
        }));
        if (node.props.submitBehavior !== "live")
          node.props.disabled = true;
      });
      on("error", (errors, node) => {
        const _formLevelErrorName = formLevelErrorName ? formLevelErrorName : node.name;
        let formErrorMessages;
        if (_formLevelErrorName in errors) {
          formErrorMessages = errors[_formLevelErrorName];
          delete errors[_formLevelErrorName];
        }
        node.setErrors(_formLevelErrorName, errors);
      });
      on("finish", (_, node) => {
        node.store.remove("loading");
        if (node.props.submitBehavior !== "live")
          node.props.disabled = false;
      });
    },
    plugin: (node) => {
      if (node.props.type !== "form")
        return;
      state.node = node;
      if (initialFields)
        node.input(initialFields);
      node.on("created", () => {
        (0, import_vue.watchEffect)(() => {
          state.dirty = node.context.state.dirty;
          state.valid = node.context.state.valid;
          state.errors = node.context.state.errors;
        });
      });
      return false;
    }
  };
};

// src/addons/state.ts
var import_vue2 = require("vue");
var state_default = (recentlySuccessfulTimeoutTime = 2e3) => {
  let _recentlySuccessfulTimeoutId = void 0;
  const state = (0, import_vue2.reactive)({
    processing: false,
    progress: 0,
    recentlySuccessful: false,
    wasSuccessful: false
  });
  return {
    state,
    addon: (on) => {
      on("before", () => {
        state.processing = false;
        state.progress = 0;
        state.recentlySuccessful = false;
        state.wasSuccessful = false;
        clearInterval(_recentlySuccessfulTimeoutId);
      });
      on("start", () => {
        state.processing = true;
      });
      on("progress", (progress) => {
        state.progress = progress?.percentage || 0;
      });
      on("success", () => {
        state.recentlySuccessful = true;
        state.wasSuccessful = true;
        _recentlySuccessfulTimeoutId = setTimeout(() => {
          state.recentlySuccessful = false;
        }, recentlySuccessfulTimeoutTime);
      });
      on("finish", () => {
        state.processing = false;
        state.progress = 0;
      });
    }
  };
};

// src/inertia.ts
var useForm = (initialFields, options) => {
  const eventManager = createEventManager();
  const { state: addonState, addon: stateAddon } = state_default(options?.recentlySuccessfulTimeoutTime);
  const { state: formkitState, addon: formkitAddon, plugin } = formkit_default(initialFields, options?.formLevelErrorName);
  const addon = (addons) => {
    if (Array.isArray(addons))
      addons.forEach((cb) => cb(eventManager.on));
    else
      addons(eventManager.on);
  };
  addon(stateAddon);
  addon(formkitAddon);
  let _cancelToken = void 0;
  addon((on) => {
    on("cancelToken", (token) => {
      _cancelToken = token;
    });
    on("finish", () => {
      _cancelToken = void 0;
    });
  });
  const submit = (method, url, options2) => (data, node) => {
    const callbackEvents = Object.keys(eventManager.events).map((name) => ({
      [`on${name.charAt(0).toUpperCase() + name.slice(1)}`]: (arg) => {
        if (name === "cancel")
          return eventManager.run(name, arg);
        return eventManager.run(name, arg, node);
      }
    })).reduce((p, c) => ({ ...p, ...c }), {});
    if (method === "delete") {
      import_vue3.router.delete(url, {
        ...callbackEvents,
        ...options2,
        data
      });
    } else {
      import_vue3.router[method](url, data, {
        ...callbackEvents,
        ...options2
      });
    }
  };
  return {
    submit,
    get: (url, options2) => submit("get", url, options2),
    post: (url, options2) => submit("post", url, options2),
    put: (url, options2) => submit("put", url, options2),
    patch: (url, options2) => submit("patch", url, options2),
    delete: (url, options2) => submit("delete", url, options2),
    cancel: () => {
      if (_cancelToken)
        _cancelToken.cancel();
    },
    ...(0, import_vue4.toRefs)(addonState),
    ...(0, import_vue4.toRefs)(formkitState),
    on: eventManager.on,
    addon,
    plugin
  };
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  useForm
});
//# sourceMappingURL=index.js.map