@carbon/ai-chat 1.8.0 → 1.9.0

package/README.md

@@ -18,7 +18,7 @@ yarn add @carbon/ai-chat
 
 This will install the package that contains both the web component and React versions of the chat application.
 
-## 📖 Documentation
+## Documentation
 
 - [Documentation site](https://chat.carbondesignsystem.com/tag/latest/docs/documents/Overview.html)
 - [Demo site](https://chat.carbondesignsystem.com/tag/latest/demo/index.html)

package/dist/es/aiChatEntry.js

@@ -1,6 +1,6 @@
 import { B as BusEventType } from "./chat.languageUtils.js";
 
-export { a as ButtonItemKind, b as ButtonItemType, C as CancellationReason, c as CarbonTheme, d as CornersType, E as ErrorType, F as FeedbackInteractionType, e as FileStatusValue, H as HumanAgentMessageType, f as HumanAgentsOnlineStatus, I as IFrameItemDisplayOption, M as MessageErrorState, g as MessageInputType, h as MessageResponseTypes, i as MessageSendSource, j as MinimizeButtonIconType, O as OnErrorType, k as OptionItemPreference, P as PageObjectId, l as PanelType, R as ReasoningStepOpenState, S as ScreenShareState, U as UserType, V as ViewChangeReason, m as ViewType, W as WidthOptions, n as WriteableElementName, o as enLanguagePack } from "./chat.languageUtils.js";
+export { a as ButtonItemKind, b as ButtonItemType, C as CancellationReason, c as CarbonTheme, d as CornersType, E as ErrorType, F as FeedbackInteractionType, e as FileStatusValue, H as HeaderMenuClickType, f as HumanAgentMessageType, g as HumanAgentsOnlineStatus, I as IFrameItemDisplayOption, M as MessageErrorState, h as MessageInputType, i as MessageResponseTypes, j as MessageSendSource, k as MinimizeButtonIconType, O as OnErrorType, l as OptionItemPreference, P as PageObjectId, m as PanelType, R as ReasoningStepOpenState, S as ScreenShareState, U as UserType, V as ViewChangeReason, n as ViewType, W as WidthOptions, o as WriteableElementName, p as enLanguagePack } from "./chat.languageUtils.js";
 
 export { L as LayoutCustomProperties } from "./chat.LayoutCustomProperties.js";
 
@@ -26,7 +26,7 @@ import "dayjs/locale/en.js";
 
 import "lodash-es/isEqual.js";
 
-import "use-sync-external-store/shim";
+import "use-sync-external-store/shim/index.js";
 
 import "compute-scroll-into-view";
 
@@ -66,9 +66,9 @@ import "@carbon/icons/es/overflow-menu--vertical/16.js";
 
 import "@carbon/icons/es/restart/16.js";
 
-import "@carbon/icons/es/right-panel--close/16.js";
+import "@carbon/icons/es/right-panel--open/16.js";
 
-import "@carbon/icons/es/side-panel--close/16.js";
+import "@carbon/icons/es/right-panel--close/16.js";
 
 import "@carbon/icons/es/subtract--large/16.js";
 
@@ -80,13 +80,7 @@ import "@carbon/web-components/es/components/ai-label/ai-label-action-button.js"
 
 import "@carbon/web-components/es/components/ai-label/ai-label.js";
 
-import "@carbon/web-components/es/components/overflow-menu/overflow-menu.js";
-
-import "@carbon/web-components/es/components/overflow-menu/overflow-menu-body.js";
-
-import "@carbon/web-components/es/components/overflow-menu/overflow-menu-item.js";
-
-import "lit/decorators.js";
+import "@carbon/ai-chat-components/es/react/chat-header.js";
 
 import "lodash-es/throttle.js";
 
@@ -98,6 +92,8 @@ import "@carbon/icons/es/user--avatar/32.js";
 
 import "@carbon/ai-chat-components/es/react/markdown.js";
 
+import "@carbon/web-components/es/components/tile/clickable-tile.js";
+
 import "@carbon/ai-chat-components/es/react/chat-button.js";
 
 import "@carbon/ai-chat-components/es/react/processing.js";
@@ -192,6 +188,8 @@ import "@carbon/web-components/es/components/dropdown/dropdown.js";
 
 import "@carbon/web-components/es/components/dropdown/dropdown-item.js";
 
+import "@carbon/web-components/es/components/dropdown/defs.js";
+
 import "@carbon/ai-chat-components/es/react/chain-of-thought.js";
 
 import "@carbon/ai-chat-components/es/react/chain-of-thought-step.js";
@@ -212,6 +210,8 @@ import "@carbon/web-components/es/globals/internal/icon-loader.js";
 
 import "@carbon/icons/es/stop--filled/16.js";
 
+import "lit/decorators.js";
+
 import "@carbon/ai-chat-components/es/react/panel.js";
 
 import "@carbon/icons/es/chevron--down/20.js";
@@ -247,7 +247,7 @@ const ReactChatContainer = React.memo(createComponent({
 }));
 
 function ChatContainer(props) {
-  const {onBeforeRender, onAfterRender, strings, serviceDeskFactory, serviceDesk, renderUserDefinedResponse, renderCustomMessageFooter, renderWriteableElements, element, onError, openChatByDefault, disclaimer, disableCustomElementMobileEnhancements, debug, exposeServiceManagerForTesting, injectCarbonTheme, aiEnabled, shouldTakeFocusIfOpensAutomatically, namespace, shouldSanitizeHTML, header, layout, messaging, isReadonly, persistFeedback, assistantName, locale, homescreen, launcher, input} = props;
+  const {onBeforeRender, onAfterRender, strings, serviceDeskFactory, serviceDesk, renderUserDefinedResponse, renderCustomMessageFooter, renderWriteableElements, element, onError, openChatByDefault, disclaimer, disableCustomElementMobileEnhancements, debug, exposeServiceManagerForTesting, injectCarbonTheme, aiEnabled, shouldTakeFocusIfOpensAutomatically, namespace, shouldSanitizeHTML, header, layout, messaging, isReadonly, persistFeedback, assistantName, locale, homescreen, launcher, input, keyboardShortcuts} = props;
   const config = useMemo(() => ({
     onError,
     openChatByDefault,
@@ -269,8 +269,9 @@ function ChatContainer(props) {
     locale,
     homescreen,
     launcher,
-    input
-  }), [ onError, openChatByDefault, disclaimer, disableCustomElementMobileEnhancements, debug, exposeServiceManagerForTesting, injectCarbonTheme, aiEnabled, shouldTakeFocusIfOpensAutomatically, namespace, shouldSanitizeHTML, header, layout, messaging, isReadonly, persistFeedback, assistantName, locale, homescreen, launcher, input ]);
+    input,
+    keyboardShortcuts
+  }), [ onError, openChatByDefault, disclaimer, disableCustomElementMobileEnhancements, debug, exposeServiceManagerForTesting, injectCarbonTheme, aiEnabled, shouldTakeFocusIfOpensAutomatically, namespace, shouldSanitizeHTML, header, layout, messaging, isReadonly, persistFeedback, assistantName, locale, homescreen, launcher, input, keyboardShortcuts ]);
   const wrapperRef = useRef(null);
   const [wrapper, setWrapper] = useState(null);
   const [container, setContainer] = useState(null);
@@ -375,7 +376,7 @@ if (isBrowser() && !document.getElementById("cds-aichat-custom-element-styles"))
 }
 
 function ChatCustomElement(props) {
-  const {strings, serviceDeskFactory, serviceDesk, onBeforeRender, onAfterRender, renderUserDefinedResponse, renderCustomMessageFooter, renderWriteableElements, className, id, onViewChange, onViewPreChange, onError, openChatByDefault, disclaimer, disableCustomElementMobileEnhancements, debug, exposeServiceManagerForTesting, injectCarbonTheme, aiEnabled, shouldTakeFocusIfOpensAutomatically, namespace, shouldSanitizeHTML, header, layout, messaging, isReadonly, persistFeedback, assistantName, locale, homescreen, launcher, input} = props;
+  const {strings, serviceDeskFactory, serviceDesk, onBeforeRender, onAfterRender, renderUserDefinedResponse, renderCustomMessageFooter, renderWriteableElements, className, id, onViewChange, onViewPreChange, onError, openChatByDefault, disclaimer, disableCustomElementMobileEnhancements, debug, exposeServiceManagerForTesting, injectCarbonTheme, aiEnabled, shouldTakeFocusIfOpensAutomatically, namespace, shouldSanitizeHTML, header, layout, messaging, isReadonly, persistFeedback, assistantName, locale, homescreen, launcher, input, keyboardShortcuts} = props;
   const [customElement, setCustomElement] = useState();
   const onBeforeRenderOverride = useCallback(async instance => {
     function defaultViewChangeHandler(event) {
@@ -424,6 +425,8 @@ function ChatCustomElement(props) {
     locale,
     homescreen,
     launcher,
+    input,
+    keyboardShortcuts,
     strings,
     serviceDeskFactory,
     serviceDesk,
@@ -432,8 +435,7 @@ function ChatCustomElement(props) {
     renderUserDefinedResponse,
     renderCustomMessageFooter,
     renderWriteableElements,
-    element: customElement,
-    input
+    element: customElement
   }));
 }
 

package/dist/es/aiChatEntry.js.map

@@ -1 +1 @@
-{"version":3,"file":"aiChatEntry.js","sources":["../../../../src/react/ChatContainer.tsx","../../../../src/react/ChatCustomElement.tsx"],"sourcesContent":["/*\n *  Copyright IBM Corp. 2025\n *\n *  This source code is licensed under the Apache-2.0 license found in the\n *  LICENSE file in the root directory of this source tree.\n *\n *  @license\n */\n\nimport { createComponent } from \"@lit/react\";\nimport { css, LitElement, PropertyValues } from \"lit\";\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport ChatAppEntry from \"../chat/ChatAppEntry\";\nimport { carbonElement } from \"@carbon/ai-chat-components/es/globals/decorators/index.js\";\nimport { ChatContainerProps } from \"../types/component/ChatContainer\";\nimport { ChatInstance } from \"../types/instance/ChatInstance\";\nimport { PublicConfig } from \"../types/config/PublicConfig\";\nimport { isBrowser } from \"../chat/utils/browserUtils\";\n\n/**\n * This component creates a custom element protected by a shadow DOM to render the React application into. It creates\n * slotted elements for user_defined responses and for writable elements.\n *\n * The corresponding slots are defined within the React application and are rendered in place.\n */\n\n/**\n * Create a web component to host the React application. We do this so we can provide custom elements and user_defined responses as\n * slotted content so they maintain their own styling in a safe way.\n */\n@carbonElement(\"cds-aichat-react\")\nclass ChatContainerReact extends LitElement {\n  static styles = css`\n    :host {\n      width: 100%;\n      height: 100%;\n    }\n  `;\n\n  /**\n   * Dispatch a custom event when the shadow DOM is ready\n   * This ensures React can safely access shadowRoot\n   */\n  firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n    this.dispatchEvent(new CustomEvent(\"shadow-ready\", { bubbles: true }));\n  }\n}\n\n// Wrap the custom element as a React component\nconst ReactChatContainer = React.memo(\n  createComponent({\n    tagName: \"cds-aichat-react\",\n    elementClass: ChatContainerReact,\n    react: React,\n  }),\n);\n\n/**\n * The ChatContainer controls rendering the React application into the shadow DOM of the cds-aichat-react web component.\n * It also injects the writeable element and user_defined response slots into said web component.\n *\n * @category React\n */\nfunction ChatContainer(props: ChatContainerProps) {\n  const {\n    onBeforeRender,\n    onAfterRender,\n    strings,\n    serviceDeskFactory,\n    serviceDesk,\n    renderUserDefinedResponse,\n    renderCustomMessageFooter,\n    renderWriteableElements,\n    element,\n    // Flattened PublicConfig properties\n    onError,\n    openChatByDefault,\n    disclaimer,\n    disableCustomElementMobileEnhancements,\n    debug,\n    exposeServiceManagerForTesting,\n    injectCarbonTheme,\n    aiEnabled,\n    shouldTakeFocusIfOpensAutomatically,\n    namespace,\n    shouldSanitizeHTML,\n    header,\n    layout,\n    messaging,\n    isReadonly,\n    persistFeedback,\n    assistantName,\n    locale,\n    homescreen,\n    launcher,\n    input,\n  } = props;\n  // Reconstruct PublicConfig from flattened props\n  const config = useMemo(\n    (): PublicConfig => ({\n      onError,\n      openChatByDefault,\n      disclaimer,\n      disableCustomElementMobileEnhancements,\n      debug,\n      exposeServiceManagerForTesting,\n      injectCarbonTheme,\n      aiEnabled,\n      shouldTakeFocusIfOpensAutomatically,\n      namespace,\n      shouldSanitizeHTML,\n      header,\n      layout,\n      messaging,\n      isReadonly,\n      persistFeedback,\n      assistantName,\n      locale,\n      homescreen,\n      launcher,\n      input,\n    }),\n    [\n      onError,\n      openChatByDefault,\n      disclaimer,\n      disableCustomElementMobileEnhancements,\n      debug,\n      exposeServiceManagerForTesting,\n      injectCarbonTheme,\n      aiEnabled,\n      shouldTakeFocusIfOpensAutomatically,\n      namespace,\n      shouldSanitizeHTML,\n      header,\n      layout,\n      messaging,\n      isReadonly,\n      persistFeedback,\n      assistantName,\n      locale,\n      homescreen,\n      launcher,\n      input,\n    ],\n  );\n\n  const wrapperRef = useRef(null); // Ref for the React wrapper component\n  const [wrapper, setWrapper] = useState(null);\n  const [container, setContainer] = useState<HTMLElement | null>(null); // Actual element we render the React Portal to in the Shadowroot.\n\n  const [writeableElementSlots, setWriteableElementSlots] = useState<\n    HTMLElement[]\n  >([]);\n  const [currentInstance, setCurrentInstance] = useState<ChatInstance>(null);\n\n  /**\n   * Setup the DOM nodes of both the web component to be able to inject slotted content into it, and the element inside the\n   * shadow DOM we will inject our React application into.\n   */\n  useEffect(() => {\n    if (!wrapperRef.current) {\n      return null; // Early return when there's nothing to set up because the element isn't ready.\n    }\n\n    let eventListenerAdded = false;\n\n    const wrapperElement = wrapperRef.current as unknown as ChatContainerReact;\n\n    // We need to check if the element in the shadow DOM we are render the React application to exists.\n    // If it doesn't, we need to create and append it.\n\n    const handleShadowReady = () => {\n      // Now we know shadowRoot is definitely available\n      let reactElement = wrapperElement.shadowRoot.querySelector(\n        \".cds-aichat--react-app\",\n      ) as HTMLElement;\n\n      if (!reactElement) {\n        reactElement = document.createElement(\"div\");\n        reactElement.classList.add(\"cds-aichat--react-app\");\n        wrapperElement.shadowRoot.appendChild(reactElement);\n      }\n\n      if (wrapperElement !== wrapper) {\n        setWrapper(wrapperElement);\n      }\n      if (reactElement !== container) {\n        setContainer(reactElement);\n      }\n    };\n\n    if (wrapperElement.shadowRoot) {\n      // Already ready\n      handleShadowReady();\n    } else {\n      // Wait for ready event\n      eventListenerAdded = true;\n      wrapperElement.addEventListener(\"shadow-ready\", handleShadowReady, {\n        once: true,\n      });\n    }\n\n    return () => {\n      if (eventListenerAdded) {\n        wrapperElement.removeEventListener(\"shadow-ready\", handleShadowReady);\n      }\n    };\n  }, [container, wrapper, currentInstance]);\n\n  /**\n   * Here we write the slotted elements into the wrapper so they are passed into the application to be rendered in their slot.\n   */\n  useEffect(() => {\n    if (wrapper) {\n      const combinedNodes: HTMLElement[] = [...writeableElementSlots];\n      const currentNodes: HTMLElement[] = Array.from(\n        wrapper.childNodes,\n      ) as HTMLElement[];\n\n      // Append new nodes that aren't already in the container\n      combinedNodes.forEach((node) => {\n        if (!currentNodes.includes(node)) {\n          wrapper.appendChild(node);\n        }\n      });\n    }\n  }, [writeableElementSlots, wrapper]);\n\n  const onBeforeRenderOverride = useCallback(\n    (instance: ChatInstance) => {\n      if (instance) {\n        const addWriteableElementSlots = () => {\n          const slots: HTMLElement[] = Object.entries(\n            instance.writeableElements,\n          ).map((writeableElement) => {\n            const [key, element] = writeableElement;\n            element.setAttribute(\"slot\", key); // Assign slot attributes dynamically\n            return element;\n          });\n          setWriteableElementSlots(slots);\n        };\n\n        addWriteableElementSlots();\n        onBeforeRender?.(instance);\n      }\n    },\n    [onBeforeRender],\n  );\n\n  // If we are in SSR mode, just short circuit here. This prevents all of our window.* and document.* stuff from trying\n  // to run and erroring out.\n  if (!isBrowser()) {\n    return null;\n  }\n\n  return (\n    <>\n      <ReactChatContainer ref={wrapperRef} />\n      {container &&\n        createPortal(\n          <ChatAppEntry\n            key=\"stable-chat-instance\"\n            config={config}\n            strings={strings}\n            serviceDeskFactory={serviceDeskFactory}\n            serviceDesk={serviceDesk}\n            renderUserDefinedResponse={renderUserDefinedResponse}\n            renderCustomMessageFooter={renderCustomMessageFooter}\n            renderWriteableElements={renderWriteableElements}\n            onBeforeRender={onBeforeRenderOverride}\n            onAfterRender={onAfterRender}\n            container={container}\n            setParentInstance={setCurrentInstance}\n            element={element}\n            chatWrapper={wrapper}\n          />,\n          container,\n        )}\n    </>\n  );\n}\n\nexport { ChatContainer, ChatContainerProps };\n","/*\n *  Copyright IBM Corp. 2025\n *\n *  This source code is licensed under the Apache-2.0 license found in the\n *  LICENSE file in the root directory of this source tree.\n *\n *  @license\n */\n\nimport React, { useCallback, useState } from \"react\";\n\nimport { ChatInstance } from \"../types/instance/ChatInstance\";\nimport {\n  BusEventType,\n  BusEventViewChange,\n  BusEventViewPreChange,\n} from \"../types/events/eventBusTypes\";\nimport { ChatContainer, ChatContainerProps } from \"./ChatContainer\";\nimport { isBrowser } from \"../chat/utils/browserUtils\";\n\n/**\n * Properties for the ChatContainer React component. This interface extends\n * {@link ChatContainerProps} and {@link PublicConfig} with additional component-specific props, flattening all\n * config properties as top-level props for better TypeScript IntelliSense.\n *\n * @category React\n */\ninterface ChatCustomElementProps extends ChatContainerProps {\n  /**\n   * A CSS class name that will be added to the custom element. This class must define the size of the\n   * your custom element (width and height or using logical inline-size/block-size).\n   *\n   * You can make use of onViewPreChange and/or onViewChange to mutate this className value so have open/close animations.\n   *\n   * By default, the chat will just set the chat shell to a 0x0 size and mark everything but the launcher (is you are using it)\n   * as display: none; if the chat is set to closed.\n   */\n  className: string;\n\n  /**\n   * An optional id that will be added to the custom element.\n   */\n  id?: string;\n\n  /**\n   * Called before a view change (chat opening/closing). The chat will hide the chat shell inside your custom element\n   * to prevent invisible keyboard stops when the view change is *complete*.\n   *\n   * Use this callback to update your className value *before* the view change happens if you want to add any open/close\n   * animations to your custom element before the chat shell inner contents are hidden. It is async and so you can\n   * tie it to native the AnimationEvent and only return when your animations have completed.\n   *\n   * A common pattern is to use this for when the chat is closing and to use onViewChange for when the chat opens.\n   *\n   * Note that this function can only be provided before Carbon AI Chat is loaded as it is registered before the\n   * chat renders. After Carbon AI Chat is loaded, the callback will not be updated.\n   */\n  onViewPreChange?: (\n    event: BusEventViewPreChange,\n    instance: ChatInstance,\n  ) => Promise<void> | void;\n\n  /**\n   * Called when the chat view change is complete. If no callback is provided here, the default behavior will be to set\n   * the chat shell to 0x0 size and set all inner contents aside from the launcher, if you are using it, to display: none.\n   * The inner contents of the chat shell (aside from the launcher if you are using it) are always set to display: none\n   * regardless of what is configured with this callback to prevent invisible tab stops and screen reader issues.\n   *\n   * Use this callback to update your className value when the chat has finished being opened or closed.\n   *\n   * You can provide a different callback here if you want custom animation behavior when the chat is opened or closed.\n   * The animation behavior defined here will run in concert with the chat inside your custom container being hidden.\n   *\n   * If you want to run animations before the inner contents of the chat shell is shrunk and the inner contents are hidden,\n   * make use of onViewPreChange.\n   *\n   * A common pattern is to use this for when the chat is opening and to use onViewPreChange for when the chat closes.\n   *\n   * Note that this function can only be provided before Carbon AI Chat is loaded as it is registered before the\n   * chat renders. After Carbon AI Chat is loaded, the callback will not be updated.\n   */\n  onViewChange?: (event: BusEventViewChange, instance: ChatInstance) => void;\n}\n\nconst customElementStylesheet =\n  isBrowser() && typeof CSSStyleSheet !== \"undefined\"\n    ? new CSSStyleSheet()\n    : null;\n\nconst hideStyles = `\n  .cds-aichat--hidden {\n    width: 0 !important;\n    height: 0 !important;\n    min-width: 0 !important;\n    min-height: 0 !important;\n    max-width: 0 !important;\n    max-height: 0 !important;\n    inline-size: 0 !important;\n    block-size: 0 !important;\n    min-inline-size: 0 !important;\n    min-block-size: 0 !important;\n    max-inline-size: 0 !important;\n    max-block-size: 0 !important;\n    overflow: hidden !important;\n  }\n`;\n\n// Inject styles using adopted stylesheets when available, fallback to style element\nif (\n  isBrowser() &&\n  !document.getElementById(\"cds-aichat-custom-element-styles\")\n) {\n  if (customElementStylesheet && \"replaceSync\" in customElementStylesheet) {\n    customElementStylesheet.replaceSync(hideStyles);\n    document.adoptedStyleSheets = [\n      ...document.adoptedStyleSheets,\n      customElementStylesheet,\n    ];\n  } else {\n    // Fallback for when adoptedStyleSheets are not supported\n    const style = document.createElement(\"style\");\n    style.id = \"cds-aichat-custom-element-styles\";\n    style.textContent = hideStyles;\n    document.head.appendChild(style);\n  }\n}\n\n/**\n * This is the React component for people injecting a Carbon AI Chat with a custom element.\n *\n * It provides said element any class or id defined on itself for styling. It then calls ChatContainer with the custom\n * element passed in as a property to be used instead of generating an element with the default properties for a\n * floating chat.\n *\n * @category React\n */\nfunction ChatCustomElement(props: ChatCustomElementProps) {\n  const {\n    strings,\n    serviceDeskFactory,\n    serviceDesk,\n    onBeforeRender,\n    onAfterRender,\n    renderUserDefinedResponse,\n    renderCustomMessageFooter,\n    renderWriteableElements,\n    className,\n    id,\n    onViewChange,\n    onViewPreChange,\n    // Flattened PublicConfig properties\n    onError,\n    openChatByDefault,\n    disclaimer,\n    disableCustomElementMobileEnhancements,\n    debug,\n    exposeServiceManagerForTesting,\n    injectCarbonTheme,\n    aiEnabled,\n    shouldTakeFocusIfOpensAutomatically,\n    namespace,\n    shouldSanitizeHTML,\n    header,\n    layout,\n    messaging,\n    isReadonly,\n    persistFeedback,\n    assistantName,\n    locale,\n    homescreen,\n    launcher,\n    input,\n  } = props;\n\n  const [customElement, setCustomElement] = useState<HTMLDivElement>();\n\n  const onBeforeRenderOverride = useCallback(\n    async (instance: ChatInstance) => {\n      /**\n       * A default handler for the \"view:change\" event. This will be used to show or hide the Carbon AI Chat main window\n       * by adding/removing a CSS class that sets the element size to 0x0 when hidden.\n       */\n      function defaultViewChangeHandler(event: BusEventViewChange) {\n        if (customElement) {\n          if (event.newViewState.mainWindow) {\n            // Show: remove the hidden class, let the provided className handle sizing\n            customElement.classList.remove(\"cds-aichat--hidden\");\n          } else {\n            // Hide: add the hidden class to set size to 0x0\n            customElement.classList.add(\"cds-aichat--hidden\");\n          }\n        }\n      }\n\n      if (onViewPreChange) {\n        instance.on({\n          type: BusEventType.VIEW_PRE_CHANGE,\n          handler: onViewPreChange,\n        });\n      }\n\n      instance.on({\n        type: BusEventType.VIEW_CHANGE,\n        handler: onViewChange || defaultViewChangeHandler,\n      });\n\n      return onBeforeRender?.(instance);\n    },\n    [onViewPreChange, onViewChange, onBeforeRender, customElement],\n  );\n\n  return (\n    <div className={className} id={id} ref={setCustomElement}>\n      {customElement && (\n        <ChatContainer\n          // Flattened PublicConfig properties\n          onError={onError}\n          openChatByDefault={openChatByDefault}\n          disclaimer={disclaimer}\n          disableCustomElementMobileEnhancements={\n            disableCustomElementMobileEnhancements\n          }\n          debug={debug}\n          exposeServiceManagerForTesting={exposeServiceManagerForTesting}\n          injectCarbonTheme={injectCarbonTheme}\n          aiEnabled={aiEnabled}\n          shouldTakeFocusIfOpensAutomatically={\n            shouldTakeFocusIfOpensAutomatically\n          }\n          namespace={namespace}\n          shouldSanitizeHTML={shouldSanitizeHTML}\n          header={header}\n          layout={layout}\n          messaging={messaging}\n          isReadonly={isReadonly}\n          persistFeedback={persistFeedback}\n          assistantName={assistantName}\n          locale={locale}\n          homescreen={homescreen}\n          launcher={launcher}\n          // Other ChatContainer props\n          strings={strings}\n          serviceDeskFactory={serviceDeskFactory}\n          serviceDesk={serviceDesk}\n          onBeforeRender={onBeforeRenderOverride}\n          onAfterRender={onAfterRender}\n          renderUserDefinedResponse={renderUserDefinedResponse}\n          renderCustomMessageFooter={renderCustomMessageFooter}\n          renderWriteableElements={renderWriteableElements}\n          element={customElement}\n          input={input}\n        />\n      )}\n    </div>\n  );\n}\n\nexport { ChatCustomElement, ChatCustomElementProps };\n"],"names":["ChatContainerReact","LitElement","firstUpdated","changedProperties","super","this","dispatchEvent","CustomEvent","bubbles","styles","css","__decorate","carbonElement","ReactChatContainer","React","memo","createComponent","tagName","elementClass","react","ChatContainer","props","onBeforeRender","onAfterRender","strings","serviceDeskFactory","serviceDesk","renderUserDefinedResponse","renderCustomMessageFooter","renderWriteableElements","element","onError","openChatByDefault","disclaimer","disableCustomElementMobileEnhancements","debug","exposeServiceManagerForTesting","injectCarbonTheme","aiEnabled","shouldTakeFocusIfOpensAutomatically","namespace","shouldSanitizeHTML","header","layout","messaging","isReadonly","persistFeedback","assistantName","locale","homescreen","launcher","input","config","useMemo","wrapperRef","useRef","wrapper","setWrapper","useState","container","setContainer","writeableElementSlots","setWriteableElementSlots","currentInstance","setCurrentInstance","useEffect","current","eventListenerAdded","wrapperElement","handleShadowReady","reactElement","shadowRoot","querySelector","document","createElement","classList","add","appendChild","addEventListener","once","removeEventListener","combinedNodes","currentNodes","Array","from","childNodes","forEach","node","includes","onBeforeRenderOverride","useCallback","instance","addWriteableElementSlots","slots","Object","entries","writeableElements","map","writeableElement","key","setAttribute","isBrowser","Fragment","ref","createPortal","ChatAppEntry","setParentInstance","chatWrapper","customElementStylesheet","CSSStyleSheet","hideStyles","getElementById","replaceSync","adoptedStyleSheets","style","id","textContent","head","ChatCustomElement","className","onViewChange","onViewPreChange","customElement","setCustomElement","async","defaultViewChangeHandler","event","newViewState","mainWindow","remove","on","type","BusEventType","VIEW_PRE_CHANGE","handler","VIEW_CHANGE"],"mappings":"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"}
+{"version":3,"file":"aiChatEntry.js","sources":["../../../../src/react/ChatContainer.tsx","../../../../src/react/ChatCustomElement.tsx"],"sourcesContent":["/*\n *  Copyright IBM Corp. 2025\n *\n *  This source code is licensed under the Apache-2.0 license found in the\n *  LICENSE file in the root directory of this source tree.\n *\n *  @license\n */\n\nimport { createComponent } from \"@lit/react\";\nimport { css, LitElement, PropertyValues } from \"lit\";\nimport React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport ChatAppEntry from \"../chat/ChatAppEntry\";\nimport { carbonElement } from \"@carbon/ai-chat-components/es/globals/decorators/index.js\";\nimport { ChatContainerProps } from \"../types/component/ChatContainer\";\nimport { ChatInstance } from \"../types/instance/ChatInstance\";\nimport { PublicConfig } from \"../types/config/PublicConfig\";\nimport { isBrowser } from \"../chat/utils/browserUtils\";\n\n/**\n * This component creates a custom element protected by a shadow DOM to render the React application into. It creates\n * slotted elements for user_defined responses and for writable elements.\n *\n * The corresponding slots are defined within the React application and are rendered in place.\n */\n\n/**\n * Create a web component to host the React application. We do this so we can provide custom elements and user_defined responses as\n * slotted content so they maintain their own styling in a safe way.\n */\n@carbonElement(\"cds-aichat-react\")\nclass ChatContainerReact extends LitElement {\n  static styles = css`\n    :host {\n      width: 100%;\n      height: 100%;\n    }\n  `;\n\n  /**\n   * Dispatch a custom event when the shadow DOM is ready\n   * This ensures React can safely access shadowRoot\n   */\n  firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n    this.dispatchEvent(new CustomEvent(\"shadow-ready\", { bubbles: true }));\n  }\n}\n\n// Wrap the custom element as a React component\nconst ReactChatContainer = React.memo(\n  createComponent({\n    tagName: \"cds-aichat-react\",\n    elementClass: ChatContainerReact,\n    react: React,\n  }),\n);\n\n/**\n * The ChatContainer controls rendering the React application into the shadow DOM of the cds-aichat-react web component.\n * It also injects the writeable element and user_defined response slots into said web component.\n *\n * @category React\n */\nfunction ChatContainer(props: ChatContainerProps) {\n  const {\n    onBeforeRender,\n    onAfterRender,\n    strings,\n    serviceDeskFactory,\n    serviceDesk,\n    renderUserDefinedResponse,\n    renderCustomMessageFooter,\n    renderWriteableElements,\n    element,\n    // Flattened PublicConfig properties\n    onError,\n    openChatByDefault,\n    disclaimer,\n    disableCustomElementMobileEnhancements,\n    debug,\n    exposeServiceManagerForTesting,\n    injectCarbonTheme,\n    aiEnabled,\n    shouldTakeFocusIfOpensAutomatically,\n    namespace,\n    shouldSanitizeHTML,\n    header,\n    layout,\n    messaging,\n    isReadonly,\n    persistFeedback,\n    assistantName,\n    locale,\n    homescreen,\n    launcher,\n    input,\n    keyboardShortcuts,\n  } = props;\n  // Reconstruct PublicConfig from flattened props\n  const config = useMemo(\n    (): PublicConfig => ({\n      onError,\n      openChatByDefault,\n      disclaimer,\n      disableCustomElementMobileEnhancements,\n      debug,\n      exposeServiceManagerForTesting,\n      injectCarbonTheme,\n      aiEnabled,\n      shouldTakeFocusIfOpensAutomatically,\n      namespace,\n      shouldSanitizeHTML,\n      header,\n      layout,\n      messaging,\n      isReadonly,\n      persistFeedback,\n      assistantName,\n      locale,\n      homescreen,\n      launcher,\n      input,\n      keyboardShortcuts,\n    }),\n    [\n      onError,\n      openChatByDefault,\n      disclaimer,\n      disableCustomElementMobileEnhancements,\n      debug,\n      exposeServiceManagerForTesting,\n      injectCarbonTheme,\n      aiEnabled,\n      shouldTakeFocusIfOpensAutomatically,\n      namespace,\n      shouldSanitizeHTML,\n      header,\n      layout,\n      messaging,\n      isReadonly,\n      persistFeedback,\n      assistantName,\n      locale,\n      homescreen,\n      launcher,\n      input,\n      keyboardShortcuts,\n    ],\n  );\n\n  const wrapperRef = useRef(null); // Ref for the React wrapper component\n  const [wrapper, setWrapper] = useState(null);\n  const [container, setContainer] = useState<HTMLElement | null>(null); // Actual element we render the React Portal to in the Shadowroot.\n\n  const [writeableElementSlots, setWriteableElementSlots] = useState<\n    HTMLElement[]\n  >([]);\n  const [currentInstance, setCurrentInstance] = useState<ChatInstance>(null);\n\n  /**\n   * Setup the DOM nodes of both the web component to be able to inject slotted content into it, and the element inside the\n   * shadow DOM we will inject our React application into.\n   */\n  useEffect(() => {\n    if (!wrapperRef.current) {\n      return null; // Early return when there's nothing to set up because the element isn't ready.\n    }\n\n    let eventListenerAdded = false;\n\n    const wrapperElement = wrapperRef.current as unknown as ChatContainerReact;\n\n    // We need to check if the element in the shadow DOM we are render the React application to exists.\n    // If it doesn't, we need to create and append it.\n\n    const handleShadowReady = () => {\n      // Now we know shadowRoot is definitely available\n      let reactElement = wrapperElement.shadowRoot.querySelector(\n        \".cds-aichat--react-app\",\n      ) as HTMLElement;\n\n      if (!reactElement) {\n        reactElement = document.createElement(\"div\");\n        reactElement.classList.add(\"cds-aichat--react-app\");\n        wrapperElement.shadowRoot.appendChild(reactElement);\n      }\n\n      if (wrapperElement !== wrapper) {\n        setWrapper(wrapperElement);\n      }\n      if (reactElement !== container) {\n        setContainer(reactElement);\n      }\n    };\n\n    if (wrapperElement.shadowRoot) {\n      // Already ready\n      handleShadowReady();\n    } else {\n      // Wait for ready event\n      eventListenerAdded = true;\n      wrapperElement.addEventListener(\"shadow-ready\", handleShadowReady, {\n        once: true,\n      });\n    }\n\n    return () => {\n      if (eventListenerAdded) {\n        wrapperElement.removeEventListener(\"shadow-ready\", handleShadowReady);\n      }\n    };\n  }, [container, wrapper, currentInstance]);\n\n  /**\n   * Here we write the slotted elements into the wrapper so they are passed into the application to be rendered in their slot.\n   */\n  useEffect(() => {\n    if (wrapper) {\n      const combinedNodes: HTMLElement[] = [...writeableElementSlots];\n      const currentNodes: HTMLElement[] = Array.from(\n        wrapper.childNodes,\n      ) as HTMLElement[];\n\n      // Append new nodes that aren't already in the container\n      combinedNodes.forEach((node) => {\n        if (!currentNodes.includes(node)) {\n          wrapper.appendChild(node);\n        }\n      });\n    }\n  }, [writeableElementSlots, wrapper]);\n\n  const onBeforeRenderOverride = useCallback(\n    (instance: ChatInstance) => {\n      if (instance) {\n        const addWriteableElementSlots = () => {\n          const slots: HTMLElement[] = Object.entries(\n            instance.writeableElements,\n          ).map((writeableElement) => {\n            const [key, element] = writeableElement;\n            element.setAttribute(\"slot\", key); // Assign slot attributes dynamically\n            return element;\n          });\n          setWriteableElementSlots(slots);\n        };\n\n        addWriteableElementSlots();\n        onBeforeRender?.(instance);\n      }\n    },\n    [onBeforeRender],\n  );\n\n  // If we are in SSR mode, just short circuit here. This prevents all of our window.* and document.* stuff from trying\n  // to run and erroring out.\n  if (!isBrowser()) {\n    return null;\n  }\n\n  return (\n    <>\n      <ReactChatContainer ref={wrapperRef} />\n      {container &&\n        createPortal(\n          <ChatAppEntry\n            key=\"stable-chat-instance\"\n            config={config}\n            strings={strings}\n            serviceDeskFactory={serviceDeskFactory}\n            serviceDesk={serviceDesk}\n            renderUserDefinedResponse={renderUserDefinedResponse}\n            renderCustomMessageFooter={renderCustomMessageFooter}\n            renderWriteableElements={renderWriteableElements}\n            onBeforeRender={onBeforeRenderOverride}\n            onAfterRender={onAfterRender}\n            container={container}\n            setParentInstance={setCurrentInstance}\n            element={element}\n            chatWrapper={wrapper}\n          />,\n          container,\n        )}\n    </>\n  );\n}\n\nexport { ChatContainer, ChatContainerProps };\n","/*\n *  Copyright IBM Corp. 2025\n *\n *  This source code is licensed under the Apache-2.0 license found in the\n *  LICENSE file in the root directory of this source tree.\n *\n *  @license\n */\n\nimport React, { useCallback, useState } from \"react\";\n\nimport { ChatInstance } from \"../types/instance/ChatInstance\";\nimport {\n  BusEventType,\n  BusEventViewChange,\n  BusEventViewPreChange,\n} from \"../types/events/eventBusTypes\";\nimport { ChatContainer, ChatContainerProps } from \"./ChatContainer\";\nimport { isBrowser } from \"../chat/utils/browserUtils\";\n\n/**\n * Properties for the ChatContainer React component. This interface extends\n * {@link ChatContainerProps} and {@link PublicConfig} with additional component-specific props, flattening all\n * config properties as top-level props for better TypeScript IntelliSense.\n *\n * @category React\n */\ninterface ChatCustomElementProps extends ChatContainerProps {\n  /**\n   * A CSS class name that will be added to the custom element. This class must define the size of the\n   * your custom element (width and height or using logical inline-size/block-size).\n   *\n   * You can make use of onViewPreChange and/or onViewChange to mutate this className value so have open/close animations.\n   *\n   * By default, the chat will just set the chat shell to a 0x0 size and mark everything but the launcher (is you are using it)\n   * as display: none; if the chat is set to closed.\n   */\n  className: string;\n\n  /**\n   * An optional id that will be added to the custom element.\n   */\n  id?: string;\n\n  /**\n   * Called before a view change (chat opening/closing). The chat will hide the chat shell inside your custom element\n   * to prevent invisible keyboard stops when the view change is *complete*.\n   *\n   * Use this callback to update your className value *before* the view change happens if you want to add any open/close\n   * animations to your custom element before the chat shell inner contents are hidden. It is async and so you can\n   * tie it to native the AnimationEvent and only return when your animations have completed.\n   *\n   * A common pattern is to use this for when the chat is closing and to use onViewChange for when the chat opens.\n   *\n   * Note that this function can only be provided before Carbon AI Chat is loaded as it is registered before the\n   * chat renders. After Carbon AI Chat is loaded, the callback will not be updated.\n   */\n  onViewPreChange?: (\n    event: BusEventViewPreChange,\n    instance: ChatInstance,\n  ) => Promise<void> | void;\n\n  /**\n   * Called when the chat view change is complete. If no callback is provided here, the default behavior will be to set\n   * the chat shell to 0x0 size and set all inner contents aside from the launcher, if you are using it, to display: none.\n   * The inner contents of the chat shell (aside from the launcher if you are using it) are always set to display: none\n   * regardless of what is configured with this callback to prevent invisible tab stops and screen reader issues.\n   *\n   * Use this callback to update your className value when the chat has finished being opened or closed.\n   *\n   * You can provide a different callback here if you want custom animation behavior when the chat is opened or closed.\n   * The animation behavior defined here will run in concert with the chat inside your custom container being hidden.\n   *\n   * If you want to run animations before the inner contents of the chat shell is shrunk and the inner contents are hidden,\n   * make use of onViewPreChange.\n   *\n   * A common pattern is to use this for when the chat is opening and to use onViewPreChange for when the chat closes.\n   *\n   * Note that this function can only be provided before Carbon AI Chat is loaded as it is registered before the\n   * chat renders. After Carbon AI Chat is loaded, the callback will not be updated.\n   */\n  onViewChange?: (event: BusEventViewChange, instance: ChatInstance) => void;\n}\n\nconst customElementStylesheet =\n  isBrowser() && typeof CSSStyleSheet !== \"undefined\"\n    ? new CSSStyleSheet()\n    : null;\n\nconst hideStyles = `\n  .cds-aichat--hidden {\n    width: 0 !important;\n    height: 0 !important;\n    min-width: 0 !important;\n    min-height: 0 !important;\n    max-width: 0 !important;\n    max-height: 0 !important;\n    inline-size: 0 !important;\n    block-size: 0 !important;\n    min-inline-size: 0 !important;\n    min-block-size: 0 !important;\n    max-inline-size: 0 !important;\n    max-block-size: 0 !important;\n    overflow: hidden !important;\n  }\n`;\n\n// Inject styles using adopted stylesheets when available, fallback to style element\nif (\n  isBrowser() &&\n  !document.getElementById(\"cds-aichat-custom-element-styles\")\n) {\n  if (customElementStylesheet && \"replaceSync\" in customElementStylesheet) {\n    customElementStylesheet.replaceSync(hideStyles);\n    document.adoptedStyleSheets = [\n      ...document.adoptedStyleSheets,\n      customElementStylesheet,\n    ];\n  } else {\n    // Fallback for when adoptedStyleSheets are not supported\n    const style = document.createElement(\"style\");\n    style.id = \"cds-aichat-custom-element-styles\";\n    style.textContent = hideStyles;\n    document.head.appendChild(style);\n  }\n}\n\n/**\n * This is the React component for people injecting a Carbon AI Chat with a custom element.\n *\n * It provides said element any class or id defined on itself for styling. It then calls ChatContainer with the custom\n * element passed in as a property to be used instead of generating an element with the default properties for a\n * floating chat.\n *\n * @category React\n */\nfunction ChatCustomElement(props: ChatCustomElementProps) {\n  const {\n    strings,\n    serviceDeskFactory,\n    serviceDesk,\n    onBeforeRender,\n    onAfterRender,\n    renderUserDefinedResponse,\n    renderCustomMessageFooter,\n    renderWriteableElements,\n    className,\n    id,\n    onViewChange,\n    onViewPreChange,\n    // Flattened PublicConfig properties\n    onError,\n    openChatByDefault,\n    disclaimer,\n    disableCustomElementMobileEnhancements,\n    debug,\n    exposeServiceManagerForTesting,\n    injectCarbonTheme,\n    aiEnabled,\n    shouldTakeFocusIfOpensAutomatically,\n    namespace,\n    shouldSanitizeHTML,\n    header,\n    layout,\n    messaging,\n    isReadonly,\n    persistFeedback,\n    assistantName,\n    locale,\n    homescreen,\n    launcher,\n    input,\n    keyboardShortcuts,\n  } = props;\n\n  const [customElement, setCustomElement] = useState<HTMLDivElement>();\n\n  const onBeforeRenderOverride = useCallback(\n    async (instance: ChatInstance) => {\n      /**\n       * A default handler for the \"view:change\" event. This will be used to show or hide the Carbon AI Chat main window\n       * by adding/removing a CSS class that sets the element size to 0x0 when hidden.\n       */\n      function defaultViewChangeHandler(event: BusEventViewChange) {\n        if (customElement) {\n          if (event.newViewState.mainWindow) {\n            // Show: remove the hidden class, let the provided className handle sizing\n            customElement.classList.remove(\"cds-aichat--hidden\");\n          } else {\n            // Hide: add the hidden class to set size to 0x0\n            customElement.classList.add(\"cds-aichat--hidden\");\n          }\n        }\n      }\n\n      if (onViewPreChange) {\n        instance.on({\n          type: BusEventType.VIEW_PRE_CHANGE,\n          handler: onViewPreChange,\n        });\n      }\n\n      instance.on({\n        type: BusEventType.VIEW_CHANGE,\n        handler: onViewChange || defaultViewChangeHandler,\n      });\n\n      return onBeforeRender?.(instance);\n    },\n    [onViewPreChange, onViewChange, onBeforeRender, customElement],\n  );\n\n  return (\n    <div className={className} id={id} ref={setCustomElement}>\n      {customElement && (\n        <ChatContainer\n          // Flattened PublicConfig properties\n          onError={onError}\n          openChatByDefault={openChatByDefault}\n          disclaimer={disclaimer}\n          disableCustomElementMobileEnhancements={\n            disableCustomElementMobileEnhancements\n          }\n          debug={debug}\n          exposeServiceManagerForTesting={exposeServiceManagerForTesting}\n          injectCarbonTheme={injectCarbonTheme}\n          aiEnabled={aiEnabled}\n          shouldTakeFocusIfOpensAutomatically={\n            shouldTakeFocusIfOpensAutomatically\n          }\n          namespace={namespace}\n          shouldSanitizeHTML={shouldSanitizeHTML}\n          header={header}\n          layout={layout}\n          messaging={messaging}\n          isReadonly={isReadonly}\n          persistFeedback={persistFeedback}\n          assistantName={assistantName}\n          locale={locale}\n          homescreen={homescreen}\n          launcher={launcher}\n          input={input}\n          keyboardShortcuts={keyboardShortcuts}\n          // Other ChatContainer props\n          strings={strings}\n          serviceDeskFactory={serviceDeskFactory}\n          serviceDesk={serviceDesk}\n          onBeforeRender={onBeforeRenderOverride}\n          onAfterRender={onAfterRender}\n          renderUserDefinedResponse={renderUserDefinedResponse}\n          renderCustomMessageFooter={renderCustomMessageFooter}\n          renderWriteableElements={renderWriteableElements}\n          element={customElement}\n        />\n      )}\n    </div>\n  );\n}\n\nexport { ChatCustomElement, ChatCustomElementProps };\n"],"names":["ChatContainerReact","LitElement","firstUpdated","changedProperties","super","this","dispatchEvent","CustomEvent","bubbles","styles","css","__decorate","carbonElement","ReactChatContainer","React","memo","createComponent","tagName","elementClass","react","ChatContainer","props","onBeforeRender","onAfterRender","strings","serviceDeskFactory","serviceDesk","renderUserDefinedResponse","renderCustomMessageFooter","renderWriteableElements","element","onError","openChatByDefault","disclaimer","disableCustomElementMobileEnhancements","debug","exposeServiceManagerForTesting","injectCarbonTheme","aiEnabled","shouldTakeFocusIfOpensAutomatically","namespace","shouldSanitizeHTML","header","layout","messaging","isReadonly","persistFeedback","assistantName","locale","homescreen","launcher","input","keyboardShortcuts","config","useMemo","wrapperRef","useRef","wrapper","setWrapper","useState","container","setContainer","writeableElementSlots","setWriteableElementSlots","currentInstance","setCurrentInstance","useEffect","current","eventListenerAdded","wrapperElement","handleShadowReady","reactElement","shadowRoot","querySelector","document","createElement","classList","add","appendChild","addEventListener","once","removeEventListener","combinedNodes","currentNodes","Array","from","childNodes","forEach","node","includes","onBeforeRenderOverride","useCallback","instance","addWriteableElementSlots","slots","Object","entries","writeableElements","map","writeableElement","key","setAttribute","isBrowser","Fragment","ref","createPortal","ChatAppEntry","setParentInstance","chatWrapper","customElementStylesheet","CSSStyleSheet","hideStyles","getElementById","replaceSync","adoptedStyleSheets","style","id","textContent","head","ChatCustomElement","className","onViewChange","onViewPreChange","customElement","setCustomElement","async","defaultViewChangeHandler","event","newViewState","mainWindow","remove","on","type","BusEventType","VIEW_PRE_CHANGE","handler","VIEW_CHANGE"],"mappings":"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"}