@cryptlex/web-components 6.1.0 → 6.3.0

package/dist/components/badge.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{classNames as i}from"../utils/primitives.js";import"clsx";function m({className:n,children:t,...r}){return e("span",{className:i("text-muted leading-none text-sm px-1 inline-flex items-center justify-center select-none bg-card border h-input focus:outline-hidden focus:ring-1 focus:ring-ring",n),...r,children:e("span",{children:t})})}export{m as Badge};
+import{jsx as e}from"react/jsx-runtime";import{classNames as i}from"../utils/primitives.js";import"clsx";function m({className:n,children:t,...r}){return e("span",{className:i("text-muted leading-none text-sm px-1 inline-flex items-center justify-center select-none bg-popover border h-input focus:outline-hidden focus:ring-1 focus:ring-ring",n),...r,children:e("span",{children:t})})}export{m as Badge};
 //# sourceMappingURL=badge.js.map

package/dist/components/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","sources":["../../lib/components/badge.tsx"],"sourcesContent":["import { classNames } from \"lib/utils/primitives\";\n\nexport function Badge({ className, children, ...props }: React.ComponentProps<\"span\">) {\n\treturn (\n\t\t<span\n\t\t\tclassName={classNames(\n\t\t\t\t\"text-muted leading-none text-sm px-1 inline-flex items-center justify-center select-none bg-card border h-input focus:outline-hidden focus:ring-1 focus:ring-ring\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{/* Contents */}\n\t\t\t<span>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t</span>\n\t);\n}\n"],"names":["Badge","className","children","props","jsx","classNames"],"mappings":"yGAEO,SAASA,EAAM,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,GAAuC,CACtF,OACCC,EAAC,OAAA,CACA,UAAWC,EACV,oKACAJ,CAAA,EAEA,GAAGE,EAGJ,SAAAC,EAAC,QACC,SAAAF,CAAA,CACF,CAAA,CAAA,CAGH"}
+{"version":3,"file":"badge.js","sources":["../../lib/components/badge.tsx"],"sourcesContent":["import { classNames } from \"lib/utils/primitives\";\n\nexport function Badge({ className, children, ...props }: React.ComponentProps<\"span\">) {\n\treturn (\n\t\t<span\n\t\t\tclassName={classNames(\n\t\t\t\t\"text-muted leading-none text-sm px-1 inline-flex items-center justify-center select-none bg-popover border h-input focus:outline-hidden focus:ring-1 focus:ring-ring\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{/* Contents */}\n\t\t\t<span>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t</span>\n\t);\n}\n"],"names":["Badge","className","children","props","jsx","classNames"],"mappings":"yGAEO,SAASA,EAAM,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,GAAuC,CACtF,OACCC,EAAC,OAAA,CACA,UAAWC,EACV,uKACAJ,CAAA,EAEA,GAAGE,EAGJ,SAAAC,EAAC,QACC,SAAAF,CAAA,CACF,CAAA,CAAA,CAGH"}

package/dist/components/checkbox.d.ts

@@ -2,7 +2,7 @@ import { CheckboxProps as AriaCheckboxProps } from 'react-aria-components';
 import { FormFieldProps } from 'lib/components/field';
 export declare const CheckboxGroup: (props: import('react-aria-components').CheckboxGroupProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement | null;
 type CheckboxProps = AriaCheckboxProps & FormFieldProps;
-export declare function Checkbox({ className, label, description, errorMessage, ...props }: Omit<CheckboxProps, 'children'>): import("react/jsx-runtime").JSX.Element;
+export declare function Checkbox({ className, label, description, errorMessage, ...props }: Omit<CheckboxProps, "children">): import("react/jsx-runtime").JSX.Element;
 export type TfCheckboxProps = Omit<React.ComponentProps<typeof Checkbox>, "onChange" | "onBlur" | "isChecked">;
 export declare function TfCheckbox({ ...props }: TfCheckboxProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/checkbox.js

@@ -1,2 +1,2 @@
-import{jsx as e,Fragment as c}from"react/jsx-runtime";import{Checkbox as l,composeRenderProps as a,CheckboxGroup as m}from"react-aria-components";import{FormField as b,labelVariants as p}from"./field.js";import{useFieldContext as h}from"../utils/form-context.js";import{classNames as d}from"../utils/primitives.js";import{Minus as x,Check as g}from"lucide-react";import"class-variance-authority";import"@tanstack/react-form";import"clsx";const j=m;function f({className:r,label:o,description:n,errorMessage:s,...u}){return e("div",{className:"group form-field",children:e(b,{label:o,description:n,errorMessage:s,children:e(l,{className:a(r,t=>d("group/checkbox cursor-pointer focus-ring flex items-center gap-x-2","disabled-muted",p,t)),...u,children:a(e(c,{}),(t,i)=>e(c,{children:e("div",{className:d("flex size-input shrink-0 items-center bg-card justify-center border border-input text-current ring-offset-background","group-data-[indeterminate]/checkbox:bg-primary group-data-[selected]/checkbox:bg-primary group-data-[indeterminate]/checkbox:text-primary-foreground  group-data-[selected]/checkbox:text-primary-foreground","group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50","group-data-[invalid]/checkbox:border-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground","focus:outline-none focus-visible:outline-none"),children:i.isIndeterminate?e(x,{className:"size-icon"}):i.isSelected?e(g,{className:"size-icon"}):null})}))})})})}function B({...r}){const o=h();return e(f,{isSelected:o.state.value,isDisabled:o.form.state.isSubmitting||r.isDisabled,onChange:()=>o.handleChange(!o.state.value),onBlur:o.handleBlur,...r})}export{f as Checkbox,j as CheckboxGroup,B as TfCheckbox};
+import{jsx as e,Fragment as a}from"react/jsx-runtime";import{Checkbox as u,composeRenderProps as c,CheckboxGroup as m}from"react-aria-components";import{FormField as b,labelVariants as p}from"./field.js";import{useTfFieldContext as h}from"../utils/form-utils.js";import{classNames as d}from"../utils/primitives.js";import{Minus as x,Check as g}from"lucide-react";import"class-variance-authority";import"../utils/form-context.js";import"@tanstack/react-form";import"react";import"clsx";const B=m;function f({className:r,label:o,description:s,errorMessage:n,...l}){return e("div",{className:"group form-field",children:e(b,{label:o,description:s,errorMessage:n,children:e(u,{className:c(r,t=>d("group/checkbox cursor-pointer focus-ring flex items-center gap-x-2","disabled-muted",p,t)),...l,children:c(e(a,{}),(t,i)=>e(a,{children:e("div",{className:d("flex size-input shrink-0 items-center bg-popover justify-center border border-input text-current ring-offset-background","group-data-[indeterminate]/checkbox:bg-primary group-data-[selected]/checkbox:bg-primary group-data-[indeterminate]/checkbox:text-primary-foreground  group-data-[selected]/checkbox:text-primary-foreground","group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50","group-data-[invalid]/checkbox:border-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground","focus:outline-none focus-visible:outline-none"),children:i.isIndeterminate?e(x,{className:"size-icon"}):i.isSelected?e(g,{className:"size-icon"}):null})}))})})})}function T({...r}){const o=h({disabled:r.isDisabled});return e(f,{isSelected:o.state.value,isDisabled:o.form.state.isSubmitting||r.isDisabled,onChange:()=>o.handleChange(!o.state.value),onBlur:o.handleBlur,...r})}export{f as Checkbox,B as CheckboxGroup,T as TfCheckbox};
 //# sourceMappingURL=checkbox.js.map

package/dist/components/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sources":["../../lib/components/checkbox.tsx"],"sourcesContent":["import {\n  Checkbox as AriaCheckbox,\n  CheckboxGroup as AriaCheckboxGroup,\n  composeRenderProps,\n  type CheckboxProps as AriaCheckboxProps\n} from \"react-aria-components\";\n\nimport { FormField, labelVariants, type FormFieldProps } from \"lib/components/field\";\nimport { useFieldContext } from \"lib/utils/form-context\";\nimport { classNames } from \"lib/utils/primitives\";\nimport { Check, Minus } from \"lucide-react\";\n\nexport const CheckboxGroup = AriaCheckboxGroup\ntype CheckboxProps = AriaCheckboxProps & FormFieldProps;\nexport function Checkbox({ className, label, description, errorMessage, ...props }: Omit<CheckboxProps, 'children'>) {\n  return (\n    <div className=\"group form-field\">\n      <FormField label={label} description={description} errorMessage={errorMessage}>\n        <AriaCheckbox\n          className={composeRenderProps(className, (className) =>\n            classNames(\n              \"group/checkbox cursor-pointer focus-ring flex items-center gap-x-2\",\n              /* Disabled */\n              \"disabled-muted\",\n              labelVariants,\n              className\n            )\n          )}\n          {...props}\n        >\n          {composeRenderProps(<></>, (_, renderProps) => (\n            <>\n              <div\n                className={classNames(\n                  \"flex size-input shrink-0 items-center bg-card justify-center border border-input text-current ring-offset-background\",\n                  /* Selected */\n                  \"group-data-[indeterminate]/checkbox:bg-primary group-data-[selected]/checkbox:bg-primary group-data-[indeterminate]/checkbox:text-primary-foreground  group-data-[selected]/checkbox:text-primary-foreground\",\n                  /* Disabled */\n                  \"group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50\",\n                  /* Invalid */\n                  \"group-data-[invalid]/checkbox:border-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground\",\n                  /* Resets */\n                  \"focus:outline-none focus-visible:outline-none\"\n                )}\n              >\n                {renderProps.isIndeterminate ? (\n                  <Minus className=\"size-icon\" />\n                ) : renderProps.isSelected ? (\n                  <Check className=\"size-icon\" />\n                ) : null}\n              </div>\n            </>\n          ))}\n        </AriaCheckbox>\n      </FormField>\n    </div>\n  )\n}\n\nexport type TfCheckboxProps = Omit<React.ComponentProps<typeof Checkbox>, \"onChange\" | \"onBlur\" | \"isChecked\">\nexport function TfCheckbox({ ...props }: TfCheckboxProps) {\n  const field = useFieldContext<boolean>();\n  return (\n    <Checkbox\n      isSelected={field.state.value}\n      isDisabled={field.form.state.isSubmitting || props.isDisabled}\n      onChange={() => field.handleChange(!field.state.value)}\n      onBlur={field.handleBlur}\n      {...props}\n    />\n  );\n};"],"names":["CheckboxGroup","AriaCheckboxGroup","Checkbox","className","label","description","errorMessage","props","jsx","FormField","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","Minus","Check","TfCheckbox","field","useFieldContext"],"mappings":"sbAYO,MAAMA,EAAgBC,EAEtB,SAASC,EAAS,CAAE,UAAAC,EAAW,MAAAC,EAAO,YAAAC,EAAa,aAAAC,EAAc,GAAGC,GAA0C,CACnH,OACEC,EAAC,OAAI,UAAU,mBACb,WAACC,EAAA,CAAU,MAAAL,EAAc,YAAAC,EAA0B,aAAAC,EACjD,SAAAE,EAACE,EAAA,CACC,UAAWC,EAAmBR,EAAYA,GACxCS,EACE,qEAEA,iBACAC,EACAV,CAAA,CACF,EAED,GAAGI,EAEH,WAAmBC,EAAAM,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IAC7BR,EAAAM,EAAA,CACE,SAAAN,EAAC,MAAA,CACC,UAAWI,EACT,uHAEA,+MAEA,8FAEA,wNAEA,+CAAA,EAGD,SAAAI,EAAY,gBACXR,EAACS,EAAA,CAAM,UAAU,WAAA,CAAY,EAC3BD,EAAY,WACdR,EAACU,EAAA,CAAM,UAAU,YAAY,EAC3B,IAAA,CAAA,EAER,CACD,CAAA,CAAA,EAEL,CAAA,CACF,CAEJ,CAGO,SAASC,EAAW,CAAE,GAAGZ,GAA0B,CACxD,MAAMa,EAAQC,EAAA,EACd,OACEb,EAACN,EAAA,CACC,WAAYkB,EAAM,MAAM,MACxB,WAAYA,EAAM,KAAK,MAAM,cAAgBb,EAAM,WACnD,SAAU,IAAMa,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGb,CAAA,CAAA,CAGV"}
+{"version":3,"file":"checkbox.js","sources":["../../lib/components/checkbox.tsx"],"sourcesContent":["import {\n  Checkbox as AriaCheckbox,\n  CheckboxGroup as AriaCheckboxGroup,\n  composeRenderProps,\n  type CheckboxProps as AriaCheckboxProps,\n} from \"react-aria-components\";\n\nimport {\n  FormField,\n  labelVariants,\n  type FormFieldProps,\n} from \"lib/components/field\";\nimport { useTfFieldContext } from \"lib/utils/form-utils\";\nimport { classNames } from \"lib/utils/primitives\";\nimport { Check, Minus } from \"lucide-react\";\n\nexport const CheckboxGroup = AriaCheckboxGroup;\ntype CheckboxProps = AriaCheckboxProps & FormFieldProps;\nexport function Checkbox({\n  className,\n  label,\n  description,\n  errorMessage,\n  ...props\n}: Omit<CheckboxProps, \"children\">) {\n  return (\n    <div className=\"group form-field\">\n      <FormField\n        label={label}\n        description={description}\n        errorMessage={errorMessage}\n      >\n        <AriaCheckbox\n          className={composeRenderProps(className, (className) =>\n            classNames(\n              \"group/checkbox cursor-pointer focus-ring flex items-center gap-x-2\",\n              /* Disabled */\n              \"disabled-muted\",\n              labelVariants,\n              className\n            )\n          )}\n          {...props}\n        >\n          {composeRenderProps(<></>, (_, renderProps) => (\n            <>\n              <div\n                className={classNames(\n                  \"flex size-input shrink-0 items-center bg-popover justify-center border border-input text-current ring-offset-background\",\n                  /* Selected */\n                  \"group-data-[indeterminate]/checkbox:bg-primary group-data-[selected]/checkbox:bg-primary group-data-[indeterminate]/checkbox:text-primary-foreground  group-data-[selected]/checkbox:text-primary-foreground\",\n                  /* Disabled */\n                  \"group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50\",\n                  /* Invalid */\n                  \"group-data-[invalid]/checkbox:border-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground\",\n                  /* Resets */\n                  \"focus:outline-none focus-visible:outline-none\"\n                )}\n              >\n                {renderProps.isIndeterminate ? (\n                  <Minus className=\"size-icon\" />\n                ) : renderProps.isSelected ? (\n                  <Check className=\"size-icon\" />\n                ) : null}\n              </div>\n            </>\n          ))}\n        </AriaCheckbox>\n      </FormField>\n    </div>\n  );\n}\n\nexport type TfCheckboxProps = Omit<\n  React.ComponentProps<typeof Checkbox>,\n  \"onChange\" | \"onBlur\" | \"isChecked\"\n>;\nexport function TfCheckbox({ ...props }: TfCheckboxProps) {\n  const field = useTfFieldContext<boolean>({ disabled: props.isDisabled });\n  return (\n    <Checkbox\n      isSelected={field.state.value}\n      isDisabled={field.form.state.isSubmitting || props.isDisabled}\n      onChange={() => field.handleChange(!field.state.value)}\n      onBlur={field.handleBlur}\n      {...props}\n    />\n  );\n}\n"],"names":["CheckboxGroup","AriaCheckboxGroup","Checkbox","className","label","description","errorMessage","props","jsx","FormField","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","Minus","Check","TfCheckbox","field","useTfFieldContext"],"mappings":"qeAgBO,MAAMA,EAAgBC,EAEtB,SAASC,EAAS,CACvB,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,GAAGC,CACL,EAAoC,CAClC,OACEC,EAAC,MAAA,CAAI,UAAU,mBACb,SAAAA,EAACC,EAAA,CACC,MAAAL,EACA,YAAAC,EACA,aAAAC,EAEA,SAAAE,EAACE,EAAA,CACC,UAAWC,EAAmBR,EAAYA,GACxCS,EACE,qEAEA,iBACAC,EACAV,CAAA,CACF,EAED,GAAGI,EAEH,WAAmBC,EAAAM,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IAC7BR,EAAAM,EAAA,CACE,SAAAN,EAAC,MAAA,CACC,UAAWI,EACT,0HAEA,+MAEA,8FAEA,wNAEA,+CAAA,EAGD,SAAAI,EAAY,gBACXR,EAACS,EAAA,CAAM,UAAU,WAAA,CAAY,EAC3BD,EAAY,WACdR,EAACU,EAAA,CAAM,UAAU,YAAY,EAC3B,IAAA,CAAA,EAER,CACD,CAAA,CAAA,CACH,CAAA,EAEJ,CAEJ,CAMO,SAASC,EAAW,CAAE,GAAGZ,GAA0B,CACxD,MAAMa,EAAQC,EAA2B,CAAE,SAAUd,EAAM,WAAY,EACvE,OACEC,EAACN,EAAA,CACC,WAAYkB,EAAM,MAAM,MACxB,WAAYA,EAAM,KAAK,MAAM,cAAgBb,EAAM,WACnD,SAAU,IAAMa,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGb,CAAA,CAAA,CAGV"}

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

@@ -1,2 +1,2 @@
-import{jsx as d}from"react/jsx-runtime";import{createColumnHelper as p}from"@tanstack/react-table";import{intervalToDuration as m}from"date-fns";import{Checkbox as i}from"./checkbox.js";import"react-aria-components";import"./field.js";import"class-variance-authority";import"../utils/primitives.js";import"clsx";import"lucide-react";import"../utils/form-context.js";import"@tanstack/react-form";const n=p(),v=[n.accessor("checkbox",{header:({table:e})=>d(i,{isIndeterminate:e.getIsSomeRowsSelected()&&!e.getIsAllPageRowsSelected(),isSelected:e.getIsAllPageRowsSelected()||e.getIsSomePageRowsSelected(),onChange:()=>e.toggleAllPageRowsSelected(),"aria-label":"Select all"}),cell:({row:e})=>d(i,{isSelected:e.getIsSelected(),onChange:()=>e.toggleSelected(),"aria-label":"Select row"}),enableSorting:!1,enableHiding:!1})],y=[n.accessor("id",{header:()=>"ID"})],R=[n.accessor("createdAt",{header:()=>"Creation Date",cell:({row:e})=>{const t=e.getValue("createdAt");return c(t)},enableHiding:!1}),n.accessor("updatedAt",{header:()=>"Last Updated",cell:({row:e})=>{const t=e.getValue("updatedAt");return c(t)},enableHiding:!1})];function c(e){if(!e)return null;const t=new Date(e);return new Intl.DateTimeFormat(void 0,{dateStyle:"medium",timeStyle:"short"}).format(t)}function O(e){const t=e.expiresAt&&new Date(e.expiresAt)<new Date;switch(!0){case(e.revoked&&e.suspended&&t):return"Revoked, Suspended, Expired";case(e.revoked&&e.suspended):return"Revoked, Suspended";case(e.revoked&&t):return"Revoked, Expired";case(e.suspended&&t):return"Suspended, Expired";case e.suspended:return"Suspended";case e.revoked:return"Revoked";case t:return"Expired";default:return"Active"}}function b(e){return e===0||!e?"Lifetime":g(e)}function g(e){const t=m({start:0,end:e*1e3});return[t.years&&`${t.years}y`,t.months&&`${t.months}m`,t.days&&`${t.days}d`,t.hours&&`${t.hours}h`].filter(Boolean).join(" ").trim()}function H(e,t){const r=t.toString().split(".");let o=e;for(const a of r)o=o?.[a];return o}const P={windows:"Windows",macos:"macOS",linux:"Linux",ios:"iOS",android:"Android"};function $(e,t){return async(r,o,a,u)=>{const l={...u,page:r.pageIndex+1,limit:r.pageSize,sort:S(o[0]),search:a};return e.GET(t,{query:l}).then(s=>({total:Number.parseInt(s.response.headers.get("Pagination-Count")||"0"),data:s.data}))}}function S(e){return e?e.desc?`-${e.id}`:`+${e.id}`:"-createdAt"}export{P as ALL_OS,v as TABLE_CHECK_BOX_COLUMN,R as TABLE_DEFAULT_DATE_COLUMNS,y as TABLE_ID_COLUMN,$ as createTableFetchFn,c as formatDate,O as getLicenseStatus,b as getValidityDisplay,H as getValueFromData,g as secondsToDuration};
+import{jsx as d}from"react/jsx-runtime";import{createColumnHelper as p}from"@tanstack/react-table";import{intervalToDuration as m}from"date-fns";import{Checkbox as i}from"./checkbox.js";import"react-aria-components";import"./field.js";import"class-variance-authority";import"../utils/primitives.js";import"clsx";import"lucide-react";import"../utils/form-utils.js";import"../utils/form-context.js";import"@tanstack/react-form";import"react";const n=p(),R=[n.accessor("checkbox",{header:({table:e})=>d(i,{isIndeterminate:e.getIsSomeRowsSelected()&&!e.getIsAllPageRowsSelected(),isSelected:e.getIsAllPageRowsSelected()||e.getIsSomePageRowsSelected(),onChange:()=>e.toggleAllPageRowsSelected(),"aria-label":"Select all"}),cell:({row:e})=>d(i,{isSelected:e.getIsSelected(),onChange:()=>e.toggleSelected(),"aria-label":"Select row"}),enableSorting:!1,enableHiding:!1})],O=[n.accessor("id",{header:()=>"ID"})],b=[n.accessor("createdAt",{header:()=>"Creation Date",cell:({row:e})=>{const t=e.getValue("createdAt");return c(t)},enableHiding:!1}),n.accessor("updatedAt",{header:()=>"Last Updated",cell:({row:e})=>{const t=e.getValue("updatedAt");return c(t)},enableHiding:!1})];function c(e){if(!e)return null;const t=new Date(e);return new Intl.DateTimeFormat(void 0,{dateStyle:"medium",timeStyle:"short"}).format(t)}function H(e){const t=e.expiresAt&&new Date(e.expiresAt)<new Date;switch(!0){case(e.revoked&&e.suspended&&t):return"Revoked, Suspended, Expired";case(e.revoked&&e.suspended):return"Revoked, Suspended";case(e.revoked&&t):return"Revoked, Expired";case(e.suspended&&t):return"Suspended, Expired";case e.suspended:return"Suspended";case e.revoked:return"Revoked";case t:return"Expired";default:return"Active"}}function P(e){return e===0||!e?"Lifetime":g(e)}function g(e){const t=m({start:0,end:e*1e3});return[t.years&&`${t.years}y`,t.months&&`${t.months}m`,t.days&&`${t.days}d`,t.hours&&`${t.hours}h`].filter(Boolean).join(" ").trim()}function $(e,t){const r=t.toString().split(".");let o=e;for(const a of r)o=o?.[a];return o}const B={windows:"Windows",macos:"macOS",linux:"Linux",ios:"iOS",android:"Android"};function F(e,t){return async(r,o,a,u)=>{const l={...u,page:r.pageIndex+1,limit:r.pageSize,sort:S(o[0]),search:a};return e.GET(t,{query:l}).then(s=>({total:Number.parseInt(s.response.headers.get("Pagination-Count")||"0"),data:s.data}))}}function S(e){return e?e.desc?`-${e.id}`:`+${e.id}`:"-createdAt"}export{B as ALL_OS,R as TABLE_CHECK_BOX_COLUMN,b as TABLE_DEFAULT_DATE_COLUMNS,O as TABLE_ID_COLUMN,F as createTableFetchFn,c as formatDate,H as getLicenseStatus,P as getValidityDisplay,$ as getValueFromData,g as secondsToDuration};
 //# sourceMappingURL=data-table-commons.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"data-table-commons.js","sources":["../../lib/components/data-table-commons.tsx"],"sourcesContent":["\nimport type { components, operations, paths } from \"@cryptlex/web-api-types\";\nimport type { PaginationState, SortingState, Table } from \"@tanstack/react-table\";\nimport { createColumnHelper } from \"@tanstack/react-table\";\nimport { intervalToDuration } from \"date-fns\";\nimport { Checkbox } from \"lib/components/checkbox\";\nimport type { LucideIcon } from \"lucide-react\";\nimport type createClient from \"openapi-fetch\";\nimport type { PressEvent } from \"react-aria-components\";\n\nconst cH = createColumnHelper<any>();\nexport const TABLE_CHECK_BOX_COLUMN = [\n\tcH.accessor(\"checkbox\", {\n\t\theader: ({ table }) => (\n\t\t\t<Checkbox\n\t\t\t\tisIndeterminate={table.getIsSomeRowsSelected() && !table.getIsAllPageRowsSelected()}\n\t\t\t\tisSelected={\n\t\t\t\t\ttable.getIsAllPageRowsSelected() || table.getIsSomePageRowsSelected()\n\t\t\t\t}\n\t\t\t\tonChange={() => table.toggleAllPageRowsSelected()}\n\t\t\t\taria-label=\"Select all\"\n\t\t\t/>\n\t\t),\n\n\t\tcell: ({ row }) => (\n\t\t\t<Checkbox\n\t\t\t\tisSelected={row.getIsSelected()}\n\t\t\t\tonChange={() => row.toggleSelected()}\n\t\t\t\taria-label=\"Select row\"\n\t\t\t/>\n\t\t),\n\t\tenableSorting: false,\n\t\tenableHiding: false,\n\t}),\n];\n\nexport const TABLE_ID_COLUMN = [\n\tcH.accessor(\"id\", {\n\t\theader: () => \"ID\",\n\t}),\n];\nexport const TABLE_DEFAULT_DATE_COLUMNS = [\n\tcH.accessor(\"createdAt\", {\n\t\theader: () => \"Creation Date\",\n\t\tcell: ({ row }) => {\n\t\t\tconst date = row.getValue(\"createdAt\") satisfies\n\t\t\t\t| string\n\t\t\t\t| null\n\t\t\t\t| undefined;\n\t\t\treturn formatDate(date);\n\t\t},\n\t\tenableHiding: false,\n\t}),\n\tcH.accessor(\"updatedAt\", {\n\t\theader: () => \"Last Updated\",\n\t\tcell: ({ row }) => {\n\t\t\tconst date = row.getValue(\"updatedAt\") satisfies\n\t\t\t\t| string\n\t\t\t\t| null\n\t\t\t\t| undefined;\n\t\t\treturn formatDate(date);\n\t\t},\n\t\tenableHiding: false,\n\t}),\n];\n\n// TODO, i18n using react-aria\nexport function formatDate(date: string | null | undefined) {\n\tif (!date) return null;\n\tconst _date = new Date(date);\n\treturn new Intl.DateTimeFormat(undefined, {\n\t\tdateStyle: \"medium\",\n\t\ttimeStyle: \"short\",\n\t}).format(_date);\n}\n/**\n * Format multiple license parameters (expired, suspended, revoked) into a single status\n */\nexport function getLicenseStatus(license: any): string {\n\tconst licenseExpired =\n\t\tlicense.expiresAt && new Date(license.expiresAt) < new Date();\n\t// Status Column\n\tswitch (true) {\n\t\tcase license.revoked && license.suspended && licenseExpired:\n\t\t\treturn \"Revoked, Suspended, Expired\";\n\t\tcase license.revoked && license.suspended:\n\t\t\treturn \"Revoked, Suspended\";\n\t\tcase license.revoked && licenseExpired:\n\t\t\treturn \"Revoked, Expired\";\n\t\tcase license.suspended && licenseExpired:\n\t\t\treturn \"Suspended, Expired\";\n\t\tcase license.suspended:\n\t\t\treturn \"Suspended\";\n\t\tcase license.revoked:\n\t\t\treturn \"Revoked\";\n\t\tcase licenseExpired:\n\t\t\treturn \"Expired\";\n\t\tdefault:\n\t\t\treturn \"Active\";\n\t}\n}\n\nexport function getValidityDisplay(validity: number | undefined) {\n\tif (validity === 0 || !validity) {\n\t\treturn \"Lifetime\";\n\t} else {\n\t\treturn secondsToDuration(validity);\n\t}\n}\nexport function secondsToDuration(seconds: number): string {\n\t//@ts-ignore\n\tconst duration = intervalToDuration({\n\t\tstart: 0,\n\t\tend: seconds * 1000,\n\t});\n\n\tconst parts = [\n\t\tduration.years && `${duration.years}y`,\n\t\tduration.months && `${duration.months}m`,\n\t\tduration.days && `${duration.days}d`,\n\t\tduration.hours && `${duration.hours}h`,\n\t];\n\n\t// Filter out undefined values and join\n\treturn parts.filter(Boolean).join(\" \").trim();\n}\n\nexport function getValueFromData(\n\tdata: any,\n\taccessor: string | number | symbol,\n) {\n\tconst accessors = accessor.toString().split(\".\");\n\tlet value = data;\n\tfor (const acc of accessors) {\n\t\tvalue = value?.[acc];\n\t}\n\treturn value;\n}\nexport const ALL_OS: { [key: string]: string } = {\n\twindows: \"Windows\",\n\tmacos: \"macOS\",\n\tlinux: \"Linux\",\n\tios: \"iOS\",\n\tandroid: \"Android\",\n};\n\nexport type VisibilityState<T> = {\n\t[K in keyof T]?: boolean;\n};\n\nexport type TableActions = ({\n\tonClick: (e: PressEvent, t: Table<any>) => void\n\tbulk: boolean;\n\ticon: LucideIcon\n\ttooltip?: string;\n})[]\n\nexport type TableFetchFn<TData, TOperation extends keyof operations> = (\n\tp: PaginationState,\n\ts: SortingState,\n\tq: string,\n\tf: ApiFilters<TOperation>\n) => Promise<{\n\ttotal: number;\n\tdata: TData[] | undefined;\n}>;\n/*** Type for hide some of the columns based on the dto of the particular page\n ** `id`, `updatedAt` are by default hidden\n */\nexport type DefaultVisibilityState<T> = {\n\t[K in keyof T]?: boolean;\n};\n\n\ntype Client = ReturnType<typeof createClient<paths>>;\n\n// Helper type to extract valid GET paths\ntype GetPaths = {\n\t[P in keyof paths]: paths[P] extends { get: any } ? P : never;\n}[keyof paths];\n\nexport type ApiSchema<T extends keyof components['schemas']> = components['schemas'][T];\nexport type ApiQuery<T extends keyof operations> = NonNullable<operations[T]['parameters']['query']>;\nexport type ApiGetAllParameters = {\n\tpage: number;\n\tlimit: number;\n\tsearch?: string;\n\tsort?: string;\n}\n\n\nexport type ApiFilter<T extends keyof operations> = Omit<ApiQuery<T>, 'page' | 'limit' | 'sort' | 'search'>\nexport type ApiFilters<T extends keyof operations> = NonNullable<Omit<ApiQuery<T>, 'page' | 'limit' | 'sort' | 'search'>>\n\nexport function createTableFetchFn<Return, Operation extends keyof operations>(\n\tctxclient: Client,\n\tpath: GetPaths,\n): TableFetchFn<Return, Operation> {\n\treturn async (pagination, sorting, searching, filters) => {\n\t\tconst query: ApiQuery<Operation> = {\n\t\t\t...filters,\n\t\t\tpage: pagination.pageIndex + 1,\n\t\t\tlimit: pagination.pageSize,\n\t\t\tsort: generateSortParam(sorting[0]),\n\t\t\tsearch: searching,\n\t\t};\n\n\t\t// const pathParams = merge(_baseQueryObject, params);\n\n\t\treturn ctxclient.GET(path, { query }).then((value) => {\n\t\t\tconst rowCount = Number.parseInt(\n\t\t\t\tvalue.response.headers.get(\"Pagination-Count\") || \"0\",\n\t\t\t);\n\t\t\treturn { total: rowCount, data: value.data };\n\t\t});\n\t};\n}\n\nfunction generateSortParam(\n\tsort: { id: string; desc: boolean } | undefined,\n): string {\n\tif (sort) {\n\t\tif (sort.desc) {\n\t\t\treturn `-${sort.id}`;\n\t\t} else {\n\t\t\treturn `+${sort.id}`;\n\t\t}\n\t} else {\n\t\treturn \"-createdAt\";\n\t}\n}\n\n\n"],"names":["cH","createColumnHelper","TABLE_CHECK_BOX_COLUMN","table","jsx","Checkbox","row","TABLE_ID_COLUMN","TABLE_DEFAULT_DATE_COLUMNS","date","formatDate","_date","getLicenseStatus","license","licenseExpired","getValidityDisplay","validity","secondsToDuration","seconds","duration","intervalToDuration","getValueFromData","data","accessor","accessors","value","acc","ALL_OS","createTableFetchFn","ctxclient","path","pagination","sorting","searching","filters","query","generateSortParam","sort"],"mappings":"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"}
+{"version":3,"file":"data-table-commons.js","sources":["../../lib/components/data-table-commons.tsx"],"sourcesContent":["\nimport type { components, operations, paths } from \"@cryptlex/web-api-types\";\nimport type { PaginationState, SortingState, Table } from \"@tanstack/react-table\";\nimport { createColumnHelper } from \"@tanstack/react-table\";\nimport { intervalToDuration } from \"date-fns\";\nimport { Checkbox } from \"lib/components/checkbox\";\nimport type { LucideIcon } from \"lucide-react\";\nimport type createClient from \"openapi-fetch\";\nimport type { PressEvent } from \"react-aria-components\";\n\nconst cH = createColumnHelper<any>();\nexport const TABLE_CHECK_BOX_COLUMN = [\n\tcH.accessor(\"checkbox\", {\n\t\theader: ({ table }) => (\n\t\t\t<Checkbox\n\t\t\t\tisIndeterminate={table.getIsSomeRowsSelected() && !table.getIsAllPageRowsSelected()}\n\t\t\t\tisSelected={\n\t\t\t\t\ttable.getIsAllPageRowsSelected() || table.getIsSomePageRowsSelected()\n\t\t\t\t}\n\t\t\t\tonChange={() => table.toggleAllPageRowsSelected()}\n\t\t\t\taria-label=\"Select all\"\n\t\t\t/>\n\t\t),\n\n\t\tcell: ({ row }) => (\n\t\t\t<Checkbox\n\t\t\t\tisSelected={row.getIsSelected()}\n\t\t\t\tonChange={() => row.toggleSelected()}\n\t\t\t\taria-label=\"Select row\"\n\t\t\t/>\n\t\t),\n\t\tenableSorting: false,\n\t\tenableHiding: false,\n\t}),\n];\n\nexport const TABLE_ID_COLUMN = [\n\tcH.accessor(\"id\", {\n\t\theader: () => \"ID\",\n\t}),\n];\nexport const TABLE_DEFAULT_DATE_COLUMNS = [\n\tcH.accessor(\"createdAt\", {\n\t\theader: () => \"Creation Date\",\n\t\tcell: ({ row }) => {\n\t\t\tconst date = row.getValue(\"createdAt\") satisfies\n\t\t\t\t| string\n\t\t\t\t| null\n\t\t\t\t| undefined;\n\t\t\treturn formatDate(date);\n\t\t},\n\t\tenableHiding: false,\n\t}),\n\tcH.accessor(\"updatedAt\", {\n\t\theader: () => \"Last Updated\",\n\t\tcell: ({ row }) => {\n\t\t\tconst date = row.getValue(\"updatedAt\") satisfies\n\t\t\t\t| string\n\t\t\t\t| null\n\t\t\t\t| undefined;\n\t\t\treturn formatDate(date);\n\t\t},\n\t\tenableHiding: false,\n\t}),\n];\n\n// TODO, i18n using react-aria\nexport function formatDate(date: string | null | undefined) {\n\tif (!date) return null;\n\tconst _date = new Date(date);\n\treturn new Intl.DateTimeFormat(undefined, {\n\t\tdateStyle: \"medium\",\n\t\ttimeStyle: \"short\",\n\t}).format(_date);\n}\n/**\n * Format multiple license parameters (expired, suspended, revoked) into a single status\n */\nexport function getLicenseStatus(license: any): string {\n\tconst licenseExpired =\n\t\tlicense.expiresAt && new Date(license.expiresAt) < new Date();\n\t// Status Column\n\tswitch (true) {\n\t\tcase license.revoked && license.suspended && licenseExpired:\n\t\t\treturn \"Revoked, Suspended, Expired\";\n\t\tcase license.revoked && license.suspended:\n\t\t\treturn \"Revoked, Suspended\";\n\t\tcase license.revoked && licenseExpired:\n\t\t\treturn \"Revoked, Expired\";\n\t\tcase license.suspended && licenseExpired:\n\t\t\treturn \"Suspended, Expired\";\n\t\tcase license.suspended:\n\t\t\treturn \"Suspended\";\n\t\tcase license.revoked:\n\t\t\treturn \"Revoked\";\n\t\tcase licenseExpired:\n\t\t\treturn \"Expired\";\n\t\tdefault:\n\t\t\treturn \"Active\";\n\t}\n}\n\nexport function getValidityDisplay(validity: number | undefined) {\n\tif (validity === 0 || !validity) {\n\t\treturn \"Lifetime\";\n\t} else {\n\t\treturn secondsToDuration(validity);\n\t}\n}\nexport function secondsToDuration(seconds: number): string {\n\t//@ts-ignore\n\tconst duration = intervalToDuration({\n\t\tstart: 0,\n\t\tend: seconds * 1000,\n\t});\n\n\tconst parts = [\n\t\tduration.years && `${duration.years}y`,\n\t\tduration.months && `${duration.months}m`,\n\t\tduration.days && `${duration.days}d`,\n\t\tduration.hours && `${duration.hours}h`,\n\t];\n\n\t// Filter out undefined values and join\n\treturn parts.filter(Boolean).join(\" \").trim();\n}\n\nexport function getValueFromData(\n\tdata: any,\n\taccessor: string | number | symbol,\n) {\n\tconst accessors = accessor.toString().split(\".\");\n\tlet value = data;\n\tfor (const acc of accessors) {\n\t\tvalue = value?.[acc];\n\t}\n\treturn value;\n}\nexport const ALL_OS: { [key: string]: string } = {\n\twindows: \"Windows\",\n\tmacos: \"macOS\",\n\tlinux: \"Linux\",\n\tios: \"iOS\",\n\tandroid: \"Android\",\n};\n\nexport type VisibilityState<T> = {\n\t[K in keyof T]?: boolean;\n};\n\nexport type TableActions = ({\n\tonClick: (e: PressEvent, t: Table<any>) => void\n\tbulk: boolean;\n\ticon: LucideIcon\n\ttooltip?: string;\n})[]\n\nexport type TableFetchFn<TData, TOperation extends keyof operations> = (\n\tp: PaginationState,\n\ts: SortingState,\n\tq: string,\n\tf: ApiFilters<TOperation>\n) => Promise<{\n\ttotal: number;\n\tdata: TData[] | undefined;\n}>;\n/*** Type for hide some of the columns based on the dto of the particular page\n ** `id`, `updatedAt` are by default hidden\n */\nexport type DefaultVisibilityState<T> = {\n\t[K in keyof T]?: boolean;\n};\n\n\ntype Client = ReturnType<typeof createClient<paths>>;\n\n// Helper type to extract valid GET paths\ntype GetPaths = {\n\t[P in keyof paths]: paths[P] extends { get: any } ? P : never;\n}[keyof paths];\n\nexport type ApiSchema<T extends keyof components['schemas']> = components['schemas'][T];\nexport type ApiQuery<T extends keyof operations> = NonNullable<operations[T]['parameters']['query']>;\nexport type ApiGetAllParameters = {\n\tpage: number;\n\tlimit: number;\n\tsearch?: string;\n\tsort?: string;\n}\n\n\nexport type ApiFilter<T extends keyof operations> = Omit<ApiQuery<T>, 'page' | 'limit' | 'sort' | 'search'>\nexport type ApiFilters<T extends keyof operations> = NonNullable<Omit<ApiQuery<T>, 'page' | 'limit' | 'sort' | 'search'>>\n\nexport function createTableFetchFn<Return, Operation extends keyof operations>(\n\tctxclient: Client,\n\tpath: GetPaths,\n): TableFetchFn<Return, Operation> {\n\treturn async (pagination, sorting, searching, filters) => {\n\t\tconst query: ApiQuery<Operation> = {\n\t\t\t...filters,\n\t\t\tpage: pagination.pageIndex + 1,\n\t\t\tlimit: pagination.pageSize,\n\t\t\tsort: generateSortParam(sorting[0]),\n\t\t\tsearch: searching,\n\t\t};\n\n\t\t// const pathParams = merge(_baseQueryObject, params);\n\n\t\treturn ctxclient.GET(path, { query }).then((value) => {\n\t\t\tconst rowCount = Number.parseInt(\n\t\t\t\tvalue.response.headers.get(\"Pagination-Count\") || \"0\",\n\t\t\t);\n\t\t\treturn { total: rowCount, data: value.data };\n\t\t});\n\t};\n}\n\nfunction generateSortParam(\n\tsort: { id: string; desc: boolean } | undefined,\n): string {\n\tif (sort) {\n\t\tif (sort.desc) {\n\t\t\treturn `-${sort.id}`;\n\t\t} else {\n\t\t\treturn `+${sort.id}`;\n\t\t}\n\t} else {\n\t\treturn \"-createdAt\";\n\t}\n}\n\n\n"],"names":["cH","createColumnHelper","TABLE_CHECK_BOX_COLUMN","table","jsx","Checkbox","row","TABLE_ID_COLUMN","TABLE_DEFAULT_DATE_COLUMNS","date","formatDate","_date","getLicenseStatus","license","licenseExpired","getValidityDisplay","validity","secondsToDuration","seconds","duration","intervalToDuration","getValueFromData","data","accessor","accessors","value","acc","ALL_OS","createTableFetchFn","ctxclient","path","pagination","sorting","searching","filters","query","generateSortParam","sort"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-import"react/jsx-runtime";import"./button.js";import{C as w,D as y,F as z}from"./data-table.js";import"./date-picker.js";import"./id-search.js";import"./menu.js";import"./popover.js";import"../utils/form-hook.js";import"../utils/primitives.js";import"../utils/resource-names.js";import"lucide-react";import"react";import"class-variance-authority";import"react-aria-components";import"./loader.js";import"clsx";import"@tanstack/react-query";import"@tanstack/react-table";import"@dnd-kit/sortable";import"@dnd-kit/core";import"@dnd-kit/utilities";import"./data-table-commons.js";import"date-fns";import"./checkbox.js";import"./field.js";import"../utils/form-context.js";import"@tanstack/react-form";import"./searchfield.js";import"./table.js";import"lodash-es";import"@internationalized/date";import"./calendar.js";import"./datefield.js";import"./list-box.js";import"./select.js";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";export{w as COMPARISON_OPERATOR_LABELS,y as DataTableFilter,z as FILTER_COMPARISON_OPERATORS};
+import"react/jsx-runtime";import"./button.js";import{C as y,D as z,F as G}from"./data-table.js";import"./date-picker.js";import"./id-search.js";import"./menu.js";import"./popover.js";import"../utils/form-hook.js";import"../utils/primitives.js";import"../utils/resource-names.js";import"lucide-react";import"react";import"class-variance-authority";import"react-aria-components";import"./loader.js";import"clsx";import"@tanstack/react-query";import"@tanstack/react-table";import"@dnd-kit/sortable";import"@dnd-kit/core";import"@dnd-kit/utilities";import"./data-table-commons.js";import"date-fns";import"./checkbox.js";import"./field.js";import"../utils/form-utils.js";import"../utils/form-context.js";import"@tanstack/react-form";import"./searchfield.js";import"./table.js";import"lodash-es";import"@internationalized/date";import"./calendar.js";import"./datefield.js";import"./list-box.js";import"./select.js";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";export{y as COMPARISON_OPERATOR_LABELS,z as DataTableFilter,G as FILTER_COMPARISON_OPERATORS};
 //# sourceMappingURL=data-table-filter.js.map

package/dist/components/data-table.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,Fragment as C,jsxs as c}from"react/jsx-runtime";import{Button as y}from"./button.js";import{useQuery as te,keepPreviousData as ne}from"@tanstack/react-query";import{createColumnHelper as re,useReactTable as ae,getCoreRowModel as ie,flexRender as M}from"@tanstack/react-table";import{Info as oe,RotateCw as le,Columns3 as se,GripVertical as ce,ChevronFirst as de,ChevronLeft as ue,ChevronRight as me,ChevronLast as pe,ArrowDownNarrowWide as ge,ArrowDownWideNarrow as fe,ArrowUpDown as he,Filter as be,Trash as Se}from"lucide-react";import{createContext as ye,useId as ve,useState as w,useMemo as E,useEffect as j,useContext as Ce,useRef as we}from"react";import{sortableKeyboardCoordinates as xe,SortableContext as Te,verticalListSortingStrategy as Ne,arrayMove as Ae,useSortable as Fe}from"@dnd-kit/sortable";import{useSensors as Pe,useSensor as H,PointerSensor as De,KeyboardSensor as Oe,DndContext as Ie,closestCenter as Re,DragOverlay as Le}from"@dnd-kit/core";import{CSS as ze}from"@dnd-kit/utilities";import{TABLE_CHECK_BOX_COLUMN as Me,TABLE_ID_COLUMN as Ee,TABLE_DEFAULT_DATE_COLUMNS as _e}from"./data-table-commons.js";import{TfDatePicker as Ve}from"./date-picker.js";import{TfIdSearchInput as qe}from"./id-search.js";import{EasyMenu as V,MenuItem as L}from"./menu.js";import{PopoverTrigger as $e,Popover as Ue}from"./popover.js";import{useAppForm as ke}from"../utils/form-hook.js";import{classNames as x}from"../utils/primitives.js";import{useResourceFormatter as W}from"../utils/resource-names.js";import{Loader as je}from"./loader.js";import{SearchField as He}from"./searchfield.js";import{Table as Be,TableHeader as Ke,TableRow as B,TableHead as Qe,TableBody as We,TableCell as Ge}from"./table.js";import{merge as Xe}from"lodash-es";import"class-variance-authority";import"react-aria-components";import"date-fns";import"./checkbox.js";import"./field.js";import"../utils/form-context.js";import"@tanstack/react-form";import"@internationalized/date";import"./calendar.js";import"./datefield.js";import"./list-box.js";import"./select.js";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";import"clsx";const _="tableActions";function kt({columns:t,fetchFn:a,columnsToHideByDefault:l={},allowSelection:o=!1,filterConfig:n}){const f=ve(),[s,u]=w({pagination:{pageIndex:0,pageSize:20},sorting:[]}),[h,d]=w({}),[b,m]=w(""),[i,g]=w([]),[p,N]=w({id:!1,updatedAt:!1,...l}),[P,Y]=w([]),q=E(()=>P.reduce((r,v)=>Xe(r,v),{}),[P]),z=r=>{u(v=>({...v,...r}))},{sorting:I,pagination:R}=s,A=te({queryKey:[f,R,I,b],queryFn:()=>a(R,I,b,q),placeholderData:ne,retry:0,refetchOnWindowFocus:!1});j(()=>{},[p]);const Z=E(()=>re(),[]),$=E(()=>{const r=A.data?.data;if(!r?.length)return[];const v=S=>S!=null&&typeof S=="object"&&"metadata"in S&&Array.isArray(S.metadata),k=r.filter(v);return k.length===0?[]:Array.from(new Set(k.flatMap(S=>S.metadata?.map(F=>F.key)??[]))).map(S=>Z.accessor(F=>v(F)?F?.metadata?.find(O=>O.key===S)?.value??"":"",{id:S,header:S,enableSorting:!1,cell:F=>{const O=F.getValue();return O==null?"":String(O)}}))},[A.data?.data]),J=[...o?Me:[],...Ee,...t.filter(r=>r.id!==_),...$.length?$:[],..._e,...t.filter(r=>r.id===_)];function ee(r){return typeof r=="function"}function D(r,v){return ee(r)?r(v):r}const U=ae({data:A.data?.data??[],columns:J,getCoreRowModel:ie(),rowCount:A.data?.total,manualPagination:!0,onPaginationChange:r=>{z({pagination:D(r,R)})},manualSorting:!0,onSortingChange:r=>{d({}),z({sorting:[...D(r,I)]})},manualFiltering:!0,onColumnVisibilityChange:r=>{N(D(r,p))},onRowSelectionChange:r=>{d(D(r,h))},onColumnOrderChange:r=>{g(D(r,i))},state:{sorting:I,columnVisibility:p,pagination:R,rowSelection:h,columnOrder:i},meta:{refetch:A.refetch}});return j(()=>{g([...U.getAllLeafColumns().map(r=>r.id)])},[]),{tableState:s,updateTableState:z,query:A,setSearchQuery:m,searchQuery:b,tanTable:U,mergedFilters:q,filters:P,setFilters:Y,filterConfig:n}}const G=ye(null),T=()=>{const t=Ce(G);if(!t)throw Error("DataTable should be used within DataTableProvider.");return t};function jt({children:t,...a}){return e(G.Provider,{value:a,children:t})}function Ht({tableActions:t,className:a,...l}){const{query:o,tanTable:n}=T();return e(C,{children:c("section",{...l,className:x("flex flex-col bg-card",a),children:[e(et,{tableActions:t}),c("div",{className:"w-full overflow-auto border-x grow min-h-table relative",tabIndex:0,children:[o.isLoading&&e(K,{className:"cursor-wait",children:e(je,{})}),!o.isLoading&&n.getRowModel().rows.length===0&&e(K,{className:"cursor-not-allowed",children:!o.isFetching&&(o.isError?c("span",{className:"flex gap-3 justify-center items-center",children:[e(oe,{}),e("span",{children:"You don't have the required permissions. Please contact your admin."})]}):o.data?.data?e(C,{children:"Unknown error. Please contact customer support."}):e(C,{children:"No results found."}))}),!o.isLoading&&n.getRowModel().rows.length!==0&&e(tt,{className:"size-full"})]}),c("div",{className:"flex w-full justify-between border gap-icon p-icon overflow-x-auto",children:[c("div",{className:"flex gap-icon",children:[e(Ye,{}),e(Je,{})]}),e(Ze,{})]})]})})}function K({children:t,className:a}){return c(C,{children:[e("span",{className:x(a,"absolute top-0 bg-card z-20 size-full text-sm flex items-center justify-center"),children:t}),e("span",{className:"relative h-full w-0 block"})]})}function Ye(){const{tanTable:t}=T(),[a,l]=w(null),o=W(),n=Pe(H(De),H(Oe,{coordinateGetter:xe}));return e(Ie,{sensors:n,collisionDetection:Re,onDragStart:s=>{const{active:u}=s;l(u.id.toString())},onDragEnd:s=>{const{active:u,over:h}=s;if(h&&u.id!==h.id){const d=t.getState().columnOrder,b=d.indexOf(u.id.toString()),m=d.indexOf(h.id.toString());t.setColumnOrder([...Ae(d,b,m)])}l(null)},children:c(Te,{items:t.getState().columnOrder,strategy:Ne,children:[c(V,{label:c(C,{children:[e(se,{}),"Columns"]}),selectionMode:"multiple",items:t.getAllFlatColumns(),selectedKeys:t.getIsAllColumnsVisible()?"all":t.getVisibleFlatColumns().map(s=>s.id),children:[e(L,{onAction:()=>t.toggleAllColumnsVisible(),className:"italic",children:"(select all)"}),t.getState().columnOrder.map(s=>{const u=t.getAllFlatColumns().find(h=>h.id===s);return u?e(f,{column:u},u.id):null})]}),e(Le,{children:a?e("div",{className:"opacity-70 border-2 border-primary",children:o(a)}):null})]})});function f({column:s}){const{attributes:u,listeners:h,setNodeRef:d,transform:b,transition:m}=Fe({id:s.id}),i={transform:ze.Transform.toString(b),transition:m,zIndex:"999"};return c(L,{ref:d,style:i,...u,id:s.id,onAction:()=>s.toggleVisibility(),isDisabled:!s.getCanHide(),className:"flex items-center",children:[e(ce,{...h,className:"size-icon cursor-grab"}),o(s.id),s.getIsSorted()&&e(X,{className:"size-icon",direction:s.getIsSorted()})]})}}function Ze(){const{tanTable:t,query:a}=T(),l=a.data?.total??0;return c("div",{className:"flex items-center gap-2",children:[e("span",{className:"whitespace-nowrap caption text-muted",children:`${t.getState().pagination.pageIndex*t.getState().pagination.pageSize+1} - ${Math.min((t.getState().pagination.pageIndex+1)*t.getState().pagination.pageSize,l)} of ${l?.toLocaleString()}`}),e(y,{onPress:()=>t.firstPage(),isDisabled:!t.getCanPreviousPage(),variant:"neutral",size:"icon",children:e(de,{})}),e(y,{onPress:()=>t.previousPage(),isDisabled:!t.getCanPreviousPage(),variant:"neutral",size:"icon",children:e(ue,{})}),e(y,{onPress:()=>t.nextPage(),isDisabled:!t.getCanNextPage(),variant:"neutral",size:"icon",children:e(me,{})}),e(y,{onClick:()=>t.lastPage(),isDisabled:!t.getCanNextPage(),variant:"neutral",size:"icon",children:e(pe,{})})]})}function Je(){const{tanTable:t}=T(),a=[10,20,30,40,50];return e(V,{label:t.getState().pagination.pageSize.toString(),selectionMode:"single",selectedKeys:[t.getState().pagination.pageSize.toString()],items:a.map(l=>({id:l.toString(),value:l})),children:l=>e(L,{onAction:()=>t.setPageSize(l.value),children:l.value})})}function et({tableActions:t}){const{query:a,tanTable:l,searchQuery:o,setSearchQuery:n}=T();return c("section",{className:"flex bg-card justify-between my-0 p-icon border gap-icon overflow-auto",children:[c("div",{className:"flex gap-icon",children:[e(y,{isPending:a.isFetching,onClick:()=>a.refetch(),variant:"neutral",size:"icon",children:e(le,{})}),t.filter(f=>f.bulk===l.getSelectedRowModel().rows.length>0).map((f,s)=>{const u=f.icon;return e(y,{type:"button",isDisabled:a.isFetching,className:"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform",onPress:h=>{f.onClick(h,l)},size:"icon",children:e(u,{})},`${s}-${f.bulk}`)})]}),c("div",{className:"flex gap-icon",children:[e(rt,{}),e(He,{value:o,onChange:n})]})]})}function X({direction:t,...a}){return t==="asc"?e(ge,{...a}):t==="desc"?e(fe,{...a}):e(he,{...a})}function tt({className:t}){const{tanTable:a}=T(),l=(o,n)=>x("animate-in fade-in slide-in-from-top-10","px-icon py-2 text-left text-sm font-medium whitespace-nowrap",o&&"bg-card sticky right-0 z-50 text-center",n);return c(Be,{className:x(t),children:[e(Ke,{className:"sticky top-0 z-10",children:a.getHeaderGroups().map(o=>e(B,{className:x("h-input"),children:o.headers.map(n=>c(Qe,{className:l(!1,"bg-card"),children:[!n.column.getCanSort()&&!n.isPlaceholder&&e(C,{children:M(n.column.columnDef.header,n.getContext())}),n.column.getCanSort()&&c(y,{variant:"ghost",className:"w-full !justify-start !px-1.5",onPress:n.column.getToggleSortingHandler(),children:[M(n.column.columnDef.header,n.getContext()),e(X,{direction:n.column.getIsSorted()})]})]},n.id))},o.id))}),e(We,{className:"flex-1 overflow-y-auto relative",children:a.getRowModel().rows.map(o=>e(B,{className:x("h-input transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20"),"data-selected":o.getIsSelected(),children:o.getVisibleCells().map(n=>e(Ge,{className:l(n.column.id===_),children:M(n.column.columnDef.cell,n.getContext())},n.id))},o.id))})]})}const Bt=["eq","ne","cn","nc","sw","ew","in","nin","gt","gte","lt","lte"],nt={eq:"equal to",ne:"not equal to",cn:"contains",nc:"does not contain",sw:"starts with",ew:"ends with",in:"includes",nin:"does not include",gt:"greater than",gte:"greater than or equal to",lt:"less than",lte:"less than or equal to"},Q={bool:["eq"],enum:["in","nin"],id:["in","nin"],"id-search":["in","nin"],string:["eq","ne","cn","nc","sw","ew","in","nin"],date:["lt","gt"]};function rt({className:t,...a}){const{filters:l,query:o,setFilters:n,filterConfig:f}=T(),s=we(null),u=W(),d=ke({defaultValues:{filters:[]},onSubmit:({value:m})=>{n(m.filters.map(i=>({[i.property]:{[i.operator]:[i.value]}})))}}),b=Object.keys(f).sort();return e("section",{...a,className:x("flex gap-icon items-center",t),children:c($e,{onOpenChange:m=>{m?s.current?.focus():d.handleSubmit()},children:[e(y,{active:l.length>0,isDisabled:o.isPending||b.length===0,type:"button",size:"icon",variant:"neutral",children:e(be,{})}),e(Ue,{className:"w-full p-icon",children:e("form",{onSubmit:m=>{m.preventDefault()},className:"flex flex-col gap-icon max-h-table overflow-auto ",children:e(d.Field,{mode:"array",name:"filters",children:m=>c(C,{children:[m.state.value.map((i,g)=>c("div",{className:"flex gap-icon items-center justify-normal",children:[e("span",{className:"text-sm",children:u(i.property)}),e(d.AppField,{name:`filters[${g}].operator`,children:p=>e(p.TfSingleSelect,{items:Q[i.type].map(N=>({id:N,label:e(C,{children:nt[N]})}))})},i.id),i.type==="bool"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfCheckbox,{})}),i.type==="date"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(Ve,{})}),i.type==="id"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfTextField,{})}),i.type==="string"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfTextField,{})}),i.type==="enum"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfMultiSelect,{items:f[i.property].options})}),i.type==="id-search"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(qe,{multiple:!0,accessor:"id",searchFn:f[i.property].search})}),e(y,{type:"button",variant:"destructive",size:"icon",onPress:()=>m.removeValue(g),children:e(Se,{})})]},i.id)),c("div",{className:"flex w-full items-center justify-end gap-2 not-first:mt-icon",children:[e(V,{label:"Add Filter",children:b.map(i=>e(L,{onAction:()=>{const g=f[i].type,p=P=>{switch(P){case"bool":return!0;case"string":return"";case"date":return new Date().toISOString();case"id":return"";case"id-search":return[];case"enum":return[]}},N={id:`${i}-${Date.now()}`,operator:Q[g][0],value:p(g),type:g,property:i};m.pushValue(N)},children:u(i)},i))}),m.state.value.length>0?e(y,{type:"button",variant:"neutral",onPress:()=>{m.setValue([])},children:"Reset filters"}):null]})]})})})})]})})}export{_ as ACTIONS_COLUMN_ID,nt as C,rt as D,Ht as DataTable,G as DataTableContext,jt as DataTableProvider,Bt as F,T as useDataTable,kt as useDataTableState};
+"use client";import{jsx as e,Fragment as C,jsxs as c}from"react/jsx-runtime";import{Button as y}from"./button.js";import{useQuery as te,keepPreviousData as ne}from"@tanstack/react-query";import{createColumnHelper as re,useReactTable as ae,getCoreRowModel as ie,flexRender as M}from"@tanstack/react-table";import{Info as oe,RotateCw as le,Columns3 as se,GripVertical as ce,ChevronFirst as de,ChevronLeft as ue,ChevronRight as me,ChevronLast as pe,ArrowDownNarrowWide as ge,ArrowDownWideNarrow as fe,ArrowUpDown as he,Filter as be,Trash as Se}from"lucide-react";import{createContext as ye,useId as ve,useState as w,useMemo as E,useEffect as j,useContext as Ce,useRef as we}from"react";import{sortableKeyboardCoordinates as xe,SortableContext as Te,verticalListSortingStrategy as Ne,arrayMove as Ae,useSortable as Fe}from"@dnd-kit/sortable";import{useSensors as Pe,useSensor as H,PointerSensor as De,KeyboardSensor as Oe,DndContext as Ie,closestCenter as Re,DragOverlay as Le}from"@dnd-kit/core";import{CSS as ze}from"@dnd-kit/utilities";import{TABLE_CHECK_BOX_COLUMN as Me,TABLE_ID_COLUMN as Ee,TABLE_DEFAULT_DATE_COLUMNS as _e}from"./data-table-commons.js";import{TfDatePicker as Ve}from"./date-picker.js";import{TfIdSearchInput as qe}from"./id-search.js";import{EasyMenu as V,MenuItem as L}from"./menu.js";import{PopoverTrigger as $e,Popover as Ue}from"./popover.js";import{useAppForm as ke}from"../utils/form-hook.js";import{classNames as x}from"../utils/primitives.js";import{useResourceFormatter as W}from"../utils/resource-names.js";import{Loader as je}from"./loader.js";import{SearchField as He}from"./searchfield.js";import{Table as Be,TableHeader as Ke,TableRow as B,TableHead as Qe,TableBody as We,TableCell as Ge}from"./table.js";import{merge as Xe}from"lodash-es";import"class-variance-authority";import"react-aria-components";import"date-fns";import"./checkbox.js";import"./field.js";import"../utils/form-utils.js";import"../utils/form-context.js";import"@tanstack/react-form";import"@internationalized/date";import"./calendar.js";import"./datefield.js";import"./list-box.js";import"./select.js";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";import"clsx";const _="tableActions";function jt({columns:t,fetchFn:a,columnsToHideByDefault:l={},allowSelection:o=!1,filterConfig:n}){const f=ve(),[s,u]=w({pagination:{pageIndex:0,pageSize:20},sorting:[]}),[h,d]=w({}),[b,m]=w(""),[i,g]=w([]),[p,N]=w({id:!1,updatedAt:!1,...l}),[P,Y]=w([]),q=E(()=>P.reduce((r,v)=>Xe(r,v),{}),[P]),z=r=>{u(v=>({...v,...r}))},{sorting:I,pagination:R}=s,A=te({queryKey:[f,R,I,b],queryFn:()=>a(R,I,b,q),placeholderData:ne,retry:0,refetchOnWindowFocus:!1});j(()=>{},[p]);const Z=E(()=>re(),[]),$=E(()=>{const r=A.data?.data;if(!r?.length)return[];const v=S=>S!=null&&typeof S=="object"&&"metadata"in S&&Array.isArray(S.metadata),k=r.filter(v);return k.length===0?[]:Array.from(new Set(k.flatMap(S=>S.metadata?.map(F=>F.key)??[]))).map(S=>Z.accessor(F=>v(F)?F?.metadata?.find(O=>O.key===S)?.value??"":"",{id:S,header:S,enableSorting:!1,cell:F=>{const O=F.getValue();return O==null?"":String(O)}}))},[A.data?.data]),J=[...o?Me:[],...Ee,...t.filter(r=>r.id!==_),...$.length?$:[],..._e,...t.filter(r=>r.id===_)];function ee(r){return typeof r=="function"}function D(r,v){return ee(r)?r(v):r}const U=ae({data:A.data?.data??[],columns:J,getCoreRowModel:ie(),rowCount:A.data?.total,manualPagination:!0,onPaginationChange:r=>{z({pagination:D(r,R)})},manualSorting:!0,onSortingChange:r=>{d({}),z({sorting:[...D(r,I)]})},manualFiltering:!0,onColumnVisibilityChange:r=>{N(D(r,p))},onRowSelectionChange:r=>{d(D(r,h))},onColumnOrderChange:r=>{g(D(r,i))},state:{sorting:I,columnVisibility:p,pagination:R,rowSelection:h,columnOrder:i},meta:{refetch:A.refetch}});return j(()=>{g([...U.getAllLeafColumns().map(r=>r.id)])},[]),{tableState:s,updateTableState:z,query:A,setSearchQuery:m,searchQuery:b,tanTable:U,mergedFilters:q,filters:P,setFilters:Y,filterConfig:n}}const G=ye(null),T=()=>{const t=Ce(G);if(!t)throw Error("DataTable should be used within DataTableProvider.");return t};function Ht({children:t,...a}){return e(G.Provider,{value:a,children:t})}function Bt({tableActions:t,className:a,...l}){const{query:o,tanTable:n}=T();return e(C,{children:c("section",{...l,className:x("flex flex-col bg-card",a),children:[e(et,{tableActions:t}),c("div",{className:"w-full overflow-auto border-x grow min-h-table relative",tabIndex:0,children:[o.isLoading&&e(K,{className:"cursor-wait",children:e(je,{})}),!o.isLoading&&n.getRowModel().rows.length===0&&e(K,{className:"cursor-not-allowed",children:!o.isFetching&&(o.isError?c("span",{className:"flex gap-3 justify-center items-center",children:[e(oe,{}),e("span",{children:"You don't have the required permissions. Please contact your admin."})]}):o.data?.data?e(C,{children:"Unknown error. Please contact customer support."}):e(C,{children:"No results found."}))}),!o.isLoading&&n.getRowModel().rows.length!==0&&e(tt,{className:"size-full"})]}),c("div",{className:"flex w-full justify-between border gap-icon p-icon overflow-x-auto",children:[c("div",{className:"flex gap-icon",children:[e(Ye,{}),e(Je,{})]}),e(Ze,{})]})]})})}function K({children:t,className:a}){return c(C,{children:[e("span",{className:x(a,"absolute top-0 bg-card z-20 size-full text-sm flex items-center justify-center"),children:t}),e("span",{className:"relative h-full w-0 block"})]})}function Ye(){const{tanTable:t}=T(),[a,l]=w(null),o=W(),n=Pe(H(De),H(Oe,{coordinateGetter:xe}));return e(Ie,{sensors:n,collisionDetection:Re,onDragStart:s=>{const{active:u}=s;l(u.id.toString())},onDragEnd:s=>{const{active:u,over:h}=s;if(h&&u.id!==h.id){const d=t.getState().columnOrder,b=d.indexOf(u.id.toString()),m=d.indexOf(h.id.toString());t.setColumnOrder([...Ae(d,b,m)])}l(null)},children:c(Te,{items:t.getState().columnOrder,strategy:Ne,children:[c(V,{label:c(C,{children:[e(se,{}),"Columns"]}),selectionMode:"multiple",items:t.getAllFlatColumns(),selectedKeys:t.getIsAllColumnsVisible()?"all":t.getVisibleFlatColumns().map(s=>s.id),children:[e(L,{onAction:()=>t.toggleAllColumnsVisible(),className:"italic",children:"(select all)"}),t.getState().columnOrder.map(s=>{const u=t.getAllFlatColumns().find(h=>h.id===s);return u?e(f,{column:u},u.id):null})]}),e(Le,{children:a?e("div",{className:"opacity-70 border-2 border-primary",children:o(a)}):null})]})});function f({column:s}){const{attributes:u,listeners:h,setNodeRef:d,transform:b,transition:m}=Fe({id:s.id}),i={transform:ze.Transform.toString(b),transition:m,zIndex:"999"};return c(L,{ref:d,style:i,...u,id:s.id,onAction:()=>s.toggleVisibility(),isDisabled:!s.getCanHide(),className:"flex items-center",children:[e(ce,{...h,className:"size-icon cursor-grab"}),o(s.id),s.getIsSorted()&&e(X,{className:"size-icon",direction:s.getIsSorted()})]})}}function Ze(){const{tanTable:t,query:a}=T(),l=a.data?.total??0;return c("div",{className:"flex items-center gap-2",children:[e("span",{className:"whitespace-nowrap caption text-muted",children:`${t.getState().pagination.pageIndex*t.getState().pagination.pageSize+1} - ${Math.min((t.getState().pagination.pageIndex+1)*t.getState().pagination.pageSize,l)} of ${l?.toLocaleString()}`}),e(y,{onPress:()=>t.firstPage(),isDisabled:!t.getCanPreviousPage(),variant:"neutral",size:"icon",children:e(de,{})}),e(y,{onPress:()=>t.previousPage(),isDisabled:!t.getCanPreviousPage(),variant:"neutral",size:"icon",children:e(ue,{})}),e(y,{onPress:()=>t.nextPage(),isDisabled:!t.getCanNextPage(),variant:"neutral",size:"icon",children:e(me,{})}),e(y,{onClick:()=>t.lastPage(),isDisabled:!t.getCanNextPage(),variant:"neutral",size:"icon",children:e(pe,{})})]})}function Je(){const{tanTable:t}=T(),a=[10,20,30,40,50];return e(V,{label:t.getState().pagination.pageSize.toString(),selectionMode:"single",selectedKeys:[t.getState().pagination.pageSize.toString()],items:a.map(l=>({id:l.toString(),value:l})),children:l=>e(L,{onAction:()=>t.setPageSize(l.value),children:l.value})})}function et({tableActions:t}){const{query:a,tanTable:l,searchQuery:o,setSearchQuery:n}=T();return c("section",{className:"flex bg-card justify-between my-0 p-icon border gap-icon overflow-auto",children:[c("div",{className:"flex gap-icon",children:[e(y,{isPending:a.isFetching,onClick:()=>a.refetch(),variant:"neutral",size:"icon",children:e(le,{})}),t.filter(f=>f.bulk===l.getSelectedRowModel().rows.length>0).map((f,s)=>{const u=f.icon;return e(y,{type:"button",isDisabled:a.isFetching,className:"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform",onPress:h=>{f.onClick(h,l)},size:"icon",children:e(u,{})},`${s}-${f.bulk}`)})]}),c("div",{className:"flex gap-icon",children:[e(rt,{}),e(He,{value:o,onChange:n})]})]})}function X({direction:t,...a}){return t==="asc"?e(ge,{...a}):t==="desc"?e(fe,{...a}):e(he,{...a})}function tt({className:t}){const{tanTable:a}=T(),l=(o,n)=>x("animate-in fade-in slide-in-from-top-10","px-icon py-2 text-left text-sm font-medium whitespace-nowrap",o&&"bg-card sticky right-0 z-50 text-center",n);return c(Be,{className:x(t),children:[e(Ke,{className:"sticky top-0 z-10",children:a.getHeaderGroups().map(o=>e(B,{className:x("h-input"),children:o.headers.map(n=>c(Qe,{className:l(!1,"bg-card"),children:[!n.column.getCanSort()&&!n.isPlaceholder&&e(C,{children:M(n.column.columnDef.header,n.getContext())}),n.column.getCanSort()&&c(y,{variant:"ghost",className:"w-full !justify-start !px-1.5",onPress:n.column.getToggleSortingHandler(),children:[M(n.column.columnDef.header,n.getContext()),e(X,{direction:n.column.getIsSorted()})]})]},n.id))},o.id))}),e(We,{className:"flex-1 overflow-y-auto relative",children:a.getRowModel().rows.map(o=>e(B,{className:x("h-input transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20"),"data-selected":o.getIsSelected(),children:o.getVisibleCells().map(n=>e(Ge,{className:l(n.column.id===_),children:M(n.column.columnDef.cell,n.getContext())},n.id))},o.id))})]})}const Kt=["eq","ne","cn","nc","sw","ew","in","nin","gt","gte","lt","lte"],nt={eq:"equal to",ne:"not equal to",cn:"contains",nc:"does not contain",sw:"starts with",ew:"ends with",in:"includes",nin:"does not include",gt:"greater than",gte:"greater than or equal to",lt:"less than",lte:"less than or equal to"},Q={bool:["eq"],enum:["in","nin"],id:["in","nin"],"id-search":["in","nin"],string:["eq","ne","cn","nc","sw","ew","in","nin"],date:["lt","gt"]};function rt({className:t,...a}){const{filters:l,query:o,setFilters:n,filterConfig:f}=T(),s=we(null),u=W(),d=ke({defaultValues:{filters:[]},onSubmit:({value:m})=>{n(m.filters.map(i=>({[i.property]:{[i.operator]:[i.value]}})))}}),b=Object.keys(f).sort();return e("section",{...a,className:x("flex gap-icon items-center",t),children:c($e,{onOpenChange:m=>{m?s.current?.focus():d.handleSubmit()},children:[e(y,{active:l.length>0,isDisabled:o.isPending||b.length===0,type:"button",size:"icon",variant:"neutral",children:e(be,{})}),e(Ue,{className:"w-full p-icon",children:e("form",{onSubmit:m=>{m.preventDefault()},className:"flex flex-col gap-icon max-h-table overflow-auto ",children:e(d.Field,{mode:"array",name:"filters",children:m=>c(C,{children:[m.state.value.map((i,g)=>c("div",{className:"flex gap-icon items-center justify-normal",children:[e("span",{className:"text-sm",children:u(i.property)}),e(d.AppField,{name:`filters[${g}].operator`,children:p=>e(p.TfSingleSelect,{items:Q[i.type].map(N=>({id:N,label:e(C,{children:nt[N]})}))})},i.id),i.type==="bool"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfCheckbox,{})}),i.type==="date"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(Ve,{})}),i.type==="id"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfTextField,{})}),i.type==="string"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfTextField,{})}),i.type==="enum"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(p.TfMultiSelect,{items:f[i.property].options})}),i.type==="id-search"&&e(d.AppField,{name:`filters[${g}].value`,children:p=>e(qe,{multiple:!0,accessor:"id",searchFn:f[i.property].search})}),e(y,{type:"button",variant:"destructive",size:"icon",onPress:()=>m.removeValue(g),children:e(Se,{})})]},i.id)),c("div",{className:"flex w-full items-center justify-end gap-2 not-first:mt-icon",children:[e(V,{label:"Add Filter",children:b.map(i=>e(L,{onAction:()=>{const g=f[i].type,p=P=>{switch(P){case"bool":return!0;case"string":return"";case"date":return new Date().toISOString();case"id":return"";case"id-search":return[];case"enum":return[]}},N={id:`${i}-${Date.now()}`,operator:Q[g][0],value:p(g),type:g,property:i};m.pushValue(N)},children:u(i)},i))}),m.state.value.length>0?e(y,{type:"button",variant:"neutral",onPress:()=>{m.setValue([])},children:"Reset filters"}):null]})]})})})})]})})}export{_ as ACTIONS_COLUMN_ID,nt as C,rt as D,Bt as DataTable,G as DataTableContext,Ht as DataTableProvider,Kt as F,T as useDataTable,jt as useDataTableState};
 //# sourceMappingURL=data-table.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"data-table.js","sources":["../../lib/components/data-table.tsx","../../lib/components/data-table-filter.tsx"],"sourcesContent":["\"use client\";\nimport type { components, operations } from \"@cryptlex/web-api-types\";\nimport { keepPreviousData, useQuery } from \"@tanstack/react-query\";\nimport {\n\ttype AccessorFnColumnDef,\n\ttype Column,\n\ttype ColumnDef,\n\ttype ColumnOrderState,\n\tcreateColumnHelper,\n\tgetCoreRowModel,\n\ttype RowSelectionState,\n\ttype TableState,\n\ttype Updater,\n\tuseReactTable,\n\ttype VisibilityState\n} from \"@tanstack/react-table\";\nimport { ArrowDownNarrowWide, ArrowDownWideNarrow, ArrowUpDown, Columns3, GripVertical, Info } from \"lucide-react\";\nimport { createContext, useContext, useEffect, useId, useMemo, useState } from \"react\";\n\n/** Reserved name for actions column */\nexport const ACTIONS_COLUMN_ID = \"tableActions\";\nexport type Schemas = ApiSchema<keyof components['schemas']>;\nexport type OperationKeys = keyof operations;\ntype DataTableFactory<TData extends Schemas> = {\n\tfetchFn: TableFetchFn<TData, OperationKeys>;\n\tcolumns: ColumnDef<TData, any>[]\n\tallowSelection?: boolean;\n\tcolumnsToHideByDefault?: VisibilityState; // Columns that are hidden by default\n\tfilterConfig: FiltersConfig<OperationKeys>\n}\n\n\ntype DataTableState = Pick<TableState, 'sorting' | 'pagination'> & {};\n/**\n * Hook for handling all data-table state. Used in DataTableContext\n */\nexport function useDataTableState<TData extends Schemas>({ columns, fetchFn, columnsToHideByDefault = {}, allowSelection = false, filterConfig }: DataTableFactory<TData>) {\n\tconst id = useId();\n\n\tconst [tableState, _setTableState] = useState<DataTableState>({\n\t\t/** TODO Reflect in URL  */\n\t\tpagination: { pageIndex: 0, pageSize: 20 }, // Pagination state\n\t\tsorting: [], // Sorting state\n\t});\n\n\tconst [rowSelection, setRowSelection] = useState<RowSelectionState>({})\n\n\t/** TODO Reflect in URL  */\n\tconst [searchQuery, setSearchQuery] = useState('');\n\n\t/** TODO Store on browser as preference */\n\tconst [columnOrder, setColumnOrder] = useState<ColumnOrderState>([])\n\t// TODO Store on browser\n\tconst [columnVisibility, setColumnVisibility] = useState<VisibilityState>({\n\t\tid: false,\n\t\tupdatedAt: false,\n\t\t...columnsToHideByDefault,\n\t});\n\n\tconst [filters, setFilters] = useState<ApiFilters<OperationKeys>[]>([]);\n\n\tconst mergedFilters = useMemo(() => {\n\t\treturn filters.reduce((acc, current) => {\n\t\t\treturn merge(acc, current);\n\t\t}, {});\n\t}, [filters])\n\n\t// Update table state with new values\n\tconst updateTableState = (updates: Partial<DataTableState>) => {\n\t\t_setTableState((prev) => ({ ...prev, ...updates }));\n\t};\n\n\tconst {\n\t\tsorting,\n\t\tpagination,\n\t} = tableState;\n\n\tconst query = useQuery({\n\t\tqueryKey: [id, pagination, sorting, searchQuery],\n\t\tqueryFn: () => fetchFn(pagination, sorting, searchQuery, mergedFilters),\n\t\tplaceholderData: keepPreviousData, // Keep previous data while loading new data\n\t\tretry: 0,\n\t\trefetchOnWindowFocus: false,\n\t});\n\n\tuseEffect(() => {\n\t\t// TODO, store in localStorage\n\t}, [columnVisibility])\n\n\tconst columnHelper = useMemo(() => createColumnHelper<TData>(), []);\n\n\tconst metadataColumns = useMemo<AccessorFnColumnDef<TData, string>[]>(() => {\n\t\tconst data = query.data?.data;\n\t\tif (!data?.length) return [];\n\n\t\ttype WithMeta = TData & { metadata: ApiSchema<'MetadataDto'>[] };\n\t\tconst rowHasMetadata = (row: TData): row is WithMeta => row != null &&\n\t\t\ttypeof row === 'object' &&\n\t\t\t'metadata' in row &&\n\t\t\tArray.isArray((row).metadata);\n\n\t\tconst rowsWithMeta = data.filter(\n\t\t\trowHasMetadata\n\t\t);\n\t\tif (rowsWithMeta.length === 0) return [];\n\t\tconst keys: string[] = Array.from(new Set(rowsWithMeta.flatMap(r => r.metadata?.map(m => m.key) ?? [])));\n\n\t\treturn keys.map(key =>\n\t\t\tcolumnHelper.accessor(\n\t\t\t\t(row) => {\n\t\t\t\t\tif (rowHasMetadata(row)) {\n\t\t\t\t\t\treturn row?.metadata?.find(m => m.key === key)?.value ?? '';\n\t\t\t\t\t}\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: key,\n\t\t\t\t\theader: key, // tooltip header\n\t\t\t\t\tenableSorting: false,\n\t\t\t\t\tcell: (info) => {\n\t\t\t\t\t\tconst value = info.getValue();\n\t\t\t\t\t\t// Handle null/undefined values\n\t\t\t\t\t\tif (value === null || value === undefined) return \"\";\n\t\t\t\t\t\t// For primitive types, return the string representation\n\t\t\t\t\t\treturn String(value);\n\t\t\t\t\t},\n\t\t\t\t}\n\t\t\t));\n\t}, [query.data?.data]);\n\n\t/**\n\t * ID,createdAt and updatedAt will be added by default for all tables\n\t * If selection is allowed, checkbox will be added\n\t * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n\t * If there are actions for the table, they will be placed fixed at the right side of table.\n\t */\n\tconst cols: ColumnDef<any, any>[] = [\n\t\t...(allowSelection ? TABLE_CHECK_BOX_COLUMN : []),\n\t\t...TABLE_ID_COLUMN,\n\t\t...columns.filter((col) => col.id !== ACTIONS_COLUMN_ID),\n\t\t...(metadataColumns.length ? metadataColumns : []),\n\t\t...TABLE_DEFAULT_DATE_COLUMNS,\n\t\t// Actions column\n\t\t...columns.filter((col) => col.id === ACTIONS_COLUMN_ID),\n\t];\n\n\t// Type-guard for updater\n\tfunction isUpdaterFunction<T>(updater: Updater<T>): updater is (old: T) => T {\n\t\treturn typeof updater === \"function\";\n\t}\n\t// Utility function to resolve updater\n\tfunction resolveUpdater<T>(updater: Updater<T>, currentValue: T) {\n\t\tif (isUpdaterFunction(updater)) {\n\t\t\treturn updater(currentValue);\n\t\t}\n\t\treturn updater;\n\t}\n\n\t// Use react-table's hook to create the table instance\n\tconst tanTable = useReactTable({\n\t\tdata: query.data?.data ?? [],\n\t\tcolumns: cols,\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\trowCount: query.data?.total,\n\t\tmanualPagination: true, // Handle pagination manually since pagination is done server side for data tables\n\t\tonPaginationChange: (updater) => {\n\t\t\tupdateTableState({ pagination: resolveUpdater(updater, pagination) });\n\t\t},\n\t\tmanualSorting: true, // Handle sorting manually since sorting is done server side for data tables\n\t\tonSortingChange: (updater) => {\n\t\t\tsetRowSelection({});\n\t\t\tupdateTableState({ sorting: [...resolveUpdater(updater, sorting)] }); // Reset selection when sorting.\n\t\t},\n\t\tmanualFiltering: true, // Handle filtering manually since filtering is done server side for data tables\n\t\tonColumnVisibilityChange: (updater) => {\n\t\t\tsetColumnVisibility(resolveUpdater(updater, columnVisibility));\n\t\t},\n\t\tonRowSelectionChange: (updater) => {\n\t\t\tsetRowSelection(resolveUpdater(updater, rowSelection));\n\t\t},\n\t\tonColumnOrderChange: (updater) => {\n\t\t\tsetColumnOrder(resolveUpdater(updater, columnOrder));\n\t\t},\n\t\tstate: {\n\t\t\tsorting: sorting,\n\t\t\tcolumnVisibility: columnVisibility,\n\t\t\tpagination: pagination,\n\t\t\trowSelection: rowSelection,\n\t\t\tcolumnOrder: columnOrder\n\t\t},\n\t\tmeta: {\n\t\t\trefetch: query.refetch,\n\t\t},\n\t});\n\n\t// By default, ColumnDef does not give guarantees of column.id existing. Once useReactTable is called, all columns are assigned IDs.\n\t// This populates the columnIds in the columnOrder state\n\t// TODO, add localStorage access layer for this. \n\tuseEffect(() => {\n\t\tsetColumnOrder([...tanTable.getAllLeafColumns().map(c => c.id)]);\n\t}, [])\n\n\treturn { tableState, updateTableState, query, setSearchQuery, searchQuery, tanTable, mergedFilters, filters, setFilters, filterConfig }\n}\n\nexport const DataTableContext = createContext<ReturnType<typeof useDataTableState> | null>(null);\n\nexport const useDataTable = () => {\n\tconst ctx = useContext(DataTableContext);\n\tif (!ctx) {\n\t\tthrow Error(\"DataTable should be used within DataTableProvider.\")\n\t}\n\treturn ctx;\n}\n\nexport function DataTableProvider({ children, ...props }: { children: React.ReactNode; } & ReturnType<typeof useDataTableState>) {\n\treturn (\n\t\t<DataTableContext.Provider value={props}>\n\t\t\t{children}\n\t\t</DataTableContext.Provider>\n\t)\n}\n\n\nexport type DataTableProps = React.ComponentProps<'section'> & {\n\ttableActions: TableActions;\n\n\t// filterConfig: {\n\t// \tfilters: Record<keyof ApiFilters<TOperation>, 'date' | 'string' | 'known-string' | 'number'>,\n\t// }\n}\nexport function DataTable({\n\ttableActions,\n\tclassName,\n\t...props\n\t// filterableFields,\n}: DataTableProps) {\n\t// State for managing table data and filters\n\tconst { query, tanTable } = useDataTable();\n\n\treturn (\n\t\t<>\n\t\t\t{/* Table Actions Section */}\n\t\t\t<section {...props} className={classNames(\"flex flex-col bg-card\", className)}>\n\t\t\t\t<Actions tableActions={tableActions} />\n\t\t\t\t{/* The div here is necessary because TableContent is internally a <table> tag and does not respect width, height CSS */}\n\t\t\t\t<div className=\"w-full overflow-auto border-x grow min-h-table relative\" tabIndex={0}>\n\t\t\t\t\t{/* Table overlay with loader */}\n\t\t\t\t\t{query.isLoading && (\n\t\t\t\t\t\t<TableOverlay className=\"cursor-wait\">\n\t\t\t\t\t\t\t<Loader />\n\t\t\t\t\t\t</TableOverlay>\n\t\t\t\t\t)}\n\t\t\t\t\t{/* Table overlay for empty table */}\n\t\t\t\t\t{!query.isLoading && tanTable.getRowModel().rows.length === 0 && (\n\t\t\t\t\t\t// Empty table\n\t\t\t\t\t\t<TableOverlay className=\"cursor-not-allowed\">\n\t\t\t\t\t\t\t{!query.isFetching &&\n\t\t\t\t\t\t\t\t(query.isError ? (\n\t\t\t\t\t\t\t\t\t<span className=\"flex gap-3 justify-center items-center\">\n\t\t\t\t\t\t\t\t\t\t{/* TODO (mudasir-pandith) Check for 403 explicitly!! */}\n\t\t\t\t\t\t\t\t\t\t{/* <span>{query.error}</span> */}\n\t\t\t\t\t\t\t\t\t\t<Info />\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\tYou don't have the required permissions. Please contact your\n\t\t\t\t\t\t\t\t\t\t\tadmin.\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t) : !query.data?.data ? (\n\t\t\t\t\t\t\t\t\t<>No results found.</>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<>Unknown error. Please contact customer support.</>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</TableOverlay>\n\t\t\t\t\t)}\n\t\t\t\t\t{!query.isLoading && tanTable.getRowModel().rows.length !== 0 &&\n\t\t\t\t\t\t<TableContent className=\"size-full\" />}\n\t\t\t\t</div>\n\n\t\t\t\t{/* Table Footer Section with Pagination and Column Picker */}\n\t\t\t\t<div className=\"flex w-full justify-between border gap-icon p-icon overflow-x-auto\">\n\t\t\t\t\t<div className=\"flex gap-icon\">\n\t\t\t\t\t\t<ColumnPicker />\n\t\t\t\t\t\t<PageSize />\n\t\t\t\t\t</div>\n\t\t\t\t\t<Paginator />\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t</>\n\t);\n}\n/** Table overlay to be shown for loaders or other messages */\nfunction TableOverlay({\n\tchildren,\n\tclassName,\n}: { children: React.ReactNode; className?: string }) {\n\treturn (\n\t\t<>\n\t\t\t<span\n\t\t\t\tclassName={classNames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t\"absolute top-0 bg-card z-20 size-full text-sm flex items-center justify-center\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t\t{/* Keep something in document flow with the correct height */}\n\t\t\t<span className=\"relative h-full w-0 block\" />\n\t\t</>\n\t);\n}\n\nimport {\n\tarrayMove,\n\tSortableContext,\n\tsortableKeyboardCoordinates,\n\tuseSortable,\n\tverticalListSortingStrategy\n} from '@dnd-kit/sortable';\n\nfunction ColumnPicker() {\n\tconst { tanTable } = useDataTable();\n\tconst [activeId, setActiveId] = useState<string | null>(null);\n\n\tconst resourceFormatter = useResourceFormatter();\n\n\tconst sensors = useSensors(\n\t\tuseSensor(PointerSensor),\n\t\tuseSensor(KeyboardSensor, {\n\t\t\tcoordinateGetter: sortableKeyboardCoordinates,\n\t\t})\n\t);\n\treturn (\n\t\t<DndContext\n\t\t\tsensors={sensors}\n\t\t\tcollisionDetection={closestCenter}\n\t\t\tonDragStart={(event) => {\n\t\t\t\tconst { active } = event;\n\t\t\t\tsetActiveId(active.id.toString());\n\t\t\t}}\n\t\t\tonDragEnd={(event) => {\n\t\t\t\tconst { active, over } = event;\n\n\t\t\t\tif (over && active.id !== over.id) {\n\t\t\t\t\tconst columnOrder = tanTable.getState().columnOrder;\n\t\t\t\t\tconst oldIndex = columnOrder.indexOf(active.id.toString());\n\t\t\t\t\tconst newIndex = columnOrder.indexOf(over.id.toString());\n\t\t\t\t\ttanTable.setColumnOrder([...arrayMove(columnOrder, oldIndex, newIndex)]);\n\t\t\t\t}\n\n\t\t\t\tsetActiveId(null);\n\t\t\t}}\n\t\t>\n\t\t\t<SortableContext\n\t\t\t\titems={tanTable.getState().columnOrder}\n\t\t\t\tstrategy={verticalListSortingStrategy}\n\t\t\t>\n\t\t\t\t<EasyMenu label={<><Columns3 />Columns</>} selectionMode=\"multiple\" items={tanTable.getAllFlatColumns()} selectedKeys={tanTable.getIsAllColumnsVisible() ? 'all' : tanTable.getVisibleFlatColumns().map(c => c.id)}>\n\t\t\t\t\t<MenuItem onAction={() => tanTable.toggleAllColumnsVisible()} className={'italic'}>(select all)</MenuItem>\n\t\t\t\t\t{tanTable.getState().columnOrder.map(colId => {\n\t\t\t\t\t\tconst col = tanTable.getAllFlatColumns().find(c => c.id === colId);\n\t\t\t\t\t\tif (!col) return null;\n\t\t\t\t\t\treturn <SortableItem key={col.id} column={col} />\n\t\t\t\t\t})}\n\t\t\t\t</EasyMenu>\n\t\t\t\t<DragOverlay>\n\t\t\t\t\t{activeId ? <div className=\"opacity-70 border-2 border-primary\">{resourceFormatter(activeId)}</div> : null}\n\t\t\t\t</DragOverlay>\n\t\t\t</SortableContext>\n\t\t</DndContext>\n\t);\n\n\n\tfunction SortableItem({ column }: { column: Column<any, unknown> }) {\n\t\tconst {\n\t\t\tattributes,\n\t\t\tlisteners,\n\t\t\tsetNodeRef,\n\t\t\ttransform,\n\t\t\ttransition,\n\t\t} = useSortable({ id: column.id });\n\t\tconst style = {\n\t\t\ttransform: CSS.Transform.toString(transform),\n\t\t\ttransition,\n\t\t\tzIndex: '999'\n\t\t};\n\t\treturn <MenuItem\n\t\t\tref={setNodeRef}\n\t\t\tstyle={style}\n\t\t\t{...attributes}\n\t\t\tid={column.id}\n\t\t\tonAction={() => column.toggleVisibility()}\n\t\t\tisDisabled={!column.getCanHide()} className=\"flex items-center\">\n\t\t\t<GripVertical {...listeners} className=\"size-icon cursor-grab\" />\n\t\t\t{resourceFormatter(column.id)}\n\t\t\t{column.getIsSorted() && <SortIcon className=\"size-icon\" direction={column.getIsSorted()} />}\n\t\t</MenuItem>;\n\t}\n}\n\n\n\nimport {\n\tChevronFirst,\n\tChevronLast,\n\tChevronLeft,\n\tChevronRight,\n} from \"lucide-react\";\n\nfunction Paginator() {\n\tconst { tanTable, query } = useDataTable();\n\tconst rowCount = query.data?.total ?? 0\n\treturn (\n\t\t<div className=\"flex items-center gap-2\">\n\t\t\t<span className=\"whitespace-nowrap caption text-muted\">\n\t\t\t\t{`${tanTable.getState().pagination.pageIndex * tanTable.getState().pagination.pageSize + 1} - ${Math.min(\n\t\t\t\t\t(tanTable.getState().pagination.pageIndex + 1) *\n\t\t\t\t\ttanTable.getState().pagination.pageSize,\n\t\t\t\t\trowCount,\n\t\t\t\t)} of ${rowCount?.toLocaleString()}`}\n\t\t\t</span>\n\n\t\t\t<Button\n\t\t\t\tonPress={() => tanTable.firstPage()}\n\t\t\t\tisDisabled={!tanTable.getCanPreviousPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronFirst /></Button>\n\t\t\t<Button\n\t\t\t\tonPress={() => tanTable.previousPage()}\n\t\t\t\tisDisabled={!tanTable.getCanPreviousPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronLeft /></Button>\n\t\t\t<Button\n\t\t\t\tonPress={() => tanTable.nextPage()}\n\t\t\t\tisDisabled={!tanTable.getCanNextPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronRight /></Button>\n\t\t\t<Button\n\t\t\t\tonClick={() => tanTable.lastPage()}\n\t\t\t\tisDisabled={!tanTable.getCanNextPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronLast /></Button>\n\t\t</div>\n\t);\n}\n\n\nfunction PageSize() {\n\tconst { tanTable } = useDataTable();\n\tconst PAGE_SIZES = [10, 20, 30, 40, 50];\n\n\treturn (\n\t\t<EasyMenu label={tanTable.getState().pagination.pageSize.toString()} selectionMode=\"single\" selectedKeys={[tanTable.getState().pagination.pageSize.toString()]} items={PAGE_SIZES.map(s => ({ id: s.toString(), value: s }))}>\n\t\t\t{\n\t\t\t\t(items) => <MenuItem onAction={() => tanTable.setPageSize(items.value)}>{items.value}</MenuItem>\n\t\t\t}\n\t\t</EasyMenu>\n\t);\n}\n\n\nimport { RotateCw } from \"lucide-react\";\n\nfunction Actions({ tableActions }: { tableActions: TableActions }) {\n\tconst { query, tanTable, searchQuery, setSearchQuery } = useDataTable();\n\n\treturn (\n\t\t<section className=\"flex bg-card justify-between my-0 p-icon border gap-icon overflow-auto\">\n\t\t\t<div className=\"flex gap-icon\">\n\t\t\t\t<Button\n\t\t\t\t\tisPending={query.isFetching}\n\t\t\t\t\tonClick={() => query.refetch()}\n\t\t\t\t\tvariant={\"neutral\"}\n\t\t\t\t\tsize={\"icon\"}\n\t\t\t\t><RotateCw /></Button>\n\n\t\t\t\t{tableActions\n\t\t\t\t\t.filter(ta => ta.bulk === tanTable.getSelectedRowModel().rows.length > 0)\n\t\t\t\t\t.map((ta, i) => {\n\t\t\t\t\t\tconst Icon = ta.icon;\n\t\t\t\t\t\treturn (<Button key={`${i}-${ta.bulk}`} type=\"button\" isDisabled={query.isFetching} className=\"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform\" onPress={(e) => { ta.onClick(e, tanTable) }} size={'icon'}><Icon /></Button>)\n\t\t\t\t\t}\n\t\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<div className=\"flex gap-icon\">\n\t\t\t\t<DataTableFilter />\n\t\t\t\t{(\n\t\t\t\t\t<SearchField value={searchQuery} onChange={setSearchQuery} />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</section>\n\t);\n}\n\n\nimport { closestCenter, DndContext, DragOverlay, KeyboardSensor, PointerSensor, useSensor, useSensors } from \"@dnd-kit/core\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport {\n\tflexRender\n} from \"@tanstack/react-table\";\nimport { Button } from \"lib/components/button\";\nimport { type ApiFilters, type ApiSchema, TABLE_CHECK_BOX_COLUMN, TABLE_DEFAULT_DATE_COLUMNS, TABLE_ID_COLUMN, type TableActions, type TableFetchFn } from \"lib/components/data-table-commons\";\nimport { DataTableFilter, type FiltersConfig } from \"lib/components/data-table-filter\";\nimport { Loader } from \"lib/components/loader\";\nimport { EasyMenu, MenuItem } from \"lib/components/menu\";\nimport { SearchField } from \"lib/components/searchfield\";\nimport {\n\tTableBody,\n\tTableCell,\n\tTable as TableComponent,\n\tTableHead,\n\tTableHeader,\n\tTableRow,\n} from \"lib/components/table\";\nimport { classNames } from \"lib/utils/primitives\";\nimport { useResourceFormatter } from \"lib/utils/resource-names\";\nimport { merge } from \"lodash-es\";\n\nfunction SortIcon({ direction, ...props }: { direction: 'asc' | 'desc' | false } & Omit<React.ComponentProps<'svg'>, 'direction'>) {\n\tif (direction === 'asc') return <ArrowDownNarrowWide {...props} />\n\telse if (direction === 'desc') return <ArrowDownWideNarrow {...props} />\n\telse return <ArrowUpDown {...props} />\n}\n\n// TODO, automate checking valid HTML\nfunction TableContent({ className }: React.ComponentProps<typeof TableComponent>) {\n\tconst { tanTable } = useDataTable();\n\tconst tableCellStyle = (isSticky: boolean, className?: string) => classNames(\"animate-in fade-in slide-in-from-top-10\", \"px-icon py-2 text-left text-sm font-medium whitespace-nowrap\", isSticky && \"bg-card sticky right-0 z-50 text-center\", className)\n\treturn (\n\t\t<TableComponent className={classNames(className)}>\n\t\t\t<TableHeader className=\"sticky top-0 z-10\">\n\t\t\t\t{tanTable.getHeaderGroups().map((headerGroup) => (\n\t\t\t\t\t<TableRow className={classNames(\"h-input\")} key={headerGroup.id}>\n\t\t\t\t\t\t{headerGroup.headers.map((header) => (\n\t\t\t\t\t\t\t<TableHead\n\t\t\t\t\t\t\t\tkey={header.id}\n\t\t\t\t\t\t\t\tclassName={tableCellStyle(false, \"bg-card\")}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{!header.column.getCanSort() && !header.isPlaceholder\n\t\t\t\t\t\t\t\t\t&& <>{flexRender(\n\t\t\t\t\t\t\t\t\t\theader.column.columnDef.header,\n\t\t\t\t\t\t\t\t\t\theader.getContext(),\n\t\t\t\t\t\t\t\t\t)}</>}\n\t\t\t\t\t\t\t\t{/* TODO Align header text with table text */}\n\t\t\t\t\t\t\t\t{header.column.getCanSort() && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"w-full !justify-start !px-1.5\"\n\t\t\t\t\t\t\t\t\t\tonPress={header.column.getToggleSortingHandler()}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef.header,\n\t\t\t\t\t\t\t\t\t\t\theader.getContext(),\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<SortIcon direction={header.column.getIsSorted()} />\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</TableRow>\n\t\t\t\t))}\n\t\t\t</TableHeader>\n\t\t\t<TableBody className=\"flex-1 overflow-y-auto relative\">\n\t\t\t\t{tanTable.getRowModel().rows.map((row) => (\n\t\t\t\t\t<TableRow\n\t\t\t\t\t\tclassName={classNames(\"h-input transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20\")}\n\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\tdata-selected={row.getIsSelected()}\n\t\t\t\t\t>\n\t\t\t\t\t\t{row.getVisibleCells().map((cell) => (\n\t\t\t\t\t\t\t<TableCell\n\t\t\t\t\t\t\t\tkey={cell.id}\n\t\t\t\t\t\t\t\tclassName={tableCellStyle(cell.column.id === ACTIONS_COLUMN_ID)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\t\t\tcell.column.columnDef.cell,\n\t\t\t\t\t\t\t\t\tcell.getContext(),\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</TableRow>\n\t\t\t\t))}\n\t\t\t</TableBody>\n\t\t</TableComponent>\n\t);\n}\n","\"use client\"\nimport type { CalendarDateTime } from \"@internationalized/date\";\nimport { Button } from \"lib/components/button\";\nimport { useDataTable, type OperationKeys } from \"lib/components/data-table\";\nimport { type ApiFilters } from \"lib/components/data-table-commons\";\nimport { TfDatePicker } from \"lib/components/date-picker\";\nimport { TfIdSearchInput } from \"lib/components/id-search\";\nimport { EasyMenu, MenuItem } from \"lib/components/menu\";\nimport type { MultiSelectProps } from \"lib/components/multi-select\";\nimport { Popover, PopoverTrigger } from \"lib/components/popover\";\nimport { useAppForm } from \"lib/utils/form-hook\";\nimport { classNames } from \"lib/utils/primitives\";\nimport { useResourceFormatter } from \"lib/utils/resource-names\";\nimport { Filter, Trash } from \"lucide-react\";\nimport { useRef } from \"react\";\n\nexport const FILTER_COMPARISON_OPERATORS = [\n    'eq',\n    'ne',\n    'cn',\n    'nc',\n    'sw',\n    'ew',\n    'in',\n    'nin',\n    'gt',\n    'gte',\n    'lt',\n    'lte',\n] as const;\nexport type FilterComparisonOperator =\n    (typeof FILTER_COMPARISON_OPERATORS)[number];\n\nexport const COMPARISON_OPERATOR_LABELS: Record<\n    FilterComparisonOperator,\n    string\n> = {\n    eq: 'equal to',\n    ne: 'not equal to',\n    cn: 'contains',\n    nc: 'does not contain',\n    sw: 'starts with',\n    ew: 'ends with',\n    in: 'includes',\n    nin: 'does not include',\n    gt: 'greater than',\n    gte: 'greater than or equal to',\n    lt: 'less than',\n    lte: 'less than or equal to',\n};\n\ntype BaseLocalFilter<T extends FilterType, V> = {\n    id: string;\n    type: T;\n    property: string;\n    operator: FilterComparisonOperator;\n    value: V | undefined;\n    displayValue?: string;\n};\ntype EnumLocalFilter = BaseLocalFilter<'enum', Set<string | number>>;\ntype IdLocalFilter = BaseLocalFilter<'id', string>;\ntype BoolLocalFilter = BaseLocalFilter<'bool', boolean>;\ntype StringLocalFilter = BaseLocalFilter<'string', string>;\ntype DateLocalFilter = BaseLocalFilter<'date', CalendarDateTime>;\ntype IdSearchLocalFilter = BaseLocalFilter<'id-search', Set<string | number>>;\n\ntype LocalFilter = EnumLocalFilter\n    | IdLocalFilter\n    | BoolLocalFilter\n    | StringLocalFilter\n    | DateLocalFilter\n    | IdSearchLocalFilter;\n\nexport type FilterConfig =\n    | { type: 'enum'; options: MultiSelectProps['items'] }\n    | { type: 'id-search'; search: () => Promise<{ id: string; name: string }[]> }\n    | { type: 'id' }\n    | { type: 'bool' }\n    | { type: 'string' }\n    | { type: 'date' }\n\nexport type FilterType = FilterConfig['type'];\n\nconst FilterOperations: Record<FilterType, FilterComparisonOperator[]> = {\n    'bool': ['eq'],\n    'enum': ['in', 'nin'],\n    'id': ['in', 'nin'],\n    'id-search': ['in', 'nin'],\n    'string': ['eq', 'ne', 'cn', 'nc', 'sw', 'ew', 'in', 'nin'],\n    'date': ['lt', 'gt'],\n}\n\nexport type FiltersConfig<TOperation extends OperationKeys> = Required<Record<keyof ApiFilters<TOperation>, FilterConfig>>\n\nexport function DataTableFilter({ className, ...props }: React.ComponentProps<'section'>) {\n    const { filters, query, setFilters, filterConfig } = useDataTable();\n    // TODO @mudasirpandith add focus\n    // const localFilterRefs = useRef([]);\n    const addFilterButtonRef = useRef<HTMLButtonElement>(null);\n\n    const resourceFormatter = useResourceFormatter();\n\n    const DEFAULT_VALUES: { filters: LocalFilter[] } = {\n        // TODO, initialize with filters from tableState\n        filters: []\n    };\n    const form = useAppForm({\n        defaultValues: DEFAULT_VALUES,\n        onSubmit: ({ value }) => {\n            // TODO, instead of generic transformation, use type based tranform()\n            setFilters(value.filters.map(lf => { return { [lf.property]: { [lf.operator]: [lf.value] } } }))\n        }\n    })\n\n    // More reason to hate TS https://github.com/Microsoft/TypeScript/issues/12870\n    const filterKeys = Object.keys(filterConfig).sort();\n\n    return (\n        <section {...props} className={classNames(\"flex gap-icon items-center\", className)}>\n            <PopoverTrigger onOpenChange={(o) => {\n                // Set filters when the popover closes\n                if (!o) {\n                    form.handleSubmit();\n                } else {\n                    addFilterButtonRef.current?.focus();\n                }\n            }}>\n                <Button active={filters.length > 0} isDisabled={query.isPending || filterKeys.length === 0} type=\"button\" size={'icon'} variant={'neutral'}><Filter /></Button>\n                {/* TODO, icon maps with dynamic imports? */}\n                {/* TODO open popover with form for property specific filter */}\n                {/* TODO, icons here??? */}\n                <Popover className=\"w-full p-icon\">\n                    {/* const h3Styles = \"body mb-icon text-muted-foreground\"; */}\n                    {/* <h3 className={h3Styles}>{isFiltersActive ? \"Active filters\" : \"Add filters\"}</h3> */}\n                    <form onSubmit={(e) => { e.preventDefault(); }} className=\"flex flex-col gap-icon max-h-table overflow-auto \">\n                        <form.Field mode=\"array\" name={\"filters\"}>\n                            {\n                                (field) => {\n                                    return <>\n                                        {field.state.value.map((lf, i) => {\n                                            return (\n                                                <div key={lf.id} className=\"flex gap-icon items-center justify-normal\">\n                                                    <span className=\"text-sm\">{resourceFormatter(lf.property)}</span>\n                                                    <form.AppField\n                                                        key={lf.id}\n                                                        name={`filters[${i}].operator`}\n                                                    >\n                                                        {(sf) => (<sf.TfSingleSelect items={FilterOperations[lf.type].map(op => ({ id: op, label: <>{COMPARISON_OPERATOR_LABELS[op]}</> }))} />)}\n                                                    </form.AppField>\n\n                                                    {lf.type === 'bool' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfCheckbox />)}</form.AppField>}\n                                                    {lf.type === 'date' && <form.AppField name={`filters[${i}].value`}>{(_) => (<TfDatePicker />)}</form.AppField>}\n                                                    {lf.type === 'id' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfTextField />)}</form.AppField>}\n                                                    {lf.type === 'string' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfTextField />)}</form.AppField>}\n                                                    {/* TODO fix @mudasirpandith */}\n                                                    {/* @ts-ignore */}\n                                                    {lf.type === 'enum' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfMultiSelect items={filterConfig[lf.property].options} />)}</form.AppField>}\n                                                    {/* TODO fix @mudasirpandith */}\n                                                    {/* @ts-ignore */}\n                                                    {lf.type === 'id-search' && <form.AppField name={`filters[${i}].value`}>{(_) => (<TfIdSearchInput multiple accessor=\"id\" searchFn={filterConfig[lf.property].search} />)}</form.AppField>}\n\n                                                    <Button type=\"button\" variant=\"destructive\" size=\"icon\" onPress={() => field.removeValue(i)}><Trash /></Button>\n                                                </div>\n                                            )\n                                        })}\n                                        <div className=\"flex w-full items-center justify-end gap-2 not-first:mt-icon\">\n                                            <EasyMenu label=\"Add Filter\">\n                                                {filterKeys.map(k => <MenuItem key={k} onAction={() => {\n                                                    // TODO @mudasirpandith\n                                                    //@ts-ignore\n                                                    const type = filterConfig[k].type as FilterType;\n\n                                                    const defaultValue = (t: FilterType) => {\n                                                        // TODO, ensure exhaustive???\n                                                        // @mudasirpandith\n                                                        switch (t) {\n                                                            case 'bool':\n                                                                return true;\n                                                            case 'string':\n                                                                return '';\n                                                            case 'date':\n                                                                return new Date().toISOString();\n                                                            case 'id':\n                                                                return '';\n                                                            case 'id-search':\n                                                                return [] as string[];\n                                                            case 'enum':\n                                                                return [] as string[];\n                                                        }\n                                                    }\n\n                                                    const newFilter: LocalFilter = {\n                                                        id: `${k}-${Date.now()}`,\n                                                        operator: FilterOperations[type][0],\n                                                        //@ts-ignore\n                                                        value: defaultValue(type),\n                                                        type: type,\n                                                        property: k,\n                                                    };\n\n                                                    field.pushValue(newFilter);\n                                                    // TODO Focus to ref\n\n                                                }}>{resourceFormatter(k)}</MenuItem>)}\n                                            </EasyMenu>\n                                            {field.state.value.length > 0 ? (\n                                                <Button\n                                                    type=\"button\"\n                                                    variant=\"neutral\"\n                                                    onPress={() => { field.setValue([]) }}\n                                                >\n                                                    Reset filters\n                                                </Button>\n                                            ) : null}\n                                        </div>\n                                    </>\n                                }\n                            }\n                        </form.Field >\n                    </form>\n                </Popover>\n            </PopoverTrigger>\n        </section>\n    );\n};"],"names":["ACTIONS_COLUMN_ID","useDataTableState","columns","fetchFn","columnsToHideByDefault","allowSelection","filterConfig","id","useId","tableState","_setTableState","useState","rowSelection","setRowSelection","searchQuery","setSearchQuery","columnOrder","setColumnOrder","columnVisibility","setColumnVisibility","filters","setFilters","mergedFilters","useMemo","acc","current","merge","updateTableState","updates","prev","sorting","pagination","query","useQuery","keepPreviousData","useEffect","columnHelper","createColumnHelper","metadataColumns","data","rowHasMetadata","row","rowsWithMeta","r","m","key","info","value","cols","TABLE_CHECK_BOX_COLUMN","TABLE_ID_COLUMN","col","TABLE_DEFAULT_DATE_COLUMNS","isUpdaterFunction","updater","resolveUpdater","currentValue","tanTable","useReactTable","getCoreRowModel","c","DataTableContext","createContext","useDataTable","ctx","useContext","DataTableProvider","children","props","DataTable","tableActions","className","jsx","Fragment","classNames","Actions","jsxs","TableOverlay","Loader","Info","TableContent","ColumnPicker","PageSize","Paginator","activeId","setActiveId","resourceFormatter","useResourceFormatter","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","closestCenter","event","active","over","oldIndex","newIndex","arrayMove","SortableContext","verticalListSortingStrategy","EasyMenu","Columns3","MenuItem","colId","SortableItem","DragOverlay","column","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","GripVertical","SortIcon","rowCount","Button","ChevronFirst","ChevronLeft","ChevronRight","ChevronLast","PAGE_SIZES","s","items","RotateCw","ta","i","Icon","e","DataTableFilter","SearchField","direction","ArrowDownNarrowWide","ArrowDownWideNarrow","ArrowUpDown","tableCellStyle","isSticky","TableComponent","TableHeader","headerGroup","TableRow","header","TableHead","flexRender","TableBody","cell","TableCell","FILTER_COMPARISON_OPERATORS","COMPARISON_OPERATOR_LABELS","FilterOperations","addFilterButtonRef","useRef","form","useAppForm","lf","filterKeys","PopoverTrigger","o","Filter","Popover","field","sf","op","_","TfDatePicker","TfIdSearchInput","Trash","k","type","defaultValue","t","newFilter"],"mappings":"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"}
+{"version":3,"file":"data-table.js","sources":["../../lib/components/data-table.tsx","../../lib/components/data-table-filter.tsx"],"sourcesContent":["\"use client\";\nimport type { components, operations } from \"@cryptlex/web-api-types\";\nimport { keepPreviousData, useQuery } from \"@tanstack/react-query\";\nimport {\n\ttype AccessorFnColumnDef,\n\ttype Column,\n\ttype ColumnDef,\n\ttype ColumnOrderState,\n\tcreateColumnHelper,\n\tgetCoreRowModel,\n\ttype RowSelectionState,\n\ttype TableState,\n\ttype Updater,\n\tuseReactTable,\n\ttype VisibilityState\n} from \"@tanstack/react-table\";\nimport { ArrowDownNarrowWide, ArrowDownWideNarrow, ArrowUpDown, Columns3, GripVertical, Info } from \"lucide-react\";\nimport { createContext, useContext, useEffect, useId, useMemo, useState } from \"react\";\n\n/** Reserved name for actions column */\nexport const ACTIONS_COLUMN_ID = \"tableActions\";\nexport type Schemas = ApiSchema<keyof components['schemas']>;\nexport type OperationKeys = keyof operations;\ntype DataTableFactory<TData extends Schemas> = {\n\tfetchFn: TableFetchFn<TData, OperationKeys>;\n\tcolumns: ColumnDef<TData, any>[]\n\tallowSelection?: boolean;\n\tcolumnsToHideByDefault?: VisibilityState; // Columns that are hidden by default\n\tfilterConfig: FiltersConfig<OperationKeys>\n}\n\n\ntype DataTableState = Pick<TableState, 'sorting' | 'pagination'> & {};\n/**\n * Hook for handling all data-table state. Used in DataTableContext\n */\nexport function useDataTableState<TData extends Schemas>({ columns, fetchFn, columnsToHideByDefault = {}, allowSelection = false, filterConfig }: DataTableFactory<TData>) {\n\tconst id = useId();\n\n\tconst [tableState, _setTableState] = useState<DataTableState>({\n\t\t/** TODO Reflect in URL  */\n\t\tpagination: { pageIndex: 0, pageSize: 20 }, // Pagination state\n\t\tsorting: [], // Sorting state\n\t});\n\n\tconst [rowSelection, setRowSelection] = useState<RowSelectionState>({})\n\n\t/** TODO Reflect in URL  */\n\tconst [searchQuery, setSearchQuery] = useState('');\n\n\t/** TODO Store on browser as preference */\n\tconst [columnOrder, setColumnOrder] = useState<ColumnOrderState>([])\n\t// TODO Store on browser\n\tconst [columnVisibility, setColumnVisibility] = useState<VisibilityState>({\n\t\tid: false,\n\t\tupdatedAt: false,\n\t\t...columnsToHideByDefault,\n\t});\n\n\tconst [filters, setFilters] = useState<ApiFilters<OperationKeys>[]>([]);\n\n\tconst mergedFilters = useMemo(() => {\n\t\treturn filters.reduce((acc, current) => {\n\t\t\treturn merge(acc, current);\n\t\t}, {});\n\t}, [filters])\n\n\t// Update table state with new values\n\tconst updateTableState = (updates: Partial<DataTableState>) => {\n\t\t_setTableState((prev) => ({ ...prev, ...updates }));\n\t};\n\n\tconst {\n\t\tsorting,\n\t\tpagination,\n\t} = tableState;\n\n\tconst query = useQuery({\n\t\tqueryKey: [id, pagination, sorting, searchQuery],\n\t\tqueryFn: () => fetchFn(pagination, sorting, searchQuery, mergedFilters),\n\t\tplaceholderData: keepPreviousData, // Keep previous data while loading new data\n\t\tretry: 0,\n\t\trefetchOnWindowFocus: false,\n\t});\n\n\tuseEffect(() => {\n\t\t// TODO, store in localStorage\n\t}, [columnVisibility])\n\n\tconst columnHelper = useMemo(() => createColumnHelper<TData>(), []);\n\n\tconst metadataColumns = useMemo<AccessorFnColumnDef<TData, string>[]>(() => {\n\t\tconst data = query.data?.data;\n\t\tif (!data?.length) return [];\n\n\t\ttype WithMeta = TData & { metadata: ApiSchema<'MetadataDto'>[] };\n\t\tconst rowHasMetadata = (row: TData): row is WithMeta => row != null &&\n\t\t\ttypeof row === 'object' &&\n\t\t\t'metadata' in row &&\n\t\t\tArray.isArray((row).metadata);\n\n\t\tconst rowsWithMeta = data.filter(\n\t\t\trowHasMetadata\n\t\t);\n\t\tif (rowsWithMeta.length === 0) return [];\n\t\tconst keys: string[] = Array.from(new Set(rowsWithMeta.flatMap(r => r.metadata?.map(m => m.key) ?? [])));\n\n\t\treturn keys.map(key =>\n\t\t\tcolumnHelper.accessor(\n\t\t\t\t(row) => {\n\t\t\t\t\tif (rowHasMetadata(row)) {\n\t\t\t\t\t\treturn row?.metadata?.find(m => m.key === key)?.value ?? '';\n\t\t\t\t\t}\n\t\t\t\t\treturn '';\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tid: key,\n\t\t\t\t\theader: key, // tooltip header\n\t\t\t\t\tenableSorting: false,\n\t\t\t\t\tcell: (info) => {\n\t\t\t\t\t\tconst value = info.getValue();\n\t\t\t\t\t\t// Handle null/undefined values\n\t\t\t\t\t\tif (value === null || value === undefined) return \"\";\n\t\t\t\t\t\t// For primitive types, return the string representation\n\t\t\t\t\t\treturn String(value);\n\t\t\t\t\t},\n\t\t\t\t}\n\t\t\t));\n\t}, [query.data?.data]);\n\n\t/**\n\t * ID,createdAt and updatedAt will be added by default for all tables\n\t * If selection is allowed, checkbox will be added\n\t * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n\t * If there are actions for the table, they will be placed fixed at the right side of table.\n\t */\n\tconst cols: ColumnDef<any, any>[] = [\n\t\t...(allowSelection ? TABLE_CHECK_BOX_COLUMN : []),\n\t\t...TABLE_ID_COLUMN,\n\t\t...columns.filter((col) => col.id !== ACTIONS_COLUMN_ID),\n\t\t...(metadataColumns.length ? metadataColumns : []),\n\t\t...TABLE_DEFAULT_DATE_COLUMNS,\n\t\t// Actions column\n\t\t...columns.filter((col) => col.id === ACTIONS_COLUMN_ID),\n\t];\n\n\t// Type-guard for updater\n\tfunction isUpdaterFunction<T>(updater: Updater<T>): updater is (old: T) => T {\n\t\treturn typeof updater === \"function\";\n\t}\n\t// Utility function to resolve updater\n\tfunction resolveUpdater<T>(updater: Updater<T>, currentValue: T) {\n\t\tif (isUpdaterFunction(updater)) {\n\t\t\treturn updater(currentValue);\n\t\t}\n\t\treturn updater;\n\t}\n\n\t// Use react-table's hook to create the table instance\n\tconst tanTable = useReactTable({\n\t\tdata: query.data?.data ?? [],\n\t\tcolumns: cols,\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\trowCount: query.data?.total,\n\t\tmanualPagination: true, // Handle pagination manually since pagination is done server side for data tables\n\t\tonPaginationChange: (updater) => {\n\t\t\tupdateTableState({ pagination: resolveUpdater(updater, pagination) });\n\t\t},\n\t\tmanualSorting: true, // Handle sorting manually since sorting is done server side for data tables\n\t\tonSortingChange: (updater) => {\n\t\t\tsetRowSelection({});\n\t\t\tupdateTableState({ sorting: [...resolveUpdater(updater, sorting)] }); // Reset selection when sorting.\n\t\t},\n\t\tmanualFiltering: true, // Handle filtering manually since filtering is done server side for data tables\n\t\tonColumnVisibilityChange: (updater) => {\n\t\t\tsetColumnVisibility(resolveUpdater(updater, columnVisibility));\n\t\t},\n\t\tonRowSelectionChange: (updater) => {\n\t\t\tsetRowSelection(resolveUpdater(updater, rowSelection));\n\t\t},\n\t\tonColumnOrderChange: (updater) => {\n\t\t\tsetColumnOrder(resolveUpdater(updater, columnOrder));\n\t\t},\n\t\tstate: {\n\t\t\tsorting: sorting,\n\t\t\tcolumnVisibility: columnVisibility,\n\t\t\tpagination: pagination,\n\t\t\trowSelection: rowSelection,\n\t\t\tcolumnOrder: columnOrder\n\t\t},\n\t\tmeta: {\n\t\t\trefetch: query.refetch,\n\t\t},\n\t});\n\n\t// By default, ColumnDef does not give guarantees of column.id existing. Once useReactTable is called, all columns are assigned IDs.\n\t// This populates the columnIds in the columnOrder state\n\t// TODO, add localStorage access layer for this. \n\tuseEffect(() => {\n\t\tsetColumnOrder([...tanTable.getAllLeafColumns().map(c => c.id)]);\n\t}, [])\n\n\treturn { tableState, updateTableState, query, setSearchQuery, searchQuery, tanTable, mergedFilters, filters, setFilters, filterConfig }\n}\n\nexport const DataTableContext = createContext<ReturnType<typeof useDataTableState> | null>(null);\n\nexport const useDataTable = () => {\n\tconst ctx = useContext(DataTableContext);\n\tif (!ctx) {\n\t\tthrow Error(\"DataTable should be used within DataTableProvider.\")\n\t}\n\treturn ctx;\n}\n\nexport function DataTableProvider({ children, ...props }: { children: React.ReactNode; } & ReturnType<typeof useDataTableState>) {\n\treturn (\n\t\t<DataTableContext.Provider value={props}>\n\t\t\t{children}\n\t\t</DataTableContext.Provider>\n\t)\n}\n\n\nexport type DataTableProps = React.ComponentProps<'section'> & {\n\ttableActions: TableActions;\n\n\t// filterConfig: {\n\t// \tfilters: Record<keyof ApiFilters<TOperation>, 'date' | 'string' | 'known-string' | 'number'>,\n\t// }\n}\nexport function DataTable({\n\ttableActions,\n\tclassName,\n\t...props\n\t// filterableFields,\n}: DataTableProps) {\n\t// State for managing table data and filters\n\tconst { query, tanTable } = useDataTable();\n\n\treturn (\n\t\t<>\n\t\t\t{/* Table Actions Section */}\n\t\t\t<section {...props} className={classNames(\"flex flex-col bg-card\", className)}>\n\t\t\t\t<Actions tableActions={tableActions} />\n\t\t\t\t{/* The div here is necessary because TableContent is internally a <table> tag and does not respect width, height CSS */}\n\t\t\t\t<div className=\"w-full overflow-auto border-x grow min-h-table relative\" tabIndex={0}>\n\t\t\t\t\t{/* Table overlay with loader */}\n\t\t\t\t\t{query.isLoading && (\n\t\t\t\t\t\t<TableOverlay className=\"cursor-wait\">\n\t\t\t\t\t\t\t<Loader />\n\t\t\t\t\t\t</TableOverlay>\n\t\t\t\t\t)}\n\t\t\t\t\t{/* Table overlay for empty table */}\n\t\t\t\t\t{!query.isLoading && tanTable.getRowModel().rows.length === 0 && (\n\t\t\t\t\t\t// Empty table\n\t\t\t\t\t\t<TableOverlay className=\"cursor-not-allowed\">\n\t\t\t\t\t\t\t{!query.isFetching &&\n\t\t\t\t\t\t\t\t(query.isError ? (\n\t\t\t\t\t\t\t\t\t<span className=\"flex gap-3 justify-center items-center\">\n\t\t\t\t\t\t\t\t\t\t{/* TODO (mudasir-pandith) Check for 403 explicitly!! */}\n\t\t\t\t\t\t\t\t\t\t{/* <span>{query.error}</span> */}\n\t\t\t\t\t\t\t\t\t\t<Info />\n\t\t\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t\t\tYou don't have the required permissions. Please contact your\n\t\t\t\t\t\t\t\t\t\t\tadmin.\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t) : !query.data?.data ? (\n\t\t\t\t\t\t\t\t\t<>No results found.</>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<>Unknown error. Please contact customer support.</>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</TableOverlay>\n\t\t\t\t\t)}\n\t\t\t\t\t{!query.isLoading && tanTable.getRowModel().rows.length !== 0 &&\n\t\t\t\t\t\t<TableContent className=\"size-full\" />}\n\t\t\t\t</div>\n\n\t\t\t\t{/* Table Footer Section with Pagination and Column Picker */}\n\t\t\t\t<div className=\"flex w-full justify-between border gap-icon p-icon overflow-x-auto\">\n\t\t\t\t\t<div className=\"flex gap-icon\">\n\t\t\t\t\t\t<ColumnPicker />\n\t\t\t\t\t\t<PageSize />\n\t\t\t\t\t</div>\n\t\t\t\t\t<Paginator />\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t</>\n\t);\n}\n/** Table overlay to be shown for loaders or other messages */\nfunction TableOverlay({\n\tchildren,\n\tclassName,\n}: { children: React.ReactNode; className?: string }) {\n\treturn (\n\t\t<>\n\t\t\t<span\n\t\t\t\tclassName={classNames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t\"absolute top-0 bg-card z-20 size-full text-sm flex items-center justify-center\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t\t{/* Keep something in document flow with the correct height */}\n\t\t\t<span className=\"relative h-full w-0 block\" />\n\t\t</>\n\t);\n}\n\nimport {\n\tarrayMove,\n\tSortableContext,\n\tsortableKeyboardCoordinates,\n\tuseSortable,\n\tverticalListSortingStrategy\n} from '@dnd-kit/sortable';\n\nfunction ColumnPicker() {\n\tconst { tanTable } = useDataTable();\n\tconst [activeId, setActiveId] = useState<string | null>(null);\n\n\tconst resourceFormatter = useResourceFormatter();\n\n\tconst sensors = useSensors(\n\t\tuseSensor(PointerSensor),\n\t\tuseSensor(KeyboardSensor, {\n\t\t\tcoordinateGetter: sortableKeyboardCoordinates,\n\t\t})\n\t);\n\treturn (\n\t\t<DndContext\n\t\t\tsensors={sensors}\n\t\t\tcollisionDetection={closestCenter}\n\t\t\tonDragStart={(event) => {\n\t\t\t\tconst { active } = event;\n\t\t\t\tsetActiveId(active.id.toString());\n\t\t\t}}\n\t\t\tonDragEnd={(event) => {\n\t\t\t\tconst { active, over } = event;\n\n\t\t\t\tif (over && active.id !== over.id) {\n\t\t\t\t\tconst columnOrder = tanTable.getState().columnOrder;\n\t\t\t\t\tconst oldIndex = columnOrder.indexOf(active.id.toString());\n\t\t\t\t\tconst newIndex = columnOrder.indexOf(over.id.toString());\n\t\t\t\t\ttanTable.setColumnOrder([...arrayMove(columnOrder, oldIndex, newIndex)]);\n\t\t\t\t}\n\n\t\t\t\tsetActiveId(null);\n\t\t\t}}\n\t\t>\n\t\t\t<SortableContext\n\t\t\t\titems={tanTable.getState().columnOrder}\n\t\t\t\tstrategy={verticalListSortingStrategy}\n\t\t\t>\n\t\t\t\t<EasyMenu label={<><Columns3 />Columns</>} selectionMode=\"multiple\" items={tanTable.getAllFlatColumns()} selectedKeys={tanTable.getIsAllColumnsVisible() ? 'all' : tanTable.getVisibleFlatColumns().map(c => c.id)}>\n\t\t\t\t\t<MenuItem onAction={() => tanTable.toggleAllColumnsVisible()} className={'italic'}>(select all)</MenuItem>\n\t\t\t\t\t{tanTable.getState().columnOrder.map(colId => {\n\t\t\t\t\t\tconst col = tanTable.getAllFlatColumns().find(c => c.id === colId);\n\t\t\t\t\t\tif (!col) return null;\n\t\t\t\t\t\treturn <SortableItem key={col.id} column={col} />\n\t\t\t\t\t})}\n\t\t\t\t</EasyMenu>\n\t\t\t\t<DragOverlay>\n\t\t\t\t\t{activeId ? <div className=\"opacity-70 border-2 border-primary\">{resourceFormatter(activeId)}</div> : null}\n\t\t\t\t</DragOverlay>\n\t\t\t</SortableContext>\n\t\t</DndContext>\n\t);\n\n\n\tfunction SortableItem({ column }: { column: Column<any, unknown> }) {\n\t\tconst {\n\t\t\tattributes,\n\t\t\tlisteners,\n\t\t\tsetNodeRef,\n\t\t\ttransform,\n\t\t\ttransition,\n\t\t} = useSortable({ id: column.id });\n\t\tconst style = {\n\t\t\ttransform: CSS.Transform.toString(transform),\n\t\t\ttransition,\n\t\t\tzIndex: '999'\n\t\t};\n\t\treturn <MenuItem\n\t\t\tref={setNodeRef}\n\t\t\tstyle={style}\n\t\t\t{...attributes}\n\t\t\tid={column.id}\n\t\t\tonAction={() => column.toggleVisibility()}\n\t\t\tisDisabled={!column.getCanHide()} className=\"flex items-center\">\n\t\t\t<GripVertical {...listeners} className=\"size-icon cursor-grab\" />\n\t\t\t{resourceFormatter(column.id)}\n\t\t\t{column.getIsSorted() && <SortIcon className=\"size-icon\" direction={column.getIsSorted()} />}\n\t\t</MenuItem>;\n\t}\n}\n\n\n\nimport {\n\tChevronFirst,\n\tChevronLast,\n\tChevronLeft,\n\tChevronRight,\n} from \"lucide-react\";\n\nfunction Paginator() {\n\tconst { tanTable, query } = useDataTable();\n\tconst rowCount = query.data?.total ?? 0\n\treturn (\n\t\t<div className=\"flex items-center gap-2\">\n\t\t\t<span className=\"whitespace-nowrap caption text-muted\">\n\t\t\t\t{`${tanTable.getState().pagination.pageIndex * tanTable.getState().pagination.pageSize + 1} - ${Math.min(\n\t\t\t\t\t(tanTable.getState().pagination.pageIndex + 1) *\n\t\t\t\t\ttanTable.getState().pagination.pageSize,\n\t\t\t\t\trowCount,\n\t\t\t\t)} of ${rowCount?.toLocaleString()}`}\n\t\t\t</span>\n\n\t\t\t<Button\n\t\t\t\tonPress={() => tanTable.firstPage()}\n\t\t\t\tisDisabled={!tanTable.getCanPreviousPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronFirst /></Button>\n\t\t\t<Button\n\t\t\t\tonPress={() => tanTable.previousPage()}\n\t\t\t\tisDisabled={!tanTable.getCanPreviousPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronLeft /></Button>\n\t\t\t<Button\n\t\t\t\tonPress={() => tanTable.nextPage()}\n\t\t\t\tisDisabled={!tanTable.getCanNextPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronRight /></Button>\n\t\t\t<Button\n\t\t\t\tonClick={() => tanTable.lastPage()}\n\t\t\t\tisDisabled={!tanTable.getCanNextPage()}\n\t\t\t\tvariant=\"neutral\"\n\t\t\t\tsize={\"icon\"}\n\t\t\t><ChevronLast /></Button>\n\t\t</div>\n\t);\n}\n\n\nfunction PageSize() {\n\tconst { tanTable } = useDataTable();\n\tconst PAGE_SIZES = [10, 20, 30, 40, 50];\n\n\treturn (\n\t\t<EasyMenu label={tanTable.getState().pagination.pageSize.toString()} selectionMode=\"single\" selectedKeys={[tanTable.getState().pagination.pageSize.toString()]} items={PAGE_SIZES.map(s => ({ id: s.toString(), value: s }))}>\n\t\t\t{\n\t\t\t\t(items) => <MenuItem onAction={() => tanTable.setPageSize(items.value)}>{items.value}</MenuItem>\n\t\t\t}\n\t\t</EasyMenu>\n\t);\n}\n\n\nimport { RotateCw } from \"lucide-react\";\n\nfunction Actions({ tableActions }: { tableActions: TableActions }) {\n\tconst { query, tanTable, searchQuery, setSearchQuery } = useDataTable();\n\n\treturn (\n\t\t<section className=\"flex bg-card justify-between my-0 p-icon border gap-icon overflow-auto\">\n\t\t\t<div className=\"flex gap-icon\">\n\t\t\t\t<Button\n\t\t\t\t\tisPending={query.isFetching}\n\t\t\t\t\tonClick={() => query.refetch()}\n\t\t\t\t\tvariant={\"neutral\"}\n\t\t\t\t\tsize={\"icon\"}\n\t\t\t\t><RotateCw /></Button>\n\n\t\t\t\t{tableActions\n\t\t\t\t\t.filter(ta => ta.bulk === tanTable.getSelectedRowModel().rows.length > 0)\n\t\t\t\t\t.map((ta, i) => {\n\t\t\t\t\t\tconst Icon = ta.icon;\n\t\t\t\t\t\treturn (<Button key={`${i}-${ta.bulk}`} type=\"button\" isDisabled={query.isFetching} className=\"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform\" onPress={(e) => { ta.onClick(e, tanTable) }} size={'icon'}><Icon /></Button>)\n\t\t\t\t\t}\n\t\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<div className=\"flex gap-icon\">\n\t\t\t\t<DataTableFilter />\n\t\t\t\t{(\n\t\t\t\t\t<SearchField value={searchQuery} onChange={setSearchQuery} />\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</section>\n\t);\n}\n\n\nimport { closestCenter, DndContext, DragOverlay, KeyboardSensor, PointerSensor, useSensor, useSensors } from \"@dnd-kit/core\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport {\n\tflexRender\n} from \"@tanstack/react-table\";\nimport { Button } from \"lib/components/button\";\nimport { type ApiFilters, type ApiSchema, TABLE_CHECK_BOX_COLUMN, TABLE_DEFAULT_DATE_COLUMNS, TABLE_ID_COLUMN, type TableActions, type TableFetchFn } from \"lib/components/data-table-commons\";\nimport { DataTableFilter, type FiltersConfig } from \"lib/components/data-table-filter\";\nimport { Loader } from \"lib/components/loader\";\nimport { EasyMenu, MenuItem } from \"lib/components/menu\";\nimport { SearchField } from \"lib/components/searchfield\";\nimport {\n\tTableBody,\n\tTableCell,\n\tTable as TableComponent,\n\tTableHead,\n\tTableHeader,\n\tTableRow,\n} from \"lib/components/table\";\nimport { classNames } from \"lib/utils/primitives\";\nimport { useResourceFormatter } from \"lib/utils/resource-names\";\nimport { merge } from \"lodash-es\";\n\nfunction SortIcon({ direction, ...props }: { direction: 'asc' | 'desc' | false } & Omit<React.ComponentProps<'svg'>, 'direction'>) {\n\tif (direction === 'asc') return <ArrowDownNarrowWide {...props} />\n\telse if (direction === 'desc') return <ArrowDownWideNarrow {...props} />\n\telse return <ArrowUpDown {...props} />\n}\n\n// TODO, automate checking valid HTML\nfunction TableContent({ className }: React.ComponentProps<typeof TableComponent>) {\n\tconst { tanTable } = useDataTable();\n\tconst tableCellStyle = (isSticky: boolean, className?: string) => classNames(\"animate-in fade-in slide-in-from-top-10\", \"px-icon py-2 text-left text-sm font-medium whitespace-nowrap\", isSticky && \"bg-card sticky right-0 z-50 text-center\", className)\n\treturn (\n\t\t<TableComponent className={classNames(className)}>\n\t\t\t<TableHeader className=\"sticky top-0 z-10\">\n\t\t\t\t{tanTable.getHeaderGroups().map((headerGroup) => (\n\t\t\t\t\t<TableRow className={classNames(\"h-input\")} key={headerGroup.id}>\n\t\t\t\t\t\t{headerGroup.headers.map((header) => (\n\t\t\t\t\t\t\t<TableHead\n\t\t\t\t\t\t\t\tkey={header.id}\n\t\t\t\t\t\t\t\tclassName={tableCellStyle(false, \"bg-card\")}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{!header.column.getCanSort() && !header.isPlaceholder\n\t\t\t\t\t\t\t\t\t&& <>{flexRender(\n\t\t\t\t\t\t\t\t\t\theader.column.columnDef.header,\n\t\t\t\t\t\t\t\t\t\theader.getContext(),\n\t\t\t\t\t\t\t\t\t)}</>}\n\t\t\t\t\t\t\t\t{/* TODO Align header text with table text */}\n\t\t\t\t\t\t\t\t{header.column.getCanSort() && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"w-full !justify-start !px-1.5\"\n\t\t\t\t\t\t\t\t\t\tonPress={header.column.getToggleSortingHandler()}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef.header,\n\t\t\t\t\t\t\t\t\t\t\theader.getContext(),\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<SortIcon direction={header.column.getIsSorted()} />\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</TableRow>\n\t\t\t\t))}\n\t\t\t</TableHeader>\n\t\t\t<TableBody className=\"flex-1 overflow-y-auto relative\">\n\t\t\t\t{tanTable.getRowModel().rows.map((row) => (\n\t\t\t\t\t<TableRow\n\t\t\t\t\t\tclassName={classNames(\"h-input transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20\")}\n\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\tdata-selected={row.getIsSelected()}\n\t\t\t\t\t>\n\t\t\t\t\t\t{row.getVisibleCells().map((cell) => (\n\t\t\t\t\t\t\t<TableCell\n\t\t\t\t\t\t\t\tkey={cell.id}\n\t\t\t\t\t\t\t\tclassName={tableCellStyle(cell.column.id === ACTIONS_COLUMN_ID)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{flexRender(\n\t\t\t\t\t\t\t\t\tcell.column.columnDef.cell,\n\t\t\t\t\t\t\t\t\tcell.getContext(),\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</TableRow>\n\t\t\t\t))}\n\t\t\t</TableBody>\n\t\t</TableComponent>\n\t);\n}\n","\"use client\"\nimport type { CalendarDateTime } from \"@internationalized/date\";\nimport { Button } from \"lib/components/button\";\nimport { useDataTable, type OperationKeys } from \"lib/components/data-table\";\nimport { type ApiFilters } from \"lib/components/data-table-commons\";\nimport { TfDatePicker } from \"lib/components/date-picker\";\nimport { TfIdSearchInput } from \"lib/components/id-search\";\nimport { EasyMenu, MenuItem } from \"lib/components/menu\";\nimport type { MultiSelectProps } from \"lib/components/multi-select\";\nimport { Popover, PopoverTrigger } from \"lib/components/popover\";\nimport { useAppForm } from \"lib/utils/form-hook\";\nimport { classNames } from \"lib/utils/primitives\";\nimport { useResourceFormatter } from \"lib/utils/resource-names\";\nimport { Filter, Trash } from \"lucide-react\";\nimport { useRef } from \"react\";\n\nexport const FILTER_COMPARISON_OPERATORS = [\n    'eq',\n    'ne',\n    'cn',\n    'nc',\n    'sw',\n    'ew',\n    'in',\n    'nin',\n    'gt',\n    'gte',\n    'lt',\n    'lte',\n] as const;\nexport type FilterComparisonOperator =\n    (typeof FILTER_COMPARISON_OPERATORS)[number];\n\nexport const COMPARISON_OPERATOR_LABELS: Record<\n    FilterComparisonOperator,\n    string\n> = {\n    eq: 'equal to',\n    ne: 'not equal to',\n    cn: 'contains',\n    nc: 'does not contain',\n    sw: 'starts with',\n    ew: 'ends with',\n    in: 'includes',\n    nin: 'does not include',\n    gt: 'greater than',\n    gte: 'greater than or equal to',\n    lt: 'less than',\n    lte: 'less than or equal to',\n};\n\ntype BaseLocalFilter<T extends FilterType, V> = {\n    id: string;\n    type: T;\n    property: string;\n    operator: FilterComparisonOperator;\n    value: V | undefined;\n    displayValue?: string;\n};\ntype EnumLocalFilter = BaseLocalFilter<'enum', Set<string | number>>;\ntype IdLocalFilter = BaseLocalFilter<'id', string>;\ntype BoolLocalFilter = BaseLocalFilter<'bool', boolean>;\ntype StringLocalFilter = BaseLocalFilter<'string', string>;\ntype DateLocalFilter = BaseLocalFilter<'date', CalendarDateTime>;\ntype IdSearchLocalFilter = BaseLocalFilter<'id-search', Set<string | number>>;\n\ntype LocalFilter = EnumLocalFilter\n    | IdLocalFilter\n    | BoolLocalFilter\n    | StringLocalFilter\n    | DateLocalFilter\n    | IdSearchLocalFilter;\n\nexport type FilterConfig =\n    | { type: 'enum'; options: MultiSelectProps['items'] }\n    | { type: 'id-search'; search: () => Promise<{ id: string; name: string }[]> }\n    | { type: 'id' }\n    | { type: 'bool' }\n    | { type: 'string' }\n    | { type: 'date' }\n\nexport type FilterType = FilterConfig['type'];\n\nconst FilterOperations: Record<FilterType, FilterComparisonOperator[]> = {\n    'bool': ['eq'],\n    'enum': ['in', 'nin'],\n    'id': ['in', 'nin'],\n    'id-search': ['in', 'nin'],\n    'string': ['eq', 'ne', 'cn', 'nc', 'sw', 'ew', 'in', 'nin'],\n    'date': ['lt', 'gt'],\n}\n\nexport type FiltersConfig<TOperation extends OperationKeys> = Required<Record<keyof ApiFilters<TOperation>, FilterConfig>>\n\nexport function DataTableFilter({ className, ...props }: React.ComponentProps<'section'>) {\n    const { filters, query, setFilters, filterConfig } = useDataTable();\n    // TODO @mudasirpandith add focus\n    // const localFilterRefs = useRef([]);\n    const addFilterButtonRef = useRef<HTMLButtonElement>(null);\n\n    const resourceFormatter = useResourceFormatter();\n\n    const DEFAULT_VALUES: { filters: LocalFilter[] } = {\n        // TODO, initialize with filters from tableState\n        filters: []\n    };\n    const form = useAppForm({\n        defaultValues: DEFAULT_VALUES,\n        onSubmit: ({ value }) => {\n            // TODO, instead of generic transformation, use type based tranform()\n            setFilters(value.filters.map(lf => { return { [lf.property]: { [lf.operator]: [lf.value] } } }))\n        }\n    })\n\n    // More reason to hate TS https://github.com/Microsoft/TypeScript/issues/12870\n    const filterKeys = Object.keys(filterConfig).sort();\n\n    return (\n        <section {...props} className={classNames(\"flex gap-icon items-center\", className)}>\n            <PopoverTrigger onOpenChange={(o) => {\n                // Set filters when the popover closes\n                if (!o) {\n                    form.handleSubmit();\n                } else {\n                    addFilterButtonRef.current?.focus();\n                }\n            }}>\n                <Button active={filters.length > 0} isDisabled={query.isPending || filterKeys.length === 0} type=\"button\" size={'icon'} variant={'neutral'}><Filter /></Button>\n                {/* TODO, icon maps with dynamic imports? */}\n                {/* TODO open popover with form for property specific filter */}\n                {/* TODO, icons here??? */}\n                <Popover className=\"w-full p-icon\">\n                    {/* const h3Styles = \"body mb-icon text-muted-foreground\"; */}\n                    {/* <h3 className={h3Styles}>{isFiltersActive ? \"Active filters\" : \"Add filters\"}</h3> */}\n                    <form onSubmit={(e) => { e.preventDefault(); }} className=\"flex flex-col gap-icon max-h-table overflow-auto \">\n                        <form.Field mode=\"array\" name={\"filters\"}>\n                            {\n                                (field) => {\n                                    return <>\n                                        {field.state.value.map((lf, i) => {\n                                            return (\n                                                <div key={lf.id} className=\"flex gap-icon items-center justify-normal\">\n                                                    <span className=\"text-sm\">{resourceFormatter(lf.property)}</span>\n                                                    <form.AppField\n                                                        key={lf.id}\n                                                        name={`filters[${i}].operator`}\n                                                    >\n                                                        {(sf) => (<sf.TfSingleSelect items={FilterOperations[lf.type].map(op => ({ id: op, label: <>{COMPARISON_OPERATOR_LABELS[op]}</> }))} />)}\n                                                    </form.AppField>\n\n                                                    {lf.type === 'bool' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfCheckbox />)}</form.AppField>}\n                                                    {lf.type === 'date' && <form.AppField name={`filters[${i}].value`}>{(_) => (<TfDatePicker />)}</form.AppField>}\n                                                    {lf.type === 'id' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfTextField />)}</form.AppField>}\n                                                    {lf.type === 'string' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfTextField />)}</form.AppField>}\n                                                    {/* TODO fix @mudasirpandith */}\n                                                    {/* @ts-ignore */}\n                                                    {lf.type === 'enum' && <form.AppField name={`filters[${i}].value`}>{(sf) => (<sf.TfMultiSelect items={filterConfig[lf.property].options} />)}</form.AppField>}\n                                                    {/* TODO fix @mudasirpandith */}\n                                                    {/* @ts-ignore */}\n                                                    {lf.type === 'id-search' && <form.AppField name={`filters[${i}].value`}>{(_) => (<TfIdSearchInput multiple accessor=\"id\" searchFn={filterConfig[lf.property].search} />)}</form.AppField>}\n\n                                                    <Button type=\"button\" variant=\"destructive\" size=\"icon\" onPress={() => field.removeValue(i)}><Trash /></Button>\n                                                </div>\n                                            )\n                                        })}\n                                        <div className=\"flex w-full items-center justify-end gap-2 not-first:mt-icon\">\n                                            <EasyMenu label=\"Add Filter\">\n                                                {filterKeys.map(k => <MenuItem key={k} onAction={() => {\n                                                    // TODO @mudasirpandith\n                                                    //@ts-ignore\n                                                    const type = filterConfig[k].type as FilterType;\n\n                                                    const defaultValue = (t: FilterType) => {\n                                                        // TODO, ensure exhaustive???\n                                                        // @mudasirpandith\n                                                        switch (t) {\n                                                            case 'bool':\n                                                                return true;\n                                                            case 'string':\n                                                                return '';\n                                                            case 'date':\n                                                                return new Date().toISOString();\n                                                            case 'id':\n                                                                return '';\n                                                            case 'id-search':\n                                                                return [] as string[];\n                                                            case 'enum':\n                                                                return [] as string[];\n                                                        }\n                                                    }\n\n                                                    const newFilter: LocalFilter = {\n                                                        id: `${k}-${Date.now()}`,\n                                                        operator: FilterOperations[type][0],\n                                                        //@ts-ignore\n                                                        value: defaultValue(type),\n                                                        type: type,\n                                                        property: k,\n                                                    };\n\n                                                    field.pushValue(newFilter);\n                                                    // TODO Focus to ref\n\n                                                }}>{resourceFormatter(k)}</MenuItem>)}\n                                            </EasyMenu>\n                                            {field.state.value.length > 0 ? (\n                                                <Button\n                                                    type=\"button\"\n                                                    variant=\"neutral\"\n                                                    onPress={() => { field.setValue([]) }}\n                                                >\n                                                    Reset filters\n                                                </Button>\n                                            ) : null}\n                                        </div>\n                                    </>\n                                }\n                            }\n                        </form.Field >\n                    </form>\n                </Popover>\n            </PopoverTrigger>\n        </section>\n    );\n};"],"names":["ACTIONS_COLUMN_ID","useDataTableState","columns","fetchFn","columnsToHideByDefault","allowSelection","filterConfig","id","useId","tableState","_setTableState","useState","rowSelection","setRowSelection","searchQuery","setSearchQuery","columnOrder","setColumnOrder","columnVisibility","setColumnVisibility","filters","setFilters","mergedFilters","useMemo","acc","current","merge","updateTableState","updates","prev","sorting","pagination","query","useQuery","keepPreviousData","useEffect","columnHelper","createColumnHelper","metadataColumns","data","rowHasMetadata","row","rowsWithMeta","r","m","key","info","value","cols","TABLE_CHECK_BOX_COLUMN","TABLE_ID_COLUMN","col","TABLE_DEFAULT_DATE_COLUMNS","isUpdaterFunction","updater","resolveUpdater","currentValue","tanTable","useReactTable","getCoreRowModel","c","DataTableContext","createContext","useDataTable","ctx","useContext","DataTableProvider","children","props","DataTable","tableActions","className","jsx","Fragment","classNames","Actions","jsxs","TableOverlay","Loader","Info","TableContent","ColumnPicker","PageSize","Paginator","activeId","setActiveId","resourceFormatter","useResourceFormatter","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","closestCenter","event","active","over","oldIndex","newIndex","arrayMove","SortableContext","verticalListSortingStrategy","EasyMenu","Columns3","MenuItem","colId","SortableItem","DragOverlay","column","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","GripVertical","SortIcon","rowCount","Button","ChevronFirst","ChevronLeft","ChevronRight","ChevronLast","PAGE_SIZES","s","items","RotateCw","ta","i","Icon","e","DataTableFilter","SearchField","direction","ArrowDownNarrowWide","ArrowDownWideNarrow","ArrowUpDown","tableCellStyle","isSticky","TableComponent","TableHeader","headerGroup","TableRow","header","TableHead","flexRender","TableBody","cell","TableCell","FILTER_COMPARISON_OPERATORS","COMPARISON_OPERATOR_LABELS","FilterOperations","addFilterButtonRef","useRef","form","useAppForm","lf","filterKeys","PopoverTrigger","o","Filter","Popover","field","sf","op","_","TfDatePicker","TfIdSearchInput","Trash","k","type","defaultValue","t","newFilter"],"mappings":"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"}

package/dist/components/dialog.js

@@ -1,2 +1,2 @@
-import{jsx as a,jsxs as s,Fragment as f}from"react/jsx-runtime";import{cva as c}from"class-variance-authority";import{DialogTrigger as u,ModalOverlay as x,composeRenderProps as l,Modal as p,Dialog as h,Heading as b}from"react-aria-components";import{Button as v}from"./button.js";import{classNames as i}from"../utils/primitives.js";import{X as y}from"lucide-react";import"./loader.js";import"clsx";const N=c(["fixed z-50 gap-4 bg-popover transition ease-in-out","data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0"],{variants:{side:{top:"inset-x-0 top-0 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table",bottom:"inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table",left:"inset-y-0 left-0 h-full w-3/4 border-r data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm",right:"inset-y-0 right-0 h-full w-3/4  border-l data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm"}}}),M=u,O=({className:t,isDismissable:e=!0,...n})=>a(x,{isDismissable:e,className:l(t,o=>i("fixed inset-0 z-50 bg-card/20","data-[exiting]:duration-100 data-[exiting]:animate-out","data-[entering]:animate-in",o)),...n});function P({className:t,children:e,side:n,role:o,closeButton:d=!0,...g}){return a(p,{className:l(t,r=>i(n?N({side:n,className:"h-full p-6"}):["fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full"],r)),...g,children:a(h,{role:o,className:i(!n&&"grid h-full gap-4 relative","h-full outline-none"),children:l(e,(r,m)=>s(f,{children:[r,d&&a("div",{className:"absolute right-1 top-1",children:s(v,{size:"icon",variant:"destructive",onPress:m.close,className:"opacity-70 transition-opacity data-[hovered]:opacity-100",children:[a(y,{}),a("span",{className:"sr-only",children:"Close"})]})})]}))})})}function k({className:t,...e}){return a("div",{className:i("flex flex-col gap-y-2 text-center sm:text-left",t),...e})}function B({className:t,...e}){return a("div",{className:i("flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2",t),...e})}function R({className:t,...e}){return a(b,{slot:"title",className:i("text-lg font-semibold leading-none tracking-tight",t),...e})}function V({className:t,...e}){return a("p",{className:i("flex flex-col gap-y-1 text-center sm:text-left",t),...e})}export{P as DialogContent,V as DialogDescription,B as DialogFooter,k as DialogHeader,O as DialogOverlay,R as DialogTitle,M as DialogTrigger};
+import{jsx as a,jsxs as s,Fragment as f}from"react/jsx-runtime";import{cva as c}from"class-variance-authority";import{DialogTrigger as u,ModalOverlay as x,composeRenderProps as l,Modal as p,Dialog as h,Heading as b}from"react-aria-components";import{Button as v}from"./button.js";import{classNames as i}from"../utils/primitives.js";import{X as y}from"lucide-react";import"./loader.js";import"clsx";const N=c(["fixed z-50 gap-4 bg-popover transition ease-in-out","data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0"],{variants:{side:{top:"inset-x-0 top-0 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table",bottom:"inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table",left:"inset-y-0 left-0 h-full w-3/4 border-r data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm",right:"inset-y-0 right-0 h-full w-3/4  border-l data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm"}}}),M=u,O=({className:t,isDismissable:e=!0,...o})=>a(x,{isDismissable:e,className:l(t,n=>i("fixed inset-0 z-50 bg-popover/20","data-[exiting]:duration-100 data-[exiting]:animate-out","data-[entering]:animate-in",n)),...o});function P({className:t,children:e,side:o,role:n,closeButton:d=!0,...g}){return a(p,{className:l(t,r=>i(o?N({side:o,className:"h-full p-6"}):["fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full"],r)),...g,children:a(h,{role:n,className:i(!o&&"grid h-full gap-4 relative","h-full outline-none"),children:l(e,(r,m)=>s(f,{children:[r,d&&a("div",{className:"absolute right-1 top-1",children:s(v,{size:"icon",variant:"destructive",onPress:m.close,className:"opacity-70 transition-opacity data-[hovered]:opacity-100",children:[a(y,{}),a("span",{className:"sr-only",children:"Close"})]})})]}))})})}function k({className:t,...e}){return a("div",{className:i("flex flex-col gap-y-2 text-center sm:text-left",t),...e})}function B({className:t,...e}){return a("div",{className:i("flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2",t),...e})}function R({className:t,...e}){return a(b,{slot:"title",className:i("text-lg font-semibold leading-none tracking-tight",t),...e})}function V({className:t,...e}){return a("p",{className:i("flex flex-col gap-y-1 text-center sm:text-left",t),...e})}export{P as DialogContent,V as DialogDescription,B as DialogFooter,k as DialogHeader,O as DialogOverlay,R as DialogTitle,M as DialogTrigger};
 //# sourceMappingURL=dialog.js.map

package/dist/components/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sources":["../../lib/components/dialog.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\"\nimport {\n  Dialog as AriaDialog,\n  DialogProps as AriaDialogProps,\n  DialogTrigger as AriaDialogTrigger,\n  Heading as AriaHeading,\n  HeadingProps as AriaHeadingProps,\n  Modal as AriaModal,\n  ModalOverlay as AriaModalOverlay,\n  ModalOverlayProps as AriaModalOverlayProps,\n  composeRenderProps\n} from \"react-aria-components\"\n\nimport { Button } from \"lib/components/button\"\nimport { classNames } from \"lib/utils/primitives\"\nimport { X } from \"lucide-react\"\n\nconst sheetVariants = cva(\n  [\n    \"fixed z-50 gap-4 bg-popover transition ease-in-out\",\n    \"data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0\",\n  ],\n  {\n    variants: {\n      side: {\n        top: \"inset-x-0 top-0 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table\",\n        bottom:\n          \"inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table\",\n        left: \"inset-y-0 left-0 h-full w-3/4 border-r data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm\",\n        right:\n          \"inset-y-0 right-0 h-full w-3/4  border-l data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm\",\n      },\n    },\n  }\n)\n\nexport const DialogTrigger = AriaDialogTrigger\n\nexport const DialogOverlay = ({\n  className,\n  isDismissable = true,\n  ...props\n}: AriaModalOverlayProps) => (\n  <AriaModalOverlay\n    isDismissable={isDismissable}\n    className={composeRenderProps(className, (className) =>\n      classNames(\n        \"fixed inset-0 z-50 bg-card/20\",\n        /* Exiting */\n        \"data-[exiting]:duration-100 data-[exiting]:animate-out\",\n        /* Entering */\n        \"data-[entering]:animate-in\",\n        className\n      )\n    )}\n    {...props}\n  />\n)\n\nexport interface DialogContentProps\n  extends Omit<React.ComponentProps<typeof AriaModal>, \"children\">,\n  VariantProps<typeof sheetVariants> {\n  children?: AriaDialogProps[\"children\"]\n  role?: AriaDialogProps[\"role\"]\n  closeButton?: boolean\n}\n\nexport function DialogContent({\n  className,\n  children,\n  side,\n  role,\n  closeButton = true,\n  ...props\n}: DialogContentProps) {\n  return (\n    <AriaModal\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          side\n            ? sheetVariants({ side, className: \"h-full p-6\" })\n            : [\"fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full\"],\n          className\n        )\n      )}\n      {...props}\n    >\n      <AriaDialog\n        role={role}\n        className={classNames(!side && \"grid h-full gap-4 relative\", \"h-full outline-none\")}\n      >\n        {composeRenderProps(children, (children, renderProps) => (\n          <>\n            {children}\n            {closeButton && (\n              <div className=\"absolute right-1 top-1\">\n                <Button\n                  size={'icon'}\n                  variant={'destructive'}\n                  onPress={renderProps.close}\n                  className=\"opacity-70 transition-opacity data-[hovered]:opacity-100\"\n                >\n                  <X />\n                  <span className=\"sr-only\">Close</span>\n                </Button>\n              </div>\n            )}\n          </>\n        ))}\n      </AriaDialog>\n    </AriaModal>\n  )\n}\n\nexport function DialogHeader({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      className={classNames(\n        \"flex flex-col gap-y-2 text-center sm:text-left\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DialogFooter({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      className={classNames(\n        \"flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DialogTitle({ className, ...props }: AriaHeadingProps) {\n  return (\n    <AriaHeading\n      slot=\"title\"\n      className={classNames(\n        \"text-lg font-semibold leading-none tracking-tight\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DialogDescription({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLParagraphElement>) {\n  return (\n    <p\n      className={classNames(\n        \"flex flex-col gap-y-1 text-center sm:text-left\",\n        className\n      )}\n      {...props}\n    />\n  )\n}"],"names":["sheetVariants","cva","DialogTrigger","AriaDialogTrigger","DialogOverlay","className","isDismissable","props","jsx","AriaModalOverlay","composeRenderProps","classNames","DialogContent","children","side","role","closeButton","AriaModal","AriaDialog","renderProps","jsxs","Fragment","Button","X","DialogHeader","DialogFooter","DialogTitle","AriaHeading","DialogDescription"],"mappings":"8YAiBA,MAAMA,EAAgBC,EACpB,CACE,qDACA,qKAAA,EAEF,CACE,SAAU,CACR,KAAM,CACJ,IAAK,yGACL,OACE,kHACF,KAAM,yHACN,MACE,4HAAA,CACJ,CACF,CAEJ,EAEaC,EAAgBC,EAEhBC,EAAgB,CAAC,CAC5B,UAAAC,EACA,cAAAC,EAAgB,GAChB,GAAGC,CACL,IACEC,EAACC,EAAA,CACC,cAAAH,EACA,UAAWI,EAAmBL,EAAYA,GACxCM,EACE,gCAEA,yDAEA,6BACAN,CAAA,CACF,EAED,GAAGE,CAAA,CACN,EAWK,SAASK,EAAc,CAC5B,UAAAP,EACA,SAAAQ,EACA,KAAAC,EACA,KAAAC,EACA,YAAAC,EAAc,GACd,GAAGT,CACL,EAAuB,CACrB,OACEC,EAACS,EAAA,CACC,UAAWP,EAAmBL,EAAYA,GACxCM,EACEG,EACId,EAAc,CAAE,KAAAc,EAAM,UAAW,YAAA,CAAc,EAC/C,CAAC,8TAA8T,EACnUT,CAAA,CACF,EAED,GAAGE,EAEJ,SAAAC,EAACU,EAAA,CACC,KAAAH,EACA,UAAWJ,EAAW,CAACG,GAAQ,6BAA8B,qBAAqB,EAEjF,SAAAJ,EAAmBG,EAAU,CAACA,EAAUM,IACvCC,EAAAC,EAAA,CACG,SAAA,CAAAR,EACAG,GACCR,EAAC,MAAA,CAAI,UAAU,yBACb,SAAAY,EAACE,EAAA,CACC,KAAM,OACN,QAAS,cACT,QAASH,EAAY,MACrB,UAAU,2DAEV,SAAA,CAAAX,EAACe,EAAA,EAAE,EACHf,EAAC,OAAA,CAAK,UAAU,UAAU,SAAA,OAAA,CAAK,CAAA,CAAA,CAAA,CACjC,CACF,CAAA,EAEJ,CACD,CAAA,CAAA,CACH,CAAA,CAGN,CAEO,SAASgB,EAAa,CAC3B,UAAAnB,EACA,GAAGE,CACL,EAAyC,CACvC,OACEC,EAAC,MAAA,CACC,UAAWG,EACT,iDACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV,CAEO,SAASkB,EAAa,CAC3B,UAAApB,EACA,GAAGE,CACL,EAAyC,CACvC,OACEC,EAAC,MAAA,CACC,UAAWG,EACT,8DACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV,CAEO,SAASmB,EAAY,CAAE,UAAArB,EAAW,GAAGE,GAA2B,CACrE,OACEC,EAACmB,EAAA,CACC,KAAK,QACL,UAAWhB,EACT,oDACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV,CAEO,SAASqB,EAAkB,CAChC,UAAAvB,EACA,GAAGE,CACL,EAA+C,CAC7C,OACEC,EAAC,IAAA,CACC,UAAWG,EACT,iDACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV"}
+{"version":3,"file":"dialog.js","sources":["../../lib/components/dialog.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\"\nimport {\n  Dialog as AriaDialog,\n  DialogProps as AriaDialogProps,\n  DialogTrigger as AriaDialogTrigger,\n  Heading as AriaHeading,\n  HeadingProps as AriaHeadingProps,\n  Modal as AriaModal,\n  ModalOverlay as AriaModalOverlay,\n  ModalOverlayProps as AriaModalOverlayProps,\n  composeRenderProps\n} from \"react-aria-components\"\n\nimport { Button } from \"lib/components/button\"\nimport { classNames } from \"lib/utils/primitives\"\nimport { X } from \"lucide-react\"\n\nconst sheetVariants = cva(\n  [\n    \"fixed z-50 gap-4 bg-popover transition ease-in-out\",\n    \"data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0\",\n  ],\n  {\n    variants: {\n      side: {\n        top: \"inset-x-0 top-0 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table\",\n        bottom:\n          \"inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table\",\n        left: \"inset-y-0 left-0 h-full w-3/4 border-r data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm\",\n        right:\n          \"inset-y-0 right-0 h-full w-3/4  border-l data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm\",\n      },\n    },\n  }\n)\n\nexport const DialogTrigger = AriaDialogTrigger\n\nexport const DialogOverlay = ({\n  className,\n  isDismissable = true,\n  ...props\n}: AriaModalOverlayProps) => (\n  <AriaModalOverlay\n    isDismissable={isDismissable}\n    className={composeRenderProps(className, (className) =>\n      classNames(\n        \"fixed inset-0 z-50 bg-popover/20\",\n        /* Exiting */\n        \"data-[exiting]:duration-100 data-[exiting]:animate-out\",\n        /* Entering */\n        \"data-[entering]:animate-in\",\n        className\n      )\n    )}\n    {...props}\n  />\n)\n\nexport interface DialogContentProps\n  extends Omit<React.ComponentProps<typeof AriaModal>, \"children\">,\n  VariantProps<typeof sheetVariants> {\n  children?: AriaDialogProps[\"children\"]\n  role?: AriaDialogProps[\"role\"]\n  closeButton?: boolean\n}\n\nexport function DialogContent({\n  className,\n  children,\n  side,\n  role,\n  closeButton = true,\n  ...props\n}: DialogContentProps) {\n  return (\n    <AriaModal\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          side\n            ? sheetVariants({ side, className: \"h-full p-6\" })\n            : [\"fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full\"],\n          className\n        )\n      )}\n      {...props}\n    >\n      <AriaDialog\n        role={role}\n        className={classNames(!side && \"grid h-full gap-4 relative\", \"h-full outline-none\")}\n      >\n        {composeRenderProps(children, (children, renderProps) => (\n          <>\n            {children}\n            {closeButton && (\n              <div className=\"absolute right-1 top-1\">\n                <Button\n                  size={'icon'}\n                  variant={'destructive'}\n                  onPress={renderProps.close}\n                  className=\"opacity-70 transition-opacity data-[hovered]:opacity-100\"\n                >\n                  <X />\n                  <span className=\"sr-only\">Close</span>\n                </Button>\n              </div>\n            )}\n          </>\n        ))}\n      </AriaDialog>\n    </AriaModal>\n  )\n}\n\nexport function DialogHeader({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      className={classNames(\n        \"flex flex-col gap-y-2 text-center sm:text-left\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DialogFooter({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      className={classNames(\n        \"flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DialogTitle({ className, ...props }: AriaHeadingProps) {\n  return (\n    <AriaHeading\n      slot=\"title\"\n      className={classNames(\n        \"text-lg font-semibold leading-none tracking-tight\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function DialogDescription({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLParagraphElement>) {\n  return (\n    <p\n      className={classNames(\n        \"flex flex-col gap-y-1 text-center sm:text-left\",\n        className\n      )}\n      {...props}\n    />\n  )\n}"],"names":["sheetVariants","cva","DialogTrigger","AriaDialogTrigger","DialogOverlay","className","isDismissable","props","jsx","AriaModalOverlay","composeRenderProps","classNames","DialogContent","children","side","role","closeButton","AriaModal","AriaDialog","renderProps","jsxs","Fragment","Button","X","DialogHeader","DialogFooter","DialogTitle","AriaHeading","DialogDescription"],"mappings":"8YAiBA,MAAMA,EAAgBC,EACpB,CACE,qDACA,qKAAA,EAEF,CACE,SAAU,CACR,KAAM,CACJ,IAAK,yGACL,OACE,kHACF,KAAM,yHACN,MACE,4HAAA,CACJ,CACF,CAEJ,EAEaC,EAAgBC,EAEhBC,EAAgB,CAAC,CAC5B,UAAAC,EACA,cAAAC,EAAgB,GAChB,GAAGC,CACL,IACEC,EAACC,EAAA,CACC,cAAAH,EACA,UAAWI,EAAmBL,EAAYA,GACxCM,EACE,mCAEA,yDAEA,6BACAN,CAAA,CACF,EAED,GAAGE,CAAA,CACN,EAWK,SAASK,EAAc,CAC5B,UAAAP,EACA,SAAAQ,EACA,KAAAC,EACA,KAAAC,EACA,YAAAC,EAAc,GACd,GAAGT,CACL,EAAuB,CACrB,OACEC,EAACS,EAAA,CACC,UAAWP,EAAmBL,EAAYA,GACxCM,EACEG,EACId,EAAc,CAAE,KAAAc,EAAM,UAAW,YAAA,CAAc,EAC/C,CAAC,8TAA8T,EACnUT,CAAA,CACF,EAED,GAAGE,EAEJ,SAAAC,EAACU,EAAA,CACC,KAAAH,EACA,UAAWJ,EAAW,CAACG,GAAQ,6BAA8B,qBAAqB,EAEjF,SAAAJ,EAAmBG,EAAU,CAACA,EAAUM,IACvCC,EAAAC,EAAA,CACG,SAAA,CAAAR,EACAG,GACCR,EAAC,MAAA,CAAI,UAAU,yBACb,SAAAY,EAACE,EAAA,CACC,KAAM,OACN,QAAS,cACT,QAASH,EAAY,MACrB,UAAU,2DAEV,SAAA,CAAAX,EAACe,EAAA,EAAE,EACHf,EAAC,OAAA,CAAK,UAAU,UAAU,SAAA,OAAA,CAAK,CAAA,CAAA,CAAA,CACjC,CACF,CAAA,EAEJ,CACD,CAAA,CAAA,CACH,CAAA,CAGN,CAEO,SAASgB,EAAa,CAC3B,UAAAnB,EACA,GAAGE,CACL,EAAyC,CACvC,OACEC,EAAC,MAAA,CACC,UAAWG,EACT,iDACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV,CAEO,SAASkB,EAAa,CAC3B,UAAApB,EACA,GAAGE,CACL,EAAyC,CACvC,OACEC,EAAC,MAAA,CACC,UAAWG,EACT,8DACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV,CAEO,SAASmB,EAAY,CAAE,UAAArB,EAAW,GAAGE,GAA2B,CACrE,OACEC,EAACmB,EAAA,CACC,KAAK,QACL,UAAWhB,EACT,oDACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV,CAEO,SAASqB,EAAkB,CAChC,UAAAvB,EACA,GAAGE,CACL,EAA+C,CAC7C,OACEC,EAAC,IAAA,CACC,UAAWG,EACT,iDACAN,CAAA,EAED,GAAGE,CAAA,CAAA,CAGV"}

package/dist/components/field.js

@@ -1,2 +1,2 @@
-"use client";import{jsxs as o,Fragment as l,jsx as n}from"react/jsx-runtime";import{cva as s}from"class-variance-authority";import{Group as d,composeRenderProps as m,Label as c,Text as u}from"react-aria-components";import{classNames as r}from"../utils/primitives.js";import{Info as f,CircleX as p}from"lucide-react";import"clsx";const x=s(["select-none text-sm font-medium leading-none","disabled-muted","group-data-[invalid]:text-destructive"]);function g({className:e,...t}){return n(c,{className:r(x(),e),...t})}function h({className:e,children:t,...i}){return o(u,{className:r("text-sm text-muted leading-tight",e),...i,slot:"description",children:[t,n(f,{className:"inline size-2 align-text-top ms-0.5"})]})}function v({className:e,children:t,...i}){return o("div",{className:r("text-sm leading-tight text-destructive duration-150 animate-in transition-transform  slide-in-from-top-5 fade-in",e),...i,children:[t,n(p,{className:"inline size-2 align-text-top ms-0.5"})]})}const b=s("",{variants:{variant:{default:["relative flex h-input w-full items-center overflow-hidden border border-input bg-card px-2 py-2 text-sm ring-offset-background","focus-ring","disabled-muted"],ghost:""}},defaultVariants:{variant:"default"}});function z({className:e,variant:t,...i}){return n(d,{className:m(e,a=>r(b({variant:t}),a)),...i})}function L({label:e,description:t,errorMessage:i,children:a}){return o(l,{children:[e&&n(g,{children:e}),a,t&&n(h,{children:t}),i&&n(v,{children:i})]})}export{h as FieldDescription,v as FieldError,z as FieldGroup,g as FieldLabel,L as FormField,b as fieldGroupVariants,x as labelVariants};
+"use client";import{jsxs as o,Fragment as l,jsx as n}from"react/jsx-runtime";import{cva as s}from"class-variance-authority";import{Group as d,composeRenderProps as m,Label as c,Text as u}from"react-aria-components";import{classNames as r}from"../utils/primitives.js";import{Info as f,CircleX as p}from"lucide-react";import"clsx";const g=s(["select-none text-sm font-medium leading-none","disabled-muted","group-data-[invalid]:text-destructive"]);function x({className:e,...t}){return n(c,{className:r(g(),e),...t})}function v({className:e,children:t,...i}){return o(u,{className:r("text-sm text-muted leading-tight",e),...i,slot:"description",children:[t,n(f,{className:"inline size-2 align-text-top ms-0.5"})]})}function h({className:e,children:t,...i}){return o("div",{className:r("text-sm leading-tight text-destructive duration-150 animate-in transition-transform  slide-in-from-top-5 fade-in",e),...i,children:[t,n(p,{className:"inline size-2 align-text-top ms-0.5"})]})}const b=s("",{variants:{variant:{default:["relative flex w-full items-center overflow-hidden border border-input bg-popover input-dim ring-offset-background","focus-ring","disabled-muted"],ghost:""}},defaultVariants:{variant:"default"}});function z({className:e,variant:t,...i}){return n(d,{className:m(e,a=>r(b({variant:t}),a)),...i})}function L({label:e,description:t,errorMessage:i,children:a}){return o(l,{children:[e&&n(x,{children:e}),a,t&&n(v,{children:t}),i&&n(h,{children:i})]})}export{v as FieldDescription,h as FieldError,z as FieldGroup,x as FieldLabel,L as FormField,b as fieldGroupVariants,g as labelVariants};
 //# sourceMappingURL=field.js.map