@cryptlex/web-components 6.6.6-alpha35 → 6.6.6-alpha38
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.
- package/dist/components/alert.js +1 -1
- package/dist/components/alert.js.map +1 -1
- package/dist/components/calendar.js +1 -1
- package/dist/components/calendar.js.map +1 -1
- package/dist/components/charts.js +1 -1
- package/dist/components/charts.js.map +1 -1
- package/dist/components/data-table.js +1 -1
- package/dist/components/data-table.js.map +1 -1
- package/dist/components/duration-field.d.ts +15 -0
- package/dist/components/duration-field.js +2 -0
- package/dist/components/duration-field.js.map +1 -0
- package/dist/components/id-search.d.ts +3 -1
- package/dist/components/id-search.js +1 -1
- package/dist/components/id-search.js.map +1 -1
- package/dist/components/numberfield.d.ts +2 -1
- package/dist/components/numberfield.js +1 -1
- package/dist/components/numberfield.js.map +1 -1
- package/dist/components/select-options.d.ts +1 -0
- package/dist/components/select-options.js +1 -1
- package/dist/components/select-options.js.map +1 -1
- package/dist/utilities/duration.d.ts +13 -0
- package/dist/utilities/duration.js +2 -0
- package/dist/utilities/duration.js.map +1 -0
- package/dist/utilities/numbers.d.ts +10 -0
- package/dist/utilities/numbers.js +1 -1
- package/dist/utilities/numbers.js.map +1 -1
- package/package.json +1 -1
package/dist/components/alert.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as
|
|
1
|
+
import{jsxs as n,jsx as s}from"react/jsx-runtime";import{cva as a}from"class-variance-authority";import{classNames as d}from"../utilities/theme.js";import{IcInfo as u,IcCheck as m,IcError as l}from"./icons.js";import"clsx";import"react";const f=a("transition-colors border border-dotted 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 u}};function k({children:e,className:o,variant:t,icon:c,...i}){const r=c??b(t);return n("div",{role:"alert",className:d(f({variant:t}),o),...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};
|
|
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(\n `transition-colors border border-dotted p-2 text-foreground body inline-flex items-start gap-2`,\n {\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\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=\"size-icon mt-1\" />}\n <span className=\"w-
|
|
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 `transition-colors border border-dotted p-2 text-foreground body inline-flex items-start gap-2`,\n {\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\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,EACzB,gGACA,CACI,SAAU,CACN,QAAS,CACL,YAAa,mEACb,QAAS,uDACT,MAAO,gDAAA,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,sCAAA,CAAuC,EAChEG,EAAC,OAAA,CAAK,UAAU,mCAAoC,SAAAP,CAAA,CAAS,CAAA,EACjE,CAER"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
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 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};
|
|
2
2
|
//# sourceMappingURL=calendar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.js","sources":["../../lib/components/calendar.tsx"],"sourcesContent":["import { 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\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,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r,jsxs as l}from"react/jsx-runtime";import{XAxis as f,YAxis as g,CartesianGrid as p,Legend as v,Tooltip as y,ResponsiveContainer as c,LineChart as x,Line as C,BarChart as k,Bar as S}from"recharts";function s({...o}){return r(f,{stroke:"var(--color-muted-foreground)",...o})}function d({...o}){return r(g,{stroke:"var(--color-muted-foreground)",...o})}function u({...o}){return r(p,{stroke:"var(--color-muted-foreground)",...o})}function m({...o}){return r(v,{iconSize:12,formatter:t=>r("span",{className:"text-foreground",children:t}),wrapperStyle:{background:"var(--color-elevation-1)"},...o})}function h({...o}){return r(y,{contentStyle:{backgroundColor:"var(--color-elevation-2)",border:"var(--color-border)"},labelStyle:{color:"var(--color-muted-foreground)",fontWeight:"600",marginBottom:"0.5rem"},itemStyle:{color:"var(--color-foreground)",padding:"0"},...o})}function L({className:o,data:t,config:e,...n}){return r(c,{...n,children:l(x,{className:"body-sm",data:t,children:[r(u,{strokeDasharray:"3 3"}),r(s,{dataKey:e.xAxis.toString()}),r(d,{}),r(h,{}),r(m,{iconType:"plainline"}),e.lines.map((i,a)=>r(C,{strokeWidth:2,type:"monotone",dataKey:i.toString(),stroke:`var(--color-chart-${a%5+1}`}))]})})}function B({className:o,data:t,config:e,...n}){return r(c,{className:o,...n,children:l(k,{className:"body-sm",data:t,children:[r(u,{strokeDasharray:"3 3"}),r(s,{dataKey:e.xAxis.toString()}),r(d,{}),r(h,{}),r(m,{}),e.bars.map((i,a)=>r(S,{dataKey:i.toString(),fill:`var(--color-chart-${a%5+1}`,stroke:`var(--color-chart-${a%5+1}`}))]})})}export{B as Barchart,u as ChartCartesianGrid,m as ChartLegend,h as ChartTooltip,s as ChartXAxis,d as ChartYAxis,L as Linechart};
|
|
1
|
+
"use client";import{jsx as r,jsxs as l}from"react/jsx-runtime";import{XAxis as f,YAxis as g,CartesianGrid as p,Legend as v,Tooltip as y,ResponsiveContainer as c,LineChart as x,Line as C,BarChart as k,Bar as S}from"recharts";function s({...o}){return r(f,{stroke:"var(--color-muted-foreground)",...o})}function d({...o}){return r(g,{stroke:"var(--color-muted-foreground)",...o})}function u({...o}){return r(p,{stroke:"var(--color-muted-foreground)",...o})}function m({...o}){return r(v,{iconSize:12,formatter:t=>r("span",{className:"text-foreground",children:t}),wrapperStyle:{background:"var(--color-elevation-1)"},...o})}function h({...o}){return r(y,{contentStyle:{backgroundColor:"var(--color-elevation-2)",border:"var(--color-border)"},labelStyle:{color:"var(--color-muted-foreground)",fontWeight:"600",marginBottom:"0.5rem"},itemStyle:{color:"var(--color-foreground)",padding:"0"},...o})}function L({className:o,data:t,config:e,...n}){return r(c,{...n,children:l(x,{className:"body-sm",data:t,children:[r(u,{strokeDasharray:"3 3"}),r(s,{dataKey:e.xAxis.toString()}),r(d,{}),r(h,{}),r(m,{iconType:"plainline"}),e.lines.map((i,a)=>r(C,{strokeWidth:2,type:"monotone",dataKey:i.toString(),stroke:`var(--color-chart-${a%5+1}`}))]})})}function B({className:o,data:t,config:e,...n}){return r(c,{className:o,...n,children:l(k,{className:"body-sm",data:t,children:[r(u,{strokeDasharray:"3 3"}),r(s,{dataKey:e.xAxis.toString()}),r(d,{}),r(h,{}),r(m,{}),e.bars.map((i,a)=>r(S,{dataKey:i.toString(),fill:`var(--color-chart-${a%5+1}`,stroke:`var(--color-chart-${a%5+1}`}))]})})}export{B as Barchart,u as ChartCartesianGrid,m as ChartLegend,h as ChartTooltip,s as ChartXAxis,d as ChartYAxis,L as Linechart};
|
|
2
2
|
//# sourceMappingURL=charts.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"charts.js","sources":["../../lib/components/charts.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"charts.js","sources":["../../lib/components/charts.tsx"],"sourcesContent":["'use client';\nimport {\n Bar,\n BarChart,\n Line,\n LineChart,\n CartesianGrid as RechartsCartesianGrid,\n Legend as RechartsLegend,\n Tooltip as RechartsTooltip,\n XAxis as RechartsXAxis,\n YAxis as RechartsYAxis,\n ResponsiveContainer,\n} from 'recharts';\n\nexport function ChartXAxis({ ...props }: React.ComponentProps<typeof RechartsXAxis>) {\n return <RechartsXAxis stroke=\"var(--color-muted-foreground)\" {...props} />;\n}\n\nexport function ChartYAxis({ ...props }: React.ComponentProps<typeof RechartsYAxis>) {\n return <RechartsYAxis stroke=\"var(--color-muted-foreground)\" {...props} />;\n}\n\nexport function ChartCartesianGrid({ ...props }: React.ComponentProps<typeof RechartsCartesianGrid>) {\n return <RechartsCartesianGrid stroke=\"var(--color-muted-foreground)\" {...props} />;\n}\n\nexport function ChartLegend({ ...props }: React.ComponentProps<typeof RechartsLegend>) {\n return (\n <RechartsLegend\n iconSize={12}\n formatter={v => <span className=\"text-foreground\">{v}</span>}\n wrapperStyle={{ background: 'var(--color-elevation-1)' }}\n {...props}\n />\n );\n}\n\nexport function ChartTooltip({ ...props }: React.ComponentProps<typeof RechartsTooltip>) {\n return (\n <RechartsTooltip\n contentStyle={{\n backgroundColor: 'var(--color-elevation-2)',\n border: 'var(--color-border)',\n }}\n labelStyle={{\n color: 'var(--color-muted-foreground)',\n fontWeight: '600',\n marginBottom: '0.5rem',\n }}\n itemStyle={{\n color: 'var(--color-foreground)',\n padding: '0',\n }}\n {...props}\n />\n );\n}\nexport function Linechart<T extends object>({\n className,\n data,\n config,\n ...props\n}: Omit<React.ComponentProps<typeof ResponsiveContainer>, 'children'> & {\n data: T[];\n config: {\n xAxis: keyof T;\n lines: (keyof T)[];\n };\n}) {\n return (\n <ResponsiveContainer {...props}>\n <LineChart className=\"body-sm\" data={data}>\n <ChartCartesianGrid strokeDasharray=\"3 3\" />\n <ChartXAxis dataKey={config.xAxis.toString()} />\n <ChartYAxis />\n <ChartTooltip />\n <ChartLegend iconType=\"plainline\" />\n {config.lines.map((l, i) => (\n <Line\n strokeWidth={2}\n type=\"monotone\"\n dataKey={l.toString()}\n stroke={`var(--color-chart-${(i % 5) + 1}`}\n />\n ))}\n </LineChart>\n </ResponsiveContainer>\n );\n}\n\nexport function Barchart<T>({\n className,\n data,\n config,\n ...props\n}: Omit<React.ComponentProps<typeof ResponsiveContainer>, 'children'> & {\n data: T[];\n config: {\n xAxis: keyof T;\n bars: (keyof T)[];\n };\n}) {\n return (\n <ResponsiveContainer className={className} {...props}>\n <BarChart className=\"body-sm\" data={data}>\n <ChartCartesianGrid strokeDasharray=\"3 3\" />\n <ChartXAxis dataKey={config.xAxis.toString()} />\n <ChartYAxis />\n <ChartTooltip />\n <ChartLegend />\n {config.bars.map((b, i) => (\n <Bar\n dataKey={b.toString()}\n fill={`var(--color-chart-${(i % 5) + 1}`}\n stroke={`var(--color-chart-${(i % 5) + 1}`}\n />\n ))}\n </BarChart>\n </ResponsiveContainer>\n );\n}\n"],"names":["ChartXAxis","props","jsx","RechartsXAxis","ChartYAxis","RechartsYAxis","ChartCartesianGrid","RechartsCartesianGrid","ChartLegend","RechartsLegend","v","ChartTooltip","RechartsTooltip","Linechart","className","data","config","ResponsiveContainer","LineChart","l","i","Line","Barchart","jsxs","BarChart","b","Bar"],"mappings":"gOAcO,SAASA,EAAW,CAAE,GAAGC,GAAqD,CACjF,OAAOC,EAACC,EAAA,CAAc,OAAO,gCAAiC,GAAGF,EAAO,CAC5E,CAEO,SAASG,EAAW,CAAE,GAAGH,GAAqD,CACjF,OAAOC,EAACG,EAAA,CAAc,OAAO,gCAAiC,GAAGJ,EAAO,CAC5E,CAEO,SAASK,EAAmB,CAAE,GAAGL,GAA6D,CACjG,OAAOC,EAACK,EAAA,CAAsB,OAAO,gCAAiC,GAAGN,EAAO,CACpF,CAEO,SAASO,EAAY,CAAE,GAAGP,GAAsD,CACnF,OACIC,EAACO,EAAA,CACG,SAAU,GACV,UAAWC,GAAKR,EAAC,OAAA,CAAK,UAAU,kBAAmB,SAAAQ,EAAE,EACrD,aAAc,CAAE,WAAY,0BAAA,EAC3B,GAAGT,CAAA,CAAA,CAGhB,CAEO,SAASU,EAAa,CAAE,GAAGV,GAAuD,CACrF,OACIC,EAACU,EAAA,CACG,aAAc,CACV,gBAAiB,2BACjB,OAAQ,qBAAA,EAEZ,WAAY,CACR,MAAO,gCACP,WAAY,MACZ,aAAc,QAAA,EAElB,UAAW,CACP,MAAO,0BACP,QAAS,GAAA,EAEZ,GAAGX,CAAA,CAAA,CAGhB,CACO,SAASY,EAA4B,CACxC,UAAAC,EACA,KAAAC,EACA,OAAAC,EACA,GAAGf,CACP,EAMG,CACC,OACIC,EAACe,GAAqB,GAAGhB,EACrB,WAACiB,EAAA,CAAU,UAAU,UAAU,KAAAH,EAC3B,SAAA,CAAAb,EAACI,EAAA,CAAmB,gBAAgB,KAAA,CAAM,IACzCN,EAAA,CAAW,QAASgB,EAAO,MAAM,WAAY,IAC7CZ,EAAA,EAAW,IACXO,EAAA,EAAa,EACdT,EAACM,EAAA,CAAY,SAAS,WAAA,CAAY,EACjCQ,EAAO,MAAM,IAAI,CAACG,EAAGC,IAClBlB,EAACmB,EAAA,CACG,YAAa,EACb,KAAK,WACL,QAASF,EAAE,SAAA,EACX,OAAQ,qBAAsBC,EAAI,EAAK,CAAC,EAAA,CAAA,CAE/C,CAAA,CAAA,CACL,CAAA,CACJ,CAER,CAEO,SAASE,EAAY,CACxB,UAAAR,EACA,KAAAC,EACA,OAAAC,EACA,GAAGf,CACP,EAMG,CACC,OACIC,EAACe,GAAoB,UAAAH,EAAuB,GAAGb,EAC3C,SAAAsB,EAACC,EAAA,CAAS,UAAU,UAAU,KAAAT,EAC1B,SAAA,CAAAb,EAACI,EAAA,CAAmB,gBAAgB,KAAA,CAAM,IACzCN,EAAA,CAAW,QAASgB,EAAO,MAAM,WAAY,IAC7CZ,EAAA,EAAW,IACXO,EAAA,EAAa,IACbH,EAAA,EAAY,EACZQ,EAAO,KAAK,IAAI,CAACS,EAAGL,IACjBlB,EAACwB,EAAA,CACG,QAASD,EAAE,SAAA,EACX,KAAM,qBAAsBL,EAAI,EAAK,CAAC,GACtC,OAAQ,qBAAsBA,EAAI,EAAK,CAAC,EAAA,CAAA,CAE/C,CAAA,CAAA,CACL,CAAA,CACJ,CAER"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as e,Fragment as C,jsxs as l}from"react/jsx-runtime";import{createContext as ae,useState as F,useMemo as ie,useEffect as oe,useContext as le,useRef as se}from"react";import{Button as S}from"./button.js";import{useSensors as ce,useSensor as k,PointerSensor as ue,KeyboardSensor as de,DndContext as me,closestCenter as ge,DragOverlay as pe}from"@dnd-kit/core";import{sortableKeyboardCoordinates as fe,SortableContext as he,verticalListSortingStrategy as be,arrayMove as Se,useSortable as ve}from"@dnd-kit/sortable";import{CSS as Ce}from"@dnd-kit/utilities";import{useQuery as ye,keepPreviousData as we}from"@tanstack/react-query";import{createColumnHelper as W,useReactTable as xe,getCoreRowModel as Ie,flexRender as X}from"@tanstack/react-table";import{useLocalStorage as V}from"@uidotdev/usehooks";import{merge as Fe}from"lodash-es";import{TfDatePicker as Ne}from"./date-picker.js";import{EasyMenu as L,MenuItem as D}from"./menu.js";import{PopoverTrigger as Te,Popover as Ae}from"./popover.js";import{useAppForm as Pe}from"../utilities/form-hook.js";import{useResourceFormatter as M}from"../utilities/resources.js";import{classNames as w}from"../utilities/theme.js";import{IcInfo as De,IcMoreVertical as Re,IcRefresh as Oe,IcColumns as _e,IcGrip as ze,IcFirst as Le,IcLeft as Me,IcRight as Ee,IcLast as $e,IcSortAsc as qe,IcSortDesc as ke,IcSortNone as Ve,IcFilter as He,IcRemove as H,IcCheck as U,IcMinus as Ue,IcAccount as je,IcLicense as Be,IcDate as Ke,IcFile as Qe}from"./icons.js";import{TfMultipleIdSearchInput as Ge}from"./id-search.js";import{DialogMenu as We}from"./dialog-menu.js";import{Loader as Xe}from"./loader.js";import{SearchField as Ze}from"./searchfield.js";import{Table as Je,TableHeader as Ye,TableRow as j,TableHead as et,TableBody as tt,TableCell as nt}from"./table.js";import{formatDate as B}from"../utilities/date.js";import{Checkbox as K}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 an(t){const n=async(a,o,g,s)=>{const d={...s,page:a.pageIndex+1,limit:a.pageSize,sort:rt(o[0]),search:g},h=await t(d);return{total:Number.parseInt(h.response.headers.get("Pagination-Count")||"0"),data:h.data}},r=W();return{callback:n,columnHelper:r}}function rt(t){return t?t.desc?`-${t.id}`:`+${t.id}`:"-createdAt"}const N=W(),at=[N.accessor("checkbox",{header:({table:t})=>e(K,{isIndeterminate:t.getIsSomeRowsSelected()&&!t.getIsAllPageRowsSelected(),isSelected:t.getIsAllPageRowsSelected()||t.getIsSomePageRowsSelected(),onChange:()=>t.toggleAllPageRowsSelected(),"aria-label":"Select all"}),cell:({row:t})=>e(K,{isSelected:t.getIsSelected(),onChange:()=>t.toggleSelected(),"aria-label":"Select row"}),enableSorting:!1,enableHiding:!1})],it=[N.accessor("id",{header:()=>"ID"})],ot=[N.accessor("createdAt",{header:()=>"Creation Date",cell:({row:t})=>{const n=t.getValue("createdAt");return B(n)},enableHiding:!1}),N.accessor("updatedAt",{header:()=>"Last Updated",cell:({row:t})=>{const n=t.getValue("updatedAt");return B(n)},enableHiding:!1})],z="TableActions",lt=t=>t.length===0?[]:[N.accessor(z,{header:"",id:z,enableHiding:!1,cell:({row:n})=>e(We,{label:e(Re,{}),data:n.original,items:t})})];function on({resourceName:t,columns:n,callback:r,filterConfig:a,columnsToHideByDefault:o={},allowSelection:g=!1,initialFilters:s=[],tableActions:d,rowActions:h}){const[u,v]=F({pagination:{pageIndex:0,pageSize:20},sorting:[]}),[m,c]=F({}),[f,p]=F(""),[b,E]=V(`${t}_ctx_column_order_preference`,[]),[$,ee]=V(`${t}_ctx_column_visibility_preference`,{id:!1,...o}),[R,te]=F(s),O=ie(()=>R.map(i=>Array.isArray(i.value)?{[i.property]:{[i.operator]:i.value.join(",")}}:{[i.property]:{[i.operator]:i.value}}).reduce((i,I)=>Fe(i,I),{}),[R]),_=i=>{v(I=>({...I,...i}))},{sorting:T,pagination:A}=u,P=ye({queryKey:[t,A,T,f,O],queryFn:()=>r(A,T,f,O),placeholderData:we,retry:0,refetchOnWindowFocus:!1}),ne=[...g?at:[],...it,...n,...ot,...lt(h??[])];function re(i){return typeof i=="function"}function x(i,I){return re(i)?i(I):i}const q=xe({data:P.data?.data??[],columns:ne,getCoreRowModel:Ie(),rowCount:P.data?.total,manualPagination:!0,onPaginationChange:i=>{_({pagination:x(i,A)})},manualSorting:!0,onSortingChange:i=>{c({}),_({sorting:[...x(i,T)]})},manualFiltering:!0,onColumnVisibilityChange:i=>{ee(x(i,$))},onRowSelectionChange:i=>{c(x(i,m))},onColumnOrderChange:i=>{E(x(i,b))},state:{sorting:T,columnVisibility:$,pagination:A,rowSelection:m,columnOrder:b},meta:{refetch:P.refetch}});return oe(()=>{E([...q.getAllLeafColumns().map(i=>i.id)])},[]),{tableState:u,updateTableState:_,query:P,setSearchQuery:p,searchQuery:f,tanTable:q,mergedFilters:O,filters:R,setFilters:te,filterConfig:a,tableActions:d}}const Z=ae(null);function y(){const t=le(Z);if(!t)throw Error("DataTable should be used within DataTableProvider.");return t}function ln({children:t,...n}){return e(Z.Provider,{value:n,children:t})}function sn({className:t,...n}){const{query:r,tanTable:a}=y();return e(C,{children:l("section",{...n,className:w("flex flex-col bg-elevation-1",t),children:[e(dt,{}),l("div",{className:"w-full overflow-auto border-x h-table relative",tabIndex:0,children:[r.isLoading&&e(Q,{className:"cursor-wait",children:e(Xe,{})}),!r.isLoading&&a.getRowModel().rows.length===0&&e(Q,{className:"cursor-not-allowed",children:!r.isFetching&&(r.isError?l("span",{className:"flex gap-3 justify-center items-center",children:[e(De,{}),e("span",{children:r.error.message})]}):r.data?.data?.length===0?e(C,{children:"No results found."}):e(C,{children:"Unknown error. Please contact customer support."}))}),!r.isLoading&&a.getRowModel().rows.length!==0&&e(mt,{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:[e(st,{}),e(ut,{})]}),e(ct,{})]})]})})}function Q({children:t,className:n}){return l(C,{children:[e("span",{className:w(n,"absolute top-0 bg-elevation-1 text-foreground z-20 size-full body-sm flex items-center justify-center"),children:t}),e("span",{className:"relative h-full w-0 block"})]})}function st(){const{tanTable:t}=y(),[n,r]=F(null),a=M(),o=ce(k(ue),k(de,{coordinateGetter:fe}));return e(me,{sensors:o,collisionDetection:ge,onDragStart:s=>{const{active:d}=s;r(d.id.toString())},onDragEnd:s=>{const{active:d,over:h}=s;if(h&&d.id!==h.id){const u=t.getState().columnOrder,v=u.indexOf(d.id.toString()),m=u.indexOf(h.id.toString());t.setColumnOrder([...Se(u,v,m)])}r(null)},children:l(he,{items:t.getState().columnOrder,strategy:be,children:[l(L,{label:l(C,{children:[e(_e,{className:"inline align-bottom me-1"}),"Columns"]}),selectionMode:"multiple",items:t.getAllFlatColumns(),selectedKeys:t.getVisibleFlatColumns().map(s=>s.id),children:[e(D,{onAction:()=>t.toggleAllColumnsVisible(),className:"italic",children:"(select all)"}),t.getState().columnOrder.map(s=>{const d=t.getAllFlatColumns().find(h=>h.id===s);return d?e(g,{column:d},d.id):null})]}),e(pe,{children:n?e("div",{className:"opacity-70 border-2 border-primary",children:a(n)}):null})]})});function g({column:s}){const{attributes:d,listeners:h,setNodeRef:u,transform:v,transition:m}=ve({id:s.id}),c={transform:Ce.Transform.toString(v),transition:m,zIndex:"999"};return l(D,{ref:u,style:c,...d,id:s.id,onAction:()=>s.toggleVisibility(),isDisabled:!s.getCanHide(),className:"flex items-center",children:[e(ze,{...h,className:"size-icon cursor-grab"}),a(s.id),s.getIsSorted()&&e(J,{className:"size-icon",direction:s.getIsSorted()})]})}}function ct(){const{tanTable:t,query:n}=y(),r=n.data?.total??0;return l("div",{className:"flex items-center gap-2",children:[e("span",{className:"whitespace-nowrap body-sm text-muted",children:`${t.getState().pagination.pageIndex*t.getState().pagination.pageSize+1} - ${Math.min((t.getState().pagination.pageIndex+1)*t.getState().pagination.pageSize,r)} of ${r?.toLocaleString()}`}),e(S,{"aria-label":"First page",onPress:()=>t.firstPage(),isDisabled:!t.getCanPreviousPage(),variant:"neutral",size:"icon",children:e(Le,{})}),e(S,{"aria-label":"Previous page",onPress:()=>t.previousPage(),isDisabled:!t.getCanPreviousPage(),variant:"neutral",size:"icon",children:e(Me,{})}),e(S,{"aria-label":"Next page",onPress:()=>t.nextPage(),isDisabled:!t.getCanNextPage(),variant:"neutral",size:"icon",children:e(Ee,{})}),e(S,{"aria-label":"Last page",onClick:()=>t.lastPage(),isDisabled:!t.getCanNextPage(),variant:"neutral",size:"icon",children:e($e,{})})]})}function ut(){const{tanTable:t}=y(),n=[10,20,30,40,50];return e(L,{label:t.getState().pagination.pageSize.toString(),selectionMode:"single",selectedKeys:[t.getState().pagination.pageSize.toString()],items:n.map(r=>({id:r.toString(),value:r})),children:r=>e(D,{onAction:()=>t.setPageSize(r.value),children:r.value})})}function dt(){const{query:t,tanTable:n,searchQuery:r,setSearchQuery:a,tableActions:o}=y();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:[e(S,{"aria-label":"Refresh",isPending:t.isFetching,onClick:()=>t.refetch(),variant:"neutral",size:"icon",children:e(Oe,{})}),o.filter(g=>g.bulk===n.getSelectedRowModel().rows.length>0).map((g,s)=>{const d=g.icon;return e(S,{"aria-label":g.label,type:"button",isDisabled:t.isFetching,className:"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform",onPress:h=>{g.onClick(h,n.getSelectedRowModel().rows.map(u=>u.original))},size:"icon",children:e(d,{})},`${s}-${g.bulk}`)})]}),l("div",{className:"flex gap-icon",children:[e(ft,{}),e(Ze,{value:r,onChange:a})]})]})}function J({direction:t,...n}){return t==="asc"?e(qe,{className:"size-3.5",...n}):t==="desc"?e(ke,{className:"size-3.5",...n}):e(Ve,{className:"size-3.5",...n})}function G({header:t}){const n=M();return t.column.columnDef.header?X(t.column.columnDef.header,t.getContext()):n(t.id)}function mt({className:t}){const{tanTable:n}=y(),r=(a,o)=>w("px-icon py-2 text-left body-sm font-medium whitespace-nowrap",a&&"bg-elevation-1 sticky right-0 z-50 text-center",o);return l(Je,{className:w("table-auto",t),children:[e(Ye,{className:"sticky top-0 z-10",children:n.getHeaderGroups().map(a=>e(j,{children:a.headers.map(o=>l(et,{scope:"col",colSpan:o.colSpan,className:r(!1,"bg-elevation-1"),children:[!o.column.getCanSort()&&!o.isPlaceholder&&e("div",{className:"w-full justify-start p-1 inline-flex items-center gap-1 body-sm",children:e(G,{header:o})}),o.column.getCanSort()&&l(S,{variant:"ghost",className:"w-full justify-start p-1",onPress:o.column.getToggleSortingHandler(),children:[e("span",{children:e(G,{header:o})}),e(J,{direction:o.column.getIsSorted()})]})]},o.id))},a.id))}),e(tt,{children:n.getRowModel().rows.map(a=>e(j,{className:w("transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20"),"data-selected":a.getIsSelected(),children:a.getVisibleCells().map(o=>e(nt,{className:r(o.column.id===z),children:X(o.column.columnDef.cell,o.getContext())},o.id))},a.id))})]})}const cn=["eq","ne","cn","nc","sw","ew","in","nin","gt","gte","lt","lte"],gt={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 pt(t,n){const r=`${n}-${Date.now()}`,a=Y[t][0];switch(t){case"bool":return{id:r,type:t,property:n,operator:a,value:!0};case"string":return{id:r,type:t,property:n,operator:a,value:""};case"date":return{id:r,type:t,property:n,operator:a,value:new Date().toISOString()};case"id":return{id:r,type:t,property:n,operator:a,value:""};case"id-search":return{id:r,type:t,property:n,operator:a,value:[]};case"enum":return{id:r,type:t,property:n,operator:a,value:new Set};case"number":return{id:r,type:t,property:n,operator:a,value:0}}}const Y={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 ft({className:t,...n}){const{filters:r,query:a,setFilters:o,filterConfig:g}=y(),s=se(null),d=M(),u=Pe({defaultValues:{filters:r},onSubmit:({value:m})=>{o(m.filters)}}),v=Object.keys(g).sort();return e("section",{...n,className:w("flex gap-icon items-center",t),children:l(Te,{onOpenChange:m=>{m?s.current?.focus():u.handleSubmit()},children:[l("div",{className:"relative",children:[r.length>0&&e("div",{className:"size-2 rounded-full absolute bg-primary/90 z-20 top-0 right-0 translate-x-0.5 -translate-y-0.5"}),e(S,{"aria-label":"Filter",isDisabled:a.isPending||v.length===0,type:"button",size:"icon",variant:"neutral",children:e(He,{})})]}),e(Ae,{className:"w-full p-icon",children:e("form",{onSubmit:m=>{m.preventDefault()},className:"flex flex-col gap-icon max-h-table overflow-auto ",children:e(u.Field,{mode:"array",name:"filters",children:m=>l(C,{children:[m.state.value.map((c,f)=>l("div",{className:"flex gap-icon items-center justify-normal",children:[e("span",{className:"body-sm",children:d(c.property)}),e(u.AppField,{name:`filters[${f}].operator`,children:p=>e(p.TfSingleSelect,{items:Y[c.type].map(b=>({id:b,label:e(C,{children:gt[b]})}))})},c.id),c.type==="bool"&&e(u.AppField,{name:`filters[${f}].value`,children:p=>e(p.TfCheckbox,{autoFocus:!0})}),c.type==="date"&&e(u.AppField,{name:`filters[${f}].value`,children:p=>e(Ne,{autoFocus:!0})}),c.type==="id"&&e(u.AppField,{name:`filters[${f}].value`,children:p=>e(p.TfTextField,{autoFocus:!0})}),c.type==="string"&&e(u.AppField,{name:`filters[${f}].value`,children:p=>e(p.TfTextField,{autoFocus:!0})}),c.type==="number"&&e(u.AppField,{name:`filters[${f}].value`,children:p=>e(p.TfNumberField,{autoFocus:!0})}),c.type==="enum"&&e(u.AppField,{name:`filters[${f}].value`,children:p=>{const b=g[c.property];return b.type!=="enum"?null:e(p.TfMultiSelect,{items:b.options})}}),c.type==="id-search"&&e(u.AppField,{name:`filters[${f}].value`,children:p=>{const b=g[c.property];return b.type!=="id-search"?null:e(Ge,{resource:b.resource,accessor:b.accessor,searchFn:b.searchFn})}}),e(S,{type:"button",variant:"neutral",size:"icon",onPress:()=>m.removeValue(f),children:e(H,{})})]},c.id)),l("div",{className:"flex w-full items-center justify-end gap-2 not-first:mt-icon",children:[e(L,{label:"Add filter",autoFocus:!0,children:v.sort().map(c=>{const f=g[c].type,p=ht[f];return l(D,{onAction:()=>{const b=pt(f,c);m.pushValue(b)},children:[d(c),e(p,{})]},c)})}),m.state.value.length>0?l(S,{type:"button",variant:"neutral",onPress:()=>{m.setValue([])},children:[e(H,{}),"Reset"]}):null]})]})})})})]})})}const ht={"id-search":Qe,bool:U,date:Ke,enum:Be,id:je,number:Ue,string:U};export{gt as C,ft as D,sn as DataTable,Z as DataTableContext,ln as DataTableProvider,cn as F,an as getTableCallback,y as useDataTable,on as useDataTableState};
|
|
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};
|
|
2
2
|
//# sourceMappingURL=data-table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-table.js","sources":["../../lib/components/data-table.tsx","../../lib/components/data-table-filter.tsx"],"sourcesContent":["'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport {\n closestCenter,\n DndContext,\n DragOverlay,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\nimport {\n arrayMove,\n SortableContext,\n sortableKeyboardCoordinates,\n useSortable,\n verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { keepPreviousData, useQuery } from '@tanstack/react-query';\nimport {\n type Column,\n type ColumnDef,\n type ColumnHelper,\n type ColumnOrderState,\n createColumnHelper,\n flexRender,\n getCoreRowModel,\n type PaginationState,\n type RowSelectionState,\n type SortingState,\n type Updater,\n useReactTable,\n type VisibilityState,\n} from '@tanstack/react-table';\nimport { useLocalStorage } from '@uidotdev/usehooks';\nimport { merge } from 'lodash-es';\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react';\nimport type { PressEvent } from 'react-aria-components';\nimport { Button } from '../components/button';\nimport { DataTableFilter, type FiltersConfig, type TableFilter } from '../components/data-table-filter';\nimport { DialogMenu, type DialogMenuAction } from '../components/dialog-menu';\nimport { Loader } from '../components/loader';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport { SearchField } from '../components/searchfield';\nimport { TableBody, TableCell, Table as TableComponent, TableHead, TableHeader, TableRow } from '../components/table';\nimport { formatDate } from '../utilities/date';\nimport type { CtxResourceName } from '../utilities/resources';\nimport { useResourceFormatter } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { Checkbox } from './checkbox';\nimport {\n type CtxIcon,\n IcColumns,\n IcFirst,\n IcGrip,\n IcInfo,\n IcLast,\n IcLeft,\n IcMoreVertical,\n IcRefresh,\n IcRight,\n IcSortAsc,\n IcSortDesc,\n IcSortNone,\n} from './icons';\n\n/** Reserved name for actions column */\n// export const ACTIONS_COLUMN_ID = 'tableActions';\n\nexport type TableAction<in TActionData> = {\n label: string;\n onClick: (e: PressEvent, t: TActionData[]) => void;\n bulk: boolean;\n icon: CtxIcon;\n tooltip?: string;\n};\n\nexport type TableFetchFn<in out TData extends object> = (\n p: PaginationState,\n s: SortingState,\n q: string,\n f: Record<string, any>\n) => Promise<{\n total: number;\n data: TData[] | undefined;\n}>;\nexport function getTableCallback<T extends object>(\n getter: (\n q: Record<string, any>\n ) => Promise<{ data?: T[]; error?: { code?: string | null; message: string }; response: Response }>\n): { callback: TableFetchFn<T>; columnHelper: ColumnHelper<T> } {\n const callback: TableFetchFn<T> = async (pagination, sorting, searching, filters) => {\n const query = {\n ...filters,\n page: pagination.pageIndex + 1,\n limit: pagination.pageSize,\n sort: generateSortParam(sorting[0]),\n search: searching,\n };\n\n const _f = await getter(query);\n\n return {\n total: Number.parseInt(_f.response.headers.get('Pagination-Count') || '0'),\n data: _f.data,\n };\n };\n\n const columnHelper = createColumnHelper<T>();\n\n return { callback, columnHelper };\n}\n\nfunction generateSortParam(sort: { id: string; desc: boolean } | undefined): string {\n if (sort) {\n if (sort.desc) {\n return `-${sort.id}`;\n } else {\n return `+${sort.id}`;\n }\n } else {\n return '-createdAt';\n }\n}\n\nconst cH = createColumnHelper<any>();\nconst TABLE_CHECK_BOX_COLUMN = [\n cH.accessor('checkbox', {\n header: ({ table }) => (\n <Checkbox\n isIndeterminate={table.getIsSomeRowsSelected() && !table.getIsAllPageRowsSelected()}\n isSelected={table.getIsAllPageRowsSelected() || table.getIsSomePageRowsSelected()}\n onChange={() => table.toggleAllPageRowsSelected()}\n aria-label=\"Select all\"\n />\n ),\n\n cell: ({ row }) => (\n <Checkbox isSelected={row.getIsSelected()} onChange={() => row.toggleSelected()} aria-label=\"Select row\" />\n ),\n enableSorting: false,\n enableHiding: false,\n }),\n];\n\nconst TABLE_ID_COLUMN = [\n cH.accessor('id', {\n header: () => 'ID',\n }),\n];\nconst TABLE_DEFAULT_DATE_COLUMNS = [\n cH.accessor('createdAt', {\n header: () => 'Creation Date',\n cell: ({ row }) => {\n const date = row.getValue('createdAt') satisfies string | null | undefined;\n return formatDate(date);\n },\n enableHiding: false,\n }),\n cH.accessor('updatedAt', {\n header: () => 'Last Updated',\n cell: ({ row }) => {\n const date = row.getValue('updatedAt') satisfies string | null | undefined;\n return formatDate(date);\n },\n enableHiding: false,\n }),\n];\n\nconst ACTIONS_COLUMN_ID = 'TableActions';\nconst getActionColumn = (rowActions: DialogMenuAction<any>[]) => {\n if (rowActions.length === 0) return [];\n\n return [\n cH.accessor(ACTIONS_COLUMN_ID, {\n header: '',\n id: ACTIONS_COLUMN_ID,\n enableHiding: false,\n cell: ({ row }) => <DialogMenu label={<IcMoreVertical />} data={row.original} items={rowActions} />,\n }),\n ];\n};\n\ntype DataTableFactory<T extends object, TOperation extends keyof operations> = {\n resourceName: CtxResourceName;\n callback: TableFetchFn<T>;\n columns: ColumnDef<T, any>[];\n tableActions: TableAction<T>[];\n columnsToHideByDefault?: Partial<Record<keyof T, boolean>>; // Columns that are hidden by default\n allowSelection?: boolean;\n filterConfig: FiltersConfig<TOperation>;\n initialFilters: TableFilter[];\n rowActions?: DialogMenuAction<T>[];\n};\n\ntype DataTableState = {\n sorting: SortingState;\n pagination: PaginationState;\n};\n/**\n * Hook for handling all data-table state. Used in DataTableContext\n */\nexport function useDataTableState<T extends object, TOperation extends keyof operations>({\n resourceName,\n columns,\n callback,\n filterConfig,\n columnsToHideByDefault = {},\n allowSelection = false,\n initialFilters = [],\n tableActions,\n rowActions,\n}: DataTableFactory<T, TOperation>) {\n const [tableState, _setTableState] = useState<DataTableState>({\n /** Reflect in URL in host application */\n pagination: { pageIndex: 0, pageSize: 20 }, // Pagination state\n sorting: [], // Sorting state\n });\n //\n const [rowSelection, setRowSelection] = useState<RowSelectionState>({});\n\n /** Reflect in URL in host application */\n const [searchQuery, setSearchQuery] = useState('');\n\n const [columnOrder, setColumnOrder] = useLocalStorage<ColumnOrderState>(\n `${resourceName}_ctx_column_order_preference`,\n []\n );\n const [columnVisibility, setColumnVisibility] = useLocalStorage<VisibilityState>(\n `${resourceName}_ctx_column_visibility_preference`,\n {\n id: false,\n ...columnsToHideByDefault,\n }\n );\n\n const [filters, setFilters] = useState(initialFilters);\n\n const mergedFilters = useMemo(() => {\n // TODO, generic transform fn\n return filters\n .map(tf => {\n if (Array.isArray(tf.value)) {\n return {\n [tf.property]: {\n [tf.operator]: tf.value.join(','),\n },\n };\n }\n return {\n [tf.property]: {\n [tf.operator]: tf.value,\n },\n };\n })\n .reduce((acc, current) => {\n return merge(acc, current);\n }, {});\n }, [filters]);\n\n // Update table state with new values\n const updateTableState = (updates: Partial<DataTableState>) => {\n _setTableState(prev => ({ ...prev, ...updates }));\n };\n\n const { sorting, pagination } = tableState;\n\n const query = useQuery({\n queryKey: [resourceName, pagination, sorting, searchQuery, mergedFilters],\n queryFn: () => callback(pagination, sorting, searchQuery, mergedFilters),\n placeholderData: keepPreviousData, // Keep previous data while loading new data\n retry: 0,\n refetchOnWindowFocus: false,\n });\n\n /**\n * ID,createdAt and updatedAt will be added by default for all tables\n * If selection is allowed, checkbox will be added\n * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n * If there are actions for the table, they will be placed fixed at the right side of table.\n */\n const cols: ColumnDef<any, any>[] = [\n ...(allowSelection ? TABLE_CHECK_BOX_COLUMN : []),\n ...TABLE_ID_COLUMN,\n ...columns,\n ...TABLE_DEFAULT_DATE_COLUMNS,\n ...getActionColumn(rowActions ?? []),\n ];\n\n // Type-guard for updater\n function isUpdaterFunction<T>(updater: Updater<T>): updater is (old: T) => T {\n return typeof updater === 'function';\n }\n // Utility function to resolve updater\n function resolveUpdater<T>(updater: Updater<T>, currentValue: T) {\n if (isUpdaterFunction(updater)) {\n return updater(currentValue);\n }\n return updater;\n }\n\n // Use react-table's hook to create the table instance\n const tanTable = useReactTable({\n data: query.data?.data ?? [],\n columns: cols,\n getCoreRowModel: getCoreRowModel(),\n rowCount: query.data?.total,\n manualPagination: true, // Handle pagination manually since pagination is done server side for data tables\n onPaginationChange: updater => {\n updateTableState({ pagination: resolveUpdater(updater, pagination) });\n },\n manualSorting: true, // Handle sorting manually since sorting is done server side for data tables\n onSortingChange: updater => {\n setRowSelection({});\n updateTableState({ sorting: [...resolveUpdater(updater, sorting)] }); // Reset selection when sorting.\n },\n manualFiltering: true, // Handle filtering manually since filtering is done server side for data tables\n onColumnVisibilityChange: updater => {\n setColumnVisibility(resolveUpdater(updater, columnVisibility));\n },\n onRowSelectionChange: updater => {\n setRowSelection(resolveUpdater(updater, rowSelection));\n },\n onColumnOrderChange: updater => {\n setColumnOrder(resolveUpdater(updater, columnOrder));\n },\n state: {\n sorting: sorting,\n columnVisibility: columnVisibility,\n pagination: pagination,\n rowSelection: rowSelection,\n columnOrder: columnOrder,\n },\n meta: {\n refetch: query.refetch,\n },\n });\n\n // By default, ColumnDef does not give guarantees of column.id existing. Once useReactTable is called, all columns are assigned IDs.\n // This populates the columnIds in the columnOrder state\n useEffect(() => {\n setColumnOrder([...tanTable.getAllLeafColumns().map(c => c.id)]);\n }, []);\n\n return {\n tableState,\n updateTableState,\n query,\n setSearchQuery,\n searchQuery,\n tanTable,\n mergedFilters,\n filters,\n setFilters,\n filterConfig,\n tableActions,\n } as const;\n}\n\nexport const DataTableContext = createContext<ReturnType<typeof useDataTableState> | null>(null);\n// TODO, don't export this\nexport function useDataTable() {\n const ctx = useContext(DataTableContext);\n if (!ctx) {\n throw Error('DataTable should be used within DataTableProvider.');\n }\n return ctx;\n}\n\nexport function DataTableProvider<T extends object, TOperation extends keyof operations>({\n children,\n ...props\n}: { children: React.ReactNode } & ReturnType<typeof useDataTableState<T, TOperation>>) {\n // @ts-expect-error, propogating the generic type further will be more complex. Since this is a tightly coupled type, it should be okay but reviewed whenever useDataTableState changes.\n return <DataTableContext.Provider value={props}>{children}</DataTableContext.Provider>;\n}\n\nexport type DataTableProps = React.ComponentProps<'section'>;\nexport function DataTable({ className, ...props }: DataTableProps) {\n const { query, tanTable } = useDataTable();\n\n return (\n <>\n {/* Table Actions Section */}\n <section {...props} className={classNames('flex flex-col bg-elevation-1', className)}>\n <Actions />\n {/* The div here is necessary because TableContent is internally a <table> tag and does not respect width, height CSS */}\n <div className=\"w-full overflow-auto border-x h-table relative\" tabIndex={0}>\n {/* Table overlay with loader */}\n {query.isLoading && (\n <TableOverlay className=\"cursor-wait\">\n <Loader />\n </TableOverlay>\n )}\n {/* Table overlay for empty table */}\n {!query.isLoading && tanTable.getRowModel().rows.length === 0 && (\n // Empty table\n <TableOverlay className=\"cursor-not-allowed\">\n {!query.isFetching &&\n (query.isError ? (\n <span className=\"flex gap-3 justify-center items-center\">\n {/* TODO (mudasir-pandith) Check for 403 explicitly!! */}\n {/* <span>{query.error}</span> */}\n <IcInfo />\n <span>{query.error.message}</span>\n </span>\n ) : query.data?.data?.length === 0 ? (\n <>No results found.</>\n ) : (\n <>Unknown error. Please contact customer support.</>\n ))}\n </TableOverlay>\n )}\n {!query.isLoading && tanTable.getRowModel().rows.length !== 0 && (\n <TableContent className=\"w-full\" />\n )}\n </div>\n\n {/* Table Footer Section with Pagination and Column Picker */}\n <div className=\"flex w-full justify-between border gap-icon p-icon overflow-x-auto\">\n <div className=\"flex gap-icon\">\n <ColumnPicker />\n <PageSize />\n </div>\n <Paginator />\n </div>\n </section>\n </>\n );\n}\n/** Table overlay to be shown for loaders or other messages */\nfunction TableOverlay({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <>\n <span\n className={classNames(\n className,\n 'absolute top-0 bg-elevation-1 text-foreground z-20 size-full body-sm flex items-center justify-center'\n )}\n >\n {children}\n </span>\n {/* Keep something in document flow with the correct height */}\n <span className=\"relative h-full w-0 block\" />\n </>\n );\n}\n\n// TODO, ?include query param on Licenses, Activations and other future resources that need this\nfunction ColumnPicker() {\n const { tanTable } = useDataTable();\n const [activeId, setActiveId] = useState<string | null>(null);\n\n const resourceFormatter = useResourceFormatter();\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n })\n );\n return (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragStart={event => {\n const { active } = event;\n setActiveId(active.id.toString());\n }}\n onDragEnd={event => {\n const { active, over } = event;\n\n if (over && active.id !== over.id) {\n const columnOrder = tanTable.getState().columnOrder;\n const oldIndex = columnOrder.indexOf(active.id.toString());\n const newIndex = columnOrder.indexOf(over.id.toString());\n tanTable.setColumnOrder([...arrayMove(columnOrder, oldIndex, newIndex)]);\n }\n\n setActiveId(null);\n }}\n >\n <SortableContext items={tanTable.getState().columnOrder} strategy={verticalListSortingStrategy}>\n <EasyMenu\n label={\n <>\n <IcColumns className=\"inline align-bottom me-1\" />\n Columns\n </>\n }\n selectionMode=\"multiple\"\n items={tanTable.getAllFlatColumns()}\n // Using selectedKeys = 'all' does not mark MenuItems with isDisabled=true as selected. This is not the intended behaviour in this use-case.\n selectedKeys={tanTable.getVisibleFlatColumns().map(c => c.id)}\n >\n <MenuItem onAction={() => tanTable.toggleAllColumnsVisible()} className={'italic'}>\n (select all)\n </MenuItem>\n {tanTable.getState().columnOrder.map(colId => {\n const col = tanTable.getAllFlatColumns().find(c => c.id === colId);\n if (!col) return null;\n return <SortableItem key={col.id} column={col} />;\n })}\n </EasyMenu>\n <DragOverlay>\n {activeId ? (\n <div className=\"opacity-70 border-2 border-primary\">{resourceFormatter(activeId)}</div>\n ) : null}\n </DragOverlay>\n </SortableContext>\n </DndContext>\n );\n\n function SortableItem({ column }: { column: Column<any, unknown> }) {\n const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: column.id });\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n zIndex: '999',\n };\n return (\n <MenuItem\n ref={setNodeRef}\n style={style}\n {...attributes}\n id={column.id}\n onAction={() => column.toggleVisibility()}\n isDisabled={!column.getCanHide()}\n className=\"flex items-center\"\n >\n <IcGrip {...listeners} className=\"size-icon cursor-grab\" />\n {resourceFormatter(column.id)}\n {column.getIsSorted() && <SortIcon className=\"size-icon\" direction={column.getIsSorted()} />}\n </MenuItem>\n );\n }\n}\n\nfunction Paginator() {\n const { tanTable, query } = useDataTable();\n const rowCount = query.data?.total ?? 0;\n return (\n <div className=\"flex items-center gap-2\">\n <span className=\"whitespace-nowrap body-sm text-muted\">\n {`${tanTable.getState().pagination.pageIndex * tanTable.getState().pagination.pageSize + 1} - ${Math.min(\n (tanTable.getState().pagination.pageIndex + 1) * tanTable.getState().pagination.pageSize,\n rowCount\n )} of ${rowCount?.toLocaleString()}`}\n </span>\n\n <Button\n aria-label=\"First page\"\n onPress={() => tanTable.firstPage()}\n isDisabled={!tanTable.getCanPreviousPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcFirst />\n </Button>\n <Button\n aria-label=\"Previous page\"\n onPress={() => tanTable.previousPage()}\n isDisabled={!tanTable.getCanPreviousPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcLeft />\n </Button>\n <Button\n aria-label=\"Next page\"\n onPress={() => tanTable.nextPage()}\n isDisabled={!tanTable.getCanNextPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcRight />\n </Button>\n <Button\n aria-label=\"Last page\"\n onClick={() => tanTable.lastPage()}\n isDisabled={!tanTable.getCanNextPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcLast />\n </Button>\n </div>\n );\n}\n\nfunction PageSize() {\n const { tanTable } = useDataTable();\n const PAGE_SIZES = [10, 20, 30, 40, 50];\n\n return (\n <EasyMenu\n label={tanTable.getState().pagination.pageSize.toString()}\n selectionMode=\"single\"\n selectedKeys={[tanTable.getState().pagination.pageSize.toString()]}\n items={PAGE_SIZES.map(s => ({ id: s.toString(), value: s }))}\n >\n {items => <MenuItem onAction={() => tanTable.setPageSize(items.value)}>{items.value}</MenuItem>}\n </EasyMenu>\n );\n}\n\nfunction Actions() {\n const { query, tanTable, searchQuery, setSearchQuery, tableActions } = useDataTable();\n\n return (\n <section className=\"flex bg-elevation-1 justify-between my-0 p-icon border gap-icon overflow-auto\">\n <div className=\"flex gap-icon\">\n <Button\n aria-label=\"Refresh\"\n isPending={query.isFetching}\n onClick={() => query.refetch()}\n variant={'neutral'}\n size={'icon'}\n >\n <IcRefresh />\n </Button>\n\n {tableActions\n .filter(ta => ta.bulk === tanTable.getSelectedRowModel().rows.length > 0)\n .map((ta, i) => {\n const Icon = ta.icon;\n return (\n <Button\n aria-label={ta.label}\n key={`${i}-${ta.bulk}`}\n type=\"button\"\n isDisabled={query.isFetching}\n className=\"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform\"\n onPress={e => {\n ta.onClick(\n e,\n tanTable.getSelectedRowModel().rows.map(r => r.original)\n );\n }}\n size={'icon'}\n >\n <Icon />\n </Button>\n );\n })}\n </div>\n <div className=\"flex gap-icon\">\n <DataTableFilter />\n {<SearchField value={searchQuery} onChange={setSearchQuery} />}\n </div>\n </section>\n );\n}\n\nfunction SortIcon({\n direction,\n ...props\n}: { direction: 'asc' | 'desc' | false } & Omit<React.ComponentProps<'svg'>, 'direction'>) {\n if (direction === 'asc') return <IcSortAsc className=\"size-3.5\" {...props} />;\n else if (direction === 'desc') return <IcSortDesc className=\"size-3.5\" {...props} />;\n else return <IcSortNone className=\"size-3.5\" {...props} />;\n}\n\nfunction HeaderText({ header }: { header: any }) {\n const resourceFormatter = useResourceFormatter();\n return header.column.columnDef.header\n ? flexRender(header.column.columnDef.header, header.getContext())\n : resourceFormatter(header.id);\n}\n\n// TODO, automate checking valid HTML\nfunction TableContent({ className }: React.ComponentProps<typeof TableComponent>) {\n const { tanTable } = useDataTable();\n const tableCellStyle = (isSticky: boolean, className?: string) =>\n classNames(\n 'px-icon py-2 text-left body-sm font-medium whitespace-nowrap',\n isSticky && 'bg-elevation-1 sticky right-0 z-50 text-center',\n className\n );\n return (\n <TableComponent className={classNames('table-auto', className)}>\n <TableHeader className=\"sticky top-0 z-10\">\n {tanTable.getHeaderGroups().map(headerGroup => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map(header => (\n <TableHead\n scope=\"col\"\n key={header.id}\n colSpan={header.colSpan}\n className={tableCellStyle(false, 'bg-elevation-1')}\n >\n {!header.column.getCanSort() && !header.isPlaceholder && (\n <div className=\"w-full justify-start p-1 inline-flex items-center gap-1 body-sm\">\n <HeaderText header={header} />\n </div>\n )}\n {header.column.getCanSort() && (\n <Button\n variant=\"ghost\"\n className=\"w-full justify-start p-1\"\n onPress={header.column.getToggleSortingHandler()}\n >\n <span>\n <HeaderText header={header} />\n </span>\n <SortIcon direction={header.column.getIsSorted()} />\n </Button>\n )}\n </TableHead>\n ))}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {tanTable.getRowModel().rows.map(row => (\n <TableRow\n className={classNames(\n 'transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20'\n )}\n key={row.id}\n data-selected={row.getIsSelected()}\n >\n {row.getVisibleCells().map(cell => (\n <TableCell key={cell.id} className={tableCellStyle(cell.column.id === ACTIONS_COLUMN_ID)}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableCell>\n ))}\n </TableRow>\n ))}\n </TableBody>\n </TableComponent>\n );\n}\n","'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport { useRef } from 'react';\nimport { Button } from '../components/button';\nimport { useDataTable } from '../components/data-table';\nimport { TfDatePicker } from '../components/date-picker';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport type { MultiSelectProps } from '../components/multi-select';\nimport { Popover, PopoverTrigger } from '../components/popover';\nimport { useAppForm } from '../utilities/form-hook';\nimport { useResourceFormatter, type ApiFilters } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { IcAccount, IcCheck, IcDate, IcFile, IcFilter, IcLicense, IcMinus, IcRemove, type CtxIcon } from './icons';\nimport { TfMultipleIdSearchInput } from './id-search';\n\nexport const FILTER_COMPARISON_OPERATORS = [\n 'eq',\n 'ne',\n 'cn',\n 'nc',\n 'sw',\n 'ew',\n 'in',\n 'nin',\n 'gt',\n 'gte',\n 'lt',\n 'lte',\n] as const;\nexport type FilterComparisonOperator = (typeof FILTER_COMPARISON_OPERATORS)[number];\n\nexport const COMPARISON_OPERATOR_LABELS: Record<FilterComparisonOperator, string> = {\n eq: 'equal to',\n ne: 'not equal to',\n cn: 'contains',\n nc: 'does not contain',\n sw: 'starts with',\n ew: 'ends with',\n in: 'includes',\n nin: 'does not include',\n gt: 'greater than',\n gte: 'greater than or equal to',\n lt: 'less than',\n lte: 'less than or equal to',\n};\n\ntype BaseLocalFilter<T extends FilterType, V> = {\n id: string;\n type: T;\n property: string;\n operator: FilterComparisonOperator;\n value: V | undefined;\n displayValue?: string;\n};\ntype EnumLocalFilter = BaseLocalFilter<'enum', Set<string | number>>;\ntype IdLocalFilter = BaseLocalFilter<'id', string>;\ntype BoolLocalFilter = BaseLocalFilter<'bool', boolean>;\ntype StringLocalFilter = BaseLocalFilter<'string', string>;\ntype NumberLocalFilter = BaseLocalFilter<'number', number>;\n// DatePicker accepts a string,and converts it to a ZonedDateTime\ntype DateLocalFilter = BaseLocalFilter<'date', string>;\ntype IdSearchLocalFilter = BaseLocalFilter<'id-search', string[]>;\n// TODO, entitlementSets.productIds\nfunction createNewFilter(type: FilterType, property: string): TableFilter {\n const id = `${property}-${Date.now()}`;\n const operator = FilterOperations[type][0];\n\n switch (type) {\n case 'bool':\n return { id, type, property, operator, value: true };\n case 'string':\n return { id, type, property, operator, value: '' };\n case 'date':\n return { id, type, property, operator, value: new Date().toISOString() };\n case 'id':\n return { id, type, property, operator, value: '' };\n case 'id-search':\n return { id, type, property, operator, value: [] };\n case 'enum':\n return { id, type, property, operator, value: new Set<string | number>() };\n case 'number':\n return { id, type, property, operator, value: 0 };\n }\n}\n\nexport type TableFilter =\n | EnumLocalFilter\n | IdLocalFilter\n | BoolLocalFilter\n | StringLocalFilter\n | DateLocalFilter\n | IdSearchLocalFilter\n | NumberLocalFilter;\n\nexport type FilterConfig =\n | { type: 'enum'; options: MultiSelectProps['items'] }\n | ({ type: 'id-search' } & Pick<\n React.ComponentProps<typeof TfMultipleIdSearchInput>,\n 'accessor' | 'searchFn' | 'resource'\n >)\n | { type: 'id' }\n | { type: 'bool' }\n | { type: 'string' }\n | { type: 'date' }\n | { type: 'number' };\n\nexport type FilterType = FilterConfig['type'];\n\nconst FilterOperations: Record<FilterType, FilterComparisonOperator[]> = {\n bool: ['eq'],\n enum: ['in', 'nin'],\n id: ['in', 'nin'],\n 'id-search': ['in', 'nin'],\n string: ['eq', 'ne', 'cn', 'nc', 'sw', 'ew', 'in', 'nin'],\n date: ['lt', 'gt'],\n number: ['eq', 'ne', 'gt', 'gte', 'lt', 'lte'],\n};\n\n// TS workaround to get rid of filterConfig: Required<Record<never, FilterConfig>>\nexport type FiltersConfig<TOperation extends keyof operations> = [keyof ApiFilters<TOperation>] extends [never]\n ? Record<string, FilterConfig>\n : Required<Record<keyof ApiFilters<TOperation>, FilterConfig>>;\n\nexport function DataTableFilter({ className, ...props }: React.ComponentProps<'section'>) {\n const { filters, query, setFilters, filterConfig } = useDataTable();\n\n const addFilterButtonRef = useRef<HTMLButtonElement>(null);\n\n const resourceFormatter = useResourceFormatter();\n\n const DEFAULT_VALUES: { filters: TableFilter[] } = {\n filters,\n };\n const form = useAppForm({\n defaultValues: DEFAULT_VALUES,\n onSubmit: ({ value }) => {\n setFilters(value.filters);\n },\n });\n\n // More reason to hate TS https://github.com/Microsoft/TypeScript/issues/12870\n const filterKeys = Object.keys(filterConfig).sort();\n\n return (\n <section {...props} className={classNames('flex gap-icon items-center', className)}>\n <PopoverTrigger\n onOpenChange={o => {\n // Set filters when the popover closes\n if (!o) {\n form.handleSubmit();\n } else {\n addFilterButtonRef.current?.focus();\n }\n }}\n >\n <div className=\"relative\">\n {filters.length > 0 && (\n <div className=\"size-2 rounded-full absolute bg-primary/90 z-20 top-0 right-0 translate-x-0.5 -translate-y-0.5\"></div>\n )}\n <Button\n aria-label=\"Filter\"\n isDisabled={query.isPending || filterKeys.length === 0}\n type=\"button\"\n size={'icon'}\n variant={'neutral'}\n >\n <IcFilter />\n </Button>\n </div>\n {/* TODO, icon maps with dynamic imports? */}\n {/* TODO open popover with form for property specific filter */}\n {/* TODO, icons here??? */}\n <Popover className=\"w-full p-icon\">\n <form\n onSubmit={e => {\n e.preventDefault();\n }}\n className=\"flex flex-col gap-icon max-h-table overflow-auto \"\n >\n <form.Field mode=\"array\" name={'filters'}>\n {field => {\n return (\n <>\n {field.state.value.map((lf, i) => {\n return (\n <div key={lf.id} className=\"flex gap-icon items-center justify-normal\">\n <span className=\"body-sm\">{resourceFormatter(lf.property)}</span>\n <form.AppField key={lf.id} name={`filters[${i}].operator`}>\n {sf => (\n <sf.TfSingleSelect\n items={FilterOperations[lf.type].map(op => ({\n id: op,\n label: <>{COMPARISON_OPERATOR_LABELS[op]}</>,\n }))}\n />\n )}\n </form.AppField>\n\n {lf.type === 'bool' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfCheckbox autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'date' && (\n <form.AppField name={`filters[${i}].value`}>\n {_ => <TfDatePicker autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'id' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfTextField autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'string' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfTextField autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'number' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfNumberField autoFocus />}\n </form.AppField>\n )}\n\n {lf.type === 'enum' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => {\n const config = filterConfig[lf.property];\n if (config.type !== 'enum') return null;\n return <sf.TfMultiSelect items={config.options} />;\n }}\n </form.AppField>\n )}\n\n {lf.type === 'id-search' && (\n <form.AppField name={`filters[${i}].value`}>\n {_ => {\n const config = filterConfig[lf.property];\n if (config.type !== 'id-search') return null;\n return (\n <TfMultipleIdSearchInput\n resource={config.resource}\n accessor={config.accessor}\n searchFn={config.searchFn}\n />\n );\n }}\n </form.AppField>\n )}\n\n <Button\n type=\"button\"\n variant=\"neutral\"\n size=\"icon\"\n onPress={() => field.removeValue(i)}\n >\n <IcRemove />\n </Button>\n </div>\n );\n })}\n <div className=\"flex w-full items-center justify-end gap-2 not-first:mt-icon\">\n <EasyMenu label=\"Add filter\" autoFocus>\n {filterKeys.sort().map(k => {\n const type = filterConfig[k].type;\n const Icon = FilterIcon[type];\n return (\n <MenuItem\n key={k}\n onAction={() => {\n const newFilter = createNewFilter(type, k);\n field.pushValue(newFilter);\n }}\n >\n {resourceFormatter(k)}\n <Icon />\n </MenuItem>\n );\n })}\n </EasyMenu>\n {field.state.value.length > 0 ? (\n <Button\n type=\"button\"\n variant=\"neutral\"\n onPress={() => {\n field.setValue([]);\n }}\n >\n <IcRemove />\n Reset\n </Button>\n ) : null}\n </div>\n </>\n );\n }}\n </form.Field>\n </form>\n </Popover>\n </PopoverTrigger>\n </section>\n );\n}\n\nconst FilterIcon: Record<FilterConfig['type'], CtxIcon> = {\n 'id-search': IcFile,\n bool: IcCheck,\n date: IcDate,\n enum: IcLicense,\n id: IcAccount,\n number: IcMinus,\n string: IcCheck,\n};\n"],"names":["getTableCallback","getter","callback","pagination","sorting","searching","filters","query","generateSortParam","_f","columnHelper","createColumnHelper","sort","cH","TABLE_CHECK_BOX_COLUMN","table","jsx","Checkbox","row","TABLE_ID_COLUMN","TABLE_DEFAULT_DATE_COLUMNS","date","formatDate","ACTIONS_COLUMN_ID","getActionColumn","rowActions","DialogMenu","IcMoreVertical","useDataTableState","resourceName","columns","filterConfig","columnsToHideByDefault","allowSelection","initialFilters","tableActions","tableState","_setTableState","useState","rowSelection","setRowSelection","searchQuery","setSearchQuery","columnOrder","setColumnOrder","useLocalStorage","columnVisibility","setColumnVisibility","setFilters","mergedFilters","useMemo","tf","acc","current","merge","updateTableState","updates","prev","useQuery","keepPreviousData","cols","isUpdaterFunction","updater","resolveUpdater","currentValue","tanTable","useReactTable","getCoreRowModel","useEffect","c","DataTableContext","createContext","useDataTable","ctx","useContext","DataTableProvider","children","props","DataTable","className","Fragment","classNames","Actions","jsxs","TableOverlay","Loader","IcInfo","TableContent","ColumnPicker","PageSize","Paginator","activeId","setActiveId","resourceFormatter","useResourceFormatter","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","closestCenter","event","active","over","oldIndex","newIndex","arrayMove","SortableContext","verticalListSortingStrategy","EasyMenu","IcColumns","MenuItem","colId","col","SortableItem","DragOverlay","column","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","IcGrip","SortIcon","rowCount","Button","IcFirst","IcLeft","IcRight","IcLast","PAGE_SIZES","s","items","IcRefresh","ta","i","Icon","e","r","DataTableFilter","SearchField","direction","IcSortAsc","IcSortDesc","IcSortNone","HeaderText","header","flexRender","tableCellStyle","isSticky","TableComponent","TableHeader","headerGroup","TableRow","TableHead","TableBody","cell","TableCell","FILTER_COMPARISON_OPERATORS","COMPARISON_OPERATOR_LABELS","createNewFilter","type","property","id","operator","FilterOperations","addFilterButtonRef","useRef","form","useAppForm","value","filterKeys","PopoverTrigger","o","IcFilter","Popover","field","lf","sf","op","_","TfDatePicker","config","TfMultipleIdSearchInput","IcRemove","k","FilterIcon","newFilter","IcFile","IcCheck","IcDate","IcLicense","IcAccount","IcMinus"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"data-table.js","sources":["../../lib/components/data-table.tsx","../../lib/components/data-table-filter.tsx"],"sourcesContent":["'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport {\n closestCenter,\n DndContext,\n DragOverlay,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\nimport {\n arrayMove,\n SortableContext,\n sortableKeyboardCoordinates,\n useSortable,\n verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { keepPreviousData, useQuery } from '@tanstack/react-query';\nimport {\n type Column,\n type ColumnDef,\n type ColumnHelper,\n type ColumnOrderState,\n createColumnHelper,\n flexRender,\n getCoreRowModel,\n type Header,\n type PaginationState,\n type RowSelectionState,\n type SortingState,\n type Updater,\n useReactTable,\n type VisibilityState,\n} from '@tanstack/react-table';\nimport { useLocalStorage } from '@uidotdev/usehooks';\nimport { merge } from 'lodash-es';\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react';\nimport type { PressEvent } from 'react-aria-components';\nimport { Button } from '../components/button';\nimport { DataTableFilter, type FiltersConfig, type TableFilter } from '../components/data-table-filter';\nimport { DialogMenu, type DialogMenuAction } from '../components/dialog-menu';\nimport { Loader } from '../components/loader';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport { SearchField } from '../components/searchfield';\nimport { TableBody, TableCell, Table as TableComponent, TableHead, TableHeader, TableRow } from '../components/table';\nimport { formatDate } from '../utilities/date';\nimport type { CtxResourceName } from '../utilities/resources';\nimport { useResourceFormatter } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { Checkbox } from './checkbox';\nimport {\n type CtxIcon,\n IcColumns,\n IcFirst,\n IcGrip,\n IcInfo,\n IcLast,\n IcLeft,\n IcMoreVertical,\n IcRefresh,\n IcRight,\n IcSortAsc,\n IcSortDesc,\n IcSortNone,\n} from './icons';\n\n/** Reserved name for actions column */\n// export const ACTIONS_COLUMN_ID = 'tableActions';\n\nexport type TableAction<in TActionData> = {\n label: string;\n onClick: (e: PressEvent, t: TActionData[]) => void;\n bulk: boolean;\n icon: CtxIcon;\n tooltip?: string;\n};\n\nexport type TableFetchFn<in out TData extends object> = (\n p: PaginationState,\n s: SortingState,\n q: string,\n f: Record<string, any>\n) => Promise<{\n total: number;\n data: TData[] | undefined;\n}>;\nexport function getTableCallback<T extends object>(\n getter: (\n q: Record<string, any>\n ) => Promise<{ data?: T[]; error?: { code?: string | null; message: string }; response: Response }>\n): { callback: TableFetchFn<T>; columnHelper: ColumnHelper<T> } {\n const callback: TableFetchFn<T> = async (pagination, sorting, searching, filters) => {\n const query = {\n ...filters,\n page: pagination.pageIndex + 1,\n limit: pagination.pageSize,\n sort: generateSortParam(sorting[0]),\n search: searching,\n };\n\n const _f = await getter(query);\n\n return {\n total: Number.parseInt(_f.response.headers.get('Pagination-Count') || '0'),\n data: _f.data,\n };\n };\n\n const columnHelper = createColumnHelper<T>();\n\n return { callback, columnHelper };\n}\n\nfunction generateSortParam(sort: { id: string; desc: boolean } | undefined): string {\n if (sort) {\n if (sort.desc) {\n return `-${sort.id}`;\n } else {\n return `+${sort.id}`;\n }\n } else {\n return '-createdAt';\n }\n}\n\nconst cH = createColumnHelper<any>();\nconst TABLE_CHECK_BOX_COLUMN = [\n cH.accessor('checkbox', {\n header: ({ table }) => (\n <Checkbox\n isIndeterminate={table.getIsSomeRowsSelected() && !table.getIsAllPageRowsSelected()}\n isSelected={table.getIsAllPageRowsSelected() || table.getIsSomePageRowsSelected()}\n onChange={() => table.toggleAllPageRowsSelected()}\n aria-label=\"Select all\"\n />\n ),\n\n cell: ({ row }) => (\n <Checkbox isSelected={row.getIsSelected()} onChange={() => row.toggleSelected()} aria-label=\"Select row\" />\n ),\n enableSorting: false,\n enableHiding: false,\n }),\n];\n\nconst TABLE_ID_COLUMN = [\n cH.accessor('id', {\n header: 'ID',\n }),\n];\nconst TABLE_DEFAULT_DATE_COLUMNS = [\n cH.accessor('createdAt', {\n header: 'Creation Date',\n cell: ({ row }) => {\n const date = row.getValue('createdAt') satisfies string | null | undefined;\n return formatDate(date);\n },\n enableHiding: false,\n }),\n cH.accessor('updatedAt', {\n header: 'Last Updated',\n cell: ({ row }) => {\n const date = row.getValue('updatedAt') satisfies string | null | undefined;\n return formatDate(date);\n },\n enableHiding: false,\n }),\n];\n\nconst ACTIONS_COLUMN_ID = 'TableActions';\nconst getActionColumn = (rowActions: DialogMenuAction<any>[]) => {\n if (rowActions.length === 0) return [];\n\n return [\n cH.accessor(ACTIONS_COLUMN_ID, {\n header: 'Actions',\n id: ACTIONS_COLUMN_ID,\n enableHiding: false,\n cell: ({ row }) => <DialogMenu label={<IcMoreVertical />} data={row.original} items={rowActions} />,\n enableSorting: false,\n }),\n ];\n};\n\ntype DataTableFactory<T extends object, TOperation extends keyof operations> = {\n resourceName: CtxResourceName;\n callback: TableFetchFn<T>;\n columns: ColumnDef<T, any>[];\n tableActions: TableAction<T>[];\n columnsToHideByDefault?: Partial<Record<keyof T, boolean>>; // Columns that are hidden by default\n allowSelection?: boolean;\n filterConfig: FiltersConfig<TOperation>;\n initialFilters: TableFilter[];\n rowActions?: DialogMenuAction<T>[];\n};\n\ntype DataTableState = {\n sorting: SortingState;\n pagination: PaginationState;\n};\n/**\n * Hook for handling all data-table state. Used in DataTableContext\n */\nexport function useDataTableState<T extends object, TOperation extends keyof operations>({\n resourceName,\n columns,\n callback,\n filterConfig,\n columnsToHideByDefault = {},\n allowSelection = false,\n initialFilters = [],\n tableActions,\n rowActions,\n}: DataTableFactory<T, TOperation>) {\n const [tableState, _setTableState] = useState<DataTableState>({\n /** Reflect in URL in host application */\n pagination: { pageIndex: 0, pageSize: 20 }, // Pagination state\n sorting: [], // Sorting state\n });\n //\n const [rowSelection, setRowSelection] = useState<RowSelectionState>({});\n\n /** Reflect in URL in host application */\n const [searchQuery, setSearchQuery] = useState('');\n\n const [columnOrder, setColumnOrder] = useLocalStorage<ColumnOrderState>(\n `${resourceName}_ctx_column_order_preference`,\n []\n );\n const [columnVisibility, setColumnVisibility] = useLocalStorage<VisibilityState>(\n `${resourceName}_ctx_column_visibility_preference`,\n {\n id: false,\n ...columnsToHideByDefault,\n }\n );\n\n const [filters, setFilters] = useState(initialFilters);\n\n const mergedFilters = useMemo(() => {\n // TODO, generic transform fn\n return filters\n .map(tf => {\n if (Array.isArray(tf.value)) {\n return {\n [tf.property]: {\n [tf.operator]: tf.value.join(','),\n },\n };\n }\n return {\n [tf.property]: {\n [tf.operator]: tf.value,\n },\n };\n })\n .reduce((acc, current) => {\n return merge(acc, current);\n }, {});\n }, [filters]);\n\n // Update table state with new values\n const updateTableState = (updates: Partial<DataTableState>) => {\n _setTableState(prev => ({ ...prev, ...updates }));\n };\n\n const { sorting, pagination } = tableState;\n\n const query = useQuery({\n queryKey: [resourceName, pagination, sorting, searchQuery, mergedFilters],\n queryFn: () => callback(pagination, sorting, searchQuery, mergedFilters),\n placeholderData: keepPreviousData, // Keep previous data while loading new data\n retry: 0,\n refetchOnWindowFocus: false,\n });\n\n /**\n * ID,createdAt and updatedAt will be added by default for all tables\n * If selection is allowed, checkbox will be added\n * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n * If there are actions for the table, they will be placed fixed at the right side of table.\n */\n const cols: ColumnDef<any, any>[] = [\n ...(allowSelection ? TABLE_CHECK_BOX_COLUMN : []),\n ...TABLE_ID_COLUMN,\n ...columns,\n ...TABLE_DEFAULT_DATE_COLUMNS,\n ...getActionColumn(rowActions ?? []),\n ];\n\n // Type-guard for updater\n function isUpdaterFunction<T>(updater: Updater<T>): updater is (old: T) => T {\n return typeof updater === 'function';\n }\n // Utility function to resolve updater\n function resolveUpdater<T>(updater: Updater<T>, currentValue: T) {\n if (isUpdaterFunction(updater)) {\n return updater(currentValue);\n }\n return updater;\n }\n\n // Use react-table's hook to create the table instance\n const tanTable = useReactTable({\n data: query.data?.data ?? [],\n columns: cols,\n getCoreRowModel: getCoreRowModel(),\n rowCount: query.data?.total,\n manualPagination: true, // Handle pagination manually since pagination is done server side for data tables\n onPaginationChange: updater => {\n updateTableState({ pagination: resolveUpdater(updater, pagination) });\n },\n manualSorting: true, // Handle sorting manually since sorting is done server side for data tables\n onSortingChange: updater => {\n setRowSelection({});\n updateTableState({ sorting: [...resolveUpdater(updater, sorting)] }); // Reset selection when sorting.\n },\n manualFiltering: true, // Handle filtering manually since filtering is done server side for data tables\n onColumnVisibilityChange: updater => {\n setColumnVisibility(resolveUpdater(updater, columnVisibility));\n },\n onRowSelectionChange: updater => {\n setRowSelection(resolveUpdater(updater, rowSelection));\n },\n onColumnOrderChange: updater => {\n setColumnOrder(resolveUpdater(updater, columnOrder));\n },\n state: {\n sorting: sorting,\n columnVisibility: columnVisibility,\n pagination: pagination,\n rowSelection: rowSelection,\n columnOrder: columnOrder,\n },\n meta: {\n refetch: query.refetch,\n },\n });\n\n // By default, ColumnDef does not give guarantees of column.id existing. Once useReactTable is called, all columns are assigned IDs.\n // This populates the columnIds in the columnOrder state\n useEffect(() => {\n setColumnOrder([...tanTable.getAllLeafColumns().map(c => c.id)]);\n }, []);\n\n return {\n tableState,\n updateTableState,\n query,\n setSearchQuery,\n searchQuery,\n tanTable,\n mergedFilters,\n filters,\n setFilters,\n filterConfig,\n tableActions,\n } as const;\n}\n\nexport const DataTableContext = createContext<ReturnType<typeof useDataTableState> | null>(null);\n// TODO, don't export this\nexport function useDataTable() {\n const ctx = useContext(DataTableContext);\n if (!ctx) {\n throw Error('DataTable should be used within DataTableProvider.');\n }\n return ctx;\n}\n\nexport function DataTableProvider<T extends object, TOperation extends keyof operations>({\n children,\n ...props\n}: { children: React.ReactNode } & ReturnType<typeof useDataTableState<T, TOperation>>) {\n // @ts-expect-error, propogating the generic type further will be more complex. Since this is a tightly coupled type, it should be okay but reviewed whenever useDataTableState changes.\n return <DataTableContext.Provider value={props}>{children}</DataTableContext.Provider>;\n}\n\nexport type DataTableProps = React.ComponentProps<'section'>;\nexport function DataTable({ className, ...props }: DataTableProps) {\n const { query, tanTable } = useDataTable();\n\n return (\n <>\n {/* Table Actions Section */}\n <section {...props} className={classNames('flex flex-col bg-elevation-1', className)}>\n <Actions />\n {/* The div here is necessary because TableContent is internally a <table> tag and does not respect width, height CSS */}\n <div className=\"w-full overflow-auto border-x h-table relative\" tabIndex={0}>\n {/* Table overlay with loader */}\n {query.isLoading && (\n <TableOverlay className=\"cursor-wait\">\n <Loader />\n </TableOverlay>\n )}\n {/* Table overlay for empty table */}\n {!query.isLoading && tanTable.getRowModel().rows.length === 0 && (\n // Empty table\n <TableOverlay className=\"cursor-not-allowed\">\n {!query.isFetching &&\n (query.isError ? (\n <span className=\"flex gap-3 justify-center items-center\">\n {/* TODO (mudasir-pandith) Check for 403 explicitly!! */}\n {/* <span>{query.error}</span> */}\n <IcInfo />\n <span>{query.error.message}</span>\n </span>\n ) : query.data?.data?.length === 0 ? (\n <>No results found.</>\n ) : (\n <>Unknown error. Please contact customer support.</>\n ))}\n </TableOverlay>\n )}\n {!query.isLoading && tanTable.getRowModel().rows.length !== 0 && (\n <TableContent className=\"w-full\" />\n )}\n </div>\n\n {/* Table Footer Section with Pagination and Column Picker */}\n <div className=\"flex w-full justify-between border gap-icon p-icon overflow-x-auto\">\n <div className=\"flex gap-icon\">\n <ColumnPicker />\n <PageSize />\n </div>\n <Paginator />\n </div>\n </section>\n </>\n );\n}\n/** Table overlay to be shown for loaders or other messages */\nfunction TableOverlay({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <>\n <span\n className={classNames(\n className,\n 'absolute top-0 bg-elevation-1 text-foreground z-20 size-full body-sm flex items-center justify-center'\n )}\n >\n {children}\n </span>\n {/* Keep something in document flow with the correct height */}\n <span className=\"relative h-full w-0 block\" />\n </>\n );\n}\n\n// TODO, ?include query param on Licenses, Activations and other future resources that need this\nfunction ColumnPicker() {\n const { tanTable } = useDataTable();\n const [activeId, setActiveId] = useState<string | null>(null);\n\n const resourceFormatter = useResourceFormatter();\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n })\n );\n return (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragStart={event => {\n const { active } = event;\n setActiveId(active.id.toString());\n }}\n onDragEnd={event => {\n const { active, over } = event;\n\n if (over && active.id !== over.id) {\n const columnOrder = tanTable.getState().columnOrder;\n const oldIndex = columnOrder.indexOf(active.id.toString());\n const newIndex = columnOrder.indexOf(over.id.toString());\n tanTable.setColumnOrder([...arrayMove(columnOrder, oldIndex, newIndex)]);\n }\n\n setActiveId(null);\n }}\n >\n <SortableContext items={tanTable.getState().columnOrder} strategy={verticalListSortingStrategy}>\n <EasyMenu\n label={\n <>\n <IcColumns className=\"inline align-bottom me-1\" />\n Columns\n </>\n }\n selectionMode=\"multiple\"\n items={tanTable.getAllFlatColumns()}\n // Using selectedKeys = 'all' does not mark MenuItems with isDisabled=true as selected. This is not the intended behaviour in this use-case.\n selectedKeys={tanTable.getVisibleFlatColumns().map(c => c.id)}\n >\n <MenuItem onAction={() => tanTable.toggleAllColumnsVisible()} className={'italic'}>\n (select all)\n </MenuItem>\n {tanTable.getState().columnOrder.map(colId => {\n const col = tanTable.getAllFlatColumns().find(c => c.id === colId);\n // Don't show checkbox and actions columns in picker\n if (!col || col.id === 'checkbox' || col.id === ACTIONS_COLUMN_ID) return null;\n return <SortableItem key={col.id} column={col} />;\n })}\n </EasyMenu>\n <DragOverlay>\n {activeId ? (\n <div className=\"opacity-70 border-2 border-primary\">{resourceFormatter(activeId)}</div>\n ) : null}\n </DragOverlay>\n </SortableContext>\n </DndContext>\n );\n\n function SortableItem({ column }: { column: Column<any, unknown> }) {\n const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: column.id });\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n zIndex: '999',\n };\n return (\n <MenuItem\n ref={setNodeRef}\n style={style}\n {...attributes}\n id={column.id}\n onAction={() => column.toggleVisibility()}\n isDisabled={!column.getCanHide()}\n className=\"flex items-center\"\n >\n <IcGrip {...listeners} className=\"size-icon cursor-grab\" />\n {getColumnHeaderText(column)}\n {column.getIsSorted() && <SortIcon className=\"size-icon\" direction={column.getIsSorted()} />}\n </MenuItem>\n );\n }\n}\n\nfunction Paginator() {\n const { tanTable, query } = useDataTable();\n const rowCount = query.data?.total ?? 0;\n return (\n <div className=\"flex items-center gap-2\">\n <span className=\"whitespace-nowrap body-sm text-muted\">\n {`${tanTable.getState().pagination.pageIndex * tanTable.getState().pagination.pageSize + 1} - ${Math.min(\n (tanTable.getState().pagination.pageIndex + 1) * tanTable.getState().pagination.pageSize,\n rowCount\n )} of ${rowCount?.toLocaleString()}`}\n </span>\n\n <Button\n aria-label=\"First page\"\n onPress={() => tanTable.firstPage()}\n isDisabled={!tanTable.getCanPreviousPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcFirst />\n </Button>\n <Button\n aria-label=\"Previous page\"\n onPress={() => tanTable.previousPage()}\n isDisabled={!tanTable.getCanPreviousPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcLeft />\n </Button>\n <Button\n aria-label=\"Next page\"\n onPress={() => tanTable.nextPage()}\n isDisabled={!tanTable.getCanNextPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcRight />\n </Button>\n <Button\n aria-label=\"Last page\"\n onClick={() => tanTable.lastPage()}\n isDisabled={!tanTable.getCanNextPage()}\n variant=\"neutral\"\n size={'icon'}\n >\n <IcLast />\n </Button>\n </div>\n );\n}\n\nfunction PageSize() {\n const { tanTable } = useDataTable();\n const PAGE_SIZES = [10, 20, 30, 40, 50];\n\n return (\n <EasyMenu\n label={tanTable.getState().pagination.pageSize.toString()}\n selectionMode=\"single\"\n selectedKeys={[tanTable.getState().pagination.pageSize.toString()]}\n items={PAGE_SIZES.map(s => ({ id: s.toString(), value: s }))}\n >\n {items => <MenuItem onAction={() => tanTable.setPageSize(items.value)}>{items.value}</MenuItem>}\n </EasyMenu>\n );\n}\n\nfunction Actions() {\n const { query, tanTable, searchQuery, setSearchQuery, tableActions } = useDataTable();\n\n return (\n <section className=\"flex bg-elevation-1 justify-between my-0 p-icon border gap-icon overflow-auto\">\n <div className=\"flex gap-icon\">\n <Button\n aria-label=\"Refresh\"\n isPending={query.isFetching}\n onClick={() => query.refetch()}\n variant={'neutral'}\n size={'icon'}\n >\n <IcRefresh />\n </Button>\n\n {tableActions\n .filter(ta => ta.bulk === tanTable.getSelectedRowModel().rows.length > 0)\n .map((ta, i) => {\n const Icon = ta.icon;\n return (\n <Button\n aria-label={ta.label}\n key={`${i}-${ta.bulk}`}\n type=\"button\"\n isDisabled={query.isFetching}\n className=\"animate-in fade-in slide-in-from-left-15 duration-300 transition-transform\"\n onPress={e => {\n ta.onClick(\n e,\n tanTable.getSelectedRowModel().rows.map(r => r.original)\n );\n }}\n size={'icon'}\n >\n <Icon />\n </Button>\n );\n })}\n </div>\n <div className=\"flex gap-icon\">\n <DataTableFilter />\n {<SearchField value={searchQuery} onChange={setSearchQuery} />}\n </div>\n </section>\n );\n}\n\nfunction SortIcon({\n direction,\n ...props\n}: { direction: 'asc' | 'desc' | false } & Omit<React.ComponentProps<'svg'>, 'direction'>) {\n if (direction === 'asc') return <IcSortAsc className=\"size-3.5\" {...props} />;\n else if (direction === 'desc') return <IcSortDesc className=\"size-3.5\" {...props} />;\n else return <IcSortNone className=\"size-3.5\" {...props} />;\n}\n\nfunction getColumnHeaderText(column: Column<any, unknown>): string {\n const resourceFormatter = useResourceFormatter();\n const headerDef = column.columnDef.header;\n return typeof headerDef === 'string' ? headerDef : resourceFormatter(column.id);\n}\n\nfunction HeaderText({ header }: { header: Header<any, unknown> }) {\n const headerDef = header.column.columnDef.header;\n\n if (typeof headerDef === 'string' || !headerDef) {\n return getColumnHeaderText(header.column);\n }\n\n if (typeof headerDef === 'function') {\n const result = headerDef(header.getContext());\n if (typeof result === 'string') {\n return getColumnHeaderText(header.column);\n }\n return flexRender(headerDef, header.getContext());\n }\n\n return flexRender(headerDef, header.getContext());\n}\n\n// TODO, automate checking valid HTML\nfunction TableContent({ className }: React.ComponentProps<typeof TableComponent>) {\n const { tanTable } = useDataTable();\n const tableCellStyle = (isSticky: boolean, className?: string, zIndex: string = 'z-50') =>\n classNames(\n 'px-icon py-2 text-left body-sm font-medium whitespace-nowrap',\n isSticky && `bg-elevation-1 sticky right-0 ${zIndex} text-center`,\n className\n );\n return (\n <TableComponent className={classNames('table-auto', className)}>\n <TableHeader className=\"sticky top-0 z-10\">\n {tanTable.getHeaderGroups().map(headerGroup => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map(header => (\n <TableHead\n scope=\"col\"\n key={header.id}\n colSpan={header.colSpan}\n className={tableCellStyle(header.id === ACTIONS_COLUMN_ID, 'bg-elevation-1')}\n >\n {!header.column.getCanSort() && !header.isPlaceholder && (\n <div className=\"w-full justify-start py-1 inline-flex items-center gap-1 body-sm\">\n <HeaderText header={header} />\n </div>\n )}\n {header.column.getCanSort() && (\n <Button\n variant=\"ghost\"\n className=\"w-full justify-start p-1\"\n onPress={header.column.getToggleSortingHandler()}\n >\n <span>\n <HeaderText header={header} />\n </span>\n <SortIcon direction={header.column.getIsSorted()} />\n </Button>\n )}\n </TableHead>\n ))}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {tanTable.getRowModel().rows.map(row => (\n <TableRow\n className={classNames(\n 'transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20'\n )}\n key={row.id}\n data-selected={row.getIsSelected()}\n >\n {row.getVisibleCells().map(cell => (\n <TableCell\n key={cell.id}\n className={tableCellStyle(cell.column.id === ACTIONS_COLUMN_ID, undefined, 'z-1')}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableCell>\n ))}\n </TableRow>\n ))}\n </TableBody>\n </TableComponent>\n );\n}\n","'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport { useRef } from 'react';\nimport { Button } from '../components/button';\nimport { useDataTable } from '../components/data-table';\nimport { TfDatePicker } from '../components/date-picker';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport type { MultiSelectProps } from '../components/multi-select';\nimport { Popover, PopoverTrigger } from '../components/popover';\nimport { useAppForm } from '../utilities/form-hook';\nimport { useResourceFormatter, type ApiFilters } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { IcAccount, IcCheck, IcDate, IcFile, IcFilter, IcLicense, IcMinus, IcRemove, type CtxIcon } from './icons';\nimport { TfMultipleIdSearchInput } from './id-search';\n\nexport const FILTER_COMPARISON_OPERATORS = [\n 'eq',\n 'ne',\n 'cn',\n 'nc',\n 'sw',\n 'ew',\n 'in',\n 'nin',\n 'gt',\n 'gte',\n 'lt',\n 'lte',\n] as const;\nexport type FilterComparisonOperator = (typeof FILTER_COMPARISON_OPERATORS)[number];\n\nexport const COMPARISON_OPERATOR_LABELS: Record<FilterComparisonOperator, string> = {\n eq: 'equal to',\n ne: 'not equal to',\n cn: 'contains',\n nc: 'does not contain',\n sw: 'starts with',\n ew: 'ends with',\n in: 'includes',\n nin: 'does not include',\n gt: 'greater than',\n gte: 'greater than or equal to',\n lt: 'less than',\n lte: 'less than or equal to',\n};\n\ntype BaseLocalFilter<T extends FilterType, V> = {\n id: string;\n type: T;\n property: string;\n operator: FilterComparisonOperator;\n value: V | undefined;\n displayValue?: string;\n};\ntype EnumLocalFilter = BaseLocalFilter<'enum', Set<string | number>>;\ntype IdLocalFilter = BaseLocalFilter<'id', string>;\ntype BoolLocalFilter = BaseLocalFilter<'bool', boolean>;\ntype StringLocalFilter = BaseLocalFilter<'string', string>;\ntype NumberLocalFilter = BaseLocalFilter<'number', number>;\n// DatePicker accepts a string,and converts it to a ZonedDateTime\ntype DateLocalFilter = BaseLocalFilter<'date', string>;\ntype IdSearchLocalFilter = BaseLocalFilter<'id-search', string[]>;\n// TODO, entitlementSets.productIds\nfunction createNewFilter(type: FilterType, property: string): TableFilter {\n const id = `${property}-${Date.now()}`;\n const operator = FilterOperations[type][0];\n\n switch (type) {\n case 'bool':\n return { id, type, property, operator, value: true };\n case 'string':\n return { id, type, property, operator, value: '' };\n case 'date':\n return { id, type, property, operator, value: new Date().toISOString() };\n case 'id':\n return { id, type, property, operator, value: '' };\n case 'id-search':\n return { id, type, property, operator, value: [] };\n case 'enum':\n return { id, type, property, operator, value: new Set<string | number>() };\n case 'number':\n return { id, type, property, operator, value: 0 };\n }\n}\n\nexport type TableFilter =\n | EnumLocalFilter\n | IdLocalFilter\n | BoolLocalFilter\n | StringLocalFilter\n | DateLocalFilter\n | IdSearchLocalFilter\n | NumberLocalFilter;\n\nexport type FilterConfig =\n | { type: 'enum'; options: MultiSelectProps['items'] }\n | ({ type: 'id-search' } & Pick<\n React.ComponentProps<typeof TfMultipleIdSearchInput>,\n 'accessor' | 'searchFn' | 'resource'\n >)\n | { type: 'id' }\n | { type: 'bool' }\n | { type: 'string' }\n | { type: 'date' }\n | { type: 'number' };\n\nexport type FilterType = FilterConfig['type'];\n\nconst FilterOperations: Record<FilterType, FilterComparisonOperator[]> = {\n bool: ['eq'],\n enum: ['in', 'nin'],\n id: ['in', 'nin'],\n 'id-search': ['in', 'nin'],\n string: ['eq', 'ne', 'cn', 'nc', 'sw', 'ew', 'in', 'nin'],\n date: ['lt', 'gt'],\n number: ['eq', 'ne', 'gt', 'gte', 'lt', 'lte'],\n};\n\n// TS workaround to get rid of filterConfig: Required<Record<never, FilterConfig>>\nexport type FiltersConfig<TOperation extends keyof operations> = [keyof ApiFilters<TOperation>] extends [never]\n ? Record<string, FilterConfig>\n : Required<Record<keyof ApiFilters<TOperation>, FilterConfig>>;\n\nexport function DataTableFilter({ className, ...props }: React.ComponentProps<'section'>) {\n const { filters, query, setFilters, filterConfig } = useDataTable();\n\n const addFilterButtonRef = useRef<HTMLButtonElement>(null);\n\n const resourceFormatter = useResourceFormatter();\n\n const DEFAULT_VALUES: { filters: TableFilter[] } = {\n filters,\n };\n const form = useAppForm({\n defaultValues: DEFAULT_VALUES,\n onSubmit: ({ value }) => {\n setFilters(value.filters);\n },\n });\n\n // More reason to hate TS https://github.com/Microsoft/TypeScript/issues/12870\n const filterKeys = Object.keys(filterConfig).sort();\n\n return (\n <section {...props} className={classNames('flex gap-icon items-center', className)}>\n <PopoverTrigger\n onOpenChange={o => {\n // Set filters when the popover closes\n if (!o) {\n form.handleSubmit();\n } else {\n addFilterButtonRef.current?.focus();\n }\n }}\n >\n <div className=\"relative\">\n {filters.length > 0 && (\n <div className=\"size-2 rounded-full absolute bg-primary/90 z-20 top-0 right-0 translate-x-0.5 -translate-y-0.5\"></div>\n )}\n <Button\n aria-label=\"Filter\"\n isDisabled={query.isPending || filterKeys.length === 0}\n type=\"button\"\n size={'icon'}\n variant={'neutral'}\n >\n <IcFilter />\n </Button>\n </div>\n {/* TODO, icon maps with dynamic imports? */}\n {/* TODO open popover with form for property specific filter */}\n {/* TODO, icons here??? */}\n <Popover className=\"w-full p-icon\">\n <form\n onSubmit={e => {\n e.preventDefault();\n }}\n className=\"flex flex-col gap-icon max-h-table overflow-auto \"\n >\n <form.Field mode=\"array\" name={'filters'}>\n {field => {\n return (\n <>\n {field.state.value.map((lf, i) => {\n return (\n <div key={lf.id} className=\"flex gap-icon items-center justify-normal\">\n <span className=\"body-sm\">{resourceFormatter(lf.property)}</span>\n <form.AppField key={lf.id} name={`filters[${i}].operator`}>\n {sf => (\n <sf.TfSingleSelect\n items={FilterOperations[lf.type].map(op => ({\n id: op,\n label: <>{COMPARISON_OPERATOR_LABELS[op]}</>,\n }))}\n />\n )}\n </form.AppField>\n\n {lf.type === 'bool' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfCheckbox autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'date' && (\n <form.AppField name={`filters[${i}].value`}>\n {_ => <TfDatePicker autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'id' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfTextField autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'string' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfTextField autoFocus />}\n </form.AppField>\n )}\n {lf.type === 'number' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => <sf.TfNumberField autoFocus />}\n </form.AppField>\n )}\n\n {lf.type === 'enum' && (\n <form.AppField name={`filters[${i}].value`}>\n {sf => {\n const config = filterConfig[lf.property];\n if (config.type !== 'enum') return null;\n return <sf.TfMultiSelect items={config.options} />;\n }}\n </form.AppField>\n )}\n\n {lf.type === 'id-search' && (\n <form.AppField name={`filters[${i}].value`}>\n {_ => {\n const config = filterConfig[lf.property];\n if (config.type !== 'id-search') return null;\n return (\n <TfMultipleIdSearchInput\n resource={config.resource}\n accessor={config.accessor}\n searchFn={config.searchFn}\n />\n );\n }}\n </form.AppField>\n )}\n\n <Button\n type=\"button\"\n variant=\"neutral\"\n size=\"icon\"\n onPress={() => field.removeValue(i)}\n >\n <IcRemove />\n </Button>\n </div>\n );\n })}\n <div className=\"flex w-full items-center justify-end gap-2 not-first:mt-icon\">\n <EasyMenu label=\"Add filter\" autoFocus>\n {filterKeys.sort().map(k => {\n const type = filterConfig[k].type;\n const Icon = FilterIcon[type];\n return (\n <MenuItem\n key={k}\n onAction={() => {\n const newFilter = createNewFilter(type, k);\n field.pushValue(newFilter);\n }}\n >\n {resourceFormatter(k)}\n <Icon />\n </MenuItem>\n );\n })}\n </EasyMenu>\n {field.state.value.length > 0 ? (\n <Button\n type=\"button\"\n variant=\"neutral\"\n onPress={() => {\n field.setValue([]);\n }}\n >\n <IcRemove />\n Reset\n </Button>\n ) : null}\n </div>\n </>\n );\n }}\n </form.Field>\n </form>\n </Popover>\n </PopoverTrigger>\n </section>\n );\n}\n\nconst FilterIcon: Record<FilterConfig['type'], CtxIcon> = {\n 'id-search': IcFile,\n bool: IcCheck,\n date: IcDate,\n enum: IcLicense,\n id: IcAccount,\n number: IcMinus,\n string: IcCheck,\n};\n"],"names":["getTableCallback","getter","callback","pagination","sorting","searching","filters","query","generateSortParam","_f","columnHelper","createColumnHelper","sort","cH","TABLE_CHECK_BOX_COLUMN","table","jsx","Checkbox","row","TABLE_ID_COLUMN","TABLE_DEFAULT_DATE_COLUMNS","date","formatDate","ACTIONS_COLUMN_ID","getActionColumn","rowActions","DialogMenu","IcMoreVertical","useDataTableState","resourceName","columns","filterConfig","columnsToHideByDefault","allowSelection","initialFilters","tableActions","tableState","_setTableState","useState","rowSelection","setRowSelection","searchQuery","setSearchQuery","columnOrder","setColumnOrder","useLocalStorage","columnVisibility","setColumnVisibility","setFilters","mergedFilters","useMemo","tf","acc","current","merge","updateTableState","updates","prev","useQuery","keepPreviousData","cols","isUpdaterFunction","updater","resolveUpdater","currentValue","tanTable","useReactTable","getCoreRowModel","useEffect","c","DataTableContext","createContext","useDataTable","ctx","useContext","DataTableProvider","children","props","DataTable","className","Fragment","classNames","Actions","jsxs","TableOverlay","Loader","IcInfo","TableContent","ColumnPicker","PageSize","Paginator","activeId","setActiveId","resourceFormatter","useResourceFormatter","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","closestCenter","event","active","over","oldIndex","newIndex","arrayMove","SortableContext","verticalListSortingStrategy","EasyMenu","IcColumns","MenuItem","colId","col","SortableItem","DragOverlay","column","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","IcGrip","getColumnHeaderText","SortIcon","rowCount","Button","IcFirst","IcLeft","IcRight","IcLast","PAGE_SIZES","s","items","IcRefresh","ta","i","Icon","e","r","DataTableFilter","SearchField","direction","IcSortAsc","IcSortDesc","IcSortNone","headerDef","HeaderText","header","flexRender","tableCellStyle","isSticky","zIndex","TableComponent","TableHeader","headerGroup","TableRow","TableHead","TableBody","cell","TableCell","FILTER_COMPARISON_OPERATORS","COMPARISON_OPERATOR_LABELS","createNewFilter","type","property","id","operator","FilterOperations","addFilterButtonRef","useRef","form","useAppForm","value","filterKeys","PopoverTrigger","o","IcFilter","Popover","field","lf","sf","op","_","TfDatePicker","config","TfMultipleIdSearchInput","IcRemove","k","FilterIcon","newFilter","IcFile","IcCheck","IcDate","IcLicense","IcAccount","IcMinus"],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';
|
|
2
|
+
import { FormFieldProps } from './form';
|
|
3
|
+
interface Iso8601DurationFieldBaseProps {
|
|
4
|
+
value: string;
|
|
5
|
+
onChange: (value: string) => void;
|
|
6
|
+
onBlur?: () => void;
|
|
7
|
+
}
|
|
8
|
+
export interface Iso8601DurationFieldProps extends Iso8601DurationFieldBaseProps, FormFieldProps, Omit<AriaNumberFieldProps, 'value' | 'onChange' | 'onBlur'> {
|
|
9
|
+
id?: string;
|
|
10
|
+
}
|
|
11
|
+
export declare function Iso8601DurationField({ value, onChange, onBlur, label, description, errorMessage, requiredIndicator, isDisabled, id, }: Iso8601DurationFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export interface TfIso8601DurationFieldProps extends Omit<Iso8601DurationFieldProps, 'value' | 'onChange'> {
|
|
13
|
+
}
|
|
14
|
+
export declare function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export {};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use client";import{jsxs as N,jsx as e}from"react/jsx-runtime";import{useState as D,useMemo as M,useCallback as v}from"react";import{NumberField as z}from"react-aria-components";import{Duration as w}from"../utilities/duration.js";import{getFieldErrorMessage as B}from"../utilities/form.js";import{useFieldContext as $}from"../utilities/form-context.js";import{classNames as b}from"../utilities/theme.js";import{Button as A}from"./button.js";import{FormField as L,FieldGroup as Y}from"./form.js";import{IcLeft as _,IcRight as j}from"./icons.js";import{NumberFieldInput as k}from"./numberfield.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./loader.js";const G=z,H={years:{full:"Years",short:"yr"},months:{full:"Months",short:"mo"},weeks:{full:"Weeks",short:"wk"},days:{full:"Days",short:"d"},hours:{full:"Hours",short:"hr"},minutes:{full:"Minutes",short:"min"},seconds:{full:"Seconds",short:"sec"}},F=["years","months","days"],K=["hours","minutes","seconds"];function P({id:s,value:r,onChange:t,onBlur:f,label:m,isInvalid:d,isDisabled:h}){return N("div",{className:"flex items-center flex-1 min-w-0 relative",children:[e(G,{"aria-label":m,isInvalid:d,isDisabled:h,value:r,onChange:i=>t(i),onBlur:f,minValue:0,className:"w-full",children:e(k,{id:s,className:"w-full pr-input"})}),e("div",{className:"absolute right-1 select-none text-muted pointer-events-none",children:m})]})}function R({value:s,onChange:r,onBlur:t,label:f,description:m,errorMessage:d,requiredIndicator:h,isDisabled:i,id:S}){const[l,E]=D(!1),c=M(()=>{if(!s||s==="")return{};try{return w.parse(s)}catch{return{}}},[s]),x=v((o,a)=>{const g={...c,[o]:a>0?a:void 0};r(w.serialize(g))},[c,r]),I=()=>{E(o=>!o)},u=!!d,p=S||"duration-field",T=v(o=>{const a=o?[...F,...K]:F,g=o?"short":"full";return a.map((n,y)=>N("div",{className:"contents",children:[e(P,{id:`${p}-${n}`,value:c[n]??0,onChange:C=>x(n,C),onBlur:t||(()=>{}),label:H[n][g],isInvalid:u,isDisabled:i||!1}),y<a.length-1&&e("div",{className:"self-stretch w-px bg-input mx-2 flex-shrink-0","aria-hidden":"true"},`sep-${n}`)]},n))},[p,c,x,t,u,i,l]);return e("div",{className:b("group form-field"),"data-invalid":u?"":void 0,children:e(L,{label:f,description:m,errorMessage:d,requiredIndicator:h,htmlFor:`${p}-years`,children:N("div",{className:"flex-1 flex items-center gap-1",children:[e(Y,{"data-invalid":u?"":void 0,className:"flex flex-row items-stretch w-full overflow-hidden",children:T(l)}),e(A,{type:"button",size:"icon",onPress:I,isDisabled:i,"aria-label":l?"Hide time components":"Show time components","aria-expanded":l,className:b("flex-shrink-0"),children:l?e(_,{className:"size-icon"}):e(j,{className:"size-icon"})})]})})})}function ie({isDisabled:s,...r}){const t=$({disabled:s});return e(R,{value:t.state.value,onChange:t.handleChange,onBlur:t.handleBlur,errorMessage:B(t),isDisabled:s||t.form.state.isSubmitting,id:t.name,...r})}export{R as Iso8601DurationField,ie as TfIso8601DurationField};
|
|
2
|
+
//# sourceMappingURL=duration-field.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"duration-field.js","sources":["../../lib/components/duration-field.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useMemo, useState } from 'react';\nimport { NumberField as AriaNumberField, NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';\nimport { Duration } from '../utilities/duration';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { Button } from './button';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcLeft, IcRight } from './icons';\nimport { NumberFieldInput } from './numberfield';\n\nconst ANumberField = AriaNumberField;\n\ntype DurationPartKey = keyof Duration;\n\n/**\n * Segment configurations with both full and short labels\n * https://learn.microsoft.com/en-us/style-guide/a-z-word-list-term-collections/term-collections/date-time-terms\n * https://en.wikipedia.org/wiki/Hour\n */\nconst SEGMENT_LABELS: Record<DurationPartKey, { full: string; short: string }> = {\n years: { full: 'Years', short: 'yr' },\n months: { full: 'Months', short: 'mo' },\n weeks: { full: 'Weeks', short: 'wk' },\n days: { full: 'Days', short: 'd' },\n hours: { full: 'Hours', short: 'hr' },\n minutes: { full: 'Minutes', short: 'min' },\n seconds: { full: 'Seconds', short: 'sec' },\n};\n\nconst DATE_KEYS: DurationPartKey[] = ['years', 'months', 'days'];\nconst TIME_KEYS: DurationPartKey[] = ['hours', 'minutes', 'seconds'];\n\n/**\n * Props for DurationSegment component\n */\ninterface DurationSegmentProps {\n /** Unique identifier for the input field */\n id: string;\n /** Current numeric value */\n value: number;\n /** Callback when value changes */\n onChange: (value: number) => void;\n /** Callback when field loses focus */\n onBlur: () => void;\n /** Display label for the segment */\n label: string;\n /** Whether the field has validation errors */\n isInvalid: boolean;\n /** Whether the field is disabled */\n isDisabled: boolean;\n}\n\nfunction DurationSegment({ id, value, onChange, onBlur, label, isInvalid, isDisabled }: DurationSegmentProps) {\n return (\n <div className=\"flex items-center flex-1 min-w-0 relative\">\n <ANumberField\n aria-label={label}\n isInvalid={isInvalid}\n isDisabled={isDisabled}\n value={value}\n onChange={newValue => onChange(newValue)}\n onBlur={onBlur}\n minValue={0}\n className=\"w-full\"\n >\n <NumberFieldInput id={id} className=\"w-full pr-input\" />\n </ANumberField>\n <div className=\"absolute right-1 select-none text-muted pointer-events-none\">{label}</div>\n </div>\n );\n}\n\ninterface Iso8601DurationFieldBaseProps {\n value: string;\n onChange: (value: string) => void;\n onBlur?: () => void;\n}\n\nexport interface Iso8601DurationFieldProps\n extends Iso8601DurationFieldBaseProps,\n FormFieldProps,\n Omit<AriaNumberFieldProps, 'value' | 'onChange' | 'onBlur'> {\n id?: string;\n}\n\nexport function Iso8601DurationField({\n value,\n onChange,\n onBlur,\n label,\n description,\n errorMessage,\n requiredIndicator,\n isDisabled,\n id,\n}: Iso8601DurationFieldProps) {\n const [showTime, setShowTime] = useState(false);\n\n const duration = useMemo((): Duration => {\n if (!value || value === '') {\n return {};\n }\n try {\n return Duration.parse(value);\n } catch {\n return {};\n }\n }, [value]);\n\n const handlePartChange = useCallback(\n (part: DurationPartKey, partValue: number) => {\n const updatedDuration: Duration = {\n ...duration,\n [part]: partValue > 0 ? partValue : undefined,\n };\n onChange(Duration.serialize(updatedDuration));\n },\n [duration, onChange]\n );\n\n const handleToggleTime = () => {\n setShowTime(prev => !prev);\n };\n\n const isInvalid = !!errorMessage;\n const fieldId = id || 'duration-field';\n\n const renderSegments = useCallback(\n (includeTime: boolean) => {\n const keys = includeTime ? [...DATE_KEYS, ...TIME_KEYS] : DATE_KEYS;\n const labelType = includeTime ? 'short' : 'full';\n\n return keys.map((key, index) => (\n <div key={key} className=\"contents\">\n <DurationSegment\n id={`${fieldId}-${key}`}\n value={duration[key] ?? 0}\n onChange={segmentValue => handlePartChange(key, segmentValue)}\n onBlur={onBlur || (() => {})}\n label={SEGMENT_LABELS[key][labelType]}\n isInvalid={isInvalid}\n isDisabled={isDisabled || false}\n />\n {index < keys.length - 1 && (\n <div\n key={`sep-${key}`}\n className=\"self-stretch w-px bg-input mx-2 flex-shrink-0\"\n aria-hidden=\"true\"\n />\n )}\n </div>\n ));\n },\n [fieldId, duration, handlePartChange, onBlur, isInvalid, isDisabled, showTime]\n );\n\n return (\n <div className={classNames('group form-field')} data-invalid={isInvalid ? '' : undefined}>\n <FormField\n label={label}\n description={description}\n errorMessage={errorMessage}\n requiredIndicator={requiredIndicator}\n htmlFor={`${fieldId}-years`}\n >\n <div className=\"flex-1 flex items-center gap-1\">\n <FieldGroup\n data-invalid={isInvalid ? '' : undefined}\n className=\"flex flex-row items-stretch w-full overflow-hidden\"\n >\n {renderSegments(showTime)}\n </FieldGroup>\n <Button\n type=\"button\"\n size=\"icon\"\n onPress={handleToggleTime}\n isDisabled={isDisabled}\n aria-label={showTime ? 'Hide time components' : 'Show time components'}\n aria-expanded={showTime}\n className={classNames('flex-shrink-0')}\n >\n {showTime ? <IcLeft className=\"size-icon\" /> : <IcRight className=\"size-icon\" />}\n </Button>\n </div>\n </FormField>\n </div>\n );\n}\n\nexport interface TfIso8601DurationFieldProps extends Omit<Iso8601DurationFieldProps, 'value' | 'onChange'> {}\n\nexport function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps) {\n const field = useFieldContext<string>({ disabled: isDisabled });\n\n return (\n <Iso8601DurationField\n value={field.state.value}\n onChange={field.handleChange}\n onBlur={field.handleBlur}\n errorMessage={getFieldErrorMessage(field)}\n isDisabled={isDisabled || field.form.state.isSubmitting}\n id={field.name}\n {...props}\n />\n );\n}\n"],"names":["ANumberField","AriaNumberField","SEGMENT_LABELS","DATE_KEYS","TIME_KEYS","DurationSegment","id","value","onChange","onBlur","label","isInvalid","isDisabled","jsxs","jsx","newValue","NumberFieldInput","Iso8601DurationField","description","errorMessage","requiredIndicator","showTime","setShowTime","useState","duration","useMemo","Duration","handlePartChange","useCallback","part","partValue","updatedDuration","handleToggleTime","prev","fieldId","renderSegments","includeTime","keys","labelType","key","index","segmentValue","classNames","FormField","FieldGroup","Button","IcLeft","IcRight","TfIso8601DurationField","props","field","useFieldContext","getFieldErrorMessage"],"mappings":"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"}
|
|
@@ -43,12 +43,14 @@ type BaseSearchableResource = {
|
|
|
43
43
|
* @testing
|
|
44
44
|
* - Mock `searchFn` in unit tests; assert keyboard navigation, open/close behavior, and `onBlur` call on popover close.
|
|
45
45
|
*/
|
|
46
|
-
declare function BaseIdSearchInput<T extends BaseSearchableResource, V>({ label, description, errorMessage, requiredIndicator, searchFn, isDisabled, onBlur, resource, onChange, value, renderLabel, ...props }: FormFieldProps & {
|
|
46
|
+
declare function BaseIdSearchInput<T extends BaseSearchableResource, V>({ label, description, errorMessage, requiredIndicator, searchFn, isDisabled, isInvalid, onBlur, resource, onChange, value, renderLabel, ...props }: FormFieldProps & {
|
|
47
47
|
resource: CtxResourceName;
|
|
48
48
|
/** Function that returns matching resources for the current query. */
|
|
49
49
|
searchFn: (q: string) => Promise<T[] | undefined>;
|
|
50
50
|
/** Disable interactions. */
|
|
51
51
|
isDisabled?: boolean;
|
|
52
|
+
/** Whether the field is invalid. */
|
|
53
|
+
isInvalid?: boolean;
|
|
52
54
|
/** Key used to access an alternate display accessor on item (kept for compatibility). */
|
|
53
55
|
accessor: keyof BaseSearchableResource;
|
|
54
56
|
/** Controlled value. */
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as r,jsxs as g}from"react/jsx-runtime";import{useQuery as x}from"@tanstack/react-query";import{useId as B,useState as T}from"react";import{Select as j,Autocomplete as A}from"react-aria-components";import{Loader as E}from"./loader.js";import{Menu as K,MenuItem as L}from"./menu.js";import{PopoverTrigger as _}from"./popover.js";import{SearchField as q}from"./searchfield.js";import{getFieldErrorMessage as a}from"../utilities/form.js";import{useFieldContext as S}from"../utilities/form-context.js";import{FormField as P}from"./form.js";import{SelectTrigger as w,SelectPopover as O}from"./select.js";import"../utilities/theme.js";import"clsx";import"./icons.js";import"./list-box.js";import"./button.js";import"class-variance-authority";import"@tanstack/react-form";function I({label:t,description:n,errorMessage:e,requiredIndicator:i,searchFn:l,isDisabled:v,isInvalid:s,onBlur:y,resource:C,onChange:k,value:m,renderLabel:b,...c}){const F=B(),u=c.id||F,[d,M]=T(""),{data:h,isError:f,isFetching:p,error:N}=x({queryKey:[C,"id",d],queryFn:()=>l(d)});return r("div",{className:"group form-field","data-invalid":s?"":void 0,children:r(P,{label:t,description:n,errorMessage:e,requiredIndicator:i,htmlFor:u,children:r(j,{isInvalid:s,children:g(_,{onOpenChange:o=>{o||y?.(m)},children:[r(w,{id:u,isDisabled:v,className:"w-full",children:b(m,h)}),r(O,{placement:"bottom start",children:g(A,{inputValue:d,onInputChange:M,children:[r(q,{className:"p-2",autoFocus:!0}),p&&r("div",{className:"p-input",children:r(E,{className:"mx-auto"})}),!p&&!f&&r(K,{...c,className:"max-h-48",items:h,renderEmptyState:()=>r("div",{className:"body-sm p-2",children:"No results found."}),children:o=>r(L,{id:o.id,children:o.name},o.id)}),f&&r("div",{className:"text-destructive p-icon body-sm",children:N.message})]})})]})})})})}function Q({...t}){return r(I,{selectedKeys:[t.value],onSelectionChange:n=>t.onChange(Array.from(n).filter(e=>typeof e=="string")[0]),renderLabel:(n,e)=>e?.find(i=>i.id===n)?.name??n,selectionMode:"single",...t})}function V({...t}){return r(I,{selectedKeys:t.value,onSelectionChange:n=>t.onChange(Array.from(n).filter(e=>typeof e=="string")),selectionMode:"multiple",renderLabel:(n,e)=>n?.map(i=>e?.find(l=>l.id===i)?.name??i).join(","),...t})}function le({isDisabled:t,...n}){const e=S({disabled:t});return r(Q,{...n,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),isInvalid:!!a(e),errorMessage:a(e)})}function de({isDisabled:t,...n}){const e=S({disabled:t});return r(V,{...n,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),isInvalid:!!a(e),errorMessage:a(e)})}export{V as MultipleIdSearchInput,Q as SingleIdSearchInput,de as TfMultipleIdSearchInput,le as TfSingleIdSearchInput};
|
|
2
2
|
//# sourceMappingURL=id-search.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"id-search.js","sources":["../../lib/components/id-search.tsx"],"sourcesContent":["import { useQuery } from '@tanstack/react-query';\nimport { useId, useState } from 'react';\nimport { Autocomplete } from 'react-aria-components';\nimport { Loader } from '../components/loader';\nimport { Menu, MenuItem } from '../components/menu';\nimport { PopoverTrigger } from '../components/popover';\nimport { SearchField } from '../components/searchfield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport type { CtxResourceName } from '../utilities/resources';\nimport { FormField, type FormFieldProps } from './form';\nimport { SelectPopover, SelectTrigger } from './select';\n\n/**\n * Minimal resource shape used by the ID search inputs.\n * Only `id` and `name` are required.\n *\n * @example\n * const user: BaseSearchableResource = { id: 'u_123', name: 'Nabeel Farooq' };\n */\ntype BaseSearchableResource = {\n /** Unique identifier used as the input value. */\n id: string;\n /** Human-readable label shown to users. */\n name: string;\n};\n\n/**\n * - Generic, accessible ID-search building block.\n * - Search (powered by react-query)\n * - Renders an accessible Autocomplete + Menu listbox\n * - Exposes a controlled `value`/`onChange` contract so callers (and wrappers) can manage state\n * - Clear separation of concerns: this component only handles UI search/display; callers provide `searchFn`\n *\n * @template T - resource type extending `BaseSearchableResource` (must have `id` and `name`)\n * @template V - controlled value type (e.g. `string` for single-select or `string[]` for multi-select)\n *\n * @param props - props object (see inline property JSDoc for the most important fields)\n *\n * @remarks\n * - `searchFn` should return `Promise<T[] | undefined>`. Returning `undefined` indicates no results / handled error.\n * - When the popover closes, `onBlur` (if provided) is called with the current `value`.\n * - `renderLabel` must convert `value` to a readable string for the control button.\n *\n * @example\n * <BaseIdSearchInput\n * label=\"Owner\"\n * searchFn={q => api.searchUsers(q)}\n * value={ownerId}\n * onChange={setOwnerId}\n * renderLabel={(v, data) => data?.find(d => d.id === v)?.name ?? v}\n * />\n *\n * @testing\n * - Mock `searchFn` in unit tests; assert keyboard navigation, open/close behavior, and `onBlur` call on popover close.\n */\nfunction BaseIdSearchInput<T extends BaseSearchableResource, V>({\n label,\n description,\n errorMessage,\n requiredIndicator,\n searchFn,\n isDisabled,\n onBlur,\n resource,\n onChange,\n value,\n renderLabel,\n ...props\n}: FormFieldProps & {\n resource: CtxResourceName;\n /** Function that returns matching resources for the current query. */\n searchFn: (q: string) => Promise<T[] | undefined>;\n /** Disable interactions. */\n isDisabled?: boolean;\n /** Key used to access an alternate display accessor on item (kept for compatibility). */\n accessor: keyof BaseSearchableResource;\n /** Controlled value. */\n value: V;\n /** Called when popover closes or the field blurs with the current value. */\n onBlur?: (v: V) => void;\n /** Controlled change handler. */\n onChange: (v: V) => void;\n /** Render a human-readable label for the current value using the latest data. */\n renderLabel: (v: V, data: T[] | undefined) => string;\n} & Omit<React.ComponentProps<typeof Menu>, 'items' | 'className'>) {\n const generatedId = useId();\n const fieldId = props.id || generatedId;\n\n const [search, _setSearch] = useState('');\n const { data, isError, isFetching, error } = useQuery({\n queryKey: [resource, 'id', search],\n queryFn: () => searchFn(search),\n });\n\n return (\n <div className=\"group form-field\">\n <FormField {...{ label, description, errorMessage, requiredIndicator, htmlFor: fieldId }}>\n <PopoverTrigger\n onOpenChange={o => {\n if (!o) {\n // searchInputRef.current?.focus();\n onBlur?.(value);\n }\n }}\n >\n <SelectTrigger id={fieldId} isDisabled={isDisabled}>\n {renderLabel(value, data)}\n </SelectTrigger>\n <SelectPopover placement=\"bottom start\">\n <Autocomplete inputValue={search} onInputChange={_setSearch}>\n <SearchField className={'p-2'} autoFocus />\n {isFetching && (\n <div className=\"p-input\">\n <Loader className=\"mx-auto\" />\n </div>\n )}\n {!isFetching && !isError && (\n <Menu\n {...props}\n className={'max-h-48'}\n items={data}\n renderEmptyState={() => <div className=\"body-sm p-2\">No results found.</div>}\n >\n {item => (\n <MenuItem key={item['id']} id={item['id']}>\n {item.name}\n </MenuItem>\n )}\n </Menu>\n )}\n {isError && <div className=\"text-destructive p-icon body-sm\">{error.message}</div>}\n </Autocomplete>\n </SelectPopover>\n </PopoverTrigger>\n </FormField>\n </div>\n );\n}\n\n/**\n * Single-selection ID search input.\n *\n * Thin, typed wrapper around `BaseIdSearchInput` specialized for the very common single-ID case.\n * Adapts the internal selection events into `onChange(id?: string)` and renders the selected label.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <SingleIdSearchInput\n * label=\"Reporter\"\n * value={reporterId}\n * onChange={setReporterId}\n * searchFn={q => api.searchUsers(q)}\n * />\n *\n */\nexport function SingleIdSearchInput<T extends BaseSearchableResource>({\n ...props\n}: Omit<\n React.ComponentProps<typeof BaseIdSearchInput<T, string>>,\n 'onSelectionChange' | 'selectionMode' | 'selectedKeys' | 'renderLabel'\n>) {\n return (\n <BaseIdSearchInput\n selectedKeys={[props.value]}\n onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string')[0])}\n renderLabel={(v, d) => d?.find(di => di.id === v)?.name ?? v}\n selectionMode=\"single\"\n {...props}\n />\n );\n}\n\n/**\n * Multi-selection ID search input.\n *\n * Thin wrapper around `BaseIdSearchInput` for the multiple-ID (`string[]`) case.\n * Adapts internal selection events into `onChange(ids: string[])`.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <MultipleIdSearchInput\n * label=\"Reviewers\"\n * value={reviewerIds}\n * onChange={setReviewerIds}\n * searchFn={q => api.searchUsers(q)}\n * />\n *\n * @remarks\n * - The `renderLabel` joins selected item names with commas for compact display.\n */\nexport function MultipleIdSearchInput<T extends BaseSearchableResource>({\n ...props\n}: Omit<\n React.ComponentProps<typeof BaseIdSearchInput<T, string[]>>,\n 'renderLabel' | 'onSelectionChange' | 'selectionMode' | 'selectedKeys'\n>) {\n return (\n <BaseIdSearchInput\n selectedKeys={props.value}\n onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string'))}\n selectionMode=\"multiple\"\n renderLabel={(v, d) => v?.map(vi => d?.find(di => di.id === vi)?.name ?? vi).join(',')}\n {...props}\n />\n );\n}\n\n/**\n * Form-integrated single-select ID input (field wrapper).\n *\n * Integrates `SingleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfSingleIdSearchInput name=\"ownerId\" label=\"Owner\" searchFn={q => api.searchUsers(q)} />\n \n */\nexport function TfSingleIdSearchInput({\n isDisabled,\n ...props\n}: Omit<React.ComponentProps<typeof SingleIdSearchInput>, 'value' | 'onChange' | 'onBlur'>) {\n const field = useFieldContext<string>({ disabled: isDisabled });\n return (\n <SingleIdSearchInput\n {...props}\n isDisabled={isDisabled || field.form.state.isSubmitting}\n value={field.state.value}\n onBlur={_ => field.handleBlur()}\n onChange={e => field.handleChange(e)}\n errorMessage={getFieldErrorMessage(field)}\n />\n );\n}\n\n/**\n * Form-integrated multi-select ID input (field wrapper).\n *\n * Integrates `MultipleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfMultipleIdSearchInput name=\"reviewerIds\" label=\"Reviewers\" searchFn={q => api.searchUsers(q)} />\n *\n */\nexport function TfMultipleIdSearchInput({\n isDisabled,\n ...props\n}: Omit<React.ComponentProps<typeof MultipleIdSearchInput>, 'value' | 'onChange'>) {\n const field = useFieldContext<string[]>({ disabled: isDisabled });\n return (\n <MultipleIdSearchInput\n {...props}\n isDisabled={isDisabled || field.form.state.isSubmitting}\n value={field.state.value}\n onBlur={_ => field.handleBlur()}\n onChange={e => field.handleChange(e)}\n errorMessage={getFieldErrorMessage(field)}\n />\n );\n}\n"],"names":["BaseIdSearchInput","label","description","errorMessage","requiredIndicator","searchFn","isDisabled","onBlur","resource","onChange","value","renderLabel","props","generatedId","useId","fieldId","search","_setSearch","useState","data","isError","isFetching","error","useQuery","jsx","FormField","jsxs","PopoverTrigger","o","SelectTrigger","SelectPopover","Autocomplete","SearchField","Loader","Menu","item","MenuItem","SingleIdSearchInput","e","v","d","di","MultipleIdSearchInput","vi","TfSingleIdSearchInput","field","useFieldContext","_","getFieldErrorMessage","TfMultipleIdSearchInput"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"id-search.js","sources":["../../lib/components/id-search.tsx"],"sourcesContent":["import { useQuery } from '@tanstack/react-query';\nimport { useId, useState } from 'react';\nimport { Select as AriaSelect, Autocomplete } from 'react-aria-components';\n\nimport { Loader } from '../components/loader';\nimport { Menu, MenuItem } from '../components/menu';\nimport { PopoverTrigger } from '../components/popover';\nimport { SearchField } from '../components/searchfield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport type { CtxResourceName } from '../utilities/resources';\nimport { FormField, type FormFieldProps } from './form';\nimport { SelectPopover, SelectTrigger } from './select';\n\n/**\n * Minimal resource shape used by the ID search inputs.\n * Only `id` and `name` are required.\n *\n * @example\n * const user: BaseSearchableResource = { id: 'u_123', name: 'Nabeel Farooq' };\n */\ntype BaseSearchableResource = {\n /** Unique identifier used as the input value. */\n id: string;\n /** Human-readable label shown to users. */\n name: string;\n};\n\n/**\n * - Generic, accessible ID-search building block.\n * - Search (powered by react-query)\n * - Renders an accessible Autocomplete + Menu listbox\n * - Exposes a controlled `value`/`onChange` contract so callers (and wrappers) can manage state\n * - Clear separation of concerns: this component only handles UI search/display; callers provide `searchFn`\n *\n * @template T - resource type extending `BaseSearchableResource` (must have `id` and `name`)\n * @template V - controlled value type (e.g. `string` for single-select or `string[]` for multi-select)\n *\n * @param props - props object (see inline property JSDoc for the most important fields)\n *\n * @remarks\n * - `searchFn` should return `Promise<T[] | undefined>`. Returning `undefined` indicates no results / handled error.\n * - When the popover closes, `onBlur` (if provided) is called with the current `value`.\n * - `renderLabel` must convert `value` to a readable string for the control button.\n *\n * @example\n * <BaseIdSearchInput\n * label=\"Owner\"\n * searchFn={q => api.searchUsers(q)}\n * value={ownerId}\n * onChange={setOwnerId}\n * renderLabel={(v, data) => data?.find(d => d.id === v)?.name ?? v}\n * />\n *\n * @testing\n * - Mock `searchFn` in unit tests; assert keyboard navigation, open/close behavior, and `onBlur` call on popover close.\n */\nfunction BaseIdSearchInput<T extends BaseSearchableResource, V>({\n label,\n description,\n errorMessage,\n requiredIndicator,\n searchFn,\n isDisabled,\n isInvalid,\n onBlur,\n resource,\n onChange,\n value,\n renderLabel,\n ...props\n}: FormFieldProps & {\n resource: CtxResourceName;\n /** Function that returns matching resources for the current query. */\n searchFn: (q: string) => Promise<T[] | undefined>;\n /** Disable interactions. */\n isDisabled?: boolean;\n /** Whether the field is invalid. */\n isInvalid?: boolean;\n /** Key used to access an alternate display accessor on item (kept for compatibility). */\n accessor: keyof BaseSearchableResource;\n /** Controlled value. */\n value: V;\n /** Called when popover closes or the field blurs with the current value. */\n onBlur?: (v: V) => void;\n /** Controlled change handler. */\n onChange: (v: V) => void;\n /** Render a human-readable label for the current value using the latest data. */\n renderLabel: (v: V, data: T[] | undefined) => string;\n} & Omit<React.ComponentProps<typeof Menu>, 'items' | 'className'>) {\n const generatedId = useId();\n const fieldId = props.id || generatedId;\n\n const [search, _setSearch] = useState('');\n const { data, isError, isFetching, error } = useQuery({\n queryKey: [resource, 'id', search],\n queryFn: () => searchFn(search),\n });\n\n return (\n <div className=\"group form-field\" data-invalid={isInvalid ? '' : undefined}>\n <FormField {...{ label, description, errorMessage, requiredIndicator, htmlFor: fieldId }}>\n <AriaSelect isInvalid={isInvalid}>\n <PopoverTrigger\n onOpenChange={o => {\n if (!o) {\n // searchInputRef.current?.focus();\n onBlur?.(value);\n }\n }}\n >\n <SelectTrigger id={fieldId} isDisabled={isDisabled} className={'w-full'}>\n {renderLabel(value, data)}\n </SelectTrigger>\n <SelectPopover placement=\"bottom start\">\n <Autocomplete inputValue={search} onInputChange={_setSearch}>\n <SearchField className={'p-2'} autoFocus />\n {isFetching && (\n <div className=\"p-input\">\n <Loader className=\"mx-auto\" />\n </div>\n )}\n {!isFetching && !isError && (\n <Menu\n {...props}\n className={'max-h-48'}\n items={data}\n renderEmptyState={() => <div className=\"body-sm p-2\">No results found.</div>}\n >\n {item => (\n <MenuItem key={item['id']} id={item['id']}>\n {item.name}\n </MenuItem>\n )}\n </Menu>\n )}\n {isError && <div className=\"text-destructive p-icon body-sm\">{error.message}</div>}\n </Autocomplete>\n </SelectPopover>\n </PopoverTrigger>\n </AriaSelect>\n </FormField>\n </div>\n );\n}\n\n/**\n * Single-selection ID search input.\n *\n * Thin, typed wrapper around `BaseIdSearchInput` specialized for the very common single-ID case.\n * Adapts the internal selection events into `onChange(id?: string)` and renders the selected label.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <SingleIdSearchInput\n * label=\"Reporter\"\n * value={reporterId}\n * onChange={setReporterId}\n * searchFn={q => api.searchUsers(q)}\n * />\n *\n */\nexport function SingleIdSearchInput<T extends BaseSearchableResource>({\n ...props\n}: Omit<\n React.ComponentProps<typeof BaseIdSearchInput<T, string>>,\n 'onSelectionChange' | 'selectionMode' | 'selectedKeys' | 'renderLabel'\n>) {\n return (\n <BaseIdSearchInput\n selectedKeys={[props.value]}\n onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string')[0])}\n renderLabel={(v, d) => d?.find(di => di.id === v)?.name ?? v}\n selectionMode=\"single\"\n {...props}\n />\n );\n}\n\n/**\n * Multi-selection ID search input.\n *\n * Thin wrapper around `BaseIdSearchInput` for the multiple-ID (`string[]`) case.\n * Adapts internal selection events into `onChange(ids: string[])`.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <MultipleIdSearchInput\n * label=\"Reviewers\"\n * value={reviewerIds}\n * onChange={setReviewerIds}\n * searchFn={q => api.searchUsers(q)}\n * />\n *\n * @remarks\n * - The `renderLabel` joins selected item names with commas for compact display.\n */\nexport function MultipleIdSearchInput<T extends BaseSearchableResource>({\n ...props\n}: Omit<\n React.ComponentProps<typeof BaseIdSearchInput<T, string[]>>,\n 'renderLabel' | 'onSelectionChange' | 'selectionMode' | 'selectedKeys'\n>) {\n return (\n <BaseIdSearchInput\n selectedKeys={props.value}\n onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string'))}\n selectionMode=\"multiple\"\n renderLabel={(v, d) => v?.map(vi => d?.find(di => di.id === vi)?.name ?? vi).join(',')}\n {...props}\n />\n );\n}\n\n/**\n * Form-integrated single-select ID input (field wrapper).\n *\n * Integrates `SingleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfSingleIdSearchInput name=\"ownerId\" label=\"Owner\" searchFn={q => api.searchUsers(q)} />\n \n */\nexport function TfSingleIdSearchInput({\n isDisabled,\n ...props\n}: Omit<React.ComponentProps<typeof SingleIdSearchInput>, 'value' | 'onChange' | 'onBlur'>) {\n const field = useFieldContext<string>({ disabled: isDisabled });\n return (\n <SingleIdSearchInput\n {...props}\n isDisabled={isDisabled || field.form.state.isSubmitting}\n value={field.state.value}\n onBlur={_ => field.handleBlur()}\n onChange={e => field.handleChange(e)}\n isInvalid={!!getFieldErrorMessage(field)}\n errorMessage={getFieldErrorMessage(field)}\n />\n );\n}\n\n/**\n * Form-integrated multi-select ID input (field wrapper).\n *\n * Integrates `MultipleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfMultipleIdSearchInput name=\"reviewerIds\" label=\"Reviewers\" searchFn={q => api.searchUsers(q)} />\n *\n */\nexport function TfMultipleIdSearchInput({\n isDisabled,\n ...props\n}: Omit<React.ComponentProps<typeof MultipleIdSearchInput>, 'value' | 'onChange'>) {\n const field = useFieldContext<string[]>({ disabled: isDisabled });\n return (\n <MultipleIdSearchInput\n {...props}\n isDisabled={isDisabled || field.form.state.isSubmitting}\n value={field.state.value}\n onBlur={_ => field.handleBlur()}\n onChange={e => field.handleChange(e)}\n isInvalid={!!getFieldErrorMessage(field)}\n errorMessage={getFieldErrorMessage(field)}\n />\n );\n}\n"],"names":["BaseIdSearchInput","label","description","errorMessage","requiredIndicator","searchFn","isDisabled","isInvalid","onBlur","resource","onChange","value","renderLabel","props","generatedId","useId","fieldId","search","_setSearch","useState","data","isError","isFetching","error","useQuery","jsx","FormField","AriaSelect","jsxs","PopoverTrigger","SelectTrigger","SelectPopover","Autocomplete","SearchField","Loader","Menu","item","MenuItem","SingleIdSearchInput","e","v","d","di","MultipleIdSearchInput","vi","TfSingleIdSearchInput","field","useFieldContext","_","getFieldErrorMessage","TfMultipleIdSearchInput"],"mappings":"uwBAyDA,SAASA,EAAuD,CAC5D,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,SAAAC,EACA,WAAAC,EACA,UAAAC,EACA,OAAAC,EACA,SAAAC,EACA,SAAAC,EACA,MAAAC,EACA,YAAAC,EACA,GAAGC,CACP,EAkBoE,CAChE,MAAMC,EAAcC,EAAA,EACdC,EAAUH,EAAM,IAAMC,EAEtB,CAACG,EAAQC,CAAU,EAAIC,EAAS,EAAE,EAClC,CAAE,KAAAC,EAAM,QAAAC,EAAS,WAAAC,EAAY,MAAAC,CAAA,EAAUC,EAAS,CAClD,SAAU,CAACf,EAAU,KAAMQ,CAAM,EACjC,QAAS,IAAMZ,EAASY,CAAM,CAAA,CACjC,EAED,OACIQ,EAAC,OAAI,UAAU,mBAAmB,eAAclB,EAAY,GAAK,OAC7D,SAAAkB,EAACC,EAAA,CAAgB,MAAAzB,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAAmB,QAASY,EAC3E,SAAAS,EAACE,EAAA,CAAW,UAAApB,EACR,SAAAqB,EAACC,EAAA,CACG,aAAc,GAAK,CACV,GAEDrB,IAASG,CAAK,CAEtB,EAEA,SAAA,CAAAc,EAACK,EAAA,CAAc,GAAId,EAAS,WAAAV,EAAwB,UAAW,SAC1D,SAAAM,EAAYD,EAAOS,CAAI,CAAA,CAC5B,EACAK,EAACM,GAAc,UAAU,eACrB,WAACC,EAAA,CAAa,WAAYf,EAAQ,cAAeC,EAC7C,SAAA,CAAAO,EAACQ,EAAA,CAAY,UAAW,MAAO,UAAS,GAAC,EACxCX,KACI,MAAA,CAAI,UAAU,UACX,SAAAG,EAACS,EAAA,CAAO,UAAU,SAAA,CAAU,CAAA,CAChC,EAEH,CAACZ,GAAc,CAACD,GACbI,EAACU,EAAA,CACI,GAAGtB,EACJ,UAAW,WACX,MAAOO,EACP,iBAAkB,IAAMK,EAAC,MAAA,CAAI,UAAU,cAAc,SAAA,oBAAiB,EAErE,SAAAW,GACGX,EAACY,EAAA,CAA0B,GAAID,EAAK,GAC/B,SAAAA,EAAK,IAAA,EADKA,EAAK,EAEpB,CAAA,CAAA,EAIXf,GAAWI,EAAC,MAAA,CAAI,UAAU,kCAAmC,WAAM,OAAA,CAAQ,CAAA,CAAA,CAChF,CAAA,CACJ,CAAA,CAAA,CAAA,CACJ,CACJ,EACJ,EACJ,CAER,CAqBO,SAASa,EAAsD,CAClE,GAAGzB,CACP,EAGG,CACC,OACIY,EAACzB,EAAA,CACG,aAAc,CAACa,EAAM,KAAK,EAC1B,kBAAmB0B,GAAK1B,EAAM,SAAS,MAAM,KAAK0B,CAAC,EAAE,UAAY,OAAOC,GAAM,QAAQ,EAAE,CAAC,CAAC,EAC1F,YAAa,CAACA,EAAGC,IAAMA,GAAG,KAAKC,GAAMA,EAAG,KAAOF,CAAC,GAAG,MAAQA,EAC3D,cAAc,SACb,GAAG3B,CAAA,CAAA,CAGhB,CAuBO,SAAS8B,EAAwD,CACpE,GAAG9B,CACP,EAGG,CACC,OACIY,EAACzB,EAAA,CACG,aAAca,EAAM,MACpB,kBAAmB0B,GAAK1B,EAAM,SAAS,MAAM,KAAK0B,CAAC,EAAE,OAAOC,GAAK,OAAOA,GAAM,QAAQ,CAAC,EACvF,cAAc,WACd,YAAa,CAACA,EAAGC,IAAMD,GAAG,OAAUC,GAAG,KAAKC,GAAMA,EAAG,KAAOE,CAAE,GAAG,MAAQA,CAAE,EAAE,KAAK,GAAG,EACpF,GAAG/B,CAAA,CAAA,CAGhB,CAcO,SAASgC,GAAsB,CAClC,WAAAvC,EACA,GAAGO,CACP,EAA4F,CACxF,MAAMiC,EAAQC,EAAwB,CAAE,SAAUzC,EAAY,EAC9D,OACImB,EAACa,EAAA,CACI,GAAGzB,EACJ,WAAYP,GAAcwC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAUP,GAAKO,EAAM,aAAaP,CAAC,EACnC,UAAW,CAAC,CAACU,EAAqBH,CAAK,EACvC,aAAcG,EAAqBH,CAAK,CAAA,CAAA,CAGpD,CAcO,SAASI,GAAwB,CACpC,WAAA5C,EACA,GAAGO,CACP,EAAmF,CAC/E,MAAMiC,EAAQC,EAA0B,CAAE,SAAUzC,EAAY,EAChE,OACImB,EAACkB,EAAA,CACI,GAAG9B,EACJ,WAAYP,GAAcwC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAUP,GAAKO,EAAM,aAAaP,CAAC,EACnC,UAAW,CAAC,CAACU,EAAqBH,CAAK,EACvC,aAAcG,EAAqBH,CAAK,CAAA,CAAA,CAGpD"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';
|
|
1
|
+
import { InputProps as AriaInputProps, NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';
|
|
2
2
|
import { FormFieldProps } from './form';
|
|
3
|
+
export declare function NumberFieldInput({ className, ...props }: AriaInputProps): import("react/jsx-runtime").JSX.Element;
|
|
3
4
|
export type NumberFieldProps = AriaNumberFieldProps & FormFieldProps;
|
|
4
5
|
export declare function NumberField({ label, description, errorMessage, requiredIndicator, className, ...props }: NumberFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
5
6
|
export declare function TfNumberField({ isDisabled, ...props }: Omit<React.ComponentProps<typeof NumberField>, 'value' | 'id' | 'onChange' | 'onBlur'>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r,jsxs as u}from"react/jsx-runtime";import{NumberField as F,composeRenderProps as m,Input as v}from"react-aria-components";import{Button as x}from"./button.js";import{getFieldErrorMessage as d}from"../utilities/form.js";import{useFieldContext as p}from"../utilities/form-context.js";import{classNames as s}from"../utilities/theme.js";import{FormField as f,FieldGroup as h}from"./form.js";import{IcUp as C,IcDown as w}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";import"react";import"@tanstack/react-form";const b=F;function N({className:t,...n}){return r(v,{className:m(t,e=>s("w-fit min-w-0 flex-1 border-r border-transparent bg-elevation-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",e)),...n})}function D({className:t,...n}){return u("div",{className:s("absolute right-0 flex h-full flex-col border-l",t),...n,children:[r(c,{slot:"increment",children:r(C,{"aria-hidden":!0,className:"size-icon"})}),r("div",{className:"border-b"}),r(c,{slot:"decrement",children:r(w,{"aria-hidden":!0,className:"size-icon"})})]})}function c({className:t,...n}){return r(x,{className:m(t,e=>s("w-auto grow h-3 px-0.5 text-muted-foreground",e)),variant:"ghost",size:"none",...n})}function I({label:t,description:n,errorMessage:e,requiredIndicator:i,className:o,...l}){return r(b,{className:m(o,a=>s("group form-field",a)),...l,children:r(f,{label:t,description:n,errorMessage:e,requiredIndicator:i,children:u(h,{children:[r(N,{className:"pr-input"}),r(D,{})]})})})}function O({isDisabled:t,...n}){const e=p({disabled:t});return r(I,{isInvalid:!!d(e),isDisabled:t||e.form.state.isSubmitting,value:e.state.value,id:e.name,onChange:e.handleChange,onBlur:e.handleBlur,errorMessage:d(e),...n})}function S({label:t,description:n,errorMessage:e,requiredIndicator:i,className:o,...l}){return r(b,{className:m(o,a=>s("group form-field",a)),...l,children:r(f,{label:t,description:n,errorMessage:e,requiredIndicator:i,children:u(h,{children:[r(N,{className:"pr-input"}),r("div",{className:"absolute right-1 select-none text-muted",children:"days"})]})})})}function U({isDisabled:t,...n}){const e=p({disabled:t}),i=86400,o=e.state.value!=null?e.state.value/i:void 0,l=a=>{const g=a*i;e.handleChange(g)};return r(S,{isInvalid:!!d(e),isDisabled:t||e.form.state.isSubmitting,value:o,id:e.name,onChange:l,onBlur:e.handleBlur,errorMessage:d(e),...n})}export{S as DaysField,I as NumberField,U as TfDaysField,O as TfNumberField};
|
|
1
|
+
import{jsx as r,jsxs as u}from"react/jsx-runtime";import{NumberField as F,composeRenderProps as m,Input as v}from"react-aria-components";import{Button as x}from"./button.js";import{getFieldErrorMessage as d}from"../utilities/form.js";import{useFieldContext as p}from"../utilities/form-context.js";import{classNames as s}from"../utilities/theme.js";import{FormField as f,FieldGroup as h}from"./form.js";import{IcUp as C,IcDown as w}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";import"react";import"@tanstack/react-form";const b=F;function N({className:t,...n}){return r(v,{className:m(t,e=>s("w-fit min-w-0 flex-1 border-r border-transparent bg-elevation-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",e)),...n})}function D({className:t,...n}){return u("div",{className:s("absolute right-0 flex h-full flex-col border-l",t),...n,children:[r(c,{slot:"increment",children:r(C,{"aria-hidden":!0,className:"size-icon"})}),r("div",{className:"border-b"}),r(c,{slot:"decrement",children:r(w,{"aria-hidden":!0,className:"size-icon"})})]})}function c({className:t,...n}){return r(x,{className:m(t,e=>s("w-auto grow h-3 px-0.5 text-muted-foreground",e)),variant:"ghost",size:"none",...n})}function I({label:t,description:n,errorMessage:e,requiredIndicator:i,className:o,...l}){return r(b,{className:m(o,a=>s("group form-field",a)),...l,children:r(f,{label:t,description:n,errorMessage:e,requiredIndicator:i,children:u(h,{children:[r(N,{className:"pr-input"}),r(D,{})]})})})}function O({isDisabled:t,...n}){const e=p({disabled:t});return r(I,{isInvalid:!!d(e),isDisabled:t||e.form.state.isSubmitting,value:e.state.value,id:e.name,onChange:e.handleChange,onBlur:e.handleBlur,errorMessage:d(e),...n})}function S({label:t,description:n,errorMessage:e,requiredIndicator:i,className:o,...l}){return r(b,{className:m(o,a=>s("group form-field",a)),...l,children:r(f,{label:t,description:n,errorMessage:e,requiredIndicator:i,children:u(h,{children:[r(N,{className:"pr-input"}),r("div",{className:"absolute right-1 select-none text-muted",children:"days"})]})})})}function U({isDisabled:t,...n}){const e=p({disabled:t}),i=86400,o=e.state.value!=null?e.state.value/i:void 0,l=a=>{const g=a*i;e.handleChange(g)};return r(S,{isInvalid:!!d(e),isDisabled:t||e.form.state.isSubmitting,value:o,id:e.name,onChange:l,onBlur:e.handleBlur,errorMessage:d(e),...n})}export{S as DaysField,I as NumberField,N as NumberFieldInput,U as TfDaysField,O as TfNumberField};
|
|
2
2
|
//# sourceMappingURL=numberfield.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"numberfield.js","sources":["../../lib/components/numberfield.tsx"],"sourcesContent":["import {\n ButtonProps as AriaButtonProps,\n Input as AriaInput,\n InputProps as AriaInputProps,\n NumberField as AriaNumberField,\n NumberFieldProps as AriaNumberFieldProps,\n composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcDown, IcUp } from './icons';\n\nconst ANumberField = AriaNumberField;\n\
|
|
1
|
+
{"version":3,"file":"numberfield.js","sources":["../../lib/components/numberfield.tsx"],"sourcesContent":["import {\n ButtonProps as AriaButtonProps,\n Input as AriaInput,\n InputProps as AriaInputProps,\n NumberField as AriaNumberField,\n NumberFieldProps as AriaNumberFieldProps,\n composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcDown, IcUp } from './icons';\n\nconst ANumberField = AriaNumberField;\n\nexport function NumberFieldInput({ className, ...props }: AriaInputProps) {\n return (\n <AriaInput\n className={composeRenderProps(className, className =>\n classNames(\n 'w-fit min-w-0 flex-1 border-r border-transparent bg-elevation-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden',\n className\n )\n )}\n {...props}\n />\n );\n}\n\nfunction NumberFieldSteppers({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div className={classNames('absolute right-0 flex h-full flex-col border-l', className)} {...props}>\n <NumberFieldStepper slot=\"increment\">\n <IcUp aria-hidden className=\"size-icon\" />\n </NumberFieldStepper>\n <div className=\"border-b\" />\n <NumberFieldStepper slot=\"decrement\">\n <IcDown aria-hidden className=\"size-icon\" />\n </NumberFieldStepper>\n </div>\n );\n}\n\nfunction NumberFieldStepper({ className, ...props }: AriaButtonProps) {\n return (\n <Button\n className={composeRenderProps(className, className =>\n classNames('w-auto grow h-3 px-0.5 text-muted-foreground', className)\n )}\n variant={'ghost'}\n size={'none'}\n {...props}\n />\n );\n}\n\nexport type NumberFieldProps = AriaNumberFieldProps & FormFieldProps;\nexport function NumberField({\n label,\n description,\n errorMessage,\n requiredIndicator,\n className,\n ...props\n}: NumberFieldProps) {\n return (\n <ANumberField\n className={composeRenderProps(className, className => classNames('group form-field', className))}\n {...props}\n >\n <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n <FieldGroup>\n <NumberFieldInput className={'pr-input'} />\n <NumberFieldSteppers />\n </FieldGroup>\n </FormField>\n </ANumberField>\n );\n}\n\nexport function TfNumberField({\n isDisabled,\n ...props\n}: Omit<React.ComponentProps<typeof NumberField>, 'value' | 'id' | 'onChange' | 'onBlur'>) {\n const field = useFieldContext<number>({ disabled: isDisabled });\n\n return (\n <NumberField\n isInvalid={!!getFieldErrorMessage(field)}\n isDisabled={isDisabled || field.form.state.isSubmitting}\n value={field.state.value}\n id={field.name}\n onChange={field.handleChange}\n onBlur={field.handleBlur}\n errorMessage={getFieldErrorMessage(field)}\n {...props}\n />\n );\n}\n\nexport function DaysField({\n label,\n description,\n errorMessage,\n requiredIndicator,\n className,\n ...props\n}: NumberFieldProps) {\n return (\n <ANumberField\n className={composeRenderProps(className, className => classNames('group form-field', className))}\n {...props}\n >\n <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n <FieldGroup>\n <NumberFieldInput className={'pr-input'} />\n <div className=\"absolute right-1 select-none text-muted\">days</div>\n </FieldGroup>\n </FormField>\n </ANumberField>\n );\n}\n\nexport function TfDaysField({\n isDisabled,\n ...props\n}: Omit<React.ComponentProps<typeof DaysField>, 'value' | 'id' | 'onChange' | 'onBlur'>) {\n const field = useFieldContext<number>({ disabled: isDisabled });\n\n const SECONDS_PER_DAY = 86400; // 24 * 60 * 60\n\n // Convert seconds to days for display\n const daysValue = field.state.value != null ? field.state.value / SECONDS_PER_DAY : undefined;\n\n // Convert days to seconds when value changes\n const handleDaysChange = (days: number) => {\n const seconds = days * SECONDS_PER_DAY;\n field.handleChange(seconds);\n };\n\n return (\n <DaysField\n isInvalid={!!getFieldErrorMessage(field)}\n isDisabled={isDisabled || field.form.state.isSubmitting}\n value={daysValue}\n id={field.name}\n onChange={handleDaysChange}\n onBlur={field.handleBlur}\n errorMessage={getFieldErrorMessage(field)}\n {...props}\n />\n );\n}\n"],"names":["ANumberField","AriaNumberField","NumberFieldInput","className","props","jsx","AriaInput","composeRenderProps","classNames","NumberFieldSteppers","jsxs","NumberFieldStepper","IcUp","IcDown","Button","NumberField","label","description","errorMessage","requiredIndicator","FormField","FieldGroup","TfNumberField","isDisabled","field","useFieldContext","getFieldErrorMessage","DaysField","TfDaysField","SECONDS_PER_DAY","daysValue","handleDaysChange","days","seconds"],"mappings":"6iBAgBA,MAAMA,EAAeC,EAEd,SAASC,EAAiB,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACtE,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,uJACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASK,EAAoB,CAAE,UAAAN,EAAW,GAAGC,GAAsC,CAC/E,OACIM,EAAC,OAAI,UAAWF,EAAW,iDAAkDL,CAAS,EAAI,GAAGC,EACzF,SAAA,CAAAC,EAACM,EAAA,CAAmB,KAAK,YACrB,SAAAN,EAACO,GAAK,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC5C,EACAP,EAAC,MAAA,CAAI,UAAU,UAAA,CAAW,EAC1BA,EAACM,EAAA,CAAmB,KAAK,YACrB,SAAAN,EAACQ,GAAO,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC9C,CAAA,EACJ,CAER,CAEA,SAASF,EAAmB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CAClE,OACIC,EAACS,EAAA,CACG,UAAWP,EAAmBJ,EAAWA,GACrCK,EAAW,+CAAgDL,CAAS,CAAA,EAExE,QAAS,QACT,KAAM,OACL,GAAGC,CAAA,CAAA,CAGhB,CAGO,SAASW,EAAY,CACxB,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,UAAAhB,EACA,GAAGC,CACP,EAAqB,CACjB,OACIC,EAACL,EAAA,CACG,UAAWO,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,SAAAC,EAACe,EAAA,CAAgB,MAAAJ,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAC/C,SAAAT,EAACW,EAAA,CACG,SAAA,CAAAhB,EAACH,EAAA,CAAiB,UAAW,UAAA,CAAY,IACxCO,EAAA,CAAA,CAAoB,CAAA,CAAA,CACzB,CAAA,CACJ,CAAA,CAAA,CAGZ,CAEO,SAASa,EAAc,CAC1B,WAAAC,EACA,GAAGnB,CACP,EAA2F,CACvF,MAAMoB,EAAQC,EAAwB,CAAE,SAAUF,EAAY,EAE9D,OACIlB,EAACU,EAAA,CACG,UAAW,CAAC,CAACW,EAAqBF,CAAK,EACvC,WAAYD,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,SAAUA,EAAM,aAChB,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGpB,CAAA,CAAA,CAGhB,CAEO,SAASuB,EAAU,CACtB,MAAAX,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,UAAAhB,EACA,GAAGC,CACP,EAAqB,CACjB,OACIC,EAACL,EAAA,CACG,UAAWO,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,SAAAC,EAACe,EAAA,CAAgB,MAAAJ,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAC/C,SAAAT,EAACW,EAAA,CACG,SAAA,CAAAhB,EAACH,EAAA,CAAiB,UAAW,UAAA,CAAY,EACzCG,EAAC,MAAA,CAAI,UAAU,0CAA0C,SAAA,MAAA,CAAI,CAAA,CAAA,CACjE,CAAA,CACJ,CAAA,CAAA,CAGZ,CAEO,SAASuB,EAAY,CACxB,WAAAL,EACA,GAAGnB,CACP,EAAyF,CACrF,MAAMoB,EAAQC,EAAwB,CAAE,SAAUF,EAAY,EAExDM,EAAkB,MAGlBC,EAAYN,EAAM,MAAM,OAAS,KAAOA,EAAM,MAAM,MAAQK,EAAkB,OAG9EE,EAAoBC,GAAiB,CACvC,MAAMC,EAAUD,EAAOH,EACvBL,EAAM,aAAaS,CAAO,CAC9B,EAEA,OACI5B,EAACsB,EAAA,CACG,UAAW,CAAC,CAACD,EAAqBF,CAAK,EACvC,WAAYD,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOM,EACP,GAAIN,EAAM,KACV,SAAUO,EACV,OAAQP,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGpB,CAAA,CAAA,CAGhB"}
|
|
@@ -4,5 +4,6 @@ export type SelectOption = {
|
|
|
4
4
|
disabled?: boolean;
|
|
5
5
|
};
|
|
6
6
|
export declare const LICENSE_TYPE_OPTIONS: SelectOption[];
|
|
7
|
+
export declare const SUBSCRIPTION_START_TRIGGER_OPTIONS: SelectOption[];
|
|
7
8
|
/** Options for MultiSelect component */
|
|
8
9
|
export declare const COUNTRY_OPTIONS: SelectOption[];
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as n,Fragment as i,jsx as e}from"react/jsx-runtime";import{IcNodeLocked as t,IcHostedFloating as l,IcLexFloatServer as s}from"./icons.js";import"react";const
|
|
1
|
+
import{jsxs as n,Fragment as i,jsx as e}from"react/jsx-runtime";import{IcNodeLocked as t,IcHostedFloating as l,IcLexFloatServer as s}from"./icons.js";import"react";const I=[{label:n(i,{children:["Node-locked",e(t,{})]}),id:"node-locked"},{label:n(i,{children:["Hosted floating",e(l,{})]}),id:"hosted-floating"},{label:n(i,{children:["LexFloatServer",e(s,{})]}),id:"on-premise-floating"}],C=[{label:"License Creation",id:"creation"},{label:"License Activation",id:"activation"}];function d(a){function r(o){return String.fromCodePoint(127397+o.toUpperCase().charCodeAt(0))}return r(a[0])+r(a[1])}const u={AF:"Afghanistan",AX:"Åland Islands",AL:"Albania",DZ:"Algeria",AS:"American Samoa",AD:"Andorra",AO:"Angola",AI:"Anguilla",AQ:"Antarctica",AG:"Antigua and Barbuda",AR:"Argentina",AM:"Armenia",AW:"Aruba",AU:"Australia",AT:"Austria",AZ:"Azerbaijan",BS:"Bahamas",BH:"Bahrain",BD:"Bangladesh",BB:"Barbados",BY:"Belarus",BE:"Belgium",BZ:"Belize",BJ:"Benin",BM:"Bermuda",BT:"Bhutan",BO:"Bolivia (Plurinational State of)",BQ:"Bonaire, Sint Eustatius and Saba",BA:"Bosnia and Herzegovina",BW:"Botswana",BV:"Bouvet Island",BR:"Brazil",IO:"British Indian Ocean Territory",BN:"Brunei Darussalam",BG:"Bulgaria",BF:"Burkina Faso",BI:"Burundi",CV:"Caboe Verde",KH:"Cambodia",CM:"Cameroon",CA:"Canada",KY:"Cayman Islands",CF:"Central African Republic",TD:"Chad",CL:"Chile",CN:"China",CX:"Christmas Island",CC:"Cocos (Keeling) Islands",CO:"Colombia",KM:"Comoros",CG:"Congo",CD:"Congo, Democratic Republic of the",CK:"Cook Islands",CR:"Costa Rica",CI:"Côte d'voire",HR:"Croatia",CU:"Cuba",CW:"Curaçao",CY:"Cyprus",CZ:"Czechia",DK:"Denmark",DJ:"Djibouti",DM:"Dominica",DO:"Dominican Republic",EC:"Ecuador",EG:"Egypt",SV:"El Salvador",GQ:"Equatorial Guinea",ER:"Eritrea",EE:"Estonia",SZ:"Eswatini",ET:"Ethiopia",FK:"Falkland Islands (Malvinas)",FO:"Faroe Islands",FJ:"Fiji",FI:"Finland",FR:"France",GF:"French Guiana",PF:"French Polynesia",TF:"French Southern Territories",GA:"Gabon",GM:"Gambia",GE:"Georgia",DE:"Germany",GH:"Ghana",GI:"Gibraltar",GR:"Greece",GL:"Greenland",GD:"Grenada",GP:"Guadeloupe",GU:"Guam",GT:"Guatemala",GG:"Guernsey",GN:"Guinea",GW:"Guinea-Bissau",GY:"Guyana",HT:"Haiti",HM:"Heard Island and Mcdonald Islands",VA:"Holy See",HN:"Honduras",HK:"Hong Kong",HU:"Hungary",IS:"Iceland",IN:"India",ID:"Indonesia",IR:"Iran (Islamic Republic of)",IQ:"Iraq",IE:"Ireland",IM:"Isle of Man",IL:"Israel",IT:"Italy",JM:"Jamaica",JP:"Japan",JE:"Jersey",JO:"Jordan",KZ:"Kazakhstan",KE:"Kenya",KI:"Kiribati",KP:"Korea (Democratic People's Republic of)",KR:"Korea (Republic of)",KW:"Kuwait",KG:"Kyrgyzstan",LA:"Lao People's Democratic Republic",LV:"Latvia",LB:"Lebanon",LS:"Lesotho",LR:"Liberia",LY:"Libya",LI:"Liechtenstein",LT:"Lithuania",LU:"Luxembourg",MO:"Macao",MG:"Madagascar",MW:"Malawi",MY:"Malaysia",MV:"Maldives",ML:"Mali",MT:"Malta",MH:"Marshall Islands",MQ:"Martinique",MR:"Mauritania",MU:"Mauritius",YT:"Mayotte",MX:"Mexico",FM:"Micronesia (Federated States of)",MD:"Moldova, Republic of",MC:"Monaco",MN:"Mongolia",ME:"Montenegro",MS:"Montserrat",MA:"Morocco",MZ:"Mozambique",MM:"Myanmar",NA:"Namibia",NR:"Nauru",NP:"Nepal",NL:"Netherlands, Kingdom of the",NC:"New Caledonia",NZ:"New Zealand",NI:"Nicaragua",NE:"Niger",NG:"Nigeria",NU:"Niue",NF:"Norfolk Island",MK:"North Macedonia",MP:"Northern Mariana Islands",NO:"Norway",OM:"Oman",PK:"Pakistan",PW:"Palau",PS:"Palestine, State of",PA:"Panama",PG:"Papua New Guinea",PY:"Paraguay",PE:"Peru",PH:"Philippines",PN:"Pitcairn",PL:"Poland",PT:"Portugal",PR:"Puerto Rico",QA:"Qatar",RE:"Réunion",RO:"Romania",RU:"Russian Federation",RW:"Rwanda",BL:"Saint Barthélemy",SH:"Saint Helena, Ascension Island, Tristan da Cunha",KN:"Saint Kitts and Nevis",LC:"Saint Lucia",MF:"Saint Martin (French part)",PM:"Saint Pierre and Miquelon",VC:"Saint Vincent and the Grenadines",WS:"Samoa",SM:"San Marino",ST:"Sao Tome and Principe",SA:"Saudi Arabia",SN:"Senegal",RS:"Serbia",SC:"Seychelles",SL:"Sierra Leone",SG:"Singapore",SX:"Sint Maarten (Dutch part)",SK:"Slovakia",SI:"Slovenia",SB:"Solomon Islands",SO:"Somalia",ZA:"South Africa",GS:"South Georgia and the South Sandwich Islands",SS:"South Sudan",ES:"Spain",LK:"Sri Lanka",SD:"Sudan",SR:"Suriname",SJ:"Svalbard and Jan Mayen",SE:"Sweden",CH:"Switzerland",SY:"Syrian Arab Republic",TW:"Taiwan, Province of China",TJ:"Tajikistan",TZ:"Tanzania, United Republic of",TH:"Thailand",TL:"Timor-Leste",TG:"Togo",TK:"Tokelau",TO:"Tonga",TT:"Trinidad and Tobago",TN:"Tunisia",TR:"Türkiye",TM:"Turkmenistan",TC:"Turks and Caicos Islands",TV:"Tuvalu",UG:"Uganda",UA:"Ukraine",AE:"United Arab Emirates",GB:"United Kingdom of Great Britain and Northern Ireland",UM:"United States Minor Outlying Islands",US:"United States of America",UY:"Uruguay",UZ:"Uzbekistan",VU:"Vanuatu",VE:"Venezuela (Bolivarian Republic of)",VN:"Viet Nam",VG:"Virgin Islands (British)",VI:"Virgin Islands (U.S)",WF:"Wallis and Futuna",EH:"Western Sahara",YE:"Yemen",ZM:"Zambia",ZW:"Zimbabwe"},m=Object.entries(u).map(a=>({label:n(i,{children:[d(a[0])," ",a[1]]}),id:a[0]}));export{m as COUNTRY_OPTIONS,I as LICENSE_TYPE_OPTIONS,C as SUBSCRIPTION_START_TRIGGER_OPTIONS};
|
|
2
2
|
//# sourceMappingURL=select-options.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-options.js","sources":["../../lib/components/select-options.tsx"],"sourcesContent":["import { IcHostedFloating, IcLexFloatServer, IcNodeLocked } from './icons';\n\nexport type SelectOption = {\n id: string;\n label: React.ReactNode;\n disabled?: boolean;\n};\n\n// TODO, use icons\nexport const LICENSE_TYPE_OPTIONS: SelectOption[] = [\n {\n label: (\n <>\n Node-locked\n <IcNodeLocked />\n </>\n ),\n id: 'node-locked',\n },\n {\n label: (\n <>\n Hosted floating\n <IcHostedFloating />\n </>\n ),\n id: 'hosted-floating',\n },\n {\n label: (\n <>\n LexFloatServer\n <IcLexFloatServer />\n </>\n ),\n id: 'on-premise-floating',\n },\n];\n\n/**\n * Creates Unicode flag from a two-letter ISO country code.\n * https://stackoverflow.com/questions/24050671/how-to-put-japan-flag-character-in-a-string\n * @param {string} country — A two-letter ISO country code (case-insensitive).\n * @return {string}\n */\nfunction getCountryFlag(country: string) {\n function getRegionalIndicatorSymbol(letter: string) {\n return String.fromCodePoint(0x1f1e6 - 65 + letter.toUpperCase().charCodeAt(0));\n }\n\n return getRegionalIndicatorSymbol(country[0]) + getRegionalIndicatorSymbol(country[1]);\n}\n\nconst ALL_COUNTRIES: { [key: string]: string } = {\n AF: 'Afghanistan',\n AX: 'Åland Islands',\n AL: 'Albania',\n DZ: 'Algeria',\n AS: 'American Samoa',\n AD: 'Andorra',\n AO: 'Angola',\n AI: 'Anguilla',\n AQ: 'Antarctica',\n AG: 'Antigua and Barbuda',\n AR: 'Argentina',\n AM: 'Armenia',\n AW: 'Aruba',\n AU: 'Australia',\n AT: 'Austria',\n AZ: 'Azerbaijan',\n BS: 'Bahamas',\n BH: 'Bahrain',\n BD: 'Bangladesh',\n BB: 'Barbados',\n BY: 'Belarus',\n BE: 'Belgium',\n BZ: 'Belize',\n BJ: 'Benin',\n BM: 'Bermuda',\n BT: 'Bhutan',\n BO: 'Bolivia (Plurinational State of)',\n BQ: 'Bonaire, Sint Eustatius and Saba',\n BA: 'Bosnia and Herzegovina',\n BW: 'Botswana',\n BV: 'Bouvet Island',\n BR: 'Brazil',\n IO: 'British Indian Ocean Territory',\n BN: 'Brunei Darussalam',\n BG: 'Bulgaria',\n BF: 'Burkina Faso',\n BI: 'Burundi',\n CV: 'Caboe Verde',\n KH: 'Cambodia',\n CM: 'Cameroon',\n CA: 'Canada',\n KY: 'Cayman Islands',\n CF: 'Central African Republic',\n TD: 'Chad',\n CL: 'Chile',\n CN: 'China',\n CX: 'Christmas Island',\n CC: 'Cocos (Keeling) Islands',\n CO: 'Colombia',\n KM: 'Comoros',\n CG: 'Congo',\n CD: 'Congo, Democratic Republic of the',\n CK: 'Cook Islands',\n CR: 'Costa Rica',\n CI: \"Côte d'voire\",\n HR: 'Croatia',\n CU: 'Cuba',\n CW: 'Curaçao',\n CY: 'Cyprus',\n CZ: 'Czechia',\n DK: 'Denmark',\n DJ: 'Djibouti',\n DM: 'Dominica',\n DO: 'Dominican Republic',\n EC: 'Ecuador',\n EG: 'Egypt',\n SV: 'El Salvador',\n GQ: 'Equatorial Guinea',\n ER: 'Eritrea',\n EE: 'Estonia',\n SZ: 'Eswatini',\n ET: 'Ethiopia',\n FK: 'Falkland Islands (Malvinas)',\n FO: 'Faroe Islands',\n FJ: 'Fiji',\n FI: 'Finland',\n FR: 'France',\n GF: 'French Guiana',\n PF: 'French Polynesia',\n TF: 'French Southern Territories',\n GA: 'Gabon',\n GM: 'Gambia',\n GE: 'Georgia',\n DE: 'Germany',\n GH: 'Ghana',\n GI: 'Gibraltar',\n GR: 'Greece',\n GL: 'Greenland',\n GD: 'Grenada',\n GP: 'Guadeloupe',\n GU: 'Guam',\n GT: 'Guatemala',\n GG: 'Guernsey',\n GN: 'Guinea',\n GW: 'Guinea-Bissau',\n GY: 'Guyana',\n HT: 'Haiti',\n HM: 'Heard Island and Mcdonald Islands',\n VA: 'Holy See',\n HN: 'Honduras',\n HK: 'Hong Kong',\n HU: 'Hungary',\n IS: 'Iceland',\n IN: 'India',\n ID: 'Indonesia',\n IR: 'Iran (Islamic Republic of)',\n IQ: 'Iraq',\n IE: 'Ireland',\n IM: 'Isle of Man',\n IL: 'Israel',\n IT: 'Italy',\n JM: 'Jamaica',\n JP: 'Japan',\n JE: 'Jersey',\n JO: 'Jordan',\n KZ: 'Kazakhstan',\n KE: 'Kenya',\n KI: 'Kiribati',\n KP: \"Korea (Democratic People's Republic of)\",\n KR: 'Korea (Republic of)',\n KW: 'Kuwait',\n KG: 'Kyrgyzstan',\n LA: \"Lao People's Democratic Republic\",\n LV: 'Latvia',\n LB: 'Lebanon',\n LS: 'Lesotho',\n LR: 'Liberia',\n LY: 'Libya',\n LI: 'Liechtenstein',\n LT: 'Lithuania',\n LU: 'Luxembourg',\n MO: 'Macao',\n MG: 'Madagascar',\n MW: 'Malawi',\n MY: 'Malaysia',\n MV: 'Maldives',\n ML: 'Mali',\n MT: 'Malta',\n MH: 'Marshall Islands',\n MQ: 'Martinique',\n MR: 'Mauritania',\n MU: 'Mauritius',\n YT: 'Mayotte',\n MX: 'Mexico',\n FM: 'Micronesia (Federated States of)',\n MD: 'Moldova, Republic of',\n MC: 'Monaco',\n MN: 'Mongolia',\n ME: 'Montenegro',\n MS: 'Montserrat',\n MA: 'Morocco',\n MZ: 'Mozambique',\n MM: 'Myanmar',\n NA: 'Namibia',\n NR: 'Nauru',\n NP: 'Nepal',\n NL: 'Netherlands, Kingdom of the',\n NC: 'New Caledonia',\n NZ: 'New Zealand',\n NI: 'Nicaragua',\n NE: 'Niger',\n NG: 'Nigeria',\n NU: 'Niue',\n NF: 'Norfolk Island',\n MK: 'North Macedonia',\n MP: 'Northern Mariana Islands',\n NO: 'Norway',\n OM: 'Oman',\n PK: 'Pakistan',\n PW: 'Palau',\n PS: 'Palestine, State of',\n PA: 'Panama',\n PG: 'Papua New Guinea',\n PY: 'Paraguay',\n PE: 'Peru',\n PH: 'Philippines',\n PN: 'Pitcairn',\n PL: 'Poland',\n PT: 'Portugal',\n PR: 'Puerto Rico',\n QA: 'Qatar',\n RE: 'Réunion',\n RO: 'Romania',\n RU: 'Russian Federation',\n RW: 'Rwanda',\n BL: 'Saint Barthélemy',\n SH: 'Saint Helena, Ascension Island, Tristan da Cunha',\n KN: 'Saint Kitts and Nevis',\n LC: 'Saint Lucia',\n MF: 'Saint Martin (French part)',\n PM: 'Saint Pierre and Miquelon',\n VC: 'Saint Vincent and the Grenadines',\n WS: 'Samoa',\n SM: 'San Marino',\n ST: 'Sao Tome and Principe',\n SA: 'Saudi Arabia',\n SN: 'Senegal',\n RS: 'Serbia',\n SC: 'Seychelles',\n SL: 'Sierra Leone',\n SG: 'Singapore',\n SX: 'Sint Maarten (Dutch part)',\n SK: 'Slovakia',\n SI: 'Slovenia',\n SB: 'Solomon Islands',\n SO: 'Somalia',\n ZA: 'South Africa',\n GS: 'South Georgia and the South Sandwich Islands',\n SS: 'South Sudan',\n ES: 'Spain',\n LK: 'Sri Lanka',\n SD: 'Sudan',\n SR: 'Suriname',\n SJ: 'Svalbard and Jan Mayen',\n SE: 'Sweden',\n CH: 'Switzerland',\n SY: 'Syrian Arab Republic',\n TW: 'Taiwan, Province of China',\n TJ: 'Tajikistan',\n TZ: 'Tanzania, United Republic of',\n TH: 'Thailand',\n TL: 'Timor-Leste',\n TG: 'Togo',\n TK: 'Tokelau',\n TO: 'Tonga',\n TT: 'Trinidad and Tobago',\n TN: 'Tunisia',\n TR: 'Türkiye',\n TM: 'Turkmenistan',\n TC: 'Turks and Caicos Islands',\n TV: 'Tuvalu',\n UG: 'Uganda',\n UA: 'Ukraine',\n AE: 'United Arab Emirates',\n GB: 'United Kingdom of Great Britain and Northern Ireland',\n UM: 'United States Minor Outlying Islands',\n US: 'United States of America',\n UY: 'Uruguay',\n UZ: 'Uzbekistan',\n VU: 'Vanuatu',\n VE: 'Venezuela (Bolivarian Republic of)',\n VN: 'Viet Nam',\n VG: 'Virgin Islands (British)',\n VI: 'Virgin Islands (U.S)',\n WF: 'Wallis and Futuna',\n EH: 'Western Sahara',\n YE: 'Yemen',\n ZM: 'Zambia',\n ZW: 'Zimbabwe',\n};\n\n/** Options for MultiSelect component */\nexport const COUNTRY_OPTIONS: SelectOption[] = Object.entries(ALL_COUNTRIES).map(v => {\n return {\n label: (\n <>\n {getCountryFlag(v[0])} {v[1]}\n </>\n ),\n id: v[0],\n };\n});\n"],"names":["LICENSE_TYPE_OPTIONS","jsxs","Fragment","IcNodeLocked","IcHostedFloating","IcLexFloatServer","getCountryFlag","country","getRegionalIndicatorSymbol","letter","ALL_COUNTRIES","COUNTRY_OPTIONS","v"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select-options.js","sources":["../../lib/components/select-options.tsx"],"sourcesContent":["import { IcHostedFloating, IcLexFloatServer, IcNodeLocked } from './icons';\n\nexport type SelectOption = {\n id: string;\n label: React.ReactNode;\n disabled?: boolean;\n};\n\n// TODO, use icons\nexport const LICENSE_TYPE_OPTIONS: SelectOption[] = [\n {\n label: (\n <>\n Node-locked\n <IcNodeLocked />\n </>\n ),\n id: 'node-locked',\n },\n {\n label: (\n <>\n Hosted floating\n <IcHostedFloating />\n </>\n ),\n id: 'hosted-floating',\n },\n {\n label: (\n <>\n LexFloatServer\n <IcLexFloatServer />\n </>\n ),\n id: 'on-premise-floating',\n },\n];\n\nexport const SUBSCRIPTION_START_TRIGGER_OPTIONS: SelectOption[] = [\n {\n label: 'License Creation',\n id: 'creation',\n },\n {\n label: 'License Activation',\n id: 'activation',\n },\n];\n\n/**\n * Creates Unicode flag from a two-letter ISO country code.\n * https://stackoverflow.com/questions/24050671/how-to-put-japan-flag-character-in-a-string\n * @param {string} country — A two-letter ISO country code (case-insensitive).\n * @return {string}\n */\nfunction getCountryFlag(country: string) {\n function getRegionalIndicatorSymbol(letter: string) {\n return String.fromCodePoint(0x1f1e6 - 65 + letter.toUpperCase().charCodeAt(0));\n }\n\n return getRegionalIndicatorSymbol(country[0]) + getRegionalIndicatorSymbol(country[1]);\n}\n\nconst ALL_COUNTRIES: { [key: string]: string } = {\n AF: 'Afghanistan',\n AX: 'Åland Islands',\n AL: 'Albania',\n DZ: 'Algeria',\n AS: 'American Samoa',\n AD: 'Andorra',\n AO: 'Angola',\n AI: 'Anguilla',\n AQ: 'Antarctica',\n AG: 'Antigua and Barbuda',\n AR: 'Argentina',\n AM: 'Armenia',\n AW: 'Aruba',\n AU: 'Australia',\n AT: 'Austria',\n AZ: 'Azerbaijan',\n BS: 'Bahamas',\n BH: 'Bahrain',\n BD: 'Bangladesh',\n BB: 'Barbados',\n BY: 'Belarus',\n BE: 'Belgium',\n BZ: 'Belize',\n BJ: 'Benin',\n BM: 'Bermuda',\n BT: 'Bhutan',\n BO: 'Bolivia (Plurinational State of)',\n BQ: 'Bonaire, Sint Eustatius and Saba',\n BA: 'Bosnia and Herzegovina',\n BW: 'Botswana',\n BV: 'Bouvet Island',\n BR: 'Brazil',\n IO: 'British Indian Ocean Territory',\n BN: 'Brunei Darussalam',\n BG: 'Bulgaria',\n BF: 'Burkina Faso',\n BI: 'Burundi',\n CV: 'Caboe Verde',\n KH: 'Cambodia',\n CM: 'Cameroon',\n CA: 'Canada',\n KY: 'Cayman Islands',\n CF: 'Central African Republic',\n TD: 'Chad',\n CL: 'Chile',\n CN: 'China',\n CX: 'Christmas Island',\n CC: 'Cocos (Keeling) Islands',\n CO: 'Colombia',\n KM: 'Comoros',\n CG: 'Congo',\n CD: 'Congo, Democratic Republic of the',\n CK: 'Cook Islands',\n CR: 'Costa Rica',\n CI: \"Côte d'voire\",\n HR: 'Croatia',\n CU: 'Cuba',\n CW: 'Curaçao',\n CY: 'Cyprus',\n CZ: 'Czechia',\n DK: 'Denmark',\n DJ: 'Djibouti',\n DM: 'Dominica',\n DO: 'Dominican Republic',\n EC: 'Ecuador',\n EG: 'Egypt',\n SV: 'El Salvador',\n GQ: 'Equatorial Guinea',\n ER: 'Eritrea',\n EE: 'Estonia',\n SZ: 'Eswatini',\n ET: 'Ethiopia',\n FK: 'Falkland Islands (Malvinas)',\n FO: 'Faroe Islands',\n FJ: 'Fiji',\n FI: 'Finland',\n FR: 'France',\n GF: 'French Guiana',\n PF: 'French Polynesia',\n TF: 'French Southern Territories',\n GA: 'Gabon',\n GM: 'Gambia',\n GE: 'Georgia',\n DE: 'Germany',\n GH: 'Ghana',\n GI: 'Gibraltar',\n GR: 'Greece',\n GL: 'Greenland',\n GD: 'Grenada',\n GP: 'Guadeloupe',\n GU: 'Guam',\n GT: 'Guatemala',\n GG: 'Guernsey',\n GN: 'Guinea',\n GW: 'Guinea-Bissau',\n GY: 'Guyana',\n HT: 'Haiti',\n HM: 'Heard Island and Mcdonald Islands',\n VA: 'Holy See',\n HN: 'Honduras',\n HK: 'Hong Kong',\n HU: 'Hungary',\n IS: 'Iceland',\n IN: 'India',\n ID: 'Indonesia',\n IR: 'Iran (Islamic Republic of)',\n IQ: 'Iraq',\n IE: 'Ireland',\n IM: 'Isle of Man',\n IL: 'Israel',\n IT: 'Italy',\n JM: 'Jamaica',\n JP: 'Japan',\n JE: 'Jersey',\n JO: 'Jordan',\n KZ: 'Kazakhstan',\n KE: 'Kenya',\n KI: 'Kiribati',\n KP: \"Korea (Democratic People's Republic of)\",\n KR: 'Korea (Republic of)',\n KW: 'Kuwait',\n KG: 'Kyrgyzstan',\n LA: \"Lao People's Democratic Republic\",\n LV: 'Latvia',\n LB: 'Lebanon',\n LS: 'Lesotho',\n LR: 'Liberia',\n LY: 'Libya',\n LI: 'Liechtenstein',\n LT: 'Lithuania',\n LU: 'Luxembourg',\n MO: 'Macao',\n MG: 'Madagascar',\n MW: 'Malawi',\n MY: 'Malaysia',\n MV: 'Maldives',\n ML: 'Mali',\n MT: 'Malta',\n MH: 'Marshall Islands',\n MQ: 'Martinique',\n MR: 'Mauritania',\n MU: 'Mauritius',\n YT: 'Mayotte',\n MX: 'Mexico',\n FM: 'Micronesia (Federated States of)',\n MD: 'Moldova, Republic of',\n MC: 'Monaco',\n MN: 'Mongolia',\n ME: 'Montenegro',\n MS: 'Montserrat',\n MA: 'Morocco',\n MZ: 'Mozambique',\n MM: 'Myanmar',\n NA: 'Namibia',\n NR: 'Nauru',\n NP: 'Nepal',\n NL: 'Netherlands, Kingdom of the',\n NC: 'New Caledonia',\n NZ: 'New Zealand',\n NI: 'Nicaragua',\n NE: 'Niger',\n NG: 'Nigeria',\n NU: 'Niue',\n NF: 'Norfolk Island',\n MK: 'North Macedonia',\n MP: 'Northern Mariana Islands',\n NO: 'Norway',\n OM: 'Oman',\n PK: 'Pakistan',\n PW: 'Palau',\n PS: 'Palestine, State of',\n PA: 'Panama',\n PG: 'Papua New Guinea',\n PY: 'Paraguay',\n PE: 'Peru',\n PH: 'Philippines',\n PN: 'Pitcairn',\n PL: 'Poland',\n PT: 'Portugal',\n PR: 'Puerto Rico',\n QA: 'Qatar',\n RE: 'Réunion',\n RO: 'Romania',\n RU: 'Russian Federation',\n RW: 'Rwanda',\n BL: 'Saint Barthélemy',\n SH: 'Saint Helena, Ascension Island, Tristan da Cunha',\n KN: 'Saint Kitts and Nevis',\n LC: 'Saint Lucia',\n MF: 'Saint Martin (French part)',\n PM: 'Saint Pierre and Miquelon',\n VC: 'Saint Vincent and the Grenadines',\n WS: 'Samoa',\n SM: 'San Marino',\n ST: 'Sao Tome and Principe',\n SA: 'Saudi Arabia',\n SN: 'Senegal',\n RS: 'Serbia',\n SC: 'Seychelles',\n SL: 'Sierra Leone',\n SG: 'Singapore',\n SX: 'Sint Maarten (Dutch part)',\n SK: 'Slovakia',\n SI: 'Slovenia',\n SB: 'Solomon Islands',\n SO: 'Somalia',\n ZA: 'South Africa',\n GS: 'South Georgia and the South Sandwich Islands',\n SS: 'South Sudan',\n ES: 'Spain',\n LK: 'Sri Lanka',\n SD: 'Sudan',\n SR: 'Suriname',\n SJ: 'Svalbard and Jan Mayen',\n SE: 'Sweden',\n CH: 'Switzerland',\n SY: 'Syrian Arab Republic',\n TW: 'Taiwan, Province of China',\n TJ: 'Tajikistan',\n TZ: 'Tanzania, United Republic of',\n TH: 'Thailand',\n TL: 'Timor-Leste',\n TG: 'Togo',\n TK: 'Tokelau',\n TO: 'Tonga',\n TT: 'Trinidad and Tobago',\n TN: 'Tunisia',\n TR: 'Türkiye',\n TM: 'Turkmenistan',\n TC: 'Turks and Caicos Islands',\n TV: 'Tuvalu',\n UG: 'Uganda',\n UA: 'Ukraine',\n AE: 'United Arab Emirates',\n GB: 'United Kingdom of Great Britain and Northern Ireland',\n UM: 'United States Minor Outlying Islands',\n US: 'United States of America',\n UY: 'Uruguay',\n UZ: 'Uzbekistan',\n VU: 'Vanuatu',\n VE: 'Venezuela (Bolivarian Republic of)',\n VN: 'Viet Nam',\n VG: 'Virgin Islands (British)',\n VI: 'Virgin Islands (U.S)',\n WF: 'Wallis and Futuna',\n EH: 'Western Sahara',\n YE: 'Yemen',\n ZM: 'Zambia',\n ZW: 'Zimbabwe',\n};\n\n/** Options for MultiSelect component */\nexport const COUNTRY_OPTIONS: SelectOption[] = Object.entries(ALL_COUNTRIES).map(v => {\n return {\n label: (\n <>\n {getCountryFlag(v[0])} {v[1]}\n </>\n ),\n id: v[0],\n };\n});\n"],"names":["LICENSE_TYPE_OPTIONS","jsxs","Fragment","IcNodeLocked","IcHostedFloating","IcLexFloatServer","SUBSCRIPTION_START_TRIGGER_OPTIONS","getCountryFlag","country","getRegionalIndicatorSymbol","letter","ALL_COUNTRIES","COUNTRY_OPTIONS","v"],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export type Duration = {
|
|
2
|
+
years?: number;
|
|
3
|
+
months?: number;
|
|
4
|
+
weeks?: number;
|
|
5
|
+
days?: number;
|
|
6
|
+
hours?: number;
|
|
7
|
+
minutes?: number;
|
|
8
|
+
seconds?: number;
|
|
9
|
+
};
|
|
10
|
+
export declare namespace Duration {
|
|
11
|
+
function parse(durationStr: string): Duration;
|
|
12
|
+
function serialize(duration: Duration): string;
|
|
13
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
var i;(t=>{const m=[{unit:"years",symbol:"Y"},{unit:"months",symbol:"M"},{unit:"weeks",symbol:"W"},{unit:"days",symbol:"D"},{unit:"hours",symbol:"H"},{unit:"minutes",symbol:"M"},{unit:"seconds",symbol:"S"}],l=/^P(?:(?<years>-?\d+)Y)?(?:(?<months>-?\d+)M)?(?:(?<weeks>-?\d+)W)?(?:(?<days>-?\d+)D)?(?:T(?:(?<hours>-?\d+)H)?(?:(?<minutes>-?\d+)M)?(?:(?<seconds>-?\d+)S)?)?$/;function c(s){if(!(s===""||s===void 0||s===null))return Number.parseInt(s,10)}function y(s){const n=l.exec(s);if(!n?.groups)throw new Error("Invalid duration");let r=!0;const u={};for(const{unit:o}of m)n.groups[o]&&(r=!1,u[o]=c(n.groups[o]));if(r)throw new Error("Invalid duration");return u}t.parse=y;const e=(s,n)=>{if(s)return s.toString()+n};function f(s){return!s.years&&!s.months&&!s.weeks&&!s.days&&!s.hours&&!s.minutes&&!s.seconds?"":["P",e(s.years,"Y"),e(s.months,"M"),e(s.weeks,"W"),e(s.days,"D"),(s.hours||s.minutes||s.seconds)&&"T",e(s.hours,"H"),e(s.minutes,"M"),e(s.seconds,"S")].filter(Boolean).join("")}t.serialize=f})(i||(i={}));export{i as Duration};
|
|
2
|
+
//# sourceMappingURL=duration.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"duration.js","sources":["../../lib/utilities/duration.ts"],"sourcesContent":["// Source: https://github.com/MelleB/tinyduration\n// Copyright 2020 MelleB\n// Licensed under the MIT License\n\nexport type Duration = {\n years?: number;\n months?: number;\n weeks?: number;\n days?: number;\n hours?: number;\n minutes?: number;\n seconds?: number;\n};\n\nexport namespace Duration {\n const units: Array<{ unit: keyof Duration; symbol: string }> = [\n { unit: 'years', symbol: 'Y' },\n { unit: 'months', symbol: 'M' },\n { unit: 'weeks', symbol: 'W' },\n { unit: 'days', symbol: 'D' },\n { unit: 'hours', symbol: 'H' },\n { unit: 'minutes', symbol: 'M' },\n { unit: 'seconds', symbol: 'S' },\n ];\n\n // ISO 8601 duration regex pattern (integers only)\n // Format: P[n]Y[n]M[n]W[n]DT[n]H[n]M[n]S\n // Example: P1Y2M3DT4H5M6S = 1 year, 2 months, 3 days, 4 hours, 5 minutes, 6 seconds\n const durationRegex =\n /^P(?:(?<years>-?\\d+)Y)?(?:(?<months>-?\\d+)M)?(?:(?<weeks>-?\\d+)W)?(?:(?<days>-?\\d+)D)?(?:T(?:(?<hours>-?\\d+)H)?(?:(?<minutes>-?\\d+)M)?(?:(?<seconds>-?\\d+)S)?)?$/;\n\n /**\n * Parses a numeric string into an integer.\n *\n * @param s - The string to parse\n * @returns The parsed integer, or undefined if the string is empty/null/undefined\n */\n function parseNum(s: string): number | undefined {\n if (s === '' || s === undefined || s === null) {\n return undefined;\n }\n\n return Number.parseInt(s, 10);\n }\n\n export function parse(durationStr: string): Duration {\n const match = durationRegex.exec(durationStr);\n if (!match?.groups) {\n throw new Error('Invalid duration');\n }\n\n let empty = true;\n\n const values: Duration = {};\n for (const { unit } of units) {\n if (match.groups[unit]) {\n empty = false;\n values[unit] = parseNum(match.groups[unit]);\n }\n }\n if (empty) {\n throw new Error('Invalid duration');\n }\n\n const duration: Duration = values;\n\n return duration;\n }\n\n /**\n * Converts a number to a duration component string.\n *\n * @param number - The integer value\n * @param component - The unit symbol (Y, M, W, D, H, M, S)\n * @returns The formatted component string, or undefined if number is falsy\n */\n const formatComponent = (number: number | undefined, component: string): string | undefined => {\n if (!number) {\n return undefined;\n }\n\n return number.toString() + component;\n };\n\n export function serialize(duration: Duration): string {\n if (\n !duration.years &&\n !duration.months &&\n !duration.weeks &&\n !duration.days &&\n !duration.hours &&\n !duration.minutes &&\n !duration.seconds\n ) {\n return '';\n }\n\n return [\n 'P',\n formatComponent(duration.years, 'Y'),\n formatComponent(duration.months, 'M'),\n formatComponent(duration.weeks, 'W'),\n formatComponent(duration.days, 'D'),\n (duration.hours || duration.minutes || duration.seconds) && 'T',\n formatComponent(duration.hours, 'H'),\n formatComponent(duration.minutes, 'M'),\n formatComponent(duration.seconds, 'S'),\n ]\n .filter(Boolean)\n .join('');\n }\n}\n"],"names":["Duration","units","durationRegex","parseNum","parse","durationStr","match","empty","values","unit","formatComponent","number","component","serialize","duration"],"mappings":"AAcO,IAAUA,GAAAA,GAAV,CACH,MAAMC,EAAyD,CAC3D,CAAE,KAAM,QAAS,OAAQ,GAAA,EACzB,CAAE,KAAM,SAAU,OAAQ,GAAA,EAC1B,CAAE,KAAM,QAAS,OAAQ,GAAA,EACzB,CAAE,KAAM,OAAQ,OAAQ,GAAA,EACxB,CAAE,KAAM,QAAS,OAAQ,GAAA,EACzB,CAAE,KAAM,UAAW,OAAQ,GAAA,EAC3B,CAAE,KAAM,UAAW,OAAQ,GAAA,CAAI,EAM7BC,EACF,mKAQJ,SAASC,EAAS,EAA+B,CAC7C,GAAI,MAAM,IAAM,IAAM,QAAa,IAAM,MAIzC,OAAO,OAAO,SAAS,EAAG,EAAE,CAChC,CAEO,SAASC,EAAMC,EAA+B,CACjD,MAAMC,EAAQJ,EAAc,KAAKG,CAAW,EAC5C,GAAI,CAACC,GAAO,OACR,MAAM,IAAI,MAAM,kBAAkB,EAGtC,IAAIC,EAAQ,GAEZ,MAAMC,EAAmB,CAAA,EACzB,SAAW,CAAE,KAAAC,CAAA,IAAUR,EACfK,EAAM,OAAOG,CAAI,IACjBF,EAAQ,GACRC,EAAOC,CAAI,EAAIN,EAASG,EAAM,OAAOG,CAAI,CAAC,GAGlD,GAAIF,EACA,MAAM,IAAI,MAAM,kBAAkB,EAKtC,OAF2BC,CAG/B,CAtBOR,EAAS,MAAAI,EA+BhB,MAAMM,EAAkB,CAACC,EAA4BC,IAA0C,CAC3F,GAAKD,EAIL,OAAOA,EAAO,WAAaC,CAC/B,EAEO,SAASC,EAAUC,EAA4B,CAClD,MACI,CAACA,EAAS,OACV,CAACA,EAAS,QACV,CAACA,EAAS,OACV,CAACA,EAAS,MACV,CAACA,EAAS,OACV,CAACA,EAAS,SACV,CAACA,EAAS,QAEH,GAGJ,CACH,IACAJ,EAAgBI,EAAS,MAAO,GAAG,EACnCJ,EAAgBI,EAAS,OAAQ,GAAG,EACpCJ,EAAgBI,EAAS,MAAO,GAAG,EACnCJ,EAAgBI,EAAS,KAAM,GAAG,GACjCA,EAAS,OAASA,EAAS,SAAWA,EAAS,UAAY,IAC5DJ,EAAgBI,EAAS,MAAO,GAAG,EACnCJ,EAAgBI,EAAS,QAAS,GAAG,EACrCJ,EAAgBI,EAAS,QAAS,GAAG,CAAA,EAEpC,OAAO,OAAO,EACd,KAAK,EAAE,CAChB,CA1BOd,EAAS,UAAAa,CAAA,GAtEHb,IAAAA,EAAA,CAAA,EAAA"}
|
|
@@ -10,3 +10,13 @@ export declare function formatNumber(num: number | bigint, options?: Intl.Number
|
|
|
10
10
|
* @returns A formatted string for the number of bytes
|
|
11
11
|
*/
|
|
12
12
|
export declare function formatFilesize(bytes: number): string;
|
|
13
|
+
/**
|
|
14
|
+
* Validates an ISO8601 duration string
|
|
15
|
+
* @param maxYears Maximum allowed years (default: 10)
|
|
16
|
+
* @returns A Zod validator that checks:
|
|
17
|
+
* - Duration format is valid (matches ISO8601 pattern)
|
|
18
|
+
* - Duration is not empty
|
|
19
|
+
* - At least one value (years, months, days, hours, minutes, or seconds) is non-zero
|
|
20
|
+
* - Total duration does not exceed maxYears
|
|
21
|
+
*/
|
|
22
|
+
export declare function getISO8601DurationValidator(maxYears?: number): z.ZodString;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import m from"zod";import{Duration as c}from"./duration.js";const d=2147483647,i=Math.floor(d/86400),l=-2147483648,_=Math.ceil(l/86400);function b(e,t){return m.number().min(e,{error:n=>{if(n.code==="too_small")return`The number must be at least ${o(e)}.`}}).max(t,{error:n=>{if(n.code==="too_big")return`The number must be at most ${o(t)}.`}})}const u=86400;function g(e){const t=e*u,n=i*u;return m.number().min(t,{error:`The number must be at least ${o(e)} days.`}).max(n,{error:`The number must be at most ${o(i)} days.`})}function o(e,t){return Intl.NumberFormat(navigator.language,t).format(e)}function N(e){return e<1024?`${e} B`:e<1024*1024?`${(e/1024).toFixed(1)} KB`:e<1024*1024*1024?`${(e/(1024*1024)).toFixed(2)} MB`:`${(e/(1024*1024*1024)).toFixed(2)} GB`}function y(e=10){const t=365*e,n=s=>{try{const r=c.parse(s);return{years:r.years??0,months:r.months??0,days:(r.days??0)+(r.weeks??0)*7,hours:r.hours??0,minutes:r.minutes??0,seconds:r.seconds??0}}catch{return{years:0,months:0,days:0,hours:0,minutes:0,seconds:0}}};return m.string().refine(s=>{const r=n(s);return Object.values(r).some(a=>a>0)},{message:"At least one value (years, months, days, hours, minutes, or seconds) must be non-zero"}).refine(s=>{const r=n(s),a=(r.hours*3600+r.minutes*60+r.seconds)/u;return r.years*365+r.months*30+r.days+a<=t},{message:`Subscription interval cannot exceed ${e} years`})}export{d as MAX_INT32,i as MAX_INT32_DAYS,l as MIN_INT32,_ as MIN_INT32_DAYS,N as formatFilesize,o as formatNumber,g as getDaysValidator,y as getISO8601DurationValidator,b as getNumberValidator};
|
|
2
2
|
//# sourceMappingURL=numbers.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"numbers.js","sources":["../../lib/utilities/numbers.ts"],"sourcesContent":["import z from 'zod';\n\nexport const MAX_INT32 = 2147483647;\nexport const MAX_INT32_DAYS = Math.floor(MAX_INT32 / 86400);\nexport const MIN_INT32 = -2147483648;\nexport const MIN_INT32_DAYS = Math.ceil(MIN_INT32 / 86400);\n\nexport function getNumberValidator(min: number, max: number) {\n return z\n .number()\n .min(min, {\n error: issue => {\n if (issue.code === 'too_small') return `The number must be at least ${formatNumber(min)}.`;\n },\n })\n .max(max, {\n error: issue => {\n if (issue.code === 'too_big') return `The number must be at most ${formatNumber(max)}.`;\n },\n });\n}\n\nexport function getDaysValidator(min: number) {\n const
|
|
1
|
+
{"version":3,"file":"numbers.js","sources":["../../lib/utilities/numbers.ts"],"sourcesContent":["import z from 'zod';\nimport { Duration } from './duration';\n\nexport const MAX_INT32 = 2147483647;\nexport const MAX_INT32_DAYS = Math.floor(MAX_INT32 / 86400);\nexport const MIN_INT32 = -2147483648;\nexport const MIN_INT32_DAYS = Math.ceil(MIN_INT32 / 86400);\n\nexport function getNumberValidator(min: number, max: number) {\n return z\n .number()\n .min(min, {\n error: issue => {\n if (issue.code === 'too_small') return `The number must be at least ${formatNumber(min)}.`;\n },\n })\n .max(max, {\n error: issue => {\n if (issue.code === 'too_big') return `The number must be at most ${formatNumber(max)}.`;\n },\n });\n}\n\nconst SECONDS_PER_DAY = 86400;\n\nexport function getDaysValidator(min: number) {\n const minSeconds = min * SECONDS_PER_DAY;\n const maxSeconds = MAX_INT32_DAYS * SECONDS_PER_DAY;\n\n return z\n .number()\n .min(minSeconds, {\n error: `The number must be at least ${formatNumber(min)} days.`,\n })\n .max(maxSeconds, {\n error: `The number must be at most ${formatNumber(MAX_INT32_DAYS)} days.`,\n });\n}\n\nexport function formatNumber(num: number | bigint, options?: Intl.NumberFormatOptions) {\n return Intl.NumberFormat(navigator.language, options).format(num);\n}\n\n/**\n * @returns A formatted string for the number of bytes\n */\nexport function formatFilesize(bytes: number): string {\n if (bytes < 1024) {\n return `${bytes} B`;\n } else if (bytes < 1024 * 1024) {\n return `${(bytes / 1024).toFixed(1)} KB`;\n } else if (bytes < 1024 * 1024 * 1024) {\n return `${(bytes / (1024 * 1024)).toFixed(2)} MB`;\n } else {\n return `${(bytes / (1024 * 1024 * 1024)).toFixed(2)} GB`;\n }\n}\n\n/**\n * Validates an ISO8601 duration string\n * @param maxYears Maximum allowed years (default: 10)\n * @returns A Zod validator that checks:\n * - Duration format is valid (matches ISO8601 pattern)\n * - Duration is not empty\n * - At least one value (years, months, days, hours, minutes, or seconds) is non-zero\n * - Total duration does not exceed maxYears\n */\nexport function getISO8601DurationValidator(maxYears: number = 10) {\n const MAX_DURATION_DAYS = 365 * maxYears;\n\n const getParts = (value: string) => {\n try {\n const parsed = Duration.parse(value);\n return {\n years: parsed.years ?? 0,\n months: parsed.months ?? 0,\n days: (parsed.days ?? 0) + (parsed.weeks ?? 0) * 7,\n hours: parsed.hours ?? 0,\n minutes: parsed.minutes ?? 0,\n seconds: parsed.seconds ?? 0,\n };\n } catch {\n return { years: 0, months: 0, days: 0, hours: 0, minutes: 0, seconds: 0 };\n }\n };\n\n return z\n .string()\n .refine(\n value => {\n const parts = getParts(value);\n return Object.values(parts).some(v => v > 0);\n },\n {\n message: 'At least one value (years, months, days, hours, minutes, or seconds) must be non-zero',\n }\n )\n .refine(\n value => {\n const parts = getParts(value);\n const timeInDays = (parts.hours * 3600 + parts.minutes * 60 + parts.seconds) / SECONDS_PER_DAY;\n return parts.years * 365 + parts.months * 30 + parts.days + timeInDays <= MAX_DURATION_DAYS;\n },\n {\n message: `Subscription interval cannot exceed ${maxYears} years`,\n }\n );\n}\n"],"names":["MAX_INT32","MAX_INT32_DAYS","MIN_INT32","MIN_INT32_DAYS","getNumberValidator","min","max","z","issue","formatNumber","SECONDS_PER_DAY","getDaysValidator","minSeconds","maxSeconds","num","options","formatFilesize","bytes","getISO8601DurationValidator","maxYears","MAX_DURATION_DAYS","getParts","value","parsed","Duration","parts","v","timeInDays"],"mappings":"4DAGO,MAAMA,EAAY,WACZC,EAAiB,KAAK,MAAMD,EAAY,KAAK,EAC7CE,EAAY,YACZC,EAAiB,KAAK,KAAKD,EAAY,KAAK,EAElD,SAASE,EAAmBC,EAAaC,EAAa,CACzD,OAAOC,EACF,SACA,IAAIF,EAAK,CACN,MAAOG,GAAS,CACZ,GAAIA,EAAM,OAAS,kBAAoB,+BAA+BC,EAAaJ,CAAG,CAAC,GAC3F,CAAA,CACH,EACA,IAAIC,EAAK,CACN,MAAOE,GAAS,CACZ,GAAIA,EAAM,OAAS,gBAAkB,8BAA8BC,EAAaH,CAAG,CAAC,GACxF,CAAA,CACH,CACT,CAEA,MAAMI,EAAkB,MAEjB,SAASC,EAAiBN,EAAa,CAC1C,MAAMO,EAAaP,EAAMK,EACnBG,EAAaZ,EAAiBS,EAEpC,OAAOH,EACF,SACA,IAAIK,EAAY,CACb,MAAO,+BAA+BH,EAAaJ,CAAG,CAAC,QAAA,CAC1D,EACA,IAAIQ,EAAY,CACb,MAAO,8BAA8BJ,EAAaR,CAAc,CAAC,QAAA,CACpE,CACT,CAEO,SAASQ,EAAaK,EAAsBC,EAAoC,CACnF,OAAO,KAAK,aAAa,UAAU,SAAUA,CAAO,EAAE,OAAOD,CAAG,CACpE,CAKO,SAASE,EAAeC,EAAuB,CAClD,OAAIA,EAAQ,KACD,GAAGA,CAAK,KACRA,EAAQ,KAAO,KACf,IAAIA,EAAQ,MAAM,QAAQ,CAAC,CAAC,MAC5BA,EAAQ,KAAO,KAAO,KACtB,IAAIA,GAAS,KAAO,OAAO,QAAQ,CAAC,CAAC,MAErC,IAAIA,GAAS,KAAO,KAAO,OAAO,QAAQ,CAAC,CAAC,KAE3D,CAWO,SAASC,EAA4BC,EAAmB,GAAI,CAC/D,MAAMC,EAAoB,IAAMD,EAE1BE,EAAYC,GAAkB,CAChC,GAAI,CACA,MAAMC,EAASC,EAAS,MAAMF,CAAK,EACnC,MAAO,CACH,MAAOC,EAAO,OAAS,EACvB,OAAQA,EAAO,QAAU,EACzB,MAAOA,EAAO,MAAQ,IAAMA,EAAO,OAAS,GAAK,EACjD,MAAOA,EAAO,OAAS,EACvB,QAASA,EAAO,SAAW,EAC3B,QAASA,EAAO,SAAW,CAAA,CAEnC,MAAQ,CACJ,MAAO,CAAE,MAAO,EAAG,OAAQ,EAAG,KAAM,EAAG,MAAO,EAAG,QAAS,EAAG,QAAS,CAAA,CAC1E,CACJ,EAEA,OAAOhB,EACF,SACA,OACGe,GAAS,CACL,MAAMG,EAAQJ,EAASC,CAAK,EAC5B,OAAO,OAAO,OAAOG,CAAK,EAAE,KAAKC,GAAKA,EAAI,CAAC,CAC/C,EACA,CACI,QAAS,uFAAA,CACb,EAEH,OACGJ,GAAS,CACL,MAAMG,EAAQJ,EAASC,CAAK,EACtBK,GAAcF,EAAM,MAAQ,KAAOA,EAAM,QAAU,GAAKA,EAAM,SAAWf,EAC/E,OAAOe,EAAM,MAAQ,IAAMA,EAAM,OAAS,GAAKA,EAAM,KAAOE,GAAcP,CAC9E,EACA,CACI,QAAS,uCAAuCD,CAAQ,QAAA,CAC5D,CAEZ"}
|