fix: respect outer visibility across Web Chat (#5473)

* fix: respect outer visibility across Web Chat

* Changelog

Author: OEvgeny

CHANGELOG.md

@@ -212,6 +212,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
 - Fixed [#5439](https://github.com/microsoft/BotFramework-WebChat/issues/5439). Fixed batched livestream activities are not recognized in the same session, in PR [#5440](https://github.com/microsoft/BotFramework-WebChat/pull/5440), by [@compulim](https://github.com/compulim)
 - Fixed [#5452](https://github.com/microsoft/BotFramework-WebChat/issues/5452). With Fluent/Copilot theme, the typing indicator padding should not be squashed, in PR [#5453](https://github.com/microsoft/BotFramework-WebChat/pull/5453), by [@compulim](https://github.com/compulim)
 - Fixed [#5461](https://github.com/microsoft/BotFramework-WebChat/issues/5461). On macOS and Fluent skinpack applied, using Japanese IME to input some Japanese text should not send them immediately, in PR [#5462](https://github.com/microsoft/BotFramework-WebChat/pull/5462), by [@compulim](https://github.com/compulim)
+- Fixed [#5472](https://github.com/microsoft/BotFramework-WebChat/issues/5472), ensure proper inheritance from the outside of Web Chat for visibility CSS property when hidden, in PR [#5473](https://github.com/microsoft/BotFramework-WebChat/pull/5473), by [@OEvgeny](https://github.com/OEvgeny)
 
 # Removed
 

packages/component/src/Styles/StyleSet/ActivityCopyButton.ts

@@ -27,6 +27,7 @@ export default function createActivityButtonStyle() {
 
       '@keyframes webchat__activity-copy-button__copied-animation': {
         '0%': {
+          // This is set during the animation only hence shouldn't spill when hidden from the above tree
           visibility: 'visible'
         },
 

packages/component/src/Styles/StyleSet/ThumbButton.ts

@@ -55,7 +55,7 @@ export default function () {
         width: 14,
 
         '&.webchat__thumb-button__image--is-stroked': {
-          visibility: 'visible'
+          visibility: 'unset'
         }
       },
 
@@ -66,7 +66,7 @@ export default function () {
           },
 
           '&.webchat__thumb-button__image--is-filled': {
-            visibility: 'visible'
+            visibility: 'unset'
           }
         }
       }

packages/fluent-theme/src/components/sendBox/TextArea.module.css

@@ -14,7 +14,7 @@
 
 :global(.webchat-fluent) .sendbox__text-area--in-completion {
   .sendbox__text-area-doppelganger {
-    visibility: visible;
+    visibility: unset;
   }
 
   .sendbox__text-area-input {