@itwin/map-layers 5.2.1 → 5.2.2

package/CHANGELOG.md

@@ -1,6 +1,13 @@
 # Change Log - @itwin/map-layers
 
-This log was last generated on Mon, 02 Oct 2023 20:32:55 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2023 18:48:11 GMT and should not be manually modified.
+
+## 5.2.2
+Thu, 05 Oct 2023 18:48:11 GMT
+
+### Patches
+
+- Several UI fixes and fine tuning.
 
 ## 5.2.1
 Mon, 02 Oct 2023 20:32:55 GMT

package/lib/cjs/mapLayers.d.ts

@@ -1,4 +1,4 @@
-import { Localization } from "@itwin/core-common";
+import { Localization, TranslationOptions } from "@itwin/core-common";
 import { UserPreferencesAccess } from "@itwin/core-frontend";
 export interface MapLayersConfig {
     localization?: Localization;
@@ -23,5 +23,6 @@ export declare class MapLayersUI {
     static terminate(): void;
     /** The internationalization service namespace. */
     static get localizationNamespace(): string;
+    static translate(key: string | string[], options?: TranslationOptions): string;
 }
 //# sourceMappingURL=mapLayers.d.ts.map

package/lib/cjs/mapLayers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mapLayers.d.ts","sourceRoot":"","sources":["../../src/mapLayers.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAa,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAIxE,MAAM,WAAW,eAAe;IAC9B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,kGAAkG;IAClG,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AAED;;;;;GAKG;AACH,qBAAa,WAAW;IACtB,OAAO,CAAC,MAAM,CAAC,UAAU,CAAe;IACxC,OAAc,YAAY,EAAE,YAAY,CAAC;IACzC,OAAO,CAAC,MAAM,CAAC,mBAAmB,CAAgB;IAClD,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,CAAwB;IAEpD,WAAkB,WAAW,IAAI,qBAAqB,GAAG,SAAS,CAEjE;IAED,wCAAwC;WACpB,UAAU,CAAC,MAAM,CAAC,EAAE,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC;IAUvE,4EAA4E;WAC9D,SAAS;IAIvB,kDAAkD;IAClD,WAAkB,qBAAqB,IAAI,MAAM,CAEhD;CACF"}
+{"version":3,"file":"mapLayers.d.ts","sourceRoot":"","sources":["../../src/mapLayers.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACtE,OAAO,EAAa,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAExE,MAAM,WAAW,eAAe;IAC9B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,kGAAkG;IAClG,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AAED;;;;;GAKG;AACH,qBAAa,WAAW;IACtB,OAAO,CAAC,MAAM,CAAC,UAAU,CAAe;IACxC,OAAc,YAAY,EAAE,YAAY,CAAC;IACzC,OAAO,CAAC,MAAM,CAAC,mBAAmB,CAAgB;IAClD,OAAO,CAAC,MAAM,CAAC,YAAY,CAAC,CAAwB;IAEpD,WAAkB,WAAW,IAAI,qBAAqB,GAAG,SAAS,CAEjE;IAED,wCAAwC;WACpB,UAAU,CAAC,MAAM,CAAC,EAAE,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC;IAUvE,4EAA4E;WAC9D,SAAS;IAIvB,kDAAkD;IAClD,WAAkB,qBAAqB,IAAI,MAAM,CAEhD;WAEa,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,OAAO,CAAC,EAAE,kBAAkB,GAAG,MAAM;CAGtF"}

package/lib/cjs/mapLayers.js

@@ -27,6 +27,9 @@ class MapLayersUI {
     static get localizationNamespace() {
         return MapLayersUI._defaultNs;
     }
+    static translate(key, options) {
+        return MapLayersUI.localization.getLocalizedString(key, { ...options, ns: MapLayersUI._defaultNs });
+    }
 }
 exports.MapLayersUI = MapLayersUI;
 MapLayersUI._defaultNs = "mapLayers";

package/lib/cjs/mapLayers.js.map

@@ -1 +1 @@
-{"version":3,"file":"mapLayers.js","sourceRoot":"","sources":["../../src/mapLayers.ts"],"names":[],"mappings":";;;AAKA,wDAAwE;AAUxE;;;;;GAKG;AACH,MAAa,WAAW;IAMf,MAAM,KAAK,WAAW;QAC3B,OAAO,IAAI,CAAC,YAAY,CAAC;IAC3B,CAAC;IAED,wCAAwC;IACjC,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC,MAAwB;QACrD,mEAAmE;QACnE,WAAW,CAAC,YAAY,GAAG,MAAM,EAAE,YAAY,IAAI,yBAAS,CAAC,YAAY,CAAC;QAC1E,MAAM,WAAW,CAAC,YAAY,CAAC,iBAAiB,CAC9C,WAAW,CAAC,qBAAqB,CAClC,CAAC;QAEF,WAAW,CAAC,YAAY,GAAG,MAAM,EAAE,WAAW,CAAC;IACjD,CAAC;IAED,4EAA4E;IACrE,MAAM,CAAC,SAAS;QACrB,yBAAS,CAAC,YAAY,CAAC,mBAAmB,CAAC,WAAW,CAAC,qBAAqB,CAAC,CAAC;IAChF,CAAC;IAED,kDAAkD;IAC3C,MAAM,KAAK,qBAAqB;QACrC,OAAO,WAAW,CAAC,UAAU,CAAC;IAChC,CAAC;;AA7BH,kCA8BC;AA7BgB,sBAAU,GAAG,WAAW,CAAC;AAEzB,+BAAmB,GAAa,EAAE,CAAC","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*--------------------------------------------------------------------------------------------*/\nimport { Localization } from \"@itwin/core-common\";\nimport { IModelApp, UserPreferencesAccess } from \"@itwin/core-frontend\";\n// import { MapLayersUiItemsProvider } from \"./ui/MapLayersUiItemsProvider\";\n// import { FeatureInfoUiItemsProvider } from \"./ui/FeatureInfoUiItemsProvider\";\n\nexport interface MapLayersConfig {\n  localization?: Localization;\n  /** If an iTwinConfig is provided, it will be used to load the MapLayerSources that are stored. */\n  iTwinConfig?: UserPreferencesAccess;\n}\n\n/** MapLayersUI is use when the package is used as a dependency to another app.\n * '''ts\n *  await MapLayersUI.initialize({...MapLayersInitProps});\n * '''\n * @beta\n */\nexport class MapLayersUI {\n  private static _defaultNs = \"mapLayers\";\n  public static localization: Localization;\n  private static _uiItemsProvidersId: string[] = [];\n  private static _iTwinConfig?: UserPreferencesAccess;\n\n  public static get iTwinConfig(): UserPreferencesAccess | undefined {\n    return this._iTwinConfig;\n  }\n\n  /** Used to initialize the Map Layers */\n  public static async initialize(config?: MapLayersConfig): Promise<void> {\n    // register namespace containing localized strings for this package\n    MapLayersUI.localization = config?.localization ?? IModelApp.localization;\n    await MapLayersUI.localization.registerNamespace(\n      MapLayersUI.localizationNamespace\n    );\n\n    MapLayersUI._iTwinConfig = config?.iTwinConfig;\n  }\n\n  /** Unregisters internationalization service namespace and UiItemManager  */\n  public static terminate() {\n    IModelApp.localization.unregisterNamespace(MapLayersUI.localizationNamespace);\n  }\n\n  /** The internationalization service namespace. */\n  public static get localizationNamespace(): string {\n    return MapLayersUI._defaultNs;\n  }\n}\n"]}
+{"version":3,"file":"mapLayers.js","sourceRoot":"","sources":["../../src/mapLayers.ts"],"names":[],"mappings":";;;AAKA,wDAAwE;AAQxE;;;;;GAKG;AACH,MAAa,WAAW;IAMf,MAAM,KAAK,WAAW;QAC3B,OAAO,IAAI,CAAC,YAAY,CAAC;IAC3B,CAAC;IAED,wCAAwC;IACjC,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC,MAAwB;QACrD,mEAAmE;QACnE,WAAW,CAAC,YAAY,GAAG,MAAM,EAAE,YAAY,IAAI,yBAAS,CAAC,YAAY,CAAC;QAC1E,MAAM,WAAW,CAAC,YAAY,CAAC,iBAAiB,CAC9C,WAAW,CAAC,qBAAqB,CAClC,CAAC;QAEF,WAAW,CAAC,YAAY,GAAG,MAAM,EAAE,WAAW,CAAC;IACjD,CAAC;IAED,4EAA4E;IACrE,MAAM,CAAC,SAAS;QACrB,yBAAS,CAAC,YAAY,CAAC,mBAAmB,CAAC,WAAW,CAAC,qBAAqB,CAAC,CAAC;IAChF,CAAC;IAED,kDAAkD;IAC3C,MAAM,KAAK,qBAAqB;QACrC,OAAO,WAAW,CAAC,UAAU,CAAC;IAChC,CAAC;IAEM,MAAM,CAAC,SAAS,CAAC,GAAsB,EAAE,OAA4B;QAC1E,OAAO,WAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,GAAG,EAAE,EAAC,GAAG,OAAO,EAAE,EAAE,EAAE,WAAW,CAAC,UAAU,EAAC,CAAC,CAAC;IACpG,CAAC;;AAjCH,kCAkCC;AAjCgB,sBAAU,GAAG,WAAW,CAAC;AAEzB,+BAAmB,GAAa,EAAE,CAAC","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*--------------------------------------------------------------------------------------------*/\nimport { Localization, TranslationOptions } from \"@itwin/core-common\";\nimport { IModelApp, UserPreferencesAccess } from \"@itwin/core-frontend\";\n\nexport interface MapLayersConfig {\n  localization?: Localization;\n  /** If an iTwinConfig is provided, it will be used to load the MapLayerSources that are stored. */\n  iTwinConfig?: UserPreferencesAccess;\n}\n\n/** MapLayersUI is use when the package is used as a dependency to another app.\n * '''ts\n *  await MapLayersUI.initialize({...MapLayersInitProps});\n * '''\n * @beta\n */\nexport class MapLayersUI {\n  private static _defaultNs = \"mapLayers\";\n  public static localization: Localization;\n  private static _uiItemsProvidersId: string[] = [];\n  private static _iTwinConfig?: UserPreferencesAccess;\n\n  public static get iTwinConfig(): UserPreferencesAccess | undefined {\n    return this._iTwinConfig;\n  }\n\n  /** Used to initialize the Map Layers */\n  public static async initialize(config?: MapLayersConfig): Promise<void> {\n    // register namespace containing localized strings for this package\n    MapLayersUI.localization = config?.localization ?? IModelApp.localization;\n    await MapLayersUI.localization.registerNamespace(\n      MapLayersUI.localizationNamespace\n    );\n\n    MapLayersUI._iTwinConfig = config?.iTwinConfig;\n  }\n\n  /** Unregisters internationalization service namespace and UiItemManager  */\n  public static terminate() {\n    IModelApp.localization.unregisterNamespace(MapLayersUI.localizationNamespace);\n  }\n\n  /** The internationalization service namespace. */\n  public static get localizationNamespace(): string {\n    return MapLayersUI._defaultNs;\n  }\n\n  public static translate(key: string | string[], options?: TranslationOptions): string {\n    return MapLayersUI.localization.getLocalizedString(key, {...options, ns: MapLayersUI._defaultNs});\n  }\n}\n"]}

package/lib/cjs/public/locales/en/mapLayers.json

@@ -12,6 +12,17 @@
   "ColorDialog": {
     "Title": "Specify Base Color"
   },
+  "Dialog":
+  {
+    "Add" : "Add",
+    "Cancel" : "Cancel",
+    "Edit" : "Edit"
+  },
+  "SelectFeaturesDialog":
+  {
+    "AllOn": "Select All",
+    "AllOff": "Select None"
+  },
   "MapLayerActionButtons": {
     "ShowAllLabel": "Show all",
     "HideAllLabel": "Hide all",
@@ -24,7 +35,7 @@
     "LayerExistsOverwriting": "Map layer {{layer}} already exists, overwriting info for that layer.",
     "LayerExistsAsITwinSetting": "Map layer {{layer}} already exists as a iTwin setting. Cannot overwrite with a model setting!",
     "AddCustomLayerButtonLabel": "Add Layer",
-    "AttachCustomLayer": "Attach New Layer",
+    "AttachCustomLayer": "Add New Layer",
     "AttacheInfo": "Map layer attached from URL:",
     "Custom": "New",
     "LoadingMapSources": "Loading Map Sources",
@@ -52,11 +63,11 @@
     "RemoveLayerDefError": "Could not delete map layer definition: {{layerName}}",
     "RemoveLayerDefSuccess": "Successfully deleted map layer definition: {{layerName}}",
     "SearchPlaceholder": "Search...",
-    "SelectLayersToCreate": "Select layers to be created",
+    "SelectLayersToCreate": "Select Layers To Add",
     "StoreOnModelSettings": "Store on Model Settings",
     "StoreOnITwinSettings": "Store on iTwin Settings",
     "TechPreviewBadgeTooltip": "Technology preview",
-    "TooManyLayersSelected": "There are currently {{layerCount}} layers selected; Adding too many layers may impact performance.",
+    "TooManyLayersSelected": "{{layerCount}} layers selected; performance may be affected.",
     "Type": "Type",
     "URL": "URL",
     "UrlInputPlaceHolder": "Enter Map Source URL",

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

@@ -1 +1 @@
-{"version":3,"file":"MapLayerDroppable.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerDroppable.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAyI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAO7L,OAAO,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAGvE,OAAO,wBAAwB,CAAC;AAIhC,gBAAgB;AAChB,UAAU,sBAAsB;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACrC,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,oBAAoB,EAAE,MAAM,WAAW,CAAC;IACxC,cAAc,EAAE,cAAc,CAAC;IAC/B,kBAAkB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtF,6BAA6B,EAAE,CAAC,gBAAgB,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjF,cAAc,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,YAAY,EAAE,MAAO,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,gBAAgB;AAEhB,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eAoL9D"}
+{"version":3,"file":"MapLayerDroppable.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerDroppable.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAyI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAO7L,OAAO,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAGvE,OAAO,wBAAwB,CAAC;AAIhC,gBAAgB;AAChB,UAAU,sBAAsB;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACrC,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,oBAAoB,EAAE,MAAM,WAAW,CAAC;IACxC,cAAc,EAAE,cAAc,CAAC;IAC/B,kBAAkB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtF,6BAA6B,EAAE,CAAC,gBAAgB,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACjF,cAAc,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,YAAY,EAAE,MAAO,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAOD,gBAAgB;AAEhB,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eAmL9D"}

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

@@ -22,6 +22,10 @@ const MapUrlDialog_1 = require("./MapUrlDialog");
 require("./MapLayerManager.scss");
 const mapLayers_1 = require("../../mapLayers");
 const core_common_1 = require("@itwin/core-common");
+const changeVisibilityByElementId = (element, visible) => {
+    if (element)
+        element.setAttribute("style", `visibility: ${visible ? "visible" : "hidden"}`);
+};
 /** @internal */
 // eslint-disable-next-line @typescript-eslint/naming-convention
 function MapLayerDroppable(props) {
@@ -61,9 +65,8 @@ function MapLayerDroppable(props) {
         props.onItemEdited();
     }, [props]);
     const changeSettingsMenuVisibility = (event, visible) => {
-        const menuDiv = event.currentTarget.querySelector("#MapLayerSettingsMenuWrapper");
-        if (menuDiv)
-            menuDiv.setAttribute("style", `visibility: ${visible ? "visible" : "hidden"}`);
+        changeVisibilityByElementId(event.currentTarget.querySelector("#MapLayerSettingsMenuWrapper"), visible);
+        changeVisibilityByElementId(event.currentTarget.querySelector("#MapLayerSettingsSubLayersMenu"), visible);
     };
     const renderItem = (dragProvided, _, rubric) => {
         (0, core_bentley_1.assert)(props.layersList !== undefined);
@@ -77,7 +80,7 @@ function MapLayerDroppable(props) {
             React.createElement(itwinui_react_1.Button, { disabled: props.disabled, size: "small", styleType: "borderless", className: "map-manager-item-visibility map-manager-visibility-icon", 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("div", { id: "MapLayerSettingsSubLayersMenu", style: { visibility: "hidden" }, className: "map-manager-item-sub-layer-container" }, activeLayer.subLayers && activeLayer.subLayers.length > 1 &&
                 React.createElement(SubLayersPopupButton_1.SubLayersPopupButton, { checkboxStyle: "eye", expandMode: "rootGroupOnly", subLayers: props.activeViewport ? activeLayer.subLayers : undefined, singleVisibleSubLayer: activeLayer.provider?.mutualExclusiveSubLayer, onSubLayerStateChange: (subLayerId, isSelected) => { onSubLayerStateChange(activeLayer, subLayerId, isSelected); } })),
             activeLayer.provider?.status === core_frontend_1.MapLayerImageryProviderStatus.RequireAuth &&
                 React.createElement(itwinui_react_1.Button, { disabled: props.disabled, size: "small", styleType: "borderless", onClick: () => {

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

@@ -1 +1 @@
-{"version":3,"file":"MapLayerDroppable.js","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerDroppable.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F,2CAA2C;;;AAE3C,oEAAoE;AACpE,sDAAsD;AAEtD,+BAA+B;AAC/B,6DAA2H;AAC3H,wDAA6L;AAC7L,kDAAyC;AACzC,sDAA6C;AAC7C,oDAAiD;AACjD,wDAAwD;AACxD,iEAA8D;AAC9D,qEAAyF;AAEzF,iEAA8D;AAC9D,iDAA2D;AAC3D,kCAAgC;AAChC,+CAA8C;AAC9C,oDAAuE;AAgBvE,gBAAgB;AAChB,gEAAgE;AAChE,SAAgB,iBAAiB,CAAC,KAA6B;IAC7D,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;IACtE,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,qBAAqB,CAAC;IACjF,MAAM,CAAC,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,mCAAmC,CAAC,CAAC,CAAC;IAC5H,MAAM,CAAC,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,qCAAqC,CAAC,CAAC,CAAC;IAChI,MAAM,CAAC,8BAA8B,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,qCAAqC,CAAC,CAAC,CAAC;IAC5I,MAAM,CAAC,yBAAyB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC,CAAC,CAAC;IACpI,MAAM,CAAC,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,iCAAiC,CAAC,CAAC,CAAC;IACxH,MAAM,CAAC,eAAe,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC,CAAC,CAAC;IAE1H,MAAM,qBAAqB,GAAG,CAAC,WAAkC,EAAE,UAAsB,EAAE,UAAmB,EAAE,EAAE;QAChH,MAAM,gBAAgB,GAAI,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,gCAAgC,CAAC,WAAW,CAAC,IAAI,EAAE,WAAW,CAAC,MAAM,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QAC1J,IAAI,gBAAgB,KAAK,CAAC,CAAC,IAAI,WAAW,CAAC,SAAS;YAClD,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,sBAAsB,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAE,WAAW,CAAC,SAAS,EAAE,CAAC,CAAC;IACjK,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAAoB,EAAE,WAAyB,EAAE,EAAE;QACrF,yBAAW,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;QAElC,MAAM,MAAM,GAAG,WAAW,EAAE,MAAM,CAAC;QACnC,MAAM,EAAE,GAAG,KAAK,EAAE,cAAc,CAAC;QACjC,IAAI,EAAE,KAAK,SAAS,IAAI,WAAW,KAAK,SAAS,IAAI,MAAM,KAAK,SAAS,EAAE;YACzE,MAAM,KAAK,GAAG,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,sDAAsD,CAAC,CAAC;YAClH,MAAM,GAAG,GAAG,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,wCAAwC,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,IAAI,EAAE,EAAE,CAAC,CAAC;YAC7I,yBAAS,CAAC,aAAa,CAAC,aAAa,CAAC,IAAI,oCAAoB,CAAC,qCAAqB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC;YAClG,OAAO;SACR;QAED,MAAM,UAAU,GAAG,WAAW,CAAC,UAAU,CAAC;QAE1C,6BAA6B;QAC7B,oCAAoC;QACpC,EAAE,CAAC,YAAY,CAAC,mBAAmB,CAAC,EAAC,SAAS,EAAE,UAAU,CAAC,SAAS,EAAC,EAAE,KAAK,CAAC,CAAC;QAC9E,EAAE,CAAC,YAAY,CAAC,yBAAyB,CAAC,KAAK,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;QAEnF,wFAAwF;QACxF,+EAA+E;QAC/E,MAAM,QAAQ,GAAG,EAAE,CAAC,0BAA0B,CAAC,KAAK,CAAC,CAAC;QACtD,QAAQ,EAAE,WAAW,EAAE,CAAC;QACxB,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAExB,KAAK,CAAC,YAAY,EAAE,CAAC;IACvB,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,4BAA4B,GAAG,CAAC,KAAmD,EAAE,OAAgB,EAAC,EAAE;QAC5G,MAAM,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,8BAA8B,CAAC,CAAC;QAClF,IAAI,OAAO;YACT,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,eAAe,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;IACnF,CAAC,CAAC;IAEF,MAAM,UAAU,GAAwB,CAAC,YAAY,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE;QAClE,IAAA,qBAAM,EAAC,KAAK,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC;QACvC,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC1D,MAAM,UAAU,GAAG,WAAW,CAAC,cAAc,KAAK,+CAA+B,CAAC,MAAM,CAAC;QAEzF,OAAO,CACL,6BAAK,SAAS,EAAC,yBAAyB,aAAU,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,GAAG,EAAE,WAAW,CAAC,IAAI,KACtF,YAAY,CAAC,cAAc,EAC/B,GAAG,EAAE,YAAY,CAAC,QAAQ,EAC1B,YAAY,EAAE,CAAC,KAAK,EAAC,EAAE,CAAA,4BAA4B,CAAC,KAAK,EAAE,IAAI,CAAC,EAChE,YAAY,EAAE,CAAC,KAAK,EAAC,EAAE,CAAA,4BAA4B,CAAC,KAAK,EAAE,KAAK,CAAC;YAGjE,oBAAC,wBAAQ,mBAAc,sBAAsB,EAAE,OAAO,EAAE,WAAW,CAAC,QAAQ,EAAE,QAAQ,EAAE,CAAC,KAA0C,EAAE,EAAE;oBACrI,WAAW,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;oBAC5C,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBAC7D,CAAC,GAEY;YAEb,oBAAC,sBAAM,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,YAAY,EAAC,SAAS,EAAC,yDAAyD,EAAC,KAAK,EAAE,gBAAgB,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC,6BAA6B,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;gBACrO,oBAAC,iBAAI,IAAC,QAAQ,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,wBAAwB,GAAI,CAC/E;YAGT,8BAAM,SAAS,EAAE,KAAK,CAAC,QAAQ,IAAI,UAAU,CAAC,CAAC,CAAC,iCAAiC,CAAC,CAAC,CAAC,wBAAwB,EAC1G,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,KAC3C,YAAY,CAAC,eAAe,IAG/B,WAAW,CAAC,IAAI,CACZ;YAGP,6BAAK,SAAS,EAAC,sCAAsC,IAClD,WAAW,CAAC,SAAS,IAAI,WAAW,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC;gBACxD,oBAAC,2CAAoB,IACnB,aAAa,EAAC,KAAK,EACnB,UAAU,EAAC,eAAe,EAC1B,SAAS,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACnE,qBAAqB,EAAE,WAAW,CAAC,QAAQ,EAAE,uBAAuB,EACpE,qBAAqB,EAAE,CAAC,UAAsB,EAAE,UAAmB,EAAE,EAAE,GAAG,qBAAqB,CAAC,WAAW,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,GAEnI,CAEJ;YACL,WAAW,CAAC,QAAQ,EAAE,MAAM,KAAK,6CAA6B,CAAC,WAAW;gBACzE,oBAAC,sBAAM,IACL,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,YAAY,EACtB,OAAO,EAAE,GAAG,EAAE;wBACZ,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,EAAE,YAAY,CAAC,gCAAgC,CAAC,WAAW,CAAC,IAAI,EAAE,WAAW,CAAC,MAAM,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;wBAC7J,IAAI,mBAAmB,KAAK,SAAS,IAAI,mBAAmB,IAAI,CAAC,EAAE;4BACjE,MAAM,KAAK,GAAG,EAAE,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,WAAW,CAAC,SAAS,EAAE,CAAC;4BAC/E,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;4BAC/E,IAAI,aAAa,YAAY,mCAAqB,EAAE;gCAClD,yBAAW,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,oBAAC,2BAAY,IAAC,cAAc,EAAE,KAAK,CAAC,cAAc,EAC/E,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,yBAAyB,EAAE,aAAa,EAAE,MAAM,EAAE,EAClD,UAAU,EAAE,CAAC,WAAyB,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC,EACvE,cAAc,EAAE,GAAG,EAAE,GAAE,yBAAW,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAA,CAAC,EAC1D,eAAe,EAAE,KAAK,CAAC,eAAe,GAAiB,CAAC,CAAC;6BAC5D;yBACF;oBAEH,CAAC,EACD,KAAK,EAAE,kBAAkB;oBAEzB,oBAAC,iBAAI,IAAC,SAAS,EAAC,wCAAwC,EAAC,QAAQ,EAAC,qBAAqB,GAAG,CACnF;YAEX,6BAAK,EAAE,EAAC,6BAA6B,EAAC,KAAK,EAAE,EAAC,UAAU,EAAE,QAAQ,EAAC;gBACjE,oBAAC,2CAAoB,IAAC,cAAc,EAAE,KAAK,CAAC,cAAc,EAAE,gBAAgB,EAAE,WAAW,EAAE,mBAAmB,EAAE,KAAK,CAAC,kBAAkB,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAAI,CAClK,CAEF,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,SAAS,sBAAsB,CAAC,QAAgC;QAC9D,IAAI,IAAqB,CAAC;QAC1B,IAAI,aAAa,EAAE;YACjB,uBAAuB;YACvB,IAAI,GAAG,CAAC,KAAK,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC,gBAAgB,EAAE,CAAC,EAAE,EAAE,CACpD,oBAAC,+BAAS,IAAC,cAAc,EAAE,KAAK,CAAC,QAAQ,EAAE,GAAG,EAAE,gBAAgB,CAAC,IAAI,EAAE,WAAW,EAAE,gBAAgB,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC,IAChH,UAAU,CACD,CAAC,CAAC,CAAC;SAClB;aAAM;YACL,iDAAiD;YACjD,MAAM,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,8BAA8B,CAAC;YAC3F,IAAI;gBACF,6BAAK,KAAK,EAAE,KAAK,EAAE,SAAS,EAAC,iCAAiC,IAC3D,QAAQ,CAAC,cAAc,CAAC,CAAC;oBACxB,8BAAM,SAAS,EAAC,6BAA6B,IAAE,cAAc,CAAQ;oBACrE,CAAC;wBACD;4BACE,8BAAM,SAAS,EAAC,6BAA6B,IAAE,KAAK,CAAQ;4BAC5D,oBAAC,+CAAsB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,UAAU,EAAE,8CAAqB,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,GAAI,CACvH,CAED,CAAC;SACV;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,SAAS,eAAe,CAAC,YAA+B,EAAE,YAAoC;QAC5F,OAAO,CACL,6BAAK,SAAS,EAAE,0BAA0B,YAAY,CAAC,cAAc,IAAI,aAAa,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,YAAY,CAAC,QAAQ,KAAM,YAAY,CAAC,cAAc;YAEjL,sBAAsB,CAAC,YAAY,CAAC;YAOrC,6BAAK,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,IAAG,YAAY,CAAC,WAAW,CAAO,CACzF,CAAC,CAAC;IACZ,CAAC;IAED,OAAO,CACL,oBAAC,+BAAS,IACR,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,UAAU,EACvB,oBAAoB,EAAE,KAAK,CAAC,oBAA2B,IAEtD,eAAe,CACN,CACb,CAAC;AACJ,CAAC;AApLD,8CAoLC","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 { IModelApp, MapLayerImageryProviderStatus, MapLayerIndex, MapTileTreeScaleRangeVisibility, NotifyMessageDetails, OutputMessagePriority, 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, Checkbox } from \"@itwin/itwinui-react\";\nimport { SubLayersPopupButton } from \"./SubLayersPopupButton\";\nimport { AttachLayerButtonType, AttachLayerPopupButton } from \"./AttachLayerPopupButton\";\nimport { MapTypesOptions, StyleMapLayerSettings } from \"../Interfaces\";\nimport { MapLayerSettingsMenu } from \"./MapLayerSettingsMenu\";\nimport { MapUrlDialog, SourceState } from \"./MapUrlDialog\";\nimport \"./MapLayerManager.scss\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { ImageMapLayerSettings, SubLayerId } 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  onItemSelected: (isOverlay: boolean, index: number) => 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 onSubLayerStateChange = (activeLayer: StyleMapLayerSettings, subLayerId: SubLayerId, isSelected: boolean) => {\n    const mapLayerStyleIdx =  props.activeViewport.displayStyle.findMapLayerIndexByNameAndSource(activeLayer.name, activeLayer.source, activeLayer.isOverlay);\n    if (mapLayerStyleIdx !== -1 && activeLayer.subLayers)\n      props.activeViewport.displayStyle.changeMapSubLayerProps({ visible: isSelected }, subLayerId, { index: mapLayerStyleIdx, isOverlay: activeLayer.isOverlay });\n  };\n\n  const handleOk = React.useCallback((index: MapLayerIndex, sourceState?: SourceState) => {\n    UiFramework.dialogs.modal.close();\n\n    const source = sourceState?.source;\n    const vp = props?.activeViewport;\n    if (vp === undefined || sourceState === undefined || source === undefined) {\n      const error = MapLayersUI.localization.getLocalizedString(\"mapLayers:Messages.MapLayerAttachMissingViewOrSource\");\n      const msg = MapLayersUI.localization.getLocalizedString(\"mapLayers:Messages.MapLayerAttachError\", { error, sourceName: source?.name ?? \"\" });\n      IModelApp.notifications.outputMessage(new NotifyMessageDetails(OutputMessagePriority.Error, msg));\n      return;\n    }\n\n    const validation = sourceState.validation;\n\n    // Layer is already attached,\n    // This calls invalidateRenderPlan()\n    vp.displayStyle.changeMapLayerProps({subLayers: validation.subLayers}, index);\n    vp.displayStyle.changeMapLayerCredentials(index, source.userName, source.password);\n\n    // Either initial attach/initialize failed or the layer failed to load at least one tile\n    // because of an invalid token; in both cases tile tree needs to be fully reset\n    const provider = vp.getMapLayerImageryProvider(index);\n    provider?.resetStatus();\n    vp.resetMapLayer(index);\n\n    props.onItemEdited();\n  }, [props]);\n\n  const changeSettingsMenuVisibility = (event: React.MouseEvent<HTMLDivElement, MouseEvent>, visible: boolean)=>{\n    const menuDiv = event.currentTarget.querySelector(\"#MapLayerSettingsMenuWrapper\");\n    if (menuDiv)\n      menuDiv.setAttribute(\"style\", `visibility: ${visible ? \"visible\" : \"hidden\"}`);\n  };\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        onMouseEnter={(event)=>changeSettingsMenuVisibility(event, true)}\n        onMouseLeave={(event)=>changeSettingsMenuVisibility(event, false)} >\n\n        {/* Checkbox */}\n        <Checkbox data-testid={\"select-item-checkbox\"} checked={activeLayer.selected} onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n          activeLayer.selected = event.target.checked;\n          props.onItemSelected(props.isOverlay, rubric.source.index);\n        }\n\n        }></Checkbox>\n        {/* Visibility icon */}\n        <Button disabled={props.disabled} size=\"small\" styleType=\"borderless\" className=\"map-manager-item-visibility map-manager-visibility-icon\" title={toggleVisibility} onClick={() => { props.onItemVisibilityToggleClicked(activeLayer); }}>\n          <Icon iconSpec={activeLayer.visible ? \"icon-visibility\" : \"icon-visibility-hide-2\"} />\n        </Button>\n\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\n        {/* SubLayersPopupButton */}\n        <div className=\"map-manager-item-sub-layer-container\" >\n          {activeLayer.subLayers && activeLayer.subLayers.length > 1 &&\n            <SubLayersPopupButton\n              checkboxStyle=\"eye\"\n              expandMode=\"rootGroupOnly\"\n              subLayers={props.activeViewport ? activeLayer.subLayers : undefined}\n              singleVisibleSubLayer={activeLayer.provider?.mutualExclusiveSubLayer}\n              onSubLayerStateChange={(subLayerId: SubLayerId, isSelected: boolean) => { onSubLayerStateChange(activeLayer, subLayerId, isSelected); }\n\n              } />\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 index = { index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay };\n                const layerSettings = props.activeViewport.displayStyle.mapLayerAtIndex(index);\n                if (layerSettings instanceof ImageMapLayerSettings) {\n                  UiFramework.dialogs.modal.open(<MapUrlDialog activeViewport={props.activeViewport}\n                    isOverlay={props.isOverlay}\n                    layerRequiringCredentials={layerSettings?.toJSON()}\n                    onOkResult={(sourceState?: SourceState) => handleOk(index, sourceState)}\n                    onCancelResult={() => {UiFramework.dialogs.modal.close();}}\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        <div id=\"MapLayerSettingsMenuWrapper\" style={{visibility: \"hidden\"}} >\n          <MapLayerSettingsMenu activeViewport={props.activeViewport} mapLayerSettings={activeLayer} onMenuItemSelection={props.onMenuItemSelected} disabled={props.disabled} />\n        </div>\n\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"]}
+{"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 { IModelApp, MapLayerImageryProviderStatus, MapLayerIndex, MapTileTreeScaleRangeVisibility, NotifyMessageDetails, OutputMessagePriority, 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, Checkbox } from \"@itwin/itwinui-react\";\nimport { SubLayersPopupButton } from \"./SubLayersPopupButton\";\nimport { AttachLayerButtonType, AttachLayerPopupButton } from \"./AttachLayerPopupButton\";\nimport { MapTypesOptions, StyleMapLayerSettings } from \"../Interfaces\";\nimport { MapLayerSettingsMenu } from \"./MapLayerSettingsMenu\";\nimport { MapUrlDialog, SourceState } from \"./MapUrlDialog\";\nimport \"./MapLayerManager.scss\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { ImageMapLayerSettings, SubLayerId } 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  onItemSelected: (isOverlay: boolean, index: number) => void;\n  onItemEdited: ( ) => void;\n  disabled?: boolean;\n}\n\nconst changeVisibilityByElementId = (element: Element|null, visible: boolean) => {\n  if (element)\n    element.setAttribute(\"style\", `visibility: ${visible ? \"visible\" : \"hidden\"}`);\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 onSubLayerStateChange = (activeLayer: StyleMapLayerSettings, subLayerId: SubLayerId, isSelected: boolean) => {\n    const mapLayerStyleIdx =  props.activeViewport.displayStyle.findMapLayerIndexByNameAndSource(activeLayer.name, activeLayer.source, activeLayer.isOverlay);\n    if (mapLayerStyleIdx !== -1 && activeLayer.subLayers)\n      props.activeViewport.displayStyle.changeMapSubLayerProps({ visible: isSelected }, subLayerId, { index: mapLayerStyleIdx, isOverlay: activeLayer.isOverlay });\n  };\n\n  const handleOk = React.useCallback((index: MapLayerIndex, sourceState?: SourceState) => {\n    UiFramework.dialogs.modal.close();\n\n    const source = sourceState?.source;\n    const vp = props?.activeViewport;\n    if (vp === undefined || sourceState === undefined || source === undefined) {\n      const error = MapLayersUI.localization.getLocalizedString(\"mapLayers:Messages.MapLayerAttachMissingViewOrSource\");\n      const msg = MapLayersUI.localization.getLocalizedString(\"mapLayers:Messages.MapLayerAttachError\", { error, sourceName: source?.name ?? \"\" });\n      IModelApp.notifications.outputMessage(new NotifyMessageDetails(OutputMessagePriority.Error, msg));\n      return;\n    }\n\n    const validation = sourceState.validation;\n\n    // Layer is already attached,\n    // This calls invalidateRenderPlan()\n    vp.displayStyle.changeMapLayerProps({subLayers: validation.subLayers}, index);\n    vp.displayStyle.changeMapLayerCredentials(index, source.userName, source.password);\n\n    // Either initial attach/initialize failed or the layer failed to load at least one tile\n    // because of an invalid token; in both cases tile tree needs to be fully reset\n    const provider = vp.getMapLayerImageryProvider(index);\n    provider?.resetStatus();\n    vp.resetMapLayer(index);\n\n    props.onItemEdited();\n  }, [props]);\n\n  const changeSettingsMenuVisibility = (event: React.MouseEvent<HTMLDivElement, MouseEvent>, visible: boolean)=>{\n    changeVisibilityByElementId(event.currentTarget.querySelector(\"#MapLayerSettingsMenuWrapper\"), visible);\n    changeVisibilityByElementId(event.currentTarget.querySelector(\"#MapLayerSettingsSubLayersMenu\"), visible);\n  };\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        onMouseEnter={(event)=>changeSettingsMenuVisibility(event, true)}\n        onMouseLeave={(event)=>changeSettingsMenuVisibility(event, false)} >\n\n        {/* Checkbox */}\n        <Checkbox data-testid={\"select-item-checkbox\"} checked={activeLayer.selected} onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n          activeLayer.selected = event.target.checked;\n          props.onItemSelected(props.isOverlay, rubric.source.index);\n        }\n\n        }></Checkbox>\n        {/* Visibility icon */}\n        <Button disabled={props.disabled} size=\"small\" styleType=\"borderless\" className=\"map-manager-item-visibility map-manager-visibility-icon\" title={toggleVisibility} onClick={() => { props.onItemVisibilityToggleClicked(activeLayer); }}>\n          <Icon iconSpec={activeLayer.visible ? \"icon-visibility\" : \"icon-visibility-hide-2\"} />\n        </Button>\n\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\n        {/* SubLayersPopupButton */}\n        <div id=\"MapLayerSettingsSubLayersMenu\" style={{visibility: \"hidden\"}}  className=\"map-manager-item-sub-layer-container\" >\n          {activeLayer.subLayers && activeLayer.subLayers.length > 1 &&\n            <SubLayersPopupButton\n              checkboxStyle=\"eye\"\n              expandMode=\"rootGroupOnly\"\n              subLayers={props.activeViewport ? activeLayer.subLayers : undefined}\n              singleVisibleSubLayer={activeLayer.provider?.mutualExclusiveSubLayer}\n              onSubLayerStateChange={(subLayerId: SubLayerId, isSelected: boolean) => { onSubLayerStateChange(activeLayer, subLayerId, isSelected); }\n\n              } />\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 index = { index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay };\n                const layerSettings = props.activeViewport.displayStyle.mapLayerAtIndex(index);\n                if (layerSettings instanceof ImageMapLayerSettings) {\n                  UiFramework.dialogs.modal.open(<MapUrlDialog activeViewport={props.activeViewport}\n                    isOverlay={props.isOverlay}\n                    layerRequiringCredentials={layerSettings?.toJSON()}\n                    onOkResult={(sourceState?: SourceState) => handleOk(index, sourceState)}\n                    onCancelResult={() => {UiFramework.dialogs.modal.close();}}\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        <div id=\"MapLayerSettingsMenuWrapper\" style={{visibility: \"hidden\"}} >\n          <MapLayerSettingsMenu activeViewport={props.activeViewport} mapLayerSettings={activeLayer} onMenuItemSelection={props.onMenuItemSelected} disabled={props.disabled} />\n        </div>\n\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/MapLayerSettingsPopupButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MapLayerSettingsPopupButton.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerSettingsPopupButton.tsx"],"names":[],"mappings":"AAUA,OAAO,oCAAoC,CAAC;AAG5C,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,aAAa;AAEb,wBAAgB,2BAA2B,CAAC,KAAK,EAAE,gCAAgC,eAoElF"}
+{"version":3,"file":"MapLayerSettingsPopupButton.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerSettingsPopupButton.tsx"],"names":[],"mappings":"AAUA,OAAO,oCAAoC,CAAC;AAI5C,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,aAAa;AAEb,wBAAgB,2BAA2B,CAAC,KAAK,EAAE,gCAAgC,eAoElF"}

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

@@ -12,6 +12,7 @@ const MapManagerSettings_1 = require("./MapManagerSettings");
 require("./MapLayerSettingsPopupButton.scss");
 const mapLayers_1 = require("../../mapLayers");
 const itwinui_react_1 = require("@itwin/itwinui-react");
+const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
 /** @alpha */
 // eslint-disable-next-line @typescript-eslint/naming-convention
 function MapLayerSettingsPopupButton(props) {
@@ -56,8 +57,8 @@ function MapLayerSettingsPopupButton(props) {
         setIsSettingsOpen(false);
     }, [isInsideCoreDialog]);
     return (React.createElement(React.Fragment, null,
-        React.createElement(itwinui_react_1.Button, { disabled: props.disabled, styleType: "borderless", title: buttonTooltip, className: "maplayers-settings-popup-button", onClick: togglePopupDisplay, ref: buttonRef },
-            React.createElement(core_react_1.WebFontIcon, { iconName: "icon-settings" })),
+        React.createElement(itwinui_react_1.IconButton, { disabled: props.disabled, styleType: "borderless", title: buttonTooltip, className: "maplayers-settings-popup-button", onClick: togglePopupDisplay, ref: buttonRef },
+            React.createElement(itwinui_icons_react_1.SvgSettings, null)),
         React.createElement(core_react_1.Popup, { isOpen: isSettingsOpen, position: appui_abstract_1.RelativePosition.BottomRight, onClose: handleCloseSetting, target: buttonRef.current, onOutsideClick: handleOutsideClick, repositionOnResize: true },
             React.createElement("div", { ref: panelRef, className: "maplayers-settings-popup-panel" },
                 React.createElement(MapManagerSettings_1.MapManagerSettings, null)))));

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

@@ -1 +1 @@
-{"version":3,"file":"MapLayerSettingsPopupButton.js","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerSettingsPopupButton.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\nimport * as React from \"react\";\nimport { RelativePosition } from \"@itwin/appui-abstract\";\nimport { Popup, WebFontIcon } from \"@itwin/core-react\";\nimport { MapManagerSettings } from \"./MapManagerSettings\";\n\nimport \"./MapLayerSettingsPopupButton.scss\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { Button } from \"@itwin/itwinui-react\";\nexport interface MapLayerSettingsPopupButtonProps {\n  disabled?: boolean;\n}\n\n/** @alpha */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function MapLayerSettingsPopupButton(props: MapLayerSettingsPopupButtonProps) {\n  const panelRef = React.useRef<HTMLDivElement>(null);\n  const [isSettingsOpen, setIsSettingsOpen] = React.useState(false);\n  const [buttonTooltip] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.SettingsButtonTooltip\"));\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n  const togglePopupDisplay = React.useCallback((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n    event.preventDefault();\n    setIsSettingsOpen((prev) => !prev);\n  }, [setIsSettingsOpen]);\n\n  const handleCloseSetting = React.useCallback(() => {\n    setIsSettingsOpen(false);\n  }, [setIsSettingsOpen]);\n\n  const isInsideCoreDialog = React.useCallback((element: HTMLElement) => {\n    if (element.nodeName === \"DIV\") {\n      if (element.classList && element.classList.contains(\"core-dialog\"))\n        return true;\n      if (element.parentElement && isInsideCoreDialog(element.parentElement))\n        return true;\n    } else {\n      // istanbul ignore else\n      if (element.parentElement && isInsideCoreDialog(element.parentElement))\n        return true;\n    }\n    return false;\n  }, []);\n\n  const handleOutsideClick = React.useCallback((event: MouseEvent) => {\n    if (isInsideCoreDialog(event.target as HTMLElement)) {\n      return;\n    }\n\n    // If clicking on button that open panel -  don't trigger outside click processing\n    if (buttonRef?.current && buttonRef?.current.contains(event.target as Node)) {\n      return;\n    }\n\n    // If clicking the panel, this is not an outside clicked\n    if (panelRef.current && panelRef?.current.contains(event.target as Node)) {\n      return;\n    }\n\n    // If we reach this point, we got an outside clicked, no close the popup\n    setIsSettingsOpen(false);\n\n  }, [isInsideCoreDialog]);\n\n  return (\n    <>\n      <Button disabled={props.disabled} styleType=\"borderless\" title={buttonTooltip} className=\"maplayers-settings-popup-button\" onClick={togglePopupDisplay} ref={buttonRef}>\n        <WebFontIcon iconName=\"icon-settings\" />\n      </Button>\n      <Popup\n        isOpen={isSettingsOpen}\n        position={RelativePosition.BottomRight}\n        onClose={handleCloseSetting}\n        target={buttonRef.current}\n        onOutsideClick={handleOutsideClick}\n        repositionOnResize={true}\n      >\n        <div ref={panelRef} className=\"maplayers-settings-popup-panel\">\n          <MapManagerSettings />\n        </div>\n      </Popup >\n    </ >\n  );\n}\n"]}
+{"version":3,"file":"MapLayerSettingsPopupButton.js","sourceRoot":"","sources":["../../../../src/ui/widget/MapLayerSettingsPopupButton.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;;;AAE/F,+BAA+B;AAC/B,0DAAyD;AACzD,kDAA0C;AAC1C,6DAA0D;AAE1D,8CAA4C;AAC5C,+CAA8C;AAC9C,wDAAkD;AAClD,oEAAyD;AAKzD,aAAa;AACb,gEAAgE;AAChE,SAAgB,2BAA2B,CAAC,KAAuC;IACjF,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IACpD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClE,MAAM,CAAC,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,uBAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,wCAAwC,CAAC,CAAC,CAAC;IAE9H,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAC;IACxD,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAAsD,EAAE,EAAE;QACtG,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,iBAAiB,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAChD,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,OAAoB,EAAE,EAAE;QACpE,IAAI,OAAO,CAAC,QAAQ,KAAK,KAAK,EAAE;YAC9B,IAAI,OAAO,CAAC,SAAS,IAAI,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC;gBAChE,OAAO,IAAI,CAAC;YACd,IAAI,OAAO,CAAC,aAAa,IAAI,kBAAkB,CAAC,OAAO,CAAC,aAAa,CAAC;gBACpE,OAAO,IAAI,CAAC;SACf;aAAM;YACL,uBAAuB;YACvB,IAAI,OAAO,CAAC,aAAa,IAAI,kBAAkB,CAAC,OAAO,CAAC,aAAa,CAAC;gBACpE,OAAO,IAAI,CAAC;SACf;QACD,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAAiB,EAAE,EAAE;QACjE,IAAI,kBAAkB,CAAC,KAAK,CAAC,MAAqB,CAAC,EAAE;YACnD,OAAO;SACR;QAED,kFAAkF;QAClF,IAAI,SAAS,EAAE,OAAO,IAAI,SAAS,EAAE,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAAE;YAC3E,OAAO;SACR;QAED,wDAAwD;QACxD,IAAI,QAAQ,CAAC,OAAO,IAAI,QAAQ,EAAE,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAAE;YACxE,OAAO;SACR;QAED,wEAAwE;QACxE,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAE3B,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,OAAO,CACL;QACE,oBAAC,0BAAU,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,SAAS,EAAC,YAAY,EAAC,KAAK,EAAE,aAAa,EAAE,SAAS,EAAC,iCAAiC,EAAC,OAAO,EAAE,kBAAkB,EAAE,GAAG,EAAE,SAAS;YACxK,oBAAC,iCAAW,OAAE,CACH;QACb,oBAAC,kBAAK,IACJ,MAAM,EAAE,cAAc,EACtB,QAAQ,EAAE,iCAAgB,CAAC,WAAW,EACtC,OAAO,EAAE,kBAAkB,EAC3B,MAAM,EAAE,SAAS,CAAC,OAAO,EACzB,cAAc,EAAE,kBAAkB,EAClC,kBAAkB,EAAE,IAAI;YAExB,6BAAK,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,gCAAgC;gBAC5D,oBAAC,uCAAkB,OAAG,CAClB,CACC,CACP,CACL,CAAC;AACJ,CAAC;AApED,kEAoEC","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\nimport * as React from \"react\";\nimport { RelativePosition } from \"@itwin/appui-abstract\";\nimport { Popup } from \"@itwin/core-react\";\nimport { MapManagerSettings } from \"./MapManagerSettings\";\n\nimport \"./MapLayerSettingsPopupButton.scss\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport { SvgSettings } from \"@itwin/itwinui-icons-react\";\nexport interface MapLayerSettingsPopupButtonProps {\n  disabled?: boolean;\n}\n\n/** @alpha */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function MapLayerSettingsPopupButton(props: MapLayerSettingsPopupButtonProps) {\n  const panelRef = React.useRef<HTMLDivElement>(null);\n  const [isSettingsOpen, setIsSettingsOpen] = React.useState(false);\n  const [buttonTooltip] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.SettingsButtonTooltip\"));\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n  const togglePopupDisplay = React.useCallback((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n    event.preventDefault();\n    setIsSettingsOpen((prev) => !prev);\n  }, [setIsSettingsOpen]);\n\n  const handleCloseSetting = React.useCallback(() => {\n    setIsSettingsOpen(false);\n  }, [setIsSettingsOpen]);\n\n  const isInsideCoreDialog = React.useCallback((element: HTMLElement) => {\n    if (element.nodeName === \"DIV\") {\n      if (element.classList && element.classList.contains(\"core-dialog\"))\n        return true;\n      if (element.parentElement && isInsideCoreDialog(element.parentElement))\n        return true;\n    } else {\n      // istanbul ignore else\n      if (element.parentElement && isInsideCoreDialog(element.parentElement))\n        return true;\n    }\n    return false;\n  }, []);\n\n  const handleOutsideClick = React.useCallback((event: MouseEvent) => {\n    if (isInsideCoreDialog(event.target as HTMLElement)) {\n      return;\n    }\n\n    // If clicking on button that open panel -  don't trigger outside click processing\n    if (buttonRef?.current && buttonRef?.current.contains(event.target as Node)) {\n      return;\n    }\n\n    // If clicking the panel, this is not an outside clicked\n    if (panelRef.current && panelRef?.current.contains(event.target as Node)) {\n      return;\n    }\n\n    // If we reach this point, we got an outside clicked, no close the popup\n    setIsSettingsOpen(false);\n\n  }, [isInsideCoreDialog]);\n\n  return (\n    <>\n      <IconButton disabled={props.disabled} styleType=\"borderless\" title={buttonTooltip} className=\"maplayers-settings-popup-button\" onClick={togglePopupDisplay} ref={buttonRef}>\n        <SvgSettings/>\n      </IconButton>\n      <Popup\n        isOpen={isSettingsOpen}\n        position={RelativePosition.BottomRight}\n        onClose={handleCloseSetting}\n        target={buttonRef.current}\n        onOutsideClick={handleOutsideClick}\n        repositionOnResize={true}\n      >\n        <div ref={panelRef} className=\"maplayers-settings-popup-panel\">\n          <MapManagerSettings />\n        </div>\n      </Popup >\n    </ >\n  );\n}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"MapSelectFeaturesDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapSelectFeaturesDialog.tsx"],"names":[],"mappings":"AAQA,OAAO,gCAAgC,CAAC;AAIxC,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,EAAE,gBAAgB,EAAE,CAAC;IAC9B,QAAQ,EAAE,CAAC,SAAS,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAClD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAKD,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,sBAAsB,eAqEpE"}
+{"version":3,"file":"MapSelectFeaturesDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapSelectFeaturesDialog.tsx"],"names":[],"mappings":"AAQA,OAAO,gCAAgC,CAAC;AAGxC,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAKtD,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,cAAc,CAAC;IACvB,SAAS,EAAE,gBAAgB,EAAE,CAAC;IAC9B,QAAQ,EAAE,CAAC,SAAS,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAClD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAKD,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,sBAAsB,eAyFpE"}

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

@@ -9,16 +9,15 @@ exports.MapSelectFeaturesDialog = void 0;
 const core_react_1 = require("@itwin/core-react");
 const React = require("react");
 require("./MapSelectFeaturesDialog.scss");
-const appui_abstract_1 = require("@itwin/appui-abstract");
 const mapLayers_1 = require("../../mapLayers");
 const SubLayersTree_1 = require("./SubLayersTree");
+const itwinui_react_1 = require("@itwin/itwinui-react");
+const itwinui_icons_color_react_1 = require("@itwin/itwinui-icons-color-react");
 const minHeight = 250;
 const maxSubLayers = 30;
 // eslint-disable-next-line @typescript-eslint/naming-convention
 function MapSelectFeaturesDialog(props) {
     const [subLayers, setSubLayers] = React.useState(props.subLayers);
-    const [NoLayersSelectedMsg] = React.useState(() => mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:CustomAttach.NoLayersSelected"));
-    const [dialogTitle] = React.useState(mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:CustomAttach.SelectLayersToCreate"));
     const dialogContainer = React.useRef(null);
     const handleOk = React.useCallback(() => {
         props.handleOk(subLayers);
@@ -29,30 +28,30 @@ function MapSelectFeaturesDialog(props) {
     const hasVisibleLayers = () => subLayers.some((entry) => entry.visible);
     const hasTooManyVisibleLayers = () => subLayers.filter((entry) => entry.visible).length > maxSubLayers;
     const readyToSave = () => hasVisibleLayers();
-    const buttonCluster = [
-        { type: appui_abstract_1.DialogButtonType.OK, onClick: handleOk, disabled: !readyToSave() },
-        { type: appui_abstract_1.DialogButtonType.Cancel, onClick: handleCancel },
-    ];
     function renderWarningMessage() {
         let warningMessage;
         // Get the proper warning message
         if (!hasVisibleLayers()) {
-            warningMessage = NoLayersSelectedMsg;
+            warningMessage = mapLayers_1.MapLayersUI.translate("CustomAttach.NoLayersSelected");
         }
         else if (hasTooManyVisibleLayers()) {
-            warningMessage = mapLayers_1.MapLayersUI.localization.getLocalizedString("mapLayers:CustomAttach.TooManyLayersSelected", { layerCount: subLayers.filter((entry) => entry.visible).length });
+            warningMessage = mapLayers_1.MapLayersUI.translate("CustomAttach.TooManyLayersSelected", { layerCount: subLayers.filter((entry) => entry.visible).length });
         }
-        if (warningMessage !== undefined) {
-            return (React.createElement("div", { className: "map-layer-source-warnMessage" },
-                React.createElement(core_react_1.Icon, { className: "map-layer-source-warnMessage-icon", iconSpec: "icon-status-warning" }),
-                React.createElement("span", { className: "map-layer-source-warnMessage-label" }, warningMessage)));
-        }
-        return React.createElement(React.Fragment, null);
+        return (React.createElement("div", { className: "map-layer-source-warnMessage" }, warningMessage !== undefined && React.createElement(React.Fragment, null,
+            React.createElement(itwinui_react_1.Icon, { size: "small" },
+                React.createElement(itwinui_icons_color_react_1.SvgStatusWarning, null)),
+            React.createElement("span", { className: "map-layer-source-warnMessage-label" }, warningMessage))));
+    }
+    function getFooter() {
+        return (React.createElement("div", { className: "map-layer-features-footer" },
+            React.createElement("div", { className: "map-layer-features-footer-warnMessage" }, renderWarningMessage()),
+            React.createElement("div", { className: "map-layer-features-footer-buttons" },
+                React.createElement(itwinui_react_1.Button, { className: "map-layer-features-footer-button", styleType: 'high-visibility', onClick: handleOk, disabled: !readyToSave() }, mapLayers_1.MapLayersUI.translate("Dialog.Add")),
+                React.createElement(itwinui_react_1.Button, { className: "map-layer-features-footer-button", styleType: 'default', onClick: handleCancel }, mapLayers_1.MapLayersUI.translate("Dialog.Cancel")))));
     }
     return (React.createElement("div", { ref: dialogContainer },
-        React.createElement(core_react_1.Dialog, { className: "map-layer-select-features-dialog", title: dialogTitle, opened: true, resizable: true, movable: true, modal: true, buttonCluster: buttonCluster, onClose: handleCancel, onEscape: handleCancel, minHeight: minHeight, maxWidth: 600, titleStyle: { paddingLeft: "10px" }, footerStyle: { paddingBottom: "10px", paddingRight: "10px" }, trapFocus: false },
-            React.createElement(SubLayersTree_1.SubLayersTree, { expandMode: "full", checkboxStyle: "standard", subLayers: subLayers, onSubLayerStateChange: () => setSubLayers([...subLayers]) }),
-            renderWarningMessage())));
+        React.createElement(core_react_1.Dialog, { className: "map-layer-select-features-dialog", title: mapLayers_1.MapLayersUI.translate("CustomAttach.SelectLayersToCreate"), opened: true, resizable: true, movable: true, modal: true, footer: getFooter(), onClose: handleCancel, onEscape: handleCancel, minHeight: minHeight, maxWidth: 600, titleStyle: { paddingLeft: "10px" }, footerStyle: { paddingBottom: "10px", paddingRight: "10px" }, trapFocus: false },
+            React.createElement(SubLayersTree_1.SubLayersTree, { expandMode: "full", checkboxStyle: "standard", subLayers: subLayers, onSubLayerStateChange: () => setSubLayers([...subLayers]) }))));
 }
 exports.MapSelectFeaturesDialog = MapSelectFeaturesDialog;
 //# sourceMappingURL=MapSelectFeaturesDialog.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MapSelectFeaturesDialog.js","sourceRoot":"","sources":["../../../../src/ui/widget/MapSelectFeaturesDialog.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 Modeless WMTS\n\nimport { Dialog, Icon } from \"@itwin/core-react\";\nimport * as React from \"react\";\nimport \"./MapSelectFeaturesDialog.scss\";\n\nimport { DialogButtonType } from \"@itwin/appui-abstract\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { MapLayerSource } from \"@itwin/core-frontend\";\nimport { MapSubLayerProps } from \"@itwin/core-common\";\nimport { SubLayersTree } from \"./SubLayersTree\";\n\nexport interface MapSelectFeaturesProps {\n  source: MapLayerSource;\n  subLayers: MapSubLayerProps[];\n  handleOk: (subLayers: MapSubLayerProps[]) => void;\n  handleCancel: () => void;\n}\nconst minHeight = 250;\nconst maxSubLayers = 30;\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function MapSelectFeaturesDialog(props: MapSelectFeaturesProps) {\n  const [subLayers, setSubLayers] = React.useState(props.subLayers);\n  const [NoLayersSelectedMsg] = React.useState(()=>MapLayersUI.localization.getLocalizedString(\"mapLayers:CustomAttach.NoLayersSelected\"));\n  const [dialogTitle] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:CustomAttach.SelectLayersToCreate\"));\n\n  const dialogContainer = React.useRef<HTMLDivElement>(null);\n\n  const handleOk = React.useCallback(() => {\n    props.handleOk(subLayers);\n  }, [props, subLayers]);\n\n  const handleCancel = React.useCallback(() => {\n    props.handleCancel();\n  }, [props]);\n\n  const hasVisibleLayers = () => subLayers.some((entry)=>entry.visible);\n  const hasTooManyVisibleLayers = () => subLayers.filter((entry)=>entry.visible).length > maxSubLayers;\n  const readyToSave = () => hasVisibleLayers();\n  const buttonCluster = [\n    { type: DialogButtonType.OK, onClick: handleOk, disabled: !readyToSave() },\n    { type: DialogButtonType.Cancel, onClick: handleCancel },\n  ];\n\n  function renderWarningMessage(): React.ReactNode {\n    let warningMessage: string | undefined;\n\n    // Get the proper warning message\n    if (!hasVisibleLayers()) {\n      warningMessage = NoLayersSelectedMsg;\n    } else if (hasTooManyVisibleLayers()) {\n      warningMessage = MapLayersUI.localization.getLocalizedString(\"mapLayers:CustomAttach.TooManyLayersSelected\", { layerCount: subLayers.filter((entry)=>entry.visible).length});\n    }\n\n    if (warningMessage !== undefined) {\n      return (\n        <div className=\"map-layer-source-warnMessage\">\n          <Icon className=\"map-layer-source-warnMessage-icon\" iconSpec=\"icon-status-warning\" />\n          <span className=\"map-layer-source-warnMessage-label\">{warningMessage}</span >\n        </div>);\n    }\n    return <></>;\n  }\n\n  return (\n    <div ref={dialogContainer}>\n      <Dialog\n        className=\"map-layer-select-features-dialog\"\n        title={dialogTitle}\n        opened={true}\n        resizable={true}\n        movable={true}\n        modal={true}\n        buttonCluster={buttonCluster}\n        onClose={handleCancel}\n        onEscape={handleCancel}\n        minHeight={minHeight}\n        maxWidth={600}\n        titleStyle={{ paddingLeft: \"10px\" }}\n        footerStyle={{ paddingBottom: \"10px\", paddingRight: \"10px\" }}\n        trapFocus={false}\n      >\n        {/* 'onSubLayerStateChange' is used to trigger hook state change only, no need to update subLayer objects */}\n        <SubLayersTree expandMode=\"full\" checkboxStyle=\"standard\" subLayers={subLayers} onSubLayerStateChange={() => setSubLayers([...subLayers])}/>\n\n        {/* Warning message */}\n        {renderWarningMessage()}\n      </Dialog>\n    </div >\n  );\n}\n"]}
+{"version":3,"file":"MapSelectFeaturesDialog.js","sourceRoot":"","sources":["../../../../src/ui/widget/MapSelectFeaturesDialog.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 Modeless WMTS\n\nimport { Dialog } from \"@itwin/core-react\";\nimport * as React from \"react\";\nimport \"./MapSelectFeaturesDialog.scss\";\n\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { MapLayerSource } from \"@itwin/core-frontend\";\nimport { MapSubLayerProps } from \"@itwin/core-common\";\nimport { SubLayersTree } from \"./SubLayersTree\";\nimport { Button, Icon } from \"@itwin/itwinui-react\";\nimport { SvgStatusWarning } from \"@itwin/itwinui-icons-color-react\";\n\nexport interface MapSelectFeaturesProps {\n  source: MapLayerSource;\n  subLayers: MapSubLayerProps[];\n  handleOk: (subLayers: MapSubLayerProps[]) => void;\n  handleCancel: () => void;\n}\nconst minHeight = 250;\nconst maxSubLayers = 30;\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function MapSelectFeaturesDialog(props: MapSelectFeaturesProps) {\n  const [subLayers, setSubLayers] = React.useState(props.subLayers);\n\n  const dialogContainer = React.useRef<HTMLDivElement>(null);\n\n  const handleOk = React.useCallback(() => {\n    props.handleOk(subLayers);\n  }, [props, subLayers]);\n\n  const handleCancel = React.useCallback(() => {\n    props.handleCancel();\n  }, [props]);\n\n  const hasVisibleLayers = () => subLayers.some((entry)=>entry.visible);\n  const hasTooManyVisibleLayers = () => subLayers.filter((entry)=>entry.visible).length > maxSubLayers;\n  const readyToSave = () => hasVisibleLayers();\n\n  function renderWarningMessage(): React.ReactNode {\n    let warningMessage: string | undefined;\n\n    // Get the proper warning message\n    if (!hasVisibleLayers()) {\n      warningMessage = MapLayersUI.translate(\"CustomAttach.NoLayersSelected\");\n    } else if (hasTooManyVisibleLayers()) {\n      warningMessage = MapLayersUI.translate(\"CustomAttach.TooManyLayersSelected\", { layerCount: subLayers.filter((entry)=>entry.visible).length});\n    }\n\n    return (\n      <div className=\"map-layer-source-warnMessage\">\n        {warningMessage !== undefined && <>\n          <Icon size=\"small\"><SvgStatusWarning></SvgStatusWarning></Icon>\n          <span className=\"map-layer-source-warnMessage-label\">{warningMessage}</span >\n        </>}\n      </div>);\n\n  }\n\n  function getFooter() {\n    return (\n      <div className=\"map-layer-features-footer\">\n        <div className=\"map-layer-features-footer-warnMessage\">\n          {renderWarningMessage()}\n        </div>\n\n        <div className=\"map-layer-features-footer-buttons\">\n          <Button\n            className=\"map-layer-features-footer-button\"\n            styleType='high-visibility'\n            onClick={handleOk}\n            disabled={!readyToSave()}\n          >\n            {MapLayersUI.translate(\"Dialog.Add\")}\n          </Button>\n          <Button\n            className=\"map-layer-features-footer-button\"\n            styleType='default'\n            onClick={handleCancel}\n          >\n            {MapLayersUI.translate(\"Dialog.Cancel\")}\n          </Button>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div ref={dialogContainer}>\n      <Dialog\n        className=\"map-layer-select-features-dialog\"\n        title={MapLayersUI.translate(\"CustomAttach.SelectLayersToCreate\")}\n        opened={true}\n        resizable={true}\n        movable={true}\n        modal={true}\n        footer={getFooter()}\n        onClose={handleCancel}\n        onEscape={handleCancel}\n        minHeight={minHeight}\n        maxWidth={600}\n        titleStyle={{ paddingLeft: \"10px\" }}\n        footerStyle={{ paddingBottom: \"10px\", paddingRight: \"10px\" }}\n        trapFocus={false}\n      >\n        {/* 'onSubLayerStateChange' is used to trigger hook state change only, no need to update subLayer objects */}\n        <SubLayersTree expandMode=\"full\" checkboxStyle=\"standard\" subLayers={subLayers} onSubLayerStateChange={() => setSubLayers([...subLayers])}/>\n\n      </Dialog>\n    </div >\n  );\n}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"MapUrlDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapUrlDialog.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAC4B,cAAc,EACzB,wBAAwB,EAA+C,cAAc,EAC5G,MAAM,sBAAsB,CAAC;AAK9B,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGhD,OAAO,qBAAqB,CAAC;AAE7B,eAAO,MAAM,SAAS;;;;;;CAMrB,CAAC;AAEF,oBAAY,iBAAiB,GAAG,QAAQ,GAAC,UAAU,CAAC;AACpD,UAAU,iBAAiB;IACzB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE,WAAW,KAAK,IAAI,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,eAAe,CAAC,EAAE,eAAe,CAAC;IAGlC,yBAAyB,CAAC,EAAE,kBAAkB,CAAC;IAE/C,oBAAoB,CAAC,EAAE,cAAc,CAAC;CACvC;AAED,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,cAAc,CAAC;IACvB,UAAU,EAAE,wBAAwB,CAAC;CACtC;AAGD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,eA+fpD"}
+{"version":3,"file":"MapUrlDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/MapUrlDialog.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,EAC4B,cAAc,EACzB,wBAAwB,EAA+C,cAAc,EAC5G,MAAM,sBAAsB,CAAC;AAK9B,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGhD,OAAO,qBAAqB,CAAC;AAG7B,eAAO,MAAM,SAAS;;;;;;CAMrB,CAAC;AAEF,oBAAY,iBAAiB,GAAG,QAAQ,GAAC,UAAU,CAAC;AACpD,UAAU,iBAAiB;IACzB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE,WAAW,KAAK,IAAI,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,eAAe,CAAC,EAAE,eAAe,CAAC;IAGlC,yBAAyB,CAAC,EAAE,kBAAkB,CAAC;IAE/C,oBAAoB,CAAC,EAAE,cAAc,CAAC;CACvC;AAED,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,cAAc,CAAC;IACvB,UAAU,EAAE,wBAAwB,CAAC;CACtC;AAGD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,eA0hBpD"}

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

@@ -16,6 +16,7 @@ const mapLayers_1 = require("../../mapLayers");
 const core_bentley_1 = require("@itwin/core-bentley");
 const SelectMapFormat_1 = require("./SelectMapFormat");
 require("./MapUrlDialog.scss");
+const itwinui_icons_color_react_1 = require("@itwin/itwinui-icons-color-react");
 exports.MAP_TYPES = {
     wms: "WMS",
     arcGis: "ArcGIS",
@@ -315,10 +316,10 @@ function MapUrlDialog(props) {
             && !invalidCredentialsProvided
             && (externalLoginUrl === undefined || (externalLoginUrl !== undefined && oauthProcessSucceeded));
     }, [userName, password, mapUrl, mapName, serverRequireCredentials, layerAttachPending, invalidCredentialsProvided, externalLoginUrl, oauthProcessSucceeded]);
-    const buttonCluster = React.useMemo(() => [
-        { type: appui_abstract_1.DialogButtonType.OK, onClick: handleOk, disabled: !readyToSave() },
-        { type: appui_abstract_1.DialogButtonType.Cancel, onClick: handleCancel },
-    ], [readyToSave, handleCancel, handleOk]);
+    // const buttonCluster = React.useMemo(() => [
+    //   { type: DialogButtonType.OK, onClick: handleOk, disabled: !readyToSave() },
+    //   { type: DialogButtonType.Cancel, onClick: handleCancel },
+    // ], [readyToSave, handleCancel, handleOk]);
     const handleOnKeyDown = React.useCallback((event) => {
         if (event.key === appui_abstract_1.SpecialKey.Enter) {
             if (readyToSave())
@@ -388,7 +389,8 @@ function MapUrlDialog(props) {
         }
         if (warningMessage !== undefined) {
             return (React.createElement("div", { className: "map-layer-source-warnMessage" },
-                React.createElement(core_react_1.Icon, { className: "map-layer-source-warnMessage-icon", iconSpec: "icon-status-warning" }),
+                React.createElement(itwinui_react_1.Icon, { size: "small" },
+                    React.createElement(itwinui_icons_color_react_1.SvgStatusWarning, null)),
                 React.createElement("span", { className: "map-layer-source-warnMessage-label" }, warningMessage),
                 extraNode));
         }
@@ -400,8 +402,15 @@ function MapUrlDialog(props) {
     // Use a hook to display the popup.
     // The display of the popup is controlled by the 'showOauthPopup' state variable.
     (0, core_react_1.useCrossOriginPopup)(showOauthPopup, externalLoginUrl, externalLoginTitle, 450, 450, handleOAuthPopupClose);
+    function getFooter() {
+        return (React.createElement("div", { className: "map-layer-source-footer" },
+            React.createElement("div", { className: "map-layer-source-footer-status" }),
+            React.createElement("div", null,
+                React.createElement(itwinui_react_1.Button, { className: "map-layer-features-footer-button", styleType: 'high-visibility', onClick: handleOk, disabled: !readyToSave() }, props?.mapLayerSourceToEdit ? mapLayers_1.MapLayersUI.translate("Dialog.Edit") : mapLayers_1.MapLayersUI.translate("Dialog.Add")),
+                React.createElement(itwinui_react_1.Button, { className: "map-layer-source-footer-button", styleType: 'default', onClick: handleCancel }, mapLayers_1.MapLayersUI.translate("Dialog.Cancel")))));
+    }
     return (React.createElement("div", { ref: dialogContainer },
-        React.createElement(core_react_1.Dialog, { className: "map-layer-url-dialog", title: dialogTitle, opened: true, resizable: true, movable: true, modal: true, buttonCluster: buttonCluster, onClose: handleCancel, onEscape: handleCancel, minHeight: 120, maxWidth: 600, titleStyle: { paddingLeft: "10px" }, footerStyle: { paddingBottom: "10px", paddingRight: "10px" }, trapFocus: false },
+        React.createElement(core_react_1.Dialog, { className: "map-layer-url-dialog", title: dialogTitle, opened: true, resizable: true, movable: true, modal: true, footer: getFooter(), onClose: handleCancel, onEscape: handleCancel, minHeight: 120, maxWidth: 600, titleStyle: { paddingLeft: "10px" }, footerStyle: { paddingBottom: "10px", paddingRight: "10px" }, trapFocus: false },
             React.createElement("div", { className: "map-layer-url-dialog-content" },
                 React.createElement("div", { className: "map-layer-source-url" },
                     React.createElement("span", { className: "map-layer-source-label" }, typeLabel),