catalyst icon indicating copy to clipboard operation
catalyst copied to clipboard

Allow definition of targets in kebab-case but access via camelCase

Open erinnachen opened this issue 3 years ago • 2 comments

For attributes, I define in the markup data-my-attr-name and in the controller as @attr myAttrName

For targets however, I have to define the target name in both the markup and the controller using camelCase: data-targets="my-controller.myTargetsName" and @targets myTargetsName I think it would be nice (more consistent?) if the markup could support kebab-case.

erinnachen avatar Mar 11 '22 19:03 erinnachen

Thanks @erinnachen thats some great feedback!

This sounds like it might be a breaking change. If we're making a breaking change I wonder if we can really think about improving ergonomics for actions, targets and attrs to make them all consistent?

  • maybe attrs can drop the data- prefix? This felt like a safe choice but it's quite ugly
  • how bad would it be to remove the transformation altogether? Such that @attr fooBar mapped to the html attribute fooBar? IIRC attributes are case insensitive which could cause problems 🤷‍♂️

keithamus avatar Mar 11 '22 22:03 keithamus

Hello,

Let me add a comment about syntax :

Why

data-targets="my-controller.myTargetsName"

rather than

data-targets="myTargetsName" like stimulus (without "my-controller") ?

Is that the component root element does not corresponds to controller element ("this.element") in stimumlus ?

Thanks in advance

Eric

rccc avatar Dec 19 '22 13:12 rccc