update formatting

Author: czernous-devexpress

angular/src/app/app.component.html

@@ -1,12 +1,12 @@
 <dx-drop-down-button
-  text="Sandra Johnson"
-  icon="user"
-  [items]="actions"
-  keyExpr="id"
-  displayExpr="text"
-  (onItemClick)="logAction($event)"
-  [splitButton]="true"
-  (onButtonClick)="logButtonClick()"
-  [dropDownOptions]="dropDownOptions"
+    text="Sandra Johnson"
+    icon="user"
+    [items]="actions"
+    keyExpr="id"
+    displayExpr="text"
+    (onItemClick)="logAction($event)"
+    [splitButton]="true"
+    (onButtonClick)="logButtonClick()"
+    [dropDownOptions]="dropDownOptions"
 >
 </dx-drop-down-button>

angular/src/app/app.component.ts

@@ -1,26 +1,26 @@
 import { Component } from '@angular/core';
 
 @Component({
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-  styleUrls: ['./app.component.css'],
+    selector: 'app-root',
+    templateUrl: './app.component.html',
+    styleUrls: ['./app.component.css']
 })
 export class AppComponent {
-  actions: Array<{ id: Number; text: String; icon: String }> = [
-    { id: 1, text: 'My profile', icon: 'user' },
-    { id: 2, text: 'Messages', icon: 'email' },
-    { id: 3, text: 'Contacts', icon: 'group' },
-    { id: 4, text: 'Log out', icon: 'runner' },
-  ];
-  dropDownOptions = {
-    height: 150,
-  };
+    actions: Array<{ id: Number; text: String; icon: String }> = [
+        { id: 1, text: 'My profile', icon: 'user' },
+        { id: 2, text: 'Messages', icon: 'email' },
+        { id: 3, text: 'Contacts', icon: 'group' },
+        { id: 4, text: 'Log out', icon: 'runner' }
+    ];
+    dropDownOptions = {
+        height: 150
+    };
 
-  logAction(e) {
-    console.log(e.itemData.text + ' was clicked');
-  }
+    logAction(e) {
+        console.log(e.itemData.text + ' was clicked');
+    }
 
-  logButtonClick() {
-    console.log('Main button was clicked');
-  }
+    logButtonClick() {
+        console.log('Main button was clicked');
+    }
 }

jquery/index.js

@@ -1,26 +1,26 @@
 const actions = [
-  { id: 1, text: 'My profile', icon: 'user' },
-  { id: 2, text: 'Messages', icon: 'email' },
-  { id: 3, text: 'Contacts', icon: 'group' },
-  { id: 4, text: 'Log out', icon: 'runner' },
+    { id: 1, text: 'My profile', icon: 'user' },
+    { id: 2, text: 'Messages', icon: 'email' },
+    { id: 3, text: 'Contacts', icon: 'group' },
+    { id: 4, text: 'Log out', icon: 'runner' }
 ];
 
 $(function () {
-  $('#myDropDownButton').dxDropDownButton({
-    text: 'Sandra Johnson',
-    icon: 'user',
-    displayExpr: 'text',
-    items: actions,
-    keyExpr: 'id',
-    onItemClick: function (e) {
-      console.log(e.itemData.text + ' was clicked');
-    },
-    splitButton: true,
-    onButtonClick: function () {
-      console.log('Main button was clicked');
-    },
-    dropDownOptions: {
-      height: 150,
-    },
-  });
+    $('#myDropDownButton').dxDropDownButton({
+        text: 'Sandra Johnson',
+        icon: 'user',
+        displayExpr: 'text',
+        items: actions,
+        keyExpr: 'id',
+        onItemClick: function (e) {
+            console.log(e.itemData.text + ' was clicked');
+        },
+        splitButton: true,
+        onButtonClick: function () {
+            console.log('Main button was clicked');
+        },
+        dropDownOptions: {
+            height: 150
+        }
+    });
 });

react/src/App.js

@@ -6,37 +6,37 @@ import 'devextreme/dist/css/dx.light.css';
 import DropDownButton from 'devextreme-react/drop-down-button';
 
 const actions = [
-  { id: 1, text: 'My profile', icon: 'user' },
-  { id: 2, text: 'Messages', icon: 'email' },
-  { id: 3, text: 'Contacts', icon: 'group' },
-  { id: 4, text: 'Log out', icon: 'runner' },
+    { id: 1, text: 'My profile', icon: 'user' },
+    { id: 2, text: 'Messages', icon: 'email' },
+    { id: 3, text: 'Contacts', icon: 'group' },
+    { id: 4, text: 'Log out', icon: 'runner' }
 ];
 const dropDownOptions = {
-  height: 150,
+    height: 150
 };
 class App extends React.Component {
-  logAction(e) {
-    console.log(e.itemData.text + ' was clicked');
-  }
+    logAction(e) {
+        console.log(e.itemData.text + ' was clicked');
+    }
 
-  logButtonClick() {
-    console.log('Main button was clicked');
-  }
+    logButtonClick() {
+        console.log('Main button was clicked');
+    }
 
-  render() {
-    return (
-      <DropDownButton
-        text="Sandra Johnson"
-        icon="user"
-        items={actions}
-        keyExpr="id"
-        displayExpr="text"
-        onItemClick={this.logAction}
-        splitButton={true}
-        onButtonClick={this.logButtonClick}
-        dropDownOptions={dropDownOptions}
-      />
-    );
-  }
+    render() {
+        return (
+            <DropDownButton
+                text="Sandra Johnson"
+                icon="user"
+                items={actions}
+                keyExpr="id"
+                displayExpr="text"
+                onItemClick={this.logAction}
+                splitButton={true}
+                onButtonClick={this.logButtonClick}
+                dropDownOptions={dropDownOptions}
+            />
+        );
+    }
 }
 export default App;

vue/src/App.vue

@@ -16,10 +16,10 @@
 import DxDropDownButton from 'devextreme-vue/drop-down-button';
 
 const actions = [
-    { id: 1, text: "My profile", icon: "user" },
-    { id: 2, text: "Messages", icon: "email" },
-    { id: 3, text: "Contacts", icon: "group" },
-    { id: 4, text: "Log out", icon: "runner" }
+    { id: 1, text: 'My profile', icon: 'user' },
+    { id: 2, text: 'Messages', icon: 'email' },
+    { id: 3, text: 'Contacts', icon: 'group' },
+    { id: 4, text: 'Log out', icon: 'runner' }
 ];
 
 export default {
@@ -30,17 +30,17 @@ export default {
         return {
             actions,
             dropDownOptions: {
-                height: 150,
+                height: 150
             }
-        }
+        };
     },
     methods: {
         logAction(e) {
-            console.log(e.itemData.text + " was clicked");
+            console.log(e.itemData.text + ' was clicked');
         },
         logButtonClick() {
-            console.log("Main button was clicked");
+            console.log('Main button was clicked');
         }
     }
-}
-</script>
+};
+</script>