fix(field): move FocusMixin out of InteractionStateMixin

packages/field/src/InteractionStateMixin.js

@@ -2,7 +2,6 @@ import { dedupeMixin } from '@lion/core';
 import { CssClassMixin } from '@lion/core/src/CssClassMixin.js';
 import { ObserverMixin } from '@lion/core/src/ObserverMixin.js';
 import { Unparseable } from '@lion/validate';
-import { FocusMixin } from './FocusMixin.js';
 
 /**
  * `InteractionStateMixin` adds meta information about touched and dirty states, that can
@@ -16,7 +15,7 @@ import { FocusMixin } from './FocusMixin.js';
 export const InteractionStateMixin = dedupeMixin(
   superclass =>
     // eslint-disable-next-line no-unused-vars, no-shadow
-    class InteractionStateMixin extends CssClassMixin(FocusMixin(ObserverMixin(superclass))) {
+    class InteractionStateMixin extends CssClassMixin(ObserverMixin(superclass)) {
       static get properties() {
         return {
           ...super.properties,

packages/field/src/LionField.js

@@ -8,6 +8,7 @@ import { ValidateMixin } from '@lion/validate';
 import { FormControlMixin } from './FormControlMixin.js';
 import { InteractionStateMixin } from './InteractionStateMixin.js'; // applies FocusMixin
 import { FormatMixin } from './FormatMixin.js';
+import { FocusMixin } from './FocusMixin.js';
 
 /**
  * LionField: wraps components input, textarea and select and potentially others
@@ -29,12 +30,14 @@ import { FormatMixin } from './FormatMixin.js';
 // eslint-disable-next-line max-len, no-unused-vars
 export class LionField extends FormControlMixin(
   InteractionStateMixin(
+    FocusMixin(
       FormatMixin(
         ValidateMixin(
           CssClassMixin(ElementMixin(DelegateMixin(SlotMixin(ObserverMixin(LionLitElement))))),
         ),
       ),
     ),
+  ),
 ) {
   get delegations() {
     return {