first component for pushing calendar answer

src/Bundle/ChillCalendarBundle/Resources/public/module/Invite/answer.js

@@ -0,0 +1,22 @@
+
+import { createApp } from 'vue';
+import Answer from 'ChillCalendarAssets/vuejs/Invite/Answer';
+import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n';
+
+const i18n = _createI18n({});
+
+document.addEventListener('DOMContentLoaded', function (e) {
+  console.log('dom loaded answer');
+  document.querySelectorAll('div[invite-answer]').forEach(function (el) {
+    console.log('element found', el);
+
+    const app = createApp({
+      components: {
+        Answer,
+      },
+      template: '<answer :calendarId="14" :status="defined"></answer>',
+    });
+
+    app.use(i18n).mount(el);
+  });
+});

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/Invite/Answer.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="btn-group" role="group">
+    <button id="btnGroupDrop1" type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
+      {{ $t('answer')}}
+    </button>
+    <ul class="dropdown-menu" aria-labelledby="btnGroupDrop1">
+      <li><a class="dropdown-item" href="#"><i class="fa fa-check" aria-hidden="true"></i> {{ $t('accept') }}</a></li>
+      <li><a class="dropdown-item" href="#"><i class="fa fa-times" aria-hidden="true"></i> {{ $t('decline') }}</a></li>
+      <li><a class="dropdown-item" href="#"><i class="fa fa-question"></i> {{ $t('tentatively_accept') }}</a></li>
+      <li><a class="dropdown-item" href="#"><i class="fa fa-hourglass-o"></i> {{ $t('pending') }}</a></li>
+    </ul>
+  </div>
+
+</template>
+
+<script lang="ts">
+import {defineComponent} from 'vue';
+
+interface Props {
+  calendarId: number,
+  status: string
+}
+
+export default defineComponent({
+  name: "Answer",
+  props: {
+    calendarId: { type: Number, required: true},
+    status: {type: String, required: true},
+  }
+})
+
+</script>
+
+<style scoped>
+
+</style>