<AppPanelTabPage
  name="{{item.name}}"
  caption="{{item.caption}}"
  tabClass="app-panel-tabpage app-panel-tabpage__{{lowerCase item.name}}{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
  key="{{item.name}}"
  :visible="state.detailsModel.{{item.name}}.visible"
  :layoutOpts="{{> @macro/front-end/common/layoutPos.hbs layout=item.psLayout layoutPos=item.psLayoutPos}}"
{{#if (or item.width item.height)}}
  style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
{{/if}}
{{#if item.labelPSSysCss}}
  labelCssName="{{item.labelPSSysCss.cssName}}"
{{/if}}
  :showCaption="{{item.showCaption}}">
  <template #tab>
    <AppIconText {{#if item.labelPSSysCss}}class="{{item.labelPSSysCss.cssName}}" {{/if}}{{#if item.psSysImage}}{{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}" {{/if}}{{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}" {{/if}}{{/if}}text="{{item.caption}}"/>
  </template>  
{{#if item.psPanelItems}}
  {{#each item.psPanelItems as | childItem |}}
	{{> @macro/front-end/widgets/panel-detail/include-panel.hbs item=childItem type=childItem.itemType}}
  {{/each}}
{{/if}}
</AppPanelTabPage>
