Unverified Commit c586b217 authored by larowlan's avatar larowlan

Issue #2784443 by tedbow, Wim Leers, Cottser, tim.plunkett, droplet, drpal,...

Issue #2784443 by tedbow, Wim Leers, Cottser, tim.plunkett, droplet, drpal, nod_, lauriii: Move off-canvas functionality from Settings tray module into drupal.dialog.ajax library so that other modules can use it
parent 850f03b9
......@@ -908,3 +908,31 @@ underscore:
gpl-compatible: true
js:
assets/vendor/underscore/underscore-min.js: { weight: -20, minified: true }
drupal.dialog.off_canvas:
version: VERSION
js:
misc/dialog/off-canvas.js: {}
css:
base:
misc/dialog/off-canvas.reset.css: {}
misc/dialog/off-canvas.base.css: {}
misc/dialog/off-canvas.css: {}
# Add group setting to make sure this CSS load before any jQuery UI Dialog
# CSS.
misc/dialog/off-canvas.theme.css: { group: 200 }
component:
misc/dialog/off-canvas.motion.css: {}
misc/dialog/off-canvas.button.css: {}
misc/dialog/off-canvas.form.css: {}
misc/dialog/off-canvas.table.css: {}
misc/dialog/off-canvas.details.css: {}
misc/dialog/off-canvas.tabledrag.css: {}
misc/dialog/off-canvas.dropbutton.css: {}
dependencies:
- core/jquery
- core/drupal
- core/drupal.ajax
- core/drupal.announce
- core/drupal.dialog
- core/drupal.dialog.ajax
......@@ -1048,6 +1048,11 @@ services:
arguments: ['@title_resolver']
tags:
- { name: render.main_content_renderer, format: drupal_dialog }
main_content_renderer.off_canvas:
class: Drupal\Core\Render\MainContent\OffCanvasRenderer
arguments: ['@title_resolver', '@renderer']
tags:
- { name: render.main_content_renderer, format: drupal_dialog.off_canvas }
main_content_renderer.modal:
class: Drupal\Core\Render\MainContent\ModalRenderer
arguments: ['@title_resolver']
......
<?php
namespace Drupal\settings_tray\Ajax;
use Drupal\Core\Ajax\OpenDialogCommand;
namespace Drupal\Core\Ajax;
/**
* Defines an AJAX command to open content in a dialog in a off-canvas dialog.
*
* @ingroup ajax
*
* @internal
*/
class OpenOffCanvasDialogCommand extends OpenDialogCommand {
......
<?php
namespace Drupal\settings_tray\Render\MainContent;
namespace Drupal\Core\Render\MainContent;
use Drupal\Core\Ajax\AjaxResponse;
use Drupal\Core\Controller\TitleResolverInterface;
use Drupal\Core\Render\MainContent\DialogRenderer;
use Drupal\Core\Render\RendererInterface;
use Drupal\Core\Routing\RouteMatchInterface;
use Drupal\settings_tray\Ajax\OpenOffCanvasDialogCommand;
use Drupal\Core\Ajax\OpenOffCanvasDialogCommand;
use Symfony\Component\HttpFoundation\Request;
/**
......@@ -47,7 +46,7 @@ public function renderResponse(array $main_content, Request $request, RouteMatch
$content = $this->renderer->renderRoot($main_content);
// Attach the library necessary for using the OpenOffCanvasDialogCommand and
// set the attachments for this Ajax response.
$main_content['#attached']['library'][] = 'settings_tray/drupal.off_canvas';
$main_content['#attached']['library'][] = 'core/drupal.dialog.off_canvas';
$response->setAttachments($main_content['#attached']);
// If the main content doesn't provide a title, use the title resolver.
......
/**
* @file
* Set base styles for the settings tray.
* Set base styles for the off-canvas dialog.
*/
/* Set some global attributes. */
......@@ -217,18 +217,18 @@
}
#drupal-off-canvas .messages--status {
background-color: #f3faef;
background-image: url(../../../misc/icons/73b355/check.svg);
background-image: url(../icons/73b355/check.svg);
color: #325e1c;
}
#drupal-off-canvas .messages--warning {
background-color: #fdf8ed;
background-image: url(../../../misc/icons/e29700/warning.svg);
background-image: url(../icons/e29700/warning.svg);
color: #734c00;
}
#drupal-off-canvas .messages--error {
background-color: #fcf4f2;
background-image: url(../../../misc/icons/e32700/error.svg);
background-image: url(../icons/e32700/error.svg);
color: #a51b00;
}
......
/**
* @file
* Visual styling for buttons in the off canvas tray.
* Visual styling for buttons in the off-canvas dialog.
*
* See seven/css/components/buttons.css
* @see seven/css/components/buttons.css
*/
#drupal-off-canvas button,
......
/**
* @file
* CSS for off-canvas dialog.
*
* @todo Move CSS into core dialog library https://www.drupal.org/node/2784443.
*/
/* Position the off-canvas dialog container outside the right of the viewport. */
......@@ -23,14 +21,14 @@
text-align: right;
}
/* Position the dialog-off-canvas tray container outside the right of the viewport. */
/* Position the off-canvas dialog container outside the right of the viewport. */
.ui-dialog-off-canvas {
box-sizing: border-box;
height: 100%;
overflow: visible;
}
/* Wrap the form that's inside the dialog-off-canvas tray. */
/* Wrap the form that's inside the off-canvas dialog. */
.ui-dialog-off-canvas #drupal-off-canvas {
padding: 0 20px;
/* Prevent horizontal scrollbar. */
......@@ -42,15 +40,15 @@
}
/*
* Force the tray to be 100% width at the same breakpoint the dialog system uses
* to expand dialog widths.
* Force the off-canvas dialog to be 100% width at the same breakpoint the
* dialog system uses to expand dialog widths.
*/
@media all and (max-width: 48em) { /* 768px */
.ui-dialog.ui-dialog-off-canvas {
width: 100% !important;
}
/* When tray is at 100% width stop the body from scrolling */
.js-tray-open {
/* When off-canvas dialog is at 100% width stop the body from scrolling */
.js-off-canvas-dialog-open {
height: 100%;
overflow-y: hidden;
}
......
/**
* @file
* Visual styling for summary and details in the Settings Tray module's off canvas tray.
* Visual styling for summary and details in the off-canvas dialog.
*/
#drupal-off-canvas details,
......
/**
* @file
* Styles for dropbuttons in the off-canvas tray.
* Styles for dropbuttons in the off-canvas dialog.
*/
#drupal-off-canvas .dropbutton-wrapper,
......@@ -241,7 +241,7 @@
content: '.';
display: block;
color: transparent;
background: transparent url(../../../misc/icons/ffffff/pencil.svg) no-repeat center;
background: transparent url(../icons/ffffff/pencil.svg) no-repeat center;
background-size: 14px;
}
......
/**
* @file
* Drupal's off-canvas library.
*
* @todo This functionality should extracted into a new core library or a part
* of the current drupal.dialog.ajax library.
* https://www.drupal.org/node/2784443
*
* @private
*/
(($, Drupal, debounce, displace) => {
......@@ -22,13 +16,15 @@
/**
* The minimum width to use body displace needs to match the width at which
* the tray will be %100 width. @see settings_tray.module.css
* the tray will be 100% width. @see core/misc/dialog/off-canvas.css
*
* @type {Number}
*/
minDisplaceWidth: 768,
/**
* Wrapper used to position off-canvas dialog.
*
* @type {jQuery}
*/
$mainCanvasWrapper: $('[data-off-canvas-main-canvas]'),
......@@ -38,6 +34,7 @@
*
* @param {jQuery} $element
* The dialog element.
*
* @return {bool}
* True this is currently an off-canvas dialog.
*/
......@@ -59,16 +56,17 @@
/**
* Handler fired before an off-canvas dialog has been opened.
* @param {Object} settings
*
* @param {Object} settings
* Settings related to the composition of the dialog.
*
* @return {undefined}
*/
beforeCreate({ settings, $element }) {
// Clean up previous dialog event handlers.
Drupal.offCanvas.removeOffCanvasEvents($element);
$('body').addClass('js-tray-open');
settings.dialogClass += ' ui-dialog-off-canvas';
$('body').addClass('js-off-canvas-dialog-open');
// @see http://api.jqueryui.com/position/
settings.position = {
my: 'left top',
......@@ -85,10 +83,11 @@
/**
* Handler fired after an off-canvas dialog has been closed.
*
* @return {undefined}
*/
beforeClose({ $element }) {
$('body').removeClass('js-tray-open');
$('body').removeClass('js-off-canvas-dialog-open');
// Remove all *.off-canvas events
Drupal.offCanvas.removeOffCanvasEvents($element);
......@@ -97,10 +96,12 @@
/**
* Handler fired when an off-canvas dialog has been opened.
* @param {jQuery} $element
*
* @param {jQuery} $element
* The off-canvas dialog element.
* @param {Object} settings
* @param {Object} settings
* Settings related to the composition of the dialog.
*
* @return {undefined}
*/
afterCreate({ $element, settings }) {
......@@ -120,8 +121,10 @@
/**
* Toggle classes based on title existence.
* Called with Drupal.offCanvas.afterCreate.
* @param {Object} settings
*
* @param {Object} settings
* Settings related to the composition of the dialog.
*
* @return {undefined}
*/
render({ settings }) {
......
/**
* @file
* Visual styling for forms in the Settings Tray module's off canvas tray.
* Visual styling for forms in the off-canvas dialog.
*/
#drupal-off-canvas form {
......
......@@ -25,8 +25,7 @@
Drupal.offCanvas.removeOffCanvasEvents($element);
$('body').addClass('js-tray-open');
settings.dialogClass += ' ui-dialog-off-canvas';
$('body').addClass('js-off-canvas-dialog-open');
settings.position = {
my: 'left top',
......@@ -39,7 +38,7 @@
beforeClose: function beforeClose(_ref2) {
var $element = _ref2.$element;
$('body').removeClass('js-tray-open');
$('body').removeClass('js-off-canvas-dialog-open');
Drupal.offCanvas.removeOffCanvasEvents($element);
......
......@@ -4,12 +4,8 @@
*
* Motion effects are in a separate file so that they can be easily turned off
* to improve performance if desired.
*
* @todo Move motion effects file into a core Off-Canvas library and add a
* configuration option for browser rendering performance to disable this
* file: https://www.drupal.org/node/2784443.
*/
.dialog-off-canvas__main-canvas {
.dialog-off-canvas-main-canvas {
transition: all .7s ease;
}
/**
* @file
* Visual styling for tables in the Settings Tray module's off canvas tray.
* Visual styling for tables in the off-canvas dialog.
*/
#drupal-off-canvas table * {
......
/**
* @file
* Table drag behavior for Settings Tray module.
* Table drag behavior for off-canvas dialog.
*
* @see tabledrag.js
*/
......@@ -39,7 +39,7 @@
#drupal-off-canvas a.tabledrag-handle .handle {
/* Use lighter drag icon against dark background. */
background-color: transparent;
background-image: url(../../../misc/icons/bebebe/move.svg);
background-image: url(../icons/bebebe/move.svg);
background-repeat: no-repeat;
background-position: center;
height: auto;
......@@ -49,7 +49,7 @@
}
#drupal-off-canvas .draggable a.tabledrag-handle:hover .handle,
#drupal-off-canvas .draggable a.tabledrag-handle:focus .handle {
background-image: url(../../../misc/icons/787878/move.svg);
background-image: url(../icons/787878/move.svg);
text-decoration: none;
}
#drupal-off-canvas tr td {
......
......@@ -15,7 +15,7 @@
z-index: 501;
}
/* Style the tray header. */
/* Style the off-canvas dialog header. */
.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar {
padding: 1em;
background: #2d2d2d;
......@@ -30,7 +30,7 @@
visibility: hidden;
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close {
background-image: url(../../../misc/icons/bebebe/ex.svg);
background-image: url(../icons/bebebe/ex.svg);
background-position: center center;
background-repeat: no-repeat;
background-color: transparent;
......@@ -40,7 +40,7 @@
transition: background .5s ease;
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close:hover {
background-image: url(../../../misc/icons/ffffff/ex.svg);
background-image: url(../icons/ffffff/ex.svg);
}
[dir="rtl"] .ui-dialog.ui-dialog-off-canvas .ui-dialog-titlebar-close {
left: 1em;
......@@ -64,7 +64,7 @@
padding-right: 30px;
}
.ui-dialog.ui-dialog-off-canvas .ui-dialog-title:before {
background: transparent url(../../../misc/icons/ffffff/pencil.svg) no-repeat scroll center center;
background: transparent url(../icons/ffffff/pencil.svg) no-repeat scroll center center;
background-size: 100% auto;
content: '';
display: block;
......
......@@ -14,10 +14,10 @@
float: right;
}
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode input {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode input {
pointer-events: none;
}
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .contextual-links a {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .contextual-links a {
pointer-events: inherit;
}
......@@ -12,8 +12,8 @@
}
/* Transition the editables on the page, their contextual links and their hover states. */
.dialog-off-canvas__main-canvas .contextual,
.dialog-off-canvas__main-canvas .js-settings-tray-edit-mode .settings-tray-editable,
.dialog-off-canvas__main-canvas.js-tray-open .js-settings-tray-edit-mode .settings-tray-editable {
.dialog-off-canvas-main-canvas .contextual,
.dialog-off-canvas-main-canvas .js-settings-tray-edit-mode .settings-tray-editable,
.dialog-off-canvas-main-canvas.js-off-canvas-dialog-open .js-settings-tray-edit-mode .settings-tray-editable {
transition: all .7s ease;
}
......@@ -60,11 +60,11 @@
}
/* Style the editables while in edit mode. */
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .settings-tray-editable {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .settings-tray-editable {
outline: 1px dashed rgba(0,0,0,0.5);
box-shadow: 0 0 0 1px rgba(255,255,255,0.7);
}
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .settings-tray-editable:hover,
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode .settings-tray-editable.settings-tray-active-editable {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .settings-tray-editable:hover,
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode .settings-tray-editable.settings-tray-active-editable {
background-color: rgba(0,0,0,0.2);
}
......@@ -17,29 +17,3 @@ drupal.settings_tray:
- core/drupal
- core/jquery.once
- core/drupal.ajax
drupal.off_canvas:
version: VERSION
js:
js/off-canvas.js: {}
css:
base:
css/off-canvas.reset.css: {}
css/off-canvas.base.css: {}
css/off-canvas.css: {}
css/off-canvas.theme.css: { group: 200 }
component:
css/off-canvas.motion.css: {}
css/off-canvas.button.css: {}
css/off-canvas.form.css: {}
css/off-canvas.table.css: {}
css/off-canvas.details.css: {}
css/off-canvas.tabledrag.css: {}
css/off-canvas.dropbutton.css: {}
dependencies:
- core/jquery
- core/drupal
- core/drupal.ajax
- core/drupal.announce
- core/drupal.dialog
- core/drupal.dialog.ajax
......@@ -44,7 +44,7 @@ function settings_tray_contextual_links_view_alter(&$element, $items) {
$element['#links']['settings-trayblock-configure']['title'] = t('Quick edit settings');
}
$element['#attached']['library'][] = 'settings_tray/drupal.off_canvas';
$element['#attached']['library'][] = 'core/drupal.dialog.off_canvas';
}
}
......@@ -60,26 +60,6 @@ function settings_tray_block_view_alter(array &$build) {
];
}
/**
* Implements hook_element_info_alter().
*/
function settings_tray_element_info_alter(&$type) {
if (isset($type['page'])) {
$type['page']['#theme_wrappers']['settings_tray_page_wrapper'] = ['#weight' => -1000];
}
}
/**
* Implements hook_theme().
*/
function settings_tray_theme() {
return [
'settings_tray_page_wrapper' => [
'variables' => ['children' => NULL],
],
];
}
/**
* Implements hook_entity_type_build().
*/
......
services:
main_content_renderer.off_canvas:
class: Drupal\settings_tray\Render\MainContent\OffCanvasRenderer
arguments: ['@title_resolver', '@renderer']
tags:
- { name: render.main_content_renderer, format: drupal_dialog.off_canvas }
access_check.settings_tray.block.settings_tray_form:
class: Drupal\settings_tray\Access\BlockPluginHasSettingsTrayFormAccessCheck
tags:
......
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode input {
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode a,
.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode input {
pointer-events: inherit !important;
}
/**
......
......@@ -8,6 +8,7 @@
use Drupal\settings_tray_test\Plugin\Block\SettingsTrayFormAnnotationIsClassBlock;
use Drupal\settings_tray_test\Plugin\Block\SettingsTrayFormAnnotationNoneBlock;
use Drupal\Tests\contextual\FunctionalJavascript\ContextualLinkClickTrait;
use Drupal\Tests\system\FunctionalJavascript\OffCanvasTestBase;
use Drupal\user\Entity\Role;
/**
......@@ -15,7 +16,7 @@
*
* @group settings_tray
*/
class SettingsTrayBlockFormTest extends SettingsTrayJavascriptTestBase {
class SettingsTrayBlockFormTest extends OffCanvasTestBase {
use ContextualLinkClickTrait;
......@@ -144,7 +145,7 @@ public function testBlocks($theme, $block_plugin, $new_page_text, $element_selec
// suppressed.
$this->openBlockForm("$block_selector {$element_selector}", $block_selector);
$web_assert->elementTextContains('css', '.contextual-toolbar-tab button', 'Editing');
$web_assert->elementAttributeContains('css', '.dialog-off-canvas__main-canvas', 'class', 'js-settings-tray-edit-mode');
$web_assert->elementAttributeContains('css', '.dialog-off-canvas-main-canvas', 'class', 'js-settings-tray-edit-mode');
// Simulate press the Escape key.
$this->getSession()->executeScript('jQuery("body").trigger(jQuery.Event("keyup", { keyCode: 27 }));');
$this->waitForOffCanvasToClose();
......@@ -152,7 +153,7 @@ public function testBlocks($theme, $block_plugin, $new_page_text, $element_selec
$this->assertEditModeDisabled();
$web_assert->elementTextContains('css', '#drupal-live-announce', 'Exited edit mode.');
$web_assert->elementTextNotContains('css', '.contextual-toolbar-tab button', 'Editing');
$web_assert->elementAttributeNotContains('css', '.dialog-off-canvas__main-canvas', 'class', 'js-settings-tray-edit-mode');
$web_assert->elementAttributeNotContains('css', '.dialog-off-canvas-main-canvas', 'class', 'js-settings-tray-edit-mode');
}
/**
......@@ -277,7 +278,7 @@ protected function openBlockForm($block_selector, $contextual_link_container = '
$this->assertNotEmpty($contextual_link);
// When page first loads Edit Mode is not triggered until first contextual
// link is added.
$this->assertElementVisibleAfterWait('css', '.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode');
$this->assertElementVisibleAfterWait('css', '.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode');
// Ensure that all other Ajax activity is completed.
$this->assertSession()->assertWaitOnAjaxRequest();
$this->click($block_selector);
......@@ -414,7 +415,7 @@ protected function assertEditModeEnabled() {
// The toolbar edit button should read "Editing".
$web_assert->elementContains('css', static::TOOLBAR_EDIT_LINK_SELECTOR, 'Editing');
// The main canvas element should have the "js-settings-tray-edit-mode" class.
$web_assert->elementExists('css', '.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode');
$web_assert->elementExists('css', '.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode');
}
/**
......@@ -430,7 +431,7 @@ protected function assertEditModeDisabled() {
$web_assert->elementContains('css', static::TOOLBAR_EDIT_LINK_SELECTOR, 'Edit');
// The main canvas element should NOT have the "js-settings-tray-edit-mode"
// class.
$web_assert->elementNotExists('css', '.dialog-off-canvas__main-canvas.js-settings-tray-edit-mode');
$web_assert->elementNotExists('css', '.dialog-off-canvas-main-canvas.js-settings-tray-edit-mode');
}
/**
......@@ -565,4 +566,15 @@ public function testValidationMessages() {
}
}
/**
* {@inheritdoc}
*/
protected function getTestThemes() {
// Remove 'seven' theme. Setting Tray "Edit Mode" will not work with 'seven'
// because it removes all contextual links the off-canvas dialog should.
return array_filter(parent::getTestThemes(), function ($theme) {
return $theme !== 'seven';
});
}
}
......@@ -276,6 +276,9 @@ function system_theme() {
],
'template' => 'entity-add-list',
],
'off_canvas_page_wrapper' => [
'variables' => ['children' => NULL],
],
]);
}
......@@ -1523,3 +1526,12 @@ function system_query_entity_reference_alter(AlterableInterface $query) {
$handler = $query->getMetadata('entity_reference_selection_handler');
$handler->entityQueryAlter($query);
}
/**
* Implements hook_element_info_alter().
*/
function system_element_info_alter(&$type) {
if (isset($type['page'])) {
$type['page']['#theme_wrappers']['off_canvas_page_wrapper'] = ['#weight' => -1000];
}
}
......@@ -5,13 +5,13 @@
*
* For consistent wrapping to {{ page }} render in all themes. The
* "data-off-canvas-main-canvas" attribute is required by the off-canvas dialog.
* This is used by the settings_tray/drupal.off_canvas library to select the
* "main canvas" page element as opposed to the "off canvas" which is the tray
* This is used by the core/drupal.dialog.off_canvas library to select the
* "main canvas" page element as opposed to the "off canvas" which is the dialog
* itself. The "main canvas" element must be resized according to the width of
* the "off canvas" tray so that no portion of the "main canvas" is obstructed
* by the tray. The tray can vary in width when opened and can be resized by the
* user. The "data-off-canvas-main-canvas" attribute cannot be removed without
* breaking the off-canvas dialog functionality.
* the "off canvas" dialog so that no portion of the "main canvas" is obstructed
* by the off-canvas dialog. The off-canvas dialog can vary in width when opened
* and can be resized by the user. The "data-off-canvas-main-canvas" attribute
* cannot be removed without breaking the off-canvas dialog functionality.
*
* Available variables:
* - children: Contains the child elements of the page.
......@@ -20,7 +20,7 @@
*/
#}
{% if children %}
<div class="dialog-off-canvas__main-canvas" data-off-canvas-main-canvas >
<div class="dialog-off-canvas-main-canvas" data-off-canvas-main-canvas>
{{ children }}
</div>
{% endif %}
......@@ -4,6 +4,3 @@ description: 'Provides off-canvas test links.'
package: Testing
version: VERSION
core: 8.x
dependencies:
- block
- settings_tray
......@@ -53,11 +53,6 @@ public function linksDisplay() {
'data-dialog-type' => 'dialog',
'data-dialog-renderer' => 'off_canvas',
],
'#attached' => [
'library' => [
'settings_tray/drupal.settings_tray',
],
],
],
'off_canvas_link_2' => [
'#title' => 'Click Me 2!',
......@@ -71,11 +66,6 @@ public function linksDisplay() {
'width' => 555,
]),
],
'#attached' => [
'library' => [
'settings_tray/drupal.settings_tray',
],
],
],
'other_dialog_links' => [
'#title' => 'Display more links!',
......@@ -86,10 +76,10 @@ public function linksDisplay() {
'data-dialog-type' => 'dialog',
'data-dialog-renderer' => 'off_canvas',
],
'#attached' => [
'library' => [
'settings_tray/drupal.settings_tray',
],
],
'#attached' => [
'library' => [
'core/drupal.dialog.ajax',
],