@truenas/ui-components 0.1.48 → 0.1.49

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truenas/ui-components",
-  "version": "0.1.48",
+  "version": "0.1.49",
   "publishConfig": {
     "registry": "https://registry.npmjs.org",
     "access": "public"

package/src/styles/themes.css

@@ -483,11 +483,31 @@ textarea.tn-input-directive {
   border-radius: 8px;
   background: var(--tn-bg1, #ffffff);
   color: var(--tn-fg1, #000000);
+  overflow: hidden; /* enforce max-height boundary */
   box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2),
               0 24px 38px 3px rgba(0, 0, 0, 0.14),
               0 9px 46px 8px rgba(0, 0, 0, 0.12);
 }
 
+/*
+ * Propagate the flex / height constraint from .tn-dialog-panel through
+ * the two CDK-generated wrapper elements so tn-dialog-shell can size
+ * itself correctly and .tn-dialog__content can scroll.
+ */
+.tn-dialog-panel > .cdk-dialog-container {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-height: 0;
+}
+
+.tn-dialog-panel > .cdk-dialog-container > :first-child {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-height: 0;
+}
+
 /* Shell component wrapper */
 tn-dialog-shell {
   display: flex;
@@ -591,15 +611,6 @@ tn-dialog-shell {
   background: rgba(0, 0, 0, 0.5);
 }
 
-/* Container positioning */
-.cdk-dialog-container {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  min-height: 100vh;
-  box-sizing: border-box;
-}
-
 /* Fullscreen dialog support */
 .tn-dialog--fullscreen .cdk-dialog-container {
   position: fixed;