Custom component templates

💬 App Building
1

Hi! Could you kindly share one or more templates of custom components that are more comprehensive with more functionality, so every customer/dev doesn't have to figure it out for ourselves?

e.g. you can simply publish the React behind a lot of your existing components e.g. timeline. So, zero effort from your end, hopefully!

Thank you!

1 Like
2

Hey @Ori

While I cannot provide specific templates or source code directly, you can find guidance on building your own custom components in the Retool documentation.

To get started, you can clone the custom-component-collection-template which serves as a basic foundation for building custom components. From there, you can extend the functionality as needed. For example, a simple custom component might look like this:

export const HelloWorldComponent: FC = () => {
  const [name, setName] = Retool.useStateString({
    name: "name",
  });

  return (
    <div>
      <div>Hello {name}!</div>
    </div>
  );
};

You can explore various examples and functionalities available in the Retool documentation, especially in the Custom components section, which offers a TypeScript API for defining events and properties.

For more complex use cases, refer to the Retool documentation on custom component libraries where you can learn how to expand your library and pass data between your Retool app and your components. You can check out the guide here.

You can ask me if you want something specific.

1 Like
3

Sure but the template is so basic. It would save tons of people tons of time to have a more involved template! I'm sure you have examples from the components native to retool - it'd be awesome (and 0 effort) to share those or variants of those!!

4

Hey @Ori! This is a good callout and something that others have asked for, as well. While it doesn't specifically address your request, you can see examples of some slightly more complex custom components over here.

The primary issue with open-sourcing our component code is that it is highly integrated into the rest of the code base through the use of hooks, etc. and thus not very modular. It would require a fair bit of work to publish them in a usable plug-and-play format, but it's still feedback worth surfacing. :+1:

5

I'm with you @Ori,

@sarahs, maybe this could be an idea for a monthly challenge, and for entries to be saved in a repository that other users can use.

2 Likes