Web Inspector: Styles Redesign: hook up autocompletion to property names and values
authornvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 13 Oct 2017 17:14:22 +0000 (17:14 +0000)
committernvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 13 Oct 2017 17:14:22 +0000 (17:14 +0000)
commit9d795018d7889bed1e8e6bb9ad68881c91b061bc
tree1b2bd4d3f3f5ef42490a4a2a77afdfaccdd3d466
parenta0467dfd758656f28180c0cbca913f1324f06557
Web Inspector: Styles Redesign: hook up autocompletion to property names and values
https://bugs.webkit.org/show_bug.cgi?id=177313
<rdar://problem/34577057>

Reviewed by Joseph Pecoraro.

- Arrow Right accept the current completion item and places the text caret after it.
- Arrow Left hides the completion popover.
- Arrow Up selects the previous completion item.
- Arrow Down selects the next completion item.
- Enter and Tab accept the current completion item and navigate to the next focusable item.
- Escape hides the completion popover, if there is one.

* UserInterface/Views/CompletionSuggestionsView.js:
(WI.CompletionSuggestionsView):
(WI.CompletionSuggestionsView.prototype._mouseDown):
Add a preventBlur option so clicking on an completion item doesn't change the focus and
doesn't cause "blur" event on the target text field.

* UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:
(.spreadsheet-style-declaration-editor .completion-hint):
* UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js:
(WI.SpreadsheetCSSStyleDeclarationEditor):
(WI.SpreadsheetCSSStyleDeclarationEditor.prototype.layout):
(WI.SpreadsheetCSSStyleDeclarationEditor.prototype.detached):
Call detached on every SpreadsheetTextField to hide CompletionSuggestionsView once
SpreadsheetCSSStyleDeclarationEditor is removed from the DOM.

(WI.SpreadsheetCSSStyleDeclarationEditor.prototype._addBlankProperty):
Remove index argument since it is no longer used.

* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty):
(WI.SpreadsheetStyleProperty.prototype.detached):
(WI.SpreadsheetStyleProperty.prototype._remove):
(WI.SpreadsheetStyleProperty.prototype._update):
(WI.SpreadsheetStyleProperty.prototype._nameCompletionDataProvider):
(WI.SpreadsheetStyleProperty.prototype._valueCompletionDataProvider):
Add an extra parameter to SpreadsheetTextField to pass a completion data provider.

* UserInterface/Views/SpreadsheetTextField.js:
(WI.SpreadsheetTextField):
(WI.SpreadsheetTextField.prototype.get suggestionHint):
(WI.SpreadsheetTextField.prototype.set suggestionHint):
(WI.SpreadsheetTextField.prototype.startEditing):
(WI.SpreadsheetTextField.prototype.stopEditing):
(WI.SpreadsheetTextField.prototype.detached):
(WI.SpreadsheetTextField.prototype.completionSuggestionsSelectedCompletion):
(WI.SpreadsheetTextField.prototype.completionSuggestionsClickedCompletion):
(WI.SpreadsheetTextField.prototype._getPrefix):
(WI.SpreadsheetTextField.prototype._handleBlur):
(WI.SpreadsheetTextField.prototype._handleKeyDown):
(WI.SpreadsheetTextField.prototype._handleKeyDownForSuggestionView):
(WI.SpreadsheetTextField.prototype._handleInput):
(WI.SpreadsheetTextField.prototype._updateCompletions):
(WI.SpreadsheetTextField.prototype._getCaretRect):
(WI.SpreadsheetTextField.prototype._getCompletionPrefix):
(WI.SpreadsheetTextField.prototype._applyCompletionHint):
(WI.SpreadsheetTextField.prototype._hideCompletions):
Provide text completion based on the existing CompletionSuggestionsView when completionProvider is passed to SpreadsheetTextField.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@223283 268f45cc-cd09-0410-ab3c-d52691b4dbfc
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/CompletionSuggestionsView.js
Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css
Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js
Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js
Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js