You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This project was inspired by some work with the [:nail_care:styled components](https://www.styled-components.com/) library. In creating a component that I will never use, I needed to provide the consumer with a way to pass down styles that I can then merge into various component definitions above my own css rules.
7
+
This project was inspired by some work with the [:nail_care:styled components](https://www.styled-components.com/) library. In creating a component that I will never use, I needed to provide the consumer with a way to pass down styles that I can then merge into various component definitions along with my own css rules.
8
8
9
-
Just in case, this package also exposes the ability to generate additional syntax parsers that can then be used with the primary export or as stand-alone string parsing functions.
9
+
Just in case, this package also exposes the ability to access or generate additional syntax parsers that can then be used with the primary export or as stand-alone string parsing functions.
10
10
11
11
## Usage
12
12
13
13
### Basic Usage
14
14
15
+
#### Without styled-components
16
+
15
17
```javascript
16
18
importstyleToCssfrom'style-obj-to-css-string';
17
19
// I now regret my choice in package name
@@ -26,7 +28,52 @@ const styles = {
26
28
conststyleString=styleToCss(styles);
27
29
/**
28
30
* Generates all values as a single semicolon separated string
${/* Place properties that you will allow to be overwritten here - typically stylistic properties */}
43
+
color: meduimaquamarine;
44
+
font-size: 1rem;
45
+
background-color: thistle;
46
+
${props=>props.styles&&styleToCss(props.styles) /* we check for styles to avoid an invocation with undefined. may be fixed with future pull requests. */}
47
+
${/* Place properties that you will not allow to change here - typically structural properties */}
48
+
display: block;
49
+
margin: 1rem;
50
+
grid-column: 1 / -1;
51
+
`;
52
+
```
53
+
54
+
### Advanced Usage
55
+
56
+
This library can also be useful in parsing JSON from servers that might use other case-conventions. Simply bring in our list of `parsers` in your import or make your own with our `createParser` function!
57
+
58
+
**parsers** - An object containing multiple parse methods.
**createParser** - A function that return a parsing function.
64
+
65
+
- createParser(matcher: string | RegExp, replacer: Function): Function - generates a parser function as seen in parsers. Note: replacer uses the same syntax as the second parameter for [String.prototype.replace](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#Specifying_a_function_as_a_parameter) (the first argument is the matched value)
I use [commitlint](https://github.com/conventional-changelog/commitlint) to lint git commits according to the [conventional changelog](https://github.com/conventional-changelog/commitlint/blob/master/%40commitlint/config-conventional/README.md). If you're as lazy as I am, feel free to use [commitizen cli](https://github.com/commitizen/cz-cli) either with your own installation or with `npm run cz` - if your commit still fails commitlint's rules, you can run `npm run cz -- --retry`.
53
100
54
-
#### :fire_engine:In Case of Emergency:fire_engine:
101
+
#### :fire:In Case of Emergency:fire:
55
102
56
-
Just in case something happens that forces you to run away from your computer screaming, just run `npm run fire`, which will create a new branch called "emergency", commit all of your current changes, and then push them to a new branch on your origin remote.
103
+
Just in case something happens that forces you to run away from your computer screaming, just run `npm run fire`, which will create a new branch called "emergency", commit all of your current changes, and then push them to a new branch on your origin remote.:fire_engine:
0 commit comments