create-packer 1.21.6 → 1.21.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-packer",
-  "version": "1.21.6",
+  "version": "1.21.8",
   "main": "index.js",
   "repository": "https://github.com/kevily/create-packer",
   "author": "1k <bug_zero@163.com>",

package/template/chrome-extension/package.json

@@ -10,7 +10,7 @@
         "preview": "vite preview",
         "up:vite": "pnpm up vite @vitejs/* -L",
         "format": "prettier --write \"src/**/*.{ts,js,tsx,jsx,css,scss,less}\" \"./package.json\"",
-        "lint": "eslint ./src/**/*.{tsx,ts} && stylelint ./src/**/*.{css,scss,less}",
+        "lint": "tsc --noEmit && eslint ./src/**/*.{tsx,ts} && stylelint ./src/**/*.{css,scss,less}",
         "lint:fix": "eslint ./src/**/*.{tsx,ts} --fix && stylelint ./src/**/*.{css,scss,less} --fix",
         "test:watchs": "jest --watch",
         "test": "jest",

package/template/react/react-app/src/controllers/index.ts

@@ -1,3 +1,2 @@
-export { default as useComponentInstance } from './useComponentInstance'
 export { default as useLoadingAction } from './useLoadingAction'
 export { default as useInterval } from './useInterval'

package/template/react/react-app/src/providers/componentInstance.tsx

@@ -9,7 +9,7 @@ import {
 } from 'react'
 import { createRoot } from 'react-dom/client'
 
-const instanceMap: Record<string, any> = {}
+const instanceMap: Record<string, { pending: Promise<any>; instance: any }> = {}
 
 export interface refsType<P> {
     $setProps: (newProps: P) => void
@@ -21,9 +21,8 @@ export async function create<P extends Record<string, any>, Refs extends Record<
     Component: ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<Refs>>,
     props?: P
 ) {
-    let $instance: Refs & refsType<P> = instanceMap[key]
-
-    if (!$instance) {
+    let current = instanceMap[key]
+    if (!current) {
         const div = document.createElement('div')
         document.body.appendChild(div)
         const ApiComponent = forwardRef<Refs & refsType<P>>((__, refs) => {
@@ -45,17 +44,21 @@ export async function create<P extends Record<string, any>, Refs extends Record<
             })
             return <Component ref={ref} {...(state as any)} />
         })
-        await new Promise<void>(resolve => {
-            createRoot(div).render(
-                <ApiComponent
-                    ref={instance => {
-                        $instance = instance!
-                        resolve()
-                    }}
-                />
-            )
-        })
+        current = instanceMap[key] = {
+            instance: void 0,
+            pending: new Promise<void>(resolve => {
+                createRoot(div).render(
+                    <ApiComponent
+                        ref={instance => {
+                            current.instance = instanceMap[key].instance = instance!
+                            resolve()
+                        }}
+                    />
+                )
+            })
+        }
     }
-    props && $instance.$setProps(props)
-    return $instance
+    await current.pending
+    props && current.instance.$setProps(props)
+    return current.instance as Refs & refsType<P>
 }

package/template/react/react-app/src/controllers/useComponentInstance.ts

@@ -1,31 +0,0 @@
-import { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes, useEffect, useRef } from 'react'
-import { componentInstance } from '@/providers'
-
-export default function useComponentInstance<
-    P extends Record<string, any>,
-    Refs extends Record<string, any>
->(
-    key: string,
-    Component: ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<Refs>>,
-    props?: P
-) {
-    const $instance = useRef<(Refs & componentInstance.refsType<P>) | null>(null)
-    const pending = useRef(false)
-
-    useEffect(() => {
-        if ($instance.current === null) {
-            if (pending.current === false) {
-                pending.current = true
-                componentInstance.create(key, Component, props).then(instance => {
-                    $instance.current = instance
-                    props && $instance.current.$updateProps(props)
-                    pending.current = false
-                })
-            }
-        } else {
-            props && $instance.current?.$updateProps(props)
-        }
-    }, [props])
-
-    return $instance
-}