Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove custom element generators in favor of another implementation #59

Open
Phanabani opened this issue Nov 10, 2022 · 0 comments
Open
Labels
breaking Something that will require a major version bump feature A new feature high effort Something that will likely require a lot of effort

Comments

@Phanabani
Copy link
Collaborator

Phanabani commented Nov 10, 2022

Based on discussion in #56 (comment). I might need some clarification because I'm not sure I understand everything. The following is my interpretation.

Definitions

Using the following function/component and types:

function CustomInput({inputUsageType, keyPath, depth, name, originalValue, dataType}) {
  switch (dataType) {
    case DataType.Boolean:
      return <input type="checkbox" />
    default:
      return <input type="text" />
  }
}

<JsonTree inputElement={CustomInput} />
type InputElementProps = {
  inputUsageType: InputUsageType;
  keyPath: string[];
  depth: number;
  name: string;
  originalValue: unknown;
  dataType: DataType;
};

Options

Use a render prop

type Props = {
  inputElement: (InputElementProps) => React.Component;
};

function JsonValue({ inputElement }: Props) {
  // ...
  return (
    <div style={styles.container}>
      {inputElement({ inputUsageType, keyPath, depth, name, originalValue, dataType })}
    </div>
  )
}

Pass a component

type Props = {
  inputElement: React.Component<InputElementProps>;
};

function JsonValue({ inputElement: InputElement }: Props) {
  // ...
  return (
    <div style={styles.container}>
      <InputElement {...{ inputUsageType, keyPath, depth, name, originalValue, dataType }} />
    </div>
  )
}
@Phanabani Phanabani added feature A new feature high effort Something that will likely require a lot of effort breaking Something that will require a major version bump labels Nov 10, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
breaking Something that will require a major version bump feature A new feature high effort Something that will likely require a lot of effort
Projects
None yet
Development

No branches or pull requests

1 participant