compiling and eslint

Author: weaverryan

src/LiveComponent/CHANGELOG.md

@@ -29,17 +29,18 @@
     >Add Item</button>
     ```
 
-   Additionally, the `prevent` modifier (e.g. `prevent|save`) was removed. Replace
-   this with the standard Stimulus `:prevent` action option:
-
-   ```diff
-   <button
-   -    data-action="live#action
-   +    data-action="live#action:prevent"
-   -    data-action-name="prevent|save"
-   +    data-live-action-param="save"
-    >Save</button>
-   ```
+    Additionally, the `prevent` modifier (e.g. `prevent|save`) was removed. Replace
+    this with the standard Stimulus `:prevent` action option:
+
+    ```diff
+    <button
+    -    data-action="live#action
+    +    data-action="live#action:prevent"
+    -    data-action-name="prevent|save"
+    +    data-live-action-param="save"
+     >Save</button>
+    ```
+
 -   [BC BREAK] The `data-event` attribute was removed in favor of using Stimulus
     "action parameters": rename `data-event` to `data-live-event-param`. Additionally,
     if you were passing arguments to the event name, use action parameter attributes

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

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

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':
@@ -241,7 +212,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);
@@ -258,7 +229,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'));
@@ -2891,15 +2862,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();
             });
@@ -2934,7 +2908,7 @@ 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;
             }
@@ -2959,11 +2933,13 @@ class LiveControllerDefault extends Controller {
         });
     }
     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) => {
@@ -2979,7 +2955,7 @@ class LiveControllerDefault extends Controller {
             });
             emits.push({
                 name: directive.action,
-                data: directive.named,
+                data: eventArgs,
                 nameMatch,
             });
         });

src/LiveComponent/assets/src/live_controller.ts

@@ -156,7 +156,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
@@ -247,8 +251,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