@lucasbernardosn/react-table 0.0.0-stage → 0.1.0

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 (267) hide show
  1. package/LICENSE +21 -0
  2. package/dist/_virtual/_rolldown/runtime.js +13 -0
  3. package/dist/components/column-menu/column-menu-check.d.ts +8 -0
  4. package/dist/components/column-menu/column-menu-check.d.ts.map +1 -0
  5. package/dist/components/column-menu/column-menu-check.js +17 -0
  6. package/dist/components/column-menu/column-menu-check.js.map +1 -0
  7. package/dist/components/column-menu/column-menu-hide-item.d.ts +23 -0
  8. package/dist/components/column-menu/column-menu-hide-item.d.ts.map +1 -0
  9. package/dist/components/column-menu/column-menu-hide-item.js +28 -0
  10. package/dist/components/column-menu/column-menu-hide-item.js.map +1 -0
  11. package/dist/components/column-menu/column-menu-labels.d.ts +21 -0
  12. package/dist/components/column-menu/column-menu-labels.d.ts.map +1 -0
  13. package/dist/components/column-menu/column-menu-labels.js +14 -0
  14. package/dist/components/column-menu/column-menu-labels.js.map +1 -0
  15. package/dist/components/column-menu/column-menu-pin-items.d.ts +25 -0
  16. package/dist/components/column-menu/column-menu-pin-items.d.ts.map +1 -0
  17. package/dist/components/column-menu/column-menu-pin-items.js +65 -0
  18. package/dist/components/column-menu/column-menu-pin-items.js.map +1 -0
  19. package/dist/components/column-menu/column-menu-popup.d.ts +39 -0
  20. package/dist/components/column-menu/column-menu-popup.d.ts.map +1 -0
  21. package/dist/components/column-menu/column-menu-popup.js +66 -0
  22. package/dist/components/column-menu/column-menu-popup.js.map +1 -0
  23. package/dist/components/column-menu/column-menu-root.d.ts +34 -0
  24. package/dist/components/column-menu/column-menu-root.d.ts.map +1 -0
  25. package/dist/components/column-menu/column-menu-root.js +36 -0
  26. package/dist/components/column-menu/column-menu-root.js.map +1 -0
  27. package/dist/components/column-menu/column-menu-sort-items.d.ts +29 -0
  28. package/dist/components/column-menu/column-menu-sort-items.d.ts.map +1 -0
  29. package/dist/components/column-menu/column-menu-sort-items.js +61 -0
  30. package/dist/components/column-menu/column-menu-sort-items.js.map +1 -0
  31. package/dist/components/column-menu/column-menu-trigger.d.ts +23 -0
  32. package/dist/components/column-menu/column-menu-trigger.d.ts.map +1 -0
  33. package/dist/components/column-menu/column-menu-trigger.js +38 -0
  34. package/dist/components/column-menu/column-menu-trigger.js.map +1 -0
  35. package/dist/components/column-menu/index.d.ts +2 -0
  36. package/dist/components/column-menu/index.js +2 -0
  37. package/dist/components/column-menu/index.parts.d.ts +13 -0
  38. package/dist/components/column-menu/index.parts.d.ts.map +1 -0
  39. package/dist/components/column-menu/index.parts.js +20 -0
  40. package/dist/components/column-menu/index.parts.js.map +1 -0
  41. package/dist/components/columns-panel/columns-panel-item.d.ts +31 -0
  42. package/dist/components/columns-panel/columns-panel-item.d.ts.map +1 -0
  43. package/dist/components/columns-panel/columns-panel-item.js +92 -0
  44. package/dist/components/columns-panel/columns-panel-item.js.map +1 -0
  45. package/dist/components/columns-panel/columns-panel-root.d.ts +51 -0
  46. package/dist/components/columns-panel/columns-panel-root.d.ts.map +1 -0
  47. package/dist/components/columns-panel/columns-panel-root.js +134 -0
  48. package/dist/components/columns-panel/columns-panel-root.js.map +1 -0
  49. package/dist/components/columns-panel/get-columns-panel-column-order.d.ts +16 -0
  50. package/dist/components/columns-panel/get-columns-panel-column-order.d.ts.map +1 -0
  51. package/dist/components/columns-panel/get-columns-panel-column-order.js +24 -0
  52. package/dist/components/columns-panel/get-columns-panel-column-order.js.map +1 -0
  53. package/dist/components/columns-panel/index.d.ts +2 -0
  54. package/dist/components/columns-panel/index.js +2 -0
  55. package/dist/components/columns-panel/index.parts.d.ts +8 -0
  56. package/dist/components/columns-panel/index.parts.d.ts.map +1 -0
  57. package/dist/components/columns-panel/index.parts.js +12 -0
  58. package/dist/components/columns-panel/index.parts.js.map +1 -0
  59. package/dist/components/data-table/body/data-table-body.d.ts +58 -0
  60. package/dist/components/data-table/body/data-table-body.d.ts.map +1 -0
  61. package/dist/components/data-table/body/data-table-body.js +99 -0
  62. package/dist/components/data-table/body/data-table-body.js.map +1 -0
  63. package/dist/components/data-table/body/data-table-cell.d.ts +26 -0
  64. package/dist/components/data-table/body/data-table-cell.d.ts.map +1 -0
  65. package/dist/components/data-table/body/data-table-cell.js +80 -0
  66. package/dist/components/data-table/body/data-table-cell.js.map +1 -0
  67. package/dist/components/data-table/body/data-table-empty.d.ts +38 -0
  68. package/dist/components/data-table/body/data-table-empty.d.ts.map +1 -0
  69. package/dist/components/data-table/body/data-table-empty.js +71 -0
  70. package/dist/components/data-table/body/data-table-empty.js.map +1 -0
  71. package/dist/components/data-table/body/data-table-row-focus.d.ts +32 -0
  72. package/dist/components/data-table/body/data-table-row-focus.d.ts.map +1 -0
  73. package/dist/components/data-table/body/data-table-row-focus.js +58 -0
  74. package/dist/components/data-table/body/data-table-row-focus.js.map +1 -0
  75. package/dist/components/data-table/body/data-table-row.d.ts +67 -0
  76. package/dist/components/data-table/body/data-table-row.d.ts.map +1 -0
  77. package/dist/components/data-table/body/data-table-row.js +150 -0
  78. package/dist/components/data-table/body/data-table-row.js.map +1 -0
  79. package/dist/components/data-table/body/use-data-table-row-focus-recovery.d.ts +19 -0
  80. package/dist/components/data-table/body/use-data-table-row-focus-recovery.d.ts.map +1 -0
  81. package/dist/components/data-table/body/use-data-table-row-focus-recovery.js +64 -0
  82. package/dist/components/data-table/body/use-data-table-row-focus-recovery.js.map +1 -0
  83. package/dist/components/data-table/header/data-table-header-button.d.ts +25 -0
  84. package/dist/components/data-table/header/data-table-header-button.d.ts.map +1 -0
  85. package/dist/components/data-table/header/data-table-header-button.js +57 -0
  86. package/dist/components/data-table/header/data-table-header-button.js.map +1 -0
  87. package/dist/components/data-table/header/data-table-header-cell.d.ts +34 -0
  88. package/dist/components/data-table/header/data-table-header-cell.d.ts.map +1 -0
  89. package/dist/components/data-table/header/data-table-header-cell.js +97 -0
  90. package/dist/components/data-table/header/data-table-header-cell.js.map +1 -0
  91. package/dist/components/data-table/header/data-table-header-content.d.ts +21 -0
  92. package/dist/components/data-table/header/data-table-header-content.d.ts.map +1 -0
  93. package/dist/components/data-table/header/data-table-header-content.js +37 -0
  94. package/dist/components/data-table/header/data-table-header-content.js.map +1 -0
  95. package/dist/components/data-table/header/data-table-header-row.d.ts +15 -0
  96. package/dist/components/data-table/header/data-table-header-row.d.ts.map +1 -0
  97. package/dist/components/data-table/header/data-table-header-row.js +28 -0
  98. package/dist/components/data-table/header/data-table-header-row.js.map +1 -0
  99. package/dist/components/data-table/header/data-table-header.d.ts +46 -0
  100. package/dist/components/data-table/header/data-table-header.d.ts.map +1 -0
  101. package/dist/components/data-table/header/data-table-header.js +80 -0
  102. package/dist/components/data-table/header/data-table-header.js.map +1 -0
  103. package/dist/components/data-table/index.d.ts +2 -0
  104. package/dist/components/data-table/index.js +2 -0
  105. package/dist/components/data-table/index.parts.d.ts +32 -0
  106. package/dist/components/data-table/index.parts.d.ts.map +1 -0
  107. package/dist/components/data-table/index.parts.js +60 -0
  108. package/dist/components/data-table/index.parts.js.map +1 -0
  109. package/dist/components/data-table/loading/get-data-table-loading-without-rows.d.ts +16 -0
  110. package/dist/components/data-table/loading/get-data-table-loading-without-rows.d.ts.map +1 -0
  111. package/dist/components/data-table/loading/get-data-table-loading-without-rows.js +18 -0
  112. package/dist/components/data-table/loading/get-data-table-loading-without-rows.js.map +1 -0
  113. package/dist/components/data-table/loading/use-data-table-loading-inert.d.ts +16 -0
  114. package/dist/components/data-table/loading/use-data-table-loading-inert.d.ts.map +1 -0
  115. package/dist/components/data-table/loading/use-data-table-loading-inert.js +54 -0
  116. package/dist/components/data-table/loading/use-data-table-loading-inert.js.map +1 -0
  117. package/dist/components/data-table/loading/use-data-table-loading.d.ts +13 -0
  118. package/dist/components/data-table/loading/use-data-table-loading.d.ts.map +1 -0
  119. package/dist/components/data-table/loading/use-data-table-loading.js +40 -0
  120. package/dist/components/data-table/loading/use-data-table-loading.js.map +1 -0
  121. package/dist/components/data-table/pagination/data-table-page-button.d.ts +45 -0
  122. package/dist/components/data-table/pagination/data-table-page-button.d.ts.map +1 -0
  123. package/dist/components/data-table/pagination/data-table-page-button.js +67 -0
  124. package/dist/components/data-table/pagination/data-table-page-button.js.map +1 -0
  125. package/dist/components/data-table/pagination/data-table-page-size-select.d.ts +47 -0
  126. package/dist/components/data-table/pagination/data-table-page-size-select.d.ts.map +1 -0
  127. package/dist/components/data-table/pagination/data-table-page-size-select.js +68 -0
  128. package/dist/components/data-table/pagination/data-table-page-size-select.js.map +1 -0
  129. package/dist/components/data-table/pagination/data-table-page-status.d.ts +43 -0
  130. package/dist/components/data-table/pagination/data-table-page-status.d.ts.map +1 -0
  131. package/dist/components/data-table/pagination/data-table-page-status.js +48 -0
  132. package/dist/components/data-table/pagination/data-table-page-status.js.map +1 -0
  133. package/dist/components/data-table/pagination/data-table-pagination.d.ts +38 -0
  134. package/dist/components/data-table/pagination/data-table-pagination.d.ts.map +1 -0
  135. package/dist/components/data-table/pagination/data-table-pagination.js +87 -0
  136. package/dist/components/data-table/pagination/data-table-pagination.js.map +1 -0
  137. package/dist/components/data-table/pagination/data-table-row-range.d.ts +49 -0
  138. package/dist/components/data-table/pagination/data-table-row-range.d.ts.map +1 -0
  139. package/dist/components/data-table/pagination/data-table-row-range.js +63 -0
  140. package/dist/components/data-table/pagination/data-table-row-range.js.map +1 -0
  141. package/dist/components/data-table/pagination/data-table-selected-count.d.ts +37 -0
  142. package/dist/components/data-table/pagination/data-table-selected-count.d.ts.map +1 -0
  143. package/dist/components/data-table/pagination/data-table-selected-count.js +44 -0
  144. package/dist/components/data-table/pagination/data-table-selected-count.js.map +1 -0
  145. package/dist/components/data-table/pagination/use-data-table-page-scroll-reset.d.ts +15 -0
  146. package/dist/components/data-table/pagination/use-data-table-page-scroll-reset.d.ts.map +1 -0
  147. package/dist/components/data-table/pagination/use-data-table-page-scroll-reset.js +38 -0
  148. package/dist/components/data-table/pagination/use-data-table-page-scroll-reset.js.map +1 -0
  149. package/dist/components/data-table/resize/data-table-resize-handle.d.ts +48 -0
  150. package/dist/components/data-table/resize/data-table-resize-handle.d.ts.map +1 -0
  151. package/dist/components/data-table/resize/data-table-resize-handle.js +115 -0
  152. package/dist/components/data-table/resize/data-table-resize-handle.js.map +1 -0
  153. package/dist/components/data-table/resize/use-data-table-resize-scroll.d.ts +18 -0
  154. package/dist/components/data-table/resize/use-data-table-resize-scroll.d.ts.map +1 -0
  155. package/dist/components/data-table/resize/use-data-table-resize-scroll.js +55 -0
  156. package/dist/components/data-table/resize/use-data-table-resize-scroll.js.map +1 -0
  157. package/dist/components/data-table/root/data-table-grid-classes.d.ts +10 -0
  158. package/dist/components/data-table/root/data-table-grid-classes.d.ts.map +1 -0
  159. package/dist/components/data-table/root/data-table-grid-classes.js +22 -0
  160. package/dist/components/data-table/root/data-table-grid-classes.js.map +1 -0
  161. package/dist/components/data-table/root/data-table-root.d.ts +41 -0
  162. package/dist/components/data-table/root/data-table-root.d.ts.map +1 -0
  163. package/dist/components/data-table/root/data-table-root.js +72 -0
  164. package/dist/components/data-table/root/data-table-root.js.map +1 -0
  165. package/dist/components/data-table/root/data-table-scroll-area.d.ts +21 -0
  166. package/dist/components/data-table/root/data-table-scroll-area.d.ts.map +1 -0
  167. package/dist/components/data-table/root/data-table-scroll-area.js +127 -0
  168. package/dist/components/data-table/root/data-table-scroll-area.js.map +1 -0
  169. package/dist/components/data-table/root/get-data-table-column-layout.d.ts +45 -0
  170. package/dist/components/data-table/root/get-data-table-column-layout.d.ts.map +1 -0
  171. package/dist/components/data-table/root/get-data-table-column-layout.js +55 -0
  172. package/dist/components/data-table/root/get-data-table-column-layout.js.map +1 -0
  173. package/dist/components/data-table/root/get-data-table-column-pinning.d.ts +46 -0
  174. package/dist/components/data-table/root/get-data-table-column-pinning.d.ts.map +1 -0
  175. package/dist/components/data-table/root/get-data-table-column-pinning.js +46 -0
  176. package/dist/components/data-table/root/get-data-table-column-pinning.js.map +1 -0
  177. package/dist/components/data-table/root/get-data-table-scroll-parent.d.ts +13 -0
  178. package/dist/components/data-table/root/get-data-table-scroll-parent.d.ts.map +1 -0
  179. package/dist/components/data-table/root/get-data-table-scroll-parent.js +20 -0
  180. package/dist/components/data-table/root/get-data-table-scroll-parent.js.map +1 -0
  181. package/dist/components/data-table/root/use-data-table-column-layout.d.ts +25 -0
  182. package/dist/components/data-table/root/use-data-table-column-layout.d.ts.map +1 -0
  183. package/dist/components/data-table/root/use-data-table-column-layout.js +106 -0
  184. package/dist/components/data-table/root/use-data-table-column-layout.js.map +1 -0
  185. package/dist/components/data-table/root/use-data-table-header-offset.d.ts +15 -0
  186. package/dist/components/data-table/root/use-data-table-header-offset.d.ts.map +1 -0
  187. package/dist/components/data-table/root/use-data-table-header-offset.js +35 -0
  188. package/dist/components/data-table/root/use-data-table-header-offset.js.map +1 -0
  189. package/dist/components/data-table/selection/data-table-row-checkbox.d.ts +33 -0
  190. package/dist/components/data-table/selection/data-table-row-checkbox.d.ts.map +1 -0
  191. package/dist/components/data-table/selection/data-table-row-checkbox.js +50 -0
  192. package/dist/components/data-table/selection/data-table-row-checkbox.js.map +1 -0
  193. package/dist/components/data-table/selection/data-table-select-all-checkbox.d.ts +31 -0
  194. package/dist/components/data-table/selection/data-table-select-all-checkbox.d.ts.map +1 -0
  195. package/dist/components/data-table/selection/data-table-select-all-checkbox.js +44 -0
  196. package/dist/components/data-table/selection/data-table-select-all-checkbox.js.map +1 -0
  197. package/dist/components/data-table/selection/selection-column-def.d.ts +54 -0
  198. package/dist/components/data-table/selection/selection-column-def.d.ts.map +1 -0
  199. package/dist/components/data-table/selection/selection-column-def.js +55 -0
  200. package/dist/components/data-table/selection/selection-column-def.js.map +1 -0
  201. package/dist/components/data-table/sorting/data-table-sort-indicator.d.ts +26 -0
  202. package/dist/components/data-table/sorting/data-table-sort-indicator.d.ts.map +1 -0
  203. package/dist/components/data-table/sorting/data-table-sort-indicator.js +64 -0
  204. package/dist/components/data-table/sorting/data-table-sort-indicator.js.map +1 -0
  205. package/dist/components/data-table/sorting/data-table-sort-trigger.d.ts +31 -0
  206. package/dist/components/data-table/sorting/data-table-sort-trigger.d.ts.map +1 -0
  207. package/dist/components/data-table/sorting/data-table-sort-trigger.js +46 -0
  208. package/dist/components/data-table/sorting/data-table-sort-trigger.js.map +1 -0
  209. package/dist/components/data-table/toolbar/data-table-density-select.d.ts +39 -0
  210. package/dist/components/data-table/toolbar/data-table-density-select.d.ts.map +1 -0
  211. package/dist/components/data-table/toolbar/data-table-density-select.js +60 -0
  212. package/dist/components/data-table/toolbar/data-table-density-select.js.map +1 -0
  213. package/dist/components/data-table/toolbar/data-table-sort-column-select.d.ts +47 -0
  214. package/dist/components/data-table/toolbar/data-table-sort-column-select.d.ts.map +1 -0
  215. package/dist/components/data-table/toolbar/data-table-sort-column-select.js +78 -0
  216. package/dist/components/data-table/toolbar/data-table-sort-column-select.js.map +1 -0
  217. package/dist/components/data-table/toolbar/data-table-sort-direction-select.d.ts +40 -0
  218. package/dist/components/data-table/toolbar/data-table-sort-direction-select.d.ts.map +1 -0
  219. package/dist/components/data-table/toolbar/data-table-sort-direction-select.js +66 -0
  220. package/dist/components/data-table/toolbar/data-table-sort-direction-select.js.map +1 -0
  221. package/dist/features/active-row/active-row-feature.d.ts +22 -0
  222. package/dist/features/active-row/active-row-feature.d.ts.map +1 -0
  223. package/dist/features/active-row/active-row-feature.js +55 -0
  224. package/dist/features/active-row/active-row-feature.js.map +1 -0
  225. package/dist/features/active-row/active-row-feature.types.d.ts +64 -0
  226. package/dist/features/active-row/active-row-feature.types.d.ts.map +1 -0
  227. package/dist/features/active-row/active-row-feature.types.js +0 -0
  228. package/dist/features/column-alignment/column-alignment-feature.d.ts +23 -0
  229. package/dist/features/column-alignment/column-alignment-feature.d.ts.map +1 -0
  230. package/dist/features/column-alignment/column-alignment-feature.js +34 -0
  231. package/dist/features/column-alignment/column-alignment-feature.js.map +1 -0
  232. package/dist/features/column-alignment/column-alignment-feature.types.d.ts +34 -0
  233. package/dist/features/column-alignment/column-alignment-feature.types.d.ts.map +1 -0
  234. package/dist/features/column-alignment/column-alignment-feature.types.js +0 -0
  235. package/dist/features/index.d.ts +9 -0
  236. package/dist/features/index.js +5 -0
  237. package/dist/features/loading/loading-feature.d.ts +30 -0
  238. package/dist/features/loading/loading-feature.d.ts.map +1 -0
  239. package/dist/features/loading/loading-feature.js +48 -0
  240. package/dist/features/loading/loading-feature.js.map +1 -0
  241. package/dist/features/loading/loading-feature.types.d.ts +50 -0
  242. package/dist/features/loading/loading-feature.types.d.ts.map +1 -0
  243. package/dist/features/loading/loading-feature.types.js +0 -0
  244. package/dist/features/row-density/row-density-feature.d.ts +26 -0
  245. package/dist/features/row-density/row-density-feature.d.ts.map +1 -0
  246. package/dist/features/row-density/row-density-feature.js +44 -0
  247. package/dist/features/row-density/row-density-feature.js.map +1 -0
  248. package/dist/features/row-density/row-density-feature.types.d.ts +53 -0
  249. package/dist/features/row-density/row-density-feature.types.d.ts.map +1 -0
  250. package/dist/features/row-density/row-density-feature.types.js +0 -0
  251. package/dist/types/index.d.ts +2 -0
  252. package/dist/types/index.js +0 -0
  253. package/dist/types/table-with.d.ts +96 -0
  254. package/dist/types/table-with.d.ts.map +1 -0
  255. package/dist/types/table-with.js +0 -0
  256. package/dist/utils/get-default-column-label.d.ts +17 -0
  257. package/dist/utils/get-default-column-label.d.ts.map +1 -0
  258. package/dist/utils/get-default-column-label.js +18 -0
  259. package/dist/utils/get-default-column-label.js.map +1 -0
  260. package/dist/utils/has-feature.d.ts +54 -0
  261. package/dist/utils/has-feature.d.ts.map +1 -0
  262. package/dist/utils/has-feature.js +55 -0
  263. package/dist/utils/has-feature.js.map +1 -0
  264. package/dist/utils/index.d.ts +3 -0
  265. package/dist/utils/index.js +3 -0
  266. package/package.json +80 -3
  267. package/README.md +0 -3
@@ -0,0 +1,28 @@
1
+ import { DATA_TABLE_GRID_CLASS_NAMES } from "../root/data-table-grid-classes.js";
2
+ import { mergeProps, useRender } from "@base-ui/react";
3
+ import { mergeTwClassNames } from "@lucasbernardosn/react-ui/utils";
4
+ //#region src/components/data-table/header/data-table-header-row.tsx
5
+ /**
6
+ * Uma linha de headers (`role="row"`), por grupo de headers. É um grid com as colunas do
7
+ * `--data-table-template`, que o `DataTable.Root` escreve.
8
+ *
9
+ * O `DataTable.Header` com render-prop já monta uma por grupo; use direto só no laço feito à mão.
10
+ */
11
+ const DataTableHeaderRow = (props) => {
12
+ const { render, className, ...rest } = props;
13
+ const baseProps = {
14
+ "data-component": "DataTable.HeaderRow",
15
+ role: "row",
16
+ className: mergeTwClassNames([DATA_TABLE_GRID_CLASS_NAMES], className)
17
+ };
18
+ return useRender({
19
+ render,
20
+ defaultTagName: "div",
21
+ props: mergeProps(baseProps, rest)
22
+ });
23
+ };
24
+ DataTableHeaderRow.displayName = "DataTable.HeaderRow";
25
+ //#endregion
26
+ export { DataTableHeaderRow };
27
+
28
+ //# sourceMappingURL=data-table-header-row.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"data-table-header-row.js","names":[],"sources":["../../../../src/components/data-table/header/data-table-header-row.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '@lucasbernardosn/react-ui/utils';\nimport { DATA_TABLE_GRID_CLASS_NAMES } from '../root/data-table-grid-classes';\n\nexport type DataTableHeaderRowProps = useRender.ComponentProps<'div'>;\n\n/**\n * Uma linha de headers (`role=\"row\"`), por grupo de headers. É um grid com as colunas do\n * `--data-table-template`, que o `DataTable.Root` escreve.\n *\n * O `DataTable.Header` com render-prop já monta uma por grupo; use direto só no laço feito à mão.\n */\nexport const DataTableHeaderRow = (props: DataTableHeaderRowProps) => {\n const { render, className, ...rest } = props;\n\n const baseProps = {\n 'data-component': 'DataTable.HeaderRow',\n role: 'row',\n className: mergeTwClassNames(\n [\n // A linha horizontal fica também na última: entre os níveis de um cabeçalho agrupado e,\n // na última, entre o cabeçalho e o corpo.\n DATA_TABLE_GRID_CLASS_NAMES,\n ],\n className,\n ),\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nDataTableHeaderRow.displayName = 'DataTable.HeaderRow';\n"],"mappings":";;;;;;;;;;AAYA,MAAa,sBAAsB,UAAmC;CACpE,MAAM,EAAE,QAAQ,WAAW,GAAG,SAAS;CAEvC,MAAM,YAAY;EAChB,kBAAkB;EAClB,MAAM;EACN,WAAW,kBACT,CAGE,2BACF,GACA,SACF;CACF;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,mBAAmB,cAAc"}
@@ -0,0 +1,46 @@
1
+ import { Header, RowData, Table, TableFeatures } from "@tanstack/react-table";
2
+ import { useRender } from "@base-ui/react";
3
+ import React from "react";
4
+ import { MergeOverride } from "@lucasbernardosn/utils";
5
+ //#region src/components/data-table/header/data-table-header.d.ts
6
+ export type DataTableHeaderProps<TFeatures extends TableFeatures, TData extends RowData> = MergeOverride<useRender.ComponentProps<'div'>, {
7
+ /** A tabela do `useTable`. */
8
+ table: Table<TFeatures, TData>;
9
+ /**
10
+ * Uma função que recebe cada header e devolve a célula dele: o `Header` monta uma
11
+ * `DataTable.HeaderRow` por grupo de headers e chama a função para cada header. Com nós
12
+ * comuns, quem usa faz o laço.
13
+ * @default (header) => <DataTable.HeaderCell header={header} />
14
+ */
15
+ children?: React.ReactNode | ((header: Header<TFeatures, TData>) => React.ReactNode);
16
+ }>;
17
+ /**
18
+ * O cabeçalho da tabela (`role="rowgroup"`), grudado no topo da área de rolagem.
19
+ *
20
+ * Com render-prop ou sem `children`, faz o laço sozinho: assina os grupos de headers e só
21
+ * re-renderiza quando a estrutura das colunas muda (`columns`, ordem, visibilidade, pinning),
22
+ * sem o dono da tabela precisar re-renderizar. Com nós comuns, o laço é de quem usa, e o dono
23
+ * precisa re-renderizar quando a estrutura muda.
24
+ *
25
+ * Com `columnPinningFeature`, monta as linhas com os grupos de cada região (as fixadas no início,
26
+ * o centro e as fixadas no fim): um grupo cujas colunas atravessam a fronteira da fixação vira um
27
+ * header em cada região, e a parte fixada gruda.
28
+ *
29
+ * @example
30
+ * ```tsx
31
+ * <DataTable.Header table={table}>
32
+ * {(header) => (
33
+ * <DataTable.HeaderCell header={header}>
34
+ * <DataTable.HeaderContent header={header} />
35
+ * <DataTable.ResizeHandle header={header} />
36
+ * </DataTable.HeaderCell>
37
+ * )}
38
+ * </DataTable.Header>
39
+ * ```
40
+ */
41
+ export declare const DataTableHeader: {
42
+ <TFeatures extends TableFeatures, TData extends RowData>(props: DataTableHeaderProps<TFeatures, TData>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
43
+ displayName: string;
44
+ };
45
+ //#endregion
46
+ //# sourceMappingURL=data-table-header.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"data-table-header.d.ts","names":[],"sources":["../../../../src/components/data-table/header/data-table-header.tsx"],"mappings":";;;;;YAgBY,qBACV,kBAAkB,eAClB,cAAc,WACZ,cACF,UAAU;;EAGR,OAAO,MAAM,WAAW;;;;;;;EAOxB,WACI,MAAM,cACJ,QAAQ,OAAO,WAAW,WAAW,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;qBA4BxC;GACX,kBAAkB,eAClB,cAAc,SAAO,OAEd,qBAAqB,WAAW,SAAM,MAAA,+BAAA,MAAA"}
@@ -0,0 +1,80 @@
1
+ import { hasTableFeature } from "../../../utils/has-feature.js";
2
+ import { DataTableHeaderCell } from "./data-table-header-cell.js";
3
+ import { DataTableHeaderRow } from "./data-table-header-row.js";
4
+ import { jsx } from "react/jsx-runtime";
5
+ import { mergeProps, useRender } from "@base-ui/react";
6
+ import { shallow, useSelector } from "@tanstack/react-store";
7
+ import { mergeTwClassNames } from "@lucasbernardosn/react-ui/utils";
8
+ import { Fragment as Fragment$1 } from "react";
9
+ //#region src/components/data-table/header/data-table-header.tsx
10
+ /**
11
+ * O cabeçalho da tabela (`role="rowgroup"`), grudado no topo da área de rolagem.
12
+ *
13
+ * Com render-prop ou sem `children`, faz o laço sozinho: assina os grupos de headers e só
14
+ * re-renderiza quando a estrutura das colunas muda (`columns`, ordem, visibilidade, pinning),
15
+ * sem o dono da tabela precisar re-renderizar. Com nós comuns, o laço é de quem usa, e o dono
16
+ * precisa re-renderizar quando a estrutura muda.
17
+ *
18
+ * Com `columnPinningFeature`, monta as linhas com os grupos de cada região (as fixadas no início,
19
+ * o centro e as fixadas no fim): um grupo cujas colunas atravessam a fronteira da fixação vira um
20
+ * header em cada região, e a parte fixada gruda.
21
+ *
22
+ * @example
23
+ * ```tsx
24
+ * <DataTable.Header table={table}>
25
+ * {(header) => (
26
+ * <DataTable.HeaderCell header={header}>
27
+ * <DataTable.HeaderContent header={header} />
28
+ * <DataTable.ResizeHandle header={header} />
29
+ * </DataTable.HeaderCell>
30
+ * )}
31
+ * </DataTable.Header>
32
+ * ```
33
+ */
34
+ const DataTableHeader = (props) => {
35
+ const { table, render, className, children, ...rest } = props;
36
+ /**
37
+ * Os grupos que o TanStack memoiza, numa tupla: o `shallow` compara item a item, e só
38
+ * re-renderiza quando a estrutura das colunas muda. Tamanho, ordenação e seleção mudam o store,
39
+ * mas não os grupos. Com pinning, os grupos de cada região: o de uma região só tem as colunas
40
+ * dela.
41
+ */
42
+ const regionHeaderGroups = useSelector(table.store, () => hasTableFeature(table, "columnPinningFeature") ? [
43
+ table.getStartHeaderGroups(),
44
+ table.getCenterHeaderGroups(),
45
+ table.getEndHeaderGroups()
46
+ ] : [table.getHeaderGroups()], { compare: shallow });
47
+ /**
48
+ * As linhas do cabeçalho, uma por profundidade, com os headers das regiões na ordem do
49
+ * template. Toda região tem o mesmo número de grupos, o da coluna mais funda.
50
+ */
51
+ const headerRows = (regionHeaderGroups[0] ?? []).map((headerGroup) => ({
52
+ depth: headerGroup.depth,
53
+ headers: regionHeaderGroups.flatMap((headerGroups) => headerGroups[headerGroup.depth]?.headers ?? [])
54
+ }));
55
+ /**
56
+ * Com render-prop ou sem `children`, o laço é daqui, com uma `HeaderRow` por grupo; com nós
57
+ * comuns, de quem usa.
58
+ */
59
+ const content = typeof children === "function" || children === void 0 ? headerRows.map((headerRow) => /* @__PURE__ */ jsx(DataTableHeaderRow, { children: headerRow.headers.map((header) => /* @__PURE__ */ jsx(Fragment$1, { children: children === void 0 ? /* @__PURE__ */ jsx(DataTableHeaderCell, { header }) : children(header) }, header.id)) }, headerRow.depth)) : children;
60
+ const baseProps = {
61
+ "data-component": "DataTable.Header",
62
+ role: "rowgroup",
63
+ className: mergeTwClassNames([
64
+ "sticky",
65
+ "top-0",
66
+ "z-10"
67
+ ], className),
68
+ children: content
69
+ };
70
+ return useRender({
71
+ render,
72
+ defaultTagName: "div",
73
+ props: mergeProps(baseProps, rest)
74
+ });
75
+ };
76
+ DataTableHeader.displayName = "DataTable.Header";
77
+ //#endregion
78
+ export { DataTableHeader };
79
+
80
+ //# sourceMappingURL=data-table-header.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"data-table-header.js","names":["Fragment"],"sources":["../../../../src/components/data-table/header/data-table-header.tsx"],"sourcesContent":["import { mergeProps, useRender } from '@base-ui/react';\nimport { mergeTwClassNames } from '@lucasbernardosn/react-ui/utils';\nimport type { MergeOverride } from '@lucasbernardosn/utils';\nimport { shallow, useSelector } from '@tanstack/react-store';\nimport type {\n Header,\n RowData,\n Table,\n TableFeatures,\n} from '@tanstack/react-table';\nimport type React from 'react';\nimport { Fragment } from 'react';\nimport { hasTableFeature } from '../../../utils';\nimport { DataTableHeaderCell } from './data-table-header-cell';\nimport { DataTableHeaderRow } from './data-table-header-row';\n\nexport type DataTableHeaderProps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n> = MergeOverride<\n useRender.ComponentProps<'div'>,\n {\n /** A tabela do `useTable`. */\n table: Table<TFeatures, TData>;\n /**\n * Uma função que recebe cada header e devolve a célula dele: o `Header` monta uma\n * `DataTable.HeaderRow` por grupo de headers e chama a função para cada header. Com nós\n * comuns, quem usa faz o laço.\n * @default (header) => <DataTable.HeaderCell header={header} />\n */\n children?:\n | React.ReactNode\n | ((header: Header<TFeatures, TData>) => React.ReactNode);\n }\n>;\n\n/**\n * O cabeçalho da tabela (`role=\"rowgroup\"`), grudado no topo da área de rolagem.\n *\n * Com render-prop ou sem `children`, faz o laço sozinho: assina os grupos de headers e só\n * re-renderiza quando a estrutura das colunas muda (`columns`, ordem, visibilidade, pinning),\n * sem o dono da tabela precisar re-renderizar. Com nós comuns, o laço é de quem usa, e o dono\n * precisa re-renderizar quando a estrutura muda.\n *\n * Com `columnPinningFeature`, monta as linhas com os grupos de cada região (as fixadas no início,\n * o centro e as fixadas no fim): um grupo cujas colunas atravessam a fronteira da fixação vira um\n * header em cada região, e a parte fixada gruda.\n *\n * @example\n * ```tsx\n * <DataTable.Header table={table}>\n * {(header) => (\n * <DataTable.HeaderCell header={header}>\n * <DataTable.HeaderContent header={header} />\n * <DataTable.ResizeHandle header={header} />\n * </DataTable.HeaderCell>\n * )}\n * </DataTable.Header>\n * ```\n */\nexport const DataTableHeader = <\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(\n props: DataTableHeaderProps<TFeatures, TData>,\n) => {\n const { table, render, className, children, ...rest } = props;\n\n /**\n * Os grupos que o TanStack memoiza, numa tupla: o `shallow` compara item a item, e só\n * re-renderiza quando a estrutura das colunas muda. Tamanho, ordenação e seleção mudam o store,\n * mas não os grupos. Com pinning, os grupos de cada região: o de uma região só tem as colunas\n * dela.\n */\n const regionHeaderGroups = useSelector(\n table.store,\n () =>\n hasTableFeature(table, 'columnPinningFeature')\n ? [\n table.getStartHeaderGroups(),\n table.getCenterHeaderGroups(),\n table.getEndHeaderGroups(),\n ]\n : [table.getHeaderGroups()],\n { compare: shallow },\n );\n\n /**\n * As linhas do cabeçalho, uma por profundidade, com os headers das regiões na ordem do\n * template. Toda região tem o mesmo número de grupos, o da coluna mais funda.\n */\n const headerRows = (regionHeaderGroups[0] ?? []).map((headerGroup) => ({\n depth: headerGroup.depth,\n headers: regionHeaderGroups.flatMap(\n (headerGroups) => headerGroups[headerGroup.depth]?.headers ?? [],\n ),\n }));\n\n /**\n * Com render-prop ou sem `children`, o laço é daqui, com uma `HeaderRow` por grupo; com nós\n * comuns, de quem usa.\n */\n const content =\n typeof children === 'function' || children === undefined\n ? headerRows.map((headerRow) => (\n <DataTableHeaderRow key={headerRow.depth}>\n {headerRow.headers.map((header) => (\n <Fragment key={header.id}>\n {children === undefined ? (\n <DataTableHeaderCell header={header} />\n ) : (\n children(header)\n )}\n </Fragment>\n ))}\n </DataTableHeaderRow>\n ))\n : children;\n\n const baseProps = {\n 'data-component': 'DataTable.Header',\n role: 'rowgroup',\n className: mergeTwClassNames(\n [\n // Gruda no ancestral que rola, como o viewport do `DataTable.ScrollArea`.\n 'sticky',\n 'top-0',\n 'z-10',\n ],\n className,\n ),\n children: content,\n };\n\n return useRender({\n render,\n defaultTagName: 'div',\n props: mergeProps(baseProps, rest),\n });\n};\n\nDataTableHeader.displayName = 'DataTable.Header';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DA,MAAa,mBAIX,UACG;CACH,MAAM,EAAE,OAAO,QAAQ,WAAW,UAAU,GAAG,SAAS;;;;;;;CAQxD,MAAM,qBAAqB,YACzB,MAAM,aAEJ,gBAAgB,OAAO,sBAAsB,IACzC;EACE,MAAM,qBAAqB;EAC3B,MAAM,sBAAsB;EAC5B,MAAM,mBAAmB;CAC3B,IACA,CAAC,MAAM,gBAAgB,CAAC,GAC9B,EAAE,SAAS,QAAQ,CACrB;;;;;CAMA,MAAM,cAAc,mBAAmB,MAAM,CAAC,EAAA,CAAG,KAAK,iBAAiB;EACrE,OAAO,YAAY;EACnB,SAAS,mBAAmB,SACzB,iBAAiB,aAAa,YAAY,MAAM,EAAE,WAAW,CAAC,CACjE;CACF,EAAE;;;;;CAMF,MAAM,UACJ,OAAO,aAAa,cAAc,aAAa,KAAA,IAC3C,WAAW,KAAK,cACd,oBAAC,oBAAD,EAAA,UACG,UAAU,QAAQ,KAAK,WACtB,oBAACA,YAAD,EAAA,UACG,aAAa,KAAA,IACZ,oBAAC,qBAAD,EAA6B,OAAS,CAAA,IAEtC,SAAS,MAAM,EAET,GANK,OAAO,EAMZ,CACX,EACiB,GAVK,UAAU,KAUf,CACrB,IACD;CAEN,MAAM,YAAY;EAChB,kBAAkB;EAClB,MAAM;EACN,WAAW,kBACT;GAEE;GACA;GACA;EACF,GACA,SACF;EACA,UAAU;CACZ;CAEA,OAAO,UAAU;EACf;EACA,gBAAgB;EAChB,OAAO,WAAW,WAAW,IAAI;CACnC,CAAC;AACH;AAEA,gBAAgB,cAAc"}
@@ -0,0 +1,2 @@
1
+ import { index_parts_d_exports } from "./index.parts.js";
2
+ export { index_parts_d_exports as DataTable };
@@ -0,0 +1,2 @@
1
+ import { index_parts_exports } from "./index.parts.js";
2
+ export { index_parts_exports as DataTable };
@@ -0,0 +1,32 @@
1
+ import { DataTableBody, DataTableBodyProps } from "./body/data-table-body.js";
2
+ import { DataTableCell, DataTableCellProps } from "./body/data-table-cell.js";
3
+ import { DataTableEmpty, DataTableEmptyProps } from "./body/data-table-empty.js";
4
+ import { DataTableRow, DataTableRowProps } from "./body/data-table-row.js";
5
+ import { DataTableHeaderButton, DataTableHeaderButtonProps } from "./header/data-table-header-button.js";
6
+ import { DataTableHeaderCell, DataTableHeaderCellProps } from "./header/data-table-header-cell.js";
7
+ import { DataTableHeaderContent, DataTableHeaderContentProps } from "./header/data-table-header-content.js";
8
+ import { DataTableHeaderRow, DataTableHeaderRowProps } from "./header/data-table-header-row.js";
9
+ import { DataTableHeader, DataTableHeaderProps } from "./header/data-table-header.js";
10
+ import { DataTablePageButton, DataTablePageButtonPage, DataTablePageButtonProps } from "./pagination/data-table-page-button.js";
11
+ import { DataTablePageSizeSelect, DataTablePageSizeSelectProps } from "./pagination/data-table-page-size-select.js";
12
+ import { DataTablePageStatus, DataTablePageStatusProps, DataTablePageStatusValues } from "./pagination/data-table-page-status.js";
13
+ import { DataTablePagination, DataTablePaginationProps } from "./pagination/data-table-pagination.js";
14
+ import { DataTableRowRange, DataTableRowRangeProps, DataTableRowRangeValues } from "./pagination/data-table-row-range.js";
15
+ import { DataTableSelectedCount, DataTableSelectedCountProps } from "./pagination/data-table-selected-count.js";
16
+ import { DataTableResizeHandle, DataTableResizeHandleProps } from "./resize/data-table-resize-handle.js";
17
+ import { DataTableRoot, DataTableRootProps } from "./root/data-table-root.js";
18
+ import { DataTableScrollArea, DataTableScrollAreaProps } from "./root/data-table-scroll-area.js";
19
+ import { DataTableRowCheckbox, DataTableRowCheckboxProps } from "./selection/data-table-row-checkbox.js";
20
+ import { DataTableSelectAllCheckbox, DataTableSelectAllCheckboxProps } from "./selection/data-table-select-all-checkbox.js";
21
+ import { SelectionColumnDefOptions, selectionColumnDef } from "./selection/selection-column-def.js";
22
+ import { DataTableSortIndicator, DataTableSortIndicatorProps } from "./sorting/data-table-sort-indicator.js";
23
+ import { DataTableSortTrigger, DataTableSortTriggerProps } from "./sorting/data-table-sort-trigger.js";
24
+ import { DataTableDensitySelect, DataTableDensitySelectProps } from "./toolbar/data-table-density-select.js";
25
+ import { DataTableSortColumnSelect, DataTableSortColumnSelectProps } from "./toolbar/data-table-sort-column-select.js";
26
+ import { DataTableSortDirectionSelect, DataTableSortDirectionSelectProps } from "./toolbar/data-table-sort-direction-select.js";
27
+ declare namespace index_parts_d_exports {
28
+ export { DataTableBody as Body, DataTableBodyProps as BodyProps, DataTableCell as Cell, DataTableCellProps as CellProps, DataTableDensitySelect as DensitySelect, DataTableDensitySelectProps as DensitySelectProps, DataTableEmpty as Empty, DataTableEmptyProps as EmptyProps, DataTableHeader as Header, DataTableHeaderButton as HeaderButton, DataTableHeaderButtonProps as HeaderButtonProps, DataTableHeaderCell as HeaderCell, DataTableHeaderCellProps as HeaderCellProps, DataTableHeaderContent as HeaderContent, DataTableHeaderContentProps as HeaderContentProps, DataTableHeaderProps as HeaderProps, DataTableHeaderRow as HeaderRow, DataTableHeaderRowProps as HeaderRowProps, DataTablePageButton as PageButton, DataTablePageButtonPage as PageButtonPage, DataTablePageButtonProps as PageButtonProps, DataTablePageSizeSelect as PageSizeSelect, DataTablePageSizeSelectProps as PageSizeSelectProps, DataTablePageStatus as PageStatus, DataTablePageStatusProps as PageStatusProps, DataTablePageStatusValues as PageStatusValues, DataTablePagination as Pagination, DataTablePaginationProps as PaginationProps, DataTableResizeHandle as ResizeHandle, DataTableResizeHandleProps as ResizeHandleProps, DataTableRoot as Root, DataTableRootProps as RootProps, DataTableRow as Row, DataTableRowCheckbox as RowCheckbox, DataTableRowCheckboxProps as RowCheckboxProps, DataTableRowProps as RowProps, DataTableRowRange as RowRange, DataTableRowRangeProps as RowRangeProps, DataTableRowRangeValues as RowRangeValues, DataTableScrollArea as ScrollArea, DataTableScrollAreaProps as ScrollAreaProps, DataTableSelectAllCheckbox as SelectAllCheckbox, DataTableSelectAllCheckboxProps as SelectAllCheckboxProps, DataTableSelectedCount as SelectedCount, DataTableSelectedCountProps as SelectedCountProps, SelectionColumnDefOptions, DataTableSortColumnSelect as SortColumnSelect, DataTableSortColumnSelectProps as SortColumnSelectProps, DataTableSortDirectionSelect as SortDirectionSelect, DataTableSortDirectionSelectProps as SortDirectionSelectProps, DataTableSortIndicator as SortIndicator, DataTableSortIndicatorProps as SortIndicatorProps, DataTableSortTrigger as SortTrigger, DataTableSortTriggerProps as SortTriggerProps, selectionColumnDef };
29
+ }
30
+ //#endregion
31
+ export { DataTableBody as Body, type DataTableBodyProps as BodyProps, DataTableCell as Cell, type DataTableCellProps as CellProps, DataTableDensitySelect as DensitySelect, type DataTableDensitySelectProps as DensitySelectProps, DataTableEmpty as Empty, type DataTableEmptyProps as EmptyProps, DataTableHeader as Header, DataTableHeaderButton as HeaderButton, type DataTableHeaderButtonProps as HeaderButtonProps, DataTableHeaderCell as HeaderCell, type DataTableHeaderCellProps as HeaderCellProps, DataTableHeaderContent as HeaderContent, type DataTableHeaderContentProps as HeaderContentProps, type DataTableHeaderProps as HeaderProps, DataTableHeaderRow as HeaderRow, type DataTableHeaderRowProps as HeaderRowProps, DataTablePageButton as PageButton, type DataTablePageButtonPage as PageButtonPage, type DataTablePageButtonProps as PageButtonProps, DataTablePageSizeSelect as PageSizeSelect, type DataTablePageSizeSelectProps as PageSizeSelectProps, DataTablePageStatus as PageStatus, type DataTablePageStatusProps as PageStatusProps, type DataTablePageStatusValues as PageStatusValues, DataTablePagination as Pagination, type DataTablePaginationProps as PaginationProps, DataTableResizeHandle as ResizeHandle, type DataTableResizeHandleProps as ResizeHandleProps, DataTableRoot as Root, type DataTableRootProps as RootProps, DataTableRow as Row, DataTableRowCheckbox as RowCheckbox, type DataTableRowCheckboxProps as RowCheckboxProps, type DataTableRowProps as RowProps, DataTableRowRange as RowRange, type DataTableRowRangeProps as RowRangeProps, type DataTableRowRangeValues as RowRangeValues, DataTableScrollArea as ScrollArea, type DataTableScrollAreaProps as ScrollAreaProps, DataTableSelectAllCheckbox as SelectAllCheckbox, type DataTableSelectAllCheckboxProps as SelectAllCheckboxProps, DataTableSelectedCount as SelectedCount, type DataTableSelectedCountProps as SelectedCountProps, type SelectionColumnDefOptions, DataTableSortColumnSelect as SortColumnSelect, type DataTableSortColumnSelectProps as SortColumnSelectProps, DataTableSortDirectionSelect as SortDirectionSelect, type DataTableSortDirectionSelectProps as SortDirectionSelectProps, DataTableSortIndicator as SortIndicator, type DataTableSortIndicatorProps as SortIndicatorProps, DataTableSortTrigger as SortTrigger, type DataTableSortTriggerProps as SortTriggerProps, index_parts_d_exports, selectionColumnDef };
32
+ //# sourceMappingURL=index.parts.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.parts.d.ts","names":[],"sources":["../../../src/components/data-table/index.parts.ts"],"mappings":""}
@@ -0,0 +1,60 @@
1
+ import { __exportAll } from "../../_virtual/_rolldown/runtime.js";
2
+ import { DataTableHeaderButton } from "./header/data-table-header-button.js";
3
+ import { DataTableCell } from "./body/data-table-cell.js";
4
+ import { DataTableRow } from "./body/data-table-row.js";
5
+ import { DataTableBody } from "./body/data-table-body.js";
6
+ import { DataTableEmpty } from "./body/data-table-empty.js";
7
+ import { DataTableHeaderContent } from "./header/data-table-header-content.js";
8
+ import { DataTableHeaderCell } from "./header/data-table-header-cell.js";
9
+ import { DataTableHeaderRow } from "./header/data-table-header-row.js";
10
+ import { DataTableHeader } from "./header/data-table-header.js";
11
+ import { DataTablePageButton } from "./pagination/data-table-page-button.js";
12
+ import { DataTablePageSizeSelect } from "./pagination/data-table-page-size-select.js";
13
+ import { DataTablePageStatus } from "./pagination/data-table-page-status.js";
14
+ import { DataTableRowRange } from "./pagination/data-table-row-range.js";
15
+ import { DataTableSelectedCount } from "./pagination/data-table-selected-count.js";
16
+ import { DataTablePagination } from "./pagination/data-table-pagination.js";
17
+ import { DataTableResizeHandle } from "./resize/data-table-resize-handle.js";
18
+ import { DataTableRoot } from "./root/data-table-root.js";
19
+ import { DataTableScrollArea } from "./root/data-table-scroll-area.js";
20
+ import { DataTableRowCheckbox } from "./selection/data-table-row-checkbox.js";
21
+ import { DataTableSelectAllCheckbox } from "./selection/data-table-select-all-checkbox.js";
22
+ import { selectionColumnDef } from "./selection/selection-column-def.js";
23
+ import { DataTableSortIndicator } from "./sorting/data-table-sort-indicator.js";
24
+ import { DataTableSortTrigger } from "./sorting/data-table-sort-trigger.js";
25
+ import { DataTableDensitySelect } from "./toolbar/data-table-density-select.js";
26
+ import { DataTableSortColumnSelect } from "./toolbar/data-table-sort-column-select.js";
27
+ import { DataTableSortDirectionSelect } from "./toolbar/data-table-sort-direction-select.js";
28
+ //#region src/components/data-table/index.parts.ts
29
+ var index_parts_exports = /* @__PURE__ */ __exportAll({
30
+ Body: () => DataTableBody,
31
+ Cell: () => DataTableCell,
32
+ DensitySelect: () => DataTableDensitySelect,
33
+ Empty: () => DataTableEmpty,
34
+ Header: () => DataTableHeader,
35
+ HeaderButton: () => DataTableHeaderButton,
36
+ HeaderCell: () => DataTableHeaderCell,
37
+ HeaderContent: () => DataTableHeaderContent,
38
+ HeaderRow: () => DataTableHeaderRow,
39
+ PageButton: () => DataTablePageButton,
40
+ PageSizeSelect: () => DataTablePageSizeSelect,
41
+ PageStatus: () => DataTablePageStatus,
42
+ Pagination: () => DataTablePagination,
43
+ ResizeHandle: () => DataTableResizeHandle,
44
+ Root: () => DataTableRoot,
45
+ Row: () => DataTableRow,
46
+ RowCheckbox: () => DataTableRowCheckbox,
47
+ RowRange: () => DataTableRowRange,
48
+ ScrollArea: () => DataTableScrollArea,
49
+ SelectAllCheckbox: () => DataTableSelectAllCheckbox,
50
+ SelectedCount: () => DataTableSelectedCount,
51
+ SortColumnSelect: () => DataTableSortColumnSelect,
52
+ SortDirectionSelect: () => DataTableSortDirectionSelect,
53
+ SortIndicator: () => DataTableSortIndicator,
54
+ SortTrigger: () => DataTableSortTrigger,
55
+ selectionColumnDef: () => selectionColumnDef
56
+ });
57
+ //#endregion
58
+ export { DataTableBody as Body, DataTableCell as Cell, DataTableDensitySelect as DensitySelect, DataTableEmpty as Empty, DataTableHeader as Header, DataTableHeaderButton as HeaderButton, DataTableHeaderCell as HeaderCell, DataTableHeaderContent as HeaderContent, DataTableHeaderRow as HeaderRow, DataTablePageButton as PageButton, DataTablePageSizeSelect as PageSizeSelect, DataTablePageStatus as PageStatus, DataTablePagination as Pagination, DataTableResizeHandle as ResizeHandle, DataTableRoot as Root, DataTableRow as Row, DataTableRowCheckbox as RowCheckbox, DataTableRowRange as RowRange, DataTableScrollArea as ScrollArea, DataTableSelectAllCheckbox as SelectAllCheckbox, DataTableSelectedCount as SelectedCount, DataTableSortColumnSelect as SortColumnSelect, DataTableSortDirectionSelect as SortDirectionSelect, DataTableSortIndicator as SortIndicator, DataTableSortTrigger as SortTrigger, index_parts_exports, selectionColumnDef };
59
+
60
+ //# sourceMappingURL=index.parts.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.parts.js","names":[],"sources":["../../../src/components/data-table/index.parts.ts"],"sourcesContent":["export { DataTableBody as Body } from './body/data-table-body';\nexport { DataTableCell as Cell } from './body/data-table-cell';\nexport { DataTableEmpty as Empty } from './body/data-table-empty';\nexport { DataTableRow as Row } from './body/data-table-row';\nexport { DataTableHeader as Header } from './header/data-table-header';\nexport { DataTableHeaderButton as HeaderButton } from './header/data-table-header-button';\nexport { DataTableHeaderCell as HeaderCell } from './header/data-table-header-cell';\nexport { DataTableHeaderContent as HeaderContent } from './header/data-table-header-content';\nexport { DataTableHeaderRow as HeaderRow } from './header/data-table-header-row';\nexport { DataTablePageButton as PageButton } from './pagination/data-table-page-button';\nexport { DataTablePageSizeSelect as PageSizeSelect } from './pagination/data-table-page-size-select';\nexport { DataTablePageStatus as PageStatus } from './pagination/data-table-page-status';\nexport { DataTablePagination as Pagination } from './pagination/data-table-pagination';\nexport { DataTableRowRange as RowRange } from './pagination/data-table-row-range';\nexport { DataTableSelectedCount as SelectedCount } from './pagination/data-table-selected-count';\nexport { DataTableResizeHandle as ResizeHandle } from './resize/data-table-resize-handle';\nexport { DataTableRoot as Root } from './root/data-table-root';\nexport { DataTableScrollArea as ScrollArea } from './root/data-table-scroll-area';\nexport { DataTableRowCheckbox as RowCheckbox } from './selection/data-table-row-checkbox';\nexport { DataTableSelectAllCheckbox as SelectAllCheckbox } from './selection/data-table-select-all-checkbox';\nexport { selectionColumnDef } from './selection/selection-column-def';\nexport { DataTableSortIndicator as SortIndicator } from './sorting/data-table-sort-indicator';\nexport { DataTableSortTrigger as SortTrigger } from './sorting/data-table-sort-trigger';\nexport { DataTableDensitySelect as DensitySelect } from './toolbar/data-table-density-select';\nexport { DataTableSortColumnSelect as SortColumnSelect } from './toolbar/data-table-sort-column-select';\nexport { DataTableSortDirectionSelect as SortDirectionSelect } from './toolbar/data-table-sort-direction-select';\n\n/* types */\n\nexport type { DataTableBodyProps as BodyProps } from './body/data-table-body';\nexport type { DataTableCellProps as CellProps } from './body/data-table-cell';\nexport type { DataTableEmptyProps as EmptyProps } from './body/data-table-empty';\nexport type { DataTableRowProps as RowProps } from './body/data-table-row';\nexport type { DataTableHeaderProps as HeaderProps } from './header/data-table-header';\nexport type { DataTableHeaderButtonProps as HeaderButtonProps } from './header/data-table-header-button';\nexport type { DataTableHeaderCellProps as HeaderCellProps } from './header/data-table-header-cell';\nexport type { DataTableHeaderContentProps as HeaderContentProps } from './header/data-table-header-content';\nexport type { DataTableHeaderRowProps as HeaderRowProps } from './header/data-table-header-row';\nexport type {\n DataTablePageButtonPage as PageButtonPage,\n DataTablePageButtonProps as PageButtonProps,\n} from './pagination/data-table-page-button';\nexport type { DataTablePageSizeSelectProps as PageSizeSelectProps } from './pagination/data-table-page-size-select';\nexport type {\n DataTablePageStatusProps as PageStatusProps,\n DataTablePageStatusValues as PageStatusValues,\n} from './pagination/data-table-page-status';\nexport type { DataTablePaginationProps as PaginationProps } from './pagination/data-table-pagination';\nexport type {\n DataTableRowRangeProps as RowRangeProps,\n DataTableRowRangeValues as RowRangeValues,\n} from './pagination/data-table-row-range';\nexport type { DataTableSelectedCountProps as SelectedCountProps } from './pagination/data-table-selected-count';\nexport type { DataTableResizeHandleProps as ResizeHandleProps } from './resize/data-table-resize-handle';\nexport type { DataTableRootProps as RootProps } from './root/data-table-root';\nexport type { DataTableScrollAreaProps as ScrollAreaProps } from './root/data-table-scroll-area';\nexport type { DataTableRowCheckboxProps as RowCheckboxProps } from './selection/data-table-row-checkbox';\nexport type { DataTableSelectAllCheckboxProps as SelectAllCheckboxProps } from './selection/data-table-select-all-checkbox';\nexport type { SelectionColumnDefOptions } from './selection/selection-column-def';\nexport type { DataTableSortIndicatorProps as SortIndicatorProps } from './sorting/data-table-sort-indicator';\nexport type { DataTableSortTriggerProps as SortTriggerProps } from './sorting/data-table-sort-trigger';\nexport type { DataTableDensitySelectProps as DensitySelectProps } from './toolbar/data-table-density-select';\nexport type { DataTableSortColumnSelectProps as SortColumnSelectProps } from './toolbar/data-table-sort-column-select';\nexport type { DataTableSortDirectionSelectProps as SortDirectionSelectProps } from './toolbar/data-table-sort-direction-select';\n"],"mappings":""}
@@ -0,0 +1,16 @@
1
+ import { RowData, Table, TableFeatures } from "@tanstack/react-table";
2
+ //#region src/components/data-table/loading/get-data-table-loading-without-rows.d.ts
3
+ /**
4
+ * Se a tabela carrega sem nenhuma linha, como na primeira carga: o corpo mostra as
5
+ * linhas-fantasma, e a barra da paginação, sem o total, que ainda não chegou. Sem
6
+ * `loadingFeature`, `false`.
7
+ *
8
+ * @example
9
+ * ```ts
10
+ * // Primeira carga da API: `isLoading: true` e `data: []`.
11
+ * getDataTableLoadingWithoutRows(table); // → true
12
+ * ```
13
+ */
14
+ export declare const getDataTableLoadingWithoutRows: <TFeatures extends TableFeatures, TData extends RowData>(table: Table<TFeatures, TData>) => boolean;
15
+ //#endregion
16
+ //# sourceMappingURL=get-data-table-loading-without-rows.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"get-data-table-loading-without-rows.d.ts","names":[],"sources":["../../../../src/components/data-table/loading/get-data-table-loading-without-rows.ts"],"mappings":";;;;;;;;;;;;;qBAca,iCACX,kBAAkB,eAClB,cAAc,SAEd,OAAO,MAAM,WAAW"}
@@ -0,0 +1,18 @@
1
+ import { hasTableFeature } from "../../../utils/has-feature.js";
2
+ //#region src/components/data-table/loading/get-data-table-loading-without-rows.ts
3
+ /**
4
+ * Se a tabela carrega sem nenhuma linha, como na primeira carga: o corpo mostra as
5
+ * linhas-fantasma, e a barra da paginação, sem o total, que ainda não chegou. Sem
6
+ * `loadingFeature`, `false`.
7
+ *
8
+ * @example
9
+ * ```ts
10
+ * // Primeira carga da API: `isLoading: true` e `data: []`.
11
+ * getDataTableLoadingWithoutRows(table); // → true
12
+ * ```
13
+ */
14
+ const getDataTableLoadingWithoutRows = (table) => hasTableFeature(table, "loadingFeature") && table.atoms.isLoading.get() && table.getRowModel().rows.length === 0;
15
+ //#endregion
16
+ export { getDataTableLoadingWithoutRows };
17
+
18
+ //# sourceMappingURL=get-data-table-loading-without-rows.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"get-data-table-loading-without-rows.js","names":[],"sources":["../../../../src/components/data-table/loading/get-data-table-loading-without-rows.ts"],"sourcesContent":["import type { RowData, Table, TableFeatures } from '@tanstack/react-table';\nimport { hasTableFeature } from '../../../utils';\n\n/**\n * Se a tabela carrega sem nenhuma linha, como na primeira carga: o corpo mostra as\n * linhas-fantasma, e a barra da paginação, sem o total, que ainda não chegou. Sem\n * `loadingFeature`, `false`.\n *\n * @example\n * ```ts\n * // Primeira carga da API: `isLoading: true` e `data: []`.\n * getDataTableLoadingWithoutRows(table); // → true\n * ```\n */\nexport const getDataTableLoadingWithoutRows = <\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(\n table: Table<TFeatures, TData>,\n) =>\n hasTableFeature(table, 'loadingFeature') &&\n table.atoms.isLoading.get() &&\n table.getRowModel().rows.length === 0;\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAa,kCAIX,UAEA,gBAAgB,OAAO,gBAAgB,KACvC,MAAM,MAAM,UAAU,IAAI,KAC1B,MAAM,YAAY,CAAC,CAAC,KAAK,WAAW"}
@@ -0,0 +1,16 @@
1
+ import { RowData, Table, TableFeatures } from "@tanstack/react-table";
2
+ import React from "react";
3
+ //#region src/components/data-table/loading/use-data-table-loading-inert.d.ts
4
+ /**
5
+ * Bloqueia o corpo (`inert`) enquanto a tabela carrega, com `loadingFeature`: um clique, o Enter
6
+ * ou o Delete agiriam sobre o dado antigo. O cabeçalho e a paginação ficam livres.
7
+ *
8
+ * O `inert` tira o foco de uma linha. Se o foco estava no corpo quando a carga começou, ele volta
9
+ * quando ela termina: para a linha ativa, se ela continua na tela, ou para a primeira.
10
+ *
11
+ * Assina o store fora do React, como as variáveis das colunas: o atributo muda sem re-renderizar
12
+ * o corpo, que recriaria todas as linhas.
13
+ */
14
+ export declare const useDataTableLoadingInert: <TFeatures extends TableFeatures, TData extends RowData>(table: Table<TFeatures, TData>, ref: React.RefObject<HTMLElement | null>) => void;
15
+ //#endregion
16
+ //# sourceMappingURL=use-data-table-loading-inert.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-data-table-loading-inert.d.ts","names":[],"sources":["../../../../src/components/data-table/loading/use-data-table-loading-inert.ts"],"mappings":";;;;;;;;;;;;;qBAmBa,2BACX,kBAAkB,eAClB,cAAc,SAEd,OAAO,MAAM,WAAW,QACxB,KAAK,MAAM,UAAU"}
@@ -0,0 +1,54 @@
1
+ import { hasTableFeature } from "../../../utils/has-feature.js";
2
+ import { focusDataTableRow, getDataTableRowElements } from "../body/data-table-row-focus.js";
3
+ import { useLayoutEffect, useRef } from "react";
4
+ //#region src/components/data-table/loading/use-data-table-loading-inert.ts
5
+ /**
6
+ * Bloqueia o corpo (`inert`) enquanto a tabela carrega, com `loadingFeature`: um clique, o Enter
7
+ * ou o Delete agiriam sobre o dado antigo. O cabeçalho e a paginação ficam livres.
8
+ *
9
+ * O `inert` tira o foco de uma linha. Se o foco estava no corpo quando a carga começou, ele volta
10
+ * quando ela termina: para a linha ativa, se ela continua na tela, ou para a primeira.
11
+ *
12
+ * Assina o store fora do React, como as variáveis das colunas: o atributo muda sem re-renderizar
13
+ * o corpo, que recriaria todas as linhas.
14
+ */
15
+ const useDataTableLoadingInert = (table, ref) => {
16
+ /** A tabela do último render, lida por ref para não refazer a assinatura a cada render. */
17
+ const tableRef = useRef(table);
18
+ useLayoutEffect(() => {
19
+ tableRef.current = table;
20
+ });
21
+ useLayoutEffect(() => {
22
+ /** Se o foco estava no corpo quando a carga começou. */
23
+ let wasFocusInside = false;
24
+ const syncInert = () => {
25
+ const element = ref.current;
26
+ const currentTable = tableRef.current;
27
+ if (!element) return;
28
+ const isLoading = hasTableFeature(currentTable, "loadingFeature") && currentTable.atoms.isLoading.get();
29
+ if (isLoading === element.hasAttribute("inert")) return;
30
+ if (isLoading) {
31
+ wasFocusInside = element.contains(document.activeElement);
32
+ element.setAttribute("inert", "");
33
+ return;
34
+ }
35
+ element.removeAttribute("inert");
36
+ if (!wasFocusInside) return;
37
+ wasFocusInside = false;
38
+ /** No próximo quadro, com as linhas novas já no DOM. */
39
+ requestAnimationFrame(() => {
40
+ const { activeElement } = document;
41
+ if (activeElement && activeElement !== document.body) return;
42
+ const targetRow = element.querySelector("[role=\"row\"][data-active]") ?? getDataTableRowElements(element)[0];
43
+ if (targetRow) focusDataTableRow(targetRow);
44
+ });
45
+ };
46
+ syncInert();
47
+ const subscription = table.store.subscribe(syncInert);
48
+ return () => subscription.unsubscribe();
49
+ }, [table.store, ref]);
50
+ };
51
+ //#endregion
52
+ export { useDataTableLoadingInert };
53
+
54
+ //# sourceMappingURL=use-data-table-loading-inert.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-data-table-loading-inert.js","names":[],"sources":["../../../../src/components/data-table/loading/use-data-table-loading-inert.ts"],"sourcesContent":["import type { RowData, Table, TableFeatures } from '@tanstack/react-table';\nimport type React from 'react';\nimport { useLayoutEffect, useRef } from 'react';\nimport { hasTableFeature } from '../../../utils';\nimport {\n focusDataTableRow,\n getDataTableRowElements,\n} from '../body/data-table-row-focus';\n\n/**\n * Bloqueia o corpo (`inert`) enquanto a tabela carrega, com `loadingFeature`: um clique, o Enter\n * ou o Delete agiriam sobre o dado antigo. O cabeçalho e a paginação ficam livres.\n *\n * O `inert` tira o foco de uma linha. Se o foco estava no corpo quando a carga começou, ele volta\n * quando ela termina: para a linha ativa, se ela continua na tela, ou para a primeira.\n *\n * Assina o store fora do React, como as variáveis das colunas: o atributo muda sem re-renderizar\n * o corpo, que recriaria todas as linhas.\n */\nexport const useDataTableLoadingInert = <\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(\n table: Table<TFeatures, TData>,\n ref: React.RefObject<HTMLElement | null>,\n) => {\n /** A tabela do último render, lida por ref para não refazer a assinatura a cada render. */\n const tableRef = useRef(table);\n\n useLayoutEffect(() => {\n tableRef.current = table;\n });\n\n useLayoutEffect(() => {\n /** Se o foco estava no corpo quando a carga começou. */\n let wasFocusInside = false;\n\n const syncInert = () => {\n const element = ref.current;\n const currentTable = tableRef.current;\n\n if (!element) {\n return;\n }\n\n const isLoading =\n hasTableFeature(currentTable, 'loadingFeature') &&\n currentTable.atoms.isLoading.get();\n\n if (isLoading === element.hasAttribute('inert')) {\n return;\n }\n\n if (isLoading) {\n wasFocusInside = element.contains(document.activeElement);\n element.setAttribute('inert', '');\n\n return;\n }\n\n element.removeAttribute('inert');\n\n if (!wasFocusInside) {\n return;\n }\n\n wasFocusInside = false;\n\n /** No próximo quadro, com as linhas novas já no DOM. */\n requestAnimationFrame(() => {\n const { activeElement } = document;\n\n if (activeElement && activeElement !== document.body) {\n return;\n }\n\n const targetRow =\n element.querySelector<HTMLElement>('[role=\"row\"][data-active]') ??\n getDataTableRowElements(element)[0];\n\n if (targetRow) {\n focusDataTableRow(targetRow);\n }\n });\n };\n\n syncInert();\n\n const subscription = table.store.subscribe(syncInert);\n\n return () => subscription.unsubscribe();\n }, [table.store, ref]);\n};\n"],"mappings":";;;;;;;;;;;;;;AAmBA,MAAa,4BAIX,OACA,QACG;;CAEH,MAAM,WAAW,OAAO,KAAK;CAE7B,sBAAsB;EACpB,SAAS,UAAU;CACrB,CAAC;CAED,sBAAsB;;EAEpB,IAAI,iBAAiB;EAErB,MAAM,kBAAkB;GACtB,MAAM,UAAU,IAAI;GACpB,MAAM,eAAe,SAAS;GAE9B,IAAI,CAAC,SACH;GAGF,MAAM,YACJ,gBAAgB,cAAc,gBAAgB,KAC9C,aAAa,MAAM,UAAU,IAAI;GAEnC,IAAI,cAAc,QAAQ,aAAa,OAAO,GAC5C;GAGF,IAAI,WAAW;IACb,iBAAiB,QAAQ,SAAS,SAAS,aAAa;IACxD,QAAQ,aAAa,SAAS,EAAE;IAEhC;GACF;GAEA,QAAQ,gBAAgB,OAAO;GAE/B,IAAI,CAAC,gBACH;GAGF,iBAAiB;;GAGjB,4BAA4B;IAC1B,MAAM,EAAE,kBAAkB;IAE1B,IAAI,iBAAiB,kBAAkB,SAAS,MAC9C;IAGF,MAAM,YACJ,QAAQ,cAA2B,6BAA2B,KAC9D,wBAAwB,OAAO,CAAC,CAAC;IAEnC,IAAI,WACF,kBAAkB,SAAS;GAE/B,CAAC;EACH;EAEA,UAAU;EAEV,MAAM,eAAe,MAAM,MAAM,UAAU,SAAS;EAEpD,aAAa,aAAa,YAAY;CACxC,GAAG,CAAC,MAAM,OAAO,GAAG,CAAC;AACvB"}
@@ -0,0 +1,13 @@
1
+ import { RowData, Table, TableFeatures } from "@tanstack/react-table";
2
+ //#region src/components/data-table/loading/use-data-table-loading.d.ts
3
+ /**
4
+ * O carregamento da tabela, de `loadingFeature`: `isLoading` na hora, para o `aria-busy`, e
5
+ * `isLoadingVisible` depois de 200ms, para o que aparece na tela. Sem a feature, os dois ficam
6
+ * `false`.
7
+ */
8
+ export declare const useDataTableLoading: <TFeatures extends TableFeatures, TData extends RowData>(table: Table<TFeatures, TData>) => {
9
+ isLoading: boolean;
10
+ isLoadingVisible: boolean;
11
+ };
12
+ //#endregion
13
+ //# sourceMappingURL=use-data-table-loading.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-data-table-loading.d.ts","names":[],"sources":["../../../../src/components/data-table/loading/use-data-table-loading.ts"],"mappings":";;;;;;;qBAgBa,sBACX,kBAAkB,eAClB,cAAc,SAEd,OAAO,MAAM,WAAW"}
@@ -0,0 +1,40 @@
1
+ import { hasTableFeature } from "../../../utils/has-feature.js";
2
+ import { useSelector } from "@tanstack/react-store";
3
+ import { useEffect, useState } from "react";
4
+ //#region src/components/data-table/loading/use-data-table-loading.ts
5
+ /**
6
+ * Quanto o carregamento espera antes de aparecer. Uma resposta mais rápida que isto não mostra
7
+ * nada: o skeleton ou a barra piscariam e sumiriam, o que incomoda mais do que ajuda.
8
+ */
9
+ const LOADING_VISIBLE_DELAY = 200;
10
+ /**
11
+ * O carregamento da tabela, de `loadingFeature`: `isLoading` na hora, para o `aria-busy`, e
12
+ * `isLoadingVisible` depois de 200ms, para o que aparece na tela. Sem a feature, os dois ficam
13
+ * `false`.
14
+ */
15
+ const useDataTableLoading = (table) => {
16
+ /** Re-renderiza quando o carregamento liga ou desliga. A feature é opcional: assina o store. */
17
+ const isLoading = useSelector(table.store, () => hasTableFeature(table, "loadingFeature") && table.atoms.isLoading.get());
18
+ /** Se a carga atual já passou do atraso. Volta a `false` no fim dela, para a próxima esperar. */
19
+ const [isDelayElapsed, setIsDelayElapsed] = useState(false);
20
+ useEffect(() => {
21
+ if (!isLoading) return;
22
+ const timeout = setTimeout(() => setIsDelayElapsed(true), LOADING_VISIBLE_DELAY);
23
+ return () => {
24
+ clearTimeout(timeout);
25
+ setIsDelayElapsed(false);
26
+ };
27
+ }, [isLoading]);
28
+ /**
29
+ * Derivado, e não guardado: desliga no mesmo render em que a carga termina, e o conteúdo novo
30
+ * não espera o efeito.
31
+ */
32
+ return {
33
+ isLoading,
34
+ isLoadingVisible: isLoading && isDelayElapsed
35
+ };
36
+ };
37
+ //#endregion
38
+ export { useDataTableLoading };
39
+
40
+ //# sourceMappingURL=use-data-table-loading.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-data-table-loading.js","names":[],"sources":["../../../../src/components/data-table/loading/use-data-table-loading.ts"],"sourcesContent":["import { useSelector } from '@tanstack/react-store';\nimport type { RowData, Table, TableFeatures } from '@tanstack/react-table';\nimport { useEffect, useState } from 'react';\nimport { hasTableFeature } from '../../../utils';\n\n/**\n * Quanto o carregamento espera antes de aparecer. Uma resposta mais rápida que isto não mostra\n * nada: o skeleton ou a barra piscariam e sumiriam, o que incomoda mais do que ajuda.\n */\nconst LOADING_VISIBLE_DELAY = 200;\n\n/**\n * O carregamento da tabela, de `loadingFeature`: `isLoading` na hora, para o `aria-busy`, e\n * `isLoadingVisible` depois de 200ms, para o que aparece na tela. Sem a feature, os dois ficam\n * `false`.\n */\nexport const useDataTableLoading = <\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(\n table: Table<TFeatures, TData>,\n) => {\n /** Re-renderiza quando o carregamento liga ou desliga. A feature é opcional: assina o store. */\n const isLoading = useSelector(\n table.store,\n () =>\n hasTableFeature(table, 'loadingFeature') && table.atoms.isLoading.get(),\n );\n\n /** Se a carga atual já passou do atraso. Volta a `false` no fim dela, para a próxima esperar. */\n const [isDelayElapsed, setIsDelayElapsed] = useState(false);\n\n useEffect(() => {\n if (!isLoading) {\n return;\n }\n\n const timeout = setTimeout(\n () => setIsDelayElapsed(true),\n LOADING_VISIBLE_DELAY,\n );\n\n return () => {\n clearTimeout(timeout);\n setIsDelayElapsed(false);\n };\n }, [isLoading]);\n\n /**\n * Derivado, e não guardado: desliga no mesmo render em que a carga termina, e o conteúdo novo\n * não espera o efeito.\n */\n return { isLoading, isLoadingVisible: isLoading && isDelayElapsed };\n};\n"],"mappings":";;;;;;;;AASA,MAAM,wBAAwB;;;;;;AAO9B,MAAa,uBAIX,UACG;;CAEH,MAAM,YAAY,YAChB,MAAM,aAEJ,gBAAgB,OAAO,gBAAgB,KAAK,MAAM,MAAM,UAAU,IAAI,CAC1E;;CAGA,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,KAAK;CAE1D,gBAAgB;EACd,IAAI,CAAC,WACH;EAGF,MAAM,UAAU,iBACR,kBAAkB,IAAI,GAC5B,qBACF;EAEA,aAAa;GACX,aAAa,OAAO;GACpB,kBAAkB,KAAK;EACzB;CACF,GAAG,CAAC,SAAS,CAAC;;;;;CAMd,OAAO;EAAE;EAAW,kBAAkB,aAAa;CAAe;AACpE"}
@@ -0,0 +1,45 @@
1
+ import { TableWith } from "../../../types/table-with.js";
2
+ import "../../../types/index.js";
3
+ import { RowData, TableFeatures } from "@tanstack/react-table";
4
+ import { IconButtonProps } from "@lucasbernardosn/react-ui/buttons/icon-button";
5
+ import { MergeOverride } from "@lucasbernardosn/utils";
6
+ //#region src/components/data-table/pagination/data-table-page-button.d.ts
7
+ /** Para onde o botão leva. */
8
+ export type DataTablePageButtonPage = 'first' | 'previous' | 'next' | 'last';
9
+ export type DataTablePageButtonProps<TFeatures extends TableFeatures, TData extends RowData> = MergeOverride<Omit<IconButtonProps, 'icon' | 'aria-label'>, {
10
+ /** A tabela. Exige `rowPaginationFeature`. */
11
+ table: TableWith<TFeatures, TData, 'rowPaginationFeature'>;
12
+ /** Para onde o botão leva: a primeira página, a anterior, a próxima ou a última. */
13
+ page: DataTablePageButtonPage;
14
+ /**
15
+ * O ícone.
16
+ * @default um caret por página: duplo nas pontas, simples na anterior e na próxima
17
+ */
18
+ icon?: IconButtonProps['icon'];
19
+ /**
20
+ * O que o botão faz.
21
+ * @default 'Primeira página', 'Página anterior', 'Próxima página' ou 'Última página'
22
+ */
23
+ 'aria-label'?: string;
24
+ }>;
25
+ /**
26
+ * O botão que leva a outra página: a primeira, a anterior, a próxima ou a última. Fica
27
+ * desabilitado quando não há para onde ir. Sem o total de páginas (`pageCount: -1` na paginação
28
+ * pela API), a próxima continua habilitada, e a última, não.
29
+ *
30
+ * As props do `IconButton` passam adiante, como `variant` e `size`.
31
+ *
32
+ * @example
33
+ * ```tsx
34
+ * <DataTable.PageButton
35
+ * table={table}
36
+ * page="next"
37
+ * />
38
+ * ```
39
+ */
40
+ export declare const DataTablePageButton: {
41
+ <TFeatures extends TableFeatures, TData extends RowData>(props: DataTablePageButtonProps<TFeatures, TData>): import("react").JSX.Element;
42
+ displayName: string;
43
+ };
44
+ //#endregion
45
+ //# sourceMappingURL=data-table-page-button.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"data-table-page-button.d.ts","names":[],"sources":["../../../../src/components/data-table/pagination/data-table-page-button.tsx"],"mappings":";;;;;;;YAgBY;YAEA,yBACV,kBAAkB,eAClB,cAAc,WACZ,cACF,KAAK;;EAGH,OAAO,UAAU,WAAW;;EAE5B,MAAM;;;;;EAKN,OAAO;;;;;EAKP;;;;;;;;;;;;;;;;;qBAiCS;GACX,kBAAkB,eAClB,cAAc,SAAO,OAEd,yBAAyB,WAAW,yBAAM,IAAA"}