@customafk/lunas-ui 0.1.34 → 0.1.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (147) hide show
  1. package/dist/{button-BuTbkOqT.d.cts → button-C1NxqtXe.d.cts} +5 -5
  2. package/dist/{button-H4uEco0y.d.mts → button-D7m4SbQP.d.mts} +3 -3
  3. package/dist/cards/simple-card.d.mts +2 -2
  4. package/dist/data-display/empty.d.cts +2 -2
  5. package/dist/data-display/statistic.d.cts +4 -4
  6. package/dist/data-display/statistic.d.mts +2 -2
  7. package/dist/{dialog-CqTdN6-d.d.cts → dialog-D9LozFvr.d.cts} +12 -12
  8. package/dist/{dialog-CpJDH_nq.d.mts → dialog-DoDTTl_J.d.mts} +12 -12
  9. package/dist/dialogs/detail-dialog/component/sidebar.d.cts +30 -30
  10. package/dist/dialogs/detail-dialog/component/sidebar.d.mts +28 -28
  11. package/dist/features/search-modal/index.d.cts +2 -2
  12. package/dist/features/search-modal/index.d.mts +2 -2
  13. package/dist/features/tables/index.cjs +1 -1
  14. package/dist/features/tables/index.cjs.map +1 -1
  15. package/dist/features/tables/index.d.cts +1 -1
  16. package/dist/features/tables/index.d.mts +1 -1
  17. package/dist/features/tables/index.mjs +1 -1
  18. package/dist/features/tables/index.mjs.map +1 -1
  19. package/dist/features/tanstack-form/index.d.cts +120 -120
  20. package/dist/features/tanstack-form/index.d.mts +120 -120
  21. package/dist/{input-CadYIbZI.d.mts → input-Be9xPQAh.d.mts} +4 -4
  22. package/dist/{input-5f_IZuwv.d.cts → input-ChyVmhW2.d.cts} +6 -6
  23. package/dist/layouts/app-layout/index.d.cts +28 -28
  24. package/dist/layouts/app-layout/index.d.mts +3 -3
  25. package/dist/layouts/flex.d.cts +7 -7
  26. package/dist/layouts/flex.d.mts +3 -3
  27. package/dist/layouts/service-layout/index.d.cts +13 -13
  28. package/dist/layouts/service-layout/index.d.mts +13 -13
  29. package/dist/pages/FeatureDeveloping.d.cts +2 -2
  30. package/dist/pages/FeatureDeveloping.d.mts +2 -2
  31. package/dist/pages/FeatureFixing.d.cts +2 -2
  32. package/dist/pages/FeatureFixing.d.mts +2 -2
  33. package/dist/pages/NotAuthorized.d.cts +2 -2
  34. package/dist/pages/NotAuthorized.d.mts +2 -2
  35. package/dist/pages/NotFound.d.cts +2 -2
  36. package/dist/pages/NotFound.d.mts +2 -2
  37. package/dist/{separator-D9m7b_32.d.mts → separator-BjY6jrIo.d.mts} +3 -3
  38. package/dist/{separator-W4ljzp7R.d.cts → separator-C8zGLIls.d.cts} +3 -3
  39. package/dist/{tooltip-B5gO2RGs.d.cts → tooltip-CR0FgBci.d.mts} +6 -6
  40. package/dist/{tooltip-CYZK5Ai7.d.mts → tooltip-SUkqrLQd.d.cts} +6 -6
  41. package/dist/typography/paragraph.d.cts +2 -2
  42. package/dist/typography/paragraph.d.mts +2 -2
  43. package/dist/typography/title.d.cts +2 -2
  44. package/dist/typography/title.d.mts +2 -2
  45. package/dist/ui/alert-dialog.d.cts +12 -12
  46. package/dist/ui/alert-dialog.d.mts +12 -12
  47. package/dist/ui/alert.d.cts +6 -6
  48. package/dist/ui/alert.d.mts +4 -4
  49. package/dist/ui/aspect-ratio.d.cts +2 -2
  50. package/dist/ui/aspect-ratio.d.mts +2 -2
  51. package/dist/ui/avatar.d.cts +4 -4
  52. package/dist/ui/avatar.d.mts +4 -4
  53. package/dist/ui/badge.d.cts +4 -4
  54. package/dist/ui/badge.d.mts +4 -4
  55. package/dist/ui/breadcrumb.d.cts +8 -8
  56. package/dist/ui/breadcrumb.d.mts +8 -8
  57. package/dist/ui/button-group.d.cts +8 -8
  58. package/dist/ui/button-group.d.mts +8 -8
  59. package/dist/ui/button.d.cts +1 -1
  60. package/dist/ui/button.d.mts +1 -1
  61. package/dist/ui/calendar.d.cts +4 -4
  62. package/dist/ui/calendar.d.mts +4 -4
  63. package/dist/ui/card.d.cts +8 -8
  64. package/dist/ui/card.d.mts +8 -8
  65. package/dist/ui/carousel.d.cts +7 -7
  66. package/dist/ui/carousel.d.mts +7 -7
  67. package/dist/ui/collapsible.d.cts +4 -4
  68. package/dist/ui/collapsible.d.mts +4 -4
  69. package/dist/ui/command.d.cts +11 -11
  70. package/dist/ui/command.d.mts +11 -11
  71. package/dist/ui/context-menu.d.cts +16 -16
  72. package/dist/ui/context-menu.d.mts +16 -16
  73. package/dist/ui/dialog.d.cts +1 -1
  74. package/dist/ui/dialog.d.mts +1 -1
  75. package/dist/ui/drawer.d.cts +11 -11
  76. package/dist/ui/drawer.d.mts +11 -11
  77. package/dist/ui/dropdown-menu.d.cts +16 -16
  78. package/dist/ui/dropdown-menu.d.mts +16 -16
  79. package/dist/ui/empty.d.cts +9 -9
  80. package/dist/ui/empty.d.mts +9 -9
  81. package/dist/ui/field.d.cts +25 -25
  82. package/dist/ui/field.d.mts +25 -25
  83. package/dist/ui/file-uploader.d.cts +2 -2
  84. package/dist/ui/file-uploader.d.mts +2 -2
  85. package/dist/ui/form.d.cts +11 -11
  86. package/dist/ui/form.d.mts +7 -7
  87. package/dist/ui/hover-card.d.cts +4 -4
  88. package/dist/ui/hover-card.d.mts +4 -4
  89. package/dist/ui/input-otp.d.cts +5 -5
  90. package/dist/ui/input-otp.d.mts +5 -5
  91. package/dist/ui/input.d.cts +1 -1
  92. package/dist/ui/input.d.mts +1 -1
  93. package/dist/ui/inputs/search-input.d.cts +3 -3
  94. package/dist/ui/inputs/search-input.d.mts +3 -3
  95. package/dist/ui/item.d.cts +15 -15
  96. package/dist/ui/item.d.mts +12 -12
  97. package/dist/ui/label.d.cts +2 -2
  98. package/dist/ui/label.d.mts +2 -2
  99. package/dist/ui/menubar.d.cts +17 -17
  100. package/dist/ui/menubar.d.mts +17 -17
  101. package/dist/ui/multi-select.d.cts +2 -2
  102. package/dist/ui/multi-select.d.mts +3 -3
  103. package/dist/ui/navigation-menu.d.cts +11 -11
  104. package/dist/ui/navigation-menu.d.mts +11 -11
  105. package/dist/ui/pagination.d.cts +9 -9
  106. package/dist/ui/pagination.d.mts +9 -9
  107. package/dist/ui/popover.d.cts +5 -5
  108. package/dist/ui/popover.d.mts +5 -5
  109. package/dist/ui/progress.d.cts +2 -2
  110. package/dist/ui/progress.d.mts +2 -2
  111. package/dist/ui/radio-group.d.cts +3 -3
  112. package/dist/ui/radio-group.d.mts +3 -3
  113. package/dist/ui/resizable.d.cts +4 -4
  114. package/dist/ui/resizable.d.mts +4 -4
  115. package/dist/ui/scroll-area.d.cts +6 -6
  116. package/dist/ui/scroll-area.d.mts +6 -6
  117. package/dist/ui/select.d.cts +11 -11
  118. package/dist/ui/select.d.mts +11 -11
  119. package/dist/ui/separator.d.cts +1 -1
  120. package/dist/ui/separator.d.mts +1 -1
  121. package/dist/ui/sheet.d.cts +9 -9
  122. package/dist/ui/sheet.d.mts +9 -9
  123. package/dist/ui/sidebar.d.cts +30 -30
  124. package/dist/ui/sidebar.d.mts +30 -30
  125. package/dist/ui/skeleton.d.cts +2 -2
  126. package/dist/ui/skeleton.d.mts +2 -2
  127. package/dist/ui/slider.d.cts +2 -2
  128. package/dist/ui/slider.d.mts +2 -2
  129. package/dist/ui/sonner.d.cts +2 -2
  130. package/dist/ui/sonner.d.mts +2 -2
  131. package/dist/ui/spinner.d.cts +2 -2
  132. package/dist/ui/spinner.d.mts +2 -2
  133. package/dist/ui/switch.d.cts +2 -2
  134. package/dist/ui/switch.d.mts +2 -2
  135. package/dist/ui/table.d.cts +18 -18
  136. package/dist/ui/table.d.mts +9 -9
  137. package/dist/ui/tabs.d.cts +5 -5
  138. package/dist/ui/tabs.d.mts +5 -5
  139. package/dist/ui/textarea.d.cts +2 -2
  140. package/dist/ui/textarea.d.mts +2 -2
  141. package/dist/ui/toggle-group.d.cts +3 -3
  142. package/dist/ui/toggle-group.d.mts +3 -3
  143. package/dist/ui/toggle.d.cts +4 -4
  144. package/dist/ui/toggle.d.mts +4 -4
  145. package/dist/ui/tooltip.d.cts +1 -1
  146. package/dist/ui/tooltip.d.mts +1 -1
  147. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":["UITableDateDisplay: React.FC<Props>","Tooltip","UITableNameDisplay: React.FC<NameDisplayProps>","Tooltip","UITablePhoneNumberDisplay: React.FC<React.PropsWithChildren<{ value: string }>>","Tooltip","options: Intl.NumberFormatOptions","UITableUserDataDisplay: React.FC<Props>","Avatar","Checkbox","CheckboxPrimitive","UITableWrapper: React.FC<React.PropsWithChildren<React.ComponentProps<'div'>>>","UITableHeader: React.FC<React.PropsWithChildren>","UITableHeaderRow: React.FC<React.PropsWithChildren>","UITableHeaderCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'th'> & {\n header: Header<unknown, unknown>;\n isPinned: ColumnPinningPosition;\n isResizing: boolean;\n isAllRowsSelected: boolean;\n }\n >\n>","Checkbox","UITableHeaderCellOption: React.FC<{\n isPinned: ColumnPinningPosition;\n className?: string;\n isVisible?: boolean;\n onLeftPin: (pos: 'left' | 'right' | false) => void;\n onRightPin: (pos: 'left' | 'right' | false) => void;\n onUnpin: (pos: 'left' | 'right' | false) => void;\n onToggleVisibilityHandler: (visible: AnyEntity) => void;\n}>","DropdownMenu","UITableBody: React.FC<React.PropsWithChildren<React.ComponentProps<'tbody'> & { height: number }>>","UITableRow: React.FC<\n React.ComponentProps<'tr'> & {\n row: Row<unknown>;\n virtualRow: VirtualItem;\n rowVirtualizer: Virtualizer<HTMLDivElement, HTMLTableRowElement>;\n }\n>","UITableCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'td'> & {\n cell: Cell<unknown, unknown>;\n }\n >\n>","EmptyDisplay: React.FC","UITableFooter: React.FC<React.PropsWithChildren>","UITableContainer: React.FC<React.PropsWithChildren>","colSizes: { [key: string]: number | undefined }","ColumnVisibility: React.FC<{\n checked: boolean;\n title: string;\n onCheckedChange?: (checked: boolean) => void;\n}>","Checkbox","Separator","INITIAL_STATE: InitialTableState","rows","UITableTooltipFilter: React.FC<React.ComponentProps<typeof Input>>","ActionButton: React.FC<React.PropsWithChildren>","UITableTooltipActions: React.FC","UITableTooltip: React.FC<React.PropsWithChildren>"],"sources":["../../../packages/components/features/tables/components/atoms/date-display.tsx","../../../packages/components/features/tables/components/atoms/name-display.tsx","../../../packages/components/features/tables/components/atoms/phone-number.tsx","../../../packages/components/features/tables/components/atoms/statistic.tsx","../../../packages/components/features/tables/components/atoms/user.tsx","../../../packages/components/ui/checkbox.tsx","../../../packages/components/features/tables/hooks/use-table-context.ts","../../../packages/components/features/tables/hooks/use-table-rows-context.ts","../../../packages/components/features/tables/components/table.tsx","../../../packages/components/features/tables/components/table/filter.tsx","../../../packages/components/features/tables/components/table/provider.tsx","../../../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["import { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from '@/components/data-display/date';\n\ntype Props = {\n date: Date | string | number;\n};\nexport const UITableDateDisplay: React.FC<Props> = ({ date }) => {\n return (\n <TooltipProvider>\n <Tooltip>\n <TooltipTrigger asChild>\n <Badge className=\"h-fit\">\n <DateDisplay date={date} format=\"medium\" className=\"font-normal text-white\" />\n </Badge>\n </TooltipTrigger>\n <TooltipContent>\n <DateDisplay date={date} format=\"full\" showTime className=\"font-[Inter]! font-medium text-xs\" />\n </TooltipContent>\n </Tooltip>\n </TooltipProvider>\n );\n};\n","import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { Paragraph } from '@/components/typography/paragraph';\n\ntype NameDisplayProps = {\n name: string;\n};\n\nexport const UITableNameDisplay: React.FC<NameDisplayProps> = ({ name }) => {\n return (\n <Tooltip>\n <TooltipTrigger>\n <Paragraph variant=\"sm\" className=\"line-clamp-2 w-full truncate text-wrap pb-px text-start\">\n {name}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\" className=\"max-w-80 whitespace-pre-line text-wrap break-keep\">\n {name}\n </TooltipContent>\n </Tooltip>\n );\n};\n","import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nexport const UITablePhoneNumberDisplay: React.FC<React.PropsWithChildren<{ value: string }>> = ({ value }) => {\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <p className=\"font-number text-secondary-foreground text-sm tabular-nums\">{value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}</p>\n </TooltipTrigger>\n <TooltipContent align=\"start\">\n <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n </TooltipContent>\n </Tooltip>\n );\n};\n","import { memo, useCallback, useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Flex } from '@/components/layouts/flex';\n\ntype Props = {\n decimalSeparator?: string;\n groupSeparator?: string;\n prefix?: React.ReactNode;\n suffix?: React.ReactNode;\n precision?: number; // Số chữ số thập phân\n roundingMode?: 'round' | 'floor' | 'ceil'; // Kiểu làm tròn\n showTrailingZeros?: boolean; // Hiển thị số 0 cuối\n size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'; // Kích thước của component\n value: number | string;\n};\nexport const UITableStatisticDisplay = memo(\n ({\n decimalSeparator = '.',\n groupSeparator = ',',\n prefix: Prefix,\n suffix: Suffix,\n precision,\n roundingMode = 'round',\n showTrailingZeros = false,\n size = 'lg',\n value,\n }: Props) => {\n // Memoize rounding function\n const applyRounding = useCallback(\n (num: number, precisionValue: number): number => {\n const multiplier = 10 ** precisionValue;\n\n switch (roundingMode) {\n case 'floor':\n return Math.floor(num * multiplier) / multiplier;\n case 'ceil':\n return Math.ceil(num * multiplier) / multiplier;\n default:\n return Math.round(num * multiplier) / multiplier;\n }\n },\n [roundingMode]\n );\n\n // Memoize number formatting options\n const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n const options: Intl.NumberFormatOptions = {};\n\n if (typeof precision === 'number' && precision >= 0) {\n if (showTrailingZeros) {\n options.minimumFractionDigits = precision;\n options.maximumFractionDigits = precision;\n } else {\n options.maximumFractionDigits = precision;\n }\n }\n\n return options;\n }, [precision, showTrailingZeros]);\n\n const formatNumber = useCallback(\n (num: number): string => {\n let processedNum = num;\n\n // Áp dụng làm tròn nếu có precision\n if (typeof precision === 'number' && precision >= 0) {\n processedNum = applyRounding(num, precision);\n }\n\n return processedNum.toLocaleString('en-US', formatOptions);\n },\n [applyRounding, formatOptions, precision]\n );\n\n // Memoize value processing\n const processedValue = useMemo((): string => {\n // Xử lý giá trị number\n if (typeof value === 'number') {\n if (Number.isNaN(value) || !Number.isFinite(value)) {\n return 'N/A';\n }\n return formatNumber(value);\n }\n\n // Xử lý giá trị string\n if (typeof value === 'string') {\n const trimmedValue = value.trim();\n\n // Nếu là chuỗi rỗng\n if (!trimmedValue) {\n return 'N/A';\n }\n\n // Thử convert sang number\n const numValue = Number(trimmedValue);\n\n if (Number.isNaN(numValue) || !Number.isFinite(numValue)) {\n // Nếu không phải số, trả về string gốc\n return 'N/A';\n }\n\n return formatNumber(numValue);\n }\n\n return 'N/A';\n }, [value, formatNumber]);\n\n // Memoize separator replacement\n const finalFormattedValue = useMemo((): string => {\n // Chỉ thay thế separators nếu khác mặc định\n if (decimalSeparator === '.' && groupSeparator === ',') {\n return processedValue;\n }\n return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n }, [processedValue, decimalSeparator, groupSeparator]);\n\n return (\n <Flex\n padding=\"none\"\n className={cn(\n 'font-number text-lg text-secondary-foreground tabular-nums',\n size === 'xs' && 'text-xs',\n size === 'sm' && 'text-sm',\n size === 'md' && 'text-base',\n size === 'lg' && 'text-lg',\n size === 'xl' && 'text-xl'\n )}\n >\n {Prefix}\n <p>{finalFormattedValue}</p>\n {Suffix}\n </Flex>\n );\n }\n);\nUITableStatisticDisplay.displayName = 'UITableStatisticDisplay';\n","import { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Avatar, AvatarFallback } from '@/components/ui/avatar';\n\nimport { Flex } from '@/components/layouts/flex';\nimport { Paragraph } from '@/components/typography/paragraph';\n\ntype Props = {\n uuid: string;\n username: string;\n email: string;\n};\n\nexport const UITableUserDataDisplay: React.FC<Props> = ({ uuid, username, email }) => {\n return (\n <Flex wrap={false} gap=\"sm\" padding=\"none\">\n <Avatar className=\"size-10 shadow-card\">\n <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n <UserRoundIcon size={28} className=\"text-white\" />\n </AvatarFallback>\n </Avatar>\n <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n <Paragraph className=\"font-medium text-sm text-text-positive\">{username}</Paragraph>\n <Paragraph variant=\"sm\" className=\"mt-0! text-text-positive-weak text-xs\">\n {email}\n </Paragraph>\n </Flex>\n </Flex>\n );\n};\n","'use client';\n\nimport { CheckIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Checkbox as CheckboxPrimitive } from 'radix-ui';\n\nfunction Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>) {\n return (\n <CheckboxPrimitive.Root\n data-slot=\"checkbox\"\n className={cn(\n 'peer border-border',\n 'size-4 shrink-0 cursor-pointer rounded border shadow-xs outline-none transition-shadow',\n 'data-[state=checked]:bg-primary',\n 'data-[state=checked]:text-text-negative-strong',\n 'data-[state=checked]:border-primary',\n 'focus-visible:border-primary-strong',\n 'focus-visible:ring-primary-weak',\n 'focus-visible:ring-3',\n 'aria-invalid:ring-danger-weak',\n 'aria-invalid:border-danger',\n 'disabled:cursor-not-allowed disabled:opacity-50',\n className\n )}\n {...props}\n >\n <CheckboxPrimitive.Indicator data-slot=\"checkbox-indicator\" className=\"flex items-center justify-center text-current transition-none\">\n <CheckIcon size={14} />\n </CheckboxPrimitive.Indicator>\n </CheckboxPrimitive.Root>\n );\n}\n\nexport { Checkbox };\n","import { createContext, use } from 'react';\n\nimport type { RowData } from '@tanstack/react-table';\n\nimport type { TTableContext } from '../types';\n\nexport const TableContext = createContext<TTableContext<RowData> | null>(null);\n\nexport const useUITableContext = <TData extends RowData>() => {\n const context = use(TableContext) as TTableContext<TData>;\n if (!context) {\n throw new Error('useTableContext must be used within a TableProvider');\n }\n return context;\n};\n","import { createContext, use } from 'react';\n\nimport type { Row, RowData } from '@tanstack/react-table';\n\nexport type TTableRowsContext<TData extends RowData> = {\n rowsLength: number;\n rows: Row<TData>[];\n};\n\nexport const TableRowsContext = createContext<TTableRowsContext<RowData> | null>(null);\nexport const useUITableRowsContext = <TData extends RowData>() => {\n const ctx = use(TableRowsContext) as TTableRowsContext<TData>;\n if (!ctx) {\n throw new Error('useTableRowContext must be used within a TableRowProvider');\n }\n return ctx;\n};\n","'use client';\nimport { Activity, memo, useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport { type Cell, type Column, type ColumnPinningPosition, flexRender, type Header, type Row } from '@tanstack/react-table';\nimport { useVirtualizer, type VirtualItem, type Virtualizer } from '@tanstack/react-virtual';\n\nimport { BoxIcon, EllipsisVerticalIcon, EyeOffIcon, MoveLeftIcon, MoveRightIcon, PinOffIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Checkbox } from '@/components/ui/checkbox';\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuTrigger,\n} from '@/components/ui/dropdown-menu';\nimport { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '@/components/ui/resizable';\n\nimport type { AnyEntity } from '@/types';\nimport { useUITableContext } from '../hooks/use-table-context';\nimport { useUITableRowsContext } from '../hooks/use-table-rows-context';\n\nconst SELECT_WIDTH = 60;\nconst TABLE_HEADER_Z_INDEX = 20;\nconst PINNED_COLUMN_Z_INDEX = 20;\n\n//These are the important styles to make sticky column pinning work!\n//Apply styles like this using your CSS strategy of choice with this kind of logic to head cells, data cells, footer cells, etc.\n//View the index.css file for more needed styles such as border-collapse: separate\nconst getCommonPinningStyles = (column: Column<unknown>): React.CSSProperties => {\n const isPinned = column.getIsPinned();\n return {\n zIndex: isPinned ? PINNED_COLUMN_Z_INDEX : undefined,\n left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined,\n right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined,\n position: isPinned ? 'sticky' : 'relative',\n };\n};\n\nexport const UITableWrapper: React.FC<React.PropsWithChildren<React.ComponentProps<'div'>>> = ({ className, children, ...props }) => {\n return (\n <div data-slot=\"table-wrapper\" className=\"relative m-0 flex size-full flex-col flex-nowrap items-start justify-start gap-2 py-2.5 text-sm\" {...props}>\n {children}\n </div>\n );\n};\n\nconst UITableHeader: React.FC<React.PropsWithChildren> = memo(({ children }) => {\n return (\n <thead\n data-slot=\"table-header\"\n style={{ zIndex: TABLE_HEADER_Z_INDEX }}\n className={cn(\n 'sticky top-0 grid bg-muted-bg-subtle text-sm text-text-positive',\n '[&_tr:not(:last-child)_td]:border-b',\n '[&_th]:flex',\n '[&_th]:h-10',\n '[&_th]:select-none',\n '[&_th]:items-center',\n '[&_th]:whitespace-nowrap',\n '[&_th]:border-border',\n '[&_th]:font-normal',\n '[&_th]:border-r',\n '[&_th]:border-b-border',\n '[&_th]:text-left',\n '[&_th]:align-middle',\n '[&_th]:last:border-r-0',\n '[&_th]:first:border-l-0',\n '[&_th]:data-[pinned=right]:border-l',\n '[&_th]:data-[pinned=right]:border-r-0',\n '[&_th]:data-[pinned=left]:border-r',\n '[&_tr_th:not([data-pinned=false])]:bg-muted-bg-subtle'\n )}\n >\n {children}\n </thead>\n );\n});\nUITableHeader.displayName = 'TableHeader';\n\nconst UITableHeaderRow: React.FC<React.PropsWithChildren> = memo(({ children }) => {\n return (\n <tr data-slot=\"table-header-row\" className=\"flex w-full border-border border-b shadow\">\n {children}\n </tr>\n );\n});\nUITableHeaderRow.displayName = 'TableHeaderRow';\n\nconst UITableHeaderCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'th'> & {\n header: Header<unknown, unknown>;\n isPinned: ColumnPinningPosition;\n isResizing: boolean;\n isAllRowsSelected: boolean;\n }\n >\n> = ({ header, isPinned, isResizing, isAllRowsSelected, children, ...props }) => {\n const style = getCommonPinningStyles(header.column);\n const width = `calc(var(--header-${header.id}-size) * 1px)`;\n\n if (header.id === 'select') {\n return (\n <th data-slot=\"table-header-cell\" style={{ ...style, width: SELECT_WIDTH }} className=\"relative\" {...props}>\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <Checkbox\n aria-label=\"Select All Rows\"\n checked={isAllRowsSelected}\n onCheckedChange={value => {\n header.getContext().table.toggleAllRowsSelected(!!value);\n }}\n />\n </div>\n </th>\n );\n }\n return (\n <th data-slot=\"table-header-cell\" data-pinned={isPinned} style={{ ...style, width }} colSpan={header.colSpan} className={cn('group relative')} {...props}>\n <div className=\"absolute inset-0 gap-1 truncate\">\n <div className=\"flex h-full flex-1 cursor-pointer select-none items-center justify-between\">\n <div className=\"flex size-full flex-1 items-center truncate pl-4\">{flexRender(header.column.columnDef.header, header.getContext())}</div>\n </div>\n </div>\n {!['select', 'actions'].includes(header.id) && (\n <UITableHeaderCellOption\n isPinned={isPinned}\n isVisible={header.column.getIsVisible()}\n className=\"invisible absolute right-2 z-10 group-hover:visible\"\n onLeftPin={header.column.pin}\n onRightPin={header.column.pin}\n onUnpin={header.column.pin}\n onToggleVisibilityHandler={header.column.toggleVisibility}\n />\n )}\n <Activity mode={isPinned ? 'hidden' : 'visible'}>\n <div\n onDoubleClick={header.column.resetSize}\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n className={cn('absolute inset-y-0 -right-0.5 w-1 cursor-e-resize bg-transparent hover:bg-border', isResizing && 'bg-border')}\n />\n </Activity>\n </th>\n );\n};\n\nconst UITableHeaderCellOption: React.FC<{\n isPinned: ColumnPinningPosition;\n className?: string;\n isVisible?: boolean;\n onLeftPin: (pos: 'left' | 'right' | false) => void;\n onRightPin: (pos: 'left' | 'right' | false) => void;\n onUnpin: (pos: 'left' | 'right' | false) => void;\n onToggleVisibilityHandler: (visible: AnyEntity) => void;\n}> = ({ isPinned, className, onLeftPin, onRightPin, onUnpin, onToggleVisibilityHandler }) => {\n const handleLeftPin = useCallback(() => {\n onLeftPin('left');\n }, [onLeftPin]);\n\n const handleRightPin = useCallback(() => {\n onRightPin('right');\n }, [onRightPin]);\n\n const handleUnpin = useCallback(() => {\n onUnpin(false);\n }, [onUnpin]);\n return (\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <button\n className={cn('cursor-pointer rounded-full p-0.5 text-text-positive-weak hover:bg-muted-muted hover:text-text-positive [&>svg]:size-4', className)}\n >\n <EllipsisVerticalIcon />\n </button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\" className=\"w-64 p-4\">\n <DropdownMenuGroup className=\"*:data-[slot=dropdown-menu-item]:rounded-xs *:data-[slot=dropdown-menu-item]:p-2\">\n <Activity mode={isPinned ? 'visible' : 'hidden'}>\n <DropdownMenuItem onClick={handleUnpin}>\n {!!isPinned && 'Unpin'}\n <DropdownMenuShortcut>\n <PinOffIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n </Activity>\n <Activity mode={!isPinned ? 'visible' : 'hidden'}>\n <DropdownMenuItem onClick={handleLeftPin}>\n {isPinned ? 'Unpin' : 'Pin to Left'}\n <DropdownMenuShortcut>\n <MoveLeftIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n <DropdownMenuItem onClick={handleRightPin}>\n {isPinned ? 'Unpin' : 'Pin to Right'}\n <DropdownMenuShortcut>\n <MoveRightIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n </Activity>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup className=\"*:data-[slot=dropdown-menu-item]:rounded-xs *:data-[slot=dropdown-menu-item]:p-2\">\n <DropdownMenuItem onClick={() => onToggleVisibilityHandler(false)}>\n Hide Field\n <DropdownMenuShortcut>\n <EyeOffIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n </DropdownMenuGroup>\n </DropdownMenuContent>\n </DropdownMenu>\n );\n};\n\nconst UITableBody: React.FC<React.PropsWithChildren<React.ComponentProps<'tbody'> & { height: number }>> = ({ height, children, ...props }) => {\n return (\n <tbody\n data-slot=\"table-body\"\n style={{ height: `${height}px` }}\n className={cn(\n 'relative grid w-full',\n '[&_tr]:absolute [&_tr]:flex [&_tr]:w-full [&_tr]:cursor-pointer [&_tr]:border-b [&_tr]:border-b-border [&_tr]:focus:outline-none',\n '[&_td]:z-10',\n '[&_td]:flex',\n '[&_td]:overflow-hidden',\n '[&_td]:whitespace-nowrap',\n '[&_td]:px-4',\n '[&_td]:py-2.5',\n '[&_td]:align-middle',\n '[&_td]:border-border',\n '[&_td]:data-[pinned=right]:border-l',\n '[&_td]:data-[pinned=left]:border-r',\n '[&_td:not([data-pinned=false])]:bg-card',\n '[&_td:not([data-pinned=false])]:shadow-xs'\n )}\n {...props}\n >\n {children}\n </tbody>\n );\n};\n\nconst UITableRow: React.FC<\n React.ComponentProps<'tr'> & {\n row: Row<unknown>;\n virtualRow: VirtualItem;\n rowVirtualizer: Virtualizer<HTMLDivElement, HTMLTableRowElement>;\n }\n> = memo(({ children, row, virtualRow, rowVirtualizer, className, ...props }) => {\n const { columnPinning: _ } = useUITableContext();\n return (\n <tr\n data-slot=\"table-row\"\n data-index={virtualRow.index}\n ref={node => rowVirtualizer.measureElement(node)}\n style={{\n transform: `translateY(${virtualRow.start}px)`,\n }}\n className={cn('group', className)}\n {...props}\n >\n {row.getVisibleCells().map(cell => {\n return <UITableCell key={cell.id} cell={cell} className=\"group-hover:bg-muted-bg-subtle!\" />;\n })}\n </tr>\n );\n});\nUITableRow.displayName = 'TableRow';\n\nconst UITableCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'td'> & {\n cell: Cell<unknown, unknown>;\n }\n >\n> = memo(({ cell, children, className, ...props }) => {\n const { rowSelection: _ } = useUITableContext();\n const isPinned = cell.column.getIsPinned();\n const style = getCommonPinningStyles(cell.column);\n const width = `calc(var(--col-${cell.column.id}-size) * 1px)`;\n if (isPinned) {\n console.log('Pinned Cell Rendered:', cell.column.getPinnedIndex());\n }\n\n if (cell.column.id === 'select') {\n return (\n <td data-slot=\"table-cell\" style={{ ...style, width: SELECT_WIDTH }} className={cn('border-none! bg-transparent! shadow-none!', className)} {...props}>\n <div className=\"absolute inset-0 flex items-center justify-center bg-transparent\">\n <Checkbox\n aria-label=\"Select Row\"\n checked={cell.row.getIsSelected()}\n onCheckedChange={value => {\n cell.row.toggleSelected(!!value);\n }}\n />\n </div>\n </td>\n );\n }\n\n return (\n <td\n data-slot=\"table-cell\"\n data-pinned={isPinned}\n style={{ ...style, width }}\n className={cn(isPinned && cell.column.getPinnedIndex() === 0 && 'shadow!', className)}\n {...props}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </td>\n );\n});\nUITableCell.displayName = 'TableCell';\n\nconst EmptyDisplay: React.FC = () => {\n return (\n <div className=\"sticky left-0 flex flex-1 items-center justify-center bg-transparent text-text-positive-weak opacity-100\">\n <div className=\"flex flex-col items-center gap-1\">\n <BoxIcon strokeWidth={1} size={48} />\n <p>No data available</p>\n </div>\n </div>\n );\n};\n\nexport const UITableFooter: React.FC<React.PropsWithChildren> = ({ children }) => {\n return (\n <tfoot data-slot=\"table-footer\" className=\"flex w-full justify-center border-border-weak border-t py-2 font-medium [&>tr]:last:border-b-0\">\n {children}\n </tfoot>\n );\n};\n\nexport const UITableContainer: React.FC<React.PropsWithChildren> = ({ children }) => {\n const { table, isEmpty, isFetching, totalRows, fetchMoreData } = useUITableContext();\n const { rows, rowsLength } = useUITableRowsContext();\n\n const tableContainerRef = useRef<HTMLDivElement | null>(null);\n const tableRef = useRef<HTMLTableElement | null>(null);\n\n /**\n * Instead of calling `column.getSize()` on every render for every header\n * and especially every data cell (very expensive),\n * we will calculate all column sizes at once at the root table level in a useMemo\n * and pass the column sizes down as CSS variables to the <table> element.\n */\n // biome-ignore lint/correctness/useExhaustiveDependencies: <table> element.\n const columnSizeVars = useMemo(() => {\n const headers = table.getFlatHeaders();\n const colSizes: { [key: string]: number | undefined } = {};\n headers.forEach(header => {\n colSizes[`--header-${header.id}-size`] = header.getSize() || 0;\n colSizes[`--col-${header.column.id}-size`] = header.column.getSize() || 0;\n });\n return colSizes;\n }, [table.getState().columnSizingInfo, table.getState().columnSizing]);\n\n // Important: Keep the row virtualizer in the lowest component possible to avoid unnecessary re-renders.\n const rowVirtualizer = useVirtualizer<HTMLDivElement, HTMLTableRowElement>({\n count: rowsLength,\n getScrollElement: () => tableRef.current,\n estimateSize: () => 40, // estimated row height\n measureElement: element => element?.getBoundingClientRect().height,\n overscan: 2, // Render additional rows beyond viewport for smoother scrolling\n });\n\n //called on scroll and possibly on mount to fetch more data as the user scrolls and reaches bottom of table\n const fetchMoreOnButtonReached = useCallback(\n async (containerRefEl?: HTMLDivElement | null) => {\n if (!containerRefEl) return null;\n const { scrollHeight, scrollTop, clientHeight } = containerRefEl;\n //once the user has scrolled within 500px of the bottom of the table, fetch more data if we can\n if (scrollHeight - scrollTop - clientHeight < 500 && !isFetching && totalRows && rowsLength < totalRows) {\n fetchMoreData?.();\n }\n },\n [isFetching, rowsLength, totalRows, fetchMoreData]\n );\n\n //a check on mount and after a fetch to see if the table is already scrolled to the bottom and immediately needs to fetch more data\n useEffect(() => {\n fetchMoreOnButtonReached(tableContainerRef.current);\n }, [fetchMoreOnButtonReached]);\n\n return (\n <ResizablePanelGroup\n direction=\"horizontal\"\n style={{ direction: table.options.columnResizeDirection }}\n className=\"relative flex w-full max-w-full flex-1 gap-1 overflow-auto border-t border-t-border bg-slate-50 p-0 text-sm\"\n >\n <ResizablePanel className=\"overflow-auto\">\n <div ref={tableContainerRef} className=\"size-full overflow-auto\" onScroll={e => fetchMoreOnButtonReached(e.currentTarget)}>\n <table\n ref={tableRef}\n data-slot=\"table\"\n style={{\n ...columnSizeVars,\n width: table.getTotalSize(),\n }}\n className=\"grid size-full max-w-full caption-bottom border-collapse border-spacing-0 flex-col content-start overflow-auto bg-card text-sm tabular-nums [&_tfoot_td]:border-t\"\n >\n <UITableHeader>\n {table.getHeaderGroups().map(headerGroup => (\n <UITableHeaderRow key={headerGroup.id}>\n {headerGroup.headers.map(header => (\n <UITableHeaderCell\n key={header.id}\n header={header}\n isPinned={header.column.getIsPinned()}\n isResizing={header.column.getIsResizing()}\n isAllRowsSelected={table.getIsAllRowsSelected()}\n />\n ))}\n </UITableHeaderRow>\n ))}\n </UITableHeader>\n <UITableBody data-slot=\"table-body\" height={rowVirtualizer.getTotalSize()}>\n {rowVirtualizer.getVirtualItems().map(virtualRow => {\n const row = rows[virtualRow.index] as Row<AnyEntity>;\n return <UITableRow key={row.id} data-index={virtualRow.index} row={row} virtualRow={virtualRow} rowVirtualizer={rowVirtualizer} />;\n })}\n </UITableBody>\n </table>\n {isEmpty && <EmptyDisplay />}\n </div>\n </ResizablePanel>\n <ResizableHandle />\n {children}\n </ResizablePanelGroup>\n );\n};\n","import { Activity, useState } from 'react';\n\nimport { Columns4Icon, ListFilterIcon, ListFilterPlus } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { ResizablePanel } from '@/components/ui/resizable';\nimport { Separator } from '@/components/ui/separator';\n\nimport { useUITableContext } from '../../hooks/use-table-context';\n\nconst ColumnVisibility: React.FC<{\n checked: boolean;\n title: string;\n onCheckedChange?: (checked: boolean) => void;\n}> = ({ checked, title, onCheckedChange }) => {\n return (\n <div className=\"flex h-fit items-center gap-2\">\n <Checkbox checked={checked} onCheckedChange={onCheckedChange} />\n <p className=\"text-sm\">{title}</p>\n </div>\n );\n};\n\nexport const UITableFilter = () => {\n const { table } = useUITableContext();\n const [tab, setTab] = useState<'columns' | 'filters' | null>(null);\n\n return (\n <ResizablePanel defaultSize={25} className={cn('bg-card', tab === null ? 'max-w-8!' : 'min-w-64')}>\n <div className=\"relative z-20 flex size-full bg-muted-bg-subtle\">\n <div className=\"flex-1\">\n <Activity mode={tab === 'columns' ? 'visible' : 'hidden'}>\n <div className=\"flex size-full flex-col gap-2 p-4\">\n <p className=\"px-2 font-medium\">Columns Visibility</p>\n <Separator />\n <div className=\"flex flex-col gap-4 pt-4\">\n {table.getAllColumns().map(column => {\n if (['select', 'actions'].includes(column.id)) return null;\n return (\n <ColumnVisibility\n key={column.id}\n checked={column.getIsVisible()}\n title={String(column.columnDef.header)}\n onCheckedChange={value => column.toggleVisibility(!!value)}\n />\n );\n })}\n </div>\n </div>\n </Activity>\n <Activity mode={tab === 'filters' ? 'visible' : 'hidden'}>\n <div className=\"flex size-full flex-col p-2\">\n <Button variant=\"outline\" color=\"muted\">\n <ListFilterPlus />\n Add Filter\n </Button>\n </div>\n </Activity>\n </div>\n <div className=\"flex h-full flex-col border-border border-l bg-muted-bg-subtle text-sm\">\n <button\n className={cn('flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4', tab === 'columns' && 'bg-card')}\n onClick={() => setTab(tab === 'columns' ? null : 'columns')}\n >\n <Columns4Icon size={18} />\n <span className=\"text-nowrap [writing-mode:vertical-lr]\">Columns</span>\n </button>\n <Separator />\n <button\n className={cn('flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4', tab === 'filters' && 'bg-card')}\n onClick={() => setTab(tab === 'filters' ? null : 'filters')}\n >\n <ListFilterIcon size={18} />\n <span className=\"text-nowrap [writing-mode:vertical-lr]\">Filters</span>\n </button>\n <Separator />\n </div>\n </div>\n </ResizablePanel>\n );\n};\n","import { useMemo, useState } from 'react';\n\nimport type { ColumnPinningState, InitialTableState, RowData, RowSelectionState, VisibilityState } from '@tanstack/react-table';\nimport { getCoreRowModel, useReactTable } from '@tanstack/react-table';\n\nimport { TableContext } from '../../hooks/use-table-context';\nimport { TableRowsContext, type TTableRowsContext } from '../../hooks/use-table-rows-context';\nimport type { TableProviderProps, TTableContext } from '../../types';\n\nconst INITIAL_STATE: InitialTableState = {\n columnPinning: { right: ['actions'] },\n};\n\nexport const UITableProvider = <TData extends RowData>({\n title,\n isFetching = false,\n data,\n columns,\n totalRows,\n\n fetchMoreData,\n children,\n}: React.PropsWithChildren<TableProviderProps<TData>>) => {\n const [rowSelection, setRowSelection] = useState<RowSelectionState>({});\n const [columnPinning, setColumnPinning] = useState<ColumnPinningState>({ right: ['actions'] });\n const [columnVisibility, setColumnVisibility] = useState<VisibilityState>({});\n\n const table = useReactTable<TData>({\n initialState: INITIAL_STATE,\n data: data,\n columns,\n state: {\n rowSelection,\n columnPinning,\n columnVisibility,\n },\n defaultColumn: {\n minSize: 40,\n size: 150,\n maxSize: 800,\n },\n columnResizeMode: 'onChange',\n columnResizeDirection: 'ltr',\n\n enableRowSelection: true,\n enableColumnResizing: true,\n enableMultiRowSelection: true,\n\n getCoreRowModel: getCoreRowModel(),\n\n onRowSelectionChange: setRowSelection,\n onColumnPinningChange: setColumnPinning,\n onColumnVisibilityChange: setColumnVisibility,\n });\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: rows\n const rows = useMemo(() => {\n const { rows } = table.getRowModel();\n return rows;\n }, [table.getRowModel().rows, table.getState().columnPinning]);\n\n const isEmpty = useMemo<boolean>(() => {\n return !isFetching && rows.length === 0;\n }, [rows, isFetching]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: table get state\n const value = useMemo<TTableContext<TData>>(\n () => ({\n table,\n title,\n isEmpty,\n isFetching,\n\n totalRows,\n\n rowSelection: table.getState().rowSelection,\n\n columnPinning: table.getState().columnPinning,\n\n fetchMoreData,\n }),\n [\n table,\n title,\n\n isEmpty,\n isFetching,\n\n totalRows,\n\n fetchMoreData,\n\n table.getState().columnVisibility,\n\n table.getState().rowSelection,\n table.getState().columnPinning,\n ]\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: rows\n const rowsValue = useMemo<TTableRowsContext<TData>>(\n () => ({\n rowsLength: rows.length,\n rows,\n }),\n [rows, table.getState().rowSelection, table.getState().columnPinning, table.getState().columnSizing]\n );\n\n return (\n <TableContext.Provider value={value as TTableContext<unknown>}>\n <TableRowsContext.Provider value={rowsValue as TTableRowsContext<unknown>}>{children}</TableRowsContext.Provider>\n </TableContext.Provider>\n );\n};\n","import { ArrowRightIcon, CirclePlus, DownloadIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableContext } from '../../hooks/use-table-context';\n\nexport const UITableTooltipFilter: React.FC<React.ComponentProps<typeof Input>> = ({ className: _, ...props }) => {\n return (\n <div className=\"relative\">\n <Input {...props} size=\"lg\" type=\"search\" placeholder=\"Search records...\" className=\"ps-9 pe-9\" />\n <div className=\"pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n <SearchIcon size={16} />\n </div>\n <button\n className=\"absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n aria-label=\"Submit search\"\n type=\"submit\"\n >\n <ArrowRightIcon size={16} aria-hidden=\"true\" />\n </button>\n </div>\n );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren> = ({ children }) => {\n return (\n <button className=\"flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive [&_svg]:size-3.5\">\n {children}\n </button>\n );\n};\n\nexport const UITableTooltipActions: React.FC = () => {\n return (\n <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n <ActionButton>\n <CirclePlus />\n </ActionButton>\n <ActionButton>\n <RefreshCwIcon />\n </ActionButton>\n <ActionButton>\n <DownloadIcon />\n </ActionButton>\n </div>\n );\n};\n\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n const { title } = useUITableContext();\n return (\n <div data-slot=\"table-tooltip\" className=\"relative m-0 flex w-full flex-0 flex-col flex-wrap items-start space-y-2 p-0 px-2 text-sm\">\n <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n <div className=\"flex w-full flex-1 justify-between\">{children}</div>\n </div>\n );\n};\nUITableTooltip.displayName = 'TableTooltip';\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.mjs","names":["UITableDateDisplay: React.FC<Props>","Tooltip","UITableNameDisplay: React.FC<NameDisplayProps>","Tooltip","UITablePhoneNumberDisplay: React.FC<React.PropsWithChildren<{ value: string }>>","Tooltip","options: Intl.NumberFormatOptions","UITableUserDataDisplay: React.FC<Props>","Avatar","Checkbox","CheckboxPrimitive","UITableWrapper: React.FC<React.PropsWithChildren<React.ComponentProps<'div'>>>","UITableHeader: React.FC<React.PropsWithChildren>","UITableHeaderRow: React.FC<React.PropsWithChildren>","UITableHeaderCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'th'> & {\n header: Header<unknown, unknown>;\n isPinned: ColumnPinningPosition;\n isResizing: boolean;\n isAllRowsSelected: boolean;\n }\n >\n>","Checkbox","UITableHeaderCellOption: React.FC<{\n isPinned: ColumnPinningPosition;\n className?: string;\n isVisible?: boolean;\n onLeftPin: (pos: 'left' | 'right' | false) => void;\n onRightPin: (pos: 'left' | 'right' | false) => void;\n onUnpin: (pos: 'left' | 'right' | false) => void;\n onToggleVisibilityHandler: (visible: AnyEntity) => void;\n}>","DropdownMenu","UITableBody: React.FC<React.PropsWithChildren<React.ComponentProps<'tbody'> & { height: number }>>","UITableRow: React.FC<\n React.ComponentProps<'tr'> & {\n row: Row<unknown>;\n virtualRow: VirtualItem;\n rowVirtualizer: Virtualizer<HTMLDivElement, HTMLTableRowElement>;\n }\n>","UITableCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'td'> & {\n cell: Cell<unknown, unknown>;\n }\n >\n>","EmptyDisplay: React.FC","UITableFooter: React.FC<React.PropsWithChildren>","UITableContainer: React.FC<React.PropsWithChildren>","colSizes: { [key: string]: number | undefined }","ColumnVisibility: React.FC<{\n checked: boolean;\n title: string;\n onCheckedChange?: (checked: boolean) => void;\n}>","Checkbox","Separator","INITIAL_STATE: InitialTableState","rows","UITableTooltipFilter: React.FC<React.ComponentProps<typeof Input>>","ActionButton: React.FC<React.PropsWithChildren>","UITableTooltipActions: React.FC","UITableTooltip: React.FC<React.PropsWithChildren>"],"sources":["../../../packages/components/features/tables/components/atoms/date-display.tsx","../../../packages/components/features/tables/components/atoms/name-display.tsx","../../../packages/components/features/tables/components/atoms/phone-number.tsx","../../../packages/components/features/tables/components/atoms/statistic.tsx","../../../packages/components/features/tables/components/atoms/user.tsx","../../../packages/components/ui/checkbox.tsx","../../../packages/components/features/tables/hooks/use-table-context.ts","../../../packages/components/features/tables/hooks/use-table-rows-context.ts","../../../packages/components/features/tables/components/table.tsx","../../../packages/components/features/tables/components/table/filter.tsx","../../../packages/components/features/tables/components/table/provider.tsx","../../../packages/components/features/tables/components/table/tooltip.tsx"],"sourcesContent":["import { Badge } from '@/components/ui/badge';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { DateDisplay } from '@/components/data-display/date';\n\ntype Props = {\n date: Date | string | number;\n};\nexport const UITableDateDisplay: React.FC<Props> = ({ date }) => {\n return (\n <TooltipProvider>\n <Tooltip>\n <TooltipTrigger asChild>\n <Badge className=\"h-fit\">\n <DateDisplay date={date} format=\"medium\" className=\"font-normal text-white\" />\n </Badge>\n </TooltipTrigger>\n <TooltipContent>\n <DateDisplay date={date} format=\"full\" showTime className=\"font-[Inter]! font-medium text-xs\" />\n </TooltipContent>\n </Tooltip>\n </TooltipProvider>\n );\n};\n","import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nimport { Paragraph } from '@/components/typography/paragraph';\n\ntype NameDisplayProps = {\n name: string;\n};\n\nexport const UITableNameDisplay: React.FC<NameDisplayProps> = ({ name }) => {\n return (\n <Tooltip>\n <TooltipTrigger>\n <Paragraph variant=\"sm\" className=\"line-clamp-2 w-full truncate text-wrap pb-px text-start\">\n {name}\n </Paragraph>\n </TooltipTrigger>\n <TooltipContent align=\"start\" className=\"max-w-80 whitespace-pre-line text-wrap break-keep\">\n {name}\n </TooltipContent>\n </Tooltip>\n );\n};\n","import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';\n\nexport const UITablePhoneNumberDisplay: React.FC<React.PropsWithChildren<{ value: string }>> = ({ value }) => {\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <p className=\"font-number text-secondary-foreground text-sm tabular-nums\">{value.replace(/(\\d{3})(\\d{3})(\\d{4})/, '($1) $2-$3')}</p>\n </TooltipTrigger>\n <TooltipContent align=\"start\">\n <p className=\"tabular-nums\">{value.slice(1).replace(/(\\d{2})(\\d{3})(\\d{4})/, '(00) (+84) ($1) $2-$3')}</p>\n </TooltipContent>\n </Tooltip>\n );\n};\n","import { memo, useCallback, useMemo } from 'react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Flex } from '@/components/layouts/flex';\n\ntype Props = {\n decimalSeparator?: string;\n groupSeparator?: string;\n prefix?: React.ReactNode;\n suffix?: React.ReactNode;\n precision?: number; // Số chữ số thập phân\n roundingMode?: 'round' | 'floor' | 'ceil'; // Kiểu làm tròn\n showTrailingZeros?: boolean; // Hiển thị số 0 cuối\n size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'; // Kích thước của component\n value: number | string;\n};\nexport const UITableStatisticDisplay = memo(\n ({\n decimalSeparator = '.',\n groupSeparator = ',',\n prefix: Prefix,\n suffix: Suffix,\n precision,\n roundingMode = 'round',\n showTrailingZeros = false,\n size = 'lg',\n value,\n }: Props) => {\n // Memoize rounding function\n const applyRounding = useCallback(\n (num: number, precisionValue: number): number => {\n const multiplier = 10 ** precisionValue;\n\n switch (roundingMode) {\n case 'floor':\n return Math.floor(num * multiplier) / multiplier;\n case 'ceil':\n return Math.ceil(num * multiplier) / multiplier;\n default:\n return Math.round(num * multiplier) / multiplier;\n }\n },\n [roundingMode]\n );\n\n // Memoize number formatting options\n const formatOptions = useMemo((): Intl.NumberFormatOptions => {\n const options: Intl.NumberFormatOptions = {};\n\n if (typeof precision === 'number' && precision >= 0) {\n if (showTrailingZeros) {\n options.minimumFractionDigits = precision;\n options.maximumFractionDigits = precision;\n } else {\n options.maximumFractionDigits = precision;\n }\n }\n\n return options;\n }, [precision, showTrailingZeros]);\n\n const formatNumber = useCallback(\n (num: number): string => {\n let processedNum = num;\n\n // Áp dụng làm tròn nếu có precision\n if (typeof precision === 'number' && precision >= 0) {\n processedNum = applyRounding(num, precision);\n }\n\n return processedNum.toLocaleString('en-US', formatOptions);\n },\n [applyRounding, formatOptions, precision]\n );\n\n // Memoize value processing\n const processedValue = useMemo((): string => {\n // Xử lý giá trị number\n if (typeof value === 'number') {\n if (Number.isNaN(value) || !Number.isFinite(value)) {\n return 'N/A';\n }\n return formatNumber(value);\n }\n\n // Xử lý giá trị string\n if (typeof value === 'string') {\n const trimmedValue = value.trim();\n\n // Nếu là chuỗi rỗng\n if (!trimmedValue) {\n return 'N/A';\n }\n\n // Thử convert sang number\n const numValue = Number(trimmedValue);\n\n if (Number.isNaN(numValue) || !Number.isFinite(numValue)) {\n // Nếu không phải số, trả về string gốc\n return 'N/A';\n }\n\n return formatNumber(numValue);\n }\n\n return 'N/A';\n }, [value, formatNumber]);\n\n // Memoize separator replacement\n const finalFormattedValue = useMemo((): string => {\n // Chỉ thay thế separators nếu khác mặc định\n if (decimalSeparator === '.' && groupSeparator === ',') {\n return processedValue;\n }\n return processedValue.replace(/,/g, groupSeparator).replace(/\\./g, decimalSeparator);\n }, [processedValue, decimalSeparator, groupSeparator]);\n\n return (\n <Flex\n padding=\"none\"\n className={cn(\n 'font-number text-lg text-secondary-foreground tabular-nums',\n size === 'xs' && 'text-xs',\n size === 'sm' && 'text-sm',\n size === 'md' && 'text-base',\n size === 'lg' && 'text-lg',\n size === 'xl' && 'text-xl'\n )}\n >\n {Prefix}\n <p>{finalFormattedValue}</p>\n {Suffix}\n </Flex>\n );\n }\n);\nUITableStatisticDisplay.displayName = 'UITableStatisticDisplay';\n","import { UserRoundIcon } from 'lucide-react';\n\nimport { colorHashLight } from '@customafk/react-toolkit/color-hash';\n\nimport { Avatar, AvatarFallback } from '@/components/ui/avatar';\n\nimport { Flex } from '@/components/layouts/flex';\nimport { Paragraph } from '@/components/typography/paragraph';\n\ntype Props = {\n uuid: string;\n username: string;\n email: string;\n};\n\nexport const UITableUserDataDisplay: React.FC<Props> = ({ uuid, username, email }) => {\n return (\n <Flex wrap={false} gap=\"sm\" padding=\"none\">\n <Avatar className=\"size-10 shadow-card\">\n <AvatarFallback style={{ backgroundColor: colorHashLight.hex(uuid) }}>\n <UserRoundIcon size={28} className=\"text-white\" />\n </AvatarFallback>\n </Avatar>\n <Flex vertical padding=\"none\" gap=\"none\" align=\"start\">\n <Paragraph className=\"font-medium text-sm text-text-positive\">{username}</Paragraph>\n <Paragraph variant=\"sm\" className=\"mt-0! text-text-positive-weak text-xs\">\n {email}\n </Paragraph>\n </Flex>\n </Flex>\n );\n};\n","'use client';\n\nimport { CheckIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Checkbox as CheckboxPrimitive } from 'radix-ui';\n\nfunction Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>) {\n return (\n <CheckboxPrimitive.Root\n data-slot=\"checkbox\"\n className={cn(\n 'peer border-border',\n 'size-4 shrink-0 cursor-pointer rounded border shadow-xs outline-none transition-shadow',\n 'data-[state=checked]:bg-primary',\n 'data-[state=checked]:text-text-negative-strong',\n 'data-[state=checked]:border-primary',\n 'focus-visible:border-primary-strong',\n 'focus-visible:ring-primary-weak',\n 'focus-visible:ring-3',\n 'aria-invalid:ring-danger-weak',\n 'aria-invalid:border-danger',\n 'disabled:cursor-not-allowed disabled:opacity-50',\n className\n )}\n {...props}\n >\n <CheckboxPrimitive.Indicator data-slot=\"checkbox-indicator\" className=\"flex items-center justify-center text-current transition-none\">\n <CheckIcon size={14} />\n </CheckboxPrimitive.Indicator>\n </CheckboxPrimitive.Root>\n );\n}\n\nexport { Checkbox };\n","import { createContext, use } from 'react';\n\nimport type { RowData } from '@tanstack/react-table';\n\nimport type { TTableContext } from '../types';\n\nexport const TableContext = createContext<TTableContext<RowData> | null>(null);\n\nexport const useUITableContext = <TData extends RowData>() => {\n const context = use(TableContext) as TTableContext<TData>;\n if (!context) {\n throw new Error('useTableContext must be used within a TableProvider');\n }\n return context;\n};\n","import { createContext, use } from 'react';\n\nimport type { Row, RowData } from '@tanstack/react-table';\n\nexport type TTableRowsContext<TData extends RowData> = {\n rowsLength: number;\n rows: Row<TData>[];\n};\n\nexport const TableRowsContext = createContext<TTableRowsContext<RowData> | null>(null);\nexport const useUITableRowsContext = <TData extends RowData>() => {\n const ctx = use(TableRowsContext) as TTableRowsContext<TData>;\n if (!ctx) {\n throw new Error('useTableRowContext must be used within a TableRowProvider');\n }\n return ctx;\n};\n","'use client';\nimport { Activity, memo, useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport { type Cell, type Column, type ColumnPinningPosition, flexRender, type Header, type Row } from '@tanstack/react-table';\nimport { useVirtualizer, type VirtualItem, type Virtualizer } from '@tanstack/react-virtual';\n\nimport { BoxIcon, EllipsisVerticalIcon, EyeOffIcon, MoveLeftIcon, MoveRightIcon, PinOffIcon } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Checkbox } from '@/components/ui/checkbox';\nimport {\n DropdownMenu,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuTrigger,\n} from '@/components/ui/dropdown-menu';\nimport { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '@/components/ui/resizable';\n\nimport type { AnyEntity } from '@/types';\nimport { useUITableContext } from '../hooks/use-table-context';\nimport { useUITableRowsContext } from '../hooks/use-table-rows-context';\n\nconst SELECT_WIDTH = 60;\nconst TABLE_HEADER_Z_INDEX = 20;\nconst PINNED_COLUMN_Z_INDEX = 20;\n\n//These are the important styles to make sticky column pinning work!\n//Apply styles like this using your CSS strategy of choice with this kind of logic to head cells, data cells, footer cells, etc.\n//View the index.css file for more needed styles such as border-collapse: separate\nconst getCommonPinningStyles = (column: Column<unknown>): React.CSSProperties => {\n const isPinned = column.getIsPinned();\n return {\n zIndex: isPinned ? PINNED_COLUMN_Z_INDEX : undefined,\n left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined,\n right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined,\n position: isPinned ? 'sticky' : 'relative',\n };\n};\n\nexport const UITableWrapper: React.FC<React.PropsWithChildren<React.ComponentProps<'div'>>> = ({ className, children, ...props }) => {\n return (\n <div data-slot=\"table-wrapper\" className=\"relative m-0 flex size-full flex-col flex-nowrap items-start justify-start gap-2 py-2.5 text-sm\" {...props}>\n {children}\n </div>\n );\n};\n\nconst UITableHeader: React.FC<React.PropsWithChildren> = memo(({ children }) => {\n return (\n <thead\n data-slot=\"table-header\"\n style={{ zIndex: TABLE_HEADER_Z_INDEX }}\n className={cn(\n 'sticky top-0 grid bg-muted-bg-subtle text-sm text-text-positive',\n '[&_tr:not(:last-child)_td]:border-b',\n '[&_th]:flex',\n '[&_th]:h-10',\n '[&_th]:select-none',\n '[&_th]:items-center',\n '[&_th]:whitespace-nowrap',\n '[&_th]:border-border',\n '[&_th]:font-normal',\n '[&_th]:border-r',\n '[&_th]:border-b-border',\n '[&_th]:text-left',\n '[&_th]:align-middle',\n '[&_th]:last:border-r-0',\n '[&_th]:first:border-l-0',\n '[&_th]:data-[pinned=right]:border-l',\n '[&_th]:data-[pinned=right]:border-r-0',\n '[&_th]:data-[pinned=left]:border-r',\n '[&_tr_th:not([data-pinned=false])]:bg-muted-bg-subtle'\n )}\n >\n {children}\n </thead>\n );\n});\nUITableHeader.displayName = 'TableHeader';\n\nconst UITableHeaderRow: React.FC<React.PropsWithChildren> = memo(({ children }) => {\n return (\n <tr data-slot=\"table-header-row\" className=\"flex w-full border-border border-b shadow\">\n {children}\n </tr>\n );\n});\nUITableHeaderRow.displayName = 'TableHeaderRow';\n\nconst UITableHeaderCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'th'> & {\n header: Header<unknown, unknown>;\n isPinned: ColumnPinningPosition;\n isResizing: boolean;\n isAllRowsSelected: boolean;\n }\n >\n> = ({ header, isPinned, isResizing, isAllRowsSelected, children, ...props }) => {\n const style = getCommonPinningStyles(header.column);\n const width = `calc(var(--header-${header.id}-size) * 1px)`;\n\n if (header.id === 'select') {\n return (\n <th data-slot=\"table-header-cell\" style={{ ...style, width: SELECT_WIDTH }} className=\"relative\" {...props}>\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <Checkbox\n aria-label=\"Select All Rows\"\n checked={isAllRowsSelected}\n onCheckedChange={value => {\n header.getContext().table.toggleAllRowsSelected(!!value);\n }}\n />\n </div>\n </th>\n );\n }\n return (\n <th data-slot=\"table-header-cell\" data-pinned={isPinned} style={{ ...style, width }} colSpan={header.colSpan} className={cn('group relative')} {...props}>\n <div className=\"absolute inset-0 gap-1 truncate\">\n <div className=\"flex h-full flex-1 cursor-pointer select-none items-center justify-between\">\n <div className=\"flex size-full flex-1 items-center truncate pl-4\">{flexRender(header.column.columnDef.header, header.getContext())}</div>\n </div>\n </div>\n {!['select', 'actions'].includes(header.id) && (\n <UITableHeaderCellOption\n isPinned={isPinned}\n isVisible={header.column.getIsVisible()}\n className=\"invisible absolute right-2 z-10 group-hover:visible\"\n onLeftPin={header.column.pin}\n onRightPin={header.column.pin}\n onUnpin={header.column.pin}\n onToggleVisibilityHandler={header.column.toggleVisibility}\n />\n )}\n <Activity mode={isPinned ? 'hidden' : 'visible'}>\n <div\n onDoubleClick={header.column.resetSize}\n onMouseDown={header.getResizeHandler()}\n onTouchStart={header.getResizeHandler()}\n className={cn('absolute inset-y-0 -right-0.5 w-1 cursor-e-resize bg-transparent hover:bg-border', isResizing && 'bg-border')}\n />\n </Activity>\n </th>\n );\n};\n\nconst UITableHeaderCellOption: React.FC<{\n isPinned: ColumnPinningPosition;\n className?: string;\n isVisible?: boolean;\n onLeftPin: (pos: 'left' | 'right' | false) => void;\n onRightPin: (pos: 'left' | 'right' | false) => void;\n onUnpin: (pos: 'left' | 'right' | false) => void;\n onToggleVisibilityHandler: (visible: AnyEntity) => void;\n}> = ({ isPinned, className, onLeftPin, onRightPin, onUnpin, onToggleVisibilityHandler }) => {\n const handleLeftPin = useCallback(() => {\n onLeftPin('left');\n }, [onLeftPin]);\n\n const handleRightPin = useCallback(() => {\n onRightPin('right');\n }, [onRightPin]);\n\n const handleUnpin = useCallback(() => {\n onUnpin(false);\n }, [onUnpin]);\n return (\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <button\n className={cn('cursor-pointer rounded-full p-0.5 text-text-positive-weak hover:bg-muted-muted hover:text-text-positive [&>svg]:size-4', className)}\n >\n <EllipsisVerticalIcon />\n </button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\" className=\"w-64 p-4\">\n <DropdownMenuGroup className=\"*:data-[slot=dropdown-menu-item]:rounded-xs *:data-[slot=dropdown-menu-item]:p-2\">\n <Activity mode={isPinned ? 'visible' : 'hidden'}>\n <DropdownMenuItem onClick={handleUnpin}>\n {!!isPinned && 'Unpin'}\n <DropdownMenuShortcut>\n <PinOffIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n </Activity>\n <Activity mode={!isPinned ? 'visible' : 'hidden'}>\n <DropdownMenuItem onClick={handleLeftPin}>\n {isPinned ? 'Unpin' : 'Pin to Left'}\n <DropdownMenuShortcut>\n <MoveLeftIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n <DropdownMenuItem onClick={handleRightPin}>\n {isPinned ? 'Unpin' : 'Pin to Right'}\n <DropdownMenuShortcut>\n <MoveRightIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n </Activity>\n </DropdownMenuGroup>\n <DropdownMenuSeparator />\n <DropdownMenuGroup className=\"*:data-[slot=dropdown-menu-item]:rounded-xs *:data-[slot=dropdown-menu-item]:p-2\">\n <DropdownMenuItem onClick={() => onToggleVisibilityHandler(false)}>\n Hide Field\n <DropdownMenuShortcut>\n <EyeOffIcon className=\"size-4\" />\n </DropdownMenuShortcut>\n </DropdownMenuItem>\n </DropdownMenuGroup>\n </DropdownMenuContent>\n </DropdownMenu>\n );\n};\n\nconst UITableBody: React.FC<React.PropsWithChildren<React.ComponentProps<'tbody'> & { height: number }>> = ({ height, children, ...props }) => {\n return (\n <tbody\n data-slot=\"table-body\"\n style={{ height: `${height}px` }}\n className={cn(\n 'relative grid w-full',\n '[&_tr]:absolute [&_tr]:flex [&_tr]:w-full [&_tr]:cursor-pointer [&_tr]:border-b [&_tr]:border-b-border [&_tr]:focus:outline-none',\n '[&_td]:z-10',\n '[&_td]:flex',\n '[&_td]:overflow-hidden',\n '[&_td]:whitespace-nowrap',\n '[&_td]:px-4',\n '[&_td]:py-2.5',\n '[&_td]:align-middle',\n '[&_td]:border-border',\n '[&_td]:data-[pinned=right]:border-l',\n '[&_td]:data-[pinned=left]:border-r',\n '[&_td:not([data-pinned=false])]:bg-card',\n '[&_td:not([data-pinned=false])]:shadow-xs'\n )}\n {...props}\n >\n {children}\n </tbody>\n );\n};\n\nconst UITableRow: React.FC<\n React.ComponentProps<'tr'> & {\n row: Row<unknown>;\n virtualRow: VirtualItem;\n rowVirtualizer: Virtualizer<HTMLDivElement, HTMLTableRowElement>;\n }\n> = memo(({ children, row, virtualRow, rowVirtualizer, className, ...props }) => {\n const { columnPinning: _ } = useUITableContext();\n return (\n <tr\n data-slot=\"table-row\"\n data-index={virtualRow.index}\n ref={node => rowVirtualizer.measureElement(node)}\n style={{\n transform: `translateY(${virtualRow.start}px)`,\n }}\n className={cn('group', className)}\n {...props}\n >\n {row.getVisibleCells().map(cell => {\n return <UITableCell key={cell.id} cell={cell} className=\"group-hover:bg-muted-bg-subtle!\" />;\n })}\n </tr>\n );\n});\nUITableRow.displayName = 'TableRow';\n\nconst UITableCell: React.FC<\n React.PropsWithChildren<\n React.ComponentProps<'td'> & {\n cell: Cell<unknown, unknown>;\n }\n >\n> = memo(({ cell, children, className, ...props }) => {\n const { rowSelection: _ } = useUITableContext();\n const isPinned = cell.column.getIsPinned();\n const style = getCommonPinningStyles(cell.column);\n const width = `calc(var(--col-${cell.column.id}-size) * 1px)`;\n if (isPinned) {\n console.log('Pinned Cell Rendered:', cell.column.getPinnedIndex());\n }\n\n if (cell.column.id === 'select') {\n return (\n <td data-slot=\"table-cell\" style={{ ...style, width: SELECT_WIDTH }} className={cn('border-none! bg-transparent! shadow-none!', className)} {...props}>\n <div className=\"absolute inset-0 flex items-center justify-center bg-transparent\">\n <Checkbox\n aria-label=\"Select Row\"\n checked={cell.row.getIsSelected()}\n onCheckedChange={value => {\n cell.row.toggleSelected(!!value);\n }}\n />\n </div>\n </td>\n );\n }\n\n return (\n <td\n data-slot=\"table-cell\"\n data-pinned={isPinned}\n style={{ ...style, width }}\n className={cn(isPinned && cell.column.getPinnedIndex() === 0 && 'shadow!', className)}\n {...props}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </td>\n );\n});\nUITableCell.displayName = 'TableCell';\n\nconst EmptyDisplay: React.FC = () => {\n return (\n <div className=\"sticky left-0 flex flex-1 items-center justify-center bg-transparent text-text-positive-weak opacity-100\">\n <div className=\"flex flex-col items-center gap-1\">\n <BoxIcon strokeWidth={1} size={48} />\n <p>No data available</p>\n </div>\n </div>\n );\n};\n\nexport const UITableFooter: React.FC<React.PropsWithChildren> = ({ children }) => {\n return (\n <tfoot data-slot=\"table-footer\" className=\"flex w-full justify-center border-border-weak border-t py-2 font-medium [&>tr]:last:border-b-0\">\n {children}\n </tfoot>\n );\n};\n\nexport const UITableContainer: React.FC<React.PropsWithChildren> = ({ children }) => {\n const { table, isEmpty, isFetching, totalRows, fetchMoreData } = useUITableContext();\n const { rows, rowsLength } = useUITableRowsContext();\n\n const tableContainerRef = useRef<HTMLDivElement | null>(null);\n const tableRef = useRef<HTMLTableElement | null>(null);\n\n /**\n * Instead of calling `column.getSize()` on every render for every header\n * and especially every data cell (very expensive),\n * we will calculate all column sizes at once at the root table level in a useMemo\n * and pass the column sizes down as CSS variables to the <table> element.\n */\n // biome-ignore lint/correctness/useExhaustiveDependencies: <table> element.\n const columnSizeVars = useMemo(() => {\n const headers = table.getFlatHeaders();\n const colSizes: { [key: string]: number | undefined } = {};\n headers.forEach(header => {\n colSizes[`--header-${header.id}-size`] = header.getSize() || 0;\n colSizes[`--col-${header.column.id}-size`] = header.column.getSize() || 0;\n });\n return colSizes;\n }, [table.getState().columnSizingInfo, table.getState().columnSizing]);\n\n // Important: Keep the row virtualizer in the lowest component possible to avoid unnecessary re-renders.\n const rowVirtualizer = useVirtualizer<HTMLDivElement, HTMLTableRowElement>({\n count: rowsLength,\n getScrollElement: () => tableContainerRef.current,\n estimateSize: () => 40, // estimated row height\n //measure dynamic row height, except in firefox because it measures table border height incorrectly\n measureElement:\n typeof window !== 'undefined' && navigator.userAgent.indexOf('Firefox') === -1 ? element => element?.getBoundingClientRect().height : undefined,\n overscan: 2, // Render additional rows beyond viewport for smoother scrolling\n });\n\n //called on scroll and possibly on mount to fetch more data as the user scrolls and reaches bottom of table\n const fetchMoreOnButtonReached = useCallback(\n async (containerRefEl?: HTMLDivElement | null) => {\n if (!containerRefEl) return null;\n const { scrollHeight, scrollTop, clientHeight } = containerRefEl;\n //once the user has scrolled within 500px of the bottom of the table, fetch more data if we can\n if (scrollHeight - scrollTop - clientHeight < 500 && !isFetching && totalRows && rowsLength < totalRows) {\n fetchMoreData?.();\n }\n },\n [isFetching, rowsLength, totalRows, fetchMoreData]\n );\n\n //a check on mount and after a fetch to see if the table is already scrolled to the bottom and immediately needs to fetch more data\n useEffect(() => {\n fetchMoreOnButtonReached(tableContainerRef.current);\n }, [fetchMoreOnButtonReached]);\n\n return (\n <ResizablePanelGroup\n direction=\"horizontal\"\n style={{ direction: table.options.columnResizeDirection }}\n className=\"relative flex w-full max-w-full flex-1 gap-1 overflow-auto border-t border-t-border bg-slate-50 p-0 text-sm\"\n >\n <ResizablePanel className=\"overflow-auto\">\n <div ref={tableContainerRef} className=\"size-full overflow-auto\" onScroll={e => fetchMoreOnButtonReached(e.currentTarget)}>\n <table\n ref={tableRef}\n data-slot=\"table\"\n style={{\n ...columnSizeVars,\n width: table.getTotalSize(),\n }}\n className=\"grid size-full max-w-full caption-bottom border-collapse border-spacing-0 flex-col content-start overflow-auto bg-card text-sm tabular-nums [&_tfoot_td]:border-t\"\n >\n <UITableHeader>\n {table.getHeaderGroups().map(headerGroup => (\n <UITableHeaderRow key={headerGroup.id}>\n {headerGroup.headers.map(header => (\n <UITableHeaderCell\n key={header.id}\n header={header}\n isPinned={header.column.getIsPinned()}\n isResizing={header.column.getIsResizing()}\n isAllRowsSelected={table.getIsAllRowsSelected()}\n />\n ))}\n </UITableHeaderRow>\n ))}\n </UITableHeader>\n <UITableBody data-slot=\"table-body\" height={rowVirtualizer.getTotalSize()}>\n {rowVirtualizer.getVirtualItems().map(virtualRow => {\n const row = rows[virtualRow.index] as Row<AnyEntity>;\n return <UITableRow key={row.id} data-index={virtualRow.index} row={row} virtualRow={virtualRow} rowVirtualizer={rowVirtualizer} />;\n })}\n </UITableBody>\n </table>\n {isEmpty && <EmptyDisplay />}\n </div>\n </ResizablePanel>\n <ResizableHandle />\n {children}\n </ResizablePanelGroup>\n );\n};\n","import { Activity, useState } from 'react';\n\nimport { Columns4Icon, ListFilterIcon, ListFilterPlus } from 'lucide-react';\n\nimport { cn } from '@customafk/react-toolkit/utils';\n\nimport { Button } from '@/components/ui/button';\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { ResizablePanel } from '@/components/ui/resizable';\nimport { Separator } from '@/components/ui/separator';\n\nimport { useUITableContext } from '../../hooks/use-table-context';\n\nconst ColumnVisibility: React.FC<{\n checked: boolean;\n title: string;\n onCheckedChange?: (checked: boolean) => void;\n}> = ({ checked, title, onCheckedChange }) => {\n return (\n <div className=\"flex h-fit items-center gap-2\">\n <Checkbox checked={checked} onCheckedChange={onCheckedChange} />\n <p className=\"text-sm\">{title}</p>\n </div>\n );\n};\n\nexport const UITableFilter = () => {\n const { table } = useUITableContext();\n const [tab, setTab] = useState<'columns' | 'filters' | null>(null);\n\n return (\n <ResizablePanel defaultSize={25} className={cn('bg-card', tab === null ? 'max-w-8!' : 'min-w-64')}>\n <div className=\"relative z-20 flex size-full bg-muted-bg-subtle\">\n <div className=\"flex-1\">\n <Activity mode={tab === 'columns' ? 'visible' : 'hidden'}>\n <div className=\"flex size-full flex-col gap-2 p-4\">\n <p className=\"px-2 font-medium\">Columns Visibility</p>\n <Separator />\n <div className=\"flex flex-col gap-4 pt-4\">\n {table.getAllColumns().map(column => {\n if (['select', 'actions'].includes(column.id)) return null;\n return (\n <ColumnVisibility\n key={column.id}\n checked={column.getIsVisible()}\n title={String(column.columnDef.header)}\n onCheckedChange={value => column.toggleVisibility(!!value)}\n />\n );\n })}\n </div>\n </div>\n </Activity>\n <Activity mode={tab === 'filters' ? 'visible' : 'hidden'}>\n <div className=\"flex size-full flex-col p-2\">\n <Button variant=\"outline\" color=\"muted\">\n <ListFilterPlus />\n Add Filter\n </Button>\n </div>\n </Activity>\n </div>\n <div className=\"flex h-full flex-col border-border border-l bg-muted-bg-subtle text-sm\">\n <button\n className={cn('flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4', tab === 'columns' && 'bg-card')}\n onClick={() => setTab(tab === 'columns' ? null : 'columns')}\n >\n <Columns4Icon size={18} />\n <span className=\"text-nowrap [writing-mode:vertical-lr]\">Columns</span>\n </button>\n <Separator />\n <button\n className={cn('flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4', tab === 'filters' && 'bg-card')}\n onClick={() => setTab(tab === 'filters' ? null : 'filters')}\n >\n <ListFilterIcon size={18} />\n <span className=\"text-nowrap [writing-mode:vertical-lr]\">Filters</span>\n </button>\n <Separator />\n </div>\n </div>\n </ResizablePanel>\n );\n};\n","import { useMemo, useState } from 'react';\n\nimport type { ColumnPinningState, InitialTableState, RowData, RowSelectionState, VisibilityState } from '@tanstack/react-table';\nimport { getCoreRowModel, useReactTable } from '@tanstack/react-table';\n\nimport { TableContext } from '../../hooks/use-table-context';\nimport { TableRowsContext, type TTableRowsContext } from '../../hooks/use-table-rows-context';\nimport type { TableProviderProps, TTableContext } from '../../types';\n\nconst INITIAL_STATE: InitialTableState = {\n columnPinning: { right: ['actions'] },\n};\n\nexport const UITableProvider = <TData extends RowData>({\n title,\n isFetching = false,\n data,\n columns,\n totalRows,\n\n fetchMoreData,\n children,\n}: React.PropsWithChildren<TableProviderProps<TData>>) => {\n const [rowSelection, setRowSelection] = useState<RowSelectionState>({});\n const [columnPinning, setColumnPinning] = useState<ColumnPinningState>({ right: ['actions'] });\n const [columnVisibility, setColumnVisibility] = useState<VisibilityState>({});\n\n const table = useReactTable<TData>({\n initialState: INITIAL_STATE,\n data: data,\n columns,\n state: {\n rowSelection,\n columnPinning,\n columnVisibility,\n },\n defaultColumn: {\n minSize: 40,\n size: 150,\n maxSize: 800,\n },\n columnResizeMode: 'onChange',\n columnResizeDirection: 'ltr',\n\n enableRowSelection: true,\n enableColumnResizing: true,\n enableMultiRowSelection: true,\n\n getCoreRowModel: getCoreRowModel(),\n\n onRowSelectionChange: setRowSelection,\n onColumnPinningChange: setColumnPinning,\n onColumnVisibilityChange: setColumnVisibility,\n });\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: rows\n const rows = useMemo(() => {\n const { rows } = table.getRowModel();\n return rows;\n }, [table.getRowModel().rows, table.getState().columnPinning]);\n\n const isEmpty = useMemo<boolean>(() => {\n return !isFetching && rows.length === 0;\n }, [rows, isFetching]);\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: table get state\n const value = useMemo<TTableContext<TData>>(\n () => ({\n table,\n title,\n isEmpty,\n isFetching,\n\n totalRows,\n\n rowSelection: table.getState().rowSelection,\n\n columnPinning: table.getState().columnPinning,\n\n fetchMoreData,\n }),\n [\n table,\n title,\n\n isEmpty,\n isFetching,\n\n totalRows,\n\n fetchMoreData,\n\n table.getState().columnVisibility,\n\n table.getState().rowSelection,\n table.getState().columnPinning,\n ]\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies: rows\n const rowsValue = useMemo<TTableRowsContext<TData>>(\n () => ({\n rowsLength: rows.length,\n rows,\n }),\n [rows, table.getState().rowSelection, table.getState().columnPinning, table.getState().columnSizing]\n );\n\n return (\n <TableContext.Provider value={value as TTableContext<unknown>}>\n <TableRowsContext.Provider value={rowsValue as TTableRowsContext<unknown>}>{children}</TableRowsContext.Provider>\n </TableContext.Provider>\n );\n};\n","import { ArrowRightIcon, CirclePlus, DownloadIcon, RefreshCwIcon, SearchIcon } from 'lucide-react';\n\nimport { Input } from '@/components/ui/input';\n\nimport { useUITableContext } from '../../hooks/use-table-context';\n\nexport const UITableTooltipFilter: React.FC<React.ComponentProps<typeof Input>> = ({ className: _, ...props }) => {\n return (\n <div className=\"relative\">\n <Input {...props} size=\"lg\" type=\"search\" placeholder=\"Search records...\" className=\"ps-9 pe-9\" />\n <div className=\"pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50\">\n <SearchIcon size={16} />\n </div>\n <button\n className=\"absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50\"\n aria-label=\"Submit search\"\n type=\"submit\"\n >\n <ArrowRightIcon size={16} aria-hidden=\"true\" />\n </button>\n </div>\n );\n};\n\nconst ActionButton: React.FC<React.PropsWithChildren> = ({ children }) => {\n return (\n <button className=\"flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive [&_svg]:size-3.5\">\n {children}\n </button>\n );\n};\n\nexport const UITableTooltipActions: React.FC = () => {\n return (\n <div className=\"flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\">\n <ActionButton>\n <CirclePlus />\n </ActionButton>\n <ActionButton>\n <RefreshCwIcon />\n </ActionButton>\n <ActionButton>\n <DownloadIcon />\n </ActionButton>\n </div>\n );\n};\n\nexport const UITableTooltip: React.FC<React.PropsWithChildren> = ({ children }) => {\n const { title } = useUITableContext();\n return (\n <div data-slot=\"table-tooltip\" className=\"relative m-0 flex w-full flex-0 flex-col flex-wrap items-start space-y-2 p-0 px-2 text-sm\">\n <h3 className=\"font-semibold text-base text-text-positive\">{title}</h3>\n <div className=\"flex w-full flex-1 justify-between\">{children}</div>\n </div>\n );\n};\nUITableTooltip.displayName = 'TableTooltip';\n"],"mappings":"s7CAQA,MAAaA,GAAuC,CAAE,UAElD,EAAC,EAAA,CAAA,SACC,EAACC,EAAAA,CAAAA,SAAAA,CACC,EAAC,EAAA,CAAe,QAAA,YACd,EAAC,EAAA,CAAM,UAAU,iBACf,EAAC,EAAA,CAAkB,OAAM,OAAO,SAAS,UAAU,0BAA2B,EACxE,EACO,CACjB,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAkB,OAAM,OAAO,OAAO,SAAA,GAAS,UAAU,qCAAsC,CAAA,CACjF,CAAA,CAAA,CACT,CAAA,CACM,CCbTC,IAAkD,CAAE,UAE7D,EAACC,EAAAA,CAAAA,SAAAA,CACC,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAU,QAAQ,KAAK,UAAU,mEAC/B,GACS,CAAA,CACG,CACjB,EAAC,EAAA,CAAe,MAAM,QAAQ,UAAU,6DACrC,GACc,CAAA,CAAA,CACT,CCjBDC,IAAmF,CAAE,WAE9F,EAACC,EAAAA,CAAAA,SAAAA,CACC,EAAC,EAAA,CAAe,QAAA,YACd,EAAC,IAAA,CAAE,UAAU,sEAA8D,EAAM,QAAQ,wBAAyB,aAAa,EAAK,EACrH,CACjB,EAAC,EAAA,CAAe,MAAM,iBACpB,EAAC,IAAA,CAAE,UAAU,wBAAgB,EAAM,MAAM,EAAE,CAAC,QAAQ,wBAAyB,wBAAwB,EAAK,EAC3F,CAAA,CAAA,CACT,CCMD,EAA0B,GACpC,CACC,mBAAmB,IACnB,iBAAiB,IACjB,OAAQ,EACR,OAAQ,EACR,YACA,eAAe,QACf,oBAAoB,GACpB,OAAO,KACP,WACW,CAEX,IAAM,EAAgB,GACnB,EAAa,IAAmC,CAC/C,IAAM,EAAa,IAAM,EAEzB,OAAQ,EAAR,CACE,IAAK,QACH,OAAO,KAAK,MAAM,EAAM,EAAW,CAAG,EACxC,IAAK,OACH,OAAO,KAAK,KAAK,EAAM,EAAW,CAAG,EACvC,QACE,OAAO,KAAK,MAAM,EAAM,EAAW,CAAG,IAG5C,CAAC,EAAa,CACf,CAGK,EAAgB,MAAwC,CAC5D,IAAMC,EAAoC,EAAE,CAW5C,OATI,OAAO,GAAc,UAAY,GAAa,IAC5C,IACF,EAAQ,sBAAwB,GAGhC,EAAQ,sBAAwB,GAI7B,GACN,CAAC,EAAW,EAAkB,CAAC,CAE5B,EAAe,EAClB,GAAwB,CACvB,IAAI,EAAe,EAOnB,OAJI,OAAO,GAAc,UAAY,GAAa,IAChD,EAAe,EAAc,EAAK,EAAU,EAGvC,EAAa,eAAe,QAAS,EAAc,EAE5D,CAAC,EAAe,EAAe,EAAU,CAC1C,CAGK,EAAiB,MAAsB,CAE3C,GAAI,OAAO,GAAU,SAInB,OAHI,OAAO,MAAM,EAAM,EAAI,CAAC,OAAO,SAAS,EAAM,CACzC,MAEF,EAAa,EAAM,CAI5B,GAAI,OAAO,GAAU,SAAU,CAC7B,IAAM,EAAe,EAAM,MAAM,CAGjC,GAAI,CAAC,EACH,MAAO,MAIT,IAAM,EAAW,OAAO,EAAa,CAOrC,OALI,OAAO,MAAM,EAAS,EAAI,CAAC,OAAO,SAAS,EAAS,CAE/C,MAGF,EAAa,EAAS,CAG/B,MAAO,OACN,CAAC,EAAO,EAAa,CAAC,CAGnB,EAAsB,MAEtB,IAAqB,KAAO,IAAmB,IAC1C,EAEF,EAAe,QAAQ,KAAM,EAAe,CAAC,QAAQ,MAAO,EAAiB,CACnF,CAAC,EAAgB,EAAkB,EAAe,CAAC,CAEtD,OACE,EAAC,EAAA,CACC,QAAQ,OACR,UAAW,EACT,6DACA,IAAS,MAAQ,UACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,YACjB,IAAS,MAAQ,UACjB,IAAS,MAAQ,UAClB,WAEA,EACD,EAAC,IAAA,CAAA,SAAG,EAAA,CAAwB,CAC3B,IACI,EAGZ,CACD,EAAwB,YAAc,0BC1HtC,MAAaC,IAA2C,CAAE,OAAM,WAAU,WAEtE,EAAC,EAAA,CAAK,KAAM,GAAO,IAAI,KAAK,QAAQ,iBAClC,EAACC,EAAAA,CAAO,UAAU,+BAChB,EAAC,EAAA,CAAe,MAAO,CAAE,gBAAiB,EAAe,IAAI,EAAK,CAAE,UAClE,EAAC,GAAA,CAAc,KAAM,GAAI,UAAU,cAAe,EACnC,EACV,CACT,EAAC,EAAA,CAAK,SAAA,GAAS,QAAQ,OAAO,IAAI,OAAO,MAAM,kBAC7C,EAAC,EAAA,CAAU,UAAU,kDAA0C,GAAqB,CACpF,EAAC,EAAA,CAAU,QAAQ,KAAK,UAAU,iDAC/B,GACS,CAAA,EACP,CAAA,EACF,CCrBX,SAASC,EAAS,CAAE,YAAW,GAAG,GAA8D,CAC9F,OACE,EAACC,EAAkB,KAAA,CACjB,YAAU,WACV,UAAW,EACT,qBACA,yFACA,kCACA,iDACA,sCACA,sCACA,kCACA,uBACA,gCACA,6BACA,kDACA,EACD,CACD,GAAI,WAEJ,EAACA,EAAkB,UAAA,CAAU,YAAU,qBAAqB,UAAU,yEACpE,EAAC,GAAA,CAAU,KAAM,GAAA,CAAM,EACK,EACP,CCzB7B,MAAa,EAAe,EAA6C,KAAK,CAEjE,MAAiD,CAC5D,IAAM,EAAU,EAAI,EAAa,CACjC,GAAI,CAAC,EACH,MAAU,MAAM,sDAAsD,CAExE,OAAO,GCJI,EAAmB,EAAiD,KAAK,CACzE,OAAqD,CAChE,IAAM,EAAM,EAAI,EAAiB,CACjC,GAAI,CAAC,EACH,MAAU,MAAM,4DAA4D,CAE9E,OAAO,GCkBH,EAA0B,GAAiD,CAC/E,IAAM,EAAW,EAAO,aAAa,CACrC,MAAO,CACL,OAAQ,EAAW,GAAwB,IAAA,GAC3C,KAAM,IAAa,OAAS,GAAG,EAAO,SAAS,OAAO,CAAC,IAAM,IAAA,GAC7D,MAAO,IAAa,QAAU,GAAG,EAAO,SAAS,QAAQ,CAAC,IAAM,IAAA,GAChE,SAAU,EAAW,SAAW,WACjC,EAGUC,IAAkF,CAAE,YAAW,WAAU,GAAG,KAErH,EAAC,MAAA,CAAI,YAAU,gBAAgB,UAAU,kGAAkG,GAAI,EAC5I,YACG,CAIJC,EAAmD,GAAM,CAAE,cAE7D,EAAC,QAAA,CACC,YAAU,eACV,MAAO,CAAE,OAAQ,GAAsB,CACvC,UAAW,EACT,kEACA,sCACA,cACA,cACA,qBACA,sBACA,2BACA,uBACA,qBACA,kBACA,yBACA,mBACA,sBACA,yBACA,0BACA,sCACA,wCACA,qCACA,wDACD,CAEA,YACK,CAEV,CACF,EAAc,YAAc,cAE5B,MAAMC,EAAsD,GAAM,CAAE,cAEhE,EAAC,KAAA,CAAG,YAAU,mBAAmB,UAAU,4CACxC,YACE,CAEP,CACF,EAAiB,YAAc,iBAE/B,MAAMC,IASD,CAAE,SAAQ,WAAU,aAAY,oBAAmB,WAAU,GAAG,KAAY,CAC/E,IAAM,EAAQ,EAAuB,EAAO,OAAO,CAC7C,EAAQ,qBAAqB,EAAO,GAAG,eAiB7C,OAfI,EAAO,KAAO,SAEd,EAAC,KAAA,CAAG,YAAU,oBAAoB,MAAO,CAAE,GAAG,EAAO,MAAO,GAAc,CAAE,UAAU,WAAW,GAAI,WACnG,EAAC,MAAA,CAAI,UAAU,6DACb,EAACC,EAAAA,CACC,aAAW,kBACX,QAAS,EACT,gBAAiB,GAAS,CACxB,EAAO,YAAY,CAAC,MAAM,sBAAsB,CAAC,CAAC,EAAM,GAE1D,EACE,EACH,CAIP,EAAC,KAAA,CAAG,YAAU,oBAAoB,cAAa,EAAU,MAAO,CAAE,GAAG,EAAO,QAAO,CAAE,QAAS,EAAO,QAAS,UAAW,EAAG,iBAAiB,CAAE,GAAI,YACjJ,EAAC,MAAA,CAAI,UAAU,2CACb,EAAC,MAAA,CAAI,UAAU,sFACb,EAAC,MAAA,CAAI,UAAU,4DAAoD,EAAW,EAAO,OAAO,UAAU,OAAQ,EAAO,YAAY,CAAC,EAAO,EACrI,EACF,CACL,CAAC,CAAC,SAAU,UAAU,CAAC,SAAS,EAAO,GAAG,EACzC,EAAC,GAAA,CACW,WACV,UAAW,EAAO,OAAO,cAAc,CACvC,UAAU,sDACV,UAAW,EAAO,OAAO,IACzB,WAAY,EAAO,OAAO,IAC1B,QAAS,EAAO,OAAO,IACvB,0BAA2B,EAAO,OAAO,kBACzC,CAEJ,EAAC,EAAA,CAAS,KAAM,EAAW,SAAW,mBACpC,EAAC,MAAA,CACC,cAAe,EAAO,OAAO,UAC7B,YAAa,EAAO,kBAAkB,CACtC,aAAc,EAAO,kBAAkB,CACvC,UAAW,EAAG,mFAAoF,GAAc,YAAY,EAC5H,EACO,GACR,EAIHC,IAQA,CAAE,WAAU,YAAW,YAAW,aAAY,UAAS,+BAAgC,CAC3F,IAAM,EAAgB,MAAkB,CACtC,EAAU,OAAO,EAChB,CAAC,EAAU,CAAC,CAET,EAAiB,MAAkB,CACvC,EAAW,QAAQ,EAClB,CAAC,EAAW,CAAC,CAEV,EAAc,MAAkB,CACpC,EAAQ,GAAM,EACb,CAAC,EAAQ,CAAC,CACb,OACE,EAACC,EAAAA,CAAAA,SAAAA,CACC,EAAC,EAAA,CAAoB,QAAA,YACnB,EAAC,SAAA,CACC,UAAW,EAAG,yHAA0H,EAAU,UAElJ,EAAC,GAAA,EAAA,CAAuB,EACjB,EACW,CACtB,EAAC,EAAA,CAAoB,MAAM,MAAM,UAAU,qBACzC,EAAC,EAAA,CAAkB,UAAU,6FAC3B,EAAC,EAAA,CAAS,KAAM,EAAW,UAAY,kBACrC,EAAC,EAAA,CAAiB,QAAS,YACxB,CAAC,CAAC,GAAY,QACf,EAAC,EAAA,CAAA,SACC,EAAC,GAAA,CAAW,UAAU,SAAA,CAAW,CAAA,CACZ,CAAA,EACN,EACV,CACX,EAAC,EAAA,CAAS,KAAO,EAAuB,SAAZ,oBAC1B,EAAC,EAAA,CAAiB,QAAS,YACxB,EAAW,QAAU,cACtB,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAa,UAAU,SAAA,CAAW,CAAA,CACd,CAAA,EACN,CACnB,EAAC,EAAA,CAAiB,QAAS,YACxB,EAAW,QAAU,eACtB,EAAC,EAAA,CAAA,SACC,EAAC,EAAA,CAAc,UAAU,SAAA,CAAW,CAAA,CACf,CAAA,EACN,CAAA,EACV,CAAA,EACO,CACpB,EAAC,GAAA,EAAA,CAAwB,CACzB,EAAC,EAAA,CAAkB,UAAU,4FAC3B,EAAC,EAAA,CAAiB,YAAe,EAA0B,GAAM,WAAE,aAEjE,EAAC,EAAA,CAAA,SACC,EAAC,GAAA,CAAW,UAAU,SAAA,CAAW,CAAA,CACZ,CAAA,EACN,EACD,GACA,CAAA,CAAA,CACT,EAIbC,IAAsG,CAAE,SAAQ,WAAU,GAAG,KAE/H,EAAC,QAAA,CACC,YAAU,aACV,MAAO,CAAE,OAAQ,GAAG,EAAO,IAAK,CAChC,UAAW,EACT,uBACA,mIACA,cACA,cACA,yBACA,2BACA,cACA,gBACA,sBACA,uBACA,sCACA,qCACA,0CACA,4CACD,CACD,GAAI,EAEH,YACK,CAINC,EAMF,GAAM,CAAE,WAAU,MAAK,aAAY,iBAAgB,YAAW,GAAG,KAAY,CAC/E,GAAM,CAAE,cAAe,GAAM,GAAmB,CAChD,OACE,EAAC,KAAA,CACC,YAAU,YACV,aAAY,EAAW,MACvB,IAAK,GAAQ,EAAe,eAAe,EAAK,CAChD,MAAO,CACL,UAAW,cAAc,EAAW,MAAM,KAC3C,CACD,UAAW,EAAG,QAAS,EAAU,CACjC,GAAI,WAEH,EAAI,iBAAiB,CAAC,IAAI,GAClB,EAAC,EAAA,CAAgC,OAAM,UAAU,mCAA/B,EAAK,GAA8D,CAC5F,EACC,EAEP,CACF,EAAW,YAAc,WAEzB,MAAMC,EAMF,GAAM,CAAE,OAAM,WAAU,YAAW,GAAG,KAAY,CACpD,GAAM,CAAE,aAAc,GAAM,GAAmB,CACzC,EAAW,EAAK,OAAO,aAAa,CACpC,EAAQ,EAAuB,EAAK,OAAO,CAC3C,EAAQ,kBAAkB,EAAK,OAAO,GAAG,eAqB/C,OApBI,GACF,QAAQ,IAAI,wBAAyB,EAAK,OAAO,gBAAgB,CAAC,CAGhE,EAAK,OAAO,KAAO,SAEnB,EAAC,KAAA,CAAG,YAAU,aAAa,MAAO,CAAE,GAAG,EAAO,MAAO,GAAc,CAAE,UAAW,EAAG,4CAA6C,EAAU,CAAE,GAAI,WAC9I,EAAC,MAAA,CAAI,UAAU,4EACb,EAACL,EAAAA,CACC,aAAW,aACX,QAAS,EAAK,IAAI,eAAe,CACjC,gBAAiB,GAAS,CACxB,EAAK,IAAI,eAAe,CAAC,CAAC,EAAM,GAElC,EACE,EACH,CAKP,EAAC,KAAA,CACC,YAAU,aACV,cAAa,EACb,MAAO,CAAE,GAAG,EAAO,QAAO,CAC1B,UAAW,EAAG,GAAY,EAAK,OAAO,gBAAgB,GAAK,GAAK,UAAW,EAAU,CACrF,GAAI,WAEH,EAAW,EAAK,OAAO,UAAU,KAAM,EAAK,YAAY,CAAC,EACvD,EAEP,CACF,EAAY,YAAc,YAE1B,MAAMM,OAEF,EAAC,MAAA,CAAI,UAAU,oHACb,EAAC,MAAA,CAAI,UAAU,6CACb,EAAC,GAAA,CAAQ,YAAa,EAAG,KAAM,IAAM,CACrC,EAAC,IAAA,CAAA,SAAE,oBAAA,CAAqB,CAAA,EACpB,EACF,CAIGC,IAAoD,CAAE,cAE/D,EAAC,QAAA,CAAM,YAAU,eAAe,UAAU,iGACvC,YACK,CAICC,IAAuD,CAAE,cAAe,CACnF,GAAM,CAAE,QAAO,UAAS,aAAY,YAAW,iBAAkB,GAAmB,CAC9E,CAAE,OAAM,cAAe,IAAuB,CAE9C,EAAoB,EAA8B,KAAK,CACvD,EAAW,EAAgC,KAAK,CAShD,EAAiB,MAAc,CACnC,IAAM,EAAU,EAAM,gBAAgB,CAChCC,EAAkD,EAAE,CAK1D,OAJA,EAAQ,QAAQ,GAAU,CACxB,EAAS,YAAY,EAAO,GAAG,QAAU,EAAO,SAAS,EAAI,EAC7D,EAAS,SAAS,EAAO,OAAO,GAAG,QAAU,EAAO,OAAO,SAAS,EAAI,GACxE,CACK,GACN,CAAC,EAAM,UAAU,CAAC,iBAAkB,EAAM,UAAU,CAAC,aAAa,CAAC,CAGhE,EAAiB,GAAoD,CACzE,MAAO,EACP,qBAAwB,EAAkB,QAC1C,iBAAoB,GAEpB,eACE,OAAO,OAAW,KAAe,UAAU,UAAU,QAAQ,UAAU,GAAK,GAAK,GAAW,GAAS,uBAAuB,CAAC,OAAS,IAAA,GACxI,SAAU,EACX,CAAC,CAGI,EAA2B,EAC/B,KAAO,IAA2C,CAChD,GAAI,CAAC,EAAgB,OAAO,KAC5B,GAAM,CAAE,eAAc,YAAW,gBAAiB,EAE9C,EAAe,EAAY,EAAe,KAAO,CAAC,GAAc,GAAa,EAAa,GAC5F,KAAiB,EAGrB,CAAC,EAAY,EAAY,EAAW,EAAc,CACnD,CAOD,OAJA,MAAgB,CACd,EAAyB,EAAkB,QAAQ,EAClD,CAAC,EAAyB,CAAC,CAG5B,EAAC,GAAA,CACC,UAAU,aACV,MAAO,CAAE,UAAW,EAAM,QAAQ,sBAAuB,CACzD,UAAU,wHAEV,EAAC,EAAA,CAAe,UAAU,yBACxB,EAAC,MAAA,CAAI,IAAK,EAAmB,UAAU,0BAA0B,SAAU,GAAK,EAAyB,EAAE,cAAc,WACvH,EAAC,QAAA,CACC,IAAK,EACL,YAAU,QACV,MAAO,CACL,GAAG,EACH,MAAO,EAAM,cAAc,CAC5B,CACD,UAAU,8KAEV,EAAC,EAAA,CAAA,SACE,EAAM,iBAAiB,CAAC,IAAI,GAC3B,EAAC,EAAA,CAAA,SACE,EAAY,QAAQ,IAAI,GACvB,EAAC,GAAA,CAES,SACR,SAAU,EAAO,OAAO,aAAa,CACrC,WAAY,EAAO,OAAO,eAAe,CACzC,kBAAmB,EAAM,sBAAsB,EAJ1C,EAAO,GAKZ,CACF,CAAA,CATmB,EAAY,GAUhB,CACnB,CAAA,CACY,CAChB,EAAC,GAAA,CAAY,YAAU,aAAa,OAAQ,EAAe,cAAc,UACtE,EAAe,iBAAiB,CAAC,IAAI,GAAc,CAClD,IAAM,EAAM,EAAK,EAAW,OAC5B,OAAO,EAAC,EAAA,CAAwB,aAAY,EAAW,MAAY,MAAiB,aAA4B,kBAAxF,EAAI,GAAsG,EAClI,EACU,CAAA,EACR,CACP,GAAW,EAAC,GAAA,EAAA,CAAe,CAAA,EACxB,EACS,CACjB,EAAC,EAAA,EAAA,CAAkB,CAClB,IACmB,ECtapBC,IAIA,CAAE,UAAS,QAAO,qBAEpB,EAAC,MAAA,CAAI,UAAU,0CACb,EAACC,EAAAA,CAAkB,UAA0B,mBAAmB,CAChE,EAAC,IAAA,CAAE,UAAU,mBAAW,GAAU,CAAA,EAC9B,CAIG,OAAsB,CACjC,GAAM,CAAE,SAAU,GAAmB,CAC/B,CAAC,EAAK,GAAU,EAAuC,KAAK,CAElE,OACE,EAAC,EAAA,CAAe,YAAa,GAAI,UAAW,EAAG,UAAW,IAAQ,KAAO,WAAa,WAAW,UAC/F,EAAC,MAAA,CAAI,UAAU,4DACb,EAAC,MAAA,CAAI,UAAU,mBACb,EAAC,EAAA,CAAS,KAAM,IAAQ,UAAY,UAAY,kBAC9C,EAAC,MAAA,CAAI,UAAU,8CACb,EAAC,IAAA,CAAE,UAAU,4BAAmB,sBAAsB,CACtD,EAACC,EAAAA,EAAAA,CAAY,CACb,EAAC,MAAA,CAAI,UAAU,oCACZ,EAAM,eAAe,CAAC,IAAI,GACrB,CAAC,SAAU,UAAU,CAAC,SAAS,EAAO,GAAG,CAAS,KAEpD,EAAC,GAAA,CAEC,QAAS,EAAO,cAAc,CAC9B,MAAO,OAAO,EAAO,UAAU,OAAO,CACtC,gBAAiB,GAAS,EAAO,iBAAiB,CAAC,CAAC,EAAM,EAHrD,EAAO,GAIZ,CAEJ,EACE,GACF,EACG,CACX,EAAC,EAAA,CAAS,KAAM,IAAQ,UAAY,UAAY,kBAC9C,EAAC,MAAA,CAAI,UAAU,uCACb,EAAC,EAAA,CAAO,QAAQ,UAAU,MAAM,kBAC9B,EAAC,EAAA,EAAA,CAAiB,CAAA,aAAA,EAEX,EACL,EACG,CAAA,EACP,CACN,EAAC,MAAA,CAAI,UAAU,mFACb,EAAC,SAAA,CACC,UAAW,EAAG,kEAAmE,IAAQ,WAAa,UAAU,CAChH,YAAe,EAAO,IAAQ,UAAY,KAAO,UAAU,WAE3D,EAAC,GAAA,CAAa,KAAM,GAAA,CAAM,CAC1B,EAAC,OAAA,CAAK,UAAU,kDAAyC,WAAc,CAAA,EAChE,CACT,EAACA,EAAAA,EAAAA,CAAY,CACb,EAAC,SAAA,CACC,UAAW,EAAG,kEAAmE,IAAQ,WAAa,UAAU,CAChH,YAAe,EAAO,IAAQ,UAAY,KAAO,UAAU,WAE3D,EAAC,EAAA,CAAe,KAAM,GAAA,CAAM,CAC5B,EAAC,OAAA,CAAK,UAAU,kDAAyC,WAAc,CAAA,EAChE,CACT,EAACA,EAAAA,EAAAA,CAAY,GACT,CAAA,EACF,EACS,ECxEfC,GAAmC,CACvC,cAAe,CAAE,MAAO,CAAC,UAAU,CAAE,CACtC,CAEY,IAA0C,CACrD,QACA,aAAa,GACb,OACA,UACA,YAEA,gBACA,cACwD,CACxD,GAAM,CAAC,EAAc,GAAmB,EAA4B,EAAE,CAAC,CACjE,CAAC,EAAe,GAAoB,EAA6B,CAAE,MAAO,CAAC,UAAU,CAAE,CAAC,CACxF,CAAC,EAAkB,GAAuB,EAA0B,EAAE,CAAC,CAEvE,EAAQ,GAAqB,CACjC,aAAc,GACR,OACN,UACA,MAAO,CACL,eACA,gBACA,mBACD,CACD,cAAe,CACb,QAAS,GACT,KAAM,IACN,QAAS,IACV,CACD,iBAAkB,WAClB,sBAAuB,MAEvB,mBAAoB,GACpB,qBAAsB,GACtB,wBAAyB,GAEzB,gBAAiB,GAAiB,CAElC,qBAAsB,EACtB,sBAAuB,EACvB,yBAA0B,EAC3B,CAAC,CAGI,EAAO,MAAc,CACzB,GAAM,CAAE,KAAA,GAAS,EAAM,aAAa,CACpC,OAAOC,GACN,CAAC,EAAM,aAAa,CAAC,KAAM,EAAM,UAAU,CAAC,cAAc,CAAC,CAExD,EAAU,MACP,CAAC,GAAc,EAAK,SAAW,EACrC,CAAC,EAAM,EAAW,CAAC,CAGhB,EAAQ,OACL,CACL,QACA,QACA,UACA,aAEA,YAEA,aAAc,EAAM,UAAU,CAAC,aAE/B,cAAe,EAAM,UAAU,CAAC,cAEhC,gBACD,EACD,CACE,EACA,EAEA,EACA,EAEA,EAEA,EAEA,EAAM,UAAU,CAAC,iBAEjB,EAAM,UAAU,CAAC,aACjB,EAAM,UAAU,CAAC,cAClB,CACF,CAGK,EAAY,OACT,CACL,WAAY,EAAK,OACjB,OACD,EACD,CAAC,EAAM,EAAM,UAAU,CAAC,aAAc,EAAM,UAAU,CAAC,cAAe,EAAM,UAAU,CAAC,aAAa,CACrG,CAED,OACE,EAAC,EAAa,SAAA,CAAgB,iBAC5B,EAAC,EAAiB,SAAA,CAAS,MAAO,EAA0C,YAAqC,EAC3F,ECzGfC,IAAsE,CAAE,UAAW,EAAG,GAAG,KAElG,EAAC,MAAA,CAAI,UAAU,qBACb,EAAC,EAAA,CAAM,GAAI,EAAO,KAAK,KAAK,KAAK,SAAS,YAAY,oBAAoB,UAAU,aAAc,CAClG,EAAC,MAAA,CAAI,UAAU,iJACb,EAAC,GAAA,CAAW,KAAM,GAAA,CAAM,EACpB,CACN,EAAC,SAAA,CACC,UAAU,0XACV,aAAW,gBACX,KAAK,kBAEL,EAAC,GAAA,CAAe,KAAM,GAAI,cAAY,QAAS,EACxC,GACL,CAIJC,GAAmD,CAAE,cAEvD,EAAC,SAAA,CAAO,UAAU,8TACf,YACM,CAIAC,OAET,EAAC,MAAA,CAAI,UAAU,iIACb,EAAC,EAAA,CAAA,SACC,EAAC,GAAA,EAAA,CAAa,CAAA,CACD,CACf,EAAC,EAAA,CAAA,SACC,EAAC,GAAA,EAAA,CAAgB,CAAA,CACJ,CACf,EAAC,EAAA,CAAA,SACC,EAAC,GAAA,EAAA,CAAe,CAAA,CACH,GACX,CAIGC,GAAqD,CAAE,cAAe,CACjF,GAAM,CAAE,SAAU,GAAmB,CACrC,OACE,EAAC,MAAA,CAAI,YAAU,gBAAgB,UAAU,sGACvC,EAAC,KAAA,CAAG,UAAU,sDAA8C,GAAW,CACvE,EAAC,MAAA,CAAI,UAAU,qCAAsC,YAAe,CAAA,EAChE,EAGV,EAAe,YAAc"}