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

package/dist/components/index.js

@@ -0,0 +1,86 @@
+import { ActionsTable as e } from "./actions-table/actionsTable.component.js";
+import { Alert as m } from "./alert/alert.component.js";
+import { Card as f } from "./card/card.component.js";
+import { Form as x } from "./form/form.component.js";
+import { useForm as s } from "./form/useForm.hook.js";
+import { FormAccess as i } from "./form-access/formAccess.component.js";
+import { FormAction as F } from "./form-action/formAction.component.js";
+import { FormBuilder as T } from "./form-builder/formBuilder.component.js";
+import { FormControl as b } from "./form-control/formControl.component.js";
+import { FormEditCTAs as A } from "./form-edit/formCtas.component.js";
+import { FormEdit as E } from "./form-edit/formEdit.component.js";
+import { FormParameters as g, defaultDisplayChoices as P } from "./form-edit/formParameters.component.js";
+import { useFormEdit as B } from "./form-edit/useFormEdit.hook.js";
+import { FormSettings as I } from "./form-settings/formSettings.component.js";
+import { FormsTable as w } from "./forms-table/formsTable.component.js";
+import { InputTags as L } from "./input-tags/inputTags.component.js";
+import { InputText as _ } from "./input-text/inputText.component.js";
+import { Loader as k } from "./loader/loader.component.js";
+import { Modal as y, useModal as N } from "./modal/modal.component.js";
+import { RemoveModal as q } from "./modal/removeModal.component.js";
+import { Pagination as J } from "./pagination/pagination.component.js";
+import { Select as Q } from "./select/select.component.js";
+import { SubmissionsTable as V } from "./submissions-table/submissionsTable.component.js";
+import { DefaultArrowSort as X } from "./table/components/defaultArrowSort.component.js";
+import { DefaultCell as Z } from "./table/components/defaultCell.component.js";
+import { DefaultCellHeader as oo } from "./table/components/defaultCellHeader.component.js";
+import { DefaultCellOperations as eo } from "./table/components/defaultCellOperations.component.js";
+import { DefaultOperationButton as mo } from "./table/components/defaultOperationButton.component.js";
+import { DefaultColumnFilter as fo } from "./table/filters/defaultColumnFilter.component.js";
+import { SelectColumnFilter as xo, useSelectColumnFilter as ao } from "./table/filters/selectColumnFilter.component.js";
+import { SliderColumnFilter as uo } from "./table/filters/sliderColumnFilter.component.js";
+import { getOperationCallback as no, useCustomTable as Fo } from "./table/hooks/useCustomTable.hook.js";
+import { useOperations as To } from "./table/hooks/useOperations.hook.js";
+import { Table as co } from "./table/table.component.js";
+import { LEFT_PAGE as Do, RIGHT_PAGE as Eo, getPageNumbers as So } from "./table/utils/getPageNumbers.js";
+import { mapFormToColumns as Po } from "./table/utils/mapFormToColumns.js";
+import { swapElements as Bo } from "./table/utils/swapElements.js";
+import { ButtonTab as Io, Tabs as Mo } from "./tabs/tabs.component.js";
+export {
+  e as ActionsTable,
+  m as Alert,
+  Io as ButtonTab,
+  f as Card,
+  X as DefaultArrowSort,
+  Z as DefaultCell,
+  oo as DefaultCellHeader,
+  eo as DefaultCellOperations,
+  fo as DefaultColumnFilter,
+  mo as DefaultOperationButton,
+  x as Form,
+  i as FormAccess,
+  F as FormAction,
+  T as FormBuilder,
+  b as FormControl,
+  E as FormEdit,
+  A as FormEditCTAs,
+  g as FormParameters,
+  I as FormSettings,
+  w as FormsTable,
+  L as InputTags,
+  _ as InputText,
+  Do as LEFT_PAGE,
+  k as Loader,
+  y as Modal,
+  J as Pagination,
+  Eo as RIGHT_PAGE,
+  q as RemoveModal,
+  Q as Select,
+  xo as SelectColumnFilter,
+  uo as SliderColumnFilter,
+  V as SubmissionsTable,
+  co as Table,
+  Mo as Tabs,
+  P as defaultDisplayChoices,
+  no as getOperationCallback,
+  So as getPageNumbers,
+  Po as mapFormToColumns,
+  Bo as swapElements,
+  Fo as useCustomTable,
+  s as useForm,
+  B as useFormEdit,
+  N as useModal,
+  To as useOperations,
+  ao as useSelectColumnFilter
+};
+//# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/input-tags/inputTags.component.d.ts

@@ -1,19 +1,18 @@
-import PropTypes from "prop-types";
-import React from "react";
-import { FormControlProps } from "../form-control/formControl.component";
-export interface InputTagsProps<T = any> extends Omit<FormControlProps, "description" | "prefix" | "suffix"> {
-    value?: T;
-    onChange?: (name: string, value: T) => void;
-    placeholder?: string;
-    [key: string]: any;
-}
-export declare function InputTags({ name, value, label, onChange, required, description, prefix, suffix, ...props }: InputTagsProps): React.JSX.Element;
-export declare namespace InputTags {
-    var propTypes: {
-        label: PropTypes.Requireable<string>;
-        name: PropTypes.Validator<string>;
-        value: PropTypes.Requireable<any[]>;
-        required: PropTypes.Requireable<boolean>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-}
+import { default as PropTypes } from 'prop-types';
+import { FormControlProps } from '../form-control/formControl.component';
+export interface InputTagsProps<T = any> extends Omit<FormControlProps, "description" | "prefix" | "suffix"> {
+    value?: T;
+    onChange?: (name: string, value: T) => void;
+    placeholder?: string;
+    [key: string]: any;
+}
+export declare function InputTags({ name, value, label, onChange, required, description, prefix, suffix, ...props }: InputTagsProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace InputTags {
+    var propTypes: {
+        label: PropTypes.Requireable<string>;
+        name: PropTypes.Validator<string>;
+        value: PropTypes.Requireable<any[]>;
+        required: PropTypes.Requireable<boolean>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+}

package/dist/components/input-tags/inputTags.component.js

@@ -0,0 +1,37 @@
+import { jsx as p } from "react/jsx-runtime";
+import v from "@formio/choices.js";
+import y from "lodash/uniq";
+import e from "prop-types";
+import { useRef as E, useEffect as I } from "react";
+import { FormControl as x } from "../form-control/formControl.component.js";
+function T({ name: t, value: i = [], label: d, onChange: r, required: m, description: u, prefix: l, suffix: c, ...f }) {
+  const s = E();
+  return I(() => {
+    const o = new v(s.current, {
+      delimiter: ",",
+      editItems: !0,
+      removeItemButton: !0
+    });
+    return o.setValue([].concat(i, [])), o.passedElement.element.addEventListener("addItem", (n) => {
+      r && r(t, y(i.concat(n.detail.value)));
+    }), o.passedElement.element.addEventListener("removeItem", (n) => {
+      r && r(
+        t,
+        i.filter((a) => a !== n.detail.value)
+      );
+    }), () => {
+      o.destroy();
+    };
+  }, []), /* @__PURE__ */ p(x, { name: t, label: d, required: m, description: u, prefix: l, suffix: c, children: /* @__PURE__ */ p("input", { ref: s, type: "text", ...f, id: t, required: m }) });
+}
+T.propTypes = {
+  label: e.string,
+  name: e.string.isRequired,
+  value: e.array,
+  required: e.bool,
+  onChange: e.func
+};
+export {
+  T as InputTags
+};
+//# sourceMappingURL=inputTags.component.js.map

package/dist/components/input-tags/inputTags.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inputTags.component.js","sources":["../../../src/components/input-tags/inputTags.component.tsx"],"sourcesContent":["import Choices from \"@formio/choices.js\";\nimport uniq from \"lodash/uniq\";\nimport PropTypes from \"prop-types\";\nimport { useEffect, useRef } from \"react\";\n\nimport { FormControl, FormControlProps } from \"../form-control/formControl.component\";\n\nexport interface InputTagsProps<T = any> extends Omit<FormControlProps, \"description\" | \"prefix\" | \"suffix\"> {\n  value?: T;\n  onChange?: (name: string, value: T) => void;\n  placeholder?: string;\n\n  [key: string]: any;\n}\n\nexport function InputTags({ name, value = [], label, onChange, required, description, prefix, suffix, ...props }: InputTagsProps) {\n  const ref: any = useRef();\n\n  useEffect(() => {\n    const instance = new Choices(ref.current, {\n      delimiter: \",\",\n      editItems: true,\n      removeItemButton: true\n    });\n\n    instance.setValue([].concat(value, []));\n\n    instance.passedElement.element.addEventListener(\"addItem\", (event: any) => {\n      onChange && onChange(name, uniq(value.concat(event.detail.value)));\n    });\n\n    instance.passedElement.element.addEventListener(\"removeItem\", (event: any) => {\n      onChange &&\n        onChange(\n          name,\n          value.filter((v: string) => v !== event.detail.value)\n        );\n    });\n\n    return () => {\n      instance.destroy();\n    };\n  }, []);\n\n  return (\n    <FormControl name={name} label={label} required={required} description={description} prefix={prefix} suffix={suffix}>\n      <input ref={ref} type='text' {...props} id={name} required={required} />\n    </FormControl>\n  );\n}\n\nInputTags.propTypes = {\n  label: PropTypes.string,\n  name: PropTypes.string.isRequired,\n  value: PropTypes.array,\n  required: PropTypes.bool,\n  onChange: PropTypes.func\n};\n"],"names":["InputTags","name","value","label","onChange","required","description","prefix","suffix","props","ref","useRef","useEffect","instance","Choices","event","uniq","v","FormControl","jsx","PropTypes"],"mappings":";;;;;;AAeO,SAASA,EAAU,EAAE,MAAAC,GAAM,OAAAC,IAAQ,CAAA,GAAI,OAAAC,GAAO,UAAAC,GAAU,UAAAC,GAAU,aAAAC,GAAa,QAAAC,GAAQ,QAAAC,GAAQ,GAAGC,KAAyB;AAChI,QAAMC,IAAWC,EAAO;AAExB,SAAAC,EAAU,MAAM;AACd,UAAMC,IAAW,IAAIC,EAAQJ,EAAI,SAAS;AAAA,MACxC,WAAW;AAAA,MACX,WAAW;AAAA,MACX,kBAAkB;AAAA,IAAA,CACnB;AAED,WAAAG,EAAS,SAAS,CAAC,EAAE,OAAOX,GAAO,CAAE,CAAA,CAAC,GAEtCW,EAAS,cAAc,QAAQ,iBAAiB,WAAW,CAACE,MAAe;AAC7D,MAAAX,KAAAA,EAASH,GAAMe,EAAKd,EAAM,OAAOa,EAAM,OAAO,KAAK,CAAC,CAAC;AAAA,IAAA,CAClE,GAEDF,EAAS,cAAc,QAAQ,iBAAiB,cAAc,CAACE,MAAe;AAE1E,MAAAX,KAAAA;AAAA,QACEH;AAAA,QACAC,EAAM,OAAO,CAACe,MAAcA,MAAMF,EAAM,OAAO,KAAK;AAAA,MACtD;AAAA,IAAA,CACH,GAEM,MAAM;AACX,MAAAF,EAAS,QAAQ;AAAA,IACnB;AAAA,EACF,GAAG,EAAE,qBAGFK,GAAY,EAAA,MAAAjB,GAAY,OAAAE,GAAc,UAAAE,GAAoB,aAAAC,GAA0B,QAAAC,GAAgB,QAAAC,GACnG,UAAA,gBAAAW,EAAC,SAAM,EAAA,KAAAT,GAAU,MAAK,QAAQ,GAAGD,GAAO,IAAIR,GAAM,UAAAI,EAAoB,CAAA,GACxE;AAEJ;AAEAL,EAAU,YAAY;AAAA,EACpB,OAAOoB,EAAU;AAAA,EACjB,MAAMA,EAAU,OAAO;AAAA,EACvB,OAAOA,EAAU;AAAA,EACjB,UAAUA,EAAU;AAAA,EACpB,UAAUA,EAAU;AACtB;"}

package/dist/components/input-text/inputText.component.d.ts

@@ -1,28 +1,27 @@
-import PropTypes from "prop-types";
-import React from "react";
-import { FormControlProps } from "../form-control/formControl.component";
-export interface InputTextProps<T = any> extends FormControlProps {
-    type?: string;
-    value?: T;
-    /**
-     * The input size
-     */
-    size?: string;
-    onChange?: (name: string, value: T) => void;
-    placeholder?: string;
-    [key: string]: any;
-}
-export declare function InputText<T = any>({ name, value, label, onChange, required, size, type, prefix, suffix, description, className, placeholder, ...props }: InputTextProps<T>): React.JSX.Element;
-export declare namespace InputText {
-    var propTypes: {
-        label: PropTypes.Requireable<string>;
-        type: PropTypes.Requireable<string>;
-        name: PropTypes.Validator<string>;
-        value: PropTypes.Requireable<any>;
-        size: PropTypes.Requireable<string>;
-        required: PropTypes.Requireable<boolean>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-        prefix: PropTypes.Requireable<any>;
-        suffix: PropTypes.Requireable<any>;
-    };
-}
+import { default as PropTypes } from 'prop-types';
+import { FormControlProps } from '../form-control/formControl.component';
+export interface InputTextProps<T = any> extends FormControlProps {
+    type?: string;
+    value?: T;
+    /**
+     * The input size
+     */
+    size?: string;
+    onChange?: (name: string, value: T) => void;
+    placeholder?: string;
+    [key: string]: any;
+}
+export declare function InputText<T = any>({ name, value, label, onChange, required, size, type, prefix, suffix, description, className, placeholder, ...props }: InputTextProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare namespace InputText {
+    var propTypes: {
+        label: PropTypes.Requireable<string>;
+        type: PropTypes.Requireable<string>;
+        name: PropTypes.Validator<string>;
+        value: PropTypes.Requireable<any>;
+        size: PropTypes.Requireable<string>;
+        required: PropTypes.Requireable<boolean>;
+        onChange: PropTypes.Requireable<(...args: any[]) => any>;
+        prefix: PropTypes.Requireable<any>;
+        suffix: PropTypes.Requireable<any>;
+    };
+}

package/dist/components/input-text/inputText.component.js

@@ -0,0 +1,70 @@
+import { jsx as m } from "react/jsx-runtime";
+import { c as b } from "../../chunks/index.js";
+import t from "prop-types";
+import { useState as h, useMemo as v, useEffect as E } from "react";
+import { callLast as $ } from "../../utils/callLast.js";
+import { getEventValue as j } from "../../utils/getEventValue.js";
+import { FormControl as q } from "../form-control/formControl.component.js";
+function C({
+  name: o,
+  value: r,
+  label: l,
+  onChange: e,
+  required: s,
+  size: n,
+  type: f,
+  prefix: u,
+  suffix: c,
+  description: y,
+  className: g,
+  placeholder: x,
+  ...d
+}) {
+  const [T, i] = h(r), p = v(() => e && $(e, 300), [e]);
+  return E(() => {
+    i(r);
+  }, [r]), /* @__PURE__ */ m(
+    q,
+    {
+      name: o,
+      label: l,
+      required: s,
+      description: y,
+      prefix: u,
+      suffix: c,
+      className: g,
+      children: /* @__PURE__ */ m(
+        "input",
+        {
+          type: f || "text",
+          ...d,
+          "data-testid": `input_${o}`,
+          className: b("form-control", n && `form-control-${n}`),
+          id: o,
+          required: s,
+          value: T || "",
+          placeholder: x,
+          onChange: (V) => {
+            const a = j(V);
+            return i(a), p && p(o, a);
+          }
+        }
+      )
+    }
+  );
+}
+C.propTypes = {
+  label: t.string,
+  type: t.string,
+  name: t.string.isRequired,
+  value: t.any,
+  size: t.string,
+  required: t.bool,
+  onChange: t.func,
+  prefix: t.any,
+  suffix: t.any
+};
+export {
+  C as InputText
+};
+//# sourceMappingURL=inputText.component.js.map

package/dist/components/input-text/inputText.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inputText.component.js","sources":["../../../src/components/input-text/inputText.component.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\nimport { useEffect, useMemo, useState } from \"react\";\n\nimport { callLast } from \"../../utils/callLast\";\nimport { getEventValue } from \"../../utils/getEventValue\";\nimport { FormControl, FormControlProps } from \"../form-control/formControl.component\";\n\nexport interface InputTextProps<T = any> extends FormControlProps {\n  type?: string;\n  value?: T;\n  /**\n   * The input size\n   */\n  size?: string;\n  onChange?: (name: string, value: T) => void;\n  placeholder?: string;\n\n  [key: string]: any;\n}\n\nexport function InputText<T = any>({\n  name,\n  value,\n  label,\n  onChange,\n  required,\n  size,\n  type,\n  prefix,\n  suffix,\n  description,\n  className,\n  placeholder,\n  ...props\n}: InputTextProps<T>) {\n  const [localValue, setValue] = useState(value);\n\n  const change = useMemo(() => onChange && callLast(onChange, 300), [onChange]);\n\n  useEffect(() => {\n    setValue(value);\n  }, [value]);\n\n  return (\n    <FormControl\n      name={name}\n      label={label}\n      required={required}\n      description={description}\n      prefix={prefix}\n      suffix={suffix}\n      className={className}\n    >\n      <input\n        type={type || \"text\"}\n        {...props}\n        data-testid={`input_${name}`}\n        className={classnames(\"form-control\", size && `form-control-${size}`)}\n        id={name}\n        required={required}\n        value={(localValue || \"\") as any}\n        placeholder={placeholder}\n        onChange={(event) => {\n          const value = getEventValue(event);\n          setValue(value);\n\n          return change && change(name, value);\n        }}\n      />\n    </FormControl>\n  );\n}\n\nInputText.propTypes = {\n  label: PropTypes.string,\n  type: PropTypes.string,\n  name: PropTypes.string.isRequired,\n  value: PropTypes.any,\n  size: PropTypes.string,\n  required: PropTypes.bool,\n  onChange: PropTypes.func,\n  prefix: PropTypes.any,\n  suffix: PropTypes.any\n};\n"],"names":["InputText","name","value","label","onChange","required","size","type","prefix","suffix","description","className","placeholder","props","localValue","setValue","useState","change","useMemo","callLast","useEffect","jsx","FormControl","classnames","event","getEventValue","PropTypes"],"mappings":";;;;;;;AAqBO,SAASA,EAAmB;AAAA,EACjC,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,GAAsB;AACpB,QAAM,CAACC,GAAYC,CAAQ,IAAIC,EAASd,CAAK,GAEvCe,IAASC,EAAQ,MAAMd,KAAYe,EAASf,GAAU,GAAG,GAAG,CAACA,CAAQ,CAAC;AAE5E,SAAAgB,EAAU,MAAM;AACd,IAAAL,EAASb,CAAK;AAAA,EAAA,GACb,CAACA,CAAK,CAAC,GAGR,gBAAAmB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAArB;AAAA,MACA,OAAAE;AAAA,MACA,UAAAE;AAAA,MACA,aAAAK;AAAA,MACA,QAAAF;AAAA,MACA,QAAAC;AAAA,MACA,WAAAE;AAAA,MAEA,UAAA,gBAAAU;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAMd,KAAQ;AAAA,UACb,GAAGM;AAAA,UACJ,eAAa,SAASZ,CAAI;AAAA,UAC1B,WAAWsB,EAAW,gBAAgBjB,KAAQ,gBAAgBA,CAAI,EAAE;AAAA,UACpE,IAAIL;AAAA,UACJ,UAAAI;AAAA,UACA,OAAQS,KAAc;AAAA,UACtB,aAAAF;AAAA,UACA,UAAU,CAACY,MAAU;AACbtB,kBAAAA,IAAQuB,EAAcD,CAAK;AACjC,mBAAAT,EAASb,CAAK,GAEPe,KAAUA,EAAOhB,GAAMC,CAAK;AAAA,UAAA;AAAA,QACrC;AAAA,MAAA;AAAA,IACF;AAAA,EACF;AAEJ;AAEAF,EAAU,YAAY;AAAA,EACpB,OAAO0B,EAAU;AAAA,EACjB,MAAMA,EAAU;AAAA,EAChB,MAAMA,EAAU,OAAO;AAAA,EACvB,OAAOA,EAAU;AAAA,EACjB,MAAMA,EAAU;AAAA,EAChB,UAAUA,EAAU;AAAA,EACpB,UAAUA,EAAU;AAAA,EACpB,QAAQA,EAAU;AAAA,EAClB,QAAQA,EAAU;AACpB;"}

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

@@ -1,17 +1,17 @@
-import PropTypes from "prop-types";
-import React, { PropsWithChildren } from "react";
-export interface LoaderProps {
-    isActive?: boolean;
-    color?: string;
-    icon?: string;
-    className?: string;
-}
-export declare function Loader({ isActive, color, icon, className }: PropsWithChildren<LoaderProps>): React.JSX.Element | null;
-export declare namespace Loader {
-    var propTypes: {
-        isActive: PropTypes.Requireable<boolean>;
-        icon: PropTypes.Requireable<string>;
-        color: PropTypes.Requireable<string>;
-        className: PropTypes.Requireable<string>;
-    };
-}
+import { default as PropTypes } from 'prop-types';
+import { PropsWithChildren } from 'react';
+export interface LoaderProps {
+    isActive?: boolean;
+    color?: string;
+    icon?: string;
+    className?: string;
+}
+export declare function Loader({ isActive, color, icon, className }: PropsWithChildren<LoaderProps>): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace Loader {
+    var propTypes: {
+        isActive: PropTypes.Requireable<boolean>;
+        icon: PropTypes.Requireable<string>;
+        color: PropTypes.Requireable<string>;
+        className: PropTypes.Requireable<string>;
+    };
+}

package/dist/components/loader/loader.component.js

@@ -0,0 +1,26 @@
+import { jsx as e } from "react/jsx-runtime";
+import { c as a } from "../../chunks/index.js";
+import t from "prop-types";
+import { iconClass as c } from "../../utils/iconClass.js";
+function l({ isActive: o, color: i = "blue", icon: r = "radio-circle", className: s = "" }) {
+  return o ? /* @__PURE__ */ e(
+    "div",
+    {
+      className: a(
+        "opacity-85 z-20 flex items-center justify-center p-5 absolute top-0 right-0 left-0 bottom-0 bg-white",
+        s
+      ),
+      children: /* @__PURE__ */ e("span", { "data-testid": `icon_${r}`, color: i, className: `text-11xl ${c(void 0, r, !0)}` })
+    }
+  ) : null;
+}
+l.propTypes = {
+  isActive: t.bool,
+  icon: t.string,
+  color: t.string,
+  className: t.string
+};
+export {
+  l as Loader
+};
+//# sourceMappingURL=loader.component.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"loader.component.js","sources":["../../../src/components/loader/loader.component.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\nimport { PropsWithChildren } from \"react\";\n\nimport { iconClass } from \"../../utils/iconClass\";\n\nexport interface LoaderProps {\n  isActive?: boolean;\n  color?: string;\n  icon?: string;\n  className?: string;\n}\n\nexport function Loader({ isActive, color = \"blue\", icon = \"radio-circle\", className = \"\" }: PropsWithChildren<LoaderProps>) {\n  if (isActive) {\n    return (\n      <div\n        className={classnames(\n          \"opacity-85 z-20 flex items-center justify-center p-5 absolute top-0 right-0 left-0 bottom-0 bg-white\",\n          className\n        )}\n      >\n        <span data-testid={`icon_${icon}`} color={color} className={`text-11xl ${iconClass(undefined, icon, true)}`} />\n      </div>\n    );\n  }\n  return null;\n}\n\nLoader.propTypes = {\n  isActive: PropTypes.bool,\n  icon: PropTypes.string,\n  color: PropTypes.string,\n  className: PropTypes.string\n};\n"],"names":["Loader","isActive","color","icon","className","jsx","classnames","iconClass","PropTypes"],"mappings":";;;;AAagB,SAAAA,EAAO,EAAE,UAAAC,GAAU,OAAAC,IAAQ,QAAQ,MAAAC,IAAO,gBAAgB,WAAAC,IAAY,MAAsC;AAC1H,SAAIH,IAEA,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MACF;AAAA,MAEA,UAAC,gBAAAC,EAAA,QAAA,EAAK,eAAa,QAAQF,CAAI,IAAI,OAAAD,GAAc,WAAW,aAAaK,EAAU,QAAWJ,GAAM,EAAI,CAAC,GAAI,CAAA;AAAA,IAAA;AAAA,EAC/G,IAGG;AACT;AAEAH,EAAO,YAAY;AAAA,EACjB,UAAUQ,EAAU;AAAA,EACpB,MAAMA,EAAU;AAAA,EAChB,OAAOA,EAAU;AAAA,EACjB,WAAWA,EAAU;AACvB;"}

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

@@ -1,15 +1,15 @@
-import React, { PropsWithChildren } from "react";
-export declare function useModal(): {
-    show: boolean;
-    setShowModal: React.Dispatch<React.SetStateAction<boolean>>;
-    openModal(): void;
-    closeModal(): void;
-};
-export interface ModalProps extends Record<string, any> {
-    show?: boolean;
-    closeModal?: () => void;
-    onClose?: () => void;
-    footer?: any;
-    title?: string;
-}
-export declare function Modal({ show, children, closeModal, onClose, title, footer: ModalFooter, style, className, ...props }: PropsWithChildren<ModalProps>): React.JSX.Element | null;
+import { PropsWithChildren } from 'react';
+export declare function useModal(): {
+    show: boolean;
+    setShowModal: import('react').Dispatch<import('react').SetStateAction<boolean>>;
+    openModal(): void;
+    closeModal(): void;
+};
+export interface ModalProps extends Record<string, any> {
+    show?: boolean;
+    closeModal?: () => void;
+    onClose?: () => void;
+    footer?: any;
+    title?: string;
+}
+export declare function Modal({ show, children, closeModal, onClose, title, footer: ModalFooter, style, className, ...props }: PropsWithChildren<ModalProps>): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/modal/modal.component.js

@@ -0,0 +1,62 @@
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import u from "lodash";
+import { useState as h, useRef as g, useEffect as C } from "react";
+function j() {
+  const [e, t] = h(!1);
+  return {
+    show: e,
+    setShowModal: t,
+    openModal() {
+      t(!0);
+    },
+    closeModal() {
+      t(!1);
+    }
+  };
+}
+function S({
+  show: e,
+  children: t,
+  closeModal: s = u,
+  onClose: p = u,
+  title: d,
+  footer: n,
+  style: v,
+  className: N = "",
+  ...b
+}) {
+  const a = g(), l = g(), [x, c] = h(), i = () => {
+    s(), p();
+  };
+  return C(() => {
+    var m, f;
+    if (a.current || l.current) {
+      const y = (((m = a == null ? void 0 : a.current) == null ? void 0 : m.offsetHeight) || 0) + (((f = l == null ? void 0 : l.current) == null ? void 0 : f.offsetHeight) || 0);
+      c(`calc(85vh - ${y}px)`);
+    } else
+      c("auto");
+  }, [e]), e ? /* @__PURE__ */ r("div", { role: "dialog", className: `formio-dialog formio-dialog-theme-default ${N}`, children: [
+    /* @__PURE__ */ o("div", { className: "formio-dialog-overlay", onClick: i }),
+    /* @__PURE__ */ r("div", { style: v, className: "formio-dialog-content", children: [
+      /* @__PURE__ */ r("div", { className: "formio-dialog-wrapper", children: [
+        d ? /* @__PURE__ */ o("div", { className: "formio-dialog-title", ref: a, "data-testid": "modalTitle", children: d }) : null,
+        /* @__PURE__ */ o("div", { className: "formio-dialog-body", style: { maxHeight: x }, "data-testid": "modalBody", children: e && t }),
+        n ? /* @__PURE__ */ o("div", { className: "formio-dialog-footer", ref: l, "data-testid": "modalFooter", children: /* @__PURE__ */ o(n, { ...b, closeModal: s, onClose: i }) }) : null
+      ] }),
+      /* @__PURE__ */ o(
+        "button",
+        {
+          className: "formio-dialog-close float-right btn btn-secondary btn-sm",
+          "aria-label": "close",
+          "data-testid": "closeModal",
+          onClick: i
+        }
+      )
+    ] })
+  ] }) : null;
+}
+export {
+  S as Modal,
+  j as useModal
+};
+//# sourceMappingURL=modal.component.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"modal.component.js","sources":["../../../src/components/modal/modal.component.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport noop from \"lodash\";\nimport { PropsWithChildren, useEffect, useRef, useState } from \"react\";\n\nexport function useModal() {\n  const [show, setShowModal] = useState(false);\n\n  return {\n    show,\n    setShowModal,\n    openModal() {\n      setShowModal(true);\n    },\n    closeModal() {\n      setShowModal(false);\n    }\n  };\n}\n\nexport interface ModalProps extends Record<string, any> {\n  show?: boolean;\n  closeModal?: () => void;\n  onClose?: () => void;\n  footer?: any;\n  title?: string;\n}\n\nexport function Modal({\n  show,\n  children,\n  closeModal = noop as any,\n  onClose = noop as any,\n  title,\n  footer: ModalFooter,\n  style,\n  className = \"\",\n  ...props\n}: PropsWithChildren<ModalProps>) {\n  const titleRef: any = useRef<HTMLDivElement>();\n  const footerRef: any = useRef<HTMLDivElement>();\n  const [maxHeight, setMaxHeight] = useState<string>();\n\n  const onClickClose = () => {\n    closeModal();\n    onClose();\n  };\n\n  useEffect(() => {\n    if (titleRef.current || footerRef.current) {\n      const height = (titleRef?.current?.offsetHeight || 0) + (footerRef?.current?.offsetHeight || 0);\n\n      setMaxHeight(`calc(85vh - ${height}px)`);\n    } else {\n      setMaxHeight(\"auto\");\n    }\n  }, [show]);\n\n  if (!show) {\n    return null;\n  }\n\n  return (\n    <div role={\"dialog\"} className={`formio-dialog formio-dialog-theme-default ${className}`}>\n      <div className='formio-dialog-overlay' onClick={onClickClose} />\n      <div style={style} className={\"formio-dialog-content\"}>\n        <div className={\"formio-dialog-wrapper\"}>\n          {title ? (\n            <div className={\"formio-dialog-title\"} ref={titleRef} data-testid={\"modalTitle\"}>\n              {title}\n            </div>\n          ) : null}\n\n          <div className='formio-dialog-body' style={{ maxHeight }} data-testid={\"modalBody\"}>\n            {show && children}\n          </div>\n\n          {ModalFooter ? (\n            <div className={\"formio-dialog-footer\"} ref={footerRef} data-testid={\"modalFooter\"}>\n              <ModalFooter {...props} closeModal={closeModal} onClose={onClickClose} />\n            </div>\n          ) : null}\n        </div>\n        <button\n          className='formio-dialog-close float-right btn btn-secondary btn-sm'\n          aria-label='close'\n          data-testid={\"closeModal\"}\n          onClick={onClickClose}\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":["useModal","show","setShowModal","useState","Modal","children","closeModal","noop","onClose","title","ModalFooter","style","className","props","titleRef","useRef","footerRef","maxHeight","setMaxHeight","onClickClose","useEffect","height","_a","_b","jsx","jsxs"],"mappings":";;;AAKO,SAASA,IAAW;AACzB,QAAM,CAACC,GAAMC,CAAY,IAAIC,EAAS,EAAK;AAEpC,SAAA;AAAA,IACL,MAAAF;AAAA,IACA,cAAAC;AAAA,IACA,YAAY;AACV,MAAAA,EAAa,EAAI;AAAA,IACnB;AAAA,IACA,aAAa;AACX,MAAAA,EAAa,EAAK;AAAA,IAAA;AAAA,EAEtB;AACF;AAUO,SAASE,EAAM;AAAA,EACpB,MAAAH;AAAA,EACA,UAAAI;AAAA,EACA,YAAAC,IAAaC;AAAA,EACb,SAAAC,IAAUD;AAAA,EACV,OAAAE;AAAA,EACA,QAAQC;AAAA,EACR,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAkC;AAChC,QAAMC,IAAgBC,EAAuB,GACvCC,IAAiBD,EAAuB,GACxC,CAACE,GAAWC,CAAY,IAAIf,EAAiB,GAE7CgB,IAAe,MAAM;AACd,IAAAb,EAAA,GACHE,EAAA;AAAA,EACV;AAYA,SAVAY,EAAU,MAAM;;AACV,QAAAN,EAAS,WAAWE,EAAU,SAAS;AACzC,YAAMK,OAAUC,IAAAR,KAAA,gBAAAA,EAAU,YAAV,gBAAAQ,EAAmB,iBAAgB,QAAMC,IAAAP,KAAA,gBAAAA,EAAW,YAAX,gBAAAO,EAAoB,iBAAgB;AAEhF,MAAAL,EAAA,eAAeG,CAAM,KAAK;AAAA,IAAA;AAEvC,MAAAH,EAAa,MAAM;AAAA,EACrB,GACC,CAACjB,CAAI,CAAC,GAEJA,sBAKF,OAAI,EAAA,MAAM,UAAU,WAAW,6CAA6CW,CAAS,IACpF,UAAA;AAAA,IAAA,gBAAAY,EAAC,OAAI,EAAA,WAAU,yBAAwB,SAASL,GAAc;AAAA,IAC7D,gBAAAM,EAAA,OAAA,EAAI,OAAAd,GAAc,WAAW,yBAC5B,UAAA;AAAA,MAAC,gBAAAc,EAAA,OAAA,EAAI,WAAW,yBACb,UAAA;AAAA,QACChB,IAAA,gBAAAe,EAAC,SAAI,WAAW,uBAAuB,KAAKV,GAAU,eAAa,cAChE,UAAAL,EAAA,CACH,IACE;AAAA,QAEJ,gBAAAe,EAAC,OAAI,EAAA,WAAU,sBAAqB,OAAO,EAAE,WAAAP,EAAa,GAAA,eAAa,aACpE,UAAAhB,KAAQI,EACX,CAAA;AAAA,QAECK,IACE,gBAAAc,EAAA,OAAA,EAAI,WAAW,wBAAwB,KAAKR,GAAW,eAAa,eACnE,UAAA,gBAAAQ,EAACd,KAAa,GAAGG,GAAO,YAAAP,GAAwB,SAASa,GAAc,GACzE,IACE;AAAA,MAAA,GACN;AAAA,MACA,gBAAAK;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,cAAW;AAAA,UACX,eAAa;AAAA,UACb,SAASL;AAAA,QAAA;AAAA,MAAA;AAAA,IACX,EACF,CAAA;AAAA,EAAA,GACF,IA/BO;AAiCX;"}

package/dist/components/modal/removeModal.component.d.ts

@@ -1,9 +1,9 @@
-import React, { PropsWithChildren } from "react";
-import { ModalProps } from "./modal.component";
-export interface RemoveModalProps extends ModalProps {
-    valueToCompare: string;
-    itemType?: string;
-    i18n?: (f: string) => string;
-    maxWidth?: string;
-}
-export declare function RemoveModal({ maxWidth, children, ...props }: PropsWithChildren<RemoveModalProps>): React.JSX.Element;
+import { PropsWithChildren } from 'react';
+import { ModalProps } from './modal.component';
+export interface RemoveModalProps extends ModalProps {
+    valueToCompare: string;
+    itemType?: string;
+    i18n?: (f: string) => string;
+    maxWidth?: string;
+}
+export declare function RemoveModal({ maxWidth, children, ...props }: PropsWithChildren<RemoveModalProps>): import("react/jsx-runtime").JSX.Element;

package/dist/components/modal/removeModal.component.js

@@ -0,0 +1,71 @@
+import { jsx as n, jsxs as t } from "react/jsx-runtime";
+import { c as d } from "../../chunks/index.js";
+import { useState as h } from "react";
+import { iconClass as f } from "../../utils/iconClass.js";
+import { InputText as b } from "../input-text/inputText.component.js";
+import { Modal as v } from "./modal.component.js";
+function x({ value: i, valueToCompare: r, onSubmit: e, onClose: o, i18n: a = (m) => m }) {
+  return /* @__PURE__ */ t("div", { className: "flex items-center justify-center bg-white p-2", children: [
+    /* @__PURE__ */ n("button", { "data-testid": "customCloseModal", className: "btn btn-outline-dark mx-2", onClick: o, children: a("Cancel") }),
+    /* @__PURE__ */ t(
+      "button",
+      {
+        disabled: r !== i,
+        "data-testid": "customSubmitModal",
+        className: "btn btn-danger mx-2",
+        onClick: (m) => {
+          r === i && e(m);
+        },
+        children: [
+          /* @__PURE__ */ n("i", { className: d(f(void 0, "trash"), "mr-2") }),
+          a("Remove")
+        ]
+      }
+    )
+  ] });
+}
+function T({ maxWidth: i = "300px", children: r, ...e }) {
+  var s, l;
+  const { i18n: o = (c) => c } = e, [a, m] = h();
+  return /* @__PURE__ */ n(
+    v,
+    {
+      ...e,
+      className: d(e.className, "formio-dialog-theme-remove"),
+      style: { maxWidth: i },
+      title: `Drop ${(s = e.itemType) == null ? void 0 : s.toLowerCase()}`,
+      value: a,
+      footer: x,
+      children: /* @__PURE__ */ t("div", { className: "px-4 pt-3 pb-5", children: [
+        /* @__PURE__ */ t("div", { className: "pb-1", children: [
+          r,
+          o("To drop"),
+          " ",
+          /* @__PURE__ */ n("strong", { children: e.valueToCompare }),
+          ", ",
+          o("type the"),
+          " ",
+          /* @__PURE__ */ t("strong", { children: [
+            '"',
+            (l = e.itemType) == null ? void 0 : l.toLowerCase(),
+            '"'
+          ] }),
+          " ",
+          o("name"),
+          " ",
+          /* @__PURE__ */ t("strong", { children: [
+            '"',
+            e.valueToCompare,
+            '"'
+          ] }),
+          "."
+        ] }),
+        /* @__PURE__ */ n(b, { name: "remove", value: a, onChange: (c, u) => m(u) })
+      ] })
+    }
+  );
+}
+export {
+  T as RemoveModal
+};
+//# sourceMappingURL=removeModal.component.js.map

package/dist/components/modal/removeModal.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"removeModal.component.js","sources":["../../../src/components/modal/removeModal.component.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { PropsWithChildren, useState } from \"react\";\n\nimport { iconClass } from \"../../utils/iconClass\";\nimport { InputText } from \"../input-text/inputText.component\";\nimport { Modal, ModalProps } from \"./modal.component\";\n\nfunction RemoveModalFooter({ value, valueToCompare, onSubmit, onClose, i18n = (f: string) => f }: ModalProps) {\n  return (\n    <div className={\"flex items-center justify-center bg-white p-2\"}>\n      <button data-testid='customCloseModal' className={\"btn btn-outline-dark mx-2\"} onClick={onClose}>\n        {i18n(\"Cancel\")}\n      </button>\n      <button\n        disabled={valueToCompare !== value}\n        data-testid='customSubmitModal'\n        className={\"btn btn-danger mx-2\"}\n        onClick={(e) => {\n          if (valueToCompare === value) {\n            onSubmit(e);\n          }\n        }}\n      >\n        <i className={classnames(iconClass(undefined, \"trash\"), \"mr-2\")} />\n        {i18n(\"Remove\")}\n      </button>\n    </div>\n  );\n}\n\nexport interface RemoveModalProps extends ModalProps {\n  valueToCompare: string;\n  itemType?: string;\n  i18n?: (f: string) => string;\n  maxWidth?: string;\n}\n\nexport function RemoveModal({ maxWidth = \"300px\", children, ...props }: PropsWithChildren<RemoveModalProps>) {\n  const { i18n = (f) => f } = props;\n  const [value, setValue] = useState();\n\n  return (\n    <Modal\n      {...props}\n      className={classnames(props.className, \"formio-dialog-theme-remove\")}\n      style={{ maxWidth }}\n      title={`Drop ${props.itemType?.toLowerCase()}`}\n      value={value}\n      footer={RemoveModalFooter}\n    >\n      <div className='px-4 pt-3 pb-5'>\n        <div className='pb-1'>\n          {children}\n          {i18n(\"To drop\")} <strong>{props.valueToCompare}</strong>,&nbsp;\n          {i18n(\"type the\")}&nbsp;\n          <strong>&quot;{props.itemType?.toLowerCase()}&quot;</strong>&nbsp;\n          {i18n(\"name\")} <strong>&quot;{props.valueToCompare}&quot;</strong>.\n        </div>\n        <InputText name='remove' value={value} onChange={(name, value) => setValue(value)} />\n      </div>\n    </Modal>\n  );\n}\n"],"names":["RemoveModalFooter","value","valueToCompare","onSubmit","onClose","i18n","f","jsxs","jsx","e","classnames","iconClass","RemoveModal","maxWidth","children","props","setValue","useState","Modal","_a","_b","InputText","name"],"mappings":";;;;;;AAOA,SAASA,EAAkB,EAAE,OAAAC,GAAO,gBAAAC,GAAgB,UAAAC,GAAU,SAAAC,GAAS,MAAAC,IAAO,CAACC,MAAcA,KAAiB;AAE1G,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAW,iDACd,UAAA;AAAA,IAAC,gBAAAC,EAAA,UAAA,EAAO,eAAY,oBAAmB,WAAW,6BAA6B,SAASJ,GACrF,UAAKC,EAAA,QAAQ,EAChB,CAAA;AAAA,IACA,gBAAAE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,UAAUL,MAAmBD;AAAA,QAC7B,eAAY;AAAA,QACZ,WAAW;AAAA,QACX,SAAS,CAACQ,MAAM;AACd,UAAIP,MAAmBD,KACrBE,EAASM,CAAC;AAAA,QAEd;AAAA,QAEA,UAAA;AAAA,UAAC,gBAAAD,EAAA,KAAA,EAAE,WAAWE,EAAWC,EAAU,QAAW,OAAO,GAAG,MAAM,GAAG;AAAA,UAChEN,EAAK,QAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAChB,GACF;AAEJ;AASO,SAASO,EAAY,EAAE,UAAAC,IAAW,SAAS,UAAAC,GAAU,GAAGC,KAA8C;;AAC3G,QAAM,EAAE,MAAAV,IAAO,CAACC,MAAMA,EAAM,IAAAS,GACtB,CAACd,GAAOe,CAAQ,IAAIC,EAAS;AAGjC,SAAA,gBAAAT;AAAA,IAACU;AAAA,IAAA;AAAA,MACE,GAAGH;AAAA,MACJ,WAAWL,EAAWK,EAAM,WAAW,4BAA4B;AAAA,MACnE,OAAO,EAAE,UAAAF,EAAS;AAAA,MAClB,OAAO,SAAQM,IAAAJ,EAAM,aAAN,gBAAAI,EAAgB,aAAa;AAAA,MAC5C,OAAAlB;AAAA,MACA,QAAQD;AAAA,MAER,UAAA,gBAAAO,EAAC,OAAI,EAAA,WAAU,kBACb,UAAA;AAAA,QAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,QACZ,UAAA;AAAA,UAAAO;AAAA,UACAT,EAAK,SAAS;AAAA,UAAE;AAAA,UAAC,gBAAAG,EAAC,UAAQ,EAAA,UAAAO,EAAM,eAAe,CAAA;AAAA,UAAS;AAAA,UACxDV,EAAK,UAAU;AAAA,UAAE;AAAA,4BACjB,UAAO,EAAA,UAAA;AAAA,YAAA;AAAA,aAAOe,IAAAL,EAAM,aAAN,gBAAAK,EAAgB;AAAA,YAAc;AAAA,UAAA,GAAM;AAAA,UAAS;AAAA,UAC3Df,EAAK,MAAM;AAAA,UAAE;AAAA,4BAAE,UAAO,EAAA,UAAA;AAAA,YAAA;AAAA,YAAOU,EAAM;AAAA,YAAe;AAAA,UAAA,GAAM;AAAA,UAAS;AAAA,QAAA,GACpE;AAAA,QACA,gBAAAP,EAACa,GAAU,EAAA,MAAK,UAAS,OAAApB,GAAc,UAAU,CAACqB,GAAMrB,MAAUe,EAASf,CAAK,EAAG,CAAA;AAAA,MAAA,EACrF,CAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}

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

@@ -1,18 +1,17 @@
-import React from "react";
-export interface PaginationProps {
-    className?: string;
-    pageSizes?: number[];
-    gotoPage: any;
-    canPreviousPage: boolean;
-    previousPage: any;
-    nextPage: any;
-    canNextPage: boolean;
-    pageCount: number;
-    pageIndex: number;
-    pageOptions?: number[];
-    pageSize: number;
-    setPageSize: any;
-    totalLength?: number;
-    i18n?: (f: string) => string;
-}
-export declare function Pagination(props: PaginationProps): React.JSX.Element;
+export interface PaginationProps {
+    className?: string;
+    pageSizes?: number[];
+    gotoPage: any;
+    canPreviousPage: boolean;
+    previousPage: any;
+    nextPage: any;
+    canNextPage: boolean;
+    pageCount: number;
+    pageIndex: number;
+    pageOptions?: number[];
+    pageSize: number;
+    setPageSize: any;
+    totalLength?: number;
+    i18n?: (f: string) => string;
+}
+export declare function Pagination(props: PaginationProps): import("react/jsx-runtime").JSX.Element;