@geotab/zenith 3.11.0-beta.0 → 3.11.0

package/dist/commonStyles/typography/typography.less

@@ -1,562 +1,3 @@
-// temporary adding these here to avoid a break on current code, will be removed in the future
-@import "../fonts/roboto.less";
-@import "../fonts/robotomono.less";
-@import "../fonts/notosarabic.less";
-@main-font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
-@arabic-font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
-@driver-font-family: "Roboto Mono", "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
-@rem: 16rem;
-
-//**********//
-// Standard //
-//**********//
-
-//body-label
-//label-01
-//body-04
-//body-s-400
-@base-font-size: 12;
-@base-line-height: 16;
-@base-letter-spacing: 0.32;
-@base-font-weight: 400;
-@base-font-style: normal;
-
-//body-01,
-//body-l-400
-@body-font-size: 16;
-@body-line-height: 24;
-@body-letter-spacing: 0;
-
-//body-02-short,
-//body-m-400-short
-@body-short-font-size: 14;
-
-//body-02-tall,
-//body-m-400-tall
-@body-tall-font-size: 14;
-@body-tall-line-height: 28;
-
-//body-03,
-//body-s-700
-@body-03-weight: 700;
-
-//body-05,
-//body-s-400-italic
-@body-05-style: italic;
-
-//heading-01
-//heading-xl-300
-@heading-01-font-size: 28;
-@heading-01-font-mobile-size: 20;
-@heading-01-line-height: 36;
-@heading-01-weight: 300;
-
-//heading-02
-//heading-l-400
-@heading-02-font-size: 20;
-@heading-02-line-height: 24;
-
-//heading-03
-//heading-m-300
-@heading-03-font-size: 20;
-@heading-03-font-mobile-size: 18;
-@heading-03-line-height: 28;
-
-//heading-04
-//heading-s-500
-@heading-04-font-size: 16;
-@heading-04-line-height: 24;
-@heading-04-weight: 500;
-
-//heading-05
-//heading-xs-500
-@heading-05-font-size: 14;
-@heading-05-letter-spacing: 0.16;
-@heading-05-weight: 500;
-
-//heading-06
-@heading-06-letter-spacing: 0;
-@heading-06-text-transformI: uppercase;
-
-//data-01
-//data-xxl
-@data-01-font-size: 32;
-@data-01-line-height: 40;
-
-//data-02
-//data-xl
-@data-02-font-size: 24;
-@data-02-line-height: 32;
-
-//data-03
-//data-l
-@data-03-font-size: 20;
-@data-03-line-height: 24;
-
-//data-04
-//data-m
-@data-04-font-size: 18;
-@data-04-line-height: 21;
-
-//data-05
-//data-s
-@data-05-font-size: 16;
-@data-05-line-height: 18;
-
-//data-06
-//data-xs
-@data-06-font-size: 14;
-@data-06-line-height: 16;
-
-//*******//
-// Drive //
-//*******//
-
-//label-01-drive
-//label-400-drive
-@drive-base-font-size: 16;
-@drive-base-font-mobile-size: 14;
-@drive-base-line-height: 18;
-@drive-base-letter-spacing: 0.32;
-@drive-base-font-weight: 400;
-@drive-base-font-style: normal;
-
-//body-01-drive
-//body-l-400-drive
-@body-01-drive-font-size: 20;
-@body-01-drive-font-mobile-size: 18;
-@body-01-drive-line-height: 30;
-@body-01-drive-line-height-mobile: 28;
-@body-01-drive-letter-spacing: 0;
-
-//body-02-short-drive
-//body-m-400-short-drive
-@body-02-short-drive-font-size: 18;
-@body-02-short-drive-font-mobile-size: 16;
-@body-02-short-drive-line-height: 22;
-@body-02-short-drive-line-height-mobile: 20;
-
-//body-02-tall-drive
-//body-m-400-tall-drive
-@body-02-tall-drive-font-size: 18;
-@body-02-tall-drive-font-mobile-size: 16;
-@body-02-tall-drive-line-height: 28;
-@body-02-tall-drive-line-height-mobile: 26;
-
-//body-03-drive,
-//body-s-700-drive
-@body-03-drive-line-height: 22;
-@body-03-drive-weight: 700;
-
-//body-04-drive,
-//body-s-400-drive
-@body-04-drive-line-height: 22;
-@body-04-drive-line-height-mobile: 20;
-
-//body-05-drive
-//body-s-400-italic-drive
-@body-05-drive-line-height: 20;
-@body-05-drive-style: italic;
-
-//heading-01-drive
-//heading-xl-300-drive
-@heading-01-drive-font-size: 26;
-@heading-01-drive-font-mobile-size: 24;
-@heading-01-drive-line-height: 34;
-@heading-01-drive-line-height-mobile: 32;
-@heading-01-drive-weight: 300;
-
-//heading-02-drive
-//heading-l-400-drive
-@heading-02-drive-font-size: 24;
-@heading-02-drive-font-mobile-size: 22;
-@heading-02-drive-line-height: 30;
-@heading-02-drive-line-height-mobile: 28;
-
-//heading-03-drive
-//heading-m-300-drive
-@heading-03-drive-font-size: 20;
-@heading-03-drive-font-mobile-size: 18;
-@heading-03-drive-line-height: 26;
-@heading-03-drive-mobile-line-height: 24;
-
-//heading-04-drive
-//heading-m-500-drive
-@heading-04-drive-font-size: 20;
-@heading-04-drive-font-mobile-size: 18;
-@heading-04-drive-line-height: 28;
-@heading-04-drive-mobile-line-height: 26;
-@heading-04-drive-weight: 500;
-
-//heading-05-drive
-//heading-s-500-drive
-@heading-05-drive-font-size: 18;
-@heading-05-drive-font-mobile-size: 16;
-@heading-05-drive-line-height: 22;
-@heading-05-drive-mobile-line-height: 20;
-@heading-05-drive-letter-spacing: 0.16;
-
-//heading-06-drive
-@heading-06-drive-font-size: 14;
-@heading-06-drive-letter-spacing: 0;
-
-//heading-07-drive
-//heading-s-300-drive
-@heading-07-drive-font-size: 18;
-@heading-07-drive-font-mobile-size: 16;
-@heading-07-drive-line-height: 20;
-@heading-07-drive-mobile-line-height: 18;
-
-//data-01-drive
-//data-xl-drive
-@data-01-drive-font-size: 34;
-@data-01-drive-mobile-size: 32;
-@data-01-drive-line-height: 42;
-@data-01-drive-mobile-line-height: 40;
-
-//data-02-drive
-//data-l-drive
-@data-02-drive-font-size: 22;
-@data-02-drive-mobile-size: 20;
-@data-02-drive-line-height: 26;
-@data-02-drive-mobile-line-height: 24;
-
-//data-03-drive
-//data-m-drive
-@data-03-drive-font-size: 20;
-@data-03-drive-mobile-size: 16;
-@data-03-drive-line-height: 22;
-@data-03-drive-mobile-line-height: 21;
-
-//data-04-drive
-//data-s-drive
-@data-04-drive-font-size: 18;
-@data-04-drive-mobile-size: 16;
-@data-04-drive-line-height: 26;
-@data-04-drive-mobile-line-height: 24;
-
-//*************************************************************//
-// Do not add raw values here, use the variables above instead //
-//*************************************************************//
-
-.zen-font(@font,
-    @size: @base-font-size,
-    @line-height: @base-line-height,
-    @letter-spacing: @base-letter-spacing,
-    @weight: @base-font-weight,
-    @style: @base-font-style,
-    @text-transform: none,
-) {
-    font-family: @font;
-    font-size: (@size / @rem);
-    font-style: @style;
-    font-weight: @weight;
-    letter-spacing: (@letter-spacing / @rem);
-    line-height: (@line-height / @rem);
-    text-transform: @text-transform;
-    text-decoration: none;
-
-    html:lang(ar) & {
-        font-family: @arabic-font-family;
-    }
-}
-
-.zen-drive-font(@font,
-    @size: @drive-base-font-size,
-    @line-height: @drive-base-line-height,
-    @letter-spacing: @drive-base-letter-spacing,
-    @weight: @drive-base-font-weight,
-    @style: @drive-base-font-style,
-    @text-transform: none,
-) {
-    font-family: @font;
-    font-size: (@size / @rem);
-    font-style: @style;
-    font-weight: @weight;
-    letter-spacing: (@letter-spacing / @rem);
-    line-height: (@line-height / @rem);
-    text-transform: @text-transform;
-    text-decoration: none;
-}
-
-// Standard
-
-// Labels
-.zen-body-label-400,
-.zen-body-s-400 {
-    .zen-font(@main-font-family);
-}
-
-// Body
-.zen-body-l-400 {
-    .zen-font(@main-font-family, @body-font-size, @body-line-height, @body-letter-spacing);
-}
-
-.zen-body-m-400-short {
-    .zen-font(@main-font-family, @body-short-font-size, @base-line-height, @body-letter-spacing);
-}
-
-.zen-body-m-400-tall {
-    .zen-font(@main-font-family, @body-tall-font-size, @body-tall-line-height, @body-letter-spacing);
-}
-
-.zen-body-s-700 {
-    .zen-font(@main-font-family, @weight: @body-03-weight);
-}
-
-.zen-body-s-400-italic {
-    .zen-font(@main-font-family, @style: @body-05-style);
-}
-
-// Headings
-.zen-heading-xl-300 {
-    .zen-font(@main-font-family, @heading-01-font-size, @heading-01-line-height, @weight: @heading-01-weight);
-}
-
-.zen-heading-l-400 {
-    .zen-font(@main-font-family, @heading-02-font-size, @heading-02-line-height);
-}
-
-.zen-heading-m-300 {
-    .zen-font(@main-font-family, @heading-03-font-size, @heading-03-line-height, @weight: @heading-01-weight);
-}
-
-.zen-heading-s-500 {
-    .zen-font(@main-font-family, @heading-04-font-size, @heading-04-line-height, @weight: @heading-04-weight);
-}
-
-.zen-heading-xs-500 {
-    .zen-font(@main-font-family, @heading-05-font-size, @base-line-height, @heading-05-letter-spacing, @heading-05-weight);
-}
-
-.zen-heading-06 {
-    .zen-font(@main-font-family, @body-tall-font-size, @body-line-height, @heading-06-letter-spacing, @heading-05-weight, @text-transform: @heading-06-text-transformI);
-}
-
-.zen-heading-xs-300 {
-    .zen-font(@main-font-family, @heading-05-font-size, @base-line-height, @heading-05-letter-spacing, @weight: @heading-01-weight);
-}
-
-// Data
-.zen-data-xxl {
-    .zen-font(@main-font-family, @data-01-font-size, @data-01-line-height);
-}
-
-.zen-data-xl {
-    .zen-font(@main-font-family, @data-02-font-size, @data-02-line-height);
-}
-
-.zen-data-l {
-    .zen-font(@main-font-family, @data-03-font-size, @data-03-line-height);
-}
-
-.zen-data-m {
-    .zen-font(@main-font-family, @data-04-font-size, @data-04-line-height);
-}
-
-.zen-data-s {
-    .zen-font(@main-font-family, @data-05-font-size, @data-05-line-height);
-}
-
-.zen-data-xs {
-    .zen-font(@main-font-family, @data-06-font-size, @data-06-line-height);
-}
-
-// Drive
-
-// Labels Drive
-.zen-label-01-drive,
-.zen-label-400-drive {
-    .zen-drive-font(@driver-font-family);
-}
-
-// Body Drive
-.zen-body-01-drive,
-.zen-body-l-400-drive {
-    .zen-drive-font(@driver-font-family, @body-01-drive-font-size, @body-01-drive-line-height, @body-01-drive-letter-spacing);
-}
-
-.zen-body-02-short-drive,
-.zen-body-m-400-short-drive {
-    .zen-drive-font(@driver-font-family, @body-02-short-drive-font-size, @body-02-short-drive-line-height);
-}
-
-.zen-body-02-tall-drive,
-.zen-body-m-400-tall-drive {
-    .zen-drive-font(@driver-font-family, @body-02-tall-drive-font-size, @body-02-tall-drive-line-height);
-}
-
-.zen-body-03-drive,
-.zen-body-s-700-drive {
-    .zen-drive-font(@driver-font-family,  @line-height: @body-03-drive-line-height, @weight: @body-03-drive-weight);
-}
-
-.zen-body-04-drive,
-.zen-body-s-400-drive {
-    .zen-drive-font(@driver-font-family, @line-height: @body-04-drive-line-height);
-}
-
-.zen-body-05-drive,
-.zen-body-s-400-italic-drive {
-    .zen-drive-font(@driver-font-family, @line-height: @body-05-drive-line-height, @style: @body-05-drive-style);
-}
-
-// Headings Drive
-.zen-heading-01-drive,
-.zen-heading-xl-300-drive {
-    .zen-drive-font(@driver-font-family, @heading-01-drive-font-size, @heading-01-drive-line-height, @weight: @heading-01-drive-weight);
-}
-
-.zen-heading-02-drive,
-.zen-heading-l-400-drive {
-    .zen-drive-font(@driver-font-family, @heading-02-drive-font-size, @heading-02-drive-line-height);
-}
-
-.zen-heading-03-drive,
-.zen-heading-m-300-drive {
-    .zen-drive-font(@driver-font-family, @heading-03-drive-font-size, @heading-03-drive-line-height, @weight: @heading-01-drive-weight);
-}
-
-.zen-heading-04-drive,
-.zen-heading-m-500-drive {
-    .zen-drive-font(@driver-font-family, @heading-04-drive-font-size, @heading-04-drive-line-height, @weight: @heading-04-drive-weight);
-}
-
-.zen-heading-05-drive,
-.zen-heading-s-500-drive {
-    .zen-drive-font(@driver-font-family, @heading-05-drive-font-size, @heading-05-drive-line-height, @heading-05-drive-letter-spacing, @weight: @heading-04-drive-weight);
-}
-
-.zen-heading-06-drive {
-    .zen-drive-font(@driver-font-family, @heading-06-drive-font-size, @body-line-height, @heading-06-drive-letter-spacing, @weight: @heading-04-drive-weight, @text-transform: @heading-06-text-transformI);
-}
-
-.zen-heading-07-drive,
-.zen-heading-s-300-drive {
-    .zen-drive-font(@driver-font-family, @heading-07-drive-font-size, @heading-07-drive-line-height, @heading-05-drive-letter-spacing, @weight: @heading-01-drive-weight);
-}
-
-// Data Drive
-.zen-data-01-drive,
-.zen-data-xl-drive {
-    .zen-drive-font(@driver-font-family, @data-01-drive-font-size, @data-01-drive-line-height);
-}
-
-.zen-data-02-drive,
-.zen-data-l-drive {
-    .zen-drive-font(@driver-font-family, @data-02-drive-font-size, @data-02-drive-line-height);
-}
-
-.zen-data-03-drive,
-.zen-data-m-drive {
-    .zen-drive-font(@driver-font-family, @data-03-drive-font-size, @data-03-drive-line-height);
-}
-
-.zen-data-04-drive,
-.zen-data-s-drive {
-    .zen-drive-font(@driver-font-family, @data-04-drive-font-size, @data-04-drive-line-height);
-}
-
-// Responsive overrides (mobile — max-width: 640px)
-@media (max-width: 640px) {
-    // Standard
-    .zen-heading-xl-300 {
-        .zen-font(@main-font-family, @heading-01-font-mobile-size, @heading-01-line-height, @weight: @heading-01-weight);
-    }
-
-    .zen-heading-m-300 {
-        .zen-font(@main-font-family, @heading-03-font-mobile-size, @heading-03-line-height, @weight: @heading-01-weight);
-    }
-
-    // Drive
-    .zen-label-01-drive,
-    .zen-label-400-drive {
-        .zen-drive-font(@driver-font-family, @drive-base-font-mobile-size);
-    }
-
-    .zen-body-01-drive,
-    .zen-body-l-400-drive {
-        .zen-drive-font(@driver-font-family, @body-01-drive-font-mobile-size, @body-01-drive-line-height-mobile, @body-01-drive-letter-spacing);
-    }
-
-    .zen-body-02-short-drive,
-    .zen-body-m-400-short-drive {
-        .zen-drive-font(@driver-font-family, @body-02-short-drive-font-mobile-size, @body-02-short-drive-line-height-mobile);
-    }
-
-    .zen-body-02-tall-drive,
-    .zen-body-m-400-tall-drive {
-        .zen-drive-font(@driver-font-family, @body-02-tall-drive-font-mobile-size, @body-02-tall-drive-line-height-mobile);
-    }
-
-    .zen-body-03-drive,
-    .zen-body-s-700-drive {
-        .zen-drive-font(@driver-font-family, @drive-base-font-mobile-size, @line-height: @body-03-drive-line-height, @weight: @body-03-drive-weight);
-    }
-
-    .zen-body-04-drive,
-    .zen-body-s-400-drive {
-        .zen-drive-font(@driver-font-family, @drive-base-font-mobile-size, @body-04-drive-line-height-mobile);
-    }
-
-    .zen-body-05-drive,
-    .zen-body-s-400-italic-drive {
-        .zen-drive-font(@driver-font-family, @drive-base-font-mobile-size, @body-05-drive-line-height, @style: @body-05-drive-style);
-    }
-
-    .zen-heading-01-drive,
-    .zen-heading-xl-300-drive {
-        .zen-drive-font(@driver-font-family, @heading-01-drive-font-mobile-size, @heading-01-drive-line-height-mobile, @weight: @heading-01-drive-weight);
-    }
-
-    .zen-heading-02-drive,
-    .zen-heading-l-400-drive {
-        .zen-drive-font(@driver-font-family, @heading-02-drive-font-mobile-size, @heading-02-drive-line-height-mobile);
-    }
-
-    .zen-heading-03-drive,
-    .zen-heading-m-300-drive {
-        .zen-drive-font(@driver-font-family, @heading-03-drive-font-mobile-size, @heading-03-drive-mobile-line-height, @weight: @heading-01-drive-weight);
-    }
-
-    .zen-heading-04-drive,
-    .zen-heading-m-500-drive {
-        .zen-drive-font(@driver-font-family, @heading-04-drive-font-mobile-size, @heading-04-drive-mobile-line-height, @weight: @heading-04-drive-weight);
-    }
-
-    .zen-heading-05-drive,
-    .zen-heading-s-500-drive {
-        .zen-drive-font(@driver-font-family, @heading-05-drive-font-mobile-size, @heading-05-drive-mobile-line-height, @heading-05-drive-letter-spacing, @weight: @heading-04-drive-weight);
-    }
-
-    .zen-heading-07-drive,
-    .zen-heading-s-300-drive {
-        .zen-drive-font(@driver-font-family, @heading-07-drive-font-mobile-size, @heading-07-drive-mobile-line-height, @heading-05-drive-letter-spacing, @weight: @heading-01-drive-weight);
-    }
-
-    .zen-data-01-drive,
-    .zen-data-xl-drive {
-        .zen-drive-font(@driver-font-family, @data-01-drive-mobile-size, @data-01-drive-mobile-line-height);
-    }
-
-    .zen-data-02-drive,
-    .zen-data-l-drive {
-        .zen-drive-font(@driver-font-family, @data-02-drive-mobile-size, @data-02-drive-mobile-line-height);
-    }
-
-    .zen-data-03-drive,
-    .zen-data-m-drive {
-        .zen-drive-font(@driver-font-family, @data-03-drive-mobile-size, @data-03-drive-mobile-line-height);
-    }
-
-    .zen-data-04-drive,
-    .zen-data-s-drive {
-        .zen-drive-font(@driver-font-family, @data-04-drive-mobile-size, @data-04-drive-mobile-line-height);
-    }
-}
-
-// Depricated //
-
 .font(
     @font: Roboto,
     @size,
@@ -565,7 +6,6 @@
     @weight: 400,
     @style: normal,
     @text-transform: none,
-    @arabic-font: var(--arabic-font-family)
 ) {
     font-family: @font;
     font-size: @size;
@@ -577,7 +17,7 @@
     text-decoration: none;
 
     html:lang(ar) & {
-        font-family: @arabic-font;
+        font-family: var(--arabic-font-family);
     }
 }
 
@@ -904,95 +344,95 @@
 // Data
 .data-01,
 .data-xxl {
-    .font(var(--main-font-data), 32px, @line-height: 40px, @arabic-font: var(--main-font-data));
+    .font(var(--main-font-data), 32px, @line-height: 40px);
 }
 
 .data-02,
 .data-xl {
-    .font(var(--main-font-data), 24px, 32px, @arabic-font: var(--main-font-data));
+    .font(var(--main-font-data), 24px, 32px);
 }
 
 .data-03,
 .data-l {
-    .font(var(--main-font-data), 20px, 24px, @arabic-font: var(--main-font-data));
+    .font(var(--main-font-data), 20px, 24px);
 }
 
 .data-04,
 .data-m {
-    .font(var(--main-font-data), 18px, 21px, @arabic-font: var(--main-font-data));
+    .font(var(--main-font-data), 18px, 21px);
 }
 
 .data-05,
 .data-s {
-    .font(var(--main-font-data), 16px, 18px, @arabic-font: var(--main-font-data));
+    .font(var(--main-font-data), 16px, 18px);
 }
 
 .data-06,
 .data-xs {
-    .font(var(--main-font-data), 14px, 16px, @arabic-font: var(--main-font-data));
+    .font(var(--main-font-data), 14px, 16px);
 }
 
 // Data Drive
 .data-01-tablet-drive,
 .tablet-data-xl-drive {
-    .font(var(--data-font-drive), 34px, 42px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 34px, 42px);
 }
 
 .data-01-mobile-drive,
 .mobile-data-xl-drive {
-    .font(var(--data-font-drive), 32px, 40px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 32px, 40px);
 }
 
 @media (max-width: 640px) {
     .tablet-data-xl-drive {
-        .font(var(--data-font-drive), 32px, 40px, @arabic-font: var(--data-font-drive));
+        .font(var(--data-font-drive), 32px, 40px);
     }
 }
 
 .data-02-tablet-drive,
 .tablet-data-l-drive {
-    .font(var(--data-font-drive), 22px, 26px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 22px, 26px);
 }
 
 .data-02-mobile-drive,
 .mobile-data-l-drive {
-    .font(var(--data-font-drive), 20px, 24px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 20px, 24px);
 }
 
 @media (max-width: 640px) {
     .tablet-data-l-drive {
-        .font(var(--data-font-drive), 20px, 24px, @arabic-font: var(--data-font-drive));
+        .font(var(--data-font-drive), 20px, 24px);
     }
 }
 
 .data-03-tablet-drive,
 .tablet-data-m-drive {
-    .font(var(--data-font-drive), 20px, 22px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 20px, 22px);
 }
 
 .data-03-mobile-drive,
 .mobile-data-m-drive {
-    .font(var(--data-font-drive), 16px, 21px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 16px, 21px);
 }
 
 @media (max-width: 640px) {
     .tablet-data-m-drive {
-        .font(var(--data-font-drive), 16px, 21px, @arabic-font: var(--data-font-drive));
+        .font(var(--data-font-drive), 16px, 21px);
     }
 }
 
 .data-04-tablet-drive,
 .tablet-data-s-drive {
-    .font(var(--data-font-drive), 18px, 26px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 18px, 26px);
 }
 
 .data-04-mobile-drive,
 .mobile-data-s-drive {
-    .font(var(--data-font-drive), 16px, 24px, @arabic-font: var(--data-font-drive));
+    .font(var(--data-font-drive), 16px, 24px);
 }
 
 @media (max-width: 640px) {
     .tablet-data-s-drive {
-        .font(var(--data-font-drive), 16px, 24px, @arabic-font: var(--data-font-drive));
+        .font(var(--data-font-drive), 16px, 24px);
     }
 }

package/dist/controlledPopup/controlledPopup.d.ts

@@ -9,7 +9,6 @@ import { TAlignment as TAlignmentAbsolute } from "../absolute/absolute";
 export type TAlignment = "top" | "top-left" | "top-right" | "left" | "left-top" | "left-bottom" | "right" | "right-top" | "right-bottom" | "bottom" | "bottom-left" | "bottom-right";
 export interface IControlledPopup extends IZenComponentProps {
     triggerRef: RefObject<HTMLElement | null>;
-    /** Alignment of the popup relative to its trigger. Defaults to `"bottom-left"` (flips to `"bottom-right"` in RTL). */
     alignment?: TAlignmentAbsolute;
     id?: string;
     className?: string;