iway1 / react-ts-form

https://react-ts-form.com
MIT License
2.01k stars 33 forks source link

Improve z.array(z.enum([])) and z.enum([]).array() #112

Open bartoszgolebiowski opened 1 year ago

bartoszgolebiowski commented 1 year ago

Hello, amazing lib. I see the field to improve it.

Currently, we have something like this:

const Colors = ["red", "green", "blue"] as const;

const FavoriteColor = z.enum(Colors).array(); // 
// const FavoriteColor = z.array().enum(Colors)

const mapping = [
  [FavoriteColor, MultiCheckbox],
] as const; 

const Schema = z.object({
  favoriteColor: FavoriteColor.describe("Favorite Color"),
});

const MultiCheckbox = (props: { options: string[] }) => {
  const { options } = props;
  ...
}

Const App = ()=> 
    <MyForm
      form={form}
      schema={Schema}
      props={{
        favoriteColor: {
          options: FavoriteColor._def.type.options,  
        },
      }}
    />

It works, but I want it to look like this!

const Colors = ["red", "green", "blue"] as const;

const FavoriteColor = z.enum(Colors).array(); // 
// const FavoriteColor = z.array().enum(Colors)

const mapping = [
  [FavoriteColor, MultiCheckbox],
] as const; 

const Schema = z.object({
  favoriteColor: FavoriteColor.describe("Favorite Color"),
});

const MultiCheckbox = () => {
  const options = useEnumValues();
  ...
}

Const App = ()=> 
    <MyForm
      form={form}
      schema={Schema}
    />

I added PR with a proposition for it. Functionality + tests.

bartoszgolebiowski commented 1 year ago

https://github.com/iway1/react-ts-form/pull/113

bartoszgolebiowski commented 1 year ago

I just linked my local repo with this newly added functionality and it looks like it works.