@hybridly/vue 0.4.0 → 0.4.1

package/dist/index.cjs

@@ -127,7 +127,9 @@ const wrapper = vue.defineComponent({
         actual?.();
         vue.nextTick(() => {
           utils.debug.adapter("vue:render:view", "Calling mounted callbacks.");
-          onMountedCallbacks.pop()?.();
+          while (onMountedCallbacks.length) {
+            onMountedCallbacks.shift()?.();
+          }
         });
       };
       return vue.h(state.view.value, {
@@ -288,7 +290,7 @@ async function initializeHybridly(options = {}) {
     routing: resolved.routing,
     adapter: {
       resolveComponent: resolve,
-      onWaitingForMount: (callback) => {
+      executeOnMounted: (callback) => {
         onMountedCallbacks.push(callback);
       },
       onDialogClose: async () => {
@@ -391,6 +393,7 @@ const RouterLink = vue.defineComponent({
   setup(_, { slots, attrs }) {
     return (props) => {
       let data = props.data ?? {};
+      const preloads = props.preload ?? false;
       const url = core.makeUrl(props.href ?? "");
       const method = props.method?.toUpperCase() ?? "GET";
       const as = typeof props.as === "object" ? props.as : props.as?.toLowerCase() ?? "a";
@@ -413,6 +416,24 @@ Please specify a more appropriate element using the "as" attribute. For example:
         ...attrs,
         ...as === "a" ? { href: url } : {},
         ...props.disabled ? { disabled: props.disabled } : {},
+        onMouseenter: () => {
+          if (!preloads) {
+            return;
+          }
+          if (props.external) {
+            return;
+          }
+          if (props.disabled) {
+            return;
+          }
+          if (method !== "GET") {
+            return;
+          }
+          core.router.preload(url, {
+            data,
+            ...props.options
+          });
+        },
         onClick: (event) => {
           if (props.external) {
             return;
@@ -469,6 +490,10 @@ Please specify a more appropriate element using the "as" attribute. For example:
       type: String,
       required: false,
       default: void 0
+    },
+    preload: {
+      type: Boolean,
+      default: false
     }
   }
 });

package/dist/index.d.ts

@@ -85,6 +85,10 @@ declare const RouterLink: vue.DefineComponent<{
         required: false;
         default: undefined;
     };
+    preload: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, (props: _vue_shared.LooseRequired<{
     readonly data: RequestData;
     readonly method: "delete" | Method$1 | "get" | "post" | "put" | "patch";
@@ -92,6 +96,7 @@ declare const RouterLink: vue.DefineComponent<{
     readonly as: string | Record<string, any>;
     readonly external: boolean;
     readonly disabled: boolean;
+    readonly preload: boolean;
     readonly text?: string | undefined;
     readonly href?: string | undefined;
 } & {}>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -131,6 +136,10 @@ declare const RouterLink: vue.DefineComponent<{
         required: false;
         default: undefined;
     };
+    preload: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>>, {
     data: RequestData;
     text: string;
@@ -140,6 +149,7 @@ declare const RouterLink: vue.DefineComponent<{
     as: string | Record<string, any>;
     external: boolean;
     disabled: boolean;
+    preload: boolean;
 }, {}>;
 
 /** Accesses all current properties. */
@@ -223,6 +233,10 @@ interface Hooks extends RequestHooks {
      * Called when a component has been navigated to.
      */
     navigated: (options: NavigationOptions, context: InternalRouterContext) => MaybePromise<any>;
+    /**
+     * Called when a component has been navigated to and was mounted by the adapter.
+     */
+    mounted: (context: InternalRouterContext) => MaybePromise<any>;
 }
 
 interface RoutingConfiguration {
@@ -405,6 +419,8 @@ interface InternalRouterContext {
     routing?: RoutingConfiguration;
     /** Whether to display response error modals. */
     responseErrorModals?: boolean;
+    /** Cache of preload requests. */
+    preloadCache: Map<string, AxiosResponse>;
 }
 /** Adapter-specific functions. */
 interface Adapter {
@@ -417,7 +433,7 @@ interface Adapter {
     /** 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;
+    executeOnMounted: (callback: Function) => void;
 }
 interface ResolvedAdapter extends Adapter {
     updateRoutingConfiguration: (routing?: RoutingConfiguration) => void;

package/dist/index.mjs

@@ -119,7 +119,9 @@ const wrapper = defineComponent({
         actual?.();
         nextTick(() => {
           debug.adapter("vue:render:view", "Calling mounted callbacks.");
-          onMountedCallbacks.pop()?.();
+          while (onMountedCallbacks.length) {
+            onMountedCallbacks.shift()?.();
+          }
         });
       };
       return h(state.view.value, {
@@ -280,7 +282,7 @@ async function initializeHybridly(options = {}) {
     routing: resolved.routing,
     adapter: {
       resolveComponent: resolve,
-      onWaitingForMount: (callback) => {
+      executeOnMounted: (callback) => {
         onMountedCallbacks.push(callback);
       },
       onDialogClose: async () => {
@@ -383,6 +385,7 @@ const RouterLink = defineComponent({
   setup(_, { slots, attrs }) {
     return (props) => {
       let data = props.data ?? {};
+      const preloads = props.preload ?? false;
       const url = makeUrl(props.href ?? "");
       const method = props.method?.toUpperCase() ?? "GET";
       const as = typeof props.as === "object" ? props.as : props.as?.toLowerCase() ?? "a";
@@ -405,6 +408,24 @@ Please specify a more appropriate element using the "as" attribute. For example:
         ...attrs,
         ...as === "a" ? { href: url } : {},
         ...props.disabled ? { disabled: props.disabled } : {},
+        onMouseenter: () => {
+          if (!preloads) {
+            return;
+          }
+          if (props.external) {
+            return;
+          }
+          if (props.disabled) {
+            return;
+          }
+          if (method !== "GET") {
+            return;
+          }
+          router.preload(url, {
+            data,
+            ...props.options
+          });
+        },
         onClick: (event) => {
           if (props.external) {
             return;
@@ -461,6 +482,10 @@ Please specify a more appropriate element using the "as" attribute. For example:
       type: String,
       required: false,
       default: void 0
+    },
+    preload: {
+      type: Boolean,
+      default: false
     }
   }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hybridly/vue",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "Vue adapter for Hybridly",
   "keywords": [
     "hybridly",
@@ -44,9 +44,9 @@
     "lodash.isequal": "^4.5.0",
     "nprogress": "^0.2.0",
     "qs": "^6.11.2",
-    "@hybridly/core": "0.4.0",
-    "@hybridly/utils": "0.4.0",
-    "@hybridly/progress-plugin": "0.4.0"
+    "@hybridly/core": "0.4.1",
+    "@hybridly/progress-plugin": "0.4.1",
+    "@hybridly/utils": "0.4.1"
   },
   "devDependencies": {
     "@types/lodash": "^4.14.195",