Error with inherited state in htmlbars template

I get the following error with the Ember addon when I try to extend a block with an state:

TemplateError: Can not apply multiple states at the same time from the exclusive state group “:scope[state|error]”

/* block-1.block.css */
:scope[state|error] {
    ...
}

/* block-2.block.css */
@block-reference block1 from "block-1.block.css";
:scope {
    extends: block1
}

/* block-2.hbs */
<div state:error={{error}}></div>

When the state is not inherited, the build is fine:

/* block-1.block.css */
:scope[state|error] {
   ...
}

/* block-1.hbs */
<div state:error={{error}}></div>

[chriseppstein]

@GCheung55 You’re using the new syntax for 1.0 but the version of css-blocks that you’ve got installed is 0.24. You can either install @css-blocks/ember-cli@next or use the older syntax in your glimmer templates. I’m working on a new release for @next with a lot of bug fixes right now… it should be out in the next day or two.

[amiller-gh]

Hey @dacoho, sorry for the slow reply – great sleuthing. That seems like a solid solution, but can we maybe add the existence check to addDynamicAttr so Analyzers don’t need to worry about this logic? My hope is for Analysis integration to be as straightforward as possible, if we already made this mistake in one of our own analyzers then it sounds like something that @css-blocks/core can help validate for us!

We can keep a faster model for style presence check on ElementAnalysis instead of iterating through addedStyles each time. addDynamicAttr (as well as all the other style application methods: addDynamicClasses, addStaticClass, addDynamicGroup, addStaticAttr) would use that to check if a Class or Attr has already been added. If yes, no-op, if no, add the Style(s).