Error with rgba transparency on modules bulma

[selique]

my package.json :

  "name": "investor-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@analytics/google-analytics": "^0.2.0",
    "bulma-styled-components": "^1.0.2",
    "react": "^16.10.2",
    "react-dom": "^16.10.2",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.2.0",
    "styled-components": "^4.4.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

my component :

import { Navbar } from "bulma-styled-components";

function NavbarContainer(props) {
  return (
    <Navbar
      className={
        (props.color ? ` is-${props.color}` : "") +
        (props.spaced ? " is-spaced" : "")
      }
    >
      {props.children}
    </Navbar>
  );
}

export default NavbarContainer;

iam get this error :

×
←→1 of 4 errors on the page
Error: Passed invalid arguments to rgba, please pass multiple numbers e.g. rgb(255, 205, 100, 0.75) or an object e.g. rgb({ red: 255, green: 205, blue: 100, alpha: 0.75 }).
▼ 24 stack frames were expanded.
rgba
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/bulma-styled-components/dist/index.js:711
(anonymous function)
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/bulma-styled-components/dist/index.js:3098
flatten
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/styled-components/dist/styled-components.browser.esm.js:1290
flatten
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/styled-components/dist/styled-components.browser.esm.js:1269
ComponentStyle.generateAndInjectStyles
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/styled-components/dist/styled-components.browser.esm.js:1480
StyledComponent.generateAndInjectStyles
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/styled-components/dist/styled-components.browser.esm.js:2040
StyledComponent.renderInner
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/styled-components/dist/styled-components.browser.esm.js:1942
updateContextConsumer
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:19751
beginWork$1
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:20126
HTMLUnknownElement.callCallback
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:363
invokeGuardedCallbackDev
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:412
invokeGuardedCallback
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:465
beginWork$$1
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:25711
performUnitOfWork
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:24616
workLoopSync
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:24592
performSyncWorkOnRoot
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:24153
scheduleUpdateOnFiber
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:23560
scheduleRootUpdate
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:26932
updateContainerAtExpirationTime
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:26958
updateContainer
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:27058
(anonymous function)
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:27639
unbatchedUpdates
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:24345
legacyRenderSubtreeIntoContainer
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:27638
render
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/node_modules/react-dom/cjs/react-dom.development.js:27729
▲ 24 stack frames were expanded.
Module../src/index.js
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/src/index.js:6
  3 | import App from "./pages/_app";
  4 | import * as serviceWorker from "./serviceWorker";
  5 | 
> 6 | ReactDom.render(<App />, document.getElementById("root"));
  7 | 
  8 | // If you want your app to work offline and load faster, you can change
  9 | // unregister() to register() below. Note this comes with some pitfalls.
View compiled
__webpack_require__
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/webpack/bootstrap:785
  782 | };
  783 | 
  784 | // Execute the module function
> 785 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
      | ^  786 | 
  787 | // Flag the module as loaded
  788 | module.l = true;
View compiled
fn
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/webpack/bootstrap:150
  147 | 		);
  148 | 		hotCurrentParents = [];
  149 | 	}
> 150 | 	return __webpack_require__(request);
      | ^  151 | };
  152 | var ObjectFactory = function ObjectFactory(name) {
  153 | 	return {
View compiled
0
http://localhost:3000/static/js/main.chunk.js:545:18
__webpack_require__
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/webpack/bootstrap:785
  782 | };
  783 | 
  784 | // Execute the module function
> 785 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
      | ^  786 | 
  787 | // Flag the module as loaded
  788 | module.l = true;
View compiled
checkDeferredModules
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/webpack/bootstrap:45
  42 | 	}
  43 | 	if(fulfilled) {
  44 | 		deferredModules.splice(i--, 1);
> 45 | 		result = __webpack_require__(__webpack_require__.s = deferredModule[0]);
     | ^  46 | 	}
  47 | }
  48 | 
View compiled
Array.webpackJsonpCallback [as push]
C:/Users/moises/Desktop/Projetos/beegin-tech-web-investor/webpack/bootstrap:32
  29 | 	deferredModules.push.apply(deferredModules, executeModules || []);
  30 | 
  31 | 	// run deferred modules when all chunks ready
> 32 | 	return checkDeferredModules();
     | ^  33 | };
  34 | function checkDeferredModules() {
  35 | 	var result;
View compiled
(anonymous function)
http://localhost:3000/static/js/main.chunk.js:1:77
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.