diff --git a/packages/tabs/tabs-overflow.md b/packages/tabs/tabs-overflow.md index 538b409fac..a8897aabb3 100644 --- a/packages/tabs/tabs-overflow.md +++ b/packages/tabs/tabs-overflow.md @@ -6,23 +6,24 @@ _Note: Veritical scrolling is not yet supported._ ### Usage -[![See it on NPM!](https://img.shields.io/npm/v/@spectrum-web-components/tabs-overflow?style=for-the-badge)](https://www.npmjs.com/package/@spectrum-web-components/tabs-overflow) -[![How big is this package in your project?](https://img.shields.io/bundlephobia/minzip/@spectrum-web-components/tabs-overflow?style=for-the-badge)](https://bundlephobia.com/result?p=@spectrum-web-components/tabs-overflow) +[![See it on NPM!](https://img.shields.io/npm/v/@spectrum-web-components/tabs?style=for-the-badge)](https://www.npmjs.com/package/@spectrum-web-components/tabs) +[![How big is this package in your project?](https://img.shields.io/bundlephobia/minzip/@spectrum-web-components/tabs?style=for-the-badge)](https://bundlephobia.com/result?p=@spectrum-web-components/tabs) +[![Try it on webcomponents.dev](https://img.shields.io/badge/Try%20it%20on-webcomponents.dev-green?style=for-the-badge)](https://webcomponents.dev/edit/collection/fO75441E1Q5ZlI0e9pgq/2JFFTBPXfCZpePD0wk58/src/index.ts) ``` -yarn add @spectrum-web-components/tabs-overflow +yarn add @spectrum-web-components/tabs ``` To import the `` component with its associated side effects, use the following import statement: ``` -import '@spectrum-web-components/tabs-overflow/sp-tabs-overflow.js'; +import '@spectrum-web-components/tabs/sp-tabs-overflow.js'; ``` To utilize the `TabsOverflow` base class as a type or for extending its functionality, utilize the following method: ``` -import { TabsOverflow } from '@spectrum-web-components/tabs-overflow'; +import { TabsOverflow } from '@spectrum-web-components/tabs'; ``` ## Example @@ -30,17 +31,25 @@ import { TabsOverflow } from '@spectrum-web-components/tabs-overflow'; To use the `` component, simply wrap it around the `` element as a child element: ```html -
+
+ + + + Content for Tab 1 Content for Tab 2 Content for Tab 3 Content for Tab 4 + Content for Tab 5 + Content for Tab 6 + Content for Tab 7 + Content for Tab 8
diff --git a/tools/bundle/elements.ts b/tools/bundle/elements.ts index 7b93f5278a..12e537eec7 100644 --- a/tools/bundle/elements.ts +++ b/tools/bundle/elements.ts @@ -81,6 +81,7 @@ import '@spectrum-web-components/table/sp-table-row.js'; import '@spectrum-web-components/tabs/sp-tab.js'; import '@spectrum-web-components/tabs/sp-tabs.js'; import '@spectrum-web-components/tabs/sp-tab-panel.js'; +import '@spectrum-web-components/tabs/sp-tabs-overflow.js'; import '@spectrum-web-components/tags/sp-tag.js'; import '@spectrum-web-components/tags/sp-tags.js'; import '@spectrum-web-components/textfield/sp-textfield.js';