import{_ as s,c as a,o as t,a9 as i}from"./chunks/framework.D8PMdl4T.js";const u=JSON.parse('{"title":"Subtabs and Microtabs","description":"","frontmatter":{},"headers":[],"relativePath":"public/lit/docs/subtabs-and-microtabs.md","filePath":"public/lit/docs/subtabs-and-microtabs.md","lastUpdated":1603997862000}'),n={name:"public/lit/docs/subtabs-and-microtabs.md"},e=i(`

Subtabs and Microtabs

Subtabs are separate sections of a tab that you can view by selecting one at the top of the tab. Microtabs are smaller areas that function in much the same way. You can also embed layers inside of subtabs/microtabs.

Subtabs are defined by using the tab format like this, where each element of tabFormat is given the name of that subtab:

js
tabFormat: {
    "Main tab": {
        content: [tab format things],
        *subtab features*
    },
    "Other tab": {
        content: [tab format things],
        *subtab features*
    },
    etc
}

Microtabs are defined similarly, and use the same features, but are defined in the "microtabs" feature. Each entry is a group of tabs which will appear in a microtabs component. The first set, "stuff", has 2 tabs, and the second, "otherStuff", has none.

js
microtabs: {
    stuff: {
        first: {
            content: [tab format things],
            *subtab features*
        },
        second: {
            content: [tab format things],
            *subtab features*
        }
    },
    otherStuff: {
        // There could be another set of microtabs here
    }
}

Normal subtabs and microtab subtabs both use the same features:

Features:

`,9),l=[e];function h(p,o,r,k,d,c){return t(),a("div",null,l)}const E=s(n,[["render",h]]);export{u as __pageData,E as default};