@itwin/appui-react 4.0.0-dev.12 → 4.0.0-dev.14

package/lib/cjs/appui-react/uiprovider/ComponentGenerator.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComponentGenerator.js","sourceRoot":"","sources":["../../../../src/appui-react/uiprovider/ComponentGenerator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module UiProvider\r\n */\r\n\r\nimport \"./DefaultDialogGridContainer.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  BaseDialogItem, DialogItem, DialogItemValue, DialogPropertySyncItem, DialogRow, PropertyValueFormat, SyncPropertiesChangeEventArgs,\r\n  UiLayoutDataProvider,\r\n} from \"@itwin/appui-abstract\";\r\nimport { EditorContainer, PropertyUpdatedArgs } from \"@itwin/components-react\";\r\nimport { ToolSettingsEntry } from \"../widget-panels/ToolSettings\";\r\nimport { assert, Logger } from \"@itwin/core-bentley\";\r\n\r\nfunction EditorLabel({ uiDataProvider, item, isLeftmostRecord }: { uiDataProvider: UiLayoutDataProvider, item: DialogItem, isLeftmostRecord?: boolean }) {\r\n  const [isDisabled, setIsDisabled] = React.useState(!!item.isDisabled);\r\n  const displayLabel = React.useMemo(() => {\r\n    return item.property.displayLabel ? item.property.displayLabel : /* istanbul ignore next */ item.property.name;\r\n  }, [item]);\r\n  const propertyId = React.useMemo(() => `dialogItemProperty-${item.property.name}`, [item]);\r\n\r\n  // listen for tool sync property events and update the isDisabled state\r\n  React.useEffect(() => {\r\n    const handleSync = (args: SyncPropertiesChangeEventArgs) => {\r\n      const mySyncItem = args.properties.find((syncItem: DialogPropertySyncItem) => syncItem.propertyName === item.property.name);\r\n      // istanbul ignore next\r\n      if (mySyncItem) {\r\n        setIsDisabled(!!mySyncItem.isDisabled);\r\n      }\r\n    };\r\n    uiDataProvider.onSyncPropertiesChangeEvent.addListener(handleSync);\r\n    return () => {\r\n      uiDataProvider.onSyncPropertiesChangeEvent.removeListener(handleSync);\r\n    };\r\n  }, [uiDataProvider, item]);\r\n\r\n  // istanbul ignore next\r\n  const className = classnames(\r\n    \"uifw-default-label\",\r\n    isDisabled && \"uifw-label-disabled\",\r\n    !!isLeftmostRecord && \"uifw-default-narrow-only-display\",\r\n    !isLeftmostRecord && \"uifw-default-inline-label\",\r\n  );\r\n  return <label className={className} htmlFor={propertyId}>{displayLabel}:</label>;\r\n}\r\n\r\nfunction PropertyEditor({ uiDataProvider, initialItem, isLock, setFocus }: { uiDataProvider: UiLayoutDataProvider, initialItem: BaseDialogItem, isLock?: boolean, setFocus?: boolean }) {\r\n  const getLatestRecordValue = React.useCallback(() => {\r\n    let newRecord = UiLayoutDataProvider.getPropertyRecord(initialItem);\r\n\r\n    // istanbul ignore next\r\n    const foundItem = isLock ? uiDataProvider.items.find((item) => item.lockProperty?.property.name === initialItem.property.name) : uiDataProvider.items.find((item) => item.property.name === initialItem.property.name);\r\n    // istanbul ignore else\r\n    if (foundItem) {\r\n      if (isLock) {\r\n        newRecord = newRecord.copyWithNewValue({\r\n          value: foundItem.lockProperty!.value.value,\r\n          valueFormat: PropertyValueFormat.Primitive,\r\n        });\r\n        newRecord.isDisabled = foundItem.lockProperty!.isDisabled;\r\n      } else {\r\n        newRecord = newRecord.copyWithNewValue({\r\n          value: foundItem.value.value,\r\n          valueFormat: PropertyValueFormat.Primitive,\r\n        });\r\n        newRecord.isDisabled = foundItem.isDisabled;\r\n      }\r\n    }\r\n    return newRecord;\r\n  }, [initialItem, isLock, uiDataProvider.items]);\r\n\r\n  const currentRecord = getLatestRecordValue();\r\n  const [propertyRecord, setPropertyRecord] = React.useState(currentRecord);\r\n\r\n  // monitor tool for sync UI events\r\n  React.useEffect(() => {\r\n    const handleSync = (args: SyncPropertiesChangeEventArgs) => {\r\n      const mySyncItem = args.properties.find((syncItem: DialogPropertySyncItem) => syncItem.propertyName === initialItem.property.name);\r\n      // istanbul ignore else\r\n      if (mySyncItem) {\r\n        const newPropertyValue = propertyRecord.copyWithNewValue({\r\n          value: mySyncItem.value.value,\r\n          valueFormat: PropertyValueFormat.Primitive,\r\n          displayValue: mySyncItem.value.displayValue,\r\n        }, mySyncItem.property);\r\n\r\n        if (mySyncItem.property) {\r\n          // istanbul ignore else\r\n          if (mySyncItem.property.name === mySyncItem.propertyName) {\r\n            newPropertyValue.isDisabled = mySyncItem.isDisabled;\r\n            setPropertyRecord(newPropertyValue);\r\n          } else {\r\n            Logger.logError(\"PropertyEditor\", `Error trying to replace propertyName=${mySyncItem.propertyName} with property named ${mySyncItem.property.name}`);\r\n          }\r\n        } else {\r\n          newPropertyValue.isDisabled = mySyncItem.isDisabled;\r\n          setPropertyRecord(newPropertyValue);\r\n        }\r\n      }\r\n    };\r\n    uiDataProvider.onSyncPropertiesChangeEvent.addListener(handleSync);\r\n    return () => {\r\n      uiDataProvider.onSyncPropertiesChangeEvent.removeListener(handleSync);\r\n    };\r\n  }, [uiDataProvider, propertyRecord, initialItem.property.name]);\r\n\r\n  const className = React.useMemo(() => isLock ? \"uifw-default-property-lock\" : \"uifw-default-editor\", [isLock]);\r\n  // istanbul ignore next\r\n  const handleCommit = React.useCallback((commit: PropertyUpdatedArgs) => {\r\n    // UiLayoutDataProvider supports only primitive property types\r\n    // istanbul ignore next\r\n    assert(commit.newValue.valueFormat === PropertyValueFormat.Primitive && commit.propertyRecord.value.valueFormat === PropertyValueFormat.Primitive);\r\n    const newPropertyValue = propertyRecord.copyWithNewValue(commit.newValue);\r\n    const syncItem: DialogPropertySyncItem = { value: commit.newValue as DialogItemValue, propertyName: initialItem.property.name, isDisabled: newPropertyValue.isDisabled };\r\n    uiDataProvider.applyUiPropertyChange(syncItem);\r\n    // Now have the uiDataProvider refetch the latest property values from the tool\r\n    uiDataProvider.reloadDialogItems(true);\r\n  }, [initialItem.property.name, propertyRecord, uiDataProvider]);\r\n  // istanbul ignore next\r\n  const handleCancel = () => { };\r\n\r\n  return (\r\n    <div key={initialItem.property.name} className={className} >\r\n      <EditorContainer key={initialItem.property.name} propertyRecord={propertyRecord} setFocus={setFocus} onCommit={handleCommit} onCancel={handleCancel} />\r\n    </div>);\r\n}\r\n\r\n/** Utility methods to generate react ui from DialogRow specs\r\n * @internal\r\n */\r\nexport class ComponentGenerator {\r\n  constructor(private _uiDataProvider: UiLayoutDataProvider) {\r\n  }\r\n\r\n  public get uiDataProvider() {\r\n    return this._uiDataProvider;\r\n  }\r\n\r\n  private getEditor(item: BaseDialogItem, isLock = false, setFocus = false): React.ReactNode {\r\n    return <PropertyEditor key={item.property.name} uiDataProvider={this.uiDataProvider} initialItem={item} isLock={isLock} setFocus={setFocus} />;\r\n  }\r\n\r\n  private generateRowWithButtonGroupEditors(row: DialogRow, rowIndex: number): React.ReactNode {\r\n    // istanbul ignore else\r\n    if (1 === row.items.length) {\r\n      return (\r\n        <div key={row.items[0].property.name} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n          {this.getEditor(row.items[0])}\r\n        </div>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <div key={rowIndex} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n        <div className=\"uifw-default-inline-editor-group\">\r\n          {row.items.map((item) => this.getEditor(item))}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private generateEntryWithButtonGroupEditors(row: DialogRow, rowIndex: number): ToolSettingsEntry {\r\n    // istanbul ignore else\r\n    if (1 === row.items.length) {\r\n      return (\r\n        {\r\n          labelNode: \"\",\r\n          editorNode:\r\n            <div key={row.items[0].property.name} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n              {this.getEditor(row.items[0])}\r\n            </div>,\r\n        }\r\n      );\r\n    }\r\n\r\n    return (\r\n      {\r\n        labelNode: \"\",\r\n        editorNode:\r\n          <div key={rowIndex} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n            <div className=\"uifw-default-inline-editor-group\">\r\n              {row.items.map((item) => this.getEditor(item))}\r\n            </div>\r\n          </div>,\r\n      }\r\n    );\r\n  }\r\n\r\n  private getEditorLabel(item: DialogItem, isLeftmostRecord = false): React.ReactNode {\r\n    return <EditorLabel uiDataProvider={this.uiDataProvider} item={item} isLeftmostRecord={isLeftmostRecord} />;\r\n  }\r\n\r\n  private getLeftLockAndLabel(rowItem: DialogItem, multiplePropertiesOnRow: boolean): React.ReactNode {\r\n    const record = UiLayoutDataProvider.getPropertyRecord(rowItem);\r\n    // istanbul ignore next\r\n    const lockEditor = (UiLayoutDataProvider.hasAssociatedLockProperty(rowItem)) ? this.getEditor(rowItem.lockProperty!, true) : null;\r\n    const label = (UiLayoutDataProvider.editorWantsLabel(rowItem)) ? this.getEditorLabel(rowItem) : null;\r\n    const classNames = multiplePropertiesOnRow ? \"uifw-default-lock-and-label uifw-default-wide-only-display\" : \"uifw-default-lock-and-label\";\r\n    return (\r\n      <div key={`lock-${record.property.name}`} className={classNames}>\r\n        {lockEditor}\r\n        {label}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private getInlineLabelAndEditor(item: DialogItem, isLeftmostRecord: boolean): React.ReactNode {\r\n    const label = (UiLayoutDataProvider.editorWantsLabel(item)) ? this.getEditorLabel(item, isLeftmostRecord) : null;\r\n    return (\r\n      <div key={item.property.name} className=\"uifw-default-inline-label-and-editor\">\r\n        {label}\r\n        {this.getEditor(item)}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private getRowWithMultipleEditors(row: DialogRow): React.ReactNode {\r\n    return <div className=\"uifw-default-inline-editor-group\">\r\n      {row.items.map((item: DialogItem, index: number) => this.getInlineLabelAndEditor(item, 0 === index))}\r\n    </div>;\r\n  }\r\n\r\n  private getDivForRow(row: DialogRow): React.ReactNode {\r\n    if (1 === row.items.length)\r\n      return this.getEditor(row.items[0]);\r\n    return this.getRowWithMultipleEditors(row);\r\n  }\r\n\r\n  public getRow(row: DialogRow, rowIndex: number): React.ReactNode {\r\n    if (UiLayoutDataProvider.onlyContainButtonGroupEditors(row)) {\r\n      return this.generateRowWithButtonGroupEditors(row, rowIndex);\r\n    } else {\r\n      return (\r\n        <React.Fragment key={rowIndex}>\r\n          {this.getLeftLockAndLabel(row.items[0], row.items.length > 1)}\r\n          {this.getDivForRow(row)}\r\n        </React.Fragment>\r\n      );\r\n    }\r\n  }\r\n\r\n  public getToolSettingsEntry(row: DialogRow, rowIndex: number): ToolSettingsEntry {\r\n    if (UiLayoutDataProvider.onlyContainButtonGroupEditors(row)) {\r\n      return this.generateEntryWithButtonGroupEditors(row, rowIndex);\r\n    } else {\r\n      return (\r\n        {\r\n          labelNode: this.getLeftLockAndLabel(row.items[0], row.items.length > 1),\r\n          editorNode: this.getDivForRow(row),\r\n        }\r\n      );\r\n    }\r\n  }\r\n\r\n  /** ToolSettingsEntries are used by the tool settings bar. */\r\n  public getToolSettingsEntries(): ToolSettingsEntry[] {\r\n    return this.uiDataProvider.rows.map((row: DialogRow, index: number) => this.getToolSettingsEntry(row, index));\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"ComponentGenerator.js","sourceRoot":"","sources":["../../../../src/appui-react/uiprovider/ComponentGenerator.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module UiProvider\r\n */\r\n\r\nimport \"./DefaultDialogGridContainer.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  BaseDialogItem, DialogItem, DialogItemValue, DialogPropertySyncItem, DialogRow, PropertyValueFormat, SyncPropertiesChangeEventArgs,\r\n  UiLayoutDataProvider,\r\n} from \"@itwin/appui-abstract\";\r\nimport { EditorContainer, PropertyUpdatedArgs } from \"@itwin/components-react\";\r\nimport { ToolSettingsEntry } from \"../widget-panels/ToolSettings\";\r\nimport { assert, Logger } from \"@itwin/core-bentley\";\r\n\r\nfunction EditorLabel({ uiDataProvider, item, isLeftmostRecord }: { uiDataProvider: UiLayoutDataProvider, item: DialogItem, isLeftmostRecord?: boolean }) {\r\n  const [isDisabled, setIsDisabled] = React.useState(!!item.isDisabled);\r\n  const displayLabel = React.useMemo(() => {\r\n    return item.property.displayLabel ? item.property.displayLabel : /* istanbul ignore next */ item.property.name;\r\n  }, [item]);\r\n  const propertyId = React.useMemo(() => `dialogItemProperty-${item.property.name}`, [item]);\r\n\r\n  // listen for tool sync property events and update the isDisabled state\r\n  React.useEffect(() => {\r\n    const handleSync = (args: SyncPropertiesChangeEventArgs) => {\r\n      const mySyncItem = args.properties.find((syncItem: DialogPropertySyncItem) => syncItem.propertyName === item.property.name);\r\n      // istanbul ignore next\r\n      if (mySyncItem) {\r\n        setIsDisabled(!!mySyncItem.isDisabled);\r\n      }\r\n    };\r\n    uiDataProvider.onSyncPropertiesChangeEvent.addListener(handleSync);\r\n    return () => {\r\n      uiDataProvider.onSyncPropertiesChangeEvent.removeListener(handleSync);\r\n    };\r\n  }, [uiDataProvider, item]);\r\n\r\n  // istanbul ignore next\r\n  const className = classnames(\r\n    \"uifw-default-label\",\r\n    isDisabled && \"uifw-label-disabled\",\r\n    !!isLeftmostRecord && \"uifw-default-narrow-only-display\",\r\n    !isLeftmostRecord && \"uifw-default-inline-label\",\r\n  );\r\n  return <label className={className} htmlFor={propertyId}>{displayLabel}:</label>;\r\n}\r\n\r\nfunction PropertyEditor({ uiDataProvider, initialItem, isLock, setFocus }: { uiDataProvider: UiLayoutDataProvider, initialItem: BaseDialogItem, isLock?: boolean, setFocus?: boolean }) {\r\n  const getLatestRecordValue = React.useCallback(() => {\r\n    let newRecord = UiLayoutDataProvider.getPropertyRecord(initialItem);\r\n\r\n    // istanbul ignore next\r\n    const foundItem = isLock ? uiDataProvider.items.find((item) => item.lockProperty?.property.name === initialItem.property.name) : uiDataProvider.items.find((item) => item.property.name === initialItem.property.name);\r\n    // istanbul ignore else\r\n    if (foundItem) {\r\n      if (isLock) {\r\n        newRecord = newRecord.copyWithNewValue({\r\n          value: foundItem.lockProperty!.value.value,\r\n          valueFormat: PropertyValueFormat.Primitive,\r\n        });\r\n        newRecord.isDisabled = foundItem.lockProperty!.isDisabled;\r\n      } else {\r\n        newRecord = newRecord.copyWithNewValue({\r\n          value: foundItem.value.value,\r\n          valueFormat: PropertyValueFormat.Primitive,\r\n        });\r\n        newRecord.isDisabled = foundItem.isDisabled;\r\n      }\r\n    }\r\n    return newRecord;\r\n  }, [initialItem, isLock, uiDataProvider.items]);\r\n\r\n  const currentRecord = getLatestRecordValue();\r\n  const [propertyRecord, setPropertyRecord] = React.useState(currentRecord);\r\n\r\n  // monitor tool for sync UI events\r\n  React.useEffect(() => {\r\n    const handleSync = (args: SyncPropertiesChangeEventArgs) => {\r\n      const mySyncItem = args.properties.find((syncItem: DialogPropertySyncItem) => syncItem.propertyName === initialItem.property.name);\r\n      // istanbul ignore else\r\n      if (mySyncItem) {\r\n        const newPropertyValue = propertyRecord.copyWithNewValue({\r\n          value: mySyncItem.value.value,\r\n          valueFormat: PropertyValueFormat.Primitive,\r\n          displayValue: mySyncItem.value.displayValue,\r\n        }, mySyncItem.property);\r\n\r\n        if (mySyncItem.property) {\r\n          // istanbul ignore else\r\n          if (mySyncItem.property.name === mySyncItem.propertyName) {\r\n            newPropertyValue.isDisabled = mySyncItem.isDisabled;\r\n            setPropertyRecord(newPropertyValue);\r\n          } else {\r\n            Logger.logError(\"PropertyEditor\", `Error trying to replace propertyName=${mySyncItem.propertyName} with property named ${mySyncItem.property.name}`);\r\n          }\r\n        } else {\r\n          newPropertyValue.isDisabled = mySyncItem.isDisabled;\r\n          setPropertyRecord(newPropertyValue);\r\n        }\r\n      }\r\n    };\r\n    uiDataProvider.onSyncPropertiesChangeEvent.addListener(handleSync);\r\n    return () => {\r\n      uiDataProvider.onSyncPropertiesChangeEvent.removeListener(handleSync);\r\n    };\r\n  }, [uiDataProvider, propertyRecord, initialItem.property.name]);\r\n\r\n  const className = React.useMemo(() => isLock ? \"uifw-default-property-lock\" : \"uifw-default-editor\", [isLock]);\r\n  // istanbul ignore next\r\n  const handleCommit = React.useCallback((commit: PropertyUpdatedArgs) => {\r\n    // UiLayoutDataProvider supports only primitive property types\r\n    // istanbul ignore next\r\n    assert(commit.newValue.valueFormat === PropertyValueFormat.Primitive && commit.propertyRecord.value.valueFormat === PropertyValueFormat.Primitive);\r\n    const newPropertyValue = propertyRecord.copyWithNewValue(commit.newValue);\r\n    const syncItem: DialogPropertySyncItem = { value: commit.newValue as DialogItemValue, propertyName: initialItem.property.name, isDisabled: newPropertyValue.isDisabled };\r\n    uiDataProvider.applyUiPropertyChange(syncItem);\r\n    // Now have the uiDataProvider refetch the latest property values from the tool\r\n    uiDataProvider.reloadDialogItems(true);\r\n  }, [initialItem.property.name, propertyRecord, uiDataProvider]);\r\n  // istanbul ignore next\r\n  const handleCancel = () => { };\r\n\r\n  return (\r\n    <div key={initialItem.property.name} className={className} >\r\n      <EditorContainer key={initialItem.property.name} propertyRecord={propertyRecord} setFocus={setFocus} onCommit={handleCommit} onCancel={handleCancel} />\r\n    </div>);\r\n}\r\n\r\n/** Utility methods to generate react ui from DialogRow specs\r\n * @internal\r\n */\r\nexport class ComponentGenerator {\r\n  constructor(private _uiDataProvider: UiLayoutDataProvider) {\r\n  }\r\n\r\n  public get uiDataProvider() {\r\n    return this._uiDataProvider;\r\n  }\r\n\r\n  private getEditor(item: BaseDialogItem, isLock = false, setFocus = false): React.ReactNode {\r\n    return <PropertyEditor key={item.property.name} uiDataProvider={this.uiDataProvider} initialItem={item} isLock={isLock} setFocus={setFocus} />;\r\n  }\r\n\r\n  private generateRowWithButtonGroupEditors(row: DialogRow, rowIndex: number): React.ReactNode {\r\n    // istanbul ignore else\r\n    if (1 === row.items.length) {\r\n      return (\r\n        <div key={row.items[0].property.name} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n          {this.getEditor(row.items[0])}\r\n        </div>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <div key={rowIndex} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n        <div className=\"uifw-default-inline-editor-group\">\r\n          {row.items.map((item) => this.getEditor(item))}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private generateEntryWithButtonGroupEditors(row: DialogRow, rowIndex: number): ToolSettingsEntry {\r\n    // istanbul ignore else\r\n    if (1 === row.items.length) {\r\n      return (\r\n        {\r\n          labelNode: \"\",\r\n          editorNode:\r\n            <div key={row.items[0].property.name} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n              {this.getEditor(row.items[0])}\r\n            </div>,\r\n        }\r\n      );\r\n    }\r\n\r\n    return (\r\n      {\r\n        labelNode: \"\",\r\n        editorNode:\r\n          <div key={rowIndex} className=\"uifw-default-inline-editor-group uifw-default-center-across-width\">\r\n            <div className=\"uifw-default-inline-editor-group\">\r\n              {row.items.map((item) => this.getEditor(item))}\r\n            </div>\r\n          </div>,\r\n      }\r\n    );\r\n  }\r\n\r\n  private getEditorLabel(item: DialogItem, isLeftmostRecord = false): React.ReactNode {\r\n    return <EditorLabel uiDataProvider={this.uiDataProvider} item={item} isLeftmostRecord={isLeftmostRecord} />;\r\n  }\r\n\r\n  private getLeftLockAndLabel(rowItem: DialogItem, multiplePropertiesOnRow: boolean): React.ReactNode {\r\n    const record = UiLayoutDataProvider.getPropertyRecord(rowItem);\r\n    // istanbul ignore next\r\n    const lockEditor = (UiLayoutDataProvider.hasAssociatedLockProperty(rowItem)) ? this.getEditor(rowItem.lockProperty!, true) : null;\r\n    const label = (UiLayoutDataProvider.editorWantsLabel(rowItem)) ? this.getEditorLabel(rowItem) : null;\r\n    const classNames = multiplePropertiesOnRow ? \"uifw-default-lock-and-label uifw-default-wide-only-display\" : \"uifw-default-lock-and-label\";\r\n    return (\r\n      <div key={`lock-${record.property.name}`} className={classNames}>\r\n        {lockEditor}\r\n        {label}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private getInlineLabelAndEditor(item: DialogItem, isLeftmostRecord: boolean): React.ReactNode {\r\n    const label = (UiLayoutDataProvider.editorWantsLabel(item)) ? this.getEditorLabel(item, isLeftmostRecord) : null;\r\n    return (\r\n      <div key={item.property.name} className=\"uifw-default-inline-label-and-editor\">\r\n        {label}\r\n        {this.getEditor(item)}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private getRowWithMultipleEditors(row: DialogRow): React.ReactNode {\r\n    return <div className=\"uifw-default-inline-editor-group\">\r\n      {row.items.map((item: DialogItem, index: number) => this.getInlineLabelAndEditor(item, 0 === index))}\r\n    </div>;\r\n  }\r\n\r\n  private getDivForRow(row: DialogRow): React.ReactNode {\r\n    if (1 === row.items.length)\r\n      return this.getEditor(row.items[0]);\r\n    return this.getRowWithMultipleEditors(row);\r\n  }\r\n\r\n  public getRow(row: DialogRow, rowIndex: number): React.ReactNode {\r\n    if (UiLayoutDataProvider.onlyContainButtonGroupEditors(row)) {\r\n      return this.generateRowWithButtonGroupEditors(row, rowIndex);\r\n    } else {\r\n      return (\r\n        <React.Fragment key={rowIndex}>\r\n          {this.getLeftLockAndLabel(row.items[0], row.items.length > 1)}\r\n          {this.getDivForRow(row)}\r\n        </React.Fragment>\r\n      );\r\n    }\r\n  }\r\n\r\n  public getToolSettingsEntry(row: DialogRow, rowIndex: number): ToolSettingsEntry {\r\n    if (UiLayoutDataProvider.onlyContainButtonGroupEditors(row)) {\r\n      return this.generateEntryWithButtonGroupEditors(row, rowIndex);\r\n    } else {\r\n      return (\r\n        {\r\n          labelNode: this.getLeftLockAndLabel(row.items[0], row.items.length > 1),\r\n          editorNode: this.getDivForRow(row),\r\n        }\r\n      );\r\n    }\r\n  }\r\n\r\n  /** ToolSettingsEntries are used by the tool settings bar. */\r\n  public getToolSettingsEntries(): ToolSettingsEntry[] {\r\n    return this.uiDataProvider.rows.map((row: DialogRow, index: number) => this.getToolSettingsEntry(row, index));\r\n  }\r\n}\r\n"]}

package/lib/cjs/appui-react/uiprovider/DefaultDialogGridContainer.d.ts

@@ -1,28 +1,28 @@
-/** @packageDocumentation
- * @module UiProvider
- */
-/// <reference types="react" />
-import "./DefaultDialogGridContainer.scss";
-import { ComponentGenerator } from "./ComponentGenerator";
-/**
- * Component to provide grid of property editors
- * @public
- */
-export declare function ToolSettingsGridContainer({ componentGenerator }: {
-    componentGenerator: ComponentGenerator;
-}): JSX.Element;
-interface DialogGridContainerProps {
-    componentGenerator: ComponentGenerator;
-    containerClassName?: string;
-}
-/** @internal */
-export declare function DialogGridContainer({ componentGenerator, containerClassName }: DialogGridContainerProps): JSX.Element;
-/** DefaultDialogGridContainer populates a React node with the items specified by the UiLayoutDataProvider
- * @public
- */
-export declare function DefaultDialogGridContainer({ componentGenerator, isToolSettings }: {
-    componentGenerator: ComponentGenerator;
-    isToolSettings?: boolean;
-}): JSX.Element;
-export {};
+/** @packageDocumentation
+ * @module UiProvider
+ */
+/// <reference types="react" />
+import "./DefaultDialogGridContainer.scss";
+import { ComponentGenerator } from "./ComponentGenerator";
+/**
+ * Component to provide grid of property editors
+ * @public
+ */
+export declare function ToolSettingsGridContainer({ componentGenerator }: {
+    componentGenerator: ComponentGenerator;
+}): JSX.Element;
+interface DialogGridContainerProps {
+    componentGenerator: ComponentGenerator;
+    containerClassName?: string;
+}
+/** @internal */
+export declare function DialogGridContainer({ componentGenerator, containerClassName }: DialogGridContainerProps): JSX.Element;
+/** DefaultDialogGridContainer populates a React node with the items specified by the UiLayoutDataProvider
+ * @public
+ */
+export declare function DefaultDialogGridContainer({ componentGenerator, isToolSettings }: {
+    componentGenerator: ComponentGenerator;
+    isToolSettings?: boolean;
+}): JSX.Element;
+export {};
 //# sourceMappingURL=DefaultDialogGridContainer.d.ts.map

package/lib/cjs/appui-react/uiprovider/DefaultDialogGridContainer.js

@@ -1,54 +1,54 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module UiProvider
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DefaultDialogGridContainer = exports.DialogGridContainer = exports.ToolSettingsGridContainer = void 0;
-require("./DefaultDialogGridContainer.scss");
-const classnames_1 = require("classnames");
-const React = require("react");
-const ToolSettingsContent_1 = require("../widgets/ToolSettingsContent");
-var LayoutMode;
-(function (LayoutMode) {
-    LayoutMode[LayoutMode["Wide"] = 0] = "Wide";
-    LayoutMode[LayoutMode["Narrow"] = 1] = "Narrow";
-})(LayoutMode || (LayoutMode = {}));
-/**
- * Component to provide grid of property editors
- * @public
- */
-function ToolSettingsGridContainer({ componentGenerator }) {
-    const { availableContentWidth } = React.useContext(ToolSettingsContent_1.ToolSettingsContentContext);
-    const layoutMode = toLayoutMode(availableContentWidth);
-    const className = (0, classnames_1.default)("uifw-tool-settings-grid-container", 
-    // istanbul ignore next
-    LayoutMode.Narrow === layoutMode && "uifw-default-narrow");
-    return (React.createElement(DialogGridContainer, { componentGenerator: componentGenerator, containerClassName: className }));
-}
-exports.ToolSettingsGridContainer = ToolSettingsGridContainer;
-/** @internal */
-// istanbul ignore next
-function DialogGridContainer({ componentGenerator, containerClassName }) {
-    const className = (0, classnames_1.default)("uifw-default-container", containerClassName);
-    return (React.createElement("div", { className: "uifw-default-resizer-parent" },
-        React.createElement("div", { className: className }, componentGenerator.uiDataProvider.rows.map((row, index) => componentGenerator.getRow(row, index)))));
-}
-exports.DialogGridContainer = DialogGridContainer;
-/** DefaultDialogGridContainer populates a React node with the items specified by the UiLayoutDataProvider
- * @public
- */
-function DefaultDialogGridContainer({ componentGenerator, isToolSettings }) {
-    return (!!isToolSettings ?
-        React.createElement(ToolSettingsGridContainer, { componentGenerator: componentGenerator }) :
-        /* istanbul ignore next */
-        React.createElement(DialogGridContainer, { componentGenerator: componentGenerator }));
-}
-exports.DefaultDialogGridContainer = DefaultDialogGridContainer;
-const toLayoutMode = (width) => {
-    return (width < 250 && width > 0) ? /* istanbul ignore next */ LayoutMode.Narrow : LayoutMode.Wide;
-};
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module UiProvider
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DefaultDialogGridContainer = exports.DialogGridContainer = exports.ToolSettingsGridContainer = void 0;
+require("./DefaultDialogGridContainer.scss");
+const classnames_1 = require("classnames");
+const React = require("react");
+const ToolSettingsContent_1 = require("../widgets/ToolSettingsContent");
+var LayoutMode;
+(function (LayoutMode) {
+    LayoutMode[LayoutMode["Wide"] = 0] = "Wide";
+    LayoutMode[LayoutMode["Narrow"] = 1] = "Narrow";
+})(LayoutMode || (LayoutMode = {}));
+/**
+ * Component to provide grid of property editors
+ * @public
+ */
+function ToolSettingsGridContainer({ componentGenerator }) {
+    const { availableContentWidth } = React.useContext(ToolSettingsContent_1.ToolSettingsContentContext);
+    const layoutMode = toLayoutMode(availableContentWidth);
+    const className = (0, classnames_1.default)("uifw-tool-settings-grid-container", 
+    // istanbul ignore next
+    LayoutMode.Narrow === layoutMode && "uifw-default-narrow");
+    return (React.createElement(DialogGridContainer, { componentGenerator: componentGenerator, containerClassName: className }));
+}
+exports.ToolSettingsGridContainer = ToolSettingsGridContainer;
+/** @internal */
+// istanbul ignore next
+function DialogGridContainer({ componentGenerator, containerClassName }) {
+    const className = (0, classnames_1.default)("uifw-default-container", containerClassName);
+    return (React.createElement("div", { className: "uifw-default-resizer-parent" },
+        React.createElement("div", { className: className }, componentGenerator.uiDataProvider.rows.map((row, index) => componentGenerator.getRow(row, index)))));
+}
+exports.DialogGridContainer = DialogGridContainer;
+/** DefaultDialogGridContainer populates a React node with the items specified by the UiLayoutDataProvider
+ * @public
+ */
+function DefaultDialogGridContainer({ componentGenerator, isToolSettings }) {
+    return (!!isToolSettings ?
+        React.createElement(ToolSettingsGridContainer, { componentGenerator: componentGenerator }) :
+        /* istanbul ignore next */
+        React.createElement(DialogGridContainer, { componentGenerator: componentGenerator }));
+}
+exports.DefaultDialogGridContainer = DefaultDialogGridContainer;
+const toLayoutMode = (width) => {
+    return (width < 250 && width > 0) ? /* istanbul ignore next */ LayoutMode.Narrow : LayoutMode.Wide;
+};
 //# sourceMappingURL=DefaultDialogGridContainer.js.map

package/lib/cjs/appui-react/uistate/AppUiSettings.d.ts

@@ -1,50 +1,50 @@
-/** @packageDocumentation
- * @module Settings
- */
-import { UiStateEntry, UiStateStorage } from "@itwin/core-react";
-import { UserSettingsProvider } from "../UiFramework";
-/** Default values that may be specified for [[AppUiSettings]].
- * @public
- */
-export interface InitialAppUiSettings {
-    colorTheme: string;
-    dragInteraction: boolean;
-    widgetOpacity: number;
-    showWidgetIcon?: boolean;
-    /** @alpha */
-    autoCollapseUnpinnedPanels?: boolean;
-    animateToolSettings?: boolean;
-    useToolAsToolSettingsLabel?: boolean;
-    toolbarOpacity: number;
-}
-/** These are the UI settings that are stored in the Redux store. They control the color theme, the UI version,
- * how toolbar group buttons work, and the opacity of widgets in 1.0 and floating widget in 2.0 when the cursor
- * is not inside them. It is expect that an IModelApp using App UI components will create and register AppUiSettings with
- * defaults specific to their application. This would be done by calling the following.
- *
- * ```ts
- * UiFramework.registerUserSettingsProvider(new AppUiSettings(defaults));
- * ```
- *
- * @public
- */
-export declare class AppUiSettings implements UserSettingsProvider {
-    readonly providerId = "AppUiSettingsProvider";
-    private static _settingNamespace;
-    private _settings;
-    private _applyingLocalSettings;
-    colorTheme: UiStateEntry<string>;
-    dragInteraction: UiStateEntry<boolean>;
-    widgetOpacity: UiStateEntry<number>;
-    showWidgetIcon: UiStateEntry<boolean>;
-    autoCollapseUnpinnedPanels: UiStateEntry<boolean>;
-    animateToolSettings: UiStateEntry<boolean>;
-    useToolAsToolSettingsLabel: UiStateEntry<boolean>;
-    toolbarOpacity: UiStateEntry<number>;
-    private setColorTheme;
-    constructor(defaults: Partial<InitialAppUiSettings>);
-    private handleSyncUiEvent;
-    apply(storage: UiStateStorage): Promise<void>;
-    loadUserSettings(storage: UiStateStorage): Promise<void>;
-}
+/** @packageDocumentation
+ * @module Settings
+ */
+import { UiStateEntry, UiStateStorage } from "@itwin/core-react";
+import { UserSettingsProvider } from "../UiFramework";
+/** Default values that may be specified for [[AppUiSettings]].
+ * @public
+ */
+export interface InitialAppUiSettings {
+    colorTheme: string;
+    dragInteraction: boolean;
+    widgetOpacity: number;
+    showWidgetIcon?: boolean;
+    /** @alpha */
+    autoCollapseUnpinnedPanels?: boolean;
+    animateToolSettings?: boolean;
+    useToolAsToolSettingsLabel?: boolean;
+    toolbarOpacity: number;
+}
+/** These are the UI settings that are stored in the Redux store. They control the color theme, the UI version,
+ * how toolbar group buttons work, and the opacity of widgets in 1.0 and floating widget in 2.0 when the cursor
+ * is not inside them. It is expect that an IModelApp using App UI components will create and register AppUiSettings with
+ * defaults specific to their application. This would be done by calling the following.
+ *
+ * ```ts
+ * UiFramework.registerUserSettingsProvider(new AppUiSettings(defaults));
+ * ```
+ *
+ * @public
+ */
+export declare class AppUiSettings implements UserSettingsProvider {
+    readonly providerId = "AppUiSettingsProvider";
+    private static _settingNamespace;
+    private _settings;
+    private _applyingLocalSettings;
+    colorTheme: UiStateEntry<string>;
+    dragInteraction: UiStateEntry<boolean>;
+    widgetOpacity: UiStateEntry<number>;
+    showWidgetIcon: UiStateEntry<boolean>;
+    autoCollapseUnpinnedPanels: UiStateEntry<boolean>;
+    animateToolSettings: UiStateEntry<boolean>;
+    useToolAsToolSettingsLabel: UiStateEntry<boolean>;
+    toolbarOpacity: UiStateEntry<number>;
+    private setColorTheme;
+    constructor(defaults: Partial<InitialAppUiSettings>);
+    private handleSyncUiEvent;
+    apply(storage: UiStateStorage): Promise<void>;
+    loadUserSettings(storage: UiStateStorage): Promise<void>;
+}
 //# sourceMappingURL=AppUiSettings.d.ts.map

package/lib/cjs/appui-react/uistate/AppUiSettings.js

@@ -1,90 +1,90 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Settings
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AppUiSettings = void 0;
-const core_react_1 = require("@itwin/core-react");
-const SyncUiEventDispatcher_1 = require("../syncui/SyncUiEventDispatcher");
-const UiFramework_1 = require("../UiFramework");
-/** These are the UI settings that are stored in the Redux store. They control the color theme, the UI version,
- * how toolbar group buttons work, and the opacity of widgets in 1.0 and floating widget in 2.0 when the cursor
- * is not inside them. It is expect that an IModelApp using App UI components will create and register AppUiSettings with
- * defaults specific to their application. This would be done by calling the following.
- *
- * ```ts
- * UiFramework.registerUserSettingsProvider(new AppUiSettings(defaults));
- * ```
- *
- * @public
- */
-class AppUiSettings {
-    constructor(defaults) {
-        this.providerId = "AppUiSettingsProvider";
-        this._settings = [];
-        this._applyingLocalSettings = false;
-        this.setColorTheme = (theme) => {
-            UiFramework_1.UiFramework.setColorTheme(theme);
-            // always store to local storage to avoid flicker during startup if user is not yet logged-in
-            window.localStorage.setItem("uifw:defaultTheme", theme);
-        };
-        this.handleSyncUiEvent = async (args) => {
-            if (this._applyingLocalSettings)
-                return;
-            if (args.eventIds.has("configurableui:set_theme")) {
-                await this.colorTheme.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-                // always store as default theme in local storage to avoid flicker during startup if user is not yet logged-in
-                window.localStorage.setItem("uifw:defaultTheme", UiFramework_1.UiFramework.getColorTheme());
-            }
-            if (args.eventIds.has("configurableui:set-drag-interaction"))
-                await this.dragInteraction.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-            if (args.eventIds.has("configurableui:set-show-widget-icon"))
-                await this.showWidgetIcon.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-            if (args.eventIds.has("configurableui:set-auto-collapse-unpinned-panels"))
-                await this.autoCollapseUnpinnedPanels.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-            if (args.eventIds.has("configurableui:set_widget_opacity"))
-                await this.widgetOpacity.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-            if (args.eventIds.has("configurableui:set-animate-tool-settings"))
-                await this.animateToolSettings.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-            if (args.eventIds.has("configurableui:set-use-tool-as-tool-settings-label"))
-                await this.useToolAsToolSettingsLabel.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-            if (args.eventIds.has("configurableui:set-toolbar-opacity"))
-                await this.toolbarOpacity.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
-        };
-        this._settings = [];
-        this.colorTheme = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "ColorTheme", UiFramework_1.UiFramework.getColorTheme, this.setColorTheme, defaults.colorTheme);
-        this._settings.push(this.colorTheme);
-        this.dragInteraction = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "DragInteraction", () => UiFramework_1.UiFramework.useDragInteraction, (value) => UiFramework_1.UiFramework.setUseDragInteraction(value), defaults.dragInteraction);
-        this._settings.push(this.dragInteraction);
-        this.showWidgetIcon = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "ShowWidgetIcon", () => UiFramework_1.UiFramework.showWidgetIcon, (value) => UiFramework_1.UiFramework.setShowWidgetIcon(value), defaults.showWidgetIcon);
-        this._settings.push(this.showWidgetIcon);
-        this.autoCollapseUnpinnedPanels = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "AutoCollapseUnpinnedPanels", () => UiFramework_1.UiFramework.autoCollapseUnpinnedPanels, (value) => UiFramework_1.UiFramework.setAutoCollapseUnpinnedPanels(value), defaults.autoCollapseUnpinnedPanels);
-        this._settings.push(this.autoCollapseUnpinnedPanels);
-        this.widgetOpacity = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "WidgetOpacity", () => UiFramework_1.UiFramework.getWidgetOpacity(), (value) => UiFramework_1.UiFramework.setWidgetOpacity(value), defaults.widgetOpacity);
-        this._settings.push(this.widgetOpacity);
-        this.animateToolSettings = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "AnimateToolSettings", () => UiFramework_1.UiFramework.animateToolSettings, (value) => UiFramework_1.UiFramework.setAnimateToolSettings(value), defaults.animateToolSettings);
-        this._settings.push(this.animateToolSettings);
-        this.useToolAsToolSettingsLabel = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "UseToolAsToolSettingsLabel", () => UiFramework_1.UiFramework.useToolAsToolSettingsLabel, (value) => UiFramework_1.UiFramework.setUseToolAsToolSettingsLabel(value), defaults.useToolAsToolSettingsLabel);
-        this._settings.push(this.useToolAsToolSettingsLabel);
-        this.toolbarOpacity = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "ToolOpacity", () => UiFramework_1.UiFramework.getToolbarOpacity(), (value) => UiFramework_1.UiFramework.setToolbarOpacity(value), defaults.toolbarOpacity);
-        this._settings.push(this.toolbarOpacity);
-        SyncUiEventDispatcher_1.SyncUiEventDispatcher.onSyncUiEvent.addListener(this.handleSyncUiEvent);
-    }
-    async apply(storage) {
-        this._applyingLocalSettings = true;
-        for await (const setting of this._settings) {
-            await setting.getSettingAndApplyValue(storage);
-        }
-        this._applyingLocalSettings = false;
-    }
-    async loadUserSettings(storage) {
-        await this.apply(storage);
-    }
-}
-exports.AppUiSettings = AppUiSettings;
-AppUiSettings._settingNamespace = "AppUiSettings";
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Settings
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppUiSettings = void 0;
+const core_react_1 = require("@itwin/core-react");
+const SyncUiEventDispatcher_1 = require("../syncui/SyncUiEventDispatcher");
+const UiFramework_1 = require("../UiFramework");
+/** These are the UI settings that are stored in the Redux store. They control the color theme, the UI version,
+ * how toolbar group buttons work, and the opacity of widgets in 1.0 and floating widget in 2.0 when the cursor
+ * is not inside them. It is expect that an IModelApp using App UI components will create and register AppUiSettings with
+ * defaults specific to their application. This would be done by calling the following.
+ *
+ * ```ts
+ * UiFramework.registerUserSettingsProvider(new AppUiSettings(defaults));
+ * ```
+ *
+ * @public
+ */
+class AppUiSettings {
+    constructor(defaults) {
+        this.providerId = "AppUiSettingsProvider";
+        this._settings = [];
+        this._applyingLocalSettings = false;
+        this.setColorTheme = (theme) => {
+            UiFramework_1.UiFramework.setColorTheme(theme);
+            // always store to local storage to avoid flicker during startup if user is not yet logged-in
+            window.localStorage.setItem("uifw:defaultTheme", theme);
+        };
+        this.handleSyncUiEvent = async (args) => {
+            if (this._applyingLocalSettings)
+                return;
+            if (args.eventIds.has("configurableui:set_theme")) {
+                await this.colorTheme.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+                // always store as default theme in local storage to avoid flicker during startup if user is not yet logged-in
+                window.localStorage.setItem("uifw:defaultTheme", UiFramework_1.UiFramework.getColorTheme());
+            }
+            if (args.eventIds.has("configurableui:set-drag-interaction"))
+                await this.dragInteraction.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+            if (args.eventIds.has("configurableui:set-show-widget-icon"))
+                await this.showWidgetIcon.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+            if (args.eventIds.has("configurableui:set-auto-collapse-unpinned-panels"))
+                await this.autoCollapseUnpinnedPanels.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+            if (args.eventIds.has("configurableui:set_widget_opacity"))
+                await this.widgetOpacity.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+            if (args.eventIds.has("configurableui:set-animate-tool-settings"))
+                await this.animateToolSettings.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+            if (args.eventIds.has("configurableui:set-use-tool-as-tool-settings-label"))
+                await this.useToolAsToolSettingsLabel.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+            if (args.eventIds.has("configurableui:set-toolbar-opacity"))
+                await this.toolbarOpacity.saveSetting(UiFramework_1.UiFramework.getUiStateStorage());
+        };
+        this._settings = [];
+        this.colorTheme = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "ColorTheme", UiFramework_1.UiFramework.getColorTheme, this.setColorTheme, defaults.colorTheme);
+        this._settings.push(this.colorTheme);
+        this.dragInteraction = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "DragInteraction", () => UiFramework_1.UiFramework.useDragInteraction, (value) => UiFramework_1.UiFramework.setUseDragInteraction(value), defaults.dragInteraction);
+        this._settings.push(this.dragInteraction);
+        this.showWidgetIcon = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "ShowWidgetIcon", () => UiFramework_1.UiFramework.showWidgetIcon, (value) => UiFramework_1.UiFramework.setShowWidgetIcon(value), defaults.showWidgetIcon);
+        this._settings.push(this.showWidgetIcon);
+        this.autoCollapseUnpinnedPanels = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "AutoCollapseUnpinnedPanels", () => UiFramework_1.UiFramework.autoCollapseUnpinnedPanels, (value) => UiFramework_1.UiFramework.setAutoCollapseUnpinnedPanels(value), defaults.autoCollapseUnpinnedPanels);
+        this._settings.push(this.autoCollapseUnpinnedPanels);
+        this.widgetOpacity = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "WidgetOpacity", () => UiFramework_1.UiFramework.getWidgetOpacity(), (value) => UiFramework_1.UiFramework.setWidgetOpacity(value), defaults.widgetOpacity);
+        this._settings.push(this.widgetOpacity);
+        this.animateToolSettings = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "AnimateToolSettings", () => UiFramework_1.UiFramework.animateToolSettings, (value) => UiFramework_1.UiFramework.setAnimateToolSettings(value), defaults.animateToolSettings);
+        this._settings.push(this.animateToolSettings);
+        this.useToolAsToolSettingsLabel = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "UseToolAsToolSettingsLabel", () => UiFramework_1.UiFramework.useToolAsToolSettingsLabel, (value) => UiFramework_1.UiFramework.setUseToolAsToolSettingsLabel(value), defaults.useToolAsToolSettingsLabel);
+        this._settings.push(this.useToolAsToolSettingsLabel);
+        this.toolbarOpacity = new core_react_1.UiStateEntry(AppUiSettings._settingNamespace, "ToolOpacity", () => UiFramework_1.UiFramework.getToolbarOpacity(), (value) => UiFramework_1.UiFramework.setToolbarOpacity(value), defaults.toolbarOpacity);
+        this._settings.push(this.toolbarOpacity);
+        SyncUiEventDispatcher_1.SyncUiEventDispatcher.onSyncUiEvent.addListener(this.handleSyncUiEvent);
+    }
+    async apply(storage) {
+        this._applyingLocalSettings = true;
+        for await (const setting of this._settings) {
+            await setting.getSettingAndApplyValue(storage);
+        }
+        this._applyingLocalSettings = false;
+    }
+    async loadUserSettings(storage) {
+        await this.apply(storage);
+    }
+}
+AppUiSettings._settingNamespace = "AppUiSettings";
+exports.AppUiSettings = AppUiSettings;
 //# sourceMappingURL=AppUiSettings.js.map

package/lib/cjs/appui-react/uistate/AppUiSettings.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppUiSettings.js","sourceRoot":"","sources":["../../../../src/appui-react/uistate/AppUiSettings.ts"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Settings\r\n */\r\n\r\nimport { UiStateEntry, UiStateStorage } from \"@itwin/core-react\";\r\nimport { UiSyncEventArgs } from \"@itwin/appui-abstract\";\r\nimport { SyncUiEventDispatcher } from \"../syncui/SyncUiEventDispatcher\";\r\nimport { UiFramework, UserSettingsProvider } from \"../UiFramework\";\r\n\r\n// cSpell:ignore configurableui\r\n\r\n/** Default values that may be specified for [[AppUiSettings]].\r\n * @public\r\n */\r\nexport interface InitialAppUiSettings {\r\n  colorTheme: string;\r\n  dragInteraction: boolean;\r\n  widgetOpacity: number;\r\n  showWidgetIcon?: boolean;\r\n  /** @alpha */\r\n  autoCollapseUnpinnedPanels?: boolean;\r\n  animateToolSettings?: boolean;\r\n  useToolAsToolSettingsLabel?: boolean;\r\n  toolbarOpacity: number;\r\n}\r\n\r\n/** These are the UI settings that are stored in the Redux store. They control the color theme, the UI version,\r\n * how toolbar group buttons work, and the opacity of widgets in 1.0 and floating widget in 2.0 when the cursor\r\n * is not inside them. It is expect that an IModelApp using App UI components will create and register AppUiSettings with\r\n * defaults specific to their application. This would be done by calling the following.\r\n *\r\n * ```ts\r\n * UiFramework.registerUserSettingsProvider(new AppUiSettings(defaults));\r\n * ```\r\n *\r\n * @public\r\n */\r\nexport class AppUiSettings implements UserSettingsProvider {\r\n  public readonly providerId = \"AppUiSettingsProvider\";\r\n\r\n  private static _settingNamespace = \"AppUiSettings\";\r\n  private _settings: Array<UiStateEntry<any>> = [];\r\n  private _applyingLocalSettings = false;\r\n\r\n  public colorTheme: UiStateEntry<string>;\r\n  public dragInteraction: UiStateEntry<boolean>;\r\n  public widgetOpacity: UiStateEntry<number>;\r\n  public showWidgetIcon: UiStateEntry<boolean>;\r\n  public autoCollapseUnpinnedPanels: UiStateEntry<boolean>;\r\n  public animateToolSettings: UiStateEntry<boolean>;\r\n  public useToolAsToolSettingsLabel: UiStateEntry<boolean>;\r\n  public toolbarOpacity: UiStateEntry<number>;\r\n\r\n  private setColorTheme = (theme: string) => {\r\n    UiFramework.setColorTheme(theme);\r\n    // always store to local storage to avoid flicker during startup if user is not yet logged-in\r\n    window.localStorage.setItem(\"uifw:defaultTheme\", theme);\r\n  };\r\n\r\n  constructor(defaults: Partial<InitialAppUiSettings>) {\r\n    this._settings = [];\r\n\r\n    this.colorTheme = new UiStateEntry<string>(AppUiSettings._settingNamespace, \"ColorTheme\", UiFramework.getColorTheme, this.setColorTheme, defaults.colorTheme);\r\n    this._settings.push(this.colorTheme);\r\n\r\n    this.dragInteraction = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"DragInteraction\",\r\n      () => UiFramework.useDragInteraction,\r\n      (value: boolean) => UiFramework.setUseDragInteraction(value), defaults.dragInteraction);\r\n    this._settings.push(this.dragInteraction);\r\n\r\n    this.showWidgetIcon = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"ShowWidgetIcon\",\r\n      () => UiFramework.showWidgetIcon,\r\n      (value: boolean) => UiFramework.setShowWidgetIcon(value), defaults.showWidgetIcon);\r\n    this._settings.push(this.showWidgetIcon);\r\n\r\n    this.autoCollapseUnpinnedPanels = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"AutoCollapseUnpinnedPanels\",\r\n      () => UiFramework.autoCollapseUnpinnedPanels,\r\n      (value: boolean) => UiFramework.setAutoCollapseUnpinnedPanels(value), defaults.autoCollapseUnpinnedPanels);\r\n    this._settings.push(this.autoCollapseUnpinnedPanels);\r\n\r\n    this.widgetOpacity = new UiStateEntry<number>(AppUiSettings._settingNamespace, \"WidgetOpacity\",\r\n      () => UiFramework.getWidgetOpacity(), (value: number) => UiFramework.setWidgetOpacity(value), defaults.widgetOpacity);\r\n    this._settings.push(this.widgetOpacity);\r\n\r\n    this.animateToolSettings = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"AnimateToolSettings\",\r\n      () => UiFramework.animateToolSettings,\r\n      (value: boolean) => UiFramework.setAnimateToolSettings(value), defaults.animateToolSettings);\r\n    this._settings.push(this.animateToolSettings);\r\n\r\n    this.useToolAsToolSettingsLabel = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"UseToolAsToolSettingsLabel\",\r\n      () => UiFramework.useToolAsToolSettingsLabel,\r\n      (value: boolean) => UiFramework.setUseToolAsToolSettingsLabel(value), defaults.useToolAsToolSettingsLabel);\r\n    this._settings.push(this.useToolAsToolSettingsLabel);\r\n\r\n    this.toolbarOpacity = new UiStateEntry<number>(AppUiSettings._settingNamespace, \"ToolOpacity\",\r\n      () => UiFramework.getToolbarOpacity(), (value: number) => UiFramework.setToolbarOpacity(value), defaults.toolbarOpacity);\r\n    this._settings.push(this.toolbarOpacity);\r\n\r\n    SyncUiEventDispatcher.onSyncUiEvent.addListener(this.handleSyncUiEvent);\r\n  }\r\n\r\n  private handleSyncUiEvent = async (args: UiSyncEventArgs) => {\r\n    if (this._applyingLocalSettings)\r\n      return;\r\n\r\n    if (args.eventIds.has(\"configurableui:set_theme\")) {\r\n      await this.colorTheme.saveSetting(UiFramework.getUiStateStorage());\r\n      // always store as default theme in local storage to avoid flicker during startup if user is not yet logged-in\r\n      window.localStorage.setItem(\"uifw:defaultTheme\", UiFramework.getColorTheme());\r\n    }\r\n\r\n    if (args.eventIds.has(\"configurableui:set-drag-interaction\"))\r\n      await this.dragInteraction.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-show-widget-icon\"))\r\n      await this.showWidgetIcon.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-auto-collapse-unpinned-panels\"))\r\n      await this.autoCollapseUnpinnedPanels.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set_widget_opacity\"))\r\n      await this.widgetOpacity.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-animate-tool-settings\"))\r\n      await this.animateToolSettings.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-use-tool-as-tool-settings-label\"))\r\n      await this.useToolAsToolSettingsLabel.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-toolbar-opacity\"))\r\n      await this.toolbarOpacity.saveSetting(UiFramework.getUiStateStorage());\r\n  };\r\n\r\n  public async apply(storage: UiStateStorage): Promise<void> {\r\n    this._applyingLocalSettings = true;\r\n    for await (const setting of this._settings) {\r\n      await setting.getSettingAndApplyValue(storage);\r\n    }\r\n    this._applyingLocalSettings = false;\r\n  }\r\n\r\n  public async loadUserSettings(storage: UiStateStorage): Promise<void> {\r\n    await this.apply(storage);\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"AppUiSettings.js","sourceRoot":"","sources":["../../../../src/appui-react/uistate/AppUiSettings.ts"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Settings\r\n */\r\n\r\nimport { UiStateEntry, UiStateStorage } from \"@itwin/core-react\";\r\nimport { UiSyncEventArgs } from \"@itwin/appui-abstract\";\r\nimport { SyncUiEventDispatcher } from \"../syncui/SyncUiEventDispatcher\";\r\nimport { UiFramework, UserSettingsProvider } from \"../UiFramework\";\r\n\r\n// cSpell:ignore configurableui\r\n\r\n/** Default values that may be specified for [[AppUiSettings]].\r\n * @public\r\n */\r\nexport interface InitialAppUiSettings {\r\n  colorTheme: string;\r\n  dragInteraction: boolean;\r\n  widgetOpacity: number;\r\n  showWidgetIcon?: boolean;\r\n  /** @alpha */\r\n  autoCollapseUnpinnedPanels?: boolean;\r\n  animateToolSettings?: boolean;\r\n  useToolAsToolSettingsLabel?: boolean;\r\n  toolbarOpacity: number;\r\n}\r\n\r\n/** These are the UI settings that are stored in the Redux store. They control the color theme, the UI version,\r\n * how toolbar group buttons work, and the opacity of widgets in 1.0 and floating widget in 2.0 when the cursor\r\n * is not inside them. It is expect that an IModelApp using App UI components will create and register AppUiSettings with\r\n * defaults specific to their application. This would be done by calling the following.\r\n *\r\n * ```ts\r\n * UiFramework.registerUserSettingsProvider(new AppUiSettings(defaults));\r\n * ```\r\n *\r\n * @public\r\n */\r\nexport class AppUiSettings implements UserSettingsProvider {\r\n  public readonly providerId = \"AppUiSettingsProvider\";\r\n\r\n  private static _settingNamespace = \"AppUiSettings\";\r\n  private _settings: Array<UiStateEntry<any>> = [];\r\n  private _applyingLocalSettings = false;\r\n\r\n  public colorTheme: UiStateEntry<string>;\r\n  public dragInteraction: UiStateEntry<boolean>;\r\n  public widgetOpacity: UiStateEntry<number>;\r\n  public showWidgetIcon: UiStateEntry<boolean>;\r\n  public autoCollapseUnpinnedPanels: UiStateEntry<boolean>;\r\n  public animateToolSettings: UiStateEntry<boolean>;\r\n  public useToolAsToolSettingsLabel: UiStateEntry<boolean>;\r\n  public toolbarOpacity: UiStateEntry<number>;\r\n\r\n  private setColorTheme = (theme: string) => {\r\n    UiFramework.setColorTheme(theme);\r\n    // always store to local storage to avoid flicker during startup if user is not yet logged-in\r\n    window.localStorage.setItem(\"uifw:defaultTheme\", theme);\r\n  };\r\n\r\n  constructor(defaults: Partial<InitialAppUiSettings>) {\r\n    this._settings = [];\r\n\r\n    this.colorTheme = new UiStateEntry<string>(AppUiSettings._settingNamespace, \"ColorTheme\", UiFramework.getColorTheme, this.setColorTheme, defaults.colorTheme);\r\n    this._settings.push(this.colorTheme);\r\n\r\n    this.dragInteraction = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"DragInteraction\",\r\n      () => UiFramework.useDragInteraction,\r\n      (value: boolean) => UiFramework.setUseDragInteraction(value), defaults.dragInteraction);\r\n    this._settings.push(this.dragInteraction);\r\n\r\n    this.showWidgetIcon = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"ShowWidgetIcon\",\r\n      () => UiFramework.showWidgetIcon,\r\n      (value: boolean) => UiFramework.setShowWidgetIcon(value), defaults.showWidgetIcon);\r\n    this._settings.push(this.showWidgetIcon);\r\n\r\n    this.autoCollapseUnpinnedPanels = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"AutoCollapseUnpinnedPanels\",\r\n      () => UiFramework.autoCollapseUnpinnedPanels,\r\n      (value: boolean) => UiFramework.setAutoCollapseUnpinnedPanels(value), defaults.autoCollapseUnpinnedPanels);\r\n    this._settings.push(this.autoCollapseUnpinnedPanels);\r\n\r\n    this.widgetOpacity = new UiStateEntry<number>(AppUiSettings._settingNamespace, \"WidgetOpacity\",\r\n      () => UiFramework.getWidgetOpacity(), (value: number) => UiFramework.setWidgetOpacity(value), defaults.widgetOpacity);\r\n    this._settings.push(this.widgetOpacity);\r\n\r\n    this.animateToolSettings = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"AnimateToolSettings\",\r\n      () => UiFramework.animateToolSettings,\r\n      (value: boolean) => UiFramework.setAnimateToolSettings(value), defaults.animateToolSettings);\r\n    this._settings.push(this.animateToolSettings);\r\n\r\n    this.useToolAsToolSettingsLabel = new UiStateEntry<boolean>(AppUiSettings._settingNamespace, \"UseToolAsToolSettingsLabel\",\r\n      () => UiFramework.useToolAsToolSettingsLabel,\r\n      (value: boolean) => UiFramework.setUseToolAsToolSettingsLabel(value), defaults.useToolAsToolSettingsLabel);\r\n    this._settings.push(this.useToolAsToolSettingsLabel);\r\n\r\n    this.toolbarOpacity = new UiStateEntry<number>(AppUiSettings._settingNamespace, \"ToolOpacity\",\r\n      () => UiFramework.getToolbarOpacity(), (value: number) => UiFramework.setToolbarOpacity(value), defaults.toolbarOpacity);\r\n    this._settings.push(this.toolbarOpacity);\r\n\r\n    SyncUiEventDispatcher.onSyncUiEvent.addListener(this.handleSyncUiEvent);\r\n  }\r\n\r\n  private handleSyncUiEvent = async (args: UiSyncEventArgs) => {\r\n    if (this._applyingLocalSettings)\r\n      return;\r\n\r\n    if (args.eventIds.has(\"configurableui:set_theme\")) {\r\n      await this.colorTheme.saveSetting(UiFramework.getUiStateStorage());\r\n      // always store as default theme in local storage to avoid flicker during startup if user is not yet logged-in\r\n      window.localStorage.setItem(\"uifw:defaultTheme\", UiFramework.getColorTheme());\r\n    }\r\n\r\n    if (args.eventIds.has(\"configurableui:set-drag-interaction\"))\r\n      await this.dragInteraction.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-show-widget-icon\"))\r\n      await this.showWidgetIcon.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-auto-collapse-unpinned-panels\"))\r\n      await this.autoCollapseUnpinnedPanels.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set_widget_opacity\"))\r\n      await this.widgetOpacity.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-animate-tool-settings\"))\r\n      await this.animateToolSettings.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-use-tool-as-tool-settings-label\"))\r\n      await this.useToolAsToolSettingsLabel.saveSetting(UiFramework.getUiStateStorage());\r\n\r\n    if (args.eventIds.has(\"configurableui:set-toolbar-opacity\"))\r\n      await this.toolbarOpacity.saveSetting(UiFramework.getUiStateStorage());\r\n  };\r\n\r\n  public async apply(storage: UiStateStorage): Promise<void> {\r\n    this._applyingLocalSettings = true;\r\n    for await (const setting of this._settings) {\r\n      await setting.getSettingAndApplyValue(storage);\r\n    }\r\n    this._applyingLocalSettings = false;\r\n  }\r\n\r\n  public async loadUserSettings(storage: UiStateStorage): Promise<void> {\r\n    await this.apply(storage);\r\n  }\r\n}\r\n"]}