sqlui 0.1.38 → 0.1.39

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5df014dd6a9df573d3d336f9d06e424ecb522ddcd9e34dcd1f2ecb4feeb97b00
-  data.tar.gz: 923e0415e6d274072c6aafbb0a202ea1c319f7c0a61e624b097bff009f68be1f
+  metadata.gz: 473ef1be7a3ad0a4e28d2ebf7ab4f52bfcb140a24ccbfcabab5ccbccf7e5d699
+  data.tar.gz: 8236b7ddf4245a64738b304029a291a04c33d7079045b3456d61b22d1f1fcf1c
 SHA512:
-  metadata.gz: fd163f02e3db9e4d42cdf123394218cc02705a91ea9b02048cf79bfaf83fbb423f2ed61edd758280068aa3660fc4b9af1f474251d57569840e768f54c41e9aa9
-  data.tar.gz: 4d61710e2e5795ae772d42fcc814f7643b2935a8fa5223258b400ef7ae23c1a5b8b2363bada7ecf9bf28a36494f8db818e27aab97bd1619e48865dab5ce24c0b
+  metadata.gz: 38dd32e339981bba7a401a6c53f5cf8233ffbe8d98fc69f79ceb4c575adbe8b7a2d7e6c7ab97f9a835ae69f63423b8b925978565c5d6e66aa5a3efa71e937e5a
+  data.tar.gz: 4e56ef90eba0ce8ad231fb80f7c93cb740eab46208a0c8a27d16e3f34568f4b40ece0c68d92f0c81101ad784e78609f34c90158731ef61d72ee3952847c6a2e1

data/.version

@@ -1 +1 @@
-0.1.38
+0.1.39

data/app/args.rb

@@ -20,13 +20,21 @@ class Args
     value
   end
 
+  def self.fetch_optional_hash(hash, key)
+    fetch_optional(hash, key, Hash)
+  end
+
   def self.fetch_non_nil(hash, key, *classes)
     raise ArgumentError, "required parameter #{key} missing" unless hash.key?(key)
 
-    value = hash[key]
-    raise ArgumentError, "required parameter #{key} null" if value.nil?
+    raise ArgumentError, "required parameter #{key} null" if hash[key].nil?
 
-    if classes.size.positive? && !classes.find { |clazz| value.is_a?(clazz) }
+    fetch_optional(hash, key, *classes)
+  end
+
+  def self.fetch_optional(hash, key, *classes)
+    value = hash[key]
+    if value && classes.size.positive? && !classes.find { |clazz| value.is_a?(clazz) }
       if classes.size != 1
         raise ArgumentError, "required parameter #{key} not #{classes.map(&:to_s).map(&:downcase).join(' or ')}"
       end

data/app/database_config.rb

@@ -1,11 +1,13 @@
 # frozen_string_literal: true
 
 require 'mysql2'
+require 'set'
+
 require_relative 'args'
 
 # Config for a single database.
 class DatabaseConfig
-  attr_reader :display_name, :description, :url_path, :saved_path, :client_params
+  attr_reader :display_name, :description, :url_path, :saved_path, :table_aliases, :client_params
 
   def initialize(hash)
     @display_name = Args.fetch_non_empty_string(hash, :display_name).strip
@@ -15,6 +17,15 @@ class DatabaseConfig
     raise ArgumentError, 'url_path should not end with a /' if @url_path.length > 1 && @url_path.end_with?('/')
 
     @saved_path = Args.fetch_non_empty_string(hash, :saved_path).strip
+    @table_aliases = Args.fetch_optional_hash(hash, :table_aliases) || {}
+    @table_aliases = @table_aliases.each do |table, a|
+      raise ArgumentError, "invalid alias for table #{table} (#{a}), expected string" unless a.is_a?(String)
+    end
+    duplicate_aliases = @table_aliases.reject { |(_, v)| @table_aliases.values.count(v) == 1 }.to_h.values.to_set
+    if @table_aliases.values.to_set.size < @table_aliases.values.size
+      raise ArgumentError, "duplicate table aliases: #{duplicate_aliases.join(', ')}"
+    end
+
     @client_params = Args.fetch_non_empty_hash(hash, :client_params)
   end
 

data/app/server.rb

@@ -57,6 +57,7 @@ class Server < Sinatra::Base
             server: "#{config.name} - #{database.display_name}",
             list_url_path: config.list_url_path,
             schemas: DatabaseMetadata.lookup(client, database),
+            table_aliases: database.table_aliases,
             saved: Dir.glob("#{database.saved_path}/*.sql").to_h do |path|
               contents = File.read(path)
               comment_lines = contents.split("\n").take_while do |l|

data/app/sqlui_config.rb

@@ -1,6 +1,7 @@
 # frozen_string_literal: true
 
 require 'yaml'
+require 'erb'
 require_relative 'args'
 require_relative 'database_config'
 require_relative 'deep'

data/client/resources/sqlui.js

@@ -1662,18 +1662,20 @@
                    return 0;
                },
                reconfigure: (state, oldState) => {
-                   let newVal = getter(state);
-                   let oldAddr = oldState.config.address[id];
+                   let newVal, oldAddr = oldState.config.address[id];
                    if (oldAddr != null) {
                        let oldVal = getAddr(oldState, oldAddr);
                        if (this.dependencies.every(dep => {
                            return dep instanceof Facet ? oldState.facet(dep) === state.facet(dep) :
                                dep instanceof StateField ? oldState.field(dep, false) == state.field(dep, false) : true;
-                       }) || (multi ? compareArray(newVal, oldVal, compare) : compare(newVal, oldVal))) {
+                       }) || (multi ? compareArray(newVal = getter(state), oldVal, compare) : compare(newVal = getter(state), oldVal))) {
                            state.values[idx] = oldVal;
                            return 0;
                        }
                    }
+                   else {
+                       newVal = getter(state);
+                   }
                    state.values[idx] = newVal;
                    return 1 /* SlotStatus.Changed */;
                }
@@ -2807,6 +2809,18 @@
        /**
        Find the values for a given language data field, provided by the
        the [`languageData`](https://codemirror.net/6/docs/ref/#state.EditorState^languageData) facet.
+       
+       Examples of language data fields are...
+       
+       - [`"commentTokens"`](https://codemirror.net/6/docs/ref/#commands.CommentTokens) for specifying
+         comment syntax.
+       - [`"autocomplete"`](https://codemirror.net/6/docs/ref/#autocomplete.autocompletion^config.override)
+         for providing language-specific completion sources.
+       - [`"wordChars"`](https://codemirror.net/6/docs/ref/#state.EditorState.charCategorizer) for adding
+         characters that should be considered part of words in this
+         language.
+       - [`"closeBrackets"`](https://codemirror.net/6/docs/ref/#autocomplete.CloseBracketConfig) controls
+         bracket closing behavior.
        */
        languageDataAt(name, pos, side = -1) {
            let values = [];
@@ -3311,7 +3325,7 @@
        */
        static eq(oldSets, newSets, from = 0, to) {
            if (to == null)
-               to = 1000000000 /* C.Far */;
+               to = 1000000000 /* C.Far */ - 1;
            let a = oldSets.filter(set => !set.isEmpty && newSets.indexOf(set) < 0);
            let b = newSets.filter(set => !set.isEmpty && oldSets.indexOf(set) < 0);
            if (a.length != b.length)
@@ -5019,7 +5033,7 @@
                if (pos > 0 ? i == 0 : i == rects.length - 1 || rect.top < rect.bottom)
                    break;
            }
-           return flattenRect(rect, this.side > 0);
+           return this.length ? rect : flattenRect(rect, this.side > 0);
        }
        get isEditable() { return false; }
        destroy() {
@@ -5909,6 +5923,9 @@
    const perLineTextDirection = /*@__PURE__*/Facet.define({
        combine: values => values.some(x => x)
    });
+   const nativeSelectionHidden = /*@__PURE__*/Facet.define({
+       combine: values => values.some(x => x)
+   });
    class ScrollTarget {
        constructor(range, y = "nearest", x = "nearest", yMargin = 5, xMargin = 5) {
            this.range = range;
@@ -6821,8 +6838,9 @@
        enforceCursorAssoc() {
            if (this.compositionDeco.size)
                return;
-           let cursor = this.view.state.selection.main;
-           let sel = getSelection$1(this.view.root);
+           let { view } = this, cursor = view.state.selection.main;
+           let sel = getSelection$1(view.root);
+           let { anchorNode, anchorOffset } = view.observer.selectionRange;
            if (!sel || !cursor.empty || !cursor.assoc || !sel.modify)
                return;
            let line = LineView.find(this, cursor.head);
@@ -6837,6 +6855,12 @@
            let dom = this.domAtPos(cursor.head + cursor.assoc);
            sel.collapse(dom.node, dom.offset);
            sel.modify("move", cursor.assoc < 0 ? "forward" : "backward", "lineboundary");
+           // This can go wrong in corner cases like single-character lines,
+           // so check and reset if necessary.
+           view.observer.readSelectionRange();
+           let newRange = view.observer.selectionRange;
+           if (view.docView.posFromDOM(newRange.anchorNode, newRange.anchorOffset) != cursor.from)
+               sel.collapse(anchorNode, anchorOffset);
        }
        mayControlSelection() {
            let active = this.view.root.activeElement;
@@ -8170,9 +8194,9 @@
 
    const wrappingWhiteSpace = ["pre-wrap", "normal", "pre-line", "break-spaces"];
    class HeightOracle {
-       constructor() {
+       constructor(lineWrapping) {
+           this.lineWrapping = lineWrapping;
            this.doc = Text.empty;
-           this.lineWrapping = false;
            this.heightSamples = {};
            this.lineHeight = 14;
            this.charWidth = 7;
@@ -8911,7 +8935,6 @@
            this.contentDOMHeight = 0;
            this.editorHeight = 0;
            this.editorWidth = 0;
-           this.heightOracle = new HeightOracle;
            // See VP.MaxDOMHeight
            this.scaler = IdScaler;
            this.scrollTarget = null;
@@ -8920,7 +8943,7 @@
            // Flag set when editor content was redrawn, so that the next
            // measure stage knows it must read DOM layout
            this.mustMeasureContent = true;
-           this.defaultTextDirection = Direction.RTL;
+           this.defaultTextDirection = Direction.LTR;
            this.visibleRanges = [];
            // Cursor 'assoc' is only significant when the cursor is on a line
            // wrap point, where it must stick to the character that it is
@@ -8931,6 +8954,8 @@
            // boundary and, if so, reset it to make sure it is positioned in
            // the right place.
            this.mustEnforceCursorAssoc = false;
+           let guessWrapping = state.facet(contentAttributes).some(v => typeof v != "function" && v.class == "cm-lineWrapping");
+           this.heightOracle = new HeightOracle(guessWrapping);
            this.stateDeco = state.facet(decorations).filter(d => typeof d != "function");
            this.heightMap = HeightMap.empty().applyChanges(this.stateDeco, Text.empty, this.heightOracle.setDoc(state.doc), [new ChangedRange(0, 0, 0, state.doc.length)]);
            this.viewport = this.getViewport(0, null);
@@ -8985,7 +9010,8 @@
            if (scrollTarget)
                this.scrollTarget = scrollTarget;
            if (!this.mustEnforceCursorAssoc && update.selectionSet && update.view.lineWrapping &&
-               update.state.selection.main.empty && update.state.selection.main.assoc)
+               update.state.selection.main.empty && update.state.selection.main.assoc &&
+               !update.state.facet(nativeSelectionHidden))
                this.mustEnforceCursorAssoc = true;
        }
        measure(view) {
@@ -9048,7 +9074,7 @@
                oracle.heightChanged = false;
                for (let vp of this.viewports) {
                    let heights = vp.from == this.viewport.from ? lineHeights : view.docView.measureVisibleLineHeights(vp);
-                   this.heightMap = this.heightMap.updateHeight(oracle, 0, refresh, new MeasuredHeights(vp.from, heights));
+                   this.heightMap = (refresh ? HeightMap.empty().applyChanges(this.stateDeco, Text.empty, this.heightOracle, [new ChangedRange(0, 0, 0, view.state.doc.length)]) : this.heightMap).updateHeight(oracle, 0, refresh, new MeasuredHeights(vp.from, heights));
                }
                if (oracle.heightChanged)
                    result |= 2 /* UpdateFlag.Height */;
@@ -9614,7 +9640,11 @@
            this.bounds = null;
            this.text = "";
            let { impreciseHead: iHead, impreciseAnchor: iAnchor } = view.docView;
-           if (start > -1 && !view.state.readOnly && (this.bounds = view.docView.domBoundsAround(start, end, 0))) {
+           if (view.state.readOnly && start > -1) {
+               // Ignore changes when the editor is read-only
+               this.newSel = null;
+           }
+           else if (start > -1 && (this.bounds = view.docView.domBoundsAround(start, end, 0))) {
                let selPoints = iHead || iAnchor ? [] : selectionPoints(view);
                let reader = new DOMReader(selPoints, view.state);
                reader.readRange(this.bounds.startDOM, this.bounds.endDOM);
@@ -9908,7 +9938,8 @@
            this.onScroll = this.onScroll.bind(this);
            if (typeof ResizeObserver == "function") {
                this.resize = new ResizeObserver(() => {
-                   if (this.view.docView.lastUpdate < Date.now() - 75)
+                   var _a;
+                   if (((_a = this.view.docView) === null || _a === void 0 ? void 0 : _a.lastUpdate) < Date.now() - 75)
                        this.onResize();
                });
                this.resize.observe(view.scrollDOM);
@@ -11400,7 +11431,7 @@
        if (scopeObj) {
            if (runFor(scopeObj[prefix + modifiers(name, event, !isChar)]))
                return true;
-           if (isChar && (event.shiftKey || event.altKey || event.metaKey || charCode > 127) &&
+           if (isChar && (event.altKey || event.metaKey || event.ctrlKey) &&
                (baseName = base[event.keyCode]) && baseName != name) {
                if (runFor(scopeObj[prefix + modifiers(baseName, event, true)]))
                    return true;
@@ -11452,7 +11483,8 @@
        return [
            selectionConfig.of(config),
            drawSelectionPlugin,
-           hideNativeSelection
+           hideNativeSelection,
+           nativeSelectionHidden.of(true)
        ];
    }
    class Piece {
@@ -12210,6 +12242,9 @@
                keyup(e) {
                    if (e.keyCode == code || !getter(e))
                        this.set(false);
+               },
+               mousemove(e) {
+                   this.set(getter(e));
                }
            }
        });
@@ -12444,7 +12479,7 @@
                dom.classList.toggle("cm-tooltip-above", above);
                dom.classList.toggle("cm-tooltip-below", !above);
                if (tView.positioned)
-                   tView.positioned();
+                   tView.positioned(measured.space);
            }
        }
        maybeMeasure() {
@@ -12560,10 +12595,10 @@
            }
            this.mounted = true;
        }
-       positioned() {
+       positioned(space) {
            for (let hostedView of this.manager.tooltipViews) {
                if (hostedView.positioned)
-                   hostedView.positioned();
+                   hostedView.positioned(space);
            }
        }
        update(update) {
@@ -12660,10 +12695,10 @@
                }
            }
        }
-       mouseleave() {
+       mouseleave(e) {
            clearTimeout(this.hoverTimeout);
            this.hoverTimeout = -1;
-           if (this.active)
+           if (this.active && !isInTooltip(e.relatedTarget))
                this.view.dispatch({ effects: this.setHover.of(null) });
        }
        destroy() {
@@ -15988,8 +16023,10 @@
    Facet that defines a way to provide a function that computes the
    appropriate indentation depth, as a column number (see
    [`indentString`](https://codemirror.net/6/docs/ref/#language.indentString)), at the start of a given
-   line, or `null` to indicate no appropriate indentation could be
-   determined.
+   line. A return value of `null` indicates no indentation can be
+   determined, and the line should inherit the indentation of the one
+   above it. A return value of `undefined` defers to the next indent
+   service.
    */
    const indentService = /*@__PURE__*/Facet.define();
    /**
@@ -16047,7 +16084,7 @@
            context = new IndentContext(context);
        for (let service of context.state.facet(indentService)) {
            let result = service(context, pos);
-           if (result != null)
+           if (result !== undefined)
                return result;
        }
        let tree = syntaxTree(context.state);
@@ -16355,7 +16392,7 @@
        let tree = syntaxTree(state);
        if (tree.length < end)
            return null;
-       let inner = tree.resolveInner(end);
+       let inner = tree.resolveInner(end, 1);
        let found = null;
        for (let cur = inner; cur; cur = cur.parent) {
            if (cur.to <= end || cur.from > end)
@@ -19520,14 +19557,14 @@
                    crelt("br"),
                    this.replaceField,
                    button("replace", () => replaceNext(view), [phrase(view, "replace")]),
-                   button("replaceAll", () => replaceAll(view), [phrase(view, "replace all")]),
-                   crelt("button", {
-                       name: "close",
-                       onclick: () => closeSearchPanel(view),
-                       "aria-label": phrase(view, "close"),
-                       type: "button"
-                   }, ["×"])
-               ]
+                   button("replaceAll", () => replaceAll(view), [phrase(view, "replace all")])
+               ],
+               crelt("button", {
+                   name: "close",
+                   onclick: () => closeSearchPanel(view),
+                   "aria-label": phrase(view, "close"),
+                   type: "button"
+               }, ["×"])
            ]);
        }
        commit() {
@@ -19767,6 +19804,11 @@
        return new RegExp(`${addStart ? "^" : ""}(?:${source})${addEnd ? "$" : ""}`, (_a = expr.flags) !== null && _a !== void 0 ? _a : (expr.ignoreCase ? "i" : ""));
    }
    /**
+   This annotation is added to transactions that are produced by
+   picking a completion.
+   */
+   const pickedCompletion = /*@__PURE__*/Annotation.define();
+   /**
    Helper function that returns a transaction spec which inserts a
    completion's text in the main selection range, and any other
    selection range that has the same text in front of it.
@@ -19792,7 +19834,7 @@
        const apply = option.completion.apply || option.completion.label;
        let result = option.source;
        if (typeof apply == "string")
-           view.dispatch(insertCompletionText(view.state, apply, result.from, result.to));
+           view.dispatch(Object.assign(Object.assign({}, insertCompletionText(view.state, apply, result.from, result.to)), { annotations: pickedCompletion.of(option.completion) }));
        else
            apply(view, option.completion, result.from, result.to);
    }
@@ -20027,6 +20069,7 @@
                write: (pos) => this.positionInfo(pos),
                key: this
            };
+           this.space = null;
            let cState = view.state.field(stateField);
            let { options, selected } = cState.open;
            let config = view.state.facet(completionConfig);
@@ -20052,10 +20095,17 @@
        }
        mount() { this.updateSel(); }
        update(update) {
-           if (update.state.field(this.stateField) != update.startState.field(this.stateField))
+           var _a, _b, _c;
+           let cState = update.state.field(this.stateField);
+           let prevState = update.startState.field(this.stateField);
+           if (cState != prevState) {
                this.updateSel();
+               if (((_a = cState.open) === null || _a === void 0 ? void 0 : _a.disabled) != ((_b = prevState.open) === null || _b === void 0 ? void 0 : _b.disabled))
+                   this.dom.classList.toggle("cm-tooltip-autocomplete-disabled", !!((_c = cState.open) === null || _c === void 0 ? void 0 : _c.disabled));
+           }
        }
-       positioned() {
+       positioned(space) {
+           this.space = space;
            if (this.info)
                this.view.requestMeasure(this.placeInfo);
        }
@@ -20122,27 +20172,32 @@
            let sel = this.dom.querySelector("[aria-selected]");
            if (!sel || !this.info)
                return null;
-           let win = this.dom.ownerDocument.defaultView || window;
            let listRect = this.dom.getBoundingClientRect();
            let infoRect = this.info.getBoundingClientRect();
            let selRect = sel.getBoundingClientRect();
-           if (selRect.top > Math.min(win.innerHeight, listRect.bottom) - 10 || selRect.bottom < Math.max(0, listRect.top) + 10)
+           let space = this.space;
+           if (!space) {
+               let win = this.dom.ownerDocument.defaultView || window;
+               space = { left: 0, top: 0, right: win.innerWidth, bottom: win.innerHeight };
+           }
+           if (selRect.top > Math.min(space.bottom, listRect.bottom) - 10 ||
+               selRect.bottom < Math.max(space.top, listRect.top) + 10)
                return null;
            let rtl = this.view.textDirection == Direction.RTL, left = rtl, narrow = false, maxWidth;
            let top = "", bottom = "";
-           let spaceLeft = listRect.left, spaceRight = win.innerWidth - listRect.right;
+           let spaceLeft = listRect.left - space.left, spaceRight = space.right - listRect.right;
            if (left && spaceLeft < Math.min(infoRect.width, spaceRight))
                left = false;
            else if (!left && spaceRight < Math.min(infoRect.width, spaceLeft))
                left = true;
            if (infoRect.width <= (left ? spaceLeft : spaceRight)) {
-               top = (Math.max(0, Math.min(selRect.top, win.innerHeight - infoRect.height)) - listRect.top) + "px";
+               top = (Math.max(space.top, Math.min(selRect.top, space.bottom - infoRect.height)) - listRect.top) + "px";
                maxWidth = Math.min(400 /* Info.Width */, left ? spaceLeft : spaceRight) + "px";
            }
            else {
                narrow = true;
-               maxWidth = Math.min(400 /* Info.Width */, (rtl ? listRect.right : win.innerWidth - listRect.left) - 30 /* Info.Margin */) + "px";
-               let spaceBelow = win.innerHeight - listRect.bottom;
+               maxWidth = Math.min(400 /* Info.Width */, (rtl ? listRect.right : space.right - listRect.left) - 30 /* Info.Margin */) + "px";
+               let spaceBelow = space.bottom - listRect.bottom;
                if (spaceBelow >= infoRect.height || spaceBelow > listRect.top) // Below the completion
                    top = (selRect.bottom - listRect.top) + "px";
                else // Above it
@@ -20251,21 +20306,24 @@
        return result;
    }
    class CompletionDialog {
-       constructor(options, attrs, tooltip, timestamp, selected) {
+       constructor(options, attrs, tooltip, timestamp, selected, disabled) {
            this.options = options;
            this.attrs = attrs;
            this.tooltip = tooltip;
            this.timestamp = timestamp;
            this.selected = selected;
+           this.disabled = disabled;
        }
        setSelected(selected, id) {
            return selected == this.selected || selected >= this.options.length ? this
-               : new CompletionDialog(this.options, makeAttrs(id, selected), this.tooltip, this.timestamp, selected);
+               : new CompletionDialog(this.options, makeAttrs(id, selected), this.tooltip, this.timestamp, selected, this.disabled);
        }
        static build(active, state, id, prev, conf) {
            let options = sortOptions(active, state);
-           if (!options.length)
-               return null;
+           if (!options.length) {
+               return prev && active.some(a => a.state == 1 /* State.Pending */) ?
+                   new CompletionDialog(prev.options, prev.attrs, prev.tooltip, prev.timestamp, prev.selected, true) : null;
+           }
            let selected = state.facet(completionConfig).selectOnOpen ? 0 : -1;
            if (prev && prev.selected != selected && prev.selected != -1) {
                let selectedValue = prev.options[prev.selected].completion;
@@ -20279,10 +20337,10 @@
                pos: active.reduce((a, b) => b.hasResult() ? Math.min(a, b.from) : a, 1e8),
                create: completionTooltip(completionState),
                above: conf.aboveCursor,
-           }, prev ? prev.timestamp : Date.now(), selected);
+           }, prev ? prev.timestamp : Date.now(), selected, false);
        }
        map(changes) {
-           return new CompletionDialog(this.options, this.attrs, Object.assign(Object.assign({}, this.tooltip), { pos: changes.mapPos(this.tooltip.pos) }), this.timestamp, this.selected);
+           return new CompletionDialog(this.options, this.attrs, Object.assign(Object.assign({}, this.tooltip), { pos: changes.mapPos(this.tooltip.pos) }), this.timestamp, this.selected, this.disabled);
        }
    }
    class CompletionState {
@@ -20305,9 +20363,12 @@
            });
            if (active.length == this.active.length && active.every((a, i) => a == this.active[i]))
                active = this.active;
-           let open = tr.selection || active.some(a => a.hasResult() && tr.changes.touchesRange(a.from, a.to)) ||
-               !sameResults(active, this.active) ? CompletionDialog.build(active, state, this.id, this.open, conf)
-               : this.open && tr.docChanged ? this.open.map(tr.changes) : this.open;
+           let open = this.open;
+           if (tr.selection || active.some(a => a.hasResult() && tr.changes.touchesRange(a.from, a.to)) ||
+               !sameResults(active, this.active))
+               open = CompletionDialog.build(active, state, this.id, this.open, conf);
+           else if (open && tr.docChanged)
+               open = open.map(tr.changes);
            if (!open && active.every(a => a.state != 1 /* State.Pending */) && active.some(a => a.hasResult()))
                active = active.map(a => a.hasResult() ? new ActiveSource(a.source, 0 /* State.Inactive */) : a);
            for (let effect of tr.effects)
@@ -20447,7 +20508,7 @@
    function moveCompletionSelection(forward, by = "option") {
        return (view) => {
            let cState = view.state.field(completionState, false);
-           if (!cState || !cState.open ||
+           if (!cState || !cState.open || cState.open.disabled ||
                Date.now() - cState.open.timestamp < view.state.facet(completionConfig).interactionDelay)
                return false;
            let step = 1, tooltip;
@@ -20472,7 +20533,8 @@
        if (view.state.readOnly || !cState || !cState.open || cState.open.selected < 0 ||
            Date.now() - cState.open.timestamp < view.state.facet(completionConfig).interactionDelay)
            return false;
-       applyCompletion(view, cState.open.options[cState.open.selected]);
+       if (!cState.open.disabled)
+           applyCompletion(view, cState.open.options[cState.open.selected]);
        return true;
    };
    /**
@@ -20677,10 +20739,16 @@
            background: "#17c",
            color: "white",
        },
+       "&light .cm-tooltip-autocomplete-disabled ul li[aria-selected]": {
+           background: "#777",
+       },
        "&dark .cm-tooltip-autocomplete ul li[aria-selected]": {
            background: "#347",
            color: "white",
        },
+       "&dark .cm-tooltip-autocomplete-disabled ul li[aria-selected]": {
+           background: "#444",
+       },
        ".cm-completionListIncompleteTop:before, .cm-completionListIncompleteBottom:after": {
            content: '"···"',
            opacity: 0.5,
@@ -22355,7 +22423,7 @@
                }
            let next = input.next, low = 0, high = data[state + 2];
            // Special case for EOF
-           if (input.next < 0 && high > low && data[accEnd + high * 3 - 3] == 65535 /* End */) {
+           if (input.next < 0 && high > low && data[accEnd + high * 3 - 3] == 65535 /* End */ && data[accEnd + high * 3 - 3] == 65535 /* End */) {
                state = data[accEnd + high * 3 - 1];
                continue scan;
            }
@@ -22363,7 +22431,7 @@
            for (; low < high;) {
                let mid = (low + high) >> 1;
                let index = accEnd + mid + (mid << 1);
-               let from = data[index], to = data[index + 1];
+               let from = data[index], to = data[index + 1] || 0x10000;
                if (next < from)
                    high = mid;
                else if (next >= to)
@@ -23334,7 +23402,7 @@
        spaceAfterDashes: false,
        slashComments: false,
        doubleQuotedStrings: false,
-       doubleDollarStrings: false,
+       doubleDollarQuotedStrings: false,
        unquotedBitLiterals: false,
        treatBitsAsBytes: false,
        charSetCasts: false,
@@ -23361,7 +23429,7 @@
                    input.advance();
                input.acceptToken(whitespace);
            }
-           else if (next == 36 /* Ch.Dollar */ && input.next == 36 /* Ch.Dollar */ && d.doubleDollarStrings) {
+           else if (next == 36 /* Ch.Dollar */ && input.next == 36 /* Ch.Dollar */ && d.doubleDollarQuotedStrings) {
                readDoubleDollarLiteral(input);
                input.acceptToken(String$1);
            }
@@ -23745,6 +23813,7 @@
        static define(spec) {
            let d = dialect(spec, spec.keywords, spec.types, spec.builtin);
            let language = LRLanguage.define({
+               name: "sql",
                parser: parser.configure({
                    tokenizers: [{ from: tokens, to: tokensFor(d) }]
                }),
@@ -23764,14 +23833,6 @@
        return completeKeywords(dialect.dialect.words, upperCase);
    }
    /**
-   FIXME remove on 1.0 @internal
-   */
-   function keywordCompletion(dialect, upperCase = false) {
-       return dialect.language.data.of({
-           autocomplete: keywordCompletionSource(dialect, upperCase)
-       });
-   }
-   /**
    Returns a completion sources that provides schema-based completion
    for the given configuration.
    */
@@ -23779,27 +23840,6 @@
        return config.schema ? completeFromSchema(config.schema, config.tables, config.defaultTable, config.defaultSchema)
            : () => null;
    }
-   /**
-   FIXME remove on 1.0 @internal
-   */
-   function schemaCompletion(config) {
-       return config.schema ? (config.dialect || StandardSQL).language.data.of({
-           autocomplete: schemaCompletionSource(config)
-       }) : [];
-   }
-   /**
-   SQL language support for the given SQL dialect, with keyword
-   completion, and, if provided, schema-based completion as extra
-   extensions.
-   */
-   function sql(config = {}) {
-       let lang = config.dialect || StandardSQL;
-       return new LanguageSupport(lang.language, [schemaCompletion(config), keywordCompletion(lang, !!config.upperCaseKeywords)]);
-   }
-   /**
-   The standard SQL dialect.
-   */
-   const StandardSQL = /*@__PURE__*/SQLDialect.define({});
    const MySQLKeywords = "accessible algorithm analyze asensitive authors auto_increment autocommit avg avg_row_length binlog btree cache catalog_name chain change changed checkpoint checksum class_origin client_statistics coalesce code collations columns comment committed completion concurrent consistent contains contributors convert database databases day_hour day_microsecond day_minute day_second delay_key_write delayed delimiter des_key_file dev_pop dev_samp deviance directory disable discard distinctrow div dual dumpfile enable enclosed ends engine engines enum errors escaped even event events every explain extended fast field fields flush force found_rows fulltext grants handler hash high_priority hosts hour_microsecond hour_minute hour_second ignore ignore_server_ids import index index_statistics infile innodb insensitive insert_method install invoker iterate keys kill linear lines list load lock logs low_priority master master_heartbeat_period master_ssl_verify_server_cert masters max max_rows maxvalue message_text middleint migrate min min_rows minute_microsecond minute_second mod mode modify mutex mysql_errno no_write_to_binlog offline offset one online optimize optionally outfile pack_keys parser partition partitions password phase plugin plugins prev processlist profile profiles purge query quick range read_write rebuild recover regexp relaylog remove rename reorganize repair repeatable replace require resume rlike row_format rtree schedule schema_name schemas second_microsecond security sensitive separator serializable server share show slave slow snapshot soname spatial sql_big_result sql_buffer_result sql_cache sql_calc_found_rows sql_no_cache sql_small_result ssl starting starts std stddev stddev_pop stddev_samp storage straight_join subclass_origin sum suspend table_name table_statistics tables tablespace terminated triggers truncate uncommitted uninstall unlock upgrade use use_frm user_resources user_statistics utc_date utc_time utc_timestamp variables views warnings xa xor year_month zerofill";
    const MySQLTypes = SQLTypes + "bool blob long longblob longtext medium mediumblob mediumint mediumtext tinyblob tinyint tinytext text bigint int1 int2 int3 int4 int8 float4 float8 varbinary varcharacter precision datetime unsigned signed";
    const MySQLBuiltin = "charset clear edit ego help nopager notee nowarning pager print prompt quit rehash source status system tee";
@@ -23869,7 +23909,6 @@
          }
          const type = 'text/plain';
          let text = window.sqlFetch.result.columns.map((header) => {
-           console.log(header.includes(delimiter));
            if (typeof header === 'string' && (header.includes('"') || header.includes(delimiter))) {
              return `"${header.replaceAll('"', '""')}"`
            } else {
@@ -23912,10 +23951,35 @@
      });
      const schemas = Object.entries(window.metadata.schemas);
      const editorSchema = {};
+     const tables = [];
+     const hasTableAliases = Object.keys(window.metadata.table_aliases).length > 0;
      schemas.forEach(([schemaName, schema]) => {
        Object.entries(schema.tables).forEach(([tableName, table]) => {
          const qualifiedTableName = schemas.length === 1 ? tableName : `${schemaName}.${tableName}`;
-         editorSchema[qualifiedTableName] = Object.keys(table.columns);
+         const columns = Object.keys(table.columns);
+         editorSchema[qualifiedTableName] = columns;
+         const alias = window.metadata.table_aliases[tableName];
+         if (alias) {
+           editorSchema[alias] = columns;
+           tables.push({
+             label: qualifiedTableName,
+             detail: alias,
+             alias_type: 'with',
+             quoted: '`' + qualifiedTableName + '` ' + alias,
+             unquoted: `${qualifiedTableName} ${alias}`
+           });
+           tables.push({
+             label: qualifiedTableName,
+             detail: alias,
+             alias_type: 'only',
+             quoted: '`' + alias + '`',
+             unquoted: alias
+           });
+         } else {
+           tables.push({
+             label: qualifiedTableName
+           });
+         }
        });
      });
      // I prefer to use Cmd-Enter/Ctrl-Enter to submit the query. Here I am replacing the default mapping.
@@ -23948,6 +24012,80 @@
        ...completionKeymap,
        ...lintKeymap
      ]);
+     const sqlConfig = {
+       dialect: MySQL,
+       upperCaseKeywords: true,
+       schema: editorSchema,
+       tables
+     };
+     const scs = schemaCompletionSource(sqlConfig);
+     const sqlExtension = new LanguageSupport(
+       MySQL.language,
+       [
+         MySQL.language.data.of({
+           autocomplete: (context) => {
+             const result = scs(context);
+             if (!hasTableAliases || !result?.options) return result
+
+             const tree = syntaxTree(context.state);
+             let node = tree.resolveInner(context.pos, -1);
+
+             // We are trying to identify the case where we are autocompleting a table name after "from" or "join"
+             // TODO: we don't handle the case where a user typed "select table.foo from". In that case we probably
+             // shouldn't autocomplete the alias. Though, if the user typed "select table.foo, t.bar", we won't know
+             // what to do.
+             // TODO: if table aliases aren't enabled, we don't need to override autocomplete.
+
+             if (node?.name === 'Statement') {
+               // The node can be a Statement if the cursor is at the end of "from " and there is a complete
+               // statement in the editor (semicolon present). In that case we want to find the node just before the
+               // current position so that we can check whether it is "from" or "join".
+               node = node.childBefore(context.pos);
+             } else if (node?.name === 'Script') {
+               // It seems the node can sometimes be a Script if the cursor is at the end of the last statement in the
+               // editor and the statement doesn't end in a semicolon. In that case we can find the last statement in the
+               // Script so that we can check whether it is "from" or "join".
+               node = node.lastChild?.childBefore(context.pos);
+             } else if (['Identifier', 'QuotedIdentifier', 'Keyword'].includes(node?.name)) {
+               // If the node is an Identifier, we might be in the middle of typing the table name. If the node is a
+               // Keyword but isn't "from" or "join", we might be in the middle of typing a table name that is similar
+               // to a Keyword, for instance "orders" or "selections" or "fromages". In these cases, look for the previous
+               // sibling so that we can check whether it is "from" or "join".
+               node = node.prevSibling;
+             }
+
+             const nodeText = node ? context.state.doc.sliceString(node.from, node.to).toLowerCase() : null;
+             if (node?.name === 'Keyword' && ['from', 'join'].includes(nodeText)) {
+               result.options = result.options.filter((option) => {
+                 return option.alias_type === undefined || option.alias_type === 'with'
+               });
+             } else {
+               result.options = result.options.filter((option) => {
+                 return option.alias_type === undefined || option.alias_type === 'only'
+               });
+             }
+             result.options = result.options.map((option) => {
+               // Some shenanigans. If the default autocomplete function quoted the label, we want to ensure the quote
+               // only applies to the table name and not the alias. You might think we could do this by overriding the
+               // apply function but apply is set to null when quoting.
+               // See https://github.com/codemirror/lang-sql/blob/ebf115fffdbe07f91465ccbd82868c587f8182bc/src/complete.ts#L90
+               if (option.alias_type) {
+                 if (option.label.match(/^`.*`$/)) {
+                   option.apply = option.quoted;
+                 } else {
+                   option.apply = option.unquoted;
+                 }
+               }
+               return option
+             });
+             return result
+           }
+         }),
+         MySQL.language.data.of({
+           autocomplete: keywordCompletionSource(MySQL, true)
+         })
+       ]
+     );
      window.editorView = new EditorView({
        state: EditorState.create({
          extensions: [
@@ -23969,11 +24107,7 @@
            highlightActiveLine(),
            highlightSelectionMatches(),
            editorKeymap,
-           sql({
-             dialect: MySQL,
-             upperCaseKeywords: true,
-             schema: editorSchema
-           }),
+           sqlExtension,
            fixedHeightEditor,
            placeholder('Let\'s query!')
          ]
@@ -24161,6 +24295,12 @@
          while (tablesElement.firstChild) {
            tablesElement.removeChild(tablesElement.firstChild);
          }
+         while (columnsElement.firstChild) {
+           columnsElement.removeChild(columnsElement.firstChild);
+         }
+         while (indexesElement.firstChild) {
+           indexesElement.removeChild(indexesElement.firstChild);
+         }
          const schemaName = schemasElement.value;
          const schema = window.metadata.schemas[schemaName];
          const tableNames = Object.keys(schema.tables);

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: sqlui
 version: !ruby/object:Gem::Version
-  version: 0.1.38
+  version: 0.1.39
 platform: ruby
 authors:
 - Nick Dower
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2022-11-15 00:00:00.000000000 Z
+date: 2022-11-18 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: mysql2