@neovici/cosmoz-tabs 5.4.0 → 6.0.0-beta.1

package/README.md

@@ -1,5 +1,4 @@
 [![Build Status](https://github.com/Neovici/cosmoz-tabs/workflows/Github%20CI/badge.svg)](https://github.com/Neovici/cosmoz-tabs/actions?workflow=Github+CI)
-[![Code Climate](https://codeclimate.com/github/codeclimate/codeclimate/badges/gpa.svg)](https://codeclimate.com/github/Neovici/cosmoz-tabs)
 [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/Neovici/cosmoz-tabs)
 [![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@neovici/cosmoz-tabs",
-	"version": "5.4.0",
+	"version": "6.0.0-beta.1",
 	"description": "A multi views container element that allow navigation between the views using tabs or an accordion.",
 	"keywords": [
 		"web-components"
@@ -60,19 +60,19 @@
 		"./next/*": "./src/next/*"
 	},
 	"dependencies": {
-		"@neovici/cosmoz-page-router": "^8.0.0",
-		"@neovici/cosmoz-utils": "^3.25.0",
+		"@neovici/cosmoz-page-router": "^9.0.0-beta.3",
+		"@neovici/cosmoz-utils": "^4.0.0-beta.2",
 		"@polymer/iron-icon": "^3.0.0",
 		"@polymer/iron-icons": "^3.0.0",
 		"compute-scroll-into-view": "^1.0.17",
-		"haunted": "^4.8.0",
-		"lit-html": "^1.4.0"
+		"haunted": "^5.0.0",
+		"lit-html": "^2.0.0"
 	},
 	"devDependencies": {
 		"@commitlint/cli": "^17.0.0",
 		"@commitlint/config-conventional": "^17.0.0",
 		"@neovici/cfg": "^1.11.0",
-		"@open-wc/testing": "^2.5.0",
+		"@open-wc/testing": "^3.0.0",
 		"@polymer/iron-list": "^3.1.0",
 		"@semantic-release/changelog": "^6.0.0",
 		"@semantic-release/git": "^10.0.0",

package/src/next/cosmoz-tab.js

@@ -1,6 +1,6 @@
 import { component, useEffect, useLayoutEffect } from 'haunted';
 import { html, nothing } from 'lit-html';
-import { ifDefined } from 'lit-html/directives/if-defined';
+import { ifDefined } from 'lit-html/directives/if-defined.js';
 import computeScroll from 'compute-scroll-into-view';
 
 import style from './cosmoz-tab.css';

package/src/next/use-tabs.js

@@ -1,8 +1,10 @@
 /* eslint-disable import/group-exports */
 import { html, useMemo, useCallback, useRef } from 'haunted';
-import { useHashParam } from '@neovici/cosmoz-page-router/lib/use-hash-param';
+import { ifDefined } from 'lit-html/directives/if-defined.js';
+/* eslint-disable-next-line import/no-unresolved */
+import { useHashParam } from '@neovici/cosmoz-page-router/use-hash-param';
 
-const isValid = (tab) => !tab.hidden && !tab.disabled,
+const isValid = (tab) => !tab.hidden && !tab.disaebled,
 	valid = (tabs) => tabs.find(isValid),
 	choose = (tabs, name) => {
 		const tab = name && tabs.find((tab) => tab.name === name);
@@ -22,7 +24,10 @@ export const useTabs = (tabs, { hashParam }) => {
 				if (e.button !== 0 || e.metaKey || e.ctrlKey) {
 					return;
 				}
-				const { name } = e.currentTarget;
+				const name = e.currentTarget?.getAttribute('name');
+				if (!name) {
+					return;
+				}
 				activate(name);
 			},
 			[activate]
@@ -44,7 +49,8 @@ export const renderTabs = ({ tabs, active, onActivate }) =>
 			?active=${active.name === tab.name}
 			?hidden=${tab.hidden}
 			?disabled=${tab.disabled}
+			title=${ifDefined(typeof tab.title === 'string' ? tab.title : undefined)}
 			@click=${onActivate}
-			>${tab.title}</cosmoz-tab-next
+			>${tab.content ?? tab.title}</cosmoz-tab-next
 		>`
 	);

package/src/render.js

@@ -1,5 +1,5 @@
 import { html } from 'haunted';
-import { ifDefined } from 'lit-html/directives/if-defined';
+import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { getIcon, getIconStyle } from './utils';
 
 const style = `

package/src/use-tabs.js

@@ -1,6 +1,7 @@
 import { useState, useEffect, useMemo, useCallback } from 'haunted';
 import { notifyProperty } from '@neovici/cosmoz-utils/lib/hooks/use-notify-property';
-import { useHashParam, link } from '@neovici/cosmoz-page-router/lib/use-hash-param';
+/* eslint-disable-next-line import/no-unresolved */
+import { useHashParam, link } from '@neovici/cosmoz-page-router/use-hash-param';
 import { choose, collect, getName, isValid } from './utils';
 import computeScroll from 'compute-scroll-into-view';