Использование md-чипов в формах с другими входами

Question

Я пытаюсь использовать md-чипы вместе с другими входами в форме, которые находятся внутри md-input-container.

Мне пришлось добавить свои собственные хаки css, чтобы получить заполнитель текста ввода, а также применить отступы и поля, чтобы он выглядел как можно ближе к входу внутри контейнера md-input-container.

Я знаю, что не могу заставить md-chips работать внутри md-input-container (пока не думаю, что он поддерживается)

Вот как у меня есть ввод, после чего появляется md-chips:

<div layout="row">
    <md-input-container flex>
        <label translate>Name</label>
        <input ng-model="ctrl.name">
    </md-input-container>
    <div class="chips-container" flex>
        <md-chips ng-model="ctrl.fruitNames">
            <md-chip-template>
                <span><strong>{{$chip}}</strong></span>
            </md-chip-template>
            <input type="text" placeholder="Enter Something">
            <button md-chip-remove class="chip">
                <md-icon class="material-icons">clear</md-icon>
            </button>
        </md-chips>
    </div>
</div>

Рабочий Codepen

Кто-нибудь сталкивался с подобной ситуацией, когда необходимо получить md-чипы с корректным выравниванием входов наряду с другими входами в подобных макетах?

Просто в поисках подходящих решений я не вижу примеров комбинации на входных демонстрациях Angular Material.

Спасибо