fix(react-formio): use @formio/js v5+

.storybook/styles/index.css

@@ -1,6 +1,6 @@
 @import "tailwind.css";
 @import "fonts/index.css";
 @import "typography.css";
-@import "../../node_modules/formiojs/dist/formio.full.css";
+@import "../../node_modules/@formio/js/dist/formio.full.css";
 @import "../../packages/tailwind-formio/styles/index.css";
 

package.json

@@ -35,7 +35,9 @@
   },
   "dependencies": {
     "@formio/choices.js": "^9.0.1",
+    "@formio/js": "5.0.0",
     "@types/classnames": "^2.2.11",
+    "@types/lodash": "4.17.13",
     "@types/react": "^18.2.8",
     "@types/react-dnd": "3.0.2",
     "@types/react-dnd-html5-backend": "3.0.2",
@@ -45,7 +47,6 @@
     "@types/react-router-dom": "^5.3.3",
     "@types/react-table": "^7.7.14",
     "connected-react-router": "6.9.1",
-    "formiojs": "4.21.6",
     "history": "5.3.0",
     "lerna": "8.1.2",
     "lodash": "4.17.21",

packages/integration/package.json

@@ -14,7 +14,7 @@
   },
   "peerDependencies": {
     "@formio/choices.js": ">=9.0.1",
-    "formiojs": ">=4.0.0",
+    "@formio/js": ">=5.0.0",
     "lodash": ">=4.17.20",
     "react": ">=16.14.0",
     "react-dnd": ">=16.0.1",

packages/integration/src/styles/index.css

@@ -1,6 +1,6 @@
 @import "tailwind.css";
 @import "fonts/index.css";
 @import "typography.css";
-@import "formiojs/dist/formio.full.css";
+@import "@formio/js/dist/formio.full.css";
 @import "@tsed/tailwind-formio/styles/index.css";
 

packages/react-formio-container/package.json

@@ -26,12 +26,12 @@
   },
   "peerDependencies": {
     "@formio/choices.js": "^9.0.1",
+    "@formio/js": "^5.0.0",
     "@tsed/react-formio": "3.0.0-alpha.1",
     "@tsed/react-formio-stores": "3.0.0-alpha.1",
     "classnames": "^2.3.1",
     "connected-react-router": "^6.9.1",
     "file-saver": "^2.0.5",
-    "formiojs": "^4.21.6",
     "lodash": "^4.17.21",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
@@ -52,6 +52,9 @@
     "vitest": "2.1.8"
   },
   "peerDependenciesMeta": {
+    "@formio/js": {
+      "optional": false
+    },
     "choices.js": {
       "optional": false
     },
@@ -64,9 +67,6 @@
     "file-saver": {
       "optional": false
     },
-    "formiojs": {
-      "optional": false
-    },
     "lodash": {
       "optional": false
     },
@@ -97,6 +97,5 @@
     "tooltip.js": {
       "optional": false
     }
-  },
-  "dependencies": {}
+  }
 }

packages/react-formio-container/src/interfaces/FormioContainerOptions.ts

@@ -1,4 +1,6 @@
-import { FormSchema, Submission } from "@tsed/react-formio";
+import type { Form } from "@formio/core";
+import { Submission } from "@tsed/react-formio";
+import { ComponentType } from "react";
 
 import { FormRoute } from "../views/form.routes";
 
@@ -54,24 +56,24 @@ export interface FormioContainerOptions extends Record<string, unknown> {
    * Handler called when an event is an error
    */
   onError?: FormioErrorHandler;
-  onSubmitForm?: (type: string, form: FormSchema) => void;
+  onSubmitForm?: (type: string, form: Form) => void;
   onSubmitSubmission?: (submissionType: string, formId: string, submission: Submission) => void;
   /**
    * i18n function to translate sentences
    */
   i18n?: (f: string) => string;
 
   // override components
-  FormsComponent?: React.ComponentType<any>;
-  FormComponent?: React.ComponentType<any>;
-  FormActionsComponent?: React.ComponentType<any>;
-  FormActionComponent?: React.ComponentType<any>;
-  FormExportComponent?: React.ComponentType<any>;
-  FormEditComponent?: React.ComponentType<any>;
-  FormSettingsComponent?: React.ComponentType<any>;
-  FormAccessComponent?: React.ComponentType<any>;
-  SubmissionComponent?: React.ComponentType<any>;
-  SubmissionsComponent?: React.ComponentType<any>;
-  RemoveModalComponent?: React.ComponentType<any>;
-  LoaderComponent?: React.ComponentType<any>;
+  FormsComponent?: ComponentType<any>;
+  FormComponent?: ComponentType<any>;
+  FormActionsComponent?: ComponentType<any>;
+  FormActionComponent?: ComponentType<any>;
+  FormExportComponent?: ComponentType<any>;
+  FormEditComponent?: ComponentType<any>;
+  FormSettingsComponent?: ComponentType<any>;
+  FormAccessComponent?: ComponentType<any>;
+  SubmissionComponent?: ComponentType<any>;
+  SubmissionsComponent?: ComponentType<any>;
+  RemoveModalComponent?: ComponentType<any>;
+  LoaderComponent?: ComponentType<any>;
 }

packages/react-formio-container/src/utils/ExportClient.ts

@@ -1,4 +1,4 @@
-import { FormSchema } from "@tsed/react-formio";
+import type { Form } from "@formio/core";
 import FileSaver from "file-saver";
 import moment from "moment";
 
@@ -8,12 +8,12 @@ async function getDatabase() {
   return httpClient.get("/export");
 }
 
-async function exportForm(form: FormSchema) {
+async function exportForm(form: Form) {
   const database = await getDatabase();
   return database.forms[form.machineName!] || database.resources[form.machineName!];
 }
 
-async function exportActions(form: FormSchema) {
+async function exportActions(form: Form) {
   const database = await getDatabase();
 
   return Object.entries(database.actions).reduce((obj, [machineName, action]) => {
@@ -25,9 +25,9 @@ async function exportActions(form: FormSchema) {
   }, {});
 }
 
-async function getContent(form: FormSchema, type: string, format = "json") {
+async function getContent(form: Form, type: string, format = "json") {
   let result;
-  console.log(form, type, format);
+
   switch (type) {
     case "schema":
       result = await exportForm(form);

packages/react-formio-container/tsconfig.app.json

@@ -6,6 +6,6 @@
     "declaration": false,
     "composite": false
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx", "vite.config.mts"],
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
 }

packages/react-formio-container/tsconfig.json

@@ -11,6 +11,9 @@
     {
       "path": "./tsconfig.app.json"
     },
+    {
+      "path": "./tsconfig.node.json"
+    },
     {
       "path": "./tsconfig.spec.json"
     }

packages/react-formio-container/tsconfig.node.json

@@ -0,0 +1,13 @@
+{
+  "extends": "@tsed/typescript/tsconfig.web.json",
+  "compilerOptions": {
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "baseUrl": ".",
+    "noEmit": true,
+    "declaration": false,
+    "composite": false
+  },
+  "include": ["vite.config.mts"],
+  "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
+}

packages/react-formio-stores/package.json

@@ -24,7 +24,7 @@
   },
   "peerDependencies": {
     "@formio/choices.js": ">=9.0.1",
-    "formiojs": ">=4.0.0",
+    "@formio/js": ">=5.0.0",
     "lodash": ">=4.17.20",
     "react": ">=16.14.0",
     "react-dom": ">=16.14.0",

packages/react-formio-stores/src/stores/action-info/action-info.actions.spec.ts

@@ -1,8 +1,8 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { getActionInfo, receiveActionInfo, requestActionInfo } from "./action-info.actions";
 
-vi.mock("formiojs", async (originalImport) => {
+vi.mock("@formio/js", async (originalImport) => {
   return {
     ...(await originalImport()),
     Formio: class {

packages/react-formio-stores/src/stores/action-info/action-info.actions.ts

@@ -1,5 +1,5 @@
+import { Formio } from "@formio/js";
 import { createAction } from "@tsed/redux-utils";
-import { Formio } from "formiojs";
 import noop from "lodash/noop";
 
 import { getFormUrl } from "../../utils/url";

packages/react-formio-stores/src/stores/action/action.actions.spec.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { getActionInfo } from "../action-info";
 import {
@@ -12,7 +12,7 @@ import {
   sendAction
 } from "./action.actions";
 
-vi.mock("formiojs", async (originalImport) => {
+vi.mock("@formio/js", async (originalImport) => {
   return {
     ...(await originalImport()),
     Formio: class {

packages/react-formio-stores/src/stores/action/action.actions.ts

@@ -1,5 +1,5 @@
+import { Formio } from "@formio/js";
 import { createAction } from "@tsed/redux-utils";
-import { Formio } from "formiojs";
 import get from "lodash/get";
 import noop from "lodash/noop";
 

packages/react-formio-stores/src/stores/actions/actions.actions.spec.ts

@@ -1,8 +1,8 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { getActions, receiveActions, requestActions, resetActions } from "./actions.actions";
 
-vi.mock("formiojs", async (originalImport) => {
+vi.mock("@formio/js", async (originalImport) => {
   return {
     ...(await originalImport()),
     Formio: class {

packages/react-formio-stores/src/stores/actions/actions.actions.ts

@@ -1,5 +1,5 @@
+import { Formio } from "@formio/js";
 import { createAction } from "@tsed/redux-utils";
-import { Formio } from "formiojs";
 import noop from "lodash/noop";
 
 import { getFormUrl } from "../../utils/url";

packages/react-formio-stores/src/stores/auth/getAccess.action.spec.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { formAccessUser, submissionAccessUser, userForms, userRoles } from "./auth.actions";
 import { AUTH } from "./auth.constant";

packages/react-formio-stores/src/stores/auth/getAccess.action.ts

@@ -1,5 +1,5 @@
+import { Formio } from "@formio/js";
 import type { FormSchema, RoleSchema } from "@tsed/react-formio";
-import { Formio } from "formiojs";
 
 import { formAccessUser, submissionAccessUser, userForms, userRoles } from "./auth.actions";
 import { AUTH } from "./auth.constant";

packages/react-formio-stores/src/stores/auth/getProjectAccess.action.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { projectAccessUser } from "./auth.actions";
 import { AUTH } from "./auth.constant";

packages/react-formio-stores/src/stores/auth/initAuth.action.spec.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { requestUser } from "./auth.actions";
 import { AUTH } from "./auth.constant";

packages/react-formio-stores/src/stores/auth/initAuth.action.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 import noop from "lodash/noop";
 
 import { failUser, requestUser } from "./auth.actions";

packages/react-formio-stores/src/stores/auth/logout.action.spec.ts

@@ -1,11 +1,11 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { logoutUser } from "./auth.actions";
 import { AUTH } from "./auth.constant";
 import { logout } from "./logout.action";
 
 vi.mock("./auth.actions");
-vi.mock("formiojs");
+vi.mock("@formio/js");
 
 describe("logout()", () => {
   beforeEach(() => {

packages/react-formio-stores/src/stores/auth/logout.action.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { logoutUser } from "./auth.actions";
 import { AUTH } from "./auth.constant";

packages/react-formio-stores/src/stores/auth/setUser.action.spec.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { receiveUser } from "./auth.actions";
 import { AUTH } from "./auth.constant";

packages/react-formio-stores/src/stores/auth/setUser.action.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { receiveUser } from "./auth.actions";
 import { AUTH } from "./auth.constant";

packages/react-formio-stores/src/stores/form/form.actions.spec.ts

@@ -1,8 +1,8 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { deleteForm, failForm, getForm, receiveForm, requestForm, resetForm, saveForm, sendForm } from "./form.actions";
 
-vi.mock("formiojs", async (originalImport) => {
+vi.mock("@formio/js", async (originalImport) => {
   return {
     ...(await originalImport()),
     Formio: class {

packages/react-formio-stores/src/stores/form/form.actions.ts

@@ -1,6 +1,6 @@
+import { Formio } from "@formio/js";
 import type { FormSchema } from "@tsed/react-formio";
 import { createAction } from "@tsed/redux-utils";
-import { Formio } from "formiojs";
 import noop from "lodash/noop";
 
 import { getFormUrl } from "../../utils/url";

packages/react-formio-stores/src/stores/forms/forms.actions.spec.ts

@@ -1,9 +1,9 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { mapRequestParams } from "../../utils/mapRequestParams";
 import { failForms, getForms, receiveForms, requestForms } from "./forms.actions";
 
-vi.mock("formiojs", async (originalImport) => {
+vi.mock("@formio/js", async (originalImport) => {
   return {
     ...(await originalImport()),
     Formio: class {

packages/react-formio-stores/src/stores/forms/forms.actions.ts

@@ -1,6 +1,6 @@
+import { Formio } from "@formio/js";
 import type { FormSchema } from "@tsed/react-formio";
 import { createAction } from "@tsed/redux-utils";
-import { Formio } from "formiojs";
 import noop from "lodash/noop";
 
 import { mapRequestParams, RequestParamsOptions } from "../../utils/mapRequestParams";

packages/react-formio-stores/src/stores/submission/submission.actions.spec.ts

@@ -1,4 +1,4 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import {
   clearSubmissionError,
@@ -12,7 +12,7 @@ import {
   sendSubmission
 } from "./submission.actions";
 
-vi.mock("formiojs", async (originalImport) => {
+vi.mock("@formio/js", async (originalImport) => {
   return {
     ...(await originalImport()),
     Formio: class {

packages/react-formio-stores/src/stores/submission/submission.actions.ts

@@ -1,6 +1,6 @@
+import { Formio } from "@formio/js";
 import { Submission } from "@tsed/react-formio";
 import { createAction } from "@tsed/redux-utils";
-import { Formio } from "formiojs";
 import noop from "lodash/noop";
 
 import { getSubmissionUrl } from "../../utils/url";

packages/react-formio-stores/src/stores/submissions/submissions.actions.spec.ts

@@ -1,9 +1,9 @@
-import { Formio } from "formiojs";
+import { Formio } from "@formio/js";
 
 import { mapRequestParams } from "../../utils/mapRequestParams";
 import { failSubmissions, getSubmissions, receiveSubmissions, requestSubmissions } from "./submissions.actions";
 
-vi.mock("formiojs", async (originalImport) => {
+vi.mock("@formio/js", async (originalImport) => {
   return {
     ...(await originalImport()),
     Formio: class {

packages/react-formio-stores/src/stores/submissions/submissions.actions.ts

@@ -1,5 +1,5 @@
+import { Formio } from "@formio/js";
 import { createAction } from "@tsed/redux-utils";
-import { Formio } from "formiojs";
 import noop from "lodash/noop";
 
 import { mapRequestParams } from "../../utils/mapRequestParams";

packages/react-formio-stores/src/utils/url.ts

@@ -1,4 +1,4 @@
-import { Formio, Utils } from "formiojs";
+import { Formio, Utils } from "@formio/js";
 
 export function getFormUrl(formId: string): string {
   const url = [Formio.getProjectUrl()];

packages/react-formio-stores/tsconfig.app.json

@@ -6,6 +6,6 @@
     "declaration": false,
     "composite": false
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx", "vite.config.mts"],
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
 }

packages/react-formio-stores/tsconfig.json

@@ -11,6 +11,9 @@
     {
       "path": "./tsconfig.app.json"
     },
+    {
+      "path": "./tsconfig.node.json"
+    },
     {
       "path": "./tsconfig.spec.json"
     }

packages/react-formio-stores/tsconfig.node.json

@@ -0,0 +1,13 @@
+{
+  "extends": "@tsed/typescript/tsconfig.web.json",
+  "compilerOptions": {
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "baseUrl": ".",
+    "noEmit": true,
+    "declaration": false,
+    "composite": false
+  },
+  "include": ["vite.config.mts"],
+  "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
+}

packages/react-formio/package.json

@@ -30,7 +30,7 @@
   },
   "peerDependencies": {
     "@formio/choices.js": ">=9.0.1",
-    "formiojs": ">=4.0.0",
+    "@formio/js": ">=5.0.0",
     "lodash": ">=4.17.20",
     "moment": ">=2.30.1",
     "react": ">=16.14.0",

packages/react-formio/src/components/form-access/formAccess.component.tsx

@@ -1,6 +1,7 @@
+import type { Form as FormType } from "@formio/core";
 import { PropsWithChildren, useCallback, useEffect, useMemo, useState } from "react";
 
-import type { FormOptions, FormSchema, Submission } from "../../interfaces";
+import type { FormOptions, Submission } from "../../interfaces";
 import { Card } from "../card/card.component";
 import { Form } from "../form/form.component";
 import { ChangedSubmission } from "../form/useForm.hook";
@@ -16,7 +17,7 @@
 } from "./formAccess.utils";
 
 export interface FormAccessProps {
-  form: Partial<FormSchema>;
+  form: Partial<FormType>;
   roles: any;
   onSubmit?: Function;
   options?: FormOptions;
@@ -41,7 +42,7 @@
         setSubmissions(input);
       }
     }
   }, [formDefinition?._id]);
 
   return {
     options,

packages/react-formio/src/components/form-access/formAccess.schema.ts

@@ -1,8 +1,6 @@
-import { ExtendedComponentSchema } from "formiojs";
+import type { Form as FormType } from "@formio/core";
 
-import { FormSchema } from "../../interfaces/FormSchema";
-
-export function getRoleComponent({ label, key, description, choices, data }: any): ExtendedComponentSchema {
+export function getRoleComponent({ label, key, description, choices, data }: any) {
   return {
     label,
     key,
@@ -34,7 +32,7 @@ function toDescription(description: string, hr = true): string {
   return '<span class="text-sm">' + description + "</span> " + (hr ? '<hr class="mt-6 mb-5 border-gray-200 mx-20"/>' : "");
 }
 
-export function getSubmissionPermissionForm({ choices }: any): FormSchema {
+export function getSubmissionPermissionForm({ choices }: any): FormType & { description: string } {
   return {
     description: "<strong>Elevated permissions allow users to access and modify other user's entities. Assign with caution.</strong>",
     components: [
@@ -107,7 +105,7 @@ export function getSubmissionPermissionForm({ choices }: any): FormSchema {
   };
 }
 
-export function getAccessPermissionForm({ choices }: any): FormSchema {
+export function getAccessPermissionForm({ choices }: any): FormType & { description: string } {
   return {
     description: "<strong>Elevated permissions allow users to access and modify other user's entities. Assign with caution.</strong>",
     components: [

packages/react-formio/src/components/form-access/formAccess.stories.tsx

@@ -57,7 +57,6 @@ export const Sandbox: Story = {
       ],
       controller: "",
       properties: {},
-      settings: {},
       name: "textField",
       path: "textfield",
       machineName: "tcspjwhsevrzpcd:textField"

packages/react-formio/src/components/form-access/formAccess.utils.spec.ts

@@ -1,4 +1,5 @@
-import { FormSchema } from "../../interfaces";
+import type { Form } from "@formio/core";
+
 import { dataAccessToSubmissions, getFormAccess, SubmissionAccess, submissionsToDataAccess, updateSubmissions } from "./formAccess.utils";
 
 const roles: any[] = [
@@ -13,7 +14,7 @@ const roles: any[] = [
 describe("formAccess.utils", () => {
   describe("dataAccessToSubmissions()", () => {
     it("should map data access to form submissions", () => {
-      const data: FormSchema = {
+      const data: Form = {
         _id: "id",
         components: [],
         access: [
@@ -85,7 +86,7 @@ describe("formAccess.utils", () => {
         }
       };
 
-      const originalForm: FormSchema = {
+      const originalForm: Form = {
         _id: "id",
         components: [],
         access: [

packages/react-formio/src/components/form-access/formAccess.utils.ts

@@ -1,9 +1,9 @@
-import { ExtendedComponentSchema } from "formiojs";
+import type { BaseComponent, Form } from "@formio/core";
 import cloneDeep from "lodash/cloneDeep";
 import isEqual from "lodash/isEqual";
 import noop from "lodash/noop";
 
-import { FormSchema, Submission } from "../../interfaces";
+import { Submission } from "../../interfaces";
 import { RoleSchema } from "../../interfaces/RoleSchema";
 import { getAccessPermissionForm, getSubmissionPermissionForm } from "./formAccess.schema";
 
@@ -20,8 +20,8 @@ export interface Access {
 export type AccessRoles = Record<string, string[]>;
 
 export type FormAccessSchema = {
-  access: FormSchema;
-  submissionAccess: FormSchema;
+  access: Form;
+  submissionAccess: Form;
 };
 
 export type SubmissionAccess = {
@@ -79,8 +79,8 @@ export function getFormAccess(roles: RoleSchema[]): FormAccessSchema {
   };
 }
 
-export function dataAccessToSubmissions(form: Partial<FormSchema>, formAccess: FormAccessSchema): SubmissionAccess {
-  const getKeys = (components: ExtendedComponentSchema[]) => components.map(({ key }) => key);
+export function dataAccessToSubmissions(form: Partial<Form>, formAccess: FormAccessSchema): SubmissionAccess {
+  const getKeys = (components: BaseComponent[]) => components.map(({ key }) => key);
 
   return {
     access: {
@@ -92,7 +92,7 @@ export function dataAccessToSubmissions(form: Partial<FormSchema>, formAccess: F
   };
 }
 
-export function submissionsToDataAccess(form: Partial<FormSchema>, submissions: SubmissionAccess): Partial<FormSchema> {
+export function submissionsToDataAccess(form: Partial<Form>, submissions: SubmissionAccess): Partial<Form> {
   return {
     ...cloneDeep(form),
     access: hashToAccess(submissions.access.data),

packages/react-formio/src/components/form-action/formAction.component.tsx

@@ -1,4 +1,4 @@
-import FormioUtils from "formiojs/utils";
+import FormioUtils from "@formio/js/utils";
 import { PropsWithChildren, ReactElement } from "react";
 
 import { ActionDefaultsSchema, ActionSchema, FormOptions, Submission } from "../../interfaces";

packages/react-formio/src/components/form-builder/formBuilder.component.tsx

@@ -1,14 +1,15 @@
-import { ComponentSchema } from "formiojs";
-import AllComponents from "formiojs/components";
-import Components from "formiojs/components/Components";
-import FormioFormBuilder from "formiojs/FormBuilder";
+import type { BaseComponent as FormComponent } from "@formio/core";
+import { FormBuilder as FormioFormBuilder } from "@formio/js";
 import cloneDeep from "lodash/cloneDeep";
 import noop from "lodash/noop";
 import { Component } from "react";
 
 import { callLast } from "../../utils/callLast";
 
-Components.setComponents(AllComponents);
+/**
+ * @deprecated use Component from @formio/core
+ */
+export type ComponentSchema = FormComponent;
 
 const EVENTS = [
   "addComponent",
@@ -25,7 +26,7 @@ const EVENTS = [
 
 const EVENTS_CHANGE = ["addComponent", "saveComponent", "updateComponent", "removeComponent"];
 
-async function createBuilder(el: Element, { components = [], display, options, onChange, events = {} }: any): Promise<void> {
+async function createBuilder(el: HTMLElement, { components = [], display, options, onChange, events = {} }: any): Promise<void> {
   const form = {
     display,
     components: [...components]
@@ -53,11 +54,11 @@ async function createBuilder(el: Element, { components = [], display, options, o
 }
 
 export interface FormBuilderProps {
-  components: ComponentSchema[];
+  components: FormComponent[];
   display?: string;
   options?: any;
   builder?: any;
-  onChange?: (components: ComponentSchema[]) => void;
+  onChange?: (components: FormComponent[]) => void;
   onAddComponent?: Function;
   onUpdateComponent?: Function;
   onRemoveComponent?: Function;

packages/react-formio/src/components/form-edit/formEdit.reducer.ts

@@ -1,16 +1,15 @@
+import type { Form } from "@formio/core";
 import camelCase from "lodash/camelCase";
 import cloneDeep from "lodash/cloneDeep";
 import isEqual from "lodash/isEqual";
 
-import { FormSchema } from "../../interfaces";
-
-export const hasChanged = (form: Partial<FormSchema>, value: Partial<FormSchema>): boolean => !isEqual(form, value);
+export const hasChanged = (form: Partial<Form>, value: Partial<Form>): boolean => !isEqual(form, value);
 
 export interface FormEditState {
-  past: Partial<FormSchema>[];
-  future: Partial<FormSchema>[];
-  current: Partial<FormSchema>;
-  original: Partial<FormSchema>;
+  past: Partial<Form>[];
+  future: Partial<Form>[];
+  current: Partial<Form>;
+  original: Partial<Form>;
 }
 
 export function createInitialState(props: any): FormEditState {

packages/react-formio/src/components/form-edit/formParameters.component.tsx

@@ -1,6 +1,6 @@
+import type { Form } from "@formio/core";
 import { ReactElement } from "react";
 
-import { FormSchema } from "../../interfaces/FormSchema";
 import { InputTags } from "../input-tags/inputTags.component";
 import { InputText } from "../input-text/inputText.component";
 import { Select } from "../select/select.component";
@@ -13,7 +13,7 @@ export const defaultDisplayChoices = [
 
 export interface FormParametersProps {
   onChange?: (name: string, value: any) => void;
-  form: Partial<FormSchema>;
+  form: Partial<Form>;
   typeChoices?: { label: string; value: any }[];
   displayChoices?: { label: string; value: any }[];
   enableTags?: boolean;

packages/react-formio/src/components/form-edit/useFormEdit.hook.ts

@@ -1,16 +1,16 @@
+import type { Form } from "@formio/core";
 import cloneDeep from "lodash/cloneDeep";
 import { useEffect, useReducer } from "react";
 
-import { FormSchema } from "../../interfaces/FormSchema";
 import { createInitialState, hasChanged, reducer } from "./formEdit.reducer";
 
 export interface UseFormEditHookProps extends Record<string, unknown> {
-  form?: Partial<FormSchema>;
+  form?: Partial<Form>;
   typeChoices?: { label: string; value: any }[];
   displayChoices?: { label: string; value: any }[];
   enableTags?: boolean;
-  onSubmit?: (form: Partial<FormSchema>) => void;
-  onCopy?: (form: Partial<FormSchema>) => void;
+  onSubmit?: (form: Partial<Form>) => void;
+  onCopy?: (form: Partial<Form>) => void;
 }
 
 export function useFormEdit(props: UseFormEditHookProps) {
@@ -31,9 +31,9 @@
     if (props.form && (current._id !== props.form._id || current.modified !== props.form.modified)) {
       dispatchFormAction({ type: "replaceForm", value: props.form });
     }
   }, [props.form]);
 
-  const formChange = (newForm: Partial<FormSchema>) => {
+  const formChange = (newForm: Partial<Form>) => {
     if (hasChanged(current, { ...current, ...newForm })) {
       dispatchFormAction({ type: "formChange", value: newForm });
     }

packages/react-formio/src/components/form-settings/formSettings.component.spec.tsx

@@ -48,6 +48,7 @@ describe("FormSettings", () => {
   });
   it("should render form settings with i18n options", () => {
     render(
+      // @ts-ignore
       <FormSettings
         {...Sandbox.args}
         options={{

packages/react-formio/src/components/form-settings/formSettings.component.tsx

@@ -1,15 +1,16 @@
+import type { Form as FormType } from "@formio/core";
 import isEqual from "lodash/isEqual";
 import noop from "lodash/noop";
 import { useEffect, useState } from "react";
 
-import { FormOptions, FormSchema } from "../../interfaces";
+import { FormOptions } from "../../interfaces";
 import { Form } from "../form/form.component";
 import { ChangedSubmission } from "../form/useForm.hook";
 import { getFormSettingsSchema } from "./formSettings.schema";
 import { FormSettingsSchema, formSettingsToSubmission, submissionToFormSettings } from "./formSettings.utils";
 
 export interface FormSettingsProps {
-  form: Partial<FormSchema>;
+  form: Partial<FormType>;
   onSubmit?: Function;
   options?: FormOptions;
 }
@@ -31,7 +32,7 @@
     if (formDefinition?._id && !isEqual(submission.data, input.data)) {
       setSubmission(input);
     }
   }, [formDefinition?._id]);
 
   return {
     options,

packages/react-formio/src/components/form-settings/formSettings.schema.ts

@@ -1,6 +1,6 @@
-import { FormSchema } from "../../interfaces";
+import type { Form as FormType } from "@formio/core";
 
-export function getFormSettingsSchema(): FormSchema {
+export function getFormSettingsSchema(): FormType {
   return {
     type: "form",
     tags: [],

packages/react-formio/src/components/form-settings/formSettings.utils.ts

@@ -1,14 +1,15 @@
+import type { Form as FormType } from "@formio/core";
 import cloneDeep from "lodash/cloneDeep";
 
-import { FormSchema, Submission } from "../../interfaces";
+import { Submission } from "../../interfaces";
 
 export type FormSettingsSchema = {
   action: string;
   tags: string[];
   properties: Record<string, any>;
 };
 
-export function formSettingsToSubmission(form: Partial<FormSchema>): Submission<FormSettingsSchema> {
+export function formSettingsToSubmission(form: Partial<FormType>): Submission<FormSettingsSchema> {
   return {
     data: {
       action: form.action!,
@@ -18,7 +19,7 @@ export function formSettingsToSubmission(form: Partial<FormSchema>): Submission<
   };
 }
 
-export function submissionToFormSettings(form: Partial<FormSchema>, submission: Submission<FormSettingsSchema>): Partial<FormSchema> {
+export function submissionToFormSettings(form: Partial<FormType>, submission: Submission<FormSettingsSchema>): Partial<FormType> {
   return {
     ...cloneDeep(form),
     tags: submission.data.tags,

packages/react-formio/src/components/form/form.component.tsx

@@ -1,10 +1,5 @@
-import { Components } from "formiojs";
-import AllComponents from "formiojs/components";
-
 import { useForm, UseFormHookProps } from "./useForm.hook";
 
-Components.setComponents(AllComponents);
-
 export interface FormProps<Data = any> extends UseFormHookProps<Data> {
   name?: string;
   /**

packages/react-formio/src/components/form/useForm.hook.ts

@@ -1,13 +1,14 @@
-import { ExtendedComponentSchema, Form } from "formiojs";
+import type { BaseComponent, Form as FormType } from "@formio/core";
+import { Form } from "@formio/js";
 import cloneDeep from "lodash/cloneDeep";
 import isEqual from "lodash/isEqual";
 import { useEffect, useRef } from "react";
 
-import { FormOptions, FormSchema, Submission } from "../../interfaces";
+import { FormOptions, Submission } from "../../interfaces";
 
 export interface ChangedSubmission<T = any> extends Submission<T> {
   changed: {
-    component: ExtendedComponentSchema;
+    component: BaseComponent;
     instance: any;
     value: any;
   } & Record<string, any>;
@@ -28,7 +29,7 @@ export interface UseFormHookProps<Data = any> extends Record<string, any> {
   /**
    * Raw form object
    */
-  form?: Partial<FormSchema>;
+  form?: Partial<FormType>;
   /**
    * Configuration option
    */
@@ -43,8 +44,8 @@ export interface UseFormHookProps<Data = any> extends Record<string, any> {
   onNextPage?: (obj: FormPageChangeProps<Data>) => void;
   onCancel?: Function;
   onChange?: (submission: ChangedSubmission) => void;
-  onCustomEvent?: (obj: { type: string; event: string; component: ExtendedComponentSchema; data: any }) => void;
-  onComponentChange?: (component: ExtendedComponentSchema) => void;
+  onCustomEvent?: (obj: { type: string; event: string; component: BaseComponent; data: any }) => void;
+  onComponentChange?: (component: BaseComponent) => void;
   onSubmit?: (submission: Submission<Data>) => void;
   onAsyncSubmit?: (submission: Submission<Data>) => Promise<any>;
   onSubmitDone?: (submission: Submission<Data>) => void;

packages/react-formio/src/components/forms-table/components/formCell.component.tsx

@@ -1,12 +1,12 @@
+import type { Form as FormType } from "@formio/core";
 import classnames from "classnames";
 import moment from "moment";
 import { CellProps } from "react-table";
 
-import { FormSchema } from "../../../interfaces";
 import { iconClass } from "../../../utils/iconClass";
 import { stopPropagationWrapper } from "../../../utils/stopPropagationWrapper";
 
-export function FormsCell(props: CellProps<FormSchema> & { icon: string; i18n: (f: string) => string }) {
+export function FormsCell(props: CellProps<FormType> & { icon: string; i18n: (f: string) => string }) {
   const {
     icon = "server",
     row: { original: form }

packages/react-formio/src/components/forms-table/formsTable.component.tsx

@@ -1,11 +1,12 @@
-import { FormSchema } from "../../interfaces";
+import type { Form as FormType } from "@formio/core";
+
 import { DefaultColumnFilter } from "../table/filters/defaultColumnFilter.component";
 import { SelectColumnFilter } from "../table/filters/selectColumnFilter.component";
 import { TableProps } from "../table/hooks/useCustomTable.hook";
 import { Table } from "../table/table.component";
 import { FormsCell as DefaultFormCell } from "./components/formCell.component";
 
-export type FormsTableProps = Omit<TableProps<FormSchema>, "columns"> & {
+export type FormsTableProps = Omit<TableProps<FormType>, "columns"> & {
   icon?: string;
   tags?: { label: string; value: string }[];
 };

packages/react-formio/src/components/submissions-table/submissionsTable.component.tsx

@@ -1,10 +1,12 @@
-import { FormSchema, Submission } from "../../interfaces";
+import type { Form as FormType } from "@formio/core";
+
+import { Submission } from "../../interfaces";
 import { TableProps } from "../table/hooks/useCustomTable.hook";
 import { Table } from "../table/table.component";
 import { mapFormToColumns } from "../table/utils/mapFormToColumns";
 
 export type SubmissionsTableProps = Omit<TableProps<Submission>, "columns"> & {
-  form?: FormSchema;
+  form?: FormType;
 };
 
 export function SubmissionsTable({ form, ...props }: SubmissionsTableProps) {

packages/react-formio/src/components/table/components/defaultCellHeader.component.tsx

@@ -4,7 +4,15 @@ export interface DefaultCellHeaderProps<Data extends object = any> extends Recor
   column: HeaderGroup<Data>;
 }
 
-export function DefaultCellHeader<Data extends Record<string, unknown> = {}>({ column }: DefaultCellHeaderProps<Data>) {
+export function DefaultCellHeader<Data extends Record<string, unknown> = {}>({
+  column
+}: DefaultCellHeaderProps<Data> & {
+  column: {
+    getSortByToggleProps: any;
+    canFilter: boolean;
+    render: (key: string) => any;
+  };
+}) {
   return (
     <div className={"table-cell-header"}>
       <div className='table-cell-header__label' {...column.getSortByToggleProps()}>

packages/react-formio/src/components/table/filters/defaultColumnFilter.component.tsx

@@ -4,7 +4,11 @@ import { FilterProps } from "react-table";
 import { InputText } from "../../input-text/inputText.component";
 
 export function DefaultColumnFilter<D extends Record<string, unknown> = {}>(
-  props: FilterProps<D> & { filterId: string; setFilterId: any }
+  props: FilterProps<D> & {
+    filterId: string;
+    setFilterId: any;
+    column: { id: string; filterValue: any; setFilter: any };
+  }
 ) {
   const {
     filterId,
@@ -15,7 +19,7 @@ export function DefaultColumnFilter<D extends Record<string, unknown> = {}>(
   const [value, setValue] = useState(filterValue || "");
 
   const onChange = useCallback(
-    (name: string, value: any) => {
+    (_: string, value: any) => {
       setValue(value);
       setFilterId(id);
       setFilter(value || undefined);

packages/react-formio/src/components/table/filters/selectColumnFilter.component.tsx

@@ -4,9 +4,9 @@ import { Select } from "../../select/select.component";
 
 export function useSelectColumnFilter<D extends Record<string, unknown> = {}>(props: FilterProps<D>) {
   const { column } = props;
-  const { id, preFilteredRows } = column;
+  const { id, preFilteredRows } = column as any;
   const { choices: customChoices } = column as any;
-  const { filterValue, setFilter } = column;
+  const { filterValue, setFilter } = column as any;
 
   const choices = (() => {
     if (customChoices) {
@@ -16,7 +16,7 @@ export function useSelectColumnFilter<D extends Record<string, unknown> = {}>(pr
       return customChoices;
     }
 
-    return [...new Set(preFilteredRows.map((row) => row.values[id]))]
+    return [...new Set(preFilteredRows.map((row: any) => row.values[id]))]
       .filter((value) => value)
       .map((value) => ({
         label: value,

packages/react-formio/src/components/table/hooks/useCustomTable.hook.tsx

@@ -90,15 +90,15 @@ export interface TableProps<Data extends object = any> extends TableOptions<Data
   /**
    *
    */
-  CellOperations?: ComponentType;
+  CellOperations?: ComponentType<any>;
   /**
    * Custom Loader
    */
-  Loader?: ComponentType;
+  Loader?: ComponentType<any>;
   /**
    * Custom Loader
    */
-  Pagination?: ComponentType;
+  Pagination?: ComponentType<any>;
   /**
    * Disable filters
    */
@@ -230,7 +230,7 @@ export function useCustomTable<Data extends object = {}>(props: PropsWithChildre
   const {
     setPageSize,
     state: { pageIndex, pageSize, sortBy, filters }
-  } = tableInstance;
+  } = tableInstance as any;
 
   useEffect(() => {
     onChange({

packages/react-formio/src/components/table/table.component.tsx

@@ -1,6 +1,7 @@
 import classnames from "classnames";
 import { PropsWithChildren } from "react";
 
+import { PaginationProps } from "../pagination/pagination.component";
 import { DrapNDropContainer } from "./components/dragNDropContainer";
 import { TableProps, useCustomTable } from "./hooks/useCustomTable.hook";
 
@@ -60,7 +61,7 @@ export function Table<Data extends object = any>(props: PropsWithChildren<TableP
           </thead>
           {!isLoading ? (
             <tbody {...tableInstance.getTableBodyProps()}>
-              {tableInstance.page.map((row, index) => {
+              {(tableInstance as unknown as { page: any[] }).page.map((row: any, index: number) => {
                 tableInstance.prepareRow(row);
                 return (
                   <Row<Data>
@@ -82,7 +83,7 @@ export function Table<Data extends object = any>(props: PropsWithChildren<TableP
         {!isLoading && data.length && !disablePagination ? (
           <div className={"overflow-hidden"}>
             <Pagination
-              {...tableInstance}
+              {...(tableInstance as unknown as PaginationProps)}
               totalLength={totalLength}
               className={"text-sm"}
               pageIndex={pageIndex}

packages/react-formio/src/components/table/utils/mapFormToColumns.tsx

@@ -1,17 +1,17 @@
-import { Components, ExtendedComponentSchema } from "formiojs";
-import FormioUtils from "formiojs/utils";
+import type { BaseComponent, Form as FormType } from "@formio/core";
+import { Components } from "@formio/js";
+import FormioUtils from "@formio/js/utils";
 
-import { FormSchema } from "../../../interfaces";
 import { DefaultCell } from "../components/defaultCell.component";
 import { SelectColumnFilter } from "../filters/selectColumnFilter.component";
 import { ExtendedColumn } from "../hooks/useCustomTable.hook";
 
-export function mapFormToColumns(form: FormSchema): ExtendedColumn[] {
+export function mapFormToColumns(form: FormType): ExtendedColumn[] {
   const columns: ExtendedColumn[] = [];
 
-  FormioUtils.eachComponent(form.components, (component: ExtendedComponentSchema) => {
+  FormioUtils.eachComponent(form.components, (component: BaseComponent & { title: string; dataSrc: string; data: any }) => {
     if (component.tableView && component.key) {
-      const cmp: any = Components.create(component, {}, null, true);
+      const cmp: any = Components.create(component, {}, null);
 
       const column: ExtendedColumn = {
         Header: component.label || component.title || component.key,

packages/react-formio/src/index.ts

@@ -1,14 +1,9 @@
-import Webform from "formiojs/Webform";
-import WebformBuilder from "formiojs/WebformBuilder";
-import Wizard from "formiojs/Wizard";
-import WizardBuilder from "formiojs/WizardBuilder";
-export {
-  Webform,
-  WebformBuilder,
-  Wizard,
-  WizardBuilder
-  // editFormUtils,
-};
+import { Formio } from "@formio/js";
+
+export const Webform = Formio.Webform;
+export const WebformBuilder = Formio.WebformBuilder;
+export const Wizard = Formio.Wizard;
+export const WizardBuilder = Formio.WizardBuilder;
 
 export * from "./components";
 export * from "./hooks/useTooltip";
@@ -17,4 +12,4 @@ export * from "./utils/callLast";
 export * from "./utils/iconClass";
 export * from "./utils/mapPagination";
 export * from "./utils/stopPropagationWrapper";
-export { Components, Formio, Templates, Utils } from "formiojs";
+export { Components, Formio, Templates, Utils } from "@formio/js";

packages/react-formio/src/interfaces/ActionSchema.ts

@@ -1,4 +1,4 @@
-import { FormSchema } from "./FormSchema";
+import type { Form as FormType } from "@formio/core";
 
 export interface ActionDefaultsSchema {
   handler: string[];
@@ -18,7 +18,7 @@ export interface ActionInfoSchema extends Record<string, unknown> {
 
 export interface ActionSchema extends ActionInfoSchema {
   _id?: string;
-  settingsForm: Partial<FormSchema>;
+  settingsForm: Partial<FormType>;
   access?: {
     handler: boolean;
     method: boolean;

packages/react-formio/src/interfaces/FormSchema.ts

@@ -1,13 +1,6 @@
-import { ExtendedComponentSchema } from "formiojs";
+import type { Form } from "@formio/core";
 
-export type FormSchema = {
-  _id?: string;
-  title?: string;
-  name?: string;
-  machineName?: string;
-  components: ExtendedComponentSchema[];
-  tags?: string[];
-  action?: string;
-  properties?: Record<string, any>;
-  [key: string]: any;
-};
+/**
+ * @deprecated use Form from @formio/core
+ */
+export type FormSchema = Form;

packages/react-formio/src/utils/iconClass.ts

@@ -1,4 +1,4 @@
-import * as formio from "formiojs";
+import * as formio from "@formio/js";
 
 const { Templates } = formio;
 

packages/react-formio/tsconfig.app.json

@@ -6,6 +6,6 @@
     "declaration": false,
     "composite": false
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx", "vite.config.mts"],
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
 }

packages/react-formio/tsconfig.json

@@ -11,6 +11,9 @@
     {
       "path": "./tsconfig.app.json"
     },
+    {
+      "path": "./tsconfig.node.json"
+    },
     {
       "path": "./tsconfig.spec.json"
     }

packages/react-formio/tsconfig.node.json

@@ -0,0 +1,13 @@
+{
+  "extends": "@tsed/typescript/tsconfig.web.json",
+  "compilerOptions": {
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "baseUrl": ".",
+    "noEmit": true,
+    "declaration": false,
+    "composite": false
+  },
+  "include": ["vite.config.mts"],
+  "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
+}

packages/redux-utils/package.json

@@ -27,6 +27,5 @@
   "peerDependencies": {
     "react": "^18.3.1",
     "redux": "^4.0.5"
-  },
-  "dependencies": {}
+  }
 }

packages/redux-utils/tsconfig.app.json

@@ -6,6 +6,6 @@
     "declaration": false,
     "composite": false
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx", "vite.config.mts"],
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
 }

packages/redux-utils/tsconfig.json

@@ -8,6 +8,9 @@
     {
       "path": "./tsconfig.app.json"
     },
+    {
+      "path": "./tsconfig.node.json"
+    },
     {
       "path": "./tsconfig.spec.json"
     }

packages/redux-utils/tsconfig.node.json

@@ -0,0 +1,13 @@
+{
+  "extends": "@tsed/typescript/tsconfig.web.json",
+  "compilerOptions": {
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "baseUrl": ".",
+    "noEmit": true,
+    "declaration": false,
+    "composite": false
+  },
+  "include": ["vite.config.mts"],
+  "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
+}

packages/tailwind-formio/package.json

@@ -31,6 +31,7 @@
     "clean:tailwind:viewer": "rimraf build/index.html build/favicon.ico"
   },
   "devDependencies": {
+    "@types/lodash": "4.17.13",
     "cross-env": "7.0.3",
     "rimraf": "3.0.2",
     "tailwind-config-viewer": "2.0.4",
@@ -49,7 +50,5 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
-  },
-  "dependencies": {},
-  "peerDependencies": {}
+  }
 }

packages/tailwind-formio/readme.md

@@ -138,15 +138,15 @@ Then create a `tailwind.css` in `styles` directory and add the following lines:
 Import the `tailwind.css` in the `index.css` created by create-react-app:
 
 ```css
-@import "~formiojs/dist/formio.full.css";
+@import "~@formio/js/dist/formio.full.css";
 @import "./tailwind.css";
 @import "~@tsed/tailwind-formio/styles/index.css";
 ```
 
 Optionally, you can import fonts and icons:
 
 ```diff
-@import "~formiojs/dist/formio.full.css";
+@import "~@formio/js/dist/formio.full.css";
 @import "./tailwind.css";
 +@import "./fonts/source-sans-pro/index.css";
 +@import "./fonts/inconsolata/index.css";

packages/tailwind-formio/src/templates/stories/builder.stories.jsx

@@ -1,4 +1,4 @@
-import FormioFormBuilder from "formiojs/FormBuilder.js";
+import { FormBuilder } from "@formio/js";
 import React, { useEffect, useRef } from "react";
 
 function WrapperFormBuilder({ options, form }) {
@@ -8,7 +8,7 @@ function WrapperFormBuilder({ options, form }) {
     options = Object.assign({}, options);
     form = Object.assign({}, form);
 
-    const builder = new FormioFormBuilder(ref.current, form, options);
+    const builder = new FormBuilder(ref.current, form, options);
     builder.ready.then(() => {
       // onChange();
       // builderEvents.forEach(({name, action}) => builder.instance.on(name, action));

packages/tailwind-formio/tsconfig.app.json

@@ -6,6 +6,6 @@
     "declaration": false,
     "composite": false
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx", "vite.config.mts", "tailwind.config.ts"],
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
 }

packages/tailwind-formio/tsconfig.json

@@ -8,6 +8,9 @@
   "references": [
     {
       "path": "./tsconfig.app.json"
+    },
+    {
+      "path": "./tsconfig.node.json"
     }
   ]
 }

packages/tailwind-formio/tsconfig.node.json

@@ -0,0 +1,13 @@
+{
+  "extends": "@tsed/typescript/tsconfig.web.json",
+  "compilerOptions": {
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "baseUrl": ".",
+    "noEmit": true,
+    "declaration": false,
+    "composite": false
+  },
+  "include": ["vite.config.mts", "tailwind.config.ts"],
+  "exclude": ["node_modules", "dist", "src/**/*.spec.ts", "src/**/*.spec.tsx"]
+}

packages/tailwind-formio/vite.config.mts

@@ -1,4 +1,5 @@
 import {fileURLToPath} from "node:url";
+// @ts-ignore
 import compile from "lodash/template";
 import {globbySync} from "globby";
 import {extname, relative} from "path";

tools/typescript/package.json

@@ -7,8 +7,5 @@
   "main": "index.js",
   "exports": {
     "./tsconfig.web.json": "./tsconfig.web.json"
-  },
-  "dependencies": {},
-  "devDependencies": {},
-  "peerDependencies": {}
+  }
 }

tools/typescript/tsconfig.web.json

@@ -1,7 +1,6 @@
 {
   "compilerOptions": {
     "target": "ESNext",
-    "module": "NodeNext",
     "moduleResolution": "Bundler",
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
     "useDefineForClassFields": false,

tools/vitest/package.json

@@ -14,7 +14,5 @@
   },
   "scripts": {
     "generate": "node index.js"
-  },
-  "dependencies": {},
-  "peerDependencies": {}
+  }
 }