<template>
  <div
    :class="[{
      [`mm-input-group-compact`]: compact,
    }, themeClasses]"
    class="mm-input-group">
    <slot></slot>
  </div>
</template>

<script>
import themeSize from "../../mixins/theme-size"

import config from "../../managers/config"

config.defaults({
  "InputGroup.composition": false,
})

export default {
  name: "mm-input-group",
  mixins: [themeSize],
  provide() {
    return {
      "mm-input-group": this,
    }
  },
  props: {
    compact: {
      type: Boolean,
      default: () => config.get("InputGroup.composition"),
    },
  },
}
</script>
