@12-apps/ui 6.66.2 → 6.68.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/_internal/components/data-display/Avatar/Avatar.js +4 -4
- package/dist/_internal/components/data-display/Avatar/Avatar.view.js +2 -2
- package/dist/_internal/components/data-display/Carousel/Carousel.js +2 -2
- package/dist/_internal/components/data-display/Chart/Chart.js +3 -3
- package/dist/_internal/components/data-display/Chart/SpecChart.js +6 -6
- package/dist/_internal/components/data-display/Chart/chart-renderers.js +2 -2
- package/dist/_internal/components/data-display/Chart/chart-spec.js +2 -2
- package/dist/_internal/components/data-display/Chip/Chip.js +3 -3
- package/dist/_internal/components/data-display/Chip/Chip.metrics.js +5 -1
- package/dist/_internal/components/data-display/Chip/Chip.styles.js +2 -2
- package/dist/_internal/components/data-display/DataGrid/DataGrid.js +2 -2
- package/dist/_internal/components/data-display/DataViews/DataViewsGrid.js +34 -31
- package/dist/_internal/components/data-display/DataViews/DataViewsTableBase.js +36 -33
- package/dist/_internal/components/data-display/DataViews/base-card.js +2 -2
- package/dist/_internal/components/data-display/DataViews/base-list-card-geometry.js +5 -5
- package/dist/_internal/components/data-display/DataViews/base-list-card-layout.js +6 -6
- package/dist/_internal/components/data-display/DataViews/base-list-card-slots.js +4 -4
- package/dist/_internal/components/data-display/DataViews/base-list-card.js +8 -8
- package/dist/_internal/components/data-display/DataViews/data-views-display-panel.js +4 -4
- package/dist/_internal/components/data-display/DataViews/data-views-display-tabs.js +3 -3
- package/dist/_internal/components/data-display/DataViews/data-views-empty.js +5 -3
- package/dist/_internal/components/data-display/DataViews/data-views-filter-panel.js +6 -6
- package/dist/_internal/components/data-display/DataViews/data-views-grid-bodies.js +7 -6
- package/dist/_internal/components/data-display/DataViews/data-views-grid-parts.js +31 -28
- package/dist/_internal/components/data-display/DataViews/data-views-inline-bar.js +11 -5
- package/dist/_internal/components/data-display/DataViews/data-views-layout-context.js +2 -2
- package/dist/_internal/components/data-display/DataViews/data-views-more-fields.js +8 -3
- package/dist/_internal/components/data-display/DataViews/data-views-more-filters.js +7 -4
- package/dist/_internal/components/data-display/DataViews/data-views-overflow-fields.js +18 -0
- package/dist/_internal/components/data-display/DataViews/data-views-overflow-fields.js.map +1 -0
- package/dist/_internal/components/data-display/DataViews/data-views-overflow.js +6 -2
- package/dist/_internal/components/data-display/DataViews/data-views-quick-chip.js +20 -0
- package/dist/_internal/components/data-display/DataViews/data-views-quick-chip.js.map +1 -0
- package/dist/_internal/components/data-display/DataViews/data-views-quick-types.js +1 -0
- package/dist/_internal/components/data-display/DataViews/data-views-quick-types.js.map +1 -0
- package/dist/_internal/components/data-display/DataViews/data-views-range-pill.js +2 -2
- package/dist/_internal/components/data-display/DataViews/data-views-scope-tabs.js +3 -3
- package/dist/_internal/components/data-display/DataViews/data-views-shell-toolbar.js +8 -7
- package/dist/_internal/components/data-display/DataViews/data-views-sticky-head.js +21 -0
- package/dist/_internal/components/data-display/DataViews/data-views-sticky-head.js.map +1 -0
- package/dist/_internal/components/data-display/DataViews/data-views-toolbar.js +7 -6
- package/dist/_internal/components/data-display/DataViews/data-views-types.js +1 -1
- package/dist/_internal/components/data-display/DataViews/list-card-rails.js +3 -3
- package/dist/_internal/components/data-display/DataViews/use-data-views-state.js +3 -3
- package/dist/_internal/components/data-display/DataViews/use-saved-views-controller.js +2 -2
- package/dist/_internal/components/data-display/index.js +22 -22
- package/dist/_internal/components/feedback/StackedModal/StackedModal.js +3 -3
- package/dist/_internal/components/feedback/StackedModal/StackedModal.parts.js +2 -2
- package/dist/_internal/components/feedback/StackedModal/StackedModal.styles.js +1 -1
- package/dist/_internal/components/feedback/index.js +3 -3
- package/dist/_internal/components/index.js +33 -33
- package/dist/_internal/components/layout/SettingCard/SettingCard.js +6 -6
- package/dist/_internal/components/layout/SettingCard/SettingCard.parts.js +4 -4
- package/dist/_internal/components/layout/SettingCard/SettingCard.summary.js +5 -5
- package/dist/_internal/components/layout/SettingCard/SettingGrid.js +5 -5
- package/dist/_internal/components/layout/SettingCard/SettingGroup.js +7 -7
- package/dist/_internal/components/layout/SettingCard/SettingSwitch.js +6 -6
- package/dist/_internal/components/layout/SettingCard/SettingToggle.js +7 -7
- package/dist/_internal/components/layout/index.js +10 -10
- package/dist/_internal/components/navigation/Tabs/Tabs.js +1 -1
- package/dist/_internal/components/navigation/index.js +1 -1
- package/dist/_internal/user-avatar/user-avatar.js +5 -5
- package/dist/charts.js +11 -11
- package/dist/{chunk-35L5YMYQ.js → chunk-2QB4WIU5.js} +6 -6
- package/dist/{chunk-AAXLQFC7.js → chunk-3FIIMP7I.js} +2 -2
- package/dist/{chunk-6A6GZRXD.js → chunk-3VXS7O3X.js} +2 -2
- package/dist/chunk-4IE66GY2.js +89 -0
- package/dist/chunk-4IE66GY2.js.map +1 -0
- package/dist/{chunk-JYMXYSDP.js → chunk-5CAWRMDX.js} +2 -2
- package/dist/{chunk-647DEGIU.js → chunk-5WJFCQFN.js} +7 -7
- package/dist/{chunk-M6V7Y7CP.js → chunk-6CZC5S6O.js} +3 -3
- package/dist/chunk-6CZC5S6O.js.map +1 -0
- package/dist/{chunk-K6KBASL2.js → chunk-72L5C74V.js} +2 -2
- package/dist/chunk-AT6UKTH4.js +129 -0
- package/dist/chunk-AT6UKTH4.js.map +1 -0
- package/dist/{chunk-BI7YMVKZ.js → chunk-B2JSUFDX.js} +2 -2
- package/dist/{chunk-7J5JR33K.js → chunk-BBBHPK2Q.js} +2 -2
- package/dist/{chunk-UZ2CEJOO.js → chunk-CSJ7WNXU.js} +2 -2
- package/dist/{chunk-6QYKZMEE.js → chunk-CSLBRJ7N.js} +40 -25
- package/dist/chunk-CSLBRJ7N.js.map +1 -0
- package/dist/{chunk-LMIOWP6H.js → chunk-D34PZJH3.js} +2 -2
- package/dist/{chunk-HYQJJLBC.js → chunk-DHAXUVMR.js} +27 -3
- package/dist/chunk-DHAXUVMR.js.map +1 -0
- package/dist/{chunk-TKLPPAS5.js → chunk-E5GYHN4X.js} +4 -4
- package/dist/{chunk-KU6VHNRV.js → chunk-E5I776YW.js} +6 -2
- package/dist/{chunk-KU6VHNRV.js.map → chunk-E5I776YW.js.map} +1 -1
- package/dist/{chunk-SUZLGB5I.js → chunk-E6K2UZGR.js} +3 -3
- package/dist/{chunk-7XSCEHGA.js → chunk-EOQ6EKTS.js} +7 -7
- package/dist/{chunk-L7OWFJUU.js → chunk-EZAQIEYB.js} +40 -34
- package/dist/chunk-EZAQIEYB.js.map +1 -0
- package/dist/chunk-GCYGVWOI.js +59 -0
- package/dist/chunk-GCYGVWOI.js.map +1 -0
- package/dist/{chunk-AMLHEKSV.js → chunk-HI7JPDD6.js} +5 -5
- package/dist/{chunk-O2P2KTKN.js → chunk-HLYYB4O5.js} +1 -1
- package/dist/chunk-HLYYB4O5.js.map +1 -0
- package/dist/{chunk-SAJDNO43.js → chunk-IGMD6S76.js} +3 -3
- package/dist/{chunk-EZFQO77P.js → chunk-IPYV7BLH.js} +2 -2
- package/dist/{chunk-KARMRTTM.js → chunk-J2RUDZVJ.js} +7 -7
- package/dist/{chunk-HQCZT6TO.js → chunk-JVOEVTCZ.js} +5 -5
- package/dist/{chunk-VJB63DUM.js → chunk-K3PMMW23.js} +2 -2
- package/dist/{chunk-TNVO3EVF.js → chunk-KT3TF2LT.js} +5 -3
- package/dist/chunk-KT3TF2LT.js.map +1 -0
- package/dist/{chunk-6S3S2K7O.js → chunk-L7HKMTKR.js} +3 -3
- package/dist/chunk-L7HKMTKR.js.map +1 -0
- package/dist/{chunk-J6DYHBID.js → chunk-LIN4A2BW.js} +7 -7
- package/dist/{chunk-7JS2SPRW.js → chunk-LKRXLWCC.js} +3 -3
- package/dist/{chunk-FXZUVZON.js → chunk-LWZ2K225.js} +6 -6
- package/dist/{chunk-EWTSQTVR.js → chunk-NI67M453.js} +6 -5
- package/dist/chunk-NI67M453.js.map +1 -0
- package/dist/{chunk-MJ6EAND6.js → chunk-Q7BGMLCX.js} +2 -2
- package/dist/{chunk-6ATXOJVQ.js → chunk-QADTI63U.js} +4 -4
- package/dist/{chunk-CMLIWUBW.js → chunk-QPCHABOZ.js} +24 -1
- package/dist/chunk-QPCHABOZ.js.map +1 -0
- package/dist/{chunk-L6MGAPBX.js → chunk-RCZ4KL2H.js} +5 -3
- package/dist/chunk-RCZ4KL2H.js.map +1 -0
- package/dist/{chunk-YLSSQJZM.js → chunk-T7ZERP7A.js} +30 -2
- package/dist/chunk-T7ZERP7A.js.map +1 -0
- package/dist/{chunk-SB2SEGR6.js → chunk-TIM4PXWN.js} +3 -3
- package/dist/{chunk-Y7YKIIYS.js → chunk-TQXB2OHP.js} +28 -4
- package/dist/chunk-TQXB2OHP.js.map +1 -0
- package/dist/{chunk-KUFDUXYB.js → chunk-U6ODZJCH.js} +2 -2
- package/dist/{chunk-3WLS7Z7D.js → chunk-UMOHHWXY.js} +3 -3
- package/dist/{chunk-S4JXSC4D.js → chunk-V6SRBQMN.js} +5 -5
- package/dist/{chunk-JY5YINUH.js → chunk-WQ32YFM5.js} +15 -7
- package/dist/chunk-WQ32YFM5.js.map +1 -0
- package/dist/{chunk-ERA3AEWU.js → chunk-WTGIW7LX.js} +12 -3
- package/dist/chunk-WTGIW7LX.js.map +1 -0
- package/dist/{chunk-2VMIHFMX.js → chunk-WVIJFS5Y.js} +9 -4
- package/dist/chunk-WVIJFS5Y.js.map +1 -0
- package/dist/{chunk-375HTCF2.js → chunk-Y2CCXB7R.js} +18 -2
- package/dist/chunk-Y2CCXB7R.js.map +1 -0
- package/dist/{chunk-33XGC4YU.js → chunk-YEGZIYVM.js} +2 -2
- package/dist/{chunk-3PGY4UL4.js → chunk-YKQA4NPM.js} +37 -7
- package/dist/chunk-YKQA4NPM.js.map +1 -0
- package/dist/{chunk-XMVPNCYM.js → chunk-YQGVO3ZU.js} +3 -3
- package/dist/{chunk-OJFE5PK6.js → chunk-ZZO5MRMV.js} +2 -2
- package/dist/data-display/Avatar.js +4 -4
- package/dist/data-display/CardKit.js +7 -7
- package/dist/data-display/Carousel.js +2 -2
- package/dist/data-display/Chart.js +11 -11
- package/dist/data-display/Chip.js +3 -3
- package/dist/data-display/DataGrid.js +2 -2
- package/dist/data-display/DataViews.js +45 -42
- package/dist/feedback/StackedModal.js +3 -3
- package/dist/layout/SettingCard.js +10 -10
- package/dist/native/data-display/Chip.js +20 -1
- package/dist/native/data-display/Chip.js.map +1 -1
- package/dist/navigation/Tabs.js +1 -1
- package/dist/types/components/data-display/Chip/Chip.base.d.ts +5 -1
- package/dist/types/components/data-display/Chip/Chip.base.d.ts.map +1 -1
- package/dist/types/components/data-display/Chip/Chip.d.ts.map +1 -1
- package/dist/types/components/data-display/Chip/Chip.metrics.d.ts +4 -0
- package/dist/types/components/data-display/Chip/Chip.metrics.d.ts.map +1 -1
- package/dist/types/components/data-display/Chip/Chip.styles.d.ts +2 -7
- package/dist/types/components/data-display/Chip/Chip.styles.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/DataViewsGrid.d.ts +15 -1
- package/dist/types/components/data-display/DataViews/DataViewsGrid.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/DataViewsTableBase.d.ts +5 -1
- package/dist/types/components/data-display/DataViews/DataViewsTableBase.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-empty.d.ts +10 -0
- package/dist/types/components/data-display/DataViews/data-views-empty.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-grid-bodies.d.ts +2 -0
- package/dist/types/components/data-display/DataViews/data-views-grid-bodies.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-grid-parts.d.ts +5 -1
- package/dist/types/components/data-display/DataViews/data-views-grid-parts.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-inline-bar.d.ts +4 -1
- package/dist/types/components/data-display/DataViews/data-views-inline-bar.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-more-fields.d.ts +10 -1
- package/dist/types/components/data-display/DataViews/data-views-more-fields.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-more-filters.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-overflow-fields.d.ts +56 -0
- package/dist/types/components/data-display/DataViews/data-views-overflow-fields.d.ts.map +1 -0
- package/dist/types/components/data-display/DataViews/data-views-overflow.d.ts +7 -5
- package/dist/types/components/data-display/DataViews/data-views-overflow.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-quick-chip.d.ts +16 -0
- package/dist/types/components/data-display/DataViews/data-views-quick-chip.d.ts.map +1 -0
- package/dist/types/components/data-display/DataViews/data-views-quick-types.d.ts +33 -0
- package/dist/types/components/data-display/DataViews/data-views-quick-types.d.ts.map +1 -0
- package/dist/types/components/data-display/DataViews/data-views-range-types.d.ts +2 -0
- package/dist/types/components/data-display/DataViews/data-views-range-types.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-shell-toolbar.d.ts +11 -6
- package/dist/types/components/data-display/DataViews/data-views-shell-toolbar.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-sticky-head.d.ts +45 -0
- package/dist/types/components/data-display/DataViews/data-views-sticky-head.d.ts.map +1 -0
- package/dist/types/components/data-display/DataViews/data-views-toolbar.d.ts +6 -0
- package/dist/types/components/data-display/DataViews/data-views-toolbar.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/data-views-types.d.ts +7 -4
- package/dist/types/components/data-display/DataViews/data-views-types.d.ts.map +1 -1
- package/dist/types/components/data-display/DataViews/index.d.ts +1 -1
- package/dist/types/components/data-display/DataViews/index.d.ts.map +1 -1
- package/dist/types/components/feedback/StackedModal/StackedModal.d.ts.map +1 -1
- package/dist/types/components/feedback/StackedModal/StackedModal.styles.d.ts +2 -1
- package/dist/types/components/feedback/StackedModal/StackedModal.styles.d.ts.map +1 -1
- package/dist/types/components/feedback/StackedModal/StackedModal.types.d.ts +17 -0
- package/dist/types/components/feedback/StackedModal/StackedModal.types.d.ts.map +1 -1
- package/dist/types/components/feedback/StackedModal/index.d.ts +1 -1
- package/dist/types/components/feedback/StackedModal/index.d.ts.map +1 -1
- package/dist/types/components/navigation/Tabs/Tabs.d.ts.map +1 -1
- package/dist/types/components/navigation/Tabs/Tabs.types.d.ts +12 -0
- package/dist/types/components/navigation/Tabs/Tabs.types.d.ts.map +1 -1
- package/dist/types/components/navigation/Tabs/index.d.ts +1 -1
- package/dist/types/components/navigation/Tabs/index.d.ts.map +1 -1
- package/dist/types-native/components/data-display/Chip/Chip.base.d.ts +5 -1
- package/dist/types-native/components/data-display/Chip/Chip.base.d.ts.map +1 -1
- package/dist/types-native/components/data-display/Chip/Chip.look.native.d.ts.map +1 -1
- package/dist/types-native/components/data-display/Chip/Chip.metrics.d.ts +4 -0
- package/dist/types-native/components/data-display/Chip/Chip.metrics.d.ts.map +1 -1
- package/dist/user-avatar.js +5 -5
- package/package.json +1 -1
- package/src/components/data-display/Chip/Chip.base.ts +5 -1
- package/src/components/data-display/Chip/Chip.look.native.ts +22 -1
- package/src/components/data-display/Chip/Chip.metrics.ts +5 -0
- package/src/components/data-display/Chip/Chip.styles.tsx +38 -1
- package/src/components/data-display/Chip/Chip.tsx +6 -2
- package/src/components/data-display/Chip/chip.md +2 -2
- package/src/components/data-display/DataViews/DataViewsGrid.tsx +15 -0
- package/src/components/data-display/DataViews/DataViewsTableBase.tsx +5 -0
- package/src/components/data-display/DataViews/RESPONSIVE-BEHAVIOUR.md +50 -0
- package/src/components/data-display/DataViews/data-views-empty.tsx +25 -0
- package/src/components/data-display/DataViews/data-views-grid-bodies.tsx +11 -1
- package/src/components/data-display/DataViews/data-views-grid-parts.tsx +27 -15
- package/src/components/data-display/DataViews/data-views-inline-bar.tsx +24 -1
- package/src/components/data-display/DataViews/data-views-more-fields.tsx +34 -1
- package/src/components/data-display/DataViews/data-views-more-filters.tsx +20 -4
- package/src/components/data-display/DataViews/data-views-overflow-fields.ts +110 -0
- package/src/components/data-display/DataViews/data-views-overflow.ts +58 -36
- package/src/components/data-display/DataViews/data-views-quick-chip.tsx +143 -0
- package/src/components/data-display/DataViews/data-views-quick-types.ts +33 -0
- package/src/components/data-display/DataViews/data-views-range-types.ts +2 -0
- package/src/components/data-display/DataViews/data-views-shell-toolbar.tsx +31 -23
- package/src/components/data-display/DataViews/data-views-sticky-head.ts +132 -0
- package/src/components/data-display/DataViews/data-views-toolbar.tsx +9 -0
- package/src/components/data-display/DataViews/data-views-types.ts +7 -11
- package/src/components/data-display/DataViews/index.ts +1 -0
- package/src/components/feedback/StackedModal/StackedModal.md +1 -0
- package/src/components/feedback/StackedModal/StackedModal.styles.ts +53 -6
- package/src/components/feedback/StackedModal/StackedModal.tsx +2 -1
- package/src/components/feedback/StackedModal/StackedModal.types.ts +17 -0
- package/src/components/feedback/StackedModal/index.ts +1 -1
- package/src/components/navigation/Tabs/Tabs.md +1 -0
- package/src/components/navigation/Tabs/Tabs.tsx +30 -1
- package/src/components/navigation/Tabs/Tabs.types.ts +14 -0
- package/src/components/navigation/Tabs/index.ts +1 -1
- package/dist/chunk-2VMIHFMX.js.map +0 -1
- package/dist/chunk-375HTCF2.js.map +0 -1
- package/dist/chunk-3PGY4UL4.js.map +0 -1
- package/dist/chunk-6QYKZMEE.js.map +0 -1
- package/dist/chunk-6S3S2K7O.js.map +0 -1
- package/dist/chunk-CMLIWUBW.js.map +0 -1
- package/dist/chunk-ERA3AEWU.js.map +0 -1
- package/dist/chunk-EWTSQTVR.js.map +0 -1
- package/dist/chunk-HYQJJLBC.js.map +0 -1
- package/dist/chunk-JY5YINUH.js.map +0 -1
- package/dist/chunk-L6MGAPBX.js.map +0 -1
- package/dist/chunk-L7OWFJUU.js.map +0 -1
- package/dist/chunk-M6V7Y7CP.js.map +0 -1
- package/dist/chunk-O2P2KTKN.js.map +0 -1
- package/dist/chunk-TNVO3EVF.js.map +0 -1
- package/dist/chunk-Y7YKIIYS.js.map +0 -1
- package/dist/chunk-YLSSQJZM.js.map +0 -1
- /package/dist/{chunk-35L5YMYQ.js.map → chunk-2QB4WIU5.js.map} +0 -0
- /package/dist/{chunk-AAXLQFC7.js.map → chunk-3FIIMP7I.js.map} +0 -0
- /package/dist/{chunk-6A6GZRXD.js.map → chunk-3VXS7O3X.js.map} +0 -0
- /package/dist/{chunk-JYMXYSDP.js.map → chunk-5CAWRMDX.js.map} +0 -0
- /package/dist/{chunk-647DEGIU.js.map → chunk-5WJFCQFN.js.map} +0 -0
- /package/dist/{chunk-K6KBASL2.js.map → chunk-72L5C74V.js.map} +0 -0
- /package/dist/{chunk-BI7YMVKZ.js.map → chunk-B2JSUFDX.js.map} +0 -0
- /package/dist/{chunk-7J5JR33K.js.map → chunk-BBBHPK2Q.js.map} +0 -0
- /package/dist/{chunk-UZ2CEJOO.js.map → chunk-CSJ7WNXU.js.map} +0 -0
- /package/dist/{chunk-LMIOWP6H.js.map → chunk-D34PZJH3.js.map} +0 -0
- /package/dist/{chunk-TKLPPAS5.js.map → chunk-E5GYHN4X.js.map} +0 -0
- /package/dist/{chunk-SUZLGB5I.js.map → chunk-E6K2UZGR.js.map} +0 -0
- /package/dist/{chunk-7XSCEHGA.js.map → chunk-EOQ6EKTS.js.map} +0 -0
- /package/dist/{chunk-AMLHEKSV.js.map → chunk-HI7JPDD6.js.map} +0 -0
- /package/dist/{chunk-SAJDNO43.js.map → chunk-IGMD6S76.js.map} +0 -0
- /package/dist/{chunk-EZFQO77P.js.map → chunk-IPYV7BLH.js.map} +0 -0
- /package/dist/{chunk-KARMRTTM.js.map → chunk-J2RUDZVJ.js.map} +0 -0
- /package/dist/{chunk-HQCZT6TO.js.map → chunk-JVOEVTCZ.js.map} +0 -0
- /package/dist/{chunk-VJB63DUM.js.map → chunk-K3PMMW23.js.map} +0 -0
- /package/dist/{chunk-J6DYHBID.js.map → chunk-LIN4A2BW.js.map} +0 -0
- /package/dist/{chunk-7JS2SPRW.js.map → chunk-LKRXLWCC.js.map} +0 -0
- /package/dist/{chunk-FXZUVZON.js.map → chunk-LWZ2K225.js.map} +0 -0
- /package/dist/{chunk-MJ6EAND6.js.map → chunk-Q7BGMLCX.js.map} +0 -0
- /package/dist/{chunk-6ATXOJVQ.js.map → chunk-QADTI63U.js.map} +0 -0
- /package/dist/{chunk-SB2SEGR6.js.map → chunk-TIM4PXWN.js.map} +0 -0
- /package/dist/{chunk-KUFDUXYB.js.map → chunk-U6ODZJCH.js.map} +0 -0
- /package/dist/{chunk-3WLS7Z7D.js.map → chunk-UMOHHWXY.js.map} +0 -0
- /package/dist/{chunk-S4JXSC4D.js.map → chunk-V6SRBQMN.js.map} +0 -0
- /package/dist/{chunk-33XGC4YU.js.map → chunk-YEGZIYVM.js.map} +0 -0
- /package/dist/{chunk-XMVPNCYM.js.map → chunk-YQGVO3ZU.js.map} +0 -0
- /package/dist/{chunk-OJFE5PK6.js.map → chunk-ZZO5MRMV.js.map} +0 -0
|
@@ -10,7 +10,7 @@ import React from 'react';
|
|
|
10
10
|
|
|
11
11
|
import { CustomTabPanel } from './TabsPanel';
|
|
12
12
|
import { tabsRootStyles } from './Tabs.styles';
|
|
13
|
-
import type { TabItem, TabsProps } from './Tabs.types';
|
|
13
|
+
import type { TabCount, TabItem, TabsProps } from './Tabs.types';
|
|
14
14
|
import { rem, sxRem } from '../../../tokens/relative';
|
|
15
15
|
|
|
16
16
|
const StyledTabs = styled(MuiTabs, {
|
|
@@ -43,6 +43,30 @@ const BadgeWrapper = styled(Badge)(({ theme }) => ({
|
|
|
43
43
|
height: rem(theme, 16),
|
|
44
44
|
padding: 0 } }));
|
|
45
45
|
|
|
46
|
+
/** A tab's inline count pill, toned by what it asks for. */
|
|
47
|
+
const CountPill = styled('span', {
|
|
48
|
+
shouldForwardProp: (prop) => prop !== 'tone',
|
|
49
|
+
})<{ tone: NonNullable<TabCount['tone']> }>(({ theme, tone }) => {
|
|
50
|
+
const look = {
|
|
51
|
+
neutral: { backgroundColor: theme.palette.action.selected, color: theme.palette.text.secondary },
|
|
52
|
+
warning: { backgroundColor: alpha(theme.palette.warning.main, 0.16), color: theme.palette.warning.dark },
|
|
53
|
+
danger: { backgroundColor: theme.palette.error.main, color: theme.palette.error.contrastText },
|
|
54
|
+
}[tone];
|
|
55
|
+
return {
|
|
56
|
+
display: 'inline-flex',
|
|
57
|
+
alignItems: 'center',
|
|
58
|
+
justifyContent: 'center',
|
|
59
|
+
height: rem(theme, 20),
|
|
60
|
+
minWidth: rem(theme, 20),
|
|
61
|
+
padding: theme.spacing(0, 0.875),
|
|
62
|
+
borderRadius: rem(theme, 999),
|
|
63
|
+
fontSize: rem(theme, 11.5),
|
|
64
|
+
fontWeight: 600,
|
|
65
|
+
lineHeight: 1,
|
|
66
|
+
...look,
|
|
67
|
+
};
|
|
68
|
+
});
|
|
69
|
+
|
|
46
70
|
const TABS_DEFAULTS: Partial<TabsProps> = {
|
|
47
71
|
variant: 'default',
|
|
48
72
|
size: 'md',
|
|
@@ -154,6 +178,11 @@ const TabLabel: React.FC<{
|
|
|
154
178
|
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
|
|
155
179
|
{item.icon}
|
|
156
180
|
<span>{item.label}</span>
|
|
181
|
+
{item.count !== undefined && (
|
|
182
|
+
<CountPill tone={item.count.tone ?? 'neutral'} data-tone={item.count.tone ?? 'neutral'}>
|
|
183
|
+
{item.count.value}
|
|
184
|
+
</CountPill>
|
|
185
|
+
)}
|
|
157
186
|
{item.closable && (
|
|
158
187
|
<CloseButton
|
|
159
188
|
onClick={(e) => onClose(e, item.id)}
|
|
@@ -2,6 +2,13 @@ import type { ColorValue, SizeValue } from '../../../tokens/scales';
|
|
|
2
2
|
import type { TabsProps as MuiTabsProps } from '@mui/material/Tabs/index.js';
|
|
3
3
|
import type { ReactNode } from 'react';
|
|
4
4
|
|
|
5
|
+
/** A tab's inline count — see `TabItem.count`. */
|
|
6
|
+
export interface TabCount {
|
|
7
|
+
value: string | number;
|
|
8
|
+
/** `warning` asks for attention, `danger` for action; neutral otherwise. */
|
|
9
|
+
tone?: 'neutral' | 'warning' | 'danger';
|
|
10
|
+
}
|
|
11
|
+
|
|
5
12
|
export interface TabItem {
|
|
6
13
|
/**
|
|
7
14
|
* Unique identifier for the tab
|
|
@@ -32,6 +39,13 @@ export interface TabItem {
|
|
|
32
39
|
* Badge content to show on the tab
|
|
33
40
|
*/
|
|
34
41
|
badge?: string | number;
|
|
42
|
+
|
|
43
|
+
/**
|
|
44
|
+
* A count said INSIDE the tab, after its label, as a small pill: how many
|
|
45
|
+
* lines, events or charges the pane holds. `tone` marks one that asks for
|
|
46
|
+
* action. Unlike `badge` it never floats over the label.
|
|
47
|
+
*/
|
|
48
|
+
count?: TabCount;
|
|
35
49
|
|
|
36
50
|
/**
|
|
37
51
|
* Custom className for the tab
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { Tabs } from './Tabs';
|
|
2
|
-
export type { TabItem, TabPanelProps,TabsProps } from './Tabs.types';
|
|
2
|
+
export type { TabCount, TabItem, TabPanelProps, TabsProps } from './Tabs.types';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-toolbar.tsx"],"sourcesContent":["\"use client\";\n\nimport Divider from \"@mui/material/Divider/index.js\";\n\nimport {\n ContentToolbar,\n FilterTrigger,\n type ColumnVisibilityOption,\n type SortFieldDefinition,\n} from \"../../layout/ContentToolbar\";\nimport { Box } from \"../../../mui/Box\";\nimport { Text } from \"../../typography/Text\";\n\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { DataViewsDisplayPanel, type DisplayPanelView } from \"./data-views-display-panel\";\nimport { DataViewsExportMenu, type DataViewExport } from \"./data-views-export\";\nimport { renderBulkActions } from \"./data-views-grid-helpers\";\nimport type { RowAction } from \"./data-views-types\";\nimport type { DataViewsController } from \"./use-data-views-state\";\nimport { sxRem } from \"../../../tokens/relative\";\n\nexport interface GridToolbarProps<T extends Record<string, unknown>> {\n testIdPrefix: string;\n selectedRows: T[];\n selectAll: () => void;\n clearSelection: () => void;\n rowActions?: RowAction<T>[];\n bulkActions?: (selectedRows: T[], clearSelection: () => void) => React.ReactNode;\n /** A control between the count and the actions menu — see `selectionExtra`. */\n selectionExtra?: React.ReactNode;\n /** Every row on the page is ticked: the select-all box reads checked, else partial. */\n allOnPageSelected?: boolean;\n sortFields: SortFieldDefinition[];\n activeSortField: string;\n activeSortOrder: \"asc\" | \"desc\";\n onChangeSort: (field: string, order: \"asc\" | \"desc\") => void;\n matchedCount: number;\n totalCount: number;\n toolbarRightSlot?: React.ReactNode;\n columnOptions: ColumnVisibilityOption[];\n onToggleColumn: (id: string, visible: boolean) => void;\n filterOpen: boolean;\n setFilterOpen: (open: boolean) => void;\n activeFilterCount: number;\n /** Hide the \"Filtros\" slide-in trigger (compact layout shows filters inline). */\n showFilterTrigger?: boolean;\n /**\n * Search + filter controls, rendered ON the toolbar line rather than on a row\n * beneath it. Absent ⇒ the toolbar keeps its plain two-cluster shape.\n */\n filterControls?: React.ReactNode;\n /** Measures the toolbar ROW for the filter overflow — see `useFilterOverflow`. */\n barRef?: React.Ref<HTMLDivElement>;\n /** The controller, so \"Exibir\" can drive sort, columns, order and format. */\n c: DataViewsController<T>;\n /** Per-sort-field value kind, so directions read in the column's own terms. */\n sortKinds?: Record<string, string>;\n /** The saved-view chrome bracketing the Exibir panel, when the host has views. */\n displayView?: DisplayPanelView;\n /** Injected export. Absent ⇒ no Exportar control. */\n exportConfig?: DataViewExport;\n /**\n * Step 2 of the degradation ladder: Exibir/Exportar as icons only.\n * MEASURED upstream (see `useFilterOverflow`) rather than switched at a\n * breakpoint, so a two-filter page keeps its labels where a five-filter one\n * has already given them up.\n */\n compactControls?: boolean;\n /**\n * Step 5 of the ladder, and its floor: on a screen too narrow for even the\n * fully-collapsed row, the counter is dropped so the controls still fit one\n * line instead of spilling outside the toolbar.\n */\n counterHidden?: boolean;\n}\n\n/** The right-aligned toolbar controls: Sort By, the counter, zoom/layout/columns, filters. */\nfunction ToolbarRightControls<T extends Record<string, unknown>>(props: GridToolbarProps<T>): React.JSX.Element {\n const { testIdPrefix, matchedCount, totalCount, filterOpen, setFilterOpen } = props;\n return (\n <>\n {/* MEASURED, never breakpointed: `RESERVED.counter` prices it into the\n ladder, so hiding it at `md` was the ladder and a breakpoint\n disagreeing about the same pixels — which broke the row at exactly\n 900px. It is dropped only as the ladder's last rung. */}\n {!props.counterHidden && (\n <>\n <Text variant=\"caption\" as=\"span\">\n <Box\n component=\"span\"\n data-testid={`${testIdPrefix}-counter`}\n sx={{ whiteSpace: \"nowrap\" }}\n >\n {matchedCount} de {totalCount}\n </Box>\n </Text>\n {/* Divides the READING of the list from the controls that change it —\n the counter states what is on screen, everything right of here\n acts on it. */}\n <Divider\n orientation=\"vertical\"\n flexItem\n sx={{ height: sxRem(20), alignSelf: \"center\", mx: 0.5 }}\n />\n </>\n )}\n {props.toolbarRightSlot}\n {/* Sort + columns + format, in ONE control — see DataViewsDisplayPanel. */}\n <DataViewsDisplayPanel\n c={props.c}\n testIdPrefix={testIdPrefix}\n sortKinds={props.sortKinds}\n view={props.displayView}\n compact={props.compactControls}\n />\n {props.exportConfig && (\n <DataViewsExportMenu\n config={props.exportConfig}\n query={props.c.currentQuery}\n totalCount={props.totalCount}\n selectedIds={[...props.c.selectedIds]}\n columns={props.columnOptions.filter((col) => col.visible).map((col) => ({ id: col.id, label: col.label }))}\n testIdPrefix={testIdPrefix}\n compact={props.compactControls}\n />\n )}\n {props.showFilterTrigger !== false && (\n <FilterTrigger\n open={filterOpen}\n onOpenChange={setFilterOpen}\n activeCount={props.activeFilterCount}\n data-testid={`${testIdPrefix}-filters-toggle`}\n />\n )}\n </>\n );\n}\n\n/**\n * The bordered toolbar band: selection chrome + Sort By, the result counter, the\n * saved-views slot, and the filter funnel. The negative margin lets the top/bottom\n * separators reach the sidebar's vertical line and the window edge.\n */\nexport function GridToolbar<T extends Record<string, unknown>>(props: GridToolbarProps<T>): React.JSX.Element {\n const copy = useDataViewsCopy();\n const { testIdPrefix, selectedRows } = props;\n return (\n <Box\n ref={props.barRef}\n sx={{\n borderTop: 1,\n borderBottom: 1,\n borderColor: \"divider\",\n py: 1.25,\n mx: { xs: -2, md: -3 },\n px: { xs: 2, md: 3 },\n }}\n >\n <ContentToolbar\n selectAllLabel={copy.selection.selectAll}\n selectAllText={copy.selection.selectAllOnPage}\n clearAllText={copy.filters.clearAll}\n hasSelection={selectedRows.length > 0}\n selectedCount={selectedRows.length}\n selectedCountLabel={copy.selection.selectedCount}\n selectAll={props.selectAll}\n clearSelection={props.clearSelection}\n selectAllTestId={`${testIdPrefix}-select-all`}\n clearAllTestId={`${testIdPrefix}-clear-all`}\n selectionExtra={props.selectionExtra}\n allSelected={props.allOnPageSelected}\n actions={renderBulkActions({\n rowActions: props.rowActions,\n bulkActions: props.bulkActions,\n selectedRows,\n clearSelection: props.clearSelection,\n testIdPrefix,\n })}\n leadingControls={props.filterControls}\n // Selection takes the whole line: no Select All while browsing, and no\n // search/filters/Exibir/Exportar once a row is ticked.\n exclusiveSelection\n rightControls={<ToolbarRightControls {...props} />}\n />\n </Box>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAO,aAAa;AAoFZ,mBACE,KACE,YAFJ;AATR,SAAS,qBAAwD,OAA+C;AAC9G,QAAM,EAAE,cAAc,cAAc,YAAY,YAAY,cAAc,IAAI;AAC9E,SACE,iCAKG;AAAA,KAAC,MAAM,iBACN,iCACE;AAAA,0BAAC,QAAK,SAAQ,WAAU,IAAG,QACzB;AAAA,QAACA;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,eAAa,GAAG,YAAY;AAAA,UAC5B,IAAI,EAAE,YAAY,SAAS;AAAA,UAE1B;AAAA;AAAA,YAAa;AAAA,YAAK;AAAA;AAAA;AAAA,MACrB,GACF;AAAA,MAIA;AAAA,QAAC;AAAA;AAAA,UACC,aAAY;AAAA,UACZ,UAAQ;AAAA,UACR,IAAI,EAAE,QAAQ,MAAM,EAAE,GAAG,WAAW,UAAU,IAAI,IAAI;AAAA;AAAA,MACxD;AAAA,OACF;AAAA,IAED,MAAM;AAAA,IAEP;AAAA,MAAC;AAAA;AAAA,QACC,GAAG,MAAM;AAAA,QACT;AAAA,QACA,WAAW,MAAM;AAAA,QACjB,MAAM,MAAM;AAAA,QACZ,SAAS,MAAM;AAAA;AAAA,IACjB;AAAA,IACC,MAAM,gBACL;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,MAAM;AAAA,QACd,OAAO,MAAM,EAAE;AAAA,QACf,YAAY,MAAM;AAAA,QAClB,aAAa,CAAC,GAAG,MAAM,EAAE,WAAW;AAAA,QACpC,SAAS,MAAM,cAAc,OAAO,CAAC,QAAQ,IAAI,OAAO,EAAE,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,IAAI,OAAO,IAAI,MAAM,EAAE;AAAA,QACzG;AAAA,QACA,SAAS,MAAM;AAAA;AAAA,IACjB;AAAA,IAED,MAAM,sBAAsB,SAC3B;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,cAAc;AAAA,QACd,aAAa,MAAM;AAAA,QACnB,eAAa,GAAG,YAAY;AAAA;AAAA,IAC9B;AAAA,KAEJ;AAEJ;AAOO,SAAS,YAA+C,OAA+C;AAC5G,QAAM,OAAO,iBAAiB;AAC9B,QAAM,EAAE,cAAc,aAAa,IAAI;AACvC,SACE;AAAA,IAACA;AAAA,IAAA;AAAA,MACC,KAAK,MAAM;AAAA,MACX,IAAI;AAAA,QACF,WAAW;AAAA,QACX,cAAc;AAAA,QACd,aAAa;AAAA,QACb,IAAI;AAAA,QACJ,IAAI,EAAE,IAAI,IAAI,IAAI,GAAG;AAAA,QACrB,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE;AAAA,MACrB;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,gBAAgB,KAAK,UAAU;AAAA,UAC/B,eAAe,KAAK,UAAU;AAAA,UAC9B,cAAc,KAAK,QAAQ;AAAA,UAC3B,cAAc,aAAa,SAAS;AAAA,UACpC,eAAe,aAAa;AAAA,UAC5B,oBAAoB,KAAK,UAAU;AAAA,UACnC,WAAW,MAAM;AAAA,UACjB,gBAAgB,MAAM;AAAA,UACtB,iBAAiB,GAAG,YAAY;AAAA,UAChC,gBAAgB,GAAG,YAAY;AAAA,UAC/B,gBAAgB,MAAM;AAAA,UACtB,aAAa,MAAM;AAAA,UACnB,SAAS,kBAAkB;AAAA,YACzB,YAAY,MAAM;AAAA,YAClB,aAAa,MAAM;AAAA,YACnB;AAAA,YACA,gBAAgB,MAAM;AAAA,YACtB;AAAA,UACF,CAAC;AAAA,UACD,iBAAiB,MAAM;AAAA,UAGvB,oBAAkB;AAAA,UAClB,eAAe,oBAAC,wBAAsB,GAAG,OAAO;AAAA;AAAA,MAClD;AAAA;AAAA,EACF;AAEJ;","names":["default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-empty.tsx"],"sourcesContent":["\"use client\";\n\nimport FilterAltOffRoundedIcon from \"@mui/icons-material/FilterAltOffRounded\";\nimport InboxRoundedIcon from \"@mui/icons-material/InboxRounded\";\n\nimport { Button } from \"../../form/Button\";\nimport { Box } from \"../../../mui/Box\";\nimport { sxRem } from \"../../../tokens/relative\";\nimport { Text } from \"../../typography/Text\";\n\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\n\n/**\n * TWO EMPTY STATES, NOT ONE.\n *\n * \"Nenhum pagamento registrado\" under an active filter is a lie, and it is the\n * expensive kind: the operator reads it as \"this store has no payments\" and\n * goes looking for the bug somewhere else. The page's own empty copy answers\n * \"there is nothing here yet\"; it cannot answer \"nothing matches what you\n * typed\", because it does not know what was typed.\n *\n * So the grid renders the FILTERED variant itself — it is the only party that\n * knows a filter is applied — and defers to the host's `emptyState` only when\n * the list is genuinely empty. The filtered one carries the way out, which is\n * the whole point: the fix is one click, and it is right there.\n */\nexport function DataViewsEmpty({\n filtered,\n onClearFilters,\n emptyState,\n testIdPrefix,\n}: {\n /** Is anything narrowing the list right now (search, pills or ranges)? */\n filtered: boolean;\n onClearFilters: () => void;\n /** The page's own copy for a genuinely empty list. */\n emptyState?: React.ReactNode;\n testIdPrefix: string;\n}): React.JSX.Element {\n const copy = useDataViewsCopy();\n const Icon = filtered ? FilterAltOffRoundedIcon : InboxRoundedIcon;\n return (\n <Box\n data-testid={`${testIdPrefix}-empty${filtered ? \"-filtered\" : \"\"}`}\n sx={{\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n textAlign: \"center\",\n py: 8,\n px: 2,\n }}\n >\n <Box\n sx={{\n display: \"inline-flex\",\n p: 2,\n mb: 1.5,\n borderRadius: \"50%\",\n bgcolor: \"action.hover\",\n color: \"text.disabled\",\n }}\n >\n <Icon />\n </Box>\n {filtered ? (\n <>\n <Text variant=\"body\" as=\"p\">\n <Box component=\"span\" sx={{ fontWeight: 600 }}>\n {copy.grid.emptyFilteredTitle}\n </Box>\n </Text>\n <Text variant=\"caption\" as=\"p\">\n <Box component=\"span\" sx={{ display: \"block\", mt: 0.5, mb: 2, color: \"text.secondary\", maxWidth: sxRem(380) }}>\n {copy.grid.emptyFilteredHint}\n </Box>\n </Text>\n <Button\n variant=\"outline\"\n size=\"sm\"\n color=\"secondary\"\n onClick={onClearFilters}\n dataTestId={`${testIdPrefix}-empty-clear`}\n >\n {copy.grid.emptyFilteredAction}\n </Button>\n </>\n ) : (\n // The page's own words for \"nothing here yet\" — it knows what the\n // entity is and how one comes to exist; this component does not.\n emptyState\n )}\n </Box>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAEA,OAAO,6BAA6B;AACpC,OAAO,sBAAsB;AA4DrB,SAGA,UAHA,KAGA,YAHA;AArCD,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAOsB;AACpB,QAAM,OAAO,iBAAiB;AAC9B,QAAM,OAAO,WAAW,0BAA0B;AAClD,SACE;AAAA,IAACA;AAAA,IAAA;AAAA,MACC,eAAa,GAAG,YAAY,SAAS,WAAW,cAAc,EAAE;AAAA,MAChE,IAAI;AAAA,QACF,SAAS;AAAA,QACT,eAAe;AAAA,QACf,YAAY;AAAA,QACZ,WAAW;AAAA,QACX,IAAI;AAAA,QACJ,IAAI;AAAA,MACN;AAAA,MAEA;AAAA;AAAA,UAACA;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,SAAS;AAAA,cACT,GAAG;AAAA,cACH,IAAI;AAAA,cACJ,cAAc;AAAA,cACd,SAAS;AAAA,cACT,OAAO;AAAA,YACT;AAAA,YAEA,8BAAC,QAAK;AAAA;AAAA,QACR;AAAA,QACC,WACC,iCACE;AAAA,8BAAC,QAAK,SAAQ,QAAO,IAAG,KACtB,8BAACA,UAAA,EAAI,WAAU,QAAO,IAAI,EAAE,YAAY,IAAI,GACzC,eAAK,KAAK,oBACb,GACF;AAAA,UACA,oBAAC,QAAK,SAAQ,WAAU,IAAG,KACzB,8BAACA,UAAA,EAAI,WAAU,QAAO,IAAI,EAAE,SAAS,SAAS,IAAI,KAAK,IAAI,GAAG,OAAO,kBAAkB,UAAU,MAAM,GAAG,EAAE,GACzG,eAAK,KAAK,mBACb,GACF;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,OAAM;AAAA,cACN,SAAS;AAAA,cACT,YAAY,GAAG,YAAY;AAAA,cAE1B,eAAK,KAAK;AAAA;AAAA,UACb;AAAA,WACF;AAAA;AAAA;AAAA,UAIA;AAAA;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":["default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/feedback/StackedModal/StackedModal.styles.ts"],"sourcesContent":["import { alpha } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\nimport { scrim } from '../../../tokens/ink';\nimport { rem } from '../../../tokens/relative';\nimport { dynamicViewportHeight } from '../../../utils/viewport';\nimport type { ModalPanelRole, PanelMaxWidth, PanelSize } from './StackedModal.types';\n\n/** Props that drive the panel's look but must not reach the DOM. */\nexport interface PanelStyleProps {\n modalRole?: ModalPanelRole;\n isAnimating?: boolean;\n glass?: boolean;\n rtl?: boolean;\n customMaxWidth?: PanelMaxWidth;\n panelSize?: PanelSize;\n}\n\n/** Style-only props, filtered out before they can land on a DOM node. */\nexport const STYLE_ONLY_PROPS = ['modalRole', 'isAnimating', 'glass', 'rtl', 'customMaxWidth', 'panelSize'];\n\n/** MUI breakpoint names mapped to the pixel width they cap the panel at. */\nconst MAX_WIDTH_PX: Record<Exclude<PanelMaxWidth, false>, number> = {\n xs: 444,\n sm: 600,\n md: 960,\n lg: 1280,\n xl: 1920,\n};\n\n/** The scrim's opacity behind each receding panel role. */\nconst BACKDROP_ALPHA_BY_ROLE: Partial<Record<ModalPanelRole, number>> = {\n secondary: 0.3,\n background: 0.1,\n};\n\nconst ANIMATION_BY_ROLE: Partial<Record<ModalPanelRole, string>> = {\n secondary: 'expandModal 300ms ease-in-out forwards',\n primary: 'contractModal 300ms ease-in-out forwards',\n};\n\n/** A wide panel settles at 90vw, so its keyframes must end there too, or it snaps. */\nconst WIDE_ANIMATION_BY_ROLE: Partial<Record<ModalPanelRole, string>> = {\n secondary: 'expandModalWide 300ms ease-in-out forwards',\n primary: 'contractModalWide 300ms ease-in-out forwards',\n};\n\n// Animation endpoints use the common lg width (60vw); the role styles set the\n// exact per-breakpoint width once the animation settles.\nconst KEYFRAMES: CSSObject = {\n '@keyframes expandModal': {\n from: { width: '60vw', transform: 'translateX(0)' },\n to: { width: '100vw', transform: 'translateX(0)' },\n },\n '@keyframes contractModal': {\n from: { width: '100vw', transform: 'translateX(0)' },\n to: { width: '60vw', transform: 'translateX(0)' },\n },\n '@keyframes expandModalWide': {\n from: { width: '90vw', transform: 'translateX(0)' },\n to: { width: '100vw', transform: 'translateX(0)' },\n },\n '@keyframes contractModalWide': {\n from: { width: '100vw', transform: 'translateX(0)' },\n to: { width: '90vw', transform: 'translateX(0)' },\n },\n};\n\nconst cap = (customMaxWidth?: PanelMaxWidth): number | null =>\n customMaxWidth ? MAX_WIDTH_PX[customMaxWidth] : null;\n\n/** One breakpoint's width: the viewport share, held under the optional px cap. */\nconst panelWidth = (theme: Theme, share: string, capPx: number | null): CSSObject =>\n capPx\n ? { width: `min(${share}, ${rem(theme, capPx)})`, maxWidth: rem(theme, capPx) }\n : { width: share, maxWidth: share };\n\nconst backdropStyles = (theme: Theme, modalRole?: ModalPanelRole): CSSObject => ({\n backgroundColor: scrim(theme, (modalRole && BACKDROP_ALPHA_BY_ROLE[modalRole]) ?? 0.5),\n backdropFilter: modalRole === 'primary' ? `blur(${rem(theme, 4)})` : 'none',\n});\n\n/**\n * The top panel is viewport-aware and narrows as the screen grows: full width on\n * mobile, 80vw on tablet/small desktop, 60vw on regular desktops (lg up —\n * including ~1080p/1440p/1080-wide), and 40vw only on ultra-wide screens\n * (≥2200px) so the receding panel stays visible on huge monitors. A `maxWidth`\n * prop, when given, caps it further.\n */\nconst primaryPanelStyles = (theme: Theme, capPx: number | null): CSSObject => ({\n [theme.breakpoints.down('sm')]: panelWidth(theme, '100%', capPx),\n [theme.breakpoints.between('sm', 'lg')]: panelWidth(theme, '80vw', capPx),\n [theme.breakpoints.up('lg')]: panelWidth(theme, '60vw', capPx),\n // A viewport width, in the theme's breakpoint unit like the three above.\n [theme.breakpoints.up(2200)]: panelWidth(theme, '40vw', capPx),\n});\n\n/**\n * `size=\"wide\"`: 90vw up to `xl`, 75vw above it, 60vw on ultra-wide screens.\n * At 1280 that is ~1150px instead of 768px — room for a form column beside a\n * fixed ~350px sidebar — while a sliver of the page behind stays visible.\n */\nconst widePrimaryPanelStyles = (theme: Theme, capPx: number | null): CSSObject => ({\n [theme.breakpoints.down('sm')]: panelWidth(theme, '100%', capPx),\n [theme.breakpoints.between('sm', 'xl')]: panelWidth(theme, '90vw', capPx),\n [theme.breakpoints.up('xl')]: panelWidth(theme, '75vw', capPx),\n [theme.breakpoints.up(2200)]: panelWidth(theme, '60vw', capPx),\n});\n\n/** Panels below the top one expand to full width, producing the GTM stacking effect. */\nconst secondaryPanelStyles = (): CSSObject => ({\n width: '100vw !important',\n maxWidth: '100vw !important',\n right: '0 !important',\n top: '0 !important',\n ...dynamicViewportHeight('height', 'maxHeight'),\n borderRadius: '0 !important',\n opacity: 0.95,\n transform: 'scale(1)',\n});\n\nconst rolePanelStyles = (\n theme: Theme,\n role: ModalPanelRole | undefined,\n capPx: number | null,\n size?: PanelSize,\n): CSSObject => {\n if (role === 'primary') {\n return size === 'wide' ? widePrimaryPanelStyles(theme, capPx) : primaryPanelStyles(theme, capPx);\n }\n if (role === 'secondary') return secondaryPanelStyles();\n // Background modals stay mounted but hidden, for performance.\n if (role === 'background') return { display: 'none' };\n return {};\n};\n\nconst glassStyles = (theme: Theme, glass?: boolean, role?: ModalPanelRole): CSSObject =>\n glass && role === 'primary'\n ? {\n backgroundColor: alpha(theme.palette.background.paper, 0.85),\n backdropFilter: `blur(${rem(theme, 10)})`,\n WebkitBackdropFilter: `blur(${rem(theme, 10)})`,\n border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,\n }\n : {};\n\nconst animationStyles = (isAnimating?: boolean, role?: ModalPanelRole, size?: PanelSize): CSSObject => {\n const byRole = size === 'wide' ? WIDE_ANIMATION_BY_ROLE : ANIMATION_BY_ROLE;\n return isAnimating ? { animation: (role && byRole[role]) ?? 'none' } : {};\n};\n\nconst panelBaseStyles = (theme: Theme): CSSObject => ({\n margin: 0,\n position: 'fixed',\n right: 0,\n top: 0,\n // Pinned to the DYNAMIC viewport: on iOS a `100vh` panel runs underneath the\n // browser toolbar, which parks the tail of the scroll area (the submit row)\n // out of reach. See `dynamicViewportHeight`.\n ...dynamicViewportHeight('height', 'maxHeight'),\n borderRadius: 0,\n willChange: 'transform, width, border-radius',\n transition: theme.transitions.create(\n ['width', 'max-width', 'border-radius', 'transform', 'opacity'],\n { duration: 300, easing: theme.transitions.easing.easeInOut },\n ),\n});\n\nconst panelStyles = (theme: Theme, props: PanelStyleProps): CSSObject => {\n const capPx = cap(props.customMaxWidth);\n return {\n ...panelBaseStyles(theme),\n ...rolePanelStyles(theme, props.modalRole, capPx, props.panelSize),\n ...glassStyles(theme, props.glass, props.modalRole),\n ...animationStyles(props.isAnimating, props.modalRole, props.panelSize),\n };\n};\n\n/** The full rule set for the sliding panel's Dialog root. */\nexport const dialogRootStyles = (theme: Theme, props: PanelStyleProps): CSSObject => ({\n direction: props.rtl ? 'rtl' : 'ltr',\n // The dialog's OWN backdrop only: a descendant selector also reached the\n // backdrop of any sheet or drawer rendered inside the panel, and blurred the\n // very panel that sheet sits on.\n '& > .MuiBackdrop-root': backdropStyles(theme, props.modalRole),\n '& .MuiDialog-container': { alignItems: 'flex-start', justifyContent: 'flex-end' },\n '& .MuiDialog-paper': panelStyles(theme, props),\n ...KEYFRAMES,\n});\n\nexport const titleStyles = (theme: Theme, rtl?: boolean): CSSObject => ({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n padding: theme.spacing(2, 2.5),\n borderBottom: `1px solid ${theme.palette.divider}`,\n direction: rtl ? 'rtl' : 'ltr',\n});\n\nexport const titleLeftStyles = (theme: Theme): CSSObject => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(1.5),\n flex: 1,\n});\n\nexport const titleRightStyles = (theme: Theme): CSSObject => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(1),\n});\n\nexport const loadingOverlayStyles = (theme: Theme): CSSObject => ({\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: alpha(theme.palette.background.paper, 0.8),\n zIndex: 9999,\n});\n\nexport const modalContentStyles = (theme: Theme): CSSObject => ({\n padding: theme.spacing(3),\n // MUI's DialogContent defaults to `overflow-y: auto`, but inside a panel it is\n // NOT the element that scrolls — ModalBody above it is, and this box always\n // ends up exactly as tall as its own content. A scroll container that never\n // scrolls is still the containing block for every `position: sticky`\n // descendant, so a sticky header anchored here gets zero travel and rides the\n // content out of view: sticky, and pinned to nothing. Handing the overflow\n // back to ModalBody makes the panel's own scroller the anchor.\n overflowY: 'visible',\n});\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-overflow.ts"],"sourcesContent":["\"use client\";\n\nimport { useTheme, type Theme } from \"@mui/material/styles/index.js\";\nimport { useRef } from \"react\";\n\nimport { remPx } from \"../../../tokens/relative\";\nimport { splitToFit, useMeasuredWidth } from \"../../utility/Overflow\";\nimport {\n estimateWidth,\n furnitureCost,\n isRangeSet,\n pillText,\n pricesFor,\n RESERVED,\n rightClusterCost,\n type Prices,\n} from \"./data-views-overflow-costs\";\nimport type { FilterFieldConfig, RangeFieldConfig, RangeValue } from \"./data-views-types\";\n\n/**\n * PROGRESSIVE COLLAPSE — which filter controls fit on the toolbar, measured.\n *\n * Two rules, and both come from watching the all-or-nothing version fail:\n *\n * 1. Controls shed ONE AT A TIME into an overflow, never all at once. With four\n * filters and room for three, hiding all four throws away the room that was\n * there.\n * 2. An APPLIED filter is ranked first, not exempt. Applied controls take the\n * visible slots ahead of idle ones, and go into \"Mais\" like anything else\n * when even those slots run out. Exempting them outright — the earlier rule\n * — meant four applied filters on a phone claimed more width than the row\n * had, and the bar painted past its own edge: the pills were reachable only\n * by scrolling the toolbar sideways. Hiding one is safe because \"Mais\" says\n * how many applied filters are behind it; scrolling one off-screen says\n * nothing at all.\n *\n * It MEASURES rather than picking a breakpoint, which is what\n * `FILTERS-CONTRACT.md` asks for: pages declare different numbers of filters\n * with different label lengths, and the same page collapses at a different\n * width in another language. A shared breakpoint is wrong for at least one\n * table by construction.\n *\n * Collapsing is presentation only — nothing here emits a query, drops a filter\n * or changes a rendered row.\n */\n\n/** A filter control on the bar: a multi-select pill or a min/max range. */\nexport interface OverflowField<T extends Record<string, unknown>> {\n id: string;\n label: string;\n /** Which control it is — the caller renders the right one. */\n group: \"pill\" | \"range\";\n pill?: FilterFieldConfig<T>;\n range?: RangeFieldConfig<T>;\n}\n\n/** What the caller renders inline, and what goes behind \"Mais\". */\nexport interface OverflowSplit<T extends Record<string, unknown>> {\n inline: OverflowField<T>[];\n overflow: OverflowField<T>[];\n /**\n * Step 2 — Exibir/Exportar drop their text labels and become icons.\n * Cheap: both keep their icon, their tooltip and their position.\n */\n compactControls: boolean;\n /**\n * Step 5, and the LAST resort — the \"N de N\" counter is dropped.\n *\n * Only once every control has already collapsed and the row STILL does not\n * fit, which on a six-filter table is below about 400px. The counter goes\n * last because it is the only thing left that reports rather than does: an\n * operator can act without knowing the total, but not without the search.\n */\n counterHidden: boolean;\n /**\n * Step 4 — the search collapses to a magnifier that expands on click.\n * The most expensive step, so it is taken last: the search is the one\n * control on the bar that cannot be guessed from an icon's position.\n */\n searchCollapsed: boolean;\n /**\n * Step 6, below even the counter — \"Limpar\" leaves the bar.\n *\n * The one control here with a second home: the overflow panel's footer\n * carries \"Limpar todos os filtros\". So it goes before the search icon or\n * \"Mais\", neither of which has anywhere else to be.\n */\n clearAllHidden: boolean;\n /**\n * Expanding the magnifier must take the whole cluster, filters and all.\n *\n * Only on the rungs where what is left over would be too narrow to read —\n * on a large phone the box simply shrinks and the filters stay, which is why\n * this is its own answer rather than `searchCollapsed` reused.\n */\n searchTakeover: boolean;\n /** Attach to the toolbar row being measured. */\n barRef: React.RefObject<HTMLDivElement | null>;\n}\n\n/** Every declared control, pills first, in the order the bar renders them. */\nexport function toOverflowFields<T extends Record<string, unknown>>(\n fields: FilterFieldConfig<T>[],\n rangeFields: RangeFieldConfig<T>[],\n): OverflowField<T>[] {\n return [\n ...fields.map((pill) => ({ id: pill.id, label: pill.label, group: \"pill\" as const, pill })),\n ...rangeFields.map((range) => ({ id: range.id, label: range.label, group: \"range\" as const, range })),\n ];\n}\n\n\n/** Is this control carrying a value the operator set? */\nfunction isActiveField<T extends Record<string, unknown>>(\n field: OverflowField<T>,\n pills: Record<string, string[]>,\n ranges: Record<string, RangeValue>,\n): boolean {\n return field.group === \"pill\"\n ? (pills[field.id]?.length ?? 0) > 0\n : isRangeSet(ranges[field.id]);\n}\n\n/** Estimated rendered width of one control at its CURRENT value, in px at `theme`'s scale. */\nfunction fieldWidth<T extends Record<string, unknown>>(\n theme: Theme,\n field: OverflowField<T>,\n pills: Record<string, string[]>,\n ranges: Record<string, RangeValue>,\n): number {\n if (field.group === \"pill\") return estimateWidth(theme, pillText(field, pills[field.id] ?? []), 0);\n // A bounded range renders two number inputs (100 design px) beside its label.\n return estimateWidth(theme, field.label, isRangeSet(ranges[field.id]) ? 100 : 0);\n}\n\n/** What one split costs on the bar, so the ladder below can price the next step. */\ntype Split<T extends Record<string, unknown>> = {\n inline: OverflowField<T>[];\n overflow: OverflowField<T>[];\n /** Width the surviving inline controls occupy, incl. the \"Mais\" button. */\n used: number;\n};\n\n/** Step 1 — shed filter controls into the overflow. Pure. */\nfunction splitFilters<T extends Record<string, unknown>>(\n all: OverflowField<T>[],\n pills: Record<string, string[]>,\n ranges: Record<string, RangeValue>,\n width: number,\n /** Search + counter + right cluster + chrome, at the rung being considered. */\n furniture: number,\n /** Is the bar already down to icons? \"Mais\" shrinks with everything else. */\n compact: boolean,\n /** Whose type scale every price is read at — the bar's own. */\n theme: Theme,\n): Split<T> {\n const active = all.filter((field) => isActiveField(field, pills, ranges));\n const idle = all.filter((field) => !isActiveField(field, pills, ranges));\n const price = pricesFor(theme);\n const gap = remPx(theme, RESERVED.betweenControls);\n\n // \"Limpar\" rides the end of the cluster whenever anything is applied.\n const clearCost = active.length > 0 ? price.clearAll + gap : 0;\n // APPLIED FIRST, BUT NOT EXEMPT.\n //\n // Applied controls take the visible slots ahead of idle ones — that part was\n // always right. Exempting them from the overflow entirely was not: applying\n // a value LENGTHENS a control (\"Pagamento (1)\"), so on a phone four applied\n // filters claimed more width than the row had and the bar simply painted\n // past its own edge, leaving pills reachable only by scrolling sideways.\n //\n // An applied filter hidden in \"Mais\" is not lost the way it would be if it\n // vanished silently: the trigger goes to the applied tone and says how many\n // are in there (see `MoreTrigger`), which is the same signal the pill itself\n // was carrying. A control you scroll off-screen carries no signal at all.\n //\n // The keep-what-fits loop itself is `splitToFit` (`utility/Overflow`) — the\n // one part of this that is not filter-shaped, and the part a second cluster\n // in the design system would otherwise have had to reimplement.\n const split = splitToFit(all, {\n widthOf: (field) => fieldWidth(theme, field, pills, ranges),\n keyOf: (field) => field.id,\n gap,\n available: width - furniture - clearCost,\n // The overflow button at the width it will actually have, which on a phone\n // is the icon-and-badge one.\n overflowCost: compact ? price.overflowButtonCompact : price.overflowButton,\n priority: [...active, ...idle],\n });\n return { ...split, used: split.used + clearCost };\n}\n\n/**\n * THE DEGRADATION LADDER — cheapest loss first, and each rung taken only if\n * the one before it did not free enough:\n *\n * 1. filter controls move into the \"Mais\" overflow (`splitFilters`)\n * 2. Exibir / Exportar drop their text labels (`compactControls`)\n * 3. the search shrinks toward its minimum (CSS: it is `flex: 1`)\n * 4. the search itself collapses to an icon (`searchCollapsed`)\n *\n * Step 3 needs no flag — the search is a flex child, so it gives up width on\n * its own until it hits `RESERVED.search`. The flags mark the two steps that\n * change what is RENDERED rather than how wide it is.\n *\n * Measured against what is CURRENTLY on the bar, never a breakpoint: a\n * two-filter page and a five-filter page would otherwise collapse at the same\n * width, and only one of them would be right.\n */\nfunction computeSplit<T extends Record<string, unknown>>(\n all: OverflowField<T>[],\n pills: Record<string, string[]>,\n ranges: Record<string, RangeValue>,\n width: number,\n /** Does the host render \"Exportar\" beside \"Exibir\"? Half the cluster if not. */\n hasExport: boolean,\n theme: Theme,\n): Omit<OverflowSplit<T>, \"barRef\"> {\n // Unmeasured (SSR, or jsdom without a ResizeObserver) ⇒ degrade nothing.\n if (width === 0) {\n return {\n inline: all,\n overflow: [],\n compactControls: false,\n counterHidden: false,\n searchCollapsed: false,\n clearAllHidden: false,\n searchTakeover: false,\n };\n }\n const price = pricesFor(theme);\n // Pass 1 prices the furniture at its widest — no rung has been taken yet.\n let budget = furnitureCost(price, UNCOLLAPSED, hasExport);\n let split = splitFilters(all, pills, ranges, width, budget, false, theme);\n let flags = ladderFlags(split, width, hasExport, price);\n // RE-SPEND WHAT THE LATER RUNGS FREED.\n //\n // Rungs 2/4/5 turn 200 + 96 + 216 of furniture into 44 + 0 + 140, and until\n // this loop existed nobody handed those ~330px back to the filters: the\n // split was decided once, against the uncollapsed row, so a phone shed every\n // control and then sat with a band of empty bar beside \"Mais 5\".\n //\n // Settles rather than oscillates, and cannot overfill: a cheaper furniture\n // can only give the filters MORE room, more filter width can only push the\n // ladder FURTHER down, and a further rung can only make the furniture\n // cheaper again — so the budget decreases monotonically and the loop exits\n // the moment it stops moving. The bound is a backstop, not the exit.\n for (let pass = 0; pass < 3; pass += 1) {\n const freed = furnitureCost(price, flags, hasExport);\n if (freed >= budget) break;\n budget = freed;\n split = splitFilters(all, pills, ranges, width, budget, flags.compactControls, theme);\n flags = ladderFlags(split, width, hasExport, price);\n }\n return { inline: split.inline, overflow: split.overflow, ...flags };\n}\n\n/** The widest the furniture ever is — every rung still untaken. */\nconst UNCOLLAPSED = { searchCollapsed: false, counterHidden: false, compactControls: false };\n\n/** Rungs 2 and 4-6, priced against what the filters actually took. */\nfunction ladderFlags<T extends Record<string, unknown>>(\n split: Split<T>,\n width: number,\n hasExport: boolean,\n price: Prices,\n): Omit<OverflowSplit<T>, \"barRef\" | \"inline\" | \"overflow\"> {\n const { overflow, used } = split;\n const base = width - used - price.chrome;\n\n // Would the search still make its minimum with the labels on?\n const compactControls = base - price.counter - rightClusterCost(price, hasExport, false) < price.search;\n const rightCost = rightClusterCost(price, hasExport, compactControls);\n // …and with them off?\n const searchCollapsed = base - price.counter - rightCost < price.search;\n // Everything has collapsed and the row STILL overflows. The controls cannot\n // shrink further — they are `flexShrink: 0` precisely so an over-packed row\n // sheds rather than squeezes — so without this last rung they simply paint\n // outside the toolbar, which is what a narrow phone was doing.\n const counterHidden =\n searchCollapsed && base - price.counter - rightCost < price.searchIcon;\n // Step 6 — below even that, \"Limpar\" leaves the bar. It is the ONLY control\n // here with a second home: the overflow panel's footer carries \"Limpar todos\n // os filtros\", so nothing is lost, which is exactly why it goes before the\n // search icon or \"Mais\" (neither of which has anywhere else to be). Guarded\n // on there BEING an overflow, because with no panel the footer does not\n // exist and dropping this would strand the operator.\n const clearAllHidden = counterHidden && overflow.length > 0;\n // What the keyword box would get if the operator expanded the magnifier.\n // `searchCollapsed` is a different question — it asks whether the box fits at\n // its PREFERRED 200px, and is deliberately pessimistic — so reusing it to\n // decide the takeover evicted the filters on screens where the box had plenty\n // of room to simply shrink.\n //\n // Asked with the inline filters SHED, because shedding them is exactly what\n // expanding the box does: the row re-splits and they go behind \"Mais\".\n // Measuring against the resting row instead made a filter argue for its own\n // eviction — now that a large phone keeps one, its width came out of `base`,\n // pushed the box under `usableSearch`, and tipped a row that had ample space\n // to share into a full takeover.\n const overflowButton = compactControls\n ? price.overflowButtonCompact\n : price.overflowButton;\n const shedRoom = width - price.chrome - (overflow.length > 0 ? overflowButton : 0);\n const searchBoxRoom = shedRoom - (counterHidden ? 0 : price.counter) - rightCost;\n // Below this a box is too narrow to read what you typed into it, and shrinking\n // further buys nothing; that is the only point at which taking the whole\n // cluster is worth losing the filters.\n const searchTakeover = searchCollapsed && searchBoxRoom < price.usableSearch;\n\n return { compactControls, counterHidden, searchCollapsed, clearAllHidden, searchTakeover };\n}\n\n/**\n * Split the declared filter controls into what fits and what goes behind\n * \"Mais\", measured against the live toolbar width.\n *\n * Cached on a SIGNATURE rather than by `useMemo` over the inputs: hosts declare\n * their fields inline, so `all` is a fresh array on every render while the\n * configuration is unchanged, and a reference-keyed memo would never hit.\n */\nexport function useFilterOverflow<T extends Record<string, unknown>>(\n all: OverflowField<T>[],\n pills: Record<string, string[]>,\n ranges: Record<string, RangeValue>,\n /**\n * A filter control is open — hold the current answer until it closes.\n *\n * Applying a filter changes that control's LABEL (\"Valor\" becomes \"Valor: ≥\n * R$ 1\"), which changes its measured width, which re-runs the whole split\n * while its popover is open on top of it. Measured: setting a minimum moved\n * the trigger 192px left, took the popover with it, and pushed two other\n * controls into a newly-appeared \"Mais 2\" — so reaching for the second bound\n * meant chasing the control across the row. Nobody sets a range that way.\n *\n * Frozen only for the duration: closing re-measures against the new labels,\n * so the row still ends up correct, it just does not rearrange under a hand\n * that is mid-edit.\n */\n frozen = false,\n /** Whether \"Exportar\" is on the bar — see `rightClusterCost`. */\n hasExport = true,\n): OverflowSplit<T> {\n // The measurement is `useMeasuredWidth` (`utility/Overflow`): the same\n // ResizeObserver every collapsing cluster in the design system reads, so\n // there is one loop to get right rather than one per bar. `0` until the\n // first measurement lands (and forever under SSR or jsdom), which\n // `computeSplit` reads as \"degrade nothing\".\n const { ref: barRef, width } = useMeasuredWidth<HTMLDivElement>();\n // The prices follow the theme's type scale, so the answer does too.\n const theme = useTheme();\n const signature = JSON.stringify({\n ids: all.map((field) => field.id),\n pills,\n ranges,\n width,\n hasExport,\n scale: remPx(theme, 1),\n });\n const cache = useRef<{ signature: string; split: ReturnType<typeof computeSplit<T>> } | null>(null);\n if (cache.current === null || (!frozen && cache.current.signature !== signature)) {\n cache.current = { signature, split: computeSplit(all, pills, ranges, width, hasExport, theme) };\n }\n // The cache holds the ARRANGEMENT — which ids sit on the bar, which in \"Mais\"\n // — never the fields themselves. The signature keys on ids, so a field whose\n // options arrive after the first measurement (a category list still loading)\n // does not re-split, and handing back the cached objects served the empty\n // list for good: \"Categoria\" in \"Mais\" rendered a label with no control under\n // it (FUT-2828). Re-reading each field from `all` keeps the slots and the\n // current config.\n const { split } = cache.current;\n const current = new Map(all.map((field) => [field.id, field]));\n const fresh = (fields: OverflowField<T>[]): OverflowField<T>[] =>\n fields.map((field) => current.get(field.id) ?? field);\n return { ...split, inline: fresh(split.inline), overflow: fresh(split.overflow), barRef };\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/DataViewsTableBase.tsx"],"sourcesContent":["\"use client\";\n\nimport type { SortFieldDefinition } from \"../../layout/ContentToolbar\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { DataViewsGrid } from \"./DataViewsGrid\";\nimport type { SelectionExtraRender } from \"./data-views-selection-extra\";\nimport type { ListGroupConfig } from \"./list-card-rails\";\nimport type { DisplayPanelView } from \"./data-views-display-panel\";\nimport { viewStateKey } from \"./data-views-dirty\";\nimport { DeleteViewDialog } from \"./DeleteViewDialog\";\nimport type { BoardConfig } from \"./DataViewsBoard\";\nimport type { DataViewExport } from \"./data-views-export\";\nimport type { ScopeConfig } from \"./data-views-scopes\";\nimport type { DataViewRowDetail } from \"./data-views-row-detail\";\nimport { ViewDialogs, ViewMutationErrorAlert } from \"./data-views-table-parts\";\nimport { useUrlEchoGuard, useUrlSyncState } from \"./data-views-url-echo\";\nimport {\n useSavedViewsController,\n type SavedViewsController,\n} from \"./use-saved-views-controller\";\nimport {\n type DataViewColumn,\n type DataViewsLayout,\n type DataViewServer,\n type DataViewState,\n type DataViewPersistence,\n type DataViewRouter,\n type FilterFieldConfig,\n type RangeFieldConfig,\n type DataViewCardSelection,\n type RowAction,\n type SavedViewSummary,\n} from \"./data-views-types\";\n\nexport interface DataViewsTableBaseProps<T extends Record<string, unknown>> {\n /** The applied-view id read from the URL (`?view=`) on load, or null. */\n initialViewId?: string | null;\n /** Injected saved-view persistence (create/update/delete). */\n persistence: DataViewPersistence;\n /** Injected router side-effects (URL sync + refresh). */\n router: DataViewRouter;\n rows: T[];\n columns: DataViewColumn<T>[];\n fields: FilterFieldConfig<T>[];\n /** Optional numeric min/max range filters (advanced \"filter by amount\"). */\n rangeFields?: RangeFieldConfig<T>[];\n getRowId: (row: T) => string | number;\n onRowClick?: (row: T) => void;\n emptyState?: React.ReactNode;\n dataTestId?: string;\n testIdPrefix?: string;\n /** The user's + shared views for this table (from the server). */\n views: SavedViewSummary[];\n /** Big page title in the table header, beside the funnel + gear (GTA layout). */\n title?: string;\n /** Primary page actions (e.g. \"Novo produto\") rendered at the header's right. */\n headerActions?: React.ReactNode;\n /** Sort options for the toolbar's \"Sort By\" dropdown (defaults to sortable columns). */\n sortFields?: SortFieldDefinition[];\n /**\n * Per-sort-field VALUE KIND (`\"currency\" | \"number\" | \"date\" | \"text\"`), so the\n * Exibir panel phrases the direction in that column's own terms. \"Crescente\"\n * on a currency column is a puzzle; \"Menor → maior\" is not. Defaults to text.\n */\n sortKinds?: Record<string, string>;\n /**\n * Opt-in \"Exportar\" control. The grid hands the host the current query,\n * UNPAGINATED, and the host re-queries — the grid never fetches, and an\n * export therefore follows the filters rather than the loaded page.\n */\n exportConfig?: DataViewExport;\n /** Notified with the currently-visible (filtered) rows, so Export matches the view. */\n onVisibleRowsChange?: (rows: T[]) => void;\n /** Reusable row actions driving both the row \"⋮\" kebab and the bulk menu. */\n rowActions?: RowAction<T>[];\n /** Leading control in the auto kebab column (e.g. a favourite star). */\n rowActionsLeading?: (row: T) => React.ReactNode;\n /** Low-level bulk-action override; prefer `rowActions`. */\n bulkActions?: (selectedRows: T[], clearSelection: () => void) => React.ReactNode;\n /** A selection-widening control beside the count (e.g. \"select all matching\"). */\n selectionExtra?: SelectionExtraRender<T>;\n /** Bespoke per-row menu (an entity's self-contained 3-dots menu) instead of the auto kebab. */\n renderRowMenu?: (row: T) => React.ReactNode;\n /**\n * Row selection, default `true`. `false` draws no checkbox in any layout and\n * no select-all, so the toolbar's selection mode can never hide the search,\n * the pills and Exportar — for a grid with no bulk action. Row click and the\n * row menu are unaffected.\n */\n selectable?: boolean;\n /** Opt-in expandable rows (table layout only) — see {@link DataViewRowDetail}. */\n rowDetail?: DataViewRowDetail<T>;\n /** Opt-in \"Grade\" (cards) layout — a card renderer per row; adds a Grade/Tabela toggle. */\n renderCard?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /** Opt-in \"Quadro\" (board) layout — the loaded page as columns of one field. Needs `renderCard`. */\n board?: BoardConfig<T>;\n /** Opt-in \"Lista\" layout — one full-width, entity-rendered row per record (FUT-733). */\n renderListRow?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /** The Lista's shared columns, so its rows line up by construction not convention. */\n listGroup?: ListGroupConfig<T>;\n /** The page-level partition rendered as tabs under the toolbar (server mode only). */\n scopes?: ScopeConfig[];\n /** The row field the scopes partition by — used only to reject a pill over the same field. */\n scopeFieldId?: string;\n /** Which layout to show first when the user has expressed no preference (default \"table\"). */\n defaultLayout?: DataViewsLayout;\n /**\n * Ignore the remembered cross-screen layout preference and pin to\n * `defaultLayout`. For tables that exist to SHOW a layout — stories, docs,\n * screenshots — not for real screens.\n */\n ignoreStoredLayout?: boolean;\n /** Opt into the responsive inline filter UX (collapsible row / modal). Default keeps the panel. */\n inlineFilters?: boolean;\n /** Keep the inline search visible with no filter fields and no active search. */\n alwaysShowSearch?: boolean;\n /** Server-mode wiring (FUT-180): backend-driven rows/total + re-fetch. Omit for client mode. */\n server?: DataViewServer;\n /** Seed the initial view state (search/pills/ranges/sort) from the URL when no saved view applies. */\n initialState?: DataViewState;\n}\n\n/**\n * Resolve the initial applied view: a `?view=<id>` shortcut (FUT-90) wins, else\n * the user's default view, else none. Drives the seed state + trigger label.\n */\nfunction resolveInitialView(\n views: SavedViewSummary[],\n requestedId: string | null,\n): SavedViewSummary | undefined {\n const requested = requestedId ? views.find((view) => view.id === requestedId) : undefined;\n return requested ?? views.find((view) => view.isDefault);\n}\n\n/**\n * The Exibir panel's view chrome, assembled from the saved-views controller.\n * Extracted so {@link DataViewsTableBase} stays inside its size budget.\n */\nfunction buildDisplayView({\n ctl,\n views,\n activeView,\n dirty,\n onRequestDelete,\n}: {\n ctl: SavedViewsController;\n views: SavedViewSummary[];\n activeView: SavedViewSummary | undefined;\n dirty: boolean;\n /** Opens the confirmation; the delete itself happens on confirm. */\n onRequestDelete: (view: SavedViewSummary) => void;\n}): DisplayPanelView {\n return {\n activeViewName: ctl.activeViewName,\n dirty,\n onReset: () => (activeView ? ctl.applyView(activeView) : ctl.selectMain()),\n // Only offer \"Atualizar\" when there IS a view to update — otherwise the\n // single footer button is a plain \"Salvar visão\".\n onUpdate: activeView ? () => ctl.openEdit(activeView) : undefined,\n onSaveAs: ctl.openCreate,\n // The views themselves, not a dropdown: the panel renders them in its own\n // body (see `data-views-view-nav`), so there is no second popover to clip\n // the row actions.\n nav: {\n views,\n activeViewId: activeView?.id ?? null,\n onSelectView: (id) => {\n const next = id === null ? null : views.find((view) => view.id === id);\n if (next) ctl.applyView(next);\n else ctl.selectMain();\n },\n onEditView: ctl.openEdit,\n onPatchView: (view, changes) => void ctl.patchView(view, changes),\n onDeleteView: onRequestDelete,\n },\n };\n}\n\n/**\n * \"Are there unsaved changes?\" — the dot on Exibir, and whether Redefinir and\n * Salvar visão are live.\n *\n * Two things it gets right that the inline version did not. It compares\n * NORMALISED states (`viewStateKey`), so a filter applied and then removed is\n * clean again rather than clean-looking but flagged; and it re-baselines after\n * a SAVE, because the state just written is the clean one from that point.\n *\n * The baseline is the first state the grid emits for a view, not the view\n * itself: the grid normalises what it is handed — resolving visible columns,\n * filling in layout — so the applied view is never byte-identical to the state\n * it produces.\n */\nfunction useDirtyTracking(ctl: SavedViewsController): {\n dirty: boolean;\n noteState: (state: DataViewState) => void;\n markSaved: () => void;\n} {\n const [dirty, setDirty] = useState(false);\n const [savedAt, setSavedAt] = useState(0);\n const baseline = useRef<string | null>(null);\n const appliedKey = JSON.stringify(ctl.applied ?? null);\n\n useEffect(() => {\n baseline.current = null;\n setDirty(false);\n }, [appliedKey, savedAt]);\n\n return {\n dirty,\n noteState: (state) => {\n ctl.currentRef.current = state;\n const key = viewStateKey(state);\n if (baseline.current === null) {\n baseline.current = key;\n setDirty(false);\n return;\n }\n const next = key !== baseline.current;\n setDirty((prev) => (prev === next ? prev : next));\n },\n markSaved: () => setSavedAt((tick) => tick + 1),\n };\n}\n\n/**\n * The reusable admin table (FUT-89): the DataViews grid plus the full saved-views\n * experience — a views dropdown, a save/edit modal (with preview), and a manage\n * dialog. Framework-agnostic: saved-view persistence and router side-effects are\n * INJECTED (`persistence`, `router`, `initialViewId`) so the host app wires them\n * to its backend + framework router. A default view auto-applies on load; applying\n * a view restores its filters + columns + sort. Each table supplies its own columns\n * + filter fields; everything else is shared.\n */\nexport function DataViewsTableBase<T extends Record<string, unknown>>(\n props: DataViewsTableBaseProps<T>,\n): React.JSX.Element {\n // Forwarded as a whole rather than restated name-by-name twice (as in\n // DataViewsGrid): this component only ADDS the saved-views chrome, and a\n // 30-name destructure repeated in the JSX is exactly where a newly added prop\n // silently stops being passed on.\n const {\n initialViewId = null,\n persistence,\n router,\n columns,\n fields,\n testIdPrefix = \"table\",\n views,\n server,\n initialState,\n } = props;\n const initialView = resolveInitialView(views, initialViewId);\n const columnIds = columns.map((col) => col.id);\n const ctl = useSavedViewsController(persistence, router, columnIds, views, initialView, initialState);\n // Unsaved-changes flag for the Exibir panel. Set from `onStateChange` rather\n // than derived in render because the live state lives in a REF (the grid owns\n // it); the equality bail-out in `setDirty` is what stops the update loop.\n const { dirty, noteState, markSaved } = useDirtyTracking(ctl);\n // Deleting a saved view is confirmed, not immediate — see `DeleteViewDialog`.\n const [pendingDelete, setPendingDelete] = useState<SavedViewSummary | null>(null);\n // The view the panel's \"Redefinir\" restores: the applied one, or the built-in\n // \"Visão principal\" when none is.\n const activeView = views.find((view) => view.name === ctl.activeViewName);\n const displayView = buildDisplayView({\n ctl,\n views,\n activeView,\n dirty,\n onRequestDelete: setPendingDelete,\n });\n // Server-mode lists re-apply URL-derived controls on back/forward (not just\n // the mount seed), but never the grid's own query echoing back through the URL.\n const echo = useUrlEchoGuard(server);\n const syncState = useUrlSyncState(echo.server, initialState, echo.consumeEcho);\n\n return (\n <>\n <ViewMutationErrorAlert error={ctl.mutationError} onClose={ctl.clearMutationError} testIdPrefix={testIdPrefix} />\n <DataViewsGrid<T>\n {...props}\n server={echo.server}\n testIdPrefix={testIdPrefix}\n appliedState={ctl.applied}\n syncState={syncState}\n onStateChange={noteState}\n // The saved-views menu is NOT a toolbar control any more: it lives in\n // the Exibir panel's VISÃO header, passed through `displayView`.\n displayView={displayView}\n />\n {renderViewDialogs(ctl, fields, columns, views, testIdPrefix, markSaved)}\n <DeleteViewDialog\n view={pendingDelete}\n onClose={() => setPendingDelete(null)}\n onConfirm={(view) => {\n void ctl.handleDelete(view);\n setPendingDelete(null);\n }}\n testIdPrefix={testIdPrefix}\n />\n </>\n );\n}\n\n/** The save + manage saved-view dialogs, split out to keep the base thin. */\nfunction renderViewDialogs<T extends Record<string, unknown>>(\n ctl: SavedViewsController,\n fields: DataViewsTableBaseProps<T>[\"fields\"],\n columns: DataViewsTableBaseProps<T>[\"columns\"],\n views: SavedViewSummary[],\n testIdPrefix: string,\n onSaved: () => void,\n): React.JSX.Element {\n return (\n <ViewDialogs<T>\n saveOpen={ctl.saveOpen}\n onCloseSave={ctl.closeSave}\n currentState={ctl.editing ? ctl.editing.state : ctl.currentRef.current}\n fields={fields}\n columns={columns}\n editing={ctl.editing}\n onSave={async (payload) => {\n await ctl.handleSave(payload);\n // The saved state is the clean one from here on.\n onSaved();\n }}\n manageOpen={ctl.manageOpen}\n onCloseManage={() => ctl.setManageOpen(false)}\n views={views}\n onEditFromManage={ctl.editFromManage}\n onDelete={(view) => void ctl.handleDelete(view)}\n testIdPrefix={testIdPrefix}\n />\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/navigation/Tabs/Tabs.tsx"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport Badge from '@mui/material/Badge/index.js';\nimport Box from '@mui/material/Box/index.js';\nimport Divider from '@mui/material/Divider/index.js';\nimport MuiTab from '@mui/material/Tab/index.js';\nimport MuiTabs from '@mui/material/Tabs/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { CustomTabPanel } from './TabsPanel';\nimport { tabsRootStyles } from './Tabs.styles';\nimport type { TabItem, TabsProps } from './Tabs.types';\nimport { rem, sxRem } from '../../../tokens/relative';\n\nconst StyledTabs = styled(MuiTabs, {\n shouldForwardProp: (prop) => !['customVariant', 'size', 'showDividers'].includes(prop as string) })<{ customVariant?: string; size?: string; showDividers?: boolean }>(\n ({ theme, customVariant, size, showDividers }) => ({\n ...tabsRootStyles({ theme, customVariant, size, showDividers }) }),\n);\n\nconst CloseButton = styled(Box)(({ theme }) => ({\n marginLeft: theme.spacing(0.5),\n padding: theme.spacing(0.25),\n width: rem(theme, 20),\n height: rem(theme, 20),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n cursor: 'pointer',\n borderRadius: '50%',\n color: theme.palette.action.active,\n '&:hover': {\n backgroundColor: alpha(theme.palette.error.main, 0.1),\n color: theme.palette.error.main } }));\n\nconst BadgeWrapper = styled(Badge)(({ theme }) => ({\n '& .MuiBadge-badge': {\n right: rem(theme, -6),\n top: rem(theme, 4),\n fontSize: rem(theme, 12),\n minWidth: rem(theme, 16),\n height: rem(theme, 16),\n padding: 0 } }));\n\nconst TABS_DEFAULTS: Partial<TabsProps> = {\n variant: 'default',\n size: 'md',\n color: 'primary',\n fullWidth: false,\n orientation: 'horizontal',\n showDividers: false,\n centered: false,\n scrollable: false,\n scrollButtons: 'auto',\n sticky: false,\n stickyOffset: 0,\n animateContent: false,\n animationDuration: 300,\n persistContent: false,\n disabled: false,\n loading: false };\n\n/**\n * The props this component OWNS and MUI's `Tabs` does not understand (12-86).\n *\n * `rest` below is spread onto the DOM node, so anything left in it that React\n * cannot place on an element is reported — five `does not recognize the … prop`\n * warnings and three `Received false for a non-boolean attribute`, on every\n * render, in the browser console and in every host's jsdom output.\n *\n * An explicit list rather than `Object.keys(TABS_DEFAULTS)`, because the two\n * sets differ in both directions: `items`, `closeTabLabel`, `tabPanelProps` and\n * `loadingComponent` have no default and still must not reach the DOM, while\n * `orientation`, `centered` and `indicatorColor` are real MUI props that must.\n * An omission rather than more destructuring, so a prop added to `TabsProps`\n * costs a line here instead of an unused `_name` binding.\n *\n * Deliberately NOT here: `onFocus` and `onBlur`. They are ordinary DOM handlers\n * that reach the element through `rest` and nowhere else, so listing them would\n * silently stop them working.\n */\nconst OWN_PROPS = new Set<string>([\n 'items',\n 'closeTabLabel',\n 'color',\n 'size',\n 'fullWidth',\n 'scrollable',\n 'scrollButtons',\n 'sticky',\n 'stickyOffset',\n 'animateContent',\n 'animationDuration',\n 'persistContent',\n 'tabPanelProps',\n 'loading',\n 'loadingComponent',\n]);\n\n/** `props` with every {@link OWN_PROPS} key dropped — what is left is passthrough. */\nconst domPassthrough = (props: Record<string, unknown>): Record<string, unknown> =>\n Object.fromEntries(Object.entries(props).filter(([key]) => !OWN_PROPS.has(key)));\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}`\n// still falls back to the default as a destructuring default would.\nconst definedProps = (props: TabsProps): Partial<TabsProps> =>\n Object.fromEntries(\n Object.entries(props).filter(([, value]) => value !== undefined),\n ) as Partial<TabsProps>;\n\n// Once the row is scrollable every accepted scrollButtons value ends up as\n// MUI's 'auto'. That is exactly what the previous nested ternary did — it mapped\n// 'on'/'off'/'desktop' to 'auto', and its remaining branch could only ever be\n// 'auto' anyway — so the behaviour is preserved here rather than quietly\n// changed. Worth knowing that scrollButtons=\"off\" therefore still shows buttons.\nconst resolveScrollButtons = (scrollable?: boolean): 'auto' | false =>\n scrollable ? 'auto' : false;\n\nconst buildTabsSx = ({\n fullWidth,\n sticky,\n stickyOffset,\n indicatorColor,\n disabled }: {\n fullWidth?: boolean;\n sticky?: boolean;\n /** The pinned list's `top`, already through the theme (the prop is design px). */\n stickyOffset: (theme: Theme) => string;\n indicatorColor?: string;\n disabled?: boolean;\n}) => ({\n ...(fullWidth && { width: '100%' }),\n // Pin the tab list while panels scroll beneath it. Opaque background + bottom\n // divider so scrolled content does not show through.\n ...(sticky && {\n position: 'sticky',\n top: stickyOffset,\n zIndex: 2,\n backgroundColor: 'background.default',\n borderBottom: 1,\n borderColor: 'divider' }),\n ...(indicatorColor && {\n '& .MuiTabs-indicator': { backgroundColor: indicatorColor } }),\n ...(disabled && { opacity: 0.6, pointerEvents: 'none' }) });\n\n// A tab's label: icon, text, optional close affordance, optionally badged.\nconst TabLabel: React.FC<{\n item: TabItem;\n closeTabLabel: string;\n onClose: (event: React.MouseEvent | React.KeyboardEvent, tabId: string) => void;\n}> = ({ item, closeTabLabel, onClose }) => {\n const content = (\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n {item.icon}\n <span>{item.label}</span>\n {item.closable && (\n <CloseButton\n onClick={(e) => onClose(e, item.id)}\n role=\"button\"\n tabIndex={0}\n aria-label={closeTabLabel}\n onKeyDown={(e) => {\n if (e.key !== 'Enter' && e.key !== ' ') return;\n onClose(e, item.id);\n }}\n >\n <Close fontSize=\"inherit\" />\n </CloseButton>\n )}\n </Box>\n );\n\n if (item.badge === undefined) return content;\n\n return (\n <BadgeWrapper badgeContent={item.badge} color=\"error\">\n {content}\n </BadgeWrapper>\n );\n};\n\ntype ResolvedTabs = TabsProps;\n\n// The tab strip. Kept in this file because StyledTabs cannot cross a module\n// boundary (TS2742).\nconst TabsBar: React.FC<\n ResolvedTabs & {\n rest: Record<string, unknown>;\n onChange: (event: React.SyntheticEvent, newValue: string) => void;\n onCloseTab: (event: React.MouseEvent | React.KeyboardEvent, tabId: string) => void;\n }\n> = ({ rest, items, value, onChange, onCloseTab, dataTestId, ...p }) => (\n <StyledTabs\n {...rest}\n value={value}\n onChange={onChange}\n customVariant={p.variant}\n size={p.size}\n showDividers={p.showDividers}\n orientation={p.orientation}\n centered={p.centered}\n // MUI only scrolls when its own `variant` is `scrollable`; map our\n // `scrollable` flag onto it so overflowing tab rows actually scroll.\n variant={p.scrollable ? 'scrollable' : 'standard'}\n data-testid={dataTestId ? `${dataTestId}-list` : 'tabs-list'}\n scrollButtons={resolveScrollButtons(p.scrollable)}\n allowScrollButtonsMobile={p.scrollable}\n textColor={p.color}\n indicatorColor={p.color}\n sx={buildTabsSx({\n fullWidth: p.fullWidth,\n sticky: p.sticky,\n stickyOffset: sxRem(p.stickyOffset ?? 0),\n indicatorColor: p.indicatorColor,\n disabled: p.disabled })}\n >\n {items.map((item, index) => (\n <MuiTab\n key={item.id}\n value={item.id}\n label={<TabLabel closeTabLabel={p.closeTabLabel} item={item} onClose={onCloseTab} />}\n disabled={item.disabled || p.disabled}\n className={item.className}\n id={`tab-${item.id}`}\n aria-controls={`tabpanel-${item.id}`}\n aria-disabled={item.disabled || p.disabled}\n data-testid={dataTestId ? `${dataTestId}-tab-${index}` : `tabs-tab-${index}`}\n />\n ))}\n </StyledTabs>\n);\n\nconst TabsPanels: React.FC<ResolvedTabs> = ({\n items,\n value,\n variant,\n animateContent,\n animationDuration,\n persistContent,\n loading,\n loadingComponent,\n tabPanelProps,\n dataTestId }) => (\n <Box sx={{ mt: variant === 'enclosed' ? 0 : 2 }}>\n {items.map((item, index) => (\n <CustomTabPanel\n key={item.id}\n id={item.id}\n value={value}\n animate={animateContent}\n animationDuration={animationDuration}\n persist={persistContent}\n loading={loading}\n loadingComponent={loadingComponent}\n className={tabPanelProps?.className}\n dataTestId={dataTestId}\n index={index}\n >\n {item.content}\n </CustomTabPanel>\n ))}\n </Box>\n);\n\nexport const Tabs = React.forwardRef<HTMLDivElement, TabsProps>(\n (tabsProps, ref) => {\n const resolved = { ...TABS_DEFAULTS, ...definedProps(tabsProps) } as TabsProps;\n const {\n // Destructured only to keep it OUT of `rest`, which is spread onto the\n // DOM node — `{...resolved}` below is what actually carries it to\n // `TabsBar`. Same reason as `value` on the next line.\n closeTabLabel: _closeTabLabel,\n value: _value,\n onChange,\n onTabClose,\n className,\n disabled,\n showDividers,\n variant,\n dataTestId,\n ...rest\n } = resolved;\n\n const handleChange = (event: React.SyntheticEvent, newValue: string) => {\n if (!disabled) onChange(event, newValue);\n };\n\n const handleTabClose = (event: React.MouseEvent | React.KeyboardEvent, tabId: string) => {\n event.stopPropagation();\n onTabClose?.(tabId);\n };\n\n return (\n <Box className={className} ref={ref} data-testid={dataTestId || 'tabs'}>\n <TabsBar\n {...resolved}\n // The destructuring above drops the props this component USES;\n // `domPassthrough` drops the ones it merely OWNS. Both have to go:\n // `rest` is spread onto the DOM node, and the second group is where\n // 12-86's warnings came from.\n rest={domPassthrough(rest as unknown as Record<string, unknown>)}\n onChange={handleChange}\n onCloseTab={handleTabClose}\n />\n\n {showDividers && variant !== 'enclosed' && <Divider />}\n\n <TabsPanels {...resolved} />\n </Box>\n );\n },\n);\n\nTabs.displayName = 'Tabs';\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-more-filters.tsx"],"sourcesContent":["\"use client\";\n\nimport KeyboardArrowDownRoundedIcon from \"@mui/icons-material/KeyboardArrowDownRounded\";\n// A FUNNEL, not the tune sliders this used to share with \"Exibir\". The two\n// sit a few px apart on the same bar and do unrelated things — one narrows\n// WHICH rows you see, the other changes HOW they are shown — and with one\n// glyph between them the bar offered the operator no way to tell which was\n// which. On a phone, where both are icon-only, they were indistinguishable.\nimport FilterAltRoundedIcon from \"@mui/icons-material/FilterAltRounded\";\nimport Popover from \"@mui/material/Popover/index.js\";\nimport type { Theme } from \"@mui/material/styles/index.js\";\nimport { useState } from \"react\";\n\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { Button } from \"../../form/Button\";\nimport { Box } from \"../../../mui/Box\";\nimport { Text } from \"../../typography/Text\";\n\nimport { fieldClearing, MoreGroup, type MoreFieldProps } from \"./data-views-more-fields\";\nimport type { OverflowField } from \"./data-views-overflow\";\nimport { rem, sxRem } from \"../../../tokens/relative\";\n\n/**\n * \"MAIS\" — the filter overflow: its trigger, its panel and its footer. What\n * goes INSIDE it is `data-views-more-fields`.\n *\n * It holds the fields that had no room on the toolbar. An applied filter is\n * ranked ahead of an idle one for the visible slots but is NOT exempt (see\n * `useFilterOverflow`), so an applied filter can be in here — on a phone, most\n * of them are. That is why the trigger changes tone and counts the applied\n * ones: a filter you cannot see is a filter you forget you set, and the badge\n * is what stops that.\n */\n\ninterface MoreFiltersProps<T extends Record<string, unknown>> extends MoreFieldProps {\n fields: OverflowField<T>[];\n}\n\n/**\n * The trigger, badged with how many fields had no room on the bar — and told\n * apart when some of them are APPLIED.\n *\n * An applied filter can land in here now (it is ranked first, not exempt), so\n * this button is the only thing on screen still saying it exists. A neutral\n * badge reading \"3\" would make \"three filters you have not used\" and \"three\n * filters narrowing this list\" look identical, which is the whole failure the\n * old exemption was written to avoid. So an overflow holding applied filters\n * takes the applied tone and counts them in its own badge.\n */\nfunction MoreTrigger({\n count,\n appliedCount,\n compact,\n onOpen,\n testIdPrefix,\n}: {\n count: number;\n appliedCount: number;\n /** Icon only — the same rung that strips Exibir/Exportar. */\n compact: boolean;\n onOpen: (anchor: HTMLElement) => void;\n testIdPrefix: string;\n}): React.JSX.Element {\n const copy = useDataViewsCopy();\n const applied = appliedCount > 0;\n return (\n <Button\n variant=\"outline\"\n size=\"sm\"\n color=\"neutral\"\n onClick={(event) => onOpen(event.currentTarget as HTMLElement)}\n dataTestId={`${testIdPrefix}-more-filters`}\n aria-label={\n applied\n ? copy.filters.moreFiltersApplied(count, appliedCount)\n : copy.filters.moreFilters(count)\n }\n >\n <Box\n component=\"span\"\n sx={{\n display: \"inline-flex\",\n alignItems: \"center\",\n gap: 0.5,\n color: applied ? \"primary.main\" : undefined,\n }}\n >\n <FilterAltRoundedIcon fontSize=\"small\" />\n {!compact && (\n <Box component=\"span\" sx={{ display: { xs: \"none\", sm: \"inline\" } }}>\n {copy.filters.moreTriggerLabel}\n </Box>\n )}\n <Box\n component=\"span\"\n data-testid={`${testIdPrefix}-more-badge`}\n sx={{\n px: 0.75,\n borderRadius: 5,\n bgcolor: applied ? \"primary.main\" : \"action.selected\",\n color: applied ? \"primary.contrastText\" : undefined,\n fontSize: sxRem(11),\n fontWeight: applied ? 700 : undefined,\n }}\n >\n {applied ? appliedCount : count}\n </Box>\n {!compact && <KeyboardArrowDownRoundedIcon fontSize=\"small\" />}\n </Box>\n </Button>\n );\n}\n\n/** The panel's heading: what these are, and why they are in here. */\nfunction MoreHeading(): React.JSX.Element {\n const copy = useDataViewsCopy();\n return (\n <Box\n sx={{\n display: \"flex\",\n alignItems: \"center\",\n gap: 1,\n px: 1.5,\n py: 1,\n borderBottom: 1,\n borderColor: \"divider\",\n }}\n >\n <Text variant=\"caption\" as=\"span\">\n <Box component=\"span\" sx={{ textTransform: \"uppercase\", letterSpacing: sxRem(0.5), color: \"text.disabled\" }}>\n {copy.filters.moreHeading}\n </Box>\n </Text>\n <Text variant=\"caption\" as=\"span\">\n <Box component=\"span\" sx={{ ml: \"auto\", color: \"text.disabled\" }}>\n {copy.filters.overflowNote}\n </Box>\n </Text>\n </Box>\n );\n}\n\n/**\n * The panel's own way back to the unfiltered list.\n *\n * The bar's \"Limpar\" is the primary one, but it is a control like any other\n * and the ladder can take its label — and on the narrowest rungs this panel is\n * where most of the fields ended up anyway. Clearing everything from inside it\n * saves closing it to reach a button three pixels wide.\n */\nfunction MoreFooter({\n onClearAll,\n testIdPrefix,\n}: {\n onClearAll: () => void;\n testIdPrefix: string;\n}): React.JSX.Element {\n const copy = useDataViewsCopy();\n return (\n <Box sx={{ px: 1.5, py: 1, borderTop: 1, borderColor: \"divider\" }}>\n <Box\n component=\"button\"\n type=\"button\"\n onClick={onClearAll}\n data-testid={`${testIdPrefix}-more-clear-all`}\n sx={{\n width: \"100%\",\n border: 0,\n p: 0,\n bgcolor: \"transparent\",\n cursor: \"pointer\",\n font: \"inherit\",\n fontSize: sxRem(13),\n textAlign: \"left\",\n color: \"primary.main\",\n \"&:hover\": { textDecoration: \"underline\" },\n }}\n >\n {copy.filters.clearAll}\n </Box>\n </Box>\n );\n}\n\n/** The overflow trigger + panel. Renders nothing when everything fits. */\nexport function MoreFilters<T extends Record<string, unknown>>({\n fields,\n onOpenChange,\n onClearAll,\n anyApplied,\n compact = false,\n ...rest\n}: MoreFiltersProps<T> & {\n /** Icon only — the same rung that strips Exibir/Exportar. */\n compact?: boolean;\n /** Clears every filter, not just the ones in here. */\n onClearAll: () => void;\n /** Whether anything is applied anywhere — the footer is pointless otherwise. */\n anyApplied: boolean;\n /**\n * So the shell can FREEZE the measured split while this panel is open.\n *\n * Applying a filter in here makes its field active, and an active field\n * takes an inline slot first — so the field being edited was promoted OUT of\n * this panel mid-keystroke, taking the focused input with it. Typing \"12\"\n * got as far as \"1\" and then had nowhere to go.\n */\n onOpenChange?: (open: boolean) => void;\n}): React.JSX.Element | null {\n const [anchor, setAnchor] = useState<HTMLElement | null>(null);\n if (fields.length === 0) return null;\n return (\n <>\n <MoreTrigger\n count={fields.length}\n appliedCount={\n fields.filter(\n (field) =>\n fieldClearing({\n field,\n pills: rest.pills,\n ranges: rest.ranges,\n onTogglePill: rest.onTogglePill,\n onChangeRange: rest.onChangeRange,\n }).applied,\n ).length\n }\n compact={compact}\n onOpen={(element) => {\n setAnchor(element);\n onOpenChange?.(true);\n }}\n testIdPrefix={rest.testIdPrefix}\n />\n <Popover\n open={Boolean(anchor)}\n anchorEl={anchor}\n onClose={() => {\n setAnchor(null);\n onOpenChange?.(false);\n }}\n anchorOrigin={{ vertical: \"bottom\", horizontal: \"left\" }}\n slotProps={{ paper: { sx: { width: sxRem(300), maxWidth: (theme: Theme) => `calc(100vw - ${rem(theme, 32)})` } } }}\n >\n <Box data-testid={`${rest.testIdPrefix}-more-panel`}>\n <MoreHeading />\n {/* overflowX hidden, not auto: this panel is a fixed 300px and its\n contents are told to shrink into it. A horizontal scrollbar here\n means something refused to, which is a bug to fix rather than a\n scrollbar to live with. */}\n <Box sx={{ maxHeight: sxRem(320), overflowY: \"auto\", overflowX: \"hidden\", p: 1.5, minWidth: 0 }}>\n {fields.map((field) => (\n <MoreGroup key={field.id} field={field} {...rest} />\n ))}\n </Box>\n {anyApplied && (\n <MoreFooter onClearAll={onClearAll} testIdPrefix={rest.testIdPrefix} />\n )}\n </Box>\n </Popover>\n </>\n );\n}\n"],"mappings":"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","names":["default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/Chip/Chip.tsx"],"sourcesContent":["import CancelIcon from '@mui/icons-material/Cancel';\nimport MuiChip from '@mui/material/Chip/index.js';\nimport { forwardRef } from 'react';\n\nimport { chipRole, isClickable, makeTestId } from './Chip.helpers';\nimport { chipMuiSize } from './Chip.metrics';\nimport {\n avatarFor,\n chipStyles,\n iconWithTestId,\n makeKeyDownHandler,\n} from './Chip.styles';\nimport type { ChipProps } from './Chip.types';\n\ntype MuiChipColor =\n | 'primary'\n | 'secondary'\n | 'error'\n | 'info'\n | 'success'\n | 'warning'\n | 'default';\n\n/**\n * `danger` and `neutral` are ours; the rest are MUI's own names already.\n *\n * The same boundary translation `Button` performs, and it must stay a\n * translation rather than a cast: a cast is what let `danger` through untouched\n * and had MUI silently fall back to grey.\n *\n * `neutral` maps to `default`, not to `inherit` as it does on a button. A chip's\n * unaccented state is a real palette entry with its own fill; `inherit` would\n * take the surrounding text colour and paint a chip that reads as disabled.\n */\nconst muiColorFor = (color: NonNullable<ChipProps['color']>): MuiChipColor => {\n if (color === 'danger') return 'error';\n return color === 'neutral' ? 'default' : color;\n};\n\nexport const Chip = forwardRef<HTMLDivElement, ChipProps>(({\n label,\n variant = 'filled',\n size = 'md',\n color = 'primary',\n avatarSrc,\n avatar,\n icon,\n selected,\n selectable,\n deletable,\n disabled,\n onClick,\n onDelete,\n className,\n dataTestId,\n // React Native's spelling of the same id; it names the component on both\n // sides and must not reach the DOM as an attribute.\n testID,\n ...props\n}, ref) => {\n const chipId = testID ?? dataTestId;\n const testId = makeTestId(chipId);\n const clickable = isClickable(disabled, onClick, selectable);\n\n return (\n <MuiChip\n ref={ref}\n label={<span data-testid={testId('label')}>{label}</span>}\n variant={variant}\n size={chipMuiSize(size)}\n color={muiColorFor(color)}\n avatar={avatarFor(avatar, avatarSrc)}\n icon={iconWithTestId(icon, testId('icon'))}\n onDelete={deletable ? onDelete : undefined}\n deleteIcon={deletable ? <CancelIcon data-testid={testId('delete')} /> : undefined}\n disabled={disabled}\n clickable={clickable}\n onClick={clickable ? onClick : undefined}\n onKeyDown={makeKeyDownHandler({ disabled, deletable, selectable, onClick, onDelete })}\n className={className}\n role={chipRole(selectable, onClick)}\n aria-selected={selectable ? selected : undefined}\n data-testid={chipId || 'chip'}\n sx={chipStyles({ variant, selected, clickable, disabled })}\n {...props}\n />\n );\n});\n\nChip.displayName = 'Chip';\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAO,gBAAgB;AACvB,OAAO,aAAa;AACpB,SAAS,kBAAkB;AAiEd;AAjCb,IAAM,cAAc,CAAC,UAAyD;AAC5E,MAAI,UAAU,SAAU,QAAO;AAC/B,SAAO,UAAU,YAAY,YAAY;AAC3C;AAEO,IAAM,OAAO,WAAsC,CAAC;AAAA,EACzD;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA;AAAA,EAGA;AAAA,EACA,GAAG;AACL,GAAG,QAAQ;AACT,QAAM,SAAS,UAAU;AACzB,QAAM,SAAS,WAAW,MAAM;AAChC,QAAM,YAAY,YAAY,UAAU,SAAS,UAAU;AAE3D,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,oBAAC,UAAK,eAAa,OAAO,OAAO,GAAI,iBAAM;AAAA,MAClD;AAAA,MACA,MAAM,YAAY,IAAI;AAAA,MACtB,OAAO,YAAY,KAAK;AAAA,MACxB,QAAQ,UAAU,QAAQ,SAAS;AAAA,MACnC,MAAM,eAAe,MAAM,OAAO,MAAM,CAAC;AAAA,MACzC,UAAU,YAAY,WAAW;AAAA,MACjC,YAAY,YAAY,oBAAC,cAAW,eAAa,OAAO,QAAQ,GAAG,IAAK;AAAA,MACxE;AAAA,MACA;AAAA,MACA,SAAS,YAAY,UAAU;AAAA,MAC/B,WAAW,mBAAmB,EAAE,UAAU,WAAW,YAAY,SAAS,SAAS,CAAC;AAAA,MACpF;AAAA,MACA,MAAM,SAAS,YAAY,OAAO;AAAA,MAClC,iBAAe,aAAa,WAAW;AAAA,MACvC,eAAa,UAAU;AAAA,MACvB,IAAI,WAAW,EAAE,SAAS,UAAU,WAAW,SAAS,CAAC;AAAA,MACxD,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,KAAK,cAAc;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/Chip/Chip.styles.tsx"],"sourcesContent":["import Avatar from '@mui/material/Avatar/index.js';\nimport type { SxProps, Theme } from '@mui/material/styles/index.js';\nimport type { KeyboardEvent, ReactElement } from 'react';\nimport React from 'react';\n\nimport { chipKeyAction, type ChipKeyArgs } from './Chip.helpers';\nimport { CHIP_SIZES, CHIP_TRANSITION_EASING, CHIP_TRANSITION_MS, HOVER_LIFT_PX, HOVER_SHADOW } from './Chip.metrics';\nimport type { ChipProps } from './Chip.types';\nimport { shadowInk } from '../../../tokens/ink';\nimport { rem, rems, sxRem } from '../../../tokens/relative';\n\n/**\n * A chip is not a native control, so the two keyboard conventions it stands in\n * for are wired by hand: Delete/Backspace removes it, Enter/Space activates it.\n * The DECISION is `chipKeyAction`, which the native half reads too.\n */\nexport const makeKeyDownHandler =\n (args: ChipKeyArgs & { onClick?: () => void; onDelete?: () => void }) =>\n (event: KeyboardEvent): void => {\n const action = chipKeyAction(event.key, args);\n if (action === null) return;\n event.preventDefault();\n if (action === 'delete') {\n args.onDelete?.();\n return;\n }\n args.onClick?.();\n };\n\nexport const avatarFor = (\n avatar: ChipProps['avatar'],\n avatarSrc?: string,\n): ReactElement | undefined => {\n if (avatar && React.isValidElement(avatar)) {\n return avatar;\n }\n if (avatarSrc) {\n const { avatarSize } = CHIP_SIZES.medium;\n return <Avatar src={avatarSrc} sx={{ width: sxRem(avatarSize), height: sxRem(avatarSize) }} />;\n }\n return undefined;\n};\n\ninterface ChipStyleArgs {\n variant: ChipProps['variant'];\n selected?: boolean;\n clickable?: boolean;\n disabled?: boolean;\n}\n\n/** The lift's shadow, per mode — the same numbers the native chip reads. */\nconst hoverShadow = (theme: Theme): string =>\n `0 ${rems(theme, HOVER_SHADOW.offsetY, HOVER_SHADOW.blur)} ${shadowInk(\n theme,\n theme.palette.mode === 'dark' ? HOVER_SHADOW.alphaDark : HOVER_SHADOW.alphaLight,\n )}`;\n\n/**\n * Selection styling uses SEMANTIC palette tokens (not hardcoded rgba). A filled\n * selected chip keeps MUI's solid `color.main` + contrast text (clear active\n * state); an outlined selected chip gets a subtle theme-driven `action.selected`\n * tint so it reads as active without muddying the fill.\n */\nexport const chipStyles = ({\n variant,\n selected,\n clickable,\n disabled,\n}: ChipStyleArgs): SxProps<Theme> => {\n const lifts = clickable && !disabled;\n\n return {\n // Enhanced styling for outlined variant\n ...(variant === 'outlined' && {\n borderWidth: '1px',\n borderStyle: 'solid',\n backgroundColor: 'transparent',\n }),\n ...(selected &&\n variant === 'outlined' && {\n backgroundColor: (theme: Theme) => theme.palette.action.selected,\n }),\n '&:hover': {\n ...(lifts && {\n transform: (theme: Theme) => `translateY(${rem(theme, -HOVER_LIFT_PX)})`,\n boxShadow: (theme: Theme) => hoverShadow(theme),\n }),\n },\n '&:active': {\n ...(lifts && {\n transform: 'translateY(0px)',\n }),\n },\n transition: `all ${CHIP_TRANSITION_MS / 1000}s ${CHIP_TRANSITION_EASING}`,\n };\n};\n\nexport const iconWithTestId = (\n icon: ChipProps['icon'],\n testId: string,\n): ReactElement | undefined =>\n icon && React.isValidElement(icon)\n ? React.cloneElement(icon as ReactElement, {\n 'data-testid': testId,\n } as Record<string, unknown>)\n : undefined;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,OAAO,YAAY;AAGnB,OAAO,WAAW;AAmCP;AAtBJ,IAAM,qBACX,CAAC,SACD,CAAC,UAA+B;AAC9B,QAAM,SAAS,cAAc,MAAM,KAAK,IAAI;AAC5C,MAAI,WAAW,KAAM;AACrB,QAAM,eAAe;AACrB,MAAI,WAAW,UAAU;AACvB,SAAK,WAAW;AAChB;AAAA,EACF;AACA,OAAK,UAAU;AACjB;AAEK,IAAM,YAAY,CACvB,QACA,cAC6B;AAC7B,MAAI,UAAU,MAAM,eAAe,MAAM,GAAG;AAC1C,WAAO;AAAA,EACT;AACA,MAAI,WAAW;AACb,UAAM,EAAE,WAAW,IAAI,WAAW;AAClC,WAAO,oBAAC,UAAO,KAAK,WAAW,IAAI,EAAE,OAAO,MAAM,UAAU,GAAG,QAAQ,MAAM,UAAU,EAAE,GAAG;AAAA,EAC9F;AACA,SAAO;AACT;AAUA,IAAM,cAAc,CAAC,UACnB,KAAK,KAAK,OAAO,aAAa,SAAS,aAAa,IAAI,CAAC,IAAI;AAAA,EAC3D;AAAA,EACA,MAAM,QAAQ,SAAS,SAAS,aAAa,YAAY,aAAa;AACxE,CAAC;AAQI,IAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAqC;AACnC,QAAM,QAAQ,aAAa,CAAC;AAE5B,SAAO;AAAA;AAAA,IAEL,GAAI,YAAY,cAAc;AAAA,MAC5B,aAAa;AAAA,MACb,aAAa;AAAA,MACb,iBAAiB;AAAA,IACnB;AAAA,IACA,GAAI,YACF,YAAY,cAAc;AAAA,MACxB,iBAAiB,CAAC,UAAiB,MAAM,QAAQ,OAAO;AAAA,IAC1D;AAAA,IACF,WAAW;AAAA,MACT,GAAI,SAAS;AAAA,QACX,WAAW,CAAC,UAAiB,cAAc,IAAI,OAAO,CAAC,aAAa,CAAC;AAAA,QACrE,WAAW,CAAC,UAAiB,YAAY,KAAK;AAAA,MAChD;AAAA,IACF;AAAA,IACA,YAAY;AAAA,MACV,GAAI,SAAS;AAAA,QACX,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,YAAY,OAAO,qBAAqB,GAAI,KAAK,sBAAsB;AAAA,EACzE;AACF;AAEO,IAAM,iBAAiB,CAC5B,MACA,WAEA,QAAQ,MAAM,eAAe,IAAI,IAC7B,MAAM,aAAa,MAAsB;AAAA,EACvC,eAAe;AACjB,CAA4B,IAC5B;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-grid-bodies.tsx"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\n\nimport { DataGrid, type GridColumn, type GridSort } from \"../DataGrid\";\nimport { Box } from \"../../../mui/Box\";\n\nimport {\n cardTargetWidthFor,\n cardScaleForZoom,\n DENSITY_BOARD_SCALE,\n DENSITY_ROW_PADDING,\n useDataViewsLayout,\n type DataViewsDensity,\n} from \"./data-views-layout-context\";\nimport { DataViewsBoard, type BoardConfig } from \"./DataViewsBoard\";\nimport { CardBody } from \"./data-views-card-body\";\nimport { SelectAllStrip } from \"./data-views-select-all-strip\";\nimport { ListCardGroup, type ListGroupConfig } from \"./list-card-rails\";\nimport type { DataViewCardSelection } from \"./data-views-types\";\nimport { toGridExpansion, type DataViewRowDetail } from \"./data-views-row-detail\";\nimport type { DataViewsController } from \"./use-data-views-state\";\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { sxRem } from \"../../../tokens/relative\";\n\n/* ── Body (grid) ─────────────────────────────────────────────────────────── */\n\ninterface GridBodyProps<T extends Record<string, unknown>> {\n rows: T[];\n columns: GridColumn<T>[];\n getRowId: (row: T) => string | number;\n selectedIds: Array<string | number>;\n onChangeSelected: (ids: Array<string | number>) => void;\n /** False ⇒ no checkbox column at all: no header select-all, no row box, no width. */\n selectable: boolean;\n sortBy: GridSort[];\n onChangeSortBy: (next: GridSort[]) => void;\n /** \"server\" defers ordering to the backend (rows render as-is); \"client\" sorts in-grid. */\n sortMode: \"client\" | \"server\";\n /** Vertical cell padding, from the density preference. */\n rowPadding: number;\n rowDetail?: DataViewRowDetail<T>;\n dataTestId?: string;\n emptyState?: React.ReactNode;\n}\n\n/** The dense DataGrid with multi-select (unless opted out), wrapped in the scrollable table region. */\nfunction GridBody<T extends Record<string, unknown>>({\n rows,\n columns,\n getRowId,\n selectedIds,\n onChangeSelected,\n selectable,\n sortBy,\n onChangeSortBy,\n sortMode,\n rowPadding,\n rowDetail,\n dataTestId,\n emptyState,\n}: GridBodyProps<T>): React.JSX.Element {\n const copy = useDataViewsCopy();\n return (\n <Box\n sx={{\n width: \"100%\",\n overflowX: \"auto\",\n mt: 1.5,\n // Tabwoah-style dense rows: MUI's default TableCell padding keeps rows\n // tall regardless of rowHeight, so the DENSITY preference is applied\n // here rather than through `rowHeight`, which it would fight.\n \"& .MuiTableCell-root\": { py: rowPadding, fontSize: sxRem(13) },\n \"& .MuiTableCell-head\": { py: 0.5, fontSize: sxRem(12) },\n }}\n >\n <DataGrid<T>\n rows={rows}\n columns={columns}\n getRowId={(row) => getRowId(row)}\n virtualizeRows={false}\n density=\"compact\"\n rowHeight={36}\n headerHeight={36}\n selection={selectable ? { mode: \"multi\", selectedRowIds: selectedIds, onChangeSelected } : { mode: \"none\" }}\n sorting={{ mode: sortMode, sortBy, onChangeSortBy }}\n expansion={toGridExpansion(rowDetail, copy)}\n data-testid={dataTestId}\n emptyState={emptyState}\n emptyText={copy.grid.emptyFilteredTitle}\n copy={copy.grid}\n />\n </Box>\n );\n}\n\n/* ── Body (list) ─────────────────────────────────────────────────────────── */\n\ninterface ListBodyProps<T extends Record<string, unknown>> {\n rows: T[];\n renderListRow: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n getRowId: (row: T) => string | number;\n selectedIds: Set<string | number>;\n /** Absent on a grid that is not selectable: rows get no toggle, so no checkbox. */\n onToggleId?: (id: string | number) => void;\n /** Gap between rows, from the density preference. */\n rowGap: number;\n /** The list's shared column config. See {@link ListGroupConfig}. */\n group?: ListGroupConfig<T>;\n /** The density every row answers, handed to the group when there is one. */\n density: DataViewsDensity;\n dataTestId?: string;\n emptyState?: React.ReactNode;\n}\n\n/**\n * The \"Lista\" layout: one FULL-WIDTH row per record, rendered by the entity — a\n * marker, a title, a subtitle and a value on the right is the shape it was\n * designed for (FUT-733).\n *\n * It sits between the table and the cards rather than replacing either: the\n * table is for comparing many columns, the cards are for browsing, and the list\n * is for scanning a queue on a narrow screen. Selection is the SAME model as\n * both — each row receives its selection state, so it can drive its own\n * checkbox and the bulk menu behaves identically in every layout.\n *\n * `scale` is handed over as 1 rather than the zoom multiplier, and the zoom\n * slider is hidden in this layout: a full-width row has no card size to\n * multiply. See {@link DataViewsZoomSlider}.\n */\nfunction ListBody<T extends Record<string, unknown>>({\n rows,\n renderListRow,\n getRowId,\n selectedIds,\n onToggleId,\n rowGap,\n group,\n density,\n dataTestId,\n emptyState,\n}: ListBodyProps<T>): React.JSX.Element {\n if (rows.length === 0) {\n return <Box sx={{ mt: 1.5 }}>{emptyState}</Box>;\n }\n const testId = dataTestId ? `${dataTestId}-list` : \"data-views-list\";\n const selectionFor = (id: string | number): DataViewCardSelection => ({\n selected: selectedIds.has(id),\n onToggleSelect: onToggleId && (() => onToggleId(id)),\n scale: 1,\n });\n\n if (group) {\n return (\n <Box sx={{ mt: 1.5 }}>\n <ListCardGroup\n cells={group.cells}\n metaColumns={group.metaColumns}\n rails={group.rails}\n // A list nobody can select holds no checkbox gutter open: reserving\n // one is how a selectable and a read-only row line up, and here no\n // row is selectable. Gutters a row DOES use still get their track.\n reserveGutters={onToggleId ? group.reserveGutters : false}\n density={density}\n gap={rowGap}\n dataTestId={testId}\n >\n {rows.map((row) => {\n const id = getRowId(row);\n // A FRAGMENT, NOT A BOX. The row is subgrid over the group's tracks\n // (`gridColumn: span railCount`), which only resolves while the card\n // is a DIRECT child of the group's grid. One wrapper element and the\n // span is measured against a grid that isn't there, so every rail\n // collapses — the exact failure the group exists to prevent.\n return (\n <React.Fragment key={id}>\n {renderListRow(row, selectionFor(id))}\n </React.Fragment>\n );\n })}\n </ListCardGroup>\n </Box>\n );\n }\n\n return (\n <Box\n sx={{ mt: 1.5, display: \"flex\", flexDirection: \"column\", gap: rowGap }}\n data-testid={testId}\n >\n {rows.map((row) => {\n const id = getRowId(row);\n return <Box key={id}>{renderListRow(row, selectionFor(id))}</Box>;\n })}\n </Box>\n );\n}\n\n/* ── Body selector (board vs list vs cards vs table, from context) ───────── */\n\ninterface GridMainProps<T extends Record<string, unknown>> {\n c: DataViewsController<T>;\n getRowId: (row: T) => string | number;\n renderCard?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /** Opt-in \"Lista\" layout — one full-width row per record. */\n renderListRow?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /** The Lista's shared columns. Omitted, each row resolves its own tracks. */\n listGroup?: ListGroupConfig<T>;\n /** Opt-in \"Quadro\" (board) layout — needs `renderCard`, since it reuses the card. */\n board?: BoardConfig<T>;\n /** Opt-in expandable rows — the TABLE only; the headerless layouts ignore it. */\n rowDetail?: DataViewRowDetail<T>;\n /** False ⇒ no selection anywhere: no checkboxes, no select-all strip. */\n selectable: boolean;\n dataTestId?: string;\n emptyState?: React.ReactNode;\n testIdPrefix: string;\n}\n\n/**\n * The headerless layouts, each preceded by its own select-all.\n *\n * The strip is rendered HERE rather than inside each body so all three agree on\n * where it sits and what it says — and so the table, which already has one in\n * its `<thead>`, never gets a second.\n */\nfunction Headerless<T extends Record<string, unknown>>({\n c,\n getRowId,\n selectable,\n testIdPrefix,\n children,\n}: {\n c: DataViewsController<T>;\n getRowId: (row: T) => string | number;\n selectable: boolean;\n testIdPrefix: string;\n children: React.ReactNode;\n}): React.JSX.Element {\n // Not selectable ⇒ no strip: a select-all over rows that cannot be selected.\n if (!selectable) return <>{children}</>;\n return (\n <>\n <SelectAllStrip\n rows={c.matched}\n getRowId={getRowId}\n selectedIds={c.selectedIds}\n onChange={(next) => c.setSelectedIds(next)}\n testIdPrefix={testIdPrefix}\n />\n {children}\n </>\n );\n}\n\n/**\n * The body for one of the three HEADERLESS layouts, or `null` for the table.\n *\n * Split out from {@link GridMain} so the select-all strip is wrapped around the\n * result exactly once instead of being repeated identically in every branch —\n * which is also what keeps either function inside the line budget.\n */\nfunction headerlessBody<T extends Record<string, unknown>>(\n { c, getRowId, renderCard, renderListRow, listGroup, board, selectable, dataTestId, emptyState }: GridMainProps<T>,\n { layout, zoom, density }: ReturnType<typeof useDataViewsLayout>,\n): React.ReactNode | null {\n // ONE switch for every headerless body: no toggle reaches a card or row, and\n // BaseCard / BaseListCard draw no checkbox for a record without one.\n const onToggleId = selectable ? c.toggleId : undefined;\n if (layout === \"list\" && renderListRow) {\n return (\n <ListBody\n rows={c.matched}\n renderListRow={renderListRow}\n getRowId={getRowId}\n selectedIds={c.selectedIds}\n onToggleId={onToggleId}\n rowGap={DENSITY_ROW_PADDING[density]}\n group={listGroup}\n density={density}\n dataTestId={dataTestId}\n emptyState={emptyState}\n />\n );\n }\n if (layout === \"board\" && board && renderCard) {\n return (\n <DataViewsBoard\n rows={c.matched}\n board={board}\n getRowId={getRowId}\n renderCard={renderCard}\n selectedIds={c.selectedIds}\n onToggleId={onToggleId}\n // DENSITY, not zoom: the board's own knob in the Exibição tab is how\n // wide its columns are, and it is the only sizing control the board\n // has since the zoom slider was removed.\n cardScale={DENSITY_BOARD_SCALE[density]}\n dataTestId={dataTestId}\n />\n );\n }\n if (layout === \"cards\" && renderCard) {\n return (\n <CardBody\n rows={c.matched}\n renderCard={renderCard}\n getRowId={getRowId}\n selectedIds={c.selectedIds}\n onToggleId={onToggleId}\n targetCardWidth={cardTargetWidthFor(zoom, density)}\n cardScale={cardScaleForZoom(zoom)}\n dataTestId={dataTestId}\n emptyState={emptyState}\n />\n );\n }\n return null;\n}\n\n/** Picks the body from the layout context: board, list, cards, or the dense grid. */\nexport function GridMain<T extends Record<string, unknown>>(props: GridMainProps<T>): React.JSX.Element {\n const { c, getRowId, selectable, dataTestId, emptyState, testIdPrefix } = props;\n const layoutState = useDataViewsLayout();\n const body = headerlessBody(props, layoutState);\n if (body) {\n return (\n <Headerless c={c} getRowId={getRowId} selectable={selectable} testIdPrefix={testIdPrefix}>\n {body}\n </Headerless>\n );\n }\n return (\n <GridBody\n rows={c.matched}\n columns={c.gridColumns}\n getRowId={getRowId}\n selectedIds={[...c.selectedIds]}\n onChangeSelected={(ids) => c.setSelectedIds(new Set(ids))}\n selectable={selectable}\n sortBy={c.state.sortBy}\n onChangeSortBy={(next: GridSort[]) => c.patch({ sortBy: next })}\n sortMode={c.serverMode ? \"server\" : \"client\"}\n rowPadding={DENSITY_ROW_PADDING[layoutState.density]}\n rowDetail={props.rowDetail}\n dataTestId={dataTestId}\n emptyState={emptyState}\n />\n );\n}\n\n"],"mappings":"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","names":["default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-shell-toolbar.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * The toolbar band, fed from the controller — ~25 props of pure forwarding and\n * nothing else, which is why it lives in its own file rather than in the shell.\n */\nimport { type ColumnVisibilityOption } from \"../../layout/ContentToolbar\";\n\nimport type { DisplayPanelView } from \"./data-views-display-panel\";\nimport type { DataViewExport } from \"./data-views-export\";\nimport { GridToolbar } from \"./data-views-toolbar\";\nimport type { RowAction } from \"./data-views-types\";\nimport type { DataViewsController } from \"./use-data-views-state\";\n\n/**\n * The toolbar band, fed from the controller. Split out of `GridShell` for that\n * function's size budget — it is ~25 props of pure forwarding and nothing else.\n */\nexport function ShellToolbar<T extends Record<string, unknown>>({\n c,\n rows,\n testIdPrefix,\n rowActions,\n bulkActions,\n selectionExtra,\n allOnPageSelected,\n toolbarRightSlot,\n showInline,\n compactControls,\n counterHidden,\n sortKinds,\n displayView,\n exportConfig,\n filterControls,\n barRef,\n}: {\n c: DataViewsController<T>;\n rows: T[];\n testIdPrefix: string;\n sortKinds?: Record<string, string>;\n displayView?: DisplayPanelView;\n exportConfig?: DataViewExport;\n rowActions?: RowAction<T>[];\n bulkActions?: (selectedRows: T[], clearSelection: () => void) => React.ReactNode;\n /** Already resolved by the shell, which is the party that knows the page. */\n selectionExtra?: React.ReactNode;\n /** Every row on the page is ticked: the select-all box reads checked, else partial. */\n allOnPageSelected?: boolean;\n toolbarRightSlot?: React.ReactNode;\n /** Search + filters, rendered on the toolbar line (see `GridToolbar`). */\n filterControls?: React.ReactNode;\n barRef?: React.Ref<HTMLDivElement>;\n showInline: boolean;\n /** Step 2 of the ladder: Exibir/Exportar as icons only. */\n compactControls?: boolean;\n /** Step 5, last resort: drop the counter so the row still fits one line. */\n counterHidden?: boolean;\n}): React.JSX.Element {\n const columnOptions: ColumnVisibilityOption[] = c.hideableColumns.map((col) => ({\n id: col.id,\n label: col.label,\n visible: c.state.visibleColumns.includes(col.id),\n }));\n return (\n <GridToolbar\n c={c}\n sortKinds={sortKinds}\n displayView={displayView}\n exportConfig={exportConfig}\n filterControls={filterControls}\n barRef={barRef}\n compactControls={compactControls}\n counterHidden={counterHidden}\n testIdPrefix={testIdPrefix}\n selectedRows={c.selectedRows}\n selectAll={c.selectAll}\n clearSelection={c.clearSelection}\n rowActions={rowActions}\n bulkActions={bulkActions}\n selectionExtra={selectionExtra}\n allOnPageSelected={allOnPageSelected}\n sortFields={c.resolvedSortFields}\n activeSortField={c.activeSortField}\n activeSortOrder={c.activeSortOrder}\n onChangeSort={(field, order) => c.patch({ sortBy: [{ id: field, dir: order }] })}\n matchedCount={c.matched.length}\n totalCount={c.serverMode ? c.serverTotalCount : rows.length}\n toolbarRightSlot={toolbarRightSlot}\n columnOptions={columnOptions}\n onToggleColumn={c.toggleColumn}\n filterOpen={c.filterOpen}\n setFilterOpen={c.setFilterOpen}\n activeFilterCount={c.activeFilterCount}\n showFilterTrigger={!showInline}\n />\n );\n}\n\n/** Wires the controller into the shared toolbar + filter panel + grid/cards body. */\n"],"mappings":";;;;;AAgEI;AA9CG,SAAS,aAAgD;AAAA,EAC9D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAsBsB;AACpB,QAAM,gBAA0C,EAAE,gBAAgB,IAAI,CAAC,SAAS;AAAA,IAC9E,IAAI,IAAI;AAAA,IACR,OAAO,IAAI;AAAA,IACX,SAAS,EAAE,MAAM,eAAe,SAAS,IAAI,EAAE;AAAA,EACjD,EAAE;AACF,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,cAAc,EAAE;AAAA,MAChB,WAAW,EAAE;AAAA,MACb,gBAAgB,EAAE;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY,EAAE;AAAA,MACd,iBAAiB,EAAE;AAAA,MACnB,iBAAiB,EAAE;AAAA,MACnB,cAAc,CAAC,OAAO,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,IAAI,OAAO,KAAK,MAAM,CAAC,EAAE,CAAC;AAAA,MAC/E,cAAc,EAAE,QAAQ;AAAA,MACxB,YAAY,EAAE,aAAa,EAAE,mBAAmB,KAAK;AAAA,MACrD;AAAA,MACA;AAAA,MACA,gBAAgB,EAAE;AAAA,MAClB,YAAY,EAAE;AAAA,MACd,eAAe,EAAE;AAAA,MACjB,mBAAmB,EAAE;AAAA,MACrB,mBAAmB,CAAC;AAAA;AAAA,EACtB;AAEJ;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-grid-parts.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\n\nimport { TableFilter } from \"../../layout/TableFilter\";\nimport { Stack } from \"../../../mui/Stack\";\n\nimport {\n DataViewsLayoutProvider,\n useDataViewsLayout,\n type DataViewsLayout,\n} from \"./data-views-layout-context\";\nimport { FilterDialog, GridFilterPanel } from \"./data-views-filter-panel\";\nimport { GridMain } from \"./data-views-grid-bodies\";\nimport type { ListGroupConfig } from \"./list-card-rails\";\nimport { InlineFilterControls } from \"./data-views-inline-bar\";\nimport { toOverflowFields, useFilterOverflow, type OverflowSplit } from \"./data-views-overflow\";\nimport { GridHeaderRow } from \"./data-views-header-row\";\nimport { allOnPageSelected, resolveSelectionExtra, type SelectionExtraRender } from \"./data-views-selection-extra\";\nimport { ShellToolbar } from \"./data-views-shell-toolbar\";\nimport type { DisplayPanelView } from \"./data-views-display-panel\";\nimport type { DataViewExport } from \"./data-views-export\";\nimport { useDataViewsCopy } from \"./data-views-copy-context\";\nimport { DataViewsEmpty } from \"./data-views-empty\";\nimport { DataViewsPagination } from \"./data-views-pagination\";\nimport type { BoardConfig } from \"./DataViewsBoard\";\nimport { type ScopeConfig } from \"./data-views-scopes\";\nimport { ScopeTabsSlot } from \"./data-views-scope-tabs\";\nimport { togglePillValues } from \"./data-views-grid-helpers\";\nimport type {\n DataViewCardSelection,\n FilterFieldConfig,\n RangeFieldConfig,\n RangeValue,\n RowAction,\n} from \"./data-views-types\";\nimport type { DataViewRowDetail } from \"./data-views-row-detail\";\nimport type { DataViewsController } from \"./use-data-views-state\";\n\n/* ── Layout ⇄ view-state mirror ──────────────────────────────────────────── */\n\n/**\n * Mirrors the LIVE layout back into the view state, so saving a view captures\n * the layout the user is actually looking at.\n *\n * A component rather than a callback prop because only something INSIDE the\n * provider can read the layout, and only the controller can write the state.\n * The `stored !== layout` guard is what makes it idempotent: `c` is rebuilt on\n * every render, so an unguarded effect here would patch → re-render → patch.\n *\n * It re-fires when `stored` changes too, which is the case that matters after\n * applying a saved view: `appliedState` REPLACES the state, so a view saved\n * before layouts were captured clears `state.layout`, and the mirror puts the\n * current one back rather than leaving the next save with nothing to store.\n */\nfunction LayoutStateSync<T extends Record<string, unknown>>({\n c,\n}: {\n c: DataViewsController<T>;\n}): null {\n const { layout } = useDataViewsLayout();\n const stored = c.state.layout;\n useEffect(() => {\n if (stored !== layout) c.patch({ layout });\n // `c` is intentionally out of the deps — see the guard above.\n }, [layout, stored]);\n return null;\n}\n\n/* ── Shell (composes toolbar + body + panel) ─────────────────────────────── */\n\n/** The shared filter-surface props consumed by the inline bar, panel, and modal. */\ninterface FilterSurfaceProps<T extends Record<string, unknown>> {\n testIdPrefix: string;\n search: string;\n fields: FilterFieldConfig<T>[];\n rangeFields: RangeFieldConfig<T>[];\n pills: Record<string, string[]>;\n ranges: Record<string, RangeValue>;\n onSearchChange: (value: string) => void;\n onTogglePill: (fieldId: string, value: string, checked: boolean) => void;\n onChangeRange: (fieldId: string, range: RangeValue) => void;\n onClearField: (fieldId: string) => void;\n onClearAll: () => void;\n}\n\n/**\n * Derives the responsive filter state (which surface to show at this width) and\n * the filter-mutation handlers from the controller — pulled out of `GridShell`\n * so the component body stays under the size/complexity budget.\n */\n/** Grouped rather than positional: the list had grown past readability. */\ninterface GridShellFiltersArgs<T extends Record<string, unknown>> {\n c: DataViewsController<T>;\n inlineFilters: boolean;\n fields: FilterFieldConfig<T>[];\n rangeFields: RangeFieldConfig<T>[];\n testIdPrefix: string;\n alwaysShowSearch: boolean;\n /** Is \"Exportar\" on the bar? Half the right cluster's cost when it is not. */\n hasExport: boolean;\n}\n\nfunction useGridShellFilters<T extends Record<string, unknown>>({\n c,\n inlineFilters,\n fields,\n rangeFields,\n testIdPrefix,\n alwaysShowSearch,\n hasExport,\n}: GridShellFiltersArgs<T>): {\n showInline: boolean;\n useModal: boolean;\n inlineVisible: boolean;\n filterProps: FilterSurfaceProps<T>;\n split: OverflowSplit<T>;\n onControlOpenChange: (open: boolean) => void;\n} {\n const { state } = c;\n // How many filter controls are open. A COUNT, not a flag: closing one popover\n // by opening another overlaps, and a boolean would unfreeze mid-handover.\n const [openControls, setOpenControls] = useState(0);\n // ONE measurement for the whole shell: the filter row decides which controls\n // it can keep, and the TOOLBAR needs the same answer to drop its labels.\n // Measuring twice would let the two disagree at the crossover width.\n const split = useFilterOverflow(\n toOverflowFields(fields, rangeFields),\n state.pills,\n c.ranges,\n openControls > 0,\n hasExport,\n );\n // THE BAR RENDERS AT EVERY WIDTH. It used to be swapped for a full-screen\n // filter MODAL below `lg`, which was the responsive strategy before the\n // measured ladder existed — and the two now do the same job, badly together:\n // the modal took the bar away at 1199px, and with it the very degradation\n // (labels off, search collapsed, filters into \"Mais\") that exists to make a\n // narrow bar work. So a 900px window got no bar and no ladder, and the\n // operator lost the search entirely rather than gaining a compact one.\n //\n // The ladder is measured, so it already covers every width the modal did.\n const showInline = inlineFilters;\n const useModal = false;\n const inlineVisible =\n showInline &&\n (alwaysShowSearch || fields.length > 0 || rangeFields.length > 0 || state.search !== \"\");\n const filterProps: FilterSurfaceProps<T> = {\n testIdPrefix,\n search: state.search,\n fields,\n rangeFields,\n pills: state.pills,\n ranges: c.ranges,\n onSearchChange: (value) => c.patch({ search: value }),\n // Updater, never the render's `state` — see {@link DataViewStatePatch}.\n onTogglePill: (fieldId, value, checked) =>\n c.patch(({ pills }) => ({ pills: { ...pills, [fieldId]: togglePillValues(pills[fieldId], value, checked) } })),\n onChangeRange: (fieldId, range) => c.patch({ ranges: { ...c.ranges, [fieldId]: range } }),\n onClearField: (fieldId) => c.patch({ pills: { ...state.pills, [fieldId]: [] } }),\n onClearAll: () => c.patch({ search: \"\", pills: {}, ranges: {} }),\n };\n return {\n showInline,\n useModal,\n inlineVisible,\n filterProps,\n split,\n onControlOpenChange: (open) =>\n setOpenControls((count) => Math.max(0, count + (open ? 1 : -1))),\n };\n}\n\ninterface GridShellProps<T extends Record<string, unknown>> {\n c: DataViewsController<T>;\n rows: T[];\n fields: FilterFieldConfig<T>[];\n rangeFields: RangeFieldConfig<T>[];\n getRowId: (row: T) => string | number;\n testIdPrefix: string;\n dataTestId?: string;\n emptyState?: React.ReactNode;\n toolbarRightSlot?: React.ReactNode;\n rowActions?: RowAction<T>[];\n bulkActions?: (selectedRows: T[], clearSelection: () => void) => React.ReactNode;\n /** A widening control beside the selection count — see `resolveSelectionExtra`. */\n selectionExtra?: SelectionExtraRender<T>;\n /** Opt-in \"Grade\" (cards) layout: renders each row as an entity-supplied card.\n * Omit ⇒ table only (no layout toggle). */\n renderCard?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /**\n * Opt-in \"Quadro\" (board) layout. Needs `renderCard` too — the board reuses\n * the entity's card, so a board config without one simply offers no board\n * rather than failing: that is a config gap, not a runtime error.\n */\n board?: BoardConfig<T>;\n /** Opt-in \"Lista\" layout: one full-width, entity-rendered row per record. */\n renderListRow?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /** The Lista's shared columns, so its rows line up by construction. */\n listGroup?: ListGroupConfig<T>;\n /** Opt-in expandable rows, drawn by the table layout only. */\n rowDetail?: DataViewRowDetail<T>;\n /** Row selection, on by default. False ⇒ no checkboxes in any layout, no select-all. */\n selectable?: boolean;\n /** The page-level partition rendered as tabs under the toolbar. */\n scopes?: ScopeConfig[];\n /**\n * The row field the scopes partition by. Compared against the board's\n * `groupBy` so the two are not shown as the same partition twice.\n */\n scopeFieldId?: string;\n /** Per-sort-field value kind, so directions read in the column's own terms. */\n sortKinds?: Record<string, string>;\n /** The saved-view chrome bracketing the Exibir panel. */\n displayView?: DisplayPanelView;\n /** Injected export — the host re-queries; the grid never fetches. */\n exportConfig?: DataViewExport;\n /** Page title in the grid's own header row, above the scopes + toolbar. */\n title?: string;\n /** Primary page actions rendered at the header row's right. */\n headerActions?: React.ReactNode;\n /** Which layout to show first when the user has expressed no preference (default \"table\"). */\n defaultLayout?: DataViewsLayout;\n /** Pin to `defaultLayout`, ignoring the remembered preference (stories/docs). */\n ignoreStoredLayout?: boolean;\n /**\n * Opt into the responsive inline filter UX: a collapsible filter row below the\n * toolbar on wide screens and a modal on narrow ones. When false (default),\n * keep the classic slide-in filter panel opened by the \"Filtros\" button.\n */\n inlineFilters?: boolean;\n /**\n * Keep the inline search box on screen even with no filter fields and no\n * active search. Without it a grid whose only filter IS the search (`fields`\n * empty) can never OFFER one: the row renders only once a search exists, so\n * the operator would have to hand-edit the URL to start one. Default false —\n * every grid that ships filter fields already shows the row.\n */\n alwaysShowSearch?: boolean;\n}\n\n/** The scrollable content region: scope tabs, toolbar, filter bar, body, pager. */\nfunction ShellStack<T extends Record<string, unknown>>({\n props,\n filters,\n}: {\n props: GridShellProps<T>;\n filters: ReturnType<typeof useGridShellFilters<T>>;\n}): React.JSX.Element {\n const copy = useDataViewsCopy();\n const { c, testIdPrefix, dataTestId, scopes = [], emptyState, inlineFilters = false } = props;\n const { showInline, useModal, inlineVisible, filterProps, split, onControlOpenChange } = filters;\n // The grid renders the FILTERED empty state itself — it is the only party\n // that knows a filter is applied. See {@link DataViewsEmpty}.\n const body = (\n <DataViewsEmpty\n filtered={c.activeFilterCount > 0 || c.state.search !== \"\"}\n onClearFilters={() => c.patch({ search: \"\", pills: {}, ranges: {} })}\n emptyState={emptyState}\n testIdPrefix={testIdPrefix}\n />\n );\n return (\n <TableFilter\n copy={copy.tableFilter} open={c.filterOpen} onOpenChange={c.setFilterOpen}\n hasActiveFilters={c.activeFilterCount > 0}\n >\n <Stack spacing={0} data-testid={dataTestId ? `${dataTestId}-container` : undefined}>\n <GridHeaderRow title={props.title} headerActions={props.headerActions} testIdPrefix={testIdPrefix} />\n <ShellToolbar\n c={c}\n rows={props.rows}\n sortKinds={props.sortKinds}\n displayView={props.displayView}\n exportConfig={props.exportConfig}\n filterControls={\n inlineVisible ? (\n <InlineFilterControls\n {...filterProps} split={split} activeFilterCount={c.activeFilterCount}\n onControlOpenChange={onControlOpenChange}\n />\n ) : undefined\n }\n barRef={split.barRef}\n testIdPrefix={testIdPrefix}\n rowActions={props.rowActions}\n bulkActions={props.bulkActions}\n selectionExtra={resolveSelectionExtra(props)}\n allOnPageSelected={allOnPageSelected(c, props.getRowId)}\n toolbarRightSlot={props.toolbarRightSlot}\n compactControls={showInline && split.compactControls}\n counterHidden={showInline && split.counterHidden}\n showInline={showInline}\n />\n <ScopeTabsSlot\n scopes={scopes} scopeFieldId={props.scopeFieldId} board={props.board}\n value={c.scope} onChange={c.setScope} counts={c.scopeCounts}\n testIdPrefix={testIdPrefix}\n />\n <TableFilter.Layout>\n <TableFilter.Main>\n <GridMain\n c={c}\n getRowId={props.getRowId}\n renderCard={props.renderCard}\n renderListRow={props.renderListRow}\n listGroup={props.listGroup}\n board={props.board}\n rowDetail={props.rowDetail} selectable={props.selectable !== false}\n dataTestId={dataTestId}\n testIdPrefix={testIdPrefix}\n emptyState={body}\n />\n <DataViewsPagination c={c} testIdPrefix={testIdPrefix} />\n </TableFilter.Main>\n {inlineFilters ? null : <GridFilterPanel {...filterProps} />}\n </TableFilter.Layout>\n {useModal && <FilterDialog open={c.filterOpen} onClose={() => c.setFilterOpen(false)} {...filterProps} />}\n </Stack>\n </TableFilter>\n );\n}\n\nexport function GridShell<T extends Record<string, unknown>>(props: GridShellProps<T>): React.JSX.Element {\n const {\n c,\n fields,\n rangeFields,\n testIdPrefix,\n renderCard,\n renderListRow,\n board,\n defaultLayout,\n ignoreStoredLayout,\n inlineFilters = false,\n alwaysShowSearch = false,\n } = props;\n const filters = useGridShellFilters({\n c,\n inlineFilters,\n fields,\n rangeFields,\n testIdPrefix,\n alwaysShowSearch,\n hasExport: props.exportConfig !== undefined,\n });\n return (\n <DataViewsLayoutProvider\n canUseCards={Boolean(renderCard)}\n canUseList={Boolean(renderListRow)}\n // The board reuses the entity's card, so it needs BOTH — a `board` with no\n // `renderCard` offers no board rather than throwing.\n canUseBoard={Boolean(board && renderCard)}\n defaultLayout={defaultLayout}\n ignoreStoredLayout={ignoreStoredLayout}\n viewLayout={c.state.layout}\n >\n <LayoutStateSync c={c} />\n <ShellStack props={props} filters={filters} />\n </DataViewsLayoutProvider>\n );\n}\n"],"mappings":"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","names":["default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/DataViewsGrid.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useRef } from \"react\";\n\nimport { type SortFieldDefinition } from \"../../layout/ContentToolbar\";\n\nimport { GridShell } from \"./data-views-grid-parts\";\nimport type { SelectionExtraRender } from \"./data-views-selection-extra\";\nimport type { ListGroupConfig } from \"./list-card-rails\";\nimport type { DisplayPanelView } from \"./data-views-display-panel\";\nimport type { BoardConfig } from \"./DataViewsBoard\";\nimport type { DataViewExport } from \"./data-views-export\";\nimport type { ScopeConfig } from \"./data-views-scopes\";\nimport type { DataViewCardSelection } from \"./data-views-types\";\nimport {\n type DataViewColumn,\n type DataViewsLayout,\n type DataViewServer,\n type DataViewState,\n type DataViewSyncState,\n type FilterFieldConfig,\n type RangeFieldConfig,\n type RowAction,\n} from \"./data-views-types\";\nimport type { DataViewRowDetail } from \"./data-views-row-detail\";\nimport { useDataViewsState } from \"./use-data-views-state\";\n\ninterface DataViewsGridProps<T extends Record<string, unknown>> {\n rows: T[];\n columns: DataViewColumn<T>[];\n fields: FilterFieldConfig<T>[];\n /** Optional numeric min/max range filters (advanced \"filter by amount\"). */\n rangeFields?: RangeFieldConfig<T>[];\n getRowId: (row: T) => string | number;\n /** Row click opens the row; clicks in the actions column are ignored. */\n onRowClick?: (row: T) => void;\n emptyState?: React.ReactNode;\n dataTestId?: string;\n testIdPrefix?: string;\n /** Seed/replace the view state. A NEW reference re-applies (used to apply a saved view). */\n appliedState?: DataViewState;\n /**\n * URL-driven controls (search/pills/ranges/sort) that RE-APPLY on reference\n * change while preserving column visibility — for server-mode lists that keep\n * their filter/sort/page in the address bar (see {@link DataViewSyncState}).\n */\n syncState?: DataViewSyncState;\n /** Notified on every view-state change (so a save-view modal can read it). */\n onStateChange?: (state: DataViewState) => void;\n /**\n * Notified with the currently-visible (search + filter matched) rows whenever\n * they change — so a page-level Export exports what the user sees, not the\n * full dataset.\n */\n onVisibleRowsChange?: (rows: T[]) => void;\n /** Saved-views UI injected into the toolbar (FUT-89). */\n toolbarRightSlot?: React.ReactNode;\n /**\n * The saved-view chrome for the Exibir panel: its VISÃO header (with the\n * views dropdown) and its Redefinir / Salvar visão footer. Supplied by\n * `DataViewsTableBase`; without it the panel is tabs only.\n */\n displayView?: DisplayPanelView;\n /** Big page title in the header row (next to the funnel + gear). */\n title?: string;\n /** Primary page actions rendered at the header's right. */\n headerActions?: React.ReactNode;\n /**\n * Sort options for the toolbar's \"Sort By\" dropdown. Defaults to the sortable\n * columns (asc/desc each) when omitted.\n */\n sortFields?: SortFieldDefinition[];\n /**\n * Per-sort-field VALUE KIND (`\"currency\" | \"number\" | \"date\" | \"text\"`), so the\n * Exibir panel phrases the direction in that column's own terms. \"Crescente\"\n * on a currency column is a puzzle; \"Menor → maior\" is not. Defaults to text.\n */\n sortKinds?: Record<string, string>;\n /**\n * Opt-in \"Exportar\" control. The grid hands the host the current query,\n * UNPAGINATED, and the host re-queries — the grid never fetches, and an\n * export therefore follows the filters rather than the loaded page.\n */\n exportConfig?: DataViewExport;\n /**\n * A single, reusable list of row actions that drives BOTH the per-row \"⋮\"\n * kebab AND the bulk-actions menu (tabwoah model). When provided, the grid\n * appends a kebab actions column automatically (unless the page already\n * defines one) and shows an \"Ações\" bulk menu when rows are selected.\n */\n rowActions?: RowAction<T>[];\n /**\n * Extra leading control rendered in the auto kebab column, before the \"⋮\"\n * (e.g. a favourite star). Only used when `rowActions` is set.\n */\n rowActionsLeading?: (row: T) => React.ReactNode;\n /**\n * Low-level override for the selection bulk control. Prefer `rowActions`.\n * Receives the selected rows + a `clearSelection` callback.\n */\n bulkActions?: (selectedRows: T[], clearSelection: () => void) => React.ReactNode;\n /**\n * A control rendered beside the \"N selected\" count, for changing WHAT is\n * selected rather than what happens to it — a \"select all N matching the\n * filter\" widening, above all.\n *\n * Called only while something is selected, and handed\n * {@link SelectionExtraContext.allOnPageSelected} so the control can follow\n * the convention operators already know: the widening appears once the whole\n * page is ticked, and not before.\n */\n selectionExtra?: SelectionExtraRender<T>;\n /**\n * Render a bespoke per-row menu in the actions column instead of the auto\n * kebab — typically an entity's self-contained 3-dots menu that owns its own\n * popups, so the SAME menu component drives both the table row and the card.\n * `rowActions`/`bulkActions` still drive the multi-row bulk menu.\n */\n renderRowMenu?: (row: T) => React.ReactNode;\n /**\n * Row selection — on by default. `false` opts the grid out entirely: no\n * checkbox column in the table (and no width reserved for one), no checkbox\n * or checkbox gutter on cards and list rows, no select-all strip and no\n * count. With nothing selectable, the toolbar's selection mode never takes\n * over the search, the filter pills and Exportar. For a grid with no bulk\n * action, where a selection could only hide the toolbar. Row click and the\n * row menu are unaffected.\n */\n selectable?: boolean;\n /**\n * Opt-in expandable rows (table layout only): a chevron in a leading column\n * opens `render(row)` under the row. See {@link DataViewRowDetail}.\n */\n rowDetail?: DataViewRowDetail<T>;\n /**\n * Opt-in \"Grade\" (cards) layout. When provided, a Grade/Tabela toggle appears in\n * the toolbar and the cards body renders each visible row via this function\n * (reusing the same search/filter/sort). Omit ⇒ table only (unchanged).\n */\n renderCard?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /**\n * Opt-in \"Quadro\" (board) layout: the loaded page laid out as columns of one\n * grouping field. Reuses `renderCard`, so supplying a board WITHOUT one simply\n * offers no board. Best when the groups are states in a state machine — derive\n * these groups and `scopes` from ONE definition so the two cannot drift.\n */\n board?: BoardConfig<T>;\n /**\n * Opt-in \"Lista\" layout (FUT-733): one FULL-WIDTH row per record, rendered by\n * the entity — a marker, a title, a subtitle and a value on the right. Sits\n * between the table (compare columns) and the cards (browse); omit ⇒ not\n * offered, exactly as `renderCard` gates the cards.\n */\n renderListRow?: (row: T, selection: DataViewCardSelection) => React.ReactNode;\n /**\n * The Lista's SHARED COLUMNS — declared once for the list, obeyed by every row.\n *\n * This is what makes a list line up by construction rather than by convention.\n * Omit it and each row still resolves its own tracks from its own config,\n * which agrees with its neighbours right up until one row carries an unusually\n * wide value.\n */\n listGroup?: ListGroupConfig<T>;\n /**\n * The page-level partition rendered as an exclusive tab strip above the\n * toolbar, with server-supplied counts. Requires `server`: a scope is applied\n * at the backend, never in the browser.\n */\n scopes?: ScopeConfig[];\n /** The row field the scopes partition by — used only to reject a pill over the same field. */\n scopeFieldId?: string;\n /** Which layout to show first when the user has expressed no preference (default \"table\"). */\n defaultLayout?: DataViewsLayout;\n /**\n * Ignore the remembered cross-screen layout preference and pin to\n * `defaultLayout`. For tables that exist to SHOW a layout — stories, docs,\n * screenshots — not for real screens.\n */\n ignoreStoredLayout?: boolean;\n /**\n * Opt into the responsive inline filter UX (collapsible filter row on wide\n * screens, modal on narrow). Default `false` keeps the classic slide-in panel.\n */\n inlineFilters?: boolean;\n /** Keep the inline search visible with no filter fields and no active search. */\n alwaysShowSearch?: boolean;\n /** Server-mode wiring; when set the grid is backend-driven (no client filter/sort/paginate). */\n server?: DataViewServer;\n}\n\n/**\n * Surface the visible (filtered) rows so a page-level Export matches the view.\n *\n * Pages pass inline column/field arrays, so `matched` is a fresh reference on\n * every render even when its contents are unchanged. The guard is a signature\n * over the rows' *contents* (not just their ids), so the callback — and the\n * parent `useState` it usually drives — fires only when the visible data\n * actually changes. Ids alone are not enough: a server refresh can change a\n * visible row's values while keeping its id, and the export must reflect them.\n * Content-equal renders keep the same signature, so this never loops.\n */\nfunction useVisibleRowsNotifier<T>(matched: T[], onVisibleRowsChange?: (rows: T[]) => void): void {\n const visibleSignature = JSON.stringify(matched);\n const lastSignature = useRef<string | null>(null);\n useEffect(() => {\n if (lastSignature.current === visibleSignature) return;\n lastSignature.current = visibleSignature;\n onVisibleRowsChange?.(matched);\n }, [visibleSignature, matched, onVisibleRowsChange]);\n}\n\n/**\n * The reusable admin DataViews table (FUT-88): the shared ContentToolbar +\n * TableFilter panel over `@12-apps/ui` DataGrid. State + derived data live in\n * {@link useDataViewsState}; the render lives in `GridShell`. This component just\n * connects the two. Reused across every admin list page.\n */\nexport function DataViewsGrid<T extends Record<string, unknown>>(\n props: DataViewsGridProps<T>,\n): React.JSX.Element {\n // Forwarded as a whole rather than restated name-by-name twice: this component\n // only ADDS the controller, and a 25-name destructure repeated in the JSX is\n // where a newly added prop silently stops being passed on.\n const { rangeFields = [], testIdPrefix = \"table\" } = props;\n const controller = useDataViewsState({ ...props, rangeFields, testIdPrefix });\n useVisibleRowsNotifier(controller.matched, props.onVisibleRowsChange);\n return <GridShell {...props} c={controller} rangeFields={rangeFields} testIdPrefix={testIdPrefix} />;\n}\n"],"mappings":";;;;;;;;AAEA,SAAS,WAAW,cAAc;AAgOzB;AAzBT,SAAS,uBAA0B,SAAc,qBAAiD;AAChG,QAAM,mBAAmB,KAAK,UAAU,OAAO;AAC/C,QAAM,gBAAgB,OAAsB,IAAI;AAChD,YAAU,MAAM;AACd,QAAI,cAAc,YAAY,iBAAkB;AAChD,kBAAc,UAAU;AACxB,0BAAsB,OAAO;AAAA,EAC/B,GAAG,CAAC,kBAAkB,SAAS,mBAAmB,CAAC;AACrD;AAQO,SAAS,cACd,OACmB;AAInB,QAAM,EAAE,cAAc,CAAC,GAAG,eAAe,QAAQ,IAAI;AACrD,QAAM,aAAa,kBAAkB,EAAE,GAAG,OAAO,aAAa,aAAa,CAAC;AAC5E,yBAAuB,WAAW,SAAS,MAAM,mBAAmB;AACpE,SAAO,oBAAC,aAAW,GAAG,OAAO,GAAG,YAAY,aAA0B,cAA4B;AACpG;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/DataViews/data-views-types.ts"],"sourcesContent":["import type { GridColumn, GridSort } from \"../DataGrid\";\nimport type { DropdownMenuItem } from \"../../navigation/DropdownMenu\";\n// A re-export does not bring the name into local scope, and the state/query\n// types below are written in terms of it.\nimport type { RangeValue } from \"./data-views-range-types\";\n\n/**\n * Shared types for the reusable admin \"DataViews\" table (FUT-88): a filter bar\n * (search-across-all + typed multi-select pills + column visibility) whose full\n * state — filters + sort + visible columns — a saved view (FUT-89) can capture\n * and restore. Each table declares its own columns + filter fields.\n */\n\n/**\n * A single, reusable row action. ONE definition drives BOTH the per-row \"⋮\"\n * kebab menu and the bulk-actions menu (tabwoah model): `onSelect` receives the\n * affected rows — `[row]` from a kebab, the whole selection from the bulk menu.\n * Single-item-only actions (e.g. \"Editar\") set `bulk: false` so they never\n * appear in the bulk menu.\n */\nexport interface RowAction<T extends Record<string, unknown>> {\n /** Stable id (also the `data-testid` suffix). */\n id: string;\n /** Menu label. In the kebab, `rowLabel` overrides it per row when provided. */\n label: string;\n /** Menu-item colour (e.g. `\"error\"` for destructive). */\n color?: DropdownMenuItem[\"color\"];\n /**\n * Runs on the affected rows: `[row]` from the kebab, all selected from bulk.\n * May be async — the bulk menu awaits it and only clears the selection once it\n * settles (keeping the selection on failure so the user can retry).\n */\n onSelect: (rows: T[]) => void | Promise<void>;\n /** Include in the bulk menu (2+ selected). Defaults to `true`. */\n bulk?: boolean;\n /** Include in the per-row kebab. Defaults to `true`. */\n row?: boolean;\n /** Per-row kebab label (e.g. `row.active ? \"Inativar\" : \"Ativar\"`). */\n rowLabel?: (row: T) => string;\n /**\n * Per-row applicability (e.g. state-machine guards). `false` hides the\n * kebab item for that row; in bulk the action runs only on the passing\n * rows and is dropped when none pass. Defaults to applicable.\n */\n isVisible?: (row: T) => boolean;\n}\n\n/** Selection state handed to a card renderer so it can drive its own checkbox. */\nexport interface DataViewCardSelection {\n selected: boolean;\n /** Absent when the grid is `selectable={false}`: pass it on as-is, and no checkbox is drawn. */\n onToggleSelect?: () => void;\n /**\n * Card SIZE multiplier from the toolbar zoom slider. The grid sizes the card's\n * width to `base × scale`; a card passes this to {@link BaseCard} `scale` so its\n * padding + typography grow by the same factor — the whole card scales together\n * (scale 2 → ~2× size). The proportion (aspect ratio) stays constant.\n */\n scale: number;\n}\n\n/**\n * The fixed proportions a {@link BaseCard} tile can take. The tile keeps this\n * ratio and grows in BOTH width and height as the zoom slider widens its grid\n * track, so a grid of cards stays visually uniform.\n */\nexport type CardAspectRatio = \"1:1\" | \"4:3\" | \"16:9\" | \"9:16\" | \"3:4\" | \"3:1\";\n\n/** Numeric width/height factor for each {@link CardAspectRatio} (CSS `aspect-ratio`). */\nexport const CARD_ASPECT_RATIOS: Record<CardAspectRatio, number> = {\n \"1:1\": 1,\n \"4:3\": 4 / 3,\n \"16:9\": 16 / 9,\n \"9:16\": 9 / 16,\n \"3:4\": 3 / 4,\n /**\n * The BANNER tile: too short for media, sized for two lines of text.\n *\n * Every other ratio here is picture-shaped, because they were added for cards\n * built around a thumbnail. A card whose subject is a NAME and a NUMBER — a\n * cart, an order, anything triaged rather than browsed — spends most of a 4:3\n * tile on an icon that repeats down the whole grid and says nothing.\n */\n \"3:1\": 3,\n};\n\n/** One selectable value inside a filter pill. */\nexport interface FilterOption {\n value: string;\n label: string;\n /**\n * Parent option's `value`, for a hierarchical field (`control: \"category\"`).\n * Ignored by the flat controls, so one option list serves both.\n */\n parentId?: string | null;\n}\n\n/** A typed, multi-select filter pill's configuration for a table. */\nexport interface FilterFieldConfig<T extends Record<string, unknown>> {\n /** Stable id; also the default row key when no `accessor` is given. */\n id: string;\n label: string;\n options: FilterOption[];\n /**\n * How the field renders in the filter panel. `checkboxes` (default) is best for\n * a few fixed options; `multiselect` is a compact dropdown for long option\n * lists; `category` is the hierarchical picker, for an option set that nests\n * via {@link FilterOption.parentId} — it renders parents as headings and\n * their children as the selectable rows, rather than flattening the tree into\n * one indistinguishable list.\n */\n control?: \"checkboxes\" | \"multiselect\" | \"category\";\n /**\n * Lets a `control: \"category\"` pill select a PARENT category, not just its\n * children. Off by default, which keeps the leaf-only reading: the parent is\n * a heading and its subcategories are the rows you tick.\n *\n * Turn it on where \"the whole category\" is a filter a user would reach for —\n * selecting a parent then selects every subcategory under it, and the chip\n * tray collapses that back to one chip bearing the category's name.\n *\n * A category with NO children is selectable either way: it is itself the\n * leaf, so the flag has nothing to gate there.\n */\n allowParentSelection?: boolean;\n /**\n * Forces this filter to render as a searchable multi-select dropdown with the\n * search box always shown, regardless of how many options are currently\n * loaded. Use it when the option set can grow unbounded (e.g. a filter backed\n * by a relation such as Roles or Categories). Omit it for a closed value set\n * (an enum), which keeps the plain checkbox / \"search only when long\"\n * behavior.\n */\n searchEnabled?: boolean;\n /**\n * Reads the row's value(s) for this field. A row matches the pill when any of\n * its values is selected. Defaults to `String(row[id])`.\n */\n accessor?: (row: T) => string | string[];\n}\n\n/**\n * The range types live in `data-views-range-types` (this file outgrew the\n * size gate); they are re-exported here so `data-views-types` stays the one\n * name every consumer imports the model from.\n */\nexport type {\n DayRangeFieldConfig,\n NumberRangeFieldConfig,\n RangeFieldConfig,\n RangeFieldKind,\n RangePreset,\n RangeValue,\n} from \"./data-views-range-types\";\n\n/** A grid column that can join the search scan and the column-visibility menu. */\nexport interface DataViewColumn<T extends Record<string, unknown>> extends GridColumn<T> {\n /** Included in \"search across all columns\" (needs a resolvable value). */\n searchable?: boolean;\n /** Toggleable in the column-visibility menu. Defaults to true; set false for\n * structural columns (image thumbnail, actions kebab) that must always show. */\n hideable?: boolean;\n}\n\n/**\n * The DataViews layout (view type): the dense \"Tabela\" grid, the \"Grade\" of\n * cards, the \"Lista\" of full-width rows, or the \"Quadro\" board of state columns.\n * Lives with the state types rather than with the toggle because a saved view\n * CAPTURES it — see {@link DataViewState.layout}.\n */\nexport type DataViewsLayout = \"cards\" | \"list\" | \"board\" | \"table\";\n\n/** The full, serializable state a view captures. */\n/**\n * A view-state patch: the fields to merge, or an updater given the CURRENT\n * state. Use the updater whenever the patch derives from state it also changes\n * — a render-scoped snapshot would let two calls in one tick read the same\n * `prev` and the second overwrite the first, which is exactly what a control\n * emitting one call per changed value does.\n */\nexport type DataViewStatePatch =\n | Partial<DataViewState>\n | ((prev: DataViewState) => Partial<DataViewState>);\n\nexport interface DataViewState {\n /** Free text matched across every `searchable` column. */\n search: string;\n /** fieldId → selected option values (empty/absent = no constraint). */\n pills: Record<string, string[]>;\n /** fieldId → selected numeric range (min/max). Absent/empty = no constraint. */\n ranges?: Record<string, RangeValue>;\n sortBy: GridSort[];\n /** Column ids kept visible; a hideable column not listed here is hidden. */\n visibleColumns: string[];\n /**\n * Column ids in READING ORDER. Absent ⇒ the order the table declared them in.\n *\n * Order is view state for the same reason visibility is: reordering columns is\n * an operator deciding what to read FIRST, and a saved view that restored the\n * columns but not their order would restore half a decision. Ids the table no\n * longer declares are ignored at render, and ids missing from a stale list\n * fall in after it — so a column added since the view was saved appears rather\n * than disappearing.\n */\n order?: string[];\n /**\n * The active SCOPE id — the page-level partition the scope tabs select (see\n * `ScopeConfig`). Optional, so a table that declares no scopes is untouched\n * and no view persisted before scopes existed breaks.\n *\n * Stored raw and RESOLVED at read time: the declared scopes change underneath\n * a saved view, and a view naming a scope that has since been removed must\n * fall back at render rather than break.\n */\n scope?: string;\n /**\n * The layout the view was saved in. Optional — absent means \"whatever the user\n * is currently using\", which is the pre-existing behaviour.\n *\n * A LAYOUT FALLBACK IS NOT A LAYOUT CHANGE: a table rendered as stacked rows\n * on a phone still has `\"table\"` stored here, so the view round-trips the\n * stored layout regardless of the device that opened it.\n */\n layout?: DataViewsLayout;\n}\n\n/** A pristine view state showing every given column and no filters/sort. */\nexport function emptyViewState(visibleColumns: string[]): DataViewState {\n return { search: \"\", pills: {}, ranges: {}, sortBy: [], visibleColumns };\n}\n\n/**\n * The URL-driven slice of {@link DataViewState} — the controls a server-mode host\n * mirrors from the address bar (search / pills / ranges / sort), WITHOUT\n * `visibleColumns`. Supplying it re-applies those controls when its reference\n * changes (e.g. browser back/forward or a deep-link on the same route), merging\n * over the current state so a user's show/hide column choices are preserved —\n * unlike `appliedState`, which fully replaces the state to apply a saved view.\n */\nexport type DataViewSyncState = Pick<\n DataViewState,\n \"search\" | \"pills\" | \"ranges\" | \"sortBy\" | \"scope\"\n>;\n\n/**\n * The query a SERVER-mode table emits whenever its filter/sort/page changes\n * (FUT-180). The host translates this into a backend request (see\n * `@12-apps/shared-helpers/search`) — in server mode the grid never filters,\n * sorts, or paginates in the browser; it renders exactly the page the server\n * returned. `page` is 1-based to match the backend contract.\n */\nexport interface DataViewQuery {\n search: string;\n pills: Record<string, string[]>;\n ranges: Record<string, RangeValue>;\n sortBy: GridSort[];\n /**\n * The RESOLVED active scope (see `resolveScope`), when the table declares\n * scopes. The KEY IS ABSENT for a table that declares none — not present-and-\n * undefined — so a host that never opted in sees a byte-identical query.\n *\n * It carries the resolved id, never the stored one: a deep link or a saved\n * view naming a scope the table no longer declares must not put that id on the\n * wire, where the backend would reject it and replace the page with an error.\n */\n scope?: string;\n page: number;\n pageSize: number;\n}\n\n/**\n * Server-mode wiring for a DataViews table. Its PRESENCE flips the table from\n * in-browser filtering/sorting/pagination to backend-driven: the rows handed in\n * are already the current page, `totalCount` is the unpaginated total, and\n * `onQueryChange` fires (search debounced by the host) whenever the user changes\n * a filter, the sort, or the page. This is the ONLY way an admin list should run\n * (see the app-side `DataViewsTable` wrapper, which requires it).\n */\nexport interface DataViewServer {\n /** Total matched rows across all pages (drives the counter + page count). */\n totalCount: number;\n /** Current 1-based page. */\n page: number;\n /** Rows per page. */\n pageSize: number;\n /** Fired when the effective query changes; the host re-fetches the page. */\n onQueryChange: (query: DataViewQuery) => void;\n /**\n * Per-scope totals for the scope tabs: `scopeId → count`. THE ONLY PIECE OF\n * THIS CONTRACT THAT CANNOT BE DONE CLIENT-SIDE — a count computed from the\n * loaded page is wrong the moment there is a second page, which is the\n * concrete bug scopes exist to fix.\n *\n * Compute it over search + pills + ranges while IGNORING the active scope.\n * Computed WITH the scope applied, every inactive tab reads zero, which is\n * worse than no counts at all.\n *\n * Omit it and the tabs render with no numbers. Nothing is ever invented from\n * the loaded rows to fill the gap.\n */\n scopeCounts?: Record<string, number>;\n}\n\n/**\n * Coerce an opaque persisted state (a saved view's JSON) into a valid\n * DataViewState, filling any missing part with a sane default. Guards against\n * legacy/older shapes so applying a saved view never renders an empty grid.\n */\nexport function coerceViewState(raw: unknown, allColumnIds: string[]): DataViewState {\n const value = (raw ?? {}) as Partial<DataViewState>;\n return {\n search: typeof value.search === \"string\" ? value.search : \"\",\n pills: asRecord<string[]>(value.pills),\n ranges: asRecord<RangeValue>(value.ranges),\n sortBy: Array.isArray(value.sortBy) ? value.sortBy : [],\n visibleColumns: Array.isArray(value.visibleColumns) ? value.visibleColumns : allColumnIds,\n order: Array.isArray(value.order) ? value.order : undefined,\n // Carried through UNVALIDATED against the declared scopes on purpose: a view\n // written before scopes existed has none (⇒ undefined ⇒ the first declared\n // scope at render), and one naming a since-removed scope keeps its stored id\n // here and falls back at READ time. Resolving here would rewrite the view.\n scope: typeof value.scope === \"string\" ? value.scope : undefined,\n layout: isLayout(value.layout) ? value.layout : undefined,\n };\n}\n\n/** Every layout this build knows how to render — the guard's single source. */\nexport const DATA_VIEWS_LAYOUTS: readonly DataViewsLayout[] = [\"cards\", \"list\", \"board\", \"table\"];\n\n/** Is this a layout this build knows how to render? Guards persisted JSON. */\nfunction isLayout(value: unknown): value is DataViewsLayout {\n return DATA_VIEWS_LAYOUTS.includes(value as DataViewsLayout);\n}\n\n/** A persisted map, or an empty one — persisted JSON can hold anything. */\nfunction asRecord<V>(value: unknown): Record<string, V> {\n return value !== null && typeof value === \"object\" ? (value as Record<string, V>) : {};\n}\n\n/** A saved view as consumed by the DataViews UI (FUT-89), with ownership flag. */\nexport interface SavedViewSummary {\n id: string;\n name: string;\n description: string | null;\n state: DataViewState;\n shared: boolean;\n pinned: boolean;\n isDefault: boolean;\n /** True when the current user owns the view (may edit/delete/pin/share it). */\n isOwner: boolean;\n}\n\n/** A saved-view repository record (opaque `state`), as returned to server pages. */\ninterface SavedViewRecordLike {\n id: string;\n name: string;\n description: string | null;\n state: unknown;\n shared: boolean;\n pinned: boolean;\n isDefault: boolean;\n isOwner: boolean;\n}\n\n/** Map a repository record to the client summary (opaque state → DataViewState). */\nexport function toSavedViewSummary(record: SavedViewRecordLike): SavedViewSummary {\n return { ...record, state: (record.state ?? {}) as DataViewState };\n}\n\n/**\n * Dependency-injection contracts for the framework-agnostic DataViewsTableBase:\n * the host app supplies saved-view persistence + router side-effects so the ui\n * component imports neither a backend (server actions) nor a framework router.\n */\n\n/** A saved view's editable fields, as the host persists them. */\nexport interface DataViewSaveInput {\n name: string;\n description: string;\n state: DataViewState;\n shared: boolean;\n pinned: boolean;\n isDefault: boolean;\n}\n\n/** Result of a persistence call — mirrors the app's `Result` without importing it. */\nexport type DataViewMutationResult = { ok: true } | { ok: false; error: string };\n\n/** Injected saved-view persistence (create/update/delete), wired by the host. */\nexport interface DataViewPersistence {\n create: (input: DataViewSaveInput) => Promise<DataViewMutationResult>;\n update: (id: string, input: DataViewSaveInput) => Promise<DataViewMutationResult>;\n remove: (id: string) => Promise<DataViewMutationResult>;\n}\n\n/** Injected router side-effects: sync the `?view=` param and re-fetch on change. */\nexport interface DataViewRouter {\n syncViewParam: (viewId: string | null) => void;\n refresh: () => void;\n}\n"],"mappings":";AAqEO,IAAM,qBAAsD;AAAA,EACjE,OAAO;AAAA,EACP,OAAO,IAAI;AAAA,EACX,QAAQ,KAAK;AAAA,EACb,QAAQ,IAAI;AAAA,EACZ,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASX,OAAO;AACT;AA+IO,SAAS,eAAe,gBAAyC;AACtE,SAAO,EAAE,QAAQ,IAAI,OAAO,CAAC,GAAG,QAAQ,CAAC,GAAG,QAAQ,CAAC,GAAG,eAAe;AACzE;AA+EO,SAAS,gBAAgB,KAAc,cAAuC;AACnF,QAAM,QAAS,OAAO,CAAC;AACvB,SAAO;AAAA,IACL,QAAQ,OAAO,MAAM,WAAW,WAAW,MAAM,SAAS;AAAA,IAC1D,OAAO,SAAmB,MAAM,KAAK;AAAA,IACrC,QAAQ,SAAqB,MAAM,MAAM;AAAA,IACzC,QAAQ,MAAM,QAAQ,MAAM,MAAM,IAAI,MAAM,SAAS,CAAC;AAAA,IACtD,gBAAgB,MAAM,QAAQ,MAAM,cAAc,IAAI,MAAM,iBAAiB;AAAA,IAC7E,OAAO,MAAM,QAAQ,MAAM,KAAK,IAAI,MAAM,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,IAKlD,OAAO,OAAO,MAAM,UAAU,WAAW,MAAM,QAAQ;AAAA,IACvD,QAAQ,SAAS,MAAM,MAAM,IAAI,MAAM,SAAS;AAAA,EAClD;AACF;AAGO,IAAM,qBAAiD,CAAC,SAAS,QAAQ,SAAS,OAAO;AAGhG,SAAS,SAAS,OAA0C;AAC1D,SAAO,mBAAmB,SAAS,KAAwB;AAC7D;AAGA,SAAS,SAAY,OAAmC;AACtD,SAAO,UAAU,QAAQ,OAAO,UAAU,WAAY,QAA8B,CAAC;AACvF;AA4BO,SAAS,mBAAmB,QAA+C;AAChF,SAAO,EAAE,GAAG,QAAQ,OAAQ,OAAO,SAAS,CAAC,EAAoB;AACnE;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/feedback/StackedModal/StackedModal.tsx"],"sourcesContent":["import Dialog from '@mui/material/Dialog/index.js';\nimport Slide from '@mui/material/Slide/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport type { TransitionProps } from '@mui/material/transitions/index.js';\nimport type { FC } from 'react';\nimport React, { forwardRef, useEffect, useId } from 'react';\nimport { usePanelChrome } from './StackedModal.hooks';\nimport { modalAriaIds, ModalPanelContents, resolveModalContent } from './StackedModal.parts';\nimport type { PanelStyleProps } from './StackedModal.styles';\nimport { dialogRootStyles, STYLE_ONLY_PROPS } from './StackedModal.styles';\nimport type { StackedModalProps } from './StackedModal.types';\n\nconst StyledDialog = styled(Dialog, {\n shouldForwardProp: (prop) => !STYLE_ONLY_PROPS.includes(prop as string),\n})<PanelStyleProps>(({ theme, ...props }) => dialogRootStyles(theme, props));\n\n/** Panels slide in from the right on every device. */\nconst SlideTransition = forwardRef<HTMLDivElement, TransitionProps>(\n function SlideTransition(props, ref) {\n return (\n <Slide direction=\"left\" ref={ref} {...props}>\n {props.children as React.ReactElement}\n </Slide>\n );\n },\n);\n\nconst DEFAULTS: Partial<StackedModalProps> = {\n open: false,\n glass: false,\n navigationTitle: '',\n closeOnClickOutside: true,\n closeOnEsc: true,\n loading: false,\n loadingText: 'Loading...',\n maxWidth: false,\n disableBackdrop: false,\n disableFocusTrap: false,\n keepMounted: false,\n rtl: false,\n};\n\n/**\n * Fills in the defaults for props the caller left `undefined`. A table plus one\n * loop, rather than a default per destructured prop — each of those is a branch,\n * and fifteen of them put the component over the complexity bar on their own.\n */\nconst withDefaults = (props: StackedModalProps): StackedModalProps => {\n const resolved = { ...props };\n for (const [key, value] of Object.entries(DEFAULTS)) {\n const prop = key as keyof StackedModalProps;\n if (resolved[prop] === undefined) {\n Object.assign(resolved, { [prop]: value });\n }\n }\n return resolved;\n};\n\n/** The modal's props once defaults are applied and its stack identity is settled. */\ntype ResolvedProps = StackedModalProps & { modalId: string };\n\n/**\n * `hideHeader` removes the bar that names the dialog; without an\n * `aria-labelledby` of the caller's own, the dialog has no accessible name.\n */\nconst useUnnamedDialogWarning = (unnamed: boolean): void => {\n useEffect(() => {\n const development = typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production';\n if (unnamed && development) {\n // eslint-disable-next-line no-console -- a config warning has no other channel.\n console.warn(\n 'StackedModal: `hideHeader` without `aria-labelledby` leaves the dialog unnamed. ' +\n \"Point `aria-labelledby` at your content header's title.\",\n );\n }\n }, [unnamed]);\n};\n\nconst StackedModalPanel: FC<ResolvedProps> = (props) => {\n const {\n open, onClose, glass, navigationTitle, backLabel, hideClose, hideHeader, children, actions, modalId,\n closeOnClickOutside, closeOnEsc, loading, loadingText, fullScreen, maxWidth, size, disableBackdrop,\n disableFocusTrap, keepMounted, rtl, dataTestId,\n 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, ...otherProps\n } = props;\n\n const {\n dialogRef, modalRole, isAnimating, showSkeleton, zIndex, isMobile, canGoBack, isRoot,\n handleBack, handleClose,\n } = usePanelChrome({\n open, modalId, loading, closeOnEsc, closeOnClickOutside, disableFocusTrap, onClose,\n });\n\n // Don't render if in background (performance optimization)\n if (modalRole === 'background' && !keepMounted) return null;\n\n const { content, modalActions, headerActions, hasMobileActions } = resolveModalContent(\n children,\n actions,\n isMobile,\n );\n const { titleId, descId } = modalAriaIds(modalId, ariaLabelledBy, ariaDescribedBy);\n useUnnamedDialogWarning(Boolean(hideHeader) && !ariaLabelledBy);\n\n return (\n <StyledDialog\n ref={dialogRef}\n open={Boolean(open)}\n onClose={handleClose}\n fullScreen={fullScreen ?? isMobile}\n modalRole={modalRole}\n isAnimating={isAnimating}\n glass={glass}\n rtl={rtl}\n customMaxWidth={maxWidth}\n panelSize={size}\n TransitionComponent={SlideTransition}\n maxWidth={maxWidth}\n disableEscapeKeyDown={!closeOnEsc}\n hideBackdrop={disableBackdrop}\n keepMounted={keepMounted}\n aria-labelledby={titleId}\n aria-describedby={descId}\n data-testid={dataTestId}\n sx={{ zIndex }}\n {...otherProps}\n >\n <ModalPanelContents\n backLabel={backLabel}\n showSkeleton={showSkeleton}\n loadingText={loadingText}\n titleId={titleId}\n descId={descId}\n navigationTitle={navigationTitle}\n hideClose={hideClose}\n hideHeader={Boolean(hideHeader) && isRoot}\n canGoBack={canGoBack}\n onBack={handleBack}\n onClose={onClose}\n headerActions={headerActions}\n content={content}\n modalActions={modalActions}\n hasMobileActions={hasMobileActions}\n rtl={rtl}\n dataTestId={dataTestId}\n />\n </StyledDialog>\n );\n};\n\nexport const StackedModal: FC<StackedModalProps> = (props) => {\n // A modal with no caller-supplied id still needs a STABLE one — it keys this\n // panel's entry in the stack, so a value that changed per render (as a\n // `Math.random()` default does) would re-register it on every pass.\n const fallbackId = useId();\n const resolved = withDefaults(props);\n return <StackedModalPanel {...resolved} modalId={resolved.modalId ?? fallbackId} />;\n};\n\n// Re-exported so `./StackedModal` stays the single public entry point for the\n// component and its stack primitives, as the barrel and existing imports expect.\nexport {\n ModalStackProvider,\n ModalStackProvider as StackedModalProvider,\n useModalStack,\n useModalStack as useStackedModal,\n} from './modal-stack';\nexport { StackedModalActions, StackedModalContent } from './StackedModal.parts';\n"],"mappings":"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","names":["SlideTransition"]}
|