app/composables/useSelectedPackageManager.ts at main

davidwindham.com / npmx.dev

forked from npmx.dev/npmx.dev

fork atom

[READ-ONLY] a fast, modern browser for the npm registry

fork atom

npmx.dev / app / composables / useSelectedPackageManager.ts

at main 27 lines 754 B view raw

wrap content

Daniel Roe chore: clean up knip config + prune unused code 2mo ago

8a70d6e1

 1/**
 2 * Composable for managing the selected package manager preference.
 3 *
 4 * This composable syncs the selected PM to both localStorage and the
 5 * `data-pm` attribute on `<html>`. The attribute enables CSS-based
 6 * visibility of PM-specific content without JavaScript.
 7 *
 8 */
 9export const useSelectedPackageManager = createSharedComposable(
10  function useSelectedPackageManager() {
11    const pm = useLocalStorage<PackageManagerId>('npmx-pm', 'npm')
12
13    // Sync to data-pm attribute on the client
14    if (import.meta.client) {
15      // Watch for changes and update the attribute
16      watch(
17        pm,
18        newPM => {
19          document.documentElement.dataset.pm = newPM
20        },
21        { immediate: true },
22      )
23    }
24
25    return pm
26  },
27)