@itwin/map-layers 6.0.7 → 6.0.9

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":["/*---------------------------------------------------------------------------------------------\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\nimport \"./MapLayerDroppable.scss\";\nimport * as React from \"react\";\nimport { Draggable, Droppable } from \"react-beautiful-dnd\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport { ImageMapLayerSettings } from \"@itwin/core-common\";\nimport { IModelApp, MapLayerImageryProviderStatus, MapTileTreeScaleRangeVisibility, NotifyMessageDetails, OutputMessagePriority } from \"@itwin/core-frontend\";\nimport { SvgStatusWarning, SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { Checkbox, IconButton } from \"@itwin/itwinui-react\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { AttachLayerButtonType, AttachLayerPopupButton } from \"./AttachLayerPopupButton\";\nimport { MapLayerSettingsMenu } from \"./MapLayerSettingsMenu\";\nimport { MapUrlDialog } from \"./MapUrlDialog\";\nimport { SubLayersPopupButton } from \"./SubLayersPopupButton\";\n\nimport type { DraggableChildrenFn, DroppableProps , DroppableProvided , DroppableStateSnapshot } from \"react-beautiful-dnd\";\nimport type { SubLayerId } from \"@itwin/core-common\";\nimport type { MapLayerIndex, ScreenViewport } from \"@itwin/core-frontend\";\nimport type { MapLayerOptions, StyleMapLayerSettings } from \"../Interfaces\";\nimport type { SourceState } from \"./MapUrlDialog\";\n\n\n/** @internal */\ninterface MapLayerDroppableProps {\n  isOverlay: boolean;\n  layersList?: StyleMapLayerSettings[];\n  mapLayerOptions?: MapLayerOptions;\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// eslint-disable-next-line @typescript-eslint/unbound-method\nconst StrictModeDroppable = ({ children, ...props }: DroppableProps) =>{\n  const [enabled, setEnabled] = React.useState(false);\n  React.useEffect(() => {\n    const animation = requestAnimationFrame(() => setEnabled(true));\n    return () => {\n      cancelAnimationFrame(animation);\n      setEnabled(false);\n    };\n  }, []);\n  if (!enabled) {\n    return null;\n  }\n  return <Droppable {...props}>{children}</Droppable>;\n};\n\nconst changeVisibilityByElementId = (element: Element | null, visible: boolean) => {\n  if (element) {\n    element.setAttribute(\"style\", `visibility: ${visible ? \"visible\" : \"hidden\"}`);\n  }\n};\n\n/** @internal */\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, {\n        index: mapLayerStyleIdx,\n        isOverlay: activeLayer.isOverlay,\n      });\n    }\n  };\n\n  const handleOk = React.useCallback(\n    (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    },\n    [props],\n  );\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\n        className=\"map-manager-source-item\"\n        data-id={rubric.source.index}\n        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\n          data-testid={\"select-item-checkbox\"}\n          checked={activeLayer.selected}\n          onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n            activeLayer.selected = event.target.checked;\n            props.onItemSelected(props.isOverlay, rubric.source.index);\n          }}\n        ></Checkbox>\n        {/* Visibility icon */}\n        <IconButton\n          disabled={props.disabled}\n          size=\"small\"\n          styleType=\"borderless\"\n          className=\"map-manager-item-visibility\"\n          label={toggleVisibility}\n          onClick={() => {\n            props.onItemVisibilityToggleClicked(activeLayer);\n          }}\n        >\n          {activeLayer.visible ? <SvgVisibilityShow data-testid=\"layer-visibility-icon-show\" /> : <SvgVisibilityHide data-testid=\"layer-visibility-icon-hide\" />}\n        </IconButton>\n\n        {/* Label */}\n        <span\n          className={props.disabled || outOfRange ? \"map-manager-item-label-disabled\" : \"map-manager-item-label\"}\n          title={outOfRange ? outOfRangeTitle : undefined}\n          {...dragProvided.dragHandleProps}\n        >\n          {activeLayer.name}\n          {/* eslint-disable-next-line @itwin/no-internal */}\n          {activeLayer.provider?.status === MapLayerImageryProviderStatus.RequireAuth && (\n            <IconButton\n              disabled={props.disabled}\n              size=\"small\"\n              styleType=\"borderless\"\n              onClick={() => {\n                const indexInDisplayStyle = props.activeViewport?.displayStyle.findMapLayerIndexByNameAndSource(\n                  activeLayer.name,\n                  activeLayer.source,\n                  activeLayer.isOverlay,\n                );\n                if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {\n                  const index = { index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay };\n                  const layer = props.activeViewport.displayStyle.mapLayerAtIndex(index);\n                  if (layer instanceof ImageMapLayerSettings) {\n                    UiFramework.dialogs.modal.open(\n                      <MapUrlDialog\n                        activeViewport={props.activeViewport}\n                        signInModeArgs={{ layer }}\n                        onOkResult={(sourceState?: SourceState) => handleOk(index, sourceState)}\n                        onCancelResult={() => {\n                          UiFramework.dialogs.modal.close();\n                        }}\n                        mapLayerOptions={props.mapLayerOptions}\n                      />,\n                    );\n                  }\n                }\n              }}\n              label={requireAuthTooltip}\n            >\n              <SvgStatusWarning />\n            </IconButton>\n          )}\n        </span>\n\n        {/* SubLayersPopupButton */}\n        <div id=\"MapLayerSettingsSubLayersMenu\" className=\"map-manager-item-sub-layer-container map-manager-hidden\">\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) => {\n                onSubLayerStateChange(activeLayer, subLayerId, isSelected);\n              }}\n            />\n          )}\n        </div>\n        {/* eslint-disable-next-line @itwin/no-internal */}\n        {activeLayer.provider?.status === MapLayerImageryProviderStatus.RequireAuth && (\n          <IconButton\n            disabled={props.disabled}\n            size=\"small\"\n            styleType=\"borderless\"\n            onClick={() => {\n              const indexInDisplayStyle = props.activeViewport?.displayStyle.findMapLayerIndexByNameAndSource(\n                activeLayer.name,\n                activeLayer.source,\n                activeLayer.isOverlay,\n              );\n              if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {\n                const index = { index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay };\n                const layer = props.activeViewport.displayStyle.mapLayerAtIndex(index);\n                if (layer instanceof ImageMapLayerSettings) {\n                  UiFramework.dialogs.modal.open(\n                    <MapUrlDialog\n                      activeViewport={props.activeViewport}\n                      signInModeArgs={{ layer }}\n                      onOkResult={(sourceState?: SourceState) => handleOk(index, sourceState)}\n                      onCancelResult={() => {\n                        UiFramework.dialogs.modal.close();\n                      }}\n                      mapLayerOptions={props.mapLayerOptions}\n                    />,\n                  );\n                }\n              }\n            }}\n            label={requireAuthTooltip}\n          >\n            <SvgStatusWarning />\n          </IconButton>\n        )}\n        <div id=\"MapLayerSettingsMenuWrapper\" className=\"map-manager-hidden\">\n          <MapLayerSettingsMenu\n            activeViewport={props.activeViewport}\n            mapLayerSettings={activeLayer}\n            onMenuItemSelection={props.onMenuItemSelected}\n            disabled={props.disabled}\n          />\n        </div>\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      ));\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    }\n    return node;\n  }\n\n  function renderDraggable(dropProvided: DroppableProvided, dropSnapshot: DroppableStateSnapshot): React.ReactElement<HTMLElement> {\n    return (\n      <div\n        className={`map-manager-attachments${dropSnapshot.isDraggingOver && containsLayer ? \" is-dragging-map-over\" : \"\"}`}\n        ref={dropProvided.innerRef}\n        {...dropProvided.droppableProps}\n      >\n        {renderDraggableContent(dropSnapshot)}\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        <div className={containsLayer ? undefined : \"map-manager-display-none\"}>{dropProvided.placeholder}</div>\n      </div>\n    );\n  }\n\n  return (\n    <StrictModeDroppable droppableId={droppableId} renderClone={renderItem} getContainerForClone={props.getContainerForClone as any}>\n      {renderDraggable}\n    </StrictModeDroppable>\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\nimport \"./MapLayerDroppable.scss\";\nimport * as React from \"react\";\nimport { Draggable, Droppable } from \"react-beautiful-dnd\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport { ImageMapLayerSettings } from \"@itwin/core-common\";\nimport { IModelApp, MapLayerImageryProviderStatus, MapTileTreeScaleRangeVisibility, NotifyMessageDetails, OutputMessagePriority } from \"@itwin/core-frontend\";\nimport { SvgStatusWarning, SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { Checkbox, IconButton } from \"@itwin/itwinui-react\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { AttachLayerButtonType, AttachLayerPopupButton } from \"./AttachLayerPopupButton\";\nimport { MapLayerSettingsMenu } from \"./MapLayerSettingsMenu\";\nimport { MapUrlDialog } from \"./MapUrlDialog\";\nimport { SubLayersPopupButton } from \"./SubLayersPopupButton\";\n\nimport type { DraggableChildrenFn, DroppableProps , DroppableProvided , DroppableStateSnapshot } from \"react-beautiful-dnd\";\nimport type { SubLayerId } from \"@itwin/core-common\";\nimport type { MapLayerIndex, ScreenViewport } from \"@itwin/core-frontend\";\nimport type { MapLayerOptions, StyleMapLayerSettings } from \"../Interfaces\";\nimport type { SourceState } from \"./MapUrlDialog\";\n\n\n/** @internal */\ninterface MapLayerDroppableProps {\n  isOverlay: boolean;\n  layersList?: StyleMapLayerSettings[];\n  mapLayerOptions?: MapLayerOptions;\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// eslint-disable-next-line @typescript-eslint/unbound-method\nconst StrictModeDroppable = ({ children, ...props }: DroppableProps) =>{\n  const [enabled, setEnabled] = React.useState(false);\n  React.useEffect(() => {\n    const animation = requestAnimationFrame(() => setEnabled(true));\n    return () => {\n      cancelAnimationFrame(animation);\n      setEnabled(false);\n    };\n  }, []);\n  if (!enabled) {\n    return null;\n  }\n  return <Droppable {...props}>{children}</Droppable>;\n};\n\n\n/** @internal */\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, {\n        index: mapLayerStyleIdx,\n        isOverlay: activeLayer.isOverlay,\n      });\n    }\n  };\n\n  const handleOk = React.useCallback(\n    (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    },\n    [props],\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\n        className=\"map-manager-source-item\"\n        data-id={rubric.source.index}\n        key={activeLayer.name}\n        {...dragProvided.draggableProps}\n        ref={dragProvided.innerRef}\n      >\n        {/* Checkbox */}\n        <Checkbox\n          data-testid={\"select-item-checkbox\"}\n          checked={activeLayer.selected}\n          onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n            activeLayer.selected = event.target.checked;\n            props.onItemSelected(props.isOverlay, rubric.source.index);\n          }}\n        ></Checkbox>\n        {/* Visibility icon */}\n        <IconButton\n          disabled={props.disabled}\n          size=\"small\"\n          styleType=\"borderless\"\n          className=\"map-manager-item-visibility\"\n          label={toggleVisibility}\n          onClick={() => {\n            props.onItemVisibilityToggleClicked(activeLayer);\n          }}\n        >\n          {activeLayer.visible ? <SvgVisibilityShow data-testid=\"layer-visibility-icon-show\" /> : <SvgVisibilityHide data-testid=\"layer-visibility-icon-hide\" />}\n        </IconButton>\n\n        {/* Label */}\n        <span\n          className={props.disabled || outOfRange ? \"map-manager-item-label-disabled\" : \"map-manager-item-label\"}\n          title={outOfRange ? outOfRangeTitle : undefined}\n          {...dragProvided.dragHandleProps}\n        >\n          {activeLayer.name}\n          {/* eslint-disable-next-line @itwin/no-internal */}\n          {activeLayer.provider?.status === MapLayerImageryProviderStatus.RequireAuth && (\n            <IconButton\n              disabled={props.disabled}\n              size=\"small\"\n              styleType=\"borderless\"\n              onClick={() => {\n                const indexInDisplayStyle = props.activeViewport?.displayStyle.findMapLayerIndexByNameAndSource(\n                  activeLayer.name,\n                  activeLayer.source,\n                  activeLayer.isOverlay,\n                );\n                if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {\n                  const index = { index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay };\n                  const layer = props.activeViewport.displayStyle.mapLayerAtIndex(index);\n                  if (layer instanceof ImageMapLayerSettings) {\n                    UiFramework.dialogs.modal.open(\n                      <MapUrlDialog\n                        activeViewport={props.activeViewport}\n                        signInModeArgs={{ layer }}\n                        onOkResult={(sourceState?: SourceState) => handleOk(index, sourceState)}\n                        onCancelResult={() => {\n                          UiFramework.dialogs.modal.close();\n                        }}\n                        mapLayerOptions={props.mapLayerOptions}\n                      />,\n                    );\n                  }\n                }\n              }}\n              label={requireAuthTooltip}\n            >\n              <SvgStatusWarning />\n            </IconButton>\n          )}\n        </span>\n\n        {/* SubLayersPopupButton */}\n        <div className=\"map-manager-item-sub-layer-container map-layer-settings-sublayers-menu\">\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) => {\n                onSubLayerStateChange(activeLayer, subLayerId, isSelected);\n              }}\n            />\n          )}\n        </div>\n        {/* eslint-disable-next-line @itwin/no-internal */}\n        {activeLayer.provider?.status === MapLayerImageryProviderStatus.RequireAuth && (\n          <IconButton\n            disabled={props.disabled}\n            size=\"small\"\n            styleType=\"borderless\"\n            onClick={() => {\n              const indexInDisplayStyle = props.activeViewport?.displayStyle.findMapLayerIndexByNameAndSource(\n                activeLayer.name,\n                activeLayer.source,\n                activeLayer.isOverlay,\n              );\n              if (indexInDisplayStyle !== undefined && indexInDisplayStyle >= 0) {\n                const index = { index: indexInDisplayStyle, isOverlay: activeLayer.isOverlay };\n                const layer = props.activeViewport.displayStyle.mapLayerAtIndex(index);\n                if (layer instanceof ImageMapLayerSettings) {\n                  UiFramework.dialogs.modal.open(\n                    <MapUrlDialog\n                      activeViewport={props.activeViewport}\n                      signInModeArgs={{ layer }}\n                      onOkResult={(sourceState?: SourceState) => handleOk(index, sourceState)}\n                      onCancelResult={() => {\n                        UiFramework.dialogs.modal.close();\n                      }}\n                      mapLayerOptions={props.mapLayerOptions}\n                    />,\n                  );\n                }\n              }\n            }}\n            label={requireAuthTooltip}\n          >\n            <SvgStatusWarning />\n          </IconButton>\n        )}\n        <div className=\"map-layer-settings-menu-wrapper\">\n          <MapLayerSettingsMenu\n            activeViewport={props.activeViewport}\n            mapLayerSettings={activeLayer}\n            onMenuItemSelection={props.onMenuItemSelected}\n            disabled={props.disabled}\n          />\n        </div>\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      ));\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    }\n    return node;\n  }\n\n  function renderDraggable(dropProvided: DroppableProvided, dropSnapshot: DroppableStateSnapshot): React.ReactElement<HTMLElement> {\n    return (\n      <div\n        className={`map-manager-attachments${dropSnapshot.isDraggingOver && containsLayer ? \" is-dragging-map-over\" : \"\"}`}\n        ref={dropProvided.innerRef}\n        {...dropProvided.droppableProps}\n      >\n        {renderDraggableContent(dropSnapshot)}\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        <div className={containsLayer ? undefined : \"map-manager-display-none\"}>{dropProvided.placeholder}</div>\n      </div>\n    );\n  }\n\n  return (\n    <StrictModeDroppable droppableId={droppableId} renderClone={renderItem} getContainerForClone={props.getContainerForClone as any}>\n      {renderDraggable}\n    </StrictModeDroppable>\n  );\n}\n"]}

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

@@ -10,3 +10,18 @@
 .map-manager-display-none {
   display: none;
 }
+
+// Hover-based visibility for settings menus
+.map-manager-source-item {
+  .map-layer-settings-menu-wrapper,
+  .map-layer-settings-sublayers-menu {
+    visibility: hidden;
+  }
+
+  &:hover {
+    .map-layer-settings-menu-wrapper,
+    .map-layer-settings-sublayers-menu {
+      visibility: visible;
+    }
+  }
+}

package/lib/esm/BasemapColorPreferences.d.ts

@@ -0,0 +1,53 @@
+import type { GuidString } from "@itwin/core-bentley";
+/** @internal */
+export interface BasemapColorPreferencesContent {
+    customColor?: string;
+    activeColor?: string;
+}
+/** A wrapper around user preferences to store basemap solid fill colors.
+ * Supports both user-selected custom colors and active colors (which may be preset or custom).
+ * @internal
+ */
+export declare class BasemapColorPreferences {
+    private static readonly _preferenceNamespace;
+    private static readonly _preferenceKey;
+    /** Store the user-selected custom basemap color preference.
+     * This preserves the user's custom color choice even when they switch to presets.
+     * @param color TBGR color value as string
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional, if not provided stores at iTwin level)
+     */
+    static saveCustomColor(color: string, iTwinId: GuidString, iModelId?: GuidString): Promise<boolean>;
+    /** Store the currently active basemap color.
+     * This tracks what color is currently being used, whether it's custom or preset.
+     * @param color TBGR color value as string
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional, if not provided stores at iTwin level)
+     */
+    static saveActiveColor(color: string, iTwinId: GuidString, iModelId?: GuidString): Promise<boolean>;
+    /** Get the user's selected custom color.
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     * @returns The stored user-selected color as TBGR string, or undefined if not found
+     */
+    static getCustomColor(iTwinId: GuidString, iModelId?: GuidString): Promise<string | undefined>;
+    /** Get the currently active color.
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     * @returns The stored active color as TBGR string, or undefined if not found
+     */
+    static getActiveColor(iTwinId: GuidString, iModelId?: GuidString): Promise<string | undefined>;
+    /** Get all color preferences.
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     * @returns The stored preferences, or undefined if not found
+     */
+    static getPreferences(iTwinId: GuidString, iModelId?: GuidString): Promise<BasemapColorPreferencesContent | undefined>;
+    /** Save color preferences.
+     * @param preferences The preferences to save
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     */
+    private static savePreferences;
+}
+//# sourceMappingURL=BasemapColorPreferences.d.ts.map

package/lib/esm/BasemapColorPreferences.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasemapColorPreferences.d.ts","sourceRoot":"","sources":["../../src/BasemapColorPreferences.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEtD,gBAAgB;AAChB,MAAM,WAAW,8BAA8B;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;GAGG;AACH,qBAAa,uBAAuB;IAClC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,oBAAoB,CAAkC;IAC9E,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAqB;IAE3D;;;;;OAKG;WACiB,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC;IAahH;;;;;OAKG;WACiB,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC;IAahH;;;;OAIG;WACiB,cAAc,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC;IAK3G;;;;OAIG;WACiB,cAAc,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC;IAK3G;;;;OAIG;WACiB,cAAc,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,8BAA8B,GAAG,SAAS,CAAC;IAyCnI;;;;OAIG;mBACkB,eAAe;CAsBrC"}

package/lib/esm/BasemapColorPreferences.js

@@ -0,0 +1,138 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import { IModelApp } from "@itwin/core-frontend";
+import { MapLayersUI } from "./mapLayers";
+/** A wrapper around user preferences to store basemap solid fill colors.
+ * Supports both user-selected custom colors and active colors (which may be preset or custom).
+ * @internal
+ */
+export class BasemapColorPreferences {
+    static _preferenceNamespace = "BasemapColor-SettingsService";
+    static _preferenceKey = "solidFillColors";
+    /** Store the user-selected custom basemap color preference.
+     * This preserves the user's custom color choice even when they switch to presets.
+     * @param color TBGR color value as string
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional, if not provided stores at iTwin level)
+     */
+    static async saveCustomColor(color, iTwinId, iModelId) {
+        try {
+            const existing = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);
+            const colorPreference = {
+                customColor: color,
+                activeColor: existing?.activeColor ?? color, // Keep existing active or set to this color
+            };
+            return await BasemapColorPreferences.savePreferences(colorPreference, iTwinId, iModelId);
+        }
+        catch {
+            return false;
+        }
+    }
+    /** Store the currently active basemap color.
+     * This tracks what color is currently being used, whether it's custom or preset.
+     * @param color TBGR color value as string
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional, if not provided stores at iTwin level)
+     */
+    static async saveActiveColor(color, iTwinId, iModelId) {
+        try {
+            const existing = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);
+            const colorPreference = {
+                customColor: existing?.customColor, // Preserve user's custom color
+                activeColor: color,
+            };
+            return await BasemapColorPreferences.savePreferences(colorPreference, iTwinId, iModelId);
+        }
+        catch {
+            return false;
+        }
+    }
+    /** Get the user's selected custom color.
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     * @returns The stored user-selected color as TBGR string, or undefined if not found
+     */
+    static async getCustomColor(iTwinId, iModelId) {
+        const preferences = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);
+        return preferences?.customColor;
+    }
+    /** Get the currently active color.
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     * @returns The stored active color as TBGR string, or undefined if not found
+     */
+    static async getActiveColor(iTwinId, iModelId) {
+        const preferences = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);
+        return preferences?.activeColor;
+    }
+    /** Get all color preferences.
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     * @returns The stored preferences, or undefined if not found
+     */
+    static async getPreferences(iTwinId, iModelId) {
+        if (!MapLayersUI.iTwinConfig) {
+            return undefined;
+        }
+        try {
+            const accessToken = undefined !== IModelApp.authorizationClient ? await IModelApp.authorizationClient.getAccessToken() : undefined;
+            // Try to get from iModel level first (more specific)
+            if (iModelId) {
+                try {
+                    const iModelResult = await MapLayersUI.iTwinConfig.get({
+                        accessToken,
+                        namespace: BasemapColorPreferences._preferenceNamespace,
+                        key: BasemapColorPreferences._preferenceKey,
+                        iTwinId,
+                        iModelId,
+                    });
+                    if (iModelResult) {
+                        return iModelResult;
+                    }
+                }
+                catch {
+                    // Fall through to try iTwin level
+                }
+            }
+            // Try iTwin level
+            const iTwinResult = await MapLayersUI.iTwinConfig.get({
+                accessToken,
+                namespace: BasemapColorPreferences._preferenceNamespace,
+                key: BasemapColorPreferences._preferenceKey,
+                iTwinId,
+            });
+            return iTwinResult;
+        }
+        catch {
+            return undefined;
+        }
+    }
+    /** Save color preferences.
+     * @param preferences The preferences to save
+     * @param iTwinId iTwin identifier
+     * @param iModelId iModel identifier (optional)
+     */
+    static async savePreferences(preferences, iTwinId, iModelId) {
+        if (!MapLayersUI.iTwinConfig) {
+            return false;
+        }
+        try {
+            const accessToken = undefined !== IModelApp.authorizationClient ? await IModelApp.authorizationClient.getAccessToken() : undefined;
+            await MapLayersUI.iTwinConfig.save({
+                accessToken,
+                content: preferences,
+                namespace: BasemapColorPreferences._preferenceNamespace,
+                key: BasemapColorPreferences._preferenceKey,
+                iTwinId,
+                iModelId,
+            });
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+}
+//# sourceMappingURL=BasemapColorPreferences.js.map

package/lib/esm/BasemapColorPreferences.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasemapColorPreferences.js","sourceRoot":"","sources":["../../src/BasemapColorPreferences.ts"],"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 { IModelApp } from \"@itwin/core-frontend\";\nimport { MapLayersUI } from \"./mapLayers\";\n\nimport type { GuidString } from \"@itwin/core-bentley\";\n\n/** @internal */\nexport interface BasemapColorPreferencesContent {\n  customColor?: string; // TBGR color value as string - user's custom color choice\n  activeColor?: string; // TBGR color value as string - currently active color\n}\n\n/** A wrapper around user preferences to store basemap solid fill colors.\n * Supports both user-selected custom colors and active colors (which may be preset or custom).\n * @internal\n */\nexport class BasemapColorPreferences {\n  private static readonly _preferenceNamespace = \"BasemapColor-SettingsService\";\n  private static readonly _preferenceKey = \"solidFillColors\";\n\n  /** Store the user-selected custom basemap color preference.\n   * This preserves the user's custom color choice even when they switch to presets.\n   * @param color TBGR color value as string\n   * @param iTwinId iTwin identifier\n   * @param iModelId iModel identifier (optional, if not provided stores at iTwin level)\n   */\n  public static async saveCustomColor(color: string, iTwinId: GuidString, iModelId?: GuidString): Promise<boolean> {\n    try {\n      const existing = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);\n      const colorPreference: BasemapColorPreferencesContent = {\n        customColor: color,\n        activeColor: existing?.activeColor ?? color, // Keep existing active or set to this color\n      };\n      return await BasemapColorPreferences.savePreferences(colorPreference, iTwinId, iModelId);\n    } catch {\n      return false;\n    }\n  }\n\n  /** Store the currently active basemap color.\n   * This tracks what color is currently being used, whether it's custom or preset.\n   * @param color TBGR color value as string\n   * @param iTwinId iTwin identifier\n   * @param iModelId iModel identifier (optional, if not provided stores at iTwin level)\n   */\n  public static async saveActiveColor(color: string, iTwinId: GuidString, iModelId?: GuidString): Promise<boolean> {\n    try {\n      const existing = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);\n      const colorPreference: BasemapColorPreferencesContent = {\n        customColor: existing?.customColor, // Preserve user's custom color\n        activeColor: color,\n      };\n      return await BasemapColorPreferences.savePreferences(colorPreference, iTwinId, iModelId);\n    } catch {\n      return false;\n    }\n  }\n\n  /** Get the user's selected custom color.\n   * @param iTwinId iTwin identifier\n   * @param iModelId iModel identifier (optional)\n   * @returns The stored user-selected color as TBGR string, or undefined if not found\n   */\n  public static async getCustomColor(iTwinId: GuidString, iModelId?: GuidString): Promise<string | undefined> {\n    const preferences = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);\n    return preferences?.customColor;\n  }\n\n  /** Get the currently active color.\n   * @param iTwinId iTwin identifier\n   * @param iModelId iModel identifier (optional)\n   * @returns The stored active color as TBGR string, or undefined if not found\n   */\n  public static async getActiveColor(iTwinId: GuidString, iModelId?: GuidString): Promise<string | undefined> {\n    const preferences = await BasemapColorPreferences.getPreferences(iTwinId, iModelId);\n    return preferences?.activeColor;\n  }\n\n  /** Get all color preferences.\n   * @param iTwinId iTwin identifier\n   * @param iModelId iModel identifier (optional)\n   * @returns The stored preferences, or undefined if not found\n   */\n  public static async getPreferences(iTwinId: GuidString, iModelId?: GuidString): Promise<BasemapColorPreferencesContent | undefined> {\n    if (!MapLayersUI.iTwinConfig) {\n      return undefined;\n    }\n\n    try {\n      const accessToken = undefined !== IModelApp.authorizationClient ? await IModelApp.authorizationClient.getAccessToken() : undefined;\n\n      // Try to get from iModel level first (more specific)\n      if (iModelId) {\n        try {\n          const iModelResult = await MapLayersUI.iTwinConfig.get({\n            accessToken,\n            namespace: BasemapColorPreferences._preferenceNamespace,\n            key: BasemapColorPreferences._preferenceKey,\n            iTwinId,\n            iModelId,\n          });\n\n          if (iModelResult) {\n            return iModelResult;\n          }\n        } catch {\n          // Fall through to try iTwin level\n        }\n      }\n\n      // Try iTwin level\n      const iTwinResult = await MapLayersUI.iTwinConfig.get({\n        accessToken,\n        namespace: BasemapColorPreferences._preferenceNamespace,\n        key: BasemapColorPreferences._preferenceKey,\n        iTwinId,\n      });\n\n      return iTwinResult;\n    } catch {\n      return undefined;\n    }\n  }\n\n  /** Save color preferences.\n   * @param preferences The preferences to save\n   * @param iTwinId iTwin identifier\n   * @param iModelId iModel identifier (optional)\n   */\n  private static async savePreferences(preferences: BasemapColorPreferencesContent, iTwinId: GuidString, iModelId?: GuidString): Promise<boolean> {\n    if (!MapLayersUI.iTwinConfig) {\n      return false;\n    }\n\n    try {\n      const accessToken = undefined !== IModelApp.authorizationClient ? await IModelApp.authorizationClient.getAccessToken() : undefined;\n\n      await MapLayersUI.iTwinConfig.save({\n        accessToken,\n        content: preferences,\n        namespace: BasemapColorPreferences._preferenceNamespace,\n        key: BasemapColorPreferences._preferenceKey,\n        iTwinId,\n        iModelId,\n      });\n\n      return true;\n    } catch {\n      return false;\n    }\n  }\n}\n"]}

package/lib/esm/ui/widget/BasemapPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BasemapPanel.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/BasemapPanel.tsx"],"names":[],"mappings":"AAMA,OAAO,qBAAqB,CAAC;AAmB7B,UAAU,iBAAiB;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,gBAAgB;AAChB,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAsVpD"}
+{"version":3,"file":"BasemapPanel.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/BasemapPanel.tsx"],"names":[],"mappings":"AAMA,OAAO,qBAAqB,CAAC;AAiC7B,UAAU,iBAAiB;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,gBAAgB;AAChB,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAwYpD"}

package/lib/esm/ui/widget/BasemapPanel.js

@@ -10,9 +10,21 @@ import { BackgroundMapType, BaseLayerSettings, BaseMapLayerSettings, ColorByName
 import { IModelApp } from "@itwin/core-frontend";
 import { SvgVisibilityHide, SvgVisibilityShow } from "@itwin/itwinui-icons-react";
 import { ColorBuilder, ColorInputPanel, ColorPalette, ColorPicker, ColorSwatch, ColorValue, IconButton, Popover, Select } from "@itwin/itwinui-react";
+import { BasemapColorPreferences } from "../../BasemapColorPreferences";
 import { MapLayersUI } from "../../mapLayers";
 import { useSourceMapContext } from "./MapLayerManager";
 import { TransparencyPopupButton } from "./TransparencyPopupButton";
+// Define preset colors in a single place to avoid duplication
+const PRESET_COLORS = [
+    ColorValue.fromTbgr(ColorByName.grey),
+    ColorValue.fromTbgr(ColorByName.lightGrey),
+    ColorValue.fromTbgr(ColorByName.darkGrey),
+    ColorValue.fromTbgr(ColorByName.lightBlue),
+    ColorValue.fromTbgr(ColorByName.lightGreen),
+    ColorValue.fromTbgr(ColorByName.darkGreen),
+    ColorValue.fromTbgr(ColorByName.tan),
+    ColorValue.fromTbgr(ColorByName.darkBrown),
+];
 const customBaseMapValue = "customBaseMap";
 /** @internal */
 export function BasemapPanel(props) {
@@ -56,7 +68,7 @@ export function BasemapPanel(props) {
                 return mapImagery.backgroundBase.transparency;
             }
             else if (mapImagery.backgroundBase instanceof ColorDef) {
-                return mapImagery.backgroundBase.getAlpha() / 255;
+                return 1.0 - (mapImagery.backgroundBase.getAlpha() / 255);
             }
             else {
                 return 0;
@@ -121,8 +133,9 @@ export function BasemapPanel(props) {
             }
         }
         else if (baseMap instanceof ColorDef) {
-            if (baseMap.getAlpha() !== baseMapTransparencyValue) {
-                setBaseMapTransparencyValue(baseMap.getAlpha() / 255);
+            const transparency = 1.0 - (baseMap.getAlpha() / 255);
+            if (transparency !== baseMapTransparencyValue) {
+                setBaseMapTransparencyValue(transparency);
             }
         }
     }, [baseMapTransparencyValue, baseMapVisible, selectedBaseMap, updateBaseMapOptions]);
@@ -157,16 +170,55 @@ export function BasemapPanel(props) {
             setCustomBaseMap(selectedBaseMap);
         }
     }, [baseMapOptions, extraFormats, selectedBaseMap]);
-    const [presetColors] = React.useState([
-        ColorValue.fromTbgr(ColorByName.grey),
-        ColorValue.fromTbgr(ColorByName.lightGrey),
-        ColorValue.fromTbgr(ColorByName.darkGrey),
-        ColorValue.fromTbgr(ColorByName.lightBlue),
-        ColorValue.fromTbgr(ColorByName.lightGreen),
-        ColorValue.fromTbgr(ColorByName.darkGreen),
-        ColorValue.fromTbgr(ColorByName.tan),
-        ColorValue.fromTbgr(ColorByName.darkBrown),
-    ]);
+    const getPresetColorsWithSaved = React.useCallback(async () => {
+        const defaultColors = [...PRESET_COLORS];
+        // Add saved custom color from preferences as the first color if available
+        try {
+            const iModel = activeViewport?.iModel;
+            if (iModel?.iTwinId) {
+                const savedColor = await BasemapColorPreferences.getCustomColor(iModel.iTwinId, iModel.iModelId);
+                if (savedColor) {
+                    const savedColorValue = ColorValue.fromTbgr(Number(savedColor));
+                    // Remove the saved color from default colors if it exists there
+                    const filteredColors = defaultColors.filter(color => color.toTbgr() !== savedColorValue.toTbgr());
+                    // Always put the saved color as the first color
+                    return [savedColorValue, ...filteredColors];
+                }
+            }
+        }
+        catch {
+            // Silently ignore preferences errors
+        }
+        return defaultColors;
+    }, [activeViewport]);
+    const [presetColors, setPresetColors] = React.useState(() => [...PRESET_COLORS]);
+    // Load saved color on component mount and when activeViewport changes
+    React.useEffect(() => {
+        const loadSavedColor = async () => {
+            const colors = await getPresetColorsWithSaved();
+            setPresetColors(colors);
+        };
+        void loadSavedColor();
+    }, [activeViewport, getPresetColorsWithSaved]);
+    // Persist a custom (non-preset) basemap color to user preferences and refresh preset list
+    const saveCustomBasemapColorPreference = React.useCallback(async (selectedColorTbgr, isPresetColor) => {
+        // Only save custom colors to preferences - preset colors don't overwrite user's custom color
+        if (isPresetColor)
+            return;
+        try {
+            const iModel = activeViewport?.iModel;
+            if (iModel?.iTwinId) {
+                const saved = await BasemapColorPreferences.saveCustomColor(selectedColorTbgr.toString(), iModel.iTwinId, iModel.iModelId);
+                if (saved) {
+                    const colors = await getPresetColorsWithSaved();
+                    setPresetColors(colors);
+                }
+            }
+        }
+        catch {
+            // Silently ignore preferences errors
+        }
+    }, [activeViewport, getPresetColorsWithSaved]);
     const baseIsColor = React.useMemo(() => selectedBaseMap instanceof ColorDef, [selectedBaseMap]);
     const baseIsMap = React.useMemo(() => !baseIsColor && selectedBaseMap !== undefined, [baseIsColor, selectedBaseMap]);
     // bgColor is a 32 bit number represented in TBGR format
@@ -212,9 +264,14 @@ export function BasemapPanel(props) {
             // change color and make sure previously set transparency is not lost.
             const curTransparency = activeViewport.displayStyle.backgroundMapBase instanceof ColorDef ? activeViewport.displayStyle.backgroundMapBase.getTransparency() : 0;
             activeViewport.displayStyle.backgroundMapBase = bgColorDef.withTransparency(curTransparency);
+            // Determine if this is a preset color or a custom color
+            const selectedColorTbgr = bgColorValue.toTbgr();
+            const isPresetColor = presetColors.some((presetColor) => presetColor.toTbgr() === selectedColorTbgr);
+            // Persist custom color (no-op if preset)
+            void saveCustomBasemapColorPreference(selectedColorTbgr, isPresetColor);
             setSelectedBaseMap(bgColorDef);
         }
-    }, [activeViewport]);
+    }, [activeViewport, presetColors, saveCustomBasemapColorPreference]);
     const handleBaseMapSelection = React.useCallback((value) => {
         if (activeViewport && value) {
             if (value === customBaseMapValue && customBaseMap) {