Skip to content
This repository has been archived by the owner on Nov 22, 2024. It is now read-only.

Experimental/custom elements #144

Merged
merged 15 commits into from
Nov 1, 2020
Merged

Conversation

aabounegm
Copy link
Collaborator

Since it was not clear how to use the compiled JS version of the components, the purpose of this PR is to change it to use the easier Web Components API.

To do:

@github-actions
Copy link

Docs available on https://illright.github.io/attractions/144/

attractions/button/button.svelte Outdated Show resolved Hide resolved
attractions/rollup.config.js Show resolved Hide resolved
demo/index.html Outdated

<body>
<a-card>
<a-button filled="true" danger="true">
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is it even possible to use any props that are not boolean or string? I'm pretty sure HTML treats all props as strings

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Right, but a string is still truthy, so we should be ok here as long as we don't compare with === true or similar. About other data types, that still needs investigation

demo/index.html Outdated
Alert
</a-button>
<!-- camelCase props seem to not work (HTML is case-insensitive) -->
<a-switch slotLeft="true">
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe we should reconsider the way we name our boolean and string props to be compatible with this

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Or not rename, but add an "alias", perhaps

Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is that even possible?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I mean another prop that would act as a fallback. If slotLeft is false (or maybe null or some other default signifying its absence), check the value of slotleft. But that's kinda hacky and I don't like it.
Do we even have that many important props with camelCase names? I mean, people can still use .$$set

demo/index.html Outdated Show resolved Hide resolved
@illright
Copy link
Owner

Damn, I should have read the PR description a little more carefully) oh well, let's keep those comments as discussion threads

@aabounegm aabounegm marked this pull request as ready for review October 31, 2020 22:47
CHANGELOG.md Outdated Show resolved Hide resolved
docs/src/routes/docs/customElements.svx Outdated Show resolved Hide resolved
README.md Outdated Show resolved Hide resolved
@aabounegm aabounegm requested a review from illright November 1, 2020 16:50
@aabounegm aabounegm merged commit 8cfa5ce into master Nov 1, 2020
@aabounegm aabounegm deleted the experimental/custom-elements branch November 1, 2020 17:55
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants