@quantumwake/terminal-ux-dashboard-components 0.1.7 → 0.1.8

package/dist/index.js

@@ -9,7 +9,8 @@ import PivotTableUI from 'react-pivottable/PivotTableUI';
 import 'react-pivottable/pivottable.css';
 import { Loader2, Play, ChevronDown, AlertCircle, Rows3, BarChart3, PieChart, TrendingUp, ScatterChart, LayoutGrid, Code, Sparkles, X, Terminal, RefreshCw, Minimize2, Maximize2, Plus, Save, FolderOpen, Trash2, Filter, Database, Send, GripVertical } from 'lucide-react';
 import CodeMirror, { EditorView, Prec, keymap } from '@uiw/react-codemirror';
-import { sql } from '@codemirror/lang-sql';
+import { sql, PostgreSQL, schemaCompletionSource, keywordCompletionSource } from '@codemirror/lang-sql';
+import { snippetCompletion, completeFromList, autocompletion, acceptCompletion } from '@codemirror/autocomplete';
 
 // src/context/DashboardContext.tsx
 var DashboardContext = createContext(null);
@@ -638,6 +639,280 @@ function ChartStyleControls({ style, onChange }) {
     ] })
   ] });
 }
+var AGGREGATES = [
+  "count",
+  "count_if",
+  "sum",
+  "avg",
+  "min",
+  "max",
+  "median",
+  "mode",
+  "stddev",
+  "stddev_pop",
+  "stddev_samp",
+  "var_pop",
+  "var_samp",
+  "variance",
+  "quantile",
+  "quantile_cont",
+  "quantile_disc",
+  "approx_count_distinct",
+  "approx_quantile",
+  "arg_max",
+  "arg_min",
+  "first",
+  "last",
+  "product",
+  "bool_and",
+  "bool_or",
+  "bit_and",
+  "bit_or",
+  "bit_xor",
+  "string_agg",
+  "list",
+  "array_agg",
+  "histogram",
+  "corr",
+  "covar_pop",
+  "covar_samp",
+  "kurtosis",
+  "skewness",
+  "entropy",
+  "row_number",
+  "rank",
+  "dense_rank",
+  "percent_rank",
+  "cume_dist",
+  "ntile",
+  "lag",
+  "lead",
+  "first_value",
+  "last_value",
+  "nth_value"
+];
+var SCALARS = [
+  // string
+  "length",
+  "len",
+  "lower",
+  "upper",
+  "trim",
+  "ltrim",
+  "rtrim",
+  "substring",
+  "substr",
+  "concat",
+  "concat_ws",
+  "replace",
+  "reverse",
+  "repeat",
+  "lpad",
+  "rpad",
+  "left",
+  "right",
+  "contains",
+  "starts_with",
+  "ends_with",
+  "position",
+  "split_part",
+  "string_split",
+  "regexp_matches",
+  "regexp_replace",
+  "regexp_extract",
+  "regexp_full_match",
+  "regexp_split_to_array",
+  "format",
+  "printf",
+  "md5",
+  "sha256",
+  "levenshtein",
+  "jaccard",
+  "ascii",
+  "chr",
+  // date / time
+  "now",
+  "current_date",
+  "current_timestamp",
+  "today",
+  "date_trunc",
+  "date_part",
+  "date_diff",
+  "date_add",
+  "date_sub",
+  "age",
+  "strftime",
+  "strptime",
+  "epoch",
+  "epoch_ms",
+  "extract",
+  "make_date",
+  "make_time",
+  "make_timestamp",
+  "last_day",
+  "dayname",
+  "monthname",
+  "year",
+  "month",
+  "day",
+  "hour",
+  "minute",
+  "second",
+  "dayofweek",
+  "dayofyear",
+  "week",
+  "quarter",
+  "time_bucket",
+  // math
+  "abs",
+  "ceil",
+  "ceiling",
+  "floor",
+  "round",
+  "trunc",
+  "sign",
+  "mod",
+  "pow",
+  "power",
+  "sqrt",
+  "cbrt",
+  "exp",
+  "ln",
+  "log",
+  "log2",
+  "log10",
+  "greatest",
+  "least",
+  "gcd",
+  "lcm",
+  "factorial",
+  "random",
+  "pi",
+  "degrees",
+  "radians",
+  "sin",
+  "cos",
+  "tan",
+  "asin",
+  "acos",
+  "atan",
+  "atan2",
+  // conditional / null / cast
+  "coalesce",
+  "ifnull",
+  "nullif",
+  "nvl",
+  "if",
+  "try_cast",
+  "cast",
+  "typeof",
+  // list / struct / map / json
+  "list_value",
+  "list_aggregate",
+  "list_distinct",
+  "list_sort",
+  "list_reverse",
+  "list_slice",
+  "list_concat",
+  "list_contains",
+  "list_position",
+  "list_extract",
+  "list_transform",
+  "list_filter",
+  "unnest",
+  "array_length",
+  "array_to_string",
+  "struct_pack",
+  "struct_extract",
+  "map",
+  "map_keys",
+  "map_values",
+  "json_extract",
+  "json_extract_string",
+  "to_json",
+  "from_json",
+  "json_array_length",
+  "json_keys",
+  "generate_series",
+  "range"
+];
+var TYPES = [
+  "BOOLEAN",
+  "TINYINT",
+  "SMALLINT",
+  "INTEGER",
+  "BIGINT",
+  "HUGEINT",
+  "UTINYINT",
+  "USMALLINT",
+  "UINTEGER",
+  "UBIGINT",
+  "FLOAT",
+  "REAL",
+  "DOUBLE",
+  "DECIMAL",
+  "NUMERIC",
+  "VARCHAR",
+  "CHAR",
+  "TEXT",
+  "BLOB",
+  "BIT",
+  "DATE",
+  "TIME",
+  "TIMESTAMP",
+  "TIMESTAMPTZ",
+  "INTERVAL",
+  "UUID",
+  "JSON",
+  "LIST",
+  "ARRAY",
+  "STRUCT",
+  "MAP",
+  "UNION",
+  "ENUM"
+];
+var EXTRA_KEYWORDS = [
+  "QUALIFY",
+  "EXCLUDE",
+  "PIVOT",
+  "UNPIVOT",
+  "ASOF",
+  "POSITIONAL",
+  "SEMI",
+  "ANTI",
+  "SUMMARIZE",
+  "DISTINCT ON",
+  "GROUP BY ALL",
+  "ORDER BY ALL",
+  "USING SAMPLE"
+];
+function opts(labels, type, boost = 0) {
+  return labels.map((label) => ({ label, type, boost }));
+}
+var SNIPPETS = [
+  snippetCompletion("SELECT ${col}, count(*) AS n\nFROM data\nGROUP BY ${col}\nORDER BY n DESC", {
+    label: "group by count",
+    type: "snippet",
+    detail: "aggregate by column"
+  }),
+  snippetCompletion("SELECT *\nFROM data\nORDER BY ${col} DESC\nLIMIT 10", {
+    label: "top N",
+    type: "snippet",
+    detail: "order + limit"
+  }),
+  snippetCompletion("SELECT DISTINCT ${col}\nFROM data", {
+    label: "select distinct",
+    type: "snippet"
+  })
+];
+var duckdbCompletionSource = completeFromList([
+  ...opts(AGGREGATES, "function", 1),
+  // boost aggregates slightly — common in analysis
+  ...opts(SCALARS, "function"),
+  ...opts(TYPES, "type"),
+  ...opts(EXTRA_KEYWORDS, "keyword"),
+  ...SNIPPETS
+]);
 var DEFAULT_SQL = "SELECT *\nFROM data\nLIMIT 100";
 var renderCell = (v) => {
   if (v == null) return "";
@@ -677,18 +952,32 @@ function SqlConsole({ columns = [], stateId, defaultColumnsOpen = false, default
     void run();
   };
   const schemaKey = columns.map((c) => c.name).join(",");
-  const extensions = useMemo(
-    () => [
-      sql({ schema: { data: columns.map((c) => c.name) }, upperCaseKeywords: true }),
+  const extensions = useMemo(() => {
+    const sqlConfig = {
+      dialect: PostgreSQL,
+      schema: { data: columns.map((c) => c.name) },
+      defaultTable: "data",
+      upperCaseKeywords: true
+    };
+    return [
+      sql(sqlConfig),
+      autocompletion({
+        override: [
+          schemaCompletionSource(sqlConfig),
+          keywordCompletionSource(PostgreSQL, true),
+          duckdbCompletionSource
+        ]
+      }),
       EditorView.lineWrapping,
-      Prec.highest(keymap.of([{ key: "Mod-Enter", run: () => {
-        runRef.current();
-        return true;
-      } }]))
-    ],
-    [schemaKey]
-    // eslint-disable-line react-hooks/exhaustive-deps
-  );
+      Prec.highest(keymap.of([
+        { key: "Mod-Enter", run: () => {
+          runRef.current();
+          return true;
+        } },
+        { key: "Tab", run: acceptCompletion }
+      ]))
+    ];
+  }, [schemaKey]);
   const resultColumns = result?.columns || [];
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
     /* @__PURE__ */ jsxs("div", { className: `border-b ${theme.border} bg-midnight-elevated p-3 shrink-0`, children: [
@@ -718,7 +1007,7 @@ function SqlConsole({ columns = [], stateId, defaultColumnsOpen = false, default
           onChange: setSql,
           extensions,
           theme: "dark",
-          basicSetup: { lineNumbers: false, foldGutter: false, highlightActiveLine: false },
+          basicSetup: { lineNumbers: false, foldGutter: false, highlightActiveLine: false, autocompletion: false },
           height: "120px",
           placeholder: "SELECT ... FROM data",
           className: "border border-midnight-border text-sm overflow-hidden focus-within:border-midnight-accent"