npm - @itwin/map-layers - Versions diffs - 5.6.2 → 6.0.0-dev.1 - Mend

@itwin/map-layers 5.6.2 → 6.0.0-dev.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (223) hide show

package/lib/cjs/ui/widget/BasemapPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BasemapPanel.js","sourceRoot":"","sources":["../../../../src/ui/widget/BasemapPanel.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/* eslint-disable deprecation/deprecation /\n// cSpell:ignore droppable Sublayer Basemap\n\nimport \"./BasemapPanel.scss\";\nimport as React from \"react\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { BackgroundMapType, BaseMapLayerSettings, ColorByName, ColorDef, ImageMapLayerSettings } from \"@itwin/core-common\";\nimport { WebFontIcon } from \"@itwin/core-react\";\nimport { ColorPickerDialog, ColorSwatch } from \"@itwin/imodel-components-react\";\nimport { Button, Select } from \"@itwin/itwinui-react\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { useSourceMapContext } from \"./MapLayerManager\";\nimport { TransparencyPopupButton } from \"./TransparencyPopupButton\";\n\nimport type { BaseLayerSettings, MapImagerySettings, MapLayerProps } from \"@itwin/core-common\";\nimport type { Viewport } from \"@itwin/core-frontend\";\nimport type { SelectOption } from \"@itwin/itwinui-react\";\nconst customBaseMapValue = \"customBaseMap\";\nconst getSelectKeyFromProvider = (base: BaseMapLayerSettings) =>\n `${base.provider ? `${base.provider.name}.${BackgroundMapType[base.provider.type]}` : `${base.name}`}`;\n\ninterface BasemapPanelProps {\n disabled?: boolean;\n}\n\n/** @internal */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function BasemapPanel(props: BasemapPanelProps) {\n const [useColorLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Basemap.ColorFill\"));\n const { activeViewport, bases } = useSourceMapContext();\n const [selectedBaseMap, setSelectedBaseMap] = React.useState<BaseLayerSettings \| undefined>(() => {\n return activeViewport?.displayStyle.settings.mapImagery.backgroundBase;\n });\n const [baseMapTransparencyValue, setBaseMapTransparencyValue] = React.useState(() => {\n if (activeViewport) {\n const mapImagery = activeViewport.displayStyle.settings.mapImagery;\n if (mapImagery.backgroundBase instanceof ImageMapLayerSettings) {\n return mapImagery.backgroundBase.transparency;\n } else if (mapImagery.backgroundBase instanceof ColorDef) {\n return mapImagery.backgroundBase.getAlpha() / 255;\n } else {\n return 0;\n }\n } else {\n return 0;\n }\n });\n const [customBaseMap, setCustomBaseMap] = React.useState<BaseMapLayerSettings \| undefined>();\n const [baseMapVisible, setBaseMapVisible] = React.useState(() => {\n if (activeViewport && activeViewport.displayStyle.backgroundMapBase instanceof ImageMapLayerSettings) {\n return activeViewport.displayStyle.backgroundMapBase.visible;\n }\n return false;\n });\n\n const getBaseMapOptions = React.useCallback(\n (baseMap: BaseLayerSettings \| undefined) => {\n const baseOptions: SelectOption<string>[] = [];\n\n baseOptions.push({ value: useColorLabel, label: useColorLabel });\n\n if (bases) {\n baseOptions.push(\n ...bases.map((bgProvider) => {\n const value = getSelectKeyFromProvider(bgProvider);\n const label = MapLayersUI.translate(`WellKnownBaseMaps.${value}`);\n return { value, label };\n }),\n );\n }\n\n // Add new custom base map definition (avoid adding duplicate entry)\n if (baseMap instanceof BaseMapLayerSettings && !baseMap.provider) {\n // Add new option only if not created duplicate (Support of base map definition without provider)\n if (undefined === baseOptions.find((opt) => opt.label === baseMap.name)) {\n baseOptions.push({ value: customBaseMapValue, label: baseMap.name });\n }\n } else if (customBaseMap) {\n // Add previously defined custom map definition\n baseOptions.push({ value: customBaseMapValue, label: customBaseMap.name });\n }\n return baseOptions;\n },\n [bases, customBaseMap, useColorLabel],\n );\n\n const [baseMapOptions, setBaseMapOptions] = React.useState<SelectOption<string>[]>(() => getBaseMapOptions(selectedBaseMap));\n\n const updateBaseMapOptions = React.useCallback(\n (baseMap: BaseLayerSettings \| undefined) => {\n setBaseMapOptions(getBaseMapOptions(baseMap));\n },\n [getBaseMapOptions],\n );\n\n const handleMapImageryChanged = React.useCallback(\n (args: Readonly<MapImagerySettings>) => {\n const baseMap = args.backgroundBase;\n\n // Optimization: If serialized 'backgroundBase' objects are identical, skip refresh\n if (JSON.stringify(baseMap.toJSON()) === JSON.stringify(selectedBaseMap?.toJSON())) {\n return;\n }\n\n setSelectedBaseMap(baseMap); // cache current base map objects\n updateBaseMapOptions(baseMap);\n\n if (baseMap instanceof ImageMapLayerSettings) {\n if (baseMap.transparency !== baseMapTransparencyValue) {\n setBaseMapTransparencyValue(baseMap.transparency);\n }\n\n if (baseMap.visible !== baseMapVisible) {\n setBaseMapVisible(baseMap.visible);\n }\n } else if (baseMap instanceof ColorDef) {\n if (baseMap.getAlpha() !== baseMapTransparencyValue) {\n setBaseMapTransparencyValue(baseMap.getAlpha() / 255);\n }\n }\n },\n [baseMapTransparencyValue, baseMapVisible, selectedBaseMap, updateBaseMapOptions],\n );\n\n React.useEffect(() => {\n const handleDisplayStyleChange = (vp: Viewport) => {\n handleMapImageryChanged(vp.displayStyle.settings.mapImagery);\n };\n return activeViewport?.onDisplayStyleChanged.addListener(handleDisplayStyleChange);\n }, [activeViewport, handleMapImageryChanged]);\n\n // Monitor display style's onMapImageryChanged event\n React.useEffect(() => {\n return activeViewport?.displayStyle.settings.onMapImageryChanged.addListener(handleMapImageryChanged);\n }, [activeViewport, handleMapImageryChanged]);\n\n // Monitor viewport updates, and refresh the widget accordingly .\n // Note: This is needed for multiple viewport applications.\n React.useEffect(() => {\n if (activeViewport) {\n handleMapImageryChanged(activeViewport.displayStyle.settings.mapImagery);\n }\n }, [activeViewport, handleMapImageryChanged]);\n\n const handleBasemapTransparencyChange = React.useCallback(\n (transparency: number) => {\n if (activeViewport) {\n activeViewport.displayStyle.changeBaseMapTransparency(transparency);\n setBaseMapTransparencyValue(transparency);\n }\n },\n [activeViewport],\n );\n\n // This effect is only to keep a custom base map option when a 'default' base map is picked.\n React.useEffect(() => {\n if (\n selectedBaseMap instanceof BaseMapLayerSettings &&\n !selectedBaseMap.provider &&\n undefined === baseMapOptions.find((opt) => opt.label === selectedBaseMap.name)\n ) {\n setCustomBaseMap(selectedBaseMap);\n }\n }, [baseMapOptions, selectedBaseMap]);\n\n const [presetColors] = React.useState([\n ColorDef.create(ColorByName.grey),\n ColorDef.create(ColorByName.lightGrey),\n ColorDef.create(ColorByName.darkGrey),\n ColorDef.create(ColorByName.lightBlue),\n ColorDef.create(ColorByName.lightGreen),\n ColorDef.create(ColorByName.darkGreen),\n ColorDef.create(ColorByName.tan),\n ColorDef.create(ColorByName.darkBrown),\n ]);\n\n const baseIsColor = React.useMemo(() => selectedBaseMap instanceof ColorDef, [selectedBaseMap]);\n const baseIsMap = React.useMemo(() => !baseIsColor && selectedBaseMap !== undefined, [baseIsColor, selectedBaseMap]);\n const bgColor = React.useMemo(\n () => (baseIsColor ? (selectedBaseMap as ColorDef).toJSON() : presetColors[0].toJSON()),\n [baseIsColor, selectedBaseMap, presetColors],\n );\n const [colorDialogTitle] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:ColorDialog.Title\"));\n const [selectedBaseMapValue, setSelectedBaseMapValue] = React.useState<SelectOption<string>>({ value: \"\", label: \"\" });\n\n React.useEffect(() => {\n if (baseIsMap) {\n if (selectedBaseMap instanceof BaseMapLayerSettings && selectedBaseMap.provider) {\n const mapName = getSelectKeyFromProvider(selectedBaseMap);\n const foundItem = baseMapOptions.find((value) => value.value === mapName);\n if (foundItem) {\n setSelectedBaseMapValue(foundItem);\n return;\n }\n } else if (selectedBaseMap instanceof BaseMapLayerSettings) {\n // We got a custom base map\n\n // First check if the name matches a label of existing base map.\n // If it matches, we assume it's a legacy base map definition missing the provider information.\n let foundItem = baseMapOptions.find((opt) => opt.value !== customBaseMapValue && opt.label === selectedBaseMap.name);\n if (foundItem) {\n setSelectedBaseMapValue(foundItem);\n return;\n }\n\n // Use custom base map entry\n foundItem = baseMapOptions.find((opt) => opt.value === customBaseMapValue);\n if (foundItem) {\n setSelectedBaseMapValue(foundItem);\n return;\n }\n }\n } else if (baseIsColor) {\n setSelectedBaseMapValue(baseMapOptions[0]);\n return;\n }\n setSelectedBaseMapValue({ value: \"\", label: \"\" });\n }, [baseIsColor, baseIsMap, baseMapOptions, selectedBaseMap]);\n\n const handleBackgroundColorDialogOk = React.useCallback(\n (bgColorDef: ColorDef) => {\n UiFramework.dialogs.modal.close();\n if (activeViewport) {\n // change color and make sure previously set transparency is not lost.\n const curTransparency =\n activeViewport.displayStyle.backgroundMapBase instanceof ColorDef ? activeViewport.displayStyle.backgroundMapBase.getTransparency() : 0;\n activeViewport.displayStyle.backgroundMapBase = bgColorDef.withTransparency(curTransparency);\n\n setSelectedBaseMap(bgColorDef);\n }\n },\n [activeViewport],\n );\n\n const handleBackgroundColorDialogCancel = React.useCallback(() => {\n UiFramework.dialogs.modal.close();\n }, []);\n\n const handleBgColorClick = React.useCallback(\n (newColor: ColorDef, e: React.MouseEvent<Element, MouseEvent>) => {\n e.preventDefault();\n UiFramework.dialogs.modal.open(\n <ColorPickerDialog\n dialogTitle={colorDialogTitle}\n color={newColor}\n colorPresets={presetColors}\n colorInputType={\"rgb\"}\n onOkResult={handleBackgroundColorDialogOk}\n onCancelResult={handleBackgroundColorDialogCancel}\n />,\n );\n },\n [colorDialogTitle, presetColors, handleBackgroundColorDialogOk, handleBackgroundColorDialogCancel],\n ); // eslint-disable-line react-hooks/exhaustive-deps\n\n const handleBaseMapSelection = React.useCallback(\n (value: string) => {\n if (activeViewport && value) {\n if (value === customBaseMapValue && customBaseMap) {\n activeViewport.displayStyle.backgroundMapBase = customBaseMap;\n } else if (bases) {\n const baseMap = bases.find((provider) => getSelectKeyFromProvider(provider) === value);\n if (baseMap) {\n const baseProps: MapLayerProps = baseMap.toJSON();\n if (activeViewport.displayStyle.backgroundMapBase instanceof BaseMapLayerSettings) {\n activeViewport.displayStyle.backgroundMapBase = activeViewport.displayStyle.backgroundMapBase.clone({ ...baseProps, visible: baseMapVisible });\n } else {\n activeViewport.displayStyle.backgroundMapBase = BaseMapLayerSettings.fromJSON({ ...baseProps, visible: baseMapVisible });\n }\n } else {\n const bgColorDef = ColorDef.fromJSON(bgColor);\n const curTransparency =\n activeViewport.displayStyle.backgroundMapBase instanceof ColorDef ? activeViewport.displayStyle.backgroundMapBase.getTransparency() : 0;\n activeViewport.displayStyle.backgroundMapBase = bgColorDef.withTransparency(curTransparency);\n }\n }\n }\n },\n [activeViewport, customBaseMap, bases, baseMapVisible, bgColor],\n );\n\n const handleVisibilityChange = React.useCallback(() => {\n if (activeViewport) {\n const newState = !baseMapVisible;\n // BaseMap visibility is only support when backgroundBase is an instance of BaseMapLayerSettings (i.e not a color)...\n if (activeViewport.displayStyle.backgroundMapBase instanceof BaseMapLayerSettings) {\n activeViewport.displayStyle.backgroundMapBase = activeViewport.displayStyle.backgroundMapBase.clone({ visible: newState });\n }\n setBaseMapVisible(newState);\n }\n }, [baseMapVisible, activeViewport]);\n\n const [baseLayerLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Basemap.BaseLayer\"));\n const [selectBaseMapLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Basemap.SelectBaseMap\"));\n const [toggleVisibility] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.ToggleVisibility\"));\n\n return (\n <>\n <span className=\"map-manager-base-label\">{baseLayerLabel}</span>\n <div className=\"map-manager-base-item\">\n <Button\n className=\"map-manager-basemap-visibility map-manager-visibility-icon\"\n size=\"small\"\n styleType=\"borderless\"\n title={toggleVisibility}\n onClick={handleVisibilityChange}\n disabled={props.disabled \|\| !activeViewport \|\| !(activeViewport.displayStyle.backgroundMapBase instanceof ImageMapLayerSettings)}\n >\n <WebFontIcon iconName={baseMapVisible ? \"icon-visibility\" : \"icon-visibility-hide-2\"} />\n </Button>\n <Select\n className=\"map-manager-base-item-select\"\n options={baseMapOptions}\n placeholder={selectBaseMapLabel}\n value={selectedBaseMapValue.value}\n onChange={handleBaseMapSelection}\n size=\"small\"\n disabled={props.disabled}\n />\n {baseIsColor && (\n <ColorSwatch className=\"map-manager-base-item-color\" colorDef={ColorDef.fromJSON(bgColor)} round={false} onColorPick={handleBgColorClick} />\n )}\n <TransparencyPopupButton disabled={props.disabled} transparency={baseMapTransparencyValue} onTransparencyChange={handleBasemapTransparencyChange} />\n </div>\n </>\n );\n}\n"]}
1	+ {"version":3,"file":"BasemapPanel.js","sourceRoot":"","sources":["../../../../src/ui/widget/BasemapPanel.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\nimport \"./BasemapPanel.scss\";\nimport * as React from \"react\";\nimport { BackgroundMapType, BaseMapLayerSettings, ColorByName, ColorDef, ImageMapLayerSettings } from \"@itwin/core-common\";\nimport { SvgVisibilityHide, SvgVisibilityShow } from \"@itwin/itwinui-icons-react\";\nimport { Button, ColorBuilder, ColorInputPanel, ColorPalette, ColorPicker, ColorSwatch, ColorValue, IconButton, Popover, Select } from \"@itwin/itwinui-react\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { useSourceMapContext } from \"./MapLayerManager\";\nimport { TransparencyPopupButton } from \"./TransparencyPopupButton\";\n\nimport type { BaseLayerSettings, MapImagerySettings, MapLayerProps } from \"@itwin/core-common\";\nimport type { Viewport } from \"@itwin/core-frontend\";\nimport type { SelectOption } from \"@itwin/itwinui-react\";\nconst customBaseMapValue = \"customBaseMap\";\nconst getSelectKeyFromProvider = (base: BaseMapLayerSettings) =>\n `${base.provider ? `${base.provider.name}.${BackgroundMapType[base.provider.type]}` : `${base.name}`}`;\n\ninterface BasemapPanelProps {\n disabled?: boolean;\n}\n\n/** @internal */\nexport function BasemapPanel(props: BasemapPanelProps) {\n const [useColorLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Basemap.ColorFill\"));\n const { activeViewport, bases } = useSourceMapContext();\n const [selectedBaseMap, setSelectedBaseMap] = React.useState<BaseLayerSettings \| undefined>(() => {\n return activeViewport?.displayStyle.settings.mapImagery.backgroundBase;\n });\n const [baseMapTransparencyValue, setBaseMapTransparencyValue] = React.useState(() => {\n if (activeViewport) {\n const mapImagery = activeViewport.displayStyle.settings.mapImagery;\n if (mapImagery.backgroundBase instanceof ImageMapLayerSettings) {\n return mapImagery.backgroundBase.transparency;\n } else if (mapImagery.backgroundBase instanceof ColorDef) {\n return mapImagery.backgroundBase.getAlpha() / 255;\n } else {\n return 0;\n }\n } else {\n return 0;\n }\n });\n const [customBaseMap, setCustomBaseMap] = React.useState<BaseMapLayerSettings \| undefined>();\n const [baseMapVisible, setBaseMapVisible] = React.useState(() => {\n if (activeViewport && activeViewport.displayStyle.backgroundMapBase instanceof ImageMapLayerSettings) {\n return activeViewport.displayStyle.backgroundMapBase.visible;\n }\n return false;\n });\n\n const getBaseMapOptions = React.useCallback(\n (baseMap: BaseLayerSettings \| undefined) => {\n const baseOptions: SelectOption<string>[] = [];\n\n baseOptions.push({ value: useColorLabel, label: useColorLabel });\n\n if (bases) {\n baseOptions.push(\n ...bases.map((bgProvider) => {\n const value = getSelectKeyFromProvider(bgProvider);\n const label = MapLayersUI.translate(`WellKnownBaseMaps.${value}`);\n return { value, label };\n }),\n );\n }\n\n // Add new custom base map definition (avoid adding duplicate entry)\n if (baseMap instanceof BaseMapLayerSettings && !baseMap.provider) {\n // Add new option only if not created duplicate (Support of base map definition without provider)\n if (undefined === baseOptions.find((opt) => opt.label === baseMap.name)) {\n baseOptions.push({ value: customBaseMapValue, label: baseMap.name });\n }\n } else if (customBaseMap) {\n // Add previously defined custom map definition\n baseOptions.push({ value: customBaseMapValue, label: customBaseMap.name });\n }\n return baseOptions;\n },\n [bases, customBaseMap, useColorLabel],\n );\n\n const [baseMapOptions, setBaseMapOptions] = React.useState<SelectOption<string>[]>(() => getBaseMapOptions(selectedBaseMap));\n\n const updateBaseMapOptions = React.useCallback(\n (baseMap: BaseLayerSettings \| undefined) => {\n setBaseMapOptions(getBaseMapOptions(baseMap));\n },\n [getBaseMapOptions],\n );\n\n const handleMapImageryChanged = React.useCallback(\n (args: Readonly<MapImagerySettings>) => {\n const baseMap = args.backgroundBase;\n\n // Optimization: If serialized 'backgroundBase' objects are identical, skip refresh\n if (JSON.stringify(baseMap.toJSON()) === JSON.stringify(selectedBaseMap?.toJSON())) {\n return;\n }\n\n setSelectedBaseMap(baseMap); // cache current base map objects\n updateBaseMapOptions(baseMap);\n\n if (baseMap instanceof ImageMapLayerSettings) {\n if (baseMap.transparency !== baseMapTransparencyValue) {\n setBaseMapTransparencyValue(baseMap.transparency);\n }\n\n if (baseMap.visible !== baseMapVisible) {\n setBaseMapVisible(baseMap.visible);\n }\n } else if (baseMap instanceof ColorDef) {\n if (baseMap.getAlpha() !== baseMapTransparencyValue) {\n setBaseMapTransparencyValue(baseMap.getAlpha() / 255);\n }\n }\n },\n [baseMapTransparencyValue, baseMapVisible, selectedBaseMap, updateBaseMapOptions],\n );\n\n React.useEffect(() => {\n const handleDisplayStyleChange = (vp: Viewport) => {\n handleMapImageryChanged(vp.displayStyle.settings.mapImagery);\n };\n return activeViewport?.onDisplayStyleChanged.addListener(handleDisplayStyleChange);\n }, [activeViewport, handleMapImageryChanged]);\n\n // Monitor display style's onMapImageryChanged event\n React.useEffect(() => {\n return activeViewport?.displayStyle.settings.onMapImageryChanged.addListener(handleMapImageryChanged);\n }, [activeViewport, handleMapImageryChanged]);\n\n // Monitor viewport updates, and refresh the widget accordingly .\n // Note: This is needed for multiple viewport applications.\n React.useEffect(() => {\n if (activeViewport) {\n handleMapImageryChanged(activeViewport.displayStyle.settings.mapImagery);\n }\n }, [activeViewport, handleMapImageryChanged]);\n\n const handleBasemapTransparencyChange = React.useCallback(\n (transparency: number) => {\n if (activeViewport) {\n activeViewport.displayStyle.changeBaseMapTransparency(transparency);\n setBaseMapTransparencyValue(transparency);\n }\n },\n [activeViewport],\n );\n\n // This effect is only to keep a custom base map option when a 'default' base map is picked.\n React.useEffect(() => {\n if (\n selectedBaseMap instanceof BaseMapLayerSettings &&\n !selectedBaseMap.provider &&\n undefined === baseMapOptions.find((opt) => opt.label === selectedBaseMap.name)\n ) {\n setCustomBaseMap(selectedBaseMap);\n }\n }, [baseMapOptions, selectedBaseMap]);\n\n const [presetColors] = React.useState([\n ColorValue.fromTbgr(ColorByName.grey),\n ColorValue.fromTbgr(ColorByName.lightGrey),\n ColorValue.fromTbgr(ColorByName.darkGrey),\n ColorValue.fromTbgr(ColorByName.lightBlue),\n ColorValue.fromTbgr(ColorByName.lightGreen),\n ColorValue.fromTbgr(ColorByName.darkGreen),\n ColorValue.fromTbgr(ColorByName.tan),\n ColorValue.fromTbgr(ColorByName.darkBrown),\n ]);\n\n const baseIsColor = React.useMemo(() => selectedBaseMap instanceof ColorDef, [selectedBaseMap]);\n const baseIsMap = React.useMemo(() => !baseIsColor && selectedBaseMap !== undefined, [baseIsColor, selectedBaseMap]);\n // bgColor is a 32 bit number represented in TBGR format\n const bgColor = React.useMemo(\n () => (baseIsColor ? (selectedBaseMap as ColorDef).toJSON() : presetColors[0].toTbgr()),\n [baseIsColor, selectedBaseMap, presetColors],\n );\n const [selectedBaseMapValue, setSelectedBaseMapValue] = React.useState<SelectOption<string>>({ value: \"\", label: \"\" });\n\n React.useEffect(() => {\n if (baseIsMap) {\n if (selectedBaseMap instanceof BaseMapLayerSettings && selectedBaseMap.provider) {\n const mapName = getSelectKeyFromProvider(selectedBaseMap);\n const foundItem = baseMapOptions.find((value) => value.value === mapName);\n if (foundItem) {\n setSelectedBaseMapValue(foundItem);\n return;\n }\n } else if (selectedBaseMap instanceof BaseMapLayerSettings) {\n // We got a custom base map\n\n // First check if the name matches a label of existing base map.\n // If it matches, we assume it's a legacy base map definition missing the provider information.\n let foundItem = baseMapOptions.find((opt) => opt.value !== customBaseMapValue && opt.label === selectedBaseMap.name);\n if (foundItem) {\n setSelectedBaseMapValue(foundItem);\n return;\n }\n\n // Use custom base map entry\n foundItem = baseMapOptions.find((opt) => opt.value === customBaseMapValue);\n if (foundItem) {\n setSelectedBaseMapValue(foundItem);\n return;\n }\n }\n } else if (baseIsColor) {\n setSelectedBaseMapValue(baseMapOptions[0]);\n return;\n }\n setSelectedBaseMapValue({ value: \"\", label: \"\" });\n }, [baseIsColor, baseIsMap, baseMapOptions, selectedBaseMap]);\n\n const handleBackgroundColorDialogOk = React.useCallback(\n (bgColorValue: ColorValue) => {\n if (activeViewport) {\n const bgColorDef = ColorDef.fromTbgr(bgColorValue.toTbgr());\n // change color and make sure previously set transparency is not lost.\n const curTransparency =\n activeViewport.displayStyle.backgroundMapBase instanceof ColorDef ? activeViewport.displayStyle.backgroundMapBase.getTransparency() : 0;\n activeViewport.displayStyle.backgroundMapBase = bgColorDef.withTransparency(curTransparency);\n\n setSelectedBaseMap(bgColorDef);\n }\n },\n [activeViewport],\n );\n\n const handleBaseMapSelection = React.useCallback(\n (value: string) => {\n if (activeViewport && value) {\n if (value === customBaseMapValue && customBaseMap) {\n activeViewport.displayStyle.backgroundMapBase = customBaseMap;\n } else if (bases) {\n const baseMap = bases.find((provider) => getSelectKeyFromProvider(provider) === value);\n if (baseMap) {\n const baseProps: MapLayerProps = baseMap.toJSON();\n if (activeViewport.displayStyle.backgroundMapBase instanceof BaseMapLayerSettings) {\n activeViewport.displayStyle.backgroundMapBase = activeViewport.displayStyle.backgroundMapBase.clone({ ...baseProps, visible: baseMapVisible });\n } else {\n activeViewport.displayStyle.backgroundMapBase = BaseMapLayerSettings.fromJSON({ ...baseProps, visible: baseMapVisible });\n }\n } else {\n const bgColorDef = ColorDef.fromJSON(bgColor);\n const curTransparency =\n activeViewport.displayStyle.backgroundMapBase instanceof ColorDef ? activeViewport.displayStyle.backgroundMapBase.getTransparency() : 0;\n activeViewport.displayStyle.backgroundMapBase = bgColorDef.withTransparency(curTransparency);\n }\n }\n }\n },\n [activeViewport, customBaseMap, bases, baseMapVisible, bgColor],\n );\n\n const handleVisibilityChange = React.useCallback(() => {\n if (activeViewport) {\n const newState = !baseMapVisible;\n // BaseMap visibility is only support when backgroundBase is an instance of BaseMapLayerSettings (i.e not a color)...\n if (activeViewport.displayStyle.backgroundMapBase instanceof BaseMapLayerSettings) {\n activeViewport.displayStyle.backgroundMapBase = activeViewport.displayStyle.backgroundMapBase.clone({ visible: newState });\n }\n setBaseMapVisible(newState);\n }\n }, [baseMapVisible, activeViewport]);\n\n const [baseLayerLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Basemap.BaseLayer\"));\n const [selectBaseMapLabel] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Basemap.SelectBaseMap\"));\n const [toggleVisibility] = React.useState(MapLayersUI.localization.getLocalizedString(\"mapLayers:Widget.ToggleVisibility\"));\n\n return (\n <>\n <span className=\"map-manager-base-label\">{baseLayerLabel}</span>\n <div className=\"map-manager-base-item\">\n <Button\n className=\"map-manager-basemap-visibility map-manager-visibility-icon\"\n size=\"small\"\n styleType=\"borderless\"\n data-testid=\"toggle-visibility\"\n title={toggleVisibility}\n onClick={handleVisibilityChange}\n disabled={props.disabled \|\| !activeViewport \|\| !(activeViewport.displayStyle.backgroundMapBase instanceof ImageMapLayerSettings)}\n >\n {baseMapVisible ? <SvgVisibilityShow data-testid=\"layer-visibility-icon-show\" /> : <SvgVisibilityHide data-testid=\"layer-visibility-icon-hide\" />}\n </Button>\n <Select\n data-testid=\"base-map-select\"\n className=\"map-manager-base-item-select\"\n options={baseMapOptions}\n placeholder={selectBaseMapLabel}\n value={selectedBaseMapValue.value}\n onChange={handleBaseMapSelection}\n size=\"small\"\n disabled={props.disabled}\n />\n {baseIsColor && (\n <Popover\n content={\n <ColorPicker\n selectedColor={ColorValue.fromTbgr(bgColor)}\n onChangeComplete={handleBackgroundColorDialogOk}\n >\n <ColorBuilder />\n <ColorInputPanel defaultColorFormat='rgb' />\n <ColorPalette\n label=\"Preset Colors\"\n colors={presetColors}\n />\n </ColorPicker>\n }\n >\n <IconButton label='Show color picker'>\n <ColorSwatch style={{ pointerEvents: 'none' }} color={ColorValue.fromTbgr(bgColor)} />\n </IconButton>\n </Popover>\n )}\n <TransparencyPopupButton disabled={props.disabled} transparency={baseMapTransparencyValue} onTransparencyChange={handleBasemapTransparencyChange} />\n </div>\n </>\n );\n}\n"]}

package/lib/cjs/ui/widget/ConfirmMessageDialog.d.ts CHANGED Viewed

@@ -1,14 +1,13 @@
-/// <reference types="react" />
-import type { CommonProps } from "@itwin/core-react";
 import "./MapUrlDialog.scss";
-interface ConfirmMessageDialogProps extends CommonProps {
+import * as React from "react";
+interface ConfirmMessageDialogProps {
     /** Title to show in title bar of dialog */
-    title?: string | JSX.Element;
-    message?: string | JSX.Element;
+    title?: string | React.JSX.Element;
+    className?: string;
+    message?: string | React.JSX.Element;
+    opened: boolean;
     onYesResult?: () => void;
     onNoResult?: () => void;
-    onClose?: () => void;
-    onEscape?: () => void;
     minWidth?: string | number;
     /** Minimum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 100px */
     minHeight?: string | number;
@@ -17,6 +16,6 @@ interface ConfirmMessageDialogProps extends CommonProps {
     /** Maximum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. */
     maxHeight?: string | number;
 }
-export declare function ConfirmMessageDialog(props: ConfirmMessageDialogProps): JSX.Element;
+export declare function ConfirmMessageDialog(props: ConfirmMessageDialogProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=ConfirmMessageDialog.d.ts.map

package/lib/cjs/ui/widget/ConfirmMessageDialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConfirmMessageDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/ConfirmMessageDialog.tsx"],"names":[],"mappings":";~~AAOA~~,OAAO,KAAK,~~EAAE~~,~~WAAW,EAAE,~~MAAM,~~mBAAmB,CAAC;AAGrD,~~OAAO,~~qBAAqB,~~CAAC;~~AAG7B~~,UAAU,~~yBAA0B,SAAQ,WAAW~~;~~IACrD~~,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;~~IAC7B~~,~~OAAO~~,CAAC,EAAE,MAAM,~~GAAG,GAAG,~~CAAC,OAAO,CAAC~~;IAC/B~~,~~WAAW,CAAC,~~EAAE,MAAM,~~IAAI~~,CAAC~~;IACzB~~,~~UAAU~~,CAAC,~~EAAE~~,MAAM,~~IAAI~~,CAAC;~~IACxB~~,~~OAAO~~,CAAC,EAAE,MAAM,IAAI,CAAC;~~IACrB~~,~~QAAQ~~,CAAC,EAAE,MAAM,IAAI,CAAC;~~IACtB~~,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,yJAAyJ;IACzJ,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,yIAAyI;IACzI,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,0IAA0I;IAC1I,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC7B;~~AAGD~~,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,~~eA6BpE~~"}
1	+ {"version":3,"file":"ConfirmMessageDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/ConfirmMessageDialog.tsx"],"names":[],"mappings":"AAMA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,UAAU,yBAAyB;IACjC,2CAA2C;IAC3C,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACrC,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,yJAAyJ;IACzJ,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,yIAAyI;IACzI,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,0IAA0I;IAC1I,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC7B;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,2CA2CpE"}

package/lib/cjs/ui/widget/ConfirmMessageDialog.js CHANGED Viewed

@@ -30,17 +30,24 @@ const jsx_runtime_1 = require("react/jsx-runtime");
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 // cSpell:ignore Modeless WMTS
-const React = __importStar(require("react"));
-const core_react_1 = require("@itwin/core-react");
 require("./MapUrlDialog.scss");
-const appui_abstract_1 = require("@itwin/appui-abstract");
-// eslint-disable-next-line @typescript-eslint/naming-convention
+const React = __importStar(require("react"));
+const itwinui_react_1 = require("@itwin/itwinui-react");
 function ConfirmMessageDialog(props) {
-    const buttonCluster = React.useMemo(() => [
-        { type: appui_abstract_1.DialogButtonType.Yes, onClick: props.onYesResult ?? (() => { }) },
-        { type: appui_abstract_1.DialogButtonType.No, onClick: props.onNoResult ?? (() => { }) },
-    ], [props.onYesResult, props.onNoResult]);
-    return ((0, jsx_runtime_1.jsx)(core_react_1.Dialog, { className: props.className, title: props.title, opened: true, resizable: false, movable: true, modal: true, buttonCluster: buttonCluster, onClose: props.onClose, onEscape: props.onEscape, minHeight: props.minHeight, maxHeight: props.maxHeight, minWidth: props.minWidth, maxWidth: props.maxWidth, trapFocus: false, children: (0, jsx_runtime_1.jsx)("div", { children: props.message }) }));
+    const [isOpen, setIsOpen] = React.useState(props.opened);
+    const handleNo = () => {
+        setIsOpen(false);
+        if (props.onNoResult) {
+            props.onNoResult();
+        }
+    };
+    const handleYes = () => {
+        setIsOpen(false);
+        if (props.onYesResult) {
+            props.onYesResult();
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)(itwinui_react_1.Dialog, { as: "div", className: props.className, isOpen: isOpen, onClose: handleNo, closeOnEsc: true, closeOnExternalClick: true, preventDocumentScroll: true, trapFocus: true, setFocus: true, portal: true, isDismissible: true, children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.Dialog.Backdrop, {}), (0, jsx_runtime_1.jsxs)(itwinui_react_1.Dialog.Main, { children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.Dialog.TitleBar, { titleText: props.title }), (0, jsx_runtime_1.jsx)(itwinui_react_1.Dialog.Content, { children: (0, jsx_runtime_1.jsx)("div", { children: props.message }) }), (0, jsx_runtime_1.jsxs)(itwinui_react_1.Dialog.ButtonBar, { children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.Button, { styleType: 'high-visibility', onClick: handleYes, children: "Yes" }), (0, jsx_runtime_1.jsx)(itwinui_react_1.Button, { onClick: handleNo, children: "No" })] })] })] }));
 }
 exports.ConfirmMessageDialog = ConfirmMessageDialog;
 //# sourceMappingURL=ConfirmMessageDialog.js.map

package/lib/cjs/ui/widget/ConfirmMessageDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConfirmMessageDialog.js","sourceRoot":"","sources":["../../../../src/ui/widget/ConfirmMessageDialog.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;gGAGgG;AAChG,8BAA8B;AAE9B,6CAA+B;~~AAE~~/B,~~kDAA2C~~;~~AAE3C,+BAA6B;AAC7B~~,~~0DAAyD;AAmBzD,gEAAgE;AAChE,~~SAAgB,oBAAoB,CAAC,KAAgC;IACnE,MAAM,~~aAAa~~,~~GAAG~~,~~KAAK~~,CAAC,~~OAAO~~,~~CACjC~~,~~GAAG~~,~~EAAE~~,CAAC~~;QACJ~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~iCAAgB~~,CAAC,GAAG,EAAE,~~OAAO~~,~~EAAE~~,KAAK,CAAC,~~WAAW~~,IAAI,CAAC,~~GAAG~~,EAAE,~~GAAE,~~CAAC,CAAC,~~EAAE;QACxE~~,EAAE,~~IAAI~~,~~EAAE~~,~~iCAAgB~~,CAAC,~~EAAE~~,~~EAAE~~,~~OAAO~~,EAAE,~~KAAK~~,CAAC,~~UAAU~~,~~IAAI~~,CAAC,~~GAAG~~,~~EAAE~~,~~GAAE,~~CAAC,~~CAAC~~,EAAE~~;KACvE~~,~~EACD,~~CAAC,KAAK,CAAC,WAAW,EAAE,~~KAAK~~,CAAC,~~UAAU,~~CAAC,~~CACtC,CAAC~~;~~IAEF~~,OAAO,CACL,~~uBAAC~~,~~mBAAM~~,IACL,~~SAAS,~~EAAE,KAAK,~~CAAC~~,SAAS,~~EAC1B,KAAK,~~EAAE,KAAK,CAAC,~~KAAK~~,~~EAClB~~,MAAM,EAAE,~~IAAI~~,~~EACZ~~,~~SAAS~~,EAAE,~~KAAK~~,~~EAChB~~,~~OAAO~~,~~EAAE~~,~~IAAI~~,~~EACb~~,~~KAAK~~,~~EAAE~~,~~IAAI~~,~~EACX~~,~~aAAa~~,~~EAAE~~,aAAa,~~EAC5B~~,~~OAAO~~,~~EAAE~~,~~KAAK,~~CAAC,~~OAAO~~,~~EACtB~~,~~QAAQ~~,~~EAAE~~,~~KAAK~~,CAAC,QAAQ,~~EACxB~~,SAAS,EAAE,KAAK,CAAC,~~SAAS~~,~~EAC1B~~,~~SAAS~~,~~EAAE~~,~~KAAK~~,CAAC,~~SAAS~~,~~EAC1B~~,~~QAAQ~~,~~EAAE,~~KAAK,CAAC,~~QAAQ~~,~~EACxB~~,~~QAAQ~~,~~EAAE~~,~~KAAK~~,CAAC,~~QAAQ~~,~~EACxB~~,SAAS,EAAE,~~KAAK~~,~~YAEhB~~,~~0CAAM~~,~~KAAK~~,~~CAAC~~,OAAO,~~GAAO~~,~~GACnB~~,CACV,CAAC;AACJ,CAAC;~~AA7BD~~,~~oDA6BC~~","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 * as React from \"~~react~~\";\nimport ~~type~~ { ~~CommonProps~~ } from \"~~@itwin/core-~~react\";\nimport { Dialog } from \"@itwin/~~core~~-react\";\n\~~nimport \"./MapUrlDialog.scss\";\nimport { DialogButtonType } from \"@itwin/appui-abstract\";\n\~~ninterface ConfirmMessageDialogProps ~~extends CommonProps~~ {\n /** Title to show in title bar of dialog /\n title?: string \| JSX.Element;\n message?: string \| JSX.Element;\n ~~onYesResult?:~~ ~~() => void~~;\n ~~onNoResult~~?: () => void;\n ~~onClose~~?: () => void;\n ~~onEscape?: () => void;\n~~ minWidth?: string \| number;\n /* Minimum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 100px /\n minHeight?: string \| number;\n /* Maximum width that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. /\n maxWidth?: string \| number;\n /* Maximum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. */\n maxHeight?: string \| number;\n}\n\~~n// eslint-disable-next-line @typescript-eslint/naming-convention\~~nexport function ConfirmMessageDialog(props: ConfirmMessageDialogProps) {\n const ~~buttonCluster~~ = React.~~useMemo~~(\n () => [\n { ~~type: DialogButtonType~~.~~Yes,~~ ~~onClick:~~ props.~~onYesResult ??~~ (() ~~=> {~~}) },\n { ~~type:~~ ~~DialogButtonType.No,~~ ~~onClick: props.onNoResult ??~~ (() => {~~}) },\~~n ~~],\~~n [props.onYesResult, props.~~onNoResult],\n~~ );\n\n return (\n <Dialog\n className={props.className}\n ~~title~~={~~props.title~~}\n ~~opened~~={~~true~~}\n ~~resizable={false}~~\n ~~movable={true}~~\n ~~modal={true}~~\n ~~buttonCluster={buttonCluster}~~\n ~~onClose={props.onClose}~~\n ~~onEscape={props.onEscape}~~\n ~~minHeight={props.minHeight}~~\n ~~maxHeight={props~~.~~maxHeight}\~~n ~~minWidth={props~~.~~minWidth}\~~n ~~maxWidth~~={props.~~maxWidth~~}\n ~~trapFocus={false}\n~~ >\n <div>{props.message}</div>\n </Dialog>\n );\n}\n"]}
1	+ {"version":3,"file":"ConfirmMessageDialog.js","sourceRoot":"","sources":["../../../../src/ui/widget/ConfirmMessageDialog.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;gGAGgG;AAChG,8BAA8B;AAE9B,+BAA6B;AAC7B,6CAA+B;AAC/B,wDAAsD;AAmBtD,SAAgB,oBAAoB,CAAC,KAAgC;IACnE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAEzD,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,SAAS,CAAC,KAAK,CAAC,CAAC;QACjB,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YACrB,KAAK,CAAC,UAAU,EAAE,CAAC;QACrB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,SAAS,CAAC,KAAK,CAAC,CAAC;QACjB,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC;YACtB,KAAK,CAAC,WAAW,EAAE,CAAC;QACtB,CAAC;IACH,CAAC,CAAA;IACD,OAAO,CACL,wBAAC,sBAAM,IACL,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,QAAQ,EACjB,UAAU,QACV,oBAAoB,QACpB,qBAAqB,QACrB,SAAS,QACT,QAAQ,QACR,MAAM,QACN,aAAa,mBAEb,uBAAC,sBAAM,CAAC,QAAQ,KAAG,EACnB,wBAAC,sBAAM,CAAC,IAAI,eACV,uBAAC,sBAAM,CAAC,QAAQ,IAAC,SAAS,EAAE,KAAK,CAAC,KAAK,GAAI,EAC3C,uBAAC,sBAAM,CAAC,OAAO,cACb,0CAAM,KAAK,CAAC,OAAO,GAAO,GACX,EACjB,wBAAC,sBAAM,CAAC,SAAS,eACf,uBAAC,sBAAM,IAAC,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,SAAS,oBAAc,EACpE,uBAAC,sBAAM,IAAC,OAAO,EAAE,QAAQ,mBAAa,IACrB,IACP,IACP,CACV,CAAC;AACJ,CAAC;AA3CD,oDA2CC","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 \"./MapUrlDialog.scss\";\nimport * as React from \"react\";\nimport { Button, Dialog } from \"@itwin/itwinui-react\";\n\ninterface ConfirmMessageDialogProps {\n /** Title to show in title bar of dialog /\n title?: string \| React.JSX.Element;\n className?: string;\n message?: string \| React.JSX.Element;\n opened: boolean;\n onYesResult?: () => void;\n onNoResult?: () => void;\n minWidth?: string \| number;\n /* Minimum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. Default: 100px /\n minHeight?: string \| number;\n /* Maximum width that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. /\n maxWidth?: string \| number;\n /* Maximum height that the dialog may be resized to. Displayed in px if value is a number; otherwise, displayed in specified CSS unit. */\n maxHeight?: string \| number;\n}\n\nexport function ConfirmMessageDialog(props: ConfirmMessageDialogProps) {\n const [isOpen, setIsOpen] = React.useState(props.opened);\n\n const handleNo = () => {\n setIsOpen(false);\n if (props.onNoResult) {\n props.onNoResult();\n }\n };\n\n const handleYes = () => {\n setIsOpen(false);\n if (props.onYesResult) {\n props.onYesResult();\n }\n }\n return (\n <Dialog\n as=\"div\"\n className={props.className}\n isOpen={isOpen}\n onClose={handleNo}\n closeOnEsc\n closeOnExternalClick\n preventDocumentScroll\n trapFocus\n setFocus\n portal\n isDismissible\n >\n <Dialog.Backdrop />\n <Dialog.Main>\n <Dialog.TitleBar titleText={props.title} />\n <Dialog.Content>\n <div>{props.message}</div>\n </Dialog.Content>\n <Dialog.ButtonBar>\n <Button styleType='high-visibility' onClick={handleYes}>Yes</Button>\n <Button onClick={handleNo}>No</Button>\n </Dialog.ButtonBar>\n </Dialog.Main>\n </Dialog>\n );\n}\n"]}

package/lib/cjs/ui/widget/CustomParamEditDialog.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import "./CustomParamEditDialog.scss";
 import type { CustomParamItem } from "../Interfaces";
 interface CustomParamEditDialogProps {
@@ -6,6 +5,6 @@ interface CustomParamEditDialogProps {
     onOkResult?: (newItem: CustomParamItem, oldIem?: CustomParamItem) => void;
     onCancelResult?: () => void;
 }
-export declare function CustomParamEditDialog(props: CustomParamEditDialogProps): JSX.Element;
+export declare function CustomParamEditDialog(props: CustomParamEditDialogProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=CustomParamEditDialog.d.ts.map

package/lib/cjs/ui/widget/CustomParamEditDialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomParamEditDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamEditDialog.tsx"],"names":[],"mappings":";AAKA,OAAO,8BAA8B,CAAC;AAOtC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAErD,UAAU,0BAA0B;IAClC,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,EAAE,MAAM,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;IAC1E,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;~~AAED~~,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,~~eA8FtE~~"}
1	+ {"version":3,"file":"CustomParamEditDialog.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamEditDialog.tsx"],"names":[],"mappings":"AAKA,OAAO,8BAA8B,CAAC;AAOtC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAErD,UAAU,0BAA0B;IAClC,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,EAAE,MAAM,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;IAC1E,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AACD,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,2CA0FtE"}

package/lib/cjs/ui/widget/CustomParamEditDialog.js CHANGED Viewed

@@ -32,11 +32,9 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("./CustomParamEditDialog.scss");
 const React = __importStar(require("react"));
 const appui_react_1 = require("@itwin/appui-react");
-const core_react_1 = require("@itwin/core-react");
 const itwinui_react_1 = require("@itwin/itwinui-react");
 const CustomParamsStorage_1 = require("../../CustomParamsStorage");
 const mapLayers_1 = require("../../mapLayers");
-// eslint-disable-next-line @typescript-eslint/naming-convention
 function CustomParamEditDialog(props) {
     const [originalItemName] = React.useState(() => (props.item ? props.item.name : undefined));
     const [item, setItem] = React.useState(() => props.item ?? { name: "", key: "", value: "", secret: true });
@@ -65,7 +63,7 @@ function CustomParamEditDialog(props) {
     function renderFooter() {
         return ((0, jsx_runtime_1.jsx)("div", { className: "custom-param-edit-dialog-footer", children: (0, jsx_runtime_1.jsxs)("div", { className: "custom-param-edit-dialog-footer-buttons", children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.Button, { className: "custom-param-edit-dialog-footer-button", styleType: "high-visibility", onClick: handleOk, disabled: !readyToSave(), children: props.item ? mapLayers_1.MapLayersUI.translate("Dialog.Edit") : mapLayers_1.MapLayersUI.translate("Dialog.Add") }), (0, jsx_runtime_1.jsx)(itwinui_react_1.Button, { className: "custom-param-edit-dialog-footer-button", styleType: "default", onClick: handleCancel, children: mapLayers_1.MapLayersUI.translate("Dialog.Cancel") })] }) }));
     }
-    return ((0, jsx_runtime_1.jsx)(core_react_1.Dialog, { title: mapLayers_1.MapLayersUI.translate(props.item ? "CustomParamEditDialog.DialogTitleEdit" : "CustomParamEditDialog.DialogTitleAdd"), opened: true, resizable: true, movable: true, modal: true, onClose: handleCancel, onEscape: handleCancel, minHeight: 120, maxWidth: 120, trapFocus: false, children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.LabeledInput, { className: "custom-param-edit-dialog-input", label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamNameLabel"), value: item.name, onChange: (event) => setItem({ ...item, name: event.target.value }), status: nameAlreadyExists ? "warning" : undefined, message: nameAlreadyExists ? mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.NameExists") : undefined }), (0, jsx_runtime_1.jsx)(itwinui_react_1.LabeledInput, { className: "custom-param-edit-dialog-input", label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamKeyLabel"), value: item.key, onChange: (event) => setItem({ ...item, key: event.target.value }) }), (0, jsx_runtime_1.jsx)(itwinui_react_1.LabeledInput, { className: "custom-param-edit-dialog-input", label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamValueLabel"), type: item.secret ? "password" : "", value: item.value, onChange: (event) => setItem({ ...item, value: event.target.value }), message: !item.secret ? mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamValueNonPrivateMessage") : undefined }), (0, jsx_runtime_1.jsx)("div", { className: "custom-param-edit-dialog-secret custom-param-edit-dialog-input", title: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.PrivateToggleTooltip"), children: (0, jsx_runtime_1.jsx)(itwinui_react_1.ToggleSwitch, { checked: item.secret, label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.PrivateToggleLabel"), onChange: (event) => setItem({ ...item, secret: event.target.checked }) }) }), renderFooter()] }) }));
+    return ((0, jsx_runtime_1.jsx)(itwinui_react_1.Modal, { as: "div", title: mapLayers_1.MapLayersUI.translate(props.item ? "CustomParamEditDialog.DialogTitleEdit" : "CustomParamEditDialog.DialogTitleAdd"), isOpen: true, onClose: handleCancel, style: { minHeight: 120, minWidth: 120 }, portal: true, children: (0, jsx_runtime_1.jsxs)(itwinui_react_1.ModalContent, { children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.LabeledInput, { className: "custom-param-edit-dialog-input", label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamNameLabel"), value: item.name, onChange: (event) => setItem({ ...item, name: event.target.value }), status: nameAlreadyExists ? "warning" : undefined, message: nameAlreadyExists ? mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.NameExists") : undefined }), (0, jsx_runtime_1.jsx)(itwinui_react_1.LabeledInput, { className: "custom-param-edit-dialog-input", label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamKeyLabel"), value: item.key, onChange: (event) => setItem({ ...item, key: event.target.value }) }), (0, jsx_runtime_1.jsx)(itwinui_react_1.LabeledInput, { className: "custom-param-edit-dialog-input", label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamValueLabel"), type: item.secret ? "password" : "", value: item.value, onChange: (event) => setItem({ ...item, value: event.target.value }), message: !item.secret ? mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.ParamValueNonPrivateMessage") : undefined }), (0, jsx_runtime_1.jsx)("div", { className: "custom-param-edit-dialog-secret custom-param-edit-dialog-input", title: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.PrivateToggleTooltip"), children: (0, jsx_runtime_1.jsx)(itwinui_react_1.ToggleSwitch, { checked: item.secret, label: mapLayers_1.MapLayersUI.translate("CustomParamEditDialog.PrivateToggleLabel"), onChange: (event) => setItem({ ...item, secret: event.target.checked }) }) }), renderFooter()] }) }));
 }
 exports.CustomParamEditDialog = CustomParamEditDialog;
 //# sourceMappingURL=CustomParamEditDialog.js.map

package/lib/cjs/ui/widget/CustomParamEditDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomParamEditDialog.js","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamEditDialog.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;gGAGgG;AAEhG,wCAAsC;AACtC,6CAA+B;AAC/B,oDAAiD;AACjD,~~kDAA2C~~;~~AAC3C~~,~~wDAA0E;AAC1E,~~mEAAgE;AAChE,+CAA8C;~~AAQ9C~~,~~gEAAgE;AAChE,~~SAAgB,qBAAqB,CAAC,KAAiC;IACrE,MAAM,CAAC,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,GAAG,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IAChH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAkB,GAAG,EAAE,CAAC,KAAK,CAAC,IAAI,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;IAC5H,MAAM,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,yCAAmB,EAAE,CAAC,CAAC;IAEpE,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC1C,IAAI,KAAK,CAAC,cAAc,EAAE;~~YACxB~~,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,OAAO;~~SACR~~;QACD,yBAAW,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACpC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACtC,IAAI,KAAK,CAAC,UAAU,EAAE;~~YACpB~~,KAAK,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;YACnC,OAAO;~~SACR~~;QACD,yBAAW,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACpC,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;IAElB,MAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CAAU,GAAG,EAAE;QACpD,MAAM,kBAAkB,GAAG,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;QAClF,OAAO,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,KAAK,IAAI,CAAC,IAAI,IAAI,kBAAkB,EAAE,CAAC,CAAC,CAAC,kBAAkB,EAAE,CAAC;IAC1G,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,CAAC,IAAI,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAE7C,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACzC,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC;IACzH,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAEzD,SAAS,YAAY;QACnB,OAAO,CACL,gCAAK,SAAS,EAAC,iCAAiC,YAC9C,iCAAK,SAAS,EAAC,yCAAyC,aACtD,uBAAC,sBAAM,IAAC,SAAS,EAAC,wCAAwC,EAAC,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,WAAW,EAAE,YAC/H,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,uBAAW,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,uBAAW,CAAC,SAAS,CAAC,YAAY,CAAC,GACjF,EACT,uBAAC,sBAAM,IAAC,SAAS,EAAC,wCAAwC,EAAC,SAAS,EAAC,SAAS,EAAC,OAAO,EAAE,YAAY,YACjG,uBAAW,CAAC,SAAS,CAAC,eAAe,CAAC,GAChC,IACL,GACF,CACP,CAAC;IACJ,CAAC;IACD,OAAO,CACL,uBAAC,~~mBAAM~~,~~IACL~~,KAAK,EAAE,uBAAW,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,uCAAuC,CAAC,CAAC,CAAC,sCAAsC,CAAC,EAC3H,MAAM,EAAE,IAAI,EACZ,~~SAAS,EAAE,IAAI,EACf,~~OAAO,EAAE,~~IAAI~~,~~EACb~~,KAAK,EAAE,~~IAAI,EACX,OAAO,~~EAAE,~~YAAY,EACrB,QAAQ,EAAE,YAAY,EACtB,~~SAAS,EAAE,GAAG,~~EACd~~,QAAQ,EAAE,GAAG,~~EACb~~,~~SAAS~~,~~EAAE~~,~~KAAK~~,~~YAEhB~~,~~6DACE~~,uBAAC,4BAAY,IACX,SAAS,EAAC,gCAAgC,EAC1C,KAAK,EAAE,uBAAW,CAAC,SAAS,CAAC,sCAAsC,CAAC,EACpE,KAAK,EAAE,IAAI,CAAC,IAAI,EAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,CAAC,EAAE,GAAG,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,EACnE,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACjD,OAAO,EAAE,iBAAiB,CAAC,CAAC,CAAC,uBAAW,CAAC,SAAS,CAAC,kCAAkC,CAAC,CAAC,CAAC,CAAC,SAAS,GAClG,EACF,uBAAC,4BAAY,IACX,SAAS,EAAC,gCAAgC,EAC1C,KAAK,EAAE,uBAAW,CAAC,SAAS,CAAC,qCAAqC,CAAC,EACnE,KAAK,EAAE,IAAI,CAAC,GAAG,EACf,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,GAClE,EACF,uBAAC,4BAAY,IACX,SAAS,EAAC,gCAAgC,EAC1C,KAAK,EAAE,uBAAW,CAAC,SAAS,CAAC,uCAAuC,CAAC,EACrE,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,EACnC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,CAAC,EAAE,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,EACpE,OAAO,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,uBAAW,CAAC,SAAS,CAAC,mDAAmD,CAAC,CAAC,CAAC,CAAC,SAAS,GAC9G,EACF,gCACE,SAAS,EAAC,gEAAgE,EAC1E,KAAK,EAAE,uBAAW,CAAC,SAAS,CAAC,4CAA4C,CAAC,YAE1E,uBAAC,4BAAY,IACX,OAAO,EAAE,IAAI,CAAC,MAAM,EACpB,KAAK,EAAE,uBAAW,CAAC,SAAS,CAAC,0CAA0C,CAAC,EACxE,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,OAAO,CAAC,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,GACvE,GACE,EACL,YAAY,EAAE,~~IACd~~,~~GACI~~,~~CACV~~,CAAC;AACJ,CAAC;~~AA9FD~~,~~sDA8FC~~","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 \"./CustomParamEditDialog.scss\";\nimport * as React from \"react\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { ~~Dialog } from \"@itwin/core-react\";\nimport {~~ Button, LabeledInput, ToggleSwitch } from \"@itwin/itwinui-react\";\nimport { CustomParamsStorage } from \"../../CustomParamsStorage\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport type { CustomParamItem } from \"../Interfaces\";\n\ninterface CustomParamEditDialogProps {\n item?: CustomParamItem;\n onOkResult?: (newItem: CustomParamItem, oldIem?: CustomParamItem) => void;\n onCancelResult?: () => void;\n}\~~n// eslint-disable-next-line @typescript-eslint/naming-convention\~~nexport function CustomParamEditDialog(props: CustomParamEditDialogProps) {\n const [originalItemName] = React.useState<string \| undefined>(() => (props.item ? props.item.name : undefined));\n const [item, setItem] = React.useState<CustomParamItem>(() => props.item ?? { name: \"\", key: \"\", value: \"\", secret: true });\n const [cpStorage] = React.useState(() => new CustomParamsStorage());\n\n const handleCancel = React.useCallback(() => {\n if (props.onCancelResult) {\n props.onCancelResult();\n return;\n }\n UiFramework.dialogs.modal.close();\n }, [props]);\n\n const handleOk = React.useCallback(() => {\n if (props.onOkResult) {\n props.onOkResult(item, props.item);\n return;\n }\n UiFramework.dialogs.modal.close();\n }, [item, props]);\n\n const nameAlreadyExists = React.useMemo<boolean>(() => {\n const itemExistInStorage = () => (item.name ? !!cpStorage.get(item.name) : false);\n return originalItemName ? originalItemName !== item.name && itemExistInStorage() : itemExistInStorage();\n }, [cpStorage, item.name, originalItemName]);\n\n const readyToSave = React.useCallback(() => {\n return item.name.trim().length > 0 && item.key.trim().length > 0 && item.value.trim().length > 0 && !nameAlreadyExists;\n }, [item.key, item.name, item.value, nameAlreadyExists]);\n\n function renderFooter() {\n return (\n <div className=\"custom-param-edit-dialog-footer\">\n <div className=\"custom-param-edit-dialog-footer-buttons\">\n <Button className=\"custom-param-edit-dialog-footer-button\" styleType=\"high-visibility\" onClick={handleOk} disabled={!readyToSave()}>\n {props.item ? MapLayersUI.translate(\"Dialog.Edit\") : MapLayersUI.translate(\"Dialog.Add\")}\n </Button>\n <Button className=\"custom-param-edit-dialog-footer-button\" styleType=\"default\" onClick={handleCancel}>\n {MapLayersUI.translate(\"Dialog.Cancel\")}\n </Button>\n </div>\n </div>\n );\n }\n return (\n <~~Dialog~~\n title={MapLayersUI.translate(props.item ? \"CustomParamEditDialog.DialogTitleEdit\" : \"CustomParamEditDialog.DialogTitleAdd\")}\n ~~opened~~={true}\n ~~resizable={true}\n movable={true}\n modal={true}\n~~ onClose={handleCancel}\n ~~onEscape~~={~~handleCancel}\n~~ minHeight={120~~}\n maxWidth={~~120}\n ~~trapFocus={false}~~\n >\n ~~<>\~~n <LabeledInput\n className=\"custom-param-edit-dialog-input\"\n label={MapLayersUI.translate(\"CustomParamEditDialog.ParamNameLabel\")}\n value={item.name}\n onChange={(event) => setItem({ ...item, name: event.target.value })}\n status={nameAlreadyExists ? \"warning\" : undefined}\n message={nameAlreadyExists ? MapLayersUI.translate(\"CustomParamEditDialog.NameExists\") : undefined}\n />\n <LabeledInput\n className=\"custom-param-edit-dialog-input\"\n label={MapLayersUI.translate(\"CustomParamEditDialog.ParamKeyLabel\")}\n value={item.key}\n onChange={(event) => setItem({ ...item, key: event.target.value })}\n />\n <LabeledInput\n className=\"custom-param-edit-dialog-input\"\n label={MapLayersUI.translate(\"CustomParamEditDialog.ParamValueLabel\")}\n type={item.secret ? \"password\" : \"\"}\n value={item.value}\n onChange={(event) => setItem({ ...item, value: event.target.value })}\n message={!item.secret ? MapLayersUI.translate(\"CustomParamEditDialog.ParamValueNonPrivateMessage\") : undefined}\n />\n <div\n className=\"custom-param-edit-dialog-secret custom-param-edit-dialog-input\"\n title={MapLayersUI.translate(\"CustomParamEditDialog.PrivateToggleTooltip\")}\n >\n <ToggleSwitch\n checked={item.secret}\n label={MapLayersUI.translate(\"CustomParamEditDialog.PrivateToggleLabel\")}\n onChange={(event) => setItem({ ...item, secret: event.target.checked })}\n />\n </div>\n {renderFooter()}\n ~~</>\~~n </~~Dialog~~>\n );\n}\n"]}
1	+ {"version":3,"file":"CustomParamEditDialog.js","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamEditDialog.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 \"./CustomParamEditDialog.scss\";\nimport * as React from \"react\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { Button, LabeledInput, Modal, ModalContent, ToggleSwitch } from \"@itwin/itwinui-react\";\nimport { CustomParamsStorage } from \"../../CustomParamsStorage\";\nimport { MapLayersUI } from \"../../mapLayers\";\n\nimport type { CustomParamItem } from \"../Interfaces\";\n\ninterface CustomParamEditDialogProps {\n item?: CustomParamItem;\n onOkResult?: (newItem: CustomParamItem, oldIem?: CustomParamItem) => void;\n onCancelResult?: () => void;\n}\nexport function CustomParamEditDialog(props: CustomParamEditDialogProps) {\n const [originalItemName] = React.useState<string \| undefined>(() => (props.item ? props.item.name : undefined));\n const [item, setItem] = React.useState<CustomParamItem>(() => props.item ?? { name: \"\", key: \"\", value: \"\", secret: true });\n const [cpStorage] = React.useState(() => new CustomParamsStorage());\n\n const handleCancel = React.useCallback(() => {\n if (props.onCancelResult) {\n props.onCancelResult();\n return;\n }\n UiFramework.dialogs.modal.close();\n }, [props]);\n\n const handleOk = React.useCallback(() => {\n if (props.onOkResult) {\n props.onOkResult(item, props.item);\n return;\n }\n UiFramework.dialogs.modal.close();\n }, [item, props]);\n\n const nameAlreadyExists = React.useMemo<boolean>(() => {\n const itemExistInStorage = () => (item.name ? !!cpStorage.get(item.name) : false);\n return originalItemName ? originalItemName !== item.name && itemExistInStorage() : itemExistInStorage();\n }, [cpStorage, item.name, originalItemName]);\n\n const readyToSave = React.useCallback(() => {\n return item.name.trim().length > 0 && item.key.trim().length > 0 && item.value.trim().length > 0 && !nameAlreadyExists;\n }, [item.key, item.name, item.value, nameAlreadyExists]);\n\n function renderFooter() {\n return (\n <div className=\"custom-param-edit-dialog-footer\">\n <div className=\"custom-param-edit-dialog-footer-buttons\">\n <Button className=\"custom-param-edit-dialog-footer-button\" styleType=\"high-visibility\" onClick={handleOk} disabled={!readyToSave()}>\n {props.item ? MapLayersUI.translate(\"Dialog.Edit\") : MapLayersUI.translate(\"Dialog.Add\")}\n </Button>\n <Button className=\"custom-param-edit-dialog-footer-button\" styleType=\"default\" onClick={handleCancel}>\n {MapLayersUI.translate(\"Dialog.Cancel\")}\n </Button>\n </div>\n </div>\n );\n }\n return (\n <Modal\n as=\"div\"\n title={MapLayersUI.translate(props.item ? \"CustomParamEditDialog.DialogTitleEdit\" : \"CustomParamEditDialog.DialogTitleAdd\")}\n isOpen={true}\n onClose={handleCancel}\n style={{ minHeight: 120, minWidth: 120 }}\n portal\n >\n <ModalContent>\n <LabeledInput\n className=\"custom-param-edit-dialog-input\"\n label={MapLayersUI.translate(\"CustomParamEditDialog.ParamNameLabel\")}\n value={item.name}\n onChange={(event) => setItem({ ...item, name: event.target.value })}\n status={nameAlreadyExists ? \"warning\" : undefined}\n message={nameAlreadyExists ? MapLayersUI.translate(\"CustomParamEditDialog.NameExists\") : undefined}\n />\n <LabeledInput\n className=\"custom-param-edit-dialog-input\"\n label={MapLayersUI.translate(\"CustomParamEditDialog.ParamKeyLabel\")}\n value={item.key}\n onChange={(event) => setItem({ ...item, key: event.target.value })}\n />\n <LabeledInput\n className=\"custom-param-edit-dialog-input\"\n label={MapLayersUI.translate(\"CustomParamEditDialog.ParamValueLabel\")}\n type={item.secret ? \"password\" : \"\"}\n value={item.value}\n onChange={(event) => setItem({ ...item, value: event.target.value })}\n message={!item.secret ? MapLayersUI.translate(\"CustomParamEditDialog.ParamValueNonPrivateMessage\") : undefined}\n />\n <div\n className=\"custom-param-edit-dialog-secret custom-param-edit-dialog-input\"\n title={MapLayersUI.translate(\"CustomParamEditDialog.PrivateToggleTooltip\")}\n >\n <ToggleSwitch\n checked={item.secret}\n label={MapLayersUI.translate(\"CustomParamEditDialog.PrivateToggleLabel\")}\n onChange={(event) => setItem({ ...item, secret: event.target.checked })}\n />\n </div>\n {renderFooter()}\n </ModalContent>\n </Modal>\n );\n}\n"]}

package/lib/cjs/ui/widget/CustomParamsSettings.d.ts CHANGED Viewed

@@ -1,4 +1,7 @@
-/// <reference types="react" />
 import "./CustomParamsSettings.scss";
-export declare function CustomParamsSettingsPanel(): JSX.Element;
+interface CustomParamsSettingsPanelProps {
+    onHandleOutsideClick?: (shouldHandle: boolean) => void;
+}
+export declare function CustomParamsSettingsPanel({ onHandleOutsideClick }: CustomParamsSettingsPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};
 //# sourceMappingURL=CustomParamsSettings.d.ts.map

package/lib/cjs/ui/widget/CustomParamsSettings.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomParamsSettings.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamsSettings.tsx"],"names":[],"mappings":";AAKA,OAAO,6BAA6B,CAAC;~~AAkBrC~~,wBAAgB,yBAAyB,~~gBAuKxC~~"}
1	+ {"version":3,"file":"CustomParamsSettings.d.ts","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamsSettings.tsx"],"names":[],"mappings":"AAKA,OAAO,6BAA6B,CAAC;AAgBrC,UAAU,8BAA8B;IACtC,oBAAoB,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,KAAK,IAAI,CAAC;CACxD;AACD,wBAAgB,yBAAyB,CAAC,EAAE,oBAAoB,EAAE,EAAE,8BAA8B,2CAsLjG"}

package/lib/cjs/ui/widget/CustomParamsSettings.js CHANGED Viewed

@@ -32,7 +32,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("./CustomParamsSettings.scss");
 const React = __importStar(require("react"));
 const appui_react_1 = require("@itwin/appui-react");
-const core_react_1 = require("@itwin/core-react");
 const itwinui_icons_color_react_1 = require("@itwin/itwinui-icons-color-react");
 const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
 const itwinui_react_1 = require("@itwin/itwinui-react");
@@ -40,8 +39,7 @@ const CustomParamsMappingStorage_1 = require("../../CustomParamsMappingStorage")
 const CustomParamsStorage_1 = require("../../CustomParamsStorage");
 const mapLayers_1 = require("../../mapLayers");
 const CustomParamEditDialog_1 = require("./CustomParamEditDialog");
-// eslint-disable-next-line @typescript-eslint/naming-convention
-function CustomParamsSettingsPanel() {
+function CustomParamsSettingsPanel({ onHandleOutsideClick }) {
     const [storage] = React.useState(() => new CustomParamsStorage_1.CustomParamsStorage());
     const [mappingStorage] = React.useState(() => new CustomParamsMappingStorage_1.CustomParamsMappingStorage());
     const [params, setParams] = React.useState(() => {
@@ -55,7 +53,6 @@ function CustomParamsSettingsPanel() {
         return paramsMap;
     });
     const [listItemUnderCursor, setListItemUnderCursor] = React.useState();
-    const [selectedValue, setSelectedValue] = React.useState();
     const deleteMapping = React.useCallback((name) => {
         const tmpParams = { ...params };
         delete tmpParams[name];
@@ -72,17 +69,26 @@ function CustomParamsSettingsPanel() {
             }
         }
     }, [mappingStorage, params, storage]);
+    const resumeOutsideClick = React.useCallback(() => {
+        if (onHandleOutsideClick) {
+            onHandleOutsideClick(true);
+        }
+    }, [onHandleOutsideClick]);
     /*
      Handle Remove layer button clicked
      */
     const onItemRemoveButtonClicked = React.useCallback((name, event) => {
         event.stopPropagation(); // We don't want the owning ListBox to react on mouse click.
         deleteMapping(name);
-    }, [deleteMapping]);
+        if (onHandleOutsideClick) {
+            onHandleOutsideClick(false);
+        }
+        ;
+    }, [deleteMapping, onHandleOutsideClick]);
     const onCancelEdit = React.useCallback(() => {
         appui_react_1.UiFramework.dialogs.modal.close();
-        setSelectedValue(undefined); // clear listbox focus
-    }, []);
+        resumeOutsideClick();
+    }, [resumeOutsideClick]);
     const onOkEdit = React.useCallback((newItem, oldItem) => {
         appui_react_1.UiFramework.dialogs.modal.close();
         // If the edited item has a new name, delete the entry first.
@@ -104,26 +110,34 @@ function CustomParamsSettingsPanel() {
         }
         storage.save(newItem.name, newItem);
         tmpParams[newItem.name] = newItem;
+        if (onHandleOutsideClick) {
+            onHandleOutsideClick(false);
+        }
+        ;
         setParams(tmpParams);
-        setSelectedValue(undefined); // clear listbox focus
-    }, [mappingStorage, params, storage]);
+    }, [mappingStorage, params, storage, onHandleOutsideClick]);
     const handleAddClick = React.useCallback(() => {
+        if (onHandleOutsideClick) {
+            onHandleOutsideClick(false);
+        }
         appui_react_1.UiFramework.dialogs.modal.open((0, jsx_runtime_1.jsx)(CustomParamEditDialog_1.CustomParamEditDialog, { onOkResult: onOkEdit, onCancelResult: onCancelEdit }));
         return;
-    }, [onCancelEdit, onOkEdit]);
-    const onListboxValueChange = React.useCallback((newValue, _isControlOrCommandPressed) => {
+    }, [onCancelEdit, onOkEdit, onHandleOutsideClick]);
+    const onListboxValueChange = React.useCallback((newValue, event) => {
+        event.stopPropagation();
+        ;
         const item = params[newValue];
         if (item) {
             appui_react_1.UiFramework.dialogs.modal.open((0, jsx_runtime_1.jsx)(CustomParamEditDialog_1.CustomParamEditDialog, { item: item, onOkResult: onOkEdit, onCancelResult: onCancelEdit }));
         }
-        setSelectedValue(newValue);
+        if (onHandleOutsideClick) {
+            onHandleOutsideClick(false);
+        }
         return;
-    }, [params, onCancelEdit, onOkEdit]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "customParamsSettings-container", children: [(0, jsx_runtime_1.jsxs)("div", { className: "customParamsSettings-header", children: [(0, jsx_runtime_1.jsxs)("span", { className: "customParamsSettings-header-label", children: [mapLayers_1.MapLayersUI.translate("CustomParamSettings.SectionLabel"), (0, jsx_runtime_1.jsx)("div", { title: mapLayers_1.MapLayersUI.translate("Labels.TechPreviewBadgeTooltip"), className: "customParamsSettings-previewBadge", children: (0, jsx_runtime_1.jsx)(itwinui_react_1.Icon, { size: "small", children: (0, jsx_runtime_1.jsx)(itwinui_icons_color_react_1.SvgTechnicalPreviewMini, {}) }) })] }), (0, jsx_runtime_1.jsx)(itwinui_react_1.IconButton, { size: "small", styleType: "borderless", className: "customParamsSettings-header-add-button", onClick: handleAddClick, children: (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgAdd, {}) })] }), (0, jsx_runtime_1.jsx)("div", { className: "customParamsSettings-content", children: (0, jsx_runtime_1.jsx)(core_react_1.Listbox, { selectedValue: selectedValue, onListboxValueChange: onListboxValueChange, className: "customParamsSettings-content-listbox", children: Object.keys(params).map((keyName) => (
-                    // eslint-disable-next-line @itwin/no-internal
-                    (0, jsx_runtime_1.jsxs)(core_react_1.ListboxItem, { className: "customParamsSettings-content-entry", value: keyName, onMouseEnter: () => setListItemUnderCursor(keyName), onMouseLeave: () => setListItemUnderCursor(undefined), children: [(0, jsx_runtime_1.jsx)("span", { className: "customParamsSettings-content-entry-name", title: keyName, children: keyName }),
+    }, [params, onCancelEdit, onOkEdit, onHandleOutsideClick]);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "customParamsSettings-container", children: [(0, jsx_runtime_1.jsxs)("div", { className: "customParamsSettings-header", children: [(0, jsx_runtime_1.jsxs)("span", { className: "customParamsSettings-header-label", children: [mapLayers_1.MapLayersUI.translate("CustomParamSettings.SectionLabel"), (0, jsx_runtime_1.jsx)("div", { title: mapLayers_1.MapLayersUI.translate("Labels.TechPreviewBadgeTooltip"), className: "customParamsSettings-previewBadge", children: (0, jsx_runtime_1.jsx)(itwinui_react_1.Icon, { size: "small", children: (0, jsx_runtime_1.jsx)(itwinui_icons_color_react_1.SvgTechnicalPreviewMini, {}) }) })] }), (0, jsx_runtime_1.jsx)(itwinui_react_1.IconButton, { label: "Add", size: "small", styleType: "borderless", className: "customParamsSettings-header-add-button", onClick: handleAddClick, children: (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgAdd, {}) })] }), (0, jsx_runtime_1.jsx)("div", { className: "customParamsSettings-content", children: (0, jsx_runtime_1.jsx)(itwinui_react_1.List, { as: "div", className: "customParamsSettings-content-listbox", children: Object.keys(params).map((keyName) => ((0, jsx_runtime_1.jsxs)(itwinui_react_1.ListItem, { as: "div", actionable: true, className: "customParamsSettings-content-entry", onClick: (e) => onListboxValueChange(keyName, e), onMouseEnter: () => setListItemUnderCursor(keyName), onMouseLeave: () => setListItemUnderCursor(undefined), children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.ListItem.Content, { className: "customParamsSettings-content-entry-name", children: keyName }),
                             // Display the delete icon only when the mouse over a specific item otherwise list feels cluttered.
-                            listItemUnderCursor && listItemUnderCursor === keyName && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.IconButton, { size: "small", styleType: "borderless", className: "map-source-list-entry-button", title: mapLayers_1.MapLayersUI.translate("CustomParamSettings.EditButtonTitle"), children: (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgEdit, {}) }), (0, jsx_runtime_1.jsx)(itwinui_react_1.IconButton, { size: "small", styleType: "borderless", className: "customParamsSettings-content-entry-button", title: mapLayers_1.MapLayersUI.translate("CustomParamSettings.DeleteButtonTitle"), onClick: (event) => {
+                            listItemUnderCursor && listItemUnderCursor === keyName && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(itwinui_react_1.IconButton, { size: "small", styleType: "borderless", className: "map-source-list-entry-button", label: mapLayers_1.MapLayersUI.translate("CustomParamSettings.EditButtonTitle"), children: (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgEdit, {}) }), (0, jsx_runtime_1.jsx)(itwinui_react_1.IconButton, { size: "small", styleType: "borderless", className: "customParamsSettings-content-entry-button", label: mapLayers_1.MapLayersUI.translate("CustomParamSettings.DeleteButtonTitle"), onClick: (event) => {
                                             onItemRemoveButtonClicked(keyName, event);
                                         }, children: (0, jsx_runtime_1.jsx)(itwinui_icons_react_1.SvgDelete, {}) })] }))] }, keyName))) }) })] }));
 }

package/lib/cjs/ui/widget/CustomParamsSettings.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomParamsSettings.js","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamsSettings.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 \"./CustomParamsSettings.scss\";\nimport * as React from \"react\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { Listbox, ListboxItem } from \"@itwin/core-react\";\nimport { SvgTechnicalPreviewMini } from \"@itwin/itwinui-icons-color-react\";\nimport { SvgAdd, SvgDelete, SvgEdit } from \"@itwin/itwinui-icons-react\";\nimport { Icon, IconButton } from \"@itwin/itwinui-react\";\nimport { CustomParamsMappingStorage } from \"../../CustomParamsMappingStorage\";\nimport { CustomParamsStorage } from \"../../CustomParamsStorage\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { CustomParamEditDialog } from \"./CustomParamEditDialog\";\n\nimport type { ListboxValue } from \"@itwin/core-react\";\nimport type { CustomParamItem } from \"../Interfaces\";\ninterface CustomParamsMap {\n [paramName: string]: CustomParamItem;\n}\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function CustomParamsSettingsPanel() {\n const [storage] = React.useState(() => new CustomParamsStorage());\n const [mappingStorage] = React.useState(() => new CustomParamsMappingStorage());\n\n const [params, setParams] = React.useState<CustomParamsMap>(() => {\n const paramsMap: CustomParamsMap = {};\n const paramsList = storage.get(undefined);\n if (Array.isArray(paramsList)) {\n for (const param of paramsList) {\n paramsMap[param.name] = param;\n }\n }\n return paramsMap;\n });\n\n const [listItemUnderCursor, setListItemUnderCursor] = React.useState<string \| undefined>();\n const [selectedValue, setSelectedValue] = React.useState<string \| undefined>();\n\n const deleteMapping = React.useCallback(\n (name: string) => {\n const tmpParams = { ...params };\n delete tmpParams[name];\n setParams(tmpParams);\n storage.delete(name);\n\n // Cascade delete to api key mapping\n const mappingContent = mappingStorage.getContent();\n if (mappingContent) {\n for (const itemKey of Object.keys(mappingContent)) {\n if (mappingContent[itemKey].customParamNames.includes(name)) {\n const newParamNames = mappingContent[itemKey].customParamNames.filter((value) => value !== name);\n newParamNames.length > 0 ? mappingStorage.save(itemKey, { customParamNames: newParamNames }) : mappingStorage.delete(itemKey);\n }\n }\n }\n },\n [mappingStorage, params, storage],\n );\n\n /\n Handle Remove layer button clicked\n /\n const onItemRemoveButtonClicked = React.useCallback(\n (name: string, event) => {\n event.stopPropagation(); // We don't want the owning ListBox to react on mouse click.\n deleteMapping(name);\n },\n [deleteMapping],\n );\n\n const onCancelEdit = React.useCallback(() => {\n UiFramework.dialogs.modal.close();\n setSelectedValue(undefined); // clear listbox focus\n }, []);\n\n const onOkEdit = React.useCallback(\n (newItem: CustomParamItem, oldItem?: CustomParamItem) => {\n UiFramework.dialogs.modal.close();\n\n // If the edited item has a new name, delete the entry first.\n const tmpParams = { ...params };\n if (oldItem && oldItem.name !== newItem.name) {\n delete tmpParams[oldItem.name];\n setParams(tmpParams);\n storage.delete(oldItem.name);\n\n const mappingContent = mappingStorage.getContent();\n if (mappingContent) {\n for (const itemKey of Object.keys(mappingContent)) {\n if (mappingContent[itemKey].customParamNames.includes(oldItem.name)) {\n const newParamNames = mappingContent[itemKey].customParamNames.filter((value) => value !== oldItem.name);\n newParamNames.push(newItem.name);\n mappingStorage.save(itemKey, { customParamNames: newParamNames });\n }\n }\n }\n }\n storage.save(newItem.name, newItem);\n\n tmpParams[newItem.name] = newItem;\n setParams(tmpParams);\n setSelectedValue(undefined); // clear listbox focus\n },\n [mappingStorage, params, storage],\n );\n\n const handleAddClick = React.useCallback(() => {\n UiFramework.dialogs.modal.open(<CustomParamEditDialog onOkResult={onOkEdit} onCancelResult={onCancelEdit} />);\n return;\n }, [onCancelEdit, onOkEdit]);\n\n const onListboxValueChange = React.useCallback(\n (newValue: ListboxValue, _isControlOrCommandPressed?: boolean) => {\n const item = params[newValue];\n if (item) {\n UiFramework.dialogs.modal.open(<CustomParamEditDialog item={item} onOkResult={onOkEdit} onCancelResult={onCancelEdit} />);\n }\n\n setSelectedValue(newValue);\n return;\n },\n [params, onCancelEdit, onOkEdit],\n );\n\n return (\n <div className=\"customParamsSettings-container\">\n <div className=\"customParamsSettings-header\">\n <span className=\"customParamsSettings-header-label\">\n {MapLayersUI.translate(\"CustomParamSettings.SectionLabel\")}\n <div title={MapLayersUI.translate(\"Labels.TechPreviewBadgeTooltip\")} className=\"customParamsSettings-previewBadge\">\n <Icon size=\"small\">\n <SvgTechnicalPreviewMini />\n </Icon>\n </div>\n </span>\n\n <IconButton size=\"small\" styleType=\"borderless\" className=\"customParamsSettings-header-add-button\" onClick={handleAddClick}>\n <SvgAdd />\n </IconButton>\n </div>\n <div className=\"customParamsSettings-content\">\n {/* eslint-disable-next-line @itwin/no-internal */}\n <Listbox selectedValue={selectedValue} onListboxValueChange={onListboxValueChange} className=\"customParamsSettings-content-listbox\">\n {Object.keys(params).map((keyName) => (\n // eslint-disable-next-line @itwin/no-internal\n <ListboxItem\n key={keyName}\n className=\"customParamsSettings-content-entry\"\n value={keyName}\n onMouseEnter={() => setListItemUnderCursor(keyName)}\n onMouseLeave={() => setListItemUnderCursor(undefined)}\n >\n <span className=\"customParamsSettings-content-entry-name\" title={keyName}>\n {keyName}\n </span>\n {\n // Display the delete icon only when the mouse over a specific item otherwise list feels cluttered.\n listItemUnderCursor && listItemUnderCursor === keyName && (\n <>\n <IconButton\n size=\"small\"\n styleType=\"borderless\"\n className=\"map-source-list-entry-button\"\n title={MapLayersUI.translate(\"CustomParamSettings.EditButtonTitle\")}\n >\n <SvgEdit />\n </IconButton>\n <IconButton\n size=\"small\"\n styleType=\"borderless\"\n className=\"customParamsSettings-content-entry-button\"\n title={MapLayersUI.translate(\"CustomParamSettings.DeleteButtonTitle\")}\n onClick={(event) => {\n onItemRemoveButtonClicked(keyName, event);\n }}\n >\n <SvgDelete />\n </IconButton>\n </>\n )\n }\n </ListboxItem>\n ))}\n </Listbox>\n </div>\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"CustomParamsSettings.js","sourceRoot":"","sources":["../../../../src/ui/widget/CustomParamsSettings.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 \"./CustomParamsSettings.scss\";\nimport * as React from \"react\";\nimport { UiFramework } from \"@itwin/appui-react\";\nimport { SvgTechnicalPreviewMini } from \"@itwin/itwinui-icons-color-react\";\nimport { SvgAdd, SvgDelete, SvgEdit } from \"@itwin/itwinui-icons-react\";\nimport { Icon, IconButton, List, ListItem } from \"@itwin/itwinui-react\";\nimport { CustomParamsMappingStorage } from \"../../CustomParamsMappingStorage\";\nimport { CustomParamsStorage } from \"../../CustomParamsStorage\";\nimport { MapLayersUI } from \"../../mapLayers\";\nimport { CustomParamEditDialog } from \"./CustomParamEditDialog\";\n\nimport type { CustomParamItem } from \"../Interfaces\";\ninterface CustomParamsMap {\n [paramName: string]: CustomParamItem;\n}\n\ninterface CustomParamsSettingsPanelProps {\n onHandleOutsideClick?: (shouldHandle: boolean) => void;\n}\nexport function CustomParamsSettingsPanel({ onHandleOutsideClick }: CustomParamsSettingsPanelProps) {\n const [storage] = React.useState(() => new CustomParamsStorage());\n const [mappingStorage] = React.useState(() => new CustomParamsMappingStorage());\n\n const [params, setParams] = React.useState<CustomParamsMap>(() => {\n const paramsMap: CustomParamsMap = {};\n const paramsList = storage.get(undefined);\n if (Array.isArray(paramsList)) {\n for (const param of paramsList) {\n paramsMap[param.name] = param;\n }\n }\n return paramsMap;\n });\n\n const [listItemUnderCursor, setListItemUnderCursor] = React.useState<string \| undefined>();\n\n const deleteMapping = React.useCallback(\n (name: string) => {\n const tmpParams = { ...params };\n delete tmpParams[name];\n setParams(tmpParams);\n storage.delete(name);\n\n // Cascade delete to api key mapping\n const mappingContent = mappingStorage.getContent();\n if (mappingContent) {\n for (const itemKey of Object.keys(mappingContent)) {\n if (mappingContent[itemKey].customParamNames.includes(name)) {\n const newParamNames = mappingContent[itemKey].customParamNames.filter((value) => value !== name);\n newParamNames.length > 0 ? mappingStorage.save(itemKey, { customParamNames: newParamNames }) : mappingStorage.delete(itemKey);\n }\n }\n }\n },\n [mappingStorage, params, storage],\n );\n\n const resumeOutsideClick = React.useCallback(() => {\n if (onHandleOutsideClick) {\n onHandleOutsideClick(true);\n }\n }, [onHandleOutsideClick]);\n /\n Handle Remove layer button clicked\n /\n const onItemRemoveButtonClicked = React.useCallback(\n (name: string, event: React.MouseEvent) => {\n event.stopPropagation(); // We don't want the owning ListBox to react on mouse click.\n deleteMapping(name);\n if (onHandleOutsideClick) {\n onHandleOutsideClick(false);\n };\n },\n [deleteMapping, onHandleOutsideClick],\n );\n\n const onCancelEdit = React.useCallback(() => {\n UiFramework.dialogs.modal.close();\n resumeOutsideClick();\n }, [resumeOutsideClick]);\n\n const onOkEdit = React.useCallback(\n (newItem: CustomParamItem, oldItem?: CustomParamItem) => {\n UiFramework.dialogs.modal.close();\n\n // If the edited item has a new name, delete the entry first.\n const tmpParams = { ...params };\n if (oldItem && oldItem.name !== newItem.name) {\n delete tmpParams[oldItem.name];\n setParams(tmpParams);\n storage.delete(oldItem.name);\n\n const mappingContent = mappingStorage.getContent();\n if (mappingContent) {\n for (const itemKey of Object.keys(mappingContent)) {\n if (mappingContent[itemKey].customParamNames.includes(oldItem.name)) {\n const newParamNames = mappingContent[itemKey].customParamNames.filter((value) => value !== oldItem.name);\n newParamNames.push(newItem.name);\n mappingStorage.save(itemKey, { customParamNames: newParamNames });\n }\n }\n }\n }\n storage.save(newItem.name, newItem);\n\n tmpParams[newItem.name] = newItem;\n if (onHandleOutsideClick) {\n onHandleOutsideClick(false);\n };\n setParams(tmpParams);\n },\n [mappingStorage, params, storage, onHandleOutsideClick],\n );\n\n const handleAddClick = React.useCallback(() => {\n if (onHandleOutsideClick) {\n onHandleOutsideClick(false);\n }\n UiFramework.dialogs.modal.open(<CustomParamEditDialog onOkResult={onOkEdit} onCancelResult={onCancelEdit} />);\n\n return;\n }, [onCancelEdit, onOkEdit, onHandleOutsideClick]);\n\n const onListboxValueChange = React.useCallback(\n (newValue: string, event: React.MouseEvent) => {\n event.stopPropagation();;\n const item = params[newValue];\n if (item) {\n UiFramework.dialogs.modal.open(<CustomParamEditDialog item={item} onOkResult={onOkEdit} onCancelResult={onCancelEdit} />);\n }\n if (onHandleOutsideClick) {\n onHandleOutsideClick(false);\n }\n return;\n },\n [params, onCancelEdit, onOkEdit, onHandleOutsideClick],\n );\n\n return (\n <div className=\"customParamsSettings-container\">\n <div className=\"customParamsSettings-header\">\n <span className=\"customParamsSettings-header-label\">\n {MapLayersUI.translate(\"CustomParamSettings.SectionLabel\")}\n <div title={MapLayersUI.translate(\"Labels.TechPreviewBadgeTooltip\")} className=\"customParamsSettings-previewBadge\">\n <Icon size=\"small\">\n <SvgTechnicalPreviewMini />\n </Icon>\n </div>\n </span>\n\n <IconButton label=\"Add\" size=\"small\" styleType=\"borderless\" className=\"customParamsSettings-header-add-button\" onClick={handleAddClick}>\n <SvgAdd />\n </IconButton>\n </div>\n <div className=\"customParamsSettings-content\">\n <List as=\"div\" className=\"customParamsSettings-content-listbox\">\n {Object.keys(params).map((keyName) => (\n <ListItem\n as=\"div\"\n key={keyName}\n actionable\n className=\"customParamsSettings-content-entry\"\n onClick={(e: React.MouseEvent) => onListboxValueChange(keyName, e)}\n onMouseEnter={() => setListItemUnderCursor(keyName)}\n onMouseLeave={() => setListItemUnderCursor(undefined)}\n >\n <ListItem.Content className=\"customParamsSettings-content-entry-name\">\n {keyName}\n </ListItem.Content>\n {\n // Display the delete icon only when the mouse over a specific item otherwise list feels cluttered.\n listItemUnderCursor && listItemUnderCursor === keyName && (\n <>\n <IconButton\n size=\"small\"\n styleType=\"borderless\"\n className=\"map-source-list-entry-button\"\n label={MapLayersUI.translate(\"CustomParamSettings.EditButtonTitle\")}\n >\n <SvgEdit />\n </IconButton>\n <IconButton\n size=\"small\"\n styleType=\"borderless\"\n className=\"customParamsSettings-content-entry-button\"\n label={MapLayersUI.translate(\"CustomParamSettings.DeleteButtonTitle\")}\n onClick={(event) => {\n onItemRemoveButtonClicked(keyName, event);\n }}\n >\n <SvgDelete />\n </IconButton>\n </>\n )\n }\n </ListItem>\n ))}\n </List>\n </div>\n </div>\n );\n}\n"]}

package/lib/cjs/ui/widget/CustomParamsSettings.scss CHANGED Viewed

@@ -39,6 +39,8 @@ button.customParamsSettings-button {
   .customParamsSettings-content {
     height: 100px;
     min-height: 60px;
+    overflow-x: hidden;
+    overflow-y: auto;
     border-top: 1px solid #ccc;
     .customParamsSettings-content-listbox {