@cryptlex/web-components 1.4.0 → 1.5.0

package/dist/components/data-table/table-actions.es.js

@@ -1,10 +1,9 @@
-import { jsxs as p, jsx as r } from "react/jsx-runtime";
-import { useRouterState as a, Link as n } from "@tanstack/react-router";
-import { RotateCw as f, Plus as g, Pencil as u, Trash as v } from "lucide-react";
+import { jsxs as p, jsx as e } from "react/jsx-runtime";
+import { useRouterState as g, Link as d } from "@tanstack/react-router";
+import { RotateCw as f, Plus as a, Pencil as u, Trash as w } from "lucide-react";
 import { Button as t } from "../ui/button.es.js";
 import "../ui/accordion.es.js";
 import "../ui/avatar.es.js";
-import "../ui/badge.es.js";
 import "../ui/breadcrumb.es.js";
 import "../ui/calendar.es.js";
 import "../ui/card.es.js";
@@ -12,7 +11,7 @@ import "../ui/chart.es.js";
 import "../ui/checkbox.es.js";
 import "@radix-ui/react-collapsible";
 import "../ui/command.es.js";
-import { useState as w } from "react";
+import { useState as v } from "react";
 import "../ui/dialog.es.js";
 import "../ui/drawer.es.js";
 import "../ui/dropdown-menu.es.js";
@@ -35,44 +34,44 @@ import "sonner";
 import "../ui/table.es.js";
 import "../ui/tabs.es.js";
 import "../ui/tooltip.es.js";
-function te({
-  table: o,
-  tableActions: e,
-  stateToPass: c,
-  handleSearching: l,
-  dataQuery: i
+function or({
+  table: i,
+  tableActions: r,
+  stateToPass: n,
+  handleSearching: h,
+  dataQuery: o
 }) {
-  const { location: { href: m } = {} } = a(), [h, s] = w("");
-  return /* @__PURE__ */ p("div", { className: "flex justify-between my-0  py-2 gap-4 overflow-auto", children: [
-    /* @__PURE__ */ p("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ r(
+  const { location: { href: m } = {} } = g(), [l, s] = v("");
+  return /* @__PURE__ */ p("div", { className: "flex bg-card justify-between my-0 p-4 border-t border-x gap-4 overflow-auto", children: [
+    /* @__PURE__ */ p("div", { className: "flex gap-4", children: [
+      /* @__PURE__ */ e(
         t,
         {
-          loading: i.isFetching,
+          loading: o.isFetching,
           icon: f,
-          onClick: () => i.refetch(),
+          onClick: () => o.refetch(),
           variant: "outline"
         }
       ),
-      e.create && o.getSelectedRowModel().rows.length === 0 && /* @__PURE__ */ p(n, { to: `${m}/create`, children: [
-        /* @__PURE__ */ r(t, { disabled: i.isFetching, icon: g, children: "Create" }),
+      r.create && i.getSelectedRowModel().rows.length === 0 && /* @__PURE__ */ p(d, { to: `${m}/create`, children: [
+        /* @__PURE__ */ e(t, { disabled: o.isFetching, icon: a, children: "Create" }),
         " "
       ] }),
-      o.getSelectedRowModel().rows.length > 0 && e.update && /* @__PURE__ */ r(n, { to: `${m}/edit`, state: c, children: /* @__PURE__ */ r(t, { disabled: i.isFetching, icon: u, children: "Update" }) }),
-      o.getSelectedRowModel().rows.length > 0 && (e == null ? void 0 : e.delete) && /* @__PURE__ */ r(n, { to: `${m}/delete`, state: c, children: /* @__PURE__ */ r(t, { disabled: i.isFetching, icon: v, variant: "destructive", children: "Delete" }) })
+      i.getSelectedRowModel().rows.length > 0 && r.update && /* @__PURE__ */ e(d, { to: `${m}/edit`, state: n, children: /* @__PURE__ */ e(t, { disabled: o.isFetching, icon: u, children: "Update" }) }),
+      i.getSelectedRowModel().rows.length > 0 && (r == null ? void 0 : r.delete) && /* @__PURE__ */ e(d, { to: `${m}/delete`, state: n, children: /* @__PURE__ */ e(t, { disabled: o.isFetching, icon: w, variant: "destructive", children: "Delete" }) })
     ] }),
-    (e == null ? void 0 : e.search) && /* @__PURE__ */ r("div", { className: "relative flex gap-1 justify-center items-center", children: /* @__PURE__ */ r(
+    (r == null ? void 0 : r.search) && /* @__PURE__ */ e(
       S,
       {
-        value: h,
-        onChange: (d) => {
-          s(d), l(d);
+        value: l,
+        onChange: (c) => {
+          s(c), h(c);
         }
       }
-    ) })
+    )
   ] });
 }
 export {
-  te as default
+  or as default
 };
 //# sourceMappingURL=table-actions.es.js.map

package/dist/components/data-table/table-actions.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-actions.es.js","sources":["../../../lib/components/data-table/table-actions.tsx"],"sourcesContent":["import { Link, useRouterState } from '@tanstack/react-router';\n\nimport { Pencil, Plus, RotateCw, Trash } from 'lucide-react';\n\nimport type { TableActions } from '@/components/data-table/table-utils/index';\nimport { Button } from '@/components/ui/button';\nimport { SearchInput } from '@/index';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { Table } from '@tanstack/react-table';\nimport { useState } from 'react';\n\nexport default function Actions<TData>({\n  table,\n  tableActions,\n  stateToPass,\n  handleSearching,\n  dataQuery,\n}: {\n  table: Table<TData>;\n  tableActions: TableActions;\n  handleSearching: (value: string) => void;\n  // TODO:Improve ts\n  stateToPass: any;\n  dataQuery: UseQueryResult<any, unknown>;\n}) {\n  const { location: { href } = {} } = useRouterState();\n  const [search, setSearch] = useState<string>('');\n  return (\n    <div className=\"flex justify-between my-0  py-2 gap-4 overflow-auto\">\n      <div className=\"flex gap-2\">\n        <Button\n          loading={dataQuery.isFetching}\n          icon={RotateCw}\n          onClick={() => dataQuery.refetch()}\n          variant={'outline'}\n        />\n        {/* //TODO: we can  show the create, delete button based on permsission */}\n        {/* All the creating routes will be with url /create in host app */}\n        {tableActions.create && table.getSelectedRowModel().rows.length === 0 && (\n          <Link to={`${href}/create`}>\n            <Button disabled={dataQuery.isFetching} icon={Plus}>\n              Create\n            </Button>{' '}\n          </Link>\n        )}\n        {/* All the updating routes will be with url /edit in host app */}\n        {table.getSelectedRowModel().rows.length > 0 && tableActions.update && (\n          <Link to={`${href}/edit`} state={stateToPass}>\n            <Button disabled={dataQuery.isFetching} icon={Pencil}>\n              Update\n            </Button>\n          </Link>\n        )}\n        {table.getSelectedRowModel().rows.length > 0 && tableActions?.delete && (\n          <Link to={`${href}/delete`} state={stateToPass}>\n            <Button disabled={dataQuery.isFetching} icon={Trash} variant={'destructive'}>\n              Delete\n            </Button>\n          </Link>\n        )}\n      </div>\n      {tableActions?.search && (\n        <div className=\"relative flex gap-1 justify-center items-center\">\n          <SearchInput\n            value={search}\n            onChange={(e) => {\n              setSearch(e);\n              handleSearching(e);\n            }}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["Actions","table","tableActions","stateToPass","handleSearching","dataQuery","href","useRouterState","search","setSearch","useState","jsxs","jsx","Button","RotateCw","Link","Plus","Pencil","Trash","SearchInput","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,SAAwBA,GAAe;AAAA,EACrC,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AACF,GAOG;AACK,QAAA,EAAE,UAAU,EAAE,MAAAC,MAAS,CAAC,EAAA,IAAMC,EAAe,GAC7C,CAACC,GAAQC,CAAS,IAAIC,EAAiB,EAAE;AAE7C,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,uDACb,UAAA;AAAA,IAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,cACb,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAASR,EAAU;AAAA,UACnB,MAAMS;AAAA,UACN,SAAS,MAAMT,EAAU,QAAQ;AAAA,UACjC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,MAGCH,EAAa,UAAUD,EAAM,oBAAA,EAAsB,KAAK,WAAW,KACjE,gBAAAU,EAAAI,GAAA,EAAK,IAAI,GAAGT,CAAI,WACf,UAAA;AAAA,QAAA,gBAAAM,EAACC,KAAO,UAAUR,EAAU,YAAY,MAAMW,GAAM,UAEpD,UAAA;AAAA,QAAU;AAAA,MAAA,GACZ;AAAA,MAGDf,EAAM,oBAAoB,EAAE,KAAK,SAAS,KAAKC,EAAa,UAC1D,gBAAAU,EAAAG,GAAA,EAAK,IAAI,GAAGT,CAAI,SAAS,OAAOH,GAC/B,UAAA,gBAAAS,EAACC,GAAO,EAAA,UAAUR,EAAU,YAAY,MAAMY,GAAQ,UAAA,SAAA,CAEtD,EACF,CAAA;AAAA,MAEDhB,EAAM,oBAAoB,EAAE,KAAK,SAAS,MAAKC,KAAA,gBAAAA,EAAc,WAC5D,gBAAAU,EAACG,GAAK,EAAA,IAAI,GAAGT,CAAI,WAAW,OAAOH,GACjC,UAAC,gBAAAS,EAAAC,GAAA,EAAO,UAAUR,EAAU,YAAY,MAAMa,GAAO,SAAS,eAAe,UAAA,SAE7E,CAAA,EACF,CAAA;AAAA,IAAA,GAEJ;AAAA,KACChB,KAAA,gBAAAA,EAAc,WACZ,gBAAAU,EAAA,OAAA,EAAI,WAAU,mDACb,UAAA,gBAAAA;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,OAAOX;AAAA,QACP,UAAU,CAACY,MAAM;AACf,UAAAX,EAAUW,CAAC,GACXhB,EAAgBgB,CAAC;AAAA,QAAA;AAAA,MACnB;AAAA,IAAA,EAEJ,CAAA;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"table-actions.es.js","sources":["../../../lib/components/data-table/table-actions.tsx"],"sourcesContent":["import { Link, useRouterState } from '@tanstack/react-router';\n\nimport { Pencil, Plus, RotateCw, Trash } from 'lucide-react';\n\nimport type { TableActions } from '@/components/data-table/table-utils/index';\nimport { Button } from '@/components/ui/button';\nimport { SearchInput } from '@/index';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { Table } from '@tanstack/react-table';\nimport { useState } from 'react';\n\nexport default function Actions<TData>({\n  table,\n  tableActions,\n  stateToPass,\n  handleSearching,\n  dataQuery,\n}: {\n  table: Table<TData>;\n  tableActions: TableActions;\n  handleSearching: (value: string) => void;\n  // TODO:Improve ts\n  stateToPass: any;\n  dataQuery: UseQueryResult<any, unknown>;\n}) {\n  const { location: { href } = {} } = useRouterState();\n  const [search, setSearch] = useState<string>('');\n  return (\n    <div className=\"flex bg-card justify-between my-0 p-4 border-t border-x gap-4 overflow-auto\">\n      <div className=\"flex gap-4\">\n        <Button\n          loading={dataQuery.isFetching}\n          icon={RotateCw}\n          onClick={() => dataQuery.refetch()}\n          variant={'outline'}\n        />\n        {/* //TODO: we can  show the create, delete button based on permsission */}\n        {/* All the creating routes will be with url /create in host app */}\n        {tableActions.create && table.getSelectedRowModel().rows.length === 0 && (\n          <Link to={`${href}/create`}>\n            <Button disabled={dataQuery.isFetching} icon={Plus}>\n              Create\n            </Button>{' '}\n          </Link>\n        )}\n        {/* All the updating routes will be with url /edit in host app */}\n        {table.getSelectedRowModel().rows.length > 0 && tableActions.update && (\n          <Link to={`${href}/edit`} state={stateToPass}>\n            <Button disabled={dataQuery.isFetching} icon={Pencil}>\n              Update\n            </Button>\n          </Link>\n        )}\n        {table.getSelectedRowModel().rows.length > 0 && tableActions?.delete && (\n          <Link to={`${href}/delete`} state={stateToPass}>\n            <Button disabled={dataQuery.isFetching} icon={Trash} variant={'destructive'}>\n              Delete\n            </Button>\n          </Link>\n        )}\n      </div>\n      {tableActions?.search && (\n        <SearchInput\n          value={search}\n          onChange={(e) => {\n            setSearch(e);\n            handleSearching(e);\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":["Actions","table","tableActions","stateToPass","handleSearching","dataQuery","href","useRouterState","search","setSearch","useState","jsxs","jsx","Button","RotateCw","Link","Plus","Pencil","Trash","SearchInput","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,SAAwBA,GAAe;AAAA,EACrC,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AACF,GAOG;AACK,QAAA,EAAE,UAAU,EAAE,MAAAC,MAAS,CAAC,EAAA,IAAMC,EAAe,GAC7C,CAACC,GAAQC,CAAS,IAAIC,EAAiB,EAAE;AAE7C,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,+EACb,UAAA;AAAA,IAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,cACb,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAASR,EAAU;AAAA,UACnB,MAAMS;AAAA,UACN,SAAS,MAAMT,EAAU,QAAQ;AAAA,UACjC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,MAGCH,EAAa,UAAUD,EAAM,oBAAA,EAAsB,KAAK,WAAW,KACjE,gBAAAU,EAAAI,GAAA,EAAK,IAAI,GAAGT,CAAI,WACf,UAAA;AAAA,QAAA,gBAAAM,EAACC,KAAO,UAAUR,EAAU,YAAY,MAAMW,GAAM,UAEpD,UAAA;AAAA,QAAU;AAAA,MAAA,GACZ;AAAA,MAGDf,EAAM,oBAAoB,EAAE,KAAK,SAAS,KAAKC,EAAa,UAC1D,gBAAAU,EAAAG,GAAA,EAAK,IAAI,GAAGT,CAAI,SAAS,OAAOH,GAC/B,UAAA,gBAAAS,EAACC,GAAO,EAAA,UAAUR,EAAU,YAAY,MAAMY,GAAQ,UAAA,SAAA,CAEtD,EACF,CAAA;AAAA,MAEDhB,EAAM,oBAAoB,EAAE,KAAK,SAAS,MAAKC,KAAA,gBAAAA,EAAc,WAC5D,gBAAAU,EAACG,GAAK,EAAA,IAAI,GAAGT,CAAI,WAAW,OAAOH,GACjC,UAAC,gBAAAS,EAAAC,GAAA,EAAO,UAAUR,EAAU,YAAY,MAAMa,GAAO,SAAS,eAAe,UAAA,SAE7E,CAAA,EACF,CAAA;AAAA,IAAA,GAEJ;AAAA,KACChB,KAAA,gBAAAA,EAAc,WACb,gBAAAU;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,OAAOX;AAAA,QACP,UAAU,CAACY,MAAM;AACf,UAAAX,EAAUW,CAAC,GACXhB,EAAgBgB,CAAC;AAAA,QAAA;AAAA,MACnB;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;"}

package/dist/components/data-table/table-commons.es.js

@@ -41,12 +41,13 @@ const a = r(), i = [
     cell: ({ row: e }) => {
       const t = e.getValue("createdAt");
       return o(t);
-    }
+    },
+    enableHiding: !1
   })
 ];
 export {
-  i as CHECK_BOX,
-  m as DEFAULT_DATE_COLUMNS,
-  h as ID_COLUMN
+  i as TABLE_CHECK_BOX_COLUMN,
+  m as TABLE_DEFAULT_DATE_COLUMNS,
+  h as TABLE_ID_COLUMN
 };
 //# sourceMappingURL=table-commons.es.js.map

package/dist/components/data-table/table-commons.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-commons.es.js","sources":["../../../lib/components/data-table/table-commons.tsx"],"sourcesContent":["import { FormatDate } from '@/components/data-table/table-utils/index';\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { createColumnHelper } from '@tanstack/react-table';\n\nconst cH = createColumnHelper<any>();\nexport const CHECK_BOX = [\n  cH.accessor('checkbox', {\n    header: ({ table }) => (\n      <Checkbox\n        checked={\n          table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && 'indeterminate')\n        }\n        onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}\n        aria-label=\"Select all\"\n      />\n    ),\n\n    cell: ({ row }) => (\n      <Checkbox\n        checked={row.getIsSelected()}\n        onCheckedChange={(value) => row.toggleSelected(!!value)}\n        aria-label=\"Select row\"\n      />\n    ),\n    enableSorting: false,\n    enableHiding: false,\n  }),\n];\n\nexport const ID_COLUMN = [\n  cH.accessor('id', {\n    header: () => 'ID',\n  }),\n];\nexport const DEFAULT_DATE_COLUMNS = [\n  cH.accessor('createdAt', {\n    header: () => 'Creation Date',\n    cell: ({ row }) => {\n      const date = row.getValue('createdAt') satisfies string | null | undefined;\n      return FormatDate(date);\n    },\n    enableHiding: false,\n  }),\n  cH.accessor('updatedAt', {\n    header: () => 'Last Updated',\n    cell: ({ row }) => {\n      const date = row.getValue('createdAt') satisfies string | null | undefined;\n      return FormatDate(date);\n    },\n  }),\n];\n"],"names":["cH","createColumnHelper","CHECK_BOX","table","jsx","Checkbox","value","row","ID_COLUMN","DEFAULT_DATE_COLUMNS","date","FormatDate"],"mappings":";;;;AAIA,MAAMA,IAAKC,EAAwB,GACtBC,IAAY;AAAA,EACvBF,EAAG,SAAS,YAAY;AAAA,IACtB,QAAQ,CAAC,EAAE,OAAAG,EAAA,MACT,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SACEF,EAAM,yBAAA,KAA+BA,EAAM,0BAA+B,KAAA;AAAA,QAE5E,iBAAiB,CAACG,MAAUH,EAAM,0BAA0B,CAAC,CAACG,CAAK;AAAA,QACnE,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAGF,MAAM,CAAC,EAAE,KAAAC,EAAA,MACP,gBAAAH;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASE,EAAI,cAAc;AAAA,QAC3B,iBAAiB,CAACD,MAAUC,EAAI,eAAe,CAAC,CAACD,CAAK;AAAA,QACtD,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAEF,eAAe;AAAA,IACf,cAAc;AAAA,EACf,CAAA;AACH,GAEaE,IAAY;AAAA,EACvBR,EAAG,SAAS,MAAM;AAAA,IAChB,QAAQ,MAAM;AAAA,EACf,CAAA;AACH,GACaS,IAAuB;AAAA,EAClCT,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IACxB;AAAA,IACA,cAAc;AAAA,EAAA,CACf;AAAA,EACDV,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IAAA;AAAA,EAEzB,CAAA;AACH;"}
+{"version":3,"file":"table-commons.es.js","sources":["../../../lib/components/data-table/table-commons.tsx"],"sourcesContent":["import { FormatDate } from '@/components/data-table/table-utils/index';\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { createColumnHelper } from '@tanstack/react-table';\n\nconst cH = createColumnHelper<any>();\nexport const TABLE_CHECK_BOX_COLUMN = [\n  cH.accessor('checkbox', {\n    header: ({ table }) => (\n      <Checkbox\n        checked={\n          table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && 'indeterminate')\n        }\n        onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}\n        aria-label=\"Select all\"\n      />\n    ),\n\n    cell: ({ row }) => (\n      <Checkbox\n        checked={row.getIsSelected()}\n        onCheckedChange={(value) => row.toggleSelected(!!value)}\n        aria-label=\"Select row\"\n      />\n    ),\n    enableSorting: false,\n    enableHiding: false,\n  })];\n\nexport const TABLE_ID_COLUMN = [\n  cH.accessor('id', {\n    header: () => 'ID',\n  }),\n];\nexport const TABLE_DEFAULT_DATE_COLUMNS = [\n  cH.accessor('createdAt', {\n    header: () => 'Creation Date',\n    cell: ({ row }) => {\n      const date = row.getValue('createdAt') satisfies string | null | undefined;\n      return FormatDate(date);\n    },\n    enableHiding: false,\n  }),\n  cH.accessor('updatedAt', {\n    header: () => 'Last Updated',\n    cell: ({ row }) => {\n      const date = row.getValue('createdAt') satisfies string | null | undefined;\n      return FormatDate(date);\n    },\n    enableHiding: false,\n  }),\n];\n"],"names":["cH","createColumnHelper","TABLE_CHECK_BOX_COLUMN","table","jsx","Checkbox","value","row","TABLE_ID_COLUMN","TABLE_DEFAULT_DATE_COLUMNS","date","FormatDate"],"mappings":";;;;AAIA,MAAMA,IAAKC,EAAwB,GACtBC,IAAyB;AAAA,EACpCF,EAAG,SAAS,YAAY;AAAA,IACtB,QAAQ,CAAC,EAAE,OAAAG,EAAA,MACT,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SACEF,EAAM,yBAAA,KAA+BA,EAAM,0BAA+B,KAAA;AAAA,QAE5E,iBAAiB,CAACG,MAAUH,EAAM,0BAA0B,CAAC,CAACG,CAAK;AAAA,QACnE,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAGF,MAAM,CAAC,EAAE,KAAAC,EAAA,MACP,gBAAAH;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASE,EAAI,cAAc;AAAA,QAC3B,iBAAiB,CAACD,MAAUC,EAAI,eAAe,CAAC,CAACD,CAAK;AAAA,QACtD,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAEF,eAAe;AAAA,IACf,cAAc;AAAA,EACf,CAAA;AAAC,GAESE,IAAkB;AAAA,EAC7BR,EAAG,SAAS,MAAM;AAAA,IAChB,QAAQ,MAAM;AAAA,EACf,CAAA;AACH,GACaS,IAA6B;AAAA,EACxCT,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IACxB;AAAA,IACA,cAAc;AAAA,EAAA,CACf;AAAA,EACDV,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IACxB;AAAA,IACA,cAAc;AAAA,EACf,CAAA;AACH;"}

package/dist/components/data-table/table-content.es.js

@@ -1,25 +1,22 @@
-import { jsxs as r, jsx as e, Fragment as d } from "react/jsx-runtime";
-import { Table as p, TableHeader as h, TableRow as c, TableCell as a, TableBody as u, TableFooter as f } from "../ui/table.es.js";
-import { flexRender as m } from "@tanstack/react-table";
-import { Info as x } from "lucide-react";
-function y({
+import { jsxs as r, jsx as e, Fragment as m } from "react/jsx-runtime";
+import { ACTIONS_COLUMN_ID as d } from "./data-table.es.js";
+import { Table as p, TableHeader as f, TableRow as c, TableCell as i, TableBody as h, TableFooter as x } from "../ui/table.es.js";
+import { flexRender as g } from "@tanstack/react-table";
+import { Info as b } from "lucide-react";
+function I({
   table: n,
-  columns: g,
+  columns: u,
   dataQuery: s
 }) {
-  var i;
-  return /* @__PURE__ */ r(p, { className: "relative h-full w-full", children: [
-    /* @__PURE__ */ e(h, { className: "sticky top-0 z-10", children: n.getHeaderGroups().map((o, l) => /* @__PURE__ */ e(c, { className: "border-b", children: o.headers.map((t) => /* @__PURE__ */ r(
-      a,
+  var a;
+  return /* @__PURE__ */ r(p, { className: "size-full", children: [
+    /* @__PURE__ */ e(f, { className: "sticky top-0 z-10", children: n.getHeaderGroups().map((o, l) => /* @__PURE__ */ e(c, { children: o.headers.map((t) => /* @__PURE__ */ r(
+      i,
       {
-        className: `
-                  px-4 py-2 text-left text-sm font-medium cursor-pointer whitespace-nowrap 
-                  bg-card 
-                  ${t.id === "actions" ? "sticky right-0 z-50 bg-card" : ""}
-                `,
+        className: `px-4 py-2 cursor-pointer text-left text-sm font-medium bg-card whitespace-nowrap ${t.id === d ? "sticky right-0 z-50 text-center" : ""}`,
         onClick: t.column.getToggleSortingHandler(),
         children: [
-          t.isPlaceholder ? null : m(t.column.columnDef.header, t.getContext()),
+          t.isPlaceholder ? null : g(t.column.columnDef.header, t.getContext()),
           {
             asc: "↑",
             desc: "↓"
@@ -28,24 +25,30 @@ function y({
       },
       t.id
     )) }, l)) }),
-    /* @__PURE__ */ e(u, { className: "flex-1 overflow-y-auto", children: n.getRowModel().rows.length ? n.getRowModel().rows.map((o) => /* @__PURE__ */ e(c, { "data-state": o.getIsSelected() && "selected", children: o.getVisibleCells().map((l) => /* @__PURE__ */ e(
-      a,
-      {
-        className: `
-                    px-4 py-2 text-left text-sm whitespace-nowrap 
-                    ${l.column.id === "actions" ? "sticky right-0 bg-card text-center shadow-2xl" : ""}
+    /* @__PURE__ */ e(h, { className: "flex-1 overflow-y-auto", children: n.getRowModel().rows.length ? (
+      // Render table data
+      n.getRowModel().rows.map((o) => /* @__PURE__ */ e(c, { className: "transition-colors data-[state=selected]:bg-muted-foreground/30 hover:bg-muted-foreground/20", "data-state": o.getIsSelected() && "selected", children: o.getVisibleCells().map((l) => /* @__PURE__ */ e(
+        i,
+        {
+          className: `
+                    px-4 py-2 text-left text-sm whitespace-nowrap
+                    ${l.column.id === d ? "sticky right-0 w-20 bg-card" : ""}
                   `,
-        children: m(l.column.columnDef.cell, l.getContext())
-      },
-      l.id
-    )) }, o.id)) : /* @__PURE__ */ e(c, { className: "h-[55vh] hover:bg-transparent cursor-not-allowed", children: /* @__PURE__ */ e(a, { colSpan: g.length, className: "border-none", children: /* @__PURE__ */ e("span", { className: "flex gap-3 justify-center items-center", children: !s.isFetching && (s.isError ? /* @__PURE__ */ r(d, { children: [
-      /* @__PURE__ */ e(x, {}),
-      " You don't have the required permissions. Please contact your admin."
-    ] }) : (i = s.data) != null && i.data ? null : /* @__PURE__ */ e(d, { children: "No result found." })) }) }) }) }),
-    s.isFetching && /* @__PURE__ */ e(f, { className: "absolute inset-0 z-20 flex justify-center items-center bg-card/80" })
+          children: g(l.column.columnDef.cell, l.getContext())
+        },
+        l.id
+      )) }, o.id))
+    ) : (
+      // Empty table
+      /* @__PURE__ */ e(c, { className: "cursor-not-allowed", children: /* @__PURE__ */ e(i, { colSpan: u.length, className: "border-none", children: /* @__PURE__ */ e("span", { className: "flex gap-3 justify-center items-center", children: !s.isFetching && (s.isError ? /* @__PURE__ */ r(m, { children: [
+        /* @__PURE__ */ e(b, {}),
+        " You don't have the required permissions. Please contact your admin."
+      ] }) : (a = s.data) != null && a.data ? null : /* @__PURE__ */ e(m, { children: "No result found." })) }) }) })
+    ) }),
+    s.isFetching && /* @__PURE__ */ e(x, { className: "absolute inset-0 z-20 flex justify-center items-center bg-card/80" })
   ] });
 }
 export {
-  y as TableContent
+  I as TableContent
 };
 //# sourceMappingURL=table-content.es.js.map

package/dist/components/data-table/table-content.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-content.es.js","sources":["../../../lib/components/data-table/table-content.tsx"],"sourcesContent":["import {\n  Table as CxTable,\n  TableBody,\n  TableCell,\n  TableFooter,\n  TableHeader,\n  TableRow,\n} from '@/components/ui/table';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { ColumnDef, Table, flexRender } from '@tanstack/react-table';\nimport { Info } from 'lucide-react';\n\nexport function TableContent<TData, TValue>({\n  table,\n  columns,\n  dataQuery,\n}: {\n  table: Table<TData>;\n  columns: ColumnDef<TData, TValue>[];\n  dataQuery: UseQueryResult<any, unknown>;\n}) {\n  return (\n    <CxTable className=\"relative h-full w-full\">\n      <TableHeader className=\"sticky top-0 z-10\">\n        {table.getHeaderGroups().map((headerGroup, index) => (\n          <TableRow key={index} className=\"border-b\">\n            {headerGroup.headers.map((header) => (\n              <TableCell\n                key={header.id}\n                className={`\n                  px-4 py-2 text-left text-sm font-medium cursor-pointer whitespace-nowrap \n                  bg-card \n                  ${header.id === 'actions' ? 'sticky right-0 z-50 bg-card' : ''}\n                `}\n                onClick={header.column.getToggleSortingHandler()}\n              >\n                {header.isPlaceholder\n                  ? null\n                  : flexRender(header.column.columnDef.header, header.getContext())}\n                {{\n                  asc: '↑',\n                  desc: '↓',\n                }[header.column.getIsSorted() as string] ?? null}\n              </TableCell>\n            ))}\n          </TableRow>\n        ))}\n      </TableHeader>\n      <TableBody className=\"flex-1 overflow-y-auto\">\n        {table.getRowModel().rows.length ? (\n          table.getRowModel().rows.map((row) => (\n            <TableRow key={row.id} data-state={row.getIsSelected() && 'selected'}>\n              {row.getVisibleCells().map((cell) => (\n                <TableCell\n                  key={cell.id}\n                  className={`\n                    px-4 py-2 text-left text-sm whitespace-nowrap \n                    ${\n                      cell.column.id === 'actions'\n                        ? 'sticky right-0 bg-card text-center shadow-2xl'\n                        : ''\n                    }\n                  `}\n                >\n                  {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                </TableCell>\n              ))}\n            </TableRow>\n          ))\n        ) : (\n          <TableRow className=\"h-[55vh] hover:bg-transparent cursor-not-allowed\">\n          <TableCell colSpan={columns.length} className=\"border-none\">\n            <span className=\"flex gap-3 justify-center items-center\">\n              {!dataQuery.isFetching && (\n                dataQuery.isError ? (\n                  <>\n                    <Info /> You don't have the required permissions. Please contact your admin.\n                  </>\n                ) : !dataQuery.data?.data ? (\n                  <>No result found.</>\n                ) : null\n              )}\n            </span>\n          </TableCell>\n        </TableRow>\n        \n        )}\n      </TableBody>\n      {/* Loader positioned to cover entire table viewport */}\n      {dataQuery.isFetching && (\n        <TableFooter className=\"absolute inset-0 z-20 flex justify-center items-center bg-card/80\" />\n      )}\n    </CxTable>\n  );\n}\n"],"names":["TableContent","table","columns","dataQuery","jsxs","CxTable","jsx","TableHeader","headerGroup","index","TableRow","header","TableCell","flexRender","TableBody","row","cell","Fragment","Info","_a","TableFooter"],"mappings":";;;;AAYO,SAASA,EAA4B;AAAA,EAC1C,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AACF,GAIG;;AAEC,SAAA,gBAAAC,EAACC,GAAQ,EAAA,WAAU,0BACjB,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAY,WAAU,qBACpB,YAAM,gBAAgB,EAAE,IAAI,CAACC,GAAaC,MACzC,gBAAAH,EAACI,KAAqB,WAAU,YAC7B,YAAY,QAAQ,IAAI,CAACC,MACxB,gBAAAP;AAAA,MAACQ;AAAA,MAAA;AAAA,QAEC,WAAW;AAAA;AAAA;AAAA,oBAGPD,EAAO,OAAO,YAAY,gCAAgC,EAAE;AAAA;AAAA,QAEhE,SAASA,EAAO,OAAO,wBAAwB;AAAA,QAE9C,UAAA;AAAA,UAAOA,EAAA,gBACJ,OACAE,EAAWF,EAAO,OAAO,UAAU,QAAQA,EAAO,YAAY;AAAA,UACjE;AAAA,YACC,KAAK;AAAA,YACL,MAAM;AAAA,UACN,EAAAA,EAAO,OAAO,YAAA,CAAuB,KAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAdvCA,EAAO;AAAA,IAAA,CAgBf,EAAA,GAnBYF,CAoBf,CACD,GACH;AAAA,IACC,gBAAAH,EAAAQ,GAAA,EAAU,WAAU,0BAClB,UAAMb,EAAA,YAAA,EAAc,KAAK,SACxBA,EAAM,YAAY,EAAE,KAAK,IAAI,CAACc,MAC3B,gBAAAT,EAAAI,GAAA,EAAsB,cAAYK,EAAI,cAAc,KAAK,YACvD,UAAAA,EAAI,gBAAgB,EAAE,IAAI,CAACC,MAC1B,gBAAAV;AAAA,MAACM;AAAA,MAAA;AAAA,QAEC,WAAW;AAAA;AAAA,sBAGPI,EAAK,OAAO,OAAO,YACf,kDACA,EACN;AAAA;AAAA,QAGD,YAAWA,EAAK,OAAO,UAAU,MAAMA,EAAK,WAAY,CAAA;AAAA,MAAA;AAAA,MAVpDA,EAAK;AAAA,IAAA,CAYb,EAfY,GAAAD,EAAI,EAgBnB,CACD,IAED,gBAAAT,EAACI,GAAS,EAAA,WAAU,oDACpB,UAAA,gBAAAJ,EAACM,GAAU,EAAA,SAASV,EAAQ,QAAQ,WAAU,eAC5C,UAAA,gBAAAI,EAAC,QAAK,EAAA,WAAU,0CACb,UAAA,CAACH,EAAU,eACVA,EAAU,UAEN,gBAAAC,EAAAa,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAX,EAACY,GAAK,EAAA;AAAA,MAAE;AAAA,IAAA,EACV,CAAA,KACGC,IAAAhB,EAAU,SAAV,QAAAgB,EAAgB,OAEjB,OADA,gBAAAb,EAAAW,GAAA,EAAA,UAAA,mBAAA,CAAgB,GAGxB,CAAA,EACF,CAAA,EACF,CAAA,GAGF;AAAA,IAECd,EAAU,cACR,gBAAAG,EAAAc,GAAA,EAAY,WAAU,oEAAoE,CAAA;AAAA,EAAA,GAE/F;AAEJ;"}
+{"version":3,"file":"table-content.es.js","sources":["../../../lib/components/data-table/table-content.tsx"],"sourcesContent":["import { ACTIONS_COLUMN_ID } from '@/components/data-table/data-table';\nimport {\n  TableBody,\n  TableCell,\n  Table as TableComponent,\n  TableFooter,\n  TableHeader,\n  TableRow,\n} from '@/components/ui/table';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { ColumnDef, Table, flexRender } from '@tanstack/react-table';\nimport { Info } from 'lucide-react';\n\nexport function TableContent<TData, TValue>({\n  table,\n  columns,\n  dataQuery,\n}: {\n  table: Table<TData>;\n  columns: ColumnDef<TData, TValue>[];\n  dataQuery: UseQueryResult<any, unknown>;\n}) {\n  return (\n    <TableComponent className=\"size-full\">\n      <TableHeader className=\"sticky top-0 z-10\">\n        {table.getHeaderGroups().map((headerGroup, index) => (\n          <TableRow key={index}>\n            {headerGroup.headers.map((header) => (\n              <TableCell\n                key={header.id}\n                className={`px-4 py-2 cursor-pointer text-left text-sm font-medium bg-card whitespace-nowrap ${header.id === ACTIONS_COLUMN_ID ? 'sticky right-0 z-50 text-center' : ''}`}\n                onClick={header.column.getToggleSortingHandler()}\n              >\n                {/* TODO Better interaction design here. */}\n                {header.isPlaceholder\n                  ? null\n                  : flexRender(header.column.columnDef.header, header.getContext())}\n\n                {{\n                  asc: '↑',\n                  desc: '↓',\n                }[header.column.getIsSorted() as string] ?? null}\n              </TableCell>\n            ))}\n          </TableRow>\n        ))}\n      </TableHeader>\n      <TableBody className=\"flex-1 overflow-y-auto\">\n        {table.getRowModel().rows.length ?\n          // Render table data\n          (\n            table.getRowModel().rows.map((row) => (\n              <TableRow className='transition-colors data-[state=selected]:bg-muted-foreground/30 hover:bg-muted-foreground/20' key={row.id} data-state={row.getIsSelected() && 'selected'}>\n                {row.getVisibleCells().map((cell) => (\n                  <TableCell\n                    key={cell.id}\n                    className={`\n                    px-4 py-2 text-left text-sm whitespace-nowrap\n                    ${cell.column.id === ACTIONS_COLUMN_ID\n                        ? 'sticky right-0 w-20 bg-card'\n                        : ''\n                      }\n                  `}\n                  >\n                    {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                  </TableCell>\n                ))}\n              </TableRow>\n            ))\n          )\n          :\n          // Empty table\n          (\n            <TableRow className=\"cursor-not-allowed\">\n              <TableCell colSpan={columns.length} className=\"border-none\">\n                <span className=\"flex gap-3 justify-center items-center\">\n                  {!dataQuery.isFetching && (\n                    dataQuery.isError ? (\n                      <>\n                        <Info /> You don't have the required permissions. Please contact your admin.\n                      </>\n                    ) : !dataQuery.data?.data ? (\n                      <>No result found.</>\n                    ) : null\n                  )}\n                </span>\n              </TableCell>\n            </TableRow>\n          )}\n      </TableBody>\n      {/* Loader positioned to cover entire table viewport */}\n      {dataQuery.isFetching && (\n        <TableFooter className=\"absolute inset-0 z-20 flex justify-center items-center bg-card/80\" />\n      )}\n    </TableComponent>\n  );\n}\n"],"names":["TableContent","table","columns","dataQuery","jsxs","TableComponent","jsx","TableHeader","headerGroup","index","TableRow","header","TableCell","ACTIONS_COLUMN_ID","flexRender","TableBody","row","cell","Fragment","Info","_a","TableFooter"],"mappings":";;;;;AAaO,SAASA,EAA4B;AAAA,EAC1C,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AACF,GAIG;;AAEC,SAAA,gBAAAC,EAACC,GAAe,EAAA,WAAU,aACxB,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAY,WAAU,qBACpB,UAAMN,EAAA,kBAAkB,IAAI,CAACO,GAAaC,wBACxCC,GACE,EAAA,UAAAF,EAAY,QAAQ,IAAI,CAACG,MACxB,gBAAAP;AAAA,MAACQ;AAAA,MAAA;AAAA,QAEC,WAAW,oFAAoFD,EAAO,OAAOE,IAAoB,oCAAoC,EAAE;AAAA,QACvK,SAASF,EAAO,OAAO,wBAAwB;AAAA,QAG9C,UAAA;AAAA,UAAOA,EAAA,gBACJ,OACAG,EAAWH,EAAO,OAAO,UAAU,QAAQA,EAAO,YAAY;AAAA,UAEjE;AAAA,YACC,KAAK;AAAA,YACL,MAAM;AAAA,UACN,EAAAA,EAAO,OAAO,YAAA,CAAuB,KAAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAZvCA,EAAO;AAAA,IAAA,CAcf,EAAA,GAjBYF,CAkBf,CACD,GACH;AAAA,sBACCM,GAAU,EAAA,WAAU,0BAClB,UAAMd,EAAA,cAAc,KAAK;AAAA;AAAA,MAGtBA,EAAM,cAAc,KAAK,IAAI,CAACe,wBAC3BN,GAAS,EAAA,WAAU,+FAA2G,cAAYM,EAAI,mBAAmB,YAC/J,YAAI,kBAAkB,IAAI,CAACC,MAC1B,gBAAAX;AAAA,QAACM;AAAA,QAAA;AAAA,UAEC,WAAW;AAAA;AAAA,sBAETK,EAAK,OAAO,OAAOJ,IACf,gCACA,EACJ;AAAA;AAAA,UAGD,YAAWI,EAAK,OAAO,UAAU,MAAMA,EAAK,WAAY,CAAA;AAAA,QAAA;AAAA,QATpDA,EAAK;AAAA,MAAA,CAWb,EAAA,GAdoHD,EAAI,EAe3H,CACD;AAAA;AAAA;AAAA,MAKD,gBAAAV,EAACI,KAAS,WAAU,sBAClB,4BAACE,GAAU,EAAA,SAASV,EAAQ,QAAQ,WAAU,eAC5C,UAAC,gBAAAI,EAAA,QAAA,EAAK,WAAU,0CACb,UAAA,CAACH,EAAU,eACVA,EAAU,UAEN,gBAAAC,EAAAc,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAZ,EAACa,GAAK,EAAA;AAAA,QAAE;AAAA,MACV,EAAA,CAAA,KACGC,IAAAjB,EAAU,SAAV,QAAAiB,EAAgB,OAEjB,8BADA,UAAgB,mBAAA,CAAA,GAGxB,CAAA,EACF,CAAA,EACF,CAAA;AAAA,OAEN;AAAA,IAECjB,EAAU,cACR,gBAAAG,EAAAe,GAAA,EAAY,WAAU,oEAAoE,CAAA;AAAA,EAAA,GAE/F;AAEJ;"}

package/dist/components/data-table/table-filter.es.js

@@ -2,27 +2,27 @@ import { jsxs as n, jsx as e, Fragment as M } from "react/jsx-runtime";
 import { Badge as $ } from "../ui/badge.es.js";
 import { Button as F } from "../ui/button.es.js";
 import { Calendar as q } from "../ui/calendar.es.js";
-import { Form as B, FormField as s, FormItem as m, FormLabel as u, FormControl as h, FormMessage as p } from "../ui/form.es.js";
+import { Form as B, FormField as m, FormItem as s, FormLabel as u, FormControl as h, FormMessage as p } from "../ui/form.es.js";
 import { Input as P } from "../ui/input.es.js";
-import { Popover as f, PopoverTrigger as R, PopoverContent as b } from "../ui/popover.es.js";
-import { Select as N, SelectTrigger as S, SelectValue as y, SelectContent as w, SelectItem as v } from "../ui/select.es.js";
+import { Popover as R, PopoverTrigger as b, PopoverContent as f } from "../ui/popover.es.js";
+import { Select as N, SelectTrigger as S, SelectValue as y, SelectContent as w, SelectItem as g } from "../ui/select.es.js";
 import { cn as k } from "../../utils/index.es.js";
 import { zodResolver as U } from "@hookform/resolvers/zod";
 import { format as X } from "date-fns";
 import { X as Y, FilterIcon as G } from "lucide-react";
 import { useState as T } from "react";
 import { useForm as H } from "react-hook-form";
-import g from "zod";
+import v from "zod";
 import { getResourceDisplayName as E, COMPARISON_OPERATOR_LABELS as j, OPERATORS_FOR_FILTER_TYPE as J, FILTER_COMPARISON_OPERATORS as K } from "./table-utils/constants.es.js";
-const Q = g.object({
+const Q = v.object({
   // For identifing  a filter for updation and deletion
-  id: g.string().min(1, "Field is required"),
-  property: g.string().min(1, "Field is required."),
-  operator: g.enum(K, {
+  id: v.string().min(1, "Field is required"),
+  property: v.string().min(1, "Field is required."),
+  operator: v.enum(K, {
     errorMap: () => ({ message: "Invalid comparison operator" })
   }),
-  value: g.string().min(1, "Field is required.")
-}), ve = ({
+  value: v.string().min(1, "Field is required.")
+}), ge = ({
   filterableProperties: t,
   filters: c,
   onFiltersChange: a
@@ -54,11 +54,11 @@ const Q = g.object({
     };
     return /* @__PURE__ */ e(B, { ...l, children: /* @__PURE__ */ n("form", { onSubmit: l.handleSubmit(V), className: "flex flex-col gap-2 min-w-60", children: [
       /* @__PURE__ */ e(
-        s,
+        m,
         {
           control: l.control,
           name: "property",
-          render: ({ field: d }) => /* @__PURE__ */ n(m, { children: [
+          render: ({ field: d }) => /* @__PURE__ */ n(s, { children: [
             /* @__PURE__ */ e(u, { children: "Property" }),
             /* @__PURE__ */ n(
               N,
@@ -68,7 +68,7 @@ const Q = g.object({
                 disabled: !!r,
                 children: [
                   /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(y, {}) }) }),
-                  /* @__PURE__ */ e(w, { autoFocus: !0, children: Object.entries(t).map(([o]) => /* @__PURE__ */ e(v, { value: o, children: E(o, "admin-portal") }, o)) })
+                  /* @__PURE__ */ e(w, { autoFocus: !0, children: Object.entries(t).map(([o]) => /* @__PURE__ */ e(g, { value: o, children: E(o, "admin-portal") }, o)) })
                 ]
               }
             ),
@@ -78,16 +78,16 @@ const Q = g.object({
       ),
       i && /* @__PURE__ */ n(M, { children: [
         /* @__PURE__ */ e(
-          s,
+          m,
           {
             control: l.control,
             name: "operator",
-            render: ({ field: d }) => /* @__PURE__ */ n(m, { children: [
+            render: ({ field: d }) => /* @__PURE__ */ n(s, { children: [
               /* @__PURE__ */ e(u, { children: "Comparison" }),
               /* @__PURE__ */ n(N, { onValueChange: d.onChange, defaultValue: d.value, children: [
                 /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(y, {}) }) }),
                 /* @__PURE__ */ e(w, { children: t[i] && J[t[i]].map(
-                  (o) => /* @__PURE__ */ e(v, { value: o, children: j[o] }, o)
+                  (o) => /* @__PURE__ */ e(g, { value: o, children: j[o] }, o)
                 ) })
               ] }),
               /* @__PURE__ */ e(p, {})
@@ -114,23 +114,21 @@ const Q = g.object({
       /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-2 items-center", children: c.map((r, l) => /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ n("div", { className: "flex items-center", children: [
           /* @__PURE__ */ n(
-            f,
+            R,
             {
               open: x === r.id,
               onOpenChange: (i) => {
                 i || C(null);
               },
               children: [
-                /* @__PURE__ */ e(R, { children: /* @__PURE__ */ e(
+                /* @__PURE__ */ e(b, { children: /* @__PURE__ */ e(
                   $,
                   {
                     onClick: () => C(r.id),
-                    variant: "default",
-                    className: "cursor-pointer h-7",
                     children: L(r)
                   }
                 ) }),
-                /* @__PURE__ */ e(b, { className: "w-auto", align: "start", children: /* @__PURE__ */ e(A, { filter: r }) })
+                /* @__PURE__ */ e(f, { className: "w-auto", align: "start", children: /* @__PURE__ */ e(A, { filter: r }) })
               ]
             }
           ),
@@ -139,8 +137,7 @@ const Q = g.object({
             {
               icon: Y,
               variant: "destructive",
-              className: "h-7 -ml-0.5",
-              size: "icon",
+              size: "sm",
               onClick: () => _(r.id)
             }
           )
@@ -148,26 +145,26 @@ const Q = g.object({
         l < c.length - 1 && /* @__PURE__ */ e("span", { className: "text-sm text-muted-foreground", children: "and" })
       ] }, r.id)) })
     ] }) }),
-    /* @__PURE__ */ n(f, { open: z, onOpenChange: O, children: [
-      /* @__PURE__ */ e(R, { asChild: !0, children: /* @__PURE__ */ e(F, { icon: G, variant: "outline" }) }),
-      /* @__PURE__ */ e(b, { className: "w-auto p-4", align: "start", children: /* @__PURE__ */ e(A, {}) })
+    /* @__PURE__ */ n(R, { open: z, onOpenChange: O, children: [
+      /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ e(F, { icon: G, variant: "outline" }) }),
+      /* @__PURE__ */ e(f, { className: "w-auto p-4", align: "start", children: /* @__PURE__ */ e(A, {}) })
     ] })
   ] });
 }, W = ({ control: t, propertyType: c }) => {
   switch (c) {
     case "boolean":
       return /* @__PURE__ */ e(
-        s,
+        m,
         {
           control: t,
           name: "value",
-          render: ({ field: a }) => /* @__PURE__ */ n(m, { children: [
+          render: ({ field: a }) => /* @__PURE__ */ n(s, { children: [
             /* @__PURE__ */ e(u, { children: "Value" }),
             /* @__PURE__ */ n(N, { onValueChange: a.onChange, defaultValue: a.value, children: [
               /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(y, {}) }) }),
               /* @__PURE__ */ n(w, { children: [
-                /* @__PURE__ */ e(v, { value: "true", children: "True" }),
-                /* @__PURE__ */ e(v, { value: "false", children: "False" })
+                /* @__PURE__ */ e(g, { value: "true", children: "True" }),
+                /* @__PURE__ */ e(g, { value: "false", children: "False" })
               ] })
             ] }),
             /* @__PURE__ */ e(p, {})
@@ -176,14 +173,14 @@ const Q = g.object({
       );
     case "objectDate":
       return /* @__PURE__ */ e(
-        s,
+        m,
         {
           control: t,
           name: "value",
-          render: ({ field: a }) => /* @__PURE__ */ n(m, { className: "flex flex-col", children: [
+          render: ({ field: a }) => /* @__PURE__ */ n(s, { className: "flex flex-col", children: [
             /* @__PURE__ */ e(u, { children: "Value" }),
-            /* @__PURE__ */ n(f, { children: [
-              /* @__PURE__ */ e(R, { asChild: !0, children: /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(
+            /* @__PURE__ */ n(R, { children: [
+              /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(
                 F,
                 {
                   variant: "outline",
@@ -194,7 +191,7 @@ const Q = g.object({
                   children: a.value ? X(new Date(a.value), "PPP") : /* @__PURE__ */ e("span", { children: "Pick a date" })
                 }
               ) }) }),
-              /* @__PURE__ */ e(b, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ e(
+              /* @__PURE__ */ e(f, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ e(
                 q,
                 {
                   mode: "single",
@@ -212,18 +209,18 @@ const Q = g.object({
       );
     case "role":
       return /* @__PURE__ */ e(
-        s,
+        m,
         {
           control: t,
           name: "value",
-          render: ({ field: a }) => /* @__PURE__ */ n(m, { children: [
+          render: ({ field: a }) => /* @__PURE__ */ n(s, { children: [
             /* @__PURE__ */ e(u, { children: "Value" }),
             /* @__PURE__ */ n(N, { onValueChange: a.onChange, defaultValue: a.value, children: [
               /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(y, {}) }) }),
               /* @__PURE__ */ n(w, { children: [
-                /* @__PURE__ */ e(v, { value: "user", children: "User" }),
-                /* @__PURE__ */ e(v, { value: "organization-admin", children: "Organization Admin" }),
-                /* @__PURE__ */ e(v, { value: "reseller-admin", children: "Reseller Admin" })
+                /* @__PURE__ */ e(g, { value: "user", children: "User" }),
+                /* @__PURE__ */ e(g, { value: "organization-admin", children: "Organization Admin" }),
+                /* @__PURE__ */ e(g, { value: "reseller-admin", children: "Reseller Admin" })
               ] })
             ] }),
             /* @__PURE__ */ e(p, {})
@@ -232,11 +229,11 @@ const Q = g.object({
       );
     case "number":
       return /* @__PURE__ */ e(
-        s,
+        m,
         {
           control: t,
           name: "value",
-          render: ({ field: a }) => /* @__PURE__ */ n(m, { children: [
+          render: ({ field: a }) => /* @__PURE__ */ n(s, { children: [
             /* @__PURE__ */ e(u, { children: "Value" }),
             /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(P, { ...a, type: "number" }) }),
             /* @__PURE__ */ e(p, {})
@@ -245,11 +242,11 @@ const Q = g.object({
       );
     default:
       return /* @__PURE__ */ e(
-        s,
+        m,
         {
           control: t,
           name: "value",
-          render: ({ field: a }) => /* @__PURE__ */ n(m, { children: [
+          render: ({ field: a }) => /* @__PURE__ */ n(s, { children: [
             /* @__PURE__ */ e(u, { children: "Value" }),
             /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(P, { ...a, type: "text" }) }),
             /* @__PURE__ */ e(p, {})
@@ -259,6 +256,6 @@ const Q = g.object({
   }
 };
 export {
-  ve as TableFilter
+  ge as TableFilter
 };
 //# sourceMappingURL=table-filter.es.js.map