Composing components while adding extra slots

[lewebsimple]

As the title says, is it possible to add extra slots when extending a component ?

Consider the following:

import { tv } from "tailwind-variants";

const section = tv({
  slots: {
    wrapper: '',
    inner: '',
  },
});

const extended = tv({
  extend: section,
  slots: {
    inner: 'py-12',
    extraSlot: '',
  }
});

// This doesn't work as extended().extraSlot is undefined, but commenting out `extend: section` makes it work
console.log(extended().extraSlot())

Of course adding the missing slots in the parent component with empty values would fix the problem, but this means we have to know every possible slot name in advance ... which is not very convenient DX or downright impossible for packaged libraries.

Am I missing something ?

[jrgarciadev]

Hey @lewebsimple thank you for reporting it, I just sent a PR to fix it #22

[lewebsimple]

This is an incredibly fast response plus the PR adds other features as well, thanks!!

[jrgarciadev]

Please upgrade to the v0.1.0 🚀