Svelte: Styling `ref:foo` on components

[Conduitry]

We should decide whether we want to allow styling ref:foo { ... } when ref:foo refers to a component. (I'm not entirely sure what this would mean, with the non-cascading styles.) If we don't want to support it, we should provide more specific error messages when this is attempted.

[Rich-Harris]

came here to open the same issue. I think it should produce a warning.

[GarrettGeorge]

Would this mean that the user is trying to include styles declared on foo on their current component. Error could be something along the lines of Error: Styles from other components cannot be referenced using ref:foo?

[nkoehring]

Is general styling of components possible? Eg:

<div>
  <MyComponent class="foo" />
  <MyOtherComponent style="border: thick solid red;" />

If so, I would go for consistency and support styling via ref too.

[kaisermann]

@nkoehring Only if you support it by manually handling a style and a class prop.

<!-- Some component -->
<div {style} {class}>
    <h1>{title}</h1>
</div>

[nkoehring]

Okay makes sense because the component doesn't get anything wrapped around, right?

[kaisermann]

@nkoehring Yep. The class/style shouldn't always necessarily be assigned (only) to the "parent element".

[Rich-Harris]

Closing as not applicable to Svelte 3 (ref: no longer exists)