CODEWITHSUNDEEP
svelte
Chase R Lewis
Chase R Lewis

Reputation: 2307

Can you forward style properties in svelte?

I'm new to svelte. I like that i can set individual style elements like

<div style:color='red' />

My question is there a way to forward these types of style properties to child components? To get a feel for it I'm building a small ui library and having this ability would make the components a lot more versatile.

Example Row.svelte

<div class='row'>
   <slot></slot>
</div>

App.svelte

<Row style:color='red'>
    Hello World!
</Row>

This is the type of thing I'm hoping to accomplish.

Upvotes: 2

Views: 290

Answers (1)

brunnerh
brunnerh

Reputation: 184416

This is not possible to my knowledge. style:... is just syntactic sugar for adding a property to the style attribute.

So if you want to access the style of a wrapped element you can export a property for that or use the automatically created $$props/$$restProps (which is generally not recommended).

<script>
  export let style = '';
</script>
<div class='row' {style}> ...

<Row style="color: red"> ...

Upvotes: 1

Related Questions