Always show StreamField and InlinePanel block actions

client/scss/components/_panel.scss

@@ -56,8 +56,7 @@ $header-gap: theme('spacing.1');
 
 .w-panel__anchor,
 .w-panel__toggle,
-.w-panel__controls .button.button--icon,
-.w-panel__controls-cue {
+.w-panel__controls .button.button--icon {
   @include show-focus-outline-inside();
   display: inline-grid;
   justify-content: center;
@@ -157,33 +156,6 @@ $header-gap: theme('spacing.1');
     margin: calc(-1 * theme('spacing.4'));
     margin-inline-start: 0;
   }
-
-  // The cue is meant to be displayed on top of a real button.
-  > .w-panel__controls-cue {
-    position: absolute;
-    visibility: hidden;
-  }
-
-  @media (hover: hover) {
-    // Hiding with opacity only, so the elements can still be focused.
-    > * {
-      opacity: 0;
-    }
-
-    > .w-panel__controls-cue {
-      opacity: 1;
-      visibility: visible;
-    }
-
-    .w-panel__header:is(:hover, :focus-within) & > * {
-      opacity: 1;
-
-      // The cue should be fully hidden, not just transparent.
-      &.w-panel__controls-cue {
-        visibility: hidden;
-      }
-    }
-  }
 }
 
 .w-panel__wrapper {

client/src/components/StreamField/blocks/BaseSequenceBlock.js

@@ -178,13 +178,7 @@ export class BaseSequenceChild extends EventEmitter {
               </svg>
             </a>
             <div class="w-panel__divider"></div>
-            <div class="w-panel__controls" data-panel-controls>
-              <div class="w-panel__controls-cue">
-                <svg class="icon icon-dots-horizontal w-panel__icon" aria-hidden="true">
-                  <use href="#icon-dots-horizontal"></use>
-                </svg>
-              </div>
-            </div>
+            <div class="w-panel__controls" data-panel-controls></div>
           </div>
           <div id="${contentId}" class="w-panel__content">
             <div data-streamfield-block></div>

client/src/components/StreamField/blocks/__snapshots__/ListBlock.test.js.snap

@@ -38,13 +38,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be duplicated 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -106,13 +100,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be duplicated 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -174,13 +162,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be duplicated 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -256,13 +238,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be reordered downward 1`]
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -324,13 +300,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be reordered downward 1`]
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -406,13 +376,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be reordered upward 1`] =
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -474,13 +438,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be reordered upward 1`] =
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -556,13 +514,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be split 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -624,13 +576,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be split 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -692,13 +638,7 @@ exports[`telepath: wagtail.blocks.ListBlock blocks can be split 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -774,13 +714,7 @@ exports[`telepath: wagtail.blocks.ListBlock deleteBlock() deletes a block 1`] =
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -842,13 +776,7 @@ exports[`telepath: wagtail.blocks.ListBlock deleteBlock() deletes a block 1`] =
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -924,13 +852,7 @@ exports[`telepath: wagtail.blocks.ListBlock it renders correctly 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -992,13 +914,7 @@ exports[`telepath: wagtail.blocks.ListBlock it renders correctly 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -1074,13 +990,7 @@ exports[`telepath: wagtail.blocks.ListBlock setError passes error messages to ch
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -1142,13 +1052,7 @@ exports[`telepath: wagtail.blocks.ListBlock setError passes error messages to ch
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -1224,13 +1128,7 @@ exports[`telepath: wagtail.blocks.ListBlock setError renders non-block errors 1`
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -1292,13 +1190,7 @@ exports[`telepath: wagtail.blocks.ListBlock setError renders non-block errors 1`
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>

client/src/components/StreamField/blocks/__snapshots__/StreamBlock.test.js.snap

@@ -39,13 +39,7 @@ exports[`telepath: wagtail.blocks.StreamBlock blocks can be duplicated 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -109,13 +103,7 @@ exports[`telepath: wagtail.blocks.StreamBlock blocks can be duplicated 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -179,13 +167,7 @@ exports[`telepath: wagtail.blocks.StreamBlock blocks can be duplicated 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -264,13 +246,7 @@ exports[`telepath: wagtail.blocks.StreamBlock blocks can be reordered downward 1
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -334,13 +310,7 @@ exports[`telepath: wagtail.blocks.StreamBlock blocks can be reordered downward 1
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -419,13 +389,7 @@ exports[`telepath: wagtail.blocks.StreamBlock blocks can be reordered upward 1`]
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -489,13 +453,7 @@ exports[`telepath: wagtail.blocks.StreamBlock blocks can be reordered upward 1`]
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -574,13 +532,7 @@ exports[`telepath: wagtail.blocks.StreamBlock it renders correctly 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -644,13 +596,7 @@ exports[`telepath: wagtail.blocks.StreamBlock it renders correctly 1`] = `
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -729,13 +675,7 @@ exports[`telepath: wagtail.blocks.StreamBlock it renders menus on opening 1`] =
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -799,13 +739,7 @@ exports[`telepath: wagtail.blocks.StreamBlock it renders menus on opening 1`] =
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -884,13 +818,7 @@ exports[`telepath: wagtail.blocks.StreamBlock setError renders error messages 1`
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\" disabled=\\"disabled\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>
@@ -954,13 +882,7 @@ exports[`telepath: wagtail.blocks.StreamBlock setError renders error messages 1`
               </svg>
             </a>
             <div class=\\"w-panel__divider\\"></div>
-            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\">
-              <div class=\\"w-panel__controls-cue\\">
-                <svg class=\\"icon icon-dots-horizontal w-panel__icon\\" aria-hidden=\\"true\\">
-                  <use href=\\"#icon-dots-horizontal\\"></use>
-                </svg>
-              </div>
-            <button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
+            <div class=\\"w-panel__controls\\" data-panel-controls=\\"\\"><button type=\\"button\\" class=\\"button button--icon text-replace white\\" title=\\"Move up\\">
         <svg class=\\"icon icon-arrow-up\\" aria-hidden=\\"true\\">
           <use href=\\"#icon-arrow-up\\"></use>
         </svg>

wagtail/admin/templates/wagtailadmin/shared/panel.html

@@ -45,9 +45,6 @@
             <div class="w-panel__divider"></div>
             {% if header_controls %}
                 <div class="w-panel__controls" data-panel-controls>
-                    <div class="w-panel__controls-cue">
-                        {% icon name="dots-horizontal" classname="w-panel__icon" %}
-                    </div>
                     {{ header_controls }}
                 </div>
             {% endif %}