A React wrapper for embedding Retool apps.
npm install react-retoolA React wrapper for embedding Retool apps.
``
// with npm
$ npm install react-retool --save
// with yarn
$ yarn add react-retool
`
`
import Retool from 'react-retool';
function App() {
const sample = { name: 'Sample data' }
return (
data={sample}
/>
);
}
export default App;
`
expects a url prop pointing to an embedded Retool application. You can generate this URL in the editor mode of a Retool app by clicking "Share" then "Public".
will accept an optional data object, which is made available to the embedded application. When an embedded Retool application runs a Parent Window Query, will check if data contains a key matching the Parent Window Query's selector, and if so, return that value to the query.
will accept optional height and width props which will be used for the dimensions of the embedded window.
will accept an optional onData callback that will be called with the data of an event that is sent from the embedded Retool app. These events can be sent from a JavaScript query inside of Retool by using the parent.postMessage() syntax.
also accepts optional allow and sandbox parameters to configure permissions of the iframe used to embed the Retool app. allow-scripts and allow-same-origin are required in order to run Retool, so if sandbox is specified, allow-scripts and allow-same-origin will always be appended to ensure the Retool app works.
will accept an optional styling prop object that can be used to pass in styles to the iframe component.
Running yarn start will start an application with a basic Retool app embeded.
There is a live example here: https://react-retool.surge.sh
In the project directory, you can run:
Runs the app in the development mode.\
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.\
You will also see any lint errors in the console.
1. Bump version with npm version [major|minor|patch]
2. Run . This will build the project in the /dst directory./dst
3. Navigate to directory.npm publish
4. Publish to npm with
Tests exist in the /src/__tests__ directory. Running yarn test` will run the test suite.
Need help? Please report issues or requests to support@retool.com, through in app chat, or on https://community.retool.com/