@esri/solutions-components 1.2.0-next.57 → 1.2.0-next.58

package/dist/components/refine-selection/customElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"customElement.js","sources":["../../../src/components/refine-selection/refine-selection.tsx"],"sourcesContent":["/**\r\n * @license\r\n * Copyright 2025 Esri\r\n *\r\n * Licensed under the Apache License, Version 2.0 (the 'License');\r\n * you may not use this file except in compliance with the License.\r\n * You may obtain a copy of the License at\r\n *\r\n *    http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * Unless required by applicable law or agreed to in writing, software\r\n * distributed under the License is distributed on an 'AS IS' BASIS,\r\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n * See the License for the specific language governing permissions and\r\n * limitations under the License.\r\n */\r\n\r\nimport type {\r\n  DistanceUnit,\r\n  IRefineOperation,\r\n  ISelectionSet\r\n} from '../../utils/interfaces';\r\nimport {\r\n  EDrawMode,\r\n  EWorkflowType,\r\n  ESelectionMode,\r\n} from '../../utils/interfaces';\r\nimport { getIdSets, getFeatureLayerView, highlightAllFeatures } from '../../utils/mapViewUtils';\r\nimport { queryFeaturesByGeometry } from '../../utils/queryUtils';\r\nimport type T9nStrings from './assets/t9n/messages.en.json';\r\nimport { useT9n } from '../../controllers/useT9n';\r\nimport { createRef } from 'lit-html/directives/ref.js';\r\nimport {\r\n  LitElement,\r\n  property,\r\n  createEvent,\r\n  Fragment,\r\n  h,\r\n  noShadowRoot,\r\n  state,\r\n} from '@arcgis/lumina';\r\nimport type {\r\n  JsxNode,\r\n} from '@arcgis/lumina';\r\nimport { styles } from './refine-selection.css';\r\nimport type { MapLayerPicker } from '../map-layer-picker/map-layer-picker';\r\nimport type { MapDrawTools } from '../map-draw-tools/map-draw-tools';\r\nimport type { BufferTools } from '../buffer-tools/buffer-tools';\r\nimport {\r\n  useContextConsumer,\r\n} from '@arcgis/lumina/context';\r\nimport {\r\n  pnContext,\r\n} from '../../utils/publicNotificationContext';\r\nimport type { PropertyValues } from 'lit';\r\nimport Graphic from '@arcgis/core/Graphic';\r\nimport GraphicsLayer from '@arcgis/core/layers/GraphicsLayer';\r\n\r\ndeclare global {\r\n  interface DeclareElements {\r\n    'refine-selection': RefineSelection;\r\n  }\r\n}\r\n\r\nexport class RefineSelection extends LitElement {\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Overrides (internal)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  static override styles = styles;\r\n\r\n  static override shadowRootOptions = noShadowRoot;\r\n\r\n  /** TODO: [MIGRATION] Consider inlining some of the watch functions called inside of this method to reduce boilerplate code */\r\n  override willUpdate(\r\n    changes: PropertyValues<this>\r\n  ): void {\r\n    if (changes.has('defaultBufferUnit') && this.hasUpdated && this._refineSelectionSet) {\r\n      this._refineSelectionSet.unit = this.defaultBufferUnit!;\r\n    }\r\n\r\n    if (changes.has('defaultBufferDistance') && this.hasUpdated && this._refineSelectionSet) {\r\n      this._refineSelectionSet.distance = this.defaultBufferDistance!;\r\n    }\r\n  }\r\n\r\n\r\n  constructor() {\r\n    super();\r\n    this.listenOn<CustomEvent>(window, 'distanceChanged', this.distanceChanged);\r\n    this.listenOn<CustomEvent>(window, 'unitChanged', this.unitChanged);\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /** esri/views/layers/FeatureLayerView: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-layers-FeatureLayerView.html */\r\n  @property() addresseeLayer: __esri.FeatureLayerView | undefined;\r\n\r\n  /**\r\n   * string[]: Optional list of enabled layer ids\r\n   *  If empty all layers will be available\r\n   */\r\n  @property() enabledLayerIds: string[] = [];\r\n\r\n  /** boolean: When true users will be allowed to optionally create a buffer around the selection geometry */\r\n  @property() enableSearchDistance = true;\r\n\r\n  /** boolean: When true the serach distance options will be enabled when the component loads */\r\n  @property() enableSearchDistanceOnLoad = false;\r\n\r\n  /** esri/views/MapView: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html */\r\n  @property() mapView: __esri.MapView | undefined;\r\n\r\n  /** boolean: when true buffer tools controls are enabled */\r\n  @property() searchDistanceEnabled = false;\r\n\r\n  /** utils/interfaces/ISelectionSet: An array of user defined selection sets */\r\n  @property() selectionSets: ISelectionSet[] = [];\r\n\r\n  /** esri/symbols/SimpleLineSymbol | JSON representation : https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-SimpleLineSymbol.html */\r\n  @property() sketchLineSymbol: __esri.SimpleLineSymbol | undefined;\r\n\r\n  /** esri/symbols/SimpleMarkerSymbol | JSON representation: https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-SimpleMarkerSymbol.html */\r\n  @property() sketchPointSymbol: __esri.SimpleMarkerSymbol | undefined;\r\n\r\n  /** esri/symbols/SimpleFillSymbol | JSON representation: https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-SimpleFillSymbol.html */\r\n  @property() sketchPolygonSymbol: __esri.SimpleFillSymbol | undefined;\r\n\r\n  /** number: The default value to show for the buffer unit */\r\n  @property() defaultBufferUnit: DistanceUnit | undefined;\r\n\r\n  /** string | number[] |  object with r, g, b, a: https://developers.arcgis.com/javascript/latest/api-reference/esri-Color.html */\r\n  @property() bufferColor: any = [227, 139, 79, 0.8];\r\n\r\n  /** string | number[] | object with r, g, b, a: https://developers.arcgis.com/javascript/latest/api-reference/esri-Color.html */\r\n  @property() bufferOutlineColor: any = [255, 255, 255];\r\n\r\n  /** number: The default value to show for the buffer distance */\r\n  @property() defaultBufferDistance: number | undefined;\r\n\r\n  /** esri/geometry: https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry.html */\r\n  @property() geometries: __esri.Geometry[] | undefined = [];\r\n\r\n  /** Array of drawn graphics for refine selection */\r\n  @property() drawnGraphicsArr: { drawnGraphics: __esri.Graphic | undefined; bufferGraphics: __esri.Graphic | undefined }[] = [];\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  State (internal)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Contains the translations for this component.\r\n   * All UI strings should be defined here.\r\n   */\r\n  @state() _translations = useT9n<typeof T9nStrings>({ name: 'refine-selection', blocking: true });\r\n\r\n  /** The current selection mode ADD or REMOVE */\r\n  @state() _selectionMode: ESelectionMode = ESelectionMode.ADD;\r\n\r\n  /** The current layer to refine */\r\n  @state() _refineLayer: __esri.FeatureLayerView | undefined;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (private)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /** boolean: Indicates if any new graphics should be added or removed */\r\n  private _addEnabled = true;\r\n\r\n  /** HTMLMapDrawToolsElement: The tools used to create graphics */\r\n  private _drawTools = createRef<MapDrawTools['el']>();\r\n\r\n  /** string[]: The list of all layers that have current selections */\r\n  private _enabledLayerIds: string[] = [];\r\n\r\n  /** HTMLMapLayerPickerElement: The layer picker used to define what layer you are refining */\r\n  private _layerPicker = createRef<MapLayerPicker['el']>();\r\n\r\n  /** {<layer id>: Graphic[]}: Collection of graphics returned from queries to the layer */\r\n  private _featuresCollection: { [key: string]: __esri.Graphic[] } = {};\r\n\r\n  /** The context consumer for shared PN state */\r\n  private _pnContextConsumer = useContextConsumer({\r\n    context: pnContext,\r\n    subscribe: true,\r\n  });\r\n\r\n  /** ISelectionSet: The current selection set to refine */\r\n  private _refineSelectionSet: ISelectionSet | undefined;\r\n\r\n  /** esri/geometry: https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry.html */\r\n  private _bufferGeometry: __esri.Geometry | undefined;\r\n\r\n  /** HTMLBufferToolsElement: The container div for the buffer tools */\r\n  private _bufferTools = createRef<BufferTools['el']>();\r\n\r\n  /** esri/layers/GraphicsLayer: https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-GraphicsLayer.html */\r\n  private _bufferGraphicsLayer: __esri.GraphicsLayer | undefined;\r\n\r\n  /** Graphics array to hold undo action graphics */\r\n  private _undoGraphicsArr = [];\r\n\r\n  /** esri/Graphic: Drawn sketch graphic */\r\n  protected _sketchGraphics: __esri.Graphic | undefined;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Watch handlers\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Methods (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Events (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /** Emitted on demand when selection starts or ends. */\r\n  selectionLoadingChange = createEvent<boolean>();\r\n\r\n  /** Emitted on demand when selection sets change. */\r\n  selectionSetsChanged = createEvent<ISelectionSet[]>();\r\n\r\n  /** Handle changes to the buffer distance value */\r\n  private async distanceChanged(\r\n    event: CustomEvent\r\n  ): Promise<void> {\r\n    if (event.detail.newValue !== event.detail.oldValue && this._refineSelectionSet) {\r\n      this._refineSelectionSet.distance = event.detail.newValue;\r\n    }\r\n  }\r\n\r\n  /** Handle changes to the buffer unit */\r\n  private async unitChanged(\r\n    event: CustomEvent\r\n  ): Promise<void> {\r\n    if (event.detail.newValue !== event.detail.oldValue && this._refineSelectionSet) {\r\n      this._refineSelectionSet.unit = event.detail.newValue;\r\n    }\r\n  }\r\n\r\n  /** Called once just after the component is first connected to the DOM. */\r\n  async load(): Promise<void> {\r\n    this._enabledLayerIds = this._getEnabledLayerIds();\r\n    await this._setRefineSet(this._enabledLayerIds[0]);\r\n    this._undoGraphicsArr = this._refineSelectionSet?.undoGraphicsArr as never[];\r\n  }\r\n\r\n  /** Called once just after the component is fully loaded and the first render() occurs. */\r\n  /** This lifecycle method is not expected to return a promise. The returned promise will be ignored by Lit rather than awaited. */\r\n  async loaded(): Promise<void> {\r\n    await this._init();\r\n  }\r\n\r\n  /** Renders the component. */\r\n  override render(): JsxNode {\r\n    const layerPickerClass = this._enabledLayerIds.length > 1 ? 'display-block' : 'display-none';\r\n    return (\r\n      <>\r\n        <div class={`${layerPickerClass} padding-top-sides-1`}>\r\n          <div class='display-flex'>\r\n            <calcite-label class='font-bold width-full label-margin-0'>\r\n              <div class='display-flex'>\r\n                {this._translations.inputLayer}\r\n                <calcite-icon\r\n                  class='padding-start-1-2 icon'\r\n                  //specific to HE https://esriis.sharepoint.com/sites/i18n_t9n/SitePages/How-to-test-Arabic-and-Hebrew-languages.aspx\r\n                  flipRtl={!(this._translations._lang?.toLowerCase() === 'he')}\r\n                  icon='question'\r\n                  id='refine-input-layer'\r\n                  scale='s'\r\n                />\r\n              </div>\r\n              <map-layer-picker\r\n                enabledLayerIds={this._enabledLayerIds}\r\n                mapView={this.mapView}\r\n                onlayerSelectionChange={_evt => {\r\n                  void this._layerSelectionChange(_evt);\r\n                }}\r\n                ref={this._layerPicker}\r\n                selectedIds={this._refineLayer ? [this._refineLayer.layer.id] : []}\r\n                showTables={false}\r\n              />\r\n            </calcite-label>\r\n            <calcite-popover\r\n              closable={true}\r\n              label=''\r\n              overlayPositioning='fixed'\r\n              referenceElement='refine-input-layer'\r\n            >\r\n              <span class='tooltip-message'>\r\n                {this._translations.inputLayerTip}\r\n              </span>\r\n            </calcite-popover>\r\n          </div>\r\n        </div>\r\n        <div class='padding-1'>\r\n          <div class='padding-bottom-1'>\r\n            <calcite-segmented-control\r\n              class='w-100'\r\n              width='full'\r\n            >\r\n              <calcite-segmented-control-item\r\n                checked={this._addEnabled}\r\n                class='w-50 word-wrap-anywhere'\r\n                onClick={() => this._setSelectionMode(ESelectionMode.ADD)}\r\n                value={ESelectionMode.ADD}\r\n              >\r\n                <span class='font-weight-500'>\r\n                  {this._translations.add}\r\n                </span>\r\n              </calcite-segmented-control-item>\r\n              <calcite-segmented-control-item\r\n                checked={!this._addEnabled}\r\n                class='w-50 word-wrap-anywhere'\r\n                onClick={() => this._setSelectionMode(ESelectionMode.REMOVE)}\r\n                value={ESelectionMode.REMOVE}\r\n              >\r\n                <span class='font-weight-500'>\r\n                  {this._translations.remove}\r\n                </span>\r\n              </calcite-segmented-control-item>\r\n            </calcite-segmented-control>\r\n          </div>\r\n          <div>\r\n            <map-draw-tools\r\n              active={true}\r\n              drawMode={EDrawMode.REFINE}\r\n              mapView={this.mapView}\r\n              ondrawRedo={() => this._redo()}\r\n              ondrawUndo={() => this._undo()}\r\n              onsketchGraphicsChange={this._sketchGraphicsChanged}\r\n              pointSymbol={this.sketchPointSymbol}\r\n              polygonSymbol={this.sketchPolygonSymbol}\r\n              polylineSymbol={this.sketchLineSymbol}\r\n              redoEnabled={this._refineSelectionSet?.redoStack && this._refineSelectionSet.redoStack.length > 0}\r\n              ref={this._drawTools}\r\n              undoEnabled={this._refineSelectionSet?.undoStack && this._refineSelectionSet.undoStack.length > 0}\r\n            />\r\n          </div>\r\n          {this.enableSearchDistance ? this._getBufferOptions() : undefined}\r\n          <br />\r\n          {\r\n            <calcite-list class='list-border' label=''>\r\n              {this._getRefineSelectionSetList()}\r\n            </calcite-list>\r\n          }\r\n        </div>\r\n      </>\r\n    );\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Functions (private)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Initialize the graphics layer, selection set, and search widget\r\n   *\r\n   * @returns Promise when the operation has completed\r\n   */\r\n  private async _init(): Promise<void> {\r\n    this._initGraphicsLayer();\r\n  }\r\n\r\n\r\n  /**\r\n   * Initialize the graphics layer used to store any buffer grapghics\r\n   *\r\n   * @private\r\n   */\r\n  private _initGraphicsLayer(): void {\r\n    const title = this._translations.bufferLayer;\r\n    if (this.mapView) {\r\n      const bufferIndex = this.mapView.map!.layers.findIndex(l => l.title === title);\r\n      if (bufferIndex > -1) {\r\n        this._bufferGraphicsLayer = this.mapView.map!.layers.getItemAt(bufferIndex) as __esri.GraphicsLayer;\r\n      } else {\r\n        this._bufferGraphicsLayer = new GraphicsLayer({ title, listMode: 'hide' });\r\n        if (this._bufferGraphicsLayer) {\r\n          // TODO state\r\n          const sketchIndex = this.mapView.map!.layers.findIndex(l => l.title === this._translations.sketchLayer);\r\n          if (sketchIndex > -1) {\r\n            this.mapView.map!.layers.add(this._bufferGraphicsLayer, sketchIndex);\r\n          } else {\r\n            this.mapView.map!.layers.add(this._bufferGraphicsLayer);\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Set the user selected layer as the current refine layer\r\n   *\r\n   * @param _evt contains the selected layer id\r\n   * @private\r\n   */\r\n  private _layerSelectionChange(\r\n    _evt: CustomEvent\r\n  ): void {\r\n    const id = _evt.detail[0];\r\n    void this._setRefineSet(id);\r\n  }\r\n\r\n  /**\r\n   * Store the current selection mode\r\n   *\r\n   * @param selectionMode the current selection mode ADD || REMOVE\r\n   * @private\r\n   */\r\n  private _setSelectionMode(\r\n    selectionMode: ESelectionMode\r\n  ): void {\r\n    this._selectionMode = selectionMode;\r\n  }\r\n\r\n  /**\r\n   * Select features based on the user drawn geometry\r\n   *\r\n   * @param _evt ISketchGraphicsChange stores the new graphics and a boolean useOIDs\r\n   * useOIDs is leveraged in some situations to use the feature OIDs rather than the graphic geometry\r\n   * @private\r\n   */\r\n  private async _sketchGraphicsChanged(\r\n    _evt: CustomEvent\r\n  ): Promise<void> {\r\n    const graphics = _evt.detail?.graphics[0] as __esri.Graphic;\r\n    const geom = graphics.geometry as __esri.Geometry;\r\n    this.geometries = [geom];\r\n    const oids = await this._selectFeatures(geom);\r\n    this._sketchGraphics = graphics;\r\n    if (this._refineSelectionSet?.distance === 0 && oids.length > 0) {\r\n      const obj = { drawnGraphics: graphics, bufferGraphics: undefined }\r\n      this.drawnGraphicsArr.push(obj)\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Get the layer ids for all layers in the selection sets\r\n   *\r\n   * @private\r\n   */\r\n  private _getEnabledLayerIds(): string[] {\r\n    return this.selectionSets.reduce((prev, cur) => {\r\n      const id = cur?.layerView?.layer.id;\r\n      if (id && prev.indexOf(id) < 0) {\r\n        prev.push(id);\r\n      } else if (cur.workflowType === EWorkflowType.REFINE) {\r\n        Object.keys(cur.refineInfos).forEach(k => {\r\n          if (prev.indexOf(k) < 0) {\r\n            prev.push(k);\r\n          }\r\n        });\r\n      }\r\n      return prev;\r\n    }, [] as any);\r\n  }\r\n\r\n  /**\r\n   * Set the refine layer...any adds or removes will be done against this layer\r\n   *\r\n   * @param id the id of the layer that should be used as the current refine layer\r\n   * @private\r\n   */\r\n  private async _setRefineSet(\r\n    id: string\r\n  ): Promise<void> {\r\n    if (\r\n      !this.selectionSets.some(ss => {\r\n        if (ss.workflowType === EWorkflowType.REFINE) {\r\n          this._refineSelectionSet = ss;\r\n          return Object.keys(ss.refineInfos).indexOf(id) > -1;\r\n        } else {\r\n          return false;\r\n        }\r\n      })\r\n    ) {\r\n      await this._initRefineSet(id, this._refineSelectionSet);\r\n    }\r\n    if (this._refineSelectionSet) {\r\n      this._refineLayer = this._refineSelectionSet.refineInfos[id].layerView;\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Initialize the refine selection set\r\n   *\r\n   * @param id the layer id to use for the refine selection set\r\n   * @param selectionSet the current refine selection set\r\n   * @private\r\n   */\r\n  private async _initRefineSet(\r\n    id: string,\r\n    selectionSet: ISelectionSet | undefined\r\n  ): Promise<void> {\r\n    const refineInfo: any = {};\r\n    refineInfo[id] = {\r\n      addIds: [],\r\n      removeIds: [],\r\n      layerView: this.mapView && await getFeatureLayerView(this.mapView, id),\r\n    };\r\n\r\n    if (selectionSet) {\r\n      selectionSet.refineInfos = { ...selectionSet.refineInfos, ...refineInfo };\r\n    } else {\r\n      this._refineSelectionSet = {\r\n        id: Date.now(),\r\n        searchResult: undefined,\r\n        buffer: undefined,\r\n        distance: this.defaultBufferDistance || 0,\r\n        download: true,\r\n        unit: this.defaultBufferUnit || 'feet',\r\n        label: 'Refine',\r\n        selectedIds: [],\r\n        layerView: this.mapView && await getFeatureLayerView(this.mapView, id),\r\n        geometries: [],\r\n        graphics: [],\r\n        selectLayers: [],\r\n        workflowType: EWorkflowType.REFINE,\r\n        searchDistanceEnabled: false,\r\n        useLayerFeaturesEnabled: false,\r\n        refineInfos: refineInfo,\r\n        redoStack: [],\r\n        undoStack: [],\r\n        sketchGraphic: undefined,\r\n        undoGraphicsArr: []\r\n      };\r\n      this.selectionSets.push(this._refineSelectionSet);\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Undo the most current ADD or REMOVE operation\r\n   *\r\n   * @returns Promise resolving when function is done\r\n   * @private\r\n   */\r\n  private _undo(): void {\r\n    if (this._refineSelectionSet) {\r\n      const undoOp = this._refineSelectionSet.undoStack && this._refineSelectionSet.undoStack.pop();\r\n      if (undoOp) {\r\n        if (this.drawnGraphicsArr.length > 0) {\r\n          const graphics = this.drawnGraphicsArr.pop();\r\n          if (graphics) {\r\n            this._refineSelectionSet.undoGraphicsArr?.push(graphics)\r\n          }\r\n          this._undoGraphicsArr.push(graphics as never);\r\n        }\r\n        this._refineSelectionSet.redoStack &&\r\n          void this._updateIds(\r\n            undoOp.ids,\r\n            undoOp.mode === ESelectionMode.ADD ? ESelectionMode.REMOVE : ESelectionMode.ADD,\r\n            this._refineSelectionSet.redoStack,\r\n            undoOp.layerView\r\n          );\r\n      }\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Redo the most current ADD or REMOVE operation\r\n   *\r\n   * @returns Promise resolving when function is done\r\n   * @private\r\n   */\r\n  private _redo(): void {\r\n    if (this._refineSelectionSet) {\r\n      const redoOp = this._refineSelectionSet.redoStack && this._refineSelectionSet.redoStack.pop();\r\n      if (redoOp) {\r\n        if (this._undoGraphicsArr.length > 0) {\r\n          const graphics = this._undoGraphicsArr.pop();\r\n          this._refineSelectionSet.undoGraphicsArr?.pop()\r\n          // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\r\n          if (graphics) {\r\n            this.drawnGraphicsArr.push(graphics);\r\n          }\r\n        }\r\n        this._refineSelectionSet.undoStack &&\r\n          void this._updateIds(\r\n            redoOp.ids,\r\n            redoOp.mode === ESelectionMode.ADD ? ESelectionMode.REMOVE : ESelectionMode.ADD,\r\n            this._refineSelectionSet.undoStack,\r\n            redoOp.layerView\r\n          );\r\n      }\r\n    }\r\n  }\r\n\r\n  /** Renders the buffer tools component. */\r\n  private _getBufferOptions(): JsxNode {\r\n    if (this.enableSearchDistanceOnLoad && this._refineSelectionSet) {\r\n      this._refineSelectionSet.searchDistanceEnabled = true;\r\n      this.searchDistanceEnabled = true;\r\n      this.enableSearchDistanceOnLoad = false;\r\n    }\r\n    const showBufferToolsClass = this._refineSelectionSet?.searchDistanceEnabled ? 'search-distance' : 'div-not-visible';\r\n    return (\r\n      <div>\r\n        <div class='padding-top-1 display-flex'>\r\n          <calcite-label\r\n            class='label-margin-0 w-100'\r\n            layout='inline-space-between'\r\n          >\r\n            <div class='tooltip-container'>\r\n              {this._translations.searchDistance}\r\n              <calcite-icon\r\n                class='padding-start-1-2 icon'\r\n                //specific to HE https://esriis.sharepoint.com/sites/i18n_t9n/SitePages/How-to-test-Arabic-and-Hebrew-languages.aspx\r\n                flipRtl={!(this._translations._lang?.toLowerCase() === 'he')}\r\n                icon='question'\r\n                id='search-distance-icon'\r\n                scale='s'\r\n              />\r\n            </div>\r\n          </calcite-label>\r\n          <calcite-popover\r\n            closable={true}\r\n            label=''\r\n            overlayPositioning='fixed'\r\n            referenceElement='search-distance-icon'\r\n          >\r\n            <span class='tooltip-message'>\r\n              {this._translations.useSearchDistanceTootip}\r\n            </span>\r\n          </calcite-popover>\r\n          <calcite-switch\r\n            checked={this._refineSelectionSet?.searchDistanceEnabled}\r\n            oncalciteSwitchChange={() => {\r\n              this.searchDistanceEnabled = !this.searchDistanceEnabled;\r\n              if (this._refineSelectionSet) {\r\n                this._refineSelectionSet.searchDistanceEnabled = this.searchDistanceEnabled;\r\n              }\r\n            }}\r\n          />\r\n        </div>\r\n        <div class={showBufferToolsClass}>\r\n          <buffer-tools\r\n            disabled={!this.searchDistanceEnabled}\r\n            distance={this._refineSelectionSet?.distance}\r\n            geometries={this.geometries}\r\n            onbufferComplete={_evt => void this._bufferComplete(_evt)}\r\n            ref={this._bufferTools}\r\n            unit={this._refineSelectionSet?.unit}\r\n          />\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  /**\r\n   * Query the selectLayerView based on any user drawn geometries or buffers\r\n   *\r\n   * @param _evt CustomEvent that contains the result of the buffer\r\n   * @private\r\n   */\r\n  private async _bufferComplete(\r\n    _evt: CustomEvent\r\n  ): Promise<void> {\r\n    this._bufferGeometry = Array.isArray(_evt.detail) ? _evt.detail[0] : _evt.detail;\r\n\r\n    if (this._bufferGeometry) {\r\n      // Create a symbol for rendering the graphic\r\n      const symbol = {\r\n        type: 'simple-fill',\r\n        color: this.bufferColor,\r\n        outline: {\r\n          color: this.bufferOutlineColor,\r\n          width: 1,\r\n        },\r\n      };\r\n\r\n      // Add the geometry and symbol to a new graphic\r\n      const polygonGraphic = new Graphic({\r\n        geometry: this._bufferGeometry,\r\n        symbol: symbol as any,\r\n      });\r\n\r\n      if (this._bufferGraphicsLayer && polygonGraphic && this.mapView) {\r\n        this._bufferGraphicsLayer.removeAll();\r\n        this._bufferGraphicsLayer.add(polygonGraphic);\r\n        const oids = await this._selectFeatures(this._bufferGeometry);\r\n        if (oids.length > 0) {\r\n          const obj = { drawnGraphics: this._sketchGraphics, bufferGraphics: polygonGraphic }\r\n          this.drawnGraphicsArr.push(obj)\r\n        }\r\n      }\r\n    } else {\r\n      if (this._bufferGraphicsLayer) {\r\n        this._bufferGraphicsLayer.removeAll();\r\n      }\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Create a list to show the number added/removed/total unique selected\r\n   *\r\n   * @returns the list node\r\n   * @private\r\n   */\r\n  private _getRefineSelectionSetList(): JsxNode {\r\n    const total = this._getTotal(this.selectionSets);\r\n\r\n    let refineSet: any;\r\n    this.selectionSets.some(ss => {\r\n      if (ss.workflowType === EWorkflowType.REFINE) {\r\n        refineSet = ss;\r\n        return true;\r\n      } else {\r\n        return false\r\n      }\r\n    });\r\n\r\n    let numAdded = 0;\r\n    let numRemoved = 0;\r\n    refineSet?.refineInfos && Object.keys(refineSet.refineInfos).forEach(k => {\r\n      numAdded += refineSet.refineInfos[k].addIds.length;\r\n      numRemoved += refineSet.refineInfos[k].removeIds.length;\r\n    });\r\n\r\n    const added = this._translations.featuresAdded;\r\n    const removed = this._translations.featuresRemoved;\r\n    const selected = this._translations.totalSelected;\r\n\r\n    // TODO these were all flagged with nonInteractive and it's saying that doesn't exist\r\n    return [\r\n      <calcite-list-item\r\n        label={added.replace('{{n}}', numAdded.toString())}\r\n      />,\r\n      <calcite-list-item\r\n        label={removed.replace('{{n}}', numRemoved.toString())}\r\n      />,\r\n      <calcite-list-item\r\n        label={selected.replace('{{n}}', total.toString())}\r\n      />,\r\n    ];\r\n  }\r\n\r\n  /**\r\n   * Get the total number od ids across all selection sets\r\n   *\r\n   * @returns the total number of ids\r\n   * @private\r\n   */\r\n  private _getTotal(\r\n    selectionSets: ISelectionSet[]\r\n  ): number {\r\n    const idSets = getIdSets(selectionSets);\r\n    return Object.keys(idSets).reduce((prev, cur) => {\r\n      const idSet = idSets[cur];\r\n      prev += idSet.ids.length;\r\n      return prev;\r\n    }, 0);\r\n  }\r\n\r\n  /**\r\n   * Select features based on the input geometry\r\n   *\r\n   * @param geom the geometry used for selection\r\n   * @returns Promise resolving when function is done\r\n   * @private\r\n   */\r\n  private async _selectFeatures(\r\n    geom: __esri.Geometry\r\n  ): Promise<any[]> {\r\n    this.selectionLoadingChange.emit(true);\r\n    let oids = []\r\n    if (this._refineLayer) {\r\n      this._featuresCollection[this._refineLayer?.layer.id] = [];\r\n      const response = await queryFeaturesByGeometry(0, this._refineLayer?.layer, geom, this._featuresCollection);\r\n\r\n      this.selectionLoadingChange.emit(false);\r\n      let graphics: any[] = [];\r\n\r\n      Object.keys(response).forEach(k => {\r\n        if (k === this._refineLayer?.layer.id) {\r\n          graphics = graphics.concat(response[k]);\r\n        }\r\n      });\r\n\r\n      oids = Array.isArray(graphics) ? graphics.map(g => g.attributes[g?.layer?.objectIdField]) : [];\r\n      this._refineSelectionSet?.undoStack &&\r\n        await this._updateIds(oids, this._selectionMode, this._refineSelectionSet.undoStack, this._refineLayer);\r\n\r\n      if (this._bufferGraphicsLayer && this._refineSelectionSet && this._refineSelectionSet.distance > 0) {\r\n        // Introduce a short delay to ensure the buffer is visible on the map before clearing it\r\n        await new Promise(resolve => setTimeout(resolve, 1000));\r\n        this._bufferGraphicsLayer.removeAll();\r\n      }\r\n      this.geometries = [];\r\n      this._drawTools.value && void this._drawTools.value.clear();\r\n    }\r\n    return oids;\r\n  }\r\n\r\n  /**\r\n   * Highlight any selected features in the map\r\n   *\r\n   * @returns Promise resolving when function is done\r\n   * @private\r\n   */\r\n  private async _highlightFeatures(): Promise<void> {\r\n    const _state = this._pnContextConsumer.value!;\r\n    _state.removeHandles();\r\n    _state.highlightHandles = await highlightAllFeatures(this.selectionSets);\r\n  }\r\n\r\n  /**\r\n   * Update the ids for any ADD or REMOVE operation and highlight the features.\r\n   *\r\n   * @param oids the ids to add or remove\r\n   * @param mode ADD or REMOVE this will control if the ids are added or removed\r\n   * @param operationStack the undo or redo stack to push the operation to\r\n   * @param operationMode ADD or REMOVE the mode of the individual refine operation\r\n   * @returns Promise resolving when function is done\r\n   * @private\r\n   */\r\n  private async _updateIds(\r\n    ids: number[],\r\n    mode: ESelectionMode,\r\n    operationStack: IRefineOperation[],\r\n    layerView: __esri.FeatureLayerView\r\n  ): Promise<void> {\r\n    let selectionSetsChanged = false;\r\n    const refineInfos = this._refineSelectionSet?.refineInfos;\r\n    const layerId = layerView.layer.id;\r\n    const newRefineInfo: any = {};\r\n    newRefineInfo[layerId] = {\r\n      addIds: [],\r\n      removeIds: [],\r\n      layerView,\r\n    };\r\n    const idUpdates = refineInfos && Object.keys(refineInfos).indexOf(layerId) > -1 ? refineInfos[layerId] : newRefineInfo[layerId];\r\n\r\n    if (mode === ESelectionMode.ADD) {\r\n      idUpdates.addIds = [...new Set([...ids, ...idUpdates.addIds])];\r\n      if (idUpdates.addIds.length > 0) {\r\n        operationStack.push({\r\n          ids,\r\n          mode,\r\n          layerView,\r\n        });\r\n      }\r\n      if (idUpdates.removeIds.length > 0) {\r\n        idUpdates.removeIds = idUpdates.removeIds.filter((id: any) => ids.indexOf(id) < 0);\r\n      }\r\n    } else {\r\n      // ids are a result of the drawn geom...so it's possible they could contain ids that do\r\n      // not exist in other selection sets\r\n      const validIds = this.selectionSets.reduce((prev, cur) => {\r\n        ids.forEach(id => {\r\n          if (cur.workflowType !== EWorkflowType.REFINE) {\r\n            if (cur.selectedIds.indexOf(id) > -1) {\r\n              prev.push(id);\r\n            }\r\n          } else {\r\n            Object.keys(cur.refineInfos).some(k => {\r\n              const refineInfo = cur.refineInfos[k];\r\n              if (refineInfo.layerView.layer.id === layerView.layer.id && refineInfo.addIds.indexOf(id) > -1) {\r\n                prev.push(id);\r\n                return true;\r\n              } else {\r\n                return false;\r\n              }\r\n            });\r\n          }\r\n        });\r\n        return prev;\r\n      }, [] as any[]);\r\n\r\n      idUpdates.removeIds = [...new Set([...validIds, ...idUpdates.removeIds])];\r\n      idUpdates.addIds = idUpdates.addIds.filter((id: any) => validIds.indexOf(id) < 0);\r\n      if (idUpdates.removeIds.length > 0) {\r\n        operationStack.push({\r\n          ids: validIds,\r\n          mode,\r\n          layerView,\r\n        });\r\n      }\r\n\r\n      this.selectionSets = this.selectionSets.reduce((prev: any[], cur: any) => {\r\n        if (cur.workflowType !== EWorkflowType.REFINE && cur.layerView.layer.id === layerView.layer.id) {\r\n          cur.selectedIds = cur.selectedIds.filter((id: any) => idUpdates.removeIds.indexOf(id) < 0);\r\n          if (cur.selectedIds.length > 0) {\r\n            prev.push(cur);\r\n          } else {\r\n            selectionSetsChanged = true;\r\n          }\r\n        } else {\r\n          prev.push(cur);\r\n        }\r\n        return prev;\r\n      }, [] as any[]);\r\n    }\r\n\r\n    if (this._refineSelectionSet) {\r\n      this._refineSelectionSet.refineInfos[layerId] = idUpdates;\r\n    }\r\n    this.selectionSets = [...this.selectionSets];\r\n\r\n    if (selectionSetsChanged) {\r\n      this.selectionSetsChanged.emit(this.selectionSets);\r\n    }\r\n\r\n    await this._highlightFeatures();\r\n  }\r\n}\r\n"],"names":["ref$jsx"],"mappings":"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"}

package/dist/components/selection-tool/customElement.d.ts

@@ -4,7 +4,7 @@ import { PropertyValues } from 'lit';
 import { PublicLitElement as LitElement, TargetedEvent, JsxNode } from '@arcgis/lumina';
 
 export declare class SelectionTool extends LitElement {
-    /** esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html */
+    /** esri/views/View: https://next.gha.afd.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html */
     mapView: __esri.MapView | undefined;
     /**
      * string: Selected layer id

package/dist/components/selection-tool/customElement.js

@@ -1,13 +1,14 @@
-import { c as a } from "../../chunks/runtime.js";
-import { g as r } from "../../chunks/mapViewUtils.js";
-import { LitElement as c, createEvent as s, noShadowRoot as n } from "@arcgis/lumina";
-import { css as l } from "lit";
-import h from "@arcgis/core/layers/GraphicsLayer";
-import p from "@arcgis/core/widgets/Sketch/SketchViewModel";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.2/esri/copyright.txt for details.
-v1.2.0-next.57 */
-const m = l`@layer{/** @license
+v1.2.0-next.58 */
+import { c as customElement } from "../../chunks/runtime.js";
+import { g as getFeatureLayerView } from "../../chunks/mapViewUtils.js";
+import { LitElement, createEvent, noShadowRoot } from "@arcgis/lumina";
+import { css } from "lit";
+import GraphicsLayer from "@arcgis/core/layers/GraphicsLayer";
+import SketchViewModel from "@arcgis/core/widgets/Sketch/SketchViewModel";
+const styles = css`@layer{
+/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -21,22 +22,34 @@ const m = l`@layer{/** @license
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- */:host{display:block;pointer-events:all!important}}`;
-class d extends c {
+ */
+
+:host {
+  display: block;
+  pointer-events: all !important;
+}
+}`;
+class SelectionTool extends LitElement {
   constructor() {
-    super(...arguments), this.selectedLayerId = "", this.tool = "rectangle", this.drawingComplete = s(), this.featuresSelected = s();
+    super(...arguments);
+    this.selectedLayerId = "";
+    this.tool = "rectangle";
+    this.drawingComplete = createEvent();
+    this.featuresSelected = createEvent();
   }
   static {
-    this.properties = { mapView: 0, selectedLayerId: 1, tool: 1 };
+    this.properties = { mapView: [0, {}, { attribute: false }], selectedLayerId: 1, tool: 1 };
   }
   static {
-    this.styles = m;
+    this.styles = styles;
   }
   static {
-    this.shadowRootOptions = n;
+    this.shadowRootOptions = noShadowRoot;
   }
-  willUpdate(e) {
-    e.has("mapView") && this.mapViewWatchHandler();
+  willUpdate(changes) {
+    if (changes.has("mapView")) {
+      this.mapViewWatchHandler();
+    }
   }
   async mapViewWatchHandler() {
     await this.mapView?.when(() => {
@@ -44,7 +57,12 @@ class d extends c {
     });
   }
   async toggleSelectionTool() {
-    this._graphicsLayer?.removeAll(), this._selectionTool && this._selectionTool.state === "active" ? this._selectionTool.cancel() : this._selectionTool?.create(this.tool);
+    this._graphicsLayer?.removeAll();
+    if (this._selectionTool && this._selectionTool.state === "active") {
+      this._selectionTool.cancel();
+    } else {
+      this._selectionTool?.create(this.tool);
+    }
   }
   async loaded() {
     await this.init();
@@ -53,31 +71,47 @@ class d extends c {
     return "";
   }
   async init() {
-    this.mapView && this._initSketchViewModel();
+    if (this.mapView) {
+      this._initSketchViewModel();
+    }
   }
   _initSketchViewModel() {
-    this._graphicsLayer = new h(), this._selectionTool = new p({
+    this._graphicsLayer = new GraphicsLayer();
+    this._selectionTool = new SketchViewModel({
       layer: this._graphicsLayer,
       view: this.mapView
-    }), this._selectionTool && this._selectionTool.on("create", (e) => {
-      if (e.state === "complete") {
-        this.drawingComplete.emit();
-        const t = e.graphic?.geometry;
-        t && this._selectFeatures(t), this._graphicsLayer && this._graphicsLayer.removeAll();
-      }
-    }), this.mapView?.map && this._graphicsLayer && this.mapView.map.layers.add(this._graphicsLayer);
+    });
+    if (this._selectionTool) {
+      this._selectionTool.on("create", (e) => {
+        if (e.state === "complete") {
+          this.drawingComplete.emit();
+          const queryGeometry = e.graphic?.geometry;
+          if (queryGeometry) {
+            void this._selectFeatures(queryGeometry);
+          }
+          if (this._graphicsLayer) {
+            this._graphicsLayer.removeAll();
+          }
+        }
+      });
+    }
+    if (this.mapView?.map && this._graphicsLayer) {
+      this.mapView.map.layers.add(this._graphicsLayer);
+    }
   }
-  async _selectFeatures(e) {
-    const t = this.mapView && await r(this.mapView, this.selectedLayerId);
+  async _selectFeatures(geometry) {
+    const layerView = this.mapView && await getFeatureLayerView(this.mapView, this.selectedLayerId);
     try {
-      const i = { geometry: e }, o = t && await t.queryObjectIds(i);
-      this.featuresSelected.emit(o);
-    } catch (i) {
-      console.error("Error selecting features:", i);
+      const query = { geometry };
+      const ids = layerView && await layerView.queryObjectIds(query);
+      this.featuresSelected.emit(ids);
+    } catch (error) {
+      console.error("Error selecting features:", error);
     }
   }
 }
-a("selection-tool", d);
+customElement("selection-tool", SelectionTool);
 export {
-  d as SelectionTool
+  SelectionTool
 };
+//# sourceMappingURL=customElement.js.map

package/dist/components/selection-tool/customElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"customElement.js","sources":["../../../src/components/selection-tool/selection-tool.tsx"],"sourcesContent":["/**\r\n * @license\r\n * Copyright 2025 Esri\r\n *\r\n * Licensed under the Apache License, Version 2.0 (the 'License');\r\n * you may not use this file except in compliance with the License.\r\n * You may obtain a copy of the License at\r\n *\r\n *    http://www.apache.org/licenses/LICENSE-2.0\r\n *\r\n * Unless required by applicable law or agreed to in writing, software\r\n * distributed under the License is distributed on an 'AS IS' BASIS,\r\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n * See the License for the specific language governing permissions and\r\n * limitations under the License.\r\n */\r\n\r\nimport { getFeatureLayerView } from '../../utils/mapViewUtils';\r\nimport type { PropertyValues } from 'lit';\r\nimport {\r\n  LitElement,\r\n  property,\r\n  createEvent,\r\n  Fragment,\r\n  method,\r\n  noShadowRoot,\r\n} from '@arcgis/lumina';\r\nimport type {\r\n  JsxNode,\r\n} from '@arcgis/lumina';\r\nimport { styles } from './selection-tool.css';\r\nimport GraphicsLayer from '@arcgis/core/layers/GraphicsLayer';\r\nimport SketchViewModel from '@arcgis/core/widgets/Sketch/SketchViewModel';\r\n\r\ndeclare global {\r\n  interface DeclareElements {\r\n    'selection-tool': SelectionTool;\r\n  }\r\n}\r\n\r\nexport class SelectionTool extends LitElement {\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Overrides (internal)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  static override styles = styles;\r\n\r\n  static override shadowRootOptions = noShadowRoot;\r\n\r\n  /** TODO: [MIGRATION] Consider inlining some of the watch functions called inside of this method to reduce boilerplate code */\r\n  override willUpdate(\r\n    changes: PropertyValues<this>\r\n  ): void {\r\n    /* TODO: [MIGRATION] First time Lit calls willUpdate(), changes will include not just properties provided by the user, but also any default values your component set.\r\n    To account for this semantics change, the checks for (this.hasUpdated || value != defaultValue) was added in this method\r\n    Please refactor your code to reduce the need for this check.\r\n    Docs: https://qawebgis.esri.com/components/lumina/transition-from-stencil#watching-for-property-changes */\r\n\r\n    if (changes.has('mapView')) {\r\n      this.mapViewWatchHandler();\r\n    }\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /** esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html */\r\n  @property() mapView: __esri.MapView | undefined;\r\n\r\n  /** string: Selected layer id */\r\n  @property() selectedLayerId = '';\r\n\r\n  /** string: Tool for selecting the features */\r\n  @property() tool: 'circle' | 'polygon' | 'rectangle' = 'rectangle'\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Properties (private)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /** __esri.SketchViewModel: Selection tool refrence element */\r\n  private _selectionTool: __esri.SketchViewModel | undefined;\r\n\r\n  /**\r\n   * __esri.GraphicsLayer: Graphics layer to hold the selected features\r\n   */\r\n  private _graphicsLayer: __esri.GraphicsLayer | undefined;\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Watch handlers\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  //** Called each time the mapView prop is changed. */\r\n  private async mapViewWatchHandler(): Promise<void> {\r\n    await this.mapView?.when(() => {\r\n      this._initSketchViewModel();\r\n    });\r\n  }\r\n\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Methods (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n    * Toggles the selection tool state\r\n    */\r\n  @method()\r\n  async toggleSelectionTool(): Promise<void> {\r\n    this._graphicsLayer?.removeAll();\r\n    if (this._selectionTool && this._selectionTool.state === 'active') {\r\n      this._selectionTool.cancel();\r\n    } else {\r\n      this._selectionTool?.create(this.tool);\r\n    }\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Events (public)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /** Emitted when drawing is completed */\r\n  drawingComplete = createEvent<void>();\r\n\r\n  /** Emitted when feature are selected */\r\n  featuresSelected = createEvent<(number | string)[] | undefined>();\r\n\r\n  /** Called once just after the component is fully loaded and the first render() occurs.\r\n   * This lifecycle method is not expected to return a promise. The returned promise will be ignored by Lit rather than awaited. */\r\n  async loaded(): Promise<void> {\r\n    await this.init();\r\n  }\r\n\r\n  /** Renders the component. */\r\n  override render(): JsxNode {\r\n    return (\r\n      <>\r\n      </>\r\n    );\r\n  }\r\n\r\n  //--------------------------------------------------------------------------\r\n  //\r\n  //  Functions (private)\r\n  //\r\n  //--------------------------------------------------------------------------\r\n\r\n  /**\r\n   * Init the sketchviewmodel\r\n   */\r\n  private async init(): Promise<void> {\r\n    if (this.mapView) {\r\n      this._initSketchViewModel();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Initialized the sketch view model\r\n   */\r\n  private _initSketchViewModel(): void {\r\n    this._graphicsLayer = new GraphicsLayer();\r\n    this._selectionTool = new SketchViewModel({\r\n      layer: this._graphicsLayer,\r\n      view: this.mapView\r\n    });\r\n\r\n    if (this._selectionTool) {\r\n      this._selectionTool.on('create', (e) => {\r\n        if (e.state === 'complete') {\r\n          this.drawingComplete.emit();\r\n          const queryGeometry = e.graphic?.geometry\r\n          if (queryGeometry) {\r\n            void this._selectFeatures(queryGeometry)\r\n          }\r\n          if (this._graphicsLayer) {\r\n            this._graphicsLayer.removeAll();\r\n          }\r\n        }\r\n      })\r\n    }\r\n    if (this.mapView?.map && this._graphicsLayer) {\r\n      this.mapView.map.layers.add(this._graphicsLayer);\r\n    }\r\n\r\n  }\r\n\r\n  /**\r\n   * Emits a feature oid after querying by using geometry\r\n   * @param geometry\r\n   */\r\n  private async _selectFeatures(geometry: __esri.Geometry): Promise<void> {\r\n    const layerView = this.mapView && await getFeatureLayerView(this.mapView, this.selectedLayerId)\r\n    try {\r\n      const query = { geometry };\r\n      const ids = layerView && await layerView.queryObjectIds(query);\r\n      this.featuresSelected.emit(ids);\r\n    } catch (error) {\r\n      console.error('Error selecting features:', error);\r\n    }\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCM,MAAO,sBAAsB,WAAU;AAAA,EAAvC,cAAA;AAAA,UAAA,GAAA,SAAA;AAoCQ,SAAA,kBAAkB;AAGlB,SAAA,OAA2C;AAwDvD,SAAA,kBAAkB,YAAA;AAGlB,SAAA,mBAAmB,YAAA;AAAA,EAA2C;AAAA;;;EA1F9D,OAAA;AAAA,SAAgB,SAAS;AAAA,EAAA;AAAA,EAEzB,OAAA;AAAA,SAAgB,oBAAoB;AAAA,EAAA;AAAA,EAG3B,WACP,SACK;AAML,QAAI,QAAQ,IAAI,SAAS,GAAG;AAC1B,WAAK,oBAAA;AAAA,IACP;AAAA,EACF;AAAA,EAsCA,MAAc,sBAAoC;AAChD,UAAM,KAAK,SAAS,KAAK,MAAK;AAC5B,WAAK,qBAAA;AAAA,IACP,CAAC;AAAA,EACH;AAAA,EAaA,MAAM,sBAAoC;AACxC,SAAK,gBAAgB,UAAA;AACrB,QAAI,KAAK,kBAAkB,KAAK,eAAe,UAAU,UAAU;AACjE,WAAK,eAAe,OAAA;AAAA,IACtB,OAAO;AACL,WAAK,gBAAgB,OAAO,KAAK,IAAI;AAAA,IACvC;AAAA,EACF;AAAA,EAgBA,MAAM,SAAuB;AAC3B,UAAM,KAAK,KAAA;AAAA,EACb;AAAA,EAGS,SAAiB;AACxB;EAIF;AAAA,EAWA,MAAc,OAAqB;AACjC,QAAI,KAAK,SAAS;AAChB,WAAK,qBAAA;AAAA,IACP;AAAA,EACF;AAAA,EAKQ,uBAA4B;AAClC,SAAK,iBAAiB,IAAI,cAAA;AAC1B,SAAK,iBAAiB,IAAI,gBAAgB;AAAA,MACxC,OAAO,KAAK;AAAA,MACZ,MAAM,KAAK;AAAA,IAAA,CACZ;AAED,QAAI,KAAK,gBAAgB;AACvB,WAAK,eAAe,GAAG,UAAU,CAAC,MAAK;AACrC,YAAI,EAAE,UAAU,YAAY;AAC1B,eAAK,gBAAgB,KAAA;AACrB,gBAAM,gBAAgB,EAAE,SAAS;AACjC,cAAI,eAAe;AACjB,iBAAK,KAAK,gBAAgB,aAAa;AAAA,UACzC;AACA,cAAI,KAAK,gBAAgB;AACvB,iBAAK,eAAe,UAAA;AAAA,UACtB;AAAA,QACF;AAAA,MACF,CAAC;AAAA,IACH;AACA,QAAI,KAAK,SAAS,OAAO,KAAK,gBAAgB;AAC5C,WAAK,QAAQ,IAAI,OAAO,IAAI,KAAK,cAAc;AAAA,IACjD;AAAA,EAEF;AAAA,EAMA,MAAc,gBAAgB,UAAyC;AACrE,UAAM,YAAY,KAAK,WAAW,MAAM,oBAAoB,KAAK,SAAS,KAAK,eAAe;AAC9F,QAAI;AACF,YAAM,QAAQ,EAAE,SAAA;AAChB,YAAM,MAAM,aAAa,MAAM,UAAU,eAAe,KAAK;AAC7D,WAAK,iBAAiB,KAAK,GAAG;AAAA,IAChC,SAAS,OAAO;AACd,cAAQ,MAAM,6BAA6B,KAAK;AAAA,IAClD;AAAA,EACF;AACD;;"}

package/dist/components/solution-configure-titles/customElement.js

@@ -1,18 +1,18 @@
-import { c as $ } from "../../chunks/runtime.js";
-import { u as C } from "../../chunks/useT9n.js";
-import { LitElement as T, createEvent as c, safeClassMap as o } from "@arcgis/lumina";
-import { useContextConsumer as v } from "@arcgis/lumina/context";
-import { css as y, html as r } from "lit";
-import { I as S } from "../../chunks/interfaces.js";
-import { createRef as d, ref as h } from "lit-html/directives/ref.js";
-import { c as D } from "../../chunks/deployAppContexts.js";
-import * as b from "@esri/solution-common";
-import { updateGroup as w, updateItem as V, updateItemExtended as E } from "@esri/solution-common";
-import { h as p } from "../../chunks/helpers.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/1.2/esri/copyright.txt for details.
-v1.2.0-next.57 */
-const L = y`/** @license
+v1.2.0-next.58 */
+import { c as customElement } from "../../chunks/runtime.js";
+import { u as useT9n } from "../../chunks/useT9n.js";
+import { LitElement, createEvent, safeClassMap } from "@arcgis/lumina";
+import { useContextConsumer } from "@arcgis/lumina/context";
+import { css, html } from "lit";
+import { I as ITEM_TITLE_LENGTH } from "../../chunks/interfaces.js";
+import { createRef, ref } from "lit-html/directives/ref.js";
+import { c as configContext } from "../../chunks/deployAppContexts.js";
+import * as common from "@esri/solution-common";
+import { updateGroup, updateItem, updateItemExtended } from "@esri/solution-common";
+import { h as hasInvalidChars } from "../../chunks/helpers.js";
+const styles = css`/** @license
  * Copyright 2025 Esri
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -26,104 +26,233 @@ const L = y`/** @license
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- */.display-flex{display:flex}.display-none{display:none}.flex-direction-column{flex-direction:column}.flex-direction-row{flex-direction:row}.font-weight-medium{font-weight:var(--calcite-font-weight-medium)}.font-style-1{font-size:1rem;color:var(--calcite-color-text-2)}.margin-top-0{margin-top:0}.padding-bottom-2{padding-bottom:2rem}.padding-left-2{padding-left:2rem}.padding-right-2{padding-right:2rem}.padding-end-1{padding-inline-end:1rem}.padding-end-1-2{padding-inline-end:.5rem}.width-full{width:100%}.justify-content-space{justify-content:space-between}`;
-class P extends T {
+ */
+
+.display-flex {
+  display: flex;
+}
+
+.display-none {
+  display: none;
+}
+
+.flex-direction-column {
+  flex-direction: column;
+}
+
+.flex-direction-row {
+  flex-direction: row;
+}
+
+.font-weight-medium {
+  font-weight: var(--calcite-font-weight-medium);
+}
+
+.font-style-1 {
+  font-size: 1rem;
+  color: var(--calcite-color-text-2);
+}
+
+.margin-top-0 {
+  margin-top: 0;
+}
+
+.padding-bottom-2 {
+  padding-bottom: 2rem;
+}
+
+.padding-left-2 {
+  padding-left: 2rem;
+}
+
+.padding-right-2 {
+  padding-right: 2rem;
+}
+
+.padding-end-1 {
+  padding-inline-end: 1rem;
+}
+
+.padding-end-1-2 {
+  padding-inline-end: .5rem;
+}
+
+.width-full {
+  width: 100%;
+}
+
+.justify-content-space {
+  justify-content: space-between;
+}`;
+class SolutionConfigureTitles extends LitElement {
   constructor() {
-    super(...arguments), this.open = !1, this.solutionData = {}, this.templateInfos = [], this._saveDisabled = !1, this._displayTemplateInfos = [], this._hasNameLengthError = !1, this._solutionItemsTitlesUpdating = !1, this._translations = C({ name: "solution-configure-titles", blocking: !0 }), this._configContextConsumer = v({
-      context: D,
-      subscribe: !0
-    }), this._defaultPrefix = "", this._defaultSuffix = "", this._loadingDefaultPrefix = !1, this._loadingDefaultSuffix = !1, this._prefixRef = d(), this._prefixValue = "", this._suffixRef = d(), this._suffixValue = "", this._templateInfos = [], this.solutionConfigureTitlesBeforeClose = c(), this.solutionItemsTitlesChanged = c();
+    super(...arguments);
+    this.open = false;
+    this.solutionData = {};
+    this.templateInfos = [];
+    this._saveDisabled = false;
+    this._displayTemplateInfos = [];
+    this._hasNameLengthError = false;
+    this._solutionItemsTitlesUpdating = false;
+    this._translations = useT9n({ name: "solution-configure-titles", blocking: true });
+    this._configContextConsumer = useContextConsumer({
+      context: configContext,
+      subscribe: true
+    });
+    this._defaultPrefix = "";
+    this._defaultSuffix = "";
+    this._loadingDefaultPrefix = false;
+    this._loadingDefaultSuffix = false;
+    this._prefixRef = createRef();
+    this._prefixValue = "";
+    this._suffixRef = createRef();
+    this._suffixValue = "";
+    this._templateInfos = [];
+    this.solutionConfigureTitlesBeforeClose = createEvent();
+    this.solutionItemsTitlesChanged = createEvent();
   }
   static {
-    this.properties = { card: 0, open: 5, solutionData: 1, templateInfos: 0, _saveDisabled: 16, _displayTemplateInfos: 16, _hasNameLengthError: 16, _solutionItemsTitlesUpdating: 16, _translations: 16 };
+    this.properties = { card: [0, {}, { attribute: false }], open: [5, {}, { type: Boolean }], solutionData: 1, templateInfos: [0, {}, { attribute: false }], _saveDisabled: [16, {}, { state: true }], _displayTemplateInfos: [16, {}, { state: true }], _hasNameLengthError: [16, {}, { state: true }], _solutionItemsTitlesUpdating: [16, {}, { state: true }], _translations: [16, {}, { state: true }] };
   }
   static {
-    this.styles = L;
+    this.styles = styles;
   }
-  willUpdate(e) {
-    e.has("templateInfos") && (this._templateInfos = this.templateInfos, this._updateTemplates());
+  willUpdate(changes) {
+    if (changes.has("templateInfos")) {
+      this._templateInfos = this.templateInfos;
+      this._updateTemplates();
+    }
   }
   async load() {
-    this._updateTemplates(), await this._updatePrefixSuffix();
+    this._updateTemplates();
+    await this._updatePrefixSuffix();
   }
   async _updatePrefixSuffix() {
-    this.solutionData = await b.getItemDataAsJson(this.card.id, this._configContextConsumer.value.userSession), this.solutionData.titles?.prefix && (this._loadingDefaultPrefix = !0, this._defaultPrefix = this.solutionData.titles.prefix, this._prefixValue = this.solutionData.titles.prefix), this.solutionData.titles?.suffix && (this._loadingDefaultSuffix = !0, this._defaultSuffix = this.solutionData.titles.suffix, this._suffixValue = this.solutionData.titles.suffix);
+    this.solutionData = await common.getItemDataAsJson(this.card.id, this._configContextConsumer.value.userSession);
+    if (this.solutionData.titles?.prefix) {
+      this._loadingDefaultPrefix = true;
+      this._defaultPrefix = this.solutionData.titles.prefix;
+      this._prefixValue = this.solutionData.titles.prefix;
+    }
+    if (this.solutionData.titles?.suffix) {
+      this._loadingDefaultSuffix = true;
+      this._defaultSuffix = this.solutionData.titles.suffix;
+      this._suffixValue = this.solutionData.titles.suffix;
+    }
   }
   render() {
-    return r`<calcite-dialog .heading=${this.card.title} modal @calciteDialogBeforeClose=${() => {
+    return html`<calcite-dialog .heading=${this.card.title} modal @calciteDialogBeforeClose=${() => {
       this.solutionConfigureTitlesBeforeClose.emit();
     }} .open=${this.open} outside-close-disabled width=l>${this._getPrefixSuffixControls()}${this._getAccordion()}${this._getDialogButtons()}</calcite-dialog>`;
   }
   _getPrefixSuffixControls() {
-    const e = p(this._prefixValue), a = this._hasNameLengthError && this._prefixValue.length > 0, l = !e, t = !a, i = l ? "display-none" : "", s = t ? "display-none" : "", n = l && t ? "valid" : "invalid", m = p(this._suffixValue), x = this._hasNameLengthError && this._suffixValue.length > 0, f = !m, u = !x, g = f ? "display-none" : "", _ = u ? "display-none" : "", I = f && u ? "valid" : "invalid";
-    return this._saveDisabled = !l || !t || !f || !u, r`<div class="display-flex flex-direction-column padding-left-2 padding-right-2"><calcite-label scale=l class="font-weight-medium">${this._translations.configureTitlesDialogHeader}</calcite-label><p class="font-style-1 margin-top-0">${this._translations.addPrefixOrSuffixToItems}</p><div class="display-flex flex-direction-row justify-content-space"><calcite-label class="width-full padding-end-1" scale=l>${this._translations.prefixToAddToItems}<calcite-input clearable @blur=${this._prefixInput} @input=${this._prefixInput} .placeholder=${this._translations.enterPrefixPlaceholder} .status=${n} .value=${this._prefixValue} ${h(this._prefixRef)}></calcite-input><calcite-input-message class=${o(i)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixCharsError}</calcite-input-message><calcite-input-message class=${o(s)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixLengthError}</calcite-input-message></calcite-label><calcite-label class="width-full" scale=l>${this._translations.suffixToAddToItems}<calcite-input clearable @blur=${this._suffixInput} @input=${this._suffixInput} .placeholder=${this._translations.enterSuffixPlaceholder} .status=${I} .value=${this._suffixValue} ${h(this._suffixRef)}></calcite-input><calcite-input-message class=${o(g)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixCharsError}</calcite-input-message><calcite-input-message class=${o(_)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixLengthError}</calcite-input-message></calcite-label></div></div>`;
+    const prefixHasInvalidChars = hasInvalidChars(this._prefixValue);
+    const prefixIsLengthExceeded = this._hasNameLengthError && this._prefixValue.length > 0;
+    const validPrefixChars = !prefixHasInvalidChars;
+    const validPrefixLength = !prefixIsLengthExceeded;
+    const prefixCharsMessageClass = validPrefixChars ? "display-none" : "";
+    const prefixLengthMessageClass = validPrefixLength ? "display-none" : "";
+    const isValidPrefix = validPrefixChars && validPrefixLength ? "valid" : "invalid";
+    const suffixHasInvalidChars = hasInvalidChars(this._suffixValue);
+    const suffixIsLengthExceeded = this._hasNameLengthError && this._suffixValue.length > 0;
+    const validSuffixChars = !suffixHasInvalidChars;
+    const validSuffixLength = !suffixIsLengthExceeded;
+    const suffixCharsMessageClass = validSuffixChars ? "display-none" : "";
+    const suffixLengthMessageClass = validSuffixLength ? "display-none" : "";
+    const isValidSuffix = validSuffixChars && validSuffixLength ? "valid" : "invalid";
+    this._saveDisabled = !validPrefixChars || !validPrefixLength || !validSuffixChars || !validSuffixLength;
+    return html`<div class="display-flex flex-direction-column padding-left-2 padding-right-2"><calcite-label scale=l class="font-weight-medium">${this._translations.configureTitlesDialogHeader}</calcite-label><p class="font-style-1 margin-top-0">${this._translations.addPrefixOrSuffixToItems}</p><div class="display-flex flex-direction-row justify-content-space"><calcite-label class="width-full padding-end-1" scale=l>${this._translations.prefixToAddToItems}<calcite-input clearable @blur=${this._prefixInput} @input=${this._prefixInput} .placeholder=${this._translations.enterPrefixPlaceholder} .status=${isValidPrefix} .value=${this._prefixValue} ${ref(this._prefixRef)}></calcite-input><calcite-input-message class=${safeClassMap(prefixCharsMessageClass)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixCharsError}</calcite-input-message><calcite-input-message class=${safeClassMap(prefixLengthMessageClass)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixLengthError}</calcite-input-message></calcite-label><calcite-label class="width-full" scale=l>${this._translations.suffixToAddToItems}<calcite-input clearable @blur=${this._suffixInput} @input=${this._suffixInput} .placeholder=${this._translations.enterSuffixPlaceholder} .status=${isValidSuffix} .value=${this._suffixValue} ${ref(this._suffixRef)}></calcite-input><calcite-input-message class=${safeClassMap(suffixCharsMessageClass)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixCharsError}</calcite-input-message><calcite-input-message class=${safeClassMap(suffixLengthMessageClass)} icon=exclamation-mark-triangle status=invalid>${this._translations.invalidPrefixOrSuffixLengthError}</calcite-input-message></calcite-label></div></div>`;
   }
   _getAccordion() {
-    return r`<div class="display-flex flex-direction-column padding-left-2 padding-right-2 padding-bottom-2"><p class="font-style-1 margin-top-0">${this._translations.previewTheChanges}</p><solution-item-accordion .templateInfos=${this._displayTemplateInfos} .typeKeywords=${this.card?.typeKeywords} ${h(async (e) => {
-      e && !this._accordionRef && (this._accordionRef = e, await this._accordionRef.selectFirstItem());
+    return html`<div class="display-flex flex-direction-column padding-left-2 padding-right-2 padding-bottom-2"><p class="font-style-1 margin-top-0">${this._translations.previewTheChanges}</p><solution-item-accordion .templateInfos=${this._displayTemplateInfos} .typeKeywords=${this.card?.typeKeywords} ${ref(async (el) => {
+      if (el && !this._accordionRef) {
+        this._accordionRef = el;
+        await this._accordionRef.selectFirstItem();
+      }
     })}></solution-item-accordion></div>`;
   }
   _getDialogButtons() {
-    return r`<div slot=footer-end><calcite-button appearance=outline class="padding-end-1-2" kind=brand @click=${this._closeDialog}>${this._translations.cancelTheDialog}</calcite-button><calcite-button .disabled=${this._saveDisabled} kind=brand .loading=${this._solutionItemsTitlesUpdating} @click=${this._commitNameChanges}>${this._translations.applyChangesAndCloseTheDialog}</calcite-button></div>`;
+    return html`<div slot=footer-end><calcite-button appearance=outline class="padding-end-1-2" kind=brand @click=${this._closeDialog}>${this._translations.cancelTheDialog}</calcite-button><calcite-button .disabled=${this._saveDisabled} kind=brand .loading=${this._solutionItemsTitlesUpdating} @click=${this._commitNameChanges}>${this._translations.applyChangesAndCloseTheDialog}</calcite-button></div>`;
   }
   _prefixInput() {
-    clearTimeout(this._textInputTimeout), this._textInputTimeout = setTimeout(() => {
-      this._prefixValue = this._prefixRef.value?.value || "", this._updateTemplates();
+    clearTimeout(this._textInputTimeout);
+    this._textInputTimeout = setTimeout(() => {
+      this._prefixValue = this._prefixRef.value?.value || "";
+      this._updateTemplates();
     }, 500);
   }
   _suffixInput() {
-    clearTimeout(this._textInputTimeout), this._textInputTimeout = setTimeout(() => {
-      this._suffixValue = this._suffixRef.value?.value || "", this._updateTemplates();
+    clearTimeout(this._textInputTimeout);
+    this._textInputTimeout = setTimeout(() => {
+      this._suffixValue = this._suffixRef.value?.value || "";
+      this._updateTemplates();
     }, 500);
   }
   _updateTemplates() {
-    const e = /[^\s\\]/.test(this._prefixValue), a = /[^\s\\]/.test(this._suffixValue);
+    const hasPrefix = /[^\s\\]/.test(this._prefixValue);
+    const hasSuffix = /[^\s\\]/.test(this._suffixValue);
     this._templateInfos = this._templateInfos.map((t) => {
       if (this._loadingDefaultPrefix && t.title.startsWith(this._prefixValue)) {
-        const i = new RegExp(`^${this._prefixValue} `);
-        t.title = t.title.replace(i, "");
+        const regEx = new RegExp(`^${this._prefixValue} `);
+        t.title = t.title.replace(regEx, "");
       }
       if (this._loadingDefaultSuffix && t.title.endsWith(this._suffixValue)) {
-        const i = new RegExp(` ${this._suffixValue}$`);
-        t.title = t.title.replace(i, "");
+        const regEx = new RegExp(` ${this._suffixValue}$`);
+        t.title = t.title.replace(regEx, "");
       }
       return t;
     });
-    const l = JSON.parse(JSON.stringify(this._templateInfos));
-    this._hasNameLengthError = !1, this._displayTemplateInfos = l.map((t) => (t.title = e && a ? `${`${this._prefixValue} `}${t.title}${` ${this._suffixValue}`}` : e ? `${`${this._prefixValue} `}${t.title}` : a ? `${t.title}${` ${this._suffixValue}`}` : t.title, this._hasNameLengthError || (this._hasNameLengthError = t.title.length > S), t)), this._loadingDefaultPrefix = !1, this._loadingDefaultSuffix = !1;
+    const _templateInfos = JSON.parse(JSON.stringify(this._templateInfos));
+    this._hasNameLengthError = false;
+    this._displayTemplateInfos = _templateInfos.map((t) => {
+      t.title = hasPrefix && hasSuffix ? `${`${this._prefixValue} `}${t.title}${` ${this._suffixValue}`}` : hasPrefix ? `${`${this._prefixValue} `}${t.title}` : hasSuffix ? `${t.title}${` ${this._suffixValue}`}` : t.title;
+      if (!this._hasNameLengthError) {
+        this._hasNameLengthError = t.title.length > ITEM_TITLE_LENGTH;
+      }
+      return t;
+    });
+    this._loadingDefaultPrefix = false;
+    this._loadingDefaultSuffix = false;
   }
   _closeDialog() {
-    this.open = !1;
+    this.open = false;
   }
   async _commitNameChanges() {
-    const e = this._defaultPrefix !== this._prefixValue, a = this._defaultSuffix !== this._suffixValue;
-    if (JSON.stringify(this._templateInfos) !== JSON.stringify(this._displayTemplateInfos) || e || a) {
-      this._solutionItemsTitlesUpdating = !0;
-      const t = this._displayTemplateInfos.reduce((i, s) => {
-        const n = {
-          id: s.id,
-          title: s.title
+    const prefixChangedFromDefault = this._defaultPrefix !== this._prefixValue;
+    const suffixChangedFromDefault = this._defaultSuffix !== this._suffixValue;
+    const templatesChanged = JSON.stringify(this._templateInfos) !== JSON.stringify(this._displayTemplateInfos);
+    if (templatesChanged || prefixChangedFromDefault || suffixChangedFromDefault) {
+      this._solutionItemsTitlesUpdating = true;
+      const updateRequests = this._displayTemplateInfos.reduce((prev, cur) => {
+        const updateOptions = {
+          id: cur.id,
+          title: cur.title
         };
-        return i.push(s.type === "Group" ? w(n, this._configContextConsumer.value.userSession) : V(n, this._configContextConsumer.value.userSession)), i;
+        prev.push(cur.type === "Group" ? updateGroup(updateOptions, this._configContextConsumer.value.userSession) : updateItem(updateOptions, this._configContextConsumer.value.userSession));
+        return prev;
       }, []);
       if (this.solutionData?.templates) {
-        const i = {
+        const itemInfo = {
           id: this.card.id
-        }, s = {
+        };
+        const data = {
           ...this.solutionData,
           titles: {
             prefix: this._prefixValue,
             suffix: this._suffixValue
           }
         };
-        t.push(E(i, s, this._configContextConsumer.value.userSession));
+        updateRequests.push(updateItemExtended(itemInfo, data, this._configContextConsumer.value.userSession));
       }
-      await Promise.all(t), this._solutionItemsTitlesUpdating = !1, this.solutionItemsTitlesChanged.emit();
+      await Promise.all(updateRequests);
+      this._solutionItemsTitlesUpdating = false;
+      this.solutionItemsTitlesChanged.emit();
     }
     this._closeDialog();
   }
 }
-$("solution-configure-titles", P);
+customElement("solution-configure-titles", SolutionConfigureTitles);
 export {
-  P as SolutionConfigureTitles
+  SolutionConfigureTitles
 };
+//# sourceMappingURL=customElement.js.map