React Toolbox Snippets

#REACT TOOLBOX SNIPPETS

Library reference: http://react-toolbox.com/

##Getting Started

1. Open VSCode
2. Open command palette CMD + P
3. Type "ext install react-toolbox-snippets"
4. Restart

##Shortcuts | Code | Component Represented | URL |------|-----------------------------------|-----------------------------------------------------------------------------------------------| |rtab→| AppBar | http://react-toolbox.com/#/components/app_bar | |rtac→| AutoComplete | http://react-toolbox.com/#/components/autocomplete | |rta→| Avatar | http://react-toolbox.com/#/components/avatar | |rtb→| Button | http://react-toolbox.com/#/components/button | |rtca→| Card | http://react-toolbox.com/#/components/card | |rtch→| Chip | http://react-toolbox.com/#/components/chip | |rtcb→| Checkbox | http://react-toolbox.com/#/components/checkbox | |rtdp→| DatePicker | http://react-toolbox.com/#/components/date_picker | |rtdi→| Dialog | http://react-toolbox.com/#/components/dialog | |rtdr→| Drawer | http://react-toolbox.com/#/components/drawer | |rtdd→| DropDown | http://react-toolbox.com/#/components/dropdown| |rtfi→| Font Icon | http://react-toolbox.com/#/components/font_icon | |rti→| Input | http://react-toolbox.com/#/components/input | |rtl→| Layout | http://react-toolbox.com/#/components/layout | |rtli→| Link | http://react-toolbox.com/#/components/link | |rtm→| Menu | http://react-toolbox.com/#/components/menu | |rtn→| Navigation | http://react-toolbox.com/#/components/navigation | |rtpb→| Progress Bar | http://react-toolbox.com/#/components/progress_bar | |rtrb→| Radio Buttons | http://react-toolbox.com/#/components/radio_group | |rtr→| Ripple | http://react-toolbox.com/#/components/ripple | |rts→| Slider | http://react-toolbox.com/#/components/slider | |rtsb→| SnackBar | http://react-toolbox.com/#/components/snackbar | |rtsw→| Switch | http://react-toolbox.com/#/components/switch | |rttable→| Table | http://react-toolbox.com/#/components/table | |rttabs→| Tabs | http://react-toolbox.com/#/components/tabs | |rttt→| ToolTips | http://react-toolbox.com/#/components/tooltip | |rttp→| Time Picker | http://react-toolbox.com/#/components/time_picker |

##Simple Naming Mnemonic "Simple" = component where name collision doesn't occur in acronym.

Every key command shortcut is a combination of:
[1] The library acronym (in this case, ReactToolbox = rt)
[2] The name of the command (in this case, commands refer to Component names)

Example

rtab = React Toolbox App Bar 

##Complex Naming Mnemonic "Complex" refers to any place where a naming collision occurs.

###One Letter Collision In the event of a naming collision (e.g. rtc = React Toolbox CARD or CHIP?), the second letter of the last word shall be appended. For every collision at nth letter, append a subsequent letter.
Example

rtca = React Toolbox Card
rtch = React Toolbox Chip

###Two Letter Collision Append the last letter of the last word in descending alphabetical order
Example

rtl = React Toolbox Layout
rtli = React Toolbox Link
rtlis = React Toolbox List

###Three Letter Collision Still name collision after 3 letters? Spell out the word.
Example

rttable = React Toolbox Table
rttabs = React Toolbox Tabs