plugin doesn't work in intellij 2022.3.2

[JavaJob]

• IDE name and version:

• IntelliJ IDEA 2022.3.2 (Ultimate Edition)

• Build #IU-223.8617.56, built on January 26, 2023

• Styled-components plugin version:

• bundled 223.8617.56

Problem description:

Plugin doesn't work. Is there anything I need to check?

import React from "react";
import Styled from "styled-components";

const Title = Styled.h1`
  color: red;
`;

const StyledComponent = () => {
  return (
    <div>
      <Title>Hello StyledComponent</Title>
    </div>
  );
};

export default StyledComponent;

"dependencies": {
    "dotenv": "^16.0.3",
    "fork-ts-checker-webpack-plugin": "^7.3.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.8.0"
  },
  "devDependencies": {
    "@babel/core": "^7.20.12",
    "@babel/preset-env": "^7.20.2",
    "@babel/preset-react": "^7.18.6",
    "@babel/preset-typescript": "^7.18.6",
    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10",
    "@types/node": "^18.11.18",
    "@types/react": "^18.0.27",
    "@types/react-dom": "^18.0.10",
    "@types/styled-components": "^5.1.26",
    "@types/webpack": "^5.28.0",
    "@types/webpack-dev-server": "^4.7.2",
    "babel-loader": "^9.1.2",
    "babel-plugin-styled-components": "^2.0.7",
    "cross-env": "^7.0.3",
    "css-loader": "^6.7.3",
    "file-loader": "^6.2.0",
    "html-webpack-plugin": "^5.5.0",
    "mini-css-extract-plugin": "^2.7.2",
    "postcss-loader": "^7.0.2",
    "postcss-preset-env": "^8.0.1",
    "prettier": "^2.8.3",
    "react-refresh": "^0.14.0",
    "sass": "^1.58.0",
    "sass-loader": "^13.2.0",
    "style-loader": "^3.3.1",
    "styled-components": "^5.3.6",
    "stylelint": "^14.16.1",
    "stylelint-config-standard": "^29.0.0",
    "stylelint-config-standard-scss": "^6.1.0",
    "stylelint-order": "^6.0.1",
    "stylelint-scss": "^4.3.0",
    "ts-loader": "^9.4.2",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.5",
    "webpack": "^5.75.0",
    "webpack-cli": "^5.0.1",
    "webpack-dev-server": "^4.11.1",
    "webpack-merge": "^5.8.0"
  }

[JavaJob]

I've found the cause of the issue.

If you change the upper case of 'styled' to lower case, it will be recognized normally.

I don't know the difference between these cases.

import Styled from "styled-components"; -> import styled from "styled-components"; const Title = Styled.h1 -> const Title = styled.h1 color: red; `;