Fixed #1040 - Remove mitt

package.json

@@ -48,7 +48,6 @@
     "gulp-rename": "^1.2.2",
     "gulp-uglify": "^1.5.3",
     "gulp-uglifycss": "^1.0.6",
-    "mitt": "^2.1.0",
     "node-sass": "^4.12.0",
     "primeflex": "2.0.0",
     "primeicons": "4.1.0",

src/App.vue

@@ -35,7 +35,7 @@ import AppTopBar from '@/AppTopBar.vue';
 import AppMenu from '@/AppMenu.vue';
 import AppFooter from '@/AppFooter.vue';
 import AppConfigurator from '@/AppConfigurator.vue';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     data() {

src/AppConfigurator.vue

@@ -350,7 +350,7 @@
 </template>
 
 <script>
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     props: {

src/AppEventBus.js

@@ -0,0 +1,3 @@
+import {EventBus} from 'primevue/utils';
+
+export default EventBus();

src/EventBus.js

@@ -1,3 +0,0 @@
-import mitt from 'mitt';
-const EventBus = mitt();
-export default EventBus;

src/components/confirmationeventbus/ConfirmationEventBus.js

@@ -1,4 +1,3 @@
-import mitt from 'mitt';
+import {EventBus} from 'primevue/utils';
-const EventBus = mitt();
 
-export default EventBus;
+export default EventBus();

src/components/terminalservice/TerminalService.js

@@ -1,4 +1,3 @@
-import mitt from 'mitt';
+import {EventBus} from 'primevue/utils';
-const TerminalService = mitt();
 
-export default TerminalService;
+export default EventBus();

src/components/toasteventbus/ToastEventBus.js

@@ -1,4 +1,3 @@
-import mitt from 'mitt';
+import {EventBus} from 'primevue/utils';
-const EventBus = mitt();
 
-export default EventBus;
+export default EventBus();

src/components/utils/EventBus.js

@@ -0,0 +1,25 @@
+export default function handler() {
+    let eventTarget = document.body.appendChild(document.createComment(''));
+    let eventListener, eventKey;
+
+    return {
+        on(type, listener, key) {
+            eventKey = key;
+            eventListener = function(e) { listener(e.detail); };
+            eventTarget.addEventListener(type, eventListener);
+        },
+        once(type, listener, key) {
+            eventKey = key;
+            eventListener = function(e) { listener(e.detail); };
+            eventTarget.addEventListener(type, eventListener, { once: true });
+        },
+        off(type, key) {
+            if (eventListener && eventKey === key) {
+                eventTarget.removeEventListener(type, eventListener);
+            }
+        },
+        emit(type, detail) {
+            eventTarget.dispatchEvent(new CustomEvent(type, { detail }));
+        }
+    }
+}

src/components/utils/Utils.js

@@ -2,5 +2,6 @@ import ConnectedOverlayScrollHandler from './ConnectedOverlayScrollHandler';
 import DomHandler from './DomHandler';
 import ObjectUtils from './ObjectUtils';
 import UniqueComponentId from './UniqueComponentId';
+import EventBus from './EventBus';
 
-export {ConnectedOverlayScrollHandler,DomHandler,ObjectUtils,UniqueComponentId};
+export {ConnectedOverlayScrollHandler,DomHandler,ObjectUtils,UniqueComponentId,EventBus};

src/views/Home.vue

@@ -223,7 +223,7 @@
 </template>
 
 <script>
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     data() {

src/views/chart/BarChartDemo.vue

@@ -35,7 +35,7 @@
 
 <script>
 import BarChartDoc from './BarChartDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     mounted() {

src/views/chart/ComboChartDemo.vue

@@ -19,7 +19,7 @@
 
 <script>
 import ComboChartDoc from './ComboChartDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
      mounted() {

src/views/chart/DoughnutChartDemo.vue

@@ -19,7 +19,7 @@
 
 <script>
 import DoughnutChartDoc from './DoughnutChartDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     mounted() {

src/views/chart/LineChartDemo.vue

@@ -30,7 +30,7 @@
 
 <script>
 import LineChartDoc from './LineChartDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     mounted() {

src/views/chart/PieChartDemo.vue

@@ -19,7 +19,7 @@
 
 <script>
 import PieChartDoc from './PieChartDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     mounted() {

src/views/chart/PolarAreaChartDemo.vue

@@ -19,7 +19,7 @@
 
 <script>
 import PolarAreaChartDoc from './PolarAreaChartDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     mounted() {

src/views/chart/RadarChartDemo.vue

@@ -19,7 +19,7 @@
 
 <script>
 import RadarChartDoc from './RadarChartDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     mounted() {

src/views/confirmdialog/ConfirmDialogDoc.vue

@@ -2,13 +2,6 @@
 	<div class="content-section documentation">
 		<TabView>
 			<TabPanel header="Documentation">
-                <h5>Mitt EventBus</h5>
-                <p>ConfirmDialog requires <a href="https://www.npmjs.com/package/mitt">Mitt</a>, a tiny 200b EventBus implementation.</p>
-<pre v-code><code>
-npm install mitt --save
-
-</code></pre>
-
                 <h5>ConfirmationService</h5>
                 <p>ConfirmDialog is controlled via the <i>ConfirmationService</i> that needs to be installed globally before the application
                     instance is created.</p>
@@ -247,7 +240,7 @@ export default {
 				</div>
 
 				<h5>Dependencies</h5>
-				<p>Mitt.</p>
+				<p>None.</p>
 			</TabPanel>
 
 			<TabPanel header="Source">

src/views/confirmpopup/ConfirmPopupDoc.vue

@@ -2,13 +2,6 @@
 	<div class="content-section documentation">
 		<TabView>
 			<TabPanel header="Documentation">
-                <h5>Mitt EventBus</h5>
-                <p>ConfirmPopup requires <a href="https://www.npmjs.com/package/mitt">Mitt</a>, a tiny 200b EventBus implementation.</p>
-<pre v-code><code>
-npm install mitt --save
-
-</code></pre>
-
                 <h5>ConfirmationService</h5>
                 <p>ConfirmPopup is controlled via the <i>ConfirmationService</i> that needs to be installed globally before the application
                     instance is created.</p>
@@ -247,7 +240,7 @@ export default {
 				</div>
 
 				<h5>Dependencies</h5>
-				<p>Mitt.</p>
+				<p>None.</p>
 			</TabPanel>
 
 			<TabPanel header="Source">

src/views/liveeditor/LiveEditor.vue

@@ -223,9 +223,7 @@ export const router = createRouter({
                 })
             }
 
-            if(this.toastService) {
+            if(this.toastService) {      
-                extDependencies['mitt'] = "^2.1.0";
-                        
                 imports += `import Toast from "primevue/toast";
 import ToastService from "primevue/toastservice";
 `;
@@ -242,10 +240,6 @@ import ToastService from "primevue/toastservice";
 `;
             }
 
-            if(this.terminalService) {
-                extDependencies['mitt'] = "^2.1.0";
-            }
-
             if(name !== 'ToastDemo' && name !== 'TooltipDemo' && name !== 'RippleDemo' && name !== 'FloatLabelDemo' && name !== 'InputGroupDemo' && name !== 'InvalidDemo' && name !== 'FormLayoutDemo') {
                 element += `app.component("${name.slice(0, -4)}", ${name.slice(0, -4)});`;
             }

src/views/setup/Setup.vue

@@ -148,10 +148,6 @@ dependencies: {
                             <td>PrimeFlex</td>
                             <td>DataView</td>
                         </tr>
-                        <tr>
-                            <td>Toast and Terminal</td>
-                            <td>Mitt</td>
-                        </tr>
                     </tbody>
                 </table>
             </div>

src/views/tabview/TabViewDemo.vue

@@ -128,7 +128,7 @@
 
 <script>
 import TabViewDoc from './TabViewDoc';
-import EventBus from '@/EventBus';
+import EventBus from '@/AppEventBus';
 
 export default {
     data() {

src/views/terminal/TerminalDoc.vue

@@ -2,13 +2,6 @@
 	<div class="content-section documentation">
 		<TabView>
 			<TabPanel header="Documentation">
-                <h5>Mitt EventBus</h5>
-                <p>Terminal requires <a href="https://www.npmjs.com/package/mitt">Mitt</a>, a tiny 200b EventBus implementation.</p>
-<pre v-code><code>
-npm install mitt --save
-
-</code></pre>
-
 				<h5>Import</h5>
 <pre v-code.script><code>
 import Terminal from 'primevue/terminal';
@@ -130,7 +123,7 @@ export default {
 				</div>
 
 				<h5>Dependencies</h5>
-				<p>Mitt.</p>
+				<p>None.</p>
 			</TabPanel>
 
 			<TabPanel header="Source">

src/views/toast/ToastDoc.vue

@@ -2,13 +2,6 @@
 	<div class="content-section documentation">
 		<TabView>
 			<TabPanel header="Documentation">
-                <h5>Mitt EventBus</h5>
-                <p>Toast requires <a href="https://www.npmjs.com/package/mitt">Mitt</a>, a tiny 200b EventBus implementation.</p>
-<pre v-code><code>
-npm install mitt --save
-
-</code></pre>
-
                 <h5>ToastService</h5>
                 <p>Toast messages are dynamically created using a <i>ToastService</i> that needs to be installed globally before the application
                     instance is created.</p>
@@ -270,7 +263,7 @@ this.$toast.add({severity:'success', summary: 'Specific Message', group: 'mykey'
 				</div>
 
 				<h5>Dependencies</h5>
-				<p>Mitt.</p>
+				<p>None.</p>
 			</TabPanel>
 
 			<TabPanel header="Source">