@cambly/syntax-core 9.2.0 → 9.4.0

package/dist/index.d.ts

@@ -417,7 +417,7 @@ type BoxProps = {
  */
 declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttributes<HTMLDivElement>>;
 
-declare const Color: readonly ["primary", "secondary", "tertiary", "branded", "destructive-primary", "destructive-secondary", "destructive-tertiary", "success", "gray200", "gray700", "gray800", "gray900", "white", "inherit"];
+declare const Color: readonly ["primary", "secondary", "tertiary", "branded", "inverse", "destructive-primary", "destructive-secondary", "destructive-tertiary", "success", "gray200", "gray700", "gray800", "gray900", "white", "inherit"];
 declare const Size: readonly ["sm", "md", "lg"];
 
 type ButtonProps = {
@@ -438,7 +438,7 @@ type ButtonProps = {
      *
      * @defaultValue "primary"
      */
-    color?: "primary" | "secondary" | "tertiary" | "destructive-primary" | "destructive-secondary" | "destructive-tertiary" | "branded" | "success";
+    color?: "primary" | "secondary" | "tertiary" | "destructive-primary" | "destructive-secondary" | "destructive-tertiary" | "branded" | "success" | "inverse";
     /**
      * The size of the button
      *
@@ -651,7 +651,7 @@ declare namespace Divider {
 /**
  * [Heading](https://cambly-syntax.vercel.app/?path=/docs/components-heading--docs) enforces a consistent style & accessibility best practices for headings.
  */
-declare const Heading: ({ align, as, children, color, "data-testid": dataTestId, size, }: {
+declare const Heading: ({ align, as, children, color, "data-testid": dataTestId, lineClamp, size, }: {
     /**
      * Aligns the text to the left, right, or center of the container.
      * * `start` and `end` will align the text to the left or right of the container depending on the locale.
@@ -675,11 +675,15 @@ declare const Heading: ({ align, as, children, color, "data-testid": dataTestId,
      *
      * @defaultValue "gray900"
      */
-    color?: "gray200" | "gray900" | "primary" | "secondary" | "tertiary" | "destructive-primary" | "destructive-secondary" | "destructive-tertiary" | "branded" | "success" | "gray700" | "gray800" | "white" | "inherit" | undefined;
+    color?: "gray200" | "gray900" | "primary" | "secondary" | "tertiary" | "destructive-primary" | "destructive-secondary" | "destructive-tertiary" | "branded" | "success" | "inverse" | "gray700" | "gray800" | "white" | "inherit" | undefined;
     /**
      * Test id for the text.
      */
     "data-testid"?: string | undefined;
+    /**
+     * The number of lines we should truncate the text at
+     */
+    lineClamp?: number | undefined;
     /**
      * Size of the text.
      *
@@ -1190,7 +1194,7 @@ declare const Typography: ({ align, as, children, color, "data-testid": dataTest
      *
      * @defaultValue "gray900"
      */
-    color?: "gray200" | "gray900" | "primary" | "secondary" | "tertiary" | "destructive-primary" | "destructive-secondary" | "destructive-tertiary" | "branded" | "success" | "gray700" | "gray800" | "white" | "inherit" | undefined;
+    color?: "gray200" | "gray900" | "primary" | "secondary" | "tertiary" | "destructive-primary" | "destructive-secondary" | "destructive-tertiary" | "branded" | "success" | "inverse" | "gray700" | "gray800" | "white" | "inherit" | undefined;
     /**
      * Test id for the text
      */

package/dist/index.js

@@ -508,6 +508,8 @@ function backgroundColor(color) {
       return colors_module_default2.whiteBackgroundColor;
     case "branded":
       return colors_module_default2.yellow700BackgroundColor;
+    case "inverse":
+      return colors_module_default2.gray60BackgroundColor;
     default:
       return colors_module_default2.primary700BackgroundColor;
   }
@@ -524,6 +526,8 @@ function foregroundColor(color) {
       return colors_module_default2.destructive700Color;
     case "branded":
       return colors_module_default2.gray900Color;
+    case "inverse":
+      return colors_module_default2.whiteColor;
     default:
       return colors_module_default2.whiteColor;
   }
@@ -540,6 +544,8 @@ function foregroundTypographyColor(color) {
       return "destructive-primary";
     case "branded":
       return "gray900";
+    case "inverse":
+      return "white";
     default:
       return "white";
   }
@@ -981,6 +987,7 @@ var Heading = ({
   children,
   color = "gray900",
   "data-testid": dataTestId,
+  lineClamp,
   size = 500
 }) => {
   const weight = [700, 800].includes(size) ? "heavy" : "bold";
@@ -991,6 +998,7 @@ var Heading = ({
       as,
       color,
       "data-testid": dataTestId,
+      lineClamp,
       size,
       weight,
       children