@geode/opengeodeweb-front 10.34.0-rc.8 → 10.34.0

package/internal/stores/data_style/mesh/points/vertex.ts

@@ -49,11 +49,38 @@ function isMeshPointsVertexAttributeValid({
   );
 }
 
+interface UseMeshPointsVertexAttributeStyleReturn {
+  meshPointsVertexAttributeName: (id: string) => string | undefined;
+  meshPointsVertexAttributeItem: (id: string) => number;
+  meshPointsVertexAttributeRange: (id: string) => [number | undefined, number | undefined];
+  meshPointsVertexAttributeColorMap: (id: string) => string | undefined;
+  meshPointsVertexAttributeStoredConfig: (
+    id: string,
+    name: string | undefined,
+    item: number | undefined,
+  ) => AttributeStoredConfig;
+  setMeshPointsVertexAttribute: (id: string, input: AttributeInput) => Promise<unknown>;
+  setMeshPointsVertexAttributeName: (id: string, name: string) => Promise<unknown>;
+  setMeshPointsVertexAttributeItem: (id: string, item: number) => Promise<unknown>;
+  setMeshPointsVertexAttributeRange: (
+    id: string,
+    minimum: number,
+    maximum: number,
+  ) => Promise<unknown>;
+  setMeshPointsVertexAttributeColorMap: (
+    id: string,
+    colorMap: string | undefined,
+  ) => Promise<unknown>;
+  meshPointsVertexAttributeNoDataColor: (id: string) => unknown;
+  setMeshPointsVertexAttributeNoDataColor: (id: string, no_data_color: unknown) => Promise<unknown>;
+}
+
 // oxlint-disable-next-line max-lines-per-function
-function useMeshPointsVertexAttributeStyle() {
+function useMeshPointsVertexAttributeStyle(): UseMeshPointsVertexAttributeStyleReturn {
   const viewerStore = useViewerStore();
   const meshPointsCommonStyle = useMeshPointsCommonStyle();
   function meshPointsVertexAttribute(id: string): AttributeState {
+    // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.vertex shape is defined by the data style schema.
     return meshPointsCommonStyle.meshPointsColoring(id).vertex as AttributeState;
   }
   function meshPointsVertexAttributeStoredConfig(
@@ -62,14 +89,10 @@ function useMeshPointsVertexAttributeStyle() {
     item: number | undefined,
   ): AttributeStoredConfig {
     const { storedConfigs } = meshPointsVertexAttribute(id);
-    if (
-      storedConfigs &&
-      name !== undefined &&
-      name in storedConfigs &&
-      item !== undefined &&
-      item in storedConfigs[name]!
-    ) {
-      return storedConfigs[name]![item]!;
+    const nameConfig = name === undefined ? undefined : storedConfigs?.[name];
+    const itemConfig = item === undefined ? undefined : nameConfig?.[item];
+    if (itemConfig !== undefined) {
+      return itemConfig;
     }
     return {
       minimum: undefined,
@@ -78,35 +101,41 @@ function useMeshPointsVertexAttributeStyle() {
       no_data_color: DEFAULT_NO_DATA_COLOR,
     };
   }
-  function mutateMeshPointsVertexStyle(id: string, values: Record<string, unknown>) {
-    return meshPointsCommonStyle.mutateMeshPointsStyle(id, {
+  async function mutateMeshPointsVertexStyle(
+    id: string,
+    values: Record<string, unknown>,
+  ): Promise<string> {
+    const result = await meshPointsCommonStyle.mutateMeshPointsStyle(id, {
       coloring: {
         vertex: values,
       },
     });
+    return result;
   }
-  function setMeshPointsVertexAttributeStoredConfig(
+  async function setMeshPointsVertexAttributeStoredConfig(
     id: string,
     name: string | undefined,
     item: number | undefined,
     config: Partial<AttributeStoredConfig>,
-  ) {
-    return mutateMeshPointsVertexStyle(id, {
+  ): Promise<string> {
+    const result = await mutateMeshPointsVertexStyle(id, {
       storedConfigs: {
-        [name as string]: {
+        [name ?? ""]: {
           lastItem: item,
-          [item as number]: config,
+          [item ?? 0]: config,
         },
       },
     });
+    return result;
   }
   function meshPointsVertexAttributeName(id: string): string | undefined {
     return meshPointsVertexAttribute(id).name;
   }
   function meshPointsVertexAttributeLastItem(id: string, name: string | undefined): number {
     const { storedConfigs } = meshPointsVertexAttribute(id);
-    if (storedConfigs && name !== undefined && name in storedConfigs) {
-      return storedConfigs[name]!.lastItem;
+    const nameConfig = name === undefined ? undefined : storedConfigs?.[name];
+    if (nameConfig !== undefined) {
+      return nameConfig.lastItem;
     }
     return 0;
   }
@@ -114,7 +143,7 @@ function useMeshPointsVertexAttributeStyle() {
     const { item, name } = meshPointsVertexAttribute(id);
     return item ?? meshPointsVertexAttributeLastItem(id, name);
   }
-  function setMeshPointsVertexAttribute(
+  async function setMeshPointsVertexAttribute(
     id: string,
     {
       name,
@@ -124,18 +153,18 @@ function useMeshPointsVertexAttributeStyle() {
       colorMap,
       no_data_color = DEFAULT_NO_DATA_COLOR,
     }: AttributeInput,
-  ) {
-    mutateMeshPointsVertexStyle(id, {
+  ): Promise<unknown> {
+    await mutateMeshPointsVertexStyle(id, {
       name,
       item,
     });
-    setMeshPointsVertexAttributeStoredConfig(id, name, item, {
+    await setMeshPointsVertexAttributeStoredConfig(id, name, item, {
       minimum,
       maximum,
       colorMap,
       no_data_color,
     });
-    const points = getRGBPointsFromPreset(colorMap as string);
+    const points = getRGBPointsFromPreset(colorMap ?? "");
     const schema = meshPointsVertexAttributeSchemas.attribute;
     const params = {
       id,
@@ -151,7 +180,7 @@ function useMeshPointsVertexAttributeStyle() {
       params,
     });
   }
-  function applyVertexAttribute(id: string) {
+  async function applyVertexAttribute(id: string): Promise<unknown> {
     const name = meshPointsVertexAttributeName(id);
     const item = meshPointsVertexAttributeItem(id);
     const storedConfig = meshPointsVertexAttributeStoredConfig(id, name, item);
@@ -164,19 +193,21 @@ function useMeshPointsVertexAttributeStyle() {
       no_data_color: storedConfig.no_data_color,
     };
     if (isMeshPointsVertexAttributeValid(attribute)) {
-      return setMeshPointsVertexAttribute(id, attribute);
+      const result = await setMeshPointsVertexAttribute(id, attribute);
+      return result;
     }
+    return undefined;
   }
-  function setMeshPointsVertexAttributeName(id: string, name: string) {
+  async function setMeshPointsVertexAttributeName(id: string, name: string): Promise<unknown> {
     const item = meshPointsVertexAttributeLastItem(id, name);
-    mutateMeshPointsVertexStyle(id, {
+    await mutateMeshPointsVertexStyle(id, {
       name,
       item,
     });
     return applyVertexAttribute(id);
   }
-  function setMeshPointsVertexAttributeItem(id: string, item: number) {
-    mutateMeshPointsVertexStyle(id, {
+  async function setMeshPointsVertexAttributeItem(id: string, item: number): Promise<unknown> {
+    await mutateMeshPointsVertexStyle(id, {
       item,
     });
     return applyVertexAttribute(id);
@@ -187,10 +218,14 @@ function useMeshPointsVertexAttributeStyle() {
     const storedConfig = meshPointsVertexAttributeStoredConfig(id, name, item);
     return [storedConfig.minimum, storedConfig.maximum];
   }
-  function setMeshPointsVertexAttributeRange(id: string, minimum: number, maximum: number) {
+  async function setMeshPointsVertexAttributeRange(
+    id: string,
+    minimum: number,
+    maximum: number,
+  ): Promise<unknown> {
     const name = meshPointsVertexAttributeName(id);
     const item = meshPointsVertexAttributeItem(id);
-    setMeshPointsVertexAttributeStoredConfig(id, name, item, {
+    await setMeshPointsVertexAttributeStoredConfig(id, name, item, {
       minimum,
       maximum,
     });
@@ -202,10 +237,13 @@ function useMeshPointsVertexAttributeStyle() {
     const storedConfig = meshPointsVertexAttributeStoredConfig(id, name, item);
     return storedConfig.colorMap;
   }
-  function setMeshPointsVertexAttributeColorMap(id: string, colorMap: string | undefined) {
+  async function setMeshPointsVertexAttributeColorMap(
+    id: string,
+    colorMap: string | undefined,
+  ): Promise<unknown> {
     const name = meshPointsVertexAttributeName(id);
     const item = meshPointsVertexAttributeItem(id);
-    setMeshPointsVertexAttributeStoredConfig(id, name, item, {
+    await setMeshPointsVertexAttributeStoredConfig(id, name, item, {
       colorMap,
     });
     return applyVertexAttribute(id);
@@ -216,7 +254,10 @@ function useMeshPointsVertexAttributeStyle() {
     const storedConfig = meshPointsVertexAttributeStoredConfig(id, name, item);
     return storedConfig.no_data_color;
   }
-  async function setMeshPointsVertexAttributeNoDataColor(id: string, no_data_color: unknown) {
+  async function setMeshPointsVertexAttributeNoDataColor(
+    id: string,
+    no_data_color: unknown,
+  ): Promise<unknown> {
     const name = meshPointsVertexAttributeName(id);
     const item = meshPointsVertexAttributeItem(id);
     const storedConfig = meshPointsVertexAttributeStoredConfig(id, name, item);

package/internal/stores/data_style/mesh/points/visibility.ts

@@ -8,28 +8,38 @@ import { useViewerStore } from "@ogw_front/stores/viewer";
 // Local constants
 const schema = viewer_schemas.opengeodeweb_viewer.mesh.points.visibility;
 
-export function useMeshPointsVisibilityStyle() {
+export function useMeshPointsVisibilityStyle(): {
+  meshPointsVisibility: (id: string) => boolean | undefined;
+  setMeshPointsVisibility: (id: string, visibility: boolean | undefined) => Promise<unknown>;
+} {
   const viewerStore = useViewerStore();
   const meshPointsCommonStyle = useMeshPointsCommonStyle();
 
   function meshPointsVisibility(id: string): boolean | undefined {
+    // oxlint-disable-next-line no-unsafe-type-assertion -- visibility is defined as boolean in the data style schema.
     return meshPointsCommonStyle.meshPointsStyle(id).visibility as boolean | undefined;
   }
-  function setMeshPointsVisibility(id: string, visibility: boolean | undefined) {
+  async function setMeshPointsVisibility(
+    id: string,
+    visibility: boolean | undefined,
+  ): Promise<unknown> {
     const params = { id, visibility };
-    return viewerStore.request(
+    const result = await viewerStore.request(
       {
         schema,
         params,
       },
       {
-        response_function(response: unknown) {
-          return meshPointsCommonStyle.mutateMeshPointsVisibility(
-            response as { id: string; visibility: boolean },
-          );
+        response_function: async (response: unknown) => {
+          // oxlint-disable-next-line no-unsafe-type-assertion -- response shape is defined by the viewer schema.
+          const typedResponse = response as { id: string; visibility: boolean };
+          const mutateResult =
+            await meshPointsCommonStyle.mutateMeshPointsVisibility(typedResponse);
+          return mutateResult;
         },
       },
     );
+    return result;
   }
 
   return {

package/internal/stores/data_style/mesh/polygons/color.ts

@@ -8,27 +8,33 @@ import { useViewerStore } from "@ogw_front/stores/viewer";
 // Local constants
 const schema = viewer_schemas.opengeodeweb_viewer.mesh.polygons.color;
 
-export function useMeshPolygonsColorStyle() {
+export function useMeshPolygonsColorStyle(): {
+  meshPolygonsColor: (id: string) => unknown;
+  setMeshPolygonsColor: (id: string, color: unknown) => Promise<unknown>;
+} {
   const viewerStore = useViewerStore();
   const meshPolygonsCommonStyle = useMeshPolygonsCommonStyle();
 
   function meshPolygonsColor(id: string): unknown {
     return meshPolygonsCommonStyle.meshPolygonsColoring(id).constant;
   }
-  function setMeshPolygonsColor(id: string, color: unknown) {
+  async function setMeshPolygonsColor(id: string, color: unknown): Promise<unknown> {
     const params = { id, color };
-    return viewerStore.request(
+    const result = await viewerStore.request(
       {
         schema,
         params,
       },
       {
-        response_function: () =>
-          meshPolygonsCommonStyle.mutateMeshPolygonsColoring(id, {
+        response_function: async () => {
+          const mutateResult = await meshPolygonsCommonStyle.mutateMeshPolygonsColoring(id, {
             constant: color,
-          }),
+          });
+          return mutateResult;
+        },
       },
     );
+    return result;
   }
 
   return {

package/internal/stores/data_style/mesh/polygons/common.ts

@@ -1,27 +1,43 @@
 import type { StyleValues } from "@ogw_internal/stores/data_style/types.js";
 import { useDataStyleState } from "@ogw_internal/stores/data_style/state";
 
-export function useMeshPolygonsCommonStyle() {
+export function useMeshPolygonsCommonStyle(): {
+  meshPolygonsStyle: (id: string) => StyleValues;
+  meshPolygonsColoring: (id: string) => StyleValues;
+  mutateMeshPolygonsStyle: (id: string, values: StyleValues) => Promise<string>;
+  mutateMeshPolygonsColoring: (id: string, values: StyleValues) => Promise<string>;
+  mutateMeshPolygonsPolygonStyle: (id: string, values: StyleValues) => Promise<string>;
+} {
   const dataStyleState = useDataStyleState();
 
-  function mutateMeshPolygonsStyle(id: string, values: StyleValues) {
-    return dataStyleState.mutateStyle(id, {
+  async function mutateMeshPolygonsStyle(id: string, values: StyleValues): Promise<string> {
+    const result = await dataStyleState.mutateStyle(id, {
       polygons: values,
     });
+    return result;
   }
 
   function meshPolygonsStyle(id: string): StyleValues {
-    return dataStyleState.getStyle(id).polygons as StyleValues;
+    return dataStyleState.getStyle(id).polygons ?? {};
   }
 
   function meshPolygonsColoring(id: string): StyleValues {
+    // oxlint-disable-next-line no-unsafe-type-assertion -- coloring shape is defined by the data style schema.
     return meshPolygonsStyle(id).coloring as StyleValues;
   }
 
-  function mutateMeshPolygonsColoring(id: string, values: StyleValues) {
-    return mutateMeshPolygonsStyle(id, {
+  async function mutateMeshPolygonsColoring(id: string, values: StyleValues): Promise<string> {
+    const result = await mutateMeshPolygonsStyle(id, {
       coloring: values,
     });
+    return result;
+  }
+
+  async function mutateMeshPolygonsPolygonStyle(id: string, values: StyleValues): Promise<string> {
+    const result = await mutateMeshPolygonsColoring(id, {
+      polygon: values,
+    });
+    return result;
   }
 
   return {
@@ -29,5 +45,6 @@ export function useMeshPolygonsCommonStyle() {
     meshPolygonsColoring,
     mutateMeshPolygonsStyle,
     mutateMeshPolygonsColoring,
+    mutateMeshPolygonsPolygonStyle,
   };
 }

package/internal/stores/data_style/mesh/polygons/index.ts

@@ -6,6 +6,7 @@ import {
   useMeshPolygonsPolygonAttributeStyle,
 } from "./polygon";
 import { isMeshPolygonsVertexAttributeValid, useMeshPolygonsVertexAttributeStyle } from "./vertex";
+import type { StyleValues } from "@ogw_internal/stores/data_style/types.js";
 import { useMeshPolygonsColorStyle } from "./color";
 import { useMeshPolygonsCommonStyle } from "./common";
 import { useMeshPolygonsTexturesStyle } from "./textures";
@@ -13,95 +14,154 @@ import { useMeshPolygonsVisibilityStyle } from "./visibility";
 
 // Local constants
 
-function useMeshPolygonsColoringStyle() {
+interface MeshPolygonsActiveColoringDeps {
+  readonly commonStyle: ReturnType<typeof useMeshPolygonsCommonStyle>;
+  readonly colorStyle: ReturnType<typeof useMeshPolygonsColorStyle>;
+  readonly texturesStyle: ReturnType<typeof useMeshPolygonsTexturesStyle>;
+  readonly vertexAttributeStyle: ReturnType<typeof useMeshPolygonsVertexAttributeStyle>;
+  readonly polygonAttributeStyle: ReturnType<typeof useMeshPolygonsPolygonAttributeStyle>;
+}
+
+function handleMeshPolygonsVertexColoring(
+  id: string,
+  vertexAttributeStyle: ReturnType<typeof useMeshPolygonsVertexAttributeStyle>,
+): Promise<unknown> | undefined {
+  const name = vertexAttributeStyle.meshPolygonsVertexAttributeName(id);
+  const item = vertexAttributeStyle.meshPolygonsVertexAttributeItem(id);
+  const [minimum, maximum] = vertexAttributeStyle.meshPolygonsVertexAttributeRange(id);
+  const colorMap = vertexAttributeStyle.meshPolygonsVertexAttributeColorMap(id);
+  const vertex_attribute = { name, item, minimum, maximum, colorMap };
+  if (!isMeshPolygonsVertexAttributeValid(vertex_attribute)) {
+    return undefined;
+  }
+  return vertexAttributeStyle.setMeshPolygonsVertexAttribute(id, vertex_attribute);
+}
+
+function handleMeshPolygonsPolygonColoring(
+  id: string,
+  polygonAttributeStyle: ReturnType<typeof useMeshPolygonsPolygonAttributeStyle>,
+): Promise<unknown> | undefined {
+  const name = polygonAttributeStyle.meshPolygonsPolygonAttributeName(id);
+  const item = polygonAttributeStyle.meshPolygonsPolygonAttributeItem(id);
+  const [minimum, maximum] = polygonAttributeStyle.meshPolygonsPolygonAttributeRange(id);
+  const colorMap = polygonAttributeStyle.meshPolygonsPolygonAttributeColorMap(id);
+  const polygon_attribute = { name, item, minimum, maximum, colorMap };
+  if (!isMeshPolygonsPolygonAttributeValid(polygon_attribute)) {
+    return undefined;
+  }
+  return polygonAttributeStyle.setMeshPolygonsPolygonAttribute(id, polygon_attribute);
+}
+
+async function setMeshPolygonsActiveColoring(
+  id: string,
+  type: string | undefined,
+  deps: MeshPolygonsActiveColoringDeps,
+): Promise<unknown> {
+  await deps.commonStyle.mutateMeshPolygonsStyle(id, {
+    coloring: { active: type },
+  });
+  if (type === "constant") {
+    const result = await deps.colorStyle.setMeshPolygonsColor(
+      id,
+      deps.colorStyle.meshPolygonsColor(id),
+    );
+    return result;
+  }
+  if (type === "textures") {
+    const result = await deps.texturesStyle.setMeshPolygonsTextures(
+      id,
+      deps.texturesStyle.meshPolygonsTextures(id),
+    );
+    return result;
+  }
+  if (type === "vertex") {
+    const result = await handleMeshPolygonsVertexColoring(id, deps.vertexAttributeStyle);
+    return result;
+  }
+  if (type === "polygon") {
+    const result = await handleMeshPolygonsPolygonColoring(id, deps.polygonAttributeStyle);
+    return result;
+  }
+  throw new Error(`Unknown mesh polygons coloring type: ${type}`);
+}
+
+async function applyMeshPolygonsStyle(
+  id: string,
+  visibilityStyle: ReturnType<typeof useMeshPolygonsVisibilityStyle>,
+  activeColoringType: string | undefined,
+  deps: MeshPolygonsActiveColoringDeps,
+): Promise<unknown[]> {
+  const result = await Promise.all([
+    visibilityStyle.setMeshPolygonsVisibility(id, visibilityStyle.meshPolygonsVisibility(id)),
+    setMeshPolygonsActiveColoring(id, activeColoringType, deps),
+  ]);
+  return result;
+}
+
+type UseMeshPolygonsStyleReturn = ReturnType<typeof useMeshPolygonsCommonStyle> & {
+  meshPolygonsColoring: (id: string) => StyleValues;
+  meshPolygonsActiveColoring: (id: string) => string | undefined;
+  setMeshPolygonsActiveColoring: (id: string, type: string | undefined) => Promise<unknown>;
+  applyMeshPolygonsStyle: (id: string) => Promise<unknown[]>;
+} & ReturnType<typeof useMeshPolygonsVisibilityStyle> &
+  ReturnType<typeof useMeshPolygonsColorStyle> &
+  ReturnType<typeof useMeshPolygonsTexturesStyle> &
+  ReturnType<typeof useMeshPolygonsVertexAttributeStyle> &
+  ReturnType<typeof useMeshPolygonsPolygonAttributeStyle>;
+
+export function useMeshPolygonsStyle(): UseMeshPolygonsStyleReturn {
   const meshPolygonsCommonStyle = useMeshPolygonsCommonStyle();
+  const meshPolygonsVisibility = useMeshPolygonsVisibilityStyle();
   const meshPolygonsColorStyle = useMeshPolygonsColorStyle();
-  const meshPolygonsTexturesStyle = useMeshPolygonsTexturesStyle();
+  const meshPolygonsTexturesStore = useMeshPolygonsTexturesStyle();
   const meshPolygonsVertexAttributeStyle = useMeshPolygonsVertexAttributeStyle();
   const meshPolygonsPolygonAttributeStyle = useMeshPolygonsPolygonAttributeStyle();
 
-  function meshPolygonsColoring(id: string) {
+  const activeColoringDeps: MeshPolygonsActiveColoringDeps = {
+    commonStyle: meshPolygonsCommonStyle,
+    colorStyle: meshPolygonsColorStyle,
+    texturesStyle: meshPolygonsTexturesStore,
+    vertexAttributeStyle: meshPolygonsVertexAttributeStyle,
+    polygonAttributeStyle: meshPolygonsPolygonAttributeStyle,
+  };
+
+  function meshPolygonsColoring(id: string): StyleValues {
     return meshPolygonsCommonStyle.meshPolygonsColoring(id);
   }
 
   function meshPolygonsActiveColoring(id: string): string | undefined {
+    // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.active is defined as string in the data style schema.
     return meshPolygonsColoring(id).active as string | undefined;
   }
 
-  async function setMeshPolygonsActiveColoring(id: string, type: string | undefined) {
-    await meshPolygonsCommonStyle.mutateMeshPolygonsStyle(id, {
-      coloring: { active: type },
-    });
-    if (type === "constant") {
-      return meshPolygonsColorStyle.setMeshPolygonsColor(
-        id,
-        meshPolygonsColorStyle.meshPolygonsColor(id),
-      );
-    }
-    if (type === "textures") {
-      const textures = meshPolygonsTexturesStyle.meshPolygonsTextures(id);
-      return meshPolygonsTexturesStyle.setMeshPolygonsTextures(id, textures);
-    }
-    if (type === "vertex") {
-      const name = meshPolygonsVertexAttributeStyle.meshPolygonsVertexAttributeName(id);
-      const item = meshPolygonsVertexAttributeStyle.meshPolygonsVertexAttributeItem(id);
-      const [minimum, maximum] =
-        meshPolygonsVertexAttributeStyle.meshPolygonsVertexAttributeRange(id);
-      const colorMap = meshPolygonsVertexAttributeStyle.meshPolygonsVertexAttributeColorMap(id);
-      const vertex_attribute = { name, item, minimum, maximum, colorMap };
-      if (!isMeshPolygonsVertexAttributeValid(vertex_attribute)) {
-        return;
-      }
-      return meshPolygonsVertexAttributeStyle.setMeshPolygonsVertexAttribute(id, vertex_attribute);
-    }
-    if (type === "polygon") {
-      const name = meshPolygonsPolygonAttributeStyle.meshPolygonsPolygonAttributeName(id);
-      const item = meshPolygonsPolygonAttributeStyle.meshPolygonsPolygonAttributeItem(id);
-      const [minimum, maximum] =
-        meshPolygonsPolygonAttributeStyle.meshPolygonsPolygonAttributeRange(id);
-      const colorMap = meshPolygonsPolygonAttributeStyle.meshPolygonsPolygonAttributeColorMap(id);
-      const polygon_attribute = { name, item, minimum, maximum, colorMap };
-      if (!isMeshPolygonsPolygonAttributeValid(polygon_attribute)) {
-        return;
-      }
-      return meshPolygonsPolygonAttributeStyle.setMeshPolygonsPolygonAttribute(
-        id,
-        polygon_attribute,
-      );
-    }
-    throw new Error(`Unknown mesh polygons coloring type: ${type}`);
+  async function boundSetMeshPolygonsActiveColoring(
+    id: string,
+    type: string | undefined,
+  ): Promise<unknown> {
+    const result = await setMeshPolygonsActiveColoring(id, type, activeColoringDeps);
+    return result;
+  }
+
+  async function boundApplyMeshPolygonsStyle(id: string): Promise<unknown[]> {
+    const result = await applyMeshPolygonsStyle(
+      id,
+      meshPolygonsVisibility,
+      meshPolygonsActiveColoring(id),
+      activeColoringDeps,
+    );
+    return result;
   }
 
   return {
+    ...meshPolygonsCommonStyle,
     meshPolygonsColoring,
     meshPolygonsActiveColoring,
-    setMeshPolygonsActiveColoring,
+    setMeshPolygonsActiveColoring: boundSetMeshPolygonsActiveColoring,
+    applyMeshPolygonsStyle: boundApplyMeshPolygonsStyle,
+    ...meshPolygonsVisibility,
     ...meshPolygonsColorStyle,
-    ...meshPolygonsTexturesStyle,
+    ...meshPolygonsTexturesStore,
     ...meshPolygonsVertexAttributeStyle,
     ...meshPolygonsPolygonAttributeStyle,
   };
 }
-
-export function useMeshPolygonsStyle() {
-  const meshPolygonsCommonStyle = useMeshPolygonsCommonStyle();
-  const meshPolygonsVisibility = useMeshPolygonsVisibilityStyle();
-  const coloringStyle = useMeshPolygonsColoringStyle();
-
-  function applyMeshPolygonsStyle(id: string) {
-    return Promise.all([
-      meshPolygonsVisibility.setMeshPolygonsVisibility(
-        id,
-        meshPolygonsVisibility.meshPolygonsVisibility(id),
-      ),
-      coloringStyle.setMeshPolygonsActiveColoring(id, coloringStyle.meshPolygonsActiveColoring(id)),
-    ]);
-  }
-
-  return {
-    ...meshPolygonsCommonStyle,
-    ...coloringStyle,
-    applyMeshPolygonsStyle,
-    ...meshPolygonsVisibility,
-  };
-}