<template>
  <div class="input-group">
    <slot/>
  </div>
</template>

<script>
export default {
  name: "input-group"
}
</script>

<style scoped>
.input-group {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;
}

.input-group >>> :first-child {
  display: flex;
  flex-grow: 1;
}

.input-group >>> .button-input {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.input-group >>> .button-input:not(:last-child) {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
</style>