@factorialco/f0-react 12.2.0 → 12.3.0

package/dist/component-status.js

@@ -4,7 +4,7 @@ import { useCallback as i, useEffect as a, useRef as o, useState as s } from "re
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region \0virtual:f0-component-status-data
 var u = {
-	generatedAt: "2026-10-30T13:19:45.666Z",
+	generatedAt: "2026-10-30T15:59:26.589Z",
 	stats: {
 		total: 312,
 		byStatus: {
@@ -3393,7 +3393,7 @@ var u = {
 				hasWhenToUse: !0,
 				hasWhenNotToUse: !0,
 				hasDoDonts: !0,
-				exampleCount: 7
+				exampleCount: 8
 			},
 			a11yTier: "enforced",
 			storyFile: "blocks/Navigation/Sidebar/F0PrimarySidebar/__stories__/F0PrimarySidebar.stories.tsx"

package/dist/experimental.d.ts

@@ -3480,6 +3480,12 @@ type F0PrimarySidebarAction = {
   label: string;
   icon: IconType;
   onClick: () => void;
+  /**
+   * The button opens the page that is on screen, such as the settings. It is
+   * marked like the active tab. Set `activeTab` to an id no tab has, so no tab
+   * is marked as well.
+   */
+  active?: boolean;
   /** Show the unread marker over the icon. */
   hasUpdates?: boolean;
   /** A count shown instead of the plain marker. */

package/dist/experimental.js

@@ -12683,16 +12683,20 @@ var xT = (e) => e ? `f0-sidebar-tab:${e}` : null, ST = (e) => {
 	}
 };
 function CT(e, t, n, r) {
-	let i = xT(e), a = Y(!1), o = t.some((e) => e.href !== void 0);
+	let i = xT(e), a = Y(!1), o = t.some((e) => e.href !== void 0), s = t.some((e) => e.id === n);
 	q(function() {
-		if (!i || a.current || (a.current = !0, o)) return;
+		if (!i || a.current || (a.current = !0, o || !s)) return;
 		let e = ST(i);
 		e && e !== n && t.some((t) => t.id === e) && r(e);
 	}, [i]), q(function() {
-		if (i) try {
+		if (i && s) try {
 			localStorage.setItem(i, n);
 		} catch {}
-	}, [i, n]);
+	}, [
+		i,
+		n,
+		s
+	]);
 }
 //#endregion
 //#region src/blocks/Navigation/Sidebar/F0PrimarySidebar/hooks/usePresentItems.ts
@@ -12990,7 +12994,7 @@ var RT = 350, zT = (e = !0) => {
 				glyph: /* @__PURE__ */ Q(H, {
 					icon: e.icon,
 					size: "lg",
-					color: "default"
+					color: e.active ? "bold" : "default"
 				})
 			}), /* @__PURE__ */ Q(UT, {
 				badge: e.badge,
@@ -13000,8 +13004,9 @@ var RT = 350, zT = (e = !0) => {
 	}), s = /* @__PURE__ */ Q("button", {
 		type: "button",
 		"aria-label": r,
+		"aria-current": e.active ? "page" : void 0,
 		onClick: e.options ? void 0 : e.onClick,
-		className: G("flex size-9 cursor-pointer items-center justify-center rounded-lg group-hover:bg-f1-background-secondary data-[state=open]:bg-f1-background-secondary", e.options ? Zw : Xw, !e.options && "static after:absolute after:inset-0 after:z-10 after:content-['']", ir()),
+		className: G("flex size-9 cursor-pointer items-center justify-center rounded-lg data-[state=open]:bg-f1-background-secondary", e.active ? "bg-f1-background-secondary" : "group-hover:bg-f1-background-secondary", e.options ? Zw : Xw, !e.options && "static after:absolute after:inset-0 after:z-10 after:content-['']", ir()),
 		...e.options ? a : {},
 		children: e.options ? /* @__PURE__ */ Q(Yw, {
 			itemId: e.id,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@factorialco/f0-react",
-  "version": "12.2.0",
+  "version": "12.3.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/factorialco/f0.git",