Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add support for kebab-case to camelCase conversions #11

Closed
patricknelson opened this issue May 11, 2023 · 2 comments
Closed

Add support for kebab-case to camelCase conversions #11

patricknelson opened this issue May 11, 2023 · 2 comments

Comments

@patricknelson
Copy link
Contributor

Would love the ability to support the following:

<custom-element foo-bar="baz></custom-element>

Where the element attribute foo-bar is automatically translated to its camelCase counterpart: fooBar, making it available in CustomElement.svelte as:

<script>
  export let fooBar = '';
</script>

<div>{fooBar}</div>

Looks like @wagich already did some work to address this particular use case in this specific commit already: b95dd6c

@patricknelson
Copy link
Contributor Author

FWIW, should be a worthwhile change, especially since for long term compatibility, it should be supported in Svelte 4,. See: sveltejs/svelte#8457 😄

some things are hard to auto-configure, like attribute hyphen preferences or whether or not setting a property should reflect back to the attribute. This is why <svelte:options customElement={..}> can also take an object to modify such aspects. This option allows to specify whether setting a prop should be reflected back to the attribute (default false), what to use when converting the property to the attribute value and vice versa (through type, default String, or when export let prop = false then Boolean), and what the corresponding attribute for the property is (attribute, default lowercased prop name). These options are heavily inspired by lit: https://lit.dev/docs/components/properties. Closes sveltejs/svelte#7638, fixes sveltejs/svelte#5705

@patricknelson
Copy link
Contributor Author

patricknelson commented Jun 2, 2023

Scratch that. If I had read more closely, I would have seen that Svelte 4 is actually standardizing on Lit-style lowercased attributes.

Closing this now.

Edit: See #16 instead.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant