Skip to content

Transform displayName in config #404

Open
@otomad

Description

Can we config the displayName form?

For example, if a styled component named StyledTabBar, we could transform it to tab-bar.

The config option could be like:

{
  plugins: [
    ["babel-plugin-styled-components", {
      transform: (displayName) => {
        return displayName
          .replace(/^Styled(?=[A-Z0-9])/, "")
          .replace(/(?<!^)([A-Z])/g, "-$1")
          .toLowerCase();
      }
    }]
  ]
}

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions