Fix canvas workpad focus state (#35015)

* Fix canvas workpad focus state

* reset focus state for viz and top nav

src/legacy/ui/public/kbn_top_nav/kbn_top_nav.html

@@ -11,7 +11,7 @@
 
     <div class="kuiLocalMenu kbnTopNav__mainMenu" ng-if="kbnTopNav.menuItems.length">
       <button
-        class="kuiLocalMenuItem {{menuItem.className}}"
+        class="kuiLocalMenuItem kbn-resetFocusState {{menuItem.className}}"
         ng-repeat="menuItem in kbnTopNav.menuItems"
         aria-label="{{::menuItem.description}}"
         aria-haspopup="{{!menuItem.hasFunction}}"

src/legacy/ui/public/styles/_legacy/_base.scss

@@ -114,7 +114,7 @@ input[type="checkbox"],
 // state. This is useful when you've already hand crafted your own
 // focus states in Kibana.
 :focus {
-  &:not([class^="eui"]):not([class^="kbn-resetFocusState"]) {
+  &:not([class^="eui"]):not(.kbn-resetFocusState) {
     @include euiFocusRing;
   }
 }

src/legacy/ui/public/visualize/components/visualization_chart.tsx

@@ -90,7 +90,7 @@ class VisualizationChart extends React.Component<VisualizationChartProps> {
 
   public render() {
     return (
-      <div className="visChart__container" tabIndex={0} ref={this.containerDiv}>
+      <div className="visChart__container kbn-resetFocusState" tabIndex={0} ref={this.containerDiv}>
         <p className="euiScreenReaderOnly">
           {this.props.vis.type.title} visualization, not yet accessible
         </p>

x-pack/plugins/canvas/public/components/workpad_page/interactive_workpad_page.js

@@ -75,7 +75,7 @@ export class InteractiveWorkpadPage extends PureComponent {
           }
         }}
         data-test-subj="canvasWorkpadPage"
-        className={`canvasPage ${className} canvasPage--isEditable`}
+        className={`canvasPage kbn-resetFocusState ${className} canvasPage--isEditable`}
         data-shared-items-container
         style={{ ...pageStyle, ...animationStyle, height, width, cursor }}
         onKeyDown={onKeyDown}

x-pack/plugins/canvas/public/components/workpad_page/static_workpad_page.js

@@ -19,7 +19,7 @@ export class StaticWorkpadPage extends PureComponent {
         key={pageId}
         id={pageId}
         data-test-subj="canvasWorkpadPage"
-        className={`canvasPage ${className}`}
+        className={`canvasPage kbn-resetFocusState ${className}`}
         data-shared-items-container
         style={{ ...pageStyle, ...animationStyle, height, width }}
       >