Merge pull request #194 from Neovici/feat/on-activate

feat(use-tabs): add onActivate
Neovici · Mar 24, 2023 · 138a3dc · 138a3dc
2 parents f986406 + 4489dd0
commit 138a3dc
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 13 deletions.
diff --git a/src/next/use-tabs.d.ts b/src/next/use-tabs.d.ts
@@ -11,6 +11,7 @@ export interface RenderTab extends Tab {
 
 export interface Options {
 	hashParam?: string;
+	onActivate?: (name: string) => void;
 }
 
 type Unpacked<T> = T extends (infer U)[] ? U : T;
@@ -30,7 +31,7 @@ export type RenderTabs<T extends Tab> = Pick<
 
 export declare const useTabs: <T extends Tab, P extends Options>(
 	tabs: T[],
-	opts: P
+	opts?: P
 ) => Result<T>;
 
 export interface RenderOptions<T extends RenderTab> {

diff --git a/src/next/use-tabs.js b/src/next/use-tabs.js
@@ -16,15 +16,21 @@ const isValid = (tab) => !tab.hidden && !tab.disabled,
 		return tab && isValid(tab) ? tab : valid(tabs);
 	};
 
-export const useTabs = (tabs, { hashParam }) => {
+export const useTabs = (tabs, { hashParam, onActivate }) => {
 	const [name, activate] = useHashParam(hashParam),
 		ref = useRef([]),
 		active = useMemo(() => choose(tabs, name), [tabs, name]),
 		activated = useMemo(() => {
 			const name = active.name;
 			return (ref.current = [...ref.current.filter((i) => i !== name), name]);
-		}, [active]),
-		onActivate = useCallback(
+		}, [active]);
+
+	return {
+		tabs,
+		active,
+		activated,
+		activate,
+		onActivate: useCallback(
 			(e) => {
 				if (e.button !== 0 || e.metaKey || e.ctrlKey) {
 					return;
@@ -33,17 +39,11 @@ export const useTabs = (tabs, { hashParam }) => {
 				if (!name) {
 					return;
 				}
+				onActivate?.(name);
 				activate(name);
 			},
-			[activate]
-		);
-
-	return {
-		tabs,
-		active,
-		activated,
-		activate,
-		onActivate,
+			[activate, onActivate]
+		),
 	};
 };