@neovici/cosmoz-tabs 5.2.1 → 5.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/use-tabs.js +2 -4
- package/package.json +8 -9
- package/lib/use-hash-param.js +0 -40
package/lib/use-tabs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useState, useEffect, useMemo, useCallback } from 'haunted';
|
|
2
2
|
import { notifyProperty } from '@neovici/cosmoz-utils/lib/hooks/use-notify-property';
|
|
3
|
-
import { useHashParam, link } from '
|
|
3
|
+
import { useHashParam, link } from '@neovici/cosmoz-page-router/lib/use-hash-param';
|
|
4
4
|
import { choose, collect, getName, isValid } from './utils';
|
|
5
5
|
import computeScroll from 'compute-scroll-into-view';
|
|
6
6
|
|
|
@@ -89,9 +89,7 @@ const useTabSelectedEffect = (host, selectedTab) => {
|
|
|
89
89
|
|
|
90
90
|
e.preventDefault();
|
|
91
91
|
window.history.pushState({}, '', href(tab));
|
|
92
|
-
|
|
93
|
-
requestAnimationFrame(() => window.dispatchEvent(new CustomEvent('location-changed')));
|
|
94
|
-
requestAnimationFrame(() => window.dispatchEvent(new CustomEvent('hash-changed')));
|
|
92
|
+
requestAnimationFrame(() => window.dispatchEvent(new CustomEvent('hashchange')));
|
|
95
93
|
}, []),
|
|
96
94
|
href
|
|
97
95
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neovici/cosmoz-tabs",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.3.0",
|
|
4
4
|
"description": "A multi views container element that allow navigation between the views using tabs or an accordion.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"web-components"
|
|
@@ -54,7 +54,8 @@
|
|
|
54
54
|
]
|
|
55
55
|
},
|
|
56
56
|
"dependencies": {
|
|
57
|
-
"@neovici/cosmoz-
|
|
57
|
+
"@neovici/cosmoz-page-router": "^7.0.0",
|
|
58
|
+
"@neovici/cosmoz-utils": "^3.25.0",
|
|
58
59
|
"@polymer/iron-icon": "^3.0.0",
|
|
59
60
|
"@polymer/iron-icons": "^3.0.0",
|
|
60
61
|
"compute-scroll-into-view": "^1.0.17",
|
|
@@ -62,9 +63,9 @@
|
|
|
62
63
|
"lit-html": "^1.4.0"
|
|
63
64
|
},
|
|
64
65
|
"devDependencies": {
|
|
65
|
-
"@commitlint/cli": "^
|
|
66
|
-
"@commitlint/config-conventional": "^
|
|
67
|
-
"@neovici/
|
|
66
|
+
"@commitlint/cli": "^16.0.0",
|
|
67
|
+
"@commitlint/config-conventional": "^16.0.0",
|
|
68
|
+
"@neovici/cfg": "^1.11.0",
|
|
68
69
|
"@open-wc/demoing-storybook": "^2.4.0",
|
|
69
70
|
"@open-wc/testing": "^2.5.0",
|
|
70
71
|
"@polymer/iron-list": "^3.1.0",
|
|
@@ -72,11 +73,9 @@
|
|
|
72
73
|
"@semantic-release/git": "^10.0.0",
|
|
73
74
|
"@storybook/storybook-deployer": "^2.8.0",
|
|
74
75
|
"@web/test-runner": "^0.13.18",
|
|
75
|
-
"@web/test-runner-selenium": "^0.5.2",
|
|
76
|
-
"eslint": "^7.32.0",
|
|
77
76
|
"husky": "^7.0.0",
|
|
78
|
-
"semantic-release": "^
|
|
79
|
-
"sinon": "^
|
|
77
|
+
"semantic-release": "^19.0.0",
|
|
78
|
+
"sinon": "^13.0.0",
|
|
80
79
|
"typescript": "^4.4.0"
|
|
81
80
|
}
|
|
82
81
|
}
|
package/lib/use-hash-param.js
DELETED
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
useState, useEffect, useMemo
|
|
3
|
-
} from 'haunted';
|
|
4
|
-
|
|
5
|
-
const hashUrl = () => new URL(location.hash.replace(/^#!?/iu, '').replace('%23', '#'), location.origin),
|
|
6
|
-
parameterize = hashParam => hashParam ? () => new URLSearchParams(hashUrl().hash.replace('#', '')).get(hashParam) : undefined,
|
|
7
|
-
link = (hashParam, value) => {
|
|
8
|
-
if (!hashParam) {
|
|
9
|
-
return;
|
|
10
|
-
}
|
|
11
|
-
const url = hashUrl(),
|
|
12
|
-
sp = new URLSearchParams(url.hash.replace('#', ''));
|
|
13
|
-
sp.set(hashParam, value);
|
|
14
|
-
return '#!' + Object.assign(url, { hash: sp }).href.replace(location.origin, '');
|
|
15
|
-
},
|
|
16
|
-
useHashParam = hashParam => {
|
|
17
|
-
const parameterized = useMemo(() => parameterize(hashParam), [hashParam]),
|
|
18
|
-
[param, setParam] = useState(parameterized);
|
|
19
|
-
|
|
20
|
-
useEffect(() => {
|
|
21
|
-
if (parameterized == null) {
|
|
22
|
-
return;
|
|
23
|
-
}
|
|
24
|
-
const readParam = () => requestAnimationFrame(() => setParam(parameterized));
|
|
25
|
-
readParam();
|
|
26
|
-
window.addEventListener('popstate', readParam);
|
|
27
|
-
window.addEventListener('hash-changed', readParam);
|
|
28
|
-
return () => {
|
|
29
|
-
window.removeEventListener('popstate', readParam);
|
|
30
|
-
window.removeEventListener('hash-changed', readParam);
|
|
31
|
-
};
|
|
32
|
-
}, [parameterized]);
|
|
33
|
-
|
|
34
|
-
return param;
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
export {
|
|
38
|
-
link,
|
|
39
|
-
useHashParam
|
|
40
|
-
};
|