style(projects): format code

src/store/modules/theme/index.ts

@@ -1,26 +1,20 @@
-import { ref, computed, effectScope, onScopeDispose, watch, toRefs } from 'vue';
+import { computed, effectScope, onScopeDispose, ref, toRefs, watch } from 'vue';
 import type { Ref } from 'vue';
 import { defineStore } from 'pinia';
-import { usePreferredColorScheme, useEventListener } from '@vueuse/core';
+import { useEventListener, usePreferredColorScheme } from '@vueuse/core';
 import { SetupStoreId } from '@/enum';
 import { localStg } from '@/utils/storage';
-import { createThemeToken, initThemeSettings, addThemeVarsToHtml, toggleCssDarkMode, getNaiveTheme } from './shared';
+import { addThemeVarsToHtml, createThemeToken, getNaiveTheme, initThemeSettings, toggleCssDarkMode } from './shared';
 
-/**
- * theme store
- */
+/** Theme store */
 export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
   const scope = effectScope();
   const osTheme = usePreferredColorScheme();
 
-  /**
-   * theme settings
-   */
+  /** Theme settings */
   const settings: Ref<App.Theme.ThemeSetting> = ref(initThemeSettings());
 
-  /**
-   * dark mode
-   */
+  /** Dark mode */
   const darkMode = computed(() => {
     if (settings.value.themeScheme === 'auto') {
       return osTheme.value === 'dark';
@@ -28,9 +22,7 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
     return settings.value.themeScheme === 'dark';
   });
 
-  /**
-   * theme colors
-   */
+  /** Theme colors */
   const themeColors = computed(() => {
     const { themeColor, otherColor, isInfoFollowPrimary } = settings.value;
     const colors: App.Theme.ThemeColor = {
@@ -41,20 +33,17 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
     return colors;
   });
 
-  /**
-   * naive theme
-   */
+  /** Naive theme */
   const naiveTheme = computed(() => getNaiveTheme(themeColors.value));
 
   /**
-   * settings json
-   * @description it is for copy settings
+   * Settings json
+   *
+   * It is for copy settings
    */
   const settingsJson = computed(() => JSON.stringify(settings.value));
 
-  /**
-   * reset store
-   */
+  /** Reset store */
   function resetStore() {
     const themeStore = useThemeStore();
 
@@ -62,16 +51,15 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
   }
 
   /**
-   * set theme scheme
+   * Set theme scheme
+   *
    * @param themeScheme
    */
   function setThemeScheme(themeScheme: UnionKey.ThemeScheme) {
     settings.value.themeScheme = themeScheme;
   }
 
-  /**
-   * toggle theme scheme
-   */
+  /** Toggle theme scheme */
   function toggleThemeScheme() {
     const themeSchemes: UnionKey.ThemeScheme[] = ['light', 'dark', 'auto'];
 
@@ -85,9 +73,10 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
   }
 
   /**
-   * update theme colors
-   * @param key theme color key
-   * @param color theme color
+   * Update theme colors
+   *
+   * @param key Theme color key
+   * @param color Theme color
    */
   function updateThemeColors(key: App.Theme.ThemeColorKey, color: string) {
     if (key === 'primary') {
@@ -98,24 +87,21 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
   }
 
   /**
-   * set theme layout
-   * @param mode theme layout mode
+   * Set theme layout
+   *
+   * @param mode Theme layout mode
    */
   function setThemeLayout(mode: UnionKey.ThemeLayoutMode) {
     settings.value.layout.mode = mode;
   }
 
-  /**
-   * setup theme vars to html
-   */
+  /** Setup theme vars to html */
   function setupThemeVarsToHtml() {
     const { themeTokens, darkThemeTokens } = createThemeToken(themeColors.value);
     addThemeVarsToHtml(themeTokens, darkThemeTokens);
   }
 
-  /**
-   * cache theme settings
-   */
+  /** Cache theme settings */
   function cacheThemeSettings() {
     const isProd = import.meta.env.PROD;
 
@@ -150,9 +136,7 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
     );
   });
 
-  /**
-   * on scope dispose
-   */
+  /** On scope dispose */
   onScopeDispose(() => {
     scope.stop();
   });

src/store/modules/theme/shared.ts

@@ -1,15 +1,13 @@
 import type { GlobalThemeOverrides } from 'naive-ui';
-import { getColorPalette, getColorByColorPaletteNumber } from '@sa/color-palette';
-import { getRgbOfColor, addColorAlpha } from '@sa/utils';
-import { themeSettings, overrideThemeSettings } from '@/theme/settings';
+import { getColorByColorPaletteNumber, getColorPalette } from '@sa/color-palette';
+import { addColorAlpha, getRgbOfColor } from '@sa/utils';
+import { overrideThemeSettings, themeSettings } from '@/theme/settings';
 import { themeVars } from '@/theme/vars';
 import { localStg } from '@/utils/storage';
 
 const DARK_CLASS = 'dark';
 
-/**
- * init theme settings
- */
+/** Init theme settings */
 export function initThemeSettings() {
   const isProd = import.meta.env.PROD;
 
@@ -32,8 +30,9 @@ export function initThemeSettings() {
 }
 
 /**
- * create theme token
- * @param colors theme colors
+ * Create theme token
+ *
+ * @param colors Theme colors
  */
 export function createThemeToken(colors: App.Theme.ThemeColor) {
   const paletteColors = createThemePaletteColors(colors);
@@ -73,8 +72,9 @@ export function createThemeToken(colors: App.Theme.ThemeColor) {
 }
 
 /**
- * create theme palette colors
- * @param colors theme colors
+ * Create theme palette colors
+ *
+ * @param colors Theme colors
  */
 function createThemePaletteColors(colors: App.Theme.ThemeColor) {
   const colorKeys = Object.keys(colors) as App.Theme.ThemeColorKey[];
@@ -94,8 +94,9 @@ function createThemePaletteColors(colors: App.Theme.ThemeColor) {
 }
 
 /**
- * get css var by tokens
- * @param tokens theme base tokens
+ * Get css var by tokens
+ *
+ * @param tokens Theme base tokens
  */
 function getCssVarByTokens(tokens: App.Theme.BaseToken) {
   const styles: string[] = [];
@@ -129,7 +130,8 @@ function getCssVarByTokens(tokens: App.Theme.BaseToken) {
 }
 
 /**
- * add theme vars to html
+ * Add theme vars to html
+ *
  * @param tokens
  */
 export function addThemeVarsToHtml(tokens: App.Theme.BaseToken, darkTokens: App.Theme.BaseToken) {
@@ -150,14 +152,15 @@ export function addThemeVarsToHtml(tokens: App.Theme.BaseToken, darkTokens: App.
 
   const style = document.createElement('style');
 
-  style.innerText = css + darkCss;
+  style.textContent = css + darkCss;
 
   document.head.appendChild(style);
 }
 
 /**
- * toggle css dark mode
- * @param darkMode is dark mode
+ * Toggle css dark mode
+ *
+ * @param darkMode Is dark mode
  */
 export function toggleCssDarkMode(darkMode = false) {
   function addDarkClass() {
@@ -184,8 +187,9 @@ interface NaiveColorAction {
 }
 
 /**
- * get naive theme colors
- * @param colors theme colors
+ * Get naive theme colors
+ *
+ * @param colors Theme colors
  */
 function getNaiveThemeColors(colors: App.Theme.ThemeColor) {
   const colorActions: NaiveColorAction[] = [
@@ -212,8 +216,9 @@ function getNaiveThemeColors(colors: App.Theme.ThemeColor) {
 }
 
 /**
- * get naive theme
- * @param colors theme colors
+ * Get naive theme
+ *
+ * @param colors Theme colors
  */
 export function getNaiveTheme(colors: App.Theme.ThemeColor) {
   const { primary: colorLoading } = colors;