{
  "_copyright": "Copyright (c) 2026, Salesforce, Inc., All rights reserved. For full license text, see the LICENSE.txt file",
  "$schema": "https://slds.lightningdesignsystem.com/schemas/uif-system.v1.json",
  "apiVersion": "1.0.0",
  "name": "Tabs",
  "description": "Initializes a default tablist",
  "structure": {
    "name": "root",
    "restrict": [
      "div"
    ],
    "description": "Initializes a default tablist",
    "children": [
      {
        "name": "tablist",
        "restrict": [
          "ul",
          "div"
        ],
        "description": "Creates the container for the default tabs",
        "attributes": {
          "static": {
            "role": "tablist",
            "class": "slds-tabs_default__nav"
          }
        },
        "children": [
          {
            "name": "tab",
            "restrict": [
              "li"
            ],
            "description": "Styles each list item as a single tab",
            "repeats": true,
            "attributes": {
              "static": {
                "role": "presentation",
                "class": "slds-tabs_default__item"
              }
            },
            "children": [
              {
                "name": "tabLeftIcon",
                "restrict": [
                  "span"
                ],
                "description": "icon to the left of tab label",
                "attributes": {
                  "static": {
                    "class": "slds-tabs__left-icon"
                  }
                }
              },
              {
                "name": "tabLink",
                "restrict": [
                  "a",
                  "button"
                ],
                "description": "Styles each actionable element inside each tab item",
                "attributes": {
                  "static": {
                    "role": "tab",
                    "class": "slds-tabs_default__link"
                  },
                  "bound": {
                    "id": {
                      "prop": "tabId"
                    },
                    "aria-controls": {
                      "prop": "panelId"
                    },
                    "aria-selected": {
                      "prop": "isSelected"
                    },
                    "tabindex": {
                      "prop": "tabIndex"
                    }
                  }
                },
                "slot": {
                  "name": "tabLabel",
                  "required": true
                },
                "variants": [
                  {
                    "name": "linkVariant",
                    "description": "Class on the tab anchor for scoped variant",
                    "options": [
                      {
                        "value": "default",
                        "class": "slds-tabs_default__link",
                        "description": "Styles each actionable element inside each tab item"
                      },
                      {
                        "value": "scoped",
                        "class": "slds-tabs_scoped__link"
                      }
                    ]
                  }
                ],
                "modifiers": [
                  {
                    "name": "subTabLink",
                    "attribute": "class",
                    "value": "slds-p-horizontal_xx-small",
                    "description": "Sub-tabs link padding"
                  }
                ],
                "children": [
                  {
                    "name": "tabLinkStatusIcon",
                    "renderWhen": {
                      "prop": "subTabsStatus",
                      "eq": "true"
                    },
                    "description": "Status icon wrapper (success/warning/error) inside the sub-tab link",
                    "attributes": {
                      "static": {
                        "class": "slds-m-horizontal_xx-small"
                      }
                    },
                    "children": [
                      {
                        "name": "tabLinkStatusIconContainer",
                        "attributes": {
                          "static": {
                            "class": "slds-icon_container"
                          }
                        },
                        "variants": [
                          {
                            "name": "statusGlyph",
                            "description": "Utility-sprite glyph applied to the sub-tab status icon container",
                            "options": [
                              {
                                "value": "error",
                                "class": "slds-icon-utility-error"
                              },
                              {
                                "value": "warning",
                                "class": "slds-icon-utility-warning"
                              },
                              {
                                "value": "success",
                                "class": "slds-icon-utility-success"
                              }
                            ]
                          }
                        ],
                        "modifiers": [
                          {
                            "name": "currentColor",
                            "attribute": "class",
                            "value": "slds-current-color",
                            "description": "Tints the icon with the current text color (used for warning glyph)"
                          }
                        ],
                        "children": [
                          {
                            "name": "tabLinkStatusIconSvg",
                            "attributes": {
                              "static": {
                                "class": "slds-icon slds-icon_x-small",
                                "aria-hidden": "true"
                              }
                            },
                            "children": [
                              {
                                "name": "tabLinkStatusIconUse"
                              }
                            ]
                          },
                          {
                            "name": "tabLinkStatusIconAssistiveText",
                            "attributes": {
                              "static": {
                                "class": "slds-assistive-text"
                              }
                            }
                          }
                        ]
                      }
                    ]
                  },
                  {
                    "name": "tabLinkIconContainer",
                    "renderWhen": {
                      "prop": "subTabs",
                      "eq": "true"
                    },
                    "description": "Entity (standard sprite) icon container for sub-tab link",
                    "attributes": {
                      "static": {
                        "class": "slds-icon_container"
                      }
                    },
                    "children": [
                      {
                        "name": "tabLinkIconSvg",
                        "attributes": {
                          "static": {
                            "class": "slds-icon slds-icon_small slds-icon-text-default",
                            "aria-hidden": "true"
                          }
                        },
                        "children": [
                          {
                            "name": "tabLinkIconUse"
                          }
                        ]
                      },
                      {
                        "name": "tabLinkIconAssistiveText",
                        "attributes": {
                          "static": {
                            "class": "slds-assistive-text"
                          }
                        }
                      }
                    ]
                  },
                  {
                    "name": "tabLinkLabel",
                    "renderWhen": {
                      "prop": "subTabs",
                      "eq": "true"
                    },
                    "description": "Truncated tab label for sub-tabs",
                    "attributes": {
                      "static": {
                        "class": "slds-truncate"
                      }
                    }
                  }
                ]
              },
              {
                "name": "tabRightIcon",
                "restrict": [
                  "span"
                ],
                "description": "icon to the right of tab label",
                "attributes": {
                  "static": {
                    "class": "slds-tabs__right-icon"
                  }
                },
                "children": [
                  {
                    "name": "tabRightIconContainer",
                    "attributes": {
                      "static": {
                        "class": "slds-icon_container"
                      }
                    },
                    "variants": [
                      {
                        "name": "rightIconGlyph",
                        "description": "Utility-sprite glyph for the right-side status icon",
                        "options": [
                          {
                            "value": "error",
                            "class": "slds-icon-utility-error"
                          }
                        ]
                      }
                    ],
                    "children": [
                      {
                        "name": "tabRightIconSvg",
                        "attributes": {
                          "static": {
                            "class": "slds-icon slds-icon_x-small",
                            "aria-hidden": "true"
                          }
                        },
                        "modifiers": [
                          {
                            "name": "iconTextError",
                            "attribute": "class",
                            "value": "slds-icon-text-error",
                            "description": "Tints the right-side icon with the error text color"
                          }
                        ],
                        "children": [
                          {
                            "name": "tabRightIconUse"
                          }
                        ]
                      },
                      {
                        "name": "tabRightIconAssistiveText",
                        "attributes": {
                          "static": {
                            "class": "slds-assistive-text"
                          }
                        }
                      }
                    ]
                  }
                ]
              },
              {
                "name": "tabIndicatorContainer",
                "renderWhen": {
                  "prop": "subTabs",
                  "eq": "true"
                },
                "attributes": {
                  "static": {
                    "class": "slds-indicator-container"
                  }
                },
                "children": [
                  {
                    "name": "tabIndicatorUnsaved",
                    "renderWhen": {
                      "prop": "unsaved",
                      "eq": "true"
                    },
                    "attributes": {
                      "static": {
                        "class": "slds-indicator_unsaved"
                      }
                    }
                  },
                  {
                    "name": "tabIndicatorUnread",
                    "renderWhen": {
                      "prop": "hasNotification",
                      "eq": "true"
                    },
                    "attributes": {
                      "static": {
                        "class": "slds-indicator_unread",
                        "role": "img"
                      }
                    }
                  }
                ]
              },
              {
                "name": "tabActions",
                "renderWhen": {
                  "prop": "subTabs",
                  "eq": "true"
                },
                "description": "Trailing actions area for sub-tabs (close button, optional menu trigger)",
                "attributes": {
                  "static": {
                    "class": "slds-col_bump-left slds-p-left_none slds-p-right_none"
                  }
                },
                "children": [
                  {
                    "name": "tabCloseButton",
                    "attributes": {
                      "static": {
                        "class": "slds-button slds-button_icon slds-button_icon-container slds-button_icon-x-small"
                      }
                    },
                    "modifiers": [
                      {
                        "name": "inverse",
                        "attribute": "class",
                        "value": "slds-button_icon-inverse",
                        "description": "Inverse close-button treatment (used when the tab is in error/success state)"
                      }
                    ],
                    "children": [
                      {
                        "name": "tabCloseButtonIcon",
                        "attributes": {
                          "static": {
                            "class": "slds-button__icon",
                            "aria-hidden": "true"
                          }
                        },
                        "children": [
                          {
                            "name": "tabCloseButtonUse"
                          }
                        ]
                      },
                      {
                        "name": "tabCloseButtonAssistiveText",
                        "attributes": {
                          "static": {
                            "class": "slds-assistive-text"
                          }
                        }
                      }
                    ]
                  }
                ]
              },
              {
                "name": "tabMenuTrigger",
                "renderWhen": {
                  "prop": "subTabsMenu",
                  "eq": "true"
                },
                "description": "Optional dropdown trigger appended to a sub-tab to reveal tab actions",
                "attributes": {
                  "static": {
                    "class": "slds-dropdown-trigger slds-dropdown-trigger_click slds-p-left_none slds-p-right_none"
                  }
                },
                "children": [
                  {
                    "name": "tabMenuTriggerButton",
                    "attributes": {
                      "static": {
                        "class": "slds-button slds-button_icon slds-button_icon-container slds-button_icon-x-small",
                        "aria-haspopup": "true"
                      }
                    },
                    "children": [
                      {
                        "name": "tabMenuTriggerIcon",
                        "attributes": {
                          "static": {
                            "class": "slds-button__icon",
                            "aria-hidden": "true"
                          }
                        },
                        "children": [
                          {
                            "name": "tabMenuTriggerUse"
                          }
                        ]
                      },
                      {
                        "name": "tabMenuTriggerAssistiveText",
                        "attributes": {
                          "static": {
                            "class": "slds-assistive-text"
                          }
                        }
                      }
                    ]
                  }
                ]
              },
              {
                "name": "tabOverflow",
                "renderWhen": {
                  "prop": "isOverflow",
                  "eq": "true"
                },
                "description": "Dropdown trigger that hosts the More/overflow menu of additional tabs",
                "attributes": {
                  "static": {
                    "class": "slds-dropdown-trigger slds-dropdown-trigger_click"
                  }
                },
                "modifiers": [
                  {
                    "name": "open",
                    "attribute": "class",
                    "value": "slds-is-open",
                    "description": "Open state for the overflow dropdown trigger"
                  }
                ],
                "children": [
                  {
                    "name": "tabOverflowButton",
                    "attributes": {
                      "static": {
                        "class": "slds-button",
                        "aria-haspopup": "true"
                      }
                    },
                    "children": [
                      {
                        "name": "tabOverflowButtonIndicatorContainer",
                        "renderWhen": {
                          "prop": "subTabs",
                          "eq": "true"
                        },
                        "attributes": {
                          "static": {
                            "class": "slds-indicator-container"
                          }
                        }
                      },
                      {
                        "name": "tabOverflowButtonLabel",
                        "attributes": {
                          "static": {
                            "class": "slds-truncate"
                          }
                        },
                        "children": [
                          {
                            "name": "tabOverflowButtonLabelAssistiveText",
                            "attributes": {
                              "static": {
                                "class": "slds-assistive-text"
                              }
                            }
                          }
                        ]
                      },
                      {
                        "name": "tabOverflowButtonIcon",
                        "attributes": {
                          "static": {
                            "class": "slds-button__icon slds-button__icon_right",
                            "aria-hidden": "true"
                          }
                        },
                        "modifiers": [
                          {
                            "name": "iconSize",
                            "attribute": "class",
                            "description": "Overflow chevron sizing modifier",
                            "options": [
                              {
                                "propValue": "small",
                                "value": "slds-button__icon_small"
                              },
                              {
                                "propValue": "x-small",
                                "value": "slds-button__icon_x-small"
                              }
                            ]
                          }
                        ],
                        "children": [
                          {
                            "name": "tabOverflowButtonUse"
                          }
                        ]
                      }
                    ]
                  },
                  {
                    "name": "tabOverflowDropdown",
                    "attributes": {
                      "static": {
                        "class": "slds-dropdown slds-dropdown_right"
                      }
                    },
                    "modifiers": [
                      {
                        "name": "lengthWithIcon",
                        "attribute": "class",
                        "value": "slds-dropdown_length-with-icon-10",
                        "description": "Caps dropdown height to 10 rows with icon"
                      }
                    ],
                    "children": [
                      {
                        "name": "tabOverflowDropdownList",
                        "attributes": {
                          "static": {
                            "class": "slds-dropdown__list",
                            "role": "menu"
                          }
                        },
                        "children": [
                          {
                            "name": "tabOverflowDropdownItem",
                            "attributes": {
                              "static": {
                                "class": "slds-dropdown__item",
                                "role": "presentation"
                              }
                            },
                            "modifiers": [
                              {
                                "name": "hasNotification",
                                "attribute": "class",
                                "value": "slds-has-notification",
                                "description": "Creates styles for a Tab Item when its tab has new activity in"
                              }
                            ],
                            "children": [
                              {
                                "name": "tabOverflowDropdownItemLink",
                                "attributes": {
                                  "static": {
                                    "role": "menuitem"
                                  }
                                },
                                "children": [
                                  {
                                    "name": "tabOverflowDropdownItemTruncate",
                                    "attributes": {
                                      "static": {
                                        "class": "slds-truncate"
                                      }
                                    },
                                    "children": [
                                      {
                                        "name": "tabOverflowDropdownItemIndicatorContainer",
                                        "renderWhen": {
                                          "prop": "subTabs",
                                          "eq": "true"
                                        },
                                        "attributes": {
                                          "static": {
                                            "class": "slds-indicator-container"
                                          }
                                        }
                                      },
                                      {
                                        "name": "tabOverflowDropdownItemMedia",
                                        "renderWhen": {
                                          "prop": "subTabs",
                                          "eq": "false"
                                        },
                                        "description": "Media wrapper used by the default-tabs overflow dropdown items",
                                        "attributes": {
                                          "static": {
                                            "class": "slds-media slds-media_center"
                                          }
                                        },
                                        "children": [
                                          {
                                            "name": "tabOverflowDropdownItemFigure",
                                            "attributes": {
                                              "static": {
                                                "class": "slds-media__figure"
                                              }
                                            },
                                            "children": [
                                              {
                                                "name": "tabOverflowDropdownItemIconContainer",
                                                "attributes": {
                                                  "static": {
                                                    "class": "slds-icon_container"
                                                  }
                                                },
                                                "variants": [
                                                  {
                                                    "name": "overflowItemGlyph",
                                                    "description": "Standard-sprite glyph applied to the overflow dropdown item icon container",
                                                    "options": [
                                                      {
                                                        "value": "account",
                                                        "class": "slds-icon-standard-account"
                                                      },
                                                      {
                                                        "value": "approval",
                                                        "class": "slds-icon-standard-approval"
                                                      },
                                                      {
                                                        "value": "case",
                                                        "class": "slds-icon-standard-case"
                                                      },
                                                      {
                                                        "value": "contact",
                                                        "class": "slds-icon-standard-contact"
                                                      },
                                                      {
                                                        "value": "lead",
                                                        "class": "slds-icon-standard-lead"
                                                      },
                                                      {
                                                        "value": "opportunity",
                                                        "class": "slds-icon-standard-opportunity"
                                                      },
                                                      {
                                                        "value": "pricebook",
                                                        "class": "slds-icon-standard-pricebook"
                                                      },
                                                      {
                                                        "value": "product",
                                                        "class": "slds-icon-standard-product"
                                                      }
                                                    ]
                                                  }
                                                ],
                                                "children": [
                                                  {
                                                    "name": "tabOverflowDropdownItemIconSvg",
                                                    "attributes": {
                                                      "static": {
                                                        "class": "slds-icon slds-icon_small",
                                                        "aria-hidden": "true"
                                                      }
                                                    },
                                                    "children": [
                                                      {
                                                        "name": "tabOverflowDropdownItemIconUse"
                                                      }
                                                    ]
                                                  }
                                                ]
                                              }
                                            ]
                                          },
                                          {
                                            "name": "tabOverflowDropdownItemBody",
                                            "attributes": {
                                              "static": {
                                                "class": "slds-media__body"
                                              }
                                            }
                                          }
                                        ]
                                      },
                                      {
                                        "name": "tabOverflowDropdownItemSubTabIconContainer",
                                        "renderWhen": {
                                          "prop": "subTabs",
                                          "eq": "true"
                                        },
                                        "description": "Sub-tabs overflow menu item icon container (sits flat inside the truncate, no media wrapper)",
                                        "attributes": {
                                          "static": {
                                            "class": "slds-icon_container"
                                          }
                                        },
                                        "children": [
                                          {
                                            "name": "tabOverflowDropdownItemSubTabIconSvg",
                                            "attributes": {
                                              "static": {
                                                "class": "slds-icon slds-icon_small slds-icon-text-default",
                                                "aria-hidden": "true"
                                              }
                                            },
                                            "children": [
                                              {
                                                "name": "tabOverflowDropdownItemSubTabIconUse"
                                              }
                                            ]
                                          },
                                          {
                                            "name": "tabOverflowDropdownItemSubTabIconAssistiveText",
                                            "attributes": {
                                              "static": {
                                                "class": "slds-assistive-text"
                                              }
                                            }
                                          }
                                        ]
                                      },
                                      {
                                        "name": "tabOverflowDropdownItemLabel",
                                        "description": "Label text for an overflow dropdown item"
                                      }
                                    ]
                                  }
                                ]
                              }
                            ]
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "name": "mobileTitle",
                "renderWhen": {
                  "prop": "variant",
                  "eq": "mobile-stack-deprecated"
                },
                "description": "Wrapper around the title button used by the deprecated mobile tab stack",
                "attributes": {
                  "static": {
                    "class": "slds-tabs_mobile__title"
                  }
                },
                "children": [
                  {
                    "name": "mobileTitleAction",
                    "attributes": {
                      "static": {
                        "class": "slds-tabs_mobile__title-action slds-button slds-button_reset"
                      }
                    },
                    "children": [
                      {
                        "name": "mobileTitleLabel",
                        "attributes": {
                          "static": {
                            "class": "slds-truncate"
                          }
                        }
                      },
                      {
                        "name": "mobileTitleChevron",
                        "attributes": {
                          "static": {
                            "class": "slds-icon slds-icon_x-small slds-icon-text-default",
                            "aria-hidden": "true"
                          }
                        },
                        "children": [
                          {
                            "name": "mobileTitleChevronUse"
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "name": "mobileStackButton",
                "renderWhen": {
                  "prop": "variant",
                  "eq": "mobile-stack"
                },
                "description": "Full-width button rendered as a mobile stack tab item",
                "attributes": {
                  "static": {
                    "class": "slds-button slds-button_full-width"
                  }
                },
                "children": [
                  {
                    "name": "mobileStackButtonLabel",
                    "attributes": {
                      "static": {
                        "class": "slds-truncate"
                      }
                    }
                  },
                  {
                    "name": "mobileStackButtonChevron",
                    "attributes": {
                      "static": {
                        "class": "slds-icon slds-icon_x-small slds-icon-text-default",
                        "aria-hidden": "true"
                      }
                    },
                    "children": [
                      {
                        "name": "mobileStackButtonChevronUse"
                      }
                    ]
                  }
                ]
              }
            ],
            "variants": [
              {
                "name": "tabVariant",
                "description": "Class on each tab <li> for scoped/mobile variants",
                "options": [
                  {
                    "value": "default",
                    "class": "slds-tabs_default__item",
                    "description": "Styles each list item as a single tab"
                  },
                  {
                    "value": "scoped",
                    "class": "slds-tabs_scoped__item"
                  },
                  {
                    "value": "mobile-stack",
                    "class": "slds-tabs-mobile__item",
                    "description": "Styles each list item as a single drill-in tab"
                  },
                  {
                    "value": "mobile-stack-deprecated",
                    "class": "slds-tabs_mobile__item"
                  }
                ]
              }
            ],
            "modifiers": [
              {
                "name": "subTabItem",
                "attribute": "class",
                "value": "slds-sub-tabs__item slds-grid slds-grid_vertical-align-center",
                "description": "Subtab item"
              },
              {
                "name": "overflowButton",
                "attribute": "class",
                "value": "slds-tabs_default__overflow-button",
                "description": "List item containing the overflow button menu"
              },
              {
                "name": "hasError",
                "attribute": "class",
                "value": "slds-has-error",
                "description": "Error notification on a subtab"
              },
              {
                "name": "hasWarning",
                "attribute": "class",
                "value": "slds-has-warning",
                "description": "Warning notification on a subtab"
              },
              {
                "name": "hasSuccess",
                "attribute": "class",
                "value": "slds-has-success",
                "description": "Success notification on a subtab"
              },
              {
                "name": "borderLeft",
                "attribute": "class",
                "value": "slds-border_left",
                "description": "Adds a left divider to the sub-tab item"
              },
              {
                "name": "borderRight",
                "attribute": "class",
                "value": "slds-border_right",
                "description": "Adds a right divider to the sub-tab item"
              }
            ]
          }
        ],
        "variants": [
          {
            "name": "tablistVariant",
            "description": "Class on the tablist <ul> for scoped/mobile variants",
            "options": [
              {
                "value": "default",
                "class": "slds-tabs_default__nav",
                "description": "Creates the container for the default tabs"
              },
              {
                "value": "scoped",
                "class": "slds-tabs_scoped__nav"
              },
              {
                "value": "mobile-stack",
                "class": "slds-tabs-mobile",
                "description": "Styles the list of tabs for the mobile tab set"
              },
              {
                "value": "mobile-stack-deprecated",
                "class": "slds-tabs_mobile"
              }
            ]
          }
        ]
      },
      {
        "name": "panels",
        "restrict": [
          "div"
        ],
        "description": "Tab panels container",
        "children": [
          {
            "name": "panel",
            "restrict": [
              "div"
            ],
            "description": "Styles each tab content wrapper",
            "repeats": true,
            "attributes": {
              "static": {
                "role": "tabpanel",
                "class": "slds-tabs_default__content"
              },
              "bound": {
                "id": {
                  "prop": "panelId"
                },
                "aria-labelledby": {
                  "prop": "tabId"
                }
              }
            },
            "slot": {
              "name": "default"
            },
            "variants": [
              {
                "name": "panelVariant",
                "description": "Class on the panel for scoped variant",
                "options": [
                  {
                    "value": "default",
                    "class": "slds-tabs_default__content",
                    "description": "Styles each tab content wrapper"
                  },
                  {
                    "value": "scoped",
                    "class": "slds-tabs_scoped__content"
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "name": "liveRegion",
        "renderWhen": {
          "prop": "subTabs",
          "eq": "true"
        },
        "attributes": {
          "static": {
            "class": "slds-assistive-text",
            "aria-live": "polite"
          }
        },
        "children": [
          {
            "name": "liveRegionText",
            "description": "Assistive-text announcement of cross-tab activity (e.g., 'New activity in Tab: ...')"
          }
        ]
      },
      {
        "name": "header",
        "description": "Applies bold font weight to header",
        "attributes": {
          "static": {
            "class": "slds-tabs_default__header",
            "role": "heading",
            "aria-level": "2"
          }
        },
        "modifiers": [
          {
            "name": "assistiveText",
            "attribute": "class",
            "value": "slds-assistive-text",
            "description": "Visibly hides the tabs header while keeping it available to assistive technologies"
          }
        ]
      },
      {
        "name": "scrollContainer",
        "renderWhen": {
          "prop": "scrolling",
          "eq": "true"
        },
        "attributes": {
          "static": {
            "class": "slds-tabs__nav-scroller slds-has-overflow"
          }
        },
        "children": [
          {
            "name": "scrollInner",
            "attributes": {
              "static": {
                "class": "slds-tabs__nav-scroller_inner"
              }
            },
            "children": [
              {
                "name": "scrollControls",
                "attributes": {
                  "static": {
                    "class": "slds-tab__scroll-controls"
                  }
                },
                "children": [
                  {
                    "name": "scrollButton",
                    "attributes": {
                      "static": {
                        "class": "slds-button slds-button_icon slds-button_icon-border",
                        "aria-hidden": "true"
                      }
                    },
                    "children": [
                      {
                        "name": "scrollButtonIcon",
                        "attributes": {
                          "static": {
                            "class": "slds-button__icon",
                            "aria-hidden": "true"
                          }
                        },
                        "children": [
                          {
                            "name": "scrollButtonUse"
                          }
                        ]
                      },
                      {
                        "name": "scrollButtonAssistiveText",
                        "attributes": {
                          "static": {
                            "class": "slds-assistive-text"
                          }
                        }
                      }
                    ]
                  }
                ]
              }
            ]
          }
        ]
      },
      {
        "name": "mobileStackPanel",
        "renderWhen": {
          "prop": "variant",
          "eq": "mobile-stack"
        },
        "description": "Slide-in panel that the mobile stack tab reveals.",
        "attributes": {
          "static": {
            "class": "slds-panel slds-panel_docked slds-panel_docked-left slds-panel_animated slds-hidden"
          }
        },
        "children": [
          {
            "name": "mobileStackPanelHeader",
            "attributes": {
              "static": {
                "class": "slds-panel__header slds-panel__header_align-center"
              }
            },
            "children": [
              {
                "name": "mobileStackPanelBackButton",
                "attributes": {
                  "static": {
                    "class": "slds-button slds-button_icon slds-button_icon-small slds-panel__back"
                  }
                },
                "children": [
                  {
                    "name": "mobileStackPanelBackIcon",
                    "attributes": {
                      "static": {
                        "class": "slds-button__icon",
                        "aria-hidden": "true"
                      }
                    },
                    "children": [
                      {
                        "name": "mobileStackPanelBackUse"
                      }
                    ]
                  },
                  {
                    "name": "mobileStackPanelBackAssistiveText",
                    "attributes": {
                      "static": {
                        "class": "slds-assistive-text"
                      }
                    }
                  }
                ]
              },
              {
                "name": "mobileStackPanelTitle",
                "attributes": {
                  "static": {
                    "class": "slds-panel__header-title slds-text-heading_small slds-truncate"
                  }
                }
              }
            ]
          },
          {
            "name": "mobileStackPanelBody",
            "attributes": {
              "static": {
                "class": "slds-panel__body"
              }
            }
          }
        ]
      },
      {
        "name": "cardLook",
        "renderWhen": {
          "prop": "card",
          "eq": "true"
        },
        "description": "Cards nested inside a tabs_card panel (card-look pattern). Composed Card classes appear inline here.",
        "attributes": {
          "static": {
            "class": "slds-card"
          }
        },
        "modifiers": [
          {
            "name": "boundary",
            "attribute": "class",
            "value": "slds-card_boundary",
            "description": "Bordered, rounded boundary on the nested card"
          }
        ],
        "children": [
          {
            "name": "cardLookHeader",
            "attributes": {
              "static": {
                "class": "slds-card__header slds-grid"
              }
            },
            "children": [
              {
                "name": "cardLookHeaderMedia",
                "attributes": {
                  "static": {
                    "class": "slds-media slds-media_center slds-has-flexi-truncate"
                  }
                },
                "children": [
                  {
                    "name": "cardLookHeaderFigure",
                    "attributes": {
                      "static": {
                        "class": "slds-media__figure"
                      }
                    },
                    "children": [
                      {
                        "name": "cardLookHeaderIconContainer",
                        "attributes": {
                          "static": {
                            "class": "slds-icon_container slds-icon-standard-contact"
                          }
                        },
                        "children": [
                          {
                            "name": "cardLookHeaderIconSvg",
                            "attributes": {
                              "static": {
                                "class": "slds-icon slds-icon_small",
                                "aria-hidden": "true"
                              }
                            },
                            "children": [
                              {
                                "name": "cardLookHeaderIconUse"
                              }
                            ]
                          },
                          {
                            "name": "cardLookHeaderIconAssistiveText",
                            "attributes": {
                              "static": {
                                "class": "slds-assistive-text"
                              }
                            }
                          }
                        ]
                      }
                    ]
                  },
                  {
                    "name": "cardLookHeaderBody",
                    "attributes": {
                      "static": {
                        "class": "slds-media__body"
                      }
                    },
                    "children": [
                      {
                        "name": "cardLookHeaderTitle",
                        "attributes": {
                          "static": {
                            "class": "slds-card__header-title"
                          }
                        },
                        "children": [
                          {
                            "name": "cardLookHeaderLink",
                            "attributes": {
                              "static": {
                                "class": "slds-card__header-link slds-truncate"
                              }
                            }
                          }
                        ]
                      }
                    ]
                  },
                  {
                    "name": "cardLookHeaderActions",
                    "attributes": {
                      "static": {
                        "class": "slds-no-flex"
                      }
                    },
                    "children": [
                      {
                        "name": "cardLookHeaderActionButton",
                        "attributes": {
                          "static": {
                            "class": "slds-button slds-button_neutral"
                          }
                        }
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "name": "cardLookBody",
            "attributes": {
              "static": {
                "class": "slds-card__body slds-card__body_inner"
              }
            },
            "children": [
              {
                "name": "cardLookBodyCode",
                "description": "Inline code reference inside the demo body (rendered as <code class=\"doc\">)",
                "attributes": {
                  "static": {
                    "class": "doc"
                  }
                }
              }
            ]
          },
          {
            "name": "cardLookFooter",
            "attributes": {
              "static": {
                "class": "slds-card__footer"
              }
            },
            "children": [
              {
                "name": "cardLookFooterAction",
                "attributes": {
                  "static": {
                    "class": "slds-card__footer-action"
                  }
                },
                "children": [
                  {
                    "name": "cardLookFooterActionAssistiveText",
                    "attributes": {
                      "static": {
                        "class": "slds-assistive-text"
                      }
                    }
                  }
                ]
              }
            ]
          }
        ]
      }
    ],
    "attributes": {
      "static": {
        "class": "slds-tabs_default"
      }
    },
    "modifiers": [
      {
        "name": "size",
        "attribute": "class",
        "description": "Tab size",
        "default": "medium",
        "options": [
          {
            "propValue": "default",
            "value": "",
            "description": "Default sized tabs"
          },
          {
            "propValue": "medium",
            "value": "slds-tabs_medium",
            "description": "Medium sized tabs"
          },
          {
            "propValue": "large",
            "value": "slds-tabs_large",
            "description": "Large sized tabs"
          }
        ]
      },
      {
        "name": "card",
        "attribute": "class",
        "value": "slds-tabs_card",
        "description": "Removes nested card boundaries inside tab panels (card-look pattern)"
      },
      {
        "name": "subTabs",
        "attribute": "class",
        "value": "slds-sub-tabs",
        "description": "Subtabs"
      }
    ],
    "variants": [
      {
        "name": "variant",
        "description": "Tab style variant",
        "default": "default",
        "options": [
          {
            "value": "default",
            "class": "slds-tabs_default",
            "description": "Initializes a default tablist"
          },
          {
            "value": "scoped",
            "class": "slds-tabs_scoped",
            "description": "Tabs with enclosing border for scoped sections"
          },
          {
            "value": "mobile-stack",
            "class": "slds-tabs-mobile__container",
            "description": "Container to hold mobile tabs and their panels"
          },
          {
            "value": "mobile-stack-deprecated",
            "class": "slds-tabs_mobile",
            "description": "Deprecated mobile tab stack pattern. Kept for legacy compatibility.",
            "deprecated": {
              "message": "Use the `mobile-stack` variant instead."
            }
          }
        ]
      }
    ]
  },
  "states": [
    {
      "name": "selectedIndex",
      "type": "enum",
      "description": "Index of the currently selected tab"
    },
    {
      "name": "active",
      "type": "boolean",
      "description": "Active/selected tab marker used by the workspace sub-tabs and scrolling-tabs patterns"
    },
    {
      "name": "disabled",
      "type": "boolean",
      "description": "Whether a tab is disabled"
    },
    {
      "name": "unsaved",
      "type": "boolean",
      "description": "whether a tab has unsaved changes"
    },
    {
      "name": "hasNotification",
      "type": "boolean",
      "description": "whether a tab has an unread notification"
    },
    {
      "name": "focused",
      "type": "boolean",
      "description": "whether a tab has keyboard focus"
    },
    {
      "name": "hidden",
      "type": "boolean",
      "description": "Whether a tab panel is hidden (only one panel is shown at a time)"
    },
    {
      "name": "shown",
      "type": "boolean",
      "description": "Whether a tab panel is currently shown"
    },
    {
      "name": "mobilePanelHidden",
      "type": "boolean",
      "description": "Whether a mobile-stack slide-in panel is currently hidden offscreen"
    }
  ],
  "accessibility": {
    "requirements": [
      {
        "id": "tablist-role",
        "description": "Tab container must have role='tablist'"
      },
      {
        "id": "tab-panel-association",
        "description": "Each tab must be associated with its panel via aria-controls/aria-labelledby"
      },
      {
        "id": "keyboard-navigation",
        "description": "Arrow keys should navigate between tabs, Tab should move to panel content"
      },
      {
        "id": "aria-selected",
        "description": "Selected tab must have aria-selected='true'"
      }
    ]
  },
  "extensions": {
    "com.salesforce-ux": {
      "dateAdded": "2015-09-04",
      "genReady": false,
      "lbc": "lightning-tabset"
    }
  },
  "cssSource": "./tabs.css",
  "styleApi": {
    "status": "stable",
    "ready": true
  },
  "stateClasses": [
    {
      "state": "selectedIndex",
      "class": "slds-is-active"
    },
    {
      "state": "active",
      "class": "slds-active"
    },
    {
      "state": "unsaved",
      "class": "slds-is-unsaved"
    },
    {
      "state": "hasNotification",
      "class": "slds-has-notification"
    },
    {
      "state": "focused",
      "class": "slds-has-focus"
    },
    {
      "state": "hidden",
      "class": "slds-hide"
    },
    {
      "state": "shown",
      "class": "slds-show"
    },
    {
      "state": "mobilePanelHidden",
      "class": "slds-hidden"
    }
  ]
}
