@tsed/react-formio 1.12.0 → 1.13.2

package/src/components/form-access/formAccess.utils.ts

@@ -1,10 +1,10 @@
-import { ExtendedComponentSchema } from "formiojs";
+import {ExtendedComponentSchema} from "formiojs";
 import cloneDeep from "lodash/cloneDeep";
 import isEqual from "lodash/isEqual";
 import noop from "lodash/noop";
-import { FormSchema, Submission } from "../../interfaces";
-import { RoleSchema } from "../../interfaces/RoleSchema";
-import { getAccessPermissionForm, getSubmissionPermissionForm } from "./formAccess.schema";
+import {FormSchema, Submission} from "../../interfaces";
+import {RoleSchema} from "../../interfaces/RoleSchema";
+import {getAccessPermissionForm, getSubmissionPermissionForm} from "./formAccess.schema";
 
 export interface Choice {
   label: string;
@@ -31,19 +31,19 @@ export type SubmissionAccess = {
 function rolesToChoices(roles: RoleSchema[]): Choice[] {
   return Object.values(roles).map((role) => {
     return {
-      label: role.title,
-      value: role._id
+      label: role.title || "",
+      value: role._id || ""
     };
   });
 }
 
-function accessToHash(keys: string[], access: Access[] = []): AccessRoles {
+function accessToHash(keys: (string | undefined)[] | undefined, access: Access[] = []): AccessRoles {
   const hash = Object.values(access).reduce((o: any, role: any) => {
     o[role.type] = role.roles;
     return o;
   }, {});
 
-  return keys.reduce((data, key) => {
+  return ((keys || []).filter(Boolean) as any[]).reduce((data, key: string) => {
     return {
       ...data,
       [key]: hash[key] || []
@@ -69,8 +69,8 @@ function hashToAccess(data: AccessRoles) {
 
 export function getFormAccess(roles: RoleSchema[]): FormAccessSchema {
   const choices = rolesToChoices(roles);
-  const access = getAccessPermissionForm({ choices });
-  const submissionAccess = getSubmissionPermissionForm({ choices });
+  const access = getAccessPermissionForm({choices});
+  const submissionAccess = getSubmissionPermissionForm({choices});
 
   return {
     access,
@@ -79,7 +79,7 @@ export function getFormAccess(roles: RoleSchema[]): FormAccessSchema {
 }
 
 export function dataAccessToSubmissions(form: Partial<FormSchema>, formAccess: FormAccessSchema): SubmissionAccess {
-  const getKeys = (components: ExtendedComponentSchema[]) => components.map(({ key }) => key);
+  const getKeys = (components: ExtendedComponentSchema[]) => components.map(({key}) => key);
 
   return {
     access: {
@@ -100,14 +100,14 @@ export function submissionsToDataAccess(form: Partial<FormSchema>, submissions:
 }
 
 export function shouldUpdate(type: string, submission: Submission<AccessRoles>, submissions: SubmissionAccess) {
-  return !isEqual(submission.data, submissions[type].data);
+  return !isEqual(submission.data, (submissions as any)[type].data);
 }
 
 export function updateSubmissions(type: string, submission: Submission<AccessRoles>, submissions: SubmissionAccess, cb: Function = noop) {
   if (shouldUpdate(type, submission, submissions)) {
     submissions = {
       ...submissions,
-      [type]: { data: submission.data }
+      [type]: {data: submission.data}
     };
     cb(submissions);
   }

package/src/components/form-action/formAction.component.tsx

@@ -39,7 +39,7 @@ export interface FormActionProps {
 
 export function FormAction({ actionInfo, children, onSubmit, options, ...props }: PropsWithChildren<FormActionProps>): ReactElement {
   const { form, submission } = useMemo(() => {
-    const submission = mapData(props.submission || {}, actionInfo.defaults);
+    const submission = mapData(props.submission || {}, actionInfo.defaults!);
     const form = mapSettingsForm(actionInfo.settingsForm);
 
     return { form, submission: { data: submission } };

package/src/components/form-builder/formBuilder.component.tsx

@@ -175,7 +175,7 @@ export class FormBuilder extends React.Component<FormBuilderProps, any> {
 
   whenComponentsChange(components: ComponentSchema[]) {
     this.setState({ components }, () => {
-      this.props?.onChange(components);
+      this.props?.onChange && this.props.onChange(components);
     });
   }
 

package/src/components/form-edit/formCtas.component.tsx

@@ -1,8 +1,8 @@
 import PropTypes from "prop-types";
-import React, { ReactElement } from "react";
-import { useTooltip } from "../../hooks/useTooltip";
-import { FormOptions } from "../../interfaces";
-import { iconClass } from "../../utils/iconClass";
+import React, {ReactElement} from "react";
+import {useTooltip} from "../../hooks/useTooltip";
+import {FormOptions} from "../../interfaces";
+import {iconClass} from "../../utils/iconClass";
 
 export interface FormEditCTAsProps extends Record<string, unknown> {
   saveText?: string;
@@ -18,38 +18,38 @@ export interface FormEditCTAsProps extends Record<string, unknown> {
 }
 
 export function FormEditCTAs({
-  saveText = "Save",
-  disabled,
-  options = {},
-  onCopy,
-  hasUndo,
-  hasRedo,
-  onUndo,
-  onRedo,
-  onReset,
-  onSubmit
-}: FormEditCTAsProps): ReactElement {
-  const { i18n: t = (t: string): string => t } = options;
+                               saveText = "Save",
+                               disabled,
+                               options = {},
+                               onCopy,
+                               hasUndo,
+                               hasRedo,
+                               onUndo,
+                               onRedo,
+                               onReset,
+                               onSubmit
+                             }: FormEditCTAsProps): ReactElement {
+  const {i18n: t = (t: string): string => t} = options;
 
-  const copyTooltipRef = useTooltip({
+  const copyTooltipRef: any = useTooltip({
     trigger: "hover",
     placement: "top",
     title: t("Copy")
   });
 
-  const undoTooltipRef = useTooltip({
+  const undoTooltipRef: any = useTooltip({
     trigger: "hover",
     placement: "top",
     title: t("Undo last change")
   });
 
-  const redoTooltipRef = useTooltip({
+  const redoTooltipRef: any = useTooltip({
     trigger: "hover",
     placement: "top",
     title: t("Redo last change")
   });
 
-  const resetTooltipRef = useTooltip({
+  const resetTooltipRef: any = useTooltip({
     trigger: "hover",
     placement: "top",
     title: t("Reset all changes")
@@ -61,31 +61,33 @@ export function FormEditCTAs({
         <button
           className={`btn btn-primary btn-save flex ${disabled ? "disabled" : ""}`}
           disabled={disabled}
-          onClick={() => !disabled && onSubmit()}
+          onClick={() => !disabled && onSubmit && onSubmit()}
         >
-          <i className={`mr-1 ${iconClass(options.iconset, "save")}`} />
+          <i className={`mr-1 ${iconClass(options.iconset, "save")}`}/>
           {saveText}
         </button>
 
         <div>
-          <button className={`btn btn-light btn-undo ${hasUndo ? "" : "disabled"}`} onClick={() => onUndo()} ref={undoTooltipRef}>
-            <i className={iconClass(options.iconset, "undo")} />
+          <button className={`btn btn-light btn-undo ${hasUndo ? "" : "disabled"}`} onClick={() => onUndo && onUndo()}
+                  ref={undoTooltipRef}>
+            <i className={iconClass(options.iconset, "undo")}/>
           </button>
 
-          <button className={`btn btn-light btn-redo ${hasRedo ? "" : "disabled"}`} onClick={() => onRedo()} ref={redoTooltipRef}>
-            <i className={iconClass(options.iconset, "redo")} />
+          <button className={`btn btn-light btn-redo ${hasRedo ? "" : "disabled"}`} onClick={() => onRedo && onRedo()}
+                  ref={redoTooltipRef}>
+            <i className={iconClass(options.iconset, "redo")}/>
           </button>
         </div>
 
         <div>
           {onCopy && (
-            <button className='btn btn-light' onClick={() => onCopy()} ref={copyTooltipRef}>
-              <i className={iconClass(options.iconset, "copy")} />
+            <button className="btn btn-light" onClick={() => onCopy()} ref={copyTooltipRef!}>
+              <i className={iconClass(options.iconset, "copy")}/>
             </button>
           )}
 
-          <button className={`btn btn-light btn-reset`} onClick={() => onReset()} ref={resetTooltipRef}>
-            <i className={iconClass(options.iconset, "reset")} />
+          <button className={`btn btn-light btn-reset`} onClick={() => onReset && onReset()} ref={resetTooltipRef!}>
+            <i className={iconClass(options.iconset, "reset")}/>
           </button>
         </div>
       </div>

package/src/components/form-edit/formEdit.component.tsx

@@ -37,7 +37,7 @@ export function FormEdit(props: FormEditProps) {
 
       <FormBuilder
         key={`form-builder-${form._id}`}
-        components={form.components}
+        components={form.components!}
         display={form.display}
         options={options}
         builder={builder}

package/src/components/form-settings/formSettings.utils.ts

@@ -10,9 +10,9 @@ export type FormSettingsSchema = {
 export function formSettingsToSubmission(form: Partial<FormSchema>): Submission<FormSettingsSchema> {
   return {
     data: {
-      action: form.action,
-      tags: form.tags,
-      properties: form.properties
+      action: form.action!,
+      tags: form.tags!,
+      properties: form.properties!
     }
   };
 }

package/src/components/input-tags/inputTags.component.tsx

@@ -14,7 +14,7 @@ export interface InputTagsProps<T = any> extends Omit<FormControlProps, "descrip
 }
 
 export function InputTags({ name, value = [], label, onChange, required, description, prefix, suffix, ...props }: InputTagsProps) {
-  const ref = useRef();
+  const ref: any = useRef();
 
   useEffect(() => {
     const instance = new Choices(ref.current, {
@@ -26,11 +26,11 @@ export function InputTags({ name, value = [], label, onChange, required, descrip
     instance.setValue([].concat(value, []));
 
     instance.passedElement.element.addEventListener("addItem", (event: any) => {
-      onChange(name, uniq(value.concat(event.detail.value)));
+      onChange && onChange(name, uniq(value.concat(event.detail.value)));
     });
 
     instance.passedElement.element.addEventListener("removeItem", (event: any) => {
-      onChange(
+      onChange && onChange(
         name,
         value.filter((v: string) => v !== event.detail.value)
       );

package/src/components/input-text/inputText.component.spec.tsx

@@ -25,7 +25,7 @@ describe("input-text", () => {
     const input = getByTestId("input_test") as HTMLInputElement;
 
     expect(input).toBeInTheDocument();
-    expect(input).toHaveDisplayValue(placeholderTest);
+    expect(input).toHaveAttribute("placeholder", placeholderTest);
   });
 
   it("should change the value of the input-text", () => {

package/src/components/input-text/inputText.component.tsx

@@ -35,7 +35,7 @@ export function InputText<T = any>({
 }: InputTextProps<T>) {
   const [localValue, setValue] = useState(value);
 
-  const change = useMemo(() => callLast(onChange, 300), [onChange]);
+  const change = useMemo(() => onChange && callLast(onChange, 300), [onChange]);
 
   useEffect(() => {
     setValue(value);
@@ -58,13 +58,13 @@ export function InputText<T = any>({
         className={classnames("form-control", size && `form-control-${size}`)}
         id={name}
         required={required}
-        value={(localValue || placeholder  || "") as any}
+        value={(localValue || "") as any}
         placeholder={placeholder}
         onChange={(event) => {
           const value = getEventValue(event);
           setValue(value);
 
-          return change(name, value);
+          return change && change(name, value);
         }}
       />
     </FormControl>

package/src/components/modal/modal.component.tsx

@@ -37,8 +37,8 @@ export function Modal({
   className = "",
   ...props
 }: PropsWithChildren<ModalProps>) {
-  const titleRef = useRef<HTMLDivElement>();
-  const footerRef = useRef<HTMLDivElement>();
+  const titleRef: any = useRef<HTMLDivElement>();
+  const footerRef: any = useRef<HTMLDivElement>();
   const [maxHeight, setMaxHeight] = useState<string>();
 
   const onClickClose = () => {

package/src/components/react-component/reactComponent.component.tsx

@@ -4,8 +4,8 @@ import { Submission } from "../../interfaces/Submission";
 
 export class ReactComponent<Data = any> extends Components.components.field {
   public reactInstance: any;
-  public shouldSetValue: boolean;
-  private dataForSetting: Data;
+  public shouldSetValue?: boolean;
+  private dataForSetting?: Data;
 
   /**
    * This is the first phase of component building where the component is instantiated.
@@ -20,7 +20,7 @@ export class ReactComponent<Data = any> extends Components.components.field {
   }
 
   get $reactNode() {
-    return this.refs[`react-${this.id}`];
+    return (this.refs as any)[`react-${this.id}`];
   }
 
   /**
@@ -67,7 +67,9 @@ export class ReactComponent<Data = any> extends Components.components.field {
       [`react-${this.id}`]: "single"
     });
 
+    // @ts-ignore
     if (this.refs[`react-${this.id}`]) {
+      // @ts-ignore
       this.reactInstance = this.attachReact(this.refs[`react-${this.id}`]);
 
       if (this.shouldSetValue) {
@@ -82,7 +84,9 @@ export class ReactComponent<Data = any> extends Components.components.field {
    * or it is being removed from the form.
    */
   detach() {
+    // @ts-ignore
     if (this.refs[`react-${this.id}`]) {
+      // @ts-ignore
       this.detachReact(this.refs[`react-${this.id}`]);
     }
     super.detach();
@@ -122,8 +126,7 @@ export class ReactComponent<Data = any> extends Components.components.field {
    * @param value
    * @param flags
    */
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  setValue(value: any, flags?: any): boolean {
+  setValue(value: any, flags?: any) {
     if (this.reactInstance) {
       this.reactInstance.setState({
         value: value
@@ -134,7 +137,7 @@ export class ReactComponent<Data = any> extends Components.components.field {
       this.dataForSetting = value;
     }
 
-    return undefined;
+    return false
   }
 
   /**

package/src/components/select/select.component.tsx

@@ -33,7 +33,7 @@ export function Select<T = any>({
   layout,
   ...props
 }: SelectProps<T>): ReactElement {
-  const ref = useRef();
+  const ref = useRef<any>();
 
   useEffect(() => {
     let instance: any;
@@ -75,7 +75,7 @@ export function Select<T = any>({
         value={value || ("" as any)}
         placeholder={placeholder}
         onChange={(event) => {
-          onChange(name, getEventValue(event));
+          onChange && onChange(name, getEventValue(event));
         }}
       >
         {choices.map(({ label, value }) => {

package/src/components/submissions-table/submissionsTable.component.tsx

@@ -1,14 +1,14 @@
 import React from "react";
-import { FormSchema, Submission } from "../../interfaces";
-import { Table, TableProps } from "../table/table.component";
-import { mapFormToColumns } from "../table/utils/mapFormToColumns";
+import {FormSchema, Submission} from "../../interfaces";
+import {Table, TableProps} from "../table/table.component";
+import {mapFormToColumns} from "../table/utils/mapFormToColumns";
 
 export type SubmissionsTableProps = Omit<TableProps<Submission>, "columns"> & {
   form?: FormSchema;
 };
 
-export function SubmissionsTable({ form, ...props }: SubmissionsTableProps) {
-  const columns: any[] = React.useMemo(() => form && mapFormToColumns(form), [form]);
+export function SubmissionsTable({form, ...props}: SubmissionsTableProps) {
+  const columns: any[] | undefined = form && mapFormToColumns(form);
 
-  return <Table {...props} columns={columns} />;
+  return <Table {...props} columns={columns!}/>;
 }

package/src/components/table/table.component.tsx

@@ -1,13 +1,23 @@
 import classnames from "classnames";
 import noop from "lodash/noop";
-import React, { PropsWithChildren } from "react";
-import { CellProps, FilterProps, Renderer, TableOptions, useFilters, useGroupBy, usePagination, useSortBy, useTable } from "react-table";
-import { OnClickOperation, Operation, QueryOptions } from "../../interfaces";
-import { Pagination as DefaultPagination } from "../pagination/pagination.component";
-import { DefaultArrowSort } from "./components/defaultArrowSort.component";
-import { DefaultCellHeader, DefaultCellHeaderProps } from "./components/defaultCellHeader.component";
-import { DefaultColumnFilter } from "./filters/defaultColumnFilter.component";
-import { useOperations } from "./utils/useOperations.hook";
+import React, {PropsWithChildren} from "react";
+import {
+  CellProps,
+  FilterProps,
+  Renderer,
+  TableOptions,
+  useFilters,
+  useGroupBy,
+  usePagination,
+  useSortBy,
+  useTable
+} from "react-table";
+import {OnClickOperation, Operation, QueryOptions} from "../../interfaces";
+import {Pagination as DefaultPagination} from "../pagination/pagination.component";
+import {DefaultArrowSort} from "./components/defaultArrowSort.component";
+import {DefaultCellHeader, DefaultCellHeaderProps} from "./components/defaultCellHeader.component";
+import {DefaultColumnFilter} from "./filters/defaultColumnFilter.component";
+import {useOperations} from "./utils/useOperations.hook";
 
 export interface TableProps<Data extends object = any> extends TableOptions<Data>, Partial<QueryOptions> {
   className?: string;
@@ -92,7 +102,7 @@ function DefaultLoader() {
 }
 
 function DefaultEmptyData() {
-  return <div className='text-center p-2 pb-4 font-bold'>No data found</div>;
+  return <div className="text-center p-2 pb-4 font-bold">No data found</div>;
 }
 
 const hooks = [useFilters, useGroupBy, useSortBy, usePagination];
@@ -161,12 +171,12 @@ export function Table<Data extends object = any>(props: PropsWithChildren<TableP
       setFilterId
     } as any,
     ...hooks,
-    useOperations({ operations, CellOperations, onClick: _onClick, ctx, i18n })
+    useOperations({operations, CellOperations, onClick: _onClick, ctx, i18n})
   );
 
   const {
     setPageSize,
-    state: { pageIndex, pageSize, sortBy, filters }
+    state: {pageIndex, pageSize, sortBy, filters}
   } = tableInstance;
 
   React.useEffect(() => {
@@ -188,45 +198,49 @@ export function Table<Data extends object = any>(props: PropsWithChildren<TableP
         /* style={{ marginBottom: disablePagination ? "-1px" : "0px" }} */
       >
         <thead>
-          {tableInstance.headerGroups.map((headerGroup, i) => (
-            <tr key={`tableInstance.headerGroups${i}`} {...headerGroup.getHeaderGroupProps()}>
-              {headerGroup.headers.map((column) => (
-                <th
-                  key={`tableInstance.headers.column.${column.id}`}
-                  /* className='text-left py-2 align-top' */
-                  {...column.getHeaderProps()}
-                >
-                  <CellHeader column={column} />
-                </th>
-              ))}
-            </tr>
-          ))}
+        {tableInstance.headerGroups.map((headerGroup, i) => (
+          <tr {...headerGroup.getHeaderGroupProps()} key={`tableInstance.headerGroups${i}`}>
+            {headerGroup.headers.map((column) => (
+              <th
+                /* className='text-left py-2 align-top' */
+                {...column.getHeaderProps()}
+                key={`tableInstance.headers.column.${column.id}`}
+              >
+                <CellHeader column={column}/>
+              </th>
+            ))}
+          </tr>
+        ))}
         </thead>
         {!isLoading ? (
           <tbody {...tableInstance.getTableBodyProps()}>
-            {tableInstance.page.map((row) => {
-              tableInstance.prepareRow(row);
-              return (
-                <tr key={`tableInstance.page.${row.id}`} onClick={() => _onClick(row.original, "row")} {...row.getRowProps()}>
-                  {row.cells.map((cell, i) => {
-                    const { hidden, colspan } = cell.column as any;
-                    if (hidden) {
-                      return null;
-                    }
-                    return (
-                      <td key={`tableInstance.page.cells.${cell.value || "value"}.${i}`} colSpan={colspan} {...cell.getCellProps()}>
-                        {cell.render("Cell")}
-                      </td>
-                    );
-                  })}
-                </tr>
-              );
-            })}
+          {tableInstance.page.map((row) => {
+            tableInstance.prepareRow(row);
+            return (
+              <tr onClick={() => _onClick(row.original, "row")} {...row.getRowProps()}
+                  key={`tableInstance.page.${row.id}`}>
+                {row.cells.map((cell, i) => {
+                  const {hidden, colspan} = cell.column as any;
+                  if (hidden) {
+                    return null;
+                  }
+                  return (
+                    <td
+                      colSpan={colspan}
+                      {...cell.getCellProps()}
+                      key={`tableInstance.page.cells.${cell.value || "value"}.${i}`}>
+                      {cell.render("Cell")}
+                    </td>
+                  );
+                })}
+              </tr>
+            );
+          })}
           </tbody>
         ) : null}
       </table>
-      {isLoading ? <Loader /> : null}
-      {!data.length ? <EmptyData /> : null}
+      {isLoading ? <Loader/> : null}
+      {!data.length ? <EmptyData/> : null}
       {!isLoading && data.length && !disablePagination ? (
         <div className={"overflow-hidden"}>
           <Pagination

package/src/components/table/utils/mapFormToColumns.tsx

@@ -11,7 +11,7 @@ export function mapFormToColumns(form: FormSchema): Column[] {
 
   FormioUtils.eachComponent(form.components, (component: ExtendedComponentSchema) => {
     if (component.tableView && component.key) {
-      const cmp: any = Components.create(component, null, null, true);
+      const cmp: any = Components.create(component, {}, null, true);
 
       const column: Column = {
         Header: component.label || component.title || component.key,

package/src/components/tabs/tabs.component.tsx

@@ -71,7 +71,7 @@ export function Tabs({
                     {...additionalProps}
                     {...item}
                   >
-                    {i18n(item.label)}
+                    {i18n(item.label || "")}
                   </Button>
                 );
               })}

package/src/hooks/useTooltip.ts

@@ -2,7 +2,7 @@ import { useEffect, useRef } from "react";
 import Tooltip, { Options } from "tooltip.js";
 
 export function useTooltip(options: Options) {
-  const ref = useRef();
+  const ref = useRef<any>();
 
   useEffect(() => {
     ref.current && new Tooltip(ref.current as any, options);

package/src/stores/action-info/action-info.selectors.ts

@@ -3,4 +3,4 @@ import { selectRoot } from "../root";
 import { ACTION_INFO } from "./action-info.constant";
 import { ActionInfoState } from "./action-info.reducers";
 
-export const selectActionInfo = (state: Record<string, any>): Partial<ActionSchema> => selectRoot<ActionInfoState>(ACTION_INFO, state).data;
+export const selectActionInfo = (state: Record<string, any>): Partial<ActionSchema> => selectRoot<ActionInfoState>(ACTION_INFO, state).data!;

package/src/stores/auth/auth.utils.tsx

@@ -7,7 +7,7 @@ export function hasRole(auth: AuthState, role: string): boolean {
 }
 
 export function hasRoles(auth: AuthState, roles: string[]): boolean {
-  roles = [].concat(roles);
+  roles = ([] as string[]).concat(roles);
 
   return !!roles.find((role) => hasRole(auth, role));
 }
@@ -29,7 +29,7 @@ export function checkRoleFormAccess(auth: AuthState, form?: Partial<FormSchema>,
       return true;
     }
 
-    return !!(roles.includes("owner") && get(form, "owner") === get(auth, "user._id"));
+    return (roles.includes("owner") && get(form, "owner") === get(auth, "user._id"));
   }
 
   return true;

package/src/stores/auth/getAccess.action.ts

@@ -8,7 +8,7 @@ function transformSubmissionAccess(forms: Record<string, FormSchema>) {
   return Object.values(forms).reduce(
     (result, form) => ({
       ...result,
-      [form.name]: form.submissionAccess.reduce(
+      [form.name as string]: form.submissionAccess.reduce(
         (formSubmissionAccess: any, access: any) => ({
           ...formSubmissionAccess,
           [access.type]: access.roles
@@ -24,7 +24,7 @@ function transformFormAccess(forms: Record<string, FormSchema>) {
   return Object.values(forms).reduce(
     (result, form) => ({
       ...result,
-      [form.name]: form.access.reduce(
+      [form.name as string]: form.access.reduce(
         (formAccess: any, access: any) => ({
           ...formAccess,
           [access.type]: access.roles

package/src/stores/auth/logout.action.spec.ts

@@ -4,6 +4,7 @@ import { AUTH } from "./auth.constant";
 import { logout } from "./logout.action";
 
 jest.mock("./auth.actions");
+jest.mock('formiojs')
 
 describe("logout()", () => {
   beforeEach(() => {

package/src/stores/form/form.selectors.ts

@@ -2,4 +2,4 @@ import { FormSchema } from "../../interfaces";
 import { selectRoot } from "../root";
 import { FormState } from "./form.reducers";
 
-export const selectForm = (name: string, state: any): Partial<FormSchema> => selectRoot<FormState>(name, state).data;
+export const selectForm = (name: string, state: any): Partial<FormSchema> => selectRoot<FormState>(name, state).data!;

package/src/stores/root/root.selectors.ts

@@ -10,9 +10,9 @@ export function selectRoot<State = Record<string, any>>(name: string, state?: Re
   return (state: Record<string, any>) => selectRoot(name, state);
 }
 
-export const selectError = (name: string, state: Record<string, any>): null | Error => get(selectRoot(name, state), "error");
+export const selectError = (name: string, state: Record<string, any>): null | Error => get(selectRoot(name, state)!, "error");
 
-export const selectIsActive = (name: string, state: Record<string, any>): boolean => get(selectRoot(name, state), "isActive");
+export const selectIsActive = (name: string, state: Record<string, any>): boolean => get(selectRoot(name, state)!, "isActive");
 
 export function oneOfIsActive(...names: string[]) {
   return (state: any) => {