Правила заполнения и чтения конфигурации компонентов.

• Каждая дочерняя вариация переопределяет и/или дополняет свойства родительской вариации.
• Свойство view - это вариации представления, в основном влияют на цвет компонента (это не гарантировано ?).
• Свойство props - это комбинация свойств компонента, которая описывает вариацию.
• Вариации определенные в свойстве view не могут иметь вложенных вариаций.
• Свойство компонента не может быть определено одновременно во view и props на уровне одной вариации. Однако на разных уровнях это возможно и приоритет будет иметь значение свойства во view.
• Свойство view дочерней вариации переопределяет свойство view родительской вариации.

Рассмотрим правило переопределения view на небольшом примере для родительской вариации s.outer-label и для дочерней вариации s.outer-label.required-start

{
      "id": "s.outer-label",
      "parent": "s",
      "view": {
        "default": {
           "props": { 
             "labelColor": { "default": "black" }
           }
        },
        "success": {
           "props": { 
             "labelColor": { "default": "green" }
           }
        }
      }
      "props": { ... some props }
},
{
      "id": "s.outer-label.required-start",
      "parent": "s.outer-label",
      "view": {
        "success": {
           "props": { 
             "labelColor": { "default": "light-green" }
           }
        }
      }
      "props": { ... some props },
}

Здесь дочерняя вариация s.outer-label.required-start неявно наследует view родителя и переопределяет success вариацию. В итоге у s.outer-label.required-start значение view будет:

"view": {
        "default": {
           "props": { 
             "labelColor": { "default": "black" }
           }
        },
        "success": {
           "props": { 
             "labelColor": { "default": "light-green" }
           }
        }
}