---
import type { SlTab } from '@shoelace-style/shoelace';


interface Props extends Omit<SlTab, any> {
    /** The name of the tab panel this tab is associated with. The panel must be located in the same tab group. */
    panel?: string;
    /** Draws the tab in an active state. */
    active?: boolean;
    /** Makes the tab closable and shows a close button. */
    closable?: boolean;
    /** Disables the tab and prevents selection. */
    disabled?: boolean;
}

const { active, closable, disabled, panel, ...rest } = Astro.props;
---

<sl-tab
    {active}
    {closable}
    {disabled}
    {panel}
    {...rest}
    >
    <slot />
</sl-tab>

<script>
    import '@shoelace-style/shoelace/dist/components/tab/tab.js';
</script>