0.0.3 • Published 4 years ago
react-copyweasel v0.0.3
React CopyWeasel
A React client for CopyWeasel, a micro-CMS copy manager.
Installation
Install with either yarn
or npm
:
yarn add react-copyweasel
or
npm i react-copyweasel
Usage
react-copyweasel
depends on the addition of a context provider in
your React tree. The provider takes an API key for your CopyWeasel
account:
import {CopyProvider} from 'react-copyweasel'
const COPYWEASEL_API_KEY = '...'
function MyApp({children}) {
return (
<CopyProvider apiKey={COPYWEASEL_API_KEY}>
{children}
</CopyProvider>
)
}
With that in place, copy may be used from your CopyWeasel account by
way of the Copy
component:
import {Copy} from 'react-copyweasel'
function MyComponent({children}) {
const copyContext = {...}
return (
<Copy copyKey="my-heading" context={copyContext} />
)
}
Defeault Copy
In case of a missing copy key, or an incompatible set of context data,
default copy may be specified as child components to Copy
:
import {Copy} from 'react-copyweasel'
function MyComponent({children}) {
const copyContext = {...}
return (
<Copy copyKey="my-heading" context={copyContext}>
This is the default copy.
</Copy>
)
}
Specifying the Component
By default, Copy
uses a span
element. However any element string,
or React component, may be provided to use in its stead:
import {Copy} from 'react-copyweasel'
function MyComponent({children}) {
const copyContext = {...}
return (
<Copy as="h1" copyKey="my-heading" context={copyContext} />
)
}