@itwin/map-layers 4.0.0-dev.8 → 5.0.0-dev.2

package/lib/cjs/ui/widget/MapLayerDroppable.js

@@ -1,89 +1,86 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-// cSpell:ignore droppable Sublayer Basemap
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MapLayerDroppable = void 0;
-// the following quiet warning caused by react-beautiful-dnd package
-/* eslint-disable @typescript-eslint/unbound-method */
-const React = require("react");
-const react_beautiful_dnd_1 = require("react-beautiful-dnd");
-const core_frontend_1 = require("@itwin/core-frontend");
-const core_react_1 = require("@itwin/core-react");
-const core_bentley_1 = require("@itwin/core-bentley");
-const appui_react_1 = require("@itwin/appui-react");
-const itwinui_react_1 = require("@itwin/itwinui-react");
-const SubLayersPopupButton_1 = require("./SubLayersPopupButton");
-const AttachLayerPopupButton_1 = require("./AttachLayerPopupButton");
-const MapLayerSettingsMenu_1 = require("./MapLayerSettingsMenu");
-const MapUrlDialog_1 = require("./MapUrlDialog");
-require("./MapLayerManager.scss");
-const mapLayers_1 = require("../../mapLayers");
-const core_common_1 = require("@itwin/core-common");
-/** @internal */
-// eslint-disable-next-line @typescript-eslint/naming-convention
-function MapLayerDroppable(props) {
-    const containsLayer = props.layersList && props.layersList.length > 0;
-    const droppableId = props.isOverlay ? "overlayMapLayers" : "backgroundMapLayers";
-    const [toggleVisibility] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.ToggleVisibility"));
-    const [requireAuthTooltip] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.RequireAuthTooltip"));
-    const [noBackgroundMapsSpecifiedLabel] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.NoBackgroundLayers"));
-    const [noUnderlaysSpecifiedLabel] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.NoOverlayLayers"));
-    const [dropLayerLabel] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.DropLayerLabel"));
-    const [outOfRangeTitle] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.layerOutOfRange"));
-    const renderItem = (dragProvided, _, rubric) => {
-        var _a;
-        (0, core_bentley_1.assert)(props.layersList !== undefined);
-        const activeLayer = props.layersList[rubric.source.index];
-        const outOfRange = activeLayer.treeVisibility === core_frontend_1.MapTileTreeScaleRangeVisibility.Hidden;
-        return (React.createElement("div", { className: "map-manager-source-item", "data-id": rubric.source.index, key: activeLayer.name, ...dragProvided.draggableProps, ref: dragProvided.innerRef },
-            React.createElement(itwinui_react_1.Button, { disabled: props.disabled, size: "small", styleType: "borderless", className: "map-manager-item-visibility", title: toggleVisibility, onClick: () => { props.onItemVisibilityToggleClicked(activeLayer); } },
-                React.createElement(core_react_1.Icon, { iconSpec: activeLayer.visible ? "icon-visibility" : "icon-visibility-hide-2" })),
-            React.createElement("span", { className: props.disabled || outOfRange ? "map-manager-item-label-disabled" : "map-manager-item-label", title: outOfRange ? outOfRangeTitle : undefined, ...dragProvided.dragHandleProps }, activeLayer.name),
-            React.createElement("div", { className: "map-manager-item-sub-layer-container" }, activeLayer.subLayers && activeLayer.subLayers.length > 1 &&
-                React.createElement(SubLayersPopupButton_1.SubLayersPopupButton, { mapLayerSettings: activeLayer, activeViewport: props.activeViewport })),
-            ((_a = activeLayer.provider) === null || _a === void 0 ? void 0 : _a.status) === core_frontend_1.MapLayerImageryProviderStatus.RequireAuth &&
-                React.createElement(itwinui_react_1.Button, { disabled: props.disabled, size: "small", styleType: "borderless", onClick: () => {
-                        var _a;
-                        const indexInDisplayStyle = (_a = props.activeViewport) === null || _a === void 0 ? void 0 : _a.displayStyle.findMapLayerIndexByNameAndSource(activeLayer.name, activeLayer.source, activeLayer.isOverlay);
-                        if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {
-                            const layerSettings = props.activeViewport.displayStyle.mapLayerAtIndex(indexInDisplayStyle, activeLayer.isOverlay);
-                            if (layerSettings instanceof core_common_1.ImageMapLayerSettings) {
-                                appui_react_1.ModalDialogManager.openDialog(React.createElement(MapUrlDialog_1.MapUrlDialog, { activeViewport: props.activeViewport, isOverlay: props.isOverlay, layerRequiringCredentials: layerSettings === null || layerSettings === void 0 ? void 0 : layerSettings.toJSON(), onOkResult: props.onItemEdited, mapTypesOptions: props.mapTypesOptions }));
-                            }
-                        }
-                    }, title: requireAuthTooltip },
-                    React.createElement(core_react_1.Icon, { className: "map-layer-source-item-warnMessage-icon", iconSpec: "icon-status-warning" })),
-            React.createElement(MapLayerSettingsMenu_1.MapLayerSettingsMenu, { activeViewport: props.activeViewport, mapLayerSettings: activeLayer, onMenuItemSelection: props.onMenuItemSelected, disabled: props.disabled })));
-    };
-    function renderDraggableContent(snapshot) {
-        var _a;
-        let node;
-        if (containsLayer) {
-            // Render a <Draggable>
-            node = ((_a = props.layersList) === null || _a === void 0 ? void 0 : _a.map((mapLayerSettings, i) => React.createElement(react_beautiful_dnd_1.Draggable, { isDragDisabled: props.disabled, key: mapLayerSettings.name, draggableId: mapLayerSettings.name, index: i }, renderItem)));
-        }
-        else {
-            // Render a label that provide a 'Drop here' hint
-            const label = props.isOverlay ? noUnderlaysSpecifiedLabel : noBackgroundMapsSpecifiedLabel;
-            node =
-                React.createElement("div", { title: label, className: "map-manager-no-layers-container" }, snapshot.isDraggingOver ?
-                    React.createElement("span", { className: "map-manager-no-layers-label" }, dropLayerLabel)
-                    :
-                        React.createElement(React.Fragment, null,
-                            React.createElement("span", { className: "map-manager-no-layers-label" }, label),
-                            React.createElement(AttachLayerPopupButton_1.AttachLayerPopupButton, { disabled: props.disabled, buttonType: AttachLayerPopupButton_1.AttachLayerButtonType.Blue, isOverlay: props.isOverlay })));
-        }
-        return node;
-    }
-    function renderDraggable(dropProvided, dropSnapshot) {
-        return (React.createElement("div", { className: `map-manager-attachments${dropSnapshot.isDraggingOver && containsLayer ? " is-dragging-map-over" : ""}`, ref: dropProvided.innerRef, ...dropProvided.droppableProps },
-            renderDraggableContent(dropSnapshot),
-            React.createElement("div", { style: containsLayer ? undefined : { display: "none" } }, dropProvided.placeholder)));
-    }
-    return (React.createElement(react_beautiful_dnd_1.Droppable, { droppableId: droppableId, renderClone: renderItem, getContainerForClone: props.getContainerForClone }, renderDraggable));
-}
-exports.MapLayerDroppable = MapLayerDroppable;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+// cSpell:ignore droppable Sublayer Basemap
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MapLayerDroppable = void 0;
+// the following quiet warning caused by react-beautiful-dnd package
+/* eslint-disable @typescript-eslint/unbound-method */
+const React = require("react");
+const react_beautiful_dnd_1 = require("react-beautiful-dnd");
+const core_frontend_1 = require("@itwin/core-frontend");
+const core_react_1 = require("@itwin/core-react");
+const core_bentley_1 = require("@itwin/core-bentley");
+const appui_react_1 = require("@itwin/appui-react");
+const itwinui_react_1 = require("@itwin/itwinui-react");
+const SubLayersPopupButton_1 = require("./SubLayersPopupButton");
+const AttachLayerPopupButton_1 = require("./AttachLayerPopupButton");
+const MapLayerSettingsMenu_1 = require("./MapLayerSettingsMenu");
+const MapUrlDialog_1 = require("./MapUrlDialog");
+require("./MapLayerManager.scss");
+const mapLayers_1 = require("../../mapLayers");
+const core_common_1 = require("@itwin/core-common");
+/** @internal */
+// eslint-disable-next-line @typescript-eslint/naming-convention
+function MapLayerDroppable(props) {
+    const containsLayer = props.layersList && props.layersList.length > 0;
+    const droppableId = props.isOverlay ? "overlayMapLayers" : "backgroundMapLayers";
+    const [toggleVisibility] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.ToggleVisibility"));
+    const [requireAuthTooltip] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.RequireAuthTooltip"));
+    const [noBackgroundMapsSpecifiedLabel] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.NoBackgroundLayers"));
+    const [noUnderlaysSpecifiedLabel] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.NoOverlayLayers"));
+    const [dropLayerLabel] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.DropLayerLabel"));
+    const [outOfRangeTitle] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:Widget.layerOutOfRange"));
+    const renderItem = (dragProvided, _, rubric) => {
+        (0, core_bentley_1.assert)(props.layersList !== undefined);
+        const activeLayer = props.layersList[rubric.source.index];
+        const outOfRange = activeLayer.treeVisibility === core_frontend_1.MapTileTreeScaleRangeVisibility.Hidden;
+        return (React.createElement("div", { className: "map-manager-source-item", "data-id": rubric.source.index, key: activeLayer.name, ...dragProvided.draggableProps, ref: dragProvided.innerRef },
+            React.createElement(itwinui_react_1.Button, { disabled: props.disabled, size: "small", styleType: "borderless", className: "map-manager-item-visibility", title: toggleVisibility, onClick: () => { props.onItemVisibilityToggleClicked(activeLayer); } },
+                React.createElement(core_react_1.Icon, { iconSpec: activeLayer.visible ? "icon-visibility" : "icon-visibility-hide-2" })),
+            React.createElement("span", { className: props.disabled || outOfRange ? "map-manager-item-label-disabled" : "map-manager-item-label", title: outOfRange ? outOfRangeTitle : undefined, ...dragProvided.dragHandleProps }, activeLayer.name),
+            React.createElement("div", { className: "map-manager-item-sub-layer-container" }, activeLayer.subLayers && activeLayer.subLayers.length > 1 &&
+                React.createElement(SubLayersPopupButton_1.SubLayersPopupButton, { mapLayerSettings: activeLayer, activeViewport: props.activeViewport })),
+            activeLayer.provider?.status === core_frontend_1.MapLayerImageryProviderStatus.RequireAuth &&
+                React.createElement(itwinui_react_1.Button, { disabled: props.disabled, size: "small", styleType: "borderless", onClick: () => {
+                        const indexInDisplayStyle = props.activeViewport?.displayStyle.findMapLayerIndexByNameAndSource(activeLayer.name, activeLayer.source, activeLayer.isOverlay);
+                        if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {
+                            const layerSettings = props.activeViewport.displayStyle.mapLayerAtIndex({ index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay });
+                            if (layerSettings instanceof core_common_1.ImageMapLayerSettings) {
+                                appui_react_1.UiFramework.dialogs.modal.open(React.createElement(MapUrlDialog_1.MapUrlDialog, { activeViewport: props.activeViewport, isOverlay: props.isOverlay, layerRequiringCredentials: layerSettings?.toJSON(), onOkResult: props.onItemEdited, mapTypesOptions: props.mapTypesOptions }));
+                            }
+                        }
+                    }, title: requireAuthTooltip },
+                    React.createElement(core_react_1.Icon, { className: "map-layer-source-item-warnMessage-icon", iconSpec: "icon-status-warning" })),
+            React.createElement(MapLayerSettingsMenu_1.MapLayerSettingsMenu, { activeViewport: props.activeViewport, mapLayerSettings: activeLayer, onMenuItemSelection: props.onMenuItemSelected, disabled: props.disabled })));
+    };
+    function renderDraggableContent(snapshot) {
+        let node;
+        if (containsLayer) {
+            // Render a <Draggable>
+            node = (props.layersList?.map((mapLayerSettings, i) => React.createElement(react_beautiful_dnd_1.Draggable, { isDragDisabled: props.disabled, key: mapLayerSettings.name, draggableId: mapLayerSettings.name, index: i }, renderItem)));
+        }
+        else {
+            // Render a label that provide a 'Drop here' hint
+            const label = props.isOverlay ? noUnderlaysSpecifiedLabel : noBackgroundMapsSpecifiedLabel;
+            node =
+                React.createElement("div", { title: label, className: "map-manager-no-layers-container" }, snapshot.isDraggingOver ?
+                    React.createElement("span", { className: "map-manager-no-layers-label" }, dropLayerLabel)
+                    :
+                        React.createElement(React.Fragment, null,
+                            React.createElement("span", { className: "map-manager-no-layers-label" }, label),
+                            React.createElement(AttachLayerPopupButton_1.AttachLayerPopupButton, { disabled: props.disabled, buttonType: AttachLayerPopupButton_1.AttachLayerButtonType.Blue, isOverlay: props.isOverlay })));
+        }
+        return node;
+    }
+    function renderDraggable(dropProvided, dropSnapshot) {
+        return (React.createElement("div", { className: `map-manager-attachments${dropSnapshot.isDraggingOver && containsLayer ? " is-dragging-map-over" : ""}`, ref: dropProvided.innerRef, ...dropProvided.droppableProps },
+            renderDraggableContent(dropSnapshot),
+            React.createElement("div", { style: containsLayer ? undefined : { display: "none" } }, dropProvided.placeholder)));
+    }
+    return (React.createElement(react_beautiful_dnd_1.Droppable, { droppableId: droppableId, renderClone: renderItem, getContainerForClone: props.getContainerForClone }, renderDraggable));
+}
+exports.MapLayerDroppable = MapLayerDroppable;
 //# sourceMappingURL=MapLayerDroppable.js.map

package/lib/cjs/ui/widget/MapLayerDroppable.js.map

@@ -1 +1 @@
-{"version":3,"file":"MapLayerDroppable.js","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerDroppable.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n// cSpell:ignore droppable Sublayer Basemap\r\n\r\n// the following quiet warning caused by react-beautiful-dnd package\r\n/* eslint-disable @typescript-eslint/unbound-method */\r\n\r\nimport * as React from \"react\";\r\nimport { Draggable, DraggableChildrenFn, Droppable, DroppableProvided, DroppableStateSnapshot } from \"react-beautiful-dnd\";\r\nimport { MapLayerImageryProviderStatus, MapTileTreeScaleRangeVisibility, ScreenViewport } from \"@itwin/core-frontend\";\r\nimport { Icon } from \"@itwin/core-react\";\r\nimport { assert } from \"@itwin/core-bentley\";\r\nimport { ModalDialogManager } from \"@itwin/appui-react\";\r\nimport { Button } from \"@itwin/itwinui-react\";\r\nimport { SubLayersPopupButton } from \"./SubLayersPopupButton\";\r\nimport { AttachLayerButtonType, AttachLayerPopupButton } from \"./AttachLayerPopupButton\";\r\nimport { MapTypesOptions, StyleMapLayerSettings } from \"../Interfaces\";\r\nimport { MapLayerSettingsMenu } from \"./MapLayerSettingsMenu\";\r\nimport { MapUrlDialog } from \"./MapUrlDialog\";\r\nimport \"./MapLayerManager.scss\";\r\nimport { MapLayersUI } from \"../../mapLayers\";\r\nimport { ImageMapLayerSettings } from \"@itwin/core-common\";\r\n\r\n/** @internal */\r\ninterface MapLayerDroppableProps {\r\n  isOverlay: boolean;\r\n  layersList?: StyleMapLayerSettings[];\r\n  mapTypesOptions?: MapTypesOptions;\r\n  getContainerForClone: () => HTMLElement;\r\n  activeViewport: ScreenViewport;\r\n  onMenuItemSelected: (action: string, mapLayerSettings: StyleMapLayerSettings) => void;\r\n  onItemVisibilityToggleClicked: (mapLayerSettings: StyleMapLayerSettings) => void;\r\n  onItemEdited: () => void;\r\n  disabled?: boolean;\r\n}\r\n\r\n/** @internal */\r\n// eslint-disable-next-line @typescript-eslint/naming-convention\r\nexport function MapLayerDroppable(props: MapLayerDroppableProps) {\r\n  const containsLayer = props.layersList && props.layersList.length > 0;\r\n  const droppableId = props.isOverlay ? \"overlayMapLayers\" : \"backgroundMapLayers\";\r\n  const [toggleVisibility] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.ToggleVisibility\"));\r\n  const [requireAuthTooltip] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.RequireAuthTooltip\"));\r\n  const [noBackgroundMapsSpecifiedLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.NoBackgroundLayers\"));\r\n  const [noUnderlaysSpecifiedLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.NoOverlayLayers\"));\r\n  const [dropLayerLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.DropLayerLabel\"));\r\n  const [outOfRangeTitle] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.layerOutOfRange\"));\r\n\r\n  const renderItem: DraggableChildrenFn = (dragProvided, _, rubric) => {\r\n    assert(props.layersList !== undefined);\r\n    const activeLayer = props.layersList[rubric.source.index];\r\n    const outOfRange = activeLayer.treeVisibility === MapTileTreeScaleRangeVisibility.Hidden;\r\n\r\n    return (\r\n      <div className=\"map-manager-source-item\" data-id={rubric.source.index} key={activeLayer.name}\r\n        {...dragProvided.draggableProps}\r\n        ref={dragProvided.innerRef} >\r\n        {/* Visibility icon */}\r\n        <Button disabled={props.disabled} size=\"small\" styleType=\"borderless\" className=\"map-manager-item-visibility\" title={toggleVisibility} onClick={() => { props.onItemVisibilityToggleClicked(activeLayer); }}>\r\n          <Icon iconSpec={activeLayer.visible ? \"icon-visibility\" : \"icon-visibility-hide-2\"} />\r\n        </Button>\r\n        {/* Label */}\r\n        <span className={props.disabled||outOfRange ? \"map-manager-item-label-disabled\" : \"map-manager-item-label\"}\r\n          title = {outOfRange ? outOfRangeTitle : undefined }\r\n          {...dragProvided.dragHandleProps}\r\n\r\n        >\r\n          {activeLayer.name}\r\n        </span>\r\n        <div className=\"map-manager-item-sub-layer-container\">\r\n          {activeLayer.subLayers && activeLayer.subLayers.length > 1 &&\r\n            <SubLayersPopupButton mapLayerSettings={activeLayer} activeViewport={props.activeViewport} />\r\n          }\r\n        </div>\r\n        {activeLayer.provider?.status === MapLayerImageryProviderStatus.RequireAuth &&\r\n          <Button\r\n            disabled={props.disabled}\r\n            size=\"small\"\r\n            styleType=\"borderless\"\r\n            onClick={() => {\r\n              const indexInDisplayStyle = props.activeViewport?.displayStyle.findMapLayerIndexByNameAndSource(activeLayer.name, activeLayer.source, activeLayer.isOverlay);\r\n              if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {\r\n                const layerSettings = props.activeViewport.displayStyle.mapLayerAtIndex(indexInDisplayStyle, activeLayer.isOverlay);\r\n                if (layerSettings instanceof ImageMapLayerSettings) {\r\n                  ModalDialogManager.openDialog(<MapUrlDialog activeViewport={props.activeViewport}\r\n                    isOverlay={props.isOverlay}\r\n                    layerRequiringCredentials={layerSettings?.toJSON()}\r\n                    onOkResult={props.onItemEdited}\r\n                    mapTypesOptions={props.mapTypesOptions}></MapUrlDialog>);\r\n                }\r\n              }\r\n\r\n            }}\r\n            title={requireAuthTooltip}\r\n          >\r\n            <Icon className=\"map-layer-source-item-warnMessage-icon\" iconSpec=\"icon-status-warning\" />\r\n          </Button>\r\n        }\r\n        <MapLayerSettingsMenu activeViewport={props.activeViewport} mapLayerSettings={activeLayer} onMenuItemSelection={props.onMenuItemSelected} disabled={props.disabled} />\r\n      </div>\r\n    );\r\n  };\r\n\r\n  function renderDraggableContent(snapshot: DroppableStateSnapshot): React.ReactNode {\r\n    let node: React.ReactNode;\r\n    if (containsLayer) {\r\n      // Render a <Draggable>\r\n      node = (props.layersList?.map((mapLayerSettings, i) =>\r\n        <Draggable isDragDisabled={props.disabled} key={mapLayerSettings.name} draggableId={mapLayerSettings.name} index={i}>\r\n          {renderItem}\r\n        </Draggable>));\r\n    } else {\r\n      // Render a label that provide a 'Drop here' hint\r\n      const label = props.isOverlay ? noUnderlaysSpecifiedLabel : noBackgroundMapsSpecifiedLabel;\r\n      node =\r\n        <div title={label} className=\"map-manager-no-layers-container\">\r\n          {snapshot.isDraggingOver ?\r\n            <span className=\"map-manager-no-layers-label\">{dropLayerLabel}</span>\r\n            :\r\n            <>\r\n              <span className=\"map-manager-no-layers-label\">{label}</span>\r\n              <AttachLayerPopupButton disabled={props.disabled} buttonType={AttachLayerButtonType.Blue} isOverlay={props.isOverlay} />\r\n            </>\r\n          }\r\n        </div>;\r\n    }\r\n    return node;\r\n  }\r\n\r\n  function renderDraggable(dropProvided: DroppableProvided, dropSnapshot: DroppableStateSnapshot): React.ReactElement<HTMLElement> {\r\n    return (\r\n      <div className={`map-manager-attachments${dropSnapshot.isDraggingOver && containsLayer ? \" is-dragging-map-over\" : \"\"}`} ref={dropProvided.innerRef} {...dropProvided.droppableProps} >\r\n\r\n        {renderDraggableContent(dropSnapshot)}\r\n\r\n        {\r\n          /* We don't want a placeholder when displaying the 'Drop here' message\r\n              Unfortunately, if don't add it, 'react-beautiful-dnd' show an error message in the console.\r\n              So I simply make it hidden. See https://github.com/atlassian/react-beautiful-dnd/issues/518 */\r\n        }\r\n        <div style={containsLayer ? undefined : { display: \"none\" }}>{dropProvided.placeholder}</div>\r\n      </div>);\r\n  }\r\n\r\n  return (\r\n    <Droppable\r\n      droppableId={droppableId}\r\n      renderClone={renderItem}\r\n      getContainerForClone={props.getContainerForClone as any}\r\n    >\r\n      {renderDraggable}\r\n    </Droppable>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"MapLayerDroppable.js","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerDroppable.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n// cSpell:ignore droppable Sublayer Basemap\n\n// the following quiet warning caused by react-beautiful-dnd package\n/* eslint-disable @typescript-eslint/unbound-method */\n\nimport * as React from \"react\";\nimport { Draggable, DraggableChildrenFn, Droppable, DroppableProvided, DroppableStateSnapshot } from \"react-beautiful-dnd\";\nimport { MapLayerImageryProviderStatus, MapTileTreeScaleRangeVisibility, ScreenViewport } from \"@itwin/core-frontend\";\nimport { Icon } from \"@itwin/core-react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { Button } from \"@itwin/itwinui-react\";\nimport { SubLayersPopupButton } from \"./SubLayersPopupButton\";\nimport { AttachLayerButtonType, AttachLayerPopupButton } from \"./AttachLayerPopupButton\";\nimport { MapTypesOptions, StyleMapLayerSettings } from \"../Interfaces\";\nimport { MapLayerSettingsMenu } from \"./MapLayerSettingsMenu\";\nimport { MapUrlDialog } from \"./MapUrlDialog\";\nimport \"./MapLayerManager.scss\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { ImageMapLayerSettings } from \"@itwin/core-common\";\n\n/** @internal */\ninterface MapLayerDroppableProps {\n  isOverlay: boolean;\n  layersList?: StyleMapLayerSettings[];\n  mapTypesOptions?: MapTypesOptions;\n  getContainerForClone: () => HTMLElement;\n  activeViewport: ScreenViewport;\n  onMenuItemSelected: (action: string, mapLayerSettings: StyleMapLayerSettings) => void;\n  onItemVisibilityToggleClicked: (mapLayerSettings: StyleMapLayerSettings) => void;\n  onItemEdited: () => void;\n  disabled?: boolean;\n}\n\n/** @internal */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function MapLayerDroppable(props: MapLayerDroppableProps) {\n  const containsLayer = props.layersList && props.layersList.length > 0;\n  const droppableId = props.isOverlay ? \"overlayMapLayers\" : \"backgroundMapLayers\";\n  const [toggleVisibility] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.ToggleVisibility\"));\n  const [requireAuthTooltip] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.RequireAuthTooltip\"));\n  const [noBackgroundMapsSpecifiedLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.NoBackgroundLayers\"));\n  const [noUnderlaysSpecifiedLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.NoOverlayLayers\"));\n  const [dropLayerLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.DropLayerLabel\"));\n  const [outOfRangeTitle] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.layerOutOfRange\"));\n\n  const renderItem: DraggableChildrenFn = (dragProvided, _, rubric) => {\n    assert(props.layersList !== undefined);\n    const activeLayer = props.layersList[rubric.source.index];\n    const outOfRange = activeLayer.treeVisibility === MapTileTreeScaleRangeVisibility.Hidden;\n\n    return (\n      <div className=\"map-manager-source-item\" data-id={rubric.source.index} key={activeLayer.name}\n        {...dragProvided.draggableProps}\n        ref={dragProvided.innerRef} >\n        {/* Visibility icon */}\n        <Button disabled={props.disabled} size=\"small\" styleType=\"borderless\" className=\"map-manager-item-visibility\" title={toggleVisibility} onClick={() => { props.onItemVisibilityToggleClicked(activeLayer); }}>\n          <Icon iconSpec={activeLayer.visible ? \"icon-visibility\" : \"icon-visibility-hide-2\"} />\n        </Button>\n        {/* Label */}\n        <span className={props.disabled||outOfRange ? \"map-manager-item-label-disabled\" : \"map-manager-item-label\"}\n          title = {outOfRange ? outOfRangeTitle : undefined }\n          {...dragProvided.dragHandleProps}\n\n        >\n          {activeLayer.name}\n        </span>\n        <div className=\"map-manager-item-sub-layer-container\">\n          {activeLayer.subLayers && activeLayer.subLayers.length > 1 &&\n            <SubLayersPopupButton mapLayerSettings={activeLayer} activeViewport={props.activeViewport} />\n          }\n        </div>\n        {activeLayer.provider?.status === MapLayerImageryProviderStatus.RequireAuth &&\n          <Button\n            disabled={props.disabled}\n            size=\"small\"\n            styleType=\"borderless\"\n            onClick={() => {\n              const indexInDisplayStyle = props.activeViewport?.displayStyle.findMapLayerIndexByNameAndSource(activeLayer.name, activeLayer.source, activeLayer.isOverlay);\n              if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {\n                const layerSettings = props.activeViewport.displayStyle.mapLayerAtIndex({index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay});\n                if (layerSettings instanceof ImageMapLayerSettings) {\n                  UiFramework.dialogs.modal.open(<MapUrlDialog activeViewport={props.activeViewport}\n                    isOverlay={props.isOverlay}\n                    layerRequiringCredentials={layerSettings?.toJSON()}\n                    onOkResult={props.onItemEdited}\n                    mapTypesOptions={props.mapTypesOptions}></MapUrlDialog>);\n                }\n              }\n\n            }}\n            title={requireAuthTooltip}\n          >\n            <Icon className=\"map-layer-source-item-warnMessage-icon\" iconSpec=\"icon-status-warning\" />\n          </Button>\n        }\n        <MapLayerSettingsMenu activeViewport={props.activeViewport} mapLayerSettings={activeLayer} onMenuItemSelection={props.onMenuItemSelected} disabled={props.disabled} />\n      </div>\n    );\n  };\n\n  function renderDraggableContent(snapshot: DroppableStateSnapshot): React.ReactNode {\n    let node: React.ReactNode;\n    if (containsLayer) {\n      // Render a <Draggable>\n      node = (props.layersList?.map((mapLayerSettings, i) =>\n        <Draggable isDragDisabled={props.disabled} key={mapLayerSettings.name} draggableId={mapLayerSettings.name} index={i}>\n          {renderItem}\n        </Draggable>));\n    } else {\n      // Render a label that provide a 'Drop here' hint\n      const label = props.isOverlay ? noUnderlaysSpecifiedLabel : noBackgroundMapsSpecifiedLabel;\n      node =\n        <div title={label} className=\"map-manager-no-layers-container\">\n          {snapshot.isDraggingOver ?\n            <span className=\"map-manager-no-layers-label\">{dropLayerLabel}</span>\n            :\n            <>\n              <span className=\"map-manager-no-layers-label\">{label}</span>\n              <AttachLayerPopupButton disabled={props.disabled} buttonType={AttachLayerButtonType.Blue} isOverlay={props.isOverlay} />\n            </>\n          }\n        </div>;\n    }\n    return node;\n  }\n\n  function renderDraggable(dropProvided: DroppableProvided, dropSnapshot: DroppableStateSnapshot): React.ReactElement<HTMLElement> {\n    return (\n      <div className={`map-manager-attachments${dropSnapshot.isDraggingOver && containsLayer ? \" is-dragging-map-over\" : \"\"}`} ref={dropProvided.innerRef} {...dropProvided.droppableProps} >\n\n        {renderDraggableContent(dropSnapshot)}\n\n        {\n          /* We don't want a placeholder when displaying the 'Drop here' message\n              Unfortunately, if don't add it, 'react-beautiful-dnd' show an error message in the console.\n              So I simply make it hidden. See https://github.com/atlassian/react-beautiful-dnd/issues/518 */\n        }\n        <div style={containsLayer ? undefined : { display: \"none\" }}>{dropProvided.placeholder}</div>\n      </div>);\n  }\n\n  return (\n    <Droppable\n      droppableId={droppableId}\n      renderClone={renderItem}\n      getContainerForClone={props.getContainerForClone as any}\n    >\n      {renderDraggable}\n    </Droppable>\n  );\n}\n"]}

package/lib/cjs/ui/widget/MapLayerManager.d.ts

@@ -1,27 +1,27 @@
-import { MapLayerSource, ScreenViewport } from "@itwin/core-frontend";
-import * as React from "react";
-import { MapLayerOptions, StyleMapLayerSettings } from "../Interfaces";
-import "./MapLayerManager.scss";
-/** @internal */
-export interface SourceMapContextProps {
-    readonly sources: MapLayerSource[];
-    readonly loadingSources: boolean;
-    readonly bases: MapLayerSource[];
-    readonly refreshFromStyle: () => void;
-    readonly activeViewport?: ScreenViewport;
-    readonly backgroundLayers?: StyleMapLayerSettings[];
-    readonly overlayLayers?: StyleMapLayerSettings[];
-    readonly mapLayerOptions?: MapLayerOptions;
-}
-/** @internal */
-export declare const SourceMapContext: React.Context<SourceMapContextProps>;
-/** @internal */
-export declare function useSourceMapContext(): SourceMapContextProps;
-interface MapLayerManagerProps {
-    getContainerForClone: () => HTMLElement;
-    activeViewport: ScreenViewport;
-    mapLayerOptions?: MapLayerOptions;
-}
-export declare function MapLayerManager(props: MapLayerManagerProps): JSX.Element;
-export {};
+import { MapLayerSource, ScreenViewport } from "@itwin/core-frontend";
+import * as React from "react";
+import { MapLayerOptions, StyleMapLayerSettings } from "../Interfaces";
+import "./MapLayerManager.scss";
+/** @internal */
+export interface SourceMapContextProps {
+    readonly sources: MapLayerSource[];
+    readonly loadingSources: boolean;
+    readonly bases: MapLayerSource[];
+    readonly refreshFromStyle: () => void;
+    readonly activeViewport?: ScreenViewport;
+    readonly backgroundLayers?: StyleMapLayerSettings[];
+    readonly overlayLayers?: StyleMapLayerSettings[];
+    readonly mapLayerOptions?: MapLayerOptions;
+}
+/** @internal */
+export declare const SourceMapContext: React.Context<SourceMapContextProps>;
+/** @internal */
+export declare function useSourceMapContext(): SourceMapContextProps;
+interface MapLayerManagerProps {
+    getContainerForClone: () => HTMLElement;
+    activeViewport: ScreenViewport;
+    mapLayerOptions?: MapLayerOptions;
+}
+export declare function MapLayerManager(props: MapLayerManagerProps): JSX.Element;
+export {};
 //# sourceMappingURL=MapLayerManager.d.ts.map

package/lib/cjs/ui/widget/MapLayerManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MapLayerManager.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerManager.tsx"],"names":[],"mappings":"AAWA,OAAO,EACiF,cAAc,EACpG,cAAc,EACf,MAAM,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAIvE,OAAO,wBAAwB,CAAC;AAIhC,gBAAgB;AAChB,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,OAAO,EAAE,cAAc,EAAE,CAAC;IACnC,QAAQ,CAAC,cAAc,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,KAAK,EAAE,cAAc,EAAE,CAAC;IACjC,QAAQ,CAAC,gBAAgB,EAAE,MAAM,IAAI,CAAC;IACtC,QAAQ,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC;IACzC,QAAQ,CAAC,gBAAgB,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACpD,QAAQ,CAAC,aAAa,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACjD,QAAQ,CAAC,eAAe,CAAC,EAAE,eAAe,CAAC;CAC5C;AAED,gBAAgB;AAChB,eAAO,MAAM,gBAAgB,sCAK3B,CAAC;AAEH,gBAAgB;AAChB,wBAAgB,mBAAmB,IAAI,qBAAqB,CAE3D;AAuCD,UAAU,oBAAoB;IAC5B,oBAAoB,EAAE,MAAM,WAAW,CAAC;IACxC,cAAc,EAAE,cAAc,CAAC;IAC/B,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC;AAGD,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,eAua1D"}
+{"version":3,"file":"MapLayerManager.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerManager.tsx"],"names":[],"mappings":"AAWA,OAAO,EACiF,cAAc,EACpG,cAAc,EACf,MAAM,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAIvE,OAAO,wBAAwB,CAAC;AAIhC,gBAAgB;AAChB,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,OAAO,EAAE,cAAc,EAAE,CAAC;IACnC,QAAQ,CAAC,cAAc,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,KAAK,EAAE,cAAc,EAAE,CAAC;IACjC,QAAQ,CAAC,gBAAgB,EAAE,MAAM,IAAI,CAAC;IACtC,QAAQ,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC;IACzC,QAAQ,CAAC,gBAAgB,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACpD,QAAQ,CAAC,aAAa,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACjD,QAAQ,CAAC,eAAe,CAAC,EAAE,eAAe,CAAC;CAC5C;AAED,gBAAgB;AAChB,eAAO,MAAM,gBAAgB,sCAK3B,CAAC;AAEH,gBAAgB;AAChB,wBAAgB,mBAAmB,IAAI,qBAAqB,CAE3D;AAuCD,UAAU,oBAAoB;IAC5B,oBAAoB,EAAE,MAAM,WAAW,CAAC;IACxC,cAAc,EAAE,cAAc,CAAC;IAC/B,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC;AAGD,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,eAoa1D"}