@simonbackx/vue-app-navigation 2.17.4 → 2.18.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/classes.js CHANGED
@@ -1,9 +1,6 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
7
4
  import "vue";
8
5
  class VueComponent {
9
6
  // This will allow us to pass the vue proxy inside the component
package/dist/index.js CHANGED
@@ -1,10 +1,7 @@
1
1
  var __defProp = Object.defineProperty;
2
2
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => {
4
- __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
- return value;
6
- };
7
- import { inject, proxyRefs, markRaw, ref, reactive, defineComponent, getCurrentInstance, provide, computed, unref, onActivated, onMounted, queuePostFlushCb, onBeforeUnmount, onBeforeMount, onUpdated, warn, h, setTransitionHooks, callWithAsyncErrorHandling, ErrorCodes, shallowRef, resolveComponent, openBlock, createElementBlock, createElementVNode, createVNode, mergeProps, Transition, withCtx, createBlock, createCommentVNode, customRef, onScopeDispose, TransitionGroup, Fragment, renderList, isRef, onDeactivated, normalizeClass, normalizeStyle } from "vue";
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
+ import { ref, reactive, markRaw, proxyRefs, inject, defineComponent, getCurrentInstance, provide, computed, unref, onActivated, onMounted, queuePostFlushCb, onBeforeUnmount, onBeforeMount, onUpdated, warn, h, setTransitionHooks, shallowRef, callWithAsyncErrorHandling, ErrorCodes, resolveComponent, openBlock, createElementBlock, createElementVNode, createVNode, mergeProps, Transition, withCtx, createBlock, createCommentVNode, onScopeDispose, customRef, TransitionGroup, Fragment, renderList, isRef, onDeactivated, normalizeStyle, normalizeClass } from "vue";
8
5
  const _UrlHelper = class _UrlHelper {
9
6
  constructor(url, localFixedPrefix) {
10
7
  __publicField(this, "url");
@@ -247,6 +244,9 @@ class HistoryManagerStatic {
247
244
  this.isQueueRunning = true;
248
245
  const action = this.historyQueue.shift();
249
246
  if (action) {
247
+ if (this.debug) {
248
+ console.log("Running history queue action");
249
+ }
250
250
  const p = action();
251
251
  if (p) {
252
252
  p.finally(() => this.runQueue()).catch(console.error);
@@ -254,6 +254,9 @@ class HistoryManagerStatic {
254
254
  this.runQueue();
255
255
  }
256
256
  } else {
257
+ if (this.debug) {
258
+ console.log("History queue done");
259
+ }
257
260
  this.isQueueRunning = false;
258
261
  this.callListeners();
259
262
  }
@@ -265,12 +268,17 @@ class HistoryManagerStatic {
265
268
  history.go(delta);
266
269
  let timer = void 0;
267
270
  let called = false;
271
+ const startTime = /* @__PURE__ */ new Date();
268
272
  const listener = () => {
269
- if (called)
270
- return;
273
+ if (called) return;
271
274
  called = true;
272
275
  clearTimeout(timer);
273
276
  window.removeEventListener("popstate", listener);
277
+ const end = /* @__PURE__ */ new Date();
278
+ if (this.debug) {
279
+ const ms = end.getTime() - startTime.getTime();
280
+ console.log("Waiting for popstate event took " + ms + "ms");
281
+ }
274
282
  setTimeout(() => {
275
283
  this.manualStateAction = false;
276
284
  resolve();
@@ -280,7 +288,7 @@ class HistoryManagerStatic {
280
288
  timer = setTimeout(() => {
281
289
  console.warn("Timeout while waiting for history.go");
282
290
  listener();
283
- }, 200);
291
+ }, 400);
284
292
  });
285
293
  });
286
294
  }
@@ -527,9 +535,9 @@ class HistoryManagerStatic {
527
535
  activate() {
528
536
  history.scrollRestoration = "manual";
529
537
  async function onPopState(event) {
530
- var _a;
538
+ var _a, _b;
531
539
  if (this.debug) {
532
- console.log("HistoryManager popstate");
540
+ console.log("HistoryManager popstate", (_a = event.state) == null ? void 0 : _a.counter);
533
541
  }
534
542
  if (this.isAdjustingState) {
535
543
  console.warn("Duplicate popstate");
@@ -538,8 +546,8 @@ class HistoryManagerStatic {
538
546
  if (this.manualStateAction) {
539
547
  return;
540
548
  }
549
+ const newCounter = (_b = event.state) == null ? void 0 : _b.counter;
541
550
  this.isAdjustingState = true;
542
- const newCounter = (_a = event.state) == null ? void 0 : _a.counter;
543
551
  if (newCounter !== void 0) {
544
552
  if (newCounter > this.counter) {
545
553
  if (this.debug) {
@@ -733,18 +741,15 @@ const _ComponentWithProperties = class _ComponentWithProperties {
733
741
  if (this.isKeptAlive) {
734
742
  this.isKeptAlive = false;
735
743
  _ComponentWithProperties.keepAliveCounter--;
736
- if (_ComponentWithProperties.debug)
737
- console.log("Total components kept alive: " + _ComponentWithProperties.keepAliveCounter);
744
+ if (_ComponentWithProperties.debug) console.log("Total components kept alive: " + _ComponentWithProperties.keepAliveCounter);
738
745
  } else {
739
- if (_ComponentWithProperties.debug)
740
- console.warn("About to mount a component that was not destroyed properly " + this.component.name);
746
+ if (_ComponentWithProperties.debug) console.warn("About to mount a component that was not destroyed properly " + this.component.name);
741
747
  this.destroy(this.vnode);
742
748
  }
743
749
  }
744
750
  }
745
751
  getHistoryIndex() {
746
- if (this.component)
747
- return this.historyIndex;
752
+ if (this.component) return this.historyIndex;
748
753
  }
749
754
  deleteHistoryIndex() {
750
755
  this.historyIndex = null;
@@ -784,8 +789,7 @@ const _ComponentWithProperties = class _ComponentWithProperties {
784
789
  }
785
790
  setUrl(url, title) {
786
791
  if (this.historyIndex === null) {
787
- if (_ComponentWithProperties.debug)
788
- console.warn("Tried calling .setUrl on a component that was never assigned a history index. Check if you displayed this component using .show or .present");
792
+ if (_ComponentWithProperties.debug) console.warn("Tried calling .setUrl on a component that was never assigned a history index. Check if you displayed this component using .show or .present");
789
793
  return;
790
794
  }
791
795
  if (!HistoryManager.active) {
@@ -801,8 +805,7 @@ const _ComponentWithProperties = class _ComponentWithProperties {
801
805
  return;
802
806
  }
803
807
  if (this.historyIndex === null) {
804
- if (_ComponentWithProperties.debug)
805
- console.warn("Tried calling .setTitle on a component that was never assigned a history index. Check if you displayed this component using .show or .present");
808
+ if (_ComponentWithProperties.debug) console.warn("Tried calling .setTitle on a component that was never assigned a history index. Check if you displayed this component using .show or .present");
806
809
  return;
807
810
  }
808
811
  if (!HistoryManager.active) {
@@ -820,15 +823,13 @@ const _ComponentWithProperties = class _ComponentWithProperties {
820
823
  const instance = this.componentInstance();
821
824
  if (instance == null ? void 0 : instance.returnToHistoryIndex) {
822
825
  const worked = instance == null ? void 0 : instance.returnToHistoryIndex();
823
- if (_ComponentWithProperties.debug)
824
- console.log("returning to instance that has an instance with custom returnToHistoryIndex method", this.component.name, worked);
826
+ if (_ComponentWithProperties.debug) console.log("returning to instance that has an instance with custom returnToHistoryIndex method", this.component.name, worked);
825
827
  if (worked === true) {
826
828
  return true;
827
829
  }
828
830
  }
829
831
  if (this.historyIndex === null) {
830
- if (_ComponentWithProperties.debug)
831
- console.warn("Returning to a component that has no history index assigned. Has this component been pushed to a navigation controller properly before returning to it?", this.component.name);
832
+ if (_ComponentWithProperties.debug) console.warn("Returning to a component that has no history index assigned. Has this component been pushed to a navigation controller properly before returning to it?", this.component.name);
832
833
  return false;
833
834
  }
834
835
  HistoryManager.returnToHistoryIndex(this.historyIndex);
@@ -861,8 +862,7 @@ const _ComponentWithProperties = class _ComponentWithProperties {
861
862
  destroy(vnode) {
862
863
  if (this.vnode) {
863
864
  if (vnode !== this.vnode) {
864
- if (_ComponentWithProperties.debug)
865
- console.warn("Received destroy event from old/different vnode", this.vnode, vnode);
865
+ if (_ComponentWithProperties.debug) console.warn("Received destroy event from old/different vnode", this.vnode, vnode);
866
866
  return;
867
867
  }
868
868
  if (this.keepAlive) {
@@ -870,23 +870,18 @@ const _ComponentWithProperties = class _ComponentWithProperties {
870
870
  if (!this.isKeptAlive) {
871
871
  this.isKeptAlive = true;
872
872
  _ComponentWithProperties.keepAliveCounter++;
873
- if (_ComponentWithProperties.debug)
874
- console.log("Kept component alive " + this.component.name);
875
- if (_ComponentWithProperties.debug)
876
- console.log("Total components kept alive: " + _ComponentWithProperties.keepAliveCounter);
873
+ if (_ComponentWithProperties.debug) console.log("Kept component alive " + this.component.name);
874
+ if (_ComponentWithProperties.debug) console.log("Total components kept alive: " + _ComponentWithProperties.keepAliveCounter);
877
875
  }
878
876
  return;
879
877
  }
880
878
  if (this.isKeptAlive) {
881
879
  this.isKeptAlive = false;
882
880
  _ComponentWithProperties.keepAliveCounter--;
883
- if (_ComponentWithProperties.debug)
884
- console.log("Freed component from alive stack " + this.component.name);
885
- if (_ComponentWithProperties.debug)
886
- console.log("Total components kept alive: " + _ComponentWithProperties.keepAliveCounter);
881
+ if (_ComponentWithProperties.debug) console.log("Freed component from alive stack " + this.component.name);
882
+ if (_ComponentWithProperties.debug) console.log("Total components kept alive: " + _ComponentWithProperties.keepAliveCounter);
887
883
  }
888
- if (_ComponentWithProperties.debug)
889
- console.log("Destroyed component " + this.component.name, this.vnode);
884
+ if (_ComponentWithProperties.debug) console.log("Destroyed component " + this.component.name, this.vnode);
890
885
  if (this.unmount) {
891
886
  this.unmount(this.vnode);
892
887
  this.unmount = null;
@@ -919,7 +914,7 @@ __publicField(_ComponentWithProperties, "debug", false);
919
914
  __publicField(_ComponentWithProperties, "historyIndexOwners", /* @__PURE__ */ new Map());
920
915
  let ComponentWithProperties = _ComponentWithProperties;
921
916
  /**
922
- * @vue/shared v3.5.16
917
+ * @vue/shared v3.5.30
923
918
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
924
919
  * @license MIT
925
920
  **/
@@ -931,28 +926,9 @@ const invokeArrayFns = (fns, ...arg) => {
931
926
  }
932
927
  };
933
928
  const ShapeFlags = {
934
- "ELEMENT": 1,
935
- "1": "ELEMENT",
936
- "FUNCTIONAL_COMPONENT": 2,
937
- "2": "FUNCTIONAL_COMPONENT",
938
- "STATEFUL_COMPONENT": 4,
939
- "4": "STATEFUL_COMPONENT",
940
- "TEXT_CHILDREN": 8,
941
- "8": "TEXT_CHILDREN",
942
- "ARRAY_CHILDREN": 16,
943
- "16": "ARRAY_CHILDREN",
944
- "SLOTS_CHILDREN": 32,
945
- "32": "SLOTS_CHILDREN",
946
- "TELEPORT": 64,
947
- "64": "TELEPORT",
948
929
  "SUSPENSE": 128,
949
- "128": "SUSPENSE",
950
930
  "COMPONENT_SHOULD_KEEP_ALIVE": 256,
951
- "256": "COMPONENT_SHOULD_KEEP_ALIVE",
952
- "COMPONENT_KEPT_ALIVE": 512,
953
- "512": "COMPONENT_KEPT_ALIVE",
954
- "COMPONENT": 6,
955
- "6": "COMPONENT"
931
+ "COMPONENT_KEPT_ALIVE": 512
956
932
  };
957
933
  function invokeVNodeHook(hook, instance, vnode, prevVNode = null) {
958
934
  callWithAsyncErrorHandling(hook, instance, ErrorCodes.VNODE_HOOK, [
@@ -964,8 +940,8 @@ function getInnerChild(vnode) {
964
940
  return vnode.shapeFlag & ShapeFlags.SUSPENSE ? vnode.ssContent : vnode;
965
941
  }
966
942
  function resetShapeFlag(vnode) {
967
- vnode.shapeFlag &= ~ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE;
968
- vnode.shapeFlag &= ~ShapeFlags.COMPONENT_KEPT_ALIVE;
943
+ vnode.shapeFlag &= -257;
944
+ vnode.shapeFlag &= -513;
969
945
  }
970
946
  function makeProvidesParentReactive(instance) {
971
947
  var _a;
@@ -986,7 +962,7 @@ function makeProvidesParentReactive(instance) {
986
962
  });
987
963
  },
988
964
  // Vue valides keys using 'a' in obj, so we need to handle this correctly
989
- has(target, key) {
965
+ has() {
990
966
  return true;
991
967
  }
992
968
  });
@@ -1405,7 +1381,7 @@ const _sfc_main$4 = defineComponent({
1405
1381
  const mightBe = (_a = element ?? this.$el) == null ? void 0 : _a.querySelector("main");
1406
1382
  return mightBe ? mightBe : null;
1407
1383
  },
1408
- getScrollElement(element = null) {
1384
+ getScrollElement(_ = null) {
1409
1385
  return document.documentElement;
1410
1386
  },
1411
1387
  shouldAnimate() {
@@ -1435,8 +1411,7 @@ const _sfc_main$4 = defineComponent({
1435
1411
  if (replace > this.components.length) {
1436
1412
  replace = this.components.length;
1437
1413
  }
1438
- if (ComponentWithProperties.debug)
1439
- console.log("Pushing new component on navigation controller: " + component.component.name);
1414
+ if (ComponentWithProperties.debug) console.log("Pushing new component on navigation controller: " + component.component.name);
1440
1415
  if (replace > 0) {
1441
1416
  if (destroy && !force) {
1442
1417
  for (let index = this.components.length - 1; index >= this.components.length - replace; index--) {
@@ -2512,8 +2487,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
2512
2487
  ref_key: "navigationController",
2513
2488
  ref: navigationController,
2514
2489
  "animation-type": "modal",
2515
- root: _ctx.root,
2516
- "initial-components": _ctx.initialComponents,
2490
+ root: __props.root,
2491
+ "initial-components": __props.initialComponents,
2517
2492
  "custom-provide": customProvide.value
2518
2493
  }, null, 8, ["root", "initial-components", "custom-provide"]),
2519
2494
  createVNode(_sfc_main$3, {
@@ -2578,8 +2553,7 @@ const navigationMethods = {
2578
2553
  setTitle() {
2579
2554
  var _a;
2580
2555
  const navigationOptions = (_a = this.$options) == null ? void 0 : _a.navigation;
2581
- if (!navigationOptions)
2582
- return;
2556
+ if (!navigationOptions) return;
2583
2557
  const title = navigationOptions.title;
2584
2558
  if (typeof title === "function") {
2585
2559
  this.$url.setTitle(title.call(this));
@@ -2719,7 +2693,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
2719
2693
  return (_ctx, _cache) => {
2720
2694
  return openBlock(), createElementBlock("div", {
2721
2695
  class: normalizeClass(buildClass.value),
2722
- style: normalizeStyle(_ctx.style),
2696
+ style: normalizeStyle(__props.style),
2723
2697
  onClick
2724
2698
  }, [
2725
2699
  createElementVNode("div", {
@@ -2728,8 +2702,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
2728
2702
  }, [
2729
2703
  createElementVNode("div", _hoisted_1$1, [
2730
2704
  (openBlock(), createBlock(unref(ComponentWithPropertiesInstance), {
2731
- key: _ctx.root.key,
2732
- component: _ctx.root
2705
+ key: __props.root.key,
2706
+ component: __props.root
2733
2707
  }, null, 8, ["component"]))
2734
2708
  ])
2735
2709
  ], 512),
package/dist/main.css CHANGED
@@ -59,11 +59,6 @@
59
59
  .navigation-controller > .modal-pop-leave-to > div {
60
60
  transform: translateY(100vh);
61
61
  }
62
- .navigation-controller > .push {
63
- /*&-enter-from, &-leave-to {
64
- opacity: 0;
65
- }*/
66
- }
67
62
  .navigation-controller > .push-enter-active {
68
63
  user-select: none;
69
64
  }
@@ -103,6 +98,11 @@
103
98
  .navigation-controller > .push-leave-to {
104
99
  filter: brightness(80%);
105
100
  }
101
+ .navigation-controller > .push {
102
+ /*&-enter-from, &-leave-to {
103
+ opacity: 0;
104
+ }*/
105
+ }
106
106
  .navigation-controller > .push-enter-from > div {
107
107
  transform: translateX(100%);
108
108
  transform: translateX(calc(100% * var(--direction-scale-x, 1)));
@@ -160,8 +160,6 @@
160
160
  position: relative;
161
161
  width: 100%;
162
162
  box-sizing: border-box;
163
- min-height: 100vh;
164
- min-height: calc(var(--vh, 1vh) * 100);
165
163
  }
166
164
  .split-view-controller > .master {
167
165
  flex-shrink: 0;
@@ -187,6 +185,10 @@
187
185
  border-top-left-radius: $border-radius;
188
186
  border-bottom-left-radius: $border-radius;*/
189
187
  }
188
+ .split-view-controller {
189
+ min-height: 100vh;
190
+ min-height: calc(var(--vh, 1vh) * 100);
191
+ }
190
192
  .split-view-controller[data-has-detail=true] {
191
193
  display: grid;
192
194
  grid-template-columns: 320px 1fr;
@@ -1,5 +1,5 @@
1
- import { HistoryUrl } from './HistoryManager';
2
1
  import { ComponentInternalInstance, ComponentPublicInstance, Raw, VNode } from 'vue';
2
+ import { HistoryUrl } from './HistoryManager';
3
3
 
4
4
  export type ModalDisplayStyle = 'cover' | 'popup' | 'overlay' | 'sheet' | 'side-view';
5
5
  export declare function useCurrentComponent(): ComponentWithPropertiesType | null;
@@ -1,5 +1,5 @@
1
- import { PushOptions } from './PushOptions';
2
1
  import { ComponentWithProperties, ComponentWithPropertiesType } from './ComponentWithProperties';
2
+ import { PushOptions } from './PushOptions';
3
3
 
4
4
  declare function present(options: PushOptions): Promise<void>;
5
5
  declare function replace(component: ComponentWithPropertiesType, animated?: boolean): void;
@@ -1,7 +1,7 @@
1
- import { PushOptions } from './PushOptions';
2
- import { PopOptions } from './PopOptions';
3
- import { ComponentWithProperties, ComponentWithPropertiesType } from './ComponentWithProperties';
4
1
  import { PropType } from 'vue';
2
+ import { ComponentWithProperties, ComponentWithPropertiesType } from './ComponentWithProperties';
3
+ import { PopOptions } from './PopOptions';
4
+ import { PushOptions } from './PushOptions';
5
5
 
6
6
  declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
7
7
  root: {
@@ -38,7 +38,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
38
38
  growSize(width: number, height: number): void;
39
39
  unfreezeSize(): void;
40
40
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
41
- getScrollElement(element?: HTMLElement | null): HTMLElement;
41
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
42
42
  shouldAnimate(): any;
43
43
  returnToHistoryIndex(): boolean;
44
44
  push(options: PushOptions): Promise<void>;
@@ -144,7 +144,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
144
144
  growSize(width: number, height: number): void;
145
145
  unfreezeSize(): void;
146
146
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
147
- getScrollElement(element?: HTMLElement | null): HTMLElement;
147
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
148
148
  shouldAnimate(): any;
149
149
  returnToHistoryIndex(): boolean;
150
150
  push(options: PushOptions): Promise<void>;
@@ -244,7 +244,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
244
244
  growSize(width: number, height: number): void;
245
245
  unfreezeSize(): void;
246
246
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
247
- getScrollElement(element?: HTMLElement | null): HTMLElement;
247
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
248
248
  shouldAnimate(): any;
249
249
  returnToHistoryIndex(): boolean;
250
250
  push(options: PushOptions): Promise<void>;
@@ -1,10 +1,10 @@
1
- import { useNavigationController } from './useNavigationController';
2
- import { useModalStackComponent } from './utils/useModalStackComponent';
3
- import { NavigationOptions, useCanDismiss, useCanPop, useDismiss, useFocused, useNavigate, usePop, usePresent, useShow, useShowDetail, useUrl } from './utils/navigationHooks';
4
- import { useSplitViewController } from './useSplitViewController';
5
- import { default as Popup } from './Popup.vue';
6
- import { default as NavigationController } from './NavigationController.vue';
7
1
  import { DefineComponent, Ref } from 'vue';
2
+ import { default as NavigationController } from './NavigationController.vue';
3
+ import { default as Popup } from './Popup.vue';
4
+ import { useSplitViewController } from './useSplitViewController';
5
+ import { NavigationOptions, useCanDismiss, useCanPop, useDismiss, useFocused, useNavigate, usePop, usePresent, useShow, useShowDetail, useUrl } from './utils/navigationHooks';
6
+ import { useModalStackComponent } from './utils/useModalStackComponent';
7
+ import { useNavigationController } from './useNavigationController';
8
8
 
9
9
  /**
10
10
  * @returns To detect whether you are in a popup
@@ -1,5 +1,5 @@
1
1
  import { App } from 'vue';
2
2
 
3
3
  export declare const VueAppNavigationPlugin: {
4
- install(app: App): void;
4
+ install(_: App): void;
5
5
  };
@@ -1,5 +1,5 @@
1
- import { PopOptions } from './PopOptions';
2
1
  import { ComponentWithProperties } from './ComponentWithProperties';
2
+ import { PopOptions } from './PopOptions';
3
3
 
4
4
  declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
5
5
  root: ComponentWithProperties;
@@ -9,50 +9,50 @@ export interface PushOptions {
9
9
  * The url for this new route.
10
10
  * Set to null to specifically ignore or extending url (displayed view will copy the previous url - which is not the same as the url of the previous view)
11
11
  */
12
- url?: string | null;
12
+ url?: string | null | undefined;
13
13
  /**
14
14
  * Whether we should push a new real state in the browser history
15
15
  */
16
- adjustHistory?: boolean;
16
+ adjustHistory?: boolean | undefined;
17
17
  /**
18
18
  * When the user will click back, the page will reload if this set is true, instead of doing js based navigation
19
19
  */
20
- invalidHistory?: boolean;
20
+ invalidHistory?: boolean | undefined;
21
21
  /**
22
22
  * Whether this component was pushed as result of a url reconstruction.
23
23
  * Setting this will allow the component to build further on the url reconstruction
24
24
  */
25
- checkRoutes?: boolean;
25
+ checkRoutes?: boolean | undefined;
26
26
  /**
27
27
  * Use animations if possible. Default value is the animated property of ComponentWithProperties.
28
28
  * In the future, we might remove the animated property of ComponentWithProperties and enable animations by default here.
29
29
  */
30
- animated?: boolean;
30
+ animated?: boolean | undefined;
31
31
  /**
32
32
  * Whether the "shouldNavigateAway" popped components will get called and respected. Set force to true to ignore
33
33
  * shouldNavigateAway. Most of the time you'll need to set this to true for programmatic navigation (e.g. as a result of an API call).
34
34
  * Set to false (= default) for user interaction (e.g. when he pressed the close button, when he tapped outside a popup, pressed the ESC key)
35
35
  */
36
- force?: boolean;
36
+ force?: boolean | undefined;
37
37
  /**
38
38
  * Default behaviour should be 'true'. Set to true to indicate that the popped component(s) should get removed from the
39
39
  * vdom. If you set this to false, they will be kept in memory. This will set keepAlive to 'true' for the removed
40
40
  * components, making it possible to move them around in the DOM.
41
41
  */
42
- destroy?: boolean;
42
+ destroy?: boolean | undefined;
43
43
  /**
44
44
  * How many components that need to be popped first (in the same animations, so the pop is invisible). Defaults to 0
45
45
  */
46
- replace?: number;
46
+ replace?: number | undefined;
47
47
  /**
48
48
  * Reverse the animation if possible. Defaults to false
49
49
  */
50
- reverse?: boolean;
50
+ reverse?: boolean | undefined;
51
51
  /**
52
52
  * Ignore client width checks, always display as modal, also on mobile devices.
53
53
  */
54
- forceModalDisplay?: boolean;
55
- modalDisplayStyle?: ModalDisplayStyle;
56
- modalClass?: string;
57
- modalCssStyle?: string;
54
+ forceModalDisplay?: boolean | undefined;
55
+ modalDisplayStyle?: ModalDisplayStyle | undefined;
56
+ modalClass?: string | undefined;
57
+ modalCssStyle?: string | undefined;
58
58
  }
@@ -1,8 +1,8 @@
1
- import { DefaultRouteHandler } from './utils/navigationHooks';
2
- import { PushOptions } from './PushOptions';
3
- import { default as NavigationController } from './NavigationController.vue';
4
- import { ComponentWithProperties, ComponentWithPropertiesType } from './ComponentWithProperties';
5
1
  import { PropType } from 'vue';
2
+ import { ComponentWithProperties, ComponentWithPropertiesType } from './ComponentWithProperties';
3
+ import { default as NavigationController } from './NavigationController.vue';
4
+ import { PushOptions } from './PushOptions';
5
+ import { DefaultRouteHandler } from './utils/navigationHooks';
6
6
 
7
7
  declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
8
8
  root: {
@@ -83,7 +83,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
83
83
  growSize(width: number, height: number): void;
84
84
  unfreezeSize(): void;
85
85
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
86
- getScrollElement(element?: HTMLElement | null): HTMLElement;
86
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
87
87
  shouldAnimate(): any;
88
88
  returnToHistoryIndex(): boolean;
89
89
  push(options: PushOptions): Promise<void>;
@@ -189,7 +189,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
189
189
  growSize(width: number, height: number): void;
190
190
  unfreezeSize(): void;
191
191
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
192
- getScrollElement(element?: HTMLElement | null): HTMLElement;
192
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
193
193
  shouldAnimate(): any;
194
194
  returnToHistoryIndex(): boolean;
195
195
  push(options: PushOptions): Promise<void>;
@@ -289,7 +289,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
289
289
  growSize(width: number, height: number): void;
290
290
  unfreezeSize(): void;
291
291
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
292
- getScrollElement(element?: HTMLElement | null): HTMLElement;
292
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
293
293
  shouldAnimate(): any;
294
294
  returnToHistoryIndex(): boolean;
295
295
  push(options: PushOptions): Promise<void>;
@@ -409,7 +409,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
409
409
  growSize(width: number, height: number): void;
410
410
  unfreezeSize(): void;
411
411
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
412
- getScrollElement(element?: HTMLElement | null): HTMLElement;
412
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
413
413
  shouldAnimate(): any;
414
414
  returnToHistoryIndex(): boolean;
415
415
  push(options: PushOptions): Promise<void>;
@@ -515,7 +515,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
515
515
  growSize(width: number, height: number): void;
516
516
  unfreezeSize(): void;
517
517
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
518
- getScrollElement(element?: HTMLElement | null): HTMLElement;
518
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
519
519
  shouldAnimate(): any;
520
520
  returnToHistoryIndex(): boolean;
521
521
  push(options: PushOptions): Promise<void>;
@@ -615,7 +615,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
615
615
  growSize(width: number, height: number): void;
616
616
  unfreezeSize(): void;
617
617
  getInternalScrollElement(element?: Element | null): HTMLElement | null;
618
- getScrollElement(element?: HTMLElement | null): HTMLElement;
618
+ getScrollElement(_?: HTMLElement | null): HTMLElement;
619
619
  shouldAnimate(): any;
620
620
  returnToHistoryIndex(): boolean;
621
621
  push(options: PushOptions): Promise<void>;
@@ -1,5 +1,5 @@
1
- import { ComponentWithProperties } from './ComponentWithProperties';
2
1
  import { Ref } from 'vue';
2
+ import { ComponentWithProperties } from './ComponentWithProperties';
3
3
 
4
4
  declare function removeAt(index: number, key: number): void;
5
5
  declare function getFocusedComponent(): ComponentWithProperties | null;
@@ -1,4 +1,4 @@
1
- import { default as NavigationController } from './NavigationController.vue';
2
1
  import { Ref } from 'vue';
2
+ import { default as NavigationController } from './NavigationController.vue';
3
3
 
4
4
  export declare function useNavigationController(): Ref<InstanceType<typeof NavigationController>>;
@@ -1,4 +1,4 @@
1
- import { default as SplitViewController } from './SplitViewController.vue';
2
1
  import { Ref } from 'vue';
2
+ import { default as SplitViewController } from './SplitViewController.vue';
3
3
 
4
4
  export declare function useSplitViewController(): Ref<InstanceType<typeof SplitViewController>>;
@@ -1,9 +1,9 @@
1
- import { UrlMatchResult, UrlParamsConstructors } from './UrlHelper';
2
- import { PushOptions } from '../PushOptions';
3
- import { PopOptions } from '../PopOptions';
4
- import { HistoryUrl } from '../HistoryManager';
5
- import { ComponentWithProperties, ModalDisplayStyle } from '../ComponentWithProperties';
6
1
  import { Component, Ref } from 'vue';
2
+ import { ComponentWithProperties, ModalDisplayStyle } from '../ComponentWithProperties';
3
+ import { HistoryUrl } from '../HistoryManager';
4
+ import { PopOptions } from '../PopOptions';
5
+ import { PushOptions } from '../PushOptions';
6
+ import { UrlMatchResult, UrlParamsConstructors } from './UrlHelper';
7
7
 
8
8
  export type Route<Params> = {
9
9
  name?: string;
@@ -1,4 +1,4 @@
1
- import { default as ModalStackComponent } from '../ModalStackComponent.vue';
2
1
  import { Ref } from 'vue';
2
+ import { default as ModalStackComponent } from '../ModalStackComponent.vue';
3
3
 
4
4
  export declare function useModalStackComponent(): Ref<InstanceType<typeof ModalStackComponent> | null>;
package/package.json CHANGED
@@ -1,51 +1,54 @@
1
1
  {
2
- "name": "@simonbackx/vue-app-navigation",
3
- "main": "./dist/index.js",
4
- "types": "./dist/index.d.ts",
5
- "version": "2.17.4",
6
- "exports": {
7
- ".": {
8
- "import": "./dist/index.js",
9
- "types": "./dist/index.d.ts"
10
- },
11
- "./classes": {
12
- "import": "./dist/classes.js",
13
- "types": "./dist/src/classes.d.ts"
14
- },
15
- "./dist/main.css": {
16
- "import": "./dist/main.css"
17
- }
2
+ "name": "@simonbackx/vue-app-navigation",
3
+ "main": "./dist/index.js",
4
+ "types": "./dist/index.d.ts",
5
+ "version": "2.18.1",
6
+ "exports": {
7
+ ".": {
8
+ "import": "./dist/index.js",
9
+ "types": "./dist/index.d.ts"
18
10
  },
19
- "sideEffects": [
20
- "*.vue",
21
- "*.css"
22
- ],
23
- "scripts": {
24
- "build": "vite build",
25
- "dev": "vite serve test --mode development",
26
- "build:dev": "vite build --mode development",
27
- "lint": "eslint"
11
+ "./classes": {
12
+ "import": "./dist/classes.js",
13
+ "types": "./dist/src/classes.d.ts"
28
14
  },
29
- "files": [
30
- "dist"
31
- ],
32
- "type": "module",
33
- "devDependencies": {
34
- "@types/node": "^20.12.7",
35
- "@vitejs/plugin-vue": "^5.0.4",
36
- "@vue/runtime-core": "^3.5.12",
37
- "eslint-plugin-stamhoofd": "^2.74.0",
38
- "sass": "^1.32.4",
39
- "tslib": "^2.8.1",
40
- "typescript": "^5.6.2",
41
- "vite": "^5.2.10",
42
- "vite-plugin-dts": "^3.9.0",
43
- "vue": "^3.5.12"
44
- },
45
- "peerDependencies": {
46
- "vue": "^3.5.12"
47
- },
48
- "dependencies": {
49
- "@vue/shared": "^3.5.12"
15
+ "./dist/main.css": {
16
+ "import": "./dist/main.css"
50
17
  }
51
- }
18
+ },
19
+ "sideEffects": [
20
+ "*.vue",
21
+ "*.css"
22
+ ],
23
+ "files": [
24
+ "dist"
25
+ ],
26
+ "type": "module",
27
+ "devDependencies": {
28
+ "@types/node": "^20.12.7",
29
+ "@vitejs/plugin-vue": "^5.0.4",
30
+ "@vue/runtime-core": "^3.5.12",
31
+ "eslint-plugin-stamhoofd": "^2.74.0",
32
+ "sass": "^1.32.4",
33
+ "tslib": "^2.8.1",
34
+ "typescript": "^6.0.3",
35
+ "vite": "^5.2.10",
36
+ "vite-plugin-dts": "^3.9.0",
37
+ "vue": "^3.5.12",
38
+ "vue-tsc": "^3.2.6"
39
+ },
40
+ "peerDependencies": {
41
+ "tslib": "^2.8.1",
42
+ "vue": "^3.5.12"
43
+ },
44
+ "dependencies": {
45
+ "@vue/shared": "^3.5.12"
46
+ },
47
+ "scripts": {
48
+ "build": "vite build",
49
+ "dev": "vite serve test --mode development",
50
+ "build:dev": "vite build --mode development",
51
+ "lint": "eslint",
52
+ "typecheck": "vue-tsc --noEmit"
53
+ }
54
+ }