@cryptlex/web-components 6.6.6-alpha40 → 6.6.6-alpha45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/components/checkbox.d.ts +4 -2
  2. package/dist/components/checkbox.js +1 -1
  3. package/dist/components/checkbox.js.map +1 -1
  4. package/dist/components/data-table-filter.d.ts +1 -1
  5. package/dist/components/data-table-filter.js +1 -1
  6. package/dist/components/data-table.d.ts +8 -10
  7. package/dist/components/data-table.js +1 -1
  8. package/dist/components/data-table.js.map +1 -1
  9. package/dist/components/date-picker.js +1 -1
  10. package/dist/components/dialog-action-utils.d.ts +38 -0
  11. package/dist/components/dialog-action-utils.js +2 -0
  12. package/dist/components/dialog-action-utils.js.map +1 -0
  13. package/dist/components/dialog-menu.d.ts +3 -3
  14. package/dist/components/dialog-menu.js +1 -1
  15. package/dist/components/dialog-menu.js.map +1 -1
  16. package/dist/components/dialog.d.ts +1 -1
  17. package/dist/components/id-search.d.ts +12 -11
  18. package/dist/components/id-search.js +1 -1
  19. package/dist/components/id-search.js.map +1 -1
  20. package/dist/components/select-options.d.ts +8 -0
  21. package/dist/components/select-options.js +1 -1
  22. package/dist/components/select-options.js.map +1 -1
  23. package/dist/components/table-actions.d.ts +46 -0
  24. package/dist/components/table-actions.js +2 -0
  25. package/dist/components/table-actions.js.map +1 -0
  26. package/dist/utilities/countries.d.ts +3 -0
  27. package/dist/utilities/countries.js +2 -0
  28. package/dist/utilities/countries.js.map +1 -0
  29. package/dist/utilities/numbers.d.ts +1 -0
  30. package/dist/utilities/numbers.js +1 -1
  31. package/dist/utilities/numbers.js.map +1 -1
  32. package/dist/utilities/resources.d.ts +8 -1
  33. package/dist/utilities/resources.js +1 -1
  34. package/dist/utilities/resources.js.map +1 -1
  35. package/dist/utilities/string.d.ts +5 -0
  36. package/dist/utilities/string.js +1 -1
  37. package/dist/utilities/string.js.map +1 -1
  38. package/dist/utilities/validators.d.ts +16 -0
  39. package/dist/utilities/validators.js +2 -0
  40. package/dist/utilities/validators.js.map +1 -0
  41. package/package.json +3 -3
@@ -1,8 +1,10 @@
1
1
  import { CheckboxProps as AriaCheckboxProps } from 'react-aria-components';
2
2
  import { FormFieldProps } from './form';
3
3
  export declare const CheckboxGroup: (props: import('react-aria-components').CheckboxGroupProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement | null;
4
- type CheckboxProps = AriaCheckboxProps & FormFieldProps;
5
- export declare function Checkbox({ className, label, description, errorMessage, requiredIndicator, ...props }: Omit<CheckboxProps, 'children'>): import("react/jsx-runtime").JSX.Element;
4
+ type CheckboxProps = AriaCheckboxProps & FormFieldProps & {
5
+ variant?: 'checkbox' | 'switch';
6
+ };
7
+ export declare function Checkbox({ className, label, description, errorMessage, requiredIndicator, variant, ...props }: Omit<CheckboxProps, 'children'>): import("react/jsx-runtime").JSX.Element;
6
8
  export type TfCheckboxProps = Omit<React.ComponentProps<typeof Checkbox>, 'onChange' | 'onBlur' | 'isChecked'>;
7
9
  export declare function TfCheckbox({ ...props }: TfCheckboxProps): import("react/jsx-runtime").JSX.Element;
8
10
  export {};
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as e,Fragment as d}from"react/jsx-runtime";import{useId as h}from"react";import{Checkbox as p,composeRenderProps as n,CheckboxGroup as g}from"react-aria-components";import{useFieldContext as x}from"../utilities/form-context.js";import{classNames as s}from"../utilities/theme.js";import{FormField as f,labelVariants as k}from"./form.js";import{IcMinus as v,IcCheck as C}from"./icons.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";const w=g;function y({className:r,label:o,description:l,errorMessage:u,requiredIndicator:m,...t}){const b=h(),i=t.id||b;return e("div",{className:"group form-field",children:e(f,{label:o,description:l,errorMessage:u,requiredIndicator:m,htmlFor:i,children:e(p,{className:n(r,c=>s("group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2","disabled-muted",k,c)),id:i,...t,children:n(e(d,{}),(c,a)=>e(d,{children:e("div",{className:s("flex size-input shrink-0 items-center bg-elevation-2 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:a.isIndeterminate?e(v,{className:"size-icon"}):a.isSelected?e(C,{className:"size-icon"}):null})}))})})})}function M({...r}){const o=x({disabled:r.isDisabled});return e(y,{isSelected:o.state.value,isDisabled:o.form.state.isSubmitting||r.isDisabled,onChange:()=>o.handleChange(!o.state.value),onBlur:o.handleBlur,...r})}export{y as Checkbox,w as CheckboxGroup,M as TfCheckbox};
1
+ "use client";import{jsx as e,Fragment as k,jsxs as v}from"react/jsx-runtime";import{useId as C}from"react";import{Checkbox as y,composeRenderProps as l,CheckboxGroup as N}from"react-aria-components";import{useFieldContext as w}from"../utilities/form-context.js";import{classNames as r}from"../utilities/theme.js";import{FormField as I,labelVariants as B}from"./form.js";import{IcMinus as F,IcCheck as S}from"./icons.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";const i="group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50",a="group-data-[invalid]/checkbox:border-destructive",u="focus:outline-none focus-visible:outline-none",b="group-data-[selected]/checkbox:bg-primary",j="relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-2 transition-colors duration-200",z="absolute top-1/2 -translate-y-1/2 left-0.5 h-5 w-5 rounded-full bg-background border border-input transition-transform duration-200",D="flex size-input shrink-0 items-center bg-elevation-2 justify-center border border-input text-current ring-offset-background",H=N;function G({className:o,label:t,description:m,errorMessage:h,requiredIndicator:g,variant:p="checkbox",...c}){const x=C(),d=c.id||x,f=p==="switch";return e("div",{className:"group form-field",children:e(I,{label:t,description:m,errorMessage:h,requiredIndicator:g,htmlFor:d,children:e(y,{className:l(o,n=>r("group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted",B,n)),id:d,...c,children:l(e(k,{}),(n,s)=>f?e("div",{className:r(j,b,i,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive",u),children:e("div",{className:r(z,"group-data-[selected]/checkbox:translate-x-4.5",i,a)})}):v("div",{className:r(D,"group-data-[indeterminate]/checkbox:bg-primary",b,"group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground",i,a,"group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground",u),children:[s.isIndeterminate&&e(F,{className:"size-icon"}),!s.isIndeterminate&&s.isSelected&&e(S,{className:"size-icon"})]}))})})})}function J({...o}){const t=w({disabled:o.isDisabled});return e(G,{...o,isSelected:t.state.value,isDisabled:t.form.state.isSubmitting||o.isDisabled,onChange:()=>t.handleChange(!t.state.value),onBlur:t.handleBlur})}export{G as Checkbox,H as CheckboxGroup,J as TfCheckbox};
2
2
  //# sourceMappingURL=checkbox.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"checkbox.js","sources":["../../lib/components/checkbox.tsx"],"sourcesContent":["'use client';\nimport { useId } from 'react';\nimport {\n Checkbox as AriaCheckbox,\n CheckboxGroup as AriaCheckboxGroup,\n composeRenderProps,\n type CheckboxProps as AriaCheckboxProps,\n} from 'react-aria-components';\n\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FormField, labelVariants, type FormFieldProps } from './form';\nimport { IcCheck, IcMinus } from './icons';\n\nexport const CheckboxGroup = AriaCheckboxGroup;\ntype CheckboxProps = AriaCheckboxProps & FormFieldProps;\nexport function Checkbox({\n className,\n label,\n description,\n errorMessage,\n requiredIndicator,\n ...props\n}: Omit<CheckboxProps, 'children'>) {\n const generatedId = useId();\n const fieldId = props.id || generatedId;\n return (\n <div className=\"group form-field\">\n <FormField {...{ label, description, errorMessage, requiredIndicator, htmlFor: fieldId }}>\n <AriaCheckbox\n className={composeRenderProps(className, className =>\n classNames(\n 'group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2',\n /* Disabled */\n 'disabled-muted',\n labelVariants,\n className\n )\n )}\n id={fieldId}\n {...props}\n >\n {composeRenderProps(<></>, (_, renderProps) => (\n <>\n <div\n className={classNames(\n 'flex size-input shrink-0 items-center bg-elevation-2 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 <IcMinus className=\"size-icon\" />\n ) : renderProps.isSelected ? (\n <IcCheck 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>({ 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","requiredIndicator","props","generatedId","useId","fieldId","jsx","FormField","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","IcMinus","IcCheck","TfCheckbox","field","useFieldContext"],"mappings":"qeAcO,MAAMA,EAAgBC,EAEtB,SAASC,EAAS,CACrB,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,GAAGC,CACP,EAAoC,CAChC,MAAMC,EAAcC,EAAA,EACdC,EAAUH,EAAM,IAAMC,EAC5B,OACIG,EAAC,MAAA,CAAI,UAAU,mBACX,WAACC,EAAA,CAAgB,MAAAT,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAAmB,QAASI,EAC3E,SAAAC,EAACE,EAAA,CACG,UAAWC,EAAmBZ,EAAWA,GACrCa,EACI,8EAEA,iBACAC,EACAd,CAAA,CACJ,EAEJ,GAAIQ,EACH,GAAGH,EAEH,WAAmBI,EAAAM,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IAC3BR,EAAAM,EAAA,CACI,SAAAN,EAAC,MAAA,CACG,UAAWI,EACP,8HAEA,+MAEA,8FAEA,wNAEA,+CAAA,EAGH,SAAAI,EAAY,gBACTR,EAACS,EAAA,CAAQ,UAAU,WAAA,CAAY,EAC/BD,EAAY,WACZR,EAACU,EAAA,CAAQ,UAAU,YAAY,EAC/B,IAAA,CAAA,EAEZ,CACH,CAAA,CAAA,EAET,CAAA,CACJ,CAER,CAGO,SAASC,EAAW,CAAE,GAAGf,GAA0B,CACtD,MAAMgB,EAAQC,EAAyB,CAAE,SAAUjB,EAAM,WAAY,EACrE,OACII,EAACV,EAAA,CACG,WAAYsB,EAAM,MAAM,MACxB,WAAYA,EAAM,KAAK,MAAM,cAAgBhB,EAAM,WACnD,SAAU,IAAMgB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGhB,CAAA,CAAA,CAGhB"}
1
+ {"version":3,"file":"checkbox.js","sources":["../../lib/components/checkbox.tsx"],"sourcesContent":["'use client';\nimport { useId } from 'react';\nimport {\n Checkbox as AriaCheckbox,\n CheckboxGroup as AriaCheckboxGroup,\n composeRenderProps,\n type CheckboxProps as AriaCheckboxProps,\n} from 'react-aria-components';\n\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FormField, labelVariants, type FormFieldProps } from './form';\nimport { IcCheck, IcMinus } from './icons';\n\nconst disabledClasses = 'group-data-[disabled]/checkbox:cursor-not-allowed group-data-[disabled]/checkbox:opacity-50';\nconst invalidBorderClasses = 'group-data-[invalid]/checkbox:border-destructive';\nconst focusResetClasses = 'focus:outline-none focus-visible:outline-none';\nconst selectedPrimaryClasses = 'group-data-[selected]/checkbox:bg-primary';\n\nconst switchBaseClasses =\n 'relative shrink-0 h-6 w-11 rounded-full border border-input bg-elevation-2 transition-colors duration-200';\nconst switchKnobClasses =\n 'absolute top-1/2 -translate-y-1/2 left-0.5 h-5 w-5 rounded-full bg-background border border-input transition-transform duration-200';\n\nconst checkboxBaseClasses =\n 'flex size-input shrink-0 items-center bg-elevation-2 justify-center border border-input text-current ring-offset-background';\n\nexport const CheckboxGroup = AriaCheckboxGroup;\ntype CheckboxProps = AriaCheckboxProps &\n FormFieldProps & {\n variant?: 'checkbox' | 'switch';\n };\nexport function Checkbox({\n className,\n label,\n description,\n errorMessage,\n requiredIndicator,\n variant = 'checkbox',\n ...props\n}: Omit<CheckboxProps, 'children'>) {\n const generatedId = useId();\n const fieldId = props.id || generatedId;\n const isSwitch = variant === 'switch';\n return (\n <div className=\"group form-field\">\n <FormField\n {...{\n label,\n description,\n errorMessage,\n requiredIndicator,\n htmlFor: fieldId,\n }}\n >\n <AriaCheckbox\n className={composeRenderProps(className, className =>\n classNames(\n 'group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted',\n labelVariants,\n className\n )\n )}\n id={fieldId}\n {...props}\n >\n {composeRenderProps(<></>, (_, renderProps) => {\n if (isSwitch) {\n return (\n <div\n className={classNames(\n switchBaseClasses,\n selectedPrimaryClasses,\n disabledClasses,\n invalidBorderClasses,\n 'group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive',\n focusResetClasses\n )}\n >\n <div\n className={classNames(\n switchKnobClasses,\n 'group-data-[selected]/checkbox:translate-x-4.5',\n disabledClasses,\n invalidBorderClasses\n )}\n />\n </div>\n );\n }\n\n return (\n <div\n className={classNames(\n checkboxBaseClasses,\n 'group-data-[indeterminate]/checkbox:bg-primary',\n selectedPrimaryClasses,\n 'group-data-[indeterminate]/checkbox:text-primary-foreground group-data-[selected]/checkbox:text-primary-foreground',\n disabledClasses,\n invalidBorderClasses,\n 'group-data-[invalid]/checkbox:group-data-[selected]/checkbox:bg-destructive group-data-[invalid]/checkbox:group-data-[selected]/checkbox:text-destructive-foreground',\n focusResetClasses\n )}\n >\n {renderProps.isIndeterminate && <IcMinus className=\"size-icon\" />}\n {!renderProps.isIndeterminate && renderProps.isSelected && (\n <IcCheck className=\"size-icon\" />\n )}\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>({ disabled: props.isDisabled });\n return (\n <Checkbox\n {...props}\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 />\n );\n}\n"],"names":["disabledClasses","invalidBorderClasses","focusResetClasses","selectedPrimaryClasses","switchBaseClasses","switchKnobClasses","checkboxBaseClasses","CheckboxGroup","AriaCheckboxGroup","Checkbox","className","label","description","errorMessage","requiredIndicator","variant","props","generatedId","useId","fieldId","isSwitch","jsx","FormField","AriaCheckbox","composeRenderProps","classNames","labelVariants","Fragment","_","renderProps","jsxs","IcMinus","IcCheck","TfCheckbox","field","useFieldContext"],"mappings":"+eAcA,MAAMA,EAAkB,8FAClBC,EAAuB,mDACvBC,EAAoB,gDACpBC,EAAyB,4CAEzBC,EACF,4GACEC,EACF,sIAEEC,EACF,8HAESC,EAAgBC,EAKtB,SAASC,EAAS,CACrB,UAAAC,EACA,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,QAAAC,EAAU,WACV,GAAGC,CACP,EAAoC,CAChC,MAAMC,EAAcC,EAAA,EACdC,EAAUH,EAAM,IAAMC,EACtBG,EAAWL,IAAY,SAC7B,OACIM,EAAC,MAAA,CAAI,UAAU,mBACX,SAAAA,EAACC,EAAA,CAEO,MAAAX,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,QAASK,EAGb,SAAAE,EAACE,EAAA,CACG,UAAWC,EAAmBd,EAAWA,GACrCe,EACI,6FACAC,EACAhB,CAAA,CACJ,EAEJ,GAAIS,EACH,GAAGH,EAEH,SAAAQ,EAAmBH,EAAAM,EAAA,CAAA,CAAE,EAAK,CAACC,EAAGC,IACvBT,EAEIC,EAAC,MAAA,CACG,UAAWI,EACPrB,EACAD,EACAH,EACAC,EACA,8EACAC,CAAA,EAGJ,SAAAmB,EAAC,MAAA,CACG,UAAWI,EACPpB,EACA,iDACAL,EACAC,CAAA,CACJ,CAAA,CACJ,CAAA,EAMR6B,EAAC,MAAA,CACG,UAAWL,EACPnB,EACA,iDACAH,EACA,qHACAH,EACAC,EACA,uKACAC,CAAA,EAGH,SAAA,CAAA2B,EAAY,iBAAmBR,EAACU,EAAA,CAAQ,UAAU,YAAY,EAC9D,CAACF,EAAY,iBAAmBA,EAAY,YACzCR,EAACW,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CAAA,CAAA,CAI9C,CAAA,CAAA,CACL,CAAA,EAER,CAER,CAGO,SAASC,EAAW,CAAE,GAAGjB,GAA0B,CACtD,MAAMkB,EAAQC,EAAyB,CAAE,SAAUnB,EAAM,WAAY,EACrE,OACIK,EAACZ,EAAA,CACI,GAAGO,EACJ,WAAYkB,EAAM,MAAM,MACxB,WAAYA,EAAM,KAAK,MAAM,cAAgBlB,EAAM,WACnD,SAAU,IAAMkB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,UAAA,CAAA,CAG1B"}
@@ -26,7 +26,7 @@ export type FilterConfig = {
26
26
  options: MultiSelectProps['items'];
27
27
  } | ({
28
28
  type: 'id-search';
29
- } & Pick<React.ComponentProps<typeof TfMultipleIdSearchInput>, 'accessor' | 'searchFn' | 'resource'>) | {
29
+ } & Pick<React.ComponentProps<typeof TfMultipleIdSearchInput>, 'accessor' | 'resource'>) | {
30
30
  type: 'id';
31
31
  } | {
32
32
  type: 'bool';
@@ -1,2 +1,2 @@
1
- import"react/jsx-runtime";import"react";import"./button.js";import{C as H,D as J,F as K}from"./data-table.js";import"./date-picker.js";import"./menu.js";import"./popover.js";import"../utilities/form-hook.js";import"../utilities/resources.js";import"../utilities/theme.js";import"./icons.js";import"./id-search.js";import"class-variance-authority";import"react-aria-components";import"./loader.js";import"clsx";import"@dnd-kit/core";import"@dnd-kit/sortable";import"@dnd-kit/utilities";import"@tanstack/react-query";import"@tanstack/react-table";import"@uidotdev/usehooks";import"lodash-es";import"./dialog-menu.js";import"./dialog.js";import"./list-box.js";import"./select.js";import"../utilities/form.js";import"../utilities/form-context.js";import"@tanstack/react-form";import"./form.js";import"./searchfield.js";import"./table.js";import"../utilities/date.js";import"./checkbox.js";import"@internationalized/date";import"./calendar.js";import"./datefield.js";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";import"../utilities/string.js";export{H as COMPARISON_OPERATOR_LABELS,J as DataTableFilter,K as FILTER_COMPARISON_OPERATORS};
1
+ import"react/jsx-runtime";import"react";import"./button.js";import{C as rr,D as tr,F as or}from"./data-table.js";import"./date-picker.js";import"./menu.js";import"./popover.js";import"../utilities/form-hook.js";import"../utilities/resources.js";import"../utilities/theme.js";import"./icons.js";import"class-variance-authority";import"react-aria-components";import"./loader.js";import"clsx";import"@dnd-kit/core";import"@dnd-kit/sortable";import"@dnd-kit/utilities";import"@tanstack/react-query";import"@tanstack/react-table";import"@uidotdev/usehooks";import"lodash-es";import"./badge.js";import"openapi-fetch";import"./dialog.js";import"./toast.js";import"react-dom";import"./alert.js";import"./searchfield.js";import"./form.js";import"../utilities/form.js";import"../utilities/form-context.js";import"@tanstack/react-form";import"./select.js";import"./list-box.js";import"./dialog-menu.js";import"../utilities/string.js";import"./dialog-action-utils.js";import"./table.js";import"../utilities/countries.js";import"./select-options.js";import"../utilities/date.js";import"../utilities/numbers.js";import"zod";import"../utilities/duration.js";import"./checkbox.js";import"./table-actions.js";import"@internationalized/date";import"./calendar.js";import"./datefield.js";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";export{rr as COMPARISON_OPERATOR_LABELS,tr as DataTableFilter,or as FILTER_COMPARISON_OPERATORS};
2
2
  //# sourceMappingURL=data-table-filter.js.map
@@ -1,18 +1,16 @@
1
1
  import { operations } from '@cryptlex/web-api-types/develop';
2
- import { ColumnDef, ColumnHelper, PaginationState, SortingState } from '@tanstack/react-table';
3
- import { PressEvent } from 'react-aria-components';
2
+ import { ColumnDef, ColumnHelper, PaginationState, RowData, SortingState } from '@tanstack/react-table';
4
3
  import { FiltersConfig, TableFilter } from '../components/data-table-filter';
5
4
  import { DialogMenuAction } from '../components/dialog-menu';
6
5
  import { CtxResourceName } from '../utilities/resources';
7
- import { CtxIcon } from './icons';
6
+ import { TableAction } from './table-actions';
7
+ export type DisplayType = 'string' | 'boolean' | 'date' | 'number' | 'enum' | 'badge' | 'country' | 'fileSize' | 'days';
8
+ declare module '@tanstack/react-table' {
9
+ interface ColumnMeta<TData extends RowData, TValue> {
10
+ displayType: DisplayType;
11
+ }
12
+ }
8
13
  /** Reserved name for actions column */
9
- export type TableAction<in TActionData> = {
10
- label: string;
11
- onClick: (e: PressEvent, t: TActionData[]) => void;
12
- bulk: boolean;
13
- icon: CtxIcon;
14
- tooltip?: string;
15
- };
16
14
  export type TableFetchFn<in out TData extends object> = (p: PaginationState, s: SortingState, q: string, f: Record<string, any>) => Promise<{
17
15
  total: number;
18
16
  data: TData[] | undefined;
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as t,Fragment as y,jsxs as l}from"react/jsx-runtime";import{createContext as oe,useState as F,useMemo as ie,useEffect as le,useContext as se,useRef as ce}from"react";import{Button as S}from"./button.js";import{useSensors as ue,useSensor as H,PointerSensor as de,KeyboardSensor as me,DndContext as ge,closestCenter as pe,DragOverlay as fe}from"@dnd-kit/core";import{sortableKeyboardCoordinates as he,SortableContext as be,verticalListSortingStrategy as Se,arrayMove as ve,useSortable as ye}from"@dnd-kit/sortable";import{CSS as Ce}from"@dnd-kit/utilities";import{useQuery as xe,keepPreviousData as we}from"@tanstack/react-query";import{createColumnHelper as Z,useReactTable as Ie,getCoreRowModel as Fe,flexRender as L}from"@tanstack/react-table";import{useLocalStorage as U}from"@uidotdev/usehooks";import{merge as Ne}from"lodash-es";import{TfDatePicker as Te}from"./date-picker.js";import{EasyMenu as E,MenuItem as R}from"./menu.js";import{PopoverTrigger as Ae,Popover as Pe}from"./popover.js";import{useAppForm as De}from"../utilities/form-hook.js";import{useResourceFormatter as $}from"../utilities/resources.js";import{classNames as x}from"../utilities/theme.js";import{IcInfo as Re,IcMoreVertical as Oe,IcRefresh as ze,IcColumns as _e,IcGrip as Le,IcFirst as Me,IcLeft as Ee,IcRight as $e,IcLast as ke,IcSortAsc as qe,IcSortDesc as Ve,IcSortNone as He,IcFilter as Ue,IcRemove as j,IcCheck as B,IcMinus as je,IcAccount as Be,IcLicense as Ke,IcDate as Qe,IcFile as Ge}from"./icons.js";import{TfMultipleIdSearchInput as We}from"./id-search.js";import{DialogMenu as Xe}from"./dialog-menu.js";import{Loader as Ze}from"./loader.js";import{SearchField as Je}from"./searchfield.js";import{Table as Ye,TableHeader as et,TableRow as K,TableHead as tt,TableBody as nt,TableCell as rt}from"./table.js";import{formatDate as Q}from"../utilities/date.js";import{Checkbox as G}from"./checkbox.js";import"class-variance-authority";import"react-aria-components";import"@internationalized/date";import"./calendar.js";import"./form.js";import"./datefield.js";import"../utilities/form.js";import"../utilities/form-context.js";import"@tanstack/react-form";import"./list-box.js";import"./select.js";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";import"../utilities/string.js";import"clsx";import"./dialog.js";function on(e){const n=async(a,i,m,s)=>{const u={...s,page:a.pageIndex+1,limit:a.pageSize,sort:at(i[0]),search:m},h=await e(u);return{total:Number.parseInt(h.response.headers.get("Pagination-Count")||"0"),data:h.data}},r=Z();return{callback:n,columnHelper:r}}function at(e){return e?e.desc?`-${e.id}`:`+${e.id}`:"-createdAt"}const N=Z(),ot=[N.accessor("checkbox",{header:({table:e})=>t(G,{isIndeterminate:e.getIsSomeRowsSelected()&&!e.getIsAllPageRowsSelected(),isSelected:e.getIsAllPageRowsSelected()||e.getIsSomePageRowsSelected(),onChange:()=>e.toggleAllPageRowsSelected(),"aria-label":"Select all"}),cell:({row:e})=>t(G,{isSelected:e.getIsSelected(),onChange:()=>e.toggleSelected(),"aria-label":"Select row"}),enableSorting:!1,enableHiding:!1})],it=[N.accessor("id",{header:"ID"})],lt=[N.accessor("createdAt",{header:"Creation Date",cell:({row:e})=>{const n=e.getValue("createdAt");return Q(n)},enableHiding:!1}),N.accessor("updatedAt",{header:"Last Updated",cell:({row:e})=>{const n=e.getValue("updatedAt");return Q(n)},enableHiding:!1})],T="TableActions",st=e=>e.length===0?[]:[N.accessor(T,{header:"Actions",id:T,enableHiding:!1,cell:({row:n})=>t(Xe,{label:t(Oe,{}),data:n.original,items:e}),enableSorting:!1})];function ln({resourceName:e,columns:n,callback:r,filterConfig:a,columnsToHideByDefault:i={},allowSelection:m=!1,initialFilters:s=[],tableActions:u,rowActions:h}){const[d,v]=F({pagination:{pageIndex:0,pageSize:20},sorting:[]}),[g,c]=F({}),[f,p]=F(""),[b,k]=U(`${e}_ctx_column_order_preference`,[]),[q,te]=U(`${e}_ctx_column_visibility_preference`,{id:!1,...i}),[O,ne]=F(s),z=ie(()=>O.map(o=>Array.isArray(o.value)?{[o.property]:{[o.operator]:o.value.join(",")}}:{[o.property]:{[o.operator]:o.value}}).reduce((o,I)=>Ne(o,I),{}),[O]),_=o=>{v(I=>({...I,...o}))},{sorting:A,pagination:P}=d,D=xe({queryKey:[e,P,A,f,z],queryFn:()=>r(P,A,f,z),placeholderData:we,retry:0,refetchOnWindowFocus:!1}),re=[...m?ot:[],...it,...n,...lt,...st(h??[])];function ae(o){return typeof o=="function"}function w(o,I){return ae(o)?o(I):o}const V=Ie({data:D.data?.data??[],columns:re,getCoreRowModel:Fe(),rowCount:D.data?.total,manualPagination:!0,onPaginationChange:o=>{_({pagination:w(o,P)})},manualSorting:!0,onSortingChange:o=>{c({}),_({sorting:[...w(o,A)]})},manualFiltering:!0,onColumnVisibilityChange:o=>{te(w(o,q))},onRowSelectionChange:o=>{c(w(o,g))},onColumnOrderChange:o=>{k(w(o,b))},state:{sorting:A,columnVisibility:q,pagination:P,rowSelection:g,columnOrder:b},meta:{refetch:D.refetch}});return le(()=>{k([...V.getAllLeafColumns().map(o=>o.id)])},[]),{tableState:d,updateTableState:_,query:D,setSearchQuery:p,searchQuery:f,tanTable:V,mergedFilters:z,filters:O,setFilters:ne,filterConfig:a,tableActions:u}}const J=oe(null);function C(){const e=se(J);if(!e)throw Error("DataTable should be used within DataTableProvider.");return e}function sn({children:e,...n}){return t(J.Provider,{value:n,children:e})}function cn({className:e,...n}){const{query:r,tanTable:a}=C();return t(y,{children:l("section",{...n,className:x("flex flex-col bg-elevation-1",e),children:[t(mt,{}),l("div",{className:"w-full overflow-auto border-x h-table relative",tabIndex:0,children:[r.isLoading&&t(W,{className:"cursor-wait",children:t(Ze,{})}),!r.isLoading&&a.getRowModel().rows.length===0&&t(W,{className:"cursor-not-allowed",children:!r.isFetching&&(r.isError?l("span",{className:"flex gap-3 justify-center items-center",children:[t(Re,{}),t("span",{children:r.error.message})]}):r.data?.data?.length===0?t(y,{children:"No results found."}):t(y,{children:"Unknown error. Please contact customer support."}))}),!r.isLoading&&a.getRowModel().rows.length!==0&&t(gt,{className:"w-full"})]}),l("div",{className:"flex w-full justify-between border gap-icon p-icon overflow-x-auto",children:[l("div",{className:"flex gap-icon",children:[t(ct,{}),t(dt,{})]}),t(ut,{})]})]})})}function W({children:e,className:n}){return l(y,{children:[t("span",{className:x(n,"absolute top-0 bg-elevation-1 text-foreground z-20 size-full body-sm flex items-center justify-center"),children:e}),t("span",{className:"relative h-full w-0 block"})]})}function ct(){const{tanTable:e}=C(),[n,r]=F(null),a=$(),i=ue(H(de),H(me,{coordinateGetter:he}));return t(ge,{sensors:i,collisionDetection:pe,onDragStart:s=>{const{active:u}=s;r(u.id.toString())},onDragEnd:s=>{const{active:u,over:h}=s;if(h&&u.id!==h.id){const d=e.getState().columnOrder,v=d.indexOf(u.id.toString()),g=d.indexOf(h.id.toString());e.setColumnOrder([...ve(d,v,g)])}r(null)},children:l(be,{items:e.getState().columnOrder,strategy:Se,children:[l(E,{label:l(y,{children:[t(_e,{className:"inline align-bottom me-1"}),"Columns"]}),selectionMode:"multiple",items:e.getAllFlatColumns(),selectedKeys:e.getVisibleFlatColumns().map(s=>s.id),children:[t(R,{onAction:()=>e.toggleAllColumnsVisible(),className:"italic",children:"(select all)"}),e.getState().columnOrder.map(s=>{const u=e.getAllFlatColumns().find(h=>h.id===s);return!u||u.id==="checkbox"||u.id===T?null:t(m,{column:u},u.id)})]}),t(fe,{children:n?t("div",{className:"opacity-70 border-2 border-primary",children:a(n)}):null})]})});function m({column:s}){const{attributes:u,listeners:h,setNodeRef:d,transform:v,transition:g}=ye({id:s.id}),c={transform:Ce.Transform.toString(v),transition:g,zIndex:"999"};return l(R,{ref:d,style:c,...u,id:s.id,onAction:()=>s.toggleVisibility(),isDisabled:!s.getCanHide(),className:"flex items-center",children:[t(Le,{...h,className:"size-icon cursor-grab"}),M(s),s.getIsSorted()&&t(Y,{className:"size-icon",direction:s.getIsSorted()})]})}}function ut(){const{tanTable:e,query:n}=C(),r=n.data?.total??0;return l("div",{className:"flex items-center gap-2",children:[t("span",{className:"whitespace-nowrap body-sm text-muted",children:`${e.getState().pagination.pageIndex*e.getState().pagination.pageSize+1} - ${Math.min((e.getState().pagination.pageIndex+1)*e.getState().pagination.pageSize,r)} of ${r?.toLocaleString()}`}),t(S,{"aria-label":"First page",onPress:()=>e.firstPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(Me,{})}),t(S,{"aria-label":"Previous page",onPress:()=>e.previousPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(Ee,{})}),t(S,{"aria-label":"Next page",onPress:()=>e.nextPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t($e,{})}),t(S,{"aria-label":"Last page",onClick:()=>e.lastPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t(ke,{})})]})}function dt(){const{tanTable:e}=C(),n=[10,20,30,40,50];return t(E,{label:e.getState().pagination.pageSize.toString(),selectionMode:"single",selectedKeys:[e.getState().pagination.pageSize.toString()],items:n.map(r=>({id:r.toString(),value:r})),children:r=>t(R,{onAction:()=>e.setPageSize(r.value),children:r.value})})}function mt(){const{query:e,tanTable:n,searchQuery:r,setSearchQuery:a,tableActions:i}=C();return l("section",{className:"flex bg-elevation-1 justify-between my-0 p-icon border gap-icon overflow-auto",children:[l("div",{className:"flex gap-icon",children:[t(S,{"aria-label":"Refresh",isPending:e.isFetching,onClick:()=>e.refetch(),variant:"neutral",size:"icon",children:t(ze,{})}),i.filter(m=>m.bulk===n.getSelectedRowModel().rows.length>0).map((m,s)=>{const u=m.icon;return t(S,{"aria-label":m.label,type:"button",isDisabled:e.isFetching,className:"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform",onPress:h=>{m.onClick(h,n.getSelectedRowModel().rows.map(d=>d.original))},size:"icon",children:t(u,{})},`${s}-${m.bulk}`)})]}),l("div",{className:"flex gap-icon",children:[t(ht,{}),t(Je,{value:r,onChange:a})]})]})}function Y({direction:e,...n}){return e==="asc"?t(qe,{className:"size-3.5",...n}):e==="desc"?t(Ve,{className:"size-3.5",...n}):t(He,{className:"size-3.5",...n})}function M(e){const n=$(),r=e.columnDef.header;return typeof r=="string"?r:n(e.id)}function X({header:e}){const n=e.column.columnDef.header;return typeof n=="string"||!n?M(e.column):typeof n=="function"?typeof n(e.getContext())=="string"?M(e.column):L(n,e.getContext()):L(n,e.getContext())}function gt({className:e}){const{tanTable:n}=C(),r=(a,i,m="z-50")=>x("px-icon py-2 text-left body-sm font-medium whitespace-nowrap",a&&`bg-elevation-1 sticky right-0 ${m} text-center`,i);return l(Ye,{className:x("table-auto",e),children:[t(et,{className:"sticky top-0 z-10",children:n.getHeaderGroups().map(a=>t(K,{children:a.headers.map(i=>l(tt,{scope:"col",colSpan:i.colSpan,className:r(i.id===T,"bg-elevation-1"),children:[!i.column.getCanSort()&&!i.isPlaceholder&&t("div",{className:"w-full justify-start py-1 inline-flex items-center gap-1 body-sm",children:t(X,{header:i})}),i.column.getCanSort()&&l(S,{variant:"ghost",className:"w-full justify-start p-1",onPress:i.column.getToggleSortingHandler(),children:[t("span",{children:t(X,{header:i})}),t(Y,{direction:i.column.getIsSorted()})]})]},i.id))},a.id))}),t(nt,{children:n.getRowModel().rows.map(a=>t(K,{className:x("transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20"),"data-selected":a.getIsSelected(),children:a.getVisibleCells().map(i=>t(rt,{className:r(i.column.id===T,void 0,"z-1"),children:L(i.column.columnDef.cell,i.getContext())},i.id))},a.id))})]})}const un=["eq","ne","cn","nc","sw","ew","in","nin","gt","gte","lt","lte"],pt={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"};function ft(e,n){const r=`${n}-${Date.now()}`,a=ee[e][0];switch(e){case"bool":return{id:r,type:e,property:n,operator:a,value:!0};case"string":return{id:r,type:e,property:n,operator:a,value:""};case"date":return{id:r,type:e,property:n,operator:a,value:new Date().toISOString()};case"id":return{id:r,type:e,property:n,operator:a,value:""};case"id-search":return{id:r,type:e,property:n,operator:a,value:[]};case"enum":return{id:r,type:e,property:n,operator:a,value:new Set};case"number":return{id:r,type:e,property:n,operator:a,value:0}}}const ee={bool:["eq"],enum:["in","nin"],id:["in","nin"],"id-search":["in","nin"],string:["eq","ne","cn","nc","sw","ew","in","nin"],date:["lt","gt"],number:["eq","ne","gt","gte","lt","lte"]};function ht({className:e,...n}){const{filters:r,query:a,setFilters:i,filterConfig:m}=C(),s=ce(null),u=$(),d=De({defaultValues:{filters:r},onSubmit:({value:g})=>{i(g.filters)}}),v=Object.keys(m).sort();return t("section",{...n,className:x("flex gap-icon items-center",e),children:l(Ae,{onOpenChange:g=>{g?s.current?.focus():d.handleSubmit()},children:[l("div",{className:"relative",children:[r.length>0&&t("div",{className:"size-2 rounded-full absolute bg-primary/90 z-20 top-0 right-0 translate-x-0.5 -translate-y-0.5"}),t(S,{"aria-label":"Filter",isDisabled:a.isPending||v.length===0,type:"button",size:"icon",variant:"neutral",children:t(Ue,{})})]}),t(Pe,{className:"w-full p-icon",children:t("form",{onSubmit:g=>{g.preventDefault()},className:"flex flex-col gap-icon max-h-table overflow-auto ",children:t(d.Field,{mode:"array",name:"filters",children:g=>l(y,{children:[g.state.value.map((c,f)=>l("div",{className:"flex gap-icon items-center justify-normal",children:[t("span",{className:"body-sm",children:u(c.property)}),t(d.AppField,{name:`filters[${f}].operator`,children:p=>t(p.TfSingleSelect,{items:ee[c.type].map(b=>({id:b,label:t(y,{children:pt[b]})}))})},c.id),c.type==="bool"&&t(d.AppField,{name:`filters[${f}].value`,children:p=>t(p.TfCheckbox,{autoFocus:!0})}),c.type==="date"&&t(d.AppField,{name:`filters[${f}].value`,children:p=>t(Te,{autoFocus:!0})}),c.type==="id"&&t(d.AppField,{name:`filters[${f}].value`,children:p=>t(p.TfTextField,{autoFocus:!0})}),c.type==="string"&&t(d.AppField,{name:`filters[${f}].value`,children:p=>t(p.TfTextField,{autoFocus:!0})}),c.type==="number"&&t(d.AppField,{name:`filters[${f}].value`,children:p=>t(p.TfNumberField,{autoFocus:!0})}),c.type==="enum"&&t(d.AppField,{name:`filters[${f}].value`,children:p=>{const b=m[c.property];return b.type!=="enum"?null:t(p.TfMultiSelect,{items:b.options})}}),c.type==="id-search"&&t(d.AppField,{name:`filters[${f}].value`,children:p=>{const b=m[c.property];return b.type!=="id-search"?null:t(We,{resource:b.resource,accessor:b.accessor,searchFn:b.searchFn})}}),t(S,{type:"button",variant:"neutral",size:"icon",onPress:()=>g.removeValue(f),children:t(j,{})})]},c.id)),l("div",{className:"flex w-full items-center justify-end gap-2 not-first:mt-icon",children:[t(E,{label:"Add filter",autoFocus:!0,children:v.sort().map(c=>{const f=m[c].type,p=bt[f];return l(R,{onAction:()=>{const b=ft(f,c);g.pushValue(b)},children:[u(c),t(p,{})]},c)})}),g.state.value.length>0?l(S,{type:"button",variant:"neutral",onPress:()=>{g.setValue([])},children:[t(j,{}),"Reset"]}):null]})]})})})})]})})}const bt={"id-search":Ge,bool:B,date:Qe,enum:Ke,id:Be,number:je,string:B};export{pt as C,ht as D,cn as DataTable,J as DataTableContext,sn as DataTableProvider,un as F,on as getTableCallback,C as useDataTable,ln as useDataTableState};
1
+ "use client";import{jsx as t,Fragment as x,jsxs as c}from"react/jsx-runtime";import{createContext as me,useState as D,useMemo as ge,useEffect as pe,useContext as fe,useId as he,useRef as be}from"react";import{Button as C}from"./button.js";import{useSensors as Se,useSensor as U,PointerSensor as ye,KeyboardSensor as ve,DndContext as Ce,closestCenter as we,DragOverlay as Ie}from"@dnd-kit/core";import{sortableKeyboardCoordinates as xe,SortableContext as Ne,verticalListSortingStrategy as Te,arrayMove as Fe,useSortable as Ae}from"@dnd-kit/sortable";import{CSS as De}from"@dnd-kit/utilities";import{useQuery as Y,keepPreviousData as Pe}from"@tanstack/react-query";import{createColumnHelper as ee,useReactTable as Re,getCoreRowModel as Me,flexRender as $}from"@tanstack/react-table";import{useLocalStorage as K}from"@uidotdev/usehooks";import{merge as Oe}from"lodash-es";import{Badge as _e}from"./badge.js";import{TfDatePicker as ze}from"./date-picker.js";import{EasyMenu as V,MenuItem as _,Menu as Le}from"./menu.js";import{PopoverTrigger as te,Popover as Ee}from"./popover.js";import{useAppForm as qe}from"../utilities/form-hook.js";import{useResourceFormatter as B,RESOURCE_ENDPOINT_MAP as je}from"../utilities/resources.js";import{classNames as v}from"../utilities/theme.js";import{IcInfo as $e,IcMoreVertical as ke,IcRefresh as Ve,IcColumns as Be,IcGrip as He,IcFirst as Ue,IcLeft as Ke,IcRight as Qe,IcLast as Ge,IcSortAsc as We,IcSortDesc as Xe,IcSortNone as Ze,IcFilter as Je,IcRemove as Q,IcCheck as G,IcMinus as Ye,IcAccount as et,IcLicense as tt,IcDate as nt,IcFile as rt}from"./icons.js";import{Select as at,Autocomplete as it}from"react-aria-components";import ot from"openapi-fetch";import"./dialog.js";import"./toast.js";import{Loader as ne}from"./loader.js";import{SearchField as re}from"./searchfield.js";import{getFieldErrorMessage as q}from"../utilities/form.js";import{useFieldContext as ae}from"../utilities/form-context.js";import{FormField as lt}from"./form.js";import{SelectTrigger as st,SelectPopover as ct}from"./select.js";import{DialogMenu as ut}from"./dialog-menu.js";import{Table as dt,TableHeader as mt,TableRow as W,TableHead as gt,TableBody as pt,TableCell as ft}from"./table.js";import{CountryName as ht}from"../utilities/countries.js";import{formatDate as bt}from"../utilities/date.js";import{formatDays as St,formatFilesize as yt,formatNumber as vt}from"../utilities/numbers.js";import{Checkbox as X}from"./checkbox.js";import{TableActions as Ct}from"./table-actions.js";import"class-variance-authority";import"clsx";import"@internationalized/date";import"./calendar.js";import"./datefield.js";import"./list-box.js";import"@tanstack/react-form";import"./multi-select.js";import"./numberfield.js";import"./textfield.js";import"../utilities/string.js";import"react-dom";import"./alert.js";import"./dialog-action-utils.js";import"./select-options.js";import"zod";import"../utilities/duration.js";function kn(e){const r=async(a,i,g,l)=>{const u={...l,page:a.pageIndex+1,limit:a.pageSize,sort:wt(i[0]),search:g},f=await e(u);return{total:Number.parseInt(f.response.headers.get("Pagination-Count")||"0"),data:f.data}},n=ee();return{callback:r,columnHelper:n}}function wt(e){return e?e.desc?`-${e.id}`:`+${e.id}`:"-createdAt"}const z=ee(),It=[z.accessor("checkbox",{header:({table:e})=>t(X,{isIndeterminate:e.getIsSomeRowsSelected()&&!e.getIsAllPageRowsSelected(),isSelected:e.getIsAllPageRowsSelected()||e.getIsSomePageRowsSelected(),onChange:()=>e.toggleAllPageRowsSelected(),"aria-label":"Select all"}),cell:({row:e})=>t(X,{isSelected:e.getIsSelected(),onChange:()=>e.toggleSelected(),"aria-label":"Select row"}),enableSorting:!1,enableHiding:!1})],xt=[z.accessor("id",{header:"ID",meta:{displayType:"string"}})],Nt=[z.accessor("createdAt",{header:"Creation Date",meta:{displayType:"date"},enableHiding:!1}),z.accessor("updatedAt",{header:"Last Updated",meta:{displayType:"date"},enableHiding:!1})],I="TableActions",Tt=e=>e.length===0?[]:[z.accessor(I,{header:"Actions",id:I,enableHiding:!1,cell:({row:r})=>t(ut,{label:t(ke,{}),data:r.original,items:e}),enableSorting:!1})];function Vn({resourceName:e,columns:r,callback:n,filterConfig:a,columnsToHideByDefault:i={},allowSelection:g=!1,initialFilters:l=[],tableActions:u,rowActions:f}){const[d,y]=D({pagination:{pageIndex:0,pageSize:20},sorting:[]}),[m,s]=D({}),[h,p]=D(""),[b,P]=K(`${e}_ctx_column_order_preference`,[]),[T,j]=K(`${e}_ctx_column_visibility_preference`,{id:!1,...i}),[F,L]=D(l),A=ge(()=>F.map(o=>Array.isArray(o.value)?{[o.property]:{[o.operator]:o.value.join(",")}}:{[o.property]:{[o.operator]:o.value}}).reduce((o,O)=>Oe(o,O),{}),[F]),R=o=>{y(O=>({...O,...o}))},{sorting:S,pagination:w}=d,E=Y({queryKey:[e,w,S,h,A],queryFn:()=>n(w,S,h,A),placeholderData:Pe,retry:0,refetchOnWindowFocus:!1}),ue=[...g?It:[],...xt,...r,...Nt,...Tt(f??[])];function de(o){return typeof o=="function"}function M(o,O){return de(o)?o(O):o}const H=Re({data:E.data?.data??[],columns:ue,getCoreRowModel:Me(),rowCount:E.data?.total,manualPagination:!0,onPaginationChange:o=>{R({pagination:M(o,w)})},manualSorting:!0,onSortingChange:o=>{s({}),R({sorting:[...M(o,S)]})},manualFiltering:!0,onColumnVisibilityChange:o=>{j(M(o,T))},onRowSelectionChange:o=>{s(M(o,m))},onColumnOrderChange:o=>{P(M(o,b))},state:{sorting:S,columnVisibility:T,pagination:w,rowSelection:m,columnOrder:b},meta:{refetch:E.refetch}});return pe(()=>{P([...H.getAllLeafColumns().map(o=>o.id)])},[]),{tableState:d,updateTableState:R,query:E,setSearchQuery:p,searchQuery:h,tanTable:H,mergedFilters:A,filters:F,setFilters:L,filterConfig:a,tableActions:u}}const ie=me(null);function N(){const e=fe(ie);if(!e)throw Error("DataTable should be used within DataTableProvider.");return e}function Bn({children:e,...r}){return t(ie.Provider,{value:r,children:e})}function Hn({className:e,...r}){const{query:n,tanTable:a}=N();return t(x,{children:c("section",{...r,className:v("flex flex-col bg-elevation-1",e),children:[t(Pt,{}),c("div",{className:"w-full overflow-auto border-x h-table relative",tabIndex:0,children:[n.isLoading&&t(Z,{className:"cursor-wait",children:t(ne,{})}),!n.isLoading&&a.getRowModel().rows.length===0&&t(Z,{className:"cursor-not-allowed",children:!n.isFetching&&(n.isError?c("span",{className:"flex gap-3 justify-center items-center",children:[t($e,{}),t("span",{children:n.error.message})]}):n.data?.data?.length===0?t(x,{children:"No results found."}):t(x,{children:"Unknown error. Please contact customer support."}))}),!n.isLoading&&a.getRowModel().rows.length!==0&&t(Mt,{className:"w-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:[t(Ft,{}),t(Dt,{})]}),t(At,{})]})]})})}function Z({children:e,className:r}){return c(x,{children:[t("span",{className:v(r,"absolute top-0 bg-elevation-1 text-foreground z-20 size-full body-sm flex items-center justify-center"),children:e}),t("span",{className:"relative h-full w-0 block"})]})}function Ft(){const{tanTable:e}=N(),[r,n]=D(null),a=B(),i=Se(U(ye),U(ve,{coordinateGetter:xe}));return t(Ce,{sensors:i,collisionDetection:we,onDragStart:l=>{const{active:u}=l;n(u.id.toString())},onDragEnd:l=>{const{active:u,over:f}=l;if(f&&u.id!==f.id){const d=e.getState().columnOrder,y=d.indexOf(u.id.toString()),m=d.indexOf(f.id.toString());e.setColumnOrder([...Fe(d,y,m)])}n(null)},children:c(Ne,{items:e.getState().columnOrder,strategy:Te,children:[c(V,{label:c(x,{children:[t(Be,{className:"inline align-bottom me-1"}),"Columns"]}),selectionMode:"multiple",items:e.getAllFlatColumns(),selectedKeys:e.getVisibleFlatColumns().map(l=>l.id),children:[t(_,{onAction:()=>e.toggleAllColumnsVisible(),className:"italic",children:"(select all)"}),e.getState().columnOrder.map(l=>{const u=e.getAllFlatColumns().find(f=>f.id===l);return!u||u.id==="checkbox"||u.id===I?null:t(g,{column:u},u.id)})]}),t(Ie,{children:r?t("div",{className:"opacity-70 border-2 border-primary",children:a(r)}):null})]})});function g({column:l}){const{attributes:u,listeners:f,setNodeRef:d,transform:y,transition:m}=Ae({id:l.id}),s={transform:De.Transform.toString(y),transition:m,zIndex:"999"};return c(_,{ref:d,style:s,...u,id:l.id,onAction:()=>l.toggleVisibility(),isDisabled:!l.getCanHide(),className:"flex items-center",children:[t(He,{...f,className:"size-icon cursor-grab"}),k(l),l.getIsSorted()&&t(oe,{className:"size-icon",direction:l.getIsSorted()})]})}}function At(){const{tanTable:e,query:r}=N(),n=r.data?.total??0;return c("div",{className:"flex items-center gap-2",children:[t("span",{className:"whitespace-nowrap body-sm text-muted",children:`${e.getState().pagination.pageIndex*e.getState().pagination.pageSize+1} - ${Math.min((e.getState().pagination.pageIndex+1)*e.getState().pagination.pageSize,n)} of ${n?.toLocaleString()}`}),t(C,{"aria-label":"First page",onPress:()=>e.firstPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(Ue,{})}),t(C,{"aria-label":"Previous page",onPress:()=>e.previousPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(Ke,{})}),t(C,{"aria-label":"Next page",onPress:()=>e.nextPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t(Qe,{})}),t(C,{"aria-label":"Last page",onClick:()=>e.lastPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t(Ge,{})})]})}function Dt(){const{tanTable:e}=N(),r=[10,20,30,40,50];return t(V,{label:e.getState().pagination.pageSize.toString(),selectionMode:"single",selectedKeys:[e.getState().pagination.pageSize.toString()],items:r.map(n=>({id:n.toString(),value:n})),children:n=>t(_,{onAction:()=>e.setPageSize(n.value),children:n.value})})}function Pt(){const{query:e,tanTable:r,searchQuery:n,setSearchQuery:a,tableActions:i}=N(),g=r.getSelectedRowModel().rows.length>0,l=r.getSelectedRowModel().rows.map(f=>f.original),u=i.filter(f=>f.bulk===g);return c("section",{className:"flex bg-elevation-1 justify-between my-0 p-icon border gap-icon overflow-auto",children:[c("div",{className:"flex gap-icon",children:[t(C,{"aria-label":"Refresh",isPending:e.isFetching,onClick:()=>e.refetch(),variant:"neutral",size:"icon",children:t(Ve,{})}),t(Ct,{items:u,rowsSelected:l,isFetching:e.isFetching})]}),c("div",{className:"flex gap-icon",children:[t($t,{}),t(re,{value:n,onChange:a})]})]})}function oe({direction:e,...r}){return e==="asc"?t(We,{className:"size-3.5",...r}):e==="desc"?t(Xe,{className:"size-3.5",...r}):t(Ze,{className:"size-3.5",...r})}function k(e){const r=B(),n=e.columnDef.header;return typeof n=="string"?n:r(e.id)}function Rt(e){const r=e.column.columnDef.meta?.displayType,n=e.getValue();if(n==null)return null;switch(r){case"date":return bt(n);case"number":return vt(n);case"boolean":case"badge":return t(_e,{className:"uppercase w-full",children:String(n)});case"country":return t(ht,{value:n});case"enum":return t("span",{className:"uppercase w-full",children:String(n)});case"fileSize":return yt(n);case"days":return St(n);default:return String(n)}}function J({header:e}){const r=e.column.columnDef.header;return typeof r=="string"||!r?k(e.column):typeof r=="function"?typeof r(e.getContext())=="string"?k(e.column):$(r,e.getContext()):$(r,e.getContext())}function Mt({className:e}){const{tanTable:r}=N(),n=(a,i,g="z-50")=>v("px-icon py-2 text-left body-sm font-medium whitespace-nowrap",a&&`bg-elevation-1 sticky right-0 ${g} text-center justify-center`,i);return c(dt,{className:v("table-auto",e),children:[t(mt,{className:"sticky top-0 z-10",children:r.getHeaderGroups().map(a=>t(W,{children:a.headers.map(i=>c(gt,{scope:"col",colSpan:i.colSpan,className:n(i.id===I,"bg-elevation-1"),children:[!i.column.getCanSort()&&!i.isPlaceholder&&t("div",{className:v("w-full py-1 inline-flex items-center gap-1 body-sm",i.id===I?"justify-center":"justify-start"),children:t(J,{header:i})}),i.column.getCanSort()&&c(C,{variant:"ghost",className:v("w-full p-1",i.id===I?"justify-center":"justify-start"),onPress:i.column.getToggleSortingHandler(),children:[t("span",{children:t(J,{header:i})}),t(oe,{direction:i.column.getIsSorted()})]})]},i.id))},a.id))}),t(pt,{children:r.getRowModel().rows.map(a=>t(W,{className:v("transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20"),"data-selected":a.getIsSelected(),children:a.getVisibleCells().map(i=>{const g=i.column.id===I,l=i.column.columnDef.meta?.displayType?Rt(i):$(i.column.columnDef.cell,i.getContext());return t(ft,{className:v(n(g,void 0,"z-1"),g&&"flex justify-center items-center"),children:l},i.id)})},a.id))})]})}const le=ot({baseUrl:"https://api.dev.cryptlex.com"}),Ot={async onRequest({request:e}){return e},async onResponse({response:e}){if(!e.ok)throw await e.json();return e}};le.use(Ot);function _t(e){return Array.isArray(e)&&e.every(r=>r&&typeof r=="object"&&"id"in r&&"name"in r)}function se({label:e,description:r,errorMessage:n,requiredIndicator:a,isDisabled:i,isInvalid:g,onBlur:l,resource:u,onChange:f,value:d,renderLabel:y,accessor:m,defaultParams:s,className:h,...p}){if(u==="profile")throw Error('Resource "profile" is not supported with IdSearch since it is not a searchable resource.');const b=he(),P=p.id||b,[T,j]=D(""),{data:F,isError:L,isFetching:A,error:R}=Y({queryKey:[u,"id",T],queryFn:async()=>{const w=(await le.GET(je[u],{params:{query:{search:T,...s?.query},path:{...s?.path}}})).data;return w&&_t(w)?w:[]}});return t("div",{className:"group form-field","data-invalid":g?"":void 0,children:t(lt,{label:e,description:r,errorMessage:n,requiredIndicator:a,htmlFor:P,children:t(at,{isInvalid:g,children:c(te,{onOpenChange:S=>{S||l?.(d)},children:[t(st,{id:P,isDisabled:i,className:h??"w-full",children:y(d,F)}),t(ct,{placement:"bottom start",children:c(it,{inputValue:T,onInputChange:j,children:[t(re,{className:"p-2",autoFocus:!0}),A&&t("div",{className:"p-input",children:t(ne,{className:"mx-auto"})}),!A&&!L&&t(Le,{...p,className:"max-h-48",items:F,renderEmptyState:()=>t("div",{className:"body-sm p-2",children:"No results found."}),children:S=>t(_,{id:S[m],children:S.name},S[m])}),L&&t("div",{className:"text-destructive p-icon body-sm",children:R.message})]})})]})})})})}function zt({...e}){return t(se,{selectedKeys:[e.value],onSelectionChange:r=>e.onChange(Array.from(r).filter(n=>typeof n=="string")[0]),renderLabel:(r,n)=>n?.find(a=>a.id===r)?.name??r,selectionMode:"single",...e})}function Lt({...e}){return t(se,{selectedKeys:e.value,onSelectionChange:r=>e.onChange(Array.from(r).filter(n=>typeof n=="string")),selectionMode:"multiple",renderLabel:(r,n)=>r?.map(a=>n?.find(i=>i.id===a)?.name??a).join(","),...e})}function Un({isDisabled:e,...r}){const n=ae({disabled:e});return t(zt,{...r,isDisabled:e||n.form.state.isSubmitting,value:n.state.value,onBlur:a=>n.handleBlur(),onChange:a=>n.handleChange(a),isInvalid:!!q(n),errorMessage:q(n)})}function Et({isDisabled:e,...r}){const n=ae({disabled:e});return t(Lt,{...r,isDisabled:e||n.form.state.isSubmitting,value:n.state.value,onBlur:a=>n.handleBlur(),onChange:a=>n.handleChange(a),isInvalid:!!q(n),errorMessage:q(n)})}const Kn=["eq","ne","cn","nc","sw","ew","in","nin","gt","gte","lt","lte"],qt={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"};function jt(e,r){const n=`${r}-${Date.now()}`,a=ce[e][0];switch(e){case"bool":return{id:n,type:e,property:r,operator:a,value:!0};case"string":return{id:n,type:e,property:r,operator:a,value:""};case"date":return{id:n,type:e,property:r,operator:a,value:new Date().toISOString()};case"id":return{id:n,type:e,property:r,operator:a,value:""};case"id-search":return{id:n,type:e,property:r,operator:a,value:[]};case"enum":return{id:n,type:e,property:r,operator:a,value:new Set};case"number":return{id:n,type:e,property:r,operator:a,value:0}}}const ce={bool:["eq"],enum:["in","nin"],id:["in","nin"],"id-search":["in","nin"],string:["eq","ne","cn","nc","sw","ew","in","nin"],date:["lt","gt"],number:["eq","ne","gt","gte","lt","lte"]};function $t({className:e,...r}){const{filters:n,query:a,setFilters:i,filterConfig:g}=N(),l=be(null),u=B(),d=qe({defaultValues:{filters:n},onSubmit:({value:m})=>{i(m.filters)}}),y=Object.keys(g).sort();return t("section",{...r,className:v("flex gap-icon items-center",e),children:c(te,{onOpenChange:m=>{m?l.current?.focus():d.handleSubmit()},children:[c("div",{className:"relative",children:[n.length>0&&t("div",{className:"size-2 rounded-full absolute bg-primary/90 z-20 top-0 right-0 translate-x-0.5 -translate-y-0.5"}),t(C,{"aria-label":"Filter",isDisabled:a.isPending||y.length===0,type:"button",size:"icon",variant:"neutral",children:t(Je,{})})]}),t(Ee,{className:"w-full p-icon",children:t("form",{onSubmit:m=>{m.preventDefault()},className:"flex flex-col gap-icon max-h-table overflow-auto ",children:t(d.Field,{mode:"array",name:"filters",children:m=>c(x,{children:[m.state.value.map((s,h)=>c("div",{className:"flex gap-icon items-center justify-normal",children:[t("span",{className:"body-sm",children:u(s.property)}),t(d.AppField,{name:`filters[${h}].operator`,children:p=>t(p.TfSingleSelect,{items:ce[s.type].map(b=>({id:b,label:t(x,{children:qt[b]})}))})},s.id),s.type==="bool"&&t(d.AppField,{name:`filters[${h}].value`,children:p=>t(p.TfCheckbox,{autoFocus:!0})}),s.type==="date"&&t(d.AppField,{name:`filters[${h}].value`,children:p=>t(ze,{autoFocus:!0})}),s.type==="id"&&t(d.AppField,{name:`filters[${h}].value`,children:p=>t(p.TfTextField,{autoFocus:!0})}),s.type==="string"&&t(d.AppField,{name:`filters[${h}].value`,children:p=>t(p.TfTextField,{autoFocus:!0})}),s.type==="number"&&t(d.AppField,{name:`filters[${h}].value`,children:p=>t(p.TfNumberField,{autoFocus:!0})}),s.type==="enum"&&t(d.AppField,{name:`filters[${h}].value`,children:p=>{const b=g[s.property];return b.type!=="enum"?null:t(p.TfMultiSelect,{items:b.options})}}),s.type==="id-search"&&t(d.AppField,{name:`filters[${h}].value`,children:p=>{const b=g[s.property];return b.type!=="id-search"?null:t(Et,{resource:b.resource,accessor:b.accessor})}}),t(C,{type:"button",variant:"neutral",size:"icon",onPress:()=>m.removeValue(h),children:t(Q,{})})]},s.id)),c("div",{className:"flex w-full items-center justify-end gap-2 not-first:mt-icon",children:[t(V,{label:"Add filter",autoFocus:!0,children:y.sort().map(s=>{const h=g[s].type,p=kt[h];return c(_,{onAction:()=>{const b=jt(h,s);m.pushValue(b)},children:[u(s),t(p,{})]},s)})}),m.state.value.length>0?c(C,{type:"button",variant:"neutral",onPress:()=>{m.setValue([])},children:[t(Q,{}),"Reset"]}):null]})]})})})})]})})}const kt={"id-search":rt,bool:G,date:nt,enum:tt,id:et,number:Ye,string:G};export{qt as C,$t as D,Hn as DataTable,ie as DataTableContext,Bn as DataTableProvider,Kn as F,Lt as M,zt as S,Un as T,Et as a,kn as getTableCallback,N as useDataTable,Vn as useDataTableState};
2
2
  //# sourceMappingURL=data-table.js.map