@tsed/react-formio 3.0.0-alpha.1 → 3.0.0-alpha.10

package/src/organisms/table/forms/FormsTable.tsx

@@ -0,0 +1,66 @@
+import "./components/FormsCell.js";
+
+import { ColumnDef } from "@tanstack/react-table";
+
+import type { FormType } from "../../../interfaces";
+import { Table, TableProps } from "../../../molecules/table/Table";
+import { getComponent } from "../../../registries/components.js";
+import { FormsCell } from "./components/FormsCell.js";
+
+export type FormsTableProps = Omit<TableProps<FormType>, "columns"> & {
+  tags?: { label: string; value: string }[];
+};
+
+export function FormsTable({ ...props }: FormsTableProps) {
+  const { i18n = (f: string) => f, tags } = props;
+  const Cell = getComponent<typeof FormsCell>("FormsCell");
+
+  const columns: ColumnDef<any>[] = [
+    {
+      header: i18n("Title"),
+      accessorKey: "title",
+      cell: (context) => <Cell {...context} i18n={i18n} />,
+      meta: {
+        cellProps: {
+          colSpan: 2
+        }
+      }
+    },
+    {
+      header: i18n("Tags"),
+      accessorKey: "tags",
+      meta: {
+        cellProps: {
+          hidden: true
+        },
+        filter: {
+          variant: "select",
+          layout: "react",
+          options: tags
+        }
+      }
+    }
+    // {
+    //   Header: i18n("Title"),
+    //   accessor: "title",
+    //   id: "title",
+    //   Cell: (props: any) => <FormCell {...props} icon={props.icon} i18n={i18n} />,
+    //   Filter: DefaultColumnFilter,
+    //   colspan: 2
+    // },
+    // {
+    //   Header: i18n("Tags"),
+    //   accessor: "tags",
+    //   id: "tags",
+    //   hidden: true,
+    //   Filter: (props: any) =>
+    //     tags && tags.length ? (
+    //       <SelectColumnFilter {...props} column={{ ...props.columns, choices: tags }} />
+    //     ) : (
+    //       <DefaultColumnFilter {...props} />
+    //     )
+    // }
+  ];
+
+  return <Table {...(props as any)} columns={columns} />;
+}

package/src/organisms/table/forms/components/FormsCell.tsx

@@ -0,0 +1,53 @@
+import { CellContext } from "@tanstack/react-table";
+import cx from "classnames";
+import moment from "moment";
+
+import type { FormType } from "../../../../interfaces/index.js";
+import { registerComponent } from "../../../../registries/components.js";
+import { iconClass } from "../../../../utils/iconClass";
+import { stopPropagationWrapper } from "../../../../utils/stopPropagationWrapper";
+
+export function FormsCell(
+  props: CellContext<FormType, any> & {
+    i18n: (i18n: string) => string;
+  }
+) {
+  const {
+    row: { original: form }
+  } = props;
+
+  return (
+    <div className={"p-1"}>
+      <h4 className={"text-primary text-lg flex space-x-2 items-center"}>
+        <i className={cx(iconClass(undefined, "server"), "text-secondary")} />
+        <span>{form.title}</span>
+      </h4>
+
+      <ul className='reset-list text-gray-500'>
+        <li className={"text-sm"}>Name: {form.name || form.machineName}</li>
+        <li className='mt-5 flex space-x-1'>
+          <span className='badge bg-light flex space-x-1'>
+            <i className={iconClass(undefined, "history")} />
+            <span>Updated {moment(form.modified).fromNow()}</span>
+          </span>
+
+          {(form.tags || []).map((tag, index) => (
+            <button
+              key={index}
+              className='badge badge-hover bg-secondary flex space-x-1'
+              onClick={stopPropagationWrapper(() => {
+                // props.setFilter("tags", tag);
+                // props.gotoPage(0);
+              })}
+            >
+              <i className={iconClass(undefined, "tags")} />
+              <span>{tag}</span>
+            </button>
+          ))}
+        </li>
+      </ul>
+    </div>
+  );
+}
+
+registerComponent("FormsCell", FormsCell);

package/src/{components/submissions-table/submissionsTable.stories.tsx → organisms/table/submissions/SubmissionsTable.stories.tsx}

@@ -1,48 +1,45 @@
+import "../../../molecules/button/Button";
+import "../../../molecules/forms/input-text/InputText";
+import "../../../molecules/forms/select/all";
+import "../../../molecules/pagination/all";
+import "../../../molecules/table/all";
+
 import { useState } from "react";
 
-import { mapPagination } from "../../utils/mapPagination";
-import formSchema from "../__fixtures__/form-schema.json";
-import formSubmissions from "../__fixtures__/form-submissions.json";
-import { SubmissionsTable } from "./submissionsTable.component";
+import { mapPagination } from "../../../utils/mapPagination";
+import FormType from "../../__fixtures__/form-schema.json";
+import formSubmissions from "../../__fixtures__/form-submissions.json";
+import { SubmissionsTable } from "./SubmissionsTable";
 
+/**
+ * ```tsx
+ * import {SubmissionsTable} from "@tsed/react-formio/organisms/table/submissions/SubmissionsTable";
+ * ```
+ */
 export default {
-  title: "ReactFormio/SubmissionsTable",
+  title: "table/submissions/SubmissionsTable",
   component: SubmissionsTable,
   argTypes: {
     form: {
-      control: {
-        type: "object"
-      }
+      control: "object"
     },
     data: {
-      control: {
-        type: "object"
-      }
+      control: "object"
     },
     operations: {
-      control: {
-        type: "object"
-      }
+      control: "object"
     },
     isLoading: {
-      control: {
-        type: "boolean"
-      }
+      control: "boolean"
     },
     isEmpty: {
-      control: {
-        type: "boolean"
-      }
+      control: "boolean"
     },
     disableFilters: {
-      control: {
-        type: "boolean"
-      }
+      control: "boolean"
     },
     disablePagination: {
-      control: {
-        type: "boolean"
-      }
+      control: "boolean"
     }
   },
   parameters: {}
@@ -73,7 +70,7 @@ export const Sandbox = (args: any) => {
 };
 
 Sandbox.args = {
-  form: formSchema,
+  form: FormType,
   data: formSubmissions,
   operations: [
     {

package/src/organisms/table/submissions/SubmissionsTable.tsx

@@ -0,0 +1,13 @@
+import type { FormType, SubmissionType } from "../../../interfaces";
+import { Table, type TableProps } from "../../../molecules/table/Table";
+import { mapFormToColumns } from "../../../molecules/table/utils/mapFormToColumns.js";
+
+export type SubmissionsTableProps = Omit<TableProps<SubmissionType>, "columns"> & {
+  form?: FormType;
+};
+
+export function SubmissionsTable({ form, ...props }: SubmissionsTableProps) {
+  const columns: any[] | undefined = form && mapFormToColumns(form);
+
+  return <Table {...props} columns={columns!} />;
+}

package/src/registries/components.ts

@@ -0,0 +1,23 @@
+export const components = new Map<string, unknown>();
+
+export function registerComponent(type: string, component: unknown) {
+  components.set(type, component);
+}
+
+export function getComponent<Cmp>(type: string | string[]): Cmp {
+  if (Array.isArray(type)) {
+    for (const t of type) {
+      if (components.has(t)) {
+        return components.get(t) as unknown as Cmp;
+      }
+    }
+  }
+
+  const result = components.get(type as string) as unknown as Cmp;
+
+  if (!result) {
+    console.warn(`Missing component for ${type}`);
+  }
+
+  return result;
+}

package/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"]
 }

package/tsconfig.json

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

package/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"]
+}

package/dist/components/actions-table/actionsTable.component.d.ts

@@ -1,10 +0,0 @@
-import { ActionSchema } from '../../interfaces';
-import { TableProps } from '../table/hooks/useCustomTable.hook';
-export type ActionsTableProps = Omit<TableProps<ActionSchema>, "columns"> & {
-    onAddAction?: (actionName: string) => void;
-    availableActions?: {
-        label: string;
-        value: string;
-    }[];
-};
-export declare function ActionsTable({ disableFilters, disablePagination, availableActions, onAddAction, ...props }: ActionsTableProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/actions-table/actionsTable.component.js

@@ -1,53 +0,0 @@
-import { jsx as e, jsxs as i } from "react/jsx-runtime";
-import { c as p } from "../../chunks/index.js";
-import b from "lodash/noop";
-import { useState as f } from "react";
-import { iconClass as h } from "../../utils/iconClass.js";
-import { Select as v } from "../select/select.component.js";
-import { Table as A } from "../table/table.component.js";
-function k({
-  disableFilters: n = !0,
-  disablePagination: s = !0,
-  availableActions: l = [],
-  onAddAction: r = b,
-  ...o
-}) {
-  const { i18n: a = (c) => c } = o, [t, m] = f(""), d = [
-    {
-      Header: a("Actions"),
-      accessor: "title",
-      id: "title"
-    }
-  ];
-  return /* @__PURE__ */ e(A, { ...o, disableFilters: n, disablePagination: s, columns: d, children: /* @__PURE__ */ i("div", { className: "pagination-group", children: [
-    /* @__PURE__ */ e(
-      v,
-      {
-        "data-testid": "action-table-select",
-        name: "actions",
-        value: t,
-        choices: [{ label: a("Select an action"), value: "" }].concat(l),
-        onChange: (c, u) => m(u)
-      }
-    ),
-    /* @__PURE__ */ e("div", { className: "pl-3", children: /* @__PURE__ */ i(
-      "button",
-      {
-        "data-testid": "action-table-add",
-        disabled: t === "",
-        className: "btn btn-success",
-        onClick: () => t && r(t),
-        type: "submit",
-        children: [
-          /* @__PURE__ */ e("i", { className: p(h(void 0, "plus"), "mr-1") }),
-          " ",
-          a("Add action")
-        ]
-      }
-    ) })
-  ] }) });
-}
-export {
-  k as ActionsTable
-};
-//# sourceMappingURL=actionsTable.component.js.map

package/dist/components/actions-table/actionsTable.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"actionsTable.component.js","sources":["../../../src/components/actions-table/actionsTable.component.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport noop from \"lodash/noop\";\nimport { useState } from \"react\";\n\nimport { ActionSchema } from \"../../interfaces\";\nimport { iconClass } from \"../../utils/iconClass\";\nimport { Select } from \"../select/select.component\";\nimport { TableProps } from \"../table/hooks/useCustomTable.hook\";\nimport { Table } from \"../table/table.component\";\n\nexport type ActionsTableProps = Omit<TableProps<ActionSchema>, \"columns\"> & {\n  onAddAction?: (actionName: string) => void;\n  availableActions?: { label: string; value: string }[];\n};\n\nexport function ActionsTable({\n  disableFilters = true,\n  disablePagination = true,\n  availableActions = [],\n  onAddAction = noop,\n  ...props\n}: ActionsTableProps) {\n  const { i18n = (f: string) => f } = props;\n  const [currentAction, setAction] = useState(\"\");\n\n  const columns = [\n    {\n      Header: i18n(\"Actions\"),\n      accessor: \"title\",\n      id: \"title\"\n    }\n  ];\n\n  return (\n    <Table {...props} disableFilters={disableFilters} disablePagination={disablePagination} columns={columns}>\n      <div className={\"pagination-group\"}>\n        <Select\n          data-testid={\"action-table-select\"}\n          name={\"actions\"}\n          value={currentAction}\n          choices={[{ label: i18n(\"Select an action\"), value: \"\" }].concat(availableActions)}\n          onChange={(name: string, action: string) => setAction(action)}\n        />\n        <div className={\"pl-3\"}>\n          <button\n            data-testid={\"action-table-add\"}\n            disabled={currentAction === \"\"}\n            className={\"btn btn-success\"}\n            onClick={() => currentAction && onAddAction(currentAction)}\n            type={\"submit\"}\n          >\n            <i className={classnames(iconClass(undefined, \"plus\"), \"mr-1\")} /> {i18n(\"Add action\")}\n          </button>\n        </div>\n      </div>\n    </Table>\n  );\n}\n"],"names":["ActionsTable","disableFilters","disablePagination","availableActions","onAddAction","noop","props","i18n","f","currentAction","setAction","useState","columns","jsx","Table","jsxs","Select","name","action","classnames","iconClass"],"mappings":";;;;;;;AAeO,SAASA,EAAa;AAAA,EAC3B,gBAAAC,IAAiB;AAAA,EACjB,mBAAAC,IAAoB;AAAA,EACpB,kBAAAC,IAAmB,CAAC;AAAA,EACpB,aAAAC,IAAcC;AAAA,EACd,GAAGC;AACL,GAAsB;AACpB,QAAM,EAAE,MAAAC,IAAO,CAACC,MAAcA,EAAM,IAAAF,GAC9B,CAACG,GAAeC,CAAS,IAAIC,EAAS,EAAE,GAExCC,IAAU;AAAA,IACd;AAAA,MACE,QAAQL,EAAK,SAAS;AAAA,MACtB,UAAU;AAAA,MACV,IAAI;AAAA,IAAA;AAAA,EAER;AAGE,SAAA,gBAAAM,EAACC,GAAO,EAAA,GAAGR,GAAO,gBAAAL,GAAgC,mBAAAC,GAAsC,SAAAU,GACtF,UAAA,gBAAAG,EAAC,OAAI,EAAA,WAAW,oBACd,UAAA;AAAA,IAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,eAAa;AAAA,QACb,MAAM;AAAA,QACN,OAAOP;AAAA,QACP,SAAS,CAAC,EAAE,OAAOF,EAAK,kBAAkB,GAAG,OAAO,GAAI,CAAA,EAAE,OAAOJ,CAAgB;AAAA,QACjF,UAAU,CAACc,GAAcC,MAAmBR,EAAUQ,CAAM;AAAA,MAAA;AAAA,IAC9D;AAAA,IACA,gBAAAL,EAAC,OAAI,EAAA,WAAW,QACd,UAAA,gBAAAE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,eAAa;AAAA,QACb,UAAUN,MAAkB;AAAA,QAC5B,WAAW;AAAA,QACX,SAAS,MAAMA,KAAiBL,EAAYK,CAAa;AAAA,QACzD,MAAM;AAAA,QAEN,UAAA;AAAA,UAAC,gBAAAI,EAAA,KAAA,EAAE,WAAWM,EAAWC,EAAU,QAAW,MAAM,GAAG,MAAM,GAAG;AAAA,UAAE;AAAA,UAAEb,EAAK,YAAY;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,EAEzF,CAAA;AAAA,EAAA,EAAA,CACF,EACF,CAAA;AAEJ;"}

package/dist/components/alert/alert.component.d.ts

@@ -1,5 +0,0 @@
-export interface AlertProps {
-    error?: any | any[];
-    type?: string;
-}
-export declare function Alert({ error, type }: AlertProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/alert/alert.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"alert.component.js","sources":["../../../src/components/alert/alert.component.tsx"],"sourcesContent":["function formatError(error: any): any {\n  if (typeof error === \"string\") {\n    return error;\n  }\n\n  if (Array.isArray(error)) {\n    return error.map(formatError);\n  }\n\n  if (Object.prototype.hasOwnProperty.call(error, \"errors\")) {\n    return Object.keys(error.errors).map((key, index) => {\n      const item = error.errors[key];\n      return (\n        <div key={index}>\n          <strong>\n            {item.name} ({item.path})\n          </strong>{\" \"}\n          - {item.message}\n        </div>\n      );\n    });\n  }\n\n  // If this is a standard error.\n  if (Object.prototype.hasOwnProperty.call(error, \"message\")) {\n    return error.message;\n  }\n\n  // If this is a joy validation error.\n  if (Object.prototype.hasOwnProperty.call(error, \"name\") && error.name === \"ValidationError\") {\n    return error.details.map((item: any, index: number) => {\n      return <div key={index}>{item.message}</div>;\n    });\n  }\n\n  // If a conflict error occurs on a form, the form is returned.\n  if (Object.prototype.hasOwnProperty.call(error, \"_id\") && Object.prototype.hasOwnProperty.call(error, \"display\")) {\n    return \"Another user has saved this form already. Please reload and re-apply your changes.\";\n  }\n\n  return \"An error occurred. See console logs for details.\";\n}\n\nexport interface AlertProps {\n  error?: any | any[];\n  type?: string;\n}\n\nexport function Alert({ error, type = \"danger\" }: AlertProps) {\n  if (!error || (Array.isArray(error) && !error.length)) {\n    return null;\n  }\n\n  return (\n    <div className={`alert alert-${type}`} role='alert'>\n      {formatError(error)}\n    </div>\n  );\n}\n"],"names":["formatError","error","key","index","item","jsxs","jsx","Alert","type"],"mappings":";AAAA,SAASA,EAAYC,GAAiB;AAChC,SAAA,OAAOA,KAAU,WACZA,IAGL,MAAM,QAAQA,CAAK,IACdA,EAAM,IAAID,CAAW,IAG1B,OAAO,UAAU,eAAe,KAAKC,GAAO,QAAQ,IAC/C,OAAO,KAAKA,EAAM,MAAM,EAAE,IAAI,CAACC,GAAKC,MAAU;AAC7C,UAAAC,IAAOH,EAAM,OAAOC,CAAG;AAC7B,6BACG,OACC,EAAA,UAAA;AAAA,MAAA,gBAAAG,EAAC,UACE,EAAA,UAAA;AAAA,QAAKD,EAAA;AAAA,QAAK;AAAA,QAAGA,EAAK;AAAA,QAAK;AAAA,MAAA,GAC1B;AAAA,MAAU;AAAA,MAAI;AAAA,MACXA,EAAK;AAAA,IAAA,EAAA,GAJAD,CAKV;AAAA,EAAA,CAEH,IAIC,OAAO,UAAU,eAAe,KAAKF,GAAO,SAAS,IAChDA,EAAM,UAIX,OAAO,UAAU,eAAe,KAAKA,GAAO,MAAM,KAAKA,EAAM,SAAS,oBACjEA,EAAM,QAAQ,IAAI,CAACG,GAAWD,MAC3B,gBAAAG,EAAA,OAAA,EAAiB,UAAKF,EAAA,QAAA,GAAbD,CAAqB,CACvC,IAIC,OAAO,UAAU,eAAe,KAAKF,GAAO,KAAK,KAAK,OAAO,UAAU,eAAe,KAAKA,GAAO,SAAS,IACtG,uFAGF;AACT;AAOO,SAASM,EAAM,EAAE,OAAAN,GAAO,MAAAO,IAAO,YAAwB;AACxD,SAAA,CAACP,KAAU,MAAM,QAAQA,CAAK,KAAK,CAACA,EAAM,SACrC,OAIP,gBAAAK,EAAC,OAAI,EAAA,WAAW,eAAeE,CAAI,IAAI,MAAK,SACzC,UAAYR,EAAAC,CAAK,EACpB,CAAA;AAEJ;"}

package/dist/components/card/card.component.js

@@ -1,12 +0,0 @@
-import { jsxs as s, jsx as a } from "react/jsx-runtime";
-import { c as d } from "../../chunks/index.js";
-function m({ children: r, label: c, className: e }) {
-  return /* @__PURE__ */ s("div", { className: d("card", e), children: [
-    /* @__PURE__ */ a("div", { className: "card-header ", children: /* @__PURE__ */ a("h4", { className: "card-title", children: c }) }),
-    /* @__PURE__ */ a("div", { className: "card-body", role: "article", children: r })
-  ] });
-}
-export {
-  m as Card
-};
-//# sourceMappingURL=card.component.js.map

package/dist/components/card/card.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"card.component.js","sources":["../../../src/components/card/card.component.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { PropsWithChildren } from \"react\";\n\nexport interface CardProps {\n  label: string;\n  className?: string;\n}\n\nexport function Card({ children, label, className }: PropsWithChildren<CardProps>) {\n  return (\n    <div className={classnames(\"card\", className)}>\n      <div className={\"card-header \"}>\n        <h4 className={\"card-title\"}>{label}</h4>\n      </div>\n      <div className={\"card-body\"} role={\"article\"}>\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"names":["Card","children","label","className","classnames","jsx"],"mappings":";;AAQO,SAASA,EAAK,EAAE,UAAAC,GAAU,OAAAC,GAAO,WAAAC,KAA2C;AACjF,2BACG,OAAI,EAAA,WAAWC,EAAW,QAAQD,CAAS,GAC1C,UAAA;AAAA,IAAC,gBAAAE,EAAA,OAAA,EAAI,WAAW,gBACd,UAAA,gBAAAA,EAAC,QAAG,WAAW,cAAe,aAAM,EACtC,CAAA;AAAA,sBACC,OAAI,EAAA,WAAW,aAAa,MAAM,WAChC,UAAAJ,EACH,CAAA;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/form/form.component.d.ts

@@ -1,62 +0,0 @@
-import { default as PropTypes } from 'prop-types';
-import { UseFormHookProps } from './useForm.hook';
-export interface FormProps<Data = any> extends UseFormHookProps<Data> {
-    name?: string;
-    /**
-     *
-     */
-    className?: string;
-}
-export declare function Form<Data = any>(props: Partial<FormProps<Data>>): import("react/jsx-runtime").JSX.Element;
-export declare namespace Form {
-    var propTypes: {
-        name: PropTypes.Requireable<string>;
-        className: PropTypes.Requireable<string>;
-        /**
-         *
-         */
-        src: PropTypes.Requireable<string>;
-        /**
-         * url to fetch form
-         */
-        url: PropTypes.Requireable<string>;
-        /**
-         * Raw form object
-         */
-        form: PropTypes.Requireable<object>;
-        /**
-         * Data submission
-         */
-        submission: PropTypes.Requireable<object>;
-        /**
-         * Configuration option
-         */
-        options: PropTypes.Requireable<PropTypes.InferProps<{
-            readOnly: PropTypes.Requireable<boolean>;
-            noAlerts: PropTypes.Requireable<boolean>;
-            i18n: PropTypes.Requireable<any>;
-            template: PropTypes.Requireable<string>;
-            saveDraft: PropTypes.Requireable<boolean>;
-            hooks: PropTypes.Requireable<any>;
-        }>>;
-        onPrevPage: PropTypes.Requireable<(...args: any[]) => any>;
-        onNextPage: PropTypes.Requireable<(...args: any[]) => any>;
-        onCancel: PropTypes.Requireable<(...args: any[]) => any>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        onCustomEvent: PropTypes.Requireable<(...args: any[]) => any>;
-        onComponentChange: PropTypes.Requireable<(...args: any[]) => any>;
-        onSubmit: PropTypes.Requireable<(...args: any[]) => any>;
-        onAsyncSubmit: PropTypes.Requireable<(...args: any[]) => any>;
-        onSubmitDone: PropTypes.Requireable<(...args: any[]) => any>;
-        onFormLoad: PropTypes.Requireable<(...args: any[]) => any>;
-        onError: PropTypes.Requireable<(...args: any[]) => any>;
-        onRender: PropTypes.Requireable<(...args: any[]) => any>;
-        onAttach: PropTypes.Requireable<(...args: any[]) => any>;
-        onBuild: PropTypes.Requireable<(...args: any[]) => any>;
-        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
-        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
-        onInitialized: PropTypes.Requireable<(...args: any[]) => any>;
-        onFormReady: PropTypes.Requireable<(...args: any[]) => any>;
-        formioform: PropTypes.Requireable<any>;
-    };
-}

package/dist/components/form/form.component.js

@@ -1,64 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { Components as r } from "formiojs";
-import m from "formiojs/components";
-import n from "prop-types";
-import { useForm as s } from "./useForm.hook.js";
-r.setComponents(m);
-function c(o) {
-  const { element: e } = s(o);
-  return /* @__PURE__ */ t("div", { "data-testid": `formioContainer${o.name || ""}`, ref: e, className: o.className });
-}
-c.propTypes = {
-  name: n.string,
-  className: n.string,
-  /**
-   *
-   */
-  src: n.string,
-  /**
-   * url to fetch form
-   */
-  url: n.string,
-  /**
-   * Raw form object
-   */
-  form: n.object,
-  /**
-   * Data submission
-   */
-  submission: n.object,
-  /**
-   * Configuration option
-   */
-  options: n.shape({
-    readOnly: n.bool,
-    noAlerts: n.bool,
-    i18n: n.any,
-    template: n.string,
-    saveDraft: n.bool,
-    hooks: n.any
-  }),
-  onPrevPage: n.func,
-  onNextPage: n.func,
-  onCancel: n.func,
-  onChange: n.func,
-  onCustomEvent: n.func,
-  onComponentChange: n.func,
-  onSubmit: n.func,
-  onAsyncSubmit: n.func,
-  onSubmitDone: n.func,
-  onFormLoad: n.func,
-  onError: n.func,
-  onRender: n.func,
-  onAttach: n.func,
-  onBuild: n.func,
-  onFocus: n.func,
-  onBlur: n.func,
-  onInitialized: n.func,
-  onFormReady: n.func,
-  formioform: n.any
-};
-export {
-  c as Form
-};
-//# sourceMappingURL=form.component.js.map

package/dist/components/form/form.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"form.component.js","sources":["../../../src/components/form/form.component.tsx"],"sourcesContent":["import { Components } from \"formiojs\";\nimport AllComponents from \"formiojs/components\";\nimport PropTypes from \"prop-types\";\n\nimport { useForm, UseFormHookProps } from \"./useForm.hook\";\n\nComponents.setComponents(AllComponents);\n\nexport interface FormProps<Data = any> extends UseFormHookProps<Data> {\n  name?: string;\n  /**\n   *\n   */\n  className?: string;\n}\n\nexport function Form<Data = any>(props: Partial<FormProps<Data>>) {\n  const { element } = useForm(props);\n\n  return <div data-testid={`formioContainer${props.name || \"\"}`} ref={element} className={props.className} />;\n}\n\nForm.propTypes = {\n  name: PropTypes.string,\n  className: PropTypes.string,\n  /**\n   *\n   */\n  src: PropTypes.string,\n  /**\n   * url to fetch form\n   */\n  url: PropTypes.string,\n  /**\n   * Raw form object\n   */\n  form: PropTypes.object,\n  /**\n   * Data submission\n   */\n  submission: PropTypes.object,\n  /**\n   * Configuration option\n   */\n  options: PropTypes.shape({\n    readOnly: PropTypes.bool,\n    noAlerts: PropTypes.bool,\n    i18n: PropTypes.any,\n    template: PropTypes.string,\n    saveDraft: PropTypes.bool,\n    hooks: PropTypes.any\n  }),\n  onPrevPage: PropTypes.func,\n  onNextPage: PropTypes.func,\n  onCancel: PropTypes.func,\n  onChange: PropTypes.func,\n  onCustomEvent: PropTypes.func,\n  onComponentChange: PropTypes.func,\n  onSubmit: PropTypes.func,\n  onAsyncSubmit: PropTypes.func,\n  onSubmitDone: PropTypes.func,\n  onFormLoad: PropTypes.func,\n  onError: PropTypes.func,\n  onRender: PropTypes.func,\n  onAttach: PropTypes.func,\n  onBuild: PropTypes.func,\n  onFocus: PropTypes.func,\n  onBlur: PropTypes.func,\n  onInitialized: PropTypes.func,\n  onFormReady: PropTypes.func,\n  formioform: PropTypes.any\n};\n"],"names":["Components","AllComponents","Form","props","element","useForm","jsx","PropTypes"],"mappings":";;;;;AAMAA,EAAW,cAAcC,CAAa;AAU/B,SAASC,EAAiBC,GAAiC;AAChE,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAQF,CAAK;AAEjC,SAAQ,gBAAAG,EAAA,OAAA,EAAI,eAAa,kBAAkBH,EAAM,QAAQ,EAAE,IAAI,KAAKC,GAAS,WAAWD,EAAM,WAAW;AAC3G;AAEAD,EAAK,YAAY;AAAA,EACf,MAAMK,EAAU;AAAA,EAChB,WAAWA,EAAU;AAAA;AAAA;AAAA;AAAA,EAIrB,KAAKA,EAAU;AAAA;AAAA;AAAA;AAAA,EAIf,KAAKA,EAAU;AAAA;AAAA;AAAA;AAAA,EAIf,MAAMA,EAAU;AAAA;AAAA;AAAA;AAAA,EAIhB,YAAYA,EAAU;AAAA;AAAA;AAAA;AAAA,EAItB,SAASA,EAAU,MAAM;AAAA,IACvB,UAAUA,EAAU;AAAA,IACpB,UAAUA,EAAU;AAAA,IACpB,MAAMA,EAAU;AAAA,IAChB,UAAUA,EAAU;AAAA,IACpB,WAAWA,EAAU;AAAA,IACrB,OAAOA,EAAU;AAAA,EAAA,CAClB;AAAA,EACD,YAAYA,EAAU;AAAA,EACtB,YAAYA,EAAU;AAAA,EACtB,UAAUA,EAAU;AAAA,EACpB,UAAUA,EAAU;AAAA,EACpB,eAAeA,EAAU;AAAA,EACzB,mBAAmBA,EAAU;AAAA,EAC7B,UAAUA,EAAU;AAAA,EACpB,eAAeA,EAAU;AAAA,EACzB,cAAcA,EAAU;AAAA,EACxB,YAAYA,EAAU;AAAA,EACtB,SAASA,EAAU;AAAA,EACnB,UAAUA,EAAU;AAAA,EACpB,UAAUA,EAAU;AAAA,EACpB,SAASA,EAAU;AAAA,EACnB,SAASA,EAAU;AAAA,EACnB,QAAQA,EAAU;AAAA,EAClB,eAAeA,EAAU;AAAA,EACzB,aAAaA,EAAU;AAAA,EACvB,YAAYA,EAAU;AACxB;"}

package/dist/components/form/useForm.hook.d.ts

@@ -1,59 +0,0 @@
-import { ExtendedComponentSchema } from 'formiojs';
-import { FormOptions, FormSchema, Submission } from '../../interfaces';
-export interface ChangedSubmission<T = any> extends Submission<T> {
-    changed: {
-        component: ExtendedComponentSchema;
-        instance: any;
-        value: any;
-    } & Record<string, any>;
-    isValid: boolean;
-}
-export interface FormPageChangeProps<Data = any> {
-    page: number;
-    submission: Submission<Data>;
-}
-export interface UseFormHookProps<Data = any> extends Record<string, any> {
-    src?: string;
-    /**
-     * url to fetch form
-     */
-    url?: string;
-    /**
-     * Raw form object
-     */
-    form?: Partial<FormSchema>;
-    /**
-     * Configuration option
-     */
-    options?: FormOptions;
-    /**
-     * Data submission
-     */
-    submission?: Submission<Data>;
-    onPrevPage?: (obj: FormPageChangeProps<Data>) => void;
-    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;
-    onSubmit?: (submission: Submission<Data>) => void;
-    onAsyncSubmit?: (submission: Submission<Data>) => Promise<any>;
-    onSubmitDone?: (submission: Submission<Data>) => void;
-    onFormLoad?: Function;
-    onError?: (errors: any) => void;
-    onRender?: () => void;
-    onAttach?: Function;
-    onBuild?: Function;
-    onFocus?: Function;
-    onBlur?: Function;
-    onInitialized?: Function;
-    onFormReady?: (formio: any) => void;
-}
-export declare function useForm<Data = any>(props: UseFormHookProps<Data>): {
-    element: import('react').MutableRefObject<any>;
-};

package/dist/components/form/useForm.hook.js

@@ -1,64 +0,0 @@
-import { Form as F } from "formiojs";
-import f from "lodash/cloneDeep";
-import R from "lodash/isEqual";
-import { useRef as y, useEffect as d } from "react";
-function e(n, r, c) {
-  d(() => {
-    r && c.set(n, r);
-  }, [r, n, c]);
-}
-function w(n) {
-  const r = y(/* @__PURE__ */ new Map()), c = (t) => n.hasOwnProperty(t) && typeof n[t] == "function", h = (t, ...s) => {
-    if (c(t))
-      return (r.current.has(t) ? r.current.get(t) : n[t])(...s);
-  };
-  return e("onBlur", n.onBlur, r.current), e("onPrevPage", n.onPrevPage, r.current), e("onNextPage", n.onNextPage, r.current), e("onCancel", n.onCancel, r.current), e("onChange", n.onChange, r.current), e("onCustomEvent", n.onCustomEvent, r.current), e("onComponentChange", n.onComponentChange, r.current), e("onSubmit", n.onSubmit, r.current), e("onAsyncSubmit", n.onAsyncSubmit, r.current), e("onSubmitDone", n.onSubmitDone, r.current), e("onFormLoad", n.onFormLoad, r.current), e("onError", n.onError, r.current), e("onRender", n.onRender, r.current), e("onAttach", n.onAttach, r.current), e("onBuild", n.onBuild, r.current), e("onFocus", n.onFocus, r.current), e("onBlur", n.onBlur, r.current), e("onInitialized", n.onInitialized, r.current), { events: r, emit: h, hasEvent: c };
-}
-function V(n) {
-  const { src: r, form: c, options: h = {}, submission: t, url: s, ...g } = n, C = y(), l = y(), o = y(), { emit: E, hasEvent: P } = w(g);
-  async function B(u, i) {
-    if (P("onAsyncSubmit"))
-      try {
-        await E("onAsyncSubmit", u, o.current);
-      } catch (a) {
-        i((a == null ? void 0 : a.errors) || a);
-      }
-    else
-      i(null);
-  }
-  const b = (u, i) => {
-    var a;
-    return i = Object.assign({}, i), u = typeof u == "string" ? u : f(u), o.current || (l.current = !1, i.hooks = {
-      ...i.hooks || {},
-      customValidation: ((a = i == null ? void 0 : i.hooks) == null ? void 0 : a.customValidation) || B
-    }, o.current = new F(C.current, u, i), o.current.onAny((m, ...A) => {
-      if (o.current && m.startsWith("formio.")) {
-        const S = `on${m.charAt(7).toUpperCase()}${m.slice(8)}`;
-        if (S === "onChange" && !A[0].changed)
-          return;
-        E(S, ...A, o.current);
-      }
-    }), o.current.ready.then((m) => {
-      t && (m.submission = f(t)), n.onFormReady && n.onFormReady(m), l.current = !0;
-    })), o.current;
-  };
-  return d(() => {
-    o.current && o.current.ready.then((u) => {
-      R(u.submission.data, t == null ? void 0 : t.data) || t && (u.submission = f(t));
-    });
-  }, [t]), d(() => {
-    c && o.current && o.current.ready.then((u) => {
-      u.form = c, s && (u.url = s);
-    });
-  }, [c, s]), d(() => {
-    r && (o.current && (l.current = !1, o.current.destroy(!0)), b(r, h));
-  }, [r]), d(() => (c && b(c, h), () => {
-    l.current = !1, o.current && o.current.destroy(!0);
-  }), []), {
-    element: C
-  };
-}
-export {
-  V as useForm
-};
-//# sourceMappingURL=useForm.hook.js.map