promise-portal 1.1.0 → 1.2.1

package/README.md

@@ -1,6 +1,6 @@
 # promise-portal
 
-use component like a promisd-like function
+use component as a promisd-like function
 
 ## Installation
 
@@ -87,11 +87,28 @@ app.use(
 )
 ```
 
+### use `ContextProvider` to set context globally
+
+```vue
+<!-- ./App.vue -->
+<script setup lang="ts">
+import locale from 'ant-design-vue/es/locale/zh_CN'
+import { ContextProvider } from 'promise-portal'
+</script>
+<template>
+  <a-config-provider :locale="locale">
+    <ContextProvider>
+      <router-view></router-view>
+    </ContextProvider>
+  </a-config-provider>
+</template>
+```
+
 ### in component, use `usePortalContext` to use portal context
 
 ```vue
+<!-- ./components/comp.vue -->
 <script setup lang="ts">
-// ./components/comp.vue
 import { usePortalContext } from 'promise-portal'
 export interface Output {
   confirm: boolean
@@ -165,6 +182,24 @@ set active promise-portal instance
 setActiveInstance(instance)
 ```
 
+### ContextProvider
+
+a component to set context globally
+
+```vue
+<script setup lang="ts">
+import locale from 'ant-design-vue/es/locale/zh_CN'
+import { ContextProvider } from 'promise-portal'
+</script>
+<template>
+  <a-config-provider :locale="locale">
+    <ContextProvider>
+      <router-view></router-view>
+    </ContextProvider>
+  </a-config-provider>
+</template>
+```
+
 ### usePortalContext
 
 a vue composition api, use in portal component to get context of portal

package/dist/index.cjs

@@ -20,18 +20,21 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
+  ContextProvider: () => ContextProvider,
   createPromisePortal: () => createPromisePortal,
   definePortal: () => definePortal,
   detectPromisePortalInstance: () => detectPromisePortalInstance,
   getActiveInstance: () => getActiveInstance,
   setActiveInstance: () => setActiveInstance,
-  usePortalContext: () => usePortalContext
+  usePortalContext: () => usePortalContext,
+  version: () => version
 });
 module.exports = __toCommonJS(src_exports);
 
 // src/portal.ts
 var import_vue = require("vue");
 var promisePortalSymbol = process.env.NODE_ENV !== "production" ? Symbol("promise-portal") : Symbol();
+var version = `1.2.1`;
 var activeInstance;
 var getActiveInstance = () => activeInstance;
 var setActiveInstance = (instance) => activeInstance = instance;
@@ -40,6 +43,7 @@ var createPromisePortal = (defaultOptions = {}) => {
     defaultOptions,
     app: void 0,
     map: /* @__PURE__ */ new WeakMap(),
+    provides: void 0,
     install(app) {
       instance.app = app;
       setActiveInstance(instance);
@@ -96,7 +100,7 @@ var definePortal = (component, options = {}) => {
       const ac = appContext ?? instance.app._context;
       vnode.appContext = Object.create(ac, {
         provides: {
-          value: contextHolderProvides ?? ac.provides
+          value: contextHolderProvides ?? instance.provides ?? ac.provides
         }
       });
       (0, import_vue.render)(vnode, el);
@@ -112,6 +116,17 @@ var definePortal = (component, options = {}) => {
   };
   return [portal, ContextHolder];
 };
+var ContextProvider = (0, import_vue.defineComponent)({
+  name: "PromisePortalContextProvider",
+  setup(_props, { slots }) {
+    const p = (0, import_vue.getCurrentInstance)()?.provides;
+    const instance = getActiveInstance();
+    if (p && instance) {
+      instance.provides = p;
+    }
+    return () => slots.default?.();
+  }
+});
 
 // src/detector.ts
 function detect(options) {
@@ -139,10 +154,12 @@ var detectPromisePortalInstance = (options = {}) => {
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  ContextProvider,
   createPromisePortal,
   definePortal,
   detectPromisePortalInstance,
   getActiveInstance,
   setActiveInstance,
-  usePortalContext
+  usePortalContext,
+  version
 });

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 import * as vue from 'vue';
 import { VNode, Ref, App, Component } from 'vue';
 
+declare const version = "1.2.1";
 interface Options {
     unmountDelay?: number;
     initialShowValue?: boolean;
@@ -17,6 +18,7 @@ interface Instance<R = any> {
     defaultOptions: Options;
     app: App;
     map: WeakMap<VNode, Context<R>>;
+    provides: any;
     install: (app: App) => void;
 }
 declare const getActiveInstance: () => Instance<any>;
@@ -26,6 +28,9 @@ declare const usePortalContext: <TOutput = any>(options?: Options) => Context<TO
 declare const definePortal: <TOutput = any, TProps = any>(component: Component, options?: Options & {
     instance?: Instance<TOutput> | undefined;
 }) => [(props?: TProps | undefined, children?: unknown) => Promise<TOutput>, Component<any, any, any, vue.ComputedOptions, vue.MethodOptions>];
+declare const ContextProvider: vue.DefineComponent<{}, () => VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>[] | undefined, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}, {}>;
 
 interface DetectorOptions {
     style?: string;
@@ -33,4 +38,4 @@ interface DetectorOptions {
 }
 declare const detectPromisePortalInstance: (options?: DetectorOptions) => () => void;
 
-export { Context, DetectorOptions, Instance, Options, createPromisePortal, definePortal, detectPromisePortalInstance, getActiveInstance, setActiveInstance, usePortalContext };
+export { Context, ContextProvider, DetectorOptions, Instance, Options, createPromisePortal, definePortal, detectPromisePortalInstance, getActiveInstance, setActiveInstance, usePortalContext, version };

package/dist/index.js

@@ -1,6 +1,7 @@
 // src/portal.ts
 import { createVNode, render, inject, getCurrentInstance, defineComponent, ref } from "vue";
 var promisePortalSymbol = process.env.NODE_ENV !== "production" ? Symbol("promise-portal") : Symbol();
+var version = `1.2.1`;
 var activeInstance;
 var getActiveInstance = () => activeInstance;
 var setActiveInstance = (instance) => activeInstance = instance;
@@ -9,6 +10,7 @@ var createPromisePortal = (defaultOptions = {}) => {
     defaultOptions,
     app: void 0,
     map: /* @__PURE__ */ new WeakMap(),
+    provides: void 0,
     install(app) {
       instance.app = app;
       setActiveInstance(instance);
@@ -65,7 +67,7 @@ var definePortal = (component, options = {}) => {
       const ac = appContext ?? instance.app._context;
       vnode.appContext = Object.create(ac, {
         provides: {
-          value: contextHolderProvides ?? ac.provides
+          value: contextHolderProvides ?? instance.provides ?? ac.provides
         }
       });
       render(vnode, el);
@@ -81,6 +83,17 @@ var definePortal = (component, options = {}) => {
   };
   return [portal, ContextHolder];
 };
+var ContextProvider = defineComponent({
+  name: "PromisePortalContextProvider",
+  setup(_props, { slots }) {
+    const p = getCurrentInstance()?.provides;
+    const instance = getActiveInstance();
+    if (p && instance) {
+      instance.provides = p;
+    }
+    return () => slots.default?.();
+  }
+});
 
 // src/detector.ts
 function detect(options) {
@@ -107,10 +120,12 @@ var detectPromisePortalInstance = (options = {}) => {
   return () => clearInterval(timer);
 };
 export {
+  ContextProvider,
   createPromisePortal,
   definePortal,
   detectPromisePortalInstance,
   getActiveInstance,
   setActiveInstance,
-  usePortalContext
+  usePortalContext,
+  version
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "promise-portal",
-  "version": "1.1.0",
-  "description": "let you use react portal in vue, and with promise",
+  "version": "1.2.1",
+  "description": "use component as a promisd-like function",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",