rimelight-components 2.1.34 → 2.1.35

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "rimelight-components",
-  "version": "2.1.34",
+  "version": "2.1.35",
   "docs": "https://rimelight.com/tools/rimelight-components",
   "configKey": "rimelightComponents",
   "compatibility": {

package/dist/module.mjs

@@ -4,7 +4,7 @@ import { readdirSync } from 'node:fs';
 import { basename } from 'node:path';
 
 const name = "rimelight-components";
-const version = "2.1.34";
+const version = "2.1.35";
 const homepage = "https://rimelight.com/tools/rimelight-components";
 
 const defaultOptions = {

package/dist/runtime/components/app/HeaderLayer.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, onUnmounted, watch, computed, nextTick } from "vue";
+import { ref, onMounted, onUnmounted, watch, computed, nextTick, provide } from "vue";
 import { useHeaderStack, useRC } from "../../composables";
 import { useWindowScroll } from "@vueuse/core";
 import { tv } from "../../internal/tv";
@@ -19,13 +19,14 @@ const headerLayerStyles = tv({
   }
 });
 const { root, content } = headerLayerStyles();
-const { registerHeader, unregisterHeader, getOffsetFor } = useHeaderStack();
+const { registerHeader, unregisterHeader, offsets } = useHeaderStack();
+provide("header_layer_id", id);
 const { y: scrollY } = useWindowScroll();
 const contentRef = ref(null);
 const isVisible = ref(true);
 const lastScrollY = ref(0);
 const naturalHeight = ref(0);
-const topOffset = computed(() => getOffsetFor(id));
+const topOffset = computed(() => offsets.value[id] ?? 0);
 watch(scrollY, (current) => {
   if (!hideOnScroll) return;
   const diff = current - lastScrollY.value;

package/dist/runtime/composables/useHeaderStack.d.ts

@@ -6,8 +6,9 @@ interface HeaderLayer {
 export declare const useHeaderStack: () => {
     registerHeader: (id: string, height: number, order?: number) => void;
     unregisterHeader: (id: string) => void;
-    totalOffset: import("vue").ComputedRef<number>;
-    getOffsetFor: (id: string) => number;
+    totalHeight: import("vue").ComputedRef<number>;
+    offsets: import("vue").ComputedRef<Record<string, number>>;
+    bottomOffsets: import("vue").ComputedRef<Record<string, number>>;
     layers: import("vue").ComputedRef<HeaderLayer[]>;
 };
 export {};

package/dist/runtime/composables/useHeaderStack.js

@@ -10,23 +10,39 @@ export const useHeaderStack = () => {
       }
     } else {
       layers.value.push({ id, height, order });
-      layers.value.sort((a, b) => a.order - b.order);
+      layers.value.sort((a, b) => a.order !== b.order ? a.order - b.order : 0);
     }
   };
   const unregisterHeader = (id) => {
     layers.value = layers.value.filter((l) => l.id !== id);
   };
-  const totalOffset = computed(() => layers.value.reduce((acc, l) => acc + l.height, 0));
-  const getOffsetFor = (id) => {
-    const index = layers.value.findIndex((l) => l.id === id);
-    if (index === -1) return 0;
-    return layers.value.slice(0, index).reduce((acc, l) => acc + l.height, 0);
-  };
+  const totalHeight = computed(
+    () => layers.value.reduce((acc, l) => acc + l.height, 0)
+  );
+  const offsets = computed(() => {
+    const map = {};
+    let currentOffset = 0;
+    layers.value.forEach((layer) => {
+      map[layer.id] = currentOffset;
+      currentOffset += layer.height;
+    });
+    return map;
+  });
+  const bottomOffsets = computed(() => {
+    const map = {};
+    let currentOffset = 0;
+    layers.value.forEach((layer) => {
+      currentOffset += layer.height;
+      map[layer.id] = currentOffset;
+    });
+    return map;
+  });
   return {
     registerHeader,
     unregisterHeader,
-    totalOffset,
-    getOffsetFor,
+    totalHeight,
+    offsets,
+    bottomOffsets,
     layers: computed(() => layers.value)
   };
 };

package/dist/runtime/composables/useHeaderStack.mjs

@@ -10,23 +10,39 @@ export const useHeaderStack = () => {
       }
     } else {
       layers.value.push({ id, height, order });
-      layers.value.sort((a, b) => a.order - b.order);
+      layers.value.sort((a, b) => a.order !== b.order ? a.order - b.order : 0);
     }
   };
   const unregisterHeader = (id) => {
     layers.value = layers.value.filter((l) => l.id !== id);
   };
-  const totalOffset = computed(() => layers.value.reduce((acc, l) => acc + l.height, 0));
-  const getOffsetFor = (id) => {
-    const index = layers.value.findIndex((l) => l.id === id);
-    if (index === -1) return 0;
-    return layers.value.slice(0, index).reduce((acc, l) => acc + l.height, 0);
-  };
+  const totalHeight = computed(
+    () => layers.value.reduce((acc, l) => acc + l.height, 0)
+  );
+  const offsets = computed(() => {
+    const map = {};
+    let currentOffset = 0;
+    layers.value.forEach((layer) => {
+      map[layer.id] = currentOffset;
+      currentOffset += layer.height;
+    });
+    return map;
+  });
+  const bottomOffsets = computed(() => {
+    const map = {};
+    let currentOffset = 0;
+    layers.value.forEach((layer) => {
+      currentOffset += layer.height;
+      map[layer.id] = currentOffset;
+    });
+    return map;
+  });
   return {
     registerHeader,
     unregisterHeader,
-    totalOffset,
-    getOffsetFor,
+    totalHeight,
+    offsets,
+    bottomOffsets,
     layers: computed(() => layers.value)
   };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rimelight-components",
-  "version": "2.1.34",
+  "version": "2.1.35",
   "description": "A component library by Rimelight Entertainment.",
   "keywords": [
     "nuxt",