From 181697db43113311283682ca63bb33fecbd495ec Mon Sep 17 00:00:00 2001
From: Vlada Skorohodova <94827090+vladaskorohodova@users.noreply.github.com>
Date: Wed, 23 Oct 2024 17:45:01 +0400
Subject: [PATCH] Splitter: add live demo to API (#6740)

---
 .../10 UI Components/dxSplitter/dxSplitter.md  | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/api-reference/10 UI Components/dxSplitter/dxSplitter.md b/api-reference/10 UI Components/dxSplitter/dxSplitter.md
index 81d8233611..846d2d2106 100644
--- a/api-reference/10 UI Components/dxSplitter/dxSplitter.md	
+++ b/api-reference/10 UI Components/dxSplitter/dxSplitter.md	
@@ -8,6 +8,24 @@ inherits: CollectionWidget
 ##### shortDescription
 Splitter is a UI component that allows you to divide a page or section into multiple adjustable [panes](/api-reference/10%20UI%20Components/dxSplitter/1%20Configuration/items '/Documentation/ApiReference/UI_Components/dxSplitter/Configuration/items/').
 
+##### widgettree
+height: 300,
+items: [ {resizable: true,
+    collapsible: true,
+    template: function (data, index, element) {
+        $(element).css('background-color', "#FFE3E3");
+        return 'Pane 1';
+    }
+}, {resizable: true,
+    template: function (data, index, element) {
+        $(element).css('background-color', "#FEF9F2");
+        return 'Pane 2';
+    }
+} ]
+
+##### lib
+dx.web.js, dx.all.js
+
 ---
 #include btn-open-demo with {
     href: "https://js.devexpress.com/Demos/WidgetsGallery/Demo/Splitter/Overview/"