Merge branch 'fixes' into 'master'

Fixes

See merge request !434

editors/demo/src/Editoria/theme/elements/ButtonStyles.js

-import styled, { css } from "styled-components";
+import styled, { css } from 'styled-components';
 
 export default css`
   background: #fff;

editors/demo/src/Editors.js

@@ -73,7 +73,7 @@ const Editors = () => {
       case 'oen':
         return <OEN />;
       default:
-        return <Editoria />;
+        return <HHMI />;
     }
   };
 

editors/demo/src/HHMI/config/config.js

@@ -63,6 +63,7 @@ export default {
 
   SchemaService: DefaultSchema,
   RulesService: [emDash, ellipsis],
+  ImageService: { showAlt: true },
 
   PmPlugins: [columnResizing(), tableEditing(), invisibles([hardBreak()])],
   services: [

wax-prosemirror-services/src/ImageService/AltComponent.js

+/* eslint-disable react/prop-types */
 import React, { useContext, useLayoutEffect, useRef, useState } from 'react';
 import styled from 'styled-components';
 import { WaxContext } from 'wax-prosemirror-core';
@@ -65,10 +66,14 @@ export default ({ setPosition, position }) => {
 
   const imageConfig = app.config.get('config.ImageService');
   const showAlt = imageConfig && imageConfig.showAlt;
+  const autoFocus =
+    activeView.state.selection &&
+    activeView.state.selection.node &&
+    activeView.state.selection.node.attrs.alt === '';
 
   return !readOnly && showAlt ? (
     <StyledInputAlt
-      autoFocus="autoFocus"
+      autoFocus={autoFocus}
       key="alt"
       onChange={altTextOnChange}
       placeholder="Alt Text"

wax-prosemirror-services/src/SpecialCharactersService/components/SpecialCharactersComponent.js

@@ -85,7 +85,7 @@ const SpecialCharacter = styled.div`
   min-width: 25px;
   height: 25px;
   display: inline-grid;
-  background: ${th('colorPrimary')}
+  background: white;
   cursor: pointer;
   border: 1px solid ${th('colorPrimary')};
   border-radius: 50%;
@@ -102,8 +102,7 @@ const SpecialCharacter = styled.div`
       color: #fff;
     }
   }
-    ${override('Wax.SpecialCharacterButton')}
-
+  ${override('Wax.SpecialCharacterButton')}
 `;
 
 const SpecialCharactersComponent = ({ close }) => {