tl:dr, why is this REGEX incorrect : classNames.*(.*{(?:.|\n)*?}) although it work in regex101 ?
I am using typescript with eslint. I setup some naming convention to variables type using @typescript-eslint/naming-convention. One of them is for object types, I would like the key of object to always be camelCase.
For this I simply use the rule
{
"selector": "objectLiteralProperty",
"format": ["camelCase"],
"leadingUnderscore": "allow",
"trailingUnderscore": "allow"
},
With the above rule
this object is OK, because it is a plain object
const test = {
'myName': "Bob"
};
this object is NOT OK
const test = {
'my-name': "Bob"
};
Now, I am trying to make an exception for this rule. Since I am using react, sometimes I need to create dynamic class name, and I need to pass object that use a different convention for the classnames : 'w-full py-1'
I would like to allow this and ignore the camelCase only if the object is wrapped around a method classNames
this object is still NOT OK
const test = {
'my-name': "Bob"
};
But this object is ok, because wrapped around classNames({ })
className={classNames({
'w-full py-1': true,
'bg-blue-1/10': open,
})}
I tried to setup my eslint config like this to allow any format for anything matching regex pattern like this : classNames.*(.*{(?:.|\n)*?})
{
"selector": "objectLiteralProperty",
"format": ["camelCase"],
"leadingUnderscore": "allow",
"trailingUnderscore": "allow"
},{
"selector": "objectLiteralProperty",
"format": null,
"filter": {
"regex": "classNames.*(.*{(?:.|\n)*?})",
"match": true
}
},
But even thos this regex work on Regex 101 I get an error in eslint with
Invalid regular expression: /classNames.(.{(?:.| )*?})/: Lone quantifier brackets
What is wrong with it ?
EDIT
I escaped the { and } like this : classNames.*(.*\{(?:.|\n)*?\}) but when added to Eslint I get
Invalid escape character in string.
so I moved to classNames.*(.*\\{(?:.|\n)*?\\}) and now it still the same problem where it matches everything