19c223627b62396dac6fe80758e2593a9ef8eb74a61353e00d1e8145b971826b7ea4239a22e18f54590ff4b76d65eb828b009cd75ffeae3dc9b86c84dde181 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. import type { CSSProperties, ComponentInternalInstance, Ref } from 'vue';
  2. export type Instance = ComponentInternalInstance;
  3. export type Alignment = 'auto' | 'smart' | 'center' | 'start' | 'end';
  4. export type ItemSize = (idx: number) => number;
  5. export type Direction = 'ltr' | 'rtl';
  6. export type LayoutDirection = 'horizontal' | 'vertical';
  7. export type RTLOffsetType = 'negative' | 'positive-descending' | 'positive-ascending';
  8. export type ItemProps<T> = {
  9. data: T;
  10. style: CSSProperties;
  11. scrolling?: boolean;
  12. index: number;
  13. };
  14. export type ListItem = {
  15. offset: number;
  16. size: number;
  17. };
  18. export type ListCache = {
  19. items: Record<string, ListItem>;
  20. estimatedItemSize: number;
  21. lastVisitedIndex: number;
  22. clearCacheAfterIndex: (idx: number, forceUpdate?: boolean) => void;
  23. };
  24. export type GridCache = {
  25. column: Record<string, ListItem>;
  26. row: Record<string, ListItem>;
  27. estimatedColumnWidth: number;
  28. estimatedRowHeight: number;
  29. lastVisitedColumnIndex: number;
  30. lastVisitedRowIndex: number;
  31. };
  32. export type ScrollDir = 'forwards' | 'backwards';
  33. export type ListItemSizer<T, P extends InitListCacheFunc<T>> = (props: T, index: number, cache: ReturnType<P>) => number;
  34. export type GetEstimatedTotalSize<T, P extends InitCacheFunc<T, GridCache | ListCache>> = (props: T, cache: ReturnType<P>) => number;
  35. export type GetOffset<T, P extends InitListCacheFunc<T>> = (props: T, idx: number, alignment: Alignment, offset: number, cache: ReturnType<P>) => number;
  36. export type GetStartIndexForOffset<T, P extends InitCacheFunc<T, GridCache | ListCache>> = (props: T, offset: number, cache: ReturnType<P>) => number;
  37. export type GetStopIndexForStartIndex<T, P extends InitCacheFunc<T, GridCache | ListCache>> = (props: T, startIndex: number, scrollOffset: number, cache: ReturnType<P>) => number;
  38. export type PropValidator<T> = (props: T) => void;
  39. export type InitCacheFunc<T, P> = (props: T, cache: Instance) => P;
  40. export type InitListCacheFunc<T> = InitCacheFunc<T, ListCache>;
  41. export type InitGridCacheFunc<T> = InitCacheFunc<T, GridCache>;
  42. export type ListConstructorProps<T, P extends InitListCacheFunc<T> = InitListCacheFunc<T>> = {
  43. name?: string;
  44. getItemOffset: ListItemSizer<T, P>;
  45. getEstimatedTotalSize: GetEstimatedTotalSize<T, P>;
  46. getItemSize: ListItemSizer<T, P>;
  47. getOffset: GetOffset<T, P>;
  48. getStartIndexForOffset: GetStartIndexForOffset<T, P>;
  49. getStopIndexForStartIndex: GetStopIndexForStartIndex<T, P>;
  50. initCache: P;
  51. clearCache: boolean;
  52. validateProps: PropValidator<T>;
  53. };
  54. export type ExposesStates = {
  55. isScrolling: boolean;
  56. updateRequested: boolean;
  57. };
  58. export type SharedExposes = {
  59. windowRef: Ref<HTMLElement>;
  60. innerRef: Ref<HTMLElement>;
  61. getItemStyleCache: (_: any, __: any, ___: any) => CSSProperties;
  62. };
  63. export type ListExposes = {
  64. scrollTo: (offset: number) => void;
  65. scrollToItem: (idx: number, alignment?: Alignment) => void;
  66. states: {
  67. scrollDir: Direction;
  68. scrollOffset: number;
  69. } & ExposesStates;
  70. } & SharedExposes;
  71. export type GridExposes = {
  72. states: {
  73. scrollLeft: number;
  74. scrollTop: number;
  75. xAxisScrollDir: Direction;
  76. yAxisScrollDir: Direction;
  77. } & ExposesStates;
  78. scrollTo: (props: {
  79. scrollLeft: number;
  80. scrollTop: number;
  81. }) => void;
  82. scrollToItem: (columnIndex?: number, rowIndex?: number, alignment?: Alignment) => void;
  83. } & SharedExposes;
  84. export type ScrollbarExpose = {
  85. onMouseUp: () => void;
  86. };
  87. export type GetGridOffset<T, P extends InitGridCacheFunc<T>> = (props: T, index: number, alignment: Alignment, offset: number, cache: ReturnType<P>, scrollbarWidth: number) => number;
  88. export type GetPosition<T, P extends InitGridCacheFunc<T>> = (props: T, index: number, cache: ReturnType<P>) => [number, number];
  89. export type GridConstructorProps<T, P extends InitGridCacheFunc<T> = InitGridCacheFunc<T>> = {
  90. name?: string;
  91. getColumnOffset: GetGridOffset<T, P>;
  92. getColumnPosition: GetPosition<T, P>;
  93. getColumnStartIndexForOffset: GetStartIndexForOffset<T, P>;
  94. getColumnStopIndexForStartIndex: GetStopIndexForStartIndex<T, P>;
  95. getEstimatedTotalHeight: GetEstimatedTotalSize<T, P>;
  96. getEstimatedTotalWidth: GetEstimatedTotalSize<T, P>;
  97. getRowOffset: GetGridOffset<T, P>;
  98. getRowPosition: GetPosition<T, P>;
  99. getRowStartIndexForOffset: GetStartIndexForOffset<T, P>;
  100. getRowStopIndexForStartIndex: GetStopIndexForStartIndex<T, P>;
  101. initCache: P;
  102. injectToInstance?: (instance: Instance, cache: Ref<ReturnType<P>>) => void;
  103. clearCache: boolean;
  104. validateProps: PropValidator<T>;
  105. };
  106. /**
  107. * Instance methods and emits
  108. */
  109. export type GridDefaultSlotParams = {
  110. columnIndex: number;
  111. rowIndex: number;
  112. data: any;
  113. key: number | string;
  114. isScrolling?: boolean;
  115. style: CSSProperties;
  116. };
  117. export type GridItemRenderedEvtParams = {
  118. columnCacheStart: number;
  119. columnCacheEnd: number;
  120. rowCacheStart: number;
  121. rowCacheEnd: number;
  122. columnVisibleStart: number;
  123. columnVisibleEnd: number;
  124. rowVisibleStart: number;
  125. rowVisibleEnd: number;
  126. };
  127. export type GridScrollOptions = {
  128. scrollLeft?: number;
  129. scrollTop?: number;
  130. };
  131. export type GridItemKeyGetter = <T extends {
  132. [key: string | number]: any;
  133. }>(args: {
  134. columnIndex: number;
  135. data: T;
  136. rowIndex: number;
  137. }) => string | number;