@hybridly/vue 0.1.0-alpha.4 → 0.1.0-alpha.6

package/LICENSE

@@ -1,7 +1,5 @@
 MIT License
 
-Copyright (c) 2021 Anthony Fu <https://github.com/antfu>
-
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
 in the Software without restriction, including without limitation the rights

package/dist/index.cjs

@@ -56,6 +56,8 @@ const dialogStore = {
   }
 };
 
+const onMountedCallbacks = [];
+
 const state = {
   context: vue.ref(),
   view: vue.shallowRef(),
@@ -119,6 +121,14 @@ const wrapper = vue.defineComponent({
     function renderView() {
       utils.debug.adapter("vue:render:view", "Rendering view.");
       state.view.value.inheritAttrs = !!state.view.value.inheritAttrs;
+      const actual = state.view.value?.mounted;
+      state.view.value.mounted = () => {
+        actual?.();
+        vue.nextTick(() => {
+          utils.debug.adapter("vue:render:view", "Calling mounted callbacks.");
+          onMountedCallbacks.pop()?.();
+        });
+      };
       return vue.h(state.view.value, {
         ...state.properties.value,
         key: state.viewKey.value
@@ -279,6 +289,9 @@ async function initializeHybridly(options = {}) {
     responseErrorModals: resolved.responseErrorModals ?? process.env.NODE_ENV === "development",
     adapter: {
       resolveComponent: resolve,
+      onWaitingForMount: (callback) => {
+        onMountedCallbacks.push(callback);
+      },
       onDialogClose: async () => {
         dialogStore.hide();
       },

package/dist/index.d.ts

@@ -182,7 +182,7 @@ declare const RouterLink: vue.DefineComponent<{
 /** Accesses all current properties. */
 declare function useProperties<T extends object, Global extends GlobalHybridlyProperties>(): vue.DeepReadonly<vue.UnwrapNestedRefs<T & Global>>;
 /** Accesses a property with a dot notation. */
-declare function useProperty<F = never, T = GlobalHybridlyProperties, P extends Path<T> = Path<T>>(path: [F] extends [never] ? [P] extends [never] ? string : P : string): ComputedRef<[F] extends [never] ? [PathValue<T, P>] extends [never] ? never : PathValue<T, P> : F>;
+declare function useProperty<F = never, T = GlobalHybridlyProperties, P extends Path<T> = Path<T>>(path: [F] extends [never] ? ([P] extends [never] ? string : P) : string): ComputedRef<[F] extends [never] ? ([PathValue<T, P>] extends [never] ? never : PathValue<T, P>) : F>;
 type PathImpl<T, K extends keyof T> = K extends string ? T[K] extends undefined ? undefined : NonNullable<T[K]> extends Record<string, any> ? NonNullable<T[K]> extends ArrayLike<any> ? K | `${K}.${PathImpl<NonNullable<T[K]>, Exclude<keyof NonNullable<T[K]>, keyof any[]>>}` : K | `${K}.${PathImpl<NonNullable<T[K]>, keyof NonNullable<T[K]>>}` : K : never;
 type Path<T> = PathImpl<T, keyof T> | keyof T;
 type PathValue<T, P extends Path<T>> = P extends `${infer K}.${infer Rest}` ? K extends keyof T ? T[K] extends undefined ? undefined : Rest extends Path<T[K]> ? PathValue<T[K], Rest> : Rest extends Path<NonNullable<T[K]>> ? PathValue<NonNullable<T[K]>, Rest> | undefined : never : never : P extends keyof T ? T[P] extends undefined ? undefined : T[P] : never;
@@ -280,7 +280,7 @@ type BaseUrlTransformable = Partial<Omit<URL, 'searchParams' | 'toJSON' | 'toStr
     trailingSlash?: boolean;
 };
 
-type ConditionalNavigationOption = boolean | ((payload: HybridPayload) => boolean);
+type ConditionalNavigationOption<T extends boolean | string> = T | ((payload: NavigationOptions) => T);
 interface NavigationOptions {
     /** View to navigate to. */
     payload?: HybridPayload;
@@ -288,13 +288,13 @@ interface NavigationOptions {
      * Whether to replace the current history state instead of adding
      * one. This affects the browser's "back" and "forward" features.
      */
-    replace?: ConditionalNavigationOption;
-    /** Whether to preserve the current scrollbar position. */
-    preserveScroll?: ConditionalNavigationOption;
+    replace?: ConditionalNavigationOption<boolean>;
+    /** Whether to preserve the scrollbars positions on the page. */
+    preserveScroll?: ConditionalNavigationOption<boolean>;
     /** Whether to preserve the current page component's state. */
-    preserveState?: ConditionalNavigationOption;
+    preserveState?: ConditionalNavigationOption<boolean>;
     /** Whether to preserve the current URL. */
-    preserveUrl?: ConditionalNavigationOption;
+    preserveUrl?: ConditionalNavigationOption<boolean>;
     /**
      * Properties of the given URL to override.
      * @example
@@ -458,6 +458,8 @@ interface Adapter {
     onContextUpdate?: (context: InternalRouterContext) => void;
     /** Called when a dialog is closed. */
     onDialogClose?: (context: InternalRouterContext) => void;
+    /** Called when Hybridly is waiting for a component to be mounted. The given callback should be executed after the view component is mounted. */
+    onWaitingForMount: (callback: Function) => void;
 }
 interface ResolvedAdapter extends Adapter {
     updateRoutingConfiguration: (routing?: RoutingConfiguration) => void;
@@ -468,8 +470,8 @@ interface ScrollRegion {
 }
 /** Provides methods to serialize the state into the history state. */
 interface Serializer {
-    serialize: <T>(view: T) => any;
-    unserialize: <T>(state: any) => T;
+    serialize: <T>(view: T) => string;
+    unserialize: <T>(state?: string) => T | undefined;
 }
 
 /** Accesses the hybridly context. */

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { shallowRef, ref, unref, triggerRef, defineComponent, toRaw, h, createApp, isRef, reactive, readonly, computed, watch, getCurrentInstance, onUnmounted } from 'vue';
+import { shallowRef, ref, unref, triggerRef, defineComponent, toRaw, h, nextTick, createApp, isRef, reactive, readonly, computed, watch, getCurrentInstance, onUnmounted } from 'vue';
 import { registerHook as registerHook$1, createRouter, makeUrl, router } from '@hybridly/core';
 export { can, route, router } from '@hybridly/core';
 import { debug, random, showDomainsDisabledErrorModal, showPageComponentErrorModal, merge, clone } from '@hybridly/utils';
@@ -48,6 +48,8 @@ const dialogStore = {
   }
 };
 
+const onMountedCallbacks = [];
+
 const state = {
   context: ref(),
   view: shallowRef(),
@@ -111,6 +113,14 @@ const wrapper = defineComponent({
     function renderView() {
       debug.adapter("vue:render:view", "Rendering view.");
       state.view.value.inheritAttrs = !!state.view.value.inheritAttrs;
+      const actual = state.view.value?.mounted;
+      state.view.value.mounted = () => {
+        actual?.();
+        nextTick(() => {
+          debug.adapter("vue:render:view", "Calling mounted callbacks.");
+          onMountedCallbacks.pop()?.();
+        });
+      };
       return h(state.view.value, {
         ...state.properties.value,
         key: state.viewKey.value
@@ -271,6 +281,9 @@ async function initializeHybridly(options = {}) {
     responseErrorModals: resolved.responseErrorModals ?? process.env.NODE_ENV === "development",
     adapter: {
       resolveComponent: resolve,
+      onWaitingForMount: (callback) => {
+        onMountedCallbacks.push(callback);
+      },
       onDialogClose: async () => {
         dialogStore.hide();
       },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hybridly/vue",
-  "version": "0.1.0-alpha.4",
+  "version": "0.1.0-alpha.6",
   "description": "Vue adapter for Hybridly",
   "keywords": [
     "hybridly",
@@ -42,11 +42,11 @@
     "defu": "^6.1.2",
     "lodash.isequal": "^4.5.0",
     "nprogress": "^0.2.0",
-    "qs": "^6.11.0",
-    "@hybridly/config": "0.1.0-alpha.4",
-    "@hybridly/core": "0.1.0-alpha.4",
-    "@hybridly/progress-plugin": "0.1.0-alpha.4",
-    "@hybridly/utils": "0.1.0-alpha.4"
+    "qs": "^6.11.1",
+    "@hybridly/config": "0.1.0-alpha.6",
+    "@hybridly/core": "0.1.0-alpha.6",
+    "@hybridly/progress-plugin": "0.1.0-alpha.6",
+    "@hybridly/utils": "0.1.0-alpha.6"
   },
   "devDependencies": {
     "@types/lodash": "^4.14.191",