feat(packages/sui-studio): Add new param to use explicit import

[stivaliserna]

Description

This PR adds a new option --explicit to generate a component in a file with its same name and an index re-export, this makes searching easier while keeping cleaner imports.

Component
  src
    |--Component.js
    |--index.js

Beta: @s-ui/[email protected]

Feedback is much appreciated 🙂

[javiauso]

Maybe a more descriptive name would help, something like EXPLICIT_COMPONENT_JS_POINT_FILE

[stivaliserna]

Agree! 👌 Thanks Javi!

[arnau-rius]

Maybe we can go with the shorter version that mixes the rexport of default and named exports.

Suggested change

	const explicitImportTemplate = `import ${componentInPascal} from './${componentInPascal}.js'
	export default ${componentInPascal}
	`
	const explicitImportTemplate = `export {default} from './${componentInPascal}.js'
	`

Then if we want to export some named (for example: foo and bar) things inside the component would be much shorter:

const explicitImportTemplate = export {default, foo, bar} from './${componentInPascal}.js'`

[stivaliserna]

This is a proposal in stage 1, I checked and we use @babel/plugin-proposal-export-default-from to support it. If we're sure our infra will keep it, I'm ok with the change, but just want to double check 🙂

[arnau-rius]

If this is the new way of generating component, maybe we should create a script to modify also the already created components, so we just have one standard way of creating components. What do you think?

[stivaliserna]

If this is the new way of generating component, maybe we should create a script to modify also the already created components, so we just have one standard way of creating components. What do you think?

Yeah, makes sense! And we'll need to migrate the rest of components to actually solve our pain. Will work on it 👌

Thanks @arnau-rius!

[arnau-rius]

If this is the new way of generating component, maybe we should create a script to modify also the already created components, so we just have one standard way of creating components. What do you think?

Yeah, makes sense! And we'll need to migrate the rest of components to actually solve our pain. Will work on it 👌

Thanks @arnau-rius!

In case it gives you some guidance, here you can find two migrations that previously had been applied to the sui-studio, for cases similar to this one.

https://github.com/SUI-Components/sui/tree/master/packages/sui-studio/bin/migrations

• demo-folders
• test-folders

Maybe would be interesting to check that all marketplaces are OK with this new structure before coding/planning a migration.

👍🏽