pcm-shared-components 2.1.409 → 2.1.411

package/dist/components/Reservation/AnimalVehicleDetailsEditor/fieldTypeControl.js

@@ -18,11 +18,17 @@ export const openNativeDatePicker = e => {
   }
 };
 
-// Collapsed height for a notice's rich-text content before it needs a "Show More" link -- kept
-// deliberately small (~3 text lines) so a long admin-entered notice doesn't dominate the panel's
-// vertical space; anything longer gets clipped here and offered in full through the dialog below.
-// Short content still renders in full with no link at all (overflow-measured, not char-counted).
-const NOTICE_COLLAPSED_MAX_HEIGHT = 66;
+// Collapsed size for a notice's rich-text content before it needs a "Show More" link -- clamped
+// on a clean line boundary with an ellipsis via -webkit-line-clamp so a long admin-entered notice
+// doesn't dominate the panel's vertical space; anything longer is offered in full through the
+// dialog below. Short content still renders in full with no link at all (overflow-measured, not
+// char-counted). 6 lines, not fewer: Quill content routinely contains blank spacer paragraphs
+// (<p><br></p>) between sections, and each spacer costs a clamp line -- a tighter clamp left only
+// a couple of REAL text lines visible, which read as "not enough" in practice.
+// NOTICE_COLLAPSED_MAX_HEIGHT is only a fallback ceiling for engines without line-clamp support,
+// sized generously enough that the line-clamp is what actually cuts in normal browsers.
+const NOTICE_COLLAPSED_LINES = 6;
+const NOTICE_COLLAPSED_MAX_HEIGHT = 200;
 
 /**
  * The control for a `notice` field: the admin's sanitized rich text inside a bounded-height
@@ -77,12 +83,17 @@ const NoticeFieldControl = ({
     sx: {
       p: 1.5,
       borderRadius: 1,
-      bgcolor: 'action.hover',
-      maxHeight: NOTICE_COLLAPSED_MAX_HEIGHT,
-      overflow: 'hidden'
+      bgcolor: 'action.hover'
     }
   }, /*#__PURE__*/React.createElement("div", {
     ref: contentRef,
+    style: {
+      display: '-webkit-box',
+      WebkitLineClamp: NOTICE_COLLAPSED_LINES,
+      WebkitBoxOrient: 'vertical',
+      maxHeight: NOTICE_COLLAPSED_MAX_HEIGHT,
+      overflow: 'hidden'
+    },
     dangerouslySetInnerHTML: {
       __html: contentHtml
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pcm-shared-components",
-  "version": "2.1.409",
+  "version": "2.1.411",
   "private": false,
   "main": "dist/index.js",
   "babel": {