@connectif/ui-components 2.0.16 → 2.0.18

package/dist/components/input/TextField.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { SxProps } from '@mui/material';
+import { TypographyVariant } from '../../theme/Typography';
 import { InputLabelProps } from './InputLabel';
 import { IconId } from '../icon';
 export type TextFieldProps = {
@@ -144,6 +145,10 @@ export type TextFieldProps = {
      * IconButton and MenuIconButton size must be 'M' or smaller.
      */
     groupElements?: boolean;
+    /**
+     * Specify typography variant on input
+     */
+    typographyVariant?: TypographyVariant;
 };
 /**
  * TextField is a component that renders an input field with type="text" or a textarea.

package/dist/components/markdown/MarkdownRenderer.d.ts

@@ -4,6 +4,8 @@ type MarkdownContainerProps = {
     color: string;
     backgroundColor?: string;
     variant?: TypographyVariant;
+    lineHeight?: number;
+    codeLineHeight?: number;
     /**
      * Class Name to append to container
      */

package/dist/index.js

@@ -13801,7 +13801,7 @@ var ChatMessage = React35.forwardRef(function ChatMessage2({
                         borderStyle: "solid",
                         borderColor: !backgroundColor2 ? messageType === "incoming" ? grey200 : primary300 : backgroundColor2,
                         color: messageType === "incoming" ? grey900 : white,
-                        borderRadius: "12px",
+                        borderRadius: "16px",
                         ...highlightStartEdge && messageType === "outgoing" && {
                           borderTopRightRadius: "4px"
                         },
@@ -18411,11 +18411,14 @@ var InputHelperText_default = InputHelperText;
 // src/components/input/TextField.tsx
 import { Fragment as Fragment20, jsx as jsx98, jsxs as jsxs43 } from "react/jsx-runtime";
 var commonInputStylesOptions = {
-  shouldForwardProp: (prop) => prop !== "variant"
+  shouldForwardProp: (prop) => prop !== "variant" && prop !== "typographyVariant"
 };
-function getCommonInputStyles({ disabled }) {
+function getCommonInputStyles({
+  disabled,
+  typographyVariant
+}) {
   return {
-    ...variants["body2"],
+    ...variants[typographyVariant ?? "body2"],
     backgroundColor: "transparent",
     display: "block",
     width: "0",
@@ -18483,6 +18486,7 @@ var TextField = React50.forwardRef(function TextField2({
   readOnly = false,
   className = "",
   groupElements,
+  typographyVariant,
   ...restProps
 }, ref) {
   const [id] = React50.useState(Math.random().toString(10));
@@ -18581,6 +18585,7 @@ var TextField = React50.forwardRef(function TextField2({
                   maxLength,
                   onKeyDown,
                   className: "Slim-Vertical-Scroll",
+                  ...typographyVariant && { typographyVariant },
                   onScroll: () => {
                     if (onScroll) {
                       const reference = ref || inputRef;
@@ -18613,6 +18618,7 @@ var TextField = React50.forwardRef(function TextField2({
                   autoComplete,
                   maxLength,
                   onKeyDown,
+                  ...typographyVariant && { typographyVariant },
                   ...restProps
                 }
               )
@@ -24259,7 +24265,13 @@ var KatexRenderer_default = KatexRenderer;
 // src/components/markdown/MarkdownRenderer.tsx
 import { jsx as jsx137 } from "react/jsx-runtime";
 var MarkdownContainer = styled8("div")(
-  ({ color: color2, backgroundColor: backgroundColor2 = "transparent", variant }) => ({
+  ({
+    color: color2,
+    backgroundColor: backgroundColor2 = "transparent",
+    variant,
+    lineHeight,
+    codeLineHeight
+  }) => ({
     color: color2,
     backgroundColor: backgroundColor2,
     borderRadius: "8px",
@@ -24268,11 +24280,16 @@ var MarkdownContainer = styled8("div")(
     "& h1": { fontSize: "1.75rem" },
     "& h2": { fontSize: "1.5rem" },
     "& h3": { fontSize: "1.25rem" },
-    "& p": { ...variants[variant || "body2"], margin: "0.5em 0" },
+    "& p": {
+      ...variants[variant || "body2"],
+      margin: "0.5em 0",
+      ...lineHeight && { lineHeight: `${lineHeight}px` }
+    },
     "& ul, & ol": {
       ...variants[variant || "body2"],
       paddingLeft: "1.5em",
-      margin: "0.5em 0"
+      margin: "0.5em 0",
+      ...lineHeight && { lineHeight: `${lineHeight}px` }
     },
     "& li": { marginBottom: "0.25em" },
     "& code": {
@@ -24281,18 +24298,30 @@ var MarkdownContainer = styled8("div")(
       borderRadius: "4px",
       fontFamily: "Courier New, monospace",
       fontSize: "0.9em",
-      color: white
+      color: white,
+      ...(codeLineHeight || lineHeight) && {
+        lineHeight: `${codeLineHeight ?? lineHeight}px`
+      }
+    },
+    "& pre code": {
+      display: "block",
+      padding: "12px",
+      overflowX: "auto",
+      ...(codeLineHeight || lineHeight) && {
+        lineHeight: `${codeLineHeight ?? lineHeight}px`
+      }
     },
-    "& pre code": { display: "block", padding: "12px", overflowX: "auto" },
     "& table": {
       width: "100%",
       borderCollapse: "collapse",
-      margin: "1em 0"
+      margin: "1em 0",
+      ...lineHeight && { lineHeight: `${lineHeight}px` }
     },
     "& th, & td": {
       border: `1px solid ${grey800}`,
       padding: "8px",
-      textAlign: "left"
+      textAlign: "left",
+      ...lineHeight && { lineHeight: `${lineHeight}px` }
     },
     "& th": { backgroundColor: grey900, color: white },
     "& a": { color: primary200, textDecoration: "none" },
@@ -24361,12 +24390,14 @@ var CodeOrMath = ({ children, ...props }) => {
   const onlyText = maybe.length === 1 && typeof maybe[0] === "string";
   return onlyText ? /* @__PURE__ */ jsx137("code", { ...props, children }) : /* @__PURE__ */ jsx137("span", { children: maybe });
 };
+var escapeInlineUnderscores = (s) => s.replace(/(\S)_(\S)/g, "$1\\_$2");
 var MarkdownRenderer = ({
   text,
   className,
   ...rest
 }) => {
-  const normalized = normalizeLatexDelimiters(text || "");
+  const protectedText = escapeInlineUnderscores(text || "");
+  const normalized = normalizeLatexDelimiters(protectedText);
   return /* @__PURE__ */ jsx137(
     MarkdownContainer,
     {
@@ -25945,7 +25976,7 @@ import { Fragment as Fragment35, jsx as jsx169, jsxs as jsxs80 } from "react/jsx
 var sizes6 = {
   M: 400,
   L: 500,
-  XL: 600
+  XL: 640
 };
 var styles2 = {
   backgroundColor: dark900,