@snksergio/design-system 0.19.0 → 0.30.1

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 (251) hide show
  1. package/README.md +39 -12
  2. package/dist-lib/chunks/{app-shell-Cy9be0Zx.mjs → app-shell-78w0pYdP.mjs} +849 -79
  3. package/dist-lib/chunks/app-shell-78w0pYdP.mjs.map +1 -0
  4. package/dist-lib/chunks/{app-shell-CPx9X7zP.cjs → app-shell-Cyh8AUJT.cjs} +947 -176
  5. package/dist-lib/chunks/app-shell-Cyh8AUJT.cjs.map +1 -0
  6. package/dist-lib/chunks/{clientes-showcase-mocks-ayU1SDOA.mjs → clientes-showcase-mocks-CwWGCCmf.mjs} +1 -27
  7. package/dist-lib/chunks/clientes-showcase-mocks-CwWGCCmf.mjs.map +1 -0
  8. package/dist-lib/chunks/{clientes-showcase-mocks-DygUqkkh.cjs → clientes-showcase-mocks-CwhluBTT.cjs} +1 -44
  9. package/dist-lib/chunks/clientes-showcase-mocks-CwhluBTT.cjs.map +1 -0
  10. package/dist-lib/chunks/{input-BWevV7up.cjs → input-BjUSWce3.cjs} +24 -4
  11. package/dist-lib/chunks/input-BjUSWce3.cjs.map +1 -0
  12. package/dist-lib/chunks/{input-C9eKSSEb.mjs → input-DCDU4i4S.mjs} +23 -3
  13. package/dist-lib/chunks/input-DCDU4i4S.mjs.map +1 -0
  14. package/dist-lib/chunks/kpi-delta-C_3V6uG6.cjs +148 -0
  15. package/dist-lib/chunks/kpi-delta-C_3V6uG6.cjs.map +1 -0
  16. package/dist-lib/chunks/kpi-delta-DpYuDY4h.mjs +149 -0
  17. package/dist-lib/chunks/kpi-delta-DpYuDY4h.mjs.map +1 -0
  18. package/dist-lib/chunks/{page-header-CQbTGWQ8.mjs → page-header-B6XJyIMz.mjs} +2 -2
  19. package/dist-lib/chunks/{page-header-CQbTGWQ8.mjs.map → page-header-B6XJyIMz.mjs.map} +1 -1
  20. package/dist-lib/chunks/{page-header-BZ-WrxV2.cjs → page-header-D0rpU0yn.cjs} +4 -4
  21. package/dist-lib/chunks/{page-header-BZ-WrxV2.cjs.map → page-header-D0rpU0yn.cjs.map} +1 -1
  22. package/dist-lib/chunks/{panel-l8mxXYXG.mjs → panel-JPhHRjIS.mjs} +1753 -936
  23. package/dist-lib/chunks/panel-JPhHRjIS.mjs.map +1 -0
  24. package/dist-lib/chunks/{panel-BzrZmUF2.cjs → panel-YQI9vAf_.cjs} +1886 -1068
  25. package/dist-lib/chunks/panel-YQI9vAf_.cjs.map +1 -0
  26. package/dist-lib/index.cjs +3820 -231
  27. package/dist-lib/index.cjs.map +1 -1
  28. package/dist-lib/index.mjs +3899 -314
  29. package/dist-lib/index.mjs.map +1 -1
  30. package/dist-lib/preview/chat.cjs +41 -42
  31. package/dist-lib/preview/chat.cjs.map +1 -1
  32. package/dist-lib/preview/chat.mjs +2 -3
  33. package/dist-lib/preview/chat.mjs.map +1 -1
  34. package/dist-lib/preview/clientes.cjs +22 -24
  35. package/dist-lib/preview/clientes.cjs.map +1 -1
  36. package/dist-lib/preview/clientes.mjs +5 -7
  37. package/dist-lib/preview/clientes.mjs.map +1 -1
  38. package/dist-lib/preview/dashboard.cjs +232 -28
  39. package/dist-lib/preview/dashboard.cjs.map +1 -1
  40. package/dist-lib/preview/dashboard.mjs +215 -11
  41. package/dist-lib/preview/dashboard.mjs.map +1 -1
  42. package/dist-lib/preview/mocks.cjs +1 -1
  43. package/dist-lib/preview/mocks.mjs +1 -1
  44. package/dist-lib/src/components/index.d.ts +14 -0
  45. package/dist-lib/src/components/index.d.ts.map +1 -1
  46. package/dist-lib/src/components/shadcn/command.d.ts.map +1 -1
  47. package/dist-lib/src/components/shadcn/input.d.ts.map +1 -1
  48. package/dist-lib/src/components/shadcn/tabs.d.ts +11 -6
  49. package/dist-lib/src/components/shadcn/tabs.d.ts.map +1 -1
  50. package/dist-lib/src/components/shadcn/tooltip.d.ts +25 -7
  51. package/dist-lib/src/components/shadcn/tooltip.d.ts.map +1 -1
  52. package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.d.ts +13 -0
  53. package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.d.ts.map +1 -0
  54. package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.styles.d.ts +95 -0
  55. package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.styles.d.ts.map +1 -0
  56. package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.types.d.ts +81 -0
  57. package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.types.d.ts.map +1 -0
  58. package/dist-lib/src/components/ui/ChoroplethMap/index.d.ts +3 -0
  59. package/dist-lib/src/components/ui/ChoroplethMap/index.d.ts.map +1 -0
  60. package/dist-lib/src/components/ui/ColorPicker/color-picker.d.ts +16 -0
  61. package/dist-lib/src/components/ui/ColorPicker/color-picker.d.ts.map +1 -0
  62. package/dist-lib/src/components/ui/ColorPicker/color-picker.presets.d.ts +13 -0
  63. package/dist-lib/src/components/ui/ColorPicker/color-picker.presets.d.ts.map +1 -0
  64. package/dist-lib/src/components/ui/ColorPicker/color-picker.styles.d.ts +135 -0
  65. package/dist-lib/src/components/ui/ColorPicker/color-picker.styles.d.ts.map +1 -0
  66. package/dist-lib/src/components/ui/ColorPicker/color-picker.types.d.ts +35 -0
  67. package/dist-lib/src/components/ui/ColorPicker/color-picker.types.d.ts.map +1 -0
  68. package/dist-lib/src/components/ui/ColorPicker/index.d.ts +6 -0
  69. package/dist-lib/src/components/ui/ColorPicker/index.d.ts.map +1 -0
  70. package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.d.ts +23 -0
  71. package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.d.ts.map +1 -0
  72. package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.styles.d.ts +173 -0
  73. package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.styles.d.ts.map +1 -0
  74. package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.types.d.ts +59 -0
  75. package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.types.d.ts.map +1 -0
  76. package/dist-lib/src/components/ui/ConversationListItem/index.d.ts +5 -0
  77. package/dist-lib/src/components/ui/ConversationListItem/index.d.ts.map +1 -0
  78. package/dist-lib/src/components/ui/DataTable/data-table.d.ts.map +1 -1
  79. package/dist-lib/src/components/ui/DataTable/data-table.types.d.ts +14 -1
  80. package/dist-lib/src/components/ui/DataTable/data-table.types.d.ts.map +1 -1
  81. package/dist-lib/src/components/ui/DataTable/hooks/state-persistence-utils.d.ts.map +1 -1
  82. package/dist-lib/src/components/ui/DataTable/hooks/use-column-auto-width.d.ts +9 -0
  83. package/dist-lib/src/components/ui/DataTable/hooks/use-column-auto-width.d.ts.map +1 -1
  84. package/dist-lib/src/components/ui/DataTable/hooks/use-data-table-columns.d.ts +3 -1
  85. package/dist-lib/src/components/ui/DataTable/hooks/use-data-table-columns.d.ts.map +1 -1
  86. package/dist-lib/src/components/ui/DataTable/hooks/use-data-table-controller.d.ts.map +1 -1
  87. package/dist-lib/src/components/ui/DataTable/services/saved-views.types.d.ts +9 -0
  88. package/dist-lib/src/components/ui/DataTable/services/saved-views.types.d.ts.map +1 -1
  89. package/dist-lib/src/components/ui/DataTable/utils/calculate-column-widths.d.ts +16 -0
  90. package/dist-lib/src/components/ui/DataTable/utils/calculate-column-widths.d.ts.map +1 -1
  91. package/dist-lib/src/components/ui/DatePicker/datepicker.d.ts +31 -8
  92. package/dist-lib/src/components/ui/DatePicker/datepicker.d.ts.map +1 -1
  93. package/dist-lib/src/components/ui/DatePicker/index.d.ts +1 -1
  94. package/dist-lib/src/components/ui/DatePicker/index.d.ts.map +1 -1
  95. package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.d.ts +18 -0
  96. package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.d.ts.map +1 -0
  97. package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.styles.d.ts +63 -0
  98. package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.styles.d.ts.map +1 -0
  99. package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.types.d.ts +21 -0
  100. package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.types.d.ts.map +1 -0
  101. package/dist-lib/src/components/ui/DateSeparatorChip/index.d.ts +5 -0
  102. package/dist-lib/src/components/ui/DateSeparatorChip/index.d.ts.map +1 -0
  103. package/dist-lib/src/components/ui/EmptyState/empty-state.d.ts +12 -0
  104. package/dist-lib/src/components/ui/EmptyState/empty-state.d.ts.map +1 -0
  105. package/dist-lib/src/components/ui/EmptyState/empty-state.styles.d.ts +83 -0
  106. package/dist-lib/src/components/ui/EmptyState/empty-state.styles.d.ts.map +1 -0
  107. package/dist-lib/src/components/ui/EmptyState/empty-state.types.d.ts +43 -0
  108. package/dist-lib/src/components/ui/EmptyState/empty-state.types.d.ts.map +1 -0
  109. package/dist-lib/src/components/ui/EmptyState/index.d.ts +5 -0
  110. package/dist-lib/src/components/ui/EmptyState/index.d.ts.map +1 -0
  111. package/dist-lib/src/components/ui/FileUploadField/file-upload-field.d.ts +15 -0
  112. package/dist-lib/src/components/ui/FileUploadField/file-upload-field.d.ts.map +1 -0
  113. package/dist-lib/src/components/ui/FileUploadField/file-upload-field.styles.d.ts +66 -0
  114. package/dist-lib/src/components/ui/FileUploadField/file-upload-field.styles.d.ts.map +1 -0
  115. package/dist-lib/src/components/ui/FileUploadField/file-upload-field.types.d.ts +41 -0
  116. package/dist-lib/src/components/ui/FileUploadField/file-upload-field.types.d.ts.map +1 -0
  117. package/dist-lib/src/components/ui/FileUploadField/index.d.ts +3 -0
  118. package/dist-lib/src/components/ui/FileUploadField/index.d.ts.map +1 -0
  119. package/dist-lib/src/components/ui/Kpi/kpi-delta.d.ts +4 -1
  120. package/dist-lib/src/components/ui/Kpi/kpi-delta.d.ts.map +1 -1
  121. package/dist-lib/src/components/ui/Kpi/kpi.d.ts +1 -1
  122. package/dist-lib/src/components/ui/Kpi/kpi.d.ts.map +1 -1
  123. package/dist-lib/src/components/ui/Kpi/kpi.styles.d.ts +42 -0
  124. package/dist-lib/src/components/ui/Kpi/kpi.styles.d.ts.map +1 -1
  125. package/dist-lib/src/components/ui/Kpi/kpi.types.d.ts +13 -1
  126. package/dist-lib/src/components/ui/Kpi/kpi.types.d.ts.map +1 -1
  127. package/dist-lib/src/components/ui/MarkdownText/index.d.ts +5 -0
  128. package/dist-lib/src/components/ui/MarkdownText/index.d.ts.map +1 -0
  129. package/dist-lib/src/components/ui/MarkdownText/markdown-text.d.ts +14 -0
  130. package/dist-lib/src/components/ui/MarkdownText/markdown-text.d.ts.map +1 -0
  131. package/dist-lib/src/components/ui/MarkdownText/markdown-text.styles.d.ts +72 -0
  132. package/dist-lib/src/components/ui/MarkdownText/markdown-text.styles.d.ts.map +1 -0
  133. package/dist-lib/src/components/ui/MarkdownText/markdown-text.types.d.ts +26 -0
  134. package/dist-lib/src/components/ui/MarkdownText/markdown-text.types.d.ts.map +1 -0
  135. package/dist-lib/src/components/ui/MenuSidebar/sidebar-section.d.ts.map +1 -1
  136. package/dist-lib/src/components/ui/MenuSidebar/sidebar.styles.d.ts +1 -0
  137. package/dist-lib/src/components/ui/MenuSidebar/sidebar.styles.d.ts.map +1 -1
  138. package/dist-lib/src/components/ui/MenuSidebar/sidebar.types.d.ts +7 -1
  139. package/dist-lib/src/components/ui/MenuSidebar/sidebar.types.d.ts.map +1 -1
  140. package/dist-lib/src/components/ui/MessageAck/index.d.ts +5 -0
  141. package/dist-lib/src/components/ui/MessageAck/index.d.ts.map +1 -0
  142. package/dist-lib/src/components/ui/MessageAck/message-ack.d.ts +18 -0
  143. package/dist-lib/src/components/ui/MessageAck/message-ack.d.ts.map +1 -0
  144. package/dist-lib/src/components/ui/MessageAck/message-ack.styles.d.ts +61 -0
  145. package/dist-lib/src/components/ui/MessageAck/message-ack.styles.d.ts.map +1 -0
  146. package/dist-lib/src/components/ui/MessageAck/message-ack.types.d.ts +14 -0
  147. package/dist-lib/src/components/ui/MessageAck/message-ack.types.d.ts.map +1 -0
  148. package/dist-lib/src/components/ui/MessageBubble/index.d.ts +5 -0
  149. package/dist-lib/src/components/ui/MessageBubble/index.d.ts.map +1 -0
  150. package/dist-lib/src/components/ui/MessageBubble/message-bubble.d.ts +20 -0
  151. package/dist-lib/src/components/ui/MessageBubble/message-bubble.d.ts.map +1 -0
  152. package/dist-lib/src/components/ui/MessageBubble/message-bubble.styles.d.ts +180 -0
  153. package/dist-lib/src/components/ui/MessageBubble/message-bubble.styles.d.ts.map +1 -0
  154. package/dist-lib/src/components/ui/MessageBubble/message-bubble.types.d.ts +87 -0
  155. package/dist-lib/src/components/ui/MessageBubble/message-bubble.types.d.ts.map +1 -0
  156. package/dist-lib/src/components/ui/MessageComposer/index.d.ts +5 -0
  157. package/dist-lib/src/components/ui/MessageComposer/index.d.ts.map +1 -0
  158. package/dist-lib/src/components/ui/MessageComposer/message-composer.d.ts +18 -0
  159. package/dist-lib/src/components/ui/MessageComposer/message-composer.d.ts.map +1 -0
  160. package/dist-lib/src/components/ui/MessageComposer/message-composer.styles.d.ts +113 -0
  161. package/dist-lib/src/components/ui/MessageComposer/message-composer.styles.d.ts.map +1 -0
  162. package/dist-lib/src/components/ui/MessageComposer/message-composer.types.d.ts +49 -0
  163. package/dist-lib/src/components/ui/MessageComposer/message-composer.types.d.ts.map +1 -0
  164. package/dist-lib/src/components/ui/MessageVariablesPicker/index.d.ts +6 -0
  165. package/dist-lib/src/components/ui/MessageVariablesPicker/index.d.ts.map +1 -0
  166. package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.d.ts +12 -0
  167. package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.d.ts.map +1 -0
  168. package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.styles.d.ts +57 -0
  169. package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.styles.d.ts.map +1 -0
  170. package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.types.d.ts +36 -0
  171. package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.types.d.ts.map +1 -0
  172. package/dist-lib/src/components/ui/Modal/modal.d.ts +3 -1
  173. package/dist-lib/src/components/ui/Modal/modal.d.ts.map +1 -1
  174. package/dist-lib/src/components/ui/Modal/modal.styles.d.ts +7 -1
  175. package/dist-lib/src/components/ui/Modal/modal.styles.d.ts.map +1 -1
  176. package/dist-lib/src/components/ui/MonthYearPicker/index.d.ts +3 -0
  177. package/dist-lib/src/components/ui/MonthYearPicker/index.d.ts.map +1 -0
  178. package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.d.ts +11 -0
  179. package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.d.ts.map +1 -0
  180. package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.styles.d.ts +113 -0
  181. package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.styles.d.ts.map +1 -0
  182. package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.types.d.ts +34 -0
  183. package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.types.d.ts.map +1 -0
  184. package/dist-lib/src/components/ui/SingleMenuSidebar/single-menu-sidebar.styles.d.ts +1 -1
  185. package/dist-lib/src/components/ui/Spinner/index.d.ts +3 -0
  186. package/dist-lib/src/components/ui/Spinner/index.d.ts.map +1 -0
  187. package/dist-lib/src/components/ui/Spinner/spinner.d.ts +11 -0
  188. package/dist-lib/src/components/ui/Spinner/spinner.d.ts.map +1 -0
  189. package/dist-lib/src/components/ui/Spinner/spinner.styles.d.ts +55 -0
  190. package/dist-lib/src/components/ui/Spinner/spinner.styles.d.ts.map +1 -0
  191. package/dist-lib/src/components/ui/Spinner/spinner.types.d.ts +12 -0
  192. package/dist-lib/src/components/ui/Spinner/spinner.types.d.ts.map +1 -0
  193. package/dist-lib/src/components/ui/TableToolbar/parts/table-toolbar-views.d.ts +7 -1
  194. package/dist-lib/src/components/ui/TableToolbar/parts/table-toolbar-views.d.ts.map +1 -1
  195. package/dist-lib/src/components/ui/Toast/toast.d.ts +44 -0
  196. package/dist-lib/src/components/ui/Toast/toast.d.ts.map +1 -0
  197. package/dist-lib/src/hooks/useBrand.d.ts +31 -0
  198. package/dist-lib/src/hooks/useBrand.d.ts.map +1 -0
  199. package/dist-lib/src/preview/pages/ChatV2/components/QueueColumn/queue-column.styles.d.ts +3 -3
  200. package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase-mocks.d.ts +1 -1
  201. package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase-mocks.d.ts.map +1 -1
  202. package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase.types.d.ts +1 -1
  203. package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase.types.d.ts.map +1 -1
  204. package/dist-lib/src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.types.d.ts +1 -1
  205. package/dist-lib/src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.types.d.ts.map +1 -1
  206. package/dist-lib/src/preview/pages/DashboardShowcase.d.ts.map +1 -1
  207. package/dist-lib/src/preview/pages/_table-data.d.ts +51 -0
  208. package/dist-lib/src/preview/pages/_table-data.d.ts.map +1 -0
  209. package/dist-lib/src/utils/tv.d.ts.map +1 -1
  210. package/dist-lib/theme.css +32 -0
  211. package/dist-lib/tokens/brands/blue/primitives/color-palette.d.ts +266 -0
  212. package/dist-lib/tokens/brands/blue/primitives/color-palette.d.ts.map +1 -0
  213. package/dist-lib/tokens/brands/blue/semantic/color-dark.d.ts +200 -0
  214. package/dist-lib/tokens/brands/blue/semantic/color-dark.d.ts.map +1 -0
  215. package/dist-lib/tokens/brands/blue/semantic/color-light.d.ts +202 -0
  216. package/dist-lib/tokens/brands/blue/semantic/color-light.d.ts.map +1 -0
  217. package/dist-lib/tokens/brands/default/semantic/typography.d.ts +4 -2
  218. package/dist-lib/tokens/brands/default/semantic/typography.d.ts.map +1 -1
  219. package/dist-lib/tokens/brands/green/primitives/color-palette.d.ts +267 -0
  220. package/dist-lib/tokens/brands/green/primitives/color-palette.d.ts.map +1 -0
  221. package/dist-lib/tokens/brands/green/semantic/color-dark.d.ts +200 -0
  222. package/dist-lib/tokens/brands/green/semantic/color-dark.d.ts.map +1 -0
  223. package/dist-lib/tokens/brands/green/semantic/color-light.d.ts +201 -0
  224. package/dist-lib/tokens/brands/green/semantic/color-light.d.ts.map +1 -0
  225. package/dist-lib/tokens/brands/pay/primitives/color-palette.d.ts +146 -0
  226. package/dist-lib/tokens/brands/pay/primitives/color-palette.d.ts.map +1 -0
  227. package/dist-lib/tokens/brands/pay/semantic/color-dark.d.ts +201 -0
  228. package/dist-lib/tokens/brands/pay/semantic/color-dark.d.ts.map +1 -0
  229. package/dist-lib/tokens/brands/pay/semantic/color-light.d.ts +199 -0
  230. package/dist-lib/tokens/brands/pay/semantic/color-light.d.ts.map +1 -0
  231. package/dist-lib/tokens.cjs +35 -0
  232. package/dist-lib/tokens.cjs.map +1 -1
  233. package/dist-lib/tokens.mjs +35 -0
  234. package/dist-lib/tokens.mjs.map +1 -1
  235. package/package.json +21 -7
  236. package/dist-lib/chunks/app-shell-CPx9X7zP.cjs.map +0 -1
  237. package/dist-lib/chunks/app-shell-Cy9be0Zx.mjs.map +0 -1
  238. package/dist-lib/chunks/badge-DBdk74KN.mjs +0 -840
  239. package/dist-lib/chunks/badge-DBdk74KN.mjs.map +0 -1
  240. package/dist-lib/chunks/badge-gU2wtxrn.cjs +0 -856
  241. package/dist-lib/chunks/badge-gU2wtxrn.cjs.map +0 -1
  242. package/dist-lib/chunks/chip-group-2-f_Yo7Y.cjs +0 -763
  243. package/dist-lib/chunks/chip-group-2-f_Yo7Y.cjs.map +0 -1
  244. package/dist-lib/chunks/chip-group-_e-yh1Zq.mjs +0 -747
  245. package/dist-lib/chunks/chip-group-_e-yh1Zq.mjs.map +0 -1
  246. package/dist-lib/chunks/clientes-showcase-mocks-DygUqkkh.cjs.map +0 -1
  247. package/dist-lib/chunks/clientes-showcase-mocks-ayU1SDOA.mjs.map +0 -1
  248. package/dist-lib/chunks/input-BWevV7up.cjs.map +0 -1
  249. package/dist-lib/chunks/input-C9eKSSEb.mjs.map +0 -1
  250. package/dist-lib/chunks/panel-BzrZmUF2.cjs.map +0 -1
  251. package/dist-lib/chunks/panel-l8mxXYXG.mjs.map +0 -1
@@ -3,16 +3,15 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
3
3
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
4
  import { jsx, jsxs, Fragment } from "react/jsx-runtime";
5
5
  import * as React from "react";
6
- import React__default, { forwardRef, createContext, useContext, useState, useMemo as useMemo$1, useId, useEffect, useRef, useCallback as useCallback$1, Fragment as Fragment$1, useLayoutEffect, useImperativeHandle, memo } from "react";
6
+ import React__default, { forwardRef, createContext, useContext, useId, useState, useRef, useCallback as useCallback$1, useEffect, useMemo as useMemo$1, Fragment as Fragment$1, useLayoutEffect, useImperativeHandle, memo } from "react";
7
7
  import { useSensors, useSensor, PointerSensor, KeyboardSensor, DndContext, closestCorners, DragOverlay, useDroppable, useDraggable, closestCenter } from "@dnd-kit/core";
8
8
  import { useSortable, sortableKeyboardCoordinates, SortableContext, horizontalListSortingStrategy, arrayMove } from "@dnd-kit/sortable";
9
9
  import { useVirtualizer } from "@tanstack/react-virtual";
10
- import { c as cn, t as tv, B as Button, C as Chip } from "./chip-group-_e-yh1Zq.mjs";
11
- import { C as Checkbox, e as TableHeadCell, c as TableCell, f as TableRow, T as Table, d as TableHead, a as TableBody, b as TableCardRow } from "./badge-DBdk74KN.mjs";
12
- import { W as Popover, X as PopoverTrigger, Y as PopoverContent, Z as Command, l as CommandInput, m as CommandList, n as CommandEmpty, o as CommandGroup, p as CommandItem, D as DropdownMenu, c as DropdownMenuTrigger, d as DropdownMenuContent, r as DropdownMenuLabel, f as DropdownMenuSeparator, e as DropdownMenuItem, I as InputGroup, z as InputGroupInput, x as InputGroupAddon, B as InputGroupText, g as Dialog, i as DialogContent, k as DialogClose, j as DialogTitle, _ as DialogDescription, $ as PopoverAnchor, V as useMediaQuery } from "./app-shell-Cy9be0Zx.mjs";
13
- import { X, CheckCircle2, AlertCircle, AlertTriangle, Info, ChevronDown, Check, Search, CircleX, MoreHorizontal, Filter, ChevronLeft, GripVertical, Pin, PinOff, ArrowUp, ArrowDown, Plus, Trash2, Eye, Users, ChevronUp, ChevronRight, ArrowUpDown, Columns, SlidersHorizontal, Minimize2, Maximize2, Type, Hash, ChevronLeftIcon, ChevronRightIcon, Calendar as Calendar$1, ToggleLeft, DollarSign, Percent, AtSign, Phone, Link, ExternalLink, User, Tag, Tags, CalendarClock, ChevronsLeft, ChevronsRight, Inbox, SearchX, FilterX, PinIcon, EyeOff, Loader2, Copy, Rows3, LayoutGrid, Settings2, RefreshCw, Table as Table$1, FileText, List as List$1, Rows4, Rows2 } from "lucide-react";
10
+ import { c as cn, t as tv, B as Button, L as InputGroup, O as InputGroupInput, M as InputGroupAddon, Q as InputGroupText, P as Popover, j as PopoverTrigger, k as PopoverContent, a8 as Command, u as CommandInput, v as CommandList, w as CommandEmpty, x as CommandGroup, y as CommandItem, D as DropdownMenu, f as DropdownMenuTrigger, g as DropdownMenuContent, E as DropdownMenuLabel, i as DropdownMenuSeparator, h as DropdownMenuItem, l as Dialog, n as DialogContent, q as DialogClose, o as DialogTitle, r as DialogDescription, p as PopoverAnchor, C as Chip, a7 as useMediaQuery } from "./app-shell-78w0pYdP.mjs";
11
+ import { X, CheckCircle2, AlertCircle, AlertTriangle, Info, ChevronDown, Minus, Check, ChevronUp, ArrowUp, ArrowDown, ArrowUpDown, Search, CircleX, MoreHorizontal, Filter, ChevronLeft, GripVertical, Pin, PinOff, Plus, Trash2, Eye, Users, ChevronRight, Columns, SlidersHorizontal, Minimize2, Maximize2, Type, Hash, ChevronLeftIcon, ChevronRightIcon, Calendar as Calendar$1, ToggleLeft, DollarSign, Percent, AtSign, Phone, Link, ExternalLink, User, Tag, Tags, CalendarClock, ChevronsLeft, ChevronsRight, Inbox, SearchX, FilterX, PinIcon, EyeOff, Loader2, Copy, Rows3, LayoutGrid, Settings2, RefreshCw, Table as Table$1, FileText, List as List$1, Rows4, Rows2 } from "lucide-react";
12
+ import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
14
13
  import * as SwitchPrimitives from "@radix-ui/react-switch";
15
- import { I as Input } from "./input-C9eKSSEb.mjs";
14
+ import { I as Input } from "./input-DCDU4i4S.mjs";
16
15
  import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
17
16
  import * as SelectPrimitive from "@radix-ui/react-select";
18
17
  import ReactDOM, { createPortal, flushSync } from "react-dom";
@@ -420,120 +419,1416 @@ const ButtonGroup = Object.assign(ButtonGroupRoot, {
420
419
  Primary: ButtonGroupPrimary,
421
420
  Chevron: ButtonGroupChevron
422
421
  });
423
- const comboboxStyles = tv({
424
- slots: {
425
- trigger: [
422
+ const Checkbox = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
423
+ CheckboxPrimitive.Root,
424
+ {
425
+ ref: ref2,
426
+ className: cn(
427
+ "peer relative flex size-4 shrink-0 items-center justify-center cursor-pointer",
428
+ "rounded-radius-xs",
429
+ "bg-bg-input dark:bg-bg-muted",
430
+ "border-[1.5px] border-border-input",
431
+ "transition-[background-color,border-color,box-shadow] outline-none",
432
+ "hover:border-border-default",
433
+ "focus-visible:shadow-sh-ring",
434
+ "disabled:cursor-not-allowed disabled:opacity-50",
435
+ "data-[state=checked]:bg-bg-brand data-[state=checked]:border-border-brand",
436
+ "data-[state=indeterminate]:bg-bg-brand data-[state=indeterminate]:border-border-brand",
437
+ className
438
+ ),
439
+ ...props,
440
+ children: /* @__PURE__ */ jsx(
441
+ CheckboxPrimitive.Indicator,
442
+ {
443
+ className: cn("grid place-content-center text-fg-on-brand"),
444
+ children: props.checked === "indeterminate" ? /* @__PURE__ */ jsx(Minus, { className: "size-3", strokeWidth: 3 }) : /* @__PURE__ */ jsx(Check, { className: "size-3", strokeWidth: 3 })
445
+ }
446
+ )
447
+ }
448
+ ));
449
+ Checkbox.displayName = CheckboxPrimitive.Root.displayName;
450
+ const formFieldRoot = tv({
451
+ base: "flex flex-col gap-[7px] w-full"
452
+ });
453
+ const formFieldLabel = tv({
454
+ base: [
455
+ "text-body-sm font-semibold tracking-[0.01em] leading-none",
456
+ "text-fg-default dark:text-fg-muted",
457
+ "select-none"
458
+ ],
459
+ variants: {
460
+ disabled: {
461
+ true: "opacity-50 cursor-not-allowed"
462
+ }
463
+ }
464
+ });
465
+ const formFieldRequired = tv({
466
+ base: "ml-[2px] text-fg-danger"
467
+ });
468
+ const formFieldMessage = tv({
469
+ base: "text-caption-sm leading-snug",
470
+ variants: {
471
+ state: {
472
+ default: "text-fg-muted",
473
+ error: "text-fg-danger",
474
+ warning: "text-fg-warning",
475
+ success: "text-fg-success"
476
+ }
477
+ },
478
+ defaultVariants: { state: "default" }
479
+ });
480
+ function FormField({
481
+ label,
482
+ required: required2,
483
+ helperText,
484
+ state = "default",
485
+ errorMessage,
486
+ warningMessage,
487
+ successMessage,
488
+ className,
489
+ id: idProp,
490
+ children,
491
+ hideLabel,
492
+ disabled
493
+ }) {
494
+ const autoId = useId();
495
+ const id = idProp ?? autoId;
496
+ let message = helperText;
497
+ let messageState = "default";
498
+ if (state === "error" && errorMessage) {
499
+ message = errorMessage;
500
+ messageState = "error";
501
+ } else if (state === "warning" && warningMessage) {
502
+ message = warningMessage;
503
+ messageState = "warning";
504
+ } else if (state === "success" && successMessage) {
505
+ message = successMessage;
506
+ messageState = "success";
507
+ }
508
+ return /* @__PURE__ */ jsxs("div", { className: cn(formFieldRoot(), className), children: [
509
+ label && !hideLabel && /* @__PURE__ */ jsxs(
510
+ "label",
511
+ {
512
+ htmlFor: id,
513
+ className: formFieldLabel({ disabled }),
514
+ children: [
515
+ label,
516
+ required2 && /* @__PURE__ */ jsx("span", { className: formFieldRequired(), "aria-hidden": "true", children: "*" })
517
+ ]
518
+ }
519
+ ),
520
+ children({ id, state }),
521
+ message && /* @__PURE__ */ jsx(
522
+ "p",
523
+ {
524
+ className: formFieldMessage({ state: messageState }),
525
+ role: messageState === "error" ? "alert" : void 0,
526
+ children: message
527
+ }
528
+ )
529
+ ] });
530
+ }
531
+ function renderAddon(content, key) {
532
+ if (typeof content === "string") {
533
+ return /* @__PURE__ */ jsx(InputGroupAddon, { align: key === "start" ? "inline-start" : "inline-end", children: /* @__PURE__ */ jsx(InputGroupText, { children: content }) }, key);
534
+ }
535
+ return /* @__PURE__ */ jsx(InputGroupAddon, { align: key === "start" ? "inline-start" : "inline-end", children: content }, key);
536
+ }
537
+ const FormFieldInput = forwardRef(
538
+ ({
539
+ label,
540
+ required: required2,
541
+ helperText,
542
+ state,
543
+ errorMessage,
544
+ warningMessage,
545
+ successMessage,
546
+ className,
547
+ id,
548
+ startAddon,
549
+ endAddon,
550
+ ...inputProps
551
+ }, ref2) => {
552
+ const hasAddon = startAddon !== void 0 || endAddon !== void 0;
553
+ const { size, ...inputHtmlProps } = inputProps;
554
+ return /* @__PURE__ */ jsx(
555
+ FormField,
556
+ {
557
+ label,
558
+ required: required2,
559
+ helperText,
560
+ state,
561
+ errorMessage,
562
+ warningMessage,
563
+ successMessage,
564
+ className,
565
+ id,
566
+ disabled: inputProps.disabled,
567
+ children: ({ id: fieldId, state: fieldState }) => hasAddon ? /* @__PURE__ */ jsxs(InputGroup, { state: fieldState, size: size ?? void 0, children: [
568
+ startAddon !== void 0 && renderAddon(startAddon, "start"),
569
+ /* @__PURE__ */ jsx(InputGroupInput, { ref: ref2, id: fieldId, ...inputHtmlProps }),
570
+ endAddon !== void 0 && renderAddon(endAddon, "end")
571
+ ] }) : /* @__PURE__ */ jsx(
572
+ Input,
573
+ {
574
+ ref: ref2,
575
+ id: fieldId,
576
+ state: fieldState,
577
+ size,
578
+ ...inputHtmlProps
579
+ }
580
+ )
581
+ }
582
+ );
583
+ }
584
+ );
585
+ FormFieldInput.displayName = "FormFieldInput";
586
+ const textareaVariants = cva(
587
+ [
588
+ "flex min-h-[100px] w-full resize-y",
589
+ "bg-bg-input dark:bg-bg-muted",
590
+ "hover:bg-bg-input-hover dark:hover:bg-bg-muted-hover",
591
+ "border border-border-input rounded-radius-lg",
592
+ "px-pad-xl py-pad-lg",
593
+ "text-body-sm font-normal leading-[1.5] text-fg-default",
594
+ "placeholder:text-fg-muted placeholder:opacity-70",
595
+ "transition-[color,box-shadow,background-color,border-color] outline-none",
596
+ "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-bg-input dark:disabled:hover:bg-bg-muted"
597
+ ],
598
+ {
599
+ variants: {
600
+ state: {
601
+ default: "focus-visible:border-border-brand focus-visible:shadow-sh-ring",
602
+ error: "border-border-danger-muted focus-visible:border-border-danger-muted focus-visible:shadow-sh-ring-danger",
603
+ warning: "border-border-warning-muted focus-visible:border-border-warning-muted focus-visible:shadow-sh-ring-warning",
604
+ success: "border-border-success-muted focus-visible:border-border-success-muted focus-visible:shadow-sh-ring-success"
605
+ }
606
+ },
607
+ defaultVariants: {
608
+ state: "default"
609
+ }
610
+ }
611
+ );
612
+ const Textarea = React.forwardRef(
613
+ ({ className, state, ...props }, ref2) => {
614
+ return /* @__PURE__ */ jsx(
615
+ "textarea",
616
+ {
617
+ className: cn(textareaVariants({ state }), className),
618
+ ref: ref2,
619
+ ...props
620
+ }
621
+ );
622
+ }
623
+ );
624
+ Textarea.displayName = "Textarea";
625
+ const FormFieldTextarea = forwardRef(
626
+ ({
627
+ label,
628
+ required: required2,
629
+ helperText,
630
+ state,
631
+ errorMessage,
632
+ warningMessage,
633
+ successMessage,
634
+ className,
635
+ id,
636
+ ...textareaProps
637
+ }, ref2) => /* @__PURE__ */ jsx(
638
+ FormField,
639
+ {
640
+ label,
641
+ required: required2,
642
+ helperText,
643
+ state,
644
+ errorMessage,
645
+ warningMessage,
646
+ successMessage,
647
+ className,
648
+ id,
649
+ disabled: textareaProps.disabled,
650
+ children: ({ id: fieldId, state: fieldState }) => /* @__PURE__ */ jsx(
651
+ Textarea,
652
+ {
653
+ ref: ref2,
654
+ id: fieldId,
655
+ state: fieldState,
656
+ ...textareaProps
657
+ }
658
+ )
659
+ }
660
+ )
661
+ );
662
+ FormFieldTextarea.displayName = "FormFieldTextarea";
663
+ const Select = SelectPrimitive.Root;
664
+ const SelectValue = SelectPrimitive.Value;
665
+ const SelectTrigger = React.forwardRef(({ className, children, state = "default", ...props }, ref2) => /* @__PURE__ */ jsxs(
666
+ SelectPrimitive.Trigger,
667
+ {
668
+ ref: ref2,
669
+ className: cn(
426
670
  "flex min-h-form-lg w-full items-center justify-between gap-gp-md",
427
671
  "rounded-radius-lg px-pad-xl",
428
672
  "bg-bg-input dark:bg-bg-muted",
429
673
  "hover:bg-bg-input-hover dark:hover:bg-bg-muted-hover",
430
674
  "border border-border-input",
431
- "text-body-sm font-normal text-fg-default text-left",
432
- "transition-[color,box-shadow,background-color,border-color]",
433
- "focus-visible:outline-none",
675
+ "text-body-sm font-normal text-fg-default",
676
+ "transition-[color,box-shadow,background-color,border-color] outline-none",
434
677
  "data-[placeholder]:text-fg-muted data-[placeholder]:opacity-70",
435
- "focus-visible:border-border-brand data-[state=open]:border-border-brand",
436
- "focus-visible:shadow-sh-ring data-[state=open]:shadow-sh-ring",
437
- "disabled:cursor-not-allowed disabled:opacity-50",
438
- "disabled:hover:bg-bg-input dark:disabled:hover:bg-bg-muted"
439
- ],
440
- value: "min-w-0 flex-1 truncate text-left",
441
- icon: "size-4 shrink-0 text-fg-muted",
442
- // Dropdown alinhado à largura do trigger (mesmo pattern do Select via
443
- // `--radix-*-trigger-width`). `p-0`/overflow: o Command interno já provê o
444
- // padding e o scroll da lista.
445
- content: "w-[var(--radix-popover-trigger-width)] overflow-hidden p-0",
446
- // Item da lista: ocupa a largura e trunca rótulos longos.
447
- itemLabel: "min-w-0 flex-1 truncate"
678
+ state === "default" && "focus-visible:border-border-brand data-[state=open]:border-border-brand focus-visible:shadow-sh-ring data-[state=open]:shadow-sh-ring",
679
+ state === "error" && "border-border-danger-muted focus-visible:border-border-danger-muted data-[state=open]:border-border-danger-muted focus-visible:shadow-sh-ring-danger data-[state=open]:shadow-sh-ring-danger",
680
+ state === "warning" && "border-border-warning-muted focus-visible:border-border-warning-muted data-[state=open]:border-border-warning-muted focus-visible:shadow-sh-ring-warning data-[state=open]:shadow-sh-ring-warning",
681
+ state === "success" && "border-border-success-muted focus-visible:border-border-success-muted data-[state=open]:border-border-success-muted focus-visible:shadow-sh-ring-success data-[state=open]:shadow-sh-ring-success",
682
+ "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-bg-input dark:disabled:hover:bg-bg-muted",
683
+ "[&>span]:line-clamp-1",
684
+ className
685
+ ),
686
+ ...props,
687
+ children: [
688
+ children,
689
+ /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4 text-fg-muted shrink-0" }) })
690
+ ]
691
+ }
692
+ ));
693
+ SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
694
+ const SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
695
+ SelectPrimitive.ScrollUpButton,
696
+ {
697
+ ref: ref2,
698
+ className: cn(
699
+ "flex cursor-default items-center justify-center py-pad-xs",
700
+ className
701
+ ),
702
+ ...props,
703
+ children: /* @__PURE__ */ jsx(ChevronUp, { className: "h-4 w-4" })
704
+ }
705
+ ));
706
+ SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
707
+ const SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
708
+ SelectPrimitive.ScrollDownButton,
709
+ {
710
+ ref: ref2,
711
+ className: cn(
712
+ "flex cursor-default items-center justify-center py-pad-xs",
713
+ className
714
+ ),
715
+ ...props,
716
+ children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" })
717
+ }
718
+ ));
719
+ SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
720
+ const SelectContent = React.forwardRef(({ className, children, position: position2 = "popper", ...props }, ref2) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
721
+ SelectPrimitive.Content,
722
+ {
723
+ ref: ref2,
724
+ className: cn(
725
+ "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden",
726
+ "rounded-[12px] bg-bg-dropdown border border-border-default shadow-sh-lg outline-float",
727
+ "before:pointer-events-none before:absolute before:inset-0 before:-z-10 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150",
728
+ "text-fg-default",
729
+ "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
730
+ "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
731
+ "origin-[--radix-select-content-transform-origin]",
732
+ position2 === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
733
+ className
734
+ ),
735
+ position: position2,
736
+ ...props,
737
+ children: [
738
+ /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
739
+ /* @__PURE__ */ jsx(
740
+ SelectPrimitive.Viewport,
741
+ {
742
+ className: cn(
743
+ "p-pad-sm",
744
+ position2 === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
745
+ ),
746
+ children
747
+ }
748
+ ),
749
+ /* @__PURE__ */ jsx(SelectScrollDownButton, {})
750
+ ]
751
+ }
752
+ ) }));
753
+ SelectContent.displayName = SelectPrimitive.Content.displayName;
754
+ const SelectLabel = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
755
+ SelectPrimitive.Label,
756
+ {
757
+ ref: ref2,
758
+ className: cn("py-pad-sm pl-8 pr-2 text-body-md font-medium text-fg-muted", className),
759
+ ...props
760
+ }
761
+ ));
762
+ SelectLabel.displayName = SelectPrimitive.Label.displayName;
763
+ const SelectItem = React.forwardRef(({ className, children, ...props }, ref2) => /* @__PURE__ */ jsxs(
764
+ SelectPrimitive.Item,
765
+ {
766
+ ref: ref2,
767
+ className: cn(
768
+ "relative flex w-full cursor-default select-none items-center gap-pad-md",
769
+ "rounded-radius-sm py-pad-md pl-8 pr-pad-lg",
770
+ "text-body-sm font-medium text-fg-muted",
771
+ "outline-none transition-colors",
772
+ "focus:bg-bg-muted focus:text-fg-default",
773
+ "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
774
+ "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-fg-muted",
775
+ "focus:[&_svg]:text-fg-default",
776
+ className
777
+ ),
778
+ ...props,
779
+ children: [
780
+ /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
781
+ /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
782
+ ]
783
+ }
784
+ ));
785
+ SelectItem.displayName = SelectPrimitive.Item.displayName;
786
+ const SelectSeparator = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
787
+ SelectPrimitive.Separator,
788
+ {
789
+ ref: ref2,
790
+ className: cn("-mx-1 my-1 h-px bg-border", className),
791
+ ...props
792
+ }
793
+ ));
794
+ SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
795
+ function FormFieldSelect({
796
+ label,
797
+ required: required2,
798
+ helperText,
799
+ state,
800
+ errorMessage,
801
+ warningMessage,
802
+ successMessage,
803
+ className,
804
+ id,
805
+ options,
806
+ placeholder: placeholder2,
807
+ value,
808
+ defaultValue,
809
+ onValueChange,
810
+ disabled,
811
+ triggerClassName,
812
+ contentClassName
813
+ }) {
814
+ return /* @__PURE__ */ jsx(
815
+ FormField,
816
+ {
817
+ label,
818
+ required: required2,
819
+ helperText,
820
+ state,
821
+ errorMessage,
822
+ warningMessage,
823
+ successMessage,
824
+ className,
825
+ id,
826
+ disabled,
827
+ children: ({ id: fieldId, state: fieldState }) => /* @__PURE__ */ jsxs(
828
+ Select,
829
+ {
830
+ value,
831
+ defaultValue,
832
+ onValueChange,
833
+ disabled,
834
+ children: [
835
+ /* @__PURE__ */ jsx(
836
+ SelectTrigger,
837
+ {
838
+ id: fieldId,
839
+ state: fieldState,
840
+ className: triggerClassName,
841
+ children: /* @__PURE__ */ jsx(SelectValue, { placeholder: placeholder2 })
842
+ }
843
+ ),
844
+ /* @__PURE__ */ jsx(SelectContent, { className: contentClassName, children: options.map((opt) => /* @__PURE__ */ jsx(
845
+ SelectItem,
846
+ {
847
+ value: opt.value,
848
+ disabled: opt.disabled,
849
+ children: opt.label
850
+ },
851
+ opt.value
852
+ )) })
853
+ ]
854
+ }
855
+ )
856
+ }
857
+ );
858
+ }
859
+ const FormFieldCheckbox = forwardRef(
860
+ ({
861
+ label,
862
+ required: required2,
863
+ helperText,
864
+ state = "default",
865
+ errorMessage,
866
+ warningMessage,
867
+ successMessage,
868
+ className,
869
+ id: idProp,
870
+ disabled,
871
+ ...checkboxProps
872
+ }, ref2) => {
873
+ const autoId = useId();
874
+ const id = idProp ?? autoId;
875
+ let message = helperText;
876
+ let messageState = "default";
877
+ if (state === "error" && errorMessage) {
878
+ message = errorMessage;
879
+ messageState = "error";
880
+ } else if (state === "warning" && warningMessage) {
881
+ message = warningMessage;
882
+ messageState = "warning";
883
+ } else if (state === "success" && successMessage) {
884
+ message = successMessage;
885
+ messageState = "success";
886
+ }
887
+ return /* @__PURE__ */ jsxs("div", { className: cn(formFieldRoot(), "gap-[5px]", className), children: [
888
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-md", children: [
889
+ /* @__PURE__ */ jsx(
890
+ Checkbox,
891
+ {
892
+ ref: ref2,
893
+ id,
894
+ disabled,
895
+ ...checkboxProps
896
+ }
897
+ ),
898
+ label && /* @__PURE__ */ jsxs(
899
+ "label",
900
+ {
901
+ htmlFor: id,
902
+ className: cn(formFieldLabel({ disabled }), "cursor-pointer"),
903
+ children: [
904
+ label,
905
+ required2 && /* @__PURE__ */ jsx("span", { className: formFieldRequired(), "aria-hidden": "true", children: "*" })
906
+ ]
907
+ }
908
+ )
909
+ ] }),
910
+ message && /* @__PURE__ */ jsx(
911
+ "p",
912
+ {
913
+ className: cn(formFieldMessage({ state: messageState }), "pl-[26px]"),
914
+ role: messageState === "error" ? "alert" : void 0,
915
+ children: message
916
+ }
917
+ )
918
+ ] });
919
+ }
920
+ );
921
+ FormFieldCheckbox.displayName = "FormFieldCheckbox";
922
+ const Switch = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
923
+ SwitchPrimitives.Root,
924
+ {
925
+ className: cn(
926
+ "peer relative inline-flex h-[24px] w-[42px] shrink-0 cursor-pointer items-center",
927
+ "rounded-radius-full",
928
+ "transition-[background-color,box-shadow] duration-150 outline-none",
929
+ "data-[state=unchecked]:bg-bg-emphasis dark:data-[state=unchecked]:bg-bg-accent",
930
+ "data-[state=checked]:bg-bg-brand",
931
+ "focus-visible:shadow-sh-ring",
932
+ "disabled:cursor-not-allowed disabled:opacity-50",
933
+ className
934
+ ),
935
+ ...props,
936
+ ref: ref2,
937
+ children: /* @__PURE__ */ jsx(
938
+ SwitchPrimitives.Thumb,
939
+ {
940
+ className: cn(
941
+ "pointer-events-none block size-[20px] rounded-radius-full bg-white",
942
+ "shadow-[0_1px_2px_rgba(0,0,0,0.10)]",
943
+ "transition-transform duration-[180ms] ease-[cubic-bezier(0.4,0,0.2,1)]",
944
+ "data-[state=unchecked]:translate-x-[2px]",
945
+ "data-[state=checked]:translate-x-[20px]"
946
+ )
947
+ }
948
+ )
949
+ }
950
+ ));
951
+ Switch.displayName = SwitchPrimitives.Root.displayName;
952
+ const FormFieldSwitch = forwardRef(
953
+ ({
954
+ label,
955
+ required: required2,
956
+ helperText,
957
+ state = "default",
958
+ errorMessage,
959
+ warningMessage,
960
+ successMessage,
961
+ className,
962
+ id: idProp,
963
+ disabled,
964
+ switchPosition = "end",
965
+ ...switchProps
966
+ }, ref2) => {
967
+ const autoId = useId();
968
+ const id = idProp ?? autoId;
969
+ let message = helperText;
970
+ let messageState = "default";
971
+ if (state === "error" && errorMessage) {
972
+ message = errorMessage;
973
+ messageState = "error";
974
+ } else if (state === "warning" && warningMessage) {
975
+ message = warningMessage;
976
+ messageState = "warning";
977
+ } else if (state === "success" && successMessage) {
978
+ message = successMessage;
979
+ messageState = "success";
980
+ }
981
+ const switchEl = /* @__PURE__ */ jsx(Switch, { ref: ref2, id, disabled, ...switchProps });
982
+ const labelEl = label && /* @__PURE__ */ jsxs(
983
+ "label",
984
+ {
985
+ htmlFor: id,
986
+ className: cn(formFieldLabel({ disabled }), "cursor-pointer flex-1"),
987
+ children: [
988
+ label,
989
+ required2 && /* @__PURE__ */ jsx("span", { className: formFieldRequired(), "aria-hidden": "true", children: "*" })
990
+ ]
991
+ }
992
+ );
993
+ return /* @__PURE__ */ jsxs("div", { className: cn(formFieldRoot(), "gap-[5px]", className), children: [
994
+ /* @__PURE__ */ jsx("div", { className: "flex items-center gap-gp-md", children: switchPosition === "start" ? /* @__PURE__ */ jsxs(Fragment, { children: [
995
+ switchEl,
996
+ labelEl
997
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
998
+ labelEl,
999
+ switchEl
1000
+ ] }) }),
1001
+ message && /* @__PURE__ */ jsx(
1002
+ "p",
1003
+ {
1004
+ className: formFieldMessage({ state: messageState }),
1005
+ role: messageState === "error" ? "alert" : void 0,
1006
+ children: message
1007
+ }
1008
+ )
1009
+ ] });
1010
+ }
1011
+ );
1012
+ FormFieldSwitch.displayName = "FormFieldSwitch";
1013
+ const comboboxStyles = tv({
1014
+ slots: {
1015
+ trigger: [
1016
+ "flex min-h-form-lg w-full items-center justify-between gap-gp-md",
1017
+ "rounded-radius-lg px-pad-xl",
1018
+ "bg-bg-input dark:bg-bg-muted",
1019
+ "hover:bg-bg-input-hover dark:hover:bg-bg-muted-hover",
1020
+ "border border-border-input",
1021
+ "text-body-sm font-normal text-fg-default text-left",
1022
+ "transition-[color,box-shadow,background-color,border-color]",
1023
+ "focus-visible:outline-none",
1024
+ "data-[placeholder]:text-fg-muted data-[placeholder]:opacity-70",
1025
+ "focus-visible:border-border-brand data-[state=open]:border-border-brand",
1026
+ "focus-visible:shadow-sh-ring data-[state=open]:shadow-sh-ring",
1027
+ "disabled:cursor-not-allowed disabled:opacity-50",
1028
+ "disabled:hover:bg-bg-input dark:disabled:hover:bg-bg-muted"
1029
+ ],
1030
+ value: "min-w-0 flex-1 truncate text-left",
1031
+ icon: "size-4 shrink-0 text-fg-muted",
1032
+ // Dropdown alinhado à largura do trigger (mesmo pattern do Select via
1033
+ // `--radix-*-trigger-width`). `p-0`/overflow: o Command interno já provê o
1034
+ // padding e o scroll da lista.
1035
+ content: "w-[var(--radix-popover-trigger-width)] overflow-hidden p-0",
1036
+ // Item da lista: ocupa a largura e trunca rótulos longos.
1037
+ itemLabel: "min-w-0 flex-1 truncate"
1038
+ }
1039
+ });
1040
+ const Combobox = forwardRef(
1041
+ function Combobox2({
1042
+ options,
1043
+ value,
1044
+ onValueChange,
1045
+ placeholder: placeholder2 = "Selecione…",
1046
+ searchPlaceholder = "Buscar…",
1047
+ emptyMessage = "Nenhum resultado.",
1048
+ open: openProp,
1049
+ defaultOpen,
1050
+ onOpenChange,
1051
+ align = "start",
1052
+ className,
1053
+ contentClassName,
1054
+ disabled,
1055
+ "aria-label": ariaLabel,
1056
+ ...rest
1057
+ }, ref2) {
1058
+ const [uncontrolledOpen, setUncontrolledOpen] = useState(
1059
+ defaultOpen ?? false
1060
+ );
1061
+ const isControlled = openProp !== void 0;
1062
+ const open = isControlled ? openProp : uncontrolledOpen;
1063
+ const setOpen = (next) => {
1064
+ if (!isControlled) setUncontrolledOpen(next);
1065
+ onOpenChange?.(next);
1066
+ };
1067
+ const styles2 = comboboxStyles();
1068
+ const selected = options.find((o) => o.value === value);
1069
+ return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
1070
+ /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
1071
+ "button",
1072
+ {
1073
+ ref: ref2,
1074
+ type: "button",
1075
+ role: "combobox",
1076
+ "aria-expanded": open,
1077
+ "aria-label": ariaLabel,
1078
+ disabled,
1079
+ "data-placeholder": selected ? void 0 : "",
1080
+ className: styles2.trigger({ className }),
1081
+ ...rest,
1082
+ children: [
1083
+ /* @__PURE__ */ jsx("span", { className: styles2.value(), children: selected ? selected.label : placeholder2 }),
1084
+ /* @__PURE__ */ jsx(ChevronDown, { className: styles2.icon(), "aria-hidden": "true" })
1085
+ ]
1086
+ }
1087
+ ) }),
1088
+ /* @__PURE__ */ jsx(
1089
+ PopoverContent,
1090
+ {
1091
+ align,
1092
+ className: styles2.content({ className: contentClassName }),
1093
+ children: /* @__PURE__ */ jsxs(Command, { children: [
1094
+ /* @__PURE__ */ jsx(CommandInput, { placeholder: searchPlaceholder }),
1095
+ /* @__PURE__ */ jsxs(CommandList, { children: [
1096
+ /* @__PURE__ */ jsx(CommandEmpty, { children: emptyMessage }),
1097
+ /* @__PURE__ */ jsx(CommandGroup, { children: options.map((option) => {
1098
+ const isSelected = option.value === value;
1099
+ return /* @__PURE__ */ jsxs(
1100
+ CommandItem,
1101
+ {
1102
+ value: option.label,
1103
+ keywords: [option.value, ...option.keywords ?? []],
1104
+ onSelect: () => {
1105
+ onValueChange?.(option.value);
1106
+ setOpen(false);
1107
+ },
1108
+ className: cn(
1109
+ isSelected && "text-fg-default font-medium [&_svg]:text-fg-brand"
1110
+ ),
1111
+ children: [
1112
+ /* @__PURE__ */ jsx("span", { className: styles2.itemLabel(), children: option.label }),
1113
+ isSelected && /* @__PURE__ */ jsx(Check, { "aria-hidden": "true" })
1114
+ ]
1115
+ },
1116
+ option.value
1117
+ );
1118
+ }) })
1119
+ ] })
1120
+ ] })
1121
+ }
1122
+ )
1123
+ ] });
1124
+ }
1125
+ );
1126
+ Combobox.displayName = "Combobox";
1127
+ const tableStyles = tv({
1128
+ slots: {
1129
+ /* Root grid container. Aplica container-type pra container queries.
1130
+ flex flex-col: scroll child usa flex-1 min-h-0 pra esticar quando há altura forçada
1131
+ (consumer aplica `max-h-[Npx]` no Table) ou pegar altura natural quando não há. */
1132
+ root: [
1133
+ "relative flex flex-col w-full",
1134
+ "bg-bg-table border border-border-table rounded-radius-xl shadow-sh-sm",
1135
+ "overflow-hidden",
1136
+ "[container-type:inline-size]"
1137
+ ],
1138
+ /* Container que faz o scroll (envolve head + body).
1139
+ flex-1 + min-h-0: estica até preencher o root quando há altura forçada;
1140
+ caso contrário, altura natural do conteúdo (flex-1 sem espaço extra = no-op).
1141
+ overflow-auto: scroll-X sempre disponível (colunas largas); scroll-Y só ativa
1142
+ quando o conteúdo excede a altura (que só acontece com max-h externo).
1143
+ scrollbar-thin: classe global do projeto (globals.css) — alpha responsivo light/dark. */
1144
+ scroll: [
1145
+ "flex-1 min-h-0 overflow-auto relative",
1146
+ "scrollbar-thin"
1147
+ ],
1148
+ /* Header row (flex de TableHeadCell). Sticky default. */
1149
+ head: [
1150
+ "flex w-max min-w-full",
1151
+ "bg-bg-table-head border-b border-border-table",
1152
+ "z-20"
1153
+ ],
1154
+ /* Cell do header — type, padding, alinhamento. */
1155
+ headCell: [
1156
+ "relative flex items-center gap-gp-md shrink-0",
1157
+ "h-[42px] px-pad-2xl",
1158
+ "text-body-sm font-semibold leading-none",
1159
+ "text-fg-muted",
1160
+ "select-none",
1161
+ "hover:text-fg-default"
1162
+ ],
1163
+ /* Body container — contém as rows. */
1164
+ body: [
1165
+ "flex flex-col w-max min-w-full"
1166
+ ],
1167
+ /* Row (flex de TableCell). */
1168
+ row: [
1169
+ "group/row relative flex w-full",
1170
+ "border-b border-border-table last:border-b-0",
1171
+ "bg-bg-table",
1172
+ "transition-colors duration-150"
1173
+ ],
1174
+ /* Cell — content cell padrão. */
1175
+ cell: [
1176
+ "flex items-center shrink-0",
1177
+ "px-pad-2xl",
1178
+ "text-body-sm font-normal text-fg-default",
1179
+ "whitespace-nowrap overflow-hidden"
1180
+ ],
1181
+ /* Drag handle do resize — barrinha invisível no edge direito.
1182
+ Apenas a linha dentro do header (after:). Sem projeção pra baixo (before:)
1183
+ porque pseudo-elements absolute COM h-screen ainda contam pro scrollHeight
1184
+ do ancestral com overflow-auto, esticando o body verticalmente. */
1185
+ resizeHandle: [
1186
+ "absolute right-0 top-0 bottom-0 w-[6px] cursor-col-resize z-10",
1187
+ // Linha 1px vertical dentro do header — aparece no hover do TH
1188
+ "after:content-[''] after:absolute after:left-1/2 after:-translate-x-1/2",
1189
+ "after:top-[8px] after:bottom-[8px] after:w-px after:bg-transparent",
1190
+ "after:transition-all after:duration-150",
1191
+ "group-hover/headcell:after:bg-border-default",
1192
+ // Hover direto no handle → linha brand 2px full-height
1193
+ "hover:after:bg-bg-brand hover:after:w-[2px] hover:after:top-0 hover:after:bottom-0",
1194
+ // DRAG ATIVO → mantém linha brand visível independente do :hover
1195
+ "data-[dragging=true]:after:bg-bg-brand data-[dragging=true]:after:w-[2px] data-[dragging=true]:after:top-0 data-[dragging=true]:after:bottom-0"
1196
+ ],
1197
+ /* Ícone de sort no head cell. */
1198
+ sortIcon: [
1199
+ "shrink-0 size-icon-xs",
1200
+ "transition-opacity duration-150"
1201
+ ],
1202
+ /* Ícone de tipo de coluna no head (Hash, User, AtSign…). */
1203
+ typeIcon: [
1204
+ "shrink-0 size-[13px] text-fg-muted opacity-70",
1205
+ "group-hover/headcell:opacity-100"
1206
+ ],
1207
+ /* Badge brand com índice de sort (1, 2, 3). */
1208
+ sortBadge: [
1209
+ "inline-flex items-center justify-center shrink-0",
1210
+ "min-w-[18px] h-[18px] px-[5px]",
1211
+ "rounded-radius-xs bg-bg-brand text-fg-on-brand",
1212
+ "text-caption-xs font-bold leading-none tabular-nums"
1213
+ ],
1214
+ /* Stack absolute na borda direita do head cell — agrupa sort e headMenu.
1215
+ Largura dinâmica: encolhe quando itens estão "hidden", cresce quando aparecem no hover. */
1216
+ headRightStack: [
1217
+ "absolute right-pad-md top-1/2 -translate-y-1/2 z-[1]",
1218
+ // 8px de respiro da borda direita
1219
+ "inline-flex items-center gap-gp-xs",
1220
+ "bg-bg-table-head pl-pad-xs",
1221
+ "pointer-events-none"
1222
+ ],
1223
+ /* Sort ativo (asc/desc) — sempre visível quando isSorted=true. */
1224
+ headSortActive: [
1225
+ "inline-flex items-center gap-gp-xs shrink-0",
1226
+ "text-fg-default"
1227
+ ],
1228
+ /* Sort hint (sortable mas inativo) — display:none default, inline-flex no hover.
1229
+ Como é display:none, NÃO ocupa espaço no stack até aparecer. */
1230
+ headSortHint: [
1231
+ "hidden group-hover/headcell:inline-flex items-center shrink-0",
1232
+ "text-fg-muted opacity-60"
1233
+ ],
1234
+ /* Head menu wrapper — display:none default, inline-flex no hover.
1235
+ Tem pointer-events:auto pra restaurar interatividade (parent stack tem pointer-events:none). */
1236
+ headMenuItem: [
1237
+ // Esconde por padrao; revela quando:
1238
+ // 1. hover no header (group-hover) — UX padrao
1239
+ // 2. focus interno (focus-within) — keyboard navigation
1240
+ // 3. dropdown interno aberto (:has data-state=open) — mantem visivel
1241
+ // enquanto user move cursor pra dentro do menu portal
1242
+ // 4. data-menu-active=true no botao — mantem visivel durante a janela
1243
+ // de close animation (~200ms) pra portal nao perder a ancora
1244
+ "hidden items-center shrink-0",
1245
+ "group-hover/headcell:inline-flex",
1246
+ "focus-within:inline-flex",
1247
+ "has-[[data-state=open]]:inline-flex",
1248
+ "has-[[data-menu-active=true]]:inline-flex",
1249
+ "pointer-events-auto"
1250
+ ],
1251
+ /* Card mode — wrapper de cada row no modo card. */
1252
+ cardWrap: [
1253
+ "flex flex-col w-full p-pad-card-sm gap-gp-md",
1254
+ "border-b border-border-table last:border-b-0",
1255
+ "bg-bg-table"
1256
+ ],
1257
+ /* Card mode — header do card (primary + checkbox + actions). */
1258
+ cardHeader: [
1259
+ "flex items-center justify-between gap-gp-md"
1260
+ ],
1261
+ /* Card mode — body items (label/value). */
1262
+ cardItem: [
1263
+ "flex flex-col gap-gp-2xs"
1264
+ ],
1265
+ /* Card mode — label da coluna acima do valor. */
1266
+ cardLabel: [
1267
+ "text-body-xs uppercase tracking-wider text-fg-muted"
1268
+ ],
1269
+ /* Card mode — valor abaixo do label. */
1270
+ cardValue: [
1271
+ "text-body-md text-fg-default"
1272
+ ]
1273
+ },
1274
+ variants: {
1275
+ // ⚠️ Alturas de row por densidade. DEVEM casar com `DENSITY_ROW_HEIGHT` em
1276
+ // `DataTable/data-table.constants.ts` (usado pela estimativa do virtualizer).
1277
+ // Mudou aqui → mudar lá, senão o scroll virtual desalinha.
1278
+ density: {
1279
+ compact: { row: "h-[40px]", cell: "py-0", headCell: "" },
1280
+ standard: { row: "h-[56px]", cell: "py-0", headCell: "" },
1281
+ comfortable: { row: "h-[64px]", cell: "py-0", headCell: "" }
1282
+ },
1283
+ sticky: {
1284
+ true: { head: "sticky top-0" },
1285
+ false: {}
1286
+ },
1287
+ selected: {
1288
+ true: {
1289
+ row: [
1290
+ "bg-bg-table-row-selected hover:bg-bg-table-row-selected-hover",
1291
+ "before:content-[''] before:absolute before:left-0 before:top-0 before:bottom-0 before:w-[3px] before:bg-bg-brand before:z-[5] before:pointer-events-none"
1292
+ ].join(" "),
1293
+ cardWrap: "bg-bg-table-row-selected hover:bg-bg-table-row-selected-hover"
1294
+ },
1295
+ false: {
1296
+ row: "hover:bg-bg-table-row-hover",
1297
+ cardWrap: "hover:bg-bg-table-row-hover"
1298
+ }
1299
+ },
1300
+ clickable: {
1301
+ true: { row: "cursor-pointer", cardWrap: "cursor-pointer" },
1302
+ false: {}
1303
+ },
1304
+ pinned: {
1305
+ // `bg-inherit` cobre o conteúdo scrollado nos estados normais (row bg opaco).
1306
+ // Quando a row está destacada (`data-highlighted` via group/row), o bg da row
1307
+ // é color-mix com transparent → trocamos pro token SÓLIDO pra não vazar.
1308
+ // Hover usa variante de grupo ARBITRÁRIA única (`[[data-highlighted]:hover]`)
1309
+ // — encadear dois `group-*/row` geraria descendente aninhado (não casa).
1310
+ left: {
1311
+ headCell: "sticky z-10 bg-bg-table-head",
1312
+ cell: "sticky z-[5] bg-inherit group-data-[highlighted]/row:bg-bg-table-row-selected-solid group-[[data-highlighted]:hover]/row:bg-bg-table-row-selected-hover-solid"
1313
+ },
1314
+ right: {
1315
+ headCell: "sticky z-10 bg-bg-table-head",
1316
+ cell: "sticky z-[5] bg-inherit group-data-[highlighted]/row:bg-bg-table-row-selected-solid group-[[data-highlighted]:hover]/row:bg-bg-table-row-selected-hover-solid"
1317
+ }
1318
+ },
1319
+ align: {
1320
+ left: { cell: "justify-start text-left", headCell: "justify-start text-left" },
1321
+ center: { cell: "justify-center text-center", headCell: "justify-center text-center" },
1322
+ right: { cell: "justify-end text-right", headCell: "justify-end text-right" }
1323
+ },
1324
+ sortable: {
1325
+ true: { headCell: "cursor-pointer hover:text-fg-default" },
1326
+ false: {}
1327
+ },
1328
+ ellipsis: {
1329
+ true: { cell: "overflow-hidden [&>*]:truncate" },
1330
+ false: {}
1331
+ },
1332
+ cellBorders: {
1333
+ true: {
1334
+ // `:has(+ [data-purpose='actions'])`: a cell ANTES da coluna actions
1335
+ // perde border-right — evita o divider visual encostado na actions.
1336
+ headCell: "border-r border-border-table last:border-r-0 has-[+_[data-purpose='actions']]:border-r-0",
1337
+ cell: "border-r border-border-table last:border-r-0 has-[+_[data-purpose='actions']]:border-r-0"
1338
+ },
1339
+ false: {}
1340
+ },
1341
+ /** Variant pra cells de coluna especial (selection / actions).
1342
+ *
1343
+ * - `selection`: remove padding pra checkbox 28px caber em 56px e centralizar.
1344
+ * - `actions`: header em branco (sem texto/menu), sem border-right, padding
1345
+ * horizontal mínimo. Usado quando `type: "actions"` no DataTableColumnDef.
1346
+ * Border-right removida via `!border-r-0` (override do cellBorders=true). */
1347
+ purpose: {
1348
+ default: {},
1349
+ selection: {
1350
+ // Sem padding + centralizado: checkbox 28px fica no meio dos 56px.
1351
+ // justify-center sobrescreve o align default (left) — coluna de seleção
1352
+ // sempre centraliza, sem o consumer precisar passar align="center".
1353
+ headCell: "px-0 py-0 justify-center",
1354
+ cell: "px-0 py-0 justify-center"
1355
+ },
1356
+ actions: {
1357
+ headCell: "!border-r-0 px-pad-md",
1358
+ cell: "!border-r-0 px-pad-md"
1359
+ }
1360
+ }
1361
+ },
1362
+ defaultVariants: {
1363
+ density: "standard",
1364
+ sticky: true,
1365
+ selected: false,
1366
+ clickable: false,
1367
+ align: "left",
1368
+ sortable: false,
1369
+ ellipsis: false,
1370
+ cellBorders: true,
1371
+ purpose: "default"
1372
+ }
1373
+ });
1374
+ const DEFAULT_MIN = 60;
1375
+ const DEFAULT_MAX = 800;
1376
+ function useColumnResize({
1377
+ currentWidth,
1378
+ minWidth = DEFAULT_MIN,
1379
+ maxWidth = DEFAULT_MAX,
1380
+ onResize,
1381
+ onResizeEnd,
1382
+ onResizeLiveDOM
1383
+ }) {
1384
+ const [isDragging2, setIsDragging] = useState(false);
1385
+ const onResizeRef = useRef(onResize);
1386
+ const onResizeEndRef = useRef(onResizeEnd);
1387
+ const onResizeLiveDOMRef = useRef(onResizeLiveDOM);
1388
+ const minRef = useRef(minWidth);
1389
+ const maxRef = useRef(maxWidth);
1390
+ onResizeRef.current = onResize;
1391
+ onResizeEndRef.current = onResizeEnd;
1392
+ onResizeLiveDOMRef.current = onResizeLiveDOM;
1393
+ minRef.current = minWidth;
1394
+ maxRef.current = maxWidth;
1395
+ const stateRef = useRef({ startX: 0, startWidth: 0, lastWidth: currentWidth, dragging: false });
1396
+ stateRef.current.lastWidth = currentWidth;
1397
+ const handlersRef = useRef(null);
1398
+ if (!handlersRef.current) {
1399
+ handlersRef.current = {
1400
+ move: (e) => {
1401
+ if (!stateRef.current.dragging) return;
1402
+ const delta = e.clientX - stateRef.current.startX;
1403
+ const next = Math.min(
1404
+ maxRef.current,
1405
+ Math.max(minRef.current, stateRef.current.startWidth + delta)
1406
+ );
1407
+ stateRef.current.lastWidth = next;
1408
+ onResizeLiveDOMRef.current?.(next);
1409
+ onResizeRef.current?.(next);
1410
+ },
1411
+ up: () => {
1412
+ if (!stateRef.current.dragging) return;
1413
+ stateRef.current.dragging = false;
1414
+ setIsDragging(false);
1415
+ document.removeEventListener("mousemove", handlersRef.current.move);
1416
+ document.removeEventListener("mouseup", handlersRef.current.up);
1417
+ document.body.style.cursor = "";
1418
+ document.body.style.userSelect = "";
1419
+ onResizeEndRef.current?.(stateRef.current.lastWidth);
1420
+ }
1421
+ };
448
1422
  }
1423
+ const onMouseDown = useCallback$1(
1424
+ (e) => {
1425
+ e.preventDefault();
1426
+ e.stopPropagation();
1427
+ stateRef.current = {
1428
+ startX: e.clientX,
1429
+ startWidth: currentWidth,
1430
+ lastWidth: currentWidth,
1431
+ dragging: true
1432
+ };
1433
+ setIsDragging(true);
1434
+ document.addEventListener("mousemove", handlersRef.current.move);
1435
+ document.addEventListener("mouseup", handlersRef.current.up);
1436
+ document.body.style.cursor = "col-resize";
1437
+ document.body.style.userSelect = "none";
1438
+ },
1439
+ [currentWidth]
1440
+ );
1441
+ useEffect(() => {
1442
+ return () => {
1443
+ if (stateRef.current.dragging && handlersRef.current) {
1444
+ document.removeEventListener("mousemove", handlersRef.current.move);
1445
+ document.removeEventListener("mouseup", handlersRef.current.up);
1446
+ document.body.style.cursor = "";
1447
+ document.body.style.userSelect = "";
1448
+ }
1449
+ };
1450
+ }, []);
1451
+ return {
1452
+ onMouseDown,
1453
+ isDragging: isDragging2
1454
+ };
1455
+ }
1456
+ const TableContext = createContext({
1457
+ density: "standard",
1458
+ cellBorders: true,
1459
+ resizingField: null,
1460
+ setResizingField: () => {
1461
+ },
1462
+ isScrolled: false
1463
+ });
1464
+ function useTableContext() {
1465
+ return useContext(TableContext);
1466
+ }
1467
+ const styles$4 = tableStyles();
1468
+ function Table({
1469
+ density = "standard",
1470
+ cardBreakpoint = 768,
1471
+ cellBorders = true,
1472
+ ariaLabel,
1473
+ className,
1474
+ scrollRef: externalScrollRef,
1475
+ children
1476
+ }) {
1477
+ const cardCss = cardBreakpoint === false ? void 0 : { "--table-card-bp": `${cardBreakpoint}px` };
1478
+ const [resizingField, setResizingField] = useState(null);
1479
+ const [isScrolled, setIsScrolled] = useState(false);
1480
+ const internalScrollRef = useRef(null);
1481
+ const scrollRef = externalScrollRef ?? internalScrollRef;
1482
+ useEffect(() => {
1483
+ const el = scrollRef.current;
1484
+ if (!el) return;
1485
+ const onScroll = () => setIsScrolled(el.scrollTop > 0);
1486
+ el.addEventListener("scroll", onScroll, { passive: true });
1487
+ onScroll();
1488
+ return () => el.removeEventListener("scroll", onScroll);
1489
+ }, [scrollRef]);
1490
+ return /* @__PURE__ */ jsx(
1491
+ TableContext.Provider,
1492
+ {
1493
+ value: { density, cellBorders, resizingField, setResizingField, isScrolled },
1494
+ children: /* @__PURE__ */ jsx(
1495
+ "div",
1496
+ {
1497
+ role: "grid",
1498
+ "aria-label": ariaLabel,
1499
+ "data-density": density,
1500
+ "data-resizing-col": resizingField ?? void 0,
1501
+ className: cn(styles$4.root(), className),
1502
+ style: cardCss,
1503
+ children: /* @__PURE__ */ jsx("div", { ref: scrollRef, className: styles$4.scroll(), children })
1504
+ }
1505
+ )
1506
+ }
1507
+ );
1508
+ }
1509
+ function TableHead({
1510
+ sticky = true,
1511
+ className,
1512
+ rootProps,
1513
+ children
1514
+ }) {
1515
+ const { isScrolled } = useTableContext();
1516
+ return /* @__PURE__ */ jsx(
1517
+ "div",
1518
+ {
1519
+ ...rootProps,
1520
+ role: "rowgroup",
1521
+ "data-scrolled": isScrolled ? "true" : void 0,
1522
+ className: cn(tableStyles({ sticky }).head(), className),
1523
+ children: /* @__PURE__ */ jsx("div", { role: "row", className: "flex w-full", children })
1524
+ }
1525
+ );
1526
+ }
1527
+ function TableBody({
1528
+ className,
1529
+ style: style2,
1530
+ rootProps,
1531
+ virtualized,
1532
+ children
1533
+ }) {
1534
+ const virtualStyle = virtualized ? {
1535
+ height: virtualized.totalHeight,
1536
+ position: "relative",
1537
+ minWidth: "100%",
1538
+ ...style2
1539
+ } : style2;
1540
+ return /* @__PURE__ */ jsx(
1541
+ "div",
1542
+ {
1543
+ ...rootProps,
1544
+ role: "rowgroup",
1545
+ className: cn(
1546
+ styles$4.body(),
1547
+ virtualized && "!block",
1548
+ className
1549
+ ),
1550
+ style: virtualStyle,
1551
+ children
1552
+ }
1553
+ );
1554
+ }
1555
+ const TableRow = forwardRef(function TableRow2({
1556
+ selected = false,
1557
+ open = false,
1558
+ focused = false,
1559
+ clickable,
1560
+ onClick,
1561
+ className,
1562
+ rootProps,
1563
+ children
1564
+ }, ref2) {
1565
+ const { density } = useTableContext();
1566
+ const isClickable = clickable ?? !!onClick;
1567
+ const highlighted = selected || open;
1568
+ const solidPinned = highlighted || focused;
1569
+ const dataState = selected && open ? "selected open" : selected ? "selected" : open ? "open" : void 0;
1570
+ return /* @__PURE__ */ jsx(
1571
+ "div",
1572
+ {
1573
+ ...rootProps,
1574
+ ref: ref2,
1575
+ role: "row",
1576
+ "aria-selected": selected || void 0,
1577
+ "data-state": dataState,
1578
+ "data-focused": focused || void 0,
1579
+ "data-highlighted": solidPinned || void 0,
1580
+ tabIndex: focused ? 0 : -1,
1581
+ className: cn(
1582
+ "group/row",
1583
+ tableStyles({ selected: highlighted, clickable: isClickable, density }).row(),
1584
+ // Focus visual — bg tinted (match checkbox selected) + borda brand interna.
1585
+ // A borda vem de um overlay ::after com z-[7] (ACIMA do pinned cell z-[5]):
1586
+ // `outline` no row era pintado SOB as sticky cells (bg opaco) e quebrava
1587
+ // no topo/embaixo na coluna fixa. O overlay desenha por cima, contínuo.
1588
+ focused && "bg-bg-table-row-selected hover:bg-bg-table-row-selected-hover z-[6] relative after:content-[''] after:absolute after:inset-0 after:z-[7] after:pointer-events-none after:border-2 after:border-bg-brand",
1589
+ className
1590
+ ),
1591
+ onClick,
1592
+ children
1593
+ }
1594
+ );
1595
+ });
1596
+ const TableCell = forwardRef(function TableCell2({
1597
+ field,
1598
+ tooltip,
1599
+ width,
1600
+ pinned,
1601
+ pinOffset,
1602
+ align = "left",
1603
+ ellipsis = false,
1604
+ label,
1605
+ className,
1606
+ rootProps,
1607
+ purpose = "default",
1608
+ children
1609
+ }, ref2) {
1610
+ const { density, cellBorders, resizingField } = useTableContext();
1611
+ const isResizingThisCol = field !== void 0 && resizingField === field;
1612
+ const style2 = {};
1613
+ if (width !== void 0) {
1614
+ style2.width = width;
1615
+ style2.minWidth = width;
1616
+ style2.maxWidth = width;
1617
+ }
1618
+ if (pinned === "left" && pinOffset !== void 0) style2.left = pinOffset;
1619
+ if (pinned === "right" && pinOffset !== void 0) style2.right = pinOffset;
1620
+ return /* @__PURE__ */ jsx(
1621
+ "div",
1622
+ {
1623
+ ...rootProps,
1624
+ ref: ref2,
1625
+ role: "gridcell",
1626
+ "data-pinned": pinned,
1627
+ "data-label": label,
1628
+ "data-field": field,
1629
+ "data-purpose": purpose,
1630
+ "data-resize-active": isResizingThisCol ? "true" : void 0,
1631
+ title: tooltip,
1632
+ className: cn(
1633
+ tableStyles({ pinned, align, ellipsis, density, cellBorders, purpose }).cell(),
1634
+ // Linha brand 2px alinhada com o centro do resize handle do header (~2px do edge)
1635
+ isResizingThisCol && "relative after:absolute after:right-[2px] after:top-0 after:bottom-0 after:w-[2px] after:bg-bg-brand after:pointer-events-none",
1636
+ className
1637
+ ),
1638
+ style: style2,
1639
+ children
1640
+ }
1641
+ );
1642
+ });
1643
+ const TableHeadCell = forwardRef(function TableHeadCell2({
1644
+ field,
1645
+ width,
1646
+ pinned,
1647
+ pinOffset,
1648
+ align = "left",
1649
+ sortable = false,
1650
+ sortDirection = null,
1651
+ sortIndex = 1,
1652
+ onSortClick,
1653
+ icon: Icon,
1654
+ headMenu,
1655
+ resizable,
1656
+ onResize,
1657
+ onResizeEnd,
1658
+ className,
1659
+ style: extraStyle,
1660
+ rootProps,
1661
+ purpose = "default",
1662
+ children
1663
+ }, forwardedRef) {
1664
+ const { density, cellBorders, setResizingField } = useTableContext();
1665
+ const headCellRef = useRef(null);
1666
+ const setRefs = useCallback$1((el) => {
1667
+ headCellRef.current = el;
1668
+ if (typeof forwardedRef === "function") forwardedRef(el);
1669
+ else if (forwardedRef) forwardedRef.current = el;
1670
+ }, [forwardedRef]);
1671
+ const resize = useColumnResize({
1672
+ currentWidth: width ?? 160,
1673
+ // Live DOM update — escreve `style.width` direto nas cells com `data-field`
1674
+ // correspondente, escopado ao `[role="grid"]` ancestral. Síncrono, sem React,
1675
+ // zero re-render durante o drag. Documented hook API via `onResizeLiveDOM`
1676
+ // (vs `onResize` que vai pro state externo, normalmente debounced ao mouseup).
1677
+ onResizeLiveDOM: field ? (w) => {
1678
+ const grid = headCellRef.current?.closest('[role="grid"]');
1679
+ grid?.querySelectorAll(`[data-field="${field}"]`).forEach((el) => {
1680
+ el.style.width = `${w}px`;
1681
+ el.style.minWidth = `${w}px`;
1682
+ el.style.maxWidth = `${w}px`;
1683
+ });
1684
+ } : void 0,
1685
+ onResize,
1686
+ onResizeEnd
1687
+ });
1688
+ useEffect(() => {
1689
+ if (resize.isDragging && field) {
1690
+ setResizingField(field);
1691
+ return () => setResizingField(null);
1692
+ }
1693
+ }, [resize.isDragging, field, setResizingField]);
1694
+ const style2 = {};
1695
+ if (width !== void 0) {
1696
+ style2.width = width;
1697
+ style2.minWidth = width;
1698
+ style2.maxWidth = width;
1699
+ }
1700
+ if (pinned === "left" && pinOffset !== void 0) style2.left = pinOffset;
1701
+ if (pinned === "right" && pinOffset !== void 0) style2.right = pinOffset;
1702
+ const ariaSort = sortable ? sortDirection === "asc" ? "ascending" : sortDirection === "desc" ? "descending" : "none" : void 0;
1703
+ const isSorted = sortDirection === "asc" || sortDirection === "desc";
1704
+ return /* @__PURE__ */ jsxs(
1705
+ "div",
1706
+ {
1707
+ ...rootProps,
1708
+ ref: setRefs,
1709
+ role: "columnheader",
1710
+ "aria-sort": ariaSort,
1711
+ "data-pinned": pinned,
1712
+ "data-sort": sortDirection ?? void 0,
1713
+ "data-field": field,
1714
+ "data-purpose": purpose,
1715
+ className: cn(
1716
+ "group/headcell",
1717
+ tableStyles({ pinned, align, sortable, density, cellBorders, purpose }).headCell(),
1718
+ className
1719
+ ),
1720
+ style: { ...style2, ...extraStyle },
1721
+ onClick: sortable ? onSortClick : void 0,
1722
+ children: [
1723
+ Icon && /* @__PURE__ */ jsx(Icon, { className: styles$4.typeIcon(), size: 13, strokeWidth: 1.7, "aria-hidden": true }),
1724
+ /* @__PURE__ */ jsx(
1725
+ "span",
1726
+ {
1727
+ className: cn(
1728
+ "flex-1 min-w-0",
1729
+ // Coluna de seleção (checkbox) centraliza por padrão — sem precisar
1730
+ // de align="center" no consumer (alinha com o purpose="selection").
1731
+ align === "center" || purpose === "selection" ? "flex items-center justify-center" : align === "right" ? cn(
1732
+ "truncate text-right",
1733
+ // Reserva espaço pro headRightStack APENAS quando sort está
1734
+ // ATIVO (sort badge + indicator visíveis permanentemente).
1735
+ // Para hover-only icons (sortable hint sem sort + headMenu),
1736
+ // NÃO reserva espaço — headRightStack tem `bg-bg-table-head`
1737
+ // que mascara o texto durante hover. Texto right-aligned
1738
+ // encosta corretamente na borda quando sem hover (antes
1739
+ // ficava com ~60px de "vazio" reservado pros ícones invisíveis).
1740
+ isSorted && "pr-[60px]"
1741
+ ) : "truncate text-left"
1742
+ ),
1743
+ children
1744
+ }
1745
+ ),
1746
+ (sortable || headMenu) && /* @__PURE__ */ jsxs("span", { className: styles$4.headRightStack(), children: [
1747
+ isSorted && /* @__PURE__ */ jsxs("span", { className: styles$4.headSortActive(), children: [
1748
+ sortIndex !== void 0 && /* @__PURE__ */ jsx("span", { className: styles$4.sortBadge(), children: sortIndex }),
1749
+ /* @__PURE__ */ jsx(SortIndicator, { direction: sortDirection })
1750
+ ] }),
1751
+ sortable && !isSorted && /* @__PURE__ */ jsx("span", { className: styles$4.headSortHint(), children: /* @__PURE__ */ jsx(SortIndicator, { direction: null }) }),
1752
+ headMenu && /* @__PURE__ */ jsx("span", { className: styles$4.headMenuItem(), children: headMenu })
1753
+ ] }),
1754
+ resizable && /* @__PURE__ */ jsx(
1755
+ "div",
1756
+ {
1757
+ className: styles$4.resizeHandle(),
1758
+ "data-dragging": resize.isDragging,
1759
+ onPointerDown: (e) => e.stopPropagation(),
1760
+ onMouseDown: resize.onMouseDown,
1761
+ onClick: (e) => e.stopPropagation(),
1762
+ onMouseEnter: () => field && setResizingField(field),
1763
+ onMouseLeave: () => {
1764
+ if (!resize.isDragging) setResizingField(null);
1765
+ },
1766
+ "aria-hidden": true
1767
+ }
1768
+ )
1769
+ ]
1770
+ }
1771
+ );
449
1772
  });
450
- const Combobox = forwardRef(
451
- function Combobox2({
452
- options,
453
- value,
454
- onValueChange,
455
- placeholder: placeholder2 = "Selecione…",
456
- searchPlaceholder = "Buscar…",
457
- emptyMessage = "Nenhum resultado.",
458
- open: openProp,
459
- defaultOpen,
460
- onOpenChange,
461
- align = "start",
462
- className,
463
- contentClassName,
464
- disabled,
465
- "aria-label": ariaLabel,
466
- ...rest
467
- }, ref2) {
468
- const [uncontrolledOpen, setUncontrolledOpen] = useState(
469
- defaultOpen ?? false
470
- );
471
- const isControlled = openProp !== void 0;
472
- const open = isControlled ? openProp : uncontrolledOpen;
473
- const setOpen = (next) => {
474
- if (!isControlled) setUncontrolledOpen(next);
475
- onOpenChange?.(next);
476
- };
477
- const styles2 = comboboxStyles();
478
- const selected = options.find((o) => o.value === value);
479
- return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
480
- /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
481
- "button",
482
- {
483
- ref: ref2,
484
- type: "button",
485
- role: "combobox",
486
- "aria-expanded": open,
487
- "aria-label": ariaLabel,
488
- disabled,
489
- "data-placeholder": selected ? void 0 : "",
490
- className: styles2.trigger({ className }),
491
- ...rest,
492
- children: [
493
- /* @__PURE__ */ jsx("span", { className: styles2.value(), children: selected ? selected.label : placeholder2 }),
494
- /* @__PURE__ */ jsx(ChevronDown, { className: styles2.icon(), "aria-hidden": "true" })
495
- ]
496
- }
497
- ) }),
498
- /* @__PURE__ */ jsx(
499
- PopoverContent,
500
- {
501
- align,
502
- className: styles2.content({ className: contentClassName }),
503
- children: /* @__PURE__ */ jsxs(Command, { children: [
504
- /* @__PURE__ */ jsx(CommandInput, { placeholder: searchPlaceholder }),
505
- /* @__PURE__ */ jsxs(CommandList, { children: [
506
- /* @__PURE__ */ jsx(CommandEmpty, { children: emptyMessage }),
507
- /* @__PURE__ */ jsx(CommandGroup, { children: options.map((option) => {
508
- const isSelected = option.value === value;
509
- return /* @__PURE__ */ jsxs(
510
- CommandItem,
511
- {
512
- value: option.label,
513
- keywords: [option.value, ...option.keywords ?? []],
514
- onSelect: () => {
515
- onValueChange?.(option.value);
516
- setOpen(false);
517
- },
518
- className: cn(
519
- isSelected && "text-fg-default font-medium [&_svg]:text-fg-brand"
520
- ),
521
- children: [
522
- /* @__PURE__ */ jsx("span", { className: styles2.itemLabel(), children: option.label }),
523
- isSelected && /* @__PURE__ */ jsx(Check, { "aria-hidden": "true" })
524
- ]
525
- },
526
- option.value
527
- );
528
- }) })
529
- ] })
530
- ] })
531
- }
532
- )
533
- ] });
534
- }
535
- );
536
- Combobox.displayName = "Combobox";
1773
+ function SortIndicator({ direction }) {
1774
+ if (direction === "asc") return /* @__PURE__ */ jsx(ArrowUp, { className: styles$4.sortIcon(), "aria-hidden": true });
1775
+ if (direction === "desc") return /* @__PURE__ */ jsx(ArrowDown, { className: styles$4.sortIcon(), "aria-hidden": true });
1776
+ return /* @__PURE__ */ jsx(ArrowUpDown, { className: styles$4.sortIcon(), "aria-hidden": true });
1777
+ }
1778
+ const styles$3 = tableStyles();
1779
+ function TableCardRow({
1780
+ header,
1781
+ headerActions,
1782
+ items,
1783
+ selected = false,
1784
+ open = false,
1785
+ clickable,
1786
+ onClick,
1787
+ className
1788
+ }) {
1789
+ const isClickable = clickable ?? !!onClick;
1790
+ const highlighted = selected || open;
1791
+ const handleClick = (e) => {
1792
+ if (!onClick) return;
1793
+ if (e.target.closest(
1794
+ 'button, a, input, label, [role="menu"], [role="menuitem"], [data-slot="card-actions"]'
1795
+ )) {
1796
+ return;
1797
+ }
1798
+ onClick(e);
1799
+ };
1800
+ const dataState = selected && open ? "selected open" : selected ? "selected" : open ? "open" : void 0;
1801
+ return /* @__PURE__ */ jsxs(
1802
+ "div",
1803
+ {
1804
+ role: "article",
1805
+ "aria-selected": selected || void 0,
1806
+ "data-state": dataState,
1807
+ className: cn(
1808
+ tableStyles({ selected: highlighted, clickable: isClickable }).cardWrap(),
1809
+ className
1810
+ ),
1811
+ onClick: handleClick,
1812
+ children: [
1813
+ /* @__PURE__ */ jsxs("div", { className: styles$3.cardHeader(), children: [
1814
+ /* @__PURE__ */ jsx("div", { className: "flex items-center gap-gp-md min-w-0", children: header }),
1815
+ headerActions && /* @__PURE__ */ jsx(
1816
+ "div",
1817
+ {
1818
+ className: "flex items-center gap-gp-xs shrink-0",
1819
+ "data-slot": "card-actions",
1820
+ children: headerActions
1821
+ }
1822
+ )
1823
+ ] }),
1824
+ items.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-gp-md", children: items.map((item, i) => /* @__PURE__ */ jsxs("div", { className: styles$3.cardItem(), children: [
1825
+ /* @__PURE__ */ jsx("span", { className: styles$3.cardLabel(), children: item.label }),
1826
+ /* @__PURE__ */ jsx("span", { className: styles$3.cardValue(), children: item.value })
1827
+ ] }, item.key ?? i)) })
1828
+ ]
1829
+ }
1830
+ );
1831
+ }
537
1832
  const DEFAULT_COLUMN_WIDTH$1 = 160;
538
1833
  function useColumnWidths(columns) {
539
1834
  return useMemo$1(() => {
@@ -1930,212 +3225,46 @@ function ViewsPopover({
1930
3225
  "hover:bg-bg-danger-muted hover:text-fg-danger",
1931
3226
  "focus-visible:opacity-100 focus-visible:bg-bg-muted",
1932
3227
  "[&_svg]:size-[14px]"
1933
- ),
1934
- children: /* @__PURE__ */ jsx(Trash2, { strokeWidth: 1.8 })
1935
- }
1936
- )
1937
- ]
1938
- },
1939
- view.id
1940
- );
1941
- })
1942
- }
1943
- ),
1944
- !hideCreate && onCreate && /* @__PURE__ */ jsx("div", { className: "flex-none p-pad-md border-t border-border-default", children: /* @__PURE__ */ jsxs(
1945
- "button",
1946
- {
1947
- type: "button",
1948
- onClick: onCreate,
1949
- className: cn(
1950
- "flex items-center justify-center gap-gp-sm w-full",
1951
- "h-form-md px-pad-xl rounded-radius-lg",
1952
- "bg-bg-surface dark:bg-bg-muted",
1953
- "border border-border-subtle dark:border-border-input",
1954
- "shadow-sh-sm dark:shadow-sh-none",
1955
- "text-body-sm font-semibold text-fg-default dark:text-fg-muted",
1956
- "outline-none cursor-pointer",
1957
- "transition-[background-color,color,box-shadow] duration-150",
1958
- "hover:bg-bg-muted-hover hover:text-fg-default",
1959
- "focus-visible:shadow-sh-ring",
1960
- "[&_svg]:size-[14px]"
1961
- ),
1962
- children: [
1963
- /* @__PURE__ */ jsx(Plus, { strokeWidth: 2.2 }),
1964
- createLabel
1965
- ]
1966
- }
1967
- ) })
1968
- ]
1969
- }
1970
- )
1971
- ] });
1972
- }
1973
- const Switch = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
1974
- SwitchPrimitives.Root,
1975
- {
1976
- className: cn(
1977
- "peer relative inline-flex h-[24px] w-[42px] shrink-0 cursor-pointer items-center",
1978
- "rounded-radius-full",
1979
- "transition-[background-color,box-shadow] duration-150 outline-none",
1980
- "data-[state=unchecked]:bg-bg-emphasis dark:data-[state=unchecked]:bg-bg-accent",
1981
- "data-[state=checked]:bg-bg-brand",
1982
- "focus-visible:shadow-sh-ring",
1983
- "disabled:cursor-not-allowed disabled:opacity-50",
1984
- className
1985
- ),
1986
- ...props,
1987
- ref: ref2,
1988
- children: /* @__PURE__ */ jsx(
1989
- SwitchPrimitives.Thumb,
1990
- {
1991
- className: cn(
1992
- "pointer-events-none block size-[20px] rounded-radius-full bg-white",
1993
- "shadow-[0_1px_2px_rgba(0,0,0,0.10)]",
1994
- "transition-transform duration-[180ms] ease-[cubic-bezier(0.4,0,0.2,1)]",
1995
- "data-[state=unchecked]:translate-x-[2px]",
1996
- "data-[state=checked]:translate-x-[20px]"
1997
- )
1998
- }
1999
- )
2000
- }
2001
- ));
2002
- Switch.displayName = SwitchPrimitives.Root.displayName;
2003
- const formFieldRoot = tv({
2004
- base: "flex flex-col gap-[7px] w-full"
2005
- });
2006
- const formFieldLabel = tv({
2007
- base: [
2008
- "text-body-sm font-semibold tracking-[0.01em] leading-none",
2009
- "text-fg-default dark:text-fg-muted",
2010
- "select-none"
2011
- ],
2012
- variants: {
2013
- disabled: {
2014
- true: "opacity-50 cursor-not-allowed"
2015
- }
2016
- }
2017
- });
2018
- const formFieldRequired = tv({
2019
- base: "ml-[2px] text-fg-danger"
2020
- });
2021
- const formFieldMessage = tv({
2022
- base: "text-caption-sm leading-snug",
2023
- variants: {
2024
- state: {
2025
- default: "text-fg-muted",
2026
- error: "text-fg-danger",
2027
- warning: "text-fg-warning",
2028
- success: "text-fg-success"
2029
- }
2030
- },
2031
- defaultVariants: { state: "default" }
2032
- });
2033
- function FormField({
2034
- label,
2035
- required: required2,
2036
- helperText,
2037
- state = "default",
2038
- errorMessage,
2039
- warningMessage,
2040
- successMessage,
2041
- className,
2042
- id: idProp,
2043
- children,
2044
- hideLabel,
2045
- disabled
2046
- }) {
2047
- const autoId = useId();
2048
- const id = idProp ?? autoId;
2049
- let message = helperText;
2050
- let messageState = "default";
2051
- if (state === "error" && errorMessage) {
2052
- message = errorMessage;
2053
- messageState = "error";
2054
- } else if (state === "warning" && warningMessage) {
2055
- message = warningMessage;
2056
- messageState = "warning";
2057
- } else if (state === "success" && successMessage) {
2058
- message = successMessage;
2059
- messageState = "success";
2060
- }
2061
- return /* @__PURE__ */ jsxs("div", { className: cn(formFieldRoot(), className), children: [
2062
- label && !hideLabel && /* @__PURE__ */ jsxs(
2063
- "label",
2064
- {
2065
- htmlFor: id,
2066
- className: formFieldLabel({ disabled }),
2067
- children: [
2068
- label,
2069
- required2 && /* @__PURE__ */ jsx("span", { className: formFieldRequired(), "aria-hidden": "true", children: "*" })
3228
+ ),
3229
+ children: /* @__PURE__ */ jsx(Trash2, { strokeWidth: 1.8 })
3230
+ }
3231
+ )
3232
+ ]
3233
+ },
3234
+ view.id
3235
+ );
3236
+ })
3237
+ }
3238
+ ),
3239
+ !hideCreate && onCreate && /* @__PURE__ */ jsx("div", { className: "flex-none p-pad-md border-t border-border-default", children: /* @__PURE__ */ jsxs(
3240
+ "button",
3241
+ {
3242
+ type: "button",
3243
+ onClick: onCreate,
3244
+ className: cn(
3245
+ "flex items-center justify-center gap-gp-sm w-full",
3246
+ "h-form-md px-pad-xl rounded-radius-lg",
3247
+ "bg-bg-surface dark:bg-bg-muted",
3248
+ "border border-border-subtle dark:border-border-input",
3249
+ "shadow-sh-sm dark:shadow-sh-none",
3250
+ "text-body-sm font-semibold text-fg-default dark:text-fg-muted",
3251
+ "outline-none cursor-pointer",
3252
+ "transition-[background-color,color,box-shadow] duration-150",
3253
+ "hover:bg-bg-muted-hover hover:text-fg-default",
3254
+ "focus-visible:shadow-sh-ring",
3255
+ "[&_svg]:size-[14px]"
3256
+ ),
3257
+ children: [
3258
+ /* @__PURE__ */ jsx(Plus, { strokeWidth: 2.2 }),
3259
+ createLabel
3260
+ ]
3261
+ }
3262
+ ) })
2070
3263
  ]
2071
3264
  }
2072
- ),
2073
- children({ id, state }),
2074
- message && /* @__PURE__ */ jsx(
2075
- "p",
2076
- {
2077
- className: formFieldMessage({ state: messageState }),
2078
- role: messageState === "error" ? "alert" : void 0,
2079
- children: message
2080
- }
2081
3265
  )
2082
3266
  ] });
2083
3267
  }
2084
- function renderAddon(content, key) {
2085
- if (typeof content === "string") {
2086
- return /* @__PURE__ */ jsx(InputGroupAddon, { align: key === "start" ? "inline-start" : "inline-end", children: /* @__PURE__ */ jsx(InputGroupText, { children: content }) }, key);
2087
- }
2088
- return /* @__PURE__ */ jsx(InputGroupAddon, { align: key === "start" ? "inline-start" : "inline-end", children: content }, key);
2089
- }
2090
- const FormFieldInput = forwardRef(
2091
- ({
2092
- label,
2093
- required: required2,
2094
- helperText,
2095
- state,
2096
- errorMessage,
2097
- warningMessage,
2098
- successMessage,
2099
- className,
2100
- id,
2101
- startAddon,
2102
- endAddon,
2103
- ...inputProps
2104
- }, ref2) => {
2105
- const hasAddon = startAddon !== void 0 || endAddon !== void 0;
2106
- const { size, ...inputHtmlProps } = inputProps;
2107
- return /* @__PURE__ */ jsx(
2108
- FormField,
2109
- {
2110
- label,
2111
- required: required2,
2112
- helperText,
2113
- state,
2114
- errorMessage,
2115
- warningMessage,
2116
- successMessage,
2117
- className,
2118
- id,
2119
- disabled: inputProps.disabled,
2120
- children: ({ id: fieldId, state: fieldState }) => hasAddon ? /* @__PURE__ */ jsxs(InputGroup, { state: fieldState, size: size ?? void 0, children: [
2121
- startAddon !== void 0 && renderAddon(startAddon, "start"),
2122
- /* @__PURE__ */ jsx(InputGroupInput, { ref: ref2, id: fieldId, ...inputHtmlProps }),
2123
- endAddon !== void 0 && renderAddon(endAddon, "end")
2124
- ] }) : /* @__PURE__ */ jsx(
2125
- Input,
2126
- {
2127
- ref: ref2,
2128
- id: fieldId,
2129
- state: fieldState,
2130
- size,
2131
- ...inputHtmlProps
2132
- }
2133
- )
2134
- }
2135
- );
2136
- }
2137
- );
2138
- FormFieldInput.displayName = "FormFieldInput";
2139
3268
  const dialog = tv({
2140
3269
  base: [
2141
3270
  // Override do DialogContent default (grid + p-pad-4xl + rounded-radius-base + shadow-sh-xl)
@@ -2338,11 +3467,14 @@ function TableToolbarViews({
2338
3467
  myOwnerKey = "me",
2339
3468
  divider,
2340
3469
  hideDivider,
2341
- soloLabel = "Default"
3470
+ soloLabel = "Default",
3471
+ allowCreate = true
2342
3472
  }) {
2343
3473
  const maxCustomTabs = Math.max(0, maxTabs - 1);
2344
3474
  const initialIds = useMemo$1(
2345
- () => views.slice(0, maxCustomTabs).map((v) => v.id),
3475
+ // auto-pina views do próprio usuário (owner === myOwnerKey). As de outros
3476
+ // (públicas) só viram tab quando explicitamente aplicadas (via activeViewId).
3477
+ () => views.filter((v) => v.owner === myOwnerKey).slice(0, maxCustomTabs).map((v) => v.id),
2346
3478
  // eslint-disable-next-line react-hooks/exhaustive-deps
2347
3479
  []
2348
3480
  );
@@ -2358,11 +3490,13 @@ function TableToolbarViews({
2358
3490
  let next = prev.filter((id) => !removedIds.includes(id));
2359
3491
  for (const id of addedIds) {
2360
3492
  if (next.length >= maxCustomTabs) break;
3493
+ const v = views.find((vv) => vv.id === id);
3494
+ if (v && v.owner !== myOwnerKey) continue;
2361
3495
  next = [...next, id];
2362
3496
  }
2363
3497
  return next;
2364
3498
  });
2365
- }, [views, maxCustomTabs]);
3499
+ }, [views, maxCustomTabs, myOwnerKey]);
2366
3500
  const [addModalOpen, setAddModalOpen] = useState(false);
2367
3501
  const [popoverOpen, setPopoverOpen] = useState(false);
2368
3502
  const [confirmDeleteView, setConfirmDeleteView] = useState(null);
@@ -2371,7 +3505,10 @@ function TableToolbarViews({
2371
3505
  const customTabs = renderIds.map((id) => views.find((v) => v.id === id)).filter((v) => !!v).map((v) => ({
2372
3506
  id: v.id,
2373
3507
  name: typeof v.name === "string" ? v.name : String(v.name),
2374
- custom: v.owner === myOwnerKey
3508
+ // Mostra o "X" (desfixar/fechar) nas views do usuário E na view ATIVA no
3509
+ // momento — assim dá pra fechar uma view pública de outro que foi aplicada
3510
+ // (o X só desfixa/deseleciona; não deleta a view de ninguém).
3511
+ custom: v.owner === myOwnerKey || v.id === activeViewId
2375
3512
  }));
2376
3513
  const defaultName = customTabs.length === 0 ? soloLabel : "Default";
2377
3514
  return [{ id: DEFAULT_VIEW_ID, name: defaultName, custom: false }, ...customTabs];
@@ -2424,7 +3561,7 @@ function TableToolbarViews({
2424
3561
  ariaLabel: "Visões salvas"
2425
3562
  }
2426
3563
  ),
2427
- /* @__PURE__ */ jsx(
3564
+ allowCreate && /* @__PURE__ */ jsx(
2428
3565
  ViewsPopover,
2429
3566
  {
2430
3567
  open: popoverOpen,
@@ -2438,7 +3575,7 @@ function TableToolbarViews({
2438
3575
  onCreate: handleCreateClick
2439
3576
  }
2440
3577
  ),
2441
- /* @__PURE__ */ jsx(
3578
+ allowCreate && /* @__PURE__ */ jsx(
2442
3579
  AddViewModal,
2443
3580
  {
2444
3581
  open: addModalOpen,
@@ -2588,161 +3725,29 @@ const PHRASE_OP = {
2588
3725
  startsWith: "starts with",
2589
3726
  endsWith: "ends with"
2590
3727
  };
2591
- function quoteIfNeeded(v) {
2592
- return /[\s",[\]]/.test(v) ? `"${v.replace(/"/g, '\\"')}"` : v;
2593
- }
2594
- function serializeList(value) {
2595
- const arr = Array.isArray(value) ? value : value === "" ? [] : [value];
2596
- return `[${arr.map((v) => quoteIfNeeded(String(v))).join(", ")}]`;
2597
- }
2598
- function entriesToSql(entries, logicOperator = "AND") {
2599
- return entries.map((e) => {
2600
- if (e.op === "isEmpty") return `${e.field} is empty`;
2601
- if (e.op === "isNotEmpty") return `${e.field} is not empty`;
2602
- if (e.op === "isAnyOf") return `${e.field} in ${serializeList(e.value)}`;
2603
- if (e.op === "isNoneOf")
2604
- return `${e.field} not in ${serializeList(e.value)}`;
2605
- if (e.op === "between")
2606
- return `${e.field} between ${serializeList(e.value)}`;
2607
- const v = quoteIfNeeded(String(Array.isArray(e.value) ? e.value.join(",") : e.value));
2608
- const sym = SYMBOL_OP[e.op];
2609
- if (sym) return `${e.field} ${sym} ${v}`;
2610
- const phrase = PHRASE_OP[e.op];
2611
- return `${e.field} ${phrase ?? "contains"} ${v}`;
2612
- }).join(` ${logicOperator} `);
2613
- }
2614
- const Select = SelectPrimitive.Root;
2615
- const SelectValue = SelectPrimitive.Value;
2616
- const SelectTrigger = React.forwardRef(({ className, children, state = "default", ...props }, ref2) => /* @__PURE__ */ jsxs(
2617
- SelectPrimitive.Trigger,
2618
- {
2619
- ref: ref2,
2620
- className: cn(
2621
- "flex min-h-form-lg w-full items-center justify-between gap-gp-md",
2622
- "rounded-radius-lg px-pad-xl",
2623
- "bg-bg-input dark:bg-bg-muted",
2624
- "hover:bg-bg-input-hover dark:hover:bg-bg-muted-hover",
2625
- "border border-border-input",
2626
- "text-body-sm font-normal text-fg-default",
2627
- "transition-[color,box-shadow,background-color,border-color] outline-none",
2628
- "data-[placeholder]:text-fg-muted data-[placeholder]:opacity-70",
2629
- state === "default" && "focus-visible:border-border-brand data-[state=open]:border-border-brand focus-visible:shadow-sh-ring data-[state=open]:shadow-sh-ring",
2630
- state === "error" && "border-border-danger-muted focus-visible:border-border-danger-muted data-[state=open]:border-border-danger-muted focus-visible:shadow-sh-ring-danger data-[state=open]:shadow-sh-ring-danger",
2631
- state === "warning" && "border-border-warning-muted focus-visible:border-border-warning-muted data-[state=open]:border-border-warning-muted focus-visible:shadow-sh-ring-warning data-[state=open]:shadow-sh-ring-warning",
2632
- state === "success" && "border-border-success-muted focus-visible:border-border-success-muted data-[state=open]:border-border-success-muted focus-visible:shadow-sh-ring-success data-[state=open]:shadow-sh-ring-success",
2633
- "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-bg-input dark:disabled:hover:bg-bg-muted",
2634
- "[&>span]:line-clamp-1",
2635
- className
2636
- ),
2637
- ...props,
2638
- children: [
2639
- children,
2640
- /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4 text-fg-muted shrink-0" }) })
2641
- ]
2642
- }
2643
- ));
2644
- SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
2645
- const SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
2646
- SelectPrimitive.ScrollUpButton,
2647
- {
2648
- ref: ref2,
2649
- className: cn(
2650
- "flex cursor-default items-center justify-center py-pad-xs",
2651
- className
2652
- ),
2653
- ...props,
2654
- children: /* @__PURE__ */ jsx(ChevronUp, { className: "h-4 w-4" })
2655
- }
2656
- ));
2657
- SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
2658
- const SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
2659
- SelectPrimitive.ScrollDownButton,
2660
- {
2661
- ref: ref2,
2662
- className: cn(
2663
- "flex cursor-default items-center justify-center py-pad-xs",
2664
- className
2665
- ),
2666
- ...props,
2667
- children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" })
2668
- }
2669
- ));
2670
- SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
2671
- const SelectContent = React.forwardRef(({ className, children, position: position2 = "popper", ...props }, ref2) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
2672
- SelectPrimitive.Content,
2673
- {
2674
- ref: ref2,
2675
- className: cn(
2676
- "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden",
2677
- "rounded-[12px] bg-bg-dropdown border border-border-default shadow-sh-lg outline-float",
2678
- "before:pointer-events-none before:absolute before:inset-0 before:-z-10 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150",
2679
- "text-fg-default",
2680
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
2681
- "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
2682
- "origin-[--radix-select-content-transform-origin]",
2683
- position2 === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
2684
- className
2685
- ),
2686
- position: position2,
2687
- ...props,
2688
- children: [
2689
- /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
2690
- /* @__PURE__ */ jsx(
2691
- SelectPrimitive.Viewport,
2692
- {
2693
- className: cn(
2694
- "p-pad-sm",
2695
- position2 === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
2696
- ),
2697
- children
2698
- }
2699
- ),
2700
- /* @__PURE__ */ jsx(SelectScrollDownButton, {})
2701
- ]
2702
- }
2703
- ) }));
2704
- SelectContent.displayName = SelectPrimitive.Content.displayName;
2705
- const SelectLabel = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
2706
- SelectPrimitive.Label,
2707
- {
2708
- ref: ref2,
2709
- className: cn("py-pad-sm pl-8 pr-2 text-body-md font-medium text-fg-muted", className),
2710
- ...props
2711
- }
2712
- ));
2713
- SelectLabel.displayName = SelectPrimitive.Label.displayName;
2714
- const SelectItem = React.forwardRef(({ className, children, ...props }, ref2) => /* @__PURE__ */ jsxs(
2715
- SelectPrimitive.Item,
2716
- {
2717
- ref: ref2,
2718
- className: cn(
2719
- "relative flex w-full cursor-default select-none items-center gap-pad-md",
2720
- "rounded-radius-sm py-pad-md pl-8 pr-pad-lg",
2721
- "text-body-sm font-medium text-fg-muted",
2722
- "outline-none transition-colors",
2723
- "focus:bg-bg-muted focus:text-fg-default",
2724
- "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
2725
- "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-fg-muted",
2726
- "focus:[&_svg]:text-fg-default",
2727
- className
2728
- ),
2729
- ...props,
2730
- children: [
2731
- /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
2732
- /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
2733
- ]
2734
- }
2735
- ));
2736
- SelectItem.displayName = SelectPrimitive.Item.displayName;
2737
- const SelectSeparator = React.forwardRef(({ className, ...props }, ref2) => /* @__PURE__ */ jsx(
2738
- SelectPrimitive.Separator,
2739
- {
2740
- ref: ref2,
2741
- className: cn("-mx-1 my-1 h-px bg-border", className),
2742
- ...props
2743
- }
2744
- ));
2745
- SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
3728
+ function quoteIfNeeded(v) {
3729
+ return /[\s",[\]]/.test(v) ? `"${v.replace(/"/g, '\\"')}"` : v;
3730
+ }
3731
+ function serializeList(value) {
3732
+ const arr = Array.isArray(value) ? value : value === "" ? [] : [value];
3733
+ return `[${arr.map((v) => quoteIfNeeded(String(v))).join(", ")}]`;
3734
+ }
3735
+ function entriesToSql(entries, logicOperator = "AND") {
3736
+ return entries.map((e) => {
3737
+ if (e.op === "isEmpty") return `${e.field} is empty`;
3738
+ if (e.op === "isNotEmpty") return `${e.field} is not empty`;
3739
+ if (e.op === "isAnyOf") return `${e.field} in ${serializeList(e.value)}`;
3740
+ if (e.op === "isNoneOf")
3741
+ return `${e.field} not in ${serializeList(e.value)}`;
3742
+ if (e.op === "between")
3743
+ return `${e.field} between ${serializeList(e.value)}`;
3744
+ const v = quoteIfNeeded(String(Array.isArray(e.value) ? e.value.join(",") : e.value));
3745
+ const sym = SYMBOL_OP[e.op];
3746
+ if (sym) return `${e.field} ${sym} ${v}`;
3747
+ const phrase = PHRASE_OP[e.op];
3748
+ return `${e.field} ${phrase ?? "contains"} ${v}`;
3749
+ }).join(` ${logicOperator} `);
3750
+ }
2746
3751
  const DEFAULT_FILTER_OPERATORS = [
2747
3752
  { id: "equals", label: "é" },
2748
3753
  { id: "neq", label: "não é" },
@@ -3631,380 +4636,115 @@ function FloatingPanel({
3631
4636
  "aria-label": "Redimensionar panel",
3632
4637
  "data-dragging": dragging || void 0,
3633
4638
  onMouseDown: (e) => {
3634
- setDragging(true);
3635
- resize.onResizeStart(e);
3636
- },
3637
- className: s.handle()
3638
- }
3639
- ),
3640
- (title2 || description || titleSlot || headerActions || !hideClose || maximizable) && /* @__PURE__ */ jsxs("header", { className: s.header(), children: [
3641
- titleSlot ? /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0", children: titleSlot }) : /* @__PURE__ */ jsxs("div", { className: s.headerText(), children: [
3642
- title2 && /* @__PURE__ */ jsxs("h2", { id: titleId, className: s.headerTitle(), children: [
3643
- TitleIcon && /* @__PURE__ */ jsx(TitleIcon, { className: s.headerTitleIcon(), strokeWidth: 1.8 }),
3644
- /* @__PURE__ */ jsx("span", { className: "truncate", children: title2 })
3645
- ] }),
3646
- description && /* @__PURE__ */ jsx("p", { id: descId, className: s.headerDescription(), children: description })
3647
- ] }),
3648
- /* @__PURE__ */ jsxs("div", { className: s.headerActions(), children: [
3649
- headerActions,
3650
- maximizable && /* @__PURE__ */ jsx(
3651
- Button,
3652
- {
3653
- type: "button",
3654
- variant: "soft",
3655
- color: "secondary",
3656
- size: "icon-sm",
3657
- "aria-label": maximized ? "Restaurar tamanho" : "Maximizar",
3658
- onClick: () => setMaximized((m) => !m),
3659
- className: "max-md:hidden",
3660
- children: maximized ? /* @__PURE__ */ jsx(Minimize2, {}) : /* @__PURE__ */ jsx(Maximize2, {})
3661
- }
3662
- ),
3663
- !hideClose && /* @__PURE__ */ jsx(
3664
- Button,
3665
- {
3666
- type: "button",
3667
- variant: "soft",
3668
- color: "secondary",
3669
- size: "icon-sm",
3670
- "aria-label": "Fechar",
3671
- onClick: () => onOpenChange(false),
3672
- children: /* @__PURE__ */ jsx(X, {})
3673
- }
3674
- )
3675
- ] })
3676
- ] }),
3677
- /* @__PURE__ */ jsx("div", { className: s.body(), children }),
3678
- footer && /* @__PURE__ */ jsx("footer", { className: s.footer(), children: footer })
3679
- ]
3680
- }
3681
- )
3682
- ] }),
3683
- document.body
3684
- );
3685
- }
3686
- const partStyles = tv({
3687
- slots: {
3688
- section: "border-b border-border-default last:border-b-0",
3689
- head: [
3690
- "flex items-center justify-between w-full",
3691
- "px-[18px] py-[14px]",
3692
- "bg-transparent border-0 cursor-pointer text-left",
3693
- "text-body-sm font-semibold text-fg-default",
3694
- "transition-colors duration-150",
3695
- "hover:bg-bg-muted focus-visible:outline-none focus-visible:bg-bg-muted"
3696
- ],
3697
- headStatic: "px-[18px] pt-pad-xl pb-pad-md text-body-sm font-semibold text-fg-default",
3698
- chev: "size-[14px] text-fg-muted transition-transform duration-200 shrink-0",
3699
- body: "flex flex-col gap-gp-md px-[18px] pb-pad-2xl",
3700
- field: "flex items-baseline justify-between gap-gp-md text-body-sm",
3701
- fieldLabel: "text-body-xs font-normal text-fg-muted shrink-0",
3702
- fieldValue: "text-fg-default font-medium text-right break-words min-w-0"
3703
- }
3704
- });
3705
- function FloatingPanelSection({
3706
- title: title2,
3707
- children,
3708
- collapsible = true,
3709
- defaultOpen = true
3710
- }) {
3711
- const s = partStyles();
3712
- const [open, setOpen] = useState(defaultOpen);
3713
- if (!collapsible) {
3714
- return /* @__PURE__ */ jsxs("section", { className: s.section(), children: [
3715
- /* @__PURE__ */ jsx("div", { className: s.headStatic(), children: title2 }),
3716
- /* @__PURE__ */ jsx("div", { className: s.body(), children })
3717
- ] });
3718
- }
3719
- return /* @__PURE__ */ jsxs("section", { className: s.section(), children: [
3720
- /* @__PURE__ */ jsxs(
3721
- "button",
3722
- {
3723
- type: "button",
3724
- className: s.head(),
3725
- onClick: () => setOpen((o) => !o),
3726
- "aria-expanded": open,
3727
- children: [
3728
- /* @__PURE__ */ jsx("span", { children: title2 }),
3729
- /* @__PURE__ */ jsx(ChevronDown, { className: cn(s.chev(), open && "rotate-180") })
3730
- ]
3731
- }
3732
- ),
3733
- open && /* @__PURE__ */ jsx("div", { className: s.body(), children })
3734
- ] });
3735
- }
3736
- function FloatingPanelField({ label, value }) {
3737
- const s = partStyles();
3738
- return /* @__PURE__ */ jsxs("div", { className: s.field(), children: [
3739
- /* @__PURE__ */ jsx("span", { className: s.fieldLabel(), children: label }),
3740
- /* @__PURE__ */ jsx("span", { className: s.fieldValue(), children: value || "—" })
3741
- ] });
3742
- }
3743
- const textareaVariants = cva(
3744
- [
3745
- "flex min-h-[100px] w-full resize-y",
3746
- "bg-bg-input dark:bg-bg-muted",
3747
- "hover:bg-bg-input-hover dark:hover:bg-bg-muted-hover",
3748
- "border border-border-input rounded-radius-lg",
3749
- "px-pad-xl py-pad-lg",
3750
- "text-body-sm font-normal leading-[1.5] text-fg-default",
3751
- "placeholder:text-fg-muted placeholder:opacity-70",
3752
- "transition-[color,box-shadow,background-color,border-color] outline-none",
3753
- "disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-bg-input dark:disabled:hover:bg-bg-muted"
3754
- ],
3755
- {
3756
- variants: {
3757
- state: {
3758
- default: "focus-visible:border-border-brand focus-visible:shadow-sh-ring",
3759
- error: "border-border-danger-muted focus-visible:border-border-danger-muted focus-visible:shadow-sh-ring-danger",
3760
- warning: "border-border-warning-muted focus-visible:border-border-warning-muted focus-visible:shadow-sh-ring-warning",
3761
- success: "border-border-success-muted focus-visible:border-border-success-muted focus-visible:shadow-sh-ring-success"
3762
- }
3763
- },
3764
- defaultVariants: {
3765
- state: "default"
3766
- }
3767
- }
3768
- );
3769
- const Textarea = React.forwardRef(
3770
- ({ className, state, ...props }, ref2) => {
3771
- return /* @__PURE__ */ jsx(
3772
- "textarea",
3773
- {
3774
- className: cn(textareaVariants({ state }), className),
3775
- ref: ref2,
3776
- ...props
3777
- }
3778
- );
3779
- }
3780
- );
3781
- Textarea.displayName = "Textarea";
3782
- const FormFieldTextarea = forwardRef(
3783
- ({
3784
- label,
3785
- required: required2,
3786
- helperText,
3787
- state,
3788
- errorMessage,
3789
- warningMessage,
3790
- successMessage,
3791
- className,
3792
- id,
3793
- ...textareaProps
3794
- }, ref2) => /* @__PURE__ */ jsx(
3795
- FormField,
3796
- {
3797
- label,
3798
- required: required2,
3799
- helperText,
3800
- state,
3801
- errorMessage,
3802
- warningMessage,
3803
- successMessage,
3804
- className,
3805
- id,
3806
- disabled: textareaProps.disabled,
3807
- children: ({ id: fieldId, state: fieldState }) => /* @__PURE__ */ jsx(
3808
- Textarea,
3809
- {
3810
- ref: ref2,
3811
- id: fieldId,
3812
- state: fieldState,
3813
- ...textareaProps
3814
- }
3815
- )
3816
- }
3817
- )
3818
- );
3819
- FormFieldTextarea.displayName = "FormFieldTextarea";
3820
- function FormFieldSelect({
3821
- label,
3822
- required: required2,
3823
- helperText,
3824
- state,
3825
- errorMessage,
3826
- warningMessage,
3827
- successMessage,
3828
- className,
3829
- id,
3830
- options,
3831
- placeholder: placeholder2,
3832
- value,
3833
- defaultValue,
3834
- onValueChange,
3835
- disabled,
3836
- triggerClassName,
3837
- contentClassName
3838
- }) {
3839
- return /* @__PURE__ */ jsx(
3840
- FormField,
3841
- {
3842
- label,
3843
- required: required2,
3844
- helperText,
3845
- state,
3846
- errorMessage,
3847
- warningMessage,
3848
- successMessage,
3849
- className,
3850
- id,
3851
- disabled,
3852
- children: ({ id: fieldId, state: fieldState }) => /* @__PURE__ */ jsxs(
3853
- Select,
3854
- {
3855
- value,
3856
- defaultValue,
3857
- onValueChange,
3858
- disabled,
3859
- children: [
3860
- /* @__PURE__ */ jsx(
3861
- SelectTrigger,
3862
- {
3863
- id: fieldId,
3864
- state: fieldState,
3865
- className: triggerClassName,
3866
- children: /* @__PURE__ */ jsx(SelectValue, { placeholder: placeholder2 })
4639
+ setDragging(true);
4640
+ resize.onResizeStart(e);
4641
+ },
4642
+ className: s.handle()
3867
4643
  }
3868
4644
  ),
3869
- /* @__PURE__ */ jsx(SelectContent, { className: contentClassName, children: options.map((opt) => /* @__PURE__ */ jsx(
3870
- SelectItem,
3871
- {
3872
- value: opt.value,
3873
- disabled: opt.disabled,
3874
- children: opt.label
3875
- },
3876
- opt.value
3877
- )) })
4645
+ (title2 || description || titleSlot || headerActions || !hideClose || maximizable) && /* @__PURE__ */ jsxs("header", { className: s.header(), children: [
4646
+ titleSlot ? /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0", children: titleSlot }) : /* @__PURE__ */ jsxs("div", { className: s.headerText(), children: [
4647
+ title2 && /* @__PURE__ */ jsxs("h2", { id: titleId, className: s.headerTitle(), children: [
4648
+ TitleIcon && /* @__PURE__ */ jsx(TitleIcon, { className: s.headerTitleIcon(), strokeWidth: 1.8 }),
4649
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: title2 })
4650
+ ] }),
4651
+ description && /* @__PURE__ */ jsx("p", { id: descId, className: s.headerDescription(), children: description })
4652
+ ] }),
4653
+ /* @__PURE__ */ jsxs("div", { className: s.headerActions(), children: [
4654
+ headerActions,
4655
+ maximizable && /* @__PURE__ */ jsx(
4656
+ Button,
4657
+ {
4658
+ type: "button",
4659
+ variant: "soft",
4660
+ color: "secondary",
4661
+ size: "icon-sm",
4662
+ "aria-label": maximized ? "Restaurar tamanho" : "Maximizar",
4663
+ onClick: () => setMaximized((m) => !m),
4664
+ className: "max-md:hidden",
4665
+ children: maximized ? /* @__PURE__ */ jsx(Minimize2, {}) : /* @__PURE__ */ jsx(Maximize2, {})
4666
+ }
4667
+ ),
4668
+ !hideClose && /* @__PURE__ */ jsx(
4669
+ Button,
4670
+ {
4671
+ type: "button",
4672
+ variant: "soft",
4673
+ color: "secondary",
4674
+ size: "icon-sm",
4675
+ "aria-label": "Fechar",
4676
+ onClick: () => onOpenChange(false),
4677
+ children: /* @__PURE__ */ jsx(X, {})
4678
+ }
4679
+ )
4680
+ ] })
4681
+ ] }),
4682
+ /* @__PURE__ */ jsx("div", { className: s.body(), children }),
4683
+ footer && /* @__PURE__ */ jsx("footer", { className: s.footer(), children: footer })
3878
4684
  ]
3879
4685
  }
3880
4686
  )
3881
- }
4687
+ ] }),
4688
+ document.body
3882
4689
  );
3883
4690
  }
3884
- const FormFieldCheckbox = forwardRef(
3885
- ({
3886
- label,
3887
- required: required2,
3888
- helperText,
3889
- state = "default",
3890
- errorMessage,
3891
- warningMessage,
3892
- successMessage,
3893
- className,
3894
- id: idProp,
3895
- disabled,
3896
- ...checkboxProps
3897
- }, ref2) => {
3898
- const autoId = useId();
3899
- const id = idProp ?? autoId;
3900
- let message = helperText;
3901
- let messageState = "default";
3902
- if (state === "error" && errorMessage) {
3903
- message = errorMessage;
3904
- messageState = "error";
3905
- } else if (state === "warning" && warningMessage) {
3906
- message = warningMessage;
3907
- messageState = "warning";
3908
- } else if (state === "success" && successMessage) {
3909
- message = successMessage;
3910
- messageState = "success";
3911
- }
3912
- return /* @__PURE__ */ jsxs("div", { className: cn(formFieldRoot(), "gap-[5px]", className), children: [
3913
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-md", children: [
3914
- /* @__PURE__ */ jsx(
3915
- Checkbox,
3916
- {
3917
- ref: ref2,
3918
- id,
3919
- disabled,
3920
- ...checkboxProps
3921
- }
3922
- ),
3923
- label && /* @__PURE__ */ jsxs(
3924
- "label",
3925
- {
3926
- htmlFor: id,
3927
- className: cn(formFieldLabel({ disabled }), "cursor-pointer"),
3928
- children: [
3929
- label,
3930
- required2 && /* @__PURE__ */ jsx("span", { className: formFieldRequired(), "aria-hidden": "true", children: "*" })
3931
- ]
3932
- }
3933
- )
3934
- ] }),
3935
- message && /* @__PURE__ */ jsx(
3936
- "p",
3937
- {
3938
- className: cn(formFieldMessage({ state: messageState }), "pl-[26px]"),
3939
- role: messageState === "error" ? "alert" : void 0,
3940
- children: message
3941
- }
3942
- )
4691
+ const partStyles = tv({
4692
+ slots: {
4693
+ section: "border-b border-border-default last:border-b-0",
4694
+ head: [
4695
+ "flex items-center justify-between w-full",
4696
+ "px-[18px] py-[14px]",
4697
+ "bg-transparent border-0 cursor-pointer text-left",
4698
+ "text-body-sm font-semibold text-fg-default",
4699
+ "transition-colors duration-150",
4700
+ "hover:bg-bg-muted focus-visible:outline-none focus-visible:bg-bg-muted"
4701
+ ],
4702
+ headStatic: "px-[18px] pt-pad-xl pb-pad-md text-body-sm font-semibold text-fg-default",
4703
+ chev: "size-[14px] text-fg-muted transition-transform duration-200 shrink-0",
4704
+ body: "flex flex-col gap-gp-md px-[18px] pb-pad-2xl",
4705
+ field: "flex items-baseline justify-between gap-gp-md text-body-sm",
4706
+ fieldLabel: "text-body-xs font-normal text-fg-muted shrink-0",
4707
+ fieldValue: "text-fg-default font-medium text-right break-words min-w-0"
4708
+ }
4709
+ });
4710
+ function FloatingPanelSection({
4711
+ title: title2,
4712
+ children,
4713
+ collapsible = true,
4714
+ defaultOpen = true
4715
+ }) {
4716
+ const s = partStyles();
4717
+ const [open, setOpen] = useState(defaultOpen);
4718
+ if (!collapsible) {
4719
+ return /* @__PURE__ */ jsxs("section", { className: s.section(), children: [
4720
+ /* @__PURE__ */ jsx("div", { className: s.headStatic(), children: title2 }),
4721
+ /* @__PURE__ */ jsx("div", { className: s.body(), children })
3943
4722
  ] });
3944
4723
  }
3945
- );
3946
- FormFieldCheckbox.displayName = "FormFieldCheckbox";
3947
- const FormFieldSwitch = forwardRef(
3948
- ({
3949
- label,
3950
- required: required2,
3951
- helperText,
3952
- state = "default",
3953
- errorMessage,
3954
- warningMessage,
3955
- successMessage,
3956
- className,
3957
- id: idProp,
3958
- disabled,
3959
- switchPosition = "end",
3960
- ...switchProps
3961
- }, ref2) => {
3962
- const autoId = useId();
3963
- const id = idProp ?? autoId;
3964
- let message = helperText;
3965
- let messageState = "default";
3966
- if (state === "error" && errorMessage) {
3967
- message = errorMessage;
3968
- messageState = "error";
3969
- } else if (state === "warning" && warningMessage) {
3970
- message = warningMessage;
3971
- messageState = "warning";
3972
- } else if (state === "success" && successMessage) {
3973
- message = successMessage;
3974
- messageState = "success";
3975
- }
3976
- const switchEl = /* @__PURE__ */ jsx(Switch, { ref: ref2, id, disabled, ...switchProps });
3977
- const labelEl = label && /* @__PURE__ */ jsxs(
3978
- "label",
4724
+ return /* @__PURE__ */ jsxs("section", { className: s.section(), children: [
4725
+ /* @__PURE__ */ jsxs(
4726
+ "button",
3979
4727
  {
3980
- htmlFor: id,
3981
- className: cn(formFieldLabel({ disabled }), "cursor-pointer flex-1"),
4728
+ type: "button",
4729
+ className: s.head(),
4730
+ onClick: () => setOpen((o) => !o),
4731
+ "aria-expanded": open,
3982
4732
  children: [
3983
- label,
3984
- required2 && /* @__PURE__ */ jsx("span", { className: formFieldRequired(), "aria-hidden": "true", children: "*" })
4733
+ /* @__PURE__ */ jsx("span", { children: title2 }),
4734
+ /* @__PURE__ */ jsx(ChevronDown, { className: cn(s.chev(), open && "rotate-180") })
3985
4735
  ]
3986
4736
  }
3987
- );
3988
- return /* @__PURE__ */ jsxs("div", { className: cn(formFieldRoot(), "gap-[5px]", className), children: [
3989
- /* @__PURE__ */ jsx("div", { className: "flex items-center gap-gp-md", children: switchPosition === "start" ? /* @__PURE__ */ jsxs(Fragment, { children: [
3990
- switchEl,
3991
- labelEl
3992
- ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
3993
- labelEl,
3994
- switchEl
3995
- ] }) }),
3996
- message && /* @__PURE__ */ jsx(
3997
- "p",
3998
- {
3999
- className: formFieldMessage({ state: messageState }),
4000
- role: messageState === "error" ? "alert" : void 0,
4001
- children: message
4002
- }
4003
- )
4004
- ] });
4005
- }
4006
- );
4007
- FormFieldSwitch.displayName = "FormFieldSwitch";
4737
+ ),
4738
+ open && /* @__PURE__ */ jsx("div", { className: s.body(), children })
4739
+ ] });
4740
+ }
4741
+ function FloatingPanelField({ label, value }) {
4742
+ const s = partStyles();
4743
+ return /* @__PURE__ */ jsxs("div", { className: s.field(), children: [
4744
+ /* @__PURE__ */ jsx("span", { className: s.fieldLabel(), children: label }),
4745
+ /* @__PURE__ */ jsx("span", { className: s.fieldValue(), children: value || "—" })
4746
+ ] });
4747
+ }
4008
4748
  class ColumnTypeRegistry {
4009
4749
  constructor() {
4010
4750
  __publicField(this, "types", /* @__PURE__ */ new Map());
@@ -16610,6 +17350,10 @@ function useDataTableColumns({
16610
17350
  return {
16611
17351
  effectiveColumns,
16612
17352
  columnWidths: widths,
17353
+ /** Larguras de resize MANUAL do usuário (sem autoFit). Persistir SÓ isto —
17354
+ * persistir `columnWidths` (efetivas, c/ autoFit) congela o layout e mata o
17355
+ * autoFit no reload (vira widthOverrides de precedência máxima). */
17356
+ widthOverrides,
16613
17357
  stickyOffsets: offsets,
16614
17358
  hiddenColumns,
16615
17359
  pinnedColumns,
@@ -16661,6 +17405,16 @@ function applyFormatter(row, column2) {
16661
17405
  const DEFAULT_COLUMN_WIDTH = 160;
16662
17406
  const CELL_PADDING_PX = 32;
16663
17407
  const DEFAULT_SAMPLE_SIZE = 20;
17408
+ const HEADER_ICON_PX = 13 + 8;
17409
+ const HEADER_SORT_AFFORDANCE_PX = 24;
17410
+ function measureHeaderMinWidth(col, typeDef) {
17411
+ const headerText = String(col.headerName ?? String(col.field));
17412
+ const hasHeaderIcon = col.icon !== void 0 || typeDef?.defaultIcon !== void 0;
17413
+ const isSortable = col.sortable ?? typeDef?.defaultSortable ?? false;
17414
+ const hasHeadMenu = col.enableColumnFilter === true;
17415
+ const overhead = CELL_PADDING_PX + (hasHeaderIcon ? HEADER_ICON_PX : 0) + (isSortable || hasHeadMenu ? HEADER_SORT_AFFORDANCE_PX : 0);
17416
+ return measureTextWidth(headerText) + overhead;
17417
+ }
16664
17418
  function calculateColumnWidths(columns, rows, options) {
16665
17419
  const { containerWidth, autoFit, sampleSize = DEFAULT_SAMPLE_SIZE } = options;
16666
17420
  if (containerWidth <= 0) return {};
@@ -16668,10 +17422,6 @@ function calculateColumnWidths(columns, rows, options) {
16668
17422
  let totalContentWidth = 0;
16669
17423
  for (const col of columns) {
16670
17424
  const field = String(col.field);
16671
- if (col.width !== void 0) {
16672
- totalContentWidth += col.width;
16673
- continue;
16674
- }
16675
17425
  if (col.type === "actions") {
16676
17426
  const w = col.minWidth ?? ACTIONS_COLUMN_WIDTH;
16677
17427
  widths[field] = w;
@@ -16679,10 +17429,16 @@ function calculateColumnWidths(columns, rows, options) {
16679
17429
  continue;
16680
17430
  }
16681
17431
  const typeDef = col.type ? columnTypeRegistry.get(col.type) : void 0;
17432
+ if (col.width !== void 0) {
17433
+ let w = Math.max(col.width, measureHeaderMinWidth(col, typeDef));
17434
+ if (col.maxWidth !== void 0 && w > col.maxWidth) w = col.maxWidth;
17435
+ widths[field] = Math.round(w);
17436
+ totalContentWidth += w;
17437
+ continue;
17438
+ }
16682
17439
  let calculatedWidth = typeDef?.defaultWidth ?? DEFAULT_COLUMN_WIDTH;
16683
17440
  if (autoFit) {
16684
- const headerText = String(col.headerName ?? field);
16685
- let maxWidth = measureTextWidth(headerText) + CELL_PADDING_PX;
17441
+ let maxWidth = measureHeaderMinWidth(col, typeDef);
16686
17442
  const sample = rows.slice(0, sampleSize);
16687
17443
  for (const row of sample) {
16688
17444
  const text = applyFormatter(row, col);
@@ -16702,33 +17458,63 @@ function calculateColumnWidths(columns, rows, options) {
16702
17458
  totalContentWidth += calculatedWidth;
16703
17459
  }
16704
17460
  if (totalContentWidth < containerWidth) {
16705
- const remainingSpace = containerWidth - totalContentWidth;
16706
17461
  const isFixed = (col) => col.type === "actions" || col.type === "checkbox";
16707
- const flexibleColumns = columns.filter(
16708
- (col) => col.width === void 0 && !isFixed(col)
16709
- );
16710
- const targets = flexibleColumns.length > 0 ? flexibleColumns : autoFit ? columns.filter((col) => !isFixed(col)) : [];
17462
+ const nonFixed = columns.filter((col) => !isFixed(col));
17463
+ const hasFlexible = nonFixed.some((col) => col.width === void 0);
17464
+ const targets = hasFlexible || autoFit ? nonFixed : [];
16711
17465
  if (targets.length > 0) {
16712
- const extraPerColumn = Math.floor(remainingSpace / targets.length);
16713
- let distributed = 0;
16714
- targets.forEach((col, index) => {
16715
- const field = String(col.field);
16716
- const isLast = index === targets.length - 1;
16717
- const extra = isLast ? remainingSpace - distributed : extraPerColumn;
16718
- const current = widths[field] ?? col.width ?? 0;
16719
- let next = current + extra;
16720
- if (col.maxWidth !== void 0 && next > col.maxWidth) {
16721
- next = col.maxWidth;
16722
- }
16723
- widths[field] = Math.round(next);
16724
- distributed += extra;
17466
+ const baseWidth = (col) => widths[String(col.field)] ?? col.width ?? DEFAULT_COLUMN_WIDTH;
17467
+ let growable = targets.filter((col) => {
17468
+ const f = String(col.field);
17469
+ return col.maxWidth === void 0 || (widths[f] ?? 0) < col.maxWidth;
16725
17470
  });
17471
+ let remaining = containerWidth - totalContentWidth;
17472
+ let guard2 = 0;
17473
+ while (remaining >= 1 && growable.length > 0 && guard2 < 16) {
17474
+ guard2 += 1;
17475
+ const totalWeight = growable.reduce((sum, col) => sum + baseWidth(col), 0);
17476
+ if (totalWeight <= 0) break;
17477
+ let consumedThisPass = 0;
17478
+ const stillGrowable = [];
17479
+ for (const col of growable) {
17480
+ const f = String(col.field);
17481
+ const current = widths[f] ?? col.width ?? 0;
17482
+ const share = baseWidth(col) / totalWeight * remaining;
17483
+ const next = current + share;
17484
+ if (col.maxWidth !== void 0 && next >= col.maxWidth) {
17485
+ consumedThisPass += col.maxWidth - current;
17486
+ widths[f] = col.maxWidth;
17487
+ } else {
17488
+ consumedThisPass += share;
17489
+ widths[f] = next;
17490
+ stillGrowable.push(col);
17491
+ }
17492
+ }
17493
+ remaining -= consumedThisPass;
17494
+ growable = stillGrowable;
17495
+ if (consumedThisPass < 0.5) break;
17496
+ }
17497
+ let lastFlexField;
17498
+ let roundedTotal = 0;
17499
+ for (const col of targets) {
17500
+ const f = String(col.field);
17501
+ widths[f] = Math.round(widths[f] ?? col.width ?? 0);
17502
+ roundedTotal += widths[f];
17503
+ const maxed = col.maxWidth !== void 0 && widths[f] >= col.maxWidth;
17504
+ if (!maxed) lastFlexField = f;
17505
+ }
17506
+ if (lastFlexField !== void 0) {
17507
+ const residue = Math.round(containerWidth) - roundedTotal;
17508
+ if (residue !== 0) {
17509
+ widths[lastFlexField] = Math.max(0, widths[lastFlexField] + residue);
17510
+ }
17511
+ }
16726
17512
  }
16727
17513
  }
16728
17514
  return widths;
16729
17515
  }
16730
17516
  function useColumnAutoWidth(containerRef, columns, rows, options) {
16731
- const { enabled, sampleSize, reservedWidth = 0 } = options;
17517
+ const { enabled, sampleSize, reservedWidth = 0, recalcKey } = options;
16732
17518
  const [autoWidths, setAutoWidths] = useState({});
16733
17519
  const rafIdRef = useRef(null);
16734
17520
  const columnsRef = useRef(columns);
@@ -16794,6 +17580,9 @@ function useColumnAutoWidth(containerRef, columns, rows, options) {
16794
17580
  containerRef,
16795
17581
  sampleSize,
16796
17582
  reservedWidth,
17583
+ // Re-attach quando o elemento observado desmonta/remonta sem trocar a ref
17584
+ // (toggle de view Tabela↔Lista). Sem isso o observer fica no node antigo.
17585
+ recalcKey,
16797
17586
  columns.length,
16798
17587
  rows.length,
16799
17588
  // Inclui campos das columns pra recalcular quando consumer muda a schema
@@ -17336,7 +18125,7 @@ function downloadCsv(csv, filename) {
17336
18125
  URL.revokeObjectURL(url);
17337
18126
  }
17338
18127
  const STORAGE_PREFIX$1 = "igreen-datatable:";
17339
- const SCHEMA_VERSION = 4;
18128
+ const SCHEMA_VERSION = 5;
17340
18129
  function storageKey$1(persistId) {
17341
18130
  return `${STORAGE_PREFIX$1}${persistId}`;
17342
18131
  }
@@ -17614,13 +18403,25 @@ function useDataTableController(props, ref2) {
17614
18403
  [props.persistId]
17615
18404
  );
17616
18405
  const scrollContainerRef = useRef(null);
18406
+ const [internalViewMode, setInternalViewMode] = useState(
18407
+ // Hidrata do localStorage (v3+) com fallback pra prop `defaultViewMode`
18408
+ persistedInitial?.viewMode ?? props.defaultViewMode ?? "table"
18409
+ );
18410
+ const viewMode = props.viewMode ?? internalViewMode;
17617
18411
  const autoFitEnabled = props.autoFit !== false;
17618
18412
  const selectionReservedWidth = props.selectionConfig?.enabled ? SELECTION_COLUMN_WIDTH : 0;
17619
18413
  const { autoWidths } = useColumnAutoWidth(
17620
18414
  scrollContainerRef,
17621
18415
  props.columns,
17622
18416
  props.rows ?? [],
17623
- { enabled: autoFitEnabled, reservedWidth: selectionReservedWidth }
18417
+ {
18418
+ enabled: autoFitEnabled,
18419
+ reservedWidth: selectionReservedWidth,
18420
+ // Re-attach/re-medir quando o corpo da tabela remonta (toggle de view).
18421
+ // Só "table" carrega o scrollRef observado; usar viewMode garante que ao
18422
+ // voltar pra Tabela o observer reata no node novo e re-mede do zero.
18423
+ recalcKey: viewMode
18424
+ }
17624
18425
  );
17625
18426
  const cols = useDataTableColumns({
17626
18427
  columns: props.columns,
@@ -17666,11 +18467,6 @@ function useDataTableController(props, ref2) {
17666
18467
  onDensityChange: props.onDensityChange,
17667
18468
  initialDensity: persistedInitial?.density
17668
18469
  });
17669
- const [internalViewMode, setInternalViewMode] = useState(
17670
- // Hidrata do localStorage (v3+) com fallback pra prop `defaultViewMode`
17671
- persistedInitial?.viewMode ?? props.defaultViewMode ?? "table"
17672
- );
17673
- const viewMode = props.viewMode ?? internalViewMode;
17674
18470
  const setViewMode = useCallback$1((mode) => {
17675
18471
  if (props.viewMode === void 0) setInternalViewMode(mode);
17676
18472
  props.onViewModeChange?.(mode);
@@ -17794,7 +18590,10 @@ function useDataTableController(props, ref2) {
17794
18590
  // só "captura" esses valores quando a Default está ativa. Aplicar uma view custom
17795
18591
  // não polui o Default (o save sempre usa defaultSnapshotRef, não persistedSnapshot).
17796
18592
  currentPage: pagination.paginationModel.page,
17797
- columnWidths: cols.columnWidths,
18593
+ // Persistir SÓ resize manual (widthOverrides) — NUNCA as larguras efetivas
18594
+ // (cols.columnWidths inclui autoFit). Persistir efetivas congelava o layout
18595
+ // e matava o autoFit no reload (vira override de precedência máxima).
18596
+ columnWidths: cols.widthOverrides,
17798
18597
  pinnedColumns: cols.pinnedColumns,
17799
18598
  hiddenColumns: Array.from(cols.hiddenColumns),
17800
18599
  columnOrder: cols.columnOrder,
@@ -17811,7 +18610,7 @@ function useDataTableController(props, ref2) {
17811
18610
  sort.sortModels,
17812
18611
  pagination.paginationModel.pageSize,
17813
18612
  pagination.paginationModel.page,
17814
- cols.columnWidths,
18613
+ cols.widthOverrides,
17815
18614
  cols.pinnedColumns,
17816
18615
  cols.hiddenColumns,
17817
18616
  cols.columnOrder,
@@ -17850,7 +18649,7 @@ function useDataTableController(props, ref2) {
17850
18649
  hiddenColumns: state.hiddenColumns,
17851
18650
  columnOrder: state.columnOrder
17852
18651
  });
17853
- setViewMode(state.viewMode ?? "table");
18652
+ if (state.viewMode !== void 0) setViewMode(state.viewMode);
17854
18653
  setGroupBy(state.groupBy);
17855
18654
  setExpandedRowIds(state.expandedRowIds ?? []);
17856
18655
  savedViews.setCurrentViewId(id);
@@ -17909,7 +18708,9 @@ function useDataTableController(props, ref2) {
17909
18708
  filterModel: filters.filterModel,
17910
18709
  sortModel: sort.sortModels,
17911
18710
  density: density.density,
17912
- columnWidths: cols.columnWidths,
18711
+ // Só resize manual (não as efetivas c/ autoFit) — senão a view congela
18712
+ // o layout e mata o autoFit ao ser aplicada.
18713
+ columnWidths: cols.widthOverrides,
17913
18714
  pinnedColumns: cols.pinnedColumns,
17914
18715
  hiddenColumns: Array.from(cols.hiddenColumns),
17915
18716
  columnOrder: cols.columnOrder,
@@ -17926,7 +18727,7 @@ function useDataTableController(props, ref2) {
17926
18727
  filters.filterModel,
17927
18728
  sort.sortModels,
17928
18729
  density.density,
17929
- cols.columnWidths,
18730
+ cols.widthOverrides,
17930
18731
  cols.pinnedColumns,
17931
18732
  cols.hiddenColumns,
17932
18733
  cols.columnOrder,
@@ -17946,7 +18747,6 @@ function useDataTableController(props, ref2) {
17946
18747
  hiddenColumns: snapshot.hiddenColumns ?? [],
17947
18748
  columnOrder: snapshot.columnOrder ?? props.columns.map((c) => String(c.field))
17948
18749
  });
17949
- setViewMode(snapshot.viewMode ?? "table");
17950
18750
  setGroupBy(snapshot.groupBy);
17951
18751
  setExpandedRowIds(snapshot.expandedRowIds ?? []);
17952
18752
  filters.setFilterModel(snapshot.filterModel ?? { items: [], logicOperator: "AND" });
@@ -18860,7 +19660,7 @@ const cellAddonsStyles = tv({
18860
19660
  ],
18861
19661
  /** Conteúdo do popover do "Ler mais". Largura via token semântico
18862
19662
  * (tooltip-lg = 320px) — reveal de texto é conceitualmente um tooltip. */
18863
- readMorePopover: "flex flex-col gap-gp-md p-pad-lg max-w-container-tooltip-lg text-body-sm text-fg-default whitespace-pre-wrap break-words"
19663
+ readMorePopover: "flex flex-col gap-gp-md p-pad-lg max-w-tooltip-lg text-body-sm text-fg-default whitespace-pre-wrap break-words"
18864
19664
  }
18865
19665
  });
18866
19666
  const styles$2 = cellAddonsStyles();
@@ -19801,7 +20601,7 @@ function DataTableInternal(props, ref2) {
19801
20601
  const selectionConfig = props.selectionConfig ?? { enabled: false };
19802
20602
  const isKanban = viewMode === "kanban" && Boolean(props.kanbanConfig);
19803
20603
  const isList = viewMode === "list" && Boolean(props.listConfig);
19804
- useGrabToScroll(scrollContainerRef, props.grabToScroll === true);
20604
+ useGrabToScroll(scrollContainerRef, props.grabToScroll !== false);
19805
20605
  const [isFullscreen, setIsFullscreen] = useState(false);
19806
20606
  const enableFullscreen = toolbarConfig.enableFullscreen === true;
19807
20607
  const toggleFullscreen = useCallback$1(() => {
@@ -19852,8 +20652,8 @@ function DataTableInternal(props, ref2) {
19852
20652
  const cfg = props.listConfig;
19853
20653
  if (!isList || !cfg) return [];
19854
20654
  const getRowId = contextValue.getRowId;
19855
- const rows = rowsAllPagesProcessed;
19856
20655
  const pathFn = cfg.getPath ?? props.getTreeDataPath;
20656
+ const rows = cfg.paginated && !(cfg.hierarchical && pathFn) ? rowsToRender : rowsAllPagesProcessed;
19857
20657
  if (cfg.hierarchical && pathFn) {
19858
20658
  const pathOf = pathFn;
19859
20659
  const shells = /* @__PURE__ */ new Map();
@@ -19882,6 +20682,7 @@ function DataTableInternal(props, ref2) {
19882
20682
  props.listConfig,
19883
20683
  props.getTreeDataPath,
19884
20684
  rowsAllPagesProcessed,
20685
+ rowsToRender,
19885
20686
  contextValue.getRowId
19886
20687
  ]);
19887
20688
  const listDefaultExpandedIds = useMemo$1(() => {
@@ -20137,7 +20938,10 @@ function DataTableInternal(props, ref2) {
20137
20938
  ...savedViews.views.map((v) => ({
20138
20939
  id: v.id,
20139
20940
  name: v.name,
20140
- owner: "me"
20941
+ // Preserva o dono vindo do service (backend real). Ausente = "me"
20942
+ // (compat com o mock, que nao tem multi-user).
20943
+ owner: v.owner ?? "me",
20944
+ ownerName: v.ownerName
20141
20945
  }))
20142
20946
  ],
20143
20947
  [props.defaultViews, savedViews.views]
@@ -20751,7 +21555,8 @@ function DataTableInternal(props, ref2) {
20751
21555
  });
20752
21556
  },
20753
21557
  soloLabel: toolbarConfig.title,
20754
- hideDivider: true
21558
+ hideDivider: true,
21559
+ allowCreate: props.allowCreateView !== false
20755
21560
  }
20756
21561
  ) : void 0,
20757
21562
  refresh: toolbarConfig.enableRefresh !== false ? /* @__PURE__ */ jsx(
@@ -21189,7 +21994,7 @@ function DataTableInternal(props, ref2) {
21189
21994
  }
21190
21995
  }
21191
21996
  ) : isCardMode ? cardBody : tableBody,
21192
- !isKanban && !isList && !useTreeData && paginationConfig.enabled !== false && (isLoading ? /* @__PURE__ */ jsx("div", { className: styles$1.footerWrap(), children: /* @__PURE__ */ jsx(FooterTableSkeleton, {}) }) : !isDataEmpty && /* @__PURE__ */ jsx("div", { className: styles$1.footerWrap(), children: /* @__PURE__ */ jsx(
21997
+ !isKanban && (!isList || props.listConfig?.paginated && !props.listConfig?.hierarchical) && !useTreeData && paginationConfig.enabled !== false && (isLoading ? /* @__PURE__ */ jsx("div", { className: styles$1.footerWrap(), children: /* @__PURE__ */ jsx(FooterTableSkeleton, {}) }) : !isDataEmpty && /* @__PURE__ */ jsx("div", { className: styles$1.footerWrap(), children: /* @__PURE__ */ jsx(
21193
21998
  FooterTable,
21194
21999
  {
21195
22000
  totalCount: totalAfterFilter,
@@ -21532,74 +22337,86 @@ function Panel({
21532
22337
  ] });
21533
22338
  }
21534
22339
  export {
21535
- ToolbarApplied as $,
22340
+ SortPopover as $,
21536
22341
  AlertModal as A,
21537
22342
  BulkActionButton as B,
21538
- ColsPanel as C,
22343
+ Checkbox as C,
21539
22344
  DataTable as D,
21540
- FloatingPanelSection as E,
22345
+ DataTableTotalizerRow as E,
21541
22346
  FormFieldInput as F,
21542
- FooterTable as G,
21543
- FooterTableSkeleton as H,
21544
- FormFieldCheckbox as I,
21545
- FormFieldSwitch as J,
21546
- Kanban as K,
21547
- PanelBody as L,
21548
- MoreMenu as M,
21549
- SheetContent as N,
21550
- PanelFooter as O,
22347
+ FLOATING_PANEL_SIZE_PX as G,
22348
+ FilterPanel as H,
22349
+ FloatingPanelField as I,
22350
+ FloatingPanelSection as J,
22351
+ FooterTable as K,
22352
+ FooterTableSkeleton as L,
22353
+ FormFieldCheckbox as M,
22354
+ FormFieldSwitch as N,
22355
+ Kanban as O,
21551
22356
  Panel as P,
21552
- PanelHeader as Q,
21553
- Sheet as R,
22357
+ MoreMenu as Q,
22358
+ PanelBody as R,
21554
22359
  SheetClose as S,
21555
22360
  ToolbarToolButton as T,
21556
- SheetTrigger as U,
21557
- SELECTION_COLUMN_WIDTH as V,
21558
- SortPanel as W,
21559
- SortPopover as X,
21560
- TABLE_HEADER_HEIGHT as Y,
21561
- TableToolbar as Z,
21562
- TableToolbarViews as _,
22361
+ SheetContent as U,
22362
+ PanelFooter as V,
22363
+ PanelHeader as W,
22364
+ Sheet as X,
22365
+ SheetTrigger as Y,
22366
+ SELECTION_COLUMN_WIDTH as Z,
22367
+ SortPanel as _,
21563
22368
  FormField as a,
21564
- ToolbarDivider as a0,
21565
- ToolbarSaveButton as a1,
21566
- ToolbarSearch as a2,
21567
- ToolbarSegmented as a3,
21568
- ToolbarSettingsMenu as a4,
21569
- ToolbarTabs as a5,
21570
- ViewsPopover as a6,
21571
- avatarVariants as a7,
21572
- columnTypeRegistry as a8,
21573
- floatingPanelStyles as a9,
21574
- panelContainer as aa,
21575
- savedViewsMockService as ab,
21576
- useColumnWidths as ac,
21577
- useDataTableContext as ad,
21578
- useFloatingPanelResize as ae,
22369
+ TABLE_HEADER_HEIGHT as a0,
22370
+ Table as a1,
22371
+ TableBody as a2,
22372
+ TableCardRow as a3,
22373
+ TableCell as a4,
22374
+ TableHead as a5,
22375
+ TableHeadCell as a6,
22376
+ TableRow as a7,
22377
+ TableToolbar as a8,
22378
+ TableToolbarViews as a9,
22379
+ ToolbarApplied as aa,
22380
+ ToolbarDivider as ab,
22381
+ ToolbarSaveButton as ac,
22382
+ ToolbarSearch as ad,
22383
+ ToolbarSegmented as ae,
22384
+ ToolbarSettingsMenu as af,
22385
+ ToolbarTabs as ag,
22386
+ ViewsPopover as ah,
22387
+ avatarVariants as ai,
22388
+ columnTypeRegistry as aj,
22389
+ floatingPanelStyles as ak,
22390
+ panelContainer as al,
22391
+ savedViewsMockService as am,
22392
+ useColumnResize as an,
22393
+ useColumnWidths as ao,
22394
+ useDataTableContext as ap,
22395
+ useFloatingPanelResize as aq,
21579
22396
  FormFieldSelect as b,
21580
22397
  FormFieldTextarea as c,
21581
22398
  FloatingPanel as d,
21582
- FilterPopover as e,
21583
- ButtonGroup as f,
21584
- ToolbarSimpleFilterDrawer as g,
21585
- ACTIONS_COLUMN_WIDTH as h,
22399
+ Avatar as e,
22400
+ FilterPopover as f,
22401
+ getContrastTextColor as g,
22402
+ ButtonGroup as h,
21586
22403
  isFilterEntryActive as i,
21587
- AddViewModal as j,
21588
- Avatar as k,
21589
- BulkActionsBar as l,
21590
- ColsPopover as m,
21591
- Combobox as n,
21592
- DEFAULT_FILTER_OPERATORS as o,
22404
+ ToolbarSimpleFilterDrawer as j,
22405
+ ACTIONS_COLUMN_WIDTH as k,
22406
+ Calendar as l,
22407
+ Textarea as m,
22408
+ AddViewModal as n,
22409
+ BulkActionsBar as o,
21593
22410
  presetView as p,
21594
- DataTableActionsCell as q,
21595
- DataTableEditCell as r,
21596
- DataTableEmpty as s,
21597
- DataTableFloatingBulkBar as t,
21598
- DataTableLoading as u,
21599
- DataTableNoResults as v,
21600
- DataTableTotalizerRow as w,
21601
- FLOATING_PANEL_SIZE_PX as x,
21602
- FilterPanel as y,
21603
- FloatingPanelField as z
22411
+ ColsPanel as q,
22412
+ ColsPopover as r,
22413
+ Combobox as s,
22414
+ DEFAULT_FILTER_OPERATORS as t,
22415
+ DataTableActionsCell as u,
22416
+ DataTableEditCell as v,
22417
+ DataTableEmpty as w,
22418
+ DataTableFloatingBulkBar as x,
22419
+ DataTableLoading as y,
22420
+ DataTableNoResults as z
21604
22421
  };
21605
- //# sourceMappingURL=panel-l8mxXYXG.mjs.map
22422
+ //# sourceMappingURL=panel-JPhHRjIS.mjs.map