4.0.9 • Published 11 months ago

@ndla/tabs v4.0.9

Weekly downloads
312
License
GPL-3.0
Repository
github
Last release
11 months ago

ndla-tabs

A simple tabs component.

Installation

yarn add --save @ndla/tabs
npm install @ndla/tabs --save

Usage

Basic example

import { Tabs } from "@ndla/tabs";
import BananaComponent from "banana";
import PickleComponent from "picke";

const Fruits = () => {
  const fruitTabs = [
    {
      title: "Apple",
      id: "apple",
      content: <p>An apple a day keeps the doctor away</p>,
    },
    {
      title: "Orange",
      id: "orange",
      content: () => <h1>Orange is the new black</h1>,
    },
    { title: "Banana", id: "banana", content: <BananaComponent /> },
    {
      title: "Pickle",
      id: "pickle",
      content: <PickleComponent />,
      disabled: true,
    }, // No vegetables allowed!
  ];
  return <Tabs tabs={fruitTabs} />;
};

Example where selected tab is controlled via selectedIndex prop

import Tabs from "@ndla/tabs";
import fruitTabs from "fruit-tabs";

const FruitTabSelector = () => {
  const [value, setValue] = useState(undefined);
  return (
    <div>
      <button onClick={() => setValue("banana")}>Show banana tab</button>
      <Tabs value={value} tabs={fruitTabs} />
    </div>
  );
};
4.0.7

1 year ago

4.0.6

1 year ago

4.0.9

11 months ago

4.0.8

1 year ago

4.0.5

1 year ago

4.0.4

1 year ago

4.0.3

1 year ago

4.0.2

1 year ago

4.0.1

1 year ago

4.0.0

1 year ago

3.2.17

1 year ago

3.2.16

1 year ago

3.2.15

1 year ago

3.2.14

1 year ago

3.2.13

1 year ago

3.2.12

1 year ago

3.2.11

2 years ago

3.2.10

2 years ago

3.2.9

2 years ago

3.2.8

2 years ago

3.2.7

2 years ago

3.2.6

2 years ago

3.2.5

2 years ago

3.2.2

2 years ago

3.2.1

2 years ago

3.2.0

2 years ago

3.0.10

2 years ago

3.0.11

2 years ago

3.2.3

2 years ago

3.1.3

2 years ago

3.1.2

2 years ago

3.1.0

2 years ago

3.1.5

2 years ago

3.1.4

2 years ago

3.0.4

2 years ago

3.0.8

2 years ago

3.0.7

2 years ago

3.0.6

2 years ago

3.0.5

2 years ago

3.0.9

2 years ago

3.0.3

2 years ago

2.2.0

2 years ago

2.2.3

2 years ago

2.2.2

2 years ago

2.2.5

2 years ago

2.2.4

2 years ago

3.0.2

2 years ago

3.0.1

2 years ago

3.0.0

2 years ago

2.1.9

2 years ago

2.1.16

2 years ago

2.1.17

2 years ago

2.1.14

2 years ago

2.1.15

2 years ago

2.1.12

2 years ago

2.1.13

2 years ago

2.1.10

2 years ago

2.1.11

2 years ago

2.1.18

2 years ago

2.1.19

2 years ago

2.1.20

2 years ago

2.1.4

2 years ago

2.1.6

2 years ago

2.1.5

2 years ago

2.1.8

2 years ago

2.1.7

2 years ago

2.1.2

2 years ago

2.1.1

3 years ago

2.1.3

2 years ago

2.0.9

3 years ago

2.0.11

3 years ago

2.0.12

3 years ago

2.0.10

3 years ago

2.1.0

3 years ago

2.0.5

3 years ago

2.0.4

3 years ago

2.0.7

3 years ago

2.0.6

3 years ago

2.0.8

3 years ago

2.0.1

3 years ago

2.0.0

3 years ago

1.1.23

3 years ago

1.1.19

3 years ago

1.1.18

3 years ago

1.1.22

3 years ago

1.1.21

3 years ago

1.1.20

3 years ago

1.1.9

3 years ago

1.1.8

3 years ago

1.1.7

3 years ago

1.1.11

3 years ago

1.1.10

3 years ago

1.1.16

3 years ago

1.1.15

3 years ago

1.1.14

3 years ago

1.1.13

3 years ago

1.1.17

3 years ago

1.1.6

3 years ago

1.1.5

3 years ago

1.1.4

3 years ago

1.1.3

3 years ago

1.1.2

3 years ago

1.0.19

3 years ago

1.1.1-alpha.20

3 years ago

1.1.1

3 years ago

1.1.0

3 years ago

1.0.18

3 years ago

1.0.17

3 years ago

1.0.16

3 years ago

1.0.9

4 years ago

1.0.11

4 years ago

1.0.10

4 years ago

1.0.15

3 years ago

1.0.13

3 years ago

1.0.12

3 years ago

1.0.8

4 years ago

1.0.7

4 years ago

1.0.6

4 years ago

1.0.5

4 years ago

1.0.4

4 years ago

1.0.3

4 years ago

1.0.2

4 years ago

1.0.1

4 years ago

1.0.0

4 years ago

0.11.52

4 years ago

0.11.51

4 years ago

0.11.50

4 years ago

0.11.49

4 years ago

0.11.48

4 years ago

0.11.47

4 years ago

0.11.44

4 years ago

0.11.45

4 years ago

0.11.46

4 years ago

0.11.43

4 years ago

0.11.42

5 years ago

0.11.41

5 years ago

0.11.40

5 years ago

0.11.39

5 years ago

0.11.38

5 years ago

0.11.37

5 years ago

0.11.36

5 years ago

0.11.35

5 years ago

0.11.34

5 years ago

0.11.32

5 years ago

0.11.31

5 years ago

0.11.30

5 years ago

0.11.29

5 years ago

0.11.28

5 years ago

0.11.27

5 years ago

0.11.26

5 years ago

0.11.25

5 years ago

0.11.24

5 years ago

0.11.23

5 years ago

0.11.22

6 years ago

0.11.21

6 years ago

0.11.20

6 years ago

0.11.19

6 years ago

0.11.18

6 years ago

0.11.17

6 years ago

0.11.16

6 years ago

0.11.15

6 years ago

0.11.14

6 years ago

0.11.13

6 years ago

0.11.12

6 years ago

0.11.11

6 years ago

0.11.9

6 years ago

0.11.8

6 years ago

0.11.7

6 years ago

0.11.6

6 years ago

0.11.5

6 years ago

0.11.4

6 years ago

0.11.3

6 years ago

0.11.2

6 years ago

0.11.1

6 years ago

0.11.0

6 years ago

0.10.3-alpha.0

6 years ago

0.10.3

6 years ago

0.10.2-alpha.31

6 years ago

0.10.2

6 years ago

0.10.1

6 years ago

0.10.0

6 years ago

0.9.8

6 years ago

0.9.7

6 years ago

0.9.6

7 years ago

0.9.5

7 years ago

0.9.4

7 years ago

0.9.3

7 years ago

0.9.2

7 years ago

0.9.1

7 years ago

0.9.0

7 years ago