# preact-hashtabs

> Minimal tabs component for preact, based on window hash

Latest version **1.2.1** (published 2017-09-14) · ISC license · 0 weekly downloads

## Install

```sh
npm install preact-hashtabs
pnpm add preact-hashtabs
yarn add preact-hashtabs
bun add preact-hashtabs
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.1 |
| Published | 2017-09-14 |
| First published | 2017-09-14 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | AnqurVanillapy |
| Maintainers | anqurvanillapy |
| Keywords | preact |

## Links

- npm: https://www.npmjs.com/package/preact-hashtabs
- Repository: https://github.com/anqurvanillapy/preact-tabs
- Homepage: https://github.com/anqurvanillapy/preact-tabs#readme
- Issues: https://github.com/anqurvanillapy/preact-tabs/issues
- npm.io page: https://npm.io/package/preact-hashtabs

## Dependencies (1)

- [preact](https://npm.io/package/preact.md) ^8.2.1

## Recent versions

- 1.2.1 (latest) — 2017-09-14
- 1.2.0 — 2017-09-14
- 1.1.0 — 2017-09-14
- 1.0.4 — 2017-09-14
- 1.0.3 — 2017-09-14
- 1.0.1 — 2017-09-14
- 1.0.0 — 2017-09-14

## README

# preact-hashtabs

A minimal `<Tabs />` component for
[preact](https://github.com/developit/preact) based on
`window.location.hash`, so it is **not suitable** for complicated use of nested
tabs, and its functionality is yet very simple.

## Properties

### `tabdefault`

Activate a tab with `tabdefault` if no hash in current locaion.  If there are
multiple default tabs, the last one will be enabled.

### `label`

`href` and text content for the link (`<a />`) of a tab, e.g. `{foo: 'Foo'}`.

### `activeClassName`

A class name to append in the active tab's `classList`.

## Example

[anqurvanillapy.github.io/preact-hashtabs](https://anqurvanillapy.github.io/preact-hashtabs)

```js
import { h, render } from 'preact'
import { Tabs, Tab } from 'preact-hashtabs'

const App = () => (
  <Tabs>
    <Tab
      tabdefault
      label={{tab0: 'Tab 0'}}
      activeClassName='active'
    >
      <p>foo</p>
    </Tab>
    <Tab label={{tab1: 'Tab 1'}} activeClassName='active'>
      <p>bar</p>
    </Tab>
    <Tab label={{tab2: 'Tab 2'}} activeClassName='active'>
      <p>baz</p>
    </Tab>
    <Tab label={{tab3: 'Tab 3'}} activeClassName='active'>
      <p>qux</p>
    </Tab>
  </Tabs>
)

render(<App />, document.body)
```

## Install

```bash
$ npm i -s preact-hashtabs
```

## License

ISC

---
_Source: https://npm.io/package/preact-hashtabs · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._