create-packer 1.37.2 → 1.38.0

package/template/web-extension/shared/hooks/useSyncState.ts

@@ -1,15 +1,15 @@
-import { useRef, useState, Dispatch, SetStateAction } from 'react'
-import { isFunction } from 'lodash-es'
-
-export function useSyncState<S>(initialState: S | (() => S)) {
-    const [state, setState] = useState(initialState)
-    const syncState = useRef<S>(state)
-
-    const $setState: Dispatch<SetStateAction<S>> = newState => {
-        const $newState = isFunction(newState) ? newState(state) : newState
-        setState($newState)
-        syncState.current = $newState
-    }
-
-    return [syncState, state, $setState] as const
-}
+import { useRef, useState, Dispatch, SetStateAction } from 'react'
+import { isFunction } from 'lodash-es'
+
+export function useSyncState<S>(initialState: S | (() => S)) {
+    const [state, setState] = useState(initialState)
+    const syncState = useRef<S>(state)
+
+    const $setState: Dispatch<SetStateAction<S>> = newState => {
+        const $newState = isFunction(newState) ? newState(state) : newState
+        setState($newState)
+        syncState.current = $newState
+    }
+
+    return [syncState, state, $setState] as const
+}

package/template/web-extension/shared/hooks/useVisible.ts

@@ -1,27 +1,27 @@
-import { useState } from 'react'
-import { isFunction } from 'lodash-es'
-
-export interface useVisibleConfigType {
-    defaultVisible?: boolean
-    onBeforeShow?: () => Promise<boolean | void>
-    onBeforeHide?: () => Promise<boolean | void>
-}
-export default function useVisible(config?: useVisibleConfigType) {
-    const [visible, setVisible] = useState(config?.defaultVisible ?? false)
-    const onShow = async () => {
-        let isShow: boolean | void = true
-        if (isFunction(config?.onBeforeShow)) {
-            isShow = await config?.onBeforeShow?.()
-        }
-        setVisible(isShow !== false)
-    }
-    const onClose = async () => {
-        let isHide: boolean | void = true
-        if (isFunction(config?.onBeforeHide)) {
-            isHide = await config?.onBeforeHide?.()
-        }
-        setVisible(isHide === false)
-    }
-
-    return { visible, onShow, onClose }
-}
+import { useState } from 'react'
+import { isFunction } from 'lodash-es'
+
+export interface useVisibleConfigType {
+    defaultVisible?: boolean
+    onBeforeShow?: () => Promise<boolean | void>
+    onBeforeHide?: () => Promise<boolean | void>
+}
+export default function useVisible(config?: useVisibleConfigType) {
+    const [visible, setVisible] = useState(config?.defaultVisible ?? false)
+    const onShow = async () => {
+        let isShow: boolean | void = true
+        if (isFunction(config?.onBeforeShow)) {
+            isShow = await config?.onBeforeShow?.()
+        }
+        setVisible(isShow !== false)
+    }
+    const onClose = async () => {
+        let isHide: boolean | void = true
+        if (isFunction(config?.onBeforeHide)) {
+            isHide = await config?.onBeforeHide?.()
+        }
+        setVisible(isHide === false)
+    }
+
+    return { visible, onShow, onClose }
+}

package/template/web-extension/shared/popup/index.ts

@@ -1 +1 @@
-export * as popupMessage from './message'
+export * as popupMessage from './message'

package/template/web-extension/shared/popup/message.ts

@@ -1,12 +1,12 @@
-import { message } from '@/shared/tools'
-
-export enum ACTIONS {
-    TEST = 'TEST'
-}
-
-export interface messageType {
-    [ACTIONS.TEST]: object
-}
-export interface responseType {}
-
-export const action = message.create<ACTIONS, messageType, responseType>()
+import { message } from '@/shared/tools'
+
+export enum ACTIONS {
+    TEST = 'TEST'
+}
+
+export interface messageType {
+    [ACTIONS.TEST]: object
+}
+export interface responseType {}
+
+export const action = message.create<ACTIONS, messageType, responseType>()

package/template/web-extension/shared/service/index.ts

@@ -1 +1 @@
-export * from './request'
+export * from './request'

package/template/web-extension/shared/service/request.ts

@@ -1,5 +1,5 @@
-import axios from 'axios'
-
-export const request = axios.create({
-    baseURL: import.meta.env.VITE_API_HOST
-})
+import axios from 'axios'
+
+export const request = axios.create({
+    baseURL: import.meta.env.VITE_API_HOST
+})

package/template/web-extension/shared/styles/global.styled.ts

@@ -1,8 +1,8 @@
-import { createGlobalStyle, css } from 'styled-components'
-
-export const GlobalStyle = createGlobalStyle<{ nameSpace?: string }>(props => {
-    return css`
-        .${props.nameSpace || 'body'} {
-        }
-    `
-})
+import { createGlobalStyle, css } from 'styled-components'
+
+export const GlobalStyle = createGlobalStyle<{ nameSpace?: string }>(props => {
+    return css`
+        .${props.nameSpace || 'body'} {
+        }
+    `
+})

package/template/web-extension/shared/styles/index.ts

@@ -1,2 +1,2 @@
-export * from './theme.styled'
-export * from './global.styled'
+export * from './theme.styled'
+export * from './global.styled'

package/template/web-extension/shared/styles/theme.styled.ts

@@ -1,56 +1,56 @@
-import { CSSProperties } from 'react'
-import { AnyFunc } from '1k-types'
-import { isString } from 'lodash-es'
-
-export const theme = {
-    tools: {
-        ellipsis: () => ({
-            overflow: 'hidden',
-            textOverflow: 'ellipsis',
-            whiteSpace: 'nowrap'
-        }),
-        lineClamp: (n: number) => ({
-            '-webkit-line-clamp': `${n}`,
-            '-webkit-box-orient': 'vertical',
-            overflow: 'hidden',
-            display: '-webkit-box'
-        }),
-        size: (s: string) => ({ width: s, height: s }),
-        py: (s: string) => ({ paddingTop: s, paddingBottom: s }),
-        px: (s: string) => ({ paddingLeft: s, paddingRight: s }),
-        my: (s: string) => ({ marginTop: s, marginBottom: s }),
-        mx: (s: string) => ({ marginLeft: s, marginRight: s }),
-        flex: (
-            align: CSSProperties['alignItems'],
-            justify: CSSProperties['justifyContent'],
-            vertical?: boolean
-        ) => {
-            return {
-                display: 'flex',
-                alignItems: align,
-                justifyContent: justify,
-                flexDirection: vertical ? 'column' : 'row'
-            } satisfies CSSProperties
-        },
-        /** 数字为元素数量，字符串为对应css的值  */
-        grid: {
-            grid: (rows: number | string, cols: number | string, gap?: number) => ({
-                display: 'grid',
-                gridTemplateRows: isString(rows) ? rows : `repeat(${rows}, minmax(0, 1fr))`,
-                gridTemplateColumns: isString(cols) ? cols : `repeat(${cols}, minmax(0, 1fr))`,
-                gap: gap ? `${gap}px` : void 0
-            }),
-            rows: (rows: number | string, gap?: number) => ({
-                display: 'grid',
-                gridTemplateRows: isString(rows) ? rows : `repeat(${rows}, minmax(0, 1fr))`,
-                rowGap: gap ? `${gap}px` : void 0
-            }),
-            cols: (cols: number | string, gap?: number) => ({
-                display: 'grid',
-                gridTemplateColumns: isString(cols) ? cols : `repeat(${cols}, minmax(0, 1fr))`,
-                columnGap: gap ? `${gap}px` : void 0
-            })
-        } satisfies Record<string, AnyFunc<CSSProperties>>
-    }
-}
-export type themeType = typeof theme
+import { CSSProperties } from 'react'
+import { AnyFunc } from '1k-types'
+import { isString } from 'lodash-es'
+
+export const theme = {
+    tools: {
+        ellipsis: () => ({
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            whiteSpace: 'nowrap'
+        }),
+        lineClamp: (n: number) => ({
+            '-webkit-line-clamp': `${n}`,
+            '-webkit-box-orient': 'vertical',
+            overflow: 'hidden',
+            display: '-webkit-box'
+        }),
+        size: (s: string) => ({ width: s, height: s }),
+        py: (s: string) => ({ paddingTop: s, paddingBottom: s }),
+        px: (s: string) => ({ paddingLeft: s, paddingRight: s }),
+        my: (s: string) => ({ marginTop: s, marginBottom: s }),
+        mx: (s: string) => ({ marginLeft: s, marginRight: s }),
+        flex: (
+            align: CSSProperties['alignItems'],
+            justify: CSSProperties['justifyContent'],
+            vertical?: boolean
+        ) => {
+            return {
+                display: 'flex',
+                alignItems: align,
+                justifyContent: justify,
+                flexDirection: vertical ? 'column' : 'row'
+            } satisfies CSSProperties
+        },
+        /** 数字为元素数量，字符串为对应css的值  */
+        grid: {
+            grid: (rows: number | string, cols: number | string, gap?: number) => ({
+                display: 'grid',
+                gridTemplateRows: isString(rows) ? rows : `repeat(${rows}, minmax(0, 1fr))`,
+                gridTemplateColumns: isString(cols) ? cols : `repeat(${cols}, minmax(0, 1fr))`,
+                gap: gap ? `${gap}px` : void 0
+            }),
+            rows: (rows: number | string, gap?: number) => ({
+                display: 'grid',
+                gridTemplateRows: isString(rows) ? rows : `repeat(${rows}, minmax(0, 1fr))`,
+                rowGap: gap ? `${gap}px` : void 0
+            }),
+            cols: (cols: number | string, gap?: number) => ({
+                display: 'grid',
+                gridTemplateColumns: isString(cols) ? cols : `repeat(${cols}, minmax(0, 1fr))`,
+                columnGap: gap ? `${gap}px` : void 0
+            })
+        } satisfies Record<string, AnyFunc<CSSProperties>>
+    }
+}
+export type themeType = typeof theme

package/template/web-extension/shared/tools/index.ts

@@ -1 +1 @@
-export * as message from './message'
+export * as message from './message'

package/template/web-extension/shared/tools/message.ts

@@ -1,80 +1,80 @@
-import { map, unset } from 'lodash-es'
-
-export type defActionType = string
-export type messageOpsType<Action extends defActionType> = Record<Action, object>
-export type genMessageType<
-    Action extends defActionType,
-    MessageOps extends messageOpsType<Action>[Action]
-> = { action: Action } & MessageOps
-export type responseType<Action extends defActionType> = { [key in Action]?: any }
-export type actionHandlerType<Message, Response> = (
-    message: Message,
-    sender: chrome.runtime.MessageSender,
-    callback: (response?: Response) => void
-) => any
-class MessageConstructor<
-    Action extends defActionType,
-    MessageConfig extends messageOpsType<Action>,
-    Response extends responseType<Action>
-> {
-    action: {
-        [key: string]: actionHandlerType<
-            genMessageType<Action, MessageConfig[Action]>,
-            Response[Action]
-        >
-    }
-    constructor() {
-        this.action = {}
-    }
-    initListener() {
-        chrome.runtime.onMessage.addListener((message, sender, callback) => {
-            this.action[message.action]?.(message, sender, callback)
-            return true
-        })
-    }
-    addListener<A extends Action>(
-        action: A,
-        callback: actionHandlerType<genMessageType<A, MessageConfig[A]>, Response[A]>
-    ) {
-        // @ts-ignore
-        this.action[action] = callback
-    }
-    removeListener(action: Action) {
-        unset(this.action, action)
-    }
-    async send<A extends Action>(message: genMessageType<A, MessageConfig[A]>) {
-        return new Promise<Response[A]>(resolve => {
-            chrome.runtime.sendMessage(message, response => resolve(response))
-        })
-    }
-
-    async batchSendToContent<SendMessage extends genMessageType<Action, MessageConfig[Action]>>(
-        message: SendMessage,
-        config?: chrome.tabs.QueryInfo
-    ) {
-        const tabs = config ? await chrome.tabs.query(config) : []
-        return await Promise.all(
-            map(tabs, tab => {
-                return new Promise<Response[SendMessage['action']]>(resolve => {
-                    chrome.tabs.sendMessage(tab.id!, message, response => resolve(response))
-                })
-            })
-        )
-    }
-    sendToContent<SendMessage extends genMessageType<Action, MessageConfig[Action]>>(
-        tabId: number,
-        message: SendMessage
-    ) {
-        return new Promise<Response[SendMessage['action']]>(resolve => {
-            chrome.tabs.sendMessage(tabId, message, response => resolve(response))
-        })
-    }
-}
-
-export function create<
-    Action extends defActionType,
-    MessageOps extends messageOpsType<Action>,
-    Response extends responseType<Action>
->() {
-    return new MessageConstructor<Action, MessageOps, Response>()
-}
+import { map, unset } from 'lodash-es'
+
+export type defActionType = string
+export type messageOpsType<Action extends defActionType> = Record<Action, object>
+export type genMessageType<
+    Action extends defActionType,
+    MessageOps extends messageOpsType<Action>[Action]
+> = { action: Action } & MessageOps
+export type responseType<Action extends defActionType> = { [key in Action]?: any }
+export type actionHandlerType<Message, Response> = (
+    message: Message,
+    sender: chrome.runtime.MessageSender,
+    callback: (response?: Response) => void
+) => any
+class MessageConstructor<
+    Action extends defActionType,
+    MessageConfig extends messageOpsType<Action>,
+    Response extends responseType<Action>
+> {
+    action: {
+        [key: string]: actionHandlerType<
+            genMessageType<Action, MessageConfig[Action]>,
+            Response[Action]
+        >
+    }
+    constructor() {
+        this.action = {}
+    }
+    initListener() {
+        chrome.runtime.onMessage.addListener((message, sender, callback) => {
+            this.action[message.action]?.(message, sender, callback)
+            return true
+        })
+    }
+    addListener<A extends Action>(
+        action: A,
+        callback: actionHandlerType<genMessageType<A, MessageConfig[A]>, Response[A]>
+    ) {
+        // @ts-ignore
+        this.action[action] = callback
+    }
+    removeListener(action: Action) {
+        unset(this.action, action)
+    }
+    async send<A extends Action>(message: genMessageType<A, MessageConfig[A]>) {
+        return new Promise<Response[A]>(resolve => {
+            chrome.runtime.sendMessage(message, response => resolve(response))
+        })
+    }
+
+    async batchSendToContent<SendMessage extends genMessageType<Action, MessageConfig[Action]>>(
+        message: SendMessage,
+        config?: chrome.tabs.QueryInfo
+    ) {
+        const tabs = config ? await chrome.tabs.query(config) : []
+        return await Promise.all(
+            map(tabs, tab => {
+                return new Promise<Response[SendMessage['action']]>(resolve => {
+                    chrome.tabs.sendMessage(tab.id!, message, response => resolve(response))
+                })
+            })
+        )
+    }
+    sendToContent<SendMessage extends genMessageType<Action, MessageConfig[Action]>>(
+        tabId: number,
+        message: SendMessage
+    ) {
+        return new Promise<Response[SendMessage['action']]>(resolve => {
+            chrome.tabs.sendMessage(tabId, message, response => resolve(response))
+        })
+    }
+}
+
+export function create<
+    Action extends defActionType,
+    MessageOps extends messageOpsType<Action>,
+    Response extends responseType<Action>
+>() {
+    return new MessageConstructor<Action, MessageOps, Response>()
+}

package/template/web-extension/shared/types/index.ts

@@ -1 +1 @@
-export * from './utils'
+export * from './utils'

package/template/web-extension/shared/types/utils.ts

@@ -1,3 +1,3 @@
-import type { UseBoundStore, StoreApi } from 'zustand'
-
-export type ExtractModelType<T> = T extends UseBoundStore<StoreApi<infer S>> ? S : unknown
+import type { UseBoundStore, StoreApi } from 'zustand'
+
+export type ExtractModelType<T> = T extends UseBoundStore<StoreApi<infer S>> ? S : unknown

package/template/web-extension/tsconfig.json

@@ -1,32 +1,32 @@
-{
-    "compilerOptions": {
-        "baseUrl": ".",
-        "target": "ESNext",
-        "useDefineForClassFields": true,
-        "lib": ["DOM", "DOM.Iterable", "ESNext"],
-        "allowJs": false,
-        "skipLibCheck": true,
-        "esModuleInterop": false,
-        "allowSyntheticDefaultImports": true,
-        "strict": true,
-        "forceConsistentCasingInFileNames": true,
-        "strictPropertyInitialization": false,
-        "strictNullChecks": true,
-        "module": "ESNext",
-        "moduleResolution": "Node",
-        "resolveJsonModule": true,
-        "isolatedModules": true,
-        "noEmit": true,
-        "jsx": "react-jsx",
-        "paths": {
-            "@/*": ["./*"]
-        }
-    },
-    "include": ["**/*.ts", "**/*.tsx", ".wxt/wxt.d.ts"],
-    "exclude": ["scripts"],
-    "references": [
-        {
-            "path": "./tsconfig.node.json"
-        }
-    ]
-}
+{
+    "compilerOptions": {
+        "baseUrl": ".",
+        "target": "ESNext",
+        "useDefineForClassFields": true,
+        "lib": ["DOM", "DOM.Iterable", "ESNext"],
+        "allowJs": false,
+        "skipLibCheck": true,
+        "esModuleInterop": false,
+        "allowSyntheticDefaultImports": true,
+        "strict": true,
+        "forceConsistentCasingInFileNames": true,
+        "strictPropertyInitialization": false,
+        "strictNullChecks": true,
+        "module": "ESNext",
+        "moduleResolution": "Node",
+        "resolveJsonModule": true,
+        "isolatedModules": true,
+        "noEmit": true,
+        "jsx": "react-jsx",
+        "paths": {
+            "@/*": ["./*"]
+        }
+    },
+    "include": ["**/*.ts", "**/*.tsx", ".wxt/wxt.d.ts"],
+    "exclude": ["scripts"],
+    "references": [
+        {
+            "path": "./tsconfig.node.json"
+        }
+    ]
+}

package/template/web-extension/tsconfig.node.json

@@ -1,10 +1,10 @@
-{
-    "compilerOptions": {
-        "composite": true,
-        "module": "ESNext",
-        "moduleResolution": "Node",
-        "allowSyntheticDefaultImports": true,
-        "resolveJsonModule": true
-    },
-    "include": ["vite.config.ts", "defineManifest.ts", "package.json"]
-}
+{
+    "compilerOptions": {
+        "composite": true,
+        "module": "ESNext",
+        "moduleResolution": "Node",
+        "allowSyntheticDefaultImports": true,
+        "resolveJsonModule": true
+    },
+    "include": ["vite.config.ts", "defineManifest.ts", "package.json"]
+}

package/template/web-extension/vite-env.d.ts

@@ -1,19 +1,19 @@
-/// <reference types="vite/client" />
-import 'styled-components'
-import { themeType } from './shared/styles'
-
-declare global {
-    interface ImportMetaEnv {
-        readonly VITE_API_HOST: string
-        readonly VITE_APP_ID: string
-        // 更多环境变量...
-    }
-
-    interface ImportMeta {
-        readonly env: ImportMetaEnv
-    }
-}
-
-declare module 'styled-components' {
-    export interface DefaultTheme extends themeType {}
-}
+/// <reference types="vite/client" />
+import 'styled-components'
+import { themeType } from './shared/styles'
+
+declare global {
+    interface ImportMetaEnv {
+        readonly VITE_API_HOST: string
+        readonly VITE_APP_ID: string
+        // 更多环境变量...
+    }
+
+    interface ImportMeta {
+        readonly env: ImportMetaEnv
+    }
+}
+
+declare module 'styled-components' {
+    export interface DefaultTheme extends themeType {}
+}