Skip to content

Commit d5cac87

Browse files
Merge pull request #10 from markusguenther/rename-scoped-npm-package
TASK: Rename to a npm scoped package
2 parents 268f436 + 4748224 commit d5cac87

File tree

5 files changed

+18
-19
lines changed

5 files changed

+18
-19
lines changed

README.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
[![npm version](https://img.shields.io/npm/v/for-react-css-themr.svg?style=flat-square)](https://www.npmjs.com/package/for-react-css-themr)
2-
[![Build Status](http://img.shields.io/travis/FriendsOfReactJS/for-react-css-themr/master.svg?style=flat-square)](https://travis-ci.org/FriendsOfReactJS/for-react-css-themr)
3-
[![NPM Status](http://img.shields.io/npm/dm/for-react-css-themr.svg?style=flat-square)](https://www.npmjs.com/package/for-react-css-themr)
1+
[![npm version](https://img.shields.io/npm/v/@friendsofreactjs/react-css-themr.svg?style=flat-square)](https://www.npmjs.com/package/@friendsofreactjs/react-css-themr)
2+
[![Build Status](http://img.shields.io/travis/FriendsOfReactJS/@friendsofreactjs/react-css-themr/master.svg?style=flat-square)](https://travis-ci.org/FriendsOfReactJS/@friendsofreactjs/react-css-themr)
3+
[![NPM Status](http://img.shields.io/npm/dm/@friendsofreactjs/react-css-themr.svg?style=flat-square)](https://www.npmjs.com/package/@friendsofreactjs/react-css-themr)
44

55
# Friends of react: React CSS Themr
66

@@ -9,13 +9,13 @@
99
This is a fork of React CSS Themr, that is not maintained anymore. We thank Javi Velasco for all his efforts and for
1010
creating such a great package. This package should not be unmaintained - so the friends of react will continue.
1111
12-
Sadly Javi did not responed so we can not continue with the same package name. You find us now on npm with the prefix `for-`.
12+
Sadly Javi did not responed so we can not continue with the same package name. You find us now on npm with the prefix/scope `@friendsofreactjs`.
1313
```
1414

1515
Easy theming and composition for CSS Modules.
1616

1717
```
18-
$ npm install --save for-react-css-themr
18+
$ npm install --save @friendsofreactjs/react-css-themr
1919
```
2020

2121
**Note: Feedback and contributions on the docs are highly appreciated.**
@@ -30,7 +30,7 @@ Taking ideas from [future-react-ui](https://github.com/nikgraf/future-react-ui)
3030

3131
The most immediate way of providing a classname object is via *props*. In case you want to import a component with a theme already injected, you have to write a higher order component that does the job. This is ok for your own components, but for ui-kits like [React Toolbox](http://www.react-toolbox.com) or [Belle](http://nikgraf.github.io/belle/), you'd have to write a wrapper for every single component you want to use. In this fancy, you can understand the theme as a **set** of related classname objects for different components. It makes sense to group them together in a single object and move it through the component tree using a context. This way, you can provide a theme either via **context**, **hoc** or **props**.
3232

33-
The approach of for-react-css-themr consists of a *provider* and a *decorator*. The provider sets a context theme. The decorator adds to your components the logic to figure out which theme should be used or how should it be composed, depending on configuration, context and props.
33+
The approach of @friendsofreactjs/react-css-themr consists of a *provider* and a *decorator*. The provider sets a context theme. The decorator adds to your components the logic to figure out which theme should be used or how should it be composed, depending on configuration, context and props.
3434

3535
## Combining CSS modules
3636

@@ -49,7 +49,7 @@ Say you have a `Button` component you want to make themeable. You should pass a
4949
```jsx
5050
// Button.js
5151
import React, { Component } from 'react';
52-
import { themr } from 'for-react-css-themr';
52+
import { themr } from '@friendsofreactjs/react-css-themr';
5353

5454
@themr('MyThemedButton')
5555
class Button extends Component {
@@ -88,7 +88,7 @@ If you use a component with a base theme, you may want to import the component w
8888
```jsx
8989
// SuccessButton.js
9090
import React, { Component } from 'react';
91-
import { themr } from 'for-react-css-themr';
91+
import { themr } from '@friendsofreactjs/react-css-themr';
9292
import successTheme from './SuccessButton.css';
9393

9494
@themr('MySuccessButton', successTheme)
@@ -137,7 +137,7 @@ Although context theming is not limited to ui-kits, it's very useful to avoid de
137137
```jsx
138138
import React from 'react';
139139
import { render } from 'react-dom';
140-
import { ThemeProvider } from 'for-react-css-themr';
140+
import { ThemeProvider } from '@friendsofreactjs/react-css-themr';
141141
import App from './app'
142142

143143
const contextTheme = {
@@ -182,4 +182,4 @@ Thanks to [Nik Graf](http://www.twitter.com/nikgraf) and [Mark Dalgleish](http:/
182182
183183
## License
184184
185-
This project is licensed under the terms of the [MIT license](https://github.com/FriendsOfReactJS/for-react-css-themr/blob/master/LICENSE).
185+
This project is licensed under the terms of the [MIT license](https://github.com/FriendsOfReactJS/@friendsofreactjs/react-css-themr/blob/master/LICENSE).

index.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from "react";
22

3-
declare module "react-css-themr" {
3+
declare module "@friendsofreactjs/react-css-themr" {
44
type TReactCSSThemrTheme = {
55
[key: string]: string | TReactCSSThemrTheme
66
}

package.json

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
2-
"name": "for-react-css-themr",
2+
"name": "@friendsofreactjs/react-css-themr",
33
"description": "Friends of ReactJS: React CSS Themr",
4-
"homepage": "https://github.com/FriendsOfReactJS/for-react-css-themr#readme",
4+
"homepage": "https://github.com/FriendsOfReactJS/@friendsofreactjs/react-css-themr#readme",
55
"version": "2.1.2",
66
"main": "./lib",
77
"author": {
@@ -11,18 +11,17 @@
1111
},
1212
"repository": {
1313
"type": "git",
14-
"url": "git+https://github.com/FriendsOfReactJS/for-react-css-themr.git"
14+
"url": "git+https://github.com/FriendsOfReactJS/@friendsofreactjs/react-css-themr.git"
1515
},
1616
"bugs": {
17-
"url": "https://github.com/FriendsOfReactJS/for-react-css-themr/issues"
17+
"url": "https://github.com/FriendsOfReactJS/@friendsofreactjs/react-css-themr/issues"
1818
},
1919
"keywords": [
2020
"css-modules",
2121
"customization",
2222
"react",
2323
"react-css-themr",
2424
"theming",
25-
"for-react-css-themr",
2625
"friends of react"
2726
],
2827
"dependencies": {

src/components/themr.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ export default (componentName, localTheme, options = {}) => (ThemedComponent) =>
9494
if (!themeNamespace) return theme
9595

9696
if (themeNamespace && !theme) {
97-
throw new Error('Invalid themeNamespace use in for-react-css-themr. ' +
97+
throw new Error('Invalid themeNamespace use in friendsofreactjs/react-css-themr. ' +
9898
'themeNamespace prop should be used only with theme prop.')
9999
}
100100

@@ -266,7 +266,7 @@ function merge(original = {}, mixin = {}) {
266266
function validateComposeOption(composeTheme) {
267267
if ([ COMPOSE_DEEPLY, COMPOSE_SOFTLY, DONT_COMPOSE ].indexOf(composeTheme) === -1) {
268268
throw new Error(
269-
`Invalid composeTheme option for for-react-css-themr. Valid composition options\
269+
`Invalid composeTheme option for friendsofreactjs/react-css-themr. Valid composition options\
270270
are ${COMPOSE_DEEPLY}, ${COMPOSE_SOFTLY} and ${DONT_COMPOSE}. The given\
271271
option was ${composeTheme}`
272272
)

test/components/themr.spec.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -351,7 +351,7 @@ describe('Themr decorator function', () => {
351351
<ProviderMock theme={theme}>
352352
<Container themeNamespace="container"/>
353353
</ProviderMock>
354-
)).toThrow(/Invalid themeNamespace use in for-react-css-themr. themeNamespace prop should be used only with theme prop./)
354+
)).toThrow(/Invalid themeNamespace use in friendsofreactjs\/react-css-themr. themeNamespace prop should be used only with theme prop./)
355355
})
356356

357357
it('when providing a themeNamespace prop composes a theme', () => {

0 commit comments

Comments
 (0)