[bug]: Installing Sidebar breaks Tailwind Configuration

[erayerdin]

Describe the bug

#5862

Affected component/components

Sidebar

How to reproduce

1. Install sidebar.
2. Get a weird syntax error about your global CSS file.
3. Realize tailwind.config.ts quotation is broken.

Codesandbox/StackBlitz link

No response

Logs

11:33:52 PM [vite] Internal server error: [postcss] Unexpected token, expected "," (9:31)
  Plugin: vite:css
  File: /src/index.css:undefined:NaN
  9  |  @tailwind utilities;
  10 |  
  11 |  @layer base {
     |   ^
  12 |    :root {
  13 |      --background: 0 0% 100%;
      at unexpected (/node_modules/sucrase/dist/parser/traverser/util.js:99:15)
      at expect (/node_modules/sucrase/dist/parser/traverser/util.js:86:5)
      at parseObj (/node_modules/sucrase/dist/parser/traverser/expression.js:759:20)
      at parseExprAtom (/node_modules/sucrase/dist/parser/traverser/expression.js:553:7)
      at parseExprSubscripts (/node_modules/sucrase/dist/parser/traverser/expression.js:276:20)
      at parseMaybeUnary (/node_modules/sucrase/dist/parser/traverser/expression.js:257:20)
      at parseExprOps (/node_modules/sucrase/dist/parser/traverser/expression.js:185:20)
      at parseMaybeConditional (/node_modules/sucrase/dist/parser/traverser/expression.js:157:20)
      at baseParseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:142:20)
      at tsParseMaybeAssignWithoutJSX (/node_modules/sucrase/dist/parser/plugins/typescript.js:1580:45)
      at tsParseMaybeAssign (/node_modules/sucrase/dist/parser/plugins/typescript.js:1548:12)
      at parseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:121:43)
      at parseObjectProperty (/node_modules/sucrase/dist/parser/traverser/expression.js:851:7)
      at parseObjPropValue (/node_modules/sucrase/dist/parser/traverser/expression.js:892:5)
      at parseObj (/node_modules/sucrase/dist/parser/traverser/expression.js:808:5)
      at parseExprAtom (/node_modules/sucrase/dist/parser/traverser/expression.js:553:7)
      at parseExprSubscripts (/node_modules/sucrase/dist/parser/traverser/expression.js:276:20)
      at parseMaybeUnary (/node_modules/sucrase/dist/parser/traverser/expression.js:257:20)
      at parseExprOps (/node_modules/sucrase/dist/parser/traverser/expression.js:185:20)
      at parseMaybeConditional (/node_modules/sucrase/dist/parser/traverser/expression.js:157:20)
      at baseParseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:142:20)
      at tsParseMaybeAssignWithoutJSX (/node_modules/sucrase/dist/parser/plugins/typescript.js:1580:45)
      at tsParseMaybeAssign (/node_modules/sucrase/dist/parser/plugins/typescript.js:1548:12)
      at parseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:121:43)
      at parseObjectProperty (/node_modules/sucrase/dist/parser/traverser/expression.js:851:7)
      at parseObjPropValue (/node_modules/sucrase/dist/parser/traverser/expression.js:892:5)
      at parseObj (/node_modules/sucrase/dist/parser/traverser/expression.js:808:5)
      at parseExprAtom (/node_modules/sucrase/dist/parser/traverser/expression.js:553:7)
      at parseExprSubscripts (/node_modules/sucrase/dist/parser/traverser/expression.js:276:20)
      at parseMaybeUnary (/node_modules/sucrase/dist/parser/traverser/expression.js:257:20)
      at parseExprOps (/node_modules/sucrase/dist/parser/traverser/expression.js:185:20)
      at parseMaybeConditional (/node_modules/sucrase/dist/parser/traverser/expression.js:157:20)
      at baseParseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:142:20)
      at tsParseMaybeAssignWithoutJSX (/node_modules/sucrase/dist/parser/plugins/typescript.js:1580:45)
      at tsParseMaybeAssign (/node_modules/sucrase/dist/parser/plugins/typescript.js:1548:12)
      at parseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:121:43)
      at parseObjectProperty (/node_modules/sucrase/dist/parser/traverser/expression.js:851:7)
      at parseObjPropValue (/node_modules/sucrase/dist/parser/traverser/expression.js:892:5)
      at parseObj (/node_modules/sucrase/dist/parser/traverser/expression.js:808:5)
      at parseExprAtom (/node_modules/sucrase/dist/parser/traverser/expression.js:553:7)
      at parseExprSubscripts (/node_modules/sucrase/dist/parser/traverser/expression.js:276:20)
      at parseMaybeUnary (/node_modules/sucrase/dist/parser/traverser/expression.js:257:20)
      at parseExprOps (/node_modules/sucrase/dist/parser/traverser/expression.js:185:20)
      at parseMaybeConditional (/node_modules/sucrase/dist/parser/traverser/expression.js:157:20)
      at baseParseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:142:20)
      at tsParseMaybeAssignWithoutJSX (/node_modules/sucrase/dist/parser/plugins/typescript.js:1580:45)
      at tsParseMaybeAssign (/node_modules/sucrase/dist/parser/plugins/typescript.js:1548:12)
      at parseMaybeAssign (/node_modules/sucrase/dist/parser/traverser/expression.js:121:43)
      at parseExportDefaultExpression (/node_modules/sucrase/dist/parser/traverser/statement.js:1024:34)
      at parseExport (/node_modules/sucrase/dist/parser/traverser/statement.js:988:5)
11:33:52 PM [vite] Pre-transform error: [postcss] Unexpected token, expected "," (9:31)

System Info

React, Vite, Tailwind, Typescript

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues

[epifaniofrancisco]

This issue currently exists and is documented in #5814.

[erayerdin]

Thanks @epifaniofrancisco. Maintainers are welcome to close the issue.