S
SolidJS•2y ago
Baptiste

Register custom component props without default values

Currently, I need to give default values to component properties if I want them to be registered: 
customElement(
    'typebot-standard',
    {
      apiHost: '',
      isPreview: false,
      resultId: '',
      startGroupId: '',
      prefilledVariables: {},
      typebotId: '',
    },
    Bot
  )
customElement(
    'typebot-standard',
    {
      apiHost: '',
      isPreview: false,
      resultId: '',
      startGroupId: '',
      prefilledVariables: {},
      typebotId: '',
    },
    Bot
  )
But that's really not convenient. Is there a way to register props without default values?
1 Reply
jesseb34r
jesseb34r•2y ago
this is pretty cleanly handled by types: 
import { Component } from 'solid-js';

type MyComponentProps = {
  apiHost: string;
  isPreview: boolean;
  resultId: string;
  startGroupId: string;
  prefilledVariables: Record<string, unknown>;
  typebotId: string;
}

const MyComponent: Component<MyComponentProps> = (props) => {/* component logic */}
import { Component } from 'solid-js';

type MyComponentProps = {
  apiHost: string;
  isPreview: boolean;
  resultId: string;
  startGroupId: string;
  prefilledVariables: Record<string, unknown>;
  typebotId: string;
}

const MyComponent: Component<MyComponentProps> = (props) => {/* component logic */}
and if you want your component to accept children you can use ParentComponent instead of Component
Want results from more Discord servers?
Add your server
More Posts
how to make a route working after page reloadHello! I bumped into a nasty problem with solid-route. It works while I'm surfing from the root padisposing of a `createRoot` nested inside a `createEffect`?I am creating a nested effect, like: ```ts createEffect(() => { // create nested effect creSSR build failingI'm attempting to get solid SSR working with deno via `esbuild` and `esbuild-plugin-solid`. In ordersolid-router nested routes - access child params from parent componentIt seems like a parent component can't access the full set of params - it can't see params for childMath.random() overwritten on hydrationI have a skeleton component which I want to have a slight randomness to its width, so I have ```tsx how to add package to https://www.solidjs.com/ecosystem?I made a package and would like to add it to the solidjs website. Is there a write-up somewhere how