Smart Clicks ^{VS Code}

Smart selection with double clicks for VS Code.

GIF Demo

Usage

Double clicks on the code.

Rules

bracket-pair

Pair to inner content of brackets.

▽
(foo, bar)
 └──────┘

dash

- to identifier.

   ▽
foo-bar
└─────┘

html-attr

= to HTML attribute.

          ▽





     └─────────┘

html-element

< to the entire element.

▽









└────────────────────┘

html-tag-pair

Open and close tags of a HTML element.

 ▽









 └─┘              └─┘

js-arrow-fn

=> to arrow function.

       ▽
(a, b) => a + b
└─────────────┘

js-assign

= to assignment.

        ▽
const a = []
└──────────┘

class B {
    ▽
  b = 1;
  └────┘
    ▽
  ba = () => {};
  └────────────┘
}

js-block

Blocks like if, for, while, etc. in JavaScript.

▽
function () {     }
└─────────────────┘

▽
import { ref } from 'vue'
└───────────────────────┘

This rule is disabled by default.

js-colon

: to the value.

     ▽
{ foo: { bar } }
       └─────┘

jsx-tag-pair

Matches JSX elements' start and end tags.

  ▽
(<Flex.Item>Hi</Flex.Item>)
  └───────┘     └───────┘

Configuration

All the rules are enabled by default. To disable a specific rule, set the rule to false in smartClicks.rules of your VS Code settings:

// settings.json
{
  "smartClicks.rules": {
    "dash": false,
    "html-element": false,
    "js-block": true
  }
}

Commands

ID	Description
smartClicks.trigger	Trigger Smart Clicks in current cursor position without mouse click

Usage examples:

1. Command palette

Invoke the command palette by typing Ctrl+Shift+P and then typing Smart Clicks: Trigger.

1. Keyboard shortcuts

jsonc // keybindings.json { "key": "ctrl+alt+c", "command": "smartClicks.trigger", "when": "editorTextFocus" }

1. Vim keybindings (VSCodeVim is needed)

jsonc // settings.json { "vim.normalModeKeyBindings": [ { "before": ["leader", "c"], "commands": ["smartClicks.trigger"], } ] }

Sponsors

Credits

Inspired by HBuilderX, initiated by 恐粉龙.

License

MIT License © 2022 Anthony Fu