Skip to content

Remove custom element generators in favor of another implementation #59

Open
@Phanabani

Description

@Phanabani

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>
  )
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    breakingSomething that will require a major version bumpfeatureA new featurehigh effortSomething that will likely require a lot of effort

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions