compiling and eslint

Author: weaverryan

src/LiveComponent/CHANGELOG.md

@@ -29,8 +29,8 @@
     >Add Item</button>
     ```
 
-   Additionally, the `prevent` modifier (e.g. `prevent|save`) was removed. Replace
-   this with the standard Stimulus `:prevent` action option:
+    Additionally, the `prevent` modifier (e.g. `prevent|save`) was removed. Replace
+    this with the standard Stimulus `:prevent` action option:
 
    ```diff
    <button

src/LiveComponent/assets/dist/Directive/directives_parser.d.ts

@@ -5,7 +5,6 @@ export interface DirectiveModifier {
 export interface Directive {
     action: string;
     args: string[];
-    named: any;
     modifiers: DirectiveModifier[];
     getString: {
         (): string;

src/LiveComponent/assets/dist/live_controller.d.ts

@@ -95,10 +95,10 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
     disconnect(): void;
     update(event: any): void;
     action(event: any): void;
-    emit(event: Event): void;
-    emitUp(event: Event): void;
-    emitSelf(event: Event): void;
     $render(): Promise<import("./Backend/BackendResponse").default>;
+    emit(event: any): void;
+    emitUp(event: any): void;
+    emitSelf(event: any): void;
     $updateModel(model: string, value: any, shouldRender?: boolean, debounce?: number | boolean): Promise<import("./Backend/BackendResponse").default>;
     propsUpdatedFromParentValueChanged(): void;
     fingerprintValueChanged(): void;

src/LiveComponent/assets/dist/live_controller.js

@@ -6,10 +6,8 @@ function parseDirectives(content) {
         return directives;
     }
     let currentActionName = '';
-    let currentArgumentName = '';
     let currentArgumentValue = '';
     let currentArguments = [];
-    let currentNamedArguments = {};
     let currentModifiers = [];
     let state = 'action';
     const getLastActionName = function () {
@@ -25,52 +23,30 @@ function parseDirectives(content) {
         directives.push({
             action: currentActionName,
             args: currentArguments,
-            named: currentNamedArguments,
             modifiers: currentModifiers,
             getString: () => {
                 return content;
             }
         });
         currentActionName = '';
-        currentArgumentName = '';
         currentArgumentValue = '';
         currentArguments = [];
-        currentNamedArguments = {};
         currentModifiers = [];
         state = 'action';
     };
     const pushArgument = function () {
-        const mixedArgTypesError = () => {
-            throw new Error(`Normal and named arguments cannot be mixed inside "${currentActionName}()"`);
-        };
-        if (currentArgumentName) {
-            if (currentArguments.length > 0) {
-                mixedArgTypesError();
-            }
-            currentNamedArguments[currentArgumentName.trim()] = currentArgumentValue;
-        }
-        else {
-            if (Object.keys(currentNamedArguments).length > 0) {
-                mixedArgTypesError();
-            }
-            currentArguments.push(currentArgumentValue.trim());
-        }
-        currentArgumentName = '';
+        currentArguments.push(currentArgumentValue.trim());
         currentArgumentValue = '';
     };
     const pushModifier = function () {
         if (currentArguments.length > 1) {
             throw new Error(`The modifier "${currentActionName}()" does not support multiple arguments.`);
         }
-        if (Object.keys(currentNamedArguments).length > 0) {
-            throw new Error(`The modifier "${currentActionName}()" does not support named arguments.`);
-        }
         currentModifiers.push({
             name: currentActionName,
             value: currentArguments.length > 0 ? currentArguments[0] : null,
         });
         currentActionName = '';
-        currentArgumentName = '';
         currentArguments = [];
         state = 'action';
     };
@@ -104,11 +80,6 @@ function parseDirectives(content) {
                     pushArgument();
                     break;
                 }
-                if (char === '=') {
-                    currentArgumentName = currentArgumentValue;
-                    currentArgumentValue = '';
-                    break;
-                }
                 currentArgumentValue += char;
                 break;
             case 'after_arguments':
@@ -325,7 +296,7 @@ function getAllModelDirectiveFromElements(element) {
     }
     const directives = parseDirectives(element.dataset.model);
     directives.forEach((directive) => {
-        if (directive.args.length > 0 || directive.named.length > 0) {
+        if (directive.args.length > 0) {
             throw new Error(`The data-model="${element.dataset.model}" format is invalid: it does not support passing arguments to the model.`);
         }
         directive.action = normalizeModelName(directive.action);
@@ -342,7 +313,7 @@ function getModelDirectiveFromElement(element, throwOnMissing = true) {
         if (formElement && 'model' in formElement.dataset) {
             const directives = parseDirectives(formElement.dataset.model || '*');
             const directive = directives[0];
-            if (directive.args.length > 0 || directive.named.length > 0) {
+            if (directive.args.length > 0) {
                 throw new Error(`The data-model="${formElement.dataset.model}" format is invalid: it does not support passing arguments to the model.`);
             }
             directive.action = normalizeModelName(element.getAttribute('name'));
@@ -2942,15 +2913,18 @@ class LiveControllerDefault extends Controller {
         this.updateModelFromElementEvent(event.currentTarget, null);
     }
     action(event) {
-        const rawAction = event.currentTarget.dataset.actionName;
+        const params = event.params;
+        if (!params.action) {
+            throw new Error(`No action name provided on element: ${getElementAsTagText(event.currentTarget)}. Did you forget to add the "data-live-action-param" attribute?`);
+        }
+        const rawAction = params.action;
+        const actionArgs = Object.assign({}, params);
+        delete actionArgs.action;
         const directives = parseDirectives(rawAction);
         let debounce = false;
         directives.forEach((directive) => {
             let pendingFiles = {};
             const validModifiers = new Map();
-            validModifiers.set('prevent', () => {
-                event.preventDefault();
-            });
             validModifiers.set('stop', () => {
                 event.stopPropagation();
             });
@@ -2985,12 +2959,15 @@ class LiveControllerDefault extends Controller {
                 }
                 delete this.pendingFiles[key];
             }
-            this.component.action(directive.action, directive.named, debounce);
+            this.component.action(directive.action, actionArgs, debounce);
             if (getModelDirectiveFromElement(event.currentTarget, false)) {
                 this.pendingActionTriggerModelElement = event.currentTarget;
             }
         });
     }
+    $render() {
+        return this.component.render();
+    }
     emit(event) {
         this.getEmitDirectives(event).forEach(({ name, data, nameMatch }) => {
             this.component.emit(name, data, nameMatch);
@@ -3006,9 +2983,6 @@ class LiveControllerDefault extends Controller {
             this.component.emitSelf(name, data);
         });
     }
-    $render() {
-        return this.component.render();
-    }
     $updateModel(model, value, shouldRender = true, debounce = true) {
         return this.component.set(model, value, shouldRender, debounce);
     }
@@ -3019,11 +2993,13 @@ class LiveControllerDefault extends Controller {
         this.component.fingerprint = this.fingerprintValue;
     }
     getEmitDirectives(event) {
-        const element = event.currentTarget;
-        if (!element.dataset.event) {
-            throw new Error(`No data-event attribute found on element: ${getElementAsTagText(element)}`);
+        const params = event.params;
+        if (!params.event) {
+            throw new Error(`No event name provided on element: ${getElementAsTagText(event.currentTarget)}. Did you forget to add the "data-live-event-param" attribute?`);
         }
-        const eventInfo = element.dataset.event;
+        const eventInfo = params.event;
+        const eventArgs = Object.assign({}, params);
+        delete eventArgs.event;
         const directives = parseDirectives(eventInfo);
         const emits = [];
         directives.forEach((directive) => {
@@ -3039,7 +3015,7 @@ class LiveControllerDefault extends Controller {
             });
             emits.push({
                 name: directive.action,
-                data: directive.named,
+                data: eventArgs,
                 nameMatch,
             });
         });

src/LiveComponent/assets/src/live_controller.ts

@@ -120,7 +120,11 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
     action(event: any) {
         const params = event.params;
         if (!params.action) {
-            throw new Error(`No action name provided on element: ${getElementAsTagText(event.currentTarget)}. Did you forget to add the "data-live-action-param" attribute?`);
+            throw new Error(
+                `No action name provided on element: ${getElementAsTagText(
+                    event.currentTarget
+                )}. Did you forget to add the "data-live-action-param" attribute?`
+            );
         }
         const rawAction = params.action;
         // all other params are considered action arguments
@@ -231,8 +235,12 @@ export default class LiveControllerDefault extends Controller<HTMLElement> imple
 
     private getEmitDirectives(event: any): Array<{ name: string; data: any; nameMatch: string | null }> {
         const params = event.params;
-        if (!params.action) {
-            throw new Error(`No event name provided on element: ${getElementAsTagText(event.currentTarget)}. Did you forget to add the "data-live-event-param" attribute?`);
+        if (!params.event) {
+            throw new Error(
+                `No event name provided on element: ${getElementAsTagText(
+                    event.currentTarget
+                )}. Did you forget to add the "data-live-event-param" attribute?`
+            );
         }
         const eventInfo = params.event;
         // all other params are considered event arguments