BEM naming change (2.3.1)

[elvisbegovic]

Relating to :

BEM naming change (Release 2.3.1 - May 25, 2017)
Initially we used the double dash style for BEM notation (--). Due to the fact that double dashes are problematic in an XML environment (which doesn't allow double dashes within comments), we have upgraded our syntax to use the single underscore style (_). This change is backward compatible for 18 months. But all components going forward are built with the single underscore BEM style.

SOURCE:https://www.lightningdesignsystem.com/release-notes/
DUE TO: #452

Today in my css bundle (v2.3.1) I have old and last naming of css selectors, because of support 18 months old syntax --.

The problem is next: my project was started with slds v.2.2.2 and I have relativly big project with old bem naming syntax -- and after updating to 2.3.1 i realize old syntax will be deprecated, we need highly a solution from team to transform our old syntax to ned, something like regexp?!? to change all ours "slds-...-- " to "slds-..._"

Today I have mix css selectors in my html templates, and with webstorm I have autocompletion on class and first proposed are theses with old syntax. It's very annoying to think about which is good selector from autocomplete.

To resume problem is not 1 but 3:
dupli

1. cated css file size
2. slow developement because of choosing right css in webstorm css autocomplete in class
3. mix of old and new selector naming

Please apologize but we need solution!

ps:already opened 3 months ago, then no fix but closed issue #467 reponse: "@ishakasliwal:Once we fully drop support via CSS, we'll make sure to offer something else to help you stay afloat." But you need think we need solution as soon as possible, can't run after BIG CHANGES we need LTS.

cc @brandonferrua

[ishakasliwal]

@istiti Thanks for giving us more context into the issues you're facing with the BEM syntax change. We'll be taking your situation into consideration when assessing how to provide support.

cc: @DrBoolean @aputinski

[elvisbegovic]

Please apologize me but any news here? im using slds in entreprise; Unfortunatly, Can’t stay tunned all the time, no time check whole changelog.

We need help to continue making awesome app with awesome design.

Any solution is welcome, can’t provide trough website 2 css to client (because of speed perf)

@ishakasliwal

[elvisbegovic]

any news here ?
or this guy who make this breaking change:

Initially we used the double dash style for BEM notation (--). Due to the fact that double dashes are problematic in an XML environment (which doesn't allow double dashes within comments), we have upgraded our syntax to use the single underscore style (_). This change is backward compatible for 18 months. But all components going forward are built with the single underscore BEM style.

can he just explain me here in detail what's changing, I will create regexp to change all -- to _ in my templates
actually not possible we provide two syntax to the user browser, and css autocmplete from IDE are with these 2 syntax. (which old syntax -- are always first proposed in autocompletion)

can you please be close the users like other big lib are, and give us more inputs and infos about changes/enhancement/direction/ like microsoft (ts), angular, webpack thanks

@brandonferrua @ishakasliwal

[colas74]

+1, I need to changes from old notation (--) to new (_) using regexp and need lighter css file which contain only new notation in order to improve dist size and IDE autocompletion.

However, I not found any regexp provided by salesforce to make that.

Is it normal to deprecaced many css classes and not found any solution to replaces these?
For massive enterprise project, it's unacceptable to hand replace classes names

[elvisbegovic]

please apologizes me, but 3 months and no news here, can't salesforce allow his team to be closer to the users?
only because of that my performance audit is very bad:

cc/ @aputinski

[ayeshakmaz]

Hello @istiti and @colas74 and apologies for the delay on this. Here is a regular expression we've created for our new linter in VSCode:

/slds\S*--[A-Za-z0-9_-]+/g

If you're not including SLDS as a static resource in your project, we recommend opening your project in VSCode and downloading the Salesforce Lightning Extension, which will find all instances of the old syntax in a file and give you the option to replace them with the underscore automatically. Please see the documentation for the extension here.

I hope this helps, please reach out with any other questions.

[elvisbegovic]

@ayeshakmaz thanks i appreciate your input however you did 50% of work to my usecase (yes im using static ressource because repo is like Eclipse:gas works (joke) , idea would be to have search/replace old to new syntax, can you edit your comment with parenthesis group and add regexp to replace by new syntax?

hope read you as quick as possible

[elvisbegovic]

Relating to this can I considering make search/replace in all my files:

I really can't understand/be sure what's new syntax to match all usecases that's why im scared. If someone in the team can confirm me I will execute my command because my project is relativly big and this breaking get me crazy.

cc @brandonferrua

[engai]

@istiti that should work. But, as with all big development changes, i'd suggest making the fix in a separate branch and running your test suite to be sure. Also, take a look at the find results for any thing you might not want replaced, and custom classes that may have followed that pattern