@cloudscape-design/chat-components 1.0.95 → 1.0.97

package/avatar/interfaces.d.ts

@@ -51,6 +51,8 @@ export interface AvatarProps {
      */
     imgUrl?: string;
     /**
+     * An object containing CSS properties to customize the avatar's visual appearance.
+     * Refer to the [style](/components/avatar/?tabId=style) tab for more details.
      * @awsuiSystem core
      */
     style?: AvatarProps.Style;

package/avatar/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/avatar/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from \"@cloudscape-design/components/icon\";\n\nexport interface AvatarProps {\n  /**\n   * Determines the color of the avatar.\n   * Use `gen-ai` for AI assistants and `default` otherwise.\n   */\n  color?: AvatarProps.Color;\n\n  /**\n   * The text content shown in the avatar's tooltip.\n   *\n   * When you use this property, make sure to include it in the `ariaLabel`.\n   */\n  tooltipText?: string;\n\n  /**\n   * The text content shown directly in the avatar's body.\n   * Can be 1 or 2 symbols long, every subsequent symbol is ignored.\n   * Use it to define initials that uniquely identify the avatar's owner.\n   */\n  initials?: string;\n\n  /**\n   * When set to true, a loading indicator is shown in avatar.\n   */\n  loading?: boolean;\n\n  /**\n   * Text to describe the avatar for assistive technology.\n   * When more than one avatar is used, provide a unique label for each.\n   * For example, \"Avatar of John Doe\" or \"Avatar of generative AI assistant\".\n   *\n   * If `tooltipText` is used make sure to include it in the `ariaLabel`.\n   */\n  ariaLabel: string;\n\n  /**\n   * Specifies the icon to be displayed as Avatar.\n   * Use `gen-ai` icon for AI assistants. By default `user-profile` icon is used.\n   *\n   * If you set both `iconName` and `initials`, `initials` will take precedence.\n   */\n  iconName?: IconProps.Name;\n\n  /**\n   * Specifies the URL of a custom icon. Use this property if the icon you want isn't available, and your custom icon can't be an SVG.\n   * @deprecated Use `iconSvg` or `imgUrl` instead.\n   */\n  iconUrl?: string;\n\n  /**\n   * Specifies the SVG of a custom icon.\n   * Use this property if the icon you want isn't available.\n   */\n  iconSvg?: React.ReactNode;\n\n  /**\n   * Specifies the URL of a custom image. If you set both `iconUrl` and `imgUrl`, `imgUrl` will take precedence.\n   */\n  imgUrl?: string;\n\n  /**\n   * @awsuiSystem core\n   */\n  style?: AvatarProps.Style;\n\n  /**\n   * Defines the width and height of the avatar.\n   * This value corresponds to the `width` CSS-property and will center and crop images using `object-fit: cover`.\n   * The default and minimum width value is 28px.\n   */\n  width?: number;\n}\n\nexport namespace AvatarProps {\n  export type Color = \"default\" | \"gen-ai\";\n\n  export interface Style {\n    root?: {\n      background?: string;\n      borderColor?: string;\n      borderRadius?: string;\n      borderWidth?: string;\n      boxShadow?: string;\n      color?: string;\n      focusRing?: {\n        borderColor?: string;\n        borderRadius?: string;\n        borderWidth?: string;\n      };\n    };\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/avatar/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from \"@cloudscape-design/components/icon\";\n\nexport interface AvatarProps {\n  /**\n   * Determines the color of the avatar.\n   * Use `gen-ai` for AI assistants and `default` otherwise.\n   */\n  color?: AvatarProps.Color;\n\n  /**\n   * The text content shown in the avatar's tooltip.\n   *\n   * When you use this property, make sure to include it in the `ariaLabel`.\n   */\n  tooltipText?: string;\n\n  /**\n   * The text content shown directly in the avatar's body.\n   * Can be 1 or 2 symbols long, every subsequent symbol is ignored.\n   * Use it to define initials that uniquely identify the avatar's owner.\n   */\n  initials?: string;\n\n  /**\n   * When set to true, a loading indicator is shown in avatar.\n   */\n  loading?: boolean;\n\n  /**\n   * Text to describe the avatar for assistive technology.\n   * When more than one avatar is used, provide a unique label for each.\n   * For example, \"Avatar of John Doe\" or \"Avatar of generative AI assistant\".\n   *\n   * If `tooltipText` is used make sure to include it in the `ariaLabel`.\n   */\n  ariaLabel: string;\n\n  /**\n   * Specifies the icon to be displayed as Avatar.\n   * Use `gen-ai` icon for AI assistants. By default `user-profile` icon is used.\n   *\n   * If you set both `iconName` and `initials`, `initials` will take precedence.\n   */\n  iconName?: IconProps.Name;\n\n  /**\n   * Specifies the URL of a custom icon. Use this property if the icon you want isn't available, and your custom icon can't be an SVG.\n   * @deprecated Use `iconSvg` or `imgUrl` instead.\n   */\n  iconUrl?: string;\n\n  /**\n   * Specifies the SVG of a custom icon.\n   * Use this property if the icon you want isn't available.\n   */\n  iconSvg?: React.ReactNode;\n\n  /**\n   * Specifies the URL of a custom image. If you set both `iconUrl` and `imgUrl`, `imgUrl` will take precedence.\n   */\n  imgUrl?: string;\n\n  /**\n   * An object containing CSS properties to customize the avatar's visual appearance.\n   * Refer to the [style](/components/avatar/?tabId=style) tab for more details.\n   * @awsuiSystem core\n   */\n  style?: AvatarProps.Style;\n\n  /**\n   * Defines the width and height of the avatar.\n   * This value corresponds to the `width` CSS-property and will center and crop images using `object-fit: cover`.\n   * The default and minimum width value is 28px.\n   */\n  width?: number;\n}\n\nexport namespace AvatarProps {\n  export type Color = \"default\" | \"gen-ai\";\n\n  export interface Style {\n    root?: {\n      background?: string;\n      borderColor?: string;\n      borderRadius?: string;\n      borderWidth?: string;\n      boxShadow?: string;\n      color?: string;\n      focusRing?: {\n        borderColor?: string;\n        borderRadius?: string;\n        borderWidth?: string;\n      };\n    };\n  }\n}\n"]}

package/chat-bubble/interfaces.d.ts

@@ -23,6 +23,8 @@ export interface ChatBubbleProps {
      */
     hideAvatar?: boolean;
     /**
+     * An object containing CSS properties to customize the chat bubble's visual appearance.
+     * Refer to the [style](/components/chat-bubble/?tabId=style) tab for more details.
      * @awsuiSystem core
      */
     style?: ChatBubbleProps.Style;
@@ -40,8 +42,10 @@ export declare namespace ChatBubbleProps {
             borderWidth?: string;
             boxShadow?: string;
             color?: string;
+            fontFamily?: string;
             fontSize?: string;
             fontWeight?: string;
+            letterSpacing?: string;
             rowGap?: string;
             paddingBlock?: string;
             paddingInline?: string;

package/chat-bubble/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/chat-bubble/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport interface ChatBubbleProps {\n  /** Avatar slot paired with the chat bubble content. Use [avatar](/components/avatar/). */\n  avatar: React.ReactNode;\n\n  /** Defines the type of the chat bubble and sets its color accordingly.  */\n  type: ChatBubbleProps.Type;\n\n  /** Content of the chat bubble */\n  children: React.ReactNode;\n\n  /** Actions slot of the chat bubble, placed at the footer. Use [button group](/components/button-group/). */\n  actions?: React.ReactNode;\n\n  /**\n   * Adds a loading bar to the bottom of the chat bubble. This property should only be used for Generative AI loading state.\n   * If avatar is being used, set its `loading` state to true.\n   */\n  showLoadingBar?: boolean;\n\n  /**\n   * Adds aria-label to the chat bubble container. Use this to provide a unique accessible name for each chat bubble on the page.\n   * For example, \"John Doe at 3:42:10am\".\n   */\n  ariaLabel: string;\n\n  /**\n   * Hides the avatar while preserving its space.\n   * Useful for when there are multiple consecutive messages coming from the same author.\n   */\n  hideAvatar?: boolean;\n\n  /**\n   * @awsuiSystem core\n   */\n  style?: ChatBubbleProps.Style;\n}\n\nexport namespace ChatBubbleProps {\n  export type Type = \"incoming\" | \"outgoing\";\n  export interface Style {\n    root?: {\n      columnGap?: string;\n    };\n    bubble?: {\n      background?: string;\n      borderColor?: string;\n      borderRadius?: string;\n      borderWidth?: string;\n      boxShadow?: string;\n      color?: string;\n      fontSize?: string;\n      fontWeight?: string;\n      rowGap?: string;\n      paddingBlock?: string;\n      paddingInline?: string;\n    };\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/chat-bubble/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport interface ChatBubbleProps {\n  /** Avatar slot paired with the chat bubble content. Use [avatar](/components/avatar/). */\n  avatar: React.ReactNode;\n\n  /** Defines the type of the chat bubble and sets its color accordingly.  */\n  type: ChatBubbleProps.Type;\n\n  /** Content of the chat bubble */\n  children: React.ReactNode;\n\n  /** Actions slot of the chat bubble, placed at the footer. Use [button group](/components/button-group/). */\n  actions?: React.ReactNode;\n\n  /**\n   * Adds a loading bar to the bottom of the chat bubble. This property should only be used for Generative AI loading state.\n   * If avatar is being used, set its `loading` state to true.\n   */\n  showLoadingBar?: boolean;\n\n  /**\n   * Adds aria-label to the chat bubble container. Use this to provide a unique accessible name for each chat bubble on the page.\n   * For example, \"John Doe at 3:42:10am\".\n   */\n  ariaLabel: string;\n\n  /**\n   * Hides the avatar while preserving its space.\n   * Useful for when there are multiple consecutive messages coming from the same author.\n   */\n  hideAvatar?: boolean;\n\n  /**\n   * An object containing CSS properties to customize the chat bubble's visual appearance.\n   * Refer to the [style](/components/chat-bubble/?tabId=style) tab for more details.\n   * @awsuiSystem core\n   */\n  style?: ChatBubbleProps.Style;\n}\n\nexport namespace ChatBubbleProps {\n  export type Type = \"incoming\" | \"outgoing\";\n  export interface Style {\n    root?: {\n      columnGap?: string;\n    };\n    bubble?: {\n      background?: string;\n      borderColor?: string;\n      borderRadius?: string;\n      borderWidth?: string;\n      boxShadow?: string;\n      color?: string;\n      fontFamily?: string;\n      fontSize?: string;\n      fontWeight?: string;\n      letterSpacing?: string;\n      rowGap?: string;\n      paddingBlock?: string;\n      paddingInline?: string;\n    };\n  }\n}\n"]}

package/chat-bubble/style.d.ts

@@ -12,8 +12,10 @@ export declare function getBubbleStyle(style: ChatBubbleProps.Style | undefined)
     borderWidth?: undefined;
     boxShadow?: undefined;
     color?: undefined;
+    fontFamily?: undefined;
     fontSize?: undefined;
     fontWeight?: undefined;
+    letterSpacing?: undefined;
     paddingBlock?: undefined;
     paddingInline?: undefined;
     rowGap?: undefined;
@@ -25,8 +27,10 @@ export declare function getBubbleStyle(style: ChatBubbleProps.Style | undefined)
     borderWidth: string | undefined;
     boxShadow: string | undefined;
     color: string | undefined;
+    fontFamily: string | undefined;
     fontSize: string | undefined;
     fontWeight: string | undefined;
+    letterSpacing: string | undefined;
     paddingBlock: string | undefined;
     paddingInline: string | undefined;
     rowGap: string | undefined;

package/chat-bubble/style.js

@@ -11,7 +11,7 @@ export function getChatBubbleRootStyle(style) {
     };
 }
 export function getBubbleStyle(style) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
     if (SYSTEM !== "core") {
         return {};
     }
@@ -23,11 +23,13 @@ export function getBubbleStyle(style) {
         borderWidth: (_e = style === null || style === void 0 ? void 0 : style.bubble) === null || _e === void 0 ? void 0 : _e.borderWidth,
         boxShadow: (_f = style === null || style === void 0 ? void 0 : style.bubble) === null || _f === void 0 ? void 0 : _f.boxShadow,
         color: (_g = style === null || style === void 0 ? void 0 : style.bubble) === null || _g === void 0 ? void 0 : _g.color,
-        fontSize: (_h = style === null || style === void 0 ? void 0 : style.bubble) === null || _h === void 0 ? void 0 : _h.fontSize,
-        fontWeight: (_j = style === null || style === void 0 ? void 0 : style.bubble) === null || _j === void 0 ? void 0 : _j.fontWeight,
-        paddingBlock: (_k = style === null || style === void 0 ? void 0 : style.bubble) === null || _k === void 0 ? void 0 : _k.paddingBlock,
-        paddingInline: (_l = style === null || style === void 0 ? void 0 : style.bubble) === null || _l === void 0 ? void 0 : _l.paddingInline,
-        rowGap: (_m = style === null || style === void 0 ? void 0 : style.bubble) === null || _m === void 0 ? void 0 : _m.rowGap,
+        fontFamily: (_h = style === null || style === void 0 ? void 0 : style.bubble) === null || _h === void 0 ? void 0 : _h.fontFamily,
+        fontSize: (_j = style === null || style === void 0 ? void 0 : style.bubble) === null || _j === void 0 ? void 0 : _j.fontSize,
+        fontWeight: (_k = style === null || style === void 0 ? void 0 : style.bubble) === null || _k === void 0 ? void 0 : _k.fontWeight,
+        letterSpacing: (_l = style === null || style === void 0 ? void 0 : style.bubble) === null || _l === void 0 ? void 0 : _l.letterSpacing,
+        paddingBlock: (_m = style === null || style === void 0 ? void 0 : style.bubble) === null || _m === void 0 ? void 0 : _m.paddingBlock,
+        paddingInline: (_o = style === null || style === void 0 ? void 0 : style.bubble) === null || _o === void 0 ? void 0 : _o.paddingInline,
+        rowGap: (_p = style === null || style === void 0 ? void 0 : style.bubble) === null || _p === void 0 ? void 0 : _p.rowGap,
     };
 }
 //# sourceMappingURL=style.js.map

package/chat-bubble/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/chat-bubble/style.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAGjD,MAAM,UAAU,sBAAsB,CAAC,KAAwC;;IAC7E,IAAI,MAAM,KAAK,MAAM,EAAE;QACrB,OAAO,EAAE,CAAC;KACX;IAED,OAAO;QACL,SAAS,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,0CAAE,SAAS;KAClC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,KAAwC;;IACrE,IAAI,MAAM,KAAK,MAAM,EAAE;QACrB,OAAO,EAAE,CAAC;KACX;IAED,OAAO;QACL,UAAU,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,UAAU;QACrC,WAAW,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,WAAW;QACvC,YAAY,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,YAAY;QACzC,WAAW,EAAE,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,WAAW,EAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS;QAC7D,WAAW,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,WAAW;QACvC,SAAS,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,SAAS;QACnC,KAAK,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,KAAK;QAC3B,QAAQ,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,QAAQ;QACjC,UAAU,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,UAAU;QACrC,YAAY,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,YAAY;QACzC,aAAa,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,aAAa;QAC3C,MAAM,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,MAAM;KAC9B,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { SYSTEM } from \"../internal/environment\";\nimport { ChatBubbleProps } from \"./interfaces\";\n\nexport function getChatBubbleRootStyle(style: ChatBubbleProps.Style | undefined) {\n  if (SYSTEM !== \"core\") {\n    return {};\n  }\n\n  return {\n    columnGap: style?.root?.columnGap,\n  };\n}\n\nexport function getBubbleStyle(style: ChatBubbleProps.Style | undefined) {\n  if (SYSTEM !== \"core\") {\n    return {};\n  }\n\n  return {\n    background: style?.bubble?.background,\n    borderColor: style?.bubble?.borderColor,\n    borderRadius: style?.bubble?.borderRadius,\n    borderStyle: style?.bubble?.borderWidth ? \"solid\" : undefined,\n    borderWidth: style?.bubble?.borderWidth,\n    boxShadow: style?.bubble?.boxShadow,\n    color: style?.bubble?.color,\n    fontSize: style?.bubble?.fontSize,\n    fontWeight: style?.bubble?.fontWeight,\n    paddingBlock: style?.bubble?.paddingBlock,\n    paddingInline: style?.bubble?.paddingInline,\n    rowGap: style?.bubble?.rowGap,\n  };\n}\n"]}
+{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/chat-bubble/style.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAGjD,MAAM,UAAU,sBAAsB,CAAC,KAAwC;;IAC7E,IAAI,MAAM,KAAK,MAAM,EAAE;QACrB,OAAO,EAAE,CAAC;KACX;IAED,OAAO;QACL,SAAS,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,0CAAE,SAAS;KAClC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,KAAwC;;IACrE,IAAI,MAAM,KAAK,MAAM,EAAE;QACrB,OAAO,EAAE,CAAC;KACX;IAED,OAAO;QACL,UAAU,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,UAAU;QACrC,WAAW,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,WAAW;QACvC,YAAY,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,YAAY;QACzC,WAAW,EAAE,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,WAAW,EAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS;QAC7D,WAAW,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,WAAW;QACvC,SAAS,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,SAAS;QACnC,KAAK,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,KAAK;QAC3B,UAAU,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,UAAU;QACrC,QAAQ,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,QAAQ;QACjC,UAAU,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,UAAU;QACrC,aAAa,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,aAAa;QAC3C,YAAY,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,YAAY;QACzC,aAAa,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,aAAa;QAC3C,MAAM,EAAE,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,MAAM;KAC9B,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { SYSTEM } from \"../internal/environment\";\nimport { ChatBubbleProps } from \"./interfaces\";\n\nexport function getChatBubbleRootStyle(style: ChatBubbleProps.Style | undefined) {\n  if (SYSTEM !== \"core\") {\n    return {};\n  }\n\n  return {\n    columnGap: style?.root?.columnGap,\n  };\n}\n\nexport function getBubbleStyle(style: ChatBubbleProps.Style | undefined) {\n  if (SYSTEM !== \"core\") {\n    return {};\n  }\n\n  return {\n    background: style?.bubble?.background,\n    borderColor: style?.bubble?.borderColor,\n    borderRadius: style?.bubble?.borderRadius,\n    borderStyle: style?.bubble?.borderWidth ? \"solid\" : undefined,\n    borderWidth: style?.bubble?.borderWidth,\n    boxShadow: style?.bubble?.boxShadow,\n    color: style?.bubble?.color,\n    fontFamily: style?.bubble?.fontFamily,\n    fontSize: style?.bubble?.fontSize,\n    fontWeight: style?.bubble?.fontWeight,\n    letterSpacing: style?.bubble?.letterSpacing,\n    paddingBlock: style?.bubble?.paddingBlock,\n    paddingInline: style?.bubble?.paddingInline,\n    rowGap: style?.bubble?.rowGap,\n  };\n}\n"]}

package/internal/api-docs/components/avatar.js

@@ -282,6 +282,7 @@ module.exports = {
         ]
       },
       "optional": true,
+      "description": "An object containing CSS properties to customize the avatar's visual appearance.\nRefer to the [style](/components/avatar/?tabId=style) tab for more details.",
       "systemTags": [
         "core"
       ]

package/internal/api-docs/components/chat-bubble.js

@@ -49,7 +49,7 @@ module.exports = {
           {
             "name": "bubble",
             "optional": true,
-            "type": "{ background?: string | undefined; borderColor?: string | undefined; borderRadius?: string | undefined; borderWidth?: string | undefined; boxShadow?: string | undefined; color?: string | undefined; ... 4 more ...; paddingInline?: string | undefined; }",
+            "type": "{ background?: string | undefined; borderColor?: string | undefined; borderRadius?: string | undefined; borderWidth?: string | undefined; boxShadow?: string | undefined; color?: string | undefined; ... 6 more ...; paddingInline?: string | undefined; }",
             "inlineType": {
               "name": "object",
               "type": "object",
@@ -84,6 +84,11 @@ module.exports = {
                   "optional": true,
                   "type": "string"
                 },
+                {
+                  "name": "fontFamily",
+                  "optional": true,
+                  "type": "string"
+                },
                 {
                   "name": "fontSize",
                   "optional": true,
@@ -94,6 +99,11 @@ module.exports = {
                   "optional": true,
                   "type": "string"
                 },
+                {
+                  "name": "letterSpacing",
+                  "optional": true,
+                  "type": "string"
+                },
                 {
                   "name": "paddingBlock",
                   "optional": true,
@@ -131,6 +141,7 @@ module.exports = {
         ]
       },
       "optional": true,
+      "description": "An object containing CSS properties to customize the chat bubble's visual appearance.\nRefer to the [style](/components/chat-bubble/?tabId=style) tab for more details.",
       "systemTags": [
         "core"
       ]

package/internal/environment.js

@@ -1,5 +1,5 @@
 export var PACKAGE_SOURCE = "chat-components";
-export var PACKAGE_VERSION = "1.0.0 (f4e982f2)";
+export var PACKAGE_VERSION = "1.0.0 (8fdd3f37)";
 export var THEME = "open-source-visual-refresh";
 export var SYSTEM = "core";
 export var ALWAYS_VISUAL_REFRESH = true;

package/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "chat-components",
-  "PACKAGE_VERSION": "1.0.0 (f4e982f2)",
+  "PACKAGE_VERSION": "1.0.0 (8fdd3f37)",
   "THEME": "open-source-visual-refresh",
   "SYSTEM": "core",
   "ALWAYS_VISUAL_REFRESH": true

package/internal/generated/styles/tokens.d.ts

@@ -558,6 +558,7 @@ export const fontChartDetailSize: string;
 export const fontDisplayLabelWeight: string;
 export const fontExpandableHeadingSize: string;
 export const fontFamilyBase: string;
+export const fontFamilyHeading: string;
 export const fontFamilyMonospace: string;
 export const fontHeaderH2DescriptionLineHeight: string;
 export const fontHeaderH2DescriptionSize: string;

package/internal/generated/styles/tokens.js

@@ -558,6 +558,7 @@ export var fontChartDetailSize = "var(--font-chart-detail-size-9qr25q, 12px)";
 export var fontDisplayLabelWeight = "var(--font-display-label-weight-zavpeo, 700)";
 export var fontExpandableHeadingSize = "var(--font-expandable-heading-size-0uk059, 16px)";
 export var fontFamilyBase = "var(--font-family-base-gmnpzl, 'Open Sans', 'Helvetica Neue', Roboto, Arial, sans-serif)";
+export var fontFamilyHeading = "var(--font-family-heading-ugphat, 'Open Sans', 'Helvetica Neue', Roboto, Arial, sans-serif)";
 export var fontFamilyMonospace = "var(--font-family-monospace-q47m7k, Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace)";
 export var fontHeaderH2DescriptionLineHeight = "var(--font-header-h2-description-line-height-ts2s6o, 20px)";
 export var fontHeaderH2DescriptionSize = "var(--font-header-h2-description-size-g2wws3, 14px)";

package/internal/generated/theming/index.cjs

@@ -2261,6 +2261,7 @@ module.exports.preset = {
       "fontDisplayLabelWeight": "700",
       "fontExpandableHeadingSize": "{fontSizeHeadingS}",
       "fontFamilyBase": "'Open Sans', 'Helvetica Neue', Roboto, Arial, sans-serif",
+      "fontFamilyHeading": "{fontFamilyBase}",
       "fontFamilyMonospace": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
       "fontHeaderH2DescriptionLineHeight": "{lineHeightBodyM}",
       "fontHeaderH2DescriptionSize": "{fontSizeBodyM}",
@@ -11731,6 +11732,7 @@ module.exports.preset = {
     "colorDropzoneBorderHover",
     "colorTreeViewConnectorLine",
     "fontFamilyBase",
+    "fontFamilyHeading",
     "fontFamilyMonospace",
     "fontSizeBodyM",
     "fontSizeBodyS",
@@ -12109,6 +12111,7 @@ module.exports.preset = {
     "colorDropzoneBorderHover",
     "colorTreeViewConnectorLine",
     "fontFamilyBase",
+    "fontFamilyHeading",
     "fontFamilyMonospace",
     "fontSizeBodyM",
     "fontSizeBodyS",
@@ -12758,6 +12761,7 @@ module.exports.preset = {
     "fontDisplayLabelWeight": "font-display-label-weight",
     "fontExpandableHeadingSize": "font-expandable-heading-size",
     "fontFamilyBase": "font-family-base",
+    "fontFamilyHeading": "font-family-heading",
     "fontFamilyMonospace": "font-family-monospace",
     "fontHeaderH2DescriptionLineHeight": "font-header-h2-description-line-height",
     "fontHeaderH2DescriptionSize": "font-header-h2-description-size",
@@ -13577,6 +13581,7 @@ module.exports.preset = {
     "fontDisplayLabelWeight": "--font-display-label-weight-zavpeo",
     "fontExpandableHeadingSize": "--font-expandable-heading-size-0uk059",
     "fontFamilyBase": "--font-family-base-gmnpzl",
+    "fontFamilyHeading": "--font-family-heading-ugphat",
     "fontFamilyMonospace": "--font-family-monospace-q47m7k",
     "fontHeaderH2DescriptionLineHeight": "--font-header-h2-description-line-height-ts2s6o",
     "fontHeaderH2DescriptionSize": "--font-header-h2-description-size-g2wws3",

package/internal/generated/theming/index.cjs.d.ts

@@ -230,6 +230,7 @@ export declare interface TypedOverride {
     colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
     colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
     fontFamilyBase?: GlobalValue;
+    fontFamilyHeading?: GlobalValue;
     fontFamilyMonospace?: GlobalValue;
     fontSizeBodyM?: GlobalValue;
     fontSizeBodyS?: GlobalValue;
@@ -512,6 +513,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -794,6 +796,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1076,6 +1079,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1358,6 +1362,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1640,6 +1645,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1922,6 +1928,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -2204,6 +2211,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -2486,6 +2494,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;

package/internal/generated/theming/index.d.ts

@@ -230,6 +230,7 @@ export declare interface TypedOverride {
     colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
     colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
     fontFamilyBase?: GlobalValue;
+    fontFamilyHeading?: GlobalValue;
     fontFamilyMonospace?: GlobalValue;
     fontSizeBodyM?: GlobalValue;
     fontSizeBodyS?: GlobalValue;
@@ -512,6 +513,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -794,6 +796,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1076,6 +1079,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1358,6 +1362,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1640,6 +1645,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -1922,6 +1928,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -2204,6 +2211,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;
@@ -2486,6 +2494,7 @@ export declare interface TypedOverride {
         colorDropzoneBorderHover?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         colorTreeViewConnectorLine?: GlobalValue | TypedModeValueOverride<'light' | 'dark'>;
         fontFamilyBase?: GlobalValue;
+        fontFamilyHeading?: GlobalValue;
         fontFamilyMonospace?: GlobalValue;
         fontSizeBodyM?: GlobalValue;
         fontSizeBodyS?: GlobalValue;

package/internal/generated/theming/index.js

@@ -2261,6 +2261,7 @@ export var preset = {
       "fontDisplayLabelWeight": "700",
       "fontExpandableHeadingSize": "{fontSizeHeadingS}",
       "fontFamilyBase": "'Open Sans', 'Helvetica Neue', Roboto, Arial, sans-serif",
+      "fontFamilyHeading": "{fontFamilyBase}",
       "fontFamilyMonospace": "Monaco, Menlo, Consolas, 'Courier Prime', Courier, 'Courier New', monospace",
       "fontHeaderH2DescriptionLineHeight": "{lineHeightBodyM}",
       "fontHeaderH2DescriptionSize": "{fontSizeBodyM}",
@@ -11731,6 +11732,7 @@ export var preset = {
     "colorDropzoneBorderHover",
     "colorTreeViewConnectorLine",
     "fontFamilyBase",
+    "fontFamilyHeading",
     "fontFamilyMonospace",
     "fontSizeBodyM",
     "fontSizeBodyS",
@@ -12109,6 +12111,7 @@ export var preset = {
     "colorDropzoneBorderHover",
     "colorTreeViewConnectorLine",
     "fontFamilyBase",
+    "fontFamilyHeading",
     "fontFamilyMonospace",
     "fontSizeBodyM",
     "fontSizeBodyS",
@@ -12758,6 +12761,7 @@ export var preset = {
     "fontDisplayLabelWeight": "font-display-label-weight",
     "fontExpandableHeadingSize": "font-expandable-heading-size",
     "fontFamilyBase": "font-family-base",
+    "fontFamilyHeading": "font-family-heading",
     "fontFamilyMonospace": "font-family-monospace",
     "fontHeaderH2DescriptionLineHeight": "font-header-h2-description-line-height",
     "fontHeaderH2DescriptionSize": "font-header-h2-description-size",
@@ -13577,6 +13581,7 @@ export var preset = {
     "fontDisplayLabelWeight": "--font-display-label-weight-zavpeo",
     "fontExpandableHeadingSize": "--font-expandable-heading-size-0uk059",
     "fontFamilyBase": "--font-family-base-gmnpzl",
+    "fontFamilyHeading": "--font-family-heading-ugphat",
     "fontFamilyMonospace": "--font-family-monospace-q47m7k",
     "fontHeaderH2DescriptionLineHeight": "--font-header-h2-description-line-height-ts2s6o",
     "fontHeaderH2DescriptionSize": "--font-header-h2-description-size-g2wws3",

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "f4e982f2e42c5b29bce4156041ed23a110180402"
+  "commit": "8fdd3f37ecee9619ac8806a71b4c86c624461aa9"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/chat-components",
-  "version": "1.0.95",
+  "version": "1.0.97",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/cloudscape-design/chat-components.git"