webawesome/docs/pages/components/tab.md at 31ef2f79296a459b716fd5ebb5778cf766b34db0

mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 04:09:12 +00:00

Files

Konnor Rogers 31ef2f7929 remove side-effects key, update React docs for cherry-picking (#1485 )

* remove side-effects, update React docs for cherry-picking

* prettier

* add PR #

* prettier

* fix react import paths

* Update docs/pages/frameworks/react.md

Co-authored-by: Cory LaViska <cory@abeautifulsite.net>

* add colons to imports

---------

Co-authored-by: Cory LaViska <cory@abeautifulsite.net>

2023-08-07 13:20:34 -04:00

623 B

Raw Blame History

meta, layout

meta

layout

title	description
Tab	Tabs are used inside tab groups to represent and activate tab panels.

component

<sl-tab>Tab</sl-tab>
<sl-tab active>Active</sl-tab>
<sl-tab closable>Closable</sl-tab>
<sl-tab disabled>Disabled</sl-tab>

import SlTab from '@shoelace-style/shoelace/dist/react/sl-tab';

const App = () => (
  <>
    <SlTab>Tab</SlTab>
    <SlTab active>Active</SlTab>
    <SlTab closable>Closable</SlTab>
    <SlTab disabled>Disabled</SlTab>
  </>
);

:::tip Additional demonstrations can be found in the tab group examples. :::

623 B Raw Blame History

623 B

Raw Blame History