ContentKit
The ContentKit framework allows you to build integrations that work from directly within the GitBook UI. It is used to define interactive layouts for Custom Blocks, Configurations flows, etc.
This means you can bring your workflows and/or product into GitBook, making it easy for teammates and customers to see information or take actions that aren't specifically to do with GitBook.
{
"type": "button",
"label": "Click me",
"onPress": { "action": "something" }
}
import { createIntegration, createComponent } from '@gitbook/runtime';
const helloWorldBlock = createComponent({
componentId: 'hello-world',
initialState: {
message: 'Say hello!'
},
action: async (previous, action) => {
switch (action.action) {
case 'say':
return { state: { message: 'Hello world' } };
}
},
render: async ({ props, state }) => {
return (
<block>
<button label={state.message} onPress={{ action: 'say' }} />
</block>
);
}
});
export default createIntegration({
components: [helloWorldBlock]
});
Inspired by React, ContentKit relies on a core concept: Components. A component represent an element of the UI rendered with specific properties (
props) and updated through actions impacting its local state (state).Components are being created using
createComponent.Last modified 4mo ago