Add language support for incomplete filter parameters

We want to add autocomplete behavior for the case where a developer is
typing out a liquid statement but isn't finished yet:

```liquid
{{ product | image_url: █
```

The scenario above works without any extra code but if we were to do:

```liquid
{{ product | image_url: width: 100, h█
```

Our parser would blow up because this isn't valid liquid anymore. It
interprets the `h` as a positional argument which cannot come after a
named argument. To support this we need to override how the grammar for
liquid filters is defined in the Placeholder scenario to support this.
The changes will treat the `h` as a `LiquidVariableOutput` and include
proper hierarchy.

Author: graygilmore

.changeset/pretty-maps-fix.md

@@ -0,0 +1,15 @@
+---
+'@shopify/liquid-html-parser': patch
+---
+
+Add support for incomplete filter statements
+
+Adds the ability to continue to parse liquid code that would otherwise be
+considered invalid:
+
+```liquid
+{{ product | image_url: width: 100, c█ }}
+```
+
+The above liquid statement will now successfully parse in all placeholder modes
+so that we can offer completion options for filter parameters.

packages/liquid-html-parser/grammar/liquid-html.ohm

@@ -264,6 +264,11 @@ Liquid <: Helpers {
   positionalArgument<delim> = liquidExpression<delim> ~(space* ":")
   namedArgument<delim> = variableSegment space* ":" space* liquidExpression<delim>
   tagArguments = listOf<namedArgument<delimTag>, argumentSeparatorOptionalComma>
+  filterArguments<delim> =
+    | complexArguments<delim>
+    | simpleArgument<delim>
+  complexArguments<delim> = arguments<delim> (space* "," space* simpleArgument<delim>)?
+  simpleArgument<delim> = liquidVariableLookup<delim>
 
   variableSegment = (letter | "_") (~endOfTagName identifierCharacter)*
   variableSegmentAsLookup = variableSegment
@@ -495,18 +500,21 @@ StrictLiquidHTML <: LiquidHTML {
 }
 
 WithPlaceholderLiquid <: Liquid {
+  liquidFilter<delim> := space* "|" space* identifier (space* ":" space* filterArguments<delim> (space* ",")?)?
   liquidTagName := (letter | "█") (alnum | "_")*
-  variableSegment := (letter | "_" | "█") identifierCharacter*
+  variableSegment := (letter | "_" | "█") (identifierCharacter | "█")*
 }
 
 WithPlaceholderLiquidStatement <: LiquidStatement {
+  liquidFilter<delim> := space* "|" space* identifier (space* ":" space* filterArguments<delim> (space* ",")?)?
   liquidTagName := (letter | "█") (alnum | "_")*
-  variableSegment := (letter | "_" | "█") identifierCharacter*
+  variableSegment := (letter | "_" | "█") (identifierCharacter | "█")*
 }
 
 WithPlaceholderLiquidHTML <: LiquidHTML {
+  liquidFilter<delim> := space* "|" space* identifier (space* ":" space* filterArguments<delim> (space* ",")?)?
   liquidTagName := (letter | "█") (alnum | "_")*
-  variableSegment := (letter | "_" | "█") identifierCharacter*
+  variableSegment := (letter | "_" | "█") (identifierCharacter | "█")*
   leadingTagNameTextNode := (letter | "█") (alnum | "-" | ":" | "█")*
   trailingTagNameTextNode := (alnum | "-" | ":" | "█")+
 }

packages/liquid-html-parser/src/stage-1-cst.spec.ts

@@ -1383,6 +1383,16 @@ describe('Unit: Stage 1 (CST)', () => {
       expectPath(cst, '0.markup.filters.0.args.1.value.type').to.eql('VariableLookup');
       expectPath(cst, '0.markup.filters.0.args.1.value.name').to.eql('█');
     });
+
+    it('should parse incomplete parameters for filters', () => {
+      const toCST = (source: string) => toLiquidHtmlCST(source, { mode: 'completion' });
+
+      cst = toCST(`{{ a[1].foo | image_url: 200, width: 100, h█ }}`);
+
+      expectPath(cst, '0.markup.filters.0.args.0.type').to.equal('Number');
+      expectPath(cst, '0.markup.filters.0.args.1.type').to.equal('NamedArgument');
+      expectPath(cst, '0.markup.filters.0.args.2.type').to.equal('VariableLookup');
+    });
   });
 
   function makeExpectPath(message: string) {

packages/liquid-html-parser/src/stage-1-cst.ts

@@ -860,7 +860,18 @@ function toCST<T>(
         }
       },
     },
+    filterArguments: 0,
     arguments: 0,
+    complexArguments: function (completeParams, _space1, _comma, _space2, incompleteParam) {
+      const self = this as any;
+
+      return completeParams
+        .toAST(self.args.mapping)
+        .concat(
+          incompleteParam.sourceString === '' ? [] : incompleteParam.toAST(self.args.mapping),
+        );
+    },
+    simpleArgument: 0,
     tagArguments: 0,
     positionalArgument: 0,
     namedArgument: {