Display parameters

$APPLICATION->IncludeComponent(
	'bitrix:ui.sidepanel.wrapper',
	'',
	[
		'POPUP_COMPONENT_USE_BITRIX24_THEME' => 'Y',
		'DEFAULT_THEME_ID' => 'light:mail',
		'POPUP_COMPONENT_NAME' => $componentName,
		'POPUP_COMPONENT_TEMPLATE_NAME' => '',
		'POPUP_COMPONENT_PARAMS' => $arResult,
		'USE_UI_TOOLBAR' => 'Y',
		'USE_PADDING' => false,
		'PLAIN_VIEW' => false,
		'PAGE_MODE' => false,
		'PAGE_MODE_OFF_BACK_URL' => "/stream/",
	]
);

Editing title inside the header

Parameter	Type	By default	Description
EDITABLE_TITLE_DEFAULT	string	null	Title by default.
EDITABLE_TITLE_SELECTOR	string	null	Element selector with input that hides the field.

For example, a page has a field for title. It's editing can be moved to header. The field is then hidden, header is updated with a pencil symbol near it.

When clicking on a pencil, title now can be edited. Hidden input also receives input value:

Button display

Parameter	Type	By default	Description
BUTTONS	array	[ ]	When slider opens a grid, it makes sense to add a panel with "Close" button to the page bottom. However, grid page should not show "Close" button via direct link. To implement it, pass the value ['close']. It connects the component ui.button.panel with passed list of buttons.

Content display

Disabling the padding

Parameter	Type	By default	Description
USE_PADDING	boolean	true	Padding is enabled for content by default.

Example: image has padding - white background and grey - is content.

Pass USE_PADDING=false, to disable padding for content:

Displaying only content without header

Parameter	Type	By default	Description
PLAIN_VIEW	boolean	false	Parameter allows displaying content without header. Disabled by default.

Example: with PLAIN_VIEW=true, content is disabled without slider padding (content padding remains) and header:

Removing all padding, leaving only content: combine parameters PLAIN_VIEW=true and USE_PADDING=false.

Example

Page is opened from grid. Close after saving and updating the grid:

$APPLICATION->IncludeComponent(
    'bitrix:ui.sidepanel.wrapper',
    '',
    [
        'POPUP_COMPONENT_NAME' => 'bitrix:crm.button.edit',
        'POPUP_COMPONENT_TEMPLATE_NAME' => '',
        'POPUP_COMPONENT_PARAMS' => [
            'PATH_TO_BUTTON_LIST' => $arResult['PATH_TO_BUTTON_LIST'],
            'PATH_TO_BUTTON_EDIT' => $arResult['PATH_TO_BUTTON_EDIT'],
            'PATH_TO_BUTTON_FILL' => $arResult['PATH_TO_BUTTON_FILL'],
            'PATH_TO_USER_PROFILE' => $arResult['PATH_TO_USER_PROFILE'],
            'ELEMENT_ID' => $arResult['VARIABLES']['id']
        ]
        'CLOSE_AFTER_SAVE' => true,
        'RELOAD_GRID_AFTER_SAVE' => true,
    ]
);