@checkstack/theme-frontend 0.1.25 → 0.1.26
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/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @checkstack/theme-frontend
|
|
2
2
|
|
|
3
|
+
## 0.1.26
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 594eecc: Implemented a manual "Low Power Mode" toggle in the user menu, allowing users to explicitly disable expensive visual effects. This replaces the previous automatic performance diagnostics with a more predictable, user-controlled system that persists to localStorage while still respecting OS-level "Reduced Motion" settings.
|
|
8
|
+
- Updated dependencies [594eecc]
|
|
9
|
+
- @checkstack/ui@1.3.3
|
|
10
|
+
- @checkstack/auth-frontend@0.5.22
|
|
11
|
+
|
|
3
12
|
## 0.1.25
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
package/package.json
CHANGED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { Zap, ZapOff } from "lucide-react";
|
|
2
|
+
import { Toggle, usePerformance } from "@checkstack/ui";
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Performance toggle menu item for the UserMenu.
|
|
6
|
+
* Allows users to manually force Low Performance Mode (disabling blurs/animations).
|
|
7
|
+
*/
|
|
8
|
+
export const PerformanceToggleMenuItem = () => {
|
|
9
|
+
const { manualLowPower, toggleManualLowPower } = usePerformance();
|
|
10
|
+
|
|
11
|
+
return (
|
|
12
|
+
<div className="flex items-center justify-between w-full px-4 py-2 text-sm text-popover-foreground">
|
|
13
|
+
<div className="flex items-center gap-2">
|
|
14
|
+
{manualLowPower ? (
|
|
15
|
+
<ZapOff className="h-4 w-4 text-muted-foreground" />
|
|
16
|
+
) : (
|
|
17
|
+
<Zap className="h-4 w-4 text-primary" />
|
|
18
|
+
)}
|
|
19
|
+
<div className="flex flex-col">
|
|
20
|
+
<span>Low Power Mode</span>
|
|
21
|
+
<span className="text-[10px] text-muted-foreground leading-tight">
|
|
22
|
+
Disables blurs & animations
|
|
23
|
+
</span>
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
|
+
<Toggle
|
|
27
|
+
checked={manualLowPower}
|
|
28
|
+
onCheckedChange={toggleManualLowPower}
|
|
29
|
+
aria-label="Toggle low performance mode"
|
|
30
|
+
/>
|
|
31
|
+
</div>
|
|
32
|
+
);
|
|
33
|
+
};
|
package/src/index.tsx
CHANGED
|
@@ -5,6 +5,7 @@ import {
|
|
|
5
5
|
} from "@checkstack/frontend-api";
|
|
6
6
|
import { pluginMetadata } from "@checkstack/theme-common";
|
|
7
7
|
import { ThemeToggleMenuItem } from "./components/ThemeToggleMenuItem";
|
|
8
|
+
import { PerformanceToggleMenuItem } from "./components/PerformanceToggleMenuItem";
|
|
8
9
|
import { ThemeSynchronizer } from "./components/ThemeSynchronizer";
|
|
9
10
|
import { NavbarThemeToggle } from "./components/NavbarThemeToggle";
|
|
10
11
|
|
|
@@ -14,10 +15,16 @@ export const themePlugin = createFrontendPlugin({
|
|
|
14
15
|
extensions: [
|
|
15
16
|
// Theme toggle in user menu (for logged-in users)
|
|
16
17
|
{
|
|
17
|
-
id: "theme.user-menu.toggle",
|
|
18
|
+
id: "theme.user-menu.theme.toggle",
|
|
18
19
|
slot: UserMenuItemsBottomSlot,
|
|
19
20
|
component: ThemeToggleMenuItem,
|
|
20
21
|
},
|
|
22
|
+
// Performance toggle in user menu
|
|
23
|
+
{
|
|
24
|
+
id: "theme.user-menu.performance.toggle",
|
|
25
|
+
slot: UserMenuItemsBottomSlot,
|
|
26
|
+
component: PerformanceToggleMenuItem,
|
|
27
|
+
},
|
|
21
28
|
// Theme synchronizer - headless component that syncs theme from backend on load
|
|
22
29
|
{
|
|
23
30
|
id: "theme.navbar.synchronizer",
|