@open-pioneer/selection 1.4.0 → 1.5.0-dev.20260910103330

package/ui/Selection.js

@@ -0,0 +1,97 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { createListCollection, VStack, Select, Portal } from '@chakra-ui/react';
+import { useMapModelValue } from '@open-pioneer/map';
+import { useCommonComponentProps } from '@open-pioneer/react-utils';
+import { useReactiveSnapshot } from '@open-pioneer/reactivity';
+import { useIntl } from '../_virtual/hooks.js';
+import { useMemo } from 'react';
+import { SelectionSourceItem } from './SelectionSourceItem.js';
+import { useSelectionSourceId } from './useSelectionSourceId.js';
+import { useSelectionViewModel } from './useSelectionViewModel.js';
+import { useSourceStatus } from './useSourceStatus.js';
+
+const Selection = (props) => {
+  const { sources, onSelectionComplete, onSelectionSourceChanged } = props;
+  const map = useMapModelValue(props);
+  const viewModel = useSelectionViewModel(
+    map,
+    sources,
+    onSelectionComplete,
+    onSelectionSourceChanged
+  );
+  return viewModel && /* @__PURE__ */ jsx(SelectionReady, { viewModel, ...props });
+};
+function SelectionReady(props) {
+  const { viewModel } = props;
+  const { containerProps } = useCommonComponentProps("selection", props);
+  const intl = useIntl();
+  const sources = useReactiveSnapshot(() => viewModel.sources, [viewModel]);
+  const currentSource = useReactiveSnapshot(() => viewModel.currentSource, [viewModel]);
+  const ariaMessage = useReactiveSnapshot(() => viewModel.ariaMessage, [viewModel]);
+  const getSourceId = useSelectionSourceId();
+  const sourceOptionsCollection = useMemo(
+    () => createListCollection({
+      items: sources,
+      isItemDisabled: () => {
+        return false;
+      },
+      itemToString: (item) => item.label,
+      itemToValue: (item) => getSourceId(item)
+    }),
+    [sources, getSourceId]
+  );
+  let triggerItem;
+  if (currentSource) {
+    triggerItem = /* @__PURE__ */ jsx(SelectionSourceItem, { source: currentSource });
+  } else {
+    triggerItem = null;
+  }
+  return /* @__PURE__ */ jsx(VStack, { ...containerProps, gap: 2, children: /* @__PURE__ */ jsxs(
+    Select.Root,
+    {
+      className: "selection-source",
+      collection: sourceOptionsCollection,
+      value: currentSource ? [getSourceId(currentSource)] : [],
+      onValueChange: (details) => {
+        const source = details.items[0];
+        if (source) {
+          viewModel.currentSource = source;
+        }
+      },
+      lazyMount: true,
+      unmountOnExit: true,
+      children: [
+        /* @__PURE__ */ jsx(Select.Label, { children: intl.formatMessage({ id: "selectSource" }) }),
+        /* @__PURE__ */ jsxs(Select.Control, { children: [
+          /* @__PURE__ */ jsx(Select.Trigger, { "aria-description": ariaMessage, children: /* @__PURE__ */ jsx(
+            Select.ValueText,
+            {
+              placeholder: intl.formatMessage({ id: "selectionPlaceholder" }),
+              children: triggerItem
+            }
+          ) }),
+          /* @__PURE__ */ jsx(Select.IndicatorGroup, { children: /* @__PURE__ */ jsx(Select.Indicator, {}) })
+        ] }),
+        /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, { children: /* @__PURE__ */ jsx(Select.Content, { className: "selection-source-options", children: sourceOptionsCollection.items.map((item) => /* @__PURE__ */ jsx(SelectionSourceItemContent, { source: item }, getSourceId(item))) }) }) })
+      ]
+    }
+  ) });
+}
+function SelectionSourceItemContent(props) {
+  const { source } = props;
+  const isDisabled = useSourceStatus(source).kind === "unavailable";
+  return /* @__PURE__ */ jsx(
+    Select.Item,
+    {
+      className: "selection-source-option",
+      item: source,
+      justifyContent: "flex-start",
+      pointerEvents: "auto",
+      "aria-disabled": isDisabled ? "true" : void 0,
+      children: /* @__PURE__ */ jsx(SelectionSourceItem, { source })
+    }
+  );
+}
+
+export { Selection };
+//# sourceMappingURL=Selection.js.map

package/ui/Selection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Selection.js","sources":["Selection.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\n\nimport { createListCollection, Portal, Select, VStack } from \"@chakra-ui/react\";\nimport { MapModelProps, useMapModelValue } from \"@open-pioneer/map\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport { useReactiveSnapshot } from \"@open-pioneer/reactivity\";\nimport { useIntl } from \"open-pioneer:react-hooks\";\nimport { FC, useMemo } from \"react\";\nimport { SelectionResult, SelectionSource } from \"../api\";\nimport { SelectionViewModel } from \"../model\";\nimport { SelectionSourceItem } from \"./SelectionSourceItem\";\nimport { useSelectionSourceId } from \"./useSelectionSourceId\";\nimport { useSelectionViewModel } from \"./useSelectionViewModel\";\nimport { useSourceStatus } from \"./useSourceStatus\";\n\n/**\n * Properties supported by the {@link Selection} component.\n */\nexport interface SelectionProps extends CommonComponentProps, MapModelProps {\n    /**\n     * Array of selection sources available for spatial selection.\n     */\n    sources: SelectionSource[];\n\n    /**\n     * This handler is called whenever the user has successfully selected\n     * some items.\n     */\n    onSelectionComplete?(event: SelectionCompleteEvent): void;\n\n    /**\n     * This handler is called whenever the user has changed the selected source\n     */\n    onSelectionSourceChanged?(event: SelectionSourceChangedEvent): void;\n}\n\nexport interface SelectionCompleteEvent {\n    /** The source that returned the {@link results}. */\n    source: SelectionSource;\n\n    /** Results selected by the user. */\n    results: SelectionResult[];\n}\n\nexport interface SelectionSourceChangedEvent {\n    /** The new selected source */\n    source: SelectionSource | undefined;\n}\n\n/**\n * A component that allows the user to perform a spatial selection on a given set of {@link SelectionSource}.\n */\nexport const Selection: FC<SelectionProps> = (props) => {\n    const { sources, onSelectionComplete, onSelectionSourceChanged } = props;\n    const map = useMapModelValue(props);\n    const viewModel = useSelectionViewModel(\n        map,\n        sources,\n        onSelectionComplete,\n        onSelectionSourceChanged\n    );\n    return viewModel && <SelectionReady viewModel={viewModel} {...props} />;\n};\n\nfunction SelectionReady(props: CommonComponentProps & { viewModel: SelectionViewModel }) {\n    const { viewModel } = props;\n    const { containerProps } = useCommonComponentProps(\"selection\", props);\n    const intl = useIntl();\n\n    // Subscribe to relevant view model state.\n    const sources = useReactiveSnapshot(() => viewModel.sources, [viewModel]);\n    const currentSource = useReactiveSnapshot(() => viewModel.currentSource, [viewModel]);\n    const ariaMessage = useReactiveSnapshot(() => viewModel.ariaMessage, [viewModel]);\n\n    // Translate sources array to a collection for chakra's select control.\n    const getSourceId = useSelectionSourceId();\n    const sourceOptionsCollection = useMemo(\n        () =>\n            createListCollection({\n                items: sources,\n                isItemDisabled: () => {\n                    return false;\n                },\n                itemToString: (item) => item.label,\n                itemToValue: (item) => getSourceId(item)\n            }),\n        [sources, getSourceId]\n    );\n\n    let triggerItem;\n    if (currentSource) {\n        triggerItem = <SelectionSourceItem source={currentSource} />;\n    } else {\n        triggerItem = null;\n    }\n\n    return (\n        <VStack {...containerProps} gap={2}>\n            <Select.Root\n                className=\"selection-source\"\n                collection={sourceOptionsCollection}\n                value={currentSource ? [getSourceId(currentSource)] : []}\n                onValueChange={(details) => {\n                    const source = details.items[0];\n                    if (source) {\n                        viewModel.currentSource = source;\n                    }\n                }}\n                lazyMount={true}\n                unmountOnExit={true}\n            >\n                <Select.Label>{intl.formatMessage({ id: \"selectSource\" })}</Select.Label>\n\n                <Select.Control>\n                    <Select.Trigger aria-description={ariaMessage}>\n                        <Select.ValueText\n                            placeholder={intl.formatMessage({ id: \"selectionPlaceholder\" })}\n                        >\n                            {triggerItem}\n                        </Select.ValueText>\n                    </Select.Trigger>\n                    <Select.IndicatorGroup>\n                        <Select.Indicator />\n                    </Select.IndicatorGroup>\n                </Select.Control>\n\n                <Portal>\n                    <Select.Positioner>\n                        <Select.Content className=\"selection-source-options\">\n                            {sourceOptionsCollection.items.map((item) => (\n                                <SelectionSourceItemContent source={item} key={getSourceId(item)} />\n                            ))}\n                        </Select.Content>\n                    </Select.Positioner>\n                </Portal>\n            </Select.Root>\n        </VStack>\n    );\n}\n\n/**\n * Renders a dropdown item in the menu.\n */\nfunction SelectionSourceItemContent(props: { source: SelectionSource }) {\n    const { source } = props;\n    const isDisabled = useSourceStatus(source).kind === \"unavailable\";\n    return (\n        <Select.Item\n            className=\"selection-source-option\"\n            item={source}\n            justifyContent=\"flex-start\"\n            // Override pointer-events: none rule for disabled items; we want to show the tooltip on hover\n            pointerEvents=\"auto\"\n            aria-disabled={isDisabled ? \"true\" : undefined}\n        >\n            <SelectionSourceItem source={source} />\n        </Select.Item>\n    );\n}\n"],"names":[],"mappings":"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"}

package/ui/SelectionSourceItem.d.ts

@@ -0,0 +1,7 @@
+import { SelectionSource } from "../api";
+/**
+ * Renders a selection source in the dropdown menu (option or current selection).
+ */
+export declare function SelectionSourceItem(props: {
+    source: SelectionSource | undefined;
+}): import("react").JSX.Element;

package/ui/SelectionSourceItem.js

@@ -0,0 +1,38 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Flex, Box, chakra, Icon } from '@chakra-ui/react';
+import { Tooltip } from '@open-pioneer/chakra-snippets/tooltip';
+import { useReactiveSnapshot } from '@open-pioneer/reactivity';
+import { LuTriangleAlert } from 'react-icons/lu';
+import { useSourceStatus } from './useSourceStatus.js';
+
+function SelectionSourceItem(props) {
+  const { source } = props;
+  const label = useReactiveSnapshot(() => source?.label, [source]);
+  const status = useSourceStatus(source);
+  const isAvailable = status.kind === "available";
+  const clazz = isAvailable ? "selection-source-value" : "selection-source-value selection-source-value--disabled";
+  return /* @__PURE__ */ jsxs(Flex, { className: clazz, direction: "row", alignItems: "center", grow: 1, children: [
+    label,
+    status.kind === "unavailable" && /* @__PURE__ */ jsx(Box, { ml: 2, children: /* @__PURE__ */ jsx(
+      Tooltip,
+      {
+        content: status.reason,
+        positioning: { placement: "right" },
+        openDelay: 500,
+        children: /* @__PURE__ */ jsx(chakra.span, { children: /* @__PURE__ */ jsx(
+          Icon,
+          {
+            color: "red",
+            className: "warning-icon",
+            "aria-label": status.reason,
+            "aria-hidden": void 0,
+            children: /* @__PURE__ */ jsx(LuTriangleAlert, {})
+          }
+        ) })
+      }
+    ) })
+  ] });
+}
+
+export { SelectionSourceItem };
+//# sourceMappingURL=SelectionSourceItem.js.map

package/ui/SelectionSourceItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionSourceItem.js","sources":["SelectionSourceItem.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\n\nimport { Box, chakra, Flex, Icon } from \"@chakra-ui/react\";\nimport { Tooltip } from \"@open-pioneer/chakra-snippets/tooltip\";\nimport { useReactiveSnapshot } from \"@open-pioneer/reactivity\";\nimport { LuTriangleAlert } from \"react-icons/lu\";\nimport { SelectionSource } from \"../api\";\nimport { useSourceStatus } from \"./useSourceStatus\";\n\n/**\n * Renders a selection source in the dropdown menu (option or current selection).\n */\nexport function SelectionSourceItem(props: { source: SelectionSource | undefined }) {\n    const { source } = props;\n    const label = useReactiveSnapshot(() => source?.label, [source]);\n    const status = useSourceStatus(source);\n    const isAvailable = status.kind === \"available\";\n    const clazz = isAvailable\n        ? \"selection-source-value\"\n        : \"selection-source-value selection-source-value--disabled\";\n\n    return (\n        <Flex className={clazz} direction=\"row\" alignItems=\"center\" grow={1}>\n            {label}\n            {status.kind === \"unavailable\" && (\n                <Box ml={2}>\n                    <Tooltip\n                        content={status.reason}\n                        positioning={{ placement: \"right\" }}\n                        openDelay={500}\n                    >\n                        <chakra.span>\n                            <Icon\n                                color=\"red\"\n                                className=\"warning-icon\"\n                                aria-label={status.reason}\n                                aria-hidden={undefined} // Overwrite icon default so the label gets read\n                            >\n                                <LuTriangleAlert />\n                            </Icon>\n                        </chakra.span>\n                    </Tooltip>\n                </Box>\n            )}\n        </Flex>\n    );\n}\n"],"names":[],"mappings":";;;;;;;AAaO,SAAS,oBAAoB,KAAA,EAAgD;AAChF,EAAA,MAAM,EAAE,QAAO,GAAI,KAAA;AACnB,EAAA,MAAM,QAAQ,mBAAA,CAAoB,MAAM,QAAQ,KAAA,EAAO,CAAC,MAAM,CAAC,CAAA;AAC/D,EAAA,MAAM,MAAA,GAAS,gBAAgB,MAAM,CAAA;AACrC,EAAA,MAAM,WAAA,GAAc,OAAO,IAAA,KAAS,WAAA;AACpC,EAAA,MAAM,KAAA,GAAQ,cACR,wBAAA,GACA,yDAAA;AAEN,EAAA,uBACI,IAAA,CAAC,QAAK,SAAA,EAAW,KAAA,EAAO,WAAU,KAAA,EAAM,UAAA,EAAW,QAAA,EAAS,IAAA,EAAM,CAAA,EAC7D,QAAA,EAAA;AAAA,IAAA,KAAA;AAAA,IACA,OAAO,IAAA,KAAS,aAAA,oBACb,GAAA,CAAC,GAAA,EAAA,EAAI,IAAI,CAAA,EACL,QAAA,kBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACG,SAAS,MAAA,CAAO,MAAA;AAAA,QAChB,WAAA,EAAa,EAAE,SAAA,EAAW,OAAA,EAAQ;AAAA,QAClC,SAAA,EAAW,GAAA;AAAA,QAEX,QAAA,kBAAA,GAAA,CAAC,MAAA,CAAO,IAAA,EAAP,EACG,QAAA,kBAAA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YACG,KAAA,EAAM,KAAA;AAAA,YACN,SAAA,EAAU,cAAA;AAAA,YACV,cAAY,MAAA,CAAO,MAAA;AAAA,YACnB,aAAA,EAAa,MAAA;AAAA,YAEb,8BAAC,eAAA,EAAA,EAAgB;AAAA;AAAA,SACrB,EACJ;AAAA;AAAA,KACJ,EACJ;AAAA,GAAA,EAER,CAAA;AAER;;;;"}

package/ui/useSelectionSourceId.d.ts

@@ -0,0 +1,9 @@
+import { SelectionSource } from "../api";
+export type GetSelectionSourceId = (selectionSource: SelectionSource) => string;
+/**
+ * Assigns unique IDs to selection sources.
+ *
+ * Sources that define their own {@link SelectionSource.id} keep that id;
+ * for all other sources an id is generated.
+ */
+export declare function useSelectionSourceId(): GetSelectionSourceId;

package/ui/useSelectionSourceId.js

@@ -0,0 +1,23 @@
+import { useRef, useCallback } from 'react';
+
+const GENERATED_ID_PREFIX = "__anon_source_";
+function useSelectionSourceId() {
+  const sourceIds = useRef(void 0);
+  const counter = useRef(0);
+  if (!sourceIds.current) {
+    sourceIds.current = /* @__PURE__ */ new WeakMap();
+  }
+  return useCallback((source) => {
+    if (source.id != null) {
+      return source.id;
+    }
+    const ids = sourceIds.current;
+    if (!ids.has(source)) {
+      ids.set(source, `${GENERATED_ID_PREFIX}${counter.current++}`);
+    }
+    return ids.get(source);
+  }, []);
+}
+
+export { useSelectionSourceId };
+//# sourceMappingURL=useSelectionSourceId.js.map

package/ui/useSelectionSourceId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectionSourceId.js","sources":["useSelectionSourceId.ts"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useCallback, useRef } from \"react\";\nimport { SelectionSource } from \"../api\";\n\nexport type GetSelectionSourceId = (selectionSource: SelectionSource) => string;\n\nconst GENERATED_ID_PREFIX = \"__anon_source_\";\n\n/**\n * Assigns unique IDs to selection sources.\n *\n * Sources that define their own {@link SelectionSource.id} keep that id;\n * for all other sources an id is generated.\n */\nexport function useSelectionSourceId(): GetSelectionSourceId {\n    const sourceIds = useRef<WeakMap<SelectionSource, string>>(undefined);\n    const counter = useRef(0);\n    // oxlint-disable-next-line react/refs\n    if (!sourceIds.current) {\n        sourceIds.current = new WeakMap();\n    }\n\n    return useCallback((source: SelectionSource) => {\n        if (source.id != null) {\n            return source.id;\n        }\n\n        // oxlint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const ids = sourceIds.current!;\n        if (!ids.has(source)) {\n            ids.set(source, `${GENERATED_ID_PREFIX}${counter.current++}`);\n        }\n        // oxlint-disable-next-line @typescript-eslint/no-non-null-assertion\n        return ids.get(source)!;\n    }, []);\n}\n"],"names":[],"mappings":";;AAQA,MAAM,mBAAA,GAAsB,gBAAA;AAQrB,SAAS,oBAAA,GAA6C;AACzD,EAAA,MAAM,SAAA,GAAY,OAAyC,MAAS,CAAA;AACpE,EAAA,MAAM,OAAA,GAAU,OAAO,CAAC,CAAA;AAExB,EAAA,IAAI,CAAC,UAAU,OAAA,EAAS;AACpB,IAAA,SAAA,CAAU,OAAA,uBAAc,OAAA,EAAQ;AAAA,EACpC;AAEA,EAAA,OAAO,WAAA,CAAY,CAAC,MAAA,KAA4B;AAC5C,IAAA,IAAI,MAAA,CAAO,MAAM,IAAA,EAAM;AACnB,MAAA,OAAO,MAAA,CAAO,EAAA;AAAA,IAClB;AAGA,IAAA,MAAM,MAAM,SAAA,CAAU,OAAA;AACtB,IAAA,IAAI,CAAC,GAAA,CAAI,GAAA,CAAI,MAAM,CAAA,EAAG;AAClB,MAAA,GAAA,CAAI,IAAI,MAAA,EAAQ,CAAA,EAAG,mBAAmB,CAAA,EAAG,OAAA,CAAQ,SAAS,CAAA,CAAE,CAAA;AAAA,IAChE;AAEA,IAAA,OAAO,GAAA,CAAI,IAAI,MAAM,CAAA;AAAA,EACzB,CAAA,EAAG,EAAE,CAAA;AACT;;;;"}

package/ui/useSelectionViewModel.d.ts

@@ -0,0 +1,11 @@
+import { MapModel } from "@open-pioneer/map";
+import { SelectionSource } from "../api";
+import { SelectionViewModel } from "../model";
+import { SelectionCompleteEvent, SelectionSourceChangedEvent } from "./Selection";
+/**
+ * Initializes the (internal) view model used by the selection component.
+ *
+ * The view model contains the primary widget state.
+ * It is a long lived instance that is updated in place when relevant react props are changed.
+ */
+export declare function useSelectionViewModel(map: MapModel, sources: SelectionSource[], onSelectionComplete: ((event: SelectionCompleteEvent) => void) | undefined, onSelectionSourceChanged: ((event: SelectionSourceChangedEvent) => void) | undefined): SelectionViewModel | undefined;

package/ui/useSelectionViewModel.js

@@ -0,0 +1,43 @@
+import { watchValue } from '@conterra/reactivity-core';
+import { useService } from '../_virtual/hooks.js';
+import { useEffectEvent, useState, useEffect } from 'react';
+
+function useSelectionViewModel(map, sources, onSelectionComplete, onSelectionSourceChanged) {
+  const viewModelFactory = useService("selection.ViewModelFactory");
+  const onComplete = useEffectEvent((source, results) => {
+    onSelectionComplete?.({ source, results });
+  });
+  const onChange = useEffectEvent((source) => {
+    onSelectionSourceChanged?.({ source });
+  });
+  const [viewModel, setViewModel] = useState();
+  useEffect(() => {
+    const vm = viewModelFactory.createViewModel({
+      map,
+      onSelectionComplete: onComplete
+    });
+    setViewModel(vm);
+    return () => {
+      setViewModel(void 0);
+      vm.destroy();
+    };
+  }, [viewModelFactory, map]);
+  useEffect(() => {
+    if (viewModel) {
+      viewModel.sources = sources;
+    }
+  }, [viewModel, sources]);
+  useEffect(() => {
+    if (!viewModel) {
+      return;
+    }
+    const handle = watchValue(() => viewModel.currentSource, onChange, {
+      immediate: true
+    });
+    return () => handle.destroy();
+  }, [viewModel]);
+  return viewModel;
+}
+
+export { useSelectionViewModel };
+//# sourceMappingURL=useSelectionViewModel.js.map

package/ui/useSelectionViewModel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectionViewModel.js","sources":["useSelectionViewModel.ts"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\n\nimport { watchValue } from \"@conterra/reactivity-core\";\nimport { MapModel } from \"@open-pioneer/map\";\nimport { useService } from \"open-pioneer:react-hooks\";\nimport { useEffect, useEffectEvent, useState } from \"react\";\nimport { SelectionResult, SelectionSource } from \"../api\";\nimport { SelectionViewModel } from \"../model\";\nimport { SelectionViewModelFactory } from \"../services\";\nimport { SelectionCompleteEvent, SelectionSourceChangedEvent } from \"./Selection\";\n\n/**\n * Initializes the (internal) view model used by the selection component.\n *\n * The view model contains the primary widget state.\n * It is a long lived instance that is updated in place when relevant react props are changed.\n */\nexport function useSelectionViewModel(\n    map: MapModel,\n    sources: SelectionSource[],\n    onSelectionComplete: ((event: SelectionCompleteEvent) => void) | undefined,\n    onSelectionSourceChanged: ((event: SelectionSourceChangedEvent) => void) | undefined\n): SelectionViewModel | undefined {\n    const viewModelFactory = useService<SelectionViewModelFactory>(\"selection.ViewModelFactory\");\n    const onComplete = useEffectEvent((source: SelectionSource, results: SelectionResult[]) => {\n        onSelectionComplete?.({ source, results });\n    });\n    const onChange = useEffectEvent((source: SelectionSource | undefined) => {\n        onSelectionSourceChanged?.({ source });\n    });\n\n    // Construct view model\n    const [viewModel, setViewModel] = useState<SelectionViewModel>();\n    useEffect(() => {\n        const vm = viewModelFactory.createViewModel({\n            map,\n            onSelectionComplete: onComplete\n        });\n\n        setViewModel(vm);\n        return () => {\n            setViewModel(undefined);\n            vm.destroy();\n        };\n    }, [viewModelFactory, map]);\n\n    // Sync sources --> view model\n    useEffect(() => {\n        if (viewModel) {\n            viewModel.sources = sources;\n        }\n    }, [viewModel, sources]);\n\n    // Sync current source --> react callbacks\n    useEffect(() => {\n        if (!viewModel) {\n            return;\n        }\n\n        const handle = watchValue(() => viewModel.currentSource, onChange, {\n            immediate: true\n        });\n        return () => handle.destroy();\n    }, [viewModel]);\n\n    return viewModel;\n}\n"],"names":[],"mappings":";;;;AAkBO,SAAS,qBAAA,CACZ,GAAA,EACA,OAAA,EACA,mBAAA,EACA,wBAAA,EAC8B;AAC9B,EAAA,MAAM,gBAAA,GAAmB,WAAsC,4BAA4B,CAAA;AAC3F,EAAA,MAAM,UAAA,GAAa,cAAA,CAAe,CAAC,MAAA,EAAyB,OAAA,KAA+B;AACvF,IAAA,mBAAA,GAAsB,EAAE,MAAA,EAAQ,OAAA,EAAS,CAAA;AAAA,EAC7C,CAAC,CAAA;AACD,EAAA,MAAM,QAAA,GAAW,cAAA,CAAe,CAAC,MAAA,KAAwC;AACrE,IAAA,wBAAA,GAA2B,EAAE,QAAQ,CAAA;AAAA,EACzC,CAAC,CAAA;AAGD,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,QAAA,EAA6B;AAC/D,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,MAAM,EAAA,GAAK,iBAAiB,eAAA,CAAgB;AAAA,MACxC,GAAA;AAAA,MACA,mBAAA,EAAqB;AAAA,KACxB,CAAA;AAED,IAAA,YAAA,CAAa,EAAE,CAAA;AACf,IAAA,OAAO,MAAM;AACT,MAAA,YAAA,CAAa,MAAS,CAAA;AACtB,MAAA,EAAA,CAAG,OAAA,EAAQ;AAAA,IACf,CAAA;AAAA,EACJ,CAAA,EAAG,CAAC,gBAAA,EAAkB,GAAG,CAAC,CAAA;AAG1B,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,IAAI,SAAA,EAAW;AACX,MAAA,SAAA,CAAU,OAAA,GAAU,OAAA;AAAA,IACxB;AAAA,EACJ,CAAA,EAAG,CAAC,SAAA,EAAW,OAAO,CAAC,CAAA;AAGvB,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,IAAI,CAAC,SAAA,EAAW;AACZ,MAAA;AAAA,IACJ;AAEA,IAAA,MAAM,MAAA,GAAS,UAAA,CAAW,MAAM,SAAA,CAAU,eAAe,QAAA,EAAU;AAAA,MAC/D,SAAA,EAAW;AAAA,KACd,CAAA;AACD,IAAA,OAAO,MAAM,OAAO,OAAA,EAAQ;AAAA,EAChC,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAA,OAAO,SAAA;AACX;;;;"}

package/ui/useSourceStatus.d.ts

@@ -0,0 +1,8 @@
+import { SelectionSource } from "../api";
+export type SimpleStatus = {
+    kind: "available";
+} | {
+    kind: "unavailable";
+    reason: string;
+};
+export declare function useSourceStatus(source: SelectionSource | undefined): SimpleStatus;

package/ui/useSourceStatus.js

@@ -0,0 +1,27 @@
+import { useReactiveSnapshot } from '@open-pioneer/reactivity';
+import { useIntl } from '../_virtual/hooks.js';
+import { getSourceStatus } from '../model/SelectionViewModel.js';
+
+function useSourceStatus(source) {
+  const intl = useIntl();
+  const sourceStatus = useReactiveSnapshot(() => {
+    if (!source) {
+      return {
+        kind: "unavailable",
+        reason: intl.formatMessage({ id: "sourceNotAvailable" })
+      };
+    }
+    const status = getSourceStatus(source);
+    if (status.kind === "available") {
+      return status;
+    }
+    return {
+      kind: "unavailable",
+      reason: status.reason ?? intl.formatMessage({ id: "sourceNotAvailable" })
+    };
+  }, [source, intl]);
+  return sourceStatus;
+}
+
+export { useSourceStatus };
+//# sourceMappingURL=useSourceStatus.js.map

package/ui/useSourceStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSourceStatus.js","sources":["useSourceStatus.ts"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useReactiveSnapshot } from \"@open-pioneer/reactivity\";\nimport { useIntl } from \"open-pioneer:react-hooks\";\nimport { SelectionSource } from \"../api\";\nimport { getSourceStatus } from \"../model\";\n\nexport type SimpleStatus =\n    | {\n          kind: \"available\";\n      }\n    | {\n          kind: \"unavailable\";\n          reason: string;\n      };\n\nexport function useSourceStatus(source: SelectionSource | undefined): SimpleStatus {\n    const intl = useIntl();\n    const sourceStatus = useReactiveSnapshot((): SimpleStatus => {\n        if (!source) {\n            return {\n                kind: \"unavailable\",\n                reason: intl.formatMessage({ id: \"sourceNotAvailable\" })\n            };\n        }\n\n        const status = getSourceStatus(source);\n        if (status.kind === \"available\") {\n            return status;\n        }\n        return {\n            kind: \"unavailable\",\n            reason: status.reason ?? intl.formatMessage({ id: \"sourceNotAvailable\" })\n        };\n    }, [source, intl]);\n    return sourceStatus;\n}\n"],"names":[],"mappings":";;;;AAiBO,SAAS,gBAAgB,MAAA,EAAmD;AAC/E,EAAA,MAAM,OAAO,OAAA,EAAQ;AACrB,EAAA,MAAM,YAAA,GAAe,oBAAoB,MAAoB;AACzD,IAAA,IAAI,CAAC,MAAA,EAAQ;AACT,MAAA,OAAO;AAAA,QACH,IAAA,EAAM,aAAA;AAAA,QACN,QAAQ,IAAA,CAAK,aAAA,CAAc,EAAE,EAAA,EAAI,sBAAsB;AAAA,OAC3D;AAAA,IACJ;AAEA,IAAA,MAAM,MAAA,GAAS,gBAAgB,MAAM,CAAA;AACrC,IAAA,IAAI,MAAA,CAAO,SAAS,WAAA,EAAa;AAC7B,MAAA,OAAO,MAAA;AAAA,IACX;AACA,IAAA,OAAO;AAAA,MACH,IAAA,EAAM,aAAA;AAAA,MACN,MAAA,EAAQ,OAAO,MAAA,IAAU,IAAA,CAAK,cAAc,EAAE,EAAA,EAAI,sBAAsB;AAAA,KAC5E;AAAA,EACJ,CAAA,EAAG,CAAC,MAAA,EAAQ,IAAI,CAAC,CAAA;AACjB,EAAA,OAAO,YAAA;AACX;;;;"}

package/DragController.d.ts

@@ -1,33 +0,0 @@
-import { Resource } from "@open-pioneer/core";
-import { MapModel } from "@open-pioneer/map";
-import Geometry from "ol/geom/Geometry";
-import PointerInteraction from "ol/interaction/Pointer";
-import OlMap from "ol/Map";
-interface InteractionResource extends Resource {
-    interaction: PointerInteraction;
-}
-export declare class DragController {
-    #private;
-    constructor(map: MapModel, tooltipMessage: string, tooltipDisabledMessage: string, onExtentSelected: (geometry: Geometry) => void);
-    initViewport(olMap: OlMap): HTMLElement;
-    /**
-     * Method for destroying the controller when it is no longer needed
-     */
-    destroy(): void;
-    /**
-     * The current tooltip text shown to the user.
-     */
-    get tooltipText(): string;
-    setActive(isActive: boolean): void;
-    /**
-     * Method for testing purposes only
-     * @returns InteractionResource of class DragBox
-     */
-    getDragboxInteraction(): InteractionResource | undefined;
-    /**
-     * Method for testing purposes only
-     * @returns InteractionResource of class DragPan
-     */
-    getDragPanInteraction(): InteractionResource | undefined;
-}
-export {};

package/DragController.js

@@ -1,175 +0,0 @@
-import { reactive, watch } from '@conterra/reactivity-core';
-import { mouseActionButton } from 'ol/events/condition.js';
-import { DragBox, DragPan } from 'ol/interaction.js';
-import { createElement } from 'react';
-import { SelectionTooltipContent } from './SelectionTooltipContent.js';
-
-const ACTIVE_CLASS = "selection-active";
-const INACTIVE_CLASS = "selection-inactive";
-class DragController {
-  #tooltip;
-  #interactionResources = [];
-  #olMap;
-  #isActive = reactive(true);
-  #tooltipMessage;
-  #tooltipDisabledMessage;
-  #tooltipSync;
-  constructor(map, tooltipMessage, tooltipDisabledMessage, onExtentSelected) {
-    this.#olMap = map.olMap;
-    const viewPort = this.initViewport(this.#olMap);
-    this.#interactionResources.push(
-      this.#createDragBox(this.#olMap, onExtentSelected, viewPort, this.#interactionResources)
-    );
-    this.#interactionResources.push(
-      this.#createDrag(this.#olMap, viewPort, this.#interactionResources)
-    );
-    this.#tooltip = this.#createHelpTooltip(map, tooltipMessage);
-    this.#tooltipMessage = tooltipMessage;
-    this.#tooltipDisabledMessage = tooltipDisabledMessage;
-    this.#tooltipSync = watch(
-      () => [this.#isActive.value, this.tooltipText],
-      ([isActive, tooltipText]) => {
-        const tooltipContent = createElement(SelectionTooltipContent, {
-          content: tooltipText
-        });
-        this.#tooltip.setContent(tooltipContent);
-        viewPort.classList.toggle(ACTIVE_CLASS, isActive);
-        viewPort.classList.toggle(INACTIVE_CLASS, !isActive);
-      },
-      {
-        immediate: true
-      }
-    );
-  }
-  initViewport(olMap) {
-    const viewPort = olMap.getViewport();
-    viewPort.classList.add(ACTIVE_CLASS);
-    viewPort.oncontextmenu = (e) => {
-      e.preventDefault();
-      return false;
-    };
-    return viewPort;
-  }
-  /**
-   * Method for destroying the controller when it is no longer needed
-   */
-  destroy() {
-    this.#tooltipSync?.destroy();
-    this.#tooltipSync = void 0;
-    this.#tooltip.destroy();
-    this.#interactionResources.forEach((interaction) => {
-      interaction.destroy();
-    });
-  }
-  /**
-   * The current tooltip text shown to the user.
-   */
-  get tooltipText() {
-    const isActive = this.#isActive.value;
-    return isActive ? this.#tooltipMessage : this.#tooltipDisabledMessage;
-  }
-  setActive(isActive) {
-    if (this.#isActive.value === isActive) {
-      return;
-    }
-    if (isActive) {
-      this.#interactionResources.forEach(
-        (interaction) => this.#olMap.addInteraction(interaction.interaction)
-      );
-      this.#isActive.value = true;
-    } else {
-      this.#interactionResources.forEach(
-        (interaction) => this.#olMap.removeInteraction(interaction.interaction)
-      );
-      this.#isActive.value = false;
-    }
-  }
-  /**
-   * Method to create a simple extent-selection
-   */
-  #createDragBox(olMap, onExtentSelected, viewPort, interactionResources) {
-    const dragBox = new DragBox({
-      className: "selection-drag-box",
-      condition: mouseActionButton
-    });
-    olMap.addInteraction(dragBox);
-    dragBox.on("boxend", function() {
-      onExtentSelected(dragBox.getGeometry());
-    });
-    const interactionResource = {
-      interaction: dragBox,
-      destroy() {
-        olMap.removeInteraction(dragBox);
-        interactionResources.splice(interactionResources.indexOf(this));
-        dragBox.dispose();
-        viewPort.classList.remove(ACTIVE_CLASS);
-        viewPort.classList.remove(INACTIVE_CLASS);
-        viewPort.oncontextmenu = null;
-      }
-    };
-    return interactionResource;
-  }
-  /**
-   * Method to activate pan with right-mouse-click
-   */
-  #createDrag(olMap, viewPort, interactionResources) {
-    const condition = function(mapBrowserEvent) {
-      const originalEvent = mapBrowserEvent.originalEvent;
-      return "button" in originalEvent && originalEvent.button == 2;
-    };
-    const drag = new DragPan({
-      condition
-    });
-    olMap.addInteraction(drag);
-    const interactionResource = {
-      interaction: drag,
-      destroy() {
-        olMap.removeInteraction(drag);
-        interactionResources.splice(interactionResources.indexOf(this));
-        drag.dispose();
-        viewPort.classList.remove(ACTIVE_CLASS);
-        viewPort.classList.remove(INACTIVE_CLASS);
-        viewPort.oncontextmenu = null;
-      }
-    };
-    return interactionResource;
-  }
-  /**
-   * Method to generate a tooltip on the mouse cursor
-   */
-  #createHelpTooltip(map, message) {
-    const tooltipContent = createElement(SelectionTooltipContent, {
-      content: message
-    });
-    const tooltipOverlay = map.overlays.add({
-      content: tooltipContent,
-      position: "follow-pointer",
-      offset: [15, 0],
-      positioning: "center-left",
-      ariaRole: "tooltip",
-      className: "selection-tooltip printing-hide"
-    });
-    return tooltipOverlay;
-  }
-  /**
-   * Method for testing purposes only
-   * @returns InteractionResource of class DragBox
-   */
-  getDragboxInteraction() {
-    return this.#interactionResources.find(
-      (interactionResource) => interactionResource.interaction instanceof DragBox
-    );
-  }
-  /**
-   * Method for testing purposes only
-   * @returns InteractionResource of class DragPan
-   */
-  getDragPanInteraction() {
-    return this.#interactionResources.find(
-      (interactionResource) => interactionResource.interaction instanceof DragPan
-    );
-  }
-}
-
-export { DragController };
-//# sourceMappingURL=DragController.js.map

package/DragController.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DragController.js","sources":["DragController.ts"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\n\nimport { reactive, watch } from \"@conterra/reactivity-core\";\nimport { Resource } from \"@open-pioneer/core\";\nimport { MapModel, Overlay } from \"@open-pioneer/map\";\nimport { MapBrowserEvent } from \"ol\";\nimport { mouseActionButton } from \"ol/events/condition\";\nimport Geometry from \"ol/geom/Geometry\";\nimport { DragBox, DragPan } from \"ol/interaction\";\nimport PointerInteraction from \"ol/interaction/Pointer\";\nimport OlMap from \"ol/Map\";\nimport { createElement } from \"react\";\nimport { SelectionTooltipContent } from \"./SelectionTooltipContent\";\n\ninterface InteractionResource extends Resource {\n    interaction: PointerInteraction;\n}\n\nconst ACTIVE_CLASS = \"selection-active\";\nconst INACTIVE_CLASS = \"selection-inactive\";\n\nexport class DragController {\n    #tooltip: Overlay;\n    #interactionResources: InteractionResource[] = [];\n    #olMap: OlMap;\n    #isActive = reactive(true);\n    #tooltipMessage: string;\n    #tooltipDisabledMessage: string;\n    #tooltipSync: Resource | undefined;\n\n    constructor(\n        map: MapModel,\n        tooltipMessage: string,\n        tooltipDisabledMessage: string,\n        onExtentSelected: (geometry: Geometry) => void\n    ) {\n        this.#olMap = map.olMap;\n        const viewPort = this.initViewport(this.#olMap);\n        this.#interactionResources.push(\n            this.#createDragBox(this.#olMap, onExtentSelected, viewPort, this.#interactionResources)\n        );\n        this.#interactionResources.push(\n            this.#createDrag(this.#olMap, viewPort, this.#interactionResources)\n        );\n\n        this.#tooltip = this.#createHelpTooltip(map, tooltipMessage);\n        this.#tooltipMessage = tooltipMessage;\n        this.#tooltipDisabledMessage = tooltipDisabledMessage;\n\n        this.#tooltipSync = watch(\n            () => [this.#isActive.value, this.tooltipText],\n            ([isActive, tooltipText]) => {\n                const tooltipContent = createElement(SelectionTooltipContent, {\n                    content: tooltipText\n                });\n                this.#tooltip.setContent(tooltipContent);\n                viewPort.classList.toggle(ACTIVE_CLASS, isActive);\n                viewPort.classList.toggle(INACTIVE_CLASS, !isActive);\n            },\n            {\n                immediate: true\n            }\n        );\n    }\n\n    initViewport(olMap: OlMap) {\n        const viewPort = olMap.getViewport();\n        viewPort.classList.add(ACTIVE_CLASS);\n\n        viewPort.oncontextmenu = (e) => {\n            e.preventDefault();\n            return false;\n        };\n        return viewPort;\n    }\n\n    /**\n     * Method for destroying the controller when it is no longer needed\n     */\n    destroy() {\n        this.#tooltipSync?.destroy();\n        this.#tooltipSync = undefined;\n\n        this.#tooltip.destroy();\n        this.#interactionResources.forEach((interaction) => {\n            interaction.destroy();\n        });\n    }\n\n    /**\n     * The current tooltip text shown to the user.\n     */\n    get tooltipText(): string {\n        const isActive = this.#isActive.value;\n        return isActive ? this.#tooltipMessage : this.#tooltipDisabledMessage;\n    }\n\n    setActive(isActive: boolean) {\n        if (this.#isActive.value === isActive) {\n            return;\n        }\n\n        if (isActive) {\n            this.#interactionResources.forEach((interaction) =>\n                this.#olMap.addInteraction(interaction.interaction)\n            );\n            this.#isActive.value = true;\n        } else {\n            this.#interactionResources.forEach((interaction) =>\n                this.#olMap.removeInteraction(interaction.interaction)\n            );\n            this.#isActive.value = false;\n        }\n    }\n\n    /**\n     * Method to create a simple extent-selection\n     */\n    #createDragBox(\n        olMap: OlMap,\n        onExtentSelected: (geometry: Geometry) => void,\n        viewPort: HTMLElement,\n        interactionResources: InteractionResource[]\n    ): InteractionResource {\n        const dragBox = new DragBox({\n            className: \"selection-drag-box\",\n            condition: mouseActionButton\n        });\n\n        olMap.addInteraction(dragBox);\n        dragBox.on(\"boxend\", function () {\n            onExtentSelected(dragBox.getGeometry());\n        });\n\n        const interactionResource: InteractionResource = {\n            interaction: dragBox,\n            destroy() {\n                olMap.removeInteraction(dragBox);\n                interactionResources.splice(interactionResources.indexOf(this));\n                dragBox.dispose();\n                viewPort.classList.remove(ACTIVE_CLASS);\n                viewPort.classList.remove(INACTIVE_CLASS);\n                viewPort.oncontextmenu = null;\n            }\n        };\n        return interactionResource;\n    }\n\n    /**\n     * Method to activate pan with right-mouse-click\n     */\n    #createDrag(\n        olMap: OlMap,\n        viewPort: HTMLElement,\n        interactionResources: InteractionResource[]\n    ): InteractionResource {\n        const condition = function (mapBrowserEvent: MapBrowserEvent) {\n            const originalEvent = mapBrowserEvent.originalEvent;\n            return \"button\" in originalEvent && originalEvent.button == 2;\n        };\n        const drag = new DragPan({\n            condition: condition\n        });\n\n        olMap.addInteraction(drag);\n\n        const interactionResource: InteractionResource = {\n            interaction: drag,\n            destroy() {\n                olMap.removeInteraction(drag);\n                interactionResources.splice(interactionResources.indexOf(this));\n                drag.dispose();\n                viewPort.classList.remove(ACTIVE_CLASS);\n                viewPort.classList.remove(INACTIVE_CLASS);\n                viewPort.oncontextmenu = null;\n            }\n        };\n\n        return interactionResource;\n    }\n\n    /**\n     * Method to generate a tooltip on the mouse cursor\n     */\n    #createHelpTooltip(map: MapModel, message: string): Overlay {\n        const tooltipContent = createElement(SelectionTooltipContent, {\n            content: message\n        });\n        const tooltipOverlay = map.overlays.add({\n            content: tooltipContent,\n            position: \"follow-pointer\",\n            offset: [15, 0],\n            positioning: \"center-left\",\n            ariaRole: \"tooltip\",\n            className: \"selection-tooltip printing-hide\"\n        });\n\n        return tooltipOverlay;\n    }\n\n    /**\n     * Method for testing purposes only\n     * @returns InteractionResource of class DragBox\n     */\n    getDragboxInteraction() {\n        return this.#interactionResources.find(\n            (interactionResource) => interactionResource.interaction instanceof DragBox\n        );\n    }\n\n    /**\n     * Method for testing purposes only\n     * @returns InteractionResource of class DragPan\n     */\n    getDragPanInteraction() {\n        return this.#interactionResources.find(\n            (interactionResource) => interactionResource.interaction instanceof DragPan\n        );\n    }\n}\n"],"names":[],"mappings":"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"}