@tsed/react-formio 3.0.0-alpha.9 → 3.0.0-rc.1

package/dist/molecules/forms/select/hooks/useOptions.d.ts

@@ -3,7 +3,7 @@ export declare function mapOptions(options: AllSelectProps["options"]): (import(
     label: any;
     options: any;
 }[];
-export declare function useOptions<Data = string>({ options }: AllSelectProps<Data>): (import('../Select.interface').SelectOptionBaseProps<string> | Omit<import('../Select.interface').SelectOptionProps<string>, "value">)[] | {
+export declare function useOptions<Data = string>({ options, choices }: AllSelectProps<Data>): (import('../Select.interface').SelectOptionBaseProps<string> | Omit<import('../Select.interface').SelectOptionProps<string>, "value">)[] | {
     label: any;
     options: any;
 }[];

package/dist/molecules/forms/select/hooks/useOptions.js

@@ -1,7 +1,7 @@
 import { useMemo as n } from "react";
-function o(t) {
-  if (t.find((p) => p.group)) {
-    let p = function(r) {
+function o(e) {
+  if (e.find((u) => u.group)) {
+    let u = function(r) {
       return {
         ...r,
         customProperties: {
@@ -9,27 +9,27 @@ function o(t) {
           template: r.template
         }
       };
-    }, u = /* @__PURE__ */ new Map();
-    return t.forEach((r) => {
+    }, p = /* @__PURE__ */ new Map();
+    return e.forEach((r) => {
       if (r.group) {
-        const e = u.get(r.group) || [];
-        e.push(r), u.set(r.group, e);
+        const t = p.get(r.group) || [];
+        t.push(r), p.set(r.group, t);
       } else {
-        const e = u.get("default") || [];
-        e.push(p(r)), u.set("default", e);
+        const t = p.get("default") || [];
+        t.push(u(r)), p.set("default", t);
       }
-    }), [...u.entries()].map(([r, e]) => ({
+    }), [...p.entries()].map(([r, t]) => ({
       label: r,
-      options: e
+      options: t
     }));
   }
-  return t;
+  return e;
 }
-function a({ options: t }) {
-  return n(() => o(t), [t]);
+function f({ options: e, choices: u }) {
+  return u && (e = u), n(() => o(e), [e]);
 }
 export {
   o as mapOptions,
-  a as useOptions
+  f as useOptions
 };
 //# sourceMappingURL=useOptions.js.map

package/dist/molecules/forms/select/hooks/useOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOptions.js","sources":["../../../../../src/molecules/forms/select/hooks/useOptions.ts"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport type { AllSelectProps } from \"../Select.interface\";\n\nexport function mapOptions(options: AllSelectProps[\"options\"]) {\n  if (options.find((item) => item.group)) {\n    let groupsMap = new Map();\n\n    function mapItem(item: AllSelectProps[\"options\"][0]) {\n      return {\n        ...item,\n        customProperties: {\n          ...item.data,\n          template: item.template\n        }\n      };\n    }\n\n    options.forEach((item) => {\n      if (item.group) {\n        // legacy model group\n        const group = groupsMap.get(item.group) || [];\n\n        group.push(item);\n\n        groupsMap.set(item.group, group);\n      } else {\n        const group = groupsMap.get(\"default\") || [];\n        group.push(mapItem(item));\n        groupsMap.set(\"default\", group);\n      }\n    });\n\n    return [...groupsMap.entries()].map(([label, options]) => {\n      return {\n        label,\n        options\n      };\n    });\n  }\n\n  return options;\n}\n\nexport function useOptions<Data = string>({ options }: AllSelectProps<Data>) {\n  return useMemo(() => {\n    return mapOptions(options);\n  }, [options]);\n}\n"],"names":["mapOptions","options","item","mapItem","groupsMap","group","label","useOptions","useMemo"],"mappings":";AAIO,SAASA,EAAWC,GAAoC;AAC7D,MAAIA,EAAQ,KAAK,CAACC,MAASA,EAAK,KAAK,GAAG;AAG7B,QAAAC,IAAT,SAAiBD,GAAoC;AAC5C,aAAA;AAAA,QACL,GAAGA;AAAA,QACH,kBAAkB;AAAA,UAChB,GAAGA,EAAK;AAAA,UACR,UAAUA,EAAK;AAAA,QAAA;AAAA,MAEnB;AAAA,IACF,GAVIE,wBAAgB,IAAI;AAYhB,WAAAH,EAAA,QAAQ,CAACC,MAAS;AACxB,UAAIA,EAAK,OAAO;AAEd,cAAMG,IAAQD,EAAU,IAAIF,EAAK,KAAK,KAAK,CAAC;AAE5C,QAAAG,EAAM,KAAKH,CAAI,GAELE,EAAA,IAAIF,EAAK,OAAOG,CAAK;AAAA,MAAA,OAC1B;AACL,cAAMA,IAAQD,EAAU,IAAI,SAAS,KAAK,CAAC;AACrC,QAAAC,EAAA,KAAKF,EAAQD,CAAI,CAAC,GACdE,EAAA,IAAI,WAAWC,CAAK;AAAA,MAAA;AAAA,IAChC,CACD,GAEM,CAAC,GAAGD,EAAU,QAAS,CAAA,EAAE,IAAI,CAAC,CAACE,GAAOL,CAAO,OAC3C;AAAA,MACL,OAAAK;AAAA,MACA,SAAAL;AAAAA,IACF,EACD;AAAA,EAAA;AAGI,SAAAA;AACT;AAEgB,SAAAM,EAA0B,EAAE,SAAAN,KAAiC;AAC3E,SAAOO,EAAQ,MACNR,EAAWC,CAAO,GACxB,CAACA,CAAO,CAAC;AACd;"}
+{"version":3,"file":"useOptions.js","sources":["../../../../../src/molecules/forms/select/hooks/useOptions.ts"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport type { AllSelectProps } from \"../Select.interface\";\n\nexport function mapOptions(options: AllSelectProps[\"options\"]) {\n  if (options.find((item) => item.group)) {\n    let groupsMap = new Map();\n\n    function mapItem(item: AllSelectProps[\"options\"][0]) {\n      return {\n        ...item,\n        customProperties: {\n          ...item.data,\n          template: item.template\n        }\n      };\n    }\n\n    options.forEach((item) => {\n      if (item.group) {\n        // legacy model group\n        const group = groupsMap.get(item.group) || [];\n\n        group.push(item);\n\n        groupsMap.set(item.group, group);\n      } else {\n        const group = groupsMap.get(\"default\") || [];\n        group.push(mapItem(item));\n        groupsMap.set(\"default\", group);\n      }\n    });\n\n    return [...groupsMap.entries()].map(([label, options]) => {\n      return {\n        label,\n        options\n      };\n    });\n  }\n\n  return options;\n}\n\nexport function useOptions<Data = string>({ options, choices }: AllSelectProps<Data>) {\n  if (choices) {\n    options = choices;\n  }\n\n  return useMemo(() => {\n    return mapOptions(options);\n  }, [options]);\n}\n"],"names":["mapOptions","options","item","mapItem","groupsMap","group","label","useOptions","choices","useMemo"],"mappings":";AAIO,SAASA,EAAWC,GAAoC;AAC7D,MAAIA,EAAQ,KAAK,CAACC,MAASA,EAAK,KAAK,GAAG;AAGtC,QAASC,IAAT,SAAiBD,GAAoC;AACnD,aAAO;AAAA,QACL,GAAGA;AAAA,QACH,kBAAkB;AAAA,UAChB,GAAGA,EAAK;AAAA,UACR,UAAUA,EAAK;AAAA,QAAA;AAAA,MACjB;AAAA,IAEJ,GAVIE,wBAAgB,IAAA;AAYpB,WAAAH,EAAQ,QAAQ,CAACC,MAAS;AACxB,UAAIA,EAAK,OAAO;AAEd,cAAMG,IAAQD,EAAU,IAAIF,EAAK,KAAK,KAAK,CAAA;AAE3C,QAAAG,EAAM,KAAKH,CAAI,GAEfE,EAAU,IAAIF,EAAK,OAAOG,CAAK;AAAA,MACjC,OAAO;AACL,cAAMA,IAAQD,EAAU,IAAI,SAAS,KAAK,CAAA;AAC1C,QAAAC,EAAM,KAAKF,EAAQD,CAAI,CAAC,GACxBE,EAAU,IAAI,WAAWC,CAAK;AAAA,MAChC;AAAA,IACF,CAAC,GAEM,CAAC,GAAGD,EAAU,QAAA,CAAS,EAAE,IAAI,CAAC,CAACE,GAAOL,CAAO,OAC3C;AAAA,MACL,OAAAK;AAAA,MACA,SAAAL;AAAAA,IAAA,EAEH;AAAA,EACH;AAEA,SAAOA;AACT;AAEO,SAASM,EAA0B,EAAE,SAAAN,GAAS,SAAAO,KAAiC;AACpF,SAAIA,MACFP,IAAUO,IAGLC,EAAQ,MACNT,EAAWC,CAAO,GACxB,CAACA,CAAO,CAAC;AACd;"}

package/dist/molecules/loader/Loader.d.ts

@@ -1,8 +1,8 @@
-import { PropsWithChildren } from 'react';
-export interface LoaderProps {
+import { ComponentPropsWithoutRef, PropsWithChildren } from 'react';
+export interface LoaderProps extends ComponentPropsWithoutRef<"div"> {
     isActive?: boolean;
     color?: string;
     icon?: string;
-    className?: string;
+    iconset?: string;
 }
-export declare function Loader({ isActive, color, icon, className }: PropsWithChildren<LoaderProps>): import("react/jsx-runtime").JSX.Element | null;
+export declare function Loader({ isActive, color, icon, iconset, className, ...props }: PropsWithChildren<LoaderProps>): import("react/jsx-runtime").JSX.Element | null;

package/dist/molecules/loader/Loader.js

@@ -1,19 +1,27 @@
 import { jsx as e } from "react/jsx-runtime";
-import { c as a } from "../../chunks/index.js";
-import { iconClass as s } from "../../utils/iconClass.js";
-function n({ isActive: r, color: i = "text-primary", icon: t = "radio-circle", className: o = "" }) {
-  return r ? /* @__PURE__ */ e(
+import { c as r } from "../../chunks/index.js";
+import { Icon as s } from "../../atoms/icon/Icon.js";
+function f({
+  isActive: i,
+  color: o = "text-primary",
+  icon: t = "loader",
+  iconset: a,
+  className: n = "",
+  ...m
+}) {
+  return i ? /* @__PURE__ */ e(
     "div",
     {
-      className: a(
+      ...m,
+      className: r(
         "opacity-85 z-20 flex items-center justify-center p-5 absolute top-0 right-0 left-0 bottom-0 bg-white",
-        o
+        n
       ),
-      children: /* @__PURE__ */ e("span", { "data-testid": `icon_${t}`, className: `text-8xl ${i} ${s(void 0, t, !0)}` })
+      children: /* @__PURE__ */ e(s, { "data-testid": `icon_${t}`, className: r("text-8xl", o), iconset: a, name: t, spinning: !0 })
     }
   ) : null;
 }
 export {
-  n as Loader
+  f as Loader
 };
 //# sourceMappingURL=Loader.js.map

package/dist/molecules/loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../src/molecules/loader/Loader.tsx"],"sourcesContent":["import classnames from \"classnames\";\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 = \"text-primary\", 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}`} className={`text-8xl ${color} ${iconClass(undefined, icon, true)}`} />\n      </div>\n    );\n  }\n  return null;\n}\n"],"names":["Loader","isActive","color","icon","className","jsx","classnames","iconClass"],"mappings":";;;AAYgB,SAAAA,EAAO,EAAE,UAAAC,GAAU,OAAAC,IAAQ,gBAAgB,MAAAC,IAAO,gBAAgB,WAAAC,IAAY,MAAsC;AAClI,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,WAAW,YAAYD,CAAK,IAAIK,EAAU,QAAWJ,GAAM,EAAI,CAAC,GAAI,CAAA;AAAA,IAAA;AAAA,EACzG,IAGG;AACT;"}
+{"version":3,"file":"Loader.js","sources":["../../../src/molecules/loader/Loader.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport cx from \"classnames\";\nimport { type ComponentPropsWithoutRef, PropsWithChildren } from \"react\";\n\nimport { Icon } from \"../../atoms/icon/Icon.js\";\n\nexport interface LoaderProps extends ComponentPropsWithoutRef<\"div\"> {\n  isActive?: boolean;\n  color?: string;\n  icon?: string;\n  iconset?: string;\n}\n\nexport function Loader({\n  isActive,\n  color = \"text-primary\",\n  icon = \"loader\",\n  iconset,\n  className = \"\",\n  ...props\n}: PropsWithChildren<LoaderProps>) {\n  if (isActive) {\n    return (\n      <div\n        {...props}\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        <Icon data-testid={`icon_${icon}`} className={cx(\"text-8xl\", color)} iconset={iconset} name={icon} spinning={true} />\n      </div>\n    );\n  }\n\n  return null;\n}\n"],"names":["Loader","isActive","color","icon","iconset","className","props","jsx","classnames","Icon","cx"],"mappings":";;;AAaO,SAASA,EAAO;AAAA,EACrB,UAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC,IAAO;AAAA,EACP,SAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAmC;AACjC,SAAIL,IAEA,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGD;AAAA,MACJ,WAAWE;AAAAA,QACT;AAAA,QACAH;AAAA,MAAA;AAAA,MAGF,UAAA,gBAAAE,EAACE,GAAA,EAAK,eAAa,QAAQN,CAAI,IAAI,WAAWO,EAAG,YAAYR,CAAK,GAAG,SAAAE,GAAkB,MAAMD,GAAM,UAAU,GAAA,CAAM;AAAA,IAAA;AAAA,EAAA,IAKlH;AACT;"}

package/dist/molecules/modal/Modal.js

@@ -1,8 +1,8 @@
 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);
+import f from "lodash";
+import { useState as u, useRef as m, useEffect as x } from "react";
+function H() {
+  const [e, t] = u(!1);
   return {
     show: e,
     setShowModal: t,
@@ -14,34 +14,33 @@ function j() {
     }
   };
 }
-function S({
+function $({
   show: e,
   children: t,
-  closeModal: s = u,
-  onClose: p = u,
+  closeModal: s = f,
+  onClose: g = f,
   title: d,
   footer: n,
-  style: v,
-  className: N = "",
-  ...b
+  style: h,
+  className: v = "",
+  ...p
 }) {
-  const a = g(), l = g(), [x, c] = h(), i = () => {
-    s(), p();
+  const l = m(), a = m(), [N, c] = u(), i = () => {
+    s(), g();
   };
-  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)`);
+  return x(() => {
+    if (l.current || a.current) {
+      const b = (l?.current?.offsetHeight || 0) + (a?.current?.offsetHeight || 0);
+      c(`calc(85vh - ${b}px)`);
     } else
       c("auto");
-  }, [e]), e ? /* @__PURE__ */ r("div", { role: "dialog", className: `formio-dialog formio-dialog-theme-default ${N}`, children: [
+  }, [e]), e ? /* @__PURE__ */ r("div", { role: "dialog", className: `formio-dialog formio-dialog-theme-default ${v}`, children: [
     /* @__PURE__ */ o("div", { className: "formio-dialog-overlay", onClick: i }),
-    /* @__PURE__ */ r("div", { style: v, className: "formio-dialog-content", children: [
+    /* @__PURE__ */ r("div", { style: h, 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
+        d ? /* @__PURE__ */ o("div", { className: "formio-dialog-title", ref: l, "data-testid": "modalTitle", children: d }) : null,
+        /* @__PURE__ */ o("div", { className: "formio-dialog-body", style: { maxHeight: N }, "data-testid": "modalBody", children: e && t }),
+        n ? /* @__PURE__ */ o("div", { className: "formio-dialog-footer", ref: a, "data-testid": "modalFooter", children: /* @__PURE__ */ o(n, { ...p, closeModal: s, onClose: i }) }) : null
       ] }),
       /* @__PURE__ */ o(
         "button",
@@ -56,7 +55,7 @@ function S({
   ] }) : null;
 }
 export {
-  S as Modal,
-  j as useModal
+  $ as Modal,
+  H as useModal
 };
 //# sourceMappingURL=Modal.js.map

package/dist/molecules/modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["../../../src/molecules/modal/Modal.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;"}
+{"version":3,"file":"Modal.js","sources":["../../../src/molecules/modal/Modal.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","jsx","jsxs"],"mappings":";;;AAKO,SAASA,IAAW;AACzB,QAAM,CAACC,GAAMC,CAAY,IAAIC,EAAS,EAAK;AAE3C,SAAO;AAAA,IACL,MAAAF;AAAA,IACA,cAAAC;AAAA,IACA,YAAY;AACV,MAAAA,EAAa,EAAI;AAAA,IACnB;AAAA,IACA,aAAa;AACX,MAAAA,EAAa,EAAK;AAAA,IACpB;AAAA,EAAA;AAEJ;AAUO,SAASE,EAAM;AAAA,EACpB,MAAAH;AAAA,EACA,UAAAI;AAAA,EACA,YAAAC,IAAaC;AAAAA,EACb,SAAAC,IAAUD;AAAAA,EACV,OAAAE;AAAA,EACA,QAAQC;AAAA,EACR,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAAkC;AAChC,QAAMC,IAAgBC,EAAA,GAChBC,IAAiBD,EAAA,GACjB,CAACE,GAAWC,CAAY,IAAIf,EAAA,GAE5BgB,IAAe,MAAM;AACzB,IAAAb,EAAA,GACAE,EAAA;AAAA,EACF;AAYA,SAVAY,EAAU,MAAM;AACd,QAAIN,EAAS,WAAWE,EAAU,SAAS;AACzC,YAAMK,KAAUP,GAAU,SAAS,gBAAgB,MAAME,GAAW,SAAS,gBAAgB;AAE7F,MAAAE,EAAa,eAAeG,CAAM,KAAK;AAAA,IACzC;AACE,MAAAH,EAAa,MAAM;AAAA,EAEvB,GAAG,CAACjB,CAAI,CAAC,GAEJA,sBAKF,OAAA,EAAI,MAAM,UAAU,WAAW,6CAA6CW,CAAS,IACpF,UAAA;AAAA,IAAA,gBAAAU,EAAC,OAAA,EAAI,WAAU,yBAAwB,SAASH,GAAc;AAAA,IAC9D,gBAAAI,EAAC,OAAA,EAAI,OAAAZ,GAAc,WAAW,yBAC5B,UAAA;AAAA,MAAA,gBAAAY,EAAC,OAAA,EAAI,WAAW,yBACb,UAAA;AAAA,QAAAd,IACC,gBAAAa,EAAC,SAAI,WAAW,uBAAuB,KAAKR,GAAU,eAAa,cAChE,UAAAL,EAAA,CACH,IACE;AAAA,QAEJ,gBAAAa,EAAC,OAAA,EAAI,WAAU,sBAAqB,OAAO,EAAE,WAAAL,EAAA,GAAa,eAAa,aACpE,UAAAhB,KAAQI,EAAA,CACX;AAAA,QAECK,IACC,gBAAAY,EAAC,OAAA,EAAI,WAAW,wBAAwB,KAAKN,GAAW,eAAa,eACnE,UAAA,gBAAAM,EAACZ,KAAa,GAAGG,GAAO,YAAAP,GAAwB,SAASa,GAAc,GACzE,IACE;AAAA,MAAA,GACN;AAAA,MACA,gBAAAG;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,cAAW;AAAA,UACX,eAAa;AAAA,UACb,SAASH;AAAA,QAAA;AAAA,MAAA;AAAA,IACX,EAAA,CACF;AAAA,EAAA,GACF,IA/BO;AAiCX;"}

package/dist/molecules/pagination/Pagination.d.ts

@@ -1,18 +1,19 @@
+import { FormOptions } from '../../interfaces/index.js';
 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;
+    rowCount?: number;
     layout?: "html5" | "react" | "choicesjs";
-    i18n?: (f: string) => string;
+    i18n?: FormOptions["i18n"];
+    onPageIndexChange: (pageIndex: number) => void;
+    onClickPreviousPage: () => void;
+    onClickNextPage: () => void;
+    onPageSizeChange: (pageSize: number) => void;
 }
 export declare function Pagination(props: PaginationProps): import("react/jsx-runtime").JSX.Element;

package/dist/molecules/pagination/Pagination.js

@@ -1,86 +1,77 @@
-import { jsxs as i, jsx as a } from "react/jsx-runtime";
-import { c as r } from "../../chunks/index.js";
-import { registerComponent as k, getComponent as h } from "../../registries/components.js";
-import "formiojs";
-import "react";
-import "../forms/input-text/InputText.js";
-import "../forms/select/Select.js";
-import "lodash/noop";
-import "react-table";
-import "lodash/omit";
-import "react-dnd";
-import "react-dnd-html5-backend";
-import { getPageNumbers as z, LEFT_PAGE as E, RIGHT_PAGE as G } from "../table/utils/getPageNumbers.js";
-function T(s) {
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { c as s } from "../../chunks/index.js";
+import { useI18n as S } from "../../hooks/useI18n.js";
+import { registerComponent as z, getComponent as p } from "../../registries/components.js";
+import { getPageNumbers as E, LEFT_PAGE as G, RIGHT_PAGE as T } from "./utils/getPageNumbers.js";
+function _(r) {
   const {
     className: u,
     pageSizes: P = [10, 25, 50, 100],
-    gotoPage: b,
-    canPreviousPage: m,
-    previousPage: N,
-    nextPage: x,
-    canNextPage: c,
+    onPageIndexChange: N,
+    canPreviousPage: c,
+    onClickPreviousPage: b,
+    onClickNextPage: x,
+    canNextPage: m,
     pageCount: f,
-    pageIndex: n = 1,
-    pageOptions: g,
-    pageSize: v,
-    setPageSize: C,
-    totalLength: d,
-    i18n: t = (e) => e
-  } = s, p = z({
-    currentPage: n,
+    pageIndex: t = 1,
+    pageOptions: d,
+    pageSize: C,
+    onPageSizeChange: v,
+    rowCount: g
+  } = r, { t: i } = S(r.i18n), h = E({
+    currentPage: t,
     // pageNeighbours,
     totalPages: f
-  }), I = P.map((e) => ({ value: e, label: e })), S = h("Select"), l = h("PaginationButton");
-  return /* @__PURE__ */ i("nav", { "aria-label": "Page navigation", className: r("pagination-group -mb-3", u), children: [
-    /* @__PURE__ */ i("ul", { className: "pagination mb-3 mr-3", children: [
-      /* @__PURE__ */ a("li", { className: r("page-item", !m && "disabled"), children: /* @__PURE__ */ a(l, { tabIndex: -1, disabled: !m, onClick: () => N(), children: t("Previous") }) }),
-      p.map((e) => {
-        if ([E, G].includes(e))
-          return /* @__PURE__ */ a("li", { className: "page-item", children: /* @__PURE__ */ a(l, { "aria-hidden": "true", children: "..." }) }, e);
-        const o = e - 1 === n;
-        return /* @__PURE__ */ a("li", { className: r("page-item", o && "active"), children: /* @__PURE__ */ a(l, { tabIndex: n, active: o, onClick: () => b(e - 1), children: e }) }, e);
+  }), I = P.map((a) => ({ value: a, label: a })), k = p("Select"), l = p("PaginationButton");
+  return /* @__PURE__ */ n("nav", { "aria-label": "Page navigation", className: s("pagination-group -mb-3", u), children: [
+    /* @__PURE__ */ n("ul", { className: "pagination mb-3 mr-3", children: [
+      /* @__PURE__ */ e("li", { className: s("page-item", !c && "disabled"), children: /* @__PURE__ */ e(l, { tabIndex: -1, disabled: !c, onClick: () => b(), children: i("Previous") }) }),
+      h.map((a) => {
+        if ([G, T].includes(a))
+          return /* @__PURE__ */ e("li", { className: "page-item", children: /* @__PURE__ */ e(l, { "aria-hidden": "true", children: "..." }) }, a);
+        const o = a - 1 === t;
+        return /* @__PURE__ */ e("li", { className: s("page-item", o && "active"), children: /* @__PURE__ */ e(l, { tabIndex: t, active: o, onClick: () => N(a - 1), children: a }) }, a);
       }),
-      /* @__PURE__ */ a("li", { className: r("page-item", !c && "disabled"), children: /* @__PURE__ */ a(l, { tabIndex: p.length, disabled: !c, onClick: () => x(), children: t("Next") }) })
+      /* @__PURE__ */ e("li", { className: s("page-item", !m && "disabled"), children: /* @__PURE__ */ e(l, { tabIndex: h.length, disabled: !m, onClick: () => x(), children: i("Next") }) })
     ] }),
-    /* @__PURE__ */ i("li", { className: "mb-3 mr-3 flex items-center", children: [
-      /* @__PURE__ */ a(
-        S,
+    /* @__PURE__ */ n("li", { className: "mb-3 mr-3 flex items-center", children: [
+      /* @__PURE__ */ e(
+        k,
         {
           name: "page",
-          value: v,
+          value: C,
           options: I,
           multiple: !1,
-          layout: s.layout,
-          onChange: (e, o) => {
-            C(+o);
+          layout: r.layout,
+          onChange: (a, o) => {
+            v(+o);
           }
         }
       ),
-      /* @__PURE__ */ a("span", { className: "ml-3", children: t("items per page") })
+      /* @__PURE__ */ e("span", { className: "ml-3", children: i("items per page") })
     ] }),
-    g && /* @__PURE__ */ i("li", { className: "mb-3 mr-3 flex items-center", children: [
-      /* @__PURE__ */ i("span", { children: [
-        t("Page"),
+    d && /* @__PURE__ */ n("li", { className: "mb-3 mr-3 flex items-center", children: [
+      /* @__PURE__ */ n("span", { children: [
+        i("Page"),
         " "
       ] }),
-      /* @__PURE__ */ i("strong", { children: [
-        n + 1,
+      /* @__PURE__ */ n("strong", { children: [
+        t + 1,
         " of ",
-        g.length
+        d.length
       ] })
     ] }),
-    d !== void 0 && /* @__PURE__ */ i("li", { className: "mb-3 flex items-center", "data-testid": "pagination-total-items", children: [
-      t("Total"),
+    g !== void 0 && /* @__PURE__ */ n("li", { className: "mb-3 flex items-center", "data-testid": "pagination-total-items", children: [
+      i("Total"),
       ": ",
-      /* @__PURE__ */ a("strong", { className: "mx-1", children: new Intl.NumberFormat(void 0).format(d) }),
+      /* @__PURE__ */ e("strong", { className: "mx-1", children: new Intl.NumberFormat(void 0).format(g) }),
       " ",
-      t("items")
+      i("items")
     ] })
   ] });
 }
-k("Pagination", T);
+z("Pagination", _);
 export {
-  T as Pagination
+  _ as Pagination
 };
 //# sourceMappingURL=Pagination.js.map

package/dist/molecules/pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sources":["../../../src/molecules/pagination/Pagination.tsx"],"sourcesContent":["import classnames from \"classnames\";\n\nimport { getComponent, registerComponent } from \"../../registries/components\";\nimport type { Select as DefaultSelect } from \"../forms/select/Select\";\nimport { getPageNumbers, LEFT_PAGE, RIGHT_PAGE } from \"../table\";\nimport type { PaginationButton as DefaultPaginationButton } from \"./PaginationButton\";\n\nexport interface PaginationProps {\n  className?: string;\n  pageSizes?: number[];\n  gotoPage: any;\n  canPreviousPage: boolean;\n  previousPage: any;\n  nextPage: any;\n  canNextPage: boolean;\n  pageCount: number;\n  pageIndex: number;\n  pageOptions?: number[];\n  pageSize: number;\n  setPageSize: any;\n  totalLength?: number;\n  layout?: \"html5\" | \"react\" | \"choicesjs\";\n  i18n?: (f: string) => string;\n}\n\nexport function Pagination(props: PaginationProps) {\n  const {\n    className,\n    pageSizes = [10, 25, 50, 100],\n    gotoPage,\n    canPreviousPage,\n    previousPage,\n    nextPage,\n    canNextPage,\n    pageCount,\n    pageIndex = 1,\n    pageOptions,\n    pageSize,\n    setPageSize,\n    totalLength,\n    i18n = (f: string) => f\n  } = props;\n\n  const pageNumbers = getPageNumbers({\n    currentPage: pageIndex,\n    // pageNeighbours,\n    totalPages: pageCount\n  });\n  const choices: any[] = pageSizes.map((value) => ({ value, label: value }));\n  const Select = getComponent<typeof DefaultSelect>(\"Select\");\n  const PaginationButton = getComponent<typeof DefaultPaginationButton>(\"PaginationButton\");\n\n  return (\n    <nav aria-label='Page navigation' className={classnames(\"pagination-group -mb-3\", className)}>\n      <ul className='pagination mb-3 mr-3'>\n        <li className={classnames(\"page-item\", !canPreviousPage && \"disabled\")}>\n          <PaginationButton tabIndex={-1} disabled={!canPreviousPage} onClick={() => previousPage()}>\n            {i18n(\"Previous\")}\n          </PaginationButton>\n        </li>\n\n        {pageNumbers.map((page) => {\n          if ([LEFT_PAGE, RIGHT_PAGE].includes(page)) {\n            return (\n              <li className='page-item' key={page}>\n                <PaginationButton aria-hidden='true'>...</PaginationButton>\n              </li>\n            );\n          }\n\n          const active = page - 1 === pageIndex;\n          return (\n            <li className={classnames(\"page-item\", active && \"active\")} key={page}>\n              <PaginationButton tabIndex={pageIndex} active={active} onClick={() => gotoPage(page - 1)}>\n                {page}\n              </PaginationButton>\n            </li>\n          );\n        })}\n\n        <li className={classnames(\"page-item\", !canNextPage && \"disabled\")}>\n          <PaginationButton tabIndex={pageNumbers.length} disabled={!canNextPage} onClick={() => nextPage()}>\n            {i18n(\"Next\")}\n          </PaginationButton>\n        </li>\n      </ul>\n\n      <li className='mb-3 mr-3 flex items-center'>\n        <Select<number>\n          name={\"page\"}\n          value={pageSize}\n          options={choices}\n          multiple={false}\n          layout={props.layout}\n          onChange={(_, value) => {\n            setPageSize(+value);\n          }}\n        />\n        <span className={\"ml-3\"}>{i18n(\"items per page\")}</span>\n      </li>\n      {pageOptions && (\n        <li className={\"mb-3 mr-3 flex items-center\"}>\n          <span>{i18n(\"Page\")}&nbsp;</span>\n          <strong>\n            {pageIndex + 1} of {pageOptions.length}\n          </strong>\n        </li>\n      )}\n      {totalLength !== undefined && (\n        <li className={\"mb-3 flex items-center\"} data-testid='pagination-total-items'>\n          {i18n(\"Total\")}: <strong className='mx-1'>{new Intl.NumberFormat(undefined).format(totalLength)}</strong> {i18n(\"items\")}\n        </li>\n      )}\n    </nav>\n  );\n}\n\nregisterComponent(\"Pagination\", Pagination);\n"],"names":["Pagination","props","className","pageSizes","gotoPage","canPreviousPage","previousPage","nextPage","canNextPage","pageCount","pageIndex","pageOptions","pageSize","setPageSize","totalLength","i18n","f","pageNumbers","getPageNumbers","choices","value","Select","getComponent","PaginationButton","jsxs","classnames","jsx","page","LEFT_PAGE","RIGHT_PAGE","active","_","registerComponent"],"mappings":";;;;;;;;;;;;;AAyBO,SAASA,EAAWC,GAAwB;AAC3C,QAAA;AAAA,IACJ,WAAAC;AAAA,IACA,WAAAC,IAAY,CAAC,IAAI,IAAI,IAAI,GAAG;AAAA,IAC5B,UAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,MAAAC,IAAO,CAACC,MAAcA;AAAA,EAAA,IACpBf,GAEEgB,IAAcC,EAAe;AAAA,IACjC,aAAaR;AAAA;AAAA,IAEb,YAAYD;AAAA,EAAA,CACb,GACKU,IAAiBhB,EAAU,IAAI,CAACiB,OAAW,EAAE,OAAAA,GAAO,OAAOA,EAAA,EAAQ,GACnEC,IAASC,EAAmC,QAAQ,GACpDC,IAAmBD,EAA6C,kBAAkB;AAGtF,SAAA,gBAAAE,EAAC,SAAI,cAAW,mBAAkB,WAAWC,EAAW,0BAA0BvB,CAAS,GACzF,UAAA;AAAA,IAAC,gBAAAsB,EAAA,MAAA,EAAG,WAAU,wBACZ,UAAA;AAAA,MAAC,gBAAAE,EAAA,MAAA,EAAG,WAAWD,EAAW,aAAa,CAACpB,KAAmB,UAAU,GACnE,UAAA,gBAAAqB,EAACH,GAAiB,EAAA,UAAU,IAAI,UAAU,CAAClB,GAAiB,SAAS,MAAMC,EACxE,GAAA,UAAAS,EAAK,UAAU,EAAA,CAClB,EACF,CAAA;AAAA,MAECE,EAAY,IAAI,CAACU,MAAS;AACzB,YAAI,CAACC,GAAWC,CAAU,EAAE,SAASF,CAAI;AAErC,iBAAA,gBAAAD,EAAC,MAAG,EAAA,WAAU,aACZ,UAAA,gBAAAA,EAACH,KAAiB,eAAY,QAAO,UAAG,MAAA,CAAA,EAAA,GADXI,CAE/B;AAIE,cAAAG,IAASH,IAAO,MAAMjB;AAE1B,eAAA,gBAAAgB,EAAC,QAAG,WAAWD,EAAW,aAAaK,KAAU,QAAQ,GACvD,UAAC,gBAAAJ,EAAAH,GAAA,EAAiB,UAAUb,GAAW,QAAAoB,GAAgB,SAAS,MAAM1B,EAASuB,IAAO,CAAC,GACpF,UACHA,GAAA,EAAA,GAH+DA,CAIjE;AAAA,MAAA,CAEH;AAAA,MAED,gBAAAD,EAAC,MAAG,EAAA,WAAWD,EAAW,aAAa,CAACjB,KAAe,UAAU,GAC/D,UAAA,gBAAAkB,EAACH,GAAiB,EAAA,UAAUN,EAAY,QAAQ,UAAU,CAACT,GAAa,SAAS,MAAMD,KACpF,UAAAQ,EAAK,MAAM,EACd,CAAA,EACF,CAAA;AAAA,IAAA,GACF;AAAA,IAEA,gBAAAS,EAAC,MAAG,EAAA,WAAU,+BACZ,UAAA;AAAA,MAAA,gBAAAE;AAAA,QAACL;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,OAAOT;AAAA,UACP,SAASO;AAAA,UACT,UAAU;AAAA,UACV,QAAQlB,EAAM;AAAA,UACd,UAAU,CAAC8B,GAAGX,MAAU;AACtB,YAAAP,EAAY,CAACO,CAAK;AAAA,UAAA;AAAA,QACpB;AAAA,MACF;AAAA,wBACC,QAAK,EAAA,WAAW,QAAS,UAAAL,EAAK,gBAAgB,EAAE,CAAA;AAAA,IAAA,GACnD;AAAA,IACCJ,KACC,gBAAAa,EAAC,MAAG,EAAA,WAAW,+BACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,QAAM,EAAA,UAAA;AAAA,QAAAT,EAAK,MAAM;AAAA,QAAE;AAAA,MAAA,GAAM;AAAA,wBACzB,UACE,EAAA,UAAA;AAAA,QAAYL,IAAA;AAAA,QAAE;AAAA,QAAKC,EAAY;AAAA,MAAA,EAClC,CAAA;AAAA,IAAA,GACF;AAAA,IAEDG,MAAgB,UACf,gBAAAU,EAAC,QAAG,WAAW,0BAA0B,eAAY,0BAClD,UAAA;AAAA,MAAAT,EAAK,OAAO;AAAA,MAAE;AAAA,MAAE,gBAAAW,EAAC,UAAO,EAAA,WAAU,QAAQ,UAAA,IAAI,KAAK,aAAa,MAAS,EAAE,OAAOZ,CAAW,EAAE,CAAA;AAAA,MAAS;AAAA,MAAEC,EAAK,OAAO;AAAA,IAAA,EACzH,CAAA;AAAA,EAAA,GAEJ;AAEJ;AAEAiB,EAAkB,cAAchC,CAAU;"}
+{"version":3,"file":"Pagination.js","sources":["../../../src/molecules/pagination/Pagination.tsx"],"sourcesContent":["import classnames from \"classnames\";\n\nimport { useI18n } from \"../../hooks/useI18n.js\";\nimport type { FormOptions } from \"../../interfaces/index.js\";\nimport { getComponent, registerComponent } from \"../../registries/components\";\nimport type { Select as DefaultSelect } from \"../forms/select/Select\";\nimport type { PaginationButton as DefaultPaginationButton } from \"./PaginationButton\";\nimport { getPageNumbers, LEFT_PAGE, RIGHT_PAGE } from \"./utils/getPageNumbers.js\";\n\nexport interface PaginationProps {\n  className?: string;\n  pageSizes?: number[];\n  canPreviousPage: boolean;\n  canNextPage: boolean;\n  pageCount: number;\n  pageIndex: number;\n  pageOptions?: number[];\n  pageSize: number;\n  rowCount?: number;\n  layout?: \"html5\" | \"react\" | \"choicesjs\";\n  i18n?: FormOptions[\"i18n\"];\n  onPageIndexChange: (pageIndex: number) => void;\n  onClickPreviousPage: () => void;\n  onClickNextPage: () => void;\n  onPageSizeChange: (pageSize: number) => void;\n}\n\nexport function Pagination(props: PaginationProps) {\n  const {\n    className,\n    pageSizes = [10, 25, 50, 100],\n    onPageIndexChange,\n    canPreviousPage,\n    onClickPreviousPage,\n    onClickNextPage,\n    canNextPage,\n    pageCount,\n    pageIndex = 1,\n    pageOptions,\n    pageSize,\n    onPageSizeChange,\n    rowCount\n  } = props;\n  const { t } = useI18n(props.i18n);\n\n  const pageNumbers = getPageNumbers({\n    currentPage: pageIndex,\n    // pageNeighbours,\n    totalPages: pageCount\n  });\n\n  const options: any[] = pageSizes.map((value) => ({ value, label: value }));\n  const Select = getComponent<typeof DefaultSelect>(\"Select\");\n  const PaginationButton = getComponent<typeof DefaultPaginationButton>(\"PaginationButton\");\n\n  return (\n    <nav aria-label='Page navigation' className={classnames(\"pagination-group -mb-3\", className)}>\n      <ul className='pagination mb-3 mr-3'>\n        <li className={classnames(\"page-item\", !canPreviousPage && \"disabled\")}>\n          <PaginationButton tabIndex={-1} disabled={!canPreviousPage} onClick={() => onClickPreviousPage()}>\n            {t(\"Previous\")}\n          </PaginationButton>\n        </li>\n\n        {pageNumbers.map((page) => {\n          if ([LEFT_PAGE, RIGHT_PAGE].includes(page)) {\n            return (\n              <li className='page-item' key={page}>\n                <PaginationButton aria-hidden='true'>...</PaginationButton>\n              </li>\n            );\n          }\n\n          const active = page - 1 === pageIndex;\n          return (\n            <li className={classnames(\"page-item\", active && \"active\")} key={page}>\n              <PaginationButton tabIndex={pageIndex} active={active} onClick={() => onPageIndexChange(page - 1)}>\n                {page}\n              </PaginationButton>\n            </li>\n          );\n        })}\n\n        <li className={classnames(\"page-item\", !canNextPage && \"disabled\")}>\n          <PaginationButton tabIndex={pageNumbers.length} disabled={!canNextPage} onClick={() => onClickNextPage()}>\n            {t(\"Next\")}\n          </PaginationButton>\n        </li>\n      </ul>\n\n      <li className='mb-3 mr-3 flex items-center'>\n        <Select<number>\n          name={\"page\"}\n          value={pageSize}\n          options={options}\n          multiple={false}\n          layout={props.layout}\n          onChange={(_, value) => {\n            onPageSizeChange(+value);\n          }}\n        />\n        <span className={\"ml-3\"}>{t(\"items per page\")}</span>\n      </li>\n      {pageOptions && (\n        <li className={\"mb-3 mr-3 flex items-center\"}>\n          <span>{t(\"Page\")}&nbsp;</span>\n          <strong>\n            {pageIndex + 1} of {pageOptions.length}\n          </strong>\n        </li>\n      )}\n      {rowCount !== undefined && (\n        <li className={\"mb-3 flex items-center\"} data-testid='pagination-total-items'>\n          {t(\"Total\")}: <strong className='mx-1'>{new Intl.NumberFormat(undefined).format(rowCount)}</strong> {t(\"items\")}\n        </li>\n      )}\n    </nav>\n  );\n}\n\nregisterComponent(\"Pagination\", Pagination);\n"],"names":["Pagination","props","className","pageSizes","onPageIndexChange","canPreviousPage","onClickPreviousPage","onClickNextPage","canNextPage","pageCount","pageIndex","pageOptions","pageSize","onPageSizeChange","rowCount","t","useI18n","pageNumbers","getPageNumbers","options","value","Select","getComponent","PaginationButton","jsxs","classnames","jsx","page","LEFT_PAGE","RIGHT_PAGE","active","_","registerComponent"],"mappings":"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"}

package/dist/molecules/pagination/PaginationButton.js

@@ -1,20 +1,20 @@
-import { jsx as s } from "react/jsx-runtime";
-import { c as r } from "../../chunks/index.js";
-import { registerComponent as m } from "../../registries/components.js";
+import { jsx as r } from "react/jsx-runtime";
+import { c as m } from "../../chunks/index.js";
+import { registerComponent as s } from "../../registries/components.js";
 function c(t) {
-  const { component: o = "button", children: a, disabled: n, active: e, ...i } = t;
-  return /* @__PURE__ */ s(
-    o,
+  const { component: n = "button", children: a, disabled: o, active: i, ...e } = t;
+  return /* @__PURE__ */ r(
+    n,
     {
-      ...i,
+      ...e,
       "data-testid": "pagination-button",
-      disabled: n,
-      className: r("page-link", n ? "disabled" : "", "", t.className),
+      disabled: o,
+      className: m("page-link", o ? "disabled" : "", "", t.className),
       children: a
     }
   );
 }
-m("PaginationButton", c);
+s("PaginationButton", c);
 export {
   c as PaginationButton
 };

package/dist/molecules/pagination/PaginationButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationButton.js","sources":["../../../src/molecules/pagination/PaginationButton.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { PropsWithChildren } from \"react\";\n\nimport { registerComponent } from \"../../registries/components\";\n\nexport function PaginationButton(\n  props: PropsWithChildren<\n    {\n      component?: any;\n      disabled?: boolean;\n      className?: string;\n      active?: boolean;\n    } & Record<string, any>\n  >\n) {\n  const { component: Component = \"button\", children, disabled, active, ...otherProps } = props;\n\n  return (\n    <Component\n      {...otherProps}\n      data-testid='pagination-button'\n      disabled={disabled}\n      className={classnames(\"page-link\", disabled ? \"disabled\" : \"\", active ? \"\" : \"\", props.className)}\n    >\n      {children}\n    </Component>\n  );\n}\n\nregisterComponent(\"PaginationButton\", PaginationButton);\n"],"names":["PaginationButton","props","Component","children","disabled","active","otherProps","jsx","classnames","registerComponent"],"mappings":";;;AAKO,SAASA,EACdC,GAQA;AACM,QAAA,EAAE,WAAWC,IAAY,UAAU,UAAAC,GAAU,UAAAC,GAAU,QAAAC,GAAQ,GAAGC,EAAA,IAAeL;AAGrF,SAAA,gBAAAM;AAAA,IAACL;AAAA,IAAA;AAAA,MACE,GAAGI;AAAA,MACJ,eAAY;AAAA,MACZ,UAAAF;AAAA,MACA,WAAWI,EAAW,aAAaJ,IAAW,aAAa,IAAa,IAASH,EAAM,SAAS;AAAA,MAE/F,UAAAE;AAAA,IAAA;AAAA,EACH;AAEJ;AAEAM,EAAkB,oBAAoBT,CAAgB;"}
+{"version":3,"file":"PaginationButton.js","sources":["../../../src/molecules/pagination/PaginationButton.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { PropsWithChildren } from \"react\";\n\nimport { registerComponent } from \"../../registries/components\";\n\nexport function PaginationButton(\n  props: PropsWithChildren<\n    {\n      component?: any;\n      disabled?: boolean;\n      className?: string;\n      active?: boolean;\n    } & Record<string, any>\n  >\n) {\n  const { component: Component = \"button\", children, disabled, active, ...otherProps } = props;\n\n  return (\n    <Component\n      {...otherProps}\n      data-testid='pagination-button'\n      disabled={disabled}\n      className={classnames(\"page-link\", disabled ? \"disabled\" : \"\", active ? \"\" : \"\", props.className)}\n    >\n      {children}\n    </Component>\n  );\n}\n\nregisterComponent(\"PaginationButton\", PaginationButton);\n"],"names":["PaginationButton","props","Component","children","disabled","active","otherProps","jsx","classnames","registerComponent"],"mappings":";;;AAKO,SAASA,EACdC,GAQA;AACA,QAAM,EAAE,WAAWC,IAAY,UAAU,UAAAC,GAAU,UAAAC,GAAU,QAAAC,GAAQ,GAAGC,EAAA,IAAeL;AAEvF,SACE,gBAAAM;AAAA,IAACL;AAAA,IAAA;AAAA,MACE,GAAGI;AAAA,MACJ,eAAY;AAAA,MACZ,UAAAF;AAAA,MACA,WAAWI,EAAW,aAAaJ,IAAW,aAAa,IAAa,IAASH,EAAM,SAAS;AAAA,MAE/F,UAAAE;AAAA,IAAA;AAAA,EAAA;AAGP;AAEAM,EAAkB,oBAAoBT,CAAgB;"}

package/dist/molecules/pagination/utils/getPageNumbers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getPageNumbers.js","sources":["../../../../src/molecules/pagination/utils/getPageNumbers.ts"],"sourcesContent":["export const LEFT_PAGE = \"LEFT\";\nexport const RIGHT_PAGE = \"RIGHT\";\n\nfunction range(from: number, to: number, step = 1): any[] {\n  let i = from;\n  const range = [];\n\n  while (i <= to) {\n    range.push(i);\n    i += step;\n  }\n\n  return range;\n}\n\nexport function getPageNumbers({ currentPage, pageNeighbours = 1, totalPages }: any) {\n  const totalNumbers = pageNeighbours * 2 + 3;\n  const totalBlocks = totalNumbers + 2;\n\n  if (totalPages > totalBlocks) {\n    const calculatedStartPage = Math.max(2, currentPage - pageNeighbours);\n    const calculatedEndPage = Math.min(totalPages - 1, currentPage + pageNeighbours);\n    const startPage = calculatedStartPage === 3 ? 2 : calculatedStartPage;\n    const endPage = calculatedEndPage === totalPages - 2 ? totalPages - 1 : calculatedEndPage;\n\n    let pages = range(startPage, endPage);\n\n    const hasLeftSpill = startPage > 2;\n    const hasRightSpill = totalPages - endPage > 1;\n    const spillOffset = totalNumbers - (pages.length + 1);\n    let extraPages;\n\n    if (hasLeftSpill && !hasRightSpill) {\n      extraPages = range(startPage - spillOffset, startPage - 1);\n      pages = [LEFT_PAGE, ...extraPages, ...pages];\n    } else if (!hasLeftSpill && hasRightSpill) {\n      extraPages = range(endPage + 1, endPage + spillOffset);\n      pages = [...pages, ...extraPages, RIGHT_PAGE];\n    } else {\n      pages = [LEFT_PAGE, ...pages, RIGHT_PAGE];\n    }\n\n    return [1, ...pages, totalPages];\n  }\n\n  return range(1, totalPages);\n}\n"],"names":["LEFT_PAGE","RIGHT_PAGE","range","from","to","step","i","getPageNumbers","currentPage","pageNeighbours","totalPages","totalNumbers","totalBlocks","calculatedStartPage","calculatedEndPage","startPage","endPage","pages","hasLeftSpill","hasRightSpill","spillOffset","extraPages"],"mappings":"AAAO,MAAMA,IAAY,QACZC,IAAa;AAE1B,SAASC,EAAMC,GAAcC,GAAYC,IAAO,GAAU;AACxD,MAAIC,IAAIH;AACR,QAAMD,IAAQ,CAAA;AAEd,SAAOI,KAAKF;AACVF,IAAAA,EAAM,KAAKI,CAAC,GACZA,KAAKD;AAGP,SAAOH;AACT;AAEO,SAASK,EAAe,EAAE,aAAAC,GAAa,gBAAAC,IAAiB,GAAG,YAAAC,KAAmB;AACnF,QAAMC,IAAeF,IAAiB,IAAI,GACpCG,IAAcD,IAAe;AAEnC,MAAID,IAAaE,GAAa;AAC5B,UAAMC,IAAsB,KAAK,IAAI,GAAGL,IAAcC,CAAc,GAC9DK,IAAoB,KAAK,IAAIJ,IAAa,GAAGF,IAAcC,CAAc,GACzEM,IAAYF,MAAwB,IAAI,IAAIA,GAC5CG,IAAUF,MAAsBJ,IAAa,IAAIA,IAAa,IAAII;AAExE,QAAIG,IAAQf,EAAMa,GAAWC,CAAO;AAEpC,UAAME,IAAeH,IAAY,GAC3BI,IAAgBT,IAAaM,IAAU,GACvCI,IAAcT,KAAgBM,EAAM,SAAS;AACnD,QAAII;AAEJ,WAAIH,KAAgB,CAACC,KACnBE,IAAanB,EAAMa,IAAYK,GAAaL,IAAY,CAAC,GACzDE,IAAQ,CAACjB,GAAW,GAAGqB,GAAY,GAAGJ,CAAK,KAClC,CAACC,KAAgBC,KAC1BE,IAAanB,EAAMc,IAAU,GAAGA,IAAUI,CAAW,GACrDH,IAAQ,CAAC,GAAGA,GAAO,GAAGI,GAAYpB,CAAU,KAE5CgB,IAAQ,CAACjB,GAAW,GAAGiB,GAAOhB,CAAU,GAGnC,CAAC,GAAG,GAAGgB,GAAOP,CAAU;AAAA,EACjC;AAEA,SAAOR,EAAM,GAAGQ,CAAU;AAC5B;"}

package/dist/molecules/table/Table.d.ts

@@ -1,3 +1,17 @@
 import { PropsWithChildren } from 'react';
-import { TableProps } from './hooks/useCustomTable';
-export declare function Table<Data extends object = any>(props: PropsWithChildren<TableProps<Data>>): import("react/jsx-runtime").JSX.Element;
+import { JSON } from '../../interfaces/index.js';
+import { UseTableProps } from './hooks/useTable';
+export interface TableProps<Data extends {
+    [key: string]: JSON;
+} = {
+    [key: string]: JSON;
+}> extends UseTableProps<Data> {
+    className?: string;
+    enableFooter?: boolean;
+    pageSizes?: number[];
+}
+export declare function Table<Data extends {
+    [key: string]: JSON;
+} = {
+    [key: string]: JSON;
+}>({ className, enableFooter, children, ...props }: PropsWithChildren<TableProps<Data>>): import("react/jsx-runtime").JSX.Element;