Restore abbreviation for etch.dom
MODIFY
lib/find-view.js
lib/find-view.js
@@ -2,6 +2,7 @@ const _ = require('underscore-plus');
const {TextBuffer, TextEditor, CompositeDisposable} = require('atom');
const Util = require('./project/util');
const etch = require('etch');
+const $ = etch.dom;
module.exports =
class FindView {
@@ -28,63 +29,63 @@ class FindView {
render() {
return (
- etch.dom.div({tabIndex: -1, className: 'find-and-replace'},
- etch.dom.header({className: 'header'},
- etch.dom.span({ref: 'descriptionLabel', className: 'header-item description'},
+ $.div({tabIndex: -1, className: 'find-and-replace'},
+ $.header({className: 'header'},
+ $.span({ref: 'descriptionLabel', className: 'header-item description'},
'Find in Current Buffer'
),
- etch.dom.span({className: 'header-item options-label pull-right'},
- etch.dom.span({}, 'Finding with Options: '),
- etch.dom.span({ref: 'optionsLabel', className: 'options'}),
- etch.dom.span({className: 'btn-group btn-toggle btn-group-options'},
- etch.dom.button({ref: 'regexOptionButton', className: 'btn'},
- etch.dom.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-regex" />'})
+ $.span({className: 'header-item options-label pull-right'},
+ $.span({}, 'Finding with Options: '),
+ $.span({ref: 'optionsLabel', className: 'options'}),
+ $.span({className: 'btn-group btn-toggle btn-group-options'},
+ $.button({ref: 'regexOptionButton', className: 'btn'},
+ $.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-regex" />'})
),
- etch.dom.button({ref: 'caseOptionButton', className: 'btn'},
- etch.dom.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-case" />'})
+ $.button({ref: 'caseOptionButton', className: 'btn'},
+ $.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-case" />'})
),
- etch.dom.button({ref: 'selectionOptionButton', className: 'btn option-selection'},
- etch.dom.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-selection" />'})
+ $.button({ref: 'selectionOptionButton', className: 'btn option-selection'},
+ $.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-selection" />'})
),
- etch.dom.button({ref: 'wholeWordOptionButton', className: 'btn option-whole-word'},
- etch.dom.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-word" />'})
+ $.button({ref: 'wholeWordOptionButton', className: 'btn option-whole-word'},
+ $.svg({className: "icon", innerHTML: '<use href="#find-and-replace-icon-word" />'})
)
)
)
),
- etch.dom.section({className: 'input-block find-container'},
- etch.dom.div({className: 'input-block-item input-block-item--flex editor-container'},
- etch.dom(TextEditor, {
+ $.section({className: 'input-block find-container'},
+ $.div({className: 'input-block-item input-block-item--flex editor-container'},
+ $(TextEditor, {
ref: 'findEditor',
mini: true,
placeholderText: 'Find in current buffer',
buffer: this.findBuffer
}),
- etch.dom.div({className: 'find-meta-container'},
- etch.dom.span({ref: 'resultCounter', className: 'text-subtle result-counter'})
+ $.div({className: 'find-meta-container'},
+ $.span({ref: 'resultCounter', className: 'text-subtle result-counter'})
)
),
- etch.dom.div({className: 'input-block-item'},
- etch.dom.div({className: 'btn-group btn-group-find'},
- etch.dom.button({ref: 'nextButton', className: 'btn btn-next'}, 'Find')
+ $.div({className: 'input-block-item'},
+ $.div({className: 'btn-group btn-group-find'},
+ $.button({ref: 'nextButton', className: 'btn btn-next'}, 'Find')
),
- etch.dom.div({className: 'btn-group btn-group-find-all'},
- etch.dom.button({ref: 'findAllButton', className: 'btn btn-all'}, 'Find All')
+ $.div({className: 'btn-group btn-group-find-all'},
+ $.button({ref: 'findAllButton', className: 'btn btn-all'}, 'Find All')
)
)
),
- etch.dom.section({className: 'input-block replace-container'},
- etch.dom.div({className: 'input-block-item input-block-item--flex editor-container'},
- etch.dom(TextEditor, {
+ $.section({className: 'input-block replace-container'},
+ $.div({className: 'input-block-item input-block-item--flex editor-container'},
+ $(TextEditor, {
ref: 'replaceEditor',
mini: true,
placeholderText: 'Replace in current buffer',
@@ -92,18 +93,18 @@ class FindView {
})
),
- etch.dom.div({className: 'input-block-item'},
- etch.dom.div({className: 'btn-group btn-group-replace'},
- etch.dom.button({ref: 'replaceNextButton', className: 'btn btn-next'}, 'Replace')
+ $.div({className: 'input-block-item'},
+ $.div({className: 'btn-group btn-group-replace'},
+ $.button({ref: 'replaceNextButton', className: 'btn btn-next'}, 'Replace')
),
- etch.dom.div({className: 'btn-group btn-group-replace-all'},
- etch.dom.button({ref: 'replaceAllButton', className: 'btn btn-all'}, 'Replace All')
+ $.div({className: 'btn-group btn-group-replace-all'},
+ $.button({ref: 'replaceAllButton', className: 'btn btn-all'}, 'Replace All')
)
)
),
- etch.dom.svg({style: {display: 'none'}, innerHTML: `
+ $.svg({style: {display: 'none'}, innerHTML: `
<symbol id="find-and-replace-icon-regex" viewBox="0 0 20 16" stroke="none" fill-rule="evenodd">
<rect x="3" y="10" width="3" height="3" rx="1"></rect>
<rect x="12" y="3" width="2" height="9" rx="1"></rect>

MODIFY
lib/project-find-view.js
lib/project-find-view.js
@@ -6,6 +6,7 @@ const etch = require('etch');
const Util = require('./project/util');
const ResultsModel = require('./project/results-model');
const ResultsPaneView = require('./project/results-pane');
+const $ = etch.dom;
module.exports =
class ProjectFindView {
@@ -37,33 +38,33 @@ class ProjectFindView {
render() {
return (
- etch.dom.div({tabIndex: -1, className: 'project-find padded'},
- etch.dom.header({className: 'header'},
- etch.dom.span({ref: 'descriptionLabel', className: 'header-item description'}),
- etch.dom.span({className: 'header-item options-label pull-right'},
- etch.dom.span({}, 'Finding with Options: '),
- etch.dom.span({ref: 'optionsLabel', className: 'options'}),
- etch.dom.span({className: 'btn-group btn-toggle btn-group-options'},
- etch.dom.button({ref: 'regexOptionButton', className: 'btn option-regex'},
- etch.dom.svg({className: "icon", innerHTML: `<use xlink:href="#find-and-replace-icon-regex" />`})
+ $.div({tabIndex: -1, className: 'project-find padded'},
+ $.header({className: 'header'},
+ $.span({ref: 'descriptionLabel', className: 'header-item description'}),
+ $.span({className: 'header-item options-label pull-right'},
+ $.span({}, 'Finding with Options: '),
+ $.span({ref: 'optionsLabel', className: 'options'}),
+ $.span({className: 'btn-group btn-toggle btn-group-options'},
+ $.button({ref: 'regexOptionButton', className: 'btn option-regex'},
+ $.svg({className: "icon", innerHTML: `<use xlink:href="#find-and-replace-icon-regex" />`})
),
- etch.dom.button({ref: 'caseOptionButton', className: 'btn option-case-sensitive'},
- etch.dom.svg({className: "icon", innerHTML: `<use xlink:href="#find-and-replace-icon-case" />`})
+ $.button({ref: 'caseOptionButton', className: 'btn option-case-sensitive'},
+ $.svg({className: "icon", innerHTML: `<use xlink:href="#find-and-replace-icon-case" />`})
),
- etch.dom.button({ref: 'wholeWordOptionButton', className: 'btn option-whole-word'},
- etch.dom.svg({className: "icon", innerHTML:`<use xlink:href="#find-and-replace-icon-word" />`})
+ $.button({ref: 'wholeWordOptionButton', className: 'btn option-whole-word'},
+ $.svg({className: "icon", innerHTML:`<use xlink:href="#find-and-replace-icon-word" />`})
)
)
)
),
- etch.dom.section({ref: 'replacmentInfoBlock', className: 'input-block'},
- etch.dom.progress({ref: 'replacementProgress', className: 'inline-block'}),
- etch.dom.span({ref: 'replacmentInfo', className: 'inline-block'}, 'Replaced 2 files of 10 files')
+ $.section({ref: 'replacmentInfoBlock', className: 'input-block'},
+ $.progress({ref: 'replacementProgress', className: 'inline-block'}),
+ $.span({ref: 'replacmentInfo', className: 'inline-block'}, 'Replaced 2 files of 10 files')
),
- etch.dom.section({className: 'input-block find-container'},
- etch.dom.div({className: 'input-block-item input-block-item--flex editor-container'},
+ $.section({className: 'input-block find-container'},
+ $.div({className: 'input-block-item input-block-item--flex editor-container'},
etch.dom(TextEditor, {
ref: 'findEditor',
mini: true,
@@ -71,15 +72,15 @@ class ProjectFindView {
buffer: this.findBuffer
})
),
- etch.dom.div({className: 'input-block-item'},
- etch.dom.div({className: 'btn-group btn-group-find'},
- etch.dom.button({ref: 'findAllButton', className: 'btn'}, 'Find All')
+ $.div({className: 'input-block-item'},
+ $.div({className: 'btn-group btn-group-find'},
+ $.button({ref: 'findAllButton', className: 'btn'}, 'Find All')
)
)
),
- etch.dom.section({className: 'input-block replace-container'},
- etch.dom.div({className: 'input-block-item input-block-item--flex editor-container'},
+ $.section({className: 'input-block replace-container'},
+ $.div({className: 'input-block-item input-block-item--flex editor-container'},
etch.dom(TextEditor, {
ref: 'replaceEditor',
mini: true,
@@ -87,15 +88,15 @@ class ProjectFindView {
buffer: this.replaceBuffer
})
),
- etch.dom.div({className: 'input-block-item'},
- etch.dom.div({className: 'btn-group btn-group-replace-all'},
- etch.dom.button({ref: 'replaceAllButton', className: 'btn disabled'}, 'Replace All')
+ $.div({className: 'input-block-item'},
+ $.div({className: 'btn-group btn-group-replace-all'},
+ $.button({ref: 'replaceAllButton', className: 'btn disabled'}, 'Replace All')
)
)
),
- etch.dom.section({className: 'input-block paths-container'},
- etch.dom.div({className: 'input-block-item editor-container'},
+ $.section({className: 'input-block paths-container'},
+ $.div({className: 'input-block-item editor-container'},
etch.dom(TextEditor, {
ref: 'pathsEditor',
mini: true,

MODIFY
lib/project/list-view.js
lib/project/list-view.js
const etch = require('etch');
+const $ = etch.dom;
const resizeDetector = require('element-resize-detector');
module.exports = class ListView {
@@ -51,7 +52,7 @@ module.exports = class ListView {
const item = this.items[i];
const itemHeight = this.heightForItem(this.items[i], i);
children.push(
- etch.dom.div(
+ $.div(
{
style: {
position: 'absolute',
@@ -81,7 +82,7 @@ module.exports = class ListView {
}
}
- return etch.dom.div(
+ return $.div(
{
style: {
position: 'relative',
@@ -89,7 +90,7 @@ module.exports = class ListView {
overflow: 'auto',
}
},
- etch.dom.ol(
+ $.ol(
{
ref: 'list',
className: this.className,

MODIFY
lib/project/match-view.js
lib/project/match-view.js
const { Range, CompositeDisposable } = require('atom');
-const etch = require('etch')
-const {showIf} = require('./util')
+const etch = require('etch');
+const {showIf} = require('./util');
+const $ = etch.dom;
module.exports =
class MatchView {
@@ -49,7 +50,7 @@ class MatchView {
}
return (
- etch.dom.li(
+ $.li(
{
key: range.toString(),
dataset: {range: range.toString()},
@@ -62,19 +63,19 @@ class MatchView {
}
},
- etch.dom.span({className: 'line-number text-subtle'},
+ $.span({className: 'line-number text-subtle'},
range.start.row + 1
),
- etch.dom.span({className: 'preview', style: this.previewStyle},
- etch.dom.span({}, prefix),
- etch.dom.span({className: `match ${replacementText ? 'highlight-error' : 'highlight-info'}`},
+ $.span({className: 'preview', style: this.previewStyle},
+ $.span({}, prefix),
+ $.span({className: `match ${replacementText ? 'highlight-error' : 'highlight-info'}`},
this.match.matchText
),
- etch.dom.span({className: 'replacement highlight-success', style: showIf(replacementText)},
+ $.span({className: 'replacement highlight-success', style: showIf(replacementText)},
replacementText
),
- etch.dom.span({}, suffix)
+ $.span({}, suffix)
)
)
);

MODIFY
lib/project/result-view.js
lib/project/result-view.js
@@ -2,6 +2,7 @@ const FileIcons = require('../file-icons');
const MatchView = require('./match-view');
const path = require('path');
const etch = require('etch');
+const $ = etch.dom;
module.exports =
class ResultView {
@@ -83,7 +84,7 @@ class ResultView {
);
return (
- etch.dom.li(
+ $.li(
{
key: this.filePath,
dataset: {path: this.filePath},
@@ -95,16 +96,16 @@ class ResultView {
].join(' ').trim()
},
- etch.dom.div({ref: 'pathDetails', className: 'path-details list-item'},
- etch.dom.span({className: 'disclosure-arrow'}),
- etch.dom.span({
+ $.div({ref: 'pathDetails', className: 'path-details list-item'},
+ $.span({className: 'disclosure-arrow'}),
+ $.span({
className: iconClass.join(' ') + ' icon',
dataset: {name: path.basename(this.filePath)}
}),
- etch.dom.span({className: 'path-name bright'},
+ $.span({className: 'path-name bright'},
relativePath
),
- etch.dom.span({ref: 'description', className: 'path-match-number'},
+ $.span({ref: 'description', className: 'path-match-number'},
`(${this.matches.length} matches)`
)
),
@@ -138,7 +139,7 @@ class ResultView {
}
}
- return etch.dom.ol(
+ return $.ol(
{
ref: 'list',
className: 'matches list-tree',

MODIFY
lib/project/results-pane.js
lib/project/results-pane.js
@@ -3,6 +3,7 @@ const {CompositeDisposable} = require('atom');
const ResultsView = require('./results-view');
const {showIf, getSearchResultsMessage, escapeHtml} = require('./util');
const etch = require('etch');
+const $ = etch.dom;
module.exports =
class ResultsPaneView {
@@ -51,14 +52,14 @@ class ResultsPaneView {
const matchCount = this.searchResults && this.searchResults.matchCount;
return (
- etch.dom.div(
+ $.div(
{
tabIndex: -1,
className: `preview-pane pane-item ${matchCount === 0 ? 'no-results' : ''}`,
},
- etch.dom.div({className: 'preview-header'},
- etch.dom.span({
+ $.div({className: 'preview-header'},
+ $.span({
ref: 'previewCount',
className: 'preview-count inline-block',
innerHTML: this.isLoading
@@ -66,37 +67,37 @@ class ResultsPaneView {
: (getSearchResultsMessage(this.searchResults) || 'Project search results')
}),
- etch.dom.div(
+ $.div(
{
ref: 'previewControls',
className: 'preview-controls',
style: {visibility: matchCount > 0 ? 'visible' : 'hidden'}
},
- etch.dom.div({className: 'btn-group'},
- etch.dom.button({ref: 'collapseAll', className: 'btn'}, 'Collapse All'),
- etch.dom.button({ref: 'expandAll', className: 'btn'}, 'Expand All')
+ $.div({className: 'btn-group'},
+ $.button({ref: 'collapseAll', className: 'btn'}, 'Collapse All'),
+ $.button({ref: 'expandAll', className: 'btn'}, 'Expand All')
)
),
- etch.dom.div({className: 'inline-block', style: showIf(this.isLoading)},
- etch.dom.div({className: 'loading loading-spinner-tiny inline-block'}),
+ $.div({className: 'inline-block', style: showIf(this.isLoading)},
+ $.div({className: 'loading loading-spinner-tiny inline-block'}),
- etch.dom.div(
+ $.div(
{
className: 'inline-block',
style: showIf(this.isLoading && this.searchingIsSlow)
},
- etch.dom.span({ref: 'searchedCount', className: 'searched-count'},
+ $.span({ref: 'searchedCount', className: 'searched-count'},
this.numberOfPathsSearched.toString()
),
- etch.dom.span({}, ' paths searched')
+ $.span({}, ' paths searched')
)
)
),
- etch.dom.ul(
+ $.ul(
{
ref: 'errorList',
className: 'error-list list-group padded',
@@ -104,18 +105,18 @@ class ResultsPaneView {
},
...this.searchErrors.map(message =>
- etch.dom.li({className: 'text-error'}, escapeHtml(message))
+ $.li({className: 'text-error'}, escapeHtml(message))
)
),
etch.dom(ResultsView, {ref: 'resultsView', model: this.model}),
- etch.dom.ul(
+ $.ul(
{
className: 'centered background-message no-results-overlay',
style: showIf(matchCount === 0)
},
- etch.dom.li({}, 'No Results')
+ $.li({}, 'No Results')
)
)
);

MODIFY
lib/project/results-view.js
lib/project/results-view.js
@@ -3,6 +3,7 @@ const ResultView = require('./result-view');
const ListView = require('./list-view');
const etch = require('etch');
const resizeDetector = require('element-resize-detector');
+const $ = etch.dom;
const reverseDirections = {
left: 'right',
@@ -72,15 +73,15 @@ class ResultsView {
replacePattern = this.model.getFindOptions().replacePattern;
}
- return etch.dom.div(
+ return $.div(
{className: 'results-view focusable-panel', tabIndex: '-1'},
- etch.dom.ol(
+ $.ol(
{
className: 'list-tree has-collapsable-children',
style: {visibility: 'hidden', position: 'absolute', overflow: 'hidden', left: 0, top: 0, right: 0}
},
- etch.dom(ResultView, {
+ $(ResultView, {
ref: 'dummyResultView',
top: 0,
bottom: Infinity,
@@ -102,7 +103,7 @@ class ResultsView {
})
),
- etch.dom(ListView, {
+ $(ListView, {
ref: 'listView',
className: 'list-tree has-collapsable-children',
itemComponent: ResultView,

Restore abbreviation for etch.dom