{{#eq item.psLayoutPos 'FLEX'}}
<div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
  <AppFormDruipart 
    v-show="state.detailsModel.{{item.codeName}}.visible" 
    {{#if item.psSysCss}}class="{{item.psSysCss.cssName}}"{{/if}}
    style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}"
    name="{{item.codeName}}" 
    title="{{item.caption}}" 
    :context="context"
    :viewParams="viewParams"
    :data="state.data"
    :viewSubject="state.viewSubject"
    v-slot="druipartParams">
    <{{item.psAppView.codeName}}
      :class="['app-view-layout--from-druipart']"
      :context="druipartParams.context"
      :viewParams="druipartParams.viewParams"
      :viewDefaultUsage="false"
      :noViewCaption="true"
      @viewEvent="druipartParams.viewEvent"
    >
    </{{item.psAppView.codeName}}>
  </AppFormDruipart>
</div>
{{else}}
<a-col
{{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
  <AppFormDruipart 
    v-show="state.detailsModel.{{item.codeName}}.visible" 
    {{#if item.psSysCss}}class="{{item.psSysCss.cssName}}"{{/if}}
    style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px{{/if}}"
    name="{{item.codeName}}" 
    title="{{item.caption}}" 
    :context="context"
    :viewParams="viewParams"
    :data="state.data"
    :viewSubject="state.viewSubject"
    v-slot="druipartParams">
    <{{item.psAppView.codeName}}
      :class="['app-view-layout--from-druipart']"
      :context="druipartParams.context"
      :viewParams="druipartParams.viewParams"
      :viewDefaultUsage="false"
      :noViewCaption="true"
      @viewEvent="druipartParams.viewEvent"
    >
    </{{item.psAppView.codeName}}>
  </AppFormDruipart>
</a-col>
{{/eq}}