@tsed/react-formio 3.0.0-rc.14 → 3.0.0-rc.16

package/dist/molecules/table/components/DefaultBooleanCell.js

@@ -1,8 +1,8 @@
 import { jsx as r } from "react/jsx-runtime";
 import { registerComponent as o } from "../../../registries/components.js";
-function l({ getValue: t, column: { columnDef: e } }) {
-  const n = t();
-  return /* @__PURE__ */ r("span", { children: String(n ? e.meta?.labels?.yes || "Yes" : e.meta?.labels?.No || "No") });
+function l({ getValue: n, column: { columnDef: e } }) {
+  const t = n();
+  return /* @__PURE__ */ r("span", { children: String(t ? e.meta?.labels?.yes || "Yes" : e.meta?.labels?.no || "No") });
 }
 o("Cell.boolean", l);
 o("Cell.checkbox", l);

package/dist/molecules/table/components/DefaultBooleanCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultBooleanCell.js","sources":["../../../../src/molecules/table/components/DefaultBooleanCell.tsx"],"sourcesContent":["import { CellContext } from \"@tanstack/react-table\";\n\nimport { registerComponent } from \"../../../registries/components\";\n\nexport function DefaultCellBoolean<Data extends object>({ getValue, column: { columnDef } }: CellContext<Data, boolean>) {\n  const value = getValue();\n  return <span>{String(value ? columnDef.meta?.labels?.[\"yes\"] || \"Yes\" : columnDef.meta?.labels?.[\"No\"] || \"No\")}</span>;\n}\n\nregisterComponent(\"Cell.boolean\", DefaultCellBoolean);\nregisterComponent(\"Cell.checkbox\", DefaultCellBoolean);\n"],"names":["DefaultCellBoolean","getValue","columnDef","value","registerComponent"],"mappings":";;AAIO,SAASA,EAAwC,EAAE,UAAAC,GAAU,QAAQ,EAAE,WAAAC,EAAA,KAA2C;AACvH,QAAMC,IAAQF,EAAA;AACd,2BAAQ,QAAA,EAAM,UAAA,OAAOE,IAAQD,EAAU,MAAM,QAAS,OAAU,QAAQA,EAAU,MAAM,QAAS,MAAS,IAAI,GAAE;AAClH;AAEAE,EAAkB,gBAAgBJ,CAAkB;AACpDI,EAAkB,iBAAiBJ,CAAkB;"}
+{"version":3,"file":"DefaultBooleanCell.js","sources":["../../../../src/molecules/table/components/DefaultBooleanCell.tsx"],"sourcesContent":["import { CellContext } from \"@tanstack/react-table\";\n\nimport { registerComponent } from \"../../../registries/components\";\n\nexport function DefaultCellBoolean<Data extends object>({ getValue, column: { columnDef } }: CellContext<Data, boolean>) {\n  const value = getValue();\n  return <span>{String(value ? columnDef.meta?.labels?.[\"yes\"] || \"Yes\" : columnDef.meta?.labels?.[\"no\"] || \"No\")}</span>;\n}\n\nregisterComponent(\"Cell.boolean\", DefaultCellBoolean);\nregisterComponent(\"Cell.checkbox\", DefaultCellBoolean);\n"],"names":["DefaultCellBoolean","getValue","columnDef","value","registerComponent"],"mappings":";;AAIO,SAASA,EAAwC,EAAE,UAAAC,GAAU,QAAQ,EAAE,WAAAC,EAAA,KAA2C;AACvH,QAAMC,IAAQF,EAAA;AACd,2BAAQ,QAAA,EAAM,UAAA,OAAOE,IAAQD,EAAU,MAAM,QAAS,OAAU,QAAQA,EAAU,MAAM,QAAS,MAAS,IAAI,GAAE;AAClH;AAEAE,EAAkB,gBAAgBJ,CAAkB;AACpDI,EAAkB,iBAAiBJ,CAAkB;"}

package/dist/molecules/table/filters/SelectFilter.js

@@ -1,34 +1,35 @@
-import { jsx as o, Fragment as s } from "react/jsx-runtime";
-import { registerComponent as a, getComponent as p } from "../../../registries/components.js";
+import { jsx as t, Fragment as a } from "react/jsx-runtime";
+import { registerComponent as o, getComponent as p } from "../../../registries/components.js";
 import { useUniqValues as f } from "../hooks/useUniqValues.js";
-function F({ header: t, options: e }) {
-  const n = p("Select"), i = t.column.getFilterValue(), c = f({ header: t, filterVariant: "text" }), m = e.layout === "choicesjs" ? {
+function n({ header: e, options: l }) {
+  const c = p("Select"), i = e.column.getFilterValue(), u = f({ header: e }), m = l.layout === "choicesjs" ? {
     placeholder: void 0
   } : {
-    placeholder: `Filter by ${t.column.columnDef.header}`
+    placeholder: `Filter by ${e.column.columnDef.header}`
   }, r = [
     {
-      label: `Filter by ${t.column.columnDef.header}`,
+      label: `Filter by ${e.column.columnDef.header}`,
       value: ""
     }
-  ].concat(e.options || c.map((l) => ({ label: l, value: l })));
-  return /* @__PURE__ */ o(s, { children: /* @__PURE__ */ o(
-    n,
+  ].concat(l.options || u);
+  return /* @__PURE__ */ t(a, { children: /* @__PURE__ */ t(
+    c,
     {
       size: "small",
-      ...e,
+      ...l,
       ...m,
       autoComplete: "off",
       options: r,
-      name: `filter_${t.column.id}`,
-      "data-testid": `filter_${t.column.id}`,
+      name: `filter_${e.column.id}`,
+      "data-testid": `filter_${e.column.id}`,
       value: i,
-      onChange: (l, u) => t.column.setFilterValue(u)
+      onChange: (F, s) => e.column.setFilterValue(s)
     }
   ) });
 }
-a("Filter.select", F);
+o("Filter.select", n);
+o("Filter.boolean", n);
 export {
-  F as SelectFilter
+  n as SelectFilter
 };
 //# sourceMappingURL=SelectFilter.js.map

package/dist/molecules/table/filters/SelectFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectFilter.js","sources":["../../../../src/molecules/table/filters/SelectFilter.tsx"],"sourcesContent":["import { getComponent, registerComponent } from \"../../../registries/components\";\nimport type { Select as DefaultSelect } from \"../../forms/select/Select\";\nimport { SelectOptionProps } from \"../../forms/select/Select.interface\";\nimport type { FilterProps } from \"../components/DefaultFilter\";\nimport { useUniqValues } from \"../hooks/useUniqValues\";\nimport { FilterSelectOptions } from \"./Filters\";\n\nexport function SelectFilter<Data = any>({ header, options }: FilterProps<Data, FilterSelectOptions>) {\n  const Select = getComponent<typeof DefaultSelect>(\"Select\");\n  const columnFilterValue = header.column.getFilterValue();\n  const uniqValues = useUniqValues<Data>({ header, filterVariant: \"text\" });\n\n  const opts =\n    options.layout === \"choicesjs\"\n      ? {\n          placeholder: undefined\n        }\n      : {\n          placeholder: `Filter by ${header.column.columnDef.header}`\n        };\n\n  const listOptions = (\n    [\n      {\n        label: `Filter by ${header.column.columnDef.header}`,\n        value: \"\"\n      }\n    ] as SelectOptionProps[]\n  ).concat(options.options || uniqValues.map((value: any) => ({ label: value, value })));\n\n  return (\n    <>\n      <Select<string>\n        size='small'\n        {...(options as any)}\n        {...opts}\n        autoComplete='off'\n        options={listOptions}\n        name={`filter_${header.column.id}`}\n        data-testid={`filter_${header.column.id}`}\n        value={columnFilterValue as string}\n        onChange={(_, value) => header.column.setFilterValue(value)}\n      />\n    </>\n  );\n}\n\nregisterComponent(\"Filter.select\", SelectFilter);\n"],"names":["SelectFilter","header","options","Select","getComponent","columnFilterValue","uniqValues","useUniqValues","opts","listOptions","value","jsx","Fragment","_","registerComponent"],"mappings":";;;AAOO,SAASA,EAAyB,EAAE,QAAAC,GAAQ,SAAAC,KAAmD;AACpG,QAAMC,IAASC,EAAmC,QAAQ,GACpDC,IAAoBJ,EAAO,OAAO,eAAA,GAClCK,IAAaC,EAAoB,EAAE,QAAAN,GAAQ,eAAe,QAAQ,GAElEO,IACJN,EAAQ,WAAW,cACf;AAAA,IACE,aAAa;AAAA,EAAA,IAEf;AAAA,IACE,aAAa,aAAaD,EAAO,OAAO,UAAU,MAAM;AAAA,EAAA,GAG1DQ,IACJ;AAAA,IACE;AAAA,MACE,OAAO,aAAaR,EAAO,OAAO,UAAU,MAAM;AAAA,MAClD,OAAO;AAAA,IAAA;AAAA,EACT,EAEF,OAAOC,EAAQ,WAAWI,EAAW,IAAI,CAACI,OAAgB,EAAE,OAAOA,GAAO,OAAAA,EAAA,EAAQ,CAAC;AAErF,SACE,gBAAAC,EAAAC,GAAA,EACE,UAAA,gBAAAD;AAAA,IAACR;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAID;AAAA,MACJ,GAAGM;AAAA,MACJ,cAAa;AAAA,MACb,SAASC;AAAA,MACT,MAAM,UAAUR,EAAO,OAAO,EAAE;AAAA,MAChC,eAAa,UAAUA,EAAO,OAAO,EAAE;AAAA,MACvC,OAAOI;AAAA,MACP,UAAU,CAACQ,GAAGH,MAAUT,EAAO,OAAO,eAAeS,CAAK;AAAA,IAAA;AAAA,EAAA,GAE9D;AAEJ;AAEAI,EAAkB,iBAAiBd,CAAY;"}
+{"version":3,"file":"SelectFilter.js","sources":["../../../../src/molecules/table/filters/SelectFilter.tsx"],"sourcesContent":["import { getComponent, registerComponent } from \"../../../registries/components\";\nimport type { Select as DefaultSelect } from \"../../forms/select/Select\";\nimport { SelectOptionProps } from \"../../forms/select/Select.interface\";\nimport type { FilterProps } from \"../components/DefaultFilter\";\nimport { useUniqValues } from \"../hooks/useUniqValues\";\nimport { FilterSelectOptions } from \"./Filters\";\n\nexport function SelectFilter<Data = any>({ header, options }: FilterProps<Data, FilterSelectOptions>) {\n  const Select = getComponent<typeof DefaultSelect>(\"Select\");\n  const columnFilterValue = header.column.getFilterValue();\n  const uniqValues = useUniqValues<Data>({ header });\n\n  const opts =\n    options.layout === \"choicesjs\"\n      ? {\n          placeholder: undefined\n        }\n      : {\n          placeholder: `Filter by ${header.column.columnDef.header}`\n        };\n\n  const listOptions = (\n    [\n      {\n        label: `Filter by ${header.column.columnDef.header}`,\n        value: \"\"\n      }\n    ] as SelectOptionProps[]\n  ).concat(options.options || uniqValues);\n\n  return (\n    <>\n      <Select<string>\n        size='small'\n        {...(options as any)}\n        {...opts}\n        autoComplete='off'\n        options={listOptions}\n        name={`filter_${header.column.id}`}\n        data-testid={`filter_${header.column.id}`}\n        value={columnFilterValue as string}\n        onChange={(_, value) => header.column.setFilterValue(value)}\n      />\n    </>\n  );\n}\n\nregisterComponent(\"Filter.select\", SelectFilter);\nregisterComponent(\"Filter.boolean\", SelectFilter);\n"],"names":["SelectFilter","header","options","Select","getComponent","columnFilterValue","uniqValues","useUniqValues","opts","listOptions","jsx","Fragment","_","value","registerComponent"],"mappings":";;;AAOO,SAASA,EAAyB,EAAE,QAAAC,GAAQ,SAAAC,KAAmD;AACpG,QAAMC,IAASC,EAAmC,QAAQ,GACpDC,IAAoBJ,EAAO,OAAO,eAAA,GAClCK,IAAaC,EAAoB,EAAE,QAAAN,GAAQ,GAE3CO,IACJN,EAAQ,WAAW,cACf;AAAA,IACE,aAAa;AAAA,EAAA,IAEf;AAAA,IACE,aAAa,aAAaD,EAAO,OAAO,UAAU,MAAM;AAAA,EAAA,GAG1DQ,IACJ;AAAA,IACE;AAAA,MACE,OAAO,aAAaR,EAAO,OAAO,UAAU,MAAM;AAAA,MAClD,OAAO;AAAA,IAAA;AAAA,EACT,EAEF,OAAOC,EAAQ,WAAWI,CAAU;AAEtC,SACE,gBAAAI,EAAAC,GAAA,EACE,UAAA,gBAAAD;AAAA,IAACP;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAID;AAAA,MACJ,GAAGM;AAAA,MACJ,cAAa;AAAA,MACb,SAASC;AAAA,MACT,MAAM,UAAUR,EAAO,OAAO,EAAE;AAAA,MAChC,eAAa,UAAUA,EAAO,OAAO,EAAE;AAAA,MACvC,OAAOI;AAAA,MACP,UAAU,CAACO,GAAGC,MAAUZ,EAAO,OAAO,eAAeY,CAAK;AAAA,IAAA;AAAA,EAAA,GAE9D;AAEJ;AAEAC,EAAkB,iBAAiBd,CAAY;AAC/Cc,EAAkB,kBAAkBd,CAAY;"}

package/dist/molecules/table/filters/TextFieldFilter.js

@@ -1,10 +1,10 @@
-import { jsxs as a, Fragment as u, jsx as i } from "react/jsx-runtime";
+import { jsxs as r, Fragment as a, jsx as i } from "react/jsx-runtime";
 import { registerComponent as c, getComponent as d } from "../../../registries/components.js";
 import { useUniqValues as p } from "../hooks/useUniqValues.js";
-function f({ header: t, options: e }) {
-  const o = d("InputText"), m = t.column.getFilterValue(), r = p({ header: t, filterVariant: "text" }), n = `data_list_${t.column.id}`;
-  return /* @__PURE__ */ a(u, { children: [
-    !e.disableDatalist && /* @__PURE__ */ i("datalist", { id: n, children: r.map((l) => /* @__PURE__ */ i("option", { value: l }, l)) }),
+function F({ header: t, options: e }) {
+  const o = d("InputText"), m = t.column.getFilterValue(), s = p({ header: t }), n = `data_list_${t.column.id}`;
+  return /* @__PURE__ */ r(a, { children: [
+    !e.disableDatalist && /* @__PURE__ */ i("datalist", { id: n, children: s.map((l) => /* @__PURE__ */ i("option", { value: l }, l)) }),
     /* @__PURE__ */ i(
       o,
       {
@@ -15,13 +15,13 @@ function f({ header: t, options: e }) {
         "data-testid": `filter_${t.column.id}`,
         value: m ?? "",
         list: n,
-        onChange: (l, s) => t.column.setFilterValue(s)
+        onChange: (l, u) => t.column.setFilterValue(u)
       }
     )
   ] });
 }
-c("Filter.text", f);
+c("Filter.text", F);
 export {
-  f as TextFieldFilter
+  F as TextFieldFilter
 };
 //# sourceMappingURL=TextFieldFilter.js.map

package/dist/molecules/table/filters/TextFieldFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextFieldFilter.js","sources":["../../../../src/molecules/table/filters/TextFieldFilter.tsx"],"sourcesContent":["import { getComponent, registerComponent } from \"../../../registries/components\";\nimport type { InputText as DefaultInputText } from \"../../forms/input-text/InputText\";\nimport type { FilterProps } from \"../components/DefaultFilter\";\nimport { useUniqValues } from \"../hooks/useUniqValues\";\nimport { FilterTextOptions } from \"./Filters\";\n\nexport function TextFieldFilter<Data = any>({ header, options }: FilterProps<Data, FilterTextOptions>) {\n  const InputText = getComponent<typeof DefaultInputText>(\"InputText\");\n  const columnFilterValue = header.column.getFilterValue();\n  const uniqValues = useUniqValues<Data>({ header, filterVariant: \"text\" });\n  const datalistId = `data_list_${header.column.id}`;\n\n  return (\n    <>\n      {!options.disableDatalist && (\n        <datalist id={datalistId}>\n          {uniqValues.map((value: any) => (\n            <option value={value} key={value} />\n          ))}\n        </datalist>\n      )}\n      <InputText<string>\n        size='small'\n        placeholder={`Filter by ${header.column.columnDef.header}`}\n        {...options}\n        name={`filter_${header.column.id}`}\n        data-testid={`filter_${header.column.id}`}\n        value={(columnFilterValue ?? \"\") as string}\n        list={datalistId}\n        onChange={(_, value) => header.column.setFilterValue(value)}\n      />\n    </>\n  );\n}\n\nregisterComponent(\"Filter.text\", TextFieldFilter);\n"],"names":["TextFieldFilter","header","options","InputText","getComponent","columnFilterValue","uniqValues","useUniqValues","datalistId","jsxs","Fragment","jsx","value","_","registerComponent"],"mappings":";;;AAMO,SAASA,EAA4B,EAAE,QAAAC,GAAQ,SAAAC,KAAiD;AACrG,QAAMC,IAAYC,EAAsC,WAAW,GAC7DC,IAAoBJ,EAAO,OAAO,eAAA,GAClCK,IAAaC,EAAoB,EAAE,QAAAN,GAAQ,eAAe,QAAQ,GAClEO,IAAa,aAAaP,EAAO,OAAO,EAAE;AAEhD,SACE,gBAAAQ,EAAAC,GAAA,EACG,UAAA;AAAA,IAAA,CAACR,EAAQ,mBACR,gBAAAS,EAAC,YAAA,EAAS,IAAIH,GACX,UAAAF,EAAW,IAAI,CAACM,MACf,gBAAAD,EAAC,UAAA,EAAO,OAAAC,KAAmBA,CAAO,CACnC,GACH;AAAA,IAEF,gBAAAD;AAAA,MAACR;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,aAAa,aAAaF,EAAO,OAAO,UAAU,MAAM;AAAA,QACvD,GAAGC;AAAA,QACJ,MAAM,UAAUD,EAAO,OAAO,EAAE;AAAA,QAChC,eAAa,UAAUA,EAAO,OAAO,EAAE;AAAA,QACvC,OAAQI,KAAqB;AAAA,QAC7B,MAAMG;AAAA,QACN,UAAU,CAACK,GAAGD,MAAUX,EAAO,OAAO,eAAeW,CAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAC5D,GACF;AAEJ;AAEAE,EAAkB,eAAed,CAAe;"}
+{"version":3,"file":"TextFieldFilter.js","sources":["../../../../src/molecules/table/filters/TextFieldFilter.tsx"],"sourcesContent":["import { getComponent, registerComponent } from \"../../../registries/components\";\nimport type { InputText as DefaultInputText } from \"../../forms/input-text/InputText\";\nimport type { FilterProps } from \"../components/DefaultFilter\";\nimport { useUniqValues } from \"../hooks/useUniqValues\";\nimport { FilterTextOptions } from \"./Filters\";\n\nexport function TextFieldFilter<Data = any>({ header, options }: FilterProps<Data, FilterTextOptions>) {\n  const InputText = getComponent<typeof DefaultInputText>(\"InputText\");\n  const columnFilterValue = header.column.getFilterValue();\n  const uniqValues = useUniqValues<Data>({ header });\n  const datalistId = `data_list_${header.column.id}`;\n\n  return (\n    <>\n      {!options.disableDatalist && (\n        <datalist id={datalistId}>\n          {uniqValues.map((value: any) => (\n            <option value={value} key={value} />\n          ))}\n        </datalist>\n      )}\n      <InputText<string>\n        size='small'\n        placeholder={`Filter by ${header.column.columnDef.header}`}\n        {...options}\n        name={`filter_${header.column.id}`}\n        data-testid={`filter_${header.column.id}`}\n        value={(columnFilterValue ?? \"\") as string}\n        list={datalistId}\n        onChange={(_, value) => header.column.setFilterValue(value)}\n      />\n    </>\n  );\n}\n\nregisterComponent(\"Filter.text\", TextFieldFilter);\n"],"names":["TextFieldFilter","header","options","InputText","getComponent","columnFilterValue","uniqValues","useUniqValues","datalistId","jsxs","Fragment","jsx","value","_","registerComponent"],"mappings":";;;AAMO,SAASA,EAA4B,EAAE,QAAAC,GAAQ,SAAAC,KAAiD;AACrG,QAAMC,IAAYC,EAAsC,WAAW,GAC7DC,IAAoBJ,EAAO,OAAO,eAAA,GAClCK,IAAaC,EAAoB,EAAE,QAAAN,GAAQ,GAC3CO,IAAa,aAAaP,EAAO,OAAO,EAAE;AAEhD,SACE,gBAAAQ,EAAAC,GAAA,EACG,UAAA;AAAA,IAAA,CAACR,EAAQ,mBACR,gBAAAS,EAAC,YAAA,EAAS,IAAIH,GACX,UAAAF,EAAW,IAAI,CAACM,MACf,gBAAAD,EAAC,UAAA,EAAO,OAAAC,KAAmBA,CAAO,CACnC,GACH;AAAA,IAEF,gBAAAD;AAAA,MAACR;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,aAAa,aAAaF,EAAO,OAAO,UAAU,MAAM;AAAA,QACvD,GAAGC;AAAA,QACJ,MAAM,UAAUD,EAAO,OAAO,EAAE;AAAA,QAChC,eAAa,UAAUA,EAAO,OAAO,EAAE;AAAA,QACvC,OAAQI,KAAqB;AAAA,QAC7B,MAAMG;AAAA,QACN,UAAU,CAACK,GAAGD,MAAUX,EAAO,OAAO,eAAeW,CAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAC5D,GACF;AAEJ;AAEAE,EAAkB,eAAed,CAAe;"}

package/dist/molecules/table/hooks/useUniqValues.d.ts

@@ -1,5 +1,5 @@
 import { Header } from '@tanstack/react-table';
-export declare function useUniqValues<Data = any>({ header, filterVariant }: {
+import { SelectOptionProps } from '../../../molecules/forms/select/Select.interface';
+export declare function useUniqValues<Data = any>({ header }: {
     header: Header<Data, unknown>;
-    filterVariant: string;
-}): any[];
+}): SelectOptionProps[];

package/dist/molecules/table/hooks/useUniqValues.js

@@ -1,11 +1,21 @@
 import { useMemo as u } from "react";
-function r({ header: e, filterVariant: o }) {
-  return u(
-    () => o === "range" ? [] : Array.from(e.column.getFacetedUniqueValues().keys()).flat().sort().slice(0, 5e3),
-    [e.column, o]
-  );
+function a({ header: l }) {
+  return u(() => {
+    switch (l.column.columnDef.meta?.filter?.variant) {
+      case "boolean":
+        return [
+          { label: l.column.columnDef.meta?.labels?.yes || "Yes", value: !0 },
+          { label: l.column.columnDef.meta?.labels?.no || l.column.columnDef.meta?.labels?.No || "No", value: !1 }
+        ];
+      default:
+        return Array.from(l.column.getFacetedUniqueValues().keys()).flat().sort().slice(0, 5e3).map((e) => ({
+          label: e,
+          value: e
+        }));
+    }
+  }, [l.column]);
 }
 export {
-  r as useUniqValues
+  a as useUniqValues
 };
 //# sourceMappingURL=useUniqValues.js.map

package/dist/molecules/table/hooks/useUniqValues.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUniqValues.js","sources":["../../../../src/molecules/table/hooks/useUniqValues.tsx"],"sourcesContent":["import type { Header } from \"@tanstack/react-table\";\nimport { useMemo } from \"react\";\n\nexport function useUniqValues<Data = any>({ header, filterVariant }: { header: Header<Data, unknown>; filterVariant: string }) {\n  return useMemo(\n    () => (filterVariant === \"range\" ? [] : Array.from(header.column.getFacetedUniqueValues().keys()).flat().sort().slice(0, 5000)),\n\n    [header.column, filterVariant]\n  );\n}\n"],"names":["useUniqValues","header","filterVariant","useMemo"],"mappings":";AAGO,SAASA,EAA0B,EAAE,QAAAC,GAAQ,eAAAC,KAA2E;AAC7H,SAAOC;AAAA,IACL,MAAOD,MAAkB,UAAU,CAAA,IAAK,MAAM,KAAKD,EAAO,OAAO,uBAAA,EAAyB,KAAA,CAAM,EAAE,KAAA,EAAO,OAAO,MAAM,GAAG,GAAI;AAAA,IAE7H,CAACA,EAAO,QAAQC,CAAa;AAAA,EAAA;AAEjC;"}
+{"version":3,"file":"useUniqValues.js","sources":["../../../../src/molecules/table/hooks/useUniqValues.tsx"],"sourcesContent":["import type { Header } from \"@tanstack/react-table\";\nimport { useMemo } from \"react\";\n\nimport { SelectOptionProps } from \"../../../molecules/forms/select/Select.interface\";\n\nexport function useUniqValues<Data = any>({ header }: { header: Header<Data, unknown> }): SelectOptionProps[] {\n  return useMemo(() => {\n    switch (header.column.columnDef.meta?.filter?.variant) {\n      case \"boolean\":\n        return [\n          { label: header.column.columnDef.meta?.labels?.[\"yes\"] || \"Yes\", value: true },\n          { label: header.column.columnDef.meta?.labels?.[\"no\"] || header.column.columnDef.meta?.labels?.[\"No\"] || \"No\", value: false }\n        ];\n\n      default:\n        return Array.from(header.column.getFacetedUniqueValues().keys())\n          .flat()\n          .sort()\n          .slice(0, 5000)\n          .map((i) => ({\n            label: i,\n            value: i\n          }));\n    }\n  }, [header.column]);\n}\n"],"names":["useUniqValues","header","useMemo","i"],"mappings":";AAKO,SAASA,EAA0B,EAAE,QAAAC,KAAkE;AAC5G,SAAOC,EAAQ,MAAM;AACnB,YAAQD,EAAO,OAAO,UAAU,MAAM,QAAQ,SAAA;AAAA,MAC5C,KAAK;AACH,eAAO;AAAA,UACL,EAAE,OAAOA,EAAO,OAAO,UAAU,MAAM,QAAS,OAAU,OAAO,OAAO,GAAA;AAAA,UACxE,EAAE,OAAOA,EAAO,OAAO,UAAU,MAAM,QAAS,MAASA,EAAO,OAAO,UAAU,MAAM,QAAS,MAAS,MAAM,OAAO,GAAA;AAAA,QAAM;AAAA,MAGhI;AACE,eAAO,MAAM,KAAKA,EAAO,OAAO,uBAAA,EAAyB,MAAM,EAC5D,OACA,KAAA,EACA,MAAM,GAAG,GAAI,EACb,IAAI,CAACE,OAAO;AAAA,UACX,OAAOA;AAAA,UACP,OAAOA;AAAA,QAAA,EACP;AAAA,IAAA;AAAA,EAEV,GAAG,CAACF,EAAO,MAAM,CAAC;AACpB;"}

package/dist/molecules/table/utils/mapFormToColumns.d.ts

@@ -1,3 +1,7 @@
 import { ColumnDef, ColumnDefResolved } from '@tanstack/react-table';
 import { FormType } from '../../../interfaces';
-export declare function mapFormToColumns<Data = any>(form: FormType, columns?: ColumnDefResolved<Data, any>[]): ColumnDef<Data, any>[];
+export declare function mapFormToColumns<Data = any>({ form, columns, prefix }: {
+    form: FormType;
+    columns?: ColumnDefResolved<Data, any>[];
+    prefix?: string;
+}): ColumnDef<Data, any>[];

package/dist/molecules/table/utils/mapFormToColumns.js

@@ -1,50 +1,66 @@
-import { createColumnHelper as s } from "@tanstack/react-table";
-import { c as p } from "../../../chunks/cloneDeep.js";
-import { g as u } from "../../../chunks/_commonjsHelpers.js";
-import { r as i } from "../../../chunks/get.js";
-import { getComponent as d } from "../../../registries/components.js";
-var f = i();
-const y = /* @__PURE__ */ u(f), C = {
+import { createColumnHelper as f } from "@tanstack/react-table";
+import { c as y } from "../../../chunks/cloneDeep.js";
+import { g as C } from "../../../chunks/_commonjsHelpers.js";
+import { r as g } from "../../../chunks/get.js";
+import { getComponent as b } from "../../../registries/components.js";
+var x = g();
+const h = /* @__PURE__ */ C(x), K = {
   number: "range",
   currency: "range",
   checkbox: "boolean"
-}, b = {
+}, k = {
   date: "date",
   datetime: "date",
   number: "number",
   currency: "currency",
   checkbox: "boolean"
 };
-function P(a, m = []) {
-  const c = s(), r = p(m);
-  return a.components.flatMap((e) => e.type === "tabs" ? e.components?.flatMap((t) => t.components) : [e]).filter((e) => e?.tableView).map((e) => {
-    const t = e, o = r.findIndex(({ accessorKey: l }) => l === `data.${t.key}`);
-    let n = r[o];
-    return n && r.splice(o, 1), c.accessor(`data.${t.key}`, {
+function m(r) {
+  if ("id" in r && typeof r.id == "string")
+    return r.id;
+  if ("accessorKey" in r && typeof r.accessorKey == "string")
+    return r.accessorKey;
+}
+function S({
+  form: r,
+  columns: p = [],
+  prefix: l = "data."
+}) {
+  const d = f(), n = y(p);
+  return [...r.components.flatMap((e) => e.type === "tabs" ? e.components?.flatMap((t) => t.components) : [e]).filter((e) => e?.tableView).map((e) => {
+    const t = e, o = `${l}${t.key}`, a = /* @__PURE__ */ new Set([t.key, o]), i = n.findIndex((u) => {
+      const c = m(u);
+      return c ? a.has(c) : !1;
+    });
+    let s = n[i];
+    return s && n.splice(i, 1), d.accessor(o, {
       header: (t.label || t.title || t.key)?.replace(/:/, ""),
       meta: {
-        type: b[t.type] || t.type,
+        type: k[t.type] || t.type,
         filter: {
-          ...n?.meta?.filter,
-          variant: C[t.type] || "text"
+          ...s?.meta?.filter,
+          variant: K[t.type] || "text"
         },
-        ...n?.meta || {}
+        ...s?.meta || {}
       },
-      ...n || {}
+      ...s || {}
     });
-  }).concat(r).map((e, t) => {
-    const o = d([`Cell.${e.id}`, `Cell.${e.meta?.type}`, "Cell"]);
+  }), ...n].reduce((e, t) => {
+    const o = m(t);
+    return o && e.some((a) => m(a) === o) || e.push(t), e;
+  }, []).map((e, t) => {
+    const o = b([`Cell.${e.id}`, `Cell.${e.meta?.type}`, "Cell"]);
     return {
       ...e,
       meta: {
         ...e?.meta,
-        order: y(e, "meta.order", t * 10)
+        order: h(e, "meta.order", t * 10)
       },
       cell: e.cell || o
     };
   }).sort((e, t) => e.meta.order > t.meta.order ? 1 : -1);
 }
 export {
-  P as mapFormToColumns
+  S as mapFormToColumns
 };
 //# sourceMappingURL=mapFormToColumns.js.map

package/dist/molecules/table/utils/mapFormToColumns.js.map

@@ -1 +1 @@
-{"version":3,"file":"mapFormToColumns.js","sources":["../../../../src/molecules/table/utils/mapFormToColumns.tsx"],"sourcesContent":["import \"../interfaces/extends\";\n\nimport { ColumnDef, ColumnDefResolved, createColumnHelper } from \"@tanstack/react-table\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport get from \"lodash/get\";\n\nimport type { ComponentType, FormType } from \"../../../interfaces\";\nimport { getComponent } from \"../../../registries/components\";\nimport type { DefaultCell } from \"../components/DefaultCell\";\nimport type { FilterVariants } from \"../filters/Filters.js\";\n\nconst MAP_FILTER_TYPES: Record<string, FilterVariants> = {\n  number: \"range\",\n  currency: \"range\",\n  checkbox: \"boolean\"\n} as const;\n\nconst MAP_TYPES = {\n  date: \"date\",\n  datetime: \"date\",\n  number: \"number\",\n  currency: \"currency\",\n  checkbox: \"boolean\"\n} as const;\n\nexport function mapFormToColumns<Data = any>(form: FormType, columns: ColumnDefResolved<Data, any>[] = []): ColumnDef<Data, any>[] {\n  const columnHelper = createColumnHelper<Data>();\n  const columnsToKeep = cloneDeep(columns);\n\n  const columnsFromComponents = form.components\n    .flatMap((component) => {\n      if (component.type === \"tabs\") {\n        return component.components?.flatMap((subComponent: ComponentType) => subComponent.components);\n      }\n\n      return [component];\n    })\n    .filter((component) => component?.tableView)\n    .map((c) => {\n      const component = c as ComponentType;\n\n      const columnIndex = columnsToKeep.findIndex(({ accessorKey }) => {\n        return accessorKey === `data.${component.key}`;\n      });\n\n      let column = columnsToKeep[columnIndex];\n\n      if (column) {\n        columnsToKeep.splice(columnIndex, 1);\n      }\n\n      return columnHelper.accessor(`data.${component.key}` as any, {\n        header: (component.label || component.title || component.key)?.replace(/:/, \"\"),\n        meta: {\n          type: MAP_TYPES[component.type as keyof typeof MAP_TYPES] || component.type,\n          filter: {\n            ...column?.meta?.filter,\n            variant: MAP_FILTER_TYPES[component.type!] || \"text\"\n          },\n          ...(column?.meta || {})\n        },\n        ...(column || {})\n      });\n    });\n\n  const mergedColumns = columnsFromComponents.concat(columnsToKeep as any[]).map((column, index) => {\n    const Cell = getComponent<typeof DefaultCell>([`Cell.${column.id}`, `Cell.${column.meta?.type}`, \"Cell\"]);\n\n    return {\n      ...column,\n      meta: {\n        ...column?.meta,\n        order: get(column, \"meta.order\", index * 10)\n      },\n      cell: column.cell || Cell\n    };\n  });\n\n  return mergedColumns.sort((a, b) => (a.meta.order > b.meta.order ? 1 : -1)) as ColumnDef<Data, any>[];\n}\n"],"names":["MAP_FILTER_TYPES","MAP_TYPES","mapFormToColumns","form","columns","columnHelper","createColumnHelper","columnsToKeep","cloneDeep","component","subComponent","c","columnIndex","accessorKey","column","index","Cell","getComponent","get","a","b"],"mappings":";;;;;;gCAWMA,IAAmD;AAAA,EACvD,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AACZ,GAEMC,IAAY;AAAA,EAChB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AACZ;AAEO,SAASC,EAA6BC,GAAgBC,IAA0C,IAA4B;AACjI,QAAMC,IAAeC,EAAA,GACfC,IAAgBC,EAAUJ,CAAO;AAmDvC,SAjD8BD,EAAK,WAChC,QAAQ,CAACM,MACJA,EAAU,SAAS,SACdA,EAAU,YAAY,QAAQ,CAACC,MAAgCA,EAAa,UAAU,IAGxF,CAACD,CAAS,CAClB,EACA,OAAO,CAACA,MAAcA,GAAW,SAAS,EAC1C,IAAI,CAACE,MAAM;AACV,UAAMF,IAAYE,GAEZC,IAAcL,EAAc,UAAU,CAAC,EAAE,aAAAM,QACtCA,MAAgB,QAAQJ,EAAU,GAAG,EAC7C;AAED,QAAIK,IAASP,EAAcK,CAAW;AAEtC,WAAIE,KACFP,EAAc,OAAOK,GAAa,CAAC,GAG9BP,EAAa,SAAS,QAAQI,EAAU,GAAG,IAAW;AAAA,MAC3D,SAASA,EAAU,SAASA,EAAU,SAASA,EAAU,MAAM,QAAQ,KAAK,EAAE;AAAA,MAC9E,MAAM;AAAA,QACJ,MAAMR,EAAUQ,EAAU,IAA8B,KAAKA,EAAU;AAAA,QACvE,QAAQ;AAAA,UACN,GAAGK,GAAQ,MAAM;AAAA,UACjB,SAASd,EAAiBS,EAAU,IAAK,KAAK;AAAA,QAAA;AAAA,QAEhD,GAAIK,GAAQ,QAAQ,CAAA;AAAA,MAAC;AAAA,MAEvB,GAAIA,KAAU,CAAA;AAAA,IAAC,CAChB;AAAA,EACH,CAAC,EAEyC,OAAOP,CAAsB,EAAE,IAAI,CAACO,GAAQC,MAAU;AAChG,UAAMC,IAAOC,EAAiC,CAAC,QAAQH,EAAO,EAAE,IAAI,QAAQA,EAAO,MAAM,IAAI,IAAI,MAAM,CAAC;AAExG,WAAO;AAAA,MACL,GAAGA;AAAA,MACH,MAAM;AAAA,QACJ,GAAGA,GAAQ;AAAA,QACX,OAAOI,EAAIJ,GAAQ,cAAcC,IAAQ,EAAE;AAAA,MAAA;AAAA,MAE7C,MAAMD,EAAO,QAAQE;AAAA,IAAA;AAAA,EAEzB,CAAC,EAEoB,KAAK,CAACG,GAAGC,MAAOD,EAAE,KAAK,QAAQC,EAAE,KAAK,QAAQ,IAAI,EAAG;AAC5E;"}
+{"version":3,"file":"mapFormToColumns.js","sources":["../../../../src/molecules/table/utils/mapFormToColumns.tsx"],"sourcesContent":["import \"../interfaces/extends\";\n\nimport { ColumnDef, ColumnDefResolved, createColumnHelper } from \"@tanstack/react-table\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport get from \"lodash/get\";\n\nimport type { ComponentType, FormType } from \"../../../interfaces\";\nimport { getComponent } from \"../../../registries/components\";\nimport type { DefaultCell } from \"../components/DefaultCell\";\nimport type { FilterVariants } from \"../filters/Filters.js\";\n\nconst MAP_FILTER_TYPES: Record<string, FilterVariants> = {\n  number: \"range\",\n  currency: \"range\",\n  checkbox: \"boolean\"\n} as const;\n\nconst MAP_TYPES = {\n  date: \"date\",\n  datetime: \"date\",\n  number: \"number\",\n  currency: \"currency\",\n  checkbox: \"boolean\"\n} as const;\n\nfunction getColumnIdentity<Data>(column: ColumnDef<Data, any> | ColumnDefResolved<Data, any>) {\n  if (\"id\" in column && typeof column.id === \"string\") {\n    return column.id;\n  }\n\n  if (\"accessorKey\" in column && typeof column.accessorKey === \"string\") {\n    return column.accessorKey;\n  }\n\n  return undefined;\n}\n\nexport function mapFormToColumns<Data = any>({\n  form,\n  columns = [],\n  prefix = \"data.\"\n}: {\n  form: FormType;\n  columns?: ColumnDefResolved<Data, any>[];\n  prefix?: string;\n}): ColumnDef<Data, any>[] {\n  const columnHelper = createColumnHelper<Data>();\n  const columnsToKeep = cloneDeep(columns);\n\n  const columnsFromComponents = form.components\n    .flatMap((component) => {\n      if (component.type === \"tabs\") {\n        return component.components?.flatMap((subComponent: ComponentType) => subComponent.components);\n      }\n\n      return [component];\n    })\n    .filter((component) => component?.tableView)\n    .map((c) => {\n      const component = c as ComponentType;\n      const componentColumnKey = `${prefix}${component.key}`;\n      const matchingKeys = new Set([component.key, componentColumnKey]);\n\n      const columnIndex = columnsToKeep.findIndex((column) => {\n        const identity = getColumnIdentity(column);\n\n        return identity ? matchingKeys.has(identity) : false;\n      });\n\n      let column = columnsToKeep[columnIndex];\n\n      if (column) {\n        columnsToKeep.splice(columnIndex, 1);\n      }\n\n      return columnHelper.accessor(componentColumnKey as any, {\n        header: (component.label || component.title || component.key)?.replace(/:/, \"\"),\n        meta: {\n          type: (MAP_TYPES[component.type as keyof typeof MAP_TYPES] || component.type) as any,\n          filter: {\n            ...column?.meta?.filter,\n            variant: MAP_FILTER_TYPES[component.type as keyof typeof MAP_FILTER_TYPES] || \"text\"\n          },\n          ...(column?.meta || {})\n        },\n        ...(column || {})\n      });\n    });\n\n  const dedupedColumns = [...columnsFromComponents, ...(columnsToKeep as any[])].reduce<ColumnDef<Data, any>[]>((acc, column) => {\n    const identity = getColumnIdentity(column);\n\n    if (identity && acc.some((existingColumn) => getColumnIdentity(existingColumn) === identity)) {\n      return acc;\n    }\n\n    acc.push(column);\n    return acc;\n  }, []);\n\n  const mergedColumns = dedupedColumns.map((column, index) => {\n    const Cell = getComponent<typeof DefaultCell>([`Cell.${column.id}`, `Cell.${column.meta?.type}`, \"Cell\"]);\n\n    return {\n      ...column,\n      meta: {\n        ...column?.meta,\n        order: get(column, \"meta.order\", index * 10)\n      },\n      cell: column.cell || Cell\n    };\n  });\n\n  return mergedColumns.sort((a, b) => (a.meta.order > b.meta.order ? 1 : -1)) as ColumnDef<Data, any>[];\n}\n"],"names":["MAP_FILTER_TYPES","MAP_TYPES","getColumnIdentity","column","mapFormToColumns","form","columns","prefix","columnHelper","createColumnHelper","columnsToKeep","cloneDeep","component","subComponent","c","componentColumnKey","matchingKeys","columnIndex","identity","acc","existingColumn","index","Cell","getComponent","get","a","b"],"mappings":";;;;;;gCAWMA,IAAmD;AAAA,EACvD,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AACZ,GAEMC,IAAY;AAAA,EAChB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AACZ;AAEA,SAASC,EAAwBC,GAA6D;AAC5F,MAAI,QAAQA,KAAU,OAAOA,EAAO,MAAO;AACzC,WAAOA,EAAO;AAGhB,MAAI,iBAAiBA,KAAU,OAAOA,EAAO,eAAgB;AAC3D,WAAOA,EAAO;AAIlB;AAEO,SAASC,EAA6B;AAAA,EAC3C,MAAAC;AAAA,EACA,SAAAC,IAAU,CAAA;AAAA,EACV,QAAAC,IAAS;AACX,GAI2B;AACzB,QAAMC,IAAeC,EAAA,GACfC,IAAgBC,EAAUL,CAAO;AAkEvC,SAxBuB,CAAC,GAxCMD,EAAK,WAChC,QAAQ,CAACO,MACJA,EAAU,SAAS,SACdA,EAAU,YAAY,QAAQ,CAACC,MAAgCA,EAAa,UAAU,IAGxF,CAACD,CAAS,CAClB,EACA,OAAO,CAACA,MAAcA,GAAW,SAAS,EAC1C,IAAI,CAACE,MAAM;AACV,UAAMF,IAAYE,GACZC,IAAqB,GAAGR,CAAM,GAAGK,EAAU,GAAG,IAC9CI,IAAe,oBAAI,IAAI,CAACJ,EAAU,KAAKG,CAAkB,CAAC,GAE1DE,IAAcP,EAAc,UAAU,CAACP,MAAW;AACtD,YAAMe,IAAWhB,EAAkBC,CAAM;AAEzC,aAAOe,IAAWF,EAAa,IAAIE,CAAQ,IAAI;AAAA,IACjD,CAAC;AAED,QAAIf,IAASO,EAAcO,CAAW;AAEtC,WAAId,KACFO,EAAc,OAAOO,GAAa,CAAC,GAG9BT,EAAa,SAASO,GAA2B;AAAA,MACtD,SAASH,EAAU,SAASA,EAAU,SAASA,EAAU,MAAM,QAAQ,KAAK,EAAE;AAAA,MAC9E,MAAM;AAAA,QACJ,MAAOX,EAAUW,EAAU,IAA8B,KAAKA,EAAU;AAAA,QACxE,QAAQ;AAAA,UACN,GAAGT,GAAQ,MAAM;AAAA,UACjB,SAASH,EAAiBY,EAAU,IAAqC,KAAK;AAAA,QAAA;AAAA,QAEhF,GAAIT,GAAQ,QAAQ,CAAA;AAAA,MAAC;AAAA,MAEvB,GAAIA,KAAU,CAAA;AAAA,IAAC,CAChB;AAAA,EACH,CAAC,GAE+C,GAAIO,CAAuB,EAAE,OAA+B,CAACS,GAAKhB,MAAW;AAC7H,UAAMe,IAAWhB,EAAkBC,CAAM;AAEzC,WAAIe,KAAYC,EAAI,KAAK,CAACC,MAAmBlB,EAAkBkB,CAAc,MAAMF,CAAQ,KAI3FC,EAAI,KAAKhB,CAAM,GACRgB;AAAA,EACT,GAAG,CAAA,CAAE,EAEgC,IAAI,CAAChB,GAAQkB,MAAU;AAC1D,UAAMC,IAAOC,EAAiC,CAAC,QAAQpB,EAAO,EAAE,IAAI,QAAQA,EAAO,MAAM,IAAI,IAAI,MAAM,CAAC;AAExG,WAAO;AAAA,MACL,GAAGA;AAAA,MACH,MAAM;AAAA,QACJ,GAAGA,GAAQ;AAAA,QACX,OAAOqB,EAAIrB,GAAQ,cAAckB,IAAQ,EAAE;AAAA,MAAA;AAAA,MAE7C,MAAMlB,EAAO,QAAQmB;AAAA,IAAA;AAAA,EAEzB,CAAC,EAEoB,KAAK,CAACG,GAAGC,MAAOD,EAAE,KAAK,QAAQC,EAAE,KAAK,QAAQ,IAAI,EAAG;AAC5E;"}

package/dist/organisms/table/submissions/SubmissionsTable.js

@@ -2,7 +2,7 @@ import { jsx as n } from "react/jsx-runtime";
 import { Table as s } from "../../../molecules/table/Table.js";
 import { mapFormToColumns as t } from "../../../molecules/table/utils/mapFormToColumns.js";
 function e({ form: o, ...m }) {
-  const r = o && t(o);
+  const r = o && t({ form: o });
   return /* @__PURE__ */ n(s, { ...m, columns: r });
 }
 export {

package/dist/organisms/table/submissions/SubmissionsTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubmissionsTable.js","sources":["../../../../src/organisms/table/submissions/SubmissionsTable.tsx"],"sourcesContent":["import type { FormType, SubmissionType } from \"../../../interfaces\";\nimport type { JSONRecord } from \"../../../interfaces/JSONRecord\";\nimport { Table, type TableProps } from \"../../../molecules/table/Table\";\nimport { mapFormToColumns } from \"../../../molecules/table/utils/mapFormToColumns.js\";\n\nexport type SubmissionsTableProps<Data extends object = JSONRecord> = Omit<TableProps<SubmissionType<Data>>, \"columns\"> & {\n  form?: FormType;\n};\n\nexport function SubmissionsTable<Data extends object = JSONRecord>({ form, ...props }: SubmissionsTableProps<Data>) {\n  const columns: any[] | undefined = form && mapFormToColumns(form);\n\n  return <Table {...(props as any)} columns={columns!} />;\n}\n"],"names":["SubmissionsTable","form","props","columns","mapFormToColumns","jsx","Table"],"mappings":";;;AASO,SAASA,EAAmD,EAAE,MAAAC,GAAM,GAAGC,KAAsC;AAClH,QAAMC,IAA6BF,KAAQG,EAAiBH,CAAI;AAEhE,SAAO,gBAAAI,EAACC,GAAA,EAAO,GAAIJ,GAAe,SAAAC,EAAA,CAAmB;AACvD;"}
+{"version":3,"file":"SubmissionsTable.js","sources":["../../../../src/organisms/table/submissions/SubmissionsTable.tsx"],"sourcesContent":["import type { FormType, SubmissionType } from \"../../../interfaces\";\nimport type { JSONRecord } from \"../../../interfaces/JSONRecord\";\nimport { Table, type TableProps } from \"../../../molecules/table/Table\";\nimport { mapFormToColumns } from \"../../../molecules/table/utils/mapFormToColumns.js\";\n\nexport type SubmissionsTableProps<Data extends object = JSONRecord> = Omit<TableProps<SubmissionType<Data>>, \"columns\"> & {\n  form?: FormType;\n};\n\nexport function SubmissionsTable<Data extends object = JSONRecord>({ form, ...props }: SubmissionsTableProps<Data>) {\n  const columns: any[] | undefined = form && mapFormToColumns({ form: form });\n\n  return <Table {...(props as any)} columns={columns!} />;\n}\n"],"names":["SubmissionsTable","form","props","columns","mapFormToColumns","jsx","Table"],"mappings":";;;AASO,SAASA,EAAmD,EAAE,MAAAC,GAAM,GAAGC,KAAsC;AAClH,QAAMC,IAA6BF,KAAQG,EAAiB,EAAE,MAAAH,GAAY;AAE1E,SAAO,gBAAAI,EAACC,GAAA,EAAO,GAAIJ,GAAe,SAAAC,EAAA,CAAmB;AACvD;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsed/react-formio",
-  "version": "3.0.0-rc.14",
+  "version": "3.0.0-rc.16",
   "description": "Provide a react formio wrapper. Written in TypeScript.",
   "type": "module",
   "main": "./dist/index.js",
@@ -44,8 +44,8 @@
   },
   "devDependencies": {
     "@tanstack/react-table": ">=8.20.6",
-    "@tsed/tailwind-formio": "3.0.0-rc.14",
-    "@tsed/typescript": "3.0.0-rc.14",
+    "@tsed/tailwind-formio": "3.0.0-rc.16",
+    "@tsed/typescript": "3.0.0-rc.16",
     "microbundle": "0.13.0",
     "vite": "7.1.5",
     "vitest": "3.2.4"

package/src/molecules/table/Table.stories.tsx

@@ -74,7 +74,7 @@ type Story = StoryObj<typeof Table<ProductSubmission>>;
 export const Usage: Story = {
   args: {
     data: formSubmissions as unknown as ProductSubmission[],
-    columns: mapFormToColumns(FormType as any),
+    columns: mapFormToColumns({ form: FormType as any }),
     operations: [
       {
         title: "Edit",
@@ -183,17 +183,20 @@ export const Usage: Story = {
 export const WithFilters: Story = {
   args: {
     data: formSubmissions as unknown as ProductSubmission[],
-    columns: mapFormToColumns(FormType as any, [
-      {
-        accessorKey: "data.id",
-        meta: {
-          filter: {
-            variant: "select",
-            layout: "react"
+    columns: mapFormToColumns({
+      form: FormType as any,
+      columns: [
+        {
+          accessorKey: "data.id",
+          meta: {
+            filter: {
+              variant: "select",
+              layout: "react"
+            }
           }
         }
-      }
-    ]),
+      ]
+    }),
     operations: [
       {
         title: "Edit",
@@ -220,7 +223,7 @@ export const WithFilters: Story = {
 export const WithPaginationOptions: Story = {
   args: {
     data: formSubmissions as unknown as ProductSubmission[],
-    columns: mapFormToColumns(FormType as any),
+    columns: mapFormToColumns({ form: FormType as any }),
     operations: [
       {
         title: "Edit",
@@ -246,67 +249,70 @@ export const WithPaginationOptions: Story = {
 export const WithCustomCell: Story = {
   args: {
     data: formSubmissions as unknown as ProductSubmission[],
-    columns: mapFormToColumns<ProductSubmission>(FormType as any, [
-      {
-        accessorKey: "data.id",
-        meta: {
-          filter: {
-            variant: "select",
-            layout: "react"
+    columns: mapFormToColumns<ProductSubmission>({
+      form: FormType as any,
+      columns: [
+        {
+          accessorKey: "data.id",
+          meta: {
+            filter: {
+              variant: "select",
+              layout: "react"
+            },
+            cellProps: {
+              colSpan: 2
+            }
           },
-          cellProps: {
-            colSpan: 2
+          cell: (context) => {
+            return (
+              <div className='flex space-x-4 align-items-center'>
+                <div className='max-w-[80px]'>
+                  <img className='max-w-[80px] rounded-md' src={context.row.original.data.image} alt={context.row.original.data.label} />
+                </div>
+                <div>
+                  <div className='text-lg text-primary'>{context.row.original.data.label}</div>
+                  <div className='text-xs'>{context.getValue()}</div>
+                </div>
+              </div>
+            );
           }
         },
-        cell: (context) => {
-          return (
-            <div className='flex space-x-4 align-items-center'>
-              <div className='max-w-[80px]'>
-                <img className='max-w-[80px] rounded-md' src={context.row.original.data.image} alt={context.row.original.data.label} />
-              </div>
-              <div>
-                <div className='text-lg text-primary'>{context.row.original.data.label}</div>
-                <div className='text-xs'>{context.getValue()}</div>
-              </div>
-            </div>
-          );
-        }
-      },
-      {
-        accessorKey: "data.label",
-        meta: {
-          hidden: true
-        }
-      },
-      {
-        accessorKey: "data.description",
-        meta: {
-          filter: {
-            variant: "text",
-            disableDatalist: true
+        {
+          accessorKey: "data.label",
+          meta: {
+            hidden: true
           }
-        }
-      },
-      {
-        accessorKey: "data.price",
-        cell: (context) => {
-          const value = context.getValue();
-
-          if (value === undefined) {
-            return "-";
+        },
+        {
+          accessorKey: "data.description",
+          meta: {
+            filter: {
+              variant: "text",
+              disableDatalist: true
+            }
+          }
+        },
+        {
+          accessorKey: "data.price",
+          cell: (context) => {
+            const value = context.getValue();
+
+            if (value === undefined) {
+              return "-";
+            }
+
+            return (
+              <div className='text-right'>
+                {Intl.NumberFormat("fr-FR", {
+                  style: "currency",
+                  currency: context.row.original.data.currency
+                }).format(context.getValue())}
+              </div>
+            );
           }
-
-          return (
-            <div className='text-right'>
-              {Intl.NumberFormat("fr-FR", {
-                style: "currency",
-                currency: context.row.original.data.currency
-              }).format(context.getValue())}
-            </div>
-          );
         }
-      }
-    ]),
+      ]
+    }),
     operations: [
       {
         title: "Edit",

package/src/molecules/table/components/DefaultBooleanCell.spec.tsx

@@ -29,13 +29,13 @@ describe("DefaultCellBoolean", () => {
   });
 
   it("should render custom labels from column metadata", () => {
-    render(<DefaultCellBoolean {...createCellContext(true, { yes: "Enabled", No: "Disabled" })} />);
+    render(<DefaultCellBoolean {...createCellContext(true, { yes: "Enabled", no: "Disabled" })} />);
 
     expect(screen.getByText("Enabled", { selector: "span" })).toBeInTheDocument();
   });
 
   it("should render the custom false label from column metadata", () => {
-    render(<DefaultCellBoolean {...createCellContext(false, { yes: "Enabled", No: "Disabled" })} />);
+    render(<DefaultCellBoolean {...createCellContext(false, { yes: "Enabled", no: "Disabled" })} />);
 
     expect(screen.getByText("Disabled", { selector: "span" })).toBeInTheDocument();
   });

package/src/molecules/table/components/DefaultBooleanCell.tsx

@@ -4,7 +4,7 @@ import { registerComponent } from "../../../registries/components";
 
 export function DefaultCellBoolean<Data extends object>({ getValue, column: { columnDef } }: CellContext<Data, boolean>) {
   const value = getValue();
-  return <span>{String(value ? columnDef.meta?.labels?.["yes"] || "Yes" : columnDef.meta?.labels?.["No"] || "No")}</span>;
+  return <span>{String(value ? columnDef.meta?.labels?.["yes"] || "Yes" : columnDef.meta?.labels?.["no"] || "No")}</span>;
 }
 
 registerComponent("Cell.boolean", DefaultCellBoolean);

package/src/molecules/table/filters/SelectFilter.tsx

@@ -8,7 +8,7 @@ import { FilterSelectOptions } from "./Filters";
 export function SelectFilter<Data = any>({ header, options }: FilterProps<Data, FilterSelectOptions>) {
   const Select = getComponent<typeof DefaultSelect>("Select");
   const columnFilterValue = header.column.getFilterValue();
-  const uniqValues = useUniqValues<Data>({ header, filterVariant: "text" });
+  const uniqValues = useUniqValues<Data>({ header });
 
   const opts =
     options.layout === "choicesjs"
@@ -26,7 +26,7 @@ export function SelectFilter<Data = any>({ header, options }: FilterProps<Data,
         value: ""
       }
     ] as SelectOptionProps[]
-  ).concat(options.options || uniqValues.map((value: any) => ({ label: value, value })));
+  ).concat(options.options || uniqValues);
 
   return (
     <>
@@ -46,3 +46,4 @@ export function SelectFilter<Data = any>({ header, options }: FilterProps<Data,
 }
 
 registerComponent("Filter.select", SelectFilter);
+registerComponent("Filter.boolean", SelectFilter);

package/src/molecules/table/filters/TextFieldFilter.tsx

@@ -7,7 +7,7 @@ import { FilterTextOptions } from "./Filters";
 export function TextFieldFilter<Data = any>({ header, options }: FilterProps<Data, FilterTextOptions>) {
   const InputText = getComponent<typeof DefaultInputText>("InputText");
   const columnFilterValue = header.column.getFilterValue();
-  const uniqValues = useUniqValues<Data>({ header, filterVariant: "text" });
+  const uniqValues = useUniqValues<Data>({ header });
   const datalistId = `data_list_${header.column.id}`;
 
   return (

package/src/molecules/table/hooks/useUniqValues.spec.tsx

@@ -0,0 +1,51 @@
+import { renderHook } from "@testing-library/react";
+
+import { useUniqValues } from "./useUniqValues";
+
+function createHeader({ variant, labels, values = [] }: { variant?: string; labels?: Record<string, string>; values?: string[] }) {
+  return {
+    column: {
+      columnDef: {
+        meta: {
+          filter: {
+            variant
+          },
+          labels
+        }
+      },
+      getFacetedUniqueValues: () => new Map(values.map((value) => [value, 1]))
+    }
+  } as any;
+}
+
+describe("useUniqValues", () => {
+  it("should return boolean options with the custom labels", () => {
+    const header = createHeader({
+      variant: "boolean",
+      labels: {
+        yes: "Enabled",
+        No: "Disabled"
+      }
+    });
+
+    const { result } = renderHook(() => useUniqValues({ header }));
+
+    expect(result.current).toEqual([
+      { label: "Enabled", value: true },
+      { label: "Disabled", value: false }
+    ]);
+  });
+
+  it("should map faceted unique values to select options", () => {
+    const header = createHeader({
+      values: ["beta", "alpha"]
+    });
+
+    const { result } = renderHook(() => useUniqValues({ header }));
+
+    expect(result.current).toEqual([
+      { label: "alpha", value: "alpha" },
+      { label: "beta", value: "beta" }
+    ]);
+  });
+});

package/src/molecules/table/hooks/useUniqValues.tsx

@@ -1,10 +1,26 @@
 import type { Header } from "@tanstack/react-table";
 import { useMemo } from "react";
 
-export function useUniqValues<Data = any>({ header, filterVariant }: { header: Header<Data, unknown>; filterVariant: string }) {
-  return useMemo(
-    () => (filterVariant === "range" ? [] : Array.from(header.column.getFacetedUniqueValues().keys()).flat().sort().slice(0, 5000)),
+import { SelectOptionProps } from "../../../molecules/forms/select/Select.interface";
 
-    [header.column, filterVariant]
-  );
+export function useUniqValues<Data = any>({ header }: { header: Header<Data, unknown> }): SelectOptionProps[] {
+  return useMemo(() => {
+    switch (header.column.columnDef.meta?.filter?.variant) {
+      case "boolean":
+        return [
+          { label: header.column.columnDef.meta?.labels?.["yes"] || "Yes", value: true },
+          { label: header.column.columnDef.meta?.labels?.["no"] || header.column.columnDef.meta?.labels?.["No"] || "No", value: false }
+        ];
+
+      default:
+        return Array.from(header.column.getFacetedUniqueValues().keys())
+          .flat()
+          .sort()
+          .slice(0, 5000)
+          .map((i) => ({
+            label: i,
+            value: i
+          }));
+    }
+  }, [header.column]);
 }

package/src/molecules/table/utils/mapFormToColumns.spec.tsx

@@ -1,9 +1,10 @@
+import { DefaultCellBoolean } from "../components/DefaultBooleanCell";
 import { DefaultCell } from "../components/DefaultCell";
 import { DefaultDateCell } from "../components/DefaultDateCell";
 import { mapFormToColumns } from "./mapFormToColumns";
 
 describe("mapFormToColumns", () => {
-  it("should use DefaultCell for mapped table columns", () => {
+  it("should use DefaultCellBoolean for mapped checkbox table columns", () => {
     const form = {
       components: [
         {
@@ -15,12 +16,13 @@ describe("mapFormToColumns", () => {
       ]
     } as any;
 
-    const [column] = mapFormToColumns(form) as any[];
+    const [column] = mapFormToColumns({ form: form }) as any[];
 
     expect(column.accessorKey).toEqual("data.enabled");
     expect(column.header).toEqual("Enabled");
+    expect(column.meta.type).toEqual("boolean");
     expect(column.meta.filter.variant).toEqual("boolean");
-    expect(column.cell).toBe(DefaultCell);
+    expect(column.cell).toBe(DefaultCellBoolean);
   });
 
   it("should fallback to DefaultCell for kept columns without a cell renderer", () => {
@@ -28,12 +30,45 @@ describe("mapFormToColumns", () => {
       components: []
     } as any;
 
-    const [column] = mapFormToColumns(form, [{ accessorKey: "data.other", header: "Other" } as any]) as any[];
+    const [column] = mapFormToColumns({ form: form, columns: [{ accessorKey: "data.other", header: "Other" } as any] }) as any[];
 
     expect(column.accessorKey).toEqual("data.other");
     expect(column.cell).toBe(DefaultCell);
   });
 
+  it("should merge a kept column matched by component key", () => {
+    const form = {
+      components: [
+        {
+          type: "textfield",
+          key: "name",
+          label: "Name:",
+          tableView: true
+        }
+      ]
+    } as any;
+
+    const [column] = mapFormToColumns({
+      form: form,
+      columns: [
+        {
+          id: "name",
+          header: "Custom name",
+          meta: {
+            order: 5,
+            filter: {
+              variant: "text"
+            }
+          }
+        } as any
+      ]
+    }) as any[];
+
+    expect(column.accessorKey).toEqual("data.name");
+    expect(column.header).toEqual("Custom name");
+    expect(column.meta.order).toEqual(5);
+  });
+
   it("should use DefaultDateCell for mapped datetime columns", () => {
     const form = {
       components: [
@@ -46,10 +81,36 @@ describe("mapFormToColumns", () => {
       ]
     } as any;
 
-    const [column] = mapFormToColumns(form) as any[];
+    const [column] = mapFormToColumns({ form: form }) as any[];
 
     expect(column.accessorKey).toEqual("data.createdAt");
     expect(column.meta.type).toEqual("date");
     expect(column.cell).toBe(DefaultDateCell);
   });
+
+  it("should dedupe columns when a kept column matches a mapped accessor key", () => {
+    const form = {
+      components: [
+        {
+          type: "textfield",
+          key: "email",
+          label: "Email:",
+          tableView: true
+        }
+      ]
+    } as any;
+
+    const columns = mapFormToColumns({
+      form: form,
+      columns: [
+        {
+          accessorKey: "data.email",
+          header: "Email"
+        } as any
+      ]
+    }) as any[];
+
+    expect(columns).toHaveLength(1);
+    expect(columns[0].accessorKey).toEqual("data.email");
+  });
 });

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

@@ -23,7 +23,27 @@ const MAP_TYPES = {
   checkbox: "boolean"
 } as const;
 
-export function mapFormToColumns<Data = any>(form: FormType, columns: ColumnDefResolved<Data, any>[] = []): ColumnDef<Data, any>[] {
+function getColumnIdentity<Data>(column: ColumnDef<Data, any> | ColumnDefResolved<Data, any>) {
+  if ("id" in column && typeof column.id === "string") {
+    return column.id;
+  }
+
+  if ("accessorKey" in column && typeof column.accessorKey === "string") {
+    return column.accessorKey;
+  }
+
+  return undefined;
+}
+
+export function mapFormToColumns<Data = any>({
+  form,
+  columns = [],
+  prefix = "data."
+}: {
+  form: FormType;
+  columns?: ColumnDefResolved<Data, any>[];
+  prefix?: string;
+}): ColumnDef<Data, any>[] {
   const columnHelper = createColumnHelper<Data>();
   const columnsToKeep = cloneDeep(columns);
 
@@ -38,9 +58,13 @@ export function mapFormToColumns<Data = any>(form: FormType, columns: ColumnDefR
     .filter((component) => component?.tableView)
     .map((c) => {
       const component = c as ComponentType;
+      const componentColumnKey = `${prefix}${component.key}`;
+      const matchingKeys = new Set([component.key, componentColumnKey]);
 
-      const columnIndex = columnsToKeep.findIndex(({ accessorKey }) => {
-        return accessorKey === `data.${component.key}`;
+      const columnIndex = columnsToKeep.findIndex((column) => {
+        const identity = getColumnIdentity(column);
+
+        return identity ? matchingKeys.has(identity) : false;
       });
 
       let column = columnsToKeep[columnIndex];
@@ -49,13 +73,13 @@ export function mapFormToColumns<Data = any>(form: FormType, columns: ColumnDefR
         columnsToKeep.splice(columnIndex, 1);
       }
 
-      return columnHelper.accessor(`data.${component.key}` as any, {
+      return columnHelper.accessor(componentColumnKey as any, {
         header: (component.label || component.title || component.key)?.replace(/:/, ""),
         meta: {
-          type: MAP_TYPES[component.type as keyof typeof MAP_TYPES] || component.type,
+          type: (MAP_TYPES[component.type as keyof typeof MAP_TYPES] || component.type) as any,
           filter: {
             ...column?.meta?.filter,
-            variant: MAP_FILTER_TYPES[component.type!] || "text"
+            variant: MAP_FILTER_TYPES[component.type as keyof typeof MAP_FILTER_TYPES] || "text"
           },
           ...(column?.meta || {})
         },
@@ -63,7 +87,18 @@ export function mapFormToColumns<Data = any>(form: FormType, columns: ColumnDefR
       });
     });
 
-  const mergedColumns = columnsFromComponents.concat(columnsToKeep as any[]).map((column, index) => {
+  const dedupedColumns = [...columnsFromComponents, ...(columnsToKeep as any[])].reduce<ColumnDef<Data, any>[]>((acc, column) => {
+    const identity = getColumnIdentity(column);
+
+    if (identity && acc.some((existingColumn) => getColumnIdentity(existingColumn) === identity)) {
+      return acc;
+    }
+
+    acc.push(column);
+    return acc;
+  }, []);
+
+  const mergedColumns = dedupedColumns.map((column, index) => {
     const Cell = getComponent<typeof DefaultCell>([`Cell.${column.id}`, `Cell.${column.meta?.type}`, "Cell"]);
 
     return {

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

@@ -8,7 +8,7 @@ export type SubmissionsTableProps<Data extends object = JSONRecord> = Omit<Table
 };
 
 export function SubmissionsTable<Data extends object = JSONRecord>({ form, ...props }: SubmissionsTableProps<Data>) {
-  const columns: any[] | undefined = form && mapFormToColumns(form);
+  const columns: any[] | undefined = form && mapFormToColumns({ form: form });
 
   return <Table {...(props as any)} columns={columns!} />;
 }