@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.
- package/README.md +39 -12
- package/dist-lib/chunks/{app-shell-Cy9be0Zx.mjs → app-shell-78w0pYdP.mjs} +849 -79
- package/dist-lib/chunks/app-shell-78w0pYdP.mjs.map +1 -0
- package/dist-lib/chunks/{app-shell-CPx9X7zP.cjs → app-shell-Cyh8AUJT.cjs} +947 -176
- package/dist-lib/chunks/app-shell-Cyh8AUJT.cjs.map +1 -0
- package/dist-lib/chunks/{clientes-showcase-mocks-ayU1SDOA.mjs → clientes-showcase-mocks-CwWGCCmf.mjs} +1 -27
- package/dist-lib/chunks/clientes-showcase-mocks-CwWGCCmf.mjs.map +1 -0
- package/dist-lib/chunks/{clientes-showcase-mocks-DygUqkkh.cjs → clientes-showcase-mocks-CwhluBTT.cjs} +1 -44
- package/dist-lib/chunks/clientes-showcase-mocks-CwhluBTT.cjs.map +1 -0
- package/dist-lib/chunks/{input-BWevV7up.cjs → input-BjUSWce3.cjs} +24 -4
- package/dist-lib/chunks/input-BjUSWce3.cjs.map +1 -0
- package/dist-lib/chunks/{input-C9eKSSEb.mjs → input-DCDU4i4S.mjs} +23 -3
- package/dist-lib/chunks/input-DCDU4i4S.mjs.map +1 -0
- package/dist-lib/chunks/kpi-delta-C_3V6uG6.cjs +148 -0
- package/dist-lib/chunks/kpi-delta-C_3V6uG6.cjs.map +1 -0
- package/dist-lib/chunks/kpi-delta-DpYuDY4h.mjs +149 -0
- package/dist-lib/chunks/kpi-delta-DpYuDY4h.mjs.map +1 -0
- package/dist-lib/chunks/{page-header-CQbTGWQ8.mjs → page-header-B6XJyIMz.mjs} +2 -2
- package/dist-lib/chunks/{page-header-CQbTGWQ8.mjs.map → page-header-B6XJyIMz.mjs.map} +1 -1
- package/dist-lib/chunks/{page-header-BZ-WrxV2.cjs → page-header-D0rpU0yn.cjs} +4 -4
- package/dist-lib/chunks/{page-header-BZ-WrxV2.cjs.map → page-header-D0rpU0yn.cjs.map} +1 -1
- package/dist-lib/chunks/{panel-l8mxXYXG.mjs → panel-JPhHRjIS.mjs} +1753 -936
- package/dist-lib/chunks/panel-JPhHRjIS.mjs.map +1 -0
- package/dist-lib/chunks/{panel-BzrZmUF2.cjs → panel-YQI9vAf_.cjs} +1886 -1068
- package/dist-lib/chunks/panel-YQI9vAf_.cjs.map +1 -0
- package/dist-lib/index.cjs +3820 -231
- package/dist-lib/index.cjs.map +1 -1
- package/dist-lib/index.mjs +3899 -314
- package/dist-lib/index.mjs.map +1 -1
- package/dist-lib/preview/chat.cjs +41 -42
- package/dist-lib/preview/chat.cjs.map +1 -1
- package/dist-lib/preview/chat.mjs +2 -3
- package/dist-lib/preview/chat.mjs.map +1 -1
- package/dist-lib/preview/clientes.cjs +22 -24
- package/dist-lib/preview/clientes.cjs.map +1 -1
- package/dist-lib/preview/clientes.mjs +5 -7
- package/dist-lib/preview/clientes.mjs.map +1 -1
- package/dist-lib/preview/dashboard.cjs +232 -28
- package/dist-lib/preview/dashboard.cjs.map +1 -1
- package/dist-lib/preview/dashboard.mjs +215 -11
- package/dist-lib/preview/dashboard.mjs.map +1 -1
- package/dist-lib/preview/mocks.cjs +1 -1
- package/dist-lib/preview/mocks.mjs +1 -1
- package/dist-lib/src/components/index.d.ts +14 -0
- package/dist-lib/src/components/index.d.ts.map +1 -1
- package/dist-lib/src/components/shadcn/command.d.ts.map +1 -1
- package/dist-lib/src/components/shadcn/input.d.ts.map +1 -1
- package/dist-lib/src/components/shadcn/tabs.d.ts +11 -6
- package/dist-lib/src/components/shadcn/tabs.d.ts.map +1 -1
- package/dist-lib/src/components/shadcn/tooltip.d.ts +25 -7
- package/dist-lib/src/components/shadcn/tooltip.d.ts.map +1 -1
- package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.d.ts +13 -0
- package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.styles.d.ts +95 -0
- package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.types.d.ts +81 -0
- package/dist-lib/src/components/ui/ChoroplethMap/choropleth-map.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ChoroplethMap/index.d.ts +3 -0
- package/dist-lib/src/components/ui/ChoroplethMap/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.d.ts +16 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.presets.d.ts +13 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.presets.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.styles.d.ts +135 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.types.d.ts +35 -0
- package/dist-lib/src/components/ui/ColorPicker/color-picker.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ColorPicker/index.d.ts +6 -0
- package/dist-lib/src/components/ui/ColorPicker/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.d.ts +23 -0
- package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.styles.d.ts +173 -0
- package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.types.d.ts +59 -0
- package/dist-lib/src/components/ui/ConversationListItem/conversation-list-item.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/ConversationListItem/index.d.ts +5 -0
- package/dist-lib/src/components/ui/ConversationListItem/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/DataTable/data-table.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DataTable/data-table.types.d.ts +14 -1
- package/dist-lib/src/components/ui/DataTable/data-table.types.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DataTable/hooks/state-persistence-utils.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DataTable/hooks/use-column-auto-width.d.ts +9 -0
- package/dist-lib/src/components/ui/DataTable/hooks/use-column-auto-width.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DataTable/hooks/use-data-table-columns.d.ts +3 -1
- package/dist-lib/src/components/ui/DataTable/hooks/use-data-table-columns.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DataTable/hooks/use-data-table-controller.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DataTable/services/saved-views.types.d.ts +9 -0
- package/dist-lib/src/components/ui/DataTable/services/saved-views.types.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DataTable/utils/calculate-column-widths.d.ts +16 -0
- package/dist-lib/src/components/ui/DataTable/utils/calculate-column-widths.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DatePicker/datepicker.d.ts +31 -8
- package/dist-lib/src/components/ui/DatePicker/datepicker.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DatePicker/index.d.ts +1 -1
- package/dist-lib/src/components/ui/DatePicker/index.d.ts.map +1 -1
- package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.d.ts +18 -0
- package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.d.ts.map +1 -0
- package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.styles.d.ts +63 -0
- package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.types.d.ts +21 -0
- package/dist-lib/src/components/ui/DateSeparatorChip/date-separator-chip.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/DateSeparatorChip/index.d.ts +5 -0
- package/dist-lib/src/components/ui/DateSeparatorChip/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/EmptyState/empty-state.d.ts +12 -0
- package/dist-lib/src/components/ui/EmptyState/empty-state.d.ts.map +1 -0
- package/dist-lib/src/components/ui/EmptyState/empty-state.styles.d.ts +83 -0
- package/dist-lib/src/components/ui/EmptyState/empty-state.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/EmptyState/empty-state.types.d.ts +43 -0
- package/dist-lib/src/components/ui/EmptyState/empty-state.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/EmptyState/index.d.ts +5 -0
- package/dist-lib/src/components/ui/EmptyState/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/FileUploadField/file-upload-field.d.ts +15 -0
- package/dist-lib/src/components/ui/FileUploadField/file-upload-field.d.ts.map +1 -0
- package/dist-lib/src/components/ui/FileUploadField/file-upload-field.styles.d.ts +66 -0
- package/dist-lib/src/components/ui/FileUploadField/file-upload-field.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/FileUploadField/file-upload-field.types.d.ts +41 -0
- package/dist-lib/src/components/ui/FileUploadField/file-upload-field.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/FileUploadField/index.d.ts +3 -0
- package/dist-lib/src/components/ui/FileUploadField/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/Kpi/kpi-delta.d.ts +4 -1
- package/dist-lib/src/components/ui/Kpi/kpi-delta.d.ts.map +1 -1
- package/dist-lib/src/components/ui/Kpi/kpi.d.ts +1 -1
- package/dist-lib/src/components/ui/Kpi/kpi.d.ts.map +1 -1
- package/dist-lib/src/components/ui/Kpi/kpi.styles.d.ts +42 -0
- package/dist-lib/src/components/ui/Kpi/kpi.styles.d.ts.map +1 -1
- package/dist-lib/src/components/ui/Kpi/kpi.types.d.ts +13 -1
- package/dist-lib/src/components/ui/Kpi/kpi.types.d.ts.map +1 -1
- package/dist-lib/src/components/ui/MarkdownText/index.d.ts +5 -0
- package/dist-lib/src/components/ui/MarkdownText/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MarkdownText/markdown-text.d.ts +14 -0
- package/dist-lib/src/components/ui/MarkdownText/markdown-text.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MarkdownText/markdown-text.styles.d.ts +72 -0
- package/dist-lib/src/components/ui/MarkdownText/markdown-text.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MarkdownText/markdown-text.types.d.ts +26 -0
- package/dist-lib/src/components/ui/MarkdownText/markdown-text.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MenuSidebar/sidebar-section.d.ts.map +1 -1
- package/dist-lib/src/components/ui/MenuSidebar/sidebar.styles.d.ts +1 -0
- package/dist-lib/src/components/ui/MenuSidebar/sidebar.styles.d.ts.map +1 -1
- package/dist-lib/src/components/ui/MenuSidebar/sidebar.types.d.ts +7 -1
- package/dist-lib/src/components/ui/MenuSidebar/sidebar.types.d.ts.map +1 -1
- package/dist-lib/src/components/ui/MessageAck/index.d.ts +5 -0
- package/dist-lib/src/components/ui/MessageAck/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageAck/message-ack.d.ts +18 -0
- package/dist-lib/src/components/ui/MessageAck/message-ack.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageAck/message-ack.styles.d.ts +61 -0
- package/dist-lib/src/components/ui/MessageAck/message-ack.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageAck/message-ack.types.d.ts +14 -0
- package/dist-lib/src/components/ui/MessageAck/message-ack.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageBubble/index.d.ts +5 -0
- package/dist-lib/src/components/ui/MessageBubble/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageBubble/message-bubble.d.ts +20 -0
- package/dist-lib/src/components/ui/MessageBubble/message-bubble.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageBubble/message-bubble.styles.d.ts +180 -0
- package/dist-lib/src/components/ui/MessageBubble/message-bubble.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageBubble/message-bubble.types.d.ts +87 -0
- package/dist-lib/src/components/ui/MessageBubble/message-bubble.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageComposer/index.d.ts +5 -0
- package/dist-lib/src/components/ui/MessageComposer/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageComposer/message-composer.d.ts +18 -0
- package/dist-lib/src/components/ui/MessageComposer/message-composer.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageComposer/message-composer.styles.d.ts +113 -0
- package/dist-lib/src/components/ui/MessageComposer/message-composer.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageComposer/message-composer.types.d.ts +49 -0
- package/dist-lib/src/components/ui/MessageComposer/message-composer.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/index.d.ts +6 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.d.ts +12 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.styles.d.ts +57 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.types.d.ts +36 -0
- package/dist-lib/src/components/ui/MessageVariablesPicker/message-variables-picker.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/Modal/modal.d.ts +3 -1
- package/dist-lib/src/components/ui/Modal/modal.d.ts.map +1 -1
- package/dist-lib/src/components/ui/Modal/modal.styles.d.ts +7 -1
- package/dist-lib/src/components/ui/Modal/modal.styles.d.ts.map +1 -1
- package/dist-lib/src/components/ui/MonthYearPicker/index.d.ts +3 -0
- package/dist-lib/src/components/ui/MonthYearPicker/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.d.ts +11 -0
- package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.styles.d.ts +113 -0
- package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.types.d.ts +34 -0
- package/dist-lib/src/components/ui/MonthYearPicker/month-year-picker.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/SingleMenuSidebar/single-menu-sidebar.styles.d.ts +1 -1
- package/dist-lib/src/components/ui/Spinner/index.d.ts +3 -0
- package/dist-lib/src/components/ui/Spinner/index.d.ts.map +1 -0
- package/dist-lib/src/components/ui/Spinner/spinner.d.ts +11 -0
- package/dist-lib/src/components/ui/Spinner/spinner.d.ts.map +1 -0
- package/dist-lib/src/components/ui/Spinner/spinner.styles.d.ts +55 -0
- package/dist-lib/src/components/ui/Spinner/spinner.styles.d.ts.map +1 -0
- package/dist-lib/src/components/ui/Spinner/spinner.types.d.ts +12 -0
- package/dist-lib/src/components/ui/Spinner/spinner.types.d.ts.map +1 -0
- package/dist-lib/src/components/ui/TableToolbar/parts/table-toolbar-views.d.ts +7 -1
- package/dist-lib/src/components/ui/TableToolbar/parts/table-toolbar-views.d.ts.map +1 -1
- package/dist-lib/src/components/ui/Toast/toast.d.ts +44 -0
- package/dist-lib/src/components/ui/Toast/toast.d.ts.map +1 -0
- package/dist-lib/src/hooks/useBrand.d.ts +31 -0
- package/dist-lib/src/hooks/useBrand.d.ts.map +1 -0
- package/dist-lib/src/preview/pages/ChatV2/components/QueueColumn/queue-column.styles.d.ts +3 -3
- package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase-mocks.d.ts +1 -1
- package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase-mocks.d.ts.map +1 -1
- package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase.types.d.ts +1 -1
- package/dist-lib/src/preview/pages/ClientesShowcase/clientes-showcase.types.d.ts.map +1 -1
- package/dist-lib/src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.types.d.ts +1 -1
- package/dist-lib/src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.types.d.ts.map +1 -1
- package/dist-lib/src/preview/pages/DashboardShowcase.d.ts.map +1 -1
- package/dist-lib/src/preview/pages/_table-data.d.ts +51 -0
- package/dist-lib/src/preview/pages/_table-data.d.ts.map +1 -0
- package/dist-lib/src/utils/tv.d.ts.map +1 -1
- package/dist-lib/theme.css +32 -0
- package/dist-lib/tokens/brands/blue/primitives/color-palette.d.ts +266 -0
- package/dist-lib/tokens/brands/blue/primitives/color-palette.d.ts.map +1 -0
- package/dist-lib/tokens/brands/blue/semantic/color-dark.d.ts +200 -0
- package/dist-lib/tokens/brands/blue/semantic/color-dark.d.ts.map +1 -0
- package/dist-lib/tokens/brands/blue/semantic/color-light.d.ts +202 -0
- package/dist-lib/tokens/brands/blue/semantic/color-light.d.ts.map +1 -0
- package/dist-lib/tokens/brands/default/semantic/typography.d.ts +4 -2
- package/dist-lib/tokens/brands/default/semantic/typography.d.ts.map +1 -1
- package/dist-lib/tokens/brands/green/primitives/color-palette.d.ts +267 -0
- package/dist-lib/tokens/brands/green/primitives/color-palette.d.ts.map +1 -0
- package/dist-lib/tokens/brands/green/semantic/color-dark.d.ts +200 -0
- package/dist-lib/tokens/brands/green/semantic/color-dark.d.ts.map +1 -0
- package/dist-lib/tokens/brands/green/semantic/color-light.d.ts +201 -0
- package/dist-lib/tokens/brands/green/semantic/color-light.d.ts.map +1 -0
- package/dist-lib/tokens/brands/pay/primitives/color-palette.d.ts +146 -0
- package/dist-lib/tokens/brands/pay/primitives/color-palette.d.ts.map +1 -0
- package/dist-lib/tokens/brands/pay/semantic/color-dark.d.ts +201 -0
- package/dist-lib/tokens/brands/pay/semantic/color-dark.d.ts.map +1 -0
- package/dist-lib/tokens/brands/pay/semantic/color-light.d.ts +199 -0
- package/dist-lib/tokens/brands/pay/semantic/color-light.d.ts.map +1 -0
- package/dist-lib/tokens.cjs +35 -0
- package/dist-lib/tokens.cjs.map +1 -1
- package/dist-lib/tokens.mjs +35 -0
- package/dist-lib/tokens.mjs.map +1 -1
- package/package.json +21 -7
- package/dist-lib/chunks/app-shell-CPx9X7zP.cjs.map +0 -1
- package/dist-lib/chunks/app-shell-Cy9be0Zx.mjs.map +0 -1
- package/dist-lib/chunks/badge-DBdk74KN.mjs +0 -840
- package/dist-lib/chunks/badge-DBdk74KN.mjs.map +0 -1
- package/dist-lib/chunks/badge-gU2wtxrn.cjs +0 -856
- package/dist-lib/chunks/badge-gU2wtxrn.cjs.map +0 -1
- package/dist-lib/chunks/chip-group-2-f_Yo7Y.cjs +0 -763
- package/dist-lib/chunks/chip-group-2-f_Yo7Y.cjs.map +0 -1
- package/dist-lib/chunks/chip-group-_e-yh1Zq.mjs +0 -747
- package/dist-lib/chunks/chip-group-_e-yh1Zq.mjs.map +0 -1
- package/dist-lib/chunks/clientes-showcase-mocks-DygUqkkh.cjs.map +0 -1
- package/dist-lib/chunks/clientes-showcase-mocks-ayU1SDOA.mjs.map +0 -1
- package/dist-lib/chunks/input-BWevV7up.cjs.map +0 -1
- package/dist-lib/chunks/input-C9eKSSEb.mjs.map +0 -1
- package/dist-lib/chunks/panel-BzrZmUF2.cjs.map +0 -1
- 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,
|
|
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 "./
|
|
11
|
-
import {
|
|
12
|
-
import
|
|
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-
|
|
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
|
|
424
|
-
|
|
425
|
-
|
|
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
|
|
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
|
|
436
|
-
"focus-visible:shadow-sh-ring
|
|
437
|
-
"
|
|
438
|
-
"
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
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
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
className:
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
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
|
-
|
|
3475
|
+
// Só 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
|
-
|
|
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__ */
|
|
3870
|
-
|
|
3871
|
-
|
|
3872
|
-
|
|
3873
|
-
|
|
3874
|
-
|
|
3875
|
-
|
|
3876
|
-
|
|
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
|
|
3885
|
-
|
|
3886
|
-
|
|
3887
|
-
|
|
3888
|
-
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3892
|
-
|
|
3893
|
-
|
|
3894
|
-
|
|
3895
|
-
|
|
3896
|
-
|
|
3897
|
-
|
|
3898
|
-
|
|
3899
|
-
|
|
3900
|
-
|
|
3901
|
-
|
|
3902
|
-
|
|
3903
|
-
|
|
3904
|
-
|
|
3905
|
-
|
|
3906
|
-
|
|
3907
|
-
|
|
3908
|
-
|
|
3909
|
-
|
|
3910
|
-
|
|
3911
|
-
|
|
3912
|
-
return /* @__PURE__ */ jsxs("
|
|
3913
|
-
/* @__PURE__ */
|
|
3914
|
-
|
|
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
|
-
|
|
3947
|
-
|
|
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
|
-
|
|
3981
|
-
className:
|
|
4728
|
+
type: "button",
|
|
4729
|
+
className: s.head(),
|
|
4730
|
+
onClick: () => setOpen((o) => !o),
|
|
4731
|
+
"aria-expanded": open,
|
|
3982
4732
|
children: [
|
|
3983
|
-
|
|
3984
|
-
|
|
4733
|
+
/* @__PURE__ */ jsx("span", { children: title2 }),
|
|
4734
|
+
/* @__PURE__ */ jsx(ChevronDown, { className: cn(s.chev(), open && "rotate-180") })
|
|
3985
4735
|
]
|
|
3986
4736
|
}
|
|
3987
|
-
)
|
|
3988
|
-
|
|
3989
|
-
|
|
3990
|
-
|
|
3991
|
-
|
|
3992
|
-
|
|
3993
|
-
|
|
3994
|
-
|
|
3995
|
-
|
|
3996
|
-
|
|
3997
|
-
|
|
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
|
-
|
|
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
|
|
16708
|
-
|
|
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
|
|
16713
|
-
let
|
|
16714
|
-
|
|
16715
|
-
|
|
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 =
|
|
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
|
-
{
|
|
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
|
-
|
|
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.
|
|
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
|
-
|
|
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
|
-
|
|
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.
|
|
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-
|
|
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
|
|
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
|
-
|
|
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
|
-
|
|
22340
|
+
SortPopover as $,
|
|
21536
22341
|
AlertModal as A,
|
|
21537
22342
|
BulkActionButton as B,
|
|
21538
|
-
|
|
22343
|
+
Checkbox as C,
|
|
21539
22344
|
DataTable as D,
|
|
21540
|
-
|
|
22345
|
+
DataTableTotalizerRow as E,
|
|
21541
22346
|
FormFieldInput as F,
|
|
21542
|
-
|
|
21543
|
-
|
|
21544
|
-
|
|
21545
|
-
|
|
21546
|
-
|
|
21547
|
-
|
|
21548
|
-
|
|
21549
|
-
|
|
21550
|
-
|
|
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
|
-
|
|
21553
|
-
|
|
22357
|
+
MoreMenu as Q,
|
|
22358
|
+
PanelBody as R,
|
|
21554
22359
|
SheetClose as S,
|
|
21555
22360
|
ToolbarToolButton as T,
|
|
21556
|
-
|
|
21557
|
-
|
|
21558
|
-
|
|
21559
|
-
|
|
21560
|
-
|
|
21561
|
-
|
|
21562
|
-
|
|
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
|
-
|
|
21565
|
-
|
|
21566
|
-
|
|
21567
|
-
|
|
21568
|
-
|
|
21569
|
-
|
|
21570
|
-
|
|
21571
|
-
|
|
21572
|
-
|
|
21573
|
-
|
|
21574
|
-
|
|
21575
|
-
|
|
21576
|
-
|
|
21577
|
-
|
|
21578
|
-
|
|
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
|
-
|
|
21583
|
-
|
|
21584
|
-
|
|
21585
|
-
|
|
22399
|
+
Avatar as e,
|
|
22400
|
+
FilterPopover as f,
|
|
22401
|
+
getContrastTextColor as g,
|
|
22402
|
+
ButtonGroup as h,
|
|
21586
22403
|
isFilterEntryActive as i,
|
|
21587
|
-
|
|
21588
|
-
|
|
21589
|
-
|
|
21590
|
-
|
|
21591
|
-
|
|
21592
|
-
|
|
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
|
-
|
|
21595
|
-
|
|
21596
|
-
|
|
21597
|
-
|
|
21598
|
-
|
|
21599
|
-
|
|
21600
|
-
|
|
21601
|
-
|
|
21602
|
-
|
|
21603
|
-
|
|
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-
|
|
22422
|
+
//# sourceMappingURL=panel-JPhHRjIS.mjs.map
|