Cannot Find Stylesheet From Custom Library in Angular

I'm using Angular v17. I'm building a custom library with a stylesheet that I'd like to import using @import "@my-company/ngx-luai/styles/index"; in my application's style.scss file.

My compiled and imported library (as seen from my Application) shows the stylesheet in the correct location:

The Library's folder structure is:

The Library's ng-package.json has the assets directory declared:

"assets": [
  {
    "input": "src/lib/resources/styles",
    "glob": "**/*.scss",
    "output": "styles"
  }
]

And the Library's package.json has the following export declared:

"exports": {
  ".": {
    "sass": "./styles/_index.scss"
  }
},

However, when I go to compile my Application, I get the following error:

./src/styles.scss?ngGlobalStyle - Error: Module build failed (from ./node_modules/mini-css-e
xtract-plugin/dist/loader.js):
HookWebpackError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):        
Can't find stylesheet to import.
  ╷
3 │ @import "@my-company/ngx-luai/styles/index";
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src\styles.scss 3:9  root stylesheet

According to what you have configured in the package.json's exports, you need to import the styles from the following path:

 @import "@my-company/ngx-luai";

You can read more about package exports in the Webpack docs.