@seamly/web-ui 25.0.0 → 25.1.0-beta.1

package/build/dist/lib/index.js

@@ -5837,7 +5837,7 @@ class API {
     return {
       clientName: "@seamly/web-ui",
       clientVariant: this.#layoutMode,
-      clientVersion: "25.0.0",
+      clientVersion: "25.1.0-beta.1",
       currentUrl: window.location.toString(),
       screenResolution: `${window.screen.width}x${window.screen.height}`,
       timezone: getTimeZone(),
@@ -12557,6 +12557,7 @@ const initialStoreState = {
   skiplinkTargetId: randomId(),
   optionsButtonId: randomId(),
   headerCollapseButtonId: randomId(),
+  windowOpenButtonId: randomId(),
   serviceData: {},
   options: {
     features: {
@@ -14583,6 +14584,12 @@ const useSkiplinkTargetFocusing = () => {
   const skiplinkTargetId = useSkiplink();
   return useElementFocusingById(skiplinkTargetId);
 };
+const useWindowOpenButtonFocusing = () => {
+  const {
+    windowOpenButtonId
+  } = useSeamlyStateContext();
+  return useElementFocusingById(windowOpenButtonId);
+};
 const useFocusIfSeamlyContainedFocus = () => {
   const containerElementRef = useRef(null);
   const [seamlyContainerElement] = useSeamlyContainerElement();
@@ -15976,7 +15983,7 @@ const ChoicePrompt = ({
       child.props = {
         ...child.props,
         event: subEvent,
-        descriptorId,
+        id: descriptorId,
         showTranslationToggle: false
       };
       return child;
@@ -20104,13 +20111,15 @@ const Conversation = () => {
       className: css_className('chat__body'),
       children: /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsxs)("div", {
         className: css_className('conversation__container'),
-        children: [/*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(privacy_disclaimer, {}), /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsxs)("ol", {
-          className: css_className('conversation'),
+        children: [/*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(privacy_disclaimer, {}), /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)("div", {
           role: "log",
           "aria-label": t('chat.srLabel'),
-          children: [/*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(component_filter, {
-            children: /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(Events, {})
-          }), debouncedIsLoading ? /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(loader, {}) : null, /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(AbortTransactionButton, {})]
+          children: /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsxs)("ol", {
+            className: css_className('conversation'),
+            children: [/*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(component_filter, {
+              children: /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(Events, {})
+            }), debouncedIsLoading ? /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(loader, {}) : null, /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(AbortTransactionButton, {})]
+          })
         })]
       })
     })]
@@ -20438,10 +20447,11 @@ const Chat = (0,compat_namespaceObject.forwardRef)(({
   className: givenClassName = ''
 }, forwardedRef) => {
   const {
+    closeChat,
     isOpen,
-    isVisible,
-    setVisibility
+    isVisible
   } = useVisibility();
+  const focusWindowOpenButton = useWindowOpenButtonFocusing();
   const {
     namespace,
     layoutMode
@@ -20468,9 +20478,8 @@ const Chat = (0,compat_namespaceObject.forwardRef)(({
   }
   const onKeyDownHandler = e => {
     if (e.code && e.code === 'Escape' || e.keyCode === 27) if (!isInline && isOpen) {
-      setVisibility({
-        visibility: visibilityStates.minimized
-      });
+      closeChat();
+      focusWindowOpenButton();
     }
   };
   return isVisible && /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsxs)("section", {
@@ -20483,7 +20492,7 @@ const Chat = (0,compat_namespaceObject.forwardRef)(({
     children: [/*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)("h2", {
       className: css_className('chat__title', 'visually-hidden'),
       id: headingId,
-      children: t('chat.srLabel')
+      children: t('window.srModalLayoutLabel')
     }), /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)("div", {
       className: css_className('chat-wrapper'),
       children: children
@@ -22696,6 +22705,7 @@ const UploadToggle = () => {
           "aria-disabled": !showUploadButton,
           type: "button",
           onClick: showUploadButton ? onClickHandler : undefined,
+          tabIndex: !showUploadButton ? -1 : undefined,
           children: /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
             name: "file",
             size: "32",
@@ -22812,6 +22822,8 @@ const EntryContainer = () => {
 
 
 
+
+
 const CollapseButton = () => {
   const {
     t
@@ -22823,10 +22835,15 @@ const CollapseButton = () => {
   const {
     isWindow
   } = useSeamlyLayoutMode();
+  const focusWindowOpenButton = useWindowOpenButtonFocusing();
+  const handleClick = (0,hooks_.useCallback)(() => {
+    closeChat();
+    focusWindowOpenButton();
+  }, [closeChat, focusWindowOpenButton]);
   return isOpen && isWindow ? /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)("button", {
     type: "button",
     className: css_className('button', 'collapse-button'),
-    onClick: closeChat,
+    onClick: handleClick,
     children: /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
       name: "chevronDown",
       size: "32",
@@ -23071,6 +23088,7 @@ function ContinueChatMessages() {
 
 
 
+
 const ButtonIcon = () => {
   const startChatIcon = useStartChatIcon();
   const currentAgent = useSeamlyCurrentAgent();
@@ -23099,6 +23117,9 @@ const WindowOpenButton = ({
   const {
     isOpen
   } = useVisibility();
+  const {
+    windowOpenButtonId
+  } = useSeamlyStateContext();
   const count = useSeamlyUnreadCount();
   const handleClick = (0,hooks_.useCallback)(() => {
     onClick();
@@ -23108,10 +23129,12 @@ const WindowOpenButton = ({
     isActive: !isOpen,
     transitionStartState: transitionStartStates.rendered,
     children: /*#__PURE__*/(0,jsx_runtime_namespaceObject.jsxs)("button", {
+      type: "button",
       className: css_className('window-open-button'),
       "aria-label": ariaLabel,
-      "aria-hidden": isOpen,
       onClick: handleClick,
+      inert: isOpen || undefined,
+      id: windowOpenButtonId,
       children: [/*#__PURE__*/(0,jsx_runtime_namespaceObject.jsx)(in_out_transition, {
         isActive: !!count,
         transitionStartState: transitionStartStates.notRendered,