<script setup lang="ts">
interface IProps {
    caption?: string;
    name: string;
    iconClass?: string;
    imgPath?: string;
    showCaption?: boolean;
    labelCssName?: string;
    labelPos?: string | 'LEFT' | 'TOP' | 'RIGHT' | 'BOTTOM' | 'NONE';
    visible: boolean;
}
const props = withDefaults(defineProps<IProps>(), {
    showCaption: true
});
</script>

<template>
    <AppCol :visible="visible" noRoot :layoutOpts="layoutOpts">
        <template #default="{ slotClass, slotStyle }">
            <div :class="slotClass" :style="slotStyle">
                <div class="panel-field__label">
                    <span v-if="showCaption" :class="['text', labelCssName]">{{caption}}</span>
                </div>
                <slot name="editor"></slot>
            </div>
        </template>
    </AppCol>  
</template>