How to add a prefix (prepend a name) to an entire module imported with @use in SASS?

Question

I have a simple question but I can't seem to figure this out.

Suppose I have one file with the following contents:

icons.scss

.icon {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 1rem;
    height: 1rem;

    &[data-icon="left"] {
        background-image: url('...');
    }
    &[data-icon="right"] {
        background-image: url('...');
    }
}

This would compiles to:

.icon {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 1rem;
    height: 1rem;
}
.icon[data-icon=left] {
    background-image: url('...');
}
.icon[data-icon=right] {
    background-image: url('...');
}

Then I also have another file which is the main file where I import all other files inside before compiling.

main.scss

@use "./icons.scss";
@use "./some-other-file.scss";

What I would like to do is prepend all the classes imported from "icons.scss" or any other files with a name of my choice. For example, .icon would become .prefixed-icon and so on.

This is my desired result:

Desired result:

.prefixed-icon {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 1rem;
    height: 1rem;
}
.prefixed-icon[data-icon=left] {
    background-image: url('...');
}
.prefixed-icon[data-icon=right] {
    background-image: url('...');
}

I've only started learning SASS earlier today so this got way over my head. I tried to use the sass:selector and sass:meta build-in modules but didn't manage to figure it out.