Issue #3041375 by lauriii, johndevman, yogeshmpawar, bnjmnm: Convert...

Issue #3041375 by lauriii, johndevman, yogeshmpawar, bnjmnm: Convert behaviors.layoutBuilderBlockDrag to use js- prefixed classes for attaching behaviors

(cherry picked from commit 9bd884d5)

core/modules/layout_builder/js/layout-builder.es6.js

@@ -111,10 +111,10 @@
   behaviors.layoutBuilderBlockDrag = {
     attach(context) {
       $(context)
-        .find('.layout-builder__region')
+        .find('.js-layout-builder-region')
         .sortable({
-          items: '> .draggable',
-          connectWith: '.layout-builder__region',
+          items: '> .js-layout-builder-block',
+          connectWith: '.js-layout-builder-region',
           placeholder: 'ui-state-drop',
 
           /**
@@ -127,7 +127,7 @@
            */
           update(event, ui) {
             // Check if the region from the event and region for the item match.
-            const itemRegion = ui.item.closest('.layout-builder__region');
+            const itemRegion = ui.item.closest('.js-layout-builder-region');
             if (event.target === itemRegion[0]) {
               // Find the destination delta.
               const deltaTo = ui.item

core/modules/layout_builder/js/layout-builder.js

@@ -55,13 +55,13 @@
 
   behaviors.layoutBuilderBlockDrag = {
     attach: function attach(context) {
-      $(context).find('.layout-builder__region').sortable({
-        items: '> .draggable',
-        connectWith: '.layout-builder__region',
+      $(context).find('.js-layout-builder-region').sortable({
+        items: '> .js-layout-builder-block',
+        connectWith: '.js-layout-builder-region',
         placeholder: 'ui-state-drop',
 
         update: function update(event, ui) {
-          var itemRegion = ui.item.closest('.layout-builder__region');
+          var itemRegion = ui.item.closest('.js-layout-builder-region');
           if (event.target === itemRegion[0]) {
             var deltaTo = ui.item.closest('[data-layout-delta]').data('layout-delta');
 

core/modules/layout_builder/src/Element/LayoutBuilder.php

@@ -246,7 +246,7 @@ protected function buildAdministrativeSection(SectionStorageInterface $section_s
     foreach ($layout_definition->getRegions() as $region => $info) {
       if (!empty($build[$region])) {
         foreach (Element::children($build[$region]) as $uuid) {
-          $build[$region][$uuid]['#attributes']['class'][] = 'draggable';
+          $build[$region][$uuid]['#attributes']['class'][] = 'js-layout-builder-block';
           $build[$region][$uuid]['#attributes']['class'][] = 'layout-builder-block';
           $build[$region][$uuid]['#attributes']['data-layout-block-uuid'] = $uuid;
           $build[$region][$uuid]['#attributes']['data-layout-builder-highlight-id'] = $this->blockUpdateHighlightId($uuid);
@@ -303,6 +303,7 @@ protected function buildAdministrativeSection(SectionStorageInterface $section_s
       $build[$region]['layout_builder_add_block']['#weight'] = 1000;
       $build[$region]['#attributes']['data-region'] = $region;
       $build[$region]['#attributes']['class'][] = 'layout-builder__region';
+      $build[$region]['#attributes']['class'][] = 'js-layout-builder-region';
       $build[$region]['#attributes']['role'] = 'group';
       $build[$region]['#attributes']['aria-label'] = $this->t('@region region in section @section', [
         '@region' => $info['label'],