`Autocomplete` First Attempt (Not Working Yet)

[psygo]

I have a personal project in which I would like to use MUI's Autocomplete component. So I decided to try to make a contribution to this project. However, this specific component seems very challenging.

This is not working at this point, and I left it this way so hopefully someone sheds some light on the following questions.

1. I'm trying to use something like pnpm codemod mui2suid --package-name material --name Autocomplete in order to generate the code for the Autocomplete component, but the files are not generated, despite my logs saying they were:

   > suid@1.0.0 codemod /home/phili/Code/suid
   > node --no-warnings --loader ts-node/esm packages/codemod/src/bin.ts "mui2suid" "--package-name" "material" "--name" "Autocomplete"
   
   # node_modules/.mui-source/material-ui-5.5.0/packages/mui-material/src/Autocomplete/autocompleteClasses.ts » packages/material/src/Autocomplete/autocompleteClasses.ts
   # node_modules/.mui-source/material-ui-5.5.0/packages/mui-material/src/Autocomplete/Autocomplete.d.ts » packages/material/src/Autocomplete/AutocompleteProps.tsx
   # node_modules/.mui-source/material-ui-5.5.0/packages/mui-material/src/Autocomplete/Autocomplete.js » packages/material/src/Autocomplete/Autocomplete.tsx
   # node_modules/.mui-source/material-ui-5.5.0/packages/mui-material/src/Autocomplete/index.d.ts » packages/material/src/Autocomplete/index.tsx

2. I think I have a beginner-to-intermediate knowledge of SolidJS and I'm starting to think it's not gonna be enough for this specific component. More specifically due to useAutocomplete's dependence on things like useEventCallback, useControlled, useEnhancedEffect, etc. Is there a way for me to convert those via codemod mui2suid?

   • I've tried using pnpm codemod mui2suid --package-name utils --name useEventCallback for example, but got this:

     > suid@1.0.0 codemod /home/phili/Code/suid
     > node --no-warnings --loader ts-node/esm packages/codemod/src/bin.ts "mui2suid" "--package-name" "utils" "--name" "useEventCallback"
     
     file:///home/phili/Code/suid/packages/codemod/src/actions/mui2suid.ts:221
       if (!files) throw new Error(`No files found`);
                         ^
     Error: No files found
         at mui2suid (file:///home/phili/Code/suid/packages/codemod/src/actions/mui2suid.ts:221:21)

---

Due to my limited expertise, could someone help me on how to transpile from React to Solid the following examples? I think they might help other future contributors as well.

1. Should we create a codemod mui2suid function for useEnhancedEffect/useLayoutEffect based on this Ryan Carniato's comment?
2. useEventCallback transpiles to... totally unnecessary?
3. For useControlled, is it basically simply eliminating useCallback; transforming useRefs to let; and useState to a createSignal?

[evertheylen]

This would be great :open_mouth: . I'm a bit low on time right now, but in a few weeks I think I can try to help.

(Btw, maybe you should mark this as a draft PR?)

[psygo]

(Btw, maybe you should mark this as a draft PR?)

True that. I forgot about that feature.