I tried this plugin as a replacement for grapesjs-component-code-editor.

Unfortunately I bumped into a bug:
When I click on the apply button in the HTML section every CSS content that was previously in the CSS section gets dismissed.

It can be tried in the Demo: https://codepen.io/Anderson-Caldeireiro-Matias/pen/jOXrvgJ
Add a Text component which naturally has a 10px padding and try to edit the HTML content with the side panel. After applying, the padding gets dismissed.

With grapesjs-component-code-editor when I select a component that has a child component, the CSS editor field lists the CSS definiton of both components

this plugin however only lists the CSS of the currently selected component. This may be an intentional design choice.
But unfortunately when the parent component is selected and HTML content gets applied, the CSS definitions of the child element get dismissed.

Again I can see that this plugin has similarities with grapesjs-component-code-editor which updates the CSS editor field with this code part:

this.cssCodeEditor.setContent(this.editor.CodeManager.getCode(this.component, 'css', {
                cssc: this.editor.Css
            }));

You use the same solution only for the wrapper (root) component. I don't know for that reason, but maybe instead of using the

if (component.attributes.type === 'wrapper') 

the

if (component.components().length) 

as condition that handles CSS of nested components would be more approprate.

Unfortunately this is not enough as the CSS of the child component appears in the css editor field, but still doesn't get saved this way.

Hey @andcmatias

thanks for accepting my PRs

However when I updated the package I noticed that there is no new built version in the dist folder yet.
I tried to import the index.js from the src folder instead. But then I got an error in styles.scss

It seems to me that styles.scss is not a real scss file. I have sass interpreter in my project and it seems to me that you don't. Therefore I guess webpack doesn't try to interpret it as a real scss file.
If I remove the 'export default' line from the beginning and ticks, then another error occurs that it misses the $prefix variable.
If I rename it locally to styles.js it works as expected.

I'm not quite into scss but grapesjs-component-code-editor does this differently (it also has sass as dependency)

If you do not wish to bother to research and apply the scss handling, would you care to either rename the file to styles.js (and import it by that name in the index.js)
Or build and upload a new dist version?

Thx