├── .gitignore ├── src ├── icons │ ├── code.svg │ ├── http.svg │ ├── read.svg │ ├── monitor.svg │ ├── nano.svg │ ├── shell.svg │ ├── npm.svg │ ├── yarn.svg │ ├── compile.svg │ ├── php.svg │ ├── git.svg │ ├── bq.svg │ ├── python.svg │ ├── index.js │ ├── micro.svg │ ├── rails.svg │ ├── clojure.svg │ ├── java.svg │ ├── mysql.svg │ ├── coffee.svg │ ├── nodejs.svg │ ├── curl.svg │ ├── perl.svg │ ├── vim.svg │ ├── bower.svg │ ├── ruby.svg │ ├── atom.svg │ ├── nginx.svg │ ├── less.svg │ ├── gulp.svg │ ├── yo.svg │ ├── psql.svg │ ├── go.svg │ ├── grunt.svg │ ├── composer.svg │ └── docker.svg ├── constants │ ├── mapColors.js │ └── mapIcons.js ├── index.js └── TabIcon │ ├── tabIconHoc.js │ └── index.js ├── rollup.config.js ├── package.json └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | /npm-debug.log 3 | /dist 4 | -------------------------------------------------------------------------------- /src/icons/code.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /src/icons/http.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /src/constants/mapColors.js: -------------------------------------------------------------------------------- 1 | export default { 2 | bash: '#FFF', 3 | docker: '#0EB7ED', 4 | 'docker-compose': '#0EB7ED', 5 | fish: '#D8494F', 6 | nodejs: '#7EBF00', 7 | node: '#7EBF00', 8 | npm: '#C12127', 9 | rails: '#CC0000', 10 | ruby: '#CC342D', 11 | shell: '#FFF', 12 | zsh: '#C5DB00', 13 | python: '#FFDF59', 14 | vim: '#007f00', 15 | yarn: '#2C8EBB', 16 | }; 17 | -------------------------------------------------------------------------------- /src/icons/read.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /src/icons/monitor.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/nano.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 9 | -------------------------------------------------------------------------------- /src/icons/shell.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/npm.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/yarn.svg: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import TabIcon from './TabIcon'; 3 | 4 | export TabIcon from './TabIcon'; 5 | 6 | export const getTabProps = (uid, parentProps, props) => { 7 | const newProps = { ...props }; 8 | newProps.text = ( 9 | 10 | 11 | {props.text} 12 | 13 | ); 14 | return newProps; 15 | }; 16 | 17 | export const getTabsProps = (parentProps, props) => { 18 | if (props.tabs.length !== 1 || typeof props.tabs[0].title !== 'string') return props; 19 | const newProps = { ...props }; 20 | newProps.tabs[0].title = ( 21 | 22 | 23 | {props.tabs[0].title} 24 | 25 | ); 26 | return newProps; 27 | }; 28 | -------------------------------------------------------------------------------- /src/constants/mapIcons.js: -------------------------------------------------------------------------------- 1 | export default { 2 | compile: [ 3 | 'cc', 4 | 'ccache', 5 | 'clang', 6 | 'gcc', 7 | 'gmake', 8 | 'make', 9 | 'xcodebuild', 10 | ], 11 | clojure: [ 12 | 'lein', 13 | 'planck', 14 | 'lumo', 15 | ], 16 | docker: [ 17 | 'docker-compose', 18 | ], 19 | git: [ 20 | 'git-remote-ftp', 21 | 'git-remote-ftps', 22 | 'git-remote-http', 23 | 'git-remote-https', 24 | ], 25 | http: [ 26 | 'wget', 27 | 'http', 28 | ], 29 | monitor: [ 30 | 'htop', 31 | 'iftop', 32 | 'top', 33 | ], 34 | nodejs: [ 35 | 'node', 36 | ], 37 | ruby: [ 38 | 'irb', 39 | 'sidekiq', 40 | 'rake', 41 | ], 42 | shell: [ 43 | 'bash', 44 | 'fish', 45 | 'zsh', 46 | ], 47 | code: [ 48 | 'pico', 49 | ], 50 | read: [ 51 | 'tail', 52 | 'less', 53 | 'more', 54 | ], 55 | }; 56 | -------------------------------------------------------------------------------- /src/icons/compile.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/php.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/git.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/bq.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 7 | 11 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/icons/python.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/index.js: -------------------------------------------------------------------------------- 1 | // React is imported here because it is used by the SVG React components below 2 | import React from 'react'; // eslint-disable-line no-unused-vars 3 | 4 | export atom from './atom.svg'; 5 | export bower from './bower.svg'; 6 | export bq from './bq.svg'; 7 | export clojure from './clojure.svg'; 8 | export code from './code.svg'; 9 | export coffee from './coffee.svg'; 10 | export compile from './compile.svg'; 11 | export composer from './composer.svg'; 12 | export curl from './curl.svg'; 13 | export docker from './docker.svg'; 14 | export git from './git.svg'; 15 | export go from './go.svg'; 16 | export grunt from './grunt.svg'; 17 | export gulp from './gulp.svg'; 18 | export http from './http.svg'; 19 | export java from './java.svg'; 20 | export less from './less.svg'; 21 | export micro from './micro.svg'; 22 | export monitor from './monitor.svg'; 23 | export mysql from './mysql.svg'; 24 | export nano from './nano.svg'; 25 | export nginx from './nginx.svg'; 26 | export nodejs from './nodejs.svg'; 27 | export npm from './npm.svg'; 28 | export perl from './perl.svg'; 29 | export php from './php.svg'; 30 | export psql from './psql.svg'; 31 | export python from './python.svg'; 32 | export rails from './rails.svg'; 33 | export read from './read.svg'; 34 | export ruby from './ruby.svg'; 35 | export shell from './shell.svg'; 36 | export vim from './vim.svg'; 37 | export yo from './yo.svg'; 38 | -------------------------------------------------------------------------------- /rollup.config.js: -------------------------------------------------------------------------------- 1 | import commonjs from 'rollup-plugin-commonjs'; 2 | import nodeResolve from 'rollup-plugin-node-resolve'; 3 | import babel from 'rollup-plugin-babel'; 4 | import { dependencies } from './package.json'; 5 | 6 | export default { 7 | input: './src/index.js', 8 | output: { 9 | file: './dist/index.js', 10 | format: 'cjs', 11 | sourcemap: true, 12 | }, 13 | plugins: [ 14 | commonjs(), 15 | nodeResolve(), 16 | babel({ 17 | babelrc: false, 18 | presets: [ 19 | [ 20 | 'env', 21 | { 22 | modules: false, 23 | targets: { 24 | node: '6', 25 | electron: '1.7', 26 | }, 27 | }, 28 | ], 29 | 'stage-0', 30 | 'react', 31 | ], 32 | plugins: [ 33 | 'external-helpers', 34 | 'styled-components', 35 | [ 36 | 'inline-react-svg', 37 | { 38 | svgo: { 39 | plugins: [ 40 | { 41 | removeAttrs: { 42 | attrs: '(data-name|fill|xmlns|height|width)', 43 | }, 44 | }, 45 | { 46 | cleanupIDs: true, 47 | }, 48 | ], 49 | }, 50 | }, 51 | ], 52 | ], 53 | }), 54 | ], 55 | external: Object.keys(dependencies), 56 | }; 57 | -------------------------------------------------------------------------------- /src/icons/micro.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 14 | 15 | -------------------------------------------------------------------------------- /src/icons/rails.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 15 | 16 | -------------------------------------------------------------------------------- /src/icons/clojure.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 16 | 17 | -------------------------------------------------------------------------------- /src/icons/java.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/mysql.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/coffee.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/nodejs.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/curl.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 7 | 11 | 15 | 17 | 19 | 20 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "hyper-tab-icons", 3 | "version": "2.1.0", 4 | "description": "Icons in the header tabs for the current running process in Hyper.app.", 5 | "main": "./dist/index.js", 6 | "files": [ 7 | "dist/index.js" 8 | ], 9 | "scripts": { 10 | "prebuild": "rimraf ./dist", 11 | "build": "rollup -c ./rollup.config.js", 12 | "prepublishOnly": "npm run build", 13 | "lint": "eslint -c ./package.json ./src" 14 | }, 15 | "repository": { 16 | "type": "git", 17 | "url": "git+https://github.com/dfrankland/hyper-tab-icons.git" 18 | }, 19 | "keywords": [ 20 | "hyperterm", 21 | "hyper", 22 | "tabs", 23 | "icons", 24 | "cool" 25 | ], 26 | "author": "Dylan Frankland ", 27 | "license": "MIT", 28 | "bugs": { 29 | "url": "https://github.com/dfrankland/hyper-tab-icons/issues" 30 | }, 31 | "homepage": "https://github.com/dfrankland/hyper-tab-icons#readme", 32 | "dependencies": { 33 | "fuzzaldrin": "^2.1.0", 34 | "prop-types": "^15.5.10", 35 | "react": "^15.6.1", 36 | "styled-components": "^2.1.2" 37 | }, 38 | "devDependencies": { 39 | "babel-core": "^6.26.0", 40 | "babel-eslint": "^8.0.0", 41 | "babel-plugin-external-helpers": "^6.22.0", 42 | "babel-plugin-inline-react-svg": "^0.4.0", 43 | "babel-plugin-styled-components": "^1.2.0", 44 | "babel-preset-env": "^1.6.0", 45 | "babel-preset-react": "^6.24.1", 46 | "babel-preset-stage-0": "^6.24.1", 47 | "eslint": "^4.7.2", 48 | "eslint-config-airbnb": "^15.1.0", 49 | "eslint-plugin-import": "^2.7.0", 50 | "eslint-plugin-jsx-a11y": "^5.1.1", 51 | "eslint-plugin-react": "^7.4.0", 52 | "rimraf": "^2.6.2", 53 | "rollup": "^0.50.0", 54 | "rollup-plugin-babel": "^3.0.2", 55 | "rollup-plugin-commonjs": "^8.2.1", 56 | "rollup-plugin-node-resolve": "^3.0.0" 57 | }, 58 | "eslintConfig": { 59 | "parser": "babel-eslint", 60 | "extends": "airbnb", 61 | "env": { 62 | "browser": true 63 | }, 64 | "rules": { 65 | "react/jsx-filename-extension": "off", 66 | "import/no-extraneous-dependencies": [ 67 | "error", 68 | { 69 | "devDependencies": [ 70 | "rollup.config.js" 71 | ] 72 | } 73 | ] 74 | } 75 | } 76 | } 77 | -------------------------------------------------------------------------------- /src/icons/perl.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/TabIcon/tabIconHoc.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import defaultMapColors from '../constants/mapColors'; 4 | 5 | const DEFAULT_ACTIVE_STYLE = { 6 | display: 'inline-block', 7 | marginRight: '0.25rem', 8 | transition: 'opacity 200ms ease-in', 9 | verticalAlign: 'middle', 10 | width: '1rem', 11 | }; 12 | 13 | const DEFAULT_INACTIVE_STYLE = { 14 | ...DEFAULT_ACTIVE_STYLE, 15 | opacity: 0.3, 16 | }; 17 | 18 | const getMappedActiveStyle = (config, name) => (active) => { 19 | const { 20 | activeStyle = DEFAULT_ACTIVE_STYLE, 21 | inactiveStyle = DEFAULT_INACTIVE_STYLE, 22 | disableColors = false, 23 | } = config; 24 | 25 | const mappedColors = { 26 | ...defaultMapColors, 27 | ...config.mapColors, 28 | }; 29 | 30 | let iconActiveColor = mappedColors[name]; 31 | let iconInactiveColor = mappedColors[name]; 32 | 33 | if (disableColors && typeof window !== 'undefined') { 34 | iconActiveColor = '#fff'; 35 | iconInactiveColor = '#ccc'; 36 | let activeElement = document.querySelector('.tabs_title > span > span'); 37 | let inactiveElement = activeElement; 38 | 39 | if (!activeElement) { 40 | activeElement = document.querySelector( 41 | '.tab_textActive > .tab_textInner > span > span', 42 | ); 43 | inactiveElement = document.querySelector( 44 | '.tab_text:not(.tab_textActive) > .tab_textInner > span > span', 45 | ); 46 | } 47 | 48 | if (activeElement) { 49 | iconActiveColor = window.getComputedStyle(activeElement).getPropertyValue('color'); 50 | } 51 | 52 | if (inactiveElement) { 53 | iconInactiveColor = window.getComputedStyle(inactiveElement).getPropertyValue('color'); 54 | } 55 | } 56 | 57 | return active ? { 58 | ...activeStyle, 59 | ...(iconActiveColor ? { fill: iconActiveColor } : {}), 60 | } : { 61 | ...inactiveStyle, 62 | ...(iconInactiveColor ? { fill: iconInactiveColor } : {}), 63 | }; 64 | }; 65 | 66 | export default config => (name, Component) => { 67 | const getActiveStyle = getMappedActiveStyle(config, name); 68 | 69 | const TabIcon = ({ active, ...props }) => ( 70 | 71 | ); 72 | 73 | TabIcon.propTypes = { 74 | active: PropTypes.bool, 75 | }; 76 | 77 | TabIcon.defaultProps = { 78 | active: true, 79 | }; 80 | 81 | return TabIcon; 82 | }; 83 | -------------------------------------------------------------------------------- /src/icons/vim.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/bower.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/ruby.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/TabIcon/index.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import { filter } from 'fuzzaldrin'; 4 | import * as icons from '../icons'; 5 | import defaultMapIcons from '../constants/mapIcons'; 6 | import tabIconHoc from './tabIconHoc'; 7 | 8 | const DEFAULT_PROCESS = 'shell'; 9 | 10 | const mapConfigToState = (newConfig = {}) => { 11 | const { tabIcons: config = {} } = newConfig; 12 | 13 | const mapIcons = { 14 | ...defaultMapIcons, 15 | ...(config.mapIcons || {}), 16 | }; 17 | 18 | const mappedTabIcons = Object.keys(icons).reduce( 19 | (allMappedTabIcons, nextIconKey) => { 20 | const icon = icons[nextIconKey]; 21 | return { 22 | ...allMappedTabIcons, 23 | [nextIconKey]: tabIconHoc(config)(nextIconKey, icon), 24 | ...( 25 | (mapIcons[nextIconKey] || []).reduce( 26 | (allMappedIcons, nextMappedIconKey) => ({ 27 | ...allMappedIcons, 28 | [nextMappedIconKey]: tabIconHoc(config)(nextMappedIconKey, icon), 29 | }), 30 | {}, 31 | ) 32 | ), 33 | }; 34 | }, 35 | {}, 36 | ); 37 | 38 | return { 39 | mappedTabIcons, 40 | mappedIconKeys: Object.keys(mappedTabIcons), 41 | processNameMatch: config.processNameMatch || 1, 42 | processNameRegex: typeof config.processNameRegex === 'object' ? ( 43 | new RegExp( 44 | config.processNameRegex.source || /^(.*?) /, 45 | config.processNameRegex.flags || '', 46 | ) 47 | ) : ( 48 | /^(.*?) / 49 | ), 50 | }; 51 | }; 52 | 53 | export default class extends Component { 54 | static propTypes = { 55 | title: PropTypes.string.isRequired, 56 | } 57 | 58 | constructor(props) { 59 | super(props); 60 | this.state = mapConfigToState(window.config.getConfig()); 61 | } 62 | 63 | componentDidMount() { 64 | window.config.subscribe(() => { 65 | this.setState(( 66 | mapConfigToState(( 67 | window.config.getConfig() 68 | )) 69 | )); 70 | }); 71 | } 72 | 73 | render() { 74 | const { title } = this.props; 75 | const { 76 | mappedTabIcons, 77 | mappedIconKeys, 78 | processNameMatch, 79 | processNameRegex, 80 | } = this.state; 81 | 82 | // Get mapped default icon 83 | const { 84 | [DEFAULT_PROCESS]: DEFAULT_ICON = icons[DEFAULT_PROCESS], 85 | } = mappedTabIcons; 86 | 87 | // Set the process name 88 | let processName = DEFAULT_PROCESS; 89 | const processNameMatches = title.match(processNameRegex); 90 | if ( 91 | Array.isArray(processNameMatches) && 92 | processNameMatches[processNameMatch] 93 | ) processName = processNameMatches[processNameMatch]; 94 | 95 | // Find icon name matching process name 96 | let match = DEFAULT_PROCESS; 97 | const results = filter(mappedIconKeys, processName, { maxResults: 1 }); 98 | if (results[0]) match = results[0]; 99 | 100 | // Retrieve icon component from matched icon name 101 | const { [match]: Icon = DEFAULT_ICON } = mappedTabIcons; 102 | 103 | return ; 104 | } 105 | } 106 | -------------------------------------------------------------------------------- /src/icons/atom.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/nginx.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/less.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/gulp.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/yo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/psql.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Hyper.app Tab Icons 2 | 3 | > Icons in the header tabs for the current running process in Hyper.app. 4 | 5 | ## How It Works 6 | 7 | Uses [fuzzaldrin][fuzzaldrin] to try to match the current tab title with the SVG 8 | icons that have been added to the repo, then displays the matched icon. Has the 9 | ability to map different icons and styles. 10 | 11 | [fuzzaldrin]: https://github.com/atom/fuzzaldrin 12 | 13 | ### Demo 14 | 15 | ![alt demo][demo gif] 16 | 17 | [demo gif]: http://i.giphy.com/pb6hCi4j0ErpC.gif 18 | 19 | ### Configuration 20 | 21 | There are few options to customize the different icons and styles applied. 22 | You may configure these inside of `~/.hyper.js`. 23 | 24 | #### `config.tabIcons.activeStyle` 25 | 26 | * Type: `object` 27 | * Default: 28 | ``` 29 | { 30 | display: 'inline-block', 31 | marginRight: '0.25rem', 32 | transition: 'opacity 200ms ease-in', 33 | verticalAlign: 'middle', 34 | width: '1rem', 35 | } 36 | ``` 37 | 38 | This object can be any [CSSStyleDeclaration][mdn css] allowed. Pass an inline 39 | style object [the same way you would with React][react inline-styles]. 40 | 41 | #### `config.tabIcons.inactiveStyle` 42 | 43 | * Type: `object` 44 | * Default: 45 | ```js 46 | { 47 | display: 'inline-block', 48 | marginRight: '0.25rem', 49 | transition: 'opacity 200ms ease-in', 50 | verticalAlign: 'middle', 51 | width: '1rem', 52 | opacity: 0.3, 53 | } 54 | ``` 55 | 56 | This object can be any [CSSStyleDeclaration][mdn css] allowed. Pass an inline 57 | style object [the same way you would with React][react inline-styles]. 58 | 59 | [mdn css]: https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/cssText 60 | [react inline-styles]: https://facebook.github.io/react/tips/inline-styles.html 61 | 62 | #### `config.tabIcons.mapIcons` 63 | 64 | * Type: `object` 65 | * Default: `{}` 66 | 67 | Map of icon to array of process names. Example: 68 | 69 | ```javascript 70 | { 71 | nodejs: ['node'], 72 | docker: ['docker-compose'], 73 | } 74 | ``` 75 | 76 | Look inside [`src/icons`][icons] for possible icons to map to. Look at 77 | [`src/constants/mapIcons.js`][mapIcons] for defaults. 78 | 79 | [icons]: https://github.com/dfrankland/hyper-tab-icons/tree/master/src/icons 80 | [mapIcons]: https://github.com/dfrankland/hyper-tab-icons/tree/master/src/constants/mapIcons.js 81 | 82 | #### `config.tabIcons.mapColors` 83 | 84 | * Type: `object` 85 | * Default: `{}` 86 | 87 | Map of process name to color string. Example: 88 | 89 | ```javascript 90 | { 91 | bash: '#FFF', 92 | fish: '#D8494F', 93 | zsh: '#C5DB00', 94 | } 95 | ``` 96 | 97 | Look at [`src/constants/mapColors.js`][mapColors] for defaults. 98 | 99 | [mapColors]: https://github.com/dfrankland/hyper-tab-icons/tree/master/src/constants/mapColors.js 100 | 101 | #### `config.tabIcons.disableColors` 102 | 103 | * Type: `boolean` 104 | * Default: `false` 105 | 106 | Toggles icon colors. Inherits color from current CSS applied to tab text 107 | _✨magically✨_. 108 | 109 | #### `config.tabIcons.processNameRegex` 110 | 111 | * Type: `object` 112 | * Default: `/^(.*?) /` 113 | 114 | The regex used to capture the process name in the title. 115 | 116 | _If you use something like `zsh` that swaps the process name and current working 117 | directory, the following regex should work: `/: (.*?)$/`._ 118 | 119 | > Alternatively, supply an object with the properties `source` and `flags`. 120 | > ```js 121 | > { 122 | > source: '^(.*?) ', 123 | > flags: '', 124 | > } 125 | > ``` 126 | 127 | #### `config.tabIcons.processNameMatch` 128 | 129 | * Type: `number` (integer) 130 | * Default: `1` 131 | 132 | The index of the match out of the array of matches made by 133 | `config.tabIcons.processNameRegex`. 134 | 135 | > An index of `0` is the full match made by the regex. An index of `1` or more 136 | > is used to get an exact match from one of the matching groups. 137 | 138 | ### Contribution 139 | 140 | There are an almost infinite amount of processes out there, so any help adding 141 | new icons, mapping colors, et cetera is greatly appreciated! 142 | 143 | ### Credit 144 | 145 | Inspired by [Atom's][atom] [`file-icons`][file-icons]. 146 | 147 | [atom]: http://atom.io/ 148 | [file-icons]: https://github.com/DanBrooker/file-icons 149 | -------------------------------------------------------------------------------- /src/icons/go.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/grunt.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/composer.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/icons/docker.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | --------------------------------------------------------------------------------