export default {
    props: {
        title: null,
        subTitle: null,
        largeTitle: {
            type: Boolean,
            default: false
        },
        flex: {
            type: Boolean,
            default: true
        },
        weight: {
          type: Number
        },
        direction: {
            type: String,
            default: 'column'
        },
        position: {
            type: Object
        },
        zIndex: {
            type: [Number, String]
        },
        padding: {
            type: Boolean,
            default: false
        }
    },
    computed: {
        commonBodyClasses () {
            const classes = [];

            if (this.padding) {
                classes.push('content-padding');
            }
            return classes;
        },
        borderBoxBodyStyles () {
            const styles = {};

            if (this.flex) {
                styles.display = 'flex';
                if (this.direction) {
                    styles['flex-direction'] = this.direction;
                }
            }
            return styles;
        },
        borderBoxClasses() {
          const classes = [];

          if (this.largeTitle) {
              classes.push('large-title');
          }
          return classes;
        },
        computedTitle () {
            if (this.title === null || this.title === undefined) {
                return null;
            }
            if (typeof this.title === 'string') {
                return this.title;
            }
            return this.title.value;
        },
        computedTitleAlignment () {
            if (!this.title) {
                return null;
            }
            if (typeof this.title === 'object') {
                return 'dv-border-box-title-' + this.title.align;
            }
        }
    }
}
