Skip to content

Commit

Permalink
update documentation and its package.json file
Browse files Browse the repository at this point in the history
  • Loading branch information
dev-javascript committed Oct 30, 2024
1 parent 0c5ec0d commit 231b3c5
Show file tree
Hide file tree
Showing 2 changed files with 26 additions and 17 deletions.
14 changes: 7 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@

[![Test coverage](https://codecov.io/gh/dev-javascript/tabs-more-button/graph/badge.svg?token=GT1LU074L2)](https://codecov.io/gh/dev-javascript/tabs-more-button) [![NPM version](http://img.shields.io/npm/v/tabs-more-button.svg?style=flat-square)](http://npmjs.org/package/tabs-more-button) [![License](http://img.shields.io/npm/l/tabs-more-button.svg?style=flat-square)](LICENSE) [![npm download](https://img.shields.io/npm/dm/tabs-more-button.svg?style=flat-square)](https://npmjs.org/package/tabs-more-button) [![Build Status](https://travis-ci.org/ly-components/tabs-more-button.png)](https://travis-ci.org/ly-components/tabs-more-button)

Responsive Tabs with more button

Making tabs responsive by hiding overflow tabs except active tab
`tabs-more-button` is a lightweight library designed to enhance your tabbed interfaces by making them responsive.​ This package does not create or manage tabs, but it intelligently hides overflow tabs while ensuring that the active tab remains visible. Ideal for scenarios where space is limited

## Features

- Responsive

- `Vertical` support

- `rtl` support
Expand Down Expand Up @@ -70,7 +70,7 @@ document.getElementById('view-more-button').addEventListener('click', () => cons

## Rules

- `view more` button should be sibling element of `Tablist` element
- `view more` button is required to display the hidden tabs and should be next sibling element of `Tablist` element

- `tabs` and `view more` button should be kept on same line

Expand All @@ -81,12 +81,12 @@ document.getElementById('view-more-button').addEventListener('click', () => cons
- buttonElement

- type : `HtmlELement`
- description : `view more` button (should be sibling element of `Tablist` element)
- description : `view more` button

- containerElement

- type : `HtmlELement`
- description : the first ancestor of `view more` button which its `width|height` is not relative to `Tablist` element but is relative to `viewport`
- description : parent element of `view more` button and `Tablist` element

- tablistElement

Expand All @@ -101,7 +101,7 @@ document.getElementById('view-more-button').addEventListener('click', () => cons

- containerDisplay?

- type : `string`
- type : `"flex"`|`"block"`
- description : `display` value for `containerElement`
- default value : `flex`

Expand Down
29 changes: 19 additions & 10 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,29 @@
"name": "tabs-more-button",
"version": "1.0.1",
"private": false,
"description": "A lightweight library for making tabbed interfaces responsive by hiding overflow tabs while keeping the active tab visible.",
"keywords": [
"tabs",
"responsive",
"responsive tabs",
"more button",
"show more",
"view more",
"js",
"javascript",
"user-interface",
"web",
"overflow",
"active tab",
"tab management",
"horizontal tabs",
"vertical tabs",
"RTL"
],
"author": {
"name": "dev-javascript",
"email": "javascript.code.dev@gmail.com"
},
"description": "Responsive Tabs with more button",
"main": "lib/cjs/api.js",
"module": "lib/esm/api.js",
"repository": {
Expand Down Expand Up @@ -67,15 +85,6 @@
"index.d.ts",
"__tests__"
],
"keywords": [
"tabs",
"responsive",
"more-button",
"show-more",
"view-more",
"js",
"javascript"
],
"license": "MIT",
"directories": {
"lib": "lib"
Expand Down

0 comments on commit 231b3c5

Please sign in to comment.