X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/a5fa74574919a491986f197d41a5f8186a45562f..refs/pull/2238/head:/resources/js/components/index.js

diff --git a/resources/js/components/index.js b/resources/js/components/index.js
index 1cea8949e..a0269ea61 100644
--- a/resources/js/components/index.js
+++ b/resources/js/components/index.js
@@ -40,6 +40,14 @@ function initComponent(name, element) {
         instance.$refs = allRefs.refs;
         instance.$manyRefs = allRefs.manyRefs;
         instance.$opts = parseOpts(name, element);
+        instance.$emit = (eventName, data = {}) => {
+            data.from = instance;
+            const event = new CustomEvent(`${name}-${eventName}`, {
+                bubbles: true,
+                detail: data
+            });
+            instance.$el.dispatchEvent(event);
+        };
         if (typeof instance.setup === 'function') {
             instance.setup();
         }
@@ -70,13 +78,20 @@ function initComponent(name, element) {
 function parseRefs(name, element) {
     const refs = {};
     const manyRefs = {};
+
     const prefix = `${name}@`
-    const refElems = element.querySelectorAll(`[refs*="${prefix}"]`);
+    const selector = `[refs*="${prefix}"]`;
+    const refElems = [...element.querySelectorAll(selector)];
+    if (element.matches(selector)) {
+        refElems.push(element);
+    }
+
     for (const el of refElems) {
         const refNames = el.getAttribute('refs')
             .split(' ')
             .filter(str => str.startsWith(prefix))
-            .map(str => str.replace(prefix, ''));
+            .map(str => str.replace(prefix, ''))
+            .map(kebabToCamel);
         for (const ref of refNames) {
             refs[ref] = el;
             if (typeof manyRefs[ref] === 'undefined') {
@@ -114,7 +129,7 @@ function parseOpts(name, element) {
 function kebabToCamel(kebab) {
     const ucFirst = (word) => word.slice(0,1).toUpperCase() + word.slice(1);
     const words = kebab.split('-');
-    return words[0] + words.slice(1).map(ucFirst).join();
+    return words[0] + words.slice(1).map(ucFirst).join('');
 }
 
 /**
@@ -151,4 +166,5 @@ export default initAll;
  * @property {Object<String, HTMLElement>} $refs
  * @property {Object<String, HTMLElement[]>} $manyRefs
  * @property {Object<String, String>} $opts
+ * @property {function(string, Object)} $emit
  */
\ No newline at end of file