vadimpopa

// Bellow instructions how to run a build with BabelJs. After following them, just run in CLI: `sencha app build` or `npm run build`

// 1. In app.json
"production": {
   "output": {
      "framework": {
        "enable":true //This enables split mode, app code will be splitted in 2 files: app.js and framework.js
      }
    }
 },

vadimpopa

Ext.define('MyApp.view.search.results.RowDetails', {
    extend: 'Ext.container.Container',
    xtype: 'search.results.rowdetails',

    requires: [
        'Acclaim.mixin.Tooltip',
        'Acclaim.util.Renderers',
        'Acclaim.util.Collections',

        'Acclaim.view.document.field.Assignee',

vadimpopa

Ext.define('MyApp.view.search.results.RowWidget', {
    extend: 'Ext.grid.plugin.RowWidget',
    alias: 'plugin.search.results.rowwidget',

    bindView: function(view) {
        this.callParent(arguments);

        this.viewListeners = view.on({
            scope: this,
            destroyable: true,

vadimpopa

In a previous post (http://moduscreate.com/a-dive-into-the-sencha-class-config-system/) Stan explained the foundation of Sencha Config System and how the getters and setters work. In this post I'm going to explain the new Ext.Config.configs which have been added in versions 5.0 and 5.5, which you can find here http://docs.sencha.com/extjs/6.0.2-classic/Ext.Config.html

1. Ext.Config.cached

According to Sencha docs the cached config when set as true the config property will be stored on the class prototype once the first instance has had a chance to process the default value. To test that I've created a Fiddle: https://fiddle.sencha.com/#fiddle/1cpj.

```javascript

vadimpopa

Sencha ViewModels tips and considerations.

1. Always destroy your bindings in the destroy method of your view. In the example below, the grid is a child of a parent view which has a ViewModel. But if the child is removed from the parent the binding will still be called and can lead to unexpected surprises. So you could destroy them manually, or automatically by adding a ViewModel to the view

   Ext.define('MyApp.view.MyGridTab', {
       extend: 'Ext.grid.Panel',
       xtype: 'mygrid',
       columns: [],
       beforeRender: function () {

vadimpopa

// Custom display field: 	D01H7/74; D01H9/04

xtype: 'displayfield',
fieldLabel: 'Custom display field',
bind: {
    value: '{fooArray}'
},
customFieldTpl: new Ext.XTemplate(
    '<tpl for="." between=";&nbsp;">',
    '<span class="search-field-link" data-value="{xindex}"' ,

vadimpopa

Ext.define('MyApp.modules.Angular', {
    singleton: true,

    dependeciesLoaded: false,

    showComponent: function() {
        var count = 5;

        if (!this.dependeciesLoaded) {
            var onLoad = function () {

vadimpopa

/*  Usage:
*   <div kb-select ng-model="items.selectedItem">
*     <div class="just-a-tag-with-a-class"></div>
*     <my-data-row ng-repeat="item in items" entity="item"></my-data-row>
*   </div>
*/

function kbSelect() {
    return {
        restrict: 'EA',