43081j / relit

A collection of utilities for use with the lit library

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Composed slot controllers (and maybe more)

43081j opened this issue · comments

We have SlotController right now, but it really exists as some kind of building block to what might come next.

For example, a BindSlotAttributesController (better name please) which binds some attributes to the slotted children. It could compose the SlotController like so:

const slotCtrl = new SlotController(this);
const bindCtrl = new BindSlotAttributesController(slotCtrl, {tabindex: '-1'});

html`
  <slot ${ref(slotCtrl.ref)}></slot>
`;

this would mean we could have multiple controllers composing the SlotController such that we only need to connect the slot controller to the <slot>.

all other controllers would react to the underlying slot controller's changes/listeners.

const slotCtrl = new SlotController(this);
const bindCtrl = new BindSlotAttributesController(slotCtrl, {tabindex: '-1'});
const bindPropsCtrl = new BindSlotPropertiesController(slotCtrl, {someProp: 'abc'});

html`
  <slot ${ref(slotCtrl.ref)}></slot>
`;

we really need to just dive in and try this out, i think. see what bumps we hit in the road and iterate until we get a clean interface