stack.mjs 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. // Composables
  2. import { useToggleScope } from "./toggleScope.mjs"; // Utilities
  3. import { computed, inject, onScopeDispose, provide, reactive, readonly, shallowRef, toRaw, watchEffect } from 'vue';
  4. import { getCurrentInstance } from "../util/index.mjs"; // Types
  5. const StackSymbol = Symbol.for('vuetify:stack');
  6. const globalStack = reactive([]);
  7. export function useStack(isActive, zIndex, disableGlobalStack) {
  8. const vm = getCurrentInstance('useStack');
  9. const createStackEntry = !disableGlobalStack;
  10. const parent = inject(StackSymbol, undefined);
  11. const stack = reactive({
  12. activeChildren: new Set()
  13. });
  14. provide(StackSymbol, stack);
  15. const _zIndex = shallowRef(+zIndex.value);
  16. useToggleScope(isActive, () => {
  17. const lastZIndex = globalStack.at(-1)?.[1];
  18. _zIndex.value = lastZIndex ? lastZIndex + 10 : +zIndex.value;
  19. if (createStackEntry) {
  20. globalStack.push([vm.uid, _zIndex.value]);
  21. }
  22. parent?.activeChildren.add(vm.uid);
  23. onScopeDispose(() => {
  24. if (createStackEntry) {
  25. const idx = toRaw(globalStack).findIndex(v => v[0] === vm.uid);
  26. globalStack.splice(idx, 1);
  27. }
  28. parent?.activeChildren.delete(vm.uid);
  29. });
  30. });
  31. const globalTop = shallowRef(true);
  32. if (createStackEntry) {
  33. watchEffect(() => {
  34. const _isTop = globalStack.at(-1)?.[0] === vm.uid;
  35. setTimeout(() => globalTop.value = _isTop);
  36. });
  37. }
  38. const localTop = computed(() => !stack.activeChildren.size);
  39. return {
  40. globalTop: readonly(globalTop),
  41. localTop,
  42. stackStyles: computed(() => ({
  43. zIndex: _zIndex.value
  44. }))
  45. };
  46. }
  47. //# sourceMappingURL=stack.mjs.map