@vuu-ui/vuu-filters 0.0.26

package/cjs/filter-input/useCodeMirrorEditor.js

@@ -0,0 +1,136 @@
+'use strict';
+
+var vuuCodemirror = require('@vuu-ui/vuu-codemirror');
+var vuuFilterParser = require('@vuu-ui/vuu-filter-parser');
+var cx = require('clsx');
+var react = require('react');
+var FilterLanguage = require('./FilterLanguage.js');
+var highlighting = require('./highlighting.js');
+var theme = require('./theme.js');
+var useFilterAutoComplete = require('./useFilterAutoComplete.js');
+
+const getView = (ref) => {
+  if (ref.current == void 0) {
+    throw Error("EditorView not defined");
+  }
+  return ref.current;
+};
+const getOptionClass = (completion) => {
+  return cx("vuuSuggestion", {
+    vuuIllustration: completion.isIllustration
+  });
+};
+const stripName = (filterQuery) => {
+  const pos = filterQuery.lastIndexOf(" as ");
+  if (pos !== -1) {
+    return filterQuery.slice(0, pos);
+  } else {
+    return filterQuery;
+  }
+};
+const noop = () => console.log("noooop");
+const useCodeMirrorEditor = ({
+  existingFilter,
+  onSubmitFilter,
+  suggestionProvider
+}) => {
+  const editorRef = react.useRef(null);
+  const onSubmit = react.useRef(noop);
+  const viewRef = react.useRef();
+  const completionFn = useFilterAutoComplete.useAutoComplete(
+    suggestionProvider,
+    onSubmit,
+    existingFilter
+  );
+  const [createState, clearInput] = react.useMemo(() => {
+    const parseFilter = () => {
+      const view = getView(viewRef);
+      const source = view.state.doc.toString();
+      const tree = vuuCodemirror.ensureSyntaxTree(view.state, view.state.doc.length, 5e3);
+      if (tree) {
+        const filter = vuuFilterParser.walkTree(tree, source);
+        return [filter, stripName(source), filter.name];
+      } else {
+        return [void 0, "", void 0];
+      }
+    };
+    const clearInput2 = () => {
+      getView(viewRef).setState(createState2());
+    };
+    const submitFilterAndClearInput = (mode) => {
+      const [filter, filterQuery, filterName] = parseFilter();
+      onSubmitFilter?.(filter, filterQuery, mode, filterName);
+      clearInput2();
+    };
+    const submitFilter = (key) => {
+      return vuuCodemirror.keymap.of([
+        {
+          key,
+          run() {
+            submitFilterAndClearInput();
+            return true;
+          }
+        }
+      ]);
+    };
+    const showSuggestions = (key) => {
+      return vuuCodemirror.keymap.of([
+        {
+          key,
+          run() {
+            vuuCodemirror.startCompletion(getView(viewRef));
+            return true;
+          }
+        }
+      ]);
+    };
+    const createState2 = () => vuuCodemirror.EditorState.create({
+      doc: "",
+      extensions: [
+        vuuCodemirror.minimalSetup,
+        vuuCodemirror.autocompletion({
+          override: [completionFn],
+          optionClass: getOptionClass
+        }),
+        FilterLanguage.filterLanguageSupport(),
+        vuuCodemirror.keymap.of(vuuCodemirror.defaultKeymap),
+        submitFilter("Ctrl-Enter"),
+        showSuggestions("ArrowDown"),
+        vuuCodemirror.EditorView.updateListener.of((v) => {
+          const view = getView(viewRef);
+          if (v.docChanged) {
+            vuuCodemirror.startCompletion(view);
+          }
+        }),
+        vuuCodemirror.EditorState.transactionFilter.of(
+          (tr) => tr.newDoc.lines > 1 ? [] : tr
+        ),
+        theme.vuuTheme,
+        highlighting.vuuHighlighting
+      ]
+    });
+    onSubmit.current = (mode) => {
+      submitFilterAndClearInput(mode);
+      setTimeout(() => {
+        getView(viewRef).focus();
+      }, 100);
+    };
+    return [createState2, clearInput2];
+  }, [completionFn, onSubmitFilter]);
+  react.useEffect(() => {
+    if (!editorRef.current) {
+      throw Error("editor not in dom");
+    }
+    viewRef.current = new vuuCodemirror.EditorView({
+      state: createState(),
+      parent: editorRef.current
+    });
+    return () => {
+      viewRef.current?.destroy();
+    };
+  }, [completionFn, createState]);
+  return { editorRef, clearInput };
+};
+
+exports.useCodeMirrorEditor = useCodeMirrorEditor;
+//# sourceMappingURL=useCodeMirrorEditor.js.map

package/cjs/filter-input/useCodeMirrorEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCodeMirrorEditor.js","sources":["../../src/filter-input/useCodeMirrorEditor.ts"],"sourcesContent":["import {\n  autocompletion,\n  Completion,\n  defaultKeymap,\n  EditorState,\n  EditorView,\n  ensureSyntaxTree,\n  keymap,\n  minimalSetup,\n  startCompletion,\n  VuuCompletion,\n} from \"@vuu-ui/vuu-codemirror\";\nimport { walkTree } from \"@vuu-ui/vuu-filter-parser\";\nimport { Filter } from \"@vuu-ui/vuu-filter-types\";\nimport cx from \"clsx\";\nimport { MutableRefObject, useEffect, useMemo, useRef } from \"react\";\nimport { filterLanguageSupport } from \"./FilterLanguage\";\nimport { vuuHighlighting } from \"./highlighting\";\nimport { vuuTheme } from \"./theme\";\nimport {\n  ApplyCompletion,\n  FilterSubmissionMode,\n  useAutoComplete,\n} from \"./useFilterAutoComplete\";\nimport { FilterSaveOptions } from \"./useFilterSuggestionProvider\";\n\nexport type SuggestionType =\n  | \"column\"\n  | \"columnValue\"\n  | \"operator\"\n  | \"save\"\n  | \"name\";\n\nexport interface FilterSuggestionOptions {\n  quoted?: boolean;\n  columnName?: string;\n  existingFilter?: Filter;\n  filterName?: string;\n  onSubmit?: () => void;\n  operator?: string;\n  startsWith?: string;\n  selection?: string[];\n}\n\nexport type getFilterSuggestionsType = (\n  suggestionType: SuggestionType,\n  options?: FilterSuggestionOptions\n) => Promise<Completion[]>;\n\nexport interface IFilterSuggestionProvider {\n  getSuggestions: getFilterSuggestionsType;\n  isPartialMatch: (\n    valueType: SuggestionType,\n    columnName?: string,\n    text?: string | undefined\n  ) => Promise<boolean>;\n}\n\nexport interface SuggestionConsumer {\n  suggestionProvider: IFilterSuggestionProvider;\n}\n\nconst getView = (ref: MutableRefObject<EditorView | undefined>): EditorView => {\n  if (ref.current == undefined) {\n    throw Error(\"EditorView not defined\");\n  }\n  return ref.current;\n};\n\nconst getOptionClass = (completion: VuuCompletion) => {\n  return cx(\"vuuSuggestion\", {\n    vuuIllustration: completion.isIllustration,\n  });\n};\n\nconst stripName = (filterQuery: string) => {\n  const pos = filterQuery.lastIndexOf(\" as \");\n  if (pos !== -1) {\n    return filterQuery.slice(0, pos);\n  } else {\n    return filterQuery;\n  }\n};\n\nconst noop = () => console.log(\"noooop\");\n\nexport type filterSubmissionHandler = (\n  filter: Filter | undefined,\n  filterQuery: string,\n  mode?: FilterSubmissionMode,\n  filterName?: string\n) => void;\n\nexport interface CodeMirrorEditorProps {\n  existingFilter?: Filter;\n  onSubmitFilter?: filterSubmissionHandler;\n  saveOptions?: FilterSaveOptions;\n  suggestionProvider: IFilterSuggestionProvider;\n}\n\nexport const useCodeMirrorEditor = ({\n  existingFilter,\n  onSubmitFilter,\n  suggestionProvider,\n}: CodeMirrorEditorProps) => {\n  const editorRef = useRef<HTMLDivElement>(null);\n  const onSubmit = useRef<ApplyCompletion>(noop);\n  const viewRef = useRef<EditorView>();\n  const completionFn = useAutoComplete(\n    suggestionProvider,\n    onSubmit,\n    existingFilter\n  );\n\n  const [createState, clearInput] = useMemo(() => {\n    const parseFilter = ():\n      | [Filter, string, string | undefined]\n      | [undefined, \"\", undefined] => {\n      const view = getView(viewRef);\n      const source = view.state.doc.toString();\n      const tree = ensureSyntaxTree(view.state, view.state.doc.length, 5000);\n      if (tree) {\n        const filter = walkTree(tree, source) as Filter;\n        return [filter, stripName(source), filter.name];\n      } else {\n        return [undefined, \"\", undefined];\n      }\n    };\n\n    const clearInput = () => {\n      getView(viewRef).setState(createState());\n    };\n\n    const submitFilterAndClearInput = (mode?: FilterSubmissionMode) => {\n      const [filter, filterQuery, filterName] = parseFilter();\n      onSubmitFilter?.(filter, filterQuery, mode, filterName);\n      clearInput();\n    };\n\n    const submitFilter = (key: string) => {\n      return keymap.of([\n        {\n          key,\n          run() {\n            submitFilterAndClearInput();\n            return true;\n          },\n        },\n      ]);\n    };\n\n    const showSuggestions = (key: string) => {\n      return keymap.of([\n        {\n          key,\n          run() {\n            startCompletion(getView(viewRef));\n            return true;\n          },\n        },\n      ]);\n    };\n\n    const createState = (): EditorState =>\n      EditorState.create({\n        doc: \"\",\n        extensions: [\n          minimalSetup,\n          autocompletion({\n            override: [completionFn],\n            optionClass: getOptionClass,\n          }),\n          filterLanguageSupport(),\n          keymap.of(defaultKeymap),\n          submitFilter(\"Ctrl-Enter\"),\n          showSuggestions(\"ArrowDown\"),\n          EditorView.updateListener.of((v) => {\n            const view = getView(viewRef);\n            if (v.docChanged) {\n              startCompletion(view);\n            }\n          }),\n          EditorState.transactionFilter.of((tr) =>\n            tr.newDoc.lines > 1 ? [] : tr\n          ),\n          vuuTheme,\n          vuuHighlighting,\n        ],\n      });\n\n    onSubmit.current = (mode?: FilterSubmissionMode) => {\n      submitFilterAndClearInput(mode);\n      // TODO refocu sthe editor\n      setTimeout(() => {\n        getView(viewRef).focus();\n      }, 100);\n    };\n\n    return [createState, clearInput];\n  }, [completionFn, onSubmitFilter]);\n\n  useEffect(() => {\n    if (!editorRef.current) {\n      throw Error(\"editor not in dom\");\n    }\n\n    viewRef.current = new EditorView({\n      state: createState(),\n      parent: editorRef.current,\n    });\n\n    return () => {\n      viewRef.current?.destroy();\n    };\n  }, [completionFn, createState]);\n\n  return { editorRef, clearInput };\n};\n"],"names":["useRef","useAutoComplete","useMemo","ensureSyntaxTree","walkTree","clearInput","createState","keymap","startCompletion","EditorState","minimalSetup","autocompletion","filterLanguageSupport","defaultKeymap","EditorView","vuuTheme","vuuHighlighting","useEffect"],"mappings":"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"}

package/cjs/filter-input/useFilterAutoComplete.js

@@ -0,0 +1,243 @@
+'use strict';
+
+var vuuCodemirror = require('@vuu-ui/vuu-codemirror');
+var react = require('react');
+
+const getOperator = (node, state) => {
+  let maybeColumnNode = node.prevSibling || node.parent;
+  while (maybeColumnNode && !["Column", "Operator", "In"].includes(maybeColumnNode.name)) {
+    maybeColumnNode = maybeColumnNode.prevSibling || maybeColumnNode.parent;
+  }
+  if (maybeColumnNode?.name === "In" || maybeColumnNode?.name === "Operator") {
+    return vuuCodemirror.getValue(maybeColumnNode, state);
+  } else {
+    return void 0;
+  }
+};
+const getPartialOperator = (maybeOperatorNode, state, columnName) => {
+  const value = vuuCodemirror.getValue(maybeOperatorNode, state);
+  if (columnName === void 0 || value === columnName) {
+    return;
+  }
+  if (["contains", "ends", "starts"].some(
+    (val) => val.startsWith(value.toLowerCase())
+  )) {
+    return value;
+  } else {
+    return void 0;
+  }
+};
+const getClauseOperator = (node, state) => {
+  let maybeTargetNode = node.prevSibling || node.parent || node.lastChild;
+  while (maybeTargetNode && maybeTargetNode.name === "\u26A0")
+    maybeTargetNode = maybeTargetNode.prevSibling;
+  if (maybeTargetNode && ["As", "Or", "And"].includes(maybeTargetNode.name)) {
+    return vuuCodemirror.getValue(maybeTargetNode, state);
+  } else {
+    return void 0;
+  }
+};
+const getFilterName = (node, state) => {
+  if (node.name === "FilterName") {
+    return vuuCodemirror.getValue(node, state);
+  } else {
+    let maybeTargetNode = node.prevSibling || node.parent || node.lastChild;
+    while (maybeTargetNode && maybeTargetNode.name !== "FilterName")
+      maybeTargetNode = maybeTargetNode.prevSibling;
+    if (maybeTargetNode && maybeTargetNode.name === "FilterName") {
+      return vuuCodemirror.getValue(node, state);
+    }
+  }
+};
+const getColumnName = (node, state) => {
+  const prevNode = node.prevSibling;
+  if (prevNode?.name === "Column") {
+    return vuuCodemirror.getValue(prevNode, state);
+  } else if (prevNode?.name === "Operator") {
+    return getColumnName(prevNode, state);
+  }
+};
+const getSetValues = (node, state) => {
+  let maybeTargetNode = node.lastChild;
+  const values = [];
+  while (maybeTargetNode && maybeTargetNode.name !== "In") {
+    const value = vuuCodemirror.getValue(maybeTargetNode, state);
+    if (value) {
+      values.push(value);
+    } else {
+      break;
+    }
+    maybeTargetNode = maybeTargetNode.prevSibling;
+  }
+  return values;
+};
+const useAutoComplete = (suggestionProvider, onSubmit, existingFilter) => {
+  const makeSuggestions = react.useCallback(
+    async (context, suggestionType, optionalArgs = {}) => {
+      const { startsWith = "" } = optionalArgs;
+      const options = await suggestionProvider.getSuggestions(
+        suggestionType,
+        optionalArgs
+      );
+      return { from: context.pos - startsWith.length, options };
+    },
+    [suggestionProvider]
+  );
+  return react.useCallback(
+    async (context) => {
+      const { state, pos } = context;
+      const word = context.matchBefore(/\w*/) ?? {
+        from: 0,
+        to: 0,
+        text: void 0
+      };
+      const tree = vuuCodemirror.syntaxTree(state);
+      const nodeBefore = tree.resolveInner(pos, -1);
+      console.log({ nodeBeforeName: nodeBefore.name });
+      switch (nodeBefore.name) {
+        case "Filter":
+          if (context.pos === 0) {
+            return makeSuggestions(context, "column");
+          } else {
+            const clauseOperator = getClauseOperator(nodeBefore, state);
+            if (clauseOperator === "as") {
+              return makeSuggestions(context, "name");
+            } else {
+              const filterName = getFilterName(nodeBefore, state);
+              return makeSuggestions(context, "save", {
+                onSubmit: onSubmit.current,
+                existingFilter,
+                filterName
+              });
+            }
+          }
+        case "String":
+          {
+            const operator = getOperator(nodeBefore, state);
+            const columnName = getColumnName(nodeBefore, state);
+            const { from, to } = nodeBefore;
+            if (to - from === 2 && context.pos === from + 1) {
+              if (columnName && operator) {
+                return makeSuggestions(context, "columnValue", {
+                  columnName,
+                  operator,
+                  quoted: true,
+                  startsWith: word.text
+                });
+              }
+            } else {
+              console.log(
+                `we have a string, column is ${columnName} ${from} ${to}`
+              );
+            }
+          }
+          break;
+        case "As":
+          return makeSuggestions(context, "name");
+        case "FilterName":
+          return makeSuggestions(context, "save", {
+            onSubmit: onSubmit.current,
+            existingFilter,
+            filterName: getFilterName(nodeBefore, state)
+          });
+        case "Column": {
+          const columnName = vuuCodemirror.getValue(nodeBefore, state);
+          const isPartialMatch = await suggestionProvider.isPartialMatch(
+            "column",
+            void 0,
+            columnName
+          );
+          if (isPartialMatch) {
+            return makeSuggestions(context, "column", {
+              startsWith: columnName
+            });
+          } else {
+            return makeSuggestions(context, "operator", { columnName });
+          }
+        }
+        case "\u26A0": {
+          const columnName = vuuCodemirror.getNodeByName(nodeBefore, state);
+          const operator = getOperator(nodeBefore, state);
+          const partialOperator = operator ? void 0 : getPartialOperator(nodeBefore, state, columnName);
+          if (partialOperator) {
+            return makeSuggestions(context, "operator", {
+              columnName,
+              startsWith: partialOperator
+            });
+          } else {
+            return makeSuggestions(context, "columnValue", {
+              columnName,
+              operator,
+              startsWith: word.text
+            });
+          }
+        }
+        case "Identifier":
+          {
+            const clauseOperator = getClauseOperator(nodeBefore, state);
+            if (clauseOperator === "as") {
+              return {
+                from: context.pos,
+                options: [
+                  {
+                    label: "press ENTER to apply filter and save",
+                    apply: () => onSubmit.current(),
+                    boost: 5
+                  }
+                ]
+              };
+            }
+          }
+          break;
+        case "ColumnSetExpression":
+        case "Values": {
+          const columnName = vuuCodemirror.getNodeByName(nodeBefore, state);
+          const selection = getSetValues(nodeBefore, state);
+          return makeSuggestions(context, "columnValue", {
+            columnName,
+            selection
+          });
+        }
+        case "Comma":
+        case "LBrack": {
+          const columnName = vuuCodemirror.getNodeByName(nodeBefore, state);
+          return makeSuggestions(context, "columnValue", { columnName });
+        }
+        case "ColumnValueExpression":
+          {
+            const lastToken = nodeBefore.lastChild?.prevSibling;
+            if (lastToken?.name === "Column") {
+              return makeSuggestions(context, "operator", {
+                columnName: vuuCodemirror.getNodeByName(nodeBefore, state)
+              });
+            } else if (lastToken?.name === "Operator") {
+              return makeSuggestions(context, "columnValue", {
+                columnName: vuuCodemirror.getNodeByName(lastToken, state),
+                operator: vuuCodemirror.getValue(lastToken, state)
+              });
+            }
+          }
+          break;
+        case "In": {
+          return {
+            from: context.pos,
+            options: [{ label: "[", apply: " [", type: "text" }]
+          };
+        }
+        case "Eq": {
+          return makeSuggestions(context, "columnValue", {
+            columnName: vuuCodemirror.getNodeByName(nodeBefore, state)
+          });
+        }
+        case "AndExpression":
+        case "OrExpression": {
+          return makeSuggestions(context, "column");
+        }
+      }
+    },
+    [existingFilter, makeSuggestions, onSubmit, suggestionProvider]
+  );
+};
+
+exports.useAutoComplete = useAutoComplete;
+//# sourceMappingURL=useFilterAutoComplete.js.map

package/cjs/filter-input/useFilterAutoComplete.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFilterAutoComplete.js","sources":["../../src/filter-input/useFilterAutoComplete.ts"],"sourcesContent":["import {\n  CompletionContext,\n  CompletionSource,\n  EditorState,\n  getNodeByName,\n  getValue,\n  SyntaxNode,\n  syntaxTree,\n} from \"@vuu-ui/vuu-codemirror\";\nimport { Filter } from \"@vuu-ui/vuu-filter-types\";\nimport { MutableRefObject, useCallback } from \"react\";\nimport {\n  IFilterSuggestionProvider,\n  SuggestionType,\n} from \"./useCodeMirrorEditor\";\n\nexport type FilterSubmissionMode = \"and\" | \"or\" | \"replace\" | \"tab\";\n\nexport type ApplyCompletion = (mode?: FilterSubmissionMode) => void;\n\nconst getOperator = (node: SyntaxNode, state: EditorState) => {\n  let maybeColumnNode = node.prevSibling || node.parent;\n  while (\n    maybeColumnNode &&\n    ![\"Column\", \"Operator\", \"In\"].includes(maybeColumnNode.name)\n  ) {\n    maybeColumnNode = maybeColumnNode.prevSibling || maybeColumnNode.parent;\n  }\n  if (maybeColumnNode?.name === \"In\" || maybeColumnNode?.name === \"Operator\") {\n    return getValue(maybeColumnNode, state);\n  } else {\n    return undefined;\n  }\n};\n\n// Operators that are more than a single character in length may incur partial matches\n// TODO need to check that previous token is a column\nconst getPartialOperator = (\n  maybeOperatorNode: SyntaxNode,\n  state: EditorState,\n  columnName?: string\n) => {\n  const value = getValue(maybeOperatorNode, state);\n  if (columnName === undefined || value === columnName) {\n    return;\n  }\n  if (\n    [\"contains\", \"ends\", \"starts\"].some((val) =>\n      val.startsWith(value.toLowerCase())\n    )\n  ) {\n    return value;\n  } else {\n    return undefined;\n  }\n};\n\nconst getClauseOperator = (node: SyntaxNode, state: EditorState) => {\n  let maybeTargetNode = node.prevSibling || node.parent || node.lastChild;\n  while (maybeTargetNode && maybeTargetNode.name === \"⚠\")\n    maybeTargetNode = maybeTargetNode.prevSibling;\n  if (maybeTargetNode && [\"As\", \"Or\", \"And\"].includes(maybeTargetNode.name)) {\n    return getValue(maybeTargetNode, state);\n  } else {\n    return undefined;\n  }\n};\n\nconst getFilterName = (node: SyntaxNode, state: EditorState) => {\n  if (node.name === \"FilterName\") {\n    return getValue(node, state);\n  } else {\n    let maybeTargetNode = node.prevSibling || node.parent || node.lastChild;\n    while (maybeTargetNode && maybeTargetNode.name !== \"FilterName\")\n      maybeTargetNode = maybeTargetNode.prevSibling;\n    if (maybeTargetNode && maybeTargetNode.name === \"FilterName\") {\n      return getValue(node, state);\n    }\n  }\n};\n\nconst getColumnName = (\n  node: SyntaxNode,\n  state: EditorState\n): string | undefined => {\n  const prevNode = node.prevSibling;\n  if (prevNode?.name === \"Column\") {\n    return getValue(prevNode, state);\n  } else if (prevNode?.name === \"Operator\") {\n    return getColumnName(prevNode, state);\n  }\n};\n\nconst getSetValues = (node: SyntaxNode, state: EditorState): string[] => {\n  let maybeTargetNode = node.lastChild;\n  const values: string[] = [];\n  while (maybeTargetNode && maybeTargetNode.name !== \"In\") {\n    const value = getValue(maybeTargetNode, state);\n    if (value) {\n      values.push(value);\n    } else {\n      break;\n    }\n    maybeTargetNode = maybeTargetNode.prevSibling;\n  }\n  return values;\n};\nexport const FilterlNamedTerms: readonly string[] = [\n  \"Filter\",\n  \"ParenthesizedExpression\",\n  \"AndExpression\",\n  \"OrExpression\",\n  \"ColumnValueExpression\",\n  \"ColumnSetExpression\",\n  \"FilterName\",\n  \"Column\",\n  \"Operator\",\n  \"Values\",\n  \"Number\",\n  \"String\",\n];\nexport const lastNamedChild = (node: SyntaxNode): SyntaxNode | null => {\n  let { lastChild } = node;\n  while (lastChild && !FilterlNamedTerms.includes(lastChild.name)) {\n    lastChild = lastChild.prevSibling;\n    console.log(lastChild?.name);\n  }\n  return lastChild;\n};\n\nexport const useAutoComplete = (\n  suggestionProvider: IFilterSuggestionProvider,\n  onSubmit: MutableRefObject<ApplyCompletion>,\n  existingFilter?: Filter\n) => {\n  const makeSuggestions = useCallback(\n    async (\n      context: CompletionContext,\n      suggestionType: SuggestionType,\n      optionalArgs: {\n        columnName?: string;\n        existingFilter?: Filter;\n        filterName?: string;\n        operator?: string;\n        quoted?: boolean;\n        onSubmit?: () => void;\n        selection?: string[];\n        startsWith?: string;\n      } = {}\n    ) => {\n      const { startsWith = \"\" } = optionalArgs;\n      const options = await suggestionProvider.getSuggestions(\n        suggestionType,\n        optionalArgs\n      );\n      return { from: context.pos - startsWith.length, options };\n    },\n    [suggestionProvider]\n  );\n\n  return useCallback(\n    async (context: CompletionContext) => {\n      const { state, pos } = context;\n      const word = context.matchBefore(/\\w*/) ?? {\n        from: 0,\n        to: 0,\n        text: undefined,\n      };\n\n      const tree = syntaxTree(state);\n      const nodeBefore = tree.resolveInner(pos, -1);\n      console.log({ nodeBeforeName: nodeBefore.name });\n\n      switch (nodeBefore.name) {\n        case \"Filter\":\n          if (context.pos === 0) {\n            return makeSuggestions(context, \"column\");\n          } else {\n            const clauseOperator = getClauseOperator(nodeBefore, state);\n            if (clauseOperator === \"as\") {\n              return makeSuggestions(context, \"name\");\n            } else {\n              const filterName = getFilterName(nodeBefore, state);\n              return makeSuggestions(context, \"save\", {\n                onSubmit: onSubmit.current,\n                existingFilter,\n                filterName,\n              });\n            }\n          }\n\n        case \"String\":\n          {\n            // we only encounter a string as the right hand operand of a conditional expression\n            const operator = getOperator(nodeBefore, state);\n            const columnName = getColumnName(nodeBefore, state);\n            // are we inside the string or immediately after it\n            const { from, to } = nodeBefore;\n            if (to - from === 2 && context.pos === from + 1) {\n              // We are in an empty string, i.e between two quotes\n              if (columnName && operator) {\n                return makeSuggestions(context, \"columnValue\", {\n                  columnName,\n                  operator,\n                  quoted: true,\n                  startsWith: word.text,\n                });\n              }\n            } else {\n              console.log(\n                `we have a string, column is ${columnName} ${from} ${to}`\n              );\n            }\n          }\n          break;\n\n        case \"As\":\n          return makeSuggestions(context, \"name\");\n\n        case \"FilterName\":\n          return makeSuggestions(context, \"save\", {\n            onSubmit: onSubmit.current,\n            existingFilter,\n            filterName: getFilterName(nodeBefore, state),\n          });\n\n        case \"Column\": {\n          const columnName = getValue(nodeBefore, state);\n          const isPartialMatch = await suggestionProvider.isPartialMatch(\n            \"column\",\n            undefined,\n            columnName\n          );\n          if (isPartialMatch) {\n            return makeSuggestions(context, \"column\", {\n              startsWith: columnName,\n            });\n          } else {\n            return makeSuggestions(context, \"operator\", { columnName });\n          }\n        }\n\n        case \"⚠\": {\n          const columnName = getNodeByName(nodeBefore, state);\n          const operator = getOperator(nodeBefore, state);\n          // TODO check if we're mnatching a partial jojn operator\n          const partialOperator = operator\n            ? undefined\n            : getPartialOperator(nodeBefore, state, columnName);\n\n          if (partialOperator) {\n            return makeSuggestions(context, \"operator\", {\n              columnName,\n              startsWith: partialOperator,\n            });\n          } else {\n            return makeSuggestions(context, \"columnValue\", {\n              columnName,\n              operator,\n              startsWith: word.text,\n            });\n          }\n        }\n\n        case \"Identifier\":\n          {\n            const clauseOperator = getClauseOperator(nodeBefore, state);\n            if (clauseOperator === \"as\") {\n              return {\n                from: context.pos,\n                options: [\n                  {\n                    label: \"press ENTER to apply filter and save\",\n                    apply: () => onSubmit.current(),\n                    boost: 5,\n                  },\n                ],\n              };\n            }\n          }\n          break;\n        case \"ColumnSetExpression\":\n        case \"Values\": {\n          const columnName = getNodeByName(nodeBefore, state);\n          const selection = getSetValues(nodeBefore, state);\n          return makeSuggestions(context, \"columnValue\", {\n            columnName,\n            selection,\n          });\n        }\n        case \"Comma\":\n        case \"LBrack\": {\n          const columnName = getNodeByName(nodeBefore, state) as string;\n          return makeSuggestions(context, \"columnValue\", { columnName });\n        }\n\n        case \"ColumnValueExpression\":\n          {\n            const lastToken = nodeBefore.lastChild?.prevSibling;\n            if (lastToken?.name === \"Column\") {\n              return makeSuggestions(context, \"operator\", {\n                columnName: getNodeByName(nodeBefore, state),\n              });\n            } else if (lastToken?.name === \"Operator\") {\n              return makeSuggestions(context, \"columnValue\", {\n                columnName: getNodeByName(lastToken, state),\n                operator: getValue(lastToken, state),\n              });\n            }\n          }\n          break;\n\n        case \"In\": {\n          return {\n            from: context.pos,\n            options: [{ label: \"[\", apply: \" [\", type: \"text\" }],\n          };\n        }\n\n        case \"Eq\": {\n          return makeSuggestions(context, \"columnValue\", {\n            columnName: getNodeByName(nodeBefore, state),\n          });\n        }\n\n        case \"AndExpression\":\n        case \"OrExpression\": {\n          return makeSuggestions(context, \"column\");\n        }\n\n        default:\n      }\n    },\n    [existingFilter, makeSuggestions, onSubmit, suggestionProvider]\n  ) as CompletionSource;\n};\n"],"names":["getValue","useCallback","syntaxTree","getNodeByName"],"mappings":"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"}

package/cjs/filter-input/useFilterSuggestionProvider.js

@@ -0,0 +1,206 @@
+'use strict';
+
+var vuuCodemirror = require('@vuu-ui/vuu-codemirror');
+var vuuDataReact = require('@vuu-ui/vuu-data-react');
+var react = require('react');
+var filterInfo = require('./filterInfo.js');
+
+const NO_NAMED_FILTERS = [];
+const NONE = {};
+const saveAsTab = (onSubmit) => [
+  {
+    label: "Press ENTER to create TAB",
+    apply: () => onSubmit("tab"),
+    boost: 6
+  }
+];
+const makeSaveOrExtendSuggestions = (onSubmit, existingFilter, withJoinSuggestions = true) => {
+  const result = existingFilter ? [
+    {
+      label: "REPLACE existing filter",
+      apply: () => onSubmit("replace"),
+      boost: 8
+    },
+    {
+      label: "AND existing filter",
+      apply: () => onSubmit("and"),
+      boost: 7
+    },
+    {
+      label: "OR existing filter",
+      apply: () => onSubmit("or"),
+      boost: 7
+    }
+  ] : [
+    {
+      label: "Press ENTER to submit",
+      apply: () => onSubmit(),
+      boost: 6
+    }
+  ];
+  return withJoinSuggestions ? result.concat(vuuCodemirror.booleanJoinSuggestions).concat(vuuCodemirror.asNameSuggestion) : result;
+};
+const promptToSaveOrExtend = (onSubmit, existingFilter) => makeSaveOrExtendSuggestions(onSubmit, existingFilter, true);
+const promptToSave = (onSubmit) => makeSaveOrExtendSuggestions(onSubmit, void 0);
+const getSaveSuggestions = ({
+  existingFilter,
+  filterName,
+  onSubmit,
+  saveOptions
+}) => {
+  const includeTabSuggestion = filterName && saveOptions.allowSaveAsTab;
+  const result = existingFilter ? promptToSaveOrExtend(onSubmit, existingFilter) : promptToSave(onSubmit);
+  if (includeTabSuggestion) {
+    return result.concat(saveAsTab(onSubmit));
+  } else {
+    return result;
+  }
+};
+const suggestColumns = (columns) => columns.map((column) => ({
+  boost: 5,
+  label: column.name
+}));
+const suggestNamedFilters = (namedFilters) => namedFilters ? Array.from(namedFilters.entries()).map(([filterName, filterQuery]) => ({
+  info: () => filterInfo.filterInfo(filterName, filterQuery),
+  label: filterName,
+  type: "filter"
+})) : NO_NAMED_FILTERS;
+const doneCommand = {
+  label: "Done",
+  apply: "] ",
+  type: "keyword",
+  boost: 10
+};
+const withApplySpace = (suggestions, startsWith = "") => suggestions.filter((sugg) => startsWith === "" || sugg.label.startsWith(startsWith)).map((suggestion) => ({
+  ...suggestion,
+  apply: suggestion.label + " "
+}));
+const defaultSaveOptions = {
+  allowReplace: true
+};
+const useFilterSuggestionProvider = ({
+  columns,
+  namedFilters,
+  saveOptions = defaultSaveOptions,
+  table,
+  typeaheadHook: useTypeahead = vuuDataReact.useTypeaheadSuggestions
+}) => {
+  const latestSuggestionsRef = react.useRef();
+  const getTypeaheadSuggestions = useTypeahead();
+  const getSuggestions = react.useCallback(
+    async (suggestionType, options = NONE) => {
+      const {
+        columnName,
+        existingFilter,
+        filterName,
+        operator,
+        quoted: autoQuoted,
+        onSubmit,
+        startsWith,
+        selection
+      } = options;
+      switch (suggestionType) {
+        case "operator":
+          {
+            const column = columns.find((col) => col.name === columnName);
+            if (column) {
+              switch (column.serverDataType) {
+                case "string":
+                case "char":
+                  return withApplySpace(vuuCodemirror.stringOperators, startsWith);
+                case "int":
+                case "long":
+                case "double":
+                  return withApplySpace(vuuCodemirror.numericOperators);
+              }
+            } else {
+              console.warn(`'${columnName}' does not match any column name`);
+            }
+          }
+          break;
+        case "column": {
+          const columnSuggestions = await suggestColumns(columns);
+          const filterSuggestions = await suggestNamedFilters(namedFilters);
+          return (latestSuggestionsRef.current = withApplySpace(columnSuggestions)).concat(
+            withApplySpace(filterSuggestions)
+          );
+        }
+        case "columnValue":
+          {
+            if (columnName) {
+              const column = columns.find((col) => col.name === columnName);
+              if (!column) {
+                throw Error(
+                  `useFilterSUggestionProvider no column ${columnName}`
+                );
+              }
+              const prefix = Array.isArray(selection) ? selection.length === 0 ? "[" : "," : "";
+              const params = vuuDataReact.getTypeaheadParams(
+                table,
+                columnName,
+                startsWith
+              );
+              const suggestions = await getTypeaheadSuggestions(params);
+              const isIllustration = operator === "starts";
+              latestSuggestionsRef.current = vuuCodemirror.toSuggestions(suggestions, {
+                moveCursorToEnd: autoQuoted,
+                quoted: column?.serverDataType === "string" && !autoQuoted,
+                suffix: autoQuoted ? "" : " ",
+                prefix: isIllustration ? startsWith : prefix,
+                isIllustration
+              });
+              if (Array.isArray(selection) && selection?.length > 1) {
+                return [doneCommand, ...latestSuggestionsRef.current];
+              }
+              return latestSuggestionsRef.current;
+            }
+          }
+          break;
+        case "save": {
+          if (typeof onSubmit !== "function") {
+            throw Error(
+              "useFilterSuggestionProvider, onSubmit must be supplied for 'save' suggestions"
+            );
+          }
+          return await getSaveSuggestions({
+            existingFilter,
+            filterName,
+            onSubmit,
+            saveOptions
+          });
+        }
+        case "name":
+          return await vuuCodemirror.getNamePrompt("filter");
+      }
+      return [];
+    },
+    [columns, getTypeaheadSuggestions, namedFilters, saveOptions, table]
+  );
+  const isPartialMatch = react.useCallback(
+    async (valueType, columnName, pattern) => {
+      const suggestions = (
+        // latestSuggestions && latestSuggestions.length > 0
+        //   ? latestSuggestions
+        await getSuggestions(valueType, { columnName })
+      );
+      if (pattern && suggestions) {
+        for (const option of suggestions) {
+          if (option.label === pattern) {
+            return false;
+          } else if (option.label.startsWith(pattern)) {
+            return true;
+          }
+        }
+      }
+      return false;
+    },
+    [getSuggestions]
+  );
+  return {
+    getSuggestions,
+    isPartialMatch
+  };
+};
+
+exports.useFilterSuggestionProvider = useFilterSuggestionProvider;
+//# sourceMappingURL=useFilterSuggestionProvider.js.map