@geode/opengeodeweb-front 10.37.0-rc.1 → 10.38.0-rc.1

package/README.md

@@ -6,6 +6,5 @@ OpenSource Vue/Vuetify framework for web applications.
 
 This codebase is written in TypeScript (`strict` mode, `noUncheckedIndexedAccess`).
 
-- `npm run typecheck` — type-checks the app/server/shared code (via `nuxt typecheck`) and the tests/scripts code (via `tsc -p tsconfig.tests.json`), which live under separate `tsconfig.json` projects since Nuxt's own generated config only covers the former.
 - `npm run lint` — runs [oxlint](https://oxc.rs/docs/guide/usage/linter.html) with autofix. The project's `.oxlintrc.json` must stay in sync with the shared [`Geode-solutions/actions`](https://github.com/Geode-solutions/actions) config, which CI re-downloads and enforces on every run.
 - `npm run test:unit` / `npm run test:integration` — run the Vitest suites under `tests/`.

package/app/components/Viewer/ContextMenu/ContextMenu.vue

@@ -3,6 +3,7 @@ import CenterButton from "@ogw_front/components/Viewer/ContextMenu/CenterButton.
 import CircularItems from "@ogw_front/components/Viewer/ContextMenu/CircularItems.vue";
 import type { Component } from "vue";
 import InfoCard from "@ogw_front/components/Viewer/ContextMenu/InfoCard.vue";
+import { provideBatchGroup } from "@ogw_front/composables/batch_style";
 import { useEventListener } from "@vueuse/core";
 import { useMenuStore } from "@ogw_front/stores/menu";
 import { useTreeviewStore } from "@ogw_front/stores/treeview";
@@ -30,6 +31,7 @@ const menuStore = useMenuStore();
 const treeviewStore = useTreeviewStore();
 
 const meta_data = computed(() => menuStore.current_meta_data || {});
+provideBatchGroup(() => meta_data.value.targetIds ?? []);
 
 const show_menu = ref<boolean>(true);
 const showName = ref<boolean>(false);

package/app/components/Viewer/EdgedCurve/SpecificEdgesOptions.vue

@@ -1,4 +1,9 @@
 <script setup lang="ts">
+import {
+  type RangesPerData,
+  applyRangesPerData,
+  useBatchStyle,
+} from "@ogw_front/composables/batch_style";
 import ViewerContextMenuItem, {
   type ItemProps,
 } from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
@@ -7,7 +12,6 @@ import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
 import ViewerOptionsWidthSlider from "@ogw_front/components/Viewer/Options/Sliders/Width.vue";
-import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
@@ -166,6 +170,20 @@ const edge_attribute_no_data_color = computed<RGBAColor>({
     hybridViewerStore.remoteRender();
   },
 });
+
+async function setVertexAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshEdgesVertexAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
+
+async function setEdgeAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshEdgesEdgeAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
 </script>
 
 <template>
@@ -188,11 +206,13 @@ const edge_attribute_no_data_color = computed<RGBAColor>({
           v-model:vertex_attribute_name="vertex_attribute_name"
           v-model:vertex_attribute_item="vertex_attribute_item"
           v-model:vertex_attribute_range="vertex_attribute_range"
+          @vertex_attribute_ranges_per_data="setVertexAttributeRangesPerData"
           v-model:vertex_attribute_color_map="vertex_attribute_color_map"
           v-model:vertex_attribute_no_data_color="vertex_attribute_no_data_color"
           v-model:edge_attribute_name="edge_attribute_name"
           v-model:edge_attribute_item="edge_attribute_item"
           v-model:edge_attribute_range="edge_attribute_range"
+          @edge_attribute_ranges_per_data="setEdgeAttributeRangesPerData"
           v-model:edge_attribute_color_map="edge_attribute_color_map"
           v-model:edge_attribute_no_data_color="edge_attribute_no_data_color"
         />

package/app/components/Viewer/Generic/Mesh/CellsOptions.vue

@@ -1,11 +1,15 @@
 <script setup lang="ts">
+import {
+  type RangesPerData,
+  applyRangesPerData,
+  useBatchStyle,
+} from "@ogw_front/composables/batch_style";
 import ViewerContextMenuItem, {
   type ItemProps,
 } from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
 import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
-import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
@@ -175,6 +179,20 @@ const cell_attribute_no_data_color = computed<RGBAColor>({
     hybridViewerStore.remoteRender();
   },
 });
+
+async function setVertexAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshCellsVertexAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
+
+async function setCellAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshCellsCellAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
 </script>
 
 <template>
@@ -197,11 +215,13 @@ const cell_attribute_no_data_color = computed<RGBAColor>({
           v-model:vertex_attribute_name="vertex_attribute_name"
           v-model:vertex_attribute_item="vertex_attribute_item"
           v-model:vertex_attribute_range="vertex_attribute_range"
+          @vertex_attribute_ranges_per_data="setVertexAttributeRangesPerData"
           v-model:vertex_attribute_color_map="vertex_attribute_color_map"
           v-model:vertex_attribute_no_data_color="vertex_attribute_no_data_color"
           v-model:cell_attribute_name="cell_attribute_name"
           v-model:cell_attribute_item="cell_attribute_item"
           v-model:cell_attribute_range="cell_attribute_range"
+          @cell_attribute_ranges_per_data="setCellAttributeRangesPerData"
           v-model:cell_attribute_color_map="cell_attribute_color_map"
           v-model:cell_attribute_no_data_color="cell_attribute_no_data_color"
         />

package/app/components/Viewer/Generic/Mesh/EdgesOptions.vue

@@ -1,4 +1,9 @@
 <script setup lang="ts">
+import {
+  type RangesPerData,
+  applyRangesPerData,
+  useBatchStyle,
+} from "@ogw_front/composables/batch_style";
 import ViewerContextMenuItem, {
   type ItemProps,
 } from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
@@ -6,7 +11,6 @@ import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
 import ViewerOptionsWidthSlider from "@ogw_front/components/Viewer/Options/Sliders/Width.vue";
-import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
@@ -167,6 +171,20 @@ const edge_attribute_no_data_color = computed<RGBAColor>({
     hybridViewerStore.remoteRender();
   },
 });
+
+async function setVertexAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshEdgesVertexAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
+
+async function setEdgeAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshEdgesEdgeAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
 </script>
 
 <template>
@@ -196,11 +214,13 @@ const edge_attribute_no_data_color = computed<RGBAColor>({
           v-model:vertex_attribute_name="vertex_attribute_name"
           v-model:vertex_attribute_item="vertex_attribute_item"
           v-model:vertex_attribute_range="vertex_attribute_range"
+          @vertex_attribute_ranges_per_data="setVertexAttributeRangesPerData"
           v-model:vertex_attribute_color_map="vertex_attribute_color_map"
           v-model:vertex_attribute_no_data_color="vertex_attribute_no_data_color"
           v-model:edge_attribute_name="edge_attribute_name"
           v-model:edge_attribute_item="edge_attribute_item"
           v-model:edge_attribute_range="edge_attribute_range"
+          @edge_attribute_ranges_per_data="setEdgeAttributeRangesPerData"
           v-model:edge_attribute_color_map="edge_attribute_color_map"
           v-model:edge_attribute_no_data_color="edge_attribute_no_data_color"
         />

package/app/components/Viewer/Generic/Mesh/PointsOptions.vue

@@ -1,4 +1,9 @@
 <script setup lang="ts">
+import {
+  type RangesPerData,
+  applyRangesPerData,
+  useBatchStyle,
+} from "@ogw_front/composables/batch_style";
 import ViewerContextMenuItem, {
   type ItemProps,
 } from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
@@ -6,7 +11,6 @@ import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import ViewerOptionsSizeSlider from "@ogw_front/components/Viewer/Options/Sliders/Size.vue";
 import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
-import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
@@ -115,6 +119,13 @@ const vertex_attribute_no_data_color = computed<RGBAColor>({
     hybridViewerStore.remoteRender();
   },
 });
+
+async function setVertexAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshPointsVertexAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
 </script>
 
 <template>
@@ -144,6 +155,7 @@ const vertex_attribute_no_data_color = computed<RGBAColor>({
           v-model:vertex_attribute_name="vertex_attribute_name"
           v-model:vertex_attribute_item="vertex_attribute_item"
           v-model:vertex_attribute_range="vertex_attribute_range"
+          @vertex_attribute_ranges_per_data="setVertexAttributeRangesPerData"
           v-model:vertex_attribute_color_map="vertex_attribute_color_map"
           v-model:vertex_attribute_no_data_color="vertex_attribute_no_data_color"
           :capabilities="{ vertex: { available: false } }"

package/app/components/Viewer/Generic/Mesh/PolygonsOptions.vue

@@ -1,11 +1,15 @@
 <script setup lang="ts">
+import {
+  type RangesPerData,
+  applyRangesPerData,
+  useBatchStyle,
+} from "@ogw_front/composables/batch_style";
 import ViewerContextMenuItem, {
   type ItemProps,
 } from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
 import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
-import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
@@ -190,6 +194,20 @@ const polygon_attribute_no_data_color = computed<RGBAColor>({
     hybridViewerStore.remoteRender();
   },
 });
+
+async function setVertexAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshPolygonsVertexAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
+
+async function setPolygonAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshPolygonsPolygonAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
 </script>
 
 <template>
@@ -215,11 +233,13 @@ const polygon_attribute_no_data_color = computed<RGBAColor>({
           v-model:vertex_attribute_name="vertex_attribute_name"
           v-model:vertex_attribute_item="vertex_attribute_item"
           v-model:vertex_attribute_range="vertex_attribute_range"
+          @vertex_attribute_ranges_per_data="setVertexAttributeRangesPerData"
           v-model:vertex_attribute_color_map="vertex_attribute_color_map"
           v-model:vertex_attribute_no_data_color="vertex_attribute_no_data_color"
           v-model:polygon_attribute_name="polygon_attribute_name"
           v-model:polygon_attribute_item="polygon_attribute_item"
           v-model:polygon_attribute_range="polygon_attribute_range"
+          @polygon_attribute_ranges_per_data="setPolygonAttributeRangesPerData"
           v-model:polygon_attribute_color_map="polygon_attribute_color_map"
           v-model:polygon_attribute_no_data_color="polygon_attribute_no_data_color"
           :capabilities="capabilities"

package/app/components/Viewer/Generic/Mesh/PolyhedraOptions.vue

@@ -1,11 +1,15 @@
 <script setup lang="ts">
+import {
+  type RangesPerData,
+  applyRangesPerData,
+  useBatchStyle,
+} from "@ogw_front/composables/batch_style";
 import ViewerContextMenuItem, {
   type ItemProps,
 } from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
 import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
-import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
@@ -163,6 +167,20 @@ const polyhedron_attribute_no_data_color = computed<RGBAColor>({
     hybridViewerStore.remoteRender();
   },
 });
+
+async function setVertexAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshPolyhedraVertexAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
+
+async function setPolyhedronAttributeRangesPerData(ranges: RangesPerData): Promise<void> {
+  await applyRangesPerData(ranges, (targetId, minimum, maximum) =>
+    dataStyleStore.setMeshPolyhedraPolyhedronAttributeRange(targetId, minimum, maximum),
+  );
+  hybridViewerStore.remoteRender();
+}
 </script>
 
 <template>
@@ -187,11 +205,13 @@ const polyhedron_attribute_no_data_color = computed<RGBAColor>({
           v-model:vertex_attribute_name="vertex_attribute_name"
           v-model:vertex_attribute_item="vertex_attribute_item"
           v-model:vertex_attribute_range="vertex_attribute_range"
+          @vertex_attribute_ranges_per_data="setVertexAttributeRangesPerData"
           v-model:vertex_attribute_color_map="vertex_attribute_color_map"
           v-model:vertex_attribute_no_data_color="vertex_attribute_no_data_color"
           v-model:polyhedron_attribute_name="polyhedron_attribute_name"
           v-model:polyhedron_attribute_item="polyhedron_attribute_item"
           v-model:polyhedron_attribute_range="polyhedron_attribute_range"
+          @polyhedron_attribute_ranges_per_data="setPolyhedronAttributeRangesPerData"
           v-model:polyhedron_attribute_color_map="polyhedron_attribute_color_map"
           v-model:polyhedron_attribute_no_data_color="polyhedron_attribute_no_data_color"
           :capabilities="{

package/app/components/Viewer/Generic/Model/ModelStyleCard.vue

@@ -9,23 +9,15 @@ import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import SurfacesOptions from "./SurfacesOptions.vue";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import VisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
+import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
-import { useTreeviewStore } from "@ogw_front/stores/treeview";
 
 const dataStyleStore = useDataStyleStore();
 const hybridViewerStore = useHybridViewerStore();
 const dataStore = useDataStore();
-const treeviewStore = useTreeviewStore();
-
-function getBatchComponentIds(currentId: string): string[] {
-  const { activeItems } = treeviewStore;
-  if (activeItems.includes(currentId) && activeItems.length > 1) {
-    return activeItems;
-  }
-  return [currentId];
-}
+const { applyBatchStyle } = useBatchStyle();
 
 interface Props {
   itemProps: Record<string, unknown>;
@@ -35,9 +27,9 @@ const { itemProps } = defineProps<Props>();
 
 const modelId = computed<string>(() => itemProps.meta_data.modelId || itemProps.id);
 const componentId = computed<string | undefined>(() => itemProps.meta_data.pickedComponentId);
-const selection = computed<string[]>(
-  () => dataStyleStore.visibleMeshComponents(modelId.value).value || [],
-);
+function visibleComponents(targetId: string): string[] {
+  return dataStyleStore.visibleMeshComponents(targetId).value || [];
+}
 const componentType = ref<string | undefined>(undefined);
 const collections = ref<CollectionComponent[] | undefined>(undefined);
 
@@ -105,7 +97,9 @@ const modelVisibility = computed<boolean | undefined>({
     if (newValue === undefined) {
       return;
     }
-    await dataStyleStore.setModelVisibility(modelId.value, newValue);
+    await applyBatchStyle(modelId.value, (targetId: string) =>
+      dataStyleStore.setModelVisibility(targetId, newValue),
+    );
     hybridViewerStore.remoteRender();
   },
 });
@@ -113,16 +107,18 @@ const modelVisibility = computed<boolean | undefined>({
 const modelComponentsColor = computed<RGBAColor | undefined>({
   get: () => dataStyleStore.getModelColor(modelId.value) as RGBAColor | undefined,
   set: async (color) => {
-    await dataStyleStore.mutateStyle(modelId.value, {
-      coloring: { constant: color },
+    await applyBatchStyle(modelId.value, async (targetId: string) => {
+      await dataStyleStore.mutateStyle(targetId, {
+        coloring: { constant: color },
+      });
+      const activeColoring = dataStyleStore.getModelActiveColoring(targetId);
+      await dataStyleStore.setModelComponentsColor(
+        targetId,
+        visibleComponents(targetId),
+        color,
+        typeof activeColoring === "string" ? activeColoring : undefined,
+      );
     });
-    const activeColoring = dataStyleStore.getModelActiveColoring(modelId.value);
-    await dataStyleStore.setModelComponentsColor(
-      modelId.value,
-      selection.value,
-      color,
-      typeof activeColoring === "string" ? activeColoring : undefined,
-    );
     hybridViewerStore.remoteRender();
   },
 });
@@ -133,15 +129,17 @@ const modelComponentsActiveColoring = computed<string | undefined>({
     if (typeof coloringType !== "string") {
       return;
     }
-    await dataStyleStore.mutateStyle(modelId.value, {
-      coloring: { active: coloringType },
+    await applyBatchStyle(modelId.value, async (targetId: string) => {
+      await dataStyleStore.mutateStyle(targetId, {
+        coloring: { active: coloringType },
+      });
+      await dataStyleStore.setModelComponentsColor(
+        targetId,
+        visibleComponents(targetId),
+        dataStyleStore.getModelColor(targetId),
+        coloringType,
+      );
     });
-    await dataStyleStore.setModelComponentsColor(
-      modelId.value,
-      selection.value,
-      dataStyleStore.getModelColor(modelId.value),
-      coloringType,
-    );
     hybridViewerStore.remoteRender();
   },
 });

package/app/components/Viewer/ObjectTree/Layout.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import GlobalObjects from "@ogw_front/components/Viewer/ObjectTree/Views/GlobalObjects.vue";
 import ModelTree from "@ogw_front/components/Viewer/ObjectTree/Views/ModelTree.vue";
+import type { TreeMenuPayload } from "@ogw_front/utils/treeview";
 import ViewerObjectTreeBox from "@ogw_front/components/Viewer/ObjectTree/Box.vue";
 import { geode_objects } from "@ogw_front/assets/geode_objects";
 import { useAdaptiveStyles } from "@ogw_front/composables/use_adaptive_styles";
@@ -24,7 +25,7 @@ const { containerWidth } = defineProps<Props>();
 const treeviewStore = useTreeviewStore();
 
 interface Emits {
-  "show-menu": [payload: Record<string, unknown>];
+  "show-menu": [payload: TreeMenuPayload];
 }
 
 const emit = defineEmits<Emits>();

package/app/components/Viewer/ObjectTree/Views/GlobalObjects.vue

@@ -1,9 +1,13 @@
 <script setup lang="ts">
+import {
+  type DataMenuPayload,
+  type GeodeObjectTypeMenuPayload,
+  compareSelections,
+} from "@ogw_front/utils/treeview";
 import CommonTreeView from "@ogw_front/components/Viewer/ObjectTree/Base/CommonTreeView.vue";
 import type { DisplayItem } from "@ogw_front/composables/virtual_tree";
 import ObjectTreeControls from "@ogw_front/components/Viewer/ObjectTree/Base/Controls.vue";
 import ObjectTreeItemLabel from "@ogw_front/components/Viewer/ObjectTree/Base/ItemLabel.vue";
-import { compareSelections } from "@ogw_front/utils/treeview";
 import { consola } from "consola";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
@@ -19,7 +23,7 @@ const hybridViewerStore = useHybridViewerStore();
 const { onHoverEnter, onHoverLeave } = useHoverhighlight();
 
 interface Emits {
-  "show-menu": [payload: { event: MouseEvent; itemId: string }];
+  "show-menu": [payload: DataMenuPayload | GeodeObjectTypeMenuPayload];
 }
 
 const emit = defineEmits<Emits>();
@@ -51,7 +55,7 @@ const {
 } = useTreeFilter(() => treeviewStore.items, { recursiveSort: true });
 
 function onUpdateSelection(val: string[]): void {
-  treeviewStore.selection = applySearchFilter(val, treeviewStore.selection) as string[];
+  treeviewStore.selection = applySearchFilter(val, treeviewStore.selection);
 }
 
 const visibleSelection = computed<string[]>(() => applySearchFilter(treeviewStore.selection, []));
@@ -83,6 +87,21 @@ watch(
   },
 );
 
+function showMenu(event: MouseEvent, item: TreeGroupItem): void {
+  const actualItem = item.raw || item;
+  if (!actualItem.children) {
+    emit("show-menu", { event, itemId: actualItem.id });
+    return;
+  }
+  const childIds = actualItem.children.map((child) => child.id);
+  emit("show-menu", {
+    event,
+    itemId: actualItem.id,
+    context_type: "geode_object_type",
+    targetIds: applySearchFilter(childIds),
+  });
+}
+
 function isModel(item: TreeGroupItem): boolean {
   const actualItem = item.raw || item;
   return (
@@ -191,18 +210,13 @@ function expandAll(): void {
       @update:scroll-top="treeviewStore.setScrollTop(mainView?.id ?? '', $event)"
       @hover:enter="({ item }) => handleHoverEnter({ item: item as unknown as TreeGroupItem })"
       @hover:leave="({ item }) => handleHoverLeave({ item: item as unknown as TreeGroupItem })"
-      @contextmenu="
-        emit('show-menu', {
-          event: $event.event,
-          itemId: $event.item.id as string,
-        })
-      "
+      @contextmenu="showMenu($event.event, $event.item as unknown as TreeGroupItem)"
     >
       <template #title="{ item, isLeaf }">
         <ObjectTreeItemLabel
           :item="item as unknown as DisplayItem"
           :is-leaf="isLeaf"
-          @contextmenu="emit('show-menu', { event: $event, itemId: item.id as string })"
+          @contextmenu="showMenu($event, item as unknown as TreeGroupItem)"
         />
       </template>
 

package/app/components/Viewer/ObjectTree/Views/ModelTree.vue

@@ -4,6 +4,7 @@ import CommonTreeView from "@ogw_front/components/Viewer/ObjectTree/Base/CommonT
 import type { DisplayItem } from "@ogw_front/composables/virtual_tree";
 import FetchingData from "@ogw_front/components/FetchingData.vue";
 import { MESH_COMPONENT_TYPES } from "@ogw_front/utils/default_styles";
+import type { ModelComponentMenuPayload } from "@ogw_front/utils/treeview";
 import ObjectTreeControls from "@ogw_front/components/Viewer/ObjectTree/Base/Controls.vue";
 import ObjectTreeItemLabel from "@ogw_front/components/Viewer/ObjectTree/Base/ItemLabel.vue";
 import { useHoverhighlight } from "@ogw_front/composables/hover_highlight";
@@ -33,16 +34,7 @@ interface CollectionTreeItem {
 const { onHoverEnter, onHoverLeave } = useHoverhighlight();
 const hybridViewerStore = useHybridViewerStore();
 interface Emits {
-  "show-menu": [
-    payload: {
-      event: unknown;
-      itemId: string;
-      context_type: "model_component" | "model_component_type";
-      modelId: string;
-      modelComponentType?: string;
-      targetComponentIds?: string[];
-    },
-  ];
+  "show-menu": [payload: ModelComponentMenuPayload];
 }
 
 const emit = defineEmits<Emits>();
@@ -87,12 +79,10 @@ const {
 
 function onUpdateSelection(newSelection: string[]): void {
   const finalSelection = applySearchFilter(newSelection, visibleComponents.value);
-  updateVisibility(finalSelection as string[]);
+  updateVisibility(finalSelection);
 }
 
-const visibleSelection = computed<string[]>(
-  () => applySearchFilter(visibleComponents.value, []) as string[],
-);
+const visibleSelection = computed<string[]>(() => applySearchFilter(visibleComponents.value, []));
 
 const itemsForTreeView = computed<CollectionTreeItem[]>(() => {
   if (search.value && cache.value) {
@@ -137,7 +127,7 @@ function extractComponentIds(node: CollectionTreeItem): string[] {
   return [node.id];
 }
 
-function showContextMenu(event: unknown, item: CollectionTreeItem): void {
+function showContextMenu(event: MouseEvent, item: CollectionTreeItem): void {
   const actualItem = item.raw || item;
   if (isCollections.value && !MESH_COMPONENT_TYPES.includes(actualItem.category ?? "")) {
     emit("show-menu", {

package/app/components/Viewer/Options/AttributeColorBar.vue

@@ -8,6 +8,12 @@ interface Emits {
 
 const emit = defineEmits<Emits>();
 
+interface Props {
+  hideRange?: boolean;
+}
+
+const { hideRange = false } = defineProps<Props>();
+
 const minimum = defineModel<number>("minimum");
 const maximum = defineModel<number>("maximum");
 const colorMap = defineModel<string>("colorMap");
@@ -21,6 +27,7 @@ const colorMap = defineModel<string>("colorMap");
       :max="maximum ?? 0"
     />
     <AttributeRangeSelector
+      v-if="!hideRange"
       v-model:minimum="minimum"
       v-model:maximum="maximum"
       class="mt-2"