├── .gitignore ├── LICENSE ├── README.md ├── lib ├── parse-code.js └── vue-hyperclick.js └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | .DS_Store 3 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 Monterail 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vue-hyperclick 2 | 3 | ![vue-hyperclick in action](https://frizi.xyz/externals/vue-hyperclick-demo.gif) 4 | 5 | A hyperclick provider for Vue components that lets you jump to where variables are defined. 6 | 7 | Supports jumping between all combinations of `*.vue` and `*.js` files 8 | 9 | ## installation 10 | 11 | Install via atom or apm: 12 | ``` 13 | apm install vue-hyperclick 14 | ``` 15 | -------------------------------------------------------------------------------- /lib/parse-code.js: -------------------------------------------------------------------------------- 1 | "use babel" 2 | 3 | const splitRE = /\r?\n/g; 4 | 5 | function padContent(block, fullSrc) { 6 | // make sure actual code blocks have preserved position (row, col, charId) 7 | var offsetLines = block.content.slice(0, block.start).split(splitRE).length; 8 | var offsetChars = block.start - offsetLines; 9 | return Array(offsetChars + 2).join(' ') + 10 | Array(offsetLines).join('\n') + 11 | fullSrc.slice(block.start, block.end); 12 | } 13 | 14 | export default function padCode(code, isVue) { 15 | const compiler = require('vue-template-compiler') 16 | 17 | const output = compiler.parseComponent(code); 18 | return padContent(output.script, code); 19 | } 20 | -------------------------------------------------------------------------------- /lib/vue-hyperclick.js: -------------------------------------------------------------------------------- 1 | "use babel" 2 | 3 | import { CompositeDisposable } from 'atom' 4 | import padCode from './parse-code' 5 | 6 | const isVueGrammar = (grammar) => grammar.scopeName === 'text.html.vue' 7 | 8 | const patchedEditors = new WeakMap() 9 | function patchEditor(editor) { 10 | if (patchedEditors.has(editor)) { 11 | return patchedEditors.get(editor) 12 | } 13 | 14 | function patchGetGrammar (...args) { 15 | // force js-hyperclick to accept vue file 16 | const grammar = editor.getGrammar(...args) 17 | if (isVueGrammar(grammar)) { 18 | return { 19 | ...grammar, 20 | scopeName: 'source.js' 21 | } 22 | } 23 | return grammar 24 | } 25 | 26 | function patchGetText (...args) { 27 | // strip vue files to plain javascript for js-hyperclick 28 | const text = editor.getText(...args) 29 | const isVue = isVueGrammar(editor.getGrammar()) 30 | if (isVue) { 31 | return padCode(text) 32 | } 33 | return text 34 | } 35 | 36 | const patched = new Proxy(editor, { 37 | get (target, key) { 38 | if (key === 'getGrammar') { 39 | return patchGetGrammar 40 | } 41 | else if (key === 'getText') { 42 | return patchGetText 43 | } 44 | return target[key] 45 | } 46 | }) 47 | 48 | patchedEditors.set(editor, patched) 49 | return patched 50 | } 51 | 52 | function makeProvider(ctx) { 53 | const jsHyperclick = require('../../js-hyperclick') 54 | const provider = jsHyperclick.getProvider.call(ctx) 55 | 56 | return { 57 | ...provider, 58 | priority: 2, // larger than js-hyperclick 59 | providerName:'vue-hyperclick', 60 | getSuggestionForWord(textEditor, text, range) { 61 | const result = provider.getSuggestionForWord(patchEditor(textEditor), text, range) 62 | 63 | if (result && result.callback) { 64 | // patch editor returned from async atom.workspace.open 65 | return { 66 | ...result, 67 | callback (...args) { 68 | const origOpen = atom.workspace.open 69 | try { 70 | atom.workspace.open = function (...args) { 71 | return origOpen.apply(this, args).then(patchEditor) 72 | } 73 | const ret = result.callback.apply(this, args) 74 | return ret 75 | } 76 | finally { 77 | atom.workspace.open = origOpen 78 | } 79 | } 80 | } 81 | } 82 | 83 | return result 84 | } 85 | } 86 | } 87 | 88 | module.exports = { 89 | activate() { 90 | this.subscriptions = new CompositeDisposable() 91 | }, 92 | getProvider() { 93 | if(atom.packages.isPackageLoaded('js-hyperclick')) { 94 | return makeProvider(this) 95 | } 96 | else { 97 | atom.notifications.addError('vue-hyperclick: This package requires js-hyperclick to function.'); 98 | return null; 99 | } 100 | }, 101 | deactivate() { 102 | this.subscriptions.dispose() 103 | } 104 | } 105 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vue-hyperclick", 3 | "main": "./lib/vue-hyperclick", 4 | "version": "0.2.0", 5 | "description": "A hyperclick provider for Vue components that lets you jump to where variables are defined.", 6 | "keywords": [], 7 | "repository": "https://github.com/monterail/atom-vue-hyperclick", 8 | "license": "MIT", 9 | "engines": { 10 | "atom": ">=1.0.0 <2.0.0" 11 | }, 12 | "providedServices": { 13 | "hyperclick.provider": { 14 | "versions": { 15 | "0.0.0": "getProvider" 16 | } 17 | } 18 | }, 19 | "moduleRoots": [ 20 | "lib" 21 | ], 22 | "dependencies": { 23 | "vue-template-compiler": "^2.0.0-rc.3" 24 | }, 25 | "devDependencies": { 26 | "eslint": "^3.7.0" 27 | }, 28 | "package-deps": ["language-vue", "js-hyperclick"] 29 | } 30 | --------------------------------------------------------------------------------