export default {
    props: {
        flex: {
            type: Boolean,
            default: false
        },
        direction: {
            type: String,
            default: 'column'
        },
        position: {
            type: Object
        },
        zIndex: {
            type: [Number, String]
        },
        width: {
            type: [Number, String]
        },
        height: {
            type: [Number, String]
        },
        padding: {
            type: Boolean,
            default: false
        }
    },
    computed: {
        commonContainerClasses () {
          const classes = [];

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

            if (this.zIndex) {
                styles.zIndex = this.zIndex;
            }
            if (this.width) {
                styles.width = this.width + 'px';
            }
            if (this.height) {
                styles.height = this.height + 'px';
            }
            return styles;
        }
    }
}
