@mtes-mct/monitor-ui 18.0.0 → 18.0.1

package/CHANGELOG.md

@@ -1,3 +1,28 @@
+## [18.0.0](https://github.com/MTES-MCT/monitor-ui/compare/v17.2.2...v18.0.0) (2024-05-27)
+
+
+### ⚠ BREAKING CHANGES
+
+* **tables:** - Remove `isChecked` prop in `TableWithSelectableRows.RowCheckbox`, replaced by native `checked` prop.
+- Remove `isIndeterminate` prop in `TableWithSelectableRows.RowCheckbox`, replaced by original Rsuite `indeterminate` prop.
+- Remove `$isHighlighted` prop in `TableWithSelectableRows.Td`, replaced by the same prop on `TableWithSelectableRows.BodyTr`.
+- In order to work properly with `RowCheckbox`, `TableWithSelectableRows` now requires `<Table $withRowCheckbox />`.
+- Following the `SimpleTable` & `TableWithSelectableRows` margins/heights normalization, including a few hacks,
+  it may break some UI widths & heights.
+- Please check `TableWithSelectableRows.stories.tsx` to see a full example on how to use/update it.
+- As shown in the story, be careful **NOT** to wrap the checkbox table header cell
+  within `<TableWithSelectableRows.SortContainer />` since the flex display breaks its internal positioning.
+
+### Features
+
+* **tables:** add $isLoading prop to SimpleTable.Td ([6cc137e](https://github.com/MTES-MCT/monitor-ui/commit/6cc137e187bd0314756bfc973f65bcde19f063ea))
+
+
+### Bug Fixes
+
+* **tables:** normalize tables checkbox, margins & height ([23afb70](https://github.com/MTES-MCT/monitor-ui/commit/23afb702e79e44788d82b6abeb0e2e6ba4deb4d3))
+* **tables:** set SimpleTable.Td line-height & .CellLoader height to 22px ([176b161](https://github.com/MTES-MCT/monitor-ui/commit/176b161ac85c48913f25e5a483ce8ac30698e65c))
+
 ## [17.2.2](https://github.com/MTES-MCT/monitor-ui/compare/v17.2.1...v17.2.2) (2024-05-21)
 
 

package/index.js

@@ -76346,8 +76346,14 @@ const Th$2 = styled.th`
   padding: 9px 10px;
   overflow: hidden;
   text-overflow: ellipsis;
-  ${(p)=>!!p.$width && `width: ${p.$width}px;`}
+  user-select: none;
   white-space: nowrap;
+
+  ${(p)=>!!p.$width && css`
+      max-width: ${p.$width}px;
+      min-width: ${p.$width}px;
+      width: ${p.$width}px;
+    `}
 `;
 const SortContainer$1 = styled.div`
   align-items: center;
@@ -76534,7 +76540,7 @@ const Table = styled(SimpleTable.Table)`
   border-spacing: 0 5px;
   table-layout: fixed;
 
-  ${(p)=>!!p.$withRowCheckbox && `
+  ${(p)=>!!p.$withRowCheckbox && css`
       > thead > tr > th:first-child {
         padding: 0 0 0 8px;
 
@@ -76552,7 +76558,7 @@ const Table = styled(SimpleTable.Table)`
       > tbody > tr > td:first-child {
         padding: 0 0 0 8px;
       }
-  `}
+    `}
 `;
 const Head = styled(SimpleTable.Head)`
   > tr {
@@ -76601,7 +76607,7 @@ const BodyTr = styled(SimpleTable.BodyTr)`
 `;
 const Td = styled(SimpleTable.Td)`
   background-color: ${(p)=>p.theme.color.cultured};
-  ${(p)=>!!p.$hasRightBorder && `border-right: 1px solid ${p.theme.color.lightGray};`}
+  ${(p)=>!!p.$hasRightBorder && `border-right: 1px solid ${p.theme.color.lightGray} !important;`}
   padding: 9px 16px;
 `;
 const TableWithSelectableRows = {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mtes-mct/monitor-ui",
   "description": "Common React components, hooks, utilities and CSS stylesheets for MonitorFish, MonitorEnv and RapportNav.",
-  "version": "18.0.0",
+  "version": "18.0.1",
   "license": "AGPL-3.0",
   "type": "module",
   "engines": {

package/tables/SimpleTable/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tables/SimpleTable/index.tsx"],"names":[],"mappings":";AAkEA,eAAO,MAAM,WAAW;;;;;;;;;;;iBAvCb,MAAM,GAAG,SAAS;;CA+C5B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tables/SimpleTable/index.tsx"],"names":[],"mappings":";AA0EA,eAAO,MAAM,WAAW;;;;;;;;;;;iBA/Cb,MAAM,GAAG,SAAS;;CAuD5B,CAAA"}