0.0.6 • Published 5 months ago
react-canny v0.0.6
React Canny
Description
Canny.io integration for react
Installation
npm install react-canny
Usage
Feedback Widget
ℹ️ Widget component name changed from CannyWidget to CannyFeedback.
import {
CannyProvider,
CannyFeedback
} from "react-canny";
const APP_ID = "/* Your app id */";
const BOARD_TOKEN = "/* Tour token board */";
const SSO_TOKEN = "/* Your sso token */";
const App = () => {
return (
<CannyProvider appId={APP_ID}>
<CannyFeedback
basePath="/feedback"
boardToken={BOARD_TOKEN}
ssoToken={SSO_TOKEN} />
</CannyProvider>
);
};
Change Log Widget
import {
CannyProvider,
CannyChangelog
} from "react-canny";
const APP_ID = "/* Your app id */";
const LABEL_IDS = [/* Your label ids */];
const App = () => {
return (
<CannyProvider appId={APP_ID}>
<CannyChangelog
type="button"
className="change-log-button"
align="top"
position="left"
labelIDs={LABEL_IDS}>
Change Log
</CannyChangelog>
</CannyProvider>
);
};
Also, you can customize your change log button:
const APP_ID = "/* Your app id */";
const CustomButton = (props) => {
return (
<button {...props}
type="button"
className="my-custom-button" />
);
};
const App = () => {
return (
<CannyProvider appId={APP_ID}>
<CannyChangelog
component={CustomButton}>
Change Log
</CannyChangelog>
</CannyProvider>
);
};