Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #7 from ansumanshah/lerna
Lerna init
- Loading branch information
Showing
42 changed files
with
380 additions
and
565 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,7 @@ | ||
.DS_Store | ||
npm-debug.log | ||
.idea | ||
node_modules | ||
dist | ||
*.log | ||
yarn.lock | ||
package-lock.json |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
{ | ||
"lerna": "2.1.2", | ||
"packages": [ | ||
"packages/*" | ||
], | ||
"version": "0.0.0" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,40 +1,5 @@ | ||
{ | ||
"name": "css-in-js", | ||
"main": "./lib/css-in-js", | ||
"version": "1.4.0", | ||
"description": "Autocomplete JS and React Native styles, and converting copied CSS to JS styles and vice versa", | ||
"repository": "https://github.com/ansumanshah/css-in-js", | ||
"license": "MIT", | ||
"providedServices": { | ||
"autocomplete.provider": { | ||
"versions": { | ||
"2.0.0": "getProvider" | ||
} | ||
} | ||
}, | ||
"scripts": { | ||
"update-css": "node scripts/css/completions.js", | ||
"update-rn": "node scripts/rn/completions.js" | ||
}, | ||
"keywords": [ | ||
"atom", | ||
"autocomplete", | ||
"react", | ||
"react-native", | ||
"glamourous", | ||
"glamour", | ||
"snippets" | ||
], | ||
"engines": { | ||
"atom": ">=1.0.0 <2.0.0" | ||
}, | ||
"dependencies": { | ||
"css": "^2.2.1", | ||
"stringify-object": "^3.2.0" | ||
}, | ||
"devDependencies": { | ||
"path": "^0.12.7", | ||
"react-docgen": "3.0.0-beta6", | ||
"request": "^2.81.0" | ||
} | ||
"devDependencies": { | ||
"lerna": "^2.1.2" | ||
} | ||
} |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,61 @@ | ||
# Atom Autocomplete for React Native and css-in-js [![Star on GitHub][github-star-badge]][github-star][![Tweet][twitter-badge]][twitter] | ||
|
||
[![PRs Welcome][prs-badge]][prs] | ||
[![Version][version-badge]][package] | ||
[![MIT License][license-badge]][LICENSE] | ||
|
||
Now get Autocomplete for CSSinJS libraries using object styles. | ||
|
||
## Installation | ||
``` | ||
apm install css-in-js | ||
``` | ||
Or go to Settings → Install and search for `css-in-js` | ||
|
||
<a href="https://app.codesponsor.io/link/jZ7oK2ZsGezatDv9YZW6fM3e/ansumanshah/css-in-js" rel="nofollow"><img src="https://app.codesponsor.io/embed/jZ7oK2ZsGezatDv9YZW6fM3e/ansumanshah/css-in-js.svg" style="width: 888px; height: 68px;" alt="Sponsor" /></a> | ||
|
||
## Usage | ||
```js | ||
const btnA = css({ /* styles */ }); | ||
const btnB = glamorous.div({ /* styles */ }); | ||
const btnC = StyleSheet.create({ /* styles */ }); | ||
``` | ||
Only works for these keywords by default you can edit in settings for more. | ||
|
||
`glamorous | css | StyleSheet.create` | ||
|
||
![ReactNative][native-demo] | ||
|
||
![Autocomplete][autocomplete-demo] | ||
|
||
Does not work for general objects | ||
```js | ||
let styles = { | ||
/* styles */ | ||
} | ||
``` | ||
This is basically a fork of [autocomplete-css](https://github.com/atom/autocomplete-css) | ||
|
||
<kbd>CTRL</kbd> + <kbd>ALT</kbd> + <kbd>J</kbd> to convert the css lines to js | ||
|
||
![Convert][converter-demo] | ||
|
||
Coming Soon | ||
|
||
*Codemods for easy shifting between css-in-js libraries* | ||
|
||
[autocomplete-demo]: https://github.com/ansumanshah/css-in-js/raw/master/cssinjs.gif | ||
[native-demo]: https://github.com/ansumanshah/css-in-js/raw/master/native.gif | ||
[converter-demo]: https://github.com/ansumanshah/css-in-js/raw/master/example.gif | ||
|
||
[github-star-badge]: https://img.shields.io/github/stars/ansumanshah/css-in-js.svg?style=social | ||
[github-star]: https://github.com/ansumanshah/css-in-js/stargazers | ||
[twitter]: https://twitter.com/intent/tweet?text=Check%20out%20Atom%20Autocomplete%20css-in-js!%20https://github.com/ansumanshah/css-in-js%20%F0%9F%91%8D | ||
[twitter-badge]: https://img.shields.io/twitter/url/https/github.com/ansumanshah/css-in-js.svg?style=social | ||
|
||
[version-badge]: https://img.shields.io/apm/v/css-in-js.svg?style=flat-square | ||
[package]: https://atom.io/packages/css-in-js | ||
[license-badge]: https://img.shields.io/apm/l/css-in-js.svg?style=flat-square | ||
[license]: https://github.com/ansumanshah/css-in-js/blob/master/LICENSE | ||
[prs-badge]: https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square | ||
[prs]: http://makeapullrequest.com |
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
{ | ||
"name": "css-in-js", | ||
"main": "./lib/css-in-js", | ||
"version": "1.4.0", | ||
"description": "Autocomplete JS and React Native styles, and converting copied CSS to JS styles and vice versa", | ||
"repository": "https://github.com/ansumanshah/css-in-js", | ||
"license": "MIT", | ||
"providedServices": { | ||
"autocomplete.provider": { | ||
"versions": { | ||
"2.0.0": "getProvider" | ||
} | ||
} | ||
}, | ||
"scripts": { | ||
"update-css": "node scripts/css/completions.js", | ||
"update-rn": "node scripts/rn/completions.js" | ||
}, | ||
"keywords": [ | ||
"atom", | ||
"autocomplete", | ||
"react", | ||
"react-native", | ||
"glamourous", | ||
"glamour", | ||
"snippets" | ||
], | ||
"engines": { | ||
"atom": ">=1.0.0 <2.0.0" | ||
}, | ||
"dependencies": { | ||
"css": "^2.2.1", | ||
"stringify-object": "^3.2.0" | ||
}, | ||
"devDependencies": { | ||
"path": "^0.12.7", | ||
"react-docgen": "3.0.0-beta6", | ||
"request": "^2.81.0" | ||
} | ||
} |
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
const getBeginningWhitespace = string => | ||
string.match(/^\s+/) !== null ? string.match(/^\s+/)[0] : ''; | ||
|
||
const isCSS = item => (item.match(/;/g) || []).length === 1; | ||
|
||
const isJS = item => (item.match(/,/g) || []).length === 1; | ||
|
||
const toHyphen = prop => | ||
prop.replace(/([A-Z])/g, char => `-${char[0].toLowerCase()}`); | ||
|
||
const toCamel = prop => | ||
prop.replace(/-(\w|$)/g, (dash, next) => next.toUpperCase()); | ||
|
||
const toJS = item => { | ||
const [prop, val] = item.split(':'); | ||
return `${getBeginningWhitespace(prop)}${toCamel( | ||
prop.trim() | ||
)}: '${val.trim().replace(';', '')}',`; | ||
}; | ||
|
||
const toCSS = item => { | ||
const [prop, val] = item.split(':'); | ||
return `${getBeginningWhitespace(prop)}${toHyphen( | ||
prop.trim() | ||
)}: ${val.trim().replace(/'|,/g, '')};`; | ||
}; | ||
|
||
export default function convert(s) { | ||
const lines = s.split('\n'); | ||
return lines | ||
.map(item => (isCSS(item) ? toJS(item) : isJS(item) ? toCSS(item) : item)) | ||
.join('\n'); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
{ | ||
"name": "css-in-js-helpers", | ||
"version": "1.0.0", | ||
"description": "CSS in JS helpers", | ||
"main": "index.js", | ||
"scripts": {}, | ||
"repository": { | ||
"type": "git", | ||
"url": "git+https://github.com/ansumanshah/css-in-js.git" | ||
}, | ||
"keywords": [ | ||
"CSSinJS" | ||
], | ||
"author": "Ansuman Shah", | ||
"license": "MIT", | ||
"bugs": { | ||
"url": "https://github.com/ansumanshah/css-in-js/issues" | ||
}, | ||
"homepage": "https://github.com/ansumanshah/css-in-js#readme" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
{ | ||
"presets": ["es2015"] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
{} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
{ | ||
"version": "0.1.0", | ||
"configurations": [ | ||
{ | ||
"name": "Launch Extension", | ||
"type": "extensionHost", | ||
"request": "launch", | ||
"runtimeExecutable": "${execPath}", | ||
"args": ["--extensionDevelopmentPath=${workspaceRoot}" ], | ||
"stopOnEntry": false | ||
} | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
{} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
## 0.3.0 | ||
- Add support for typescript files | ||
|
||
## 0.2.1 | ||
- Update package.json info for marketplace | ||
|
||
## 0.2.0 | ||
- Change current line if nothing is selected | ||
|
||
## 0.1.0 | ||
- Add in keyboard shortcut for converting text | ||
|
||
## 0.0.2 | ||
- Change header color for VS Code marketplace | ||
|
||
## 0.0.1 | ||
- Initial release |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
# Convert CSS in JS | ||
|
||
> Convert kebab-case CSS to camelCase CSS and vice versa | ||
Converts CSS between regular CSS syntax (strings) and CSS-in-JS syntax (style objects) | ||
|
||
![demo](https://user-images.githubusercontent.com/737065/28219279-6ffbf4c4-6889-11e7-8d3d-51637fe90856.gif) | ||
|
||
|
||
## How to Use | ||
|
||
Select some block of text in a `javascript` or `typescript` file and use `cmd+shift+p` to bring up the command palette, then select `Convert CSS-in-JS`. | ||
|
||
Or use the keyboard shortcut `cmd+shift+j` (`ctrl+shift+j` on Windows). | ||
|
||
# Thanks | ||
|
||
Thanks to [Ansuman Shah](https://github.com/ansumanshah) for making [css-in-js](https://github.com/ansumanshah/css-in-js) for Atom. I basically copied what was done in that repo. 😃 | ||
|
||
--- | ||
|
||
MIT | ||
|
||
© 2017 Paul Molluzzo |
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
{ | ||
"compilerOptions": { | ||
"module": "commonjs", | ||
"target": "es6", | ||
"lib": [ | ||
"es6" | ||
] | ||
}, | ||
"exclude": [ | ||
"node_modules" | ||
] | ||
} |
Oops, something went wrong.