@cryptlex/web-components 6.6.6-alpha75 → 6.6.6-alpha76

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.
@@ -1,2 +1,2 @@
1
- import{jsxs as n,jsx as s}from"react/jsx-runtime";import{cva as a}from"class-variance-authority";import{classNames as u}from"../utilities/theme.js";import{IcInfo as d,IcCheck as m,IcError as l}from"./icons.js";import"clsx";import"react";const f=a("transition-colors border p-2 text-foreground body inline-flex items-start gap-2",{variants:{variant:{destructive:"bg-destructive-foreground/20 text-destructive border-destructive",success:"bg-success-foreground/20 text-success border-success",muted:"bg-muted-foreground/20 text-muted border-muted"}},defaultVariants:{variant:"muted"}}),b=e=>{switch(e){case"destructive":return l;case"success":return m;case"muted":case void 0:default:return d}};function k({children:e,className:c,variant:t,icon:o,...i}){const r=o??b(t);return n("div",{role:"alert",className:u(f({variant:t}),c),...i,children:[r&&s(r,{className:"inline-block size-icon mt-1 shrink-0"}),s("span",{className:"inline-block flex-1 min-w-0 mt-0",children:e})]})}export{k as Alert,f as alertVariants};
1
+ import{jsxs as i,jsx as s}from"react/jsx-runtime";import{cva as a}from"class-variance-authority";import{classNames as u}from"../utilities/theme.js";import{IcInfo as d,IcCheck as m,IcError as l}from"./icons.js";import"clsx";import"react";const f=a("rounded-md transition-colors border py-icon px-input body-sm inline-flex items-center gap-icon",{variants:{variant:{destructive:"bg-destructive text-destructive-foreground border-destructive",success:"bg-success text-success-foreground border-success",muted:"bg-muted text-muted-foreground border-muted"}},defaultVariants:{variant:"muted"}}),p=e=>{switch(e){case"destructive":return l;case"success":return m;case"muted":case void 0:default:return d}};function k({children:e,className:c,variant:r,icon:o,...n}){const t=o??p(r);return i("div",{role:"alert",className:u(f({variant:r}),c),...n,children:[t&&s(t,{className:"inline-block size-icon shrink-0"}),s("span",{className:"inline-block flex-1 min-w-0 mt-0",children:e})]})}export{k as Alert,f as alertVariants};
2
2
  //# sourceMappingURL=alert.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"alert.js","sources":["../../lib/components/alert.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport React from 'react';\nimport { classNames } from '../utilities/theme';\nimport type { CtxIcon } from './icons';\nimport { IcCheck, IcError, IcInfo } from './icons';\n\nexport const alertVariants = cva(`transition-colors border p-2 text-foreground body inline-flex items-start gap-2`, {\n variants: {\n variant: {\n destructive: 'bg-destructive-foreground/20 text-destructive border-destructive',\n success: 'bg-success-foreground/20 text-success border-success',\n muted: 'bg-muted-foreground/20 text-muted border-muted',\n },\n },\n defaultVariants: {\n variant: 'muted',\n },\n});\n\n// Default icons for each variant\nconst getDefaultIcon = (variant: string | null | undefined): CtxIcon | null => {\n switch (variant) {\n case 'destructive':\n return IcError;\n case 'success':\n return IcCheck;\n case 'muted':\n case undefined:\n default:\n return IcInfo;\n }\n};\nexport function Alert({\n children,\n className,\n variant,\n icon,\n ...props\n}: React.ComponentProps<'div'> &\n VariantProps<typeof alertVariants> & {\n icon?: CtxIcon;\n }) {\n // Overrides the default icon with the provided icon\n const Icon = icon ?? getDefaultIcon(variant);\n\n return (\n <div role=\"alert\" className={classNames(alertVariants({ variant }), className)} {...props}>\n {Icon && <Icon className=\"inline-block size-icon mt-1 shrink-0\" />}\n <span className=\"inline-block flex-1 min-w-0 mt-0\">{children}</span>\n </div>\n );\n}\n"],"names":["alertVariants","cva","getDefaultIcon","variant","IcError","IcCheck","IcInfo","Alert","children","className","icon","props","Icon","jsxs","classNames","jsx"],"mappings":"6OAMO,MAAMA,EAAgBC,EAAI,kFAAmF,CAChH,SAAU,CACN,QAAS,CACL,YAAa,mEACb,QAAS,uDACT,MAAO,gDAAA,CACX,EAEJ,gBAAiB,CACb,QAAS,OAAA,CAEjB,CAAC,EAGKC,EAAkBC,GAAuD,CAC3E,OAAQA,EAAA,CACJ,IAAK,cACD,OAAOC,EACX,IAAK,UACD,OAAOC,EACX,IAAK,QACL,KAAK,OACL,QACI,OAAOC,CAAA,CAEnB,EACO,SAASC,EAAM,CAClB,SAAAC,EACA,UAAAC,EACA,QAAAN,EACA,KAAAO,EACA,GAAGC,CACP,EAGO,CAEH,MAAMC,EAAOF,GAAQR,EAAeC,CAAO,EAE3C,OACIU,EAAC,MAAA,CAAI,KAAK,QAAQ,UAAWC,EAAWd,EAAc,CAAE,QAAAG,CAAA,CAAS,EAAGM,CAAS,EAAI,GAAGE,EAC/E,SAAA,CAAAC,GAAQG,EAACH,EAAA,CAAK,UAAU,sCAAA,CAAuC,EAChEG,EAAC,OAAA,CAAK,UAAU,mCAAoC,SAAAP,CAAA,CAAS,CAAA,EACjE,CAER"}
1
+ {"version":3,"file":"alert.js","sources":["../../lib/components/alert.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport React from 'react';\nimport { classNames } from '../utilities/theme';\nimport type { CtxIcon } from './icons';\nimport { IcCheck, IcError, IcInfo } from './icons';\n\nexport const alertVariants = cva(\n `rounded-md transition-colors border py-icon px-input body-sm inline-flex items-center gap-icon`,\n {\n variants: {\n variant: {\n destructive: 'bg-destructive text-destructive-foreground border-destructive',\n success: 'bg-success text-success-foreground border-success',\n muted: 'bg-muted text-muted-foreground border-muted',\n },\n },\n defaultVariants: {\n variant: 'muted',\n },\n }\n);\n\n// Default icons for each variant\nconst getDefaultIcon = (variant: string | null | undefined): CtxIcon | null => {\n switch (variant) {\n case 'destructive':\n return IcError;\n case 'success':\n return IcCheck;\n case 'muted':\n case undefined:\n default:\n return IcInfo;\n }\n};\nexport function Alert({\n children,\n className,\n variant,\n icon,\n ...props\n}: React.ComponentProps<'div'> &\n VariantProps<typeof alertVariants> & {\n icon?: CtxIcon;\n }) {\n // Overrides the default icon with the provided icon\n const Icon = icon ?? getDefaultIcon(variant);\n\n return (\n <div role=\"alert\" className={classNames(alertVariants({ variant }), className)} {...props}>\n {Icon && <Icon className=\"inline-block size-icon shrink-0\" />}\n <span className=\"inline-block flex-1 min-w-0 mt-0\">{children}</span>\n </div>\n );\n}\n"],"names":["alertVariants","cva","getDefaultIcon","variant","IcError","IcCheck","IcInfo","Alert","children","className","icon","props","Icon","jsxs","classNames","jsx"],"mappings":"6OAMO,MAAMA,EAAgBC,EACzB,iGACA,CACI,SAAU,CACN,QAAS,CACL,YAAa,gEACb,QAAS,oDACT,MAAO,6CAAA,CACX,EAEJ,gBAAiB,CACb,QAAS,OAAA,CACb,CAER,EAGMC,EAAkBC,GAAuD,CAC3E,OAAQA,EAAA,CACJ,IAAK,cACD,OAAOC,EACX,IAAK,UACD,OAAOC,EACX,IAAK,QACL,KAAK,OACL,QACI,OAAOC,CAAA,CAEnB,EACO,SAASC,EAAM,CAClB,SAAAC,EACA,UAAAC,EACA,QAAAN,EACA,KAAAO,EACA,GAAGC,CACP,EAGO,CAEH,MAAMC,EAAOF,GAAQR,EAAeC,CAAO,EAE3C,OACIU,EAAC,MAAA,CAAI,KAAK,QAAQ,UAAWC,EAAWd,EAAc,CAAE,QAAAG,CAAA,CAAS,EAAGM,CAAS,EAAI,GAAGE,EAC/E,SAAA,CAAAC,GAAQG,EAACH,EAAA,CAAK,UAAU,iCAAA,CAAkC,EAC3DG,EAAC,OAAA,CAAK,UAAU,mCAAoC,SAAAP,CAAA,CAAS,CAAA,EACjE,CAER"}
@@ -1,2 +1,2 @@
1
- import{jsx as e}from"react/jsx-runtime";import{classNames as r}from"../utilities/theme.js";import"clsx";function m({className:n,children:t,...i}){return e("span",{className:r("text-muted leading-tight body-sm px-1 inline-flex items-center justify-center select-none border h-input focus:outline-hidden focus:ring-1 focus:ring-ring",n),...i,children:e("span",{children:t})})}export{m as Badge};
1
+ import{jsx as e}from"react/jsx-runtime";import{classNames as o}from"../utilities/theme.js";import"clsx";function l({className:n,children:i,...r}){return e("span",{className:o("leading-tight body-sm px-2 rounded-full inline-flex items-center justify-center select-none border h-input focus:outline-hidden focus:ring-1 focus:ring-ring",n),...r,children:e("span",{children:i})})}export{l as Badge};
2
2
  //# sourceMappingURL=badge.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"badge.js","sources":["../../lib/components/badge.tsx"],"sourcesContent":["import { classNames } from '../utilities/theme';\n\nexport function Badge({ className, children, ...props }: React.ComponentProps<'span'>) {\n return (\n <span\n className={classNames(\n 'text-muted leading-tight body-sm px-1 inline-flex items-center justify-center select-none border h-input focus:outline-hidden focus:ring-1 focus:ring-ring',\n className\n )}\n {...props}\n >\n {/* Contents */}\n <span>{children}</span>\n </span>\n );\n}\n"],"names":["Badge","className","children","props","jsx","classNames"],"mappings":"wGAEO,SAASA,EAAM,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,GAAuC,CACnF,OACIC,EAAC,OAAA,CACG,UAAWC,EACP,6JACAJ,CAAA,EAEH,GAAGE,EAGJ,SAAAC,EAAC,QAAM,SAAAF,CAAA,CAAS,CAAA,CAAA,CAG5B"}
1
+ {"version":3,"file":"badge.js","sources":["../../lib/components/badge.tsx"],"sourcesContent":["import { classNames } from '../utilities/theme';\n\nexport function Badge({ className, children, ...props }: React.ComponentProps<'span'>) {\n return (\n <span\n className={classNames(\n 'leading-tight body-sm px-2 rounded-full inline-flex items-center justify-center select-none border h-input focus:outline-hidden focus:ring-1 focus:ring-ring',\n className\n )}\n {...props}\n >\n {/* Contents */}\n <span>{children}</span>\n </span>\n );\n}\n"],"names":["Badge","className","children","props","jsx","classNames"],"mappings":"wGAEO,SAASA,EAAM,CAAE,UAAAC,EAAW,SAAAC,EAAU,GAAGC,GAAuC,CACnF,OACIC,EAAC,OAAA,CACG,UAAWC,EACP,+JACAJ,CAAA,EAEH,GAAGE,EAGJ,SAAAC,EAAC,QAAM,SAAAF,CAAA,CAAS,CAAA,CAAA,CAG5B"}
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as r,jsxs as u,Fragment as o}from"react/jsx-runtime";import{cva as p}from"class-variance-authority";import{Button as l,composeRenderProps as a}from"react-aria-components";import{classNames as d}from"../utilities/theme.js";import{Loader as f}from"./loader.js";import"clsx";import"./icons.js";import"react";const b=p("btn",{variants:{variant:{primary:"btn-primary",secondary:"btn-secondary",destructive:"btn-destructive",neutral:"btn-neutral",ghost:"btn-ghost",link:"btn-link"},size:{default:"input-dim",icon:"size-input",none:""}},defaultVariants:{variant:"neutral",size:"default"}});function k({className:n,variant:i,size:s,children:m,isPending:e,active:v,...c}){return r(l,{...c,className:a(n,t=>d(b({variant:i,size:s,className:t}),n)),children:a(m,t=>u(o,{children:[e&&r(f,{}),!e&&r(o,{children:t})]}))})}export{k as Button,b as buttonVariants};
1
+ "use client";import{jsx as r,jsxs as c,Fragment as o}from"react/jsx-runtime";import{cva as p}from"class-variance-authority";import{Button as d,composeRenderProps as a}from"react-aria-components";import{classNames as l}from"../utilities/theme.js";import{Loader as f}from"./loader.js";import"clsx";import"./icons.js";import"react";const b=p("btn",{variants:{variant:{primary:"btn-primary",secondary:"btn-secondary",destructive:"btn-destructive",neutral:"btn-neutral",ghost:"btn-ghost",link:"btn-link"},size:{default:"input-dim",icon:"size-input rounded-md",none:""}},defaultVariants:{variant:"neutral",size:"default"}});function k({className:n,variant:i,size:s,children:m,isPending:e,active:v,...u}){return r(d,{...u,className:a(n,t=>l(b({variant:i,size:s,className:t}),n)),children:a(m,t=>c(o,{children:[e&&r(f,{}),!e&&r(o,{children:t})]}))})}export{k as Button,b as buttonVariants};
2
2
  //# sourceMappingURL=button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"button.js","sources":["../../lib/components/button.tsx"],"sourcesContent":["'use client';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Button as AriaButton, composeRenderProps, type ButtonProps as AriaButtonProps } from 'react-aria-components';\nimport { classNames } from '../utilities/theme';\nimport { Loader } from './loader';\n\nexport const buttonVariants = cva('btn', {\n variants: {\n variant: {\n primary: 'btn-primary',\n secondary: 'btn-secondary',\n destructive: 'btn-destructive',\n neutral: 'btn-neutral',\n ghost: 'btn-ghost',\n link: 'btn-link',\n },\n size: {\n default: 'input-dim',\n icon: 'size-input',\n none: '',\n },\n },\n defaultVariants: {\n variant: 'neutral',\n size: 'default',\n },\n});\n\nexport type ButtonProps = AriaButtonProps &\n VariantProps<typeof buttonVariants> & {\n ref?: React.Ref<HTMLButtonElement>;\n active?: boolean;\n };\n\nexport function Button({\n className: additionalClasses,\n variant,\n size,\n children,\n isPending,\n active,\n ...props\n}: ButtonProps) {\n return (\n <AriaButton\n {...props}\n className={composeRenderProps(additionalClasses, className =>\n classNames(\n buttonVariants({\n variant,\n size,\n className,\n }),\n additionalClasses\n )\n )}\n >\n {composeRenderProps(children, children => (\n <>\n {isPending && <Loader />}\n {!isPending && <>{children}</>}\n </>\n ))}\n </AriaButton>\n );\n}\n"],"names":["buttonVariants","cva","Button","additionalClasses","variant","size","children","isPending","active","props","jsx","AriaButton","composeRenderProps","className","classNames","jsxs","Fragment","Loader"],"mappings":"yUAMO,MAAMA,EAAiBC,EAAI,MAAO,CACrC,SAAU,CACN,QAAS,CACL,QAAS,cACT,UAAW,gBACX,YAAa,kBACb,QAAS,cACT,MAAO,YACP,KAAM,UAAA,EAEV,KAAM,CACF,QAAS,YACT,KAAM,aACN,KAAM,EAAA,CACV,EAEJ,gBAAiB,CACb,QAAS,UACT,KAAM,SAAA,CAEd,CAAC,EAQM,SAASC,EAAO,CACnB,UAAWC,EACX,QAAAC,EACA,KAAAC,EACA,SAAAC,EACA,UAAAC,EACA,OAAAC,EACA,GAAGC,CACP,EAAgB,CACZ,OACIC,EAACC,EAAA,CACI,GAAGF,EACJ,UAAWG,EAAmBT,EAAmBU,GAC7CC,EACId,EAAe,CACX,QAAAI,EACA,KAAAC,EACA,UAAAQ,CAAA,CACH,EACDV,CAAA,CACJ,EAGH,SAAAS,EAAmBN,EAAUA,GAC1BS,EAAAC,EAAA,CACK,SAAA,CAAAT,KAAcU,EAAA,EAAO,EACrB,CAACV,GAAaG,EAAAM,EAAA,CAAG,SAAAV,CAAAA,CAAS,CAAA,EAC/B,CACH,CAAA,CAAA,CAGb"}
1
+ {"version":3,"file":"button.js","sources":["../../lib/components/button.tsx"],"sourcesContent":["'use client';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Button as AriaButton, composeRenderProps, type ButtonProps as AriaButtonProps } from 'react-aria-components';\nimport { classNames } from '../utilities/theme';\nimport { Loader } from './loader';\n\nexport const buttonVariants = cva('btn', {\n variants: {\n variant: {\n primary: 'btn-primary',\n secondary: 'btn-secondary',\n destructive: 'btn-destructive',\n neutral: 'btn-neutral',\n ghost: 'btn-ghost',\n link: 'btn-link',\n },\n size: {\n default: 'input-dim',\n icon: 'size-input rounded-md',\n none: '',\n },\n },\n defaultVariants: {\n variant: 'neutral',\n size: 'default',\n },\n});\n\nexport type ButtonProps = AriaButtonProps &\n VariantProps<typeof buttonVariants> & {\n ref?: React.Ref<HTMLButtonElement>;\n active?: boolean;\n };\n\nexport function Button({\n className: additionalClasses,\n variant,\n size,\n children,\n isPending,\n active,\n ...props\n}: ButtonProps) {\n return (\n <AriaButton\n {...props}\n className={composeRenderProps(additionalClasses, className =>\n classNames(\n buttonVariants({\n variant,\n size,\n className,\n }),\n additionalClasses\n )\n )}\n >\n {composeRenderProps(children, children => (\n <>\n {isPending && <Loader />}\n {!isPending && <>{children}</>}\n </>\n ))}\n </AriaButton>\n );\n}\n"],"names":["buttonVariants","cva","Button","additionalClasses","variant","size","children","isPending","active","props","jsx","AriaButton","composeRenderProps","className","classNames","jsxs","Fragment","Loader"],"mappings":"yUAMO,MAAMA,EAAiBC,EAAI,MAAO,CACrC,SAAU,CACN,QAAS,CACL,QAAS,cACT,UAAW,gBACX,YAAa,kBACb,QAAS,cACT,MAAO,YACP,KAAM,UAAA,EAEV,KAAM,CACF,QAAS,YACT,KAAM,wBACN,KAAM,EAAA,CACV,EAEJ,gBAAiB,CACb,QAAS,UACT,KAAM,SAAA,CAEd,CAAC,EAQM,SAASC,EAAO,CACnB,UAAWC,EACX,QAAAC,EACA,KAAAC,EACA,SAAAC,EACA,UAAAC,EACA,OAAAC,EACA,GAAGC,CACP,EAAgB,CACZ,OACIC,EAACC,EAAA,CACI,GAAGF,EACJ,UAAWG,EAAmBT,EAAmBU,GAC7CC,EACId,EAAe,CACX,QAAAI,EACA,KAAAC,EACA,UAAAQ,CAAA,CACH,EACDV,CAAA,CACJ,EAGH,SAAAS,EAAmBN,EAAUA,GAC1BS,EAAAC,EAAA,CACK,SAAA,CAAAT,KAAcU,EAAA,EAAO,EACrB,CAACV,GAAaG,EAAAM,EAAA,CAAG,SAAAV,CAAAA,CAAS,CAAA,EAC/B,CACH,CAAA,CAAA,CAGb"}
@@ -1,2 +1,2 @@
1
- "use client";import{jsxs as o,jsx as e}from"react/jsx-runtime";import{today as y,getLocalTimeZone as b}from"@internationalized/date";import{CalendarGridHeader as v,useLocale as N,Heading as S,CalendarGrid as G,CalendarHeaderCell as H,CalendarGridBody as R,RangeCalendarStateContext as $,CalendarCell as w,composeRenderProps as l,Calendar as z,RangeCalendar as B}from"react-aria-components";import{use as j}from"react";import{Button as c,buttonVariants as E}from"./button.js";import{classNames as n}from"../utilities/theme.js";import{FormFieldError as m}from"./form.js";import{IcRight as s,IcLeft as u}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";function f(a){let{direction:t}=N();return o("header",{className:"flex w-full items-center gap-1 px-1 pb-icon",...a,children:[e(c,{slot:"previous",size:"none",className:n("size-7 bg-transparent p-0 opacity-50","data-[hovered]:opacity-100"),children:t==="rtl"?e(s,{"aria-hidden":!0}):e(u,{"aria-hidden":!0})}),e(S,{className:"grow text-center body font-medium"}),e(c,{slot:"next",className:n("size-7 bg-transparent p-0 opacity-50","data-[hovered]:opacity-100"),children:t==="rtl"?e(u,{"aria-hidden":!0}):e(s,{"aria-hidden":!0})})]})}function g({className:a,...t}){return e(G,{className:n(" border-separate border-spacing-x-0 border-spacing-y-1 ",a),...t})}const C=v;function h({className:a,...t}){return e(H,{className:n("w-9 body-sm font-normal text-muted-foreground",a),...t})}function p({className:a,...t}){return e(R,{className:n("[&>tr>td]:p-0",a),...t})}function x({className:a,...t}){const i=!!j($);return e(w,{className:l(a,(d,r)=>n(E({variant:"ghost",size:"none"}),"relative flex size-9 items-center justify-center p-0 body-sm font-normal",r.isDisabled&&"text-muted-foreground opacity-50",r.isSelected&&"bg-primary text-primary-foreground data-[focused]:bg-primary data-[focused]:text-primary-foreground",r.isHovered&&r.isSelected&&(r.isSelectionStart||r.isSelectionEnd||!i)&&"data-[hovered]:bg-primary data-[hovered]:text-primary-foreground",r.isSelected&&i&&!r.isSelectionStart&&!r.isSelectionEnd&&"rounded-none bg-accent text-accent-foreground",r.isOutsideMonth&&"text-muted-foreground opacity-50 data-[selected]:bg-accent/50 data-[selected]:text-muted-foreground data-[selected]:opacity-30",r.date.compare(y(b()))===0&&!r.isSelected&&"bg-accent text-accent-foreground",r.isUnavailable&&"cursor-default text-destructive ",r.isInvalid&&"bg-destructive text-destructive-foreground data-[focused]:bg-destructive data-[hovered]:bg-destructive data-[focused]:text-destructive-foreground data-[hovered]:text-destructive-foreground",d)),...t})}function A({errorMessage:a,className:t,...i}){return o(z,{className:l(t,d=>n("w-fit",d)),...i,children:[e(f,{}),o(g,{children:[e(C,{children:d=>e(h,{children:d})}),e(p,{children:d=>e(x,{date:d})})]}),a&&e(m,{children:a})]})}function J({errorMessage:a,className:t,...i}){return o(B,{className:l(t,d=>n("w-fit",d)),...i,children:[e(f,{}),o(g,{children:[e(C,{children:d=>e(h,{children:d})}),e(p,{children:d=>e(x,{date:d})})]}),a&&e(m,{slot:"errorMessage",children:a})]})}export{A as Calendar,x as CalendarCell,g as CalendarGrid,p as CalendarGridBody,C as CalendarGridHeader,h as CalendarHeaderCell,f as CalendarHeading,J as RangeCalendar};
1
+ "use client";import{jsxs as o,jsx as e}from"react/jsx-runtime";import{today as b,getLocalTimeZone as v}from"@internationalized/date";import{CalendarGridHeader as y,useLocale as S,Heading as G,CalendarGrid as H,CalendarHeaderCell as N,CalendarGridBody as R,RangeCalendarStateContext as $,CalendarCell as w,composeRenderProps as l,Calendar as B,RangeCalendar as z}from"react-aria-components";import{use as E}from"react";import{Button as c,buttonVariants as I}from"./button.js";import{classNames as n}from"../utilities/theme.js";import{FormFieldError as m}from"./form.js";import{IcRight as s,IcLeft as u}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";function f(a){let{direction:t}=S();return o("header",{className:"flex w-full items-center gap-1 px-1 pb-icon",...a,children:[e(c,{slot:"previous",size:"icon",children:t==="rtl"?e(s,{"aria-hidden":!0}):e(u,{"aria-hidden":!0})}),e(G,{className:"grow text-center body font-medium"}),e(c,{slot:"next",size:"icon",children:t==="rtl"?e(u,{"aria-hidden":!0}):e(s,{"aria-hidden":!0})})]})}function g({className:a,...t}){return e(H,{className:n(" border-separate border-spacing-x-0 border-spacing-y-1 ",a),...t})}const C=y;function h({className:a,...t}){return e(N,{className:n("w-9 body-sm font-normal text-muted-foreground",a),...t})}function x({className:a,...t}){return e(R,{className:n("[&>tr>td]:p-0",a),...t})}function p({className:a,...t}){const i=!!E($);return e(w,{className:l(a,(d,r)=>n(I({variant:"ghost",size:"icon"}),r.isDisabled&&"text-muted-foreground opacity-50",r.isSelected&&"bg-primary text-primary-foreground data-[focused]:bg-primary data-[focused]:text-primary-foreground",r.isHovered&&r.isSelected&&(r.isSelectionStart||r.isSelectionEnd||!i)&&"data-[hovered]:bg-primary data-[hovered]:text-primary-foreground",r.isSelected&&i&&!r.isSelectionStart&&!r.isSelectionEnd&&"rounded-none bg-accent text-accent-foreground",r.isOutsideMonth&&"text-muted-foreground opacity-50 data-[selected]:bg-accent/50 data-[selected]:text-muted-foreground data-[selected]:opacity-30",r.date.compare(b(v()))===0&&!r.isSelected&&"bg-accent text-accent-foreground",r.isUnavailable&&"cursor-default text-destructive ",r.isInvalid&&"bg-destructive text-destructive-foreground data-[focused]:bg-destructive data-[hovered]:bg-destructive data-[focused]:text-destructive-foreground data-[hovered]:text-destructive-foreground",d)),...t})}function A({errorMessage:a,className:t,...i}){return o(B,{className:l(t,d=>n("w-fit",d)),...i,children:[e(f,{}),o(g,{children:[e(C,{children:d=>e(h,{children:d})}),e(x,{children:d=>e(p,{date:d})})]}),a&&e(m,{children:a})]})}function J({errorMessage:a,className:t,...i}){return o(z,{className:l(t,d=>n("w-fit",d)),...i,children:[e(f,{}),o(g,{children:[e(C,{children:d=>e(h,{children:d})}),e(x,{children:d=>e(p,{date:d})})]}),a&&e(m,{slot:"errorMessage",children:a})]})}export{A as Calendar,p as CalendarCell,g as CalendarGrid,x as CalendarGridBody,C as CalendarGridHeader,h as CalendarHeaderCell,f as CalendarHeading,J as RangeCalendar};
2
2
  //# sourceMappingURL=calendar.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"calendar.js","sources":["../../lib/components/calendar.tsx"],"sourcesContent":["'use client';\nimport { getLocalTimeZone, today } from '@internationalized/date';\nimport {\n Calendar as AriaCalendar,\n CalendarCell as AriaCalendarCell,\n CalendarCellProps as AriaCalendarCellProps,\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody as AriaCalendarGridBody,\n CalendarGridBodyProps as AriaCalendarGridBodyProps,\n CalendarGridHeader as AriaCalendarGridHeader,\n CalendarGridProps as AriaCalendarGridProps,\n CalendarHeaderCell as AriaCalendarHeaderCell,\n CalendarHeaderCellProps as AriaCalendarHeaderCellProps,\n CalendarProps as AriaCalendarProps,\n DateValue as AriaDateValue,\n Heading as AriaHeading,\n RangeCalendar as AriaRangeCalendar,\n RangeCalendarProps as AriaRangeCalendarProps,\n RangeCalendarStateContext as AriaRangeCalendarStateContext,\n composeRenderProps,\n useLocale,\n} from 'react-aria-components';\n\nimport { use } from 'react';\nimport { Button, buttonVariants } from '../components/button';\nimport { classNames } from '../utilities/theme';\nimport { FormFieldError } from './form';\nimport { IcLeft, IcRight } from './icons';\n\n/**\n * Calendar header with navigation buttons and month/year display.\n */\nexport function CalendarHeading(props: React.HTMLAttributes<HTMLElement>) {\n let { direction } = useLocale();\n\n return (\n <header className=\"flex w-full items-center gap-1 px-1 pb-icon\" {...props}>\n <Button\n slot=\"previous\"\n size=\"none\"\n className={classNames(\n 'size-7 bg-transparent p-0 opacity-50',\n /* Hover */\n 'data-[hovered]:opacity-100'\n )}\n >\n {direction === 'rtl' ? <IcRight aria-hidden /> : <IcLeft aria-hidden />}\n </Button>\n <AriaHeading className=\"grow text-center body font-medium\" />\n <Button\n slot=\"next\"\n className={classNames(\n 'size-7 bg-transparent p-0 opacity-50',\n /* Hover */\n 'data-[hovered]:opacity-100'\n )}\n >\n {direction === 'rtl' ? <IcLeft aria-hidden /> : <IcRight aria-hidden />}\n </Button>\n </header>\n );\n}\n\n/**\n * Grid container for calendar cells with proper spacing.\n */\nexport function CalendarGrid({ className, ...props }: AriaCalendarGridProps) {\n return (\n <AriaCalendarGrid\n className={classNames(' border-separate border-spacing-x-0 border-spacing-y-1 ', className)}\n {...props}\n />\n );\n}\n\nexport const CalendarGridHeader = AriaCalendarGridHeader;\n\n/**\n * Header cell displaying day of week abbreviation.\n */\nexport function CalendarHeaderCell({ className, ...props }: AriaCalendarHeaderCellProps) {\n return (\n <AriaCalendarHeaderCell\n className={classNames('w-9 body-sm font-normal text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\n/**\n * Body container for calendar date cells.\n */\nexport function CalendarGridBody({ className, ...props }: AriaCalendarGridBodyProps) {\n return <AriaCalendarGridBody className={classNames('[&>tr>td]:p-0', className)} {...props} />;\n}\n\n/**\n * Individual calendar date cell with selection, hover, and availability states.\n * Automatically adapts styling for range selection contexts.\n */\nexport function CalendarCell({ className, ...props }: AriaCalendarCellProps) {\n const isRange = Boolean(use(AriaRangeCalendarStateContext));\n return (\n <AriaCalendarCell\n className={composeRenderProps(className, (className, renderProps) =>\n classNames(\n buttonVariants({ variant: 'ghost', size: 'none' }),\n 'relative flex size-9 items-center justify-center p-0 body-sm font-normal',\n /* Disabled */\n renderProps.isDisabled && 'text-muted-foreground opacity-50',\n /* Selected */\n renderProps.isSelected &&\n 'bg-primary text-primary-foreground data-[focused]:bg-primary data-[focused]:text-primary-foreground',\n /* Hover */\n renderProps.isHovered &&\n renderProps.isSelected &&\n (renderProps.isSelectionStart || renderProps.isSelectionEnd || !isRange) &&\n 'data-[hovered]:bg-primary data-[hovered]:text-primary-foreground',\n /* Selection Start/End */\n renderProps.isSelected &&\n isRange &&\n !renderProps.isSelectionStart &&\n !renderProps.isSelectionEnd &&\n 'rounded-none bg-accent text-accent-foreground',\n /* Outside Month */\n renderProps.isOutsideMonth &&\n 'text-muted-foreground opacity-50 data-[selected]:bg-accent/50 data-[selected]:text-muted-foreground data-[selected]:opacity-30',\n /* Current Date */\n renderProps.date.compare(today(getLocalTimeZone())) === 0 &&\n !renderProps.isSelected &&\n 'bg-accent text-accent-foreground',\n /* Unavailable Date */\n renderProps.isUnavailable && 'cursor-default text-destructive ',\n renderProps.isInvalid &&\n 'bg-destructive text-destructive-foreground data-[focused]:bg-destructive data-[hovered]:bg-destructive data-[focused]:text-destructive-foreground data-[hovered]:text-destructive-foreground',\n className\n )\n )}\n {...props}\n />\n );\n}\n\ninterface CalendarProps<T extends AriaDateValue> extends AriaCalendarProps<T> {\n /** Error message to display below the calendar */\n errorMessage?: string;\n}\n\n/**\n * Calendar component for single date selection.\n *\n * @example Basic usage\n * ```tsx\n * <Calendar defaultValue={today(getLocalTimeZone())} />\n * ```\n */\nexport function Calendar<T extends AriaDateValue>({ errorMessage, className, ...props }: CalendarProps<T>) {\n return (\n <AriaCalendar className={composeRenderProps(className, className => classNames('w-fit', className))} {...props}>\n <CalendarHeading />\n <CalendarGrid>\n <CalendarGridHeader>{day => <CalendarHeaderCell>{day}</CalendarHeaderCell>}</CalendarGridHeader>\n <CalendarGridBody>{date => <CalendarCell date={date} />}</CalendarGridBody>\n </CalendarGrid>\n {errorMessage && <FormFieldError>{errorMessage}</FormFieldError>}\n </AriaCalendar>\n );\n}\n\ninterface RangeCalendarProps<T extends AriaDateValue> extends AriaRangeCalendarProps<T> {\n /** Error message to display below the calendar */\n errorMessage?: string;\n}\n\n/**\n * Calendar component for date range selection.\n *\n * @example Basic range selection\n * ```tsx\n * <RangeCalendar\n * defaultValue={{\n * start: today(getLocalTimeZone()),\n * end: today(getLocalTimeZone()).add({ days: 7 })\n * }}\n * />\n * ```\n */\nexport function RangeCalendar<T extends AriaDateValue>({ errorMessage, className, ...props }: RangeCalendarProps<T>) {\n return (\n <AriaRangeCalendar\n className={composeRenderProps(className, className => classNames('w-fit', className))}\n {...props}\n >\n <CalendarHeading />\n <CalendarGrid>\n <CalendarGridHeader>{day => <CalendarHeaderCell>{day}</CalendarHeaderCell>}</CalendarGridHeader>\n <CalendarGridBody>{date => <CalendarCell date={date} />}</CalendarGridBody>\n </CalendarGrid>\n {errorMessage && <FormFieldError slot=\"errorMessage\">{errorMessage}</FormFieldError>}\n </AriaRangeCalendar>\n );\n}\n"],"names":["CalendarHeading","props","direction","useLocale","jsxs","jsx","Button","classNames","IcRight","IcLeft","AriaHeading","CalendarGrid","className","AriaCalendarGrid","CalendarGridHeader","AriaCalendarGridHeader","CalendarHeaderCell","AriaCalendarHeaderCell","CalendarGridBody","AriaCalendarGridBody","CalendarCell","isRange","use","AriaRangeCalendarStateContext","AriaCalendarCell","composeRenderProps","renderProps","buttonVariants","today","getLocalTimeZone","Calendar","errorMessage","AriaCalendar","day","date","FormFieldError","RangeCalendar","AriaRangeCalendar"],"mappings":"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"}
1
+ {"version":3,"file":"calendar.js","sources":["../../lib/components/calendar.tsx"],"sourcesContent":["'use client';\nimport { getLocalTimeZone, today } from '@internationalized/date';\nimport {\n Calendar as AriaCalendar,\n CalendarCell as AriaCalendarCell,\n CalendarCellProps as AriaCalendarCellProps,\n CalendarGrid as AriaCalendarGrid,\n CalendarGridBody as AriaCalendarGridBody,\n CalendarGridBodyProps as AriaCalendarGridBodyProps,\n CalendarGridHeader as AriaCalendarGridHeader,\n CalendarGridProps as AriaCalendarGridProps,\n CalendarHeaderCell as AriaCalendarHeaderCell,\n CalendarHeaderCellProps as AriaCalendarHeaderCellProps,\n CalendarProps as AriaCalendarProps,\n DateValue as AriaDateValue,\n Heading as AriaHeading,\n RangeCalendar as AriaRangeCalendar,\n RangeCalendarProps as AriaRangeCalendarProps,\n RangeCalendarStateContext as AriaRangeCalendarStateContext,\n composeRenderProps,\n useLocale,\n} from 'react-aria-components';\n\nimport { use } from 'react';\nimport { Button, buttonVariants } from '../components/button';\nimport { classNames } from '../utilities/theme';\nimport { FormFieldError } from './form';\nimport { IcLeft, IcRight } from './icons';\n\n/**\n * Calendar header with navigation buttons and month/year display.\n */\nexport function CalendarHeading(props: React.HTMLAttributes<HTMLElement>) {\n let { direction } = useLocale();\n\n return (\n <header className=\"flex w-full items-center gap-1 px-1 pb-icon\" {...props}>\n <Button slot=\"previous\" size=\"icon\">\n {direction === 'rtl' ? <IcRight aria-hidden /> : <IcLeft aria-hidden />}\n </Button>\n <AriaHeading className=\"grow text-center body font-medium\" />\n <Button slot=\"next\" size=\"icon\">\n {direction === 'rtl' ? <IcLeft aria-hidden /> : <IcRight aria-hidden />}\n </Button>\n </header>\n );\n}\n\n/**\n * Grid container for calendar cells with proper spacing.\n */\nexport function CalendarGrid({ className, ...props }: AriaCalendarGridProps) {\n return (\n <AriaCalendarGrid\n className={classNames(' border-separate border-spacing-x-0 border-spacing-y-1 ', className)}\n {...props}\n />\n );\n}\n\nexport const CalendarGridHeader = AriaCalendarGridHeader;\n\n/**\n * Header cell displaying day of week abbreviation.\n */\nexport function CalendarHeaderCell({ className, ...props }: AriaCalendarHeaderCellProps) {\n return (\n <AriaCalendarHeaderCell\n className={classNames('w-9 body-sm font-normal text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\n/**\n * Body container for calendar date cells.\n */\nexport function CalendarGridBody({ className, ...props }: AriaCalendarGridBodyProps) {\n return <AriaCalendarGridBody className={classNames('[&>tr>td]:p-0', className)} {...props} />;\n}\n\n/**\n * Individual calendar date cell with selection, hover, and availability states.\n * Automatically adapts styling for range selection contexts.\n */\nexport function CalendarCell({ className, ...props }: AriaCalendarCellProps) {\n const isRange = Boolean(use(AriaRangeCalendarStateContext));\n return (\n <AriaCalendarCell\n className={composeRenderProps(className, (className, renderProps) =>\n classNames(\n buttonVariants({ variant: 'ghost', size: 'icon' }),\n /* Disabled */\n renderProps.isDisabled && 'text-muted-foreground opacity-50',\n /* Selected */\n renderProps.isSelected &&\n 'bg-primary text-primary-foreground data-[focused]:bg-primary data-[focused]:text-primary-foreground',\n /* Hover */\n renderProps.isHovered &&\n renderProps.isSelected &&\n (renderProps.isSelectionStart || renderProps.isSelectionEnd || !isRange) &&\n 'data-[hovered]:bg-primary data-[hovered]:text-primary-foreground',\n /* Selection Start/End */\n renderProps.isSelected &&\n isRange &&\n !renderProps.isSelectionStart &&\n !renderProps.isSelectionEnd &&\n 'rounded-none bg-accent text-accent-foreground',\n /* Outside Month */\n renderProps.isOutsideMonth &&\n 'text-muted-foreground opacity-50 data-[selected]:bg-accent/50 data-[selected]:text-muted-foreground data-[selected]:opacity-30',\n /* Current Date */\n renderProps.date.compare(today(getLocalTimeZone())) === 0 &&\n !renderProps.isSelected &&\n 'bg-accent text-accent-foreground',\n /* Unavailable Date */\n renderProps.isUnavailable && 'cursor-default text-destructive ',\n renderProps.isInvalid &&\n 'bg-destructive text-destructive-foreground data-[focused]:bg-destructive data-[hovered]:bg-destructive data-[focused]:text-destructive-foreground data-[hovered]:text-destructive-foreground',\n className\n )\n )}\n {...props}\n />\n );\n}\n\ninterface CalendarProps<T extends AriaDateValue> extends AriaCalendarProps<T> {\n /** Error message to display below the calendar */\n errorMessage?: string;\n}\n\n/**\n * Calendar component for single date selection.\n *\n * @example Basic usage\n * ```tsx\n * <Calendar defaultValue={today(getLocalTimeZone())} />\n * ```\n */\nexport function Calendar<T extends AriaDateValue>({ errorMessage, className, ...props }: CalendarProps<T>) {\n return (\n <AriaCalendar className={composeRenderProps(className, className => classNames('w-fit', className))} {...props}>\n <CalendarHeading />\n <CalendarGrid>\n <CalendarGridHeader>{day => <CalendarHeaderCell>{day}</CalendarHeaderCell>}</CalendarGridHeader>\n <CalendarGridBody>{date => <CalendarCell date={date} />}</CalendarGridBody>\n </CalendarGrid>\n {errorMessage && <FormFieldError>{errorMessage}</FormFieldError>}\n </AriaCalendar>\n );\n}\n\ninterface RangeCalendarProps<T extends AriaDateValue> extends AriaRangeCalendarProps<T> {\n /** Error message to display below the calendar */\n errorMessage?: string;\n}\n\n/**\n * Calendar component for date range selection.\n *\n * @example Basic range selection\n * ```tsx\n * <RangeCalendar\n * defaultValue={{\n * start: today(getLocalTimeZone()),\n * end: today(getLocalTimeZone()).add({ days: 7 })\n * }}\n * />\n * ```\n */\nexport function RangeCalendar<T extends AriaDateValue>({ errorMessage, className, ...props }: RangeCalendarProps<T>) {\n return (\n <AriaRangeCalendar\n className={composeRenderProps(className, className => classNames('w-fit', className))}\n {...props}\n >\n <CalendarHeading />\n <CalendarGrid>\n <CalendarGridHeader>{day => <CalendarHeaderCell>{day}</CalendarHeaderCell>}</CalendarGridHeader>\n <CalendarGridBody>{date => <CalendarCell date={date} />}</CalendarGridBody>\n </CalendarGrid>\n {errorMessage && <FormFieldError slot=\"errorMessage\">{errorMessage}</FormFieldError>}\n </AriaRangeCalendar>\n );\n}\n"],"names":["CalendarHeading","props","direction","useLocale","jsxs","jsx","Button","IcRight","IcLeft","AriaHeading","CalendarGrid","className","AriaCalendarGrid","classNames","CalendarGridHeader","AriaCalendarGridHeader","CalendarHeaderCell","AriaCalendarHeaderCell","CalendarGridBody","AriaCalendarGridBody","CalendarCell","isRange","use","AriaRangeCalendarStateContext","AriaCalendarCell","composeRenderProps","renderProps","buttonVariants","today","getLocalTimeZone","Calendar","errorMessage","AriaCalendar","day","date","FormFieldError","RangeCalendar","AriaRangeCalendar"],"mappings":"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"}
@@ -1,2 +1,2 @@
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 I}from"../utilities/form-context.js";import{classNames as r}from"../utilities/theme.js";import{FormField as w,labelVariants as B}from"./form.js";import{IcMinus as F,IcCheck as j}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",S="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:p,variant:x="checkbox",...c}){const g=C(),n=c.id||g,f=x==="switch";return e("div",{className:"group form-field",children:e(w,{label:t,description:m,errorMessage:h,requiredIndicator:p,htmlFor:n,children:e(y,{className:l(o,d=>r("group/checkbox cursor-pointer relative focus-ring flex items-center gap-x-2 disabled-muted",B,d)),id:n,...c,children:l(e(k,{}),(d,s)=>f?e("div",{className:r(S,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)})}):e("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:v("span",{className:"flex items-center justify-center",children:[s.isIndeterminate&&e(F,{className:"size-icon"}),!s.isIndeterminate&&s.isSelected&&e(j,{className:"size-icon"})]})}))})})})}function J({...o}){const t=I({disabled:o.isDisabled});return e(G,{requiredIndicator:t.isRequired,isSelected:t.state.value,isDisabled:t.isSubmitting||o.isDisabled,onChange:()=>t.handleChange(!t.state.value),onBlur:t.handleBlur,...o})}export{G as Checkbox,H as CheckboxGroup,J 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 I}from"../utilities/form-context.js";import{classNames as r}from"../utilities/theme.js";import{FormField as w,labelVariants as B}from"./form.js";import{IcMinus as F,IcCheck as j}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",S="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 rounded-full justify-center border border-input text-current ring-offset-background",H=N;function G({className:o,label:t,description:m,errorMessage:h,requiredIndicator:p,variant:x="checkbox",...c}){const g=C(),d=c.id||g,f=x==="switch";return e("div",{className:"group form-field",children:e(w,{label:t,description:m,errorMessage:h,requiredIndicator:p,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(S,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)})}):e("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:v("span",{className:"flex items-center justify-center",children:[s.isIndeterminate&&e(F,{className:"size-icon"}),!s.isIndeterminate&&s.isSelected&&e(j,{className:"size-icon"})]})}))})})})}function J({...o}){const t=I({disabled:o.isDisabled});return e(G,{requiredIndicator:t.isRequired,isSelected:t.state.value,isDisabled:t.isSubmitting||o.isDisabled,onChange:()=>t.handleChange(!t.state.value),onBlur:t.handleBlur,...o})}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\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 <span className=\"flex items-center justify-center\">\n {renderProps.isIndeterminate && <IcMinus className=\"size-icon\" />}\n {!renderProps.isIndeterminate && renderProps.isSelected && (\n <IcCheck className=\"size-icon\" />\n )}\n </span>\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 requiredIndicator={field.isRequired}\n isSelected={field.state.value}\n isDisabled={field.isSubmitting || props.isDisabled}\n onChange={() => field.handleChange(!field.state.value)}\n onBlur={field.handleBlur}\n {...props}\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,EAMRoB,EAAC,MAAA,CACG,UAAWI,EACPnB,EACA,iDACAH,EACA,qHACAH,EACAC,EACA,uKACAC,CAAA,EAGJ,SAAA4B,EAAC,OAAA,CAAK,UAAU,mCACX,SAAA,CAAAD,EAAY,iBAAmBR,EAACU,EAAA,CAAQ,UAAU,YAAY,EAC9D,CAACF,EAAY,iBAAmBA,EAAY,YACzCR,EAACW,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CAAA,CAEvC,CAAA,CAAA,CAGX,CAAA,CAAA,CACL,CAAA,EAER,CAER,CAGO,SAASC,EAAW,CAAE,GAAGjB,GAA0B,CACtD,MAAMkB,EAAQC,EAAyB,CAAE,SAAUnB,EAAM,WAAY,EACrE,OACIK,EAACZ,EAAA,CACG,kBAAmByB,EAAM,WACzB,WAAYA,EAAM,MAAM,MACxB,WAAYA,EAAM,cAAgBlB,EAAM,WACxC,SAAU,IAAMkB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGlB,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 rounded-full 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 <span className=\"flex items-center justify-center\">\n {renderProps.isIndeterminate && <IcMinus className=\"size-icon\" />}\n {!renderProps.isIndeterminate && renderProps.isSelected && (\n <IcCheck className=\"size-icon\" />\n )}\n </span>\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 requiredIndicator={field.isRequired}\n isSelected={field.state.value}\n isDisabled={field.isSubmitting || props.isDisabled}\n onChange={() => field.handleChange(!field.state.value)}\n onBlur={field.handleBlur}\n {...props}\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,2IAESC,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,EAMRoB,EAAC,MAAA,CACG,UAAWI,EACPnB,EACA,iDACAH,EACA,qHACAH,EACAC,EACA,uKACAC,CAAA,EAGJ,SAAA4B,EAAC,OAAA,CAAK,UAAU,mCACX,SAAA,CAAAD,EAAY,iBAAmBR,EAACU,EAAA,CAAQ,UAAU,YAAY,EAC9D,CAACF,EAAY,iBAAmBA,EAAY,YACzCR,EAACW,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CAAA,CAEvC,CAAA,CAAA,CAGX,CAAA,CAAA,CACL,CAAA,EAER,CAER,CAGO,SAASC,EAAW,CAAE,GAAGjB,GAA0B,CACtD,MAAMkB,EAAQC,EAAyB,CAAE,SAAUnB,EAAM,WAAY,EACrE,OACIK,EAACZ,EAAA,CACG,kBAAmByB,EAAM,WACzB,WAAYA,EAAM,MAAM,MACxB,WAAYA,EAAM,cAAgBlB,EAAM,WACxC,SAAU,IAAMkB,EAAM,aAAa,CAACA,EAAM,MAAM,KAAK,EACrD,OAAQA,EAAM,WACb,GAAGlB,CAAA,CAAA,CAGhB"}
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as t,Fragment as T,jsxs as c}from"react/jsx-runtime";import{createContext as de,useState as D,useMemo as me,useEffect as ge,useContext as pe,useRef as fe}from"react";import{Button as C}from"./button.js";import{useSensors as be,useSensor as H,PointerSensor as he,KeyboardSensor as Se,DndContext as ye,closestCenter as ve,DragOverlay as Ce}from"@dnd-kit/core";import{sortableKeyboardCoordinates as xe,SortableContext as we,verticalListSortingStrategy as Te,arrayMove as Ne,useSortable as Ie}from"@dnd-kit/sortable";import{CSS as Ae}from"@dnd-kit/utilities";import{useQuery as De}from"@tanstack/react-query";import{createColumnHelper as W,useReactTable as Fe,getCoreRowModel as Pe,flexRender as _}from"@tanstack/react-table";import{useLocalStorage as B}from"@uidotdev/usehooks";import{merge as Re}from"lodash-es";import{Badge as ze}from"./badge.js";import{TfDatePicker as Oe}from"./date-picker.js";import{EasyMenu as R,MenuItem as F}from"./menu.js";import{PopoverTrigger as Le,Popover as _e}from"./popover.js";import{useAppForm as Me}from"../utilities/form-hook.js";import{useResourceFormatter as $,ALL_OS as $e}from"../utilities/resources.js";import{classNames as x}from"../utilities/theme.js";import{IcInfo as Ee,IcMoreVertical as je,IcRefresh as qe,IcColumns as Ve,IcGrip as ke,IcFirst as He,IcLeft as Be,IcRight as Ue,IcLast as Ke,IcSortAsc as Qe,IcSortDesc as Ge,IcSortNone as Xe,IcFilter as Ye,IcRemove as U,IcCheck as K,IcMinus as Ze,IcAccount as Je,IcLicense as We,IcDate as et,IcFile as tt}from"./icons.js";import{TfMultipleIdSearchInput as nt}from"./id-search.js";import{Loader as rt}from"./loader.js";import{SearchField as ot}from"./searchfield.js";import{Table as at,TableHeader as it,TableRow as Q,TableHead as st,TableBody as lt,TableCell as ct}from"./table.js";import{CountryName as ut}from"../utilities/countries.js";import{formatDate as dt}from"../utilities/date.js";import{Duration as mt}from"../utilities/duration.js";import{formatDays as gt,formatFilesize as pt,formatNumber as ft}from"../utilities/numbers.js";import{Checkbox as G}from"./checkbox.js";import{getSubscriptionStartTriggerLabel as bt,ALL_LICENSE_TYPES as ht}from"./select-options.js";import{useCtxClient as St}from"../utilities/ctx-client.js";import{ControlledDialogProvider as yt,useControlledDialog as ee}from"./dialog.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"./kbd.js";import"../utilities/string.js";import"clsx";import"../utilities/empty-option.js";function vt(e){return e?e.desc?`-${e.id}`:`+${e.id}`:"-createdAt"}const te=W(),Ct=[te.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})],w="TableActions";function xt(e){return e.length===0?[]:[te.accessor(w,{header:"Actions",id:w,enableHiding:!1,cell:({row:r})=>t(Pt,{label:t(je,{}),data:r.original,items:e}),enableSorting:!1})]}function Pn(){return W()}function Rn({path:e,pathParameters:r,columns:n,filterConfig:s,columnsToHideByDefault:a={},allowSelection:u=!1,initialFilters:l=[],tableActions:o}){const[d,S]=D({pagination:{pageIndex:0,pageSize:20},sorting:[]}),{sorting:m,pagination:y}=d,[p,g]=D(""),[h,f]=D({}),[b,z]=D(l),E=me(()=>b.map(i=>Array.isArray(i.value)?{[i.property]:{[i.operator]:i.value.join(",")}}:{[i.property]:{[i.operator]:i.value}}).reduce((i,v)=>Re(i,v),{}),[b]),I={...b,page:y.pageIndex+1,limit:y.pageSize,sort:vt(m[0]),search:p},ie=St(),O=["get",e,I],[j,q]=B(`${O.join("")}_ctx_column_order_preference`,[]),[V,se]=B(`${O.join("")}_ctx_column_visibility_preference`,{id:!1,...a}),L=i=>{S(v=>({...v,...i}))},P=De({queryKey:O,queryFn:async()=>{const i=await ie.GET(e,{params:{query:{page:I.page,limit:I.limit,sort:I.sort,search:I.search,...E},path:r}});return{data:i.data??[],total:Number.parseInt(i.response.headers.get("Pagination-Count")||"0")}}}),le=o.filter(oe),ce=[...u?Ct:[],...n,...xt(le??[])];function ue(i){return typeof i=="function"}function A(i,v){return ue(i)?i(v):i}const k=Fe({data:P.data?.data??[],columns:ce,getCoreRowModel:Pe(),rowCount:P.data?.total??0,manualPagination:!0,onPaginationChange:i=>{L({pagination:A(i,y)})},manualSorting:!0,onSortingChange:i=>{f({}),L({sorting:[...A(i,m)]})},manualFiltering:!0,onColumnVisibilityChange:i=>{se(A(i,V))},onRowSelectionChange:i=>{f(A(i,h))},onColumnOrderChange:i=>{q(A(i,j))},state:{sorting:m,columnVisibility:V,pagination:y,rowSelection:h,columnOrder:j},meta:{refetch:P.refetch}});return ge(()=>{const i=k.getAllLeafColumns();q([...i.filter(v=>v.id!==w).map(v=>v.id),...i.filter(v=>v.id===w).map(v=>v.id)])},[]),{tableState:d,updateTableState:L,query:P,setSearchQuery:g,searchQuery:p,tanTable:k,mergedFilters:E,filters:b,setFilters:z,filterConfig:s,tableActions:o,pathParameters:r}}const ne=de(null);function N(){const e=pe(ne);if(!e)throw Error("DataTable should be used within DataTableProvider.");return e}function zn({children:e,...r}){return t(ne.Provider,{value:r,children:e})}function On({className:e,...r}){const{query:n,tanTable:s}=N();return t(T,{children:t(yt,{children:c("section",{...r,className:x("flex flex-col bg-elevation-1",e),children:[t(It,{}),c("div",{className:"w-full overflow-auto border-x h-table relative",tabIndex:0,children:[n.isLoading&&t(X,{className:"cursor-wait",children:t(rt,{})}),!n.isLoading&&s.getRowModel().rows.length===0&&t(X,{className:"cursor-not-allowed",children:!n.isFetching&&(n.isError?c("span",{className:"flex gap-3 justify-center items-center",children:[t(Ee,{}),t("span",{children:n.error.message})]}):n.data?.data?.length===0?t(T,{children:"No results found."}):t(T,{children:"Unknown error. Please contact customer support."}))}),!n.isLoading&&s.getRowModel().rows.length!==0&&t(Dt,{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(wt,{}),t(Nt,{})]}),t(Tt,{})]})]})})})}function X({children:e,className:r}){return c(T,{children:[t("span",{className:x(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 wt(){const{tanTable:e}=N(),[r,n]=D(null),s=$(),a=be(H(he),H(Se,{coordinateGetter:xe}));return t(ye,{sensors:a,collisionDetection:ve,onDragStart:l=>{const{active:o}=l;n(o.id.toString())},onDragEnd:l=>{const{active:o,over:d}=l;if(d&&o.id!==d.id){const S=e.getState().columnOrder,m=S.indexOf(o.id.toString()),y=S.indexOf(d.id.toString());e.setColumnOrder([...Ne(S,m,y)])}n(null)},children:c(we,{items:e.getState().columnOrder,strategy:Te,children:[c(R,{label:c(T,{children:[t(Ve,{className:"inline align-bottom me-1"}),"Columns"]}),selectionMode:"multiple",items:e.getAllFlatColumns(),selectedKeys:e.getVisibleFlatColumns().map(l=>l.id),children:[t(F,{onAction:()=>e.toggleAllColumnsVisible(),className:"italic",children:"(select all)"}),e.getState().columnOrder.map(l=>{const o=e.getAllFlatColumns().find(d=>d.id===l);return!o||o.id==="checkbox"||o.id===w?null:t(u,{column:o},o.id)})]}),t(Ce,{children:r?t("div",{className:"opacity-70 border-2 border-primary",children:s(r)}):null})]})});function u({column:l}){const{attributes:o,listeners:d,setNodeRef:S,transform:m,transition:y}=Ie({id:l.id}),p={transform:Ae.Transform.toString(m),transition:y,zIndex:"999"};return c(F,{ref:S,style:p,...o,id:l.id,onAction:()=>l.toggleVisibility(),isDisabled:!l.getCanHide(),className:"flex items-center",children:[t(ke,{...d,className:"size-icon cursor-grab"}),M(l),l.getIsSorted()&&t(re,{className:"size-icon",direction:l.getIsSorted()})]})}}function Tt(){const{tanTable:e}=N(),r=e.getRowCount();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,r)} of ${r?.toLocaleString()}`}),t(C,{"aria-label":"First page",onPress:()=>e.firstPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(He,{})}),t(C,{"aria-label":"Previous page",onPress:()=>e.previousPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(Be,{})}),t(C,{"aria-label":"Next page",onPress:()=>e.nextPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t(Ue,{})}),t(C,{"aria-label":"Last page",onClick:()=>e.lastPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t(Ke,{})})]})}function Nt(){const{tanTable:e}=N(),r=[10,20,30,40,50];return t(R,{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(F,{onAction:()=>e.setPageSize(n.value),children:n.value})})}function It(){const{query:e,tanTable:r,searchQuery:n,setSearchQuery:s,tableActions:a}=N(),u=r.getSelectedRowModel().rows.length>0,l=a.filter(o=>o.resourceType!=="single").filter(o=>o.resourceType==="multiple"===u);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(qe,{})}),t(Ft,{items:l,isFetching:e.isFetching})]}),c("div",{className:"flex gap-icon",children:[t(Ot,{}),t(ot,{value:n,onChange:s})]})]})}function re({direction:e,...r}){return e==="asc"?t(Qe,{className:"size-3.5",...r}):e==="desc"?t(Ge,{className:"size-3.5",...r}):t(Xe,{className:"size-3.5",...r})}function M(e){const r=$(),n=e.columnDef.header;return typeof n=="string"?n:r(e.id)}function At(e){const r=e.column.columnDef.meta?.displayType,n=e.getValue();if(n==null)return null;switch(r){case"date":return t("span",{className:"tabular-nums",children:dt(n)});case"number":return t("span",{className:"block text-right tabular-nums",children:ft(n)});case"boolean":case"badge":return t(ze,{className:"uppercase w-full",children:String(n)});case"country":return t(ut,{value:n});case"enum":return t("span",{className:"uppercase w-full",children:String(n)});case"fileSize":return pt(n);case"days":return gt(n);case"os":return $e[n]??n;case"licenseType":return ht[n]??n;case"subscriptionInterval":return mt.formatISODuration(n);case"subscriptionStartTrigger":return bt(n);default:return String(n)}}function Y({header:e}){const r=e.column.columnDef.header;return typeof r=="string"||!r?M(e.column):typeof r=="function"?typeof r(e.getContext())=="string"?M(e.column):_(r,e.getContext()):_(r,e.getContext())}function Dt({className:e}){const{tanTable:r}=N(),n=(s,a,u="z-50")=>x("px-icon py-2 text-left body-sm font-medium whitespace-nowrap",s&&`bg-elevation-1 sticky right-0 ${u} text-center justify-center`,a);return c(at,{className:x("table-auto",e),children:[t(it,{className:"sticky top-0 z-10",children:r.getHeaderGroups().map(s=>t(Q,{children:s.headers.map(a=>c(st,{scope:"col",colSpan:a.colSpan,className:n(a.id===w,"bg-elevation-1"),children:[!a.column.getCanSort()&&!a.isPlaceholder&&t("div",{className:x("w-full py-1 inline-flex items-center gap-1 body-sm",a.id===w?"justify-center":"justify-start"),children:t(Y,{header:a})}),a.column.getCanSort()&&c(C,{variant:"ghost",className:x("w-full p-1",a.id===w?"justify-center":"justify-start"),onPress:a.column.getToggleSortingHandler(),children:[t("span",{children:t(Y,{header:a})}),t(re,{direction:a.column.getIsSorted()})]})]},a.id))},s.id))}),t(lt,{children:r.getRowModel().rows.map(s=>t(Q,{className:x("transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20"),"data-selected":s.getIsSelected(),children:s.getVisibleCells().map(a=>{const u=a.column.id===w,l=a.column.columnDef.meta?.displayType?At(a):_(a.column.columnDef.cell,a.getContext());return t(ct,{className:x(n(u,void 0,"z-1"),u&&"flex justify-center items-center"),children:l},a.id)})},s.id))})]})}function Z(e){return e.resourceType==="none"}function oe(e){return e.resourceType==="single"}function J(e){return e.resourceType==="multiple"}function Ft({items:e,isFetching:r}){const{openDialog:n,closeDialog:s}=ee(),{tanTable:a}=N();function u(o,d){return o.isDisabled?Z(o)?o.isDisabled():J(o)?o.isDisabled(d):!1:!1}const l=a.getSelectedRowModel().rows.map(o=>o.original);return t(T,{children:e.map((o,d)=>{const S=o.icon,m=u(o,l)||r;return c(C,{"aria-label":o.label,type:"button",isDisabled:m,className:"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform",onPress:y=>{const p={event:y,openDialog:n,closeDialog:s};Z(o)?o.onPress(p):J(o)&&o.onPress({...p,data:l})},variant:o.variant??"neutral",children:[S&&t(S,{"aria-hidden":!0}),t("span",{children:o.label})]},`${o.label}-${d}`)})})}function Pt({label:e,items:r,data:n}){const{openDialog:s,closeDialog:a}=ee();return t(R,{"aria-label":"Actions",label:e,size:"icon",children:r.map((u,l)=>{const o=u.icon,d=typeof u.label=="function"?u.label(n):u.label;return c(F,{id:typeof d=="string"?d:void 0,isDisabled:u.isDisabled?.(n)??!1,onAction:()=>{const S={openDialog:s,closeDialog:a};oe(u)&&u.onPress({...S,data:n})},children:[t(o,{className:"size-icon"}),d]},`${l}-${typeof d=="string"?d:""}`)})})}const Ln=["eq","ne","cn","nc","sw","ew","in","nin","gt","gte","lt","lte"],Rt={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 zt(e,r){const n=`${r}-${Date.now()}`,s=ae[e][0];switch(e){case"bool":return{id:n,type:e,property:r,operator:s,value:!0};case"string":return{id:n,type:e,property:r,operator:s,value:""};case"date":return{id:n,type:e,property:r,operator:s,value:new Date().toISOString()};case"id":return{id:n,type:e,property:r,operator:s,value:""};case"id-search":return{id:n,type:e,property:r,operator:s,value:[]};case"enum":return{id:n,type:e,property:r,operator:s,value:new Set};case"number":return{id:n,type:e,property:r,operator:s,value:0}}}const ae={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 Ot({className:e,...r}){const{filters:n,query:s,setFilters:a,filterConfig:u,pathParameters:l}=N(),o=fe(null),d=$(),m=Me({defaultValues:{filters:n},onSubmit:({value:p})=>{a(p.filters)}}),y=Object.keys(u).sort();return t("section",{...r,className:x("flex gap-icon items-center",e),children:c(Le,{onOpenChange:p=>{p?o.current?.focus():m.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:s.isPending||y.length===0,type:"button",size:"icon",variant:"neutral",children:t(Ye,{})})]}),t(_e,{className:"w-full p-icon",children:t("form",{onSubmit:p=>{p.preventDefault()},className:"flex flex-col gap-icon max-h-table overflow-auto ",children:t(m.Field,{mode:"array",name:"filters",children:p=>c(T,{children:[p.state.value.map((g,h)=>c("div",{className:"flex gap-icon items-center justify-normal",children:[t("span",{className:"body-sm",children:d(g.property)}),t(m.AppField,{name:`filters[${h}].operator`,children:f=>t(f.TfSingleSelect,{items:ae[g.type].map(b=>({id:b,label:t(T,{children:Rt[b]})}))})},g.id),g.type==="bool"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfCheckbox,{autoFocus:!0})}),g.type==="date"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(Oe,{autoFocus:!0})}),g.type==="id"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfTextField,{autoFocus:!0})}),g.type==="string"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfTextField,{autoFocus:!0})}),g.type==="number"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfNumberField,{autoFocus:!0})}),g.type==="enum"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>{const b=u[g.property];return b.type!=="enum"?null:t(f.TfMultiSelect,{items:b.options})}}),g.type==="id-search"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>{const b=u[g.property];if(b.type!=="id-search")return null;const z=l?{path:l,query:{}}:void 0;return t(nt,{path:b.path,accessor:b.accessor,defaultParams:z})}}),t(C,{type:"button",variant:"neutral",size:"icon",onPress:()=>p.removeValue(h),children:t(U,{})})]},g.id)),c("div",{className:"flex w-full items-center justify-end gap-2 not-first:mt-icon",children:[t(R,{label:"Add filter",autoFocus:!0,children:y.sort().map(g=>{const h=u[g].type,f=Lt[h];return c(F,{onAction:()=>{const b=zt(h,g);p.pushValue(b)},children:[d(g),t(f,{})]},g)})}),p.state.value.length>0?c(C,{type:"button",variant:"neutral",onPress:()=>{p.setValue([])},children:[t(U,{}),"Reset"]}):null]})]})})})})]})})}const Lt={"id-search":tt,bool:K,date:et,enum:We,id:Je,number:Ze,string:K};export{Rt as C,Ot as D,On as DataTable,ne as DataTableContext,zn as DataTableProvider,Ln as F,Pn as getColumnHelper,N as useDataTable,Rn as useDataTableState};
1
+ "use client";import{jsx as t,Fragment as T,jsxs as c}from"react/jsx-runtime";import{createContext as de,useState as D,useMemo as me,useEffect as ge,useContext as pe,useRef as fe}from"react";import{Button as C}from"./button.js";import{useSensors as be,useSensor as H,PointerSensor as he,KeyboardSensor as Se,DndContext as ye,closestCenter as ve,DragOverlay as Ce}from"@dnd-kit/core";import{sortableKeyboardCoordinates as xe,SortableContext as we,verticalListSortingStrategy as Te,arrayMove as Ne,useSortable as Ie}from"@dnd-kit/sortable";import{CSS as Ae}from"@dnd-kit/utilities";import{useQuery as De}from"@tanstack/react-query";import{createColumnHelper as W,useReactTable as Fe,getCoreRowModel as Pe,flexRender as _}from"@tanstack/react-table";import{useLocalStorage as B}from"@uidotdev/usehooks";import{merge as Re}from"lodash-es";import{Badge as ze}from"./badge.js";import{TfDatePicker as Oe}from"./date-picker.js";import{EasyMenu as R,MenuItem as F}from"./menu.js";import{PopoverTrigger as Le,Popover as _e}from"./popover.js";import{useAppForm as Me}from"../utilities/form-hook.js";import{useResourceFormatter as $,ALL_OS as $e}from"../utilities/resources.js";import{classNames as x}from"../utilities/theme.js";import{IcInfo as Ee,IcMoreVertical as je,IcRefresh as qe,IcColumns as Ve,IcGrip as ke,IcFirst as He,IcLeft as Be,IcRight as Ue,IcLast as Ke,IcSortAsc as Qe,IcSortDesc as Ge,IcSortNone as Xe,IcFilter as Ye,IcRemove as U,IcCheck as K,IcMinus as Ze,IcAccount as Je,IcLicense as We,IcDate as et,IcFile as tt}from"./icons.js";import{TfMultipleIdSearchInput as nt}from"./id-search.js";import{Loader as rt}from"./loader.js";import{SearchField as at}from"./searchfield.js";import{Table as ot,TableHeader as it,TableRow as Q,TableHead as st,TableBody as lt,TableCell as ct}from"./table.js";import{CountryName as ut}from"../utilities/countries.js";import{formatDate as dt}from"../utilities/date.js";import{Duration as mt}from"../utilities/duration.js";import{formatDays as gt,formatFilesize as pt,formatNumber as ft}from"../utilities/numbers.js";import{Checkbox as G}from"./checkbox.js";import{getSubscriptionStartTriggerLabel as bt,ALL_LICENSE_TYPES as ht}from"./select-options.js";import{useCtxClient as St}from"../utilities/ctx-client.js";import{ControlledDialogProvider as yt,useControlledDialog as ee}from"./dialog.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"./kbd.js";import"../utilities/string.js";import"clsx";import"../utilities/empty-option.js";function vt(e){return e?e.desc?`-${e.id}`:`+${e.id}`:"-createdAt"}const te=W(),Ct=[te.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})],w="TableActions";function xt(e){return e.length===0?[]:[te.accessor(w,{header:"Actions",id:w,enableHiding:!1,cell:({row:r})=>t(Pt,{label:t(je,{}),data:r.original,items:e}),enableSorting:!1})]}function Pn(){return W()}function Rn({path:e,pathParameters:r,columns:n,filterConfig:s,columnsToHideByDefault:o={},allowSelection:u=!1,initialFilters:l=[],tableActions:a}){const[d,S]=D({pagination:{pageIndex:0,pageSize:20},sorting:[]}),{sorting:m,pagination:y}=d,[p,g]=D(""),[h,f]=D({}),[b,z]=D(l),E=me(()=>b.map(i=>Array.isArray(i.value)?{[i.property]:{[i.operator]:i.value.join(",")}}:{[i.property]:{[i.operator]:i.value}}).reduce((i,v)=>Re(i,v),{}),[b]),I={...b,page:y.pageIndex+1,limit:y.pageSize,sort:vt(m[0]),search:p},ie=St(),O=["get",e,I],[j,q]=B(`${O.join("")}_ctx_column_order_preference`,[]),[V,se]=B(`${O.join("")}_ctx_column_visibility_preference`,{id:!1,...o}),L=i=>{S(v=>({...v,...i}))},P=De({queryKey:O,queryFn:async()=>{const i=await ie.GET(e,{params:{query:{page:I.page,limit:I.limit,sort:I.sort,search:I.search,...E},path:r}});return{data:i.data??[],total:Number.parseInt(i.response.headers.get("Pagination-Count")||"0")}}}),le=a.filter(ae),ce=[...u?Ct:[],...n,...xt(le??[])];function ue(i){return typeof i=="function"}function A(i,v){return ue(i)?i(v):i}const k=Fe({data:P.data?.data??[],columns:ce,getCoreRowModel:Pe(),rowCount:P.data?.total??0,manualPagination:!0,onPaginationChange:i=>{L({pagination:A(i,y)})},manualSorting:!0,onSortingChange:i=>{f({}),L({sorting:[...A(i,m)]})},manualFiltering:!0,onColumnVisibilityChange:i=>{se(A(i,V))},onRowSelectionChange:i=>{f(A(i,h))},onColumnOrderChange:i=>{q(A(i,j))},state:{sorting:m,columnVisibility:V,pagination:y,rowSelection:h,columnOrder:j},meta:{refetch:P.refetch}});return ge(()=>{const i=k.getAllLeafColumns();q([...i.filter(v=>v.id!==w).map(v=>v.id),...i.filter(v=>v.id===w).map(v=>v.id)])},[]),{tableState:d,updateTableState:L,query:P,setSearchQuery:g,searchQuery:p,tanTable:k,mergedFilters:E,filters:b,setFilters:z,filterConfig:s,tableActions:a,pathParameters:r}}const ne=de(null);function N(){const e=pe(ne);if(!e)throw Error("DataTable should be used within DataTableProvider.");return e}function zn({children:e,...r}){return t(ne.Provider,{value:r,children:e})}function On({className:e,...r}){const{query:n,tanTable:s}=N();return t(T,{children:t(yt,{children:c("section",{...r,className:x("flex flex-col bg-elevation-1",e),children:[t(It,{}),c("div",{className:"w-full overflow-auto border-x h-table relative",tabIndex:0,children:[n.isLoading&&t(X,{className:"cursor-wait",children:t(rt,{})}),!n.isLoading&&s.getRowModel().rows.length===0&&t(X,{className:"cursor-not-allowed",children:!n.isFetching&&(n.isError?c("span",{className:"flex gap-3 justify-center items-center",children:[t(Ee,{}),t("span",{children:n.error.message})]}):n.data?.data?.length===0?t(T,{children:"No results found."}):t(T,{children:"Unknown error. Please contact customer support."}))}),!n.isLoading&&s.getRowModel().rows.length!==0&&t(Dt,{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(wt,{}),t(Nt,{})]}),t(Tt,{})]})]})})})}function X({children:e,className:r}){return c(T,{children:[t("span",{className:x(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 wt(){const{tanTable:e}=N(),[r,n]=D(null),s=$(),o=be(H(he),H(Se,{coordinateGetter:xe}));return t(ye,{sensors:o,collisionDetection:ve,onDragStart:l=>{const{active:a}=l;n(a.id.toString())},onDragEnd:l=>{const{active:a,over:d}=l;if(d&&a.id!==d.id){const S=e.getState().columnOrder,m=S.indexOf(a.id.toString()),y=S.indexOf(d.id.toString());e.setColumnOrder([...Ne(S,m,y)])}n(null)},children:c(we,{items:e.getState().columnOrder,strategy:Te,children:[c(R,{label:c(T,{children:[t(Ve,{className:"inline align-bottom me-1"}),"Columns"]}),selectionMode:"multiple",items:e.getAllFlatColumns(),selectedKeys:e.getVisibleFlatColumns().map(l=>l.id),children:[t(F,{onAction:()=>e.toggleAllColumnsVisible(),className:"italic",children:"(select all)"}),e.getState().columnOrder.map(l=>{const a=e.getAllFlatColumns().find(d=>d.id===l);return!a||a.id==="checkbox"||a.id===w?null:t(u,{column:a},a.id)})]}),t(Ce,{children:r?t("div",{className:"opacity-70 border-2 border-primary",children:s(r)}):null})]})});function u({column:l}){const{attributes:a,listeners:d,setNodeRef:S,transform:m,transition:y}=Ie({id:l.id}),p={transform:Ae.Transform.toString(m),transition:y,zIndex:"999"};return c(F,{ref:S,style:p,...a,id:l.id,onAction:()=>l.toggleVisibility(),isDisabled:!l.getCanHide(),className:"flex items-center",children:[t(ke,{...d,className:"size-icon cursor-grab"}),M(l),l.getIsSorted()&&t(re,{className:"size-icon",direction:l.getIsSorted()})]})}}function Tt(){const{tanTable:e}=N(),r=e.getRowCount();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,r)} of ${r?.toLocaleString()}`}),t(C,{"aria-label":"First page",onPress:()=>e.firstPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(He,{})}),t(C,{"aria-label":"Previous page",onPress:()=>e.previousPage(),isDisabled:!e.getCanPreviousPage(),variant:"neutral",size:"icon",children:t(Be,{})}),t(C,{"aria-label":"Next page",onPress:()=>e.nextPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t(Ue,{})}),t(C,{"aria-label":"Last page",onClick:()=>e.lastPage(),isDisabled:!e.getCanNextPage(),variant:"neutral",size:"icon",children:t(Ke,{})})]})}function Nt(){const{tanTable:e}=N(),r=[10,20,30,40,50];return t(R,{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(F,{onAction:()=>e.setPageSize(n.value),children:n.value})})}function It(){const{query:e,tanTable:r,searchQuery:n,setSearchQuery:s,tableActions:o}=N(),u=r.getSelectedRowModel().rows.length>0,l=o.filter(a=>a.resourceType!=="single").filter(a=>a.resourceType==="multiple"===u);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(qe,{})}),t(Ft,{items:l,isFetching:e.isFetching})]}),c("div",{className:"flex gap-icon",children:[t(Ot,{}),t(at,{value:n,onChange:s})]})]})}function re({direction:e,...r}){return e==="asc"?t(Qe,{className:"size-3.5",...r}):e==="desc"?t(Ge,{className:"size-3.5",...r}):t(Xe,{className:"size-3.5",...r})}function M(e){const r=$(),n=e.columnDef.header;return typeof n=="string"?n:r(e.id)}function At(e){const r=e.column.columnDef.meta?.displayType,n=e.getValue();if(n==null)return null;switch(r){case"date":return t("span",{className:"tabular-nums",children:dt(n)});case"number":return t("span",{className:"block text-right tabular-nums",children:ft(n)});case"boolean":case"badge":return t(ze,{className:"uppercase w-full",children:String(n)});case"country":return t(ut,{value:n});case"enum":return t("span",{className:"uppercase w-full",children:String(n)});case"fileSize":return pt(n);case"days":return gt(n);case"os":return $e[n]??n;case"licenseType":return ht[n]??n;case"subscriptionInterval":return mt.formatISODuration(n);case"subscriptionStartTrigger":return bt(n);default:return String(n)}}function Y({header:e}){const r=e.column.columnDef.header;return typeof r=="string"||!r?M(e.column):typeof r=="function"?typeof r(e.getContext())=="string"?M(e.column):_(r,e.getContext()):_(r,e.getContext())}function Dt({className:e}){const{tanTable:r}=N(),n=(s,o,u="z-50")=>x("px-icon py-2 text-left body-sm font-medium whitespace-nowrap",s&&`bg-elevation-1 sticky right-0 ${u} text-center justify-center`,o);return c(ot,{className:x("table-auto",e),children:[t(it,{className:"sticky top-0 z-10",children:r.getHeaderGroups().map(s=>t(Q,{children:s.headers.map(o=>c(st,{scope:"col",colSpan:o.colSpan,className:n(o.id===w,"bg-elevation-1"),children:[!o.column.getCanSort()&&!o.isPlaceholder&&t("div",{className:x("w-full py-1 inline-flex items-center gap-1 body-sm",o.id===w?"justify-center":"justify-start"),children:t(Y,{header:o})}),o.column.getCanSort()&&c(C,{variant:"ghost",className:x("w-full p-1",o.id===w?"justify-center":"justify-start"),onPress:o.column.getToggleSortingHandler(),children:[t("span",{children:t(Y,{header:o})}),t(re,{direction:o.column.getIsSorted()})]})]},o.id))},s.id))}),t(lt,{children:r.getRowModel().rows.map(s=>t(Q,{className:x("transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20"),"data-selected":s.getIsSelected(),children:s.getVisibleCells().map(o=>{const u=o.column.id===w,l=o.column.columnDef.meta?.displayType?At(o):_(o.column.columnDef.cell,o.getContext());return t(ct,{className:x(n(u,void 0,"z-1"),u&&"flex justify-center items-center"),children:l},o.id)})},s.id))})]})}function Z(e){return e.resourceType==="none"}function ae(e){return e.resourceType==="single"}function J(e){return e.resourceType==="multiple"}function Ft({items:e,isFetching:r}){const{openDialog:n,closeDialog:s}=ee(),{tanTable:o}=N();function u(a,d){return a.isDisabled?Z(a)?a.isDisabled():J(a)?a.isDisabled(d):!1:!1}const l=o.getSelectedRowModel().rows.map(a=>a.original);return t(T,{children:e.map((a,d)=>{const S=a.icon,m=u(a,l)||r;return c(C,{"aria-label":a.label,type:"button",isDisabled:m,className:"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform",onPress:y=>{const p={event:y,openDialog:n,closeDialog:s};Z(a)?a.onPress(p):J(a)&&a.onPress({...p,data:l})},variant:a.variant??"neutral",children:[S&&t(S,{"aria-hidden":!0}),t("span",{children:a.label})]},`${a.label}-${d}`)})})}function Pt({label:e,items:r,data:n}){const{openDialog:s,closeDialog:o}=ee();return t(R,{"aria-label":"Actions",label:e,size:"icon",children:r.map((u,l)=>{const a=u.icon,d=typeof u.label=="function"?u.label(n):u.label;return c(F,{id:typeof d=="string"?d:void 0,isDisabled:u.isDisabled?.(n)??!1,onAction:()=>{const S={openDialog:s,closeDialog:o};ae(u)&&u.onPress({...S,data:n})},children:[t(a,{className:"size-icon"}),d]},`${l}-${typeof d=="string"?d:""}`)})})}const Ln=["eq","ne","cn","nc","sw","ew","in","nin","gt","gte","lt","lte"],Rt={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 zt(e,r){const n=`${r}-${Date.now()}`,s=oe[e][0];switch(e){case"bool":return{id:n,type:e,property:r,operator:s,value:!0};case"string":return{id:n,type:e,property:r,operator:s,value:""};case"date":return{id:n,type:e,property:r,operator:s,value:new Date().toISOString()};case"id":return{id:n,type:e,property:r,operator:s,value:""};case"id-search":return{id:n,type:e,property:r,operator:s,value:[]};case"enum":return{id:n,type:e,property:r,operator:s,value:new Set};case"number":return{id:n,type:e,property:r,operator:s,value:0}}}const oe={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 Ot({className:e,...r}){const{filters:n,query:s,setFilters:o,filterConfig:u,pathParameters:l}=N(),a=fe(null),d=$(),m=Me({defaultValues:{filters:n},onSubmit:({value:p})=>{o(p.filters)}}),y=Object.keys(u).sort();return t("section",{...r,className:x("flex gap-icon items-center",e),children:c(Le,{onOpenChange:p=>{p?a.current?.focus():m.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:s.isPending||y.length===0,type:"button",size:"icon",variant:"neutral",children:t(Ye,{})})]}),t(_e,{className:"w-full p-icon",children:t("form",{onSubmit:p=>{p.preventDefault()},className:"flex flex-col gap-icon max-h-table overflow-auto ",children:t(m.Field,{mode:"array",name:"filters",children:p=>c(T,{children:[p.state.value.map((g,h)=>c("div",{className:"flex gap-icon items-center justify-normal",children:[t("span",{className:"body-sm",children:d(g.property)}),t(m.AppField,{name:`filters[${h}].operator`,children:f=>t(f.TfSingleSelect,{items:oe[g.type].map(b=>({id:b,label:t(T,{children:Rt[b]})}))})},g.id),g.type==="bool"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfCheckbox,{autoFocus:!0})}),g.type==="date"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(Oe,{autoFocus:!0})}),g.type==="id"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfTextField,{autoFocus:!0})}),g.type==="string"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfTextField,{autoFocus:!0})}),g.type==="number"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>t(f.TfNumberField,{autoFocus:!0})}),g.type==="enum"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>{const b=u[g.property];return b.type!=="enum"?null:t(f.TfMultiSelect,{items:b.options})}}),g.type==="id-search"&&t(m.AppField,{name:`filters[${h}].value`,children:f=>{const b=u[g.property];if(b.type!=="id-search")return null;const z=l?{path:l,query:{}}:void 0;return t(nt,{path:b.path,accessor:b.accessor,defaultParams:z})}}),t(C,{type:"button",variant:"neutral",size:"icon",onPress:()=>p.removeValue(h),children:t(U,{})})]},g.id)),c("div",{className:"flex w-full items-center justify-end gap-2 not-first:mt-icon",children:[t(R,{label:"Add filter",autoFocus:!0,children:y.sort().map(g=>{const h=u[g].type,f=Lt[h];return c(F,{className:"!justify-between",onAction:()=>{const b=zt(h,g);p.pushValue(b)},children:[d(g),t(f,{})]},g)})}),p.state.value.length>0?c(C,{type:"button",variant:"neutral",onPress:()=>{p.setValue([])},children:[t(U,{}),"Reset"]}):null]})]})})})})]})})}const Lt={"id-search":tt,bool:K,date:et,enum:We,id:Je,number:Ze,string:K};export{Rt as C,Ot as D,On as DataTable,ne as DataTableContext,zn as DataTableProvider,Ln as F,Pn as getColumnHelper,N as useDataTable,Rn as useDataTableState};
2
2
  //# sourceMappingURL=data-table.js.map