@open-pioneer/toc 0.8.0 → 0.9.0-dev.20250220091855

package/Toc.js

@@ -1,80 +0,0 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { BasemapSwitcher } from '@open-pioneer/basemap-switcher';
-import { Box, Flex, Text, Spacer } from '@open-pioneer/chakra-integration';
-import { useMapModel } from '@open-pioneer/map';
-import { useCommonComponentProps, TitledSection, SectionHeading } from '@open-pioneer/react-utils';
-import { useIntl } from './_virtual/_virtual-pioneer-module_react-hooks.js';
-import { useId, useMemo } from 'react';
-import { TocWidgetOptionsProvider } from './Context.js';
-import { LayerList } from './LayerList.js';
-import { Tools } from './Tools.js';
-
-const PADDING = 2;
-const Toc = (props) => {
-  const intl = useIntl();
-  const {
-    showTools = false,
-    toolsConfig,
-    showBasemapSwitcher = true,
-    basemapSwitcherProps,
-    autoShowParents = true
-  } = props;
-  const { containerProps } = useCommonComponentProps("toc", props);
-  const basemapsHeadingId = useId();
-  const options = useMemo(() => ({ autoShowParents }), [autoShowParents]);
-  const state = useMapModel(props);
-  let content;
-  switch (state.kind) {
-    case "loading":
-      content = null;
-      break;
-    case "rejected":
-      content = /* @__PURE__ */ jsx(Text, { className: "toc-error", children: intl.formatMessage({ id: "error" }) });
-      break;
-    case "resolved": {
-      const map = state.map;
-      const basemapSwitcher = showBasemapSwitcher && /* @__PURE__ */ jsx(Box, { className: "toc-basemap-switcher", children: /* @__PURE__ */ jsx(
-        TitledSection,
-        {
-          title: /* @__PURE__ */ jsx(SectionHeading, { id: basemapsHeadingId, size: "sm", mb: PADDING, children: intl.formatMessage({ id: "basemapsLabel" }) }),
-          children: /* @__PURE__ */ jsx(
-            BasemapSwitcher,
-            {
-              map,
-              "aria-labelledby": basemapsHeadingId,
-              ...basemapSwitcherProps
-            }
-          )
-        }
-      ) });
-      const layerList = /* @__PURE__ */ jsx(Box, { className: "toc-operational-layers", children: /* @__PURE__ */ jsx(
-        TitledSection,
-        {
-          title: /* @__PURE__ */ jsx(SectionHeading, { size: "sm", mb: 2, children: /* @__PURE__ */ jsxs(Flex, { children: [
-            /* @__PURE__ */ jsx(Text, { my: 3, children: intl.formatMessage({
-              id: "operationalLayerLabel"
-            }) }),
-            /* @__PURE__ */ jsx(Spacer, {}),
-            showTools && /* @__PURE__ */ jsx(Tools, { map, ...toolsConfig })
-          ] }) }),
-          children: /* @__PURE__ */ jsx(
-            LayerList,
-            {
-              map,
-              "aria-label": intl.formatMessage({ id: "operationalLayerLabel" })
-            }
-          )
-        }
-      ) });
-      content = /* @__PURE__ */ jsxs(Fragment, { children: [
-        basemapSwitcher,
-        layerList
-      ] });
-      break;
-    }
-  }
-  return /* @__PURE__ */ jsx(Flex, { ...containerProps, direction: "column", gap: PADDING, children: /* @__PURE__ */ jsx(TocWidgetOptionsProvider, { value: options, children: content }) });
-};
-
-export { Toc };
-//# sourceMappingURL=Toc.js.map

package/Toc.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Toc.js","sources":["Toc.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { BasemapSwitcher, BasemapSwitcherProps } from \"@open-pioneer/basemap-switcher\";\nimport { Box, Flex, Spacer, Text } from \"@open-pioneer/chakra-integration\";\nimport { MapModelProps, useMapModel } from \"@open-pioneer/map\";\nimport {\n    CommonComponentProps,\n    SectionHeading,\n    TitledSection,\n    useCommonComponentProps\n} from \"@open-pioneer/react-utils\";\nimport { useIntl } from \"open-pioneer:react-hooks\";\nimport { FC, useId, useMemo } from \"react\";\nimport { TocWidgetOptions, TocWidgetOptionsProvider } from \"./Context\";\nimport { LayerList } from \"./LayerList\";\nimport { Tools } from \"./Tools\";\n\n/**\n * Props supported by the {@link Toc} component.\n */\nexport interface TocProps extends CommonComponentProps, MapModelProps {\n    /**\n     * Defines whether the tool component is shown in the toc.\n     * Defaults to `false`.\n     */\n    showTools?: boolean;\n\n    /**\n     * Properties for the embedded tool component.\n     */\n    toolsConfig?: ToolsConfig;\n\n    /**\n     * Defines whether the basemap switcher is shown in the toc.\n     * Defaults to `true`.\n     */\n    showBasemapSwitcher?: boolean;\n\n    /**\n     * Properties for the embedded basemap switcher.\n     * Property \"mapId\" is not applied.\n     */\n    basemapSwitcherProps?: Omit<BasemapSwitcherProps, \"mapId\">;\n\n    /**\n     * Show the parent layers when a child layer is made visible.\n     * Defaults to `true`.\n     */\n    autoShowParents?: boolean;\n}\n\n/**\n * Props supported by the {@link Tools} component.\n */\nexport interface ToolsConfig {\n    /**\n     * Optional property to show the `hide all layers` entry.\n     * Defaults to `true`.\n     */\n    showHideAllLayers?: boolean;\n}\n\nconst PADDING = 2;\n\n/**\n * Displays the layers of the configured map.\n */\nexport const Toc: FC<TocProps> = (props: TocProps) => {\n    const intl = useIntl();\n    const {\n        showTools = false,\n        toolsConfig,\n        showBasemapSwitcher = true,\n        basemapSwitcherProps,\n        autoShowParents = true\n    } = props;\n    const { containerProps } = useCommonComponentProps(\"toc\", props);\n    const basemapsHeadingId = useId();\n    const options = useMemo((): TocWidgetOptions => ({ autoShowParents }), [autoShowParents]);\n    const state = useMapModel(props);\n\n    let content: JSX.Element | null;\n    switch (state.kind) {\n        case \"loading\":\n            content = null;\n            break;\n        case \"rejected\":\n            content = <Text className=\"toc-error\">{intl.formatMessage({ id: \"error\" })}</Text>;\n            break;\n        case \"resolved\": {\n            const map = state.map;\n            const basemapSwitcher = showBasemapSwitcher && (\n                <Box className=\"toc-basemap-switcher\">\n                    <TitledSection\n                        title={\n                            <SectionHeading id={basemapsHeadingId} size={\"sm\"} mb={PADDING}>\n                                {intl.formatMessage({ id: \"basemapsLabel\" })}\n                            </SectionHeading>\n                        }\n                    >\n                        <BasemapSwitcher\n                            map={map}\n                            aria-labelledby={basemapsHeadingId}\n                            {...basemapSwitcherProps}\n                        />\n                    </TitledSection>\n                </Box>\n            );\n            const layerList = (\n                <Box className=\"toc-operational-layers\">\n                    <TitledSection\n                        title={\n                            <SectionHeading size={\"sm\"} mb={2}>\n                                <Flex>\n                                    <Text my={3}>\n                                        {intl.formatMessage({\n                                            id: \"operationalLayerLabel\"\n                                        })}\n                                    </Text>\n                                    <Spacer />\n                                    {showTools && <Tools map={map} {...toolsConfig} />}\n                                </Flex>\n                            </SectionHeading>\n                        }\n                    >\n                        <LayerList\n                            map={map}\n                            aria-label={intl.formatMessage({ id: \"operationalLayerLabel\" })}\n                        />\n                    </TitledSection>\n                </Box>\n            );\n\n            content = (\n                <>\n                    {basemapSwitcher}\n                    {layerList}\n                </>\n            );\n            break;\n        }\n    }\n\n    return (\n        <Flex {...containerProps} direction=\"column\" gap={PADDING}>\n            <TocWidgetOptionsProvider value={options}>{content}</TocWidgetOptionsProvider>\n        </Flex>\n    );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AA8DA,MAAM,OAAU,GAAA,CAAA,CAAA;AAKH,MAAA,GAAA,GAAoB,CAAC,KAAoB,KAAA;AAClD,EAAA,MAAM,OAAO,OAAQ,EAAA,CAAA;AACrB,EAAM,MAAA;AAAA,IACF,SAAY,GAAA,KAAA;AAAA,IACZ,WAAA;AAAA,IACA,mBAAsB,GAAA,IAAA;AAAA,IACtB,oBAAA;AAAA,IACA,eAAkB,GAAA,IAAA;AAAA,GAClB,GAAA,KAAA,CAAA;AACJ,EAAA,MAAM,EAAE,cAAA,EAAmB,GAAA,uBAAA,CAAwB,OAAO,KAAK,CAAA,CAAA;AAC/D,EAAA,MAAM,oBAAoB,KAAM,EAAA,CAAA;AAChC,EAAM,MAAA,OAAA,GAAU,QAAQ,OAAyB,EAAE,iBAAoB,CAAA,EAAA,CAAC,eAAe,CAAC,CAAA,CAAA;AACxF,EAAM,MAAA,KAAA,GAAQ,YAAY,KAAK,CAAA,CAAA;AAE/B,EAAI,IAAA,OAAA,CAAA;AACJ,EAAA,QAAQ,MAAM,IAAM;AAAA,IAChB,KAAK,SAAA;AACD,MAAU,OAAA,GAAA,IAAA,CAAA;AACV,MAAA,MAAA;AAAA,IACJ,KAAK,UAAA;AACD,MAAU,OAAA,mBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAU,WAAa,EAAA,QAAA,EAAA,IAAA,CAAK,cAAc,EAAE,EAAA,EAAI,OAAQ,EAAC,CAAE,EAAA,CAAA,CAAA;AAC3E,MAAA,MAAA;AAAA,IACJ,KAAK,UAAY,EAAA;AACb,MAAA,MAAM,MAAM,KAAM,CAAA,GAAA,CAAA;AAClB,MAAA,MAAM,eAAkB,GAAA,mBAAA,oBACnB,GAAA,CAAA,GAAA,EAAA,EAAI,WAAU,sBACX,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,aAAA;AAAA,QAAA;AAAA,UACG,KACI,kBAAA,GAAA,CAAC,cAAe,EAAA,EAAA,EAAA,EAAI,mBAAmB,IAAM,EAAA,IAAA,EAAM,EAAI,EAAA,OAAA,EAClD,eAAK,aAAc,CAAA,EAAE,EAAI,EAAA,eAAA,EAAiB,CAC/C,EAAA,CAAA;AAAA,UAGJ,QAAA,kBAAA,GAAA;AAAA,YAAC,eAAA;AAAA,YAAA;AAAA,cACG,GAAA;AAAA,cACA,iBAAiB,EAAA,iBAAA;AAAA,cAChB,GAAG,oBAAA;AAAA,aAAA;AAAA,WACR;AAAA,SAAA;AAAA,OAER,EAAA,CAAA,CAAA;AAEJ,MAAA,MAAM,SACF,mBAAA,GAAA,CAAC,GAAI,EAAA,EAAA,SAAA,EAAU,wBACX,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,aAAA;AAAA,QAAA;AAAA,UACG,KAAA,sBACK,cAAe,EAAA,EAAA,IAAA,EAAM,MAAM,EAAI,EAAA,CAAA,EAC5B,+BAAC,IACG,EAAA,EAAA,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,IAAK,EAAA,EAAA,EAAA,EAAI,CACL,EAAA,QAAA,EAAA,IAAA,CAAK,aAAc,CAAA;AAAA,cAChB,EAAI,EAAA,uBAAA;AAAA,aACP,CACL,EAAA,CAAA;AAAA,gCACC,MAAO,EAAA,EAAA,CAAA;AAAA,YACP,SAAa,oBAAA,GAAA,CAAC,KAAM,EAAA,EAAA,GAAA,EAAW,GAAG,WAAa,EAAA,CAAA;AAAA,WAAA,EACpD,CACJ,EAAA,CAAA;AAAA,UAGJ,QAAA,kBAAA,GAAA;AAAA,YAAC,SAAA;AAAA,YAAA;AAAA,cACG,GAAA;AAAA,cACA,cAAY,IAAK,CAAA,aAAA,CAAc,EAAE,EAAA,EAAI,yBAAyB,CAAA;AAAA,aAAA;AAAA,WAClE;AAAA,SAAA;AAAA,OAER,EAAA,CAAA,CAAA;AAGJ,MAAA,OAAA,mBAES,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,QAAA,eAAA;AAAA,QACA,SAAA;AAAA,OACL,EAAA,CAAA,CAAA;AAEJ,MAAA,MAAA;AAAA,KACJ;AAAA,GACJ;AAEA,EAAA,uBACK,GAAA,CAAA,IAAA,EAAA,EAAM,GAAG,cAAA,EAAgB,SAAU,EAAA,QAAA,EAAS,GAAK,EAAA,OAAA,EAC9C,QAAC,kBAAA,GAAA,CAAA,wBAAA,EAAA,EAAyB,KAAO,EAAA,OAAA,EAAU,mBAAQ,CACvD,EAAA,CAAA,CAAA;AAER;;;;"}

package/Tools.js

@@ -1,52 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { Box, Menu, MenuButton, Button, Portal, MenuList, MenuItem } from '@open-pioneer/chakra-integration';
-import { useIntl } from './_virtual/_virtual-pioneer-module_react-hooks.js';
-import { FiMoreVertical } from 'react-icons/fi';
-
-const Tools = (props) => {
-  const intl = useIntl();
-  const { map, showHideAllLayers = true } = props;
-  const noEntry = !showHideAllLayers;
-  return !noEntry && /* @__PURE__ */ jsx(Box, { className: "toc-tools", children: /* @__PURE__ */ jsxs(Menu, { placement: "bottom-start", children: [
-    /* @__PURE__ */ jsx(
-      MenuButton,
-      {
-        as: Button,
-        className: "toc-tools-button",
-        "aria-label": intl.formatMessage({ id: "toolsLabel" }),
-        borderRadius: "full",
-        iconSpacing: 0,
-        padding: 3,
-        variant: "ghost",
-        leftIcon: /* @__PURE__ */ jsx(FiMoreVertical, {})
-      }
-    ),
-    /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(MenuList, { className: "tools-menu", children: /* @__PURE__ */ jsx(
-      MenuItem,
-      {
-        "aria-label": intl.formatMessage({ id: "tools.hideAllLayers" }),
-        onClick: () => {
-          hideAllLayers(map);
-        },
-        children: intl.formatMessage({ id: "tools.hideAllLayers" })
-      }
-    ) }) })
-  ] }) });
-};
-function hideAllLayers(map) {
-  const hide = (layer) => {
-    layer.setVisible(false);
-    const children = layer.children?.getItems();
-    if (children) {
-      for (const child of children) {
-        hide(child);
-      }
-    }
-  };
-  map?.layers.getOperationalLayers().forEach((layer) => {
-    hide(layer);
-  });
-}
-
-export { Tools };
-//# sourceMappingURL=Tools.js.map

package/Tools.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tools.js","sources":["Tools.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport {\n    Box,\n    Button,\n    Menu,\n    MenuButton,\n    MenuItem,\n    MenuList,\n    Portal\n} from \"@open-pioneer/chakra-integration\";\nimport { AnyLayer, MapModel } from \"@open-pioneer/map\";\nimport { useIntl } from \"open-pioneer:react-hooks\";\nimport { FC } from \"react\";\nimport { FiMoreVertical } from \"react-icons/fi\";\nimport { ToolsConfig } from \"./Toc\";\n\nexport const Tools: FC<{ map: MapModel } & ToolsConfig> = (props) => {\n    const intl = useIntl();\n    const { map, showHideAllLayers = true } = props;\n\n    const noEntry = !showHideAllLayers;\n\n    return (\n        !noEntry && (\n            <Box className=\"toc-tools\">\n                <Menu placement=\"bottom-start\">\n                    <MenuButton\n                        as={Button}\n                        className=\"toc-tools-button\"\n                        aria-label={intl.formatMessage({ id: \"toolsLabel\" })}\n                        borderRadius=\"full\"\n                        iconSpacing={0}\n                        padding={3}\n                        variant=\"ghost\"\n                        leftIcon={<FiMoreVertical />}\n                    />\n                    <Portal>\n                        <MenuList className=\"tools-menu\">\n                            <MenuItem\n                                aria-label={intl.formatMessage({ id: \"tools.hideAllLayers\" })}\n                                onClick={() => {\n                                    hideAllLayers(map);\n                                }}\n                            >\n                                {intl.formatMessage({ id: \"tools.hideAllLayers\" })}\n                            </MenuItem>\n                        </MenuList>\n                    </Portal>\n                </Menu>\n            </Box>\n        )\n    );\n};\n\nfunction hideAllLayers(map: MapModel | undefined) {\n    const hide = (layer: AnyLayer) => {\n        layer.setVisible(false);\n\n        const children = layer.children?.getItems();\n        if (children) {\n            for (const child of children) {\n                hide(child);\n            }\n        }\n    };\n\n    map?.layers.getOperationalLayers().forEach((layer) => {\n        hide(layer);\n    });\n}\n"],"names":[],"mappings":";;;;;AAiBa,MAAA,KAAA,GAA6C,CAAC,KAAU,KAAA;AACjE,EAAA,MAAM,OAAO,OAAQ,EAAA,CAAA;AACrB,EAAA,MAAM,EAAE,GAAA,EAAK,iBAAoB,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAE1C,EAAA,MAAM,UAAU,CAAC,iBAAA,CAAA;AAEjB,EACI,OAAA,CAAC,2BACI,GAAA,CAAA,GAAA,EAAA,EAAI,WAAU,WACX,EAAA,QAAA,kBAAA,IAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAU,cACZ,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACG,EAAI,EAAA,MAAA;AAAA,QACJ,SAAU,EAAA,kBAAA;AAAA,QACV,cAAY,IAAK,CAAA,aAAA,CAAc,EAAE,EAAA,EAAI,cAAc,CAAA;AAAA,QACnD,YAAa,EAAA,MAAA;AAAA,QACb,WAAa,EAAA,CAAA;AAAA,QACb,OAAS,EAAA,CAAA;AAAA,QACT,OAAQ,EAAA,OAAA;AAAA,QACR,QAAA,sBAAW,cAAe,EAAA,EAAA,CAAA;AAAA,OAAA;AAAA,KAC9B;AAAA,oBACC,GAAA,CAAA,MAAA,EAAA,EACG,QAAC,kBAAA,GAAA,CAAA,QAAA,EAAA,EAAS,WAAU,YAChB,EAAA,QAAA,kBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACG,cAAY,IAAK,CAAA,aAAA,CAAc,EAAE,EAAA,EAAI,uBAAuB,CAAA;AAAA,QAC5D,SAAS,MAAM;AACX,UAAA,aAAA,CAAc,GAAG,CAAA,CAAA;AAAA,SACrB;AAAA,QAEC,QAAK,EAAA,IAAA,CAAA,aAAA,CAAc,EAAE,EAAA,EAAI,uBAAuB,CAAA;AAAA,OAAA;AAAA,OAEzD,CACJ,EAAA,CAAA;AAAA,GAAA,EACJ,CACJ,EAAA,CAAA,CAAA;AAGZ,EAAA;AAEA,SAAS,cAAc,GAA2B,EAAA;AAC9C,EAAM,MAAA,IAAA,GAAO,CAAC,KAAoB,KAAA;AAC9B,IAAA,KAAA,CAAM,WAAW,KAAK,CAAA,CAAA;AAEtB,IAAM,MAAA,QAAA,GAAW,KAAM,CAAA,QAAA,EAAU,QAAS,EAAA,CAAA;AAC1C,IAAA,IAAI,QAAU,EAAA;AACV,MAAA,KAAA,MAAW,SAAS,QAAU,EAAA;AAC1B,QAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AAAA,OACd;AAAA,KACJ;AAAA,GACJ,CAAA;AAEA,EAAA,GAAA,EAAK,MAAO,CAAA,oBAAA,EAAuB,CAAA,OAAA,CAAQ,CAAC,KAAU,KAAA;AAClD,IAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AAAA,GACb,CAAA,CAAA;AACL;;;;"}