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

[✨]Allow dot notation for component$ #3621

Closed
Aetherovox opened this issue Apr 1, 2023 · 3 comments
Closed

[✨]Allow dot notation for component$ #3621

Aetherovox opened this issue Apr 1, 2023 · 3 comments
Labels
STATUS-3: works as expected This issue is closed because the behavior is correct and expected TYPE: enhancement New feature or request

Comments

@Aetherovox
Copy link

Is your feature request related to a problem?

Dot notation for components is generally excellent for linting.

`const Scene = () => {
...
}
Scene.Title = Title;
Scene.Setting = Setting;
Scene.Body = Body;

export default Scene;
Which allows use like this:

<Scene.Title>ACT III Scene II</Scene.Title>
<Scene.Setting>A Stormy Heath</Scene.Setting>
<Scene.Body>

Blow, winds, and crack your cheeks! rage! blow!
You cataracts and hurricanoes, spout
Till you have drench'd our steeples, drown'd the cocks!
You sulphurous and thought-executing fires,
Vaunt-couriers to oak-cleaving thunderbolts,
Singe my white head! And thou, all-shaking thunder,
Smite flat the thick rotundity o' the world!
Crack nature's moulds, an germens spill at once,
That make ingrateful man!

</Scene.Body>

`

Unfortunately this doesn't appear to work with qwik's component$
`const Scene = component$(() => {
...
});
Scene.Title = Title;
Scene.Setting = Setting;
Scene.Body = Body;

export default Scene;
`

Describe the solution you'd like

Ideally I'd like to use the above notation with component$.
The ability to limit the kind of child components to only those appended to it (as above) will also be beneficial, as this is lacking in more popular frameworks, such as React:
`const Scene = component$(() => {
...
});
Scene.Title = Title;
Scene.Setting = Setting;
Scene.Body = Body;

export default Scene;
`
In this example, only children of Scene.Title, Scene.Setting, and Scene.Body should be allowed.
This however is not necessary by any means.

Describe alternatives you've considered

No alternatives required

Additional context

No response

@Aetherovox Aetherovox added TYPE: enhancement New feature or request STATUS-1: needs triage New issue which needs to be triaged labels Apr 1, 2023
@shairez shairez added STATUS-3: works as expected This issue is closed because the behavior is correct and expected and removed STATUS-1: needs triage New issue which needs to be triaged labels May 25, 2024
@shairez
Copy link
Contributor

shairez commented May 25, 2024

Thanks!
You can achieve this by using a barrel file or exporting the root component as Select.Root for example:
https://github.com/qwikifiers/qwik-ui/blob/main/packages/kit-headless/src/index.ts#L11

Closing for now

@shairez shairez closed this as completed May 25, 2024
@PatrickJS
Copy link
Member

we need Docs for this

@shairez
Copy link
Contributor

shairez commented May 26, 2024

Thanks @PatrickJS ! good suggestion!

Let's open a new issue about it and reference this issue so we won't forget.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
STATUS-3: works as expected This issue is closed because the behavior is correct and expected TYPE: enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants