@itwin/components-react 4.0.0-dev.1 → 4.0.0-dev.11

package/lib/cjs/components-react/editors/NumericInputEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumericInputEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/NumericInputEditor.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;;;;;;;;;;;;;;;;;;;;;;;AAEH,qCAAmC;AACnC,4DAAoC;AACpC,6CAA+B;AAC/B,0DAG+B;AAC/B,kDAAgD;AAEhD,mEAAoF;AAgBpF;;GAEG;AACH,MAAa,kBAAmB,SAAQ,KAAK,CAAC,aAA2D;IAAzG;;QACU,eAAU,GAAG,KAAK,CAAC;QACnB,kBAAa,GAAsC,KAAK,CAAC,SAAS,EAAE,CAAC;QACtE,aAAQ,GAAG,KAAK,CAAC,CAAC,gDAAgD;QAEzE,gBAAgB;QACS,UAAK,GAAsC;YAClE,KAAK,EAAE,CAAC;YACR,QAAQ,EAAE,KAAK;SAChB,CAAC;QAsBM,kBAAa,GAAG,KAAK,IAAmB,EAAE;YAChD,uBAAuB;YACvB,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;gBACpD,MAAM,aAAa,GAAG,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACpD,uBAAuB;gBACvB,IAAI,aAAa,KAAK,SAAS,EAAE;oBAC/B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,QAAQ,EAAE,aAAa,EAAE,CAAC,CAAC;iBAC7F;aACF;QACH,CAAC,CAAC;QAEM,iBAAY,GAAG,CAAC,KAAyB,EAAE,YAAoB,EAAQ,EAAE;YAC/E,MAAM,QAAQ,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC;YAE5E,uBAAuB;YACvB,IAAI,IAAI,CAAC,UAAU;gBACjB,IAAI,CAAC,QAAQ,CAAC;oBACZ,KAAK,EAAE,QAAQ;iBAChB,EAAE,KAAK,IAAI,EAAE;oBACZ,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC;gBAC7B,CAAC,CAAC,CAAC;QACP,CAAC,CAAC;IA2FJ,CAAC;IApIQ,KAAK,CAAC,gBAAgB;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;QACzC,IAAI,aAAwC,CAAC;QAE7C,uBAAuB;QACvB,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,KAAK,oCAAmB,CAAC,SAAS,EAAE;YACxE,aAAa,GAAG;gBACd,WAAW,EAAE,oCAAmB,CAAC,SAAS;gBAC1C,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;gBACvB,YAAY,EAAE,EAAE;aACjB,CAAC;SACH;QAED,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC;IACpC,CAAC;IAyBD,gBAAgB;IACA,iBAAiB;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;IAC1F,CAAC;IAED,gBAAgB;IACA,oBAAoB;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA8B;QAC/D,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,KAAK,SAAS,CAAC,cAAc,EAAE;YAC1D,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;SACzF;IACH,CAAC;IAEO,KAAK,CAAC,iBAAiB;QAC7B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;QACzC,IAAI,YAAY,GAAG,CAAC,CAAC;QAErB,uBAAuB;QACvB,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,KAAK,oCAAmB,CAAC,SAAS,EAAE;YACxE,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,KAAe,CAAC;SAC7C;QAED,MAAM,QAAQ,GAAG,MAAM,IAAI,SAAS,KAAK,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC;QACvF,IAAI,IAAwB,CAAC;QAC7B,IAAI,SAA6B,CAAC;QAClC,IAAI,GAAuB,CAAC;QAC5B,IAAI,GAAuB,CAAC;QAC5B,IAAI,IAAwB,CAAC;QAC7B,IAAI,SAA6B,CAAC;QAElC,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;QAE1D,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE;YACxF,MAAM,gBAAgB,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAA2B,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,yCAAwB,CAAC,eAAe,CAA0B,CAAC;YAC/K,IAAI,gBAAgB,EAAE;gBACpB,uBAAuB;gBACvB,IAAI,gBAAgB,CAAC,IAAI;oBACvB,IAAI,GAAG,gBAAgB,CAAC,IAAI,CAAC;gBAC/B,uBAAuB;gBACvB,IAAI,gBAAgB,CAAC,SAAS;oBAC5B,SAAS,GAAG,gBAAgB,CAAC,SAAS,CAAC;aAC1C;YAED,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAA2B,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,yCAAwB,CAAC,KAAK,CAAsB,CAAC;YAC5J,IAAI,WAAW,EAAE;gBACf,GAAG,GAAG,WAAW,CAAC,OAAO,CAAC;gBAC1B,GAAG,GAAG,WAAW,CAAC,OAAO,CAAC;gBAC1B,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC;gBACxB,SAAS,GAAG,WAAW,CAAC,SAAS,CAAC;aACnC;SACF;QAED,uBAAuB;QACvB,IAAI,IAAI,CAAC,UAAU;YACjB,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC;IAC7G,CAAC;IAED,gBAAgB;IACA,MAAM;QACpB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAAC,wBAAwB,EAAE,iCAAiC,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QAChH,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;QACtD,MAAM,KAAK,GAAwB;YACjC,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK;YACnB,QAAQ,EAAE,GAAG,OAAO,GAAG,IAAI,IAAI;SAChC,CAAC;QAEF,OAAO,CACL,oBAAC,wBAAW,IACV,GAAG,EAAE,IAAI,CAAC,aAAa,EACvB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,EACnB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAC/B,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EACzB,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GACvD,CACH,CAAC;IACJ,CAAC;CACF;AA/ID,gDA+IC;AAED;;;GAGG;AACH,MAAa,0BAA2B,SAAQ,0CAAkB;IAChE,IAAW,SAAS;QAClB,OAAO,oBAAC,kBAAkB,OAAG,CAAC;IAChC,CAAC;IACD,uBAAuB;IACvB,IAAoB,qBAAqB;QACvC,OAAO,KAAK,CAAC;IACf,CAAC;CACF;AARD,gEAQC;AAED,6CAAqB,CAAC,cAAc,CAAC,kCAAiB,CAAC,MAAM,EAAE,0BAA0B,EAAE,oCAAmB,CAAC,YAAY,CAAC,CAAC;AAC7H,6CAAqB,CAAC,cAAc,CAAC,kCAAiB,CAAC,GAAG,EAAE,0BAA0B,EAAE,oCAAmB,CAAC,YAAY,CAAC,CAAC;AAC1H,6CAAqB,CAAC,cAAc,CAAC,kCAAiB,CAAC,KAAK,EAAE,0BAA0B,EAAE,oCAAmB,CAAC,YAAY,CAAC,CAAC;AAC5H,6CAAqB,CAAC,cAAc,CAAC,kCAAiB,CAAC,MAAM,EAAE,0BAA0B,EAAE,oCAAmB,CAAC,YAAY,CAAC,CAAC","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 PropertyEditors\r\n */\r\n\r\nimport \"./NumericInputEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  InputEditorSizeParams, PropertyEditorParams, PropertyEditorParamTypes, PropertyValue, PropertyValueFormat, RangeEditorParams,\r\n  StandardEditorNames, StandardTypeNames,\r\n} from \"@itwin/appui-abstract\";\r\nimport { NumberInput } from \"@itwin/core-react\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\r\n\r\n/** @internal */\r\ninterface NumericInputEditorState {\r\n  value: number;\r\n  readonly: boolean;\r\n  isDisabled?: boolean;\r\n  size?: number;\r\n  maxLength?: number;\r\n\r\n  min?: number;\r\n  max?: number;\r\n  step?: number;\r\n  precision?: number;\r\n}\r\n\r\n/** NumericInputEditor React component that is a property editor with numeric input & up/down buttons\r\n * @public\r\n */\r\nexport class NumericInputEditor extends React.PureComponent<PropertyEditorProps, NumericInputEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _inputElement: React.RefObject<HTMLInputElement> = React.createRef();\r\n  public hasFocus = false; // hot used since containerHandlesEnter is false\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<NumericInputEditorState> = {\r\n    value: 0,\r\n    readonly: false,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = {\r\n        valueFormat: PropertyValueFormat.Primitive,\r\n        value: this.state.value,\r\n        displayValue: \"\",\r\n      };\r\n    }\r\n\r\n    return propertyValue;\r\n  }\r\n\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._inputElement.current;\r\n  }\r\n\r\n  private _handleCommit = async (): Promise<void> => {\r\n    // istanbul ignore else\r\n    if (this.props.propertyRecord && this.props.onCommit) {\r\n      const propertyValue = await this.getPropertyValue();\r\n      // istanbul ignore else\r\n      if (propertyValue !== undefined) {\r\n        this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\r\n      }\r\n    }\r\n  };\r\n\r\n  private _updateValue = (value: number | undefined, _stringValue: string): void => {\r\n    const newValue = value !== undefined ? value : /* istanbul ignore next */ 0;\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        value: newValue,\r\n      }, async () => {\r\n        await this._handleCommit();\r\n      });\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const record = this.props.propertyRecord;\r\n    let initialValue = 0;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      initialValue = record.value.value as number;\r\n    }\r\n\r\n    const readonly = record && undefined !== record.isReadonly ? record.isReadonly : false;\r\n    let size: number | undefined;\r\n    let maxLength: number | undefined;\r\n    let min: number | undefined;\r\n    let max: number | undefined;\r\n    let step: number | undefined;\r\n    let precision: number | undefined;\r\n\r\n    const isDisabled = record ? record.isDisabled : undefined;\r\n\r\n    if (record && record.property && record.property.editor && record.property.editor.params) {\r\n      const editorSizeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.InputEditorSize) as InputEditorSizeParams;\r\n      if (editorSizeParams) {\r\n        // istanbul ignore else\r\n        if (editorSizeParams.size)\r\n          size = editorSizeParams.size;\r\n        // istanbul ignore else\r\n        if (editorSizeParams.maxLength)\r\n          maxLength = editorSizeParams.maxLength;\r\n      }\r\n\r\n      const rangeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.Range) as RangeEditorParams;\r\n      if (rangeParams) {\r\n        min = rangeParams.minimum;\r\n        max = rangeParams.maximum;\r\n        step = rangeParams.step;\r\n        precision = rangeParams.precision;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ value: initialValue, readonly, size, maxLength, isDisabled, min, max, step, precision });\r\n  }\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\"components-cell-editor\", \"components-numeric-input-editor\", this.props.className);\r\n    const minSize = this.state.size ? this.state.size : 8;\r\n    const style: React.CSSProperties = {\r\n      ...this.props.style,\r\n      minWidth: `${minSize * 0.75}em`,\r\n    };\r\n\r\n    return (\r\n      <NumberInput\r\n        ref={this._inputElement}\r\n        className={className}\r\n        style={style}\r\n        value={this.state.value}\r\n        min={this.state.min}\r\n        max={this.state.max}\r\n        step={this.state.step}\r\n        precision={this.state.precision}\r\n        readOnly={this.state.readonly}\r\n        maxLength={this.state.maxLength}\r\n        onBlur={this.props.onBlur}\r\n        onChange={this._updateValue}\r\n        setFocus={this.props.setFocus && !this.state.isDisabled}\r\n      />\r\n    );\r\n  }\r\n}\r\n\r\n/** Numeric Input Property Editor registered for the \"number\" type name and \"numeric-input\" editor name.\r\n * It uses the [[NumericInputEditor]] React component.\r\n * @public\r\n */\r\nexport class NumericInputPropertyEditor extends PropertyEditorBase {\r\n  public get reactNode(): React.ReactNode {\r\n    return <NumericInputEditor />;\r\n  }\r\n  // istanbul ignore next\r\n  public override get containerHandlesEnter(): boolean { // let input editor process enter key\r\n    return false;\r\n  }\r\n}\r\n\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Number, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Int, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Float, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Double, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\n"]}
+{"version":3,"file":"NumericInputEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/NumericInputEditor.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 PropertyEditors\r\n */\r\n\r\nimport \"./NumericInputEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  InputEditorSizeParams, PropertyEditorParams, PropertyEditorParamTypes, PropertyValue, PropertyValueFormat, RangeEditorParams,\r\n  StandardEditorNames, StandardTypeNames,\r\n} from \"@itwin/appui-abstract\";\r\nimport { NumberInput } from \"@itwin/core-react\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\r\n\r\n/** @internal */\r\ninterface NumericInputEditorState {\r\n  value: number;\r\n  readonly: boolean;\r\n  isDisabled?: boolean;\r\n  size?: number;\r\n  maxLength?: number;\r\n\r\n  min?: number;\r\n  max?: number;\r\n  step?: number;\r\n  precision?: number;\r\n}\r\n\r\n/** NumericInputEditor React component that is a property editor with numeric input & up/down buttons\r\n * @public\r\n */\r\nexport class NumericInputEditor extends React.PureComponent<PropertyEditorProps, NumericInputEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _inputElement: React.RefObject<HTMLInputElement> = React.createRef();\r\n  public hasFocus = false; // hot used since containerHandlesEnter is false\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<NumericInputEditorState> = {\r\n    value: 0,\r\n    readonly: false,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = {\r\n        valueFormat: PropertyValueFormat.Primitive,\r\n        value: this.state.value,\r\n        displayValue: \"\",\r\n      };\r\n    }\r\n\r\n    return propertyValue;\r\n  }\r\n\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._inputElement.current;\r\n  }\r\n\r\n  private _handleCommit = async (): Promise<void> => {\r\n    // istanbul ignore else\r\n    if (this.props.propertyRecord && this.props.onCommit) {\r\n      const propertyValue = await this.getPropertyValue();\r\n      // istanbul ignore else\r\n      if (propertyValue !== undefined) {\r\n        this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\r\n      }\r\n    }\r\n  };\r\n\r\n  private _updateValue = (value: number | undefined, _stringValue: string): void => {\r\n    const newValue = value !== undefined ? value : /* istanbul ignore next */ 0;\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        value: newValue,\r\n      }, async () => {\r\n        await this._handleCommit();\r\n      });\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const record = this.props.propertyRecord;\r\n    let initialValue = 0;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      initialValue = record.value.value as number;\r\n    }\r\n\r\n    const readonly = record && undefined !== record.isReadonly ? record.isReadonly : false;\r\n    let size: number | undefined;\r\n    let maxLength: number | undefined;\r\n    let min: number | undefined;\r\n    let max: number | undefined;\r\n    let step: number | undefined;\r\n    let precision: number | undefined;\r\n\r\n    const isDisabled = record ? record.isDisabled : undefined;\r\n\r\n    if (record && record.property && record.property.editor && record.property.editor.params) {\r\n      const editorSizeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.InputEditorSize) as InputEditorSizeParams;\r\n      if (editorSizeParams) {\r\n        // istanbul ignore else\r\n        if (editorSizeParams.size)\r\n          size = editorSizeParams.size;\r\n        // istanbul ignore else\r\n        if (editorSizeParams.maxLength)\r\n          maxLength = editorSizeParams.maxLength;\r\n      }\r\n\r\n      const rangeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.Range) as RangeEditorParams;\r\n      if (rangeParams) {\r\n        min = rangeParams.minimum;\r\n        max = rangeParams.maximum;\r\n        step = rangeParams.step;\r\n        precision = rangeParams.precision;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ value: initialValue, readonly, size, maxLength, isDisabled, min, max, step, precision });\r\n  }\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\"components-cell-editor\", \"components-numeric-input-editor\", this.props.className);\r\n    const minSize = this.state.size ? this.state.size : 8;\r\n    const style: React.CSSProperties = {\r\n      ...this.props.style,\r\n      minWidth: `${minSize * 0.75}em`,\r\n    };\r\n\r\n    return (\r\n      <NumberInput\r\n        ref={this._inputElement}\r\n        className={className}\r\n        style={style}\r\n        value={this.state.value}\r\n        min={this.state.min}\r\n        max={this.state.max}\r\n        step={this.state.step}\r\n        precision={this.state.precision}\r\n        readOnly={this.state.readonly}\r\n        maxLength={this.state.maxLength}\r\n        onBlur={this.props.onBlur}\r\n        onChange={this._updateValue}\r\n        setFocus={this.props.setFocus && !this.state.isDisabled}\r\n        isControlled={this.props.shouldCommitOnChange}\r\n      />\r\n    );\r\n  }\r\n}\r\n\r\n/** Numeric Input Property Editor registered for the \"number\" type name and \"numeric-input\" editor name.\r\n * It uses the [[NumericInputEditor]] React component.\r\n * @public\r\n */\r\nexport class NumericInputPropertyEditor extends PropertyEditorBase {\r\n  public get reactNode(): React.ReactNode {\r\n    return <NumericInputEditor />;\r\n  }\r\n  // istanbul ignore next\r\n  public override get containerHandlesEnter(): boolean { // let input editor process enter key\r\n    return false;\r\n  }\r\n}\r\n\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Number, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Int, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Float, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Double, NumericInputPropertyEditor, StandardEditorNames.NumericInput);\r\n"]}

package/lib/cjs/components-react/editors/PopupButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupButton.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/PopupButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,cAAc,EAAE,WAAW,EAA4B,MAAM,mBAAmB,CAAC;AAG1F;;GAEG;AACH,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAEjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4BAA4B;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mCAAmC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,mDAAmD;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,wKAAwK;IACxK,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC;IAEpD,sDAAsD;IACtD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oFAAoF;IACpF,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,gBAAgB;AAChB,UAAU,gBAAgB;IACxB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,WAAY,SAAQ,KAAK,CAAC,aAAa,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;IACtF,OAAO,CAAC,UAAU,CAAqC;IAEvD,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,gBAAgB,CAAC,CAExD;IAEF,gBAAgB;IACA,iBAAiB;IAKjC,OAAO,CAAC,YAAY,CAIlB;IAEK,UAAU;IAIjB,OAAO,CAAC,WAAW,CAUjB;IAEF,OAAO,CAAC,cAAc,CAOpB;IAEF,gBAAgB;IACA,MAAM,IAAI,KAAK,CAAC,SAAS;CA6C1C;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,eAEjD;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CAC7C;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,aAAa,eAsBxD"}
+{"version":3,"file":"PopupButton.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/PopupButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,cAAc,EAAE,WAAW,EAA4B,MAAM,mBAAmB,CAAC;AAI1F;;GAEG;AACH,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAEjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4BAA4B;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mCAAmC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,mDAAmD;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,wKAAwK;IACxK,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC;IAEpD,sDAAsD;IACtD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oFAAoF;IACpF,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,gBAAgB;AAChB,UAAU,gBAAgB;IACxB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,WAAY,SAAQ,KAAK,CAAC,aAAa,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;IACtF,OAAO,CAAC,UAAU,CAAqC;IAEvD,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,gBAAgB,CAAC,CAExD;IAEF,gBAAgB;IACA,iBAAiB;IAKjC,OAAO,CAAC,YAAY,CAIlB;IAEK,UAAU;IAIjB,OAAO,CAAC,WAAW,CAUjB;IAEF,OAAO,CAAC,cAAc,CAOpB;IAEF,gBAAgB;IACA,MAAM,IAAI,KAAK,CAAC,SAAS;CA6C1C;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,eAEjD;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CAC7C;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,aAAa,eAsBxD"}

package/lib/cjs/components-react/editors/PopupButton.js

@@ -36,6 +36,7 @@ const React = __importStar(require("react"));
 const appui_abstract_1 = require("@itwin/appui-abstract");
 const core_react_1 = require("@itwin/core-react");
 const itwinui_react_1 = require("@itwin/itwinui-react");
+const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
 /** PopupButton React component that is a button and property editor popup host
  * @alpha
  */
@@ -88,7 +89,8 @@ class PopupButton extends React.PureComponent {
             React.createElement("div", { className: classNames, onClick: this._togglePopup, onKeyDown: this._handleKeyDown, "data-testid": "components-popup-button", tabIndex: 0, ref: this._buttonRef, title: this.props.title, role: "button" },
                 React.createElement("div", { className: valueClassNames }, this.props.label || this.props.placeholder),
                 React.createElement("div", { className: "components-popup-button-arrow" },
-                    React.createElement("div", { className: (0, classnames_1.default)("components-popup-button-arrow-icon", "icon", "icon-chevron-down") }))),
+                    React.createElement("div", { className: (0, classnames_1.default)("components-popup-button-arrow-icon", "icon") },
+                        React.createElement(core_react_1.Icon, { iconSpec: React.createElement(itwinui_icons_react_1.SvgChevronDown, null) })))),
             React.createElement(core_react_1.Popup, { className: "components-popup-button-popup", isOpen: this.state.showPopup, position: appui_abstract_1.RelativePosition.Bottom, onClose: this._closePopup, onEnter: this.props.onEnter, closeOnEnter: this.props.closeOnEnter, target: this._buttonRef.current, showArrow: showArrow, showShadow: showShadow, moveFocus: moveFocus, focusTarget: this.props.focusTarget }, this.props.children)));
     }
 }
@@ -106,9 +108,9 @@ exports.PopupContent = PopupContent;
 function PopupOkCancelButtons(props) {
     return (React.createElement("div", { className: "components-popup-bottom-buttons" },
         React.createElement(itwinui_react_1.Button, { className: (0, classnames_1.default)("components-popup-large-button", "components-popup-ok-button"), "data-testid": "components-popup-ok-button", styleType: "cta", title: core_react_1.UiCore.translate("dialog.ok"), onClick: props.onOk },
-            React.createElement(core_react_1.Icon, { iconSpec: "icon-checkmark" })),
+            React.createElement(core_react_1.Icon, { iconSpec: React.createElement(itwinui_icons_react_1.SvgCheckmark, null) })),
         React.createElement(itwinui_react_1.Button, { className: (0, classnames_1.default)("components-popup-large-button", "components-popup-cancel-button"), "data-testid": "components-popup-cancel-button", title: core_react_1.UiCore.translate("dialog.cancel"), onClick: props.onCancel },
-            React.createElement(core_react_1.Icon, { iconSpec: "icon-remove" }))));
+            React.createElement(core_react_1.Icon, { iconSpec: React.createElement(itwinui_icons_react_1.SvgRemove, null) }))));
 }
 exports.PopupOkCancelButtons = PopupOkCancelButtons;
 //# sourceMappingURL=PopupButton.js.map

package/lib/cjs/components-react/editors/PopupButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"PopupButton.js","sourceRoot":"","sources":["../../../../src/components-react/editors/PopupButton.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 PropertyEditors\r\n */\r\n\r\nimport \"./PopupButton.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { RelativePosition, SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { CommonDivProps, CommonProps, Div, Icon, Popup, UiCore } from \"@itwin/core-react\";\r\nimport { Button } from \"@itwin/itwinui-react\";\r\n\r\n/** Properties for [[PopupButton]] component\r\n * @alpha\r\n */\r\nexport interface PopupButtonProps extends CommonProps {\r\n  /** Label to display in click area. */\r\n  label?: string | React.ReactNode;\r\n  /* Placeholder text used when there is no label yet */\r\n  placeholder?: string;\r\n  /** Contents of the popup */\r\n  children: React.ReactNode;\r\n  /** Title to display as tooltip. */\r\n  title?: string;\r\n\r\n  /** Set focus to popup - default is to set focus */\r\n  moveFocus?: boolean;\r\n  /** Element to receive focus, specified by React.RefObject or CSS selector string. If undefined and moveFocus is true then focus is moved to first focusable element. */\r\n  focusTarget?: React.RefObject<HTMLElement> | string;\r\n\r\n  /** Show or hide the box shadow (defaults to false) */\r\n  showShadow?: boolean;\r\n  /** Show or hide the arrow (defaults to false) */\r\n  showArrow?: boolean;\r\n  /** Indicates whether to set focus to the input element */\r\n  setFocus?: boolean;\r\n  /** Indicates whether to close the popup when Enter is pressed (defaults to true) */\r\n  closeOnEnter?: boolean;\r\n\r\n  /** Listens for click events on button area */\r\n  onClick?: (event: React.MouseEvent) => void;\r\n  /** Listens for popup close events */\r\n  onClose?: () => void;\r\n  /** Listens for Enter key in popup */\r\n  onEnter?: () => void;\r\n}\r\n\r\n/** @internal */\r\ninterface PopupButtonState {\r\n  showPopup: boolean;\r\n}\r\n\r\n/** PopupButton React component that is a button and property editor popup host\r\n * @alpha\r\n */\r\nexport class PopupButton extends React.PureComponent<PopupButtonProps, PopupButtonState> {\r\n  private _buttonRef = React.createRef<HTMLDivElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<PopupButtonState> = {\r\n    showPopup: false,\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    if (this.props.setFocus && this._buttonRef.current)\r\n      this._buttonRef.current.focus();\r\n  }\r\n\r\n  private _togglePopup = (event: React.MouseEvent) => {\r\n    this.setState(\r\n      (prevState) => ({ showPopup: !prevState.showPopup }),\r\n      () => this.props.onClick && this.props.onClick(event));\r\n  };\r\n\r\n  public closePopup() {\r\n    this._closePopup();\r\n  }\r\n\r\n  private _closePopup = () => {\r\n    this.setState(\r\n      { showPopup: false },\r\n      () => {\r\n        this.props.onClose && this.props.onClose();\r\n\r\n        // istanbul ignore else\r\n        if (this._buttonRef.current)\r\n          this._buttonRef.current.focus();\r\n      });\r\n  };\r\n\r\n  private _handleKeyDown = (event: React.KeyboardEvent) => {\r\n    // istanbul ignore else\r\n    if ((event.key === SpecialKey.ArrowDown || event.key === SpecialKey.Space || event.key === SpecialKey.Enter) && !this.state.showPopup) {\r\n      event.preventDefault();\r\n      event.stopPropagation();\r\n      this.setState({ showPopup: true });\r\n    }\r\n  };\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const showArrow = this.props.showArrow ?? false;\r\n    const showShadow = this.props.showShadow ?? false;\r\n    const moveFocus = this.props.moveFocus ?? true;\r\n    const showPlaceholder = this.props.label === undefined && this.props.placeholder !== undefined;\r\n\r\n    const classNames = classnames(\r\n      \"components-popup-button\",\r\n      this.state.showPopup && \"components-popup-expanded\",\r\n    );\r\n\r\n    const valueClassNames = classnames(\r\n      \"components-popup-button-value\",\r\n      showPlaceholder && \"components-popup-button-placeholder\",\r\n    );\r\n\r\n    return (\r\n      <div className={this.props.className}>\r\n        <div className={classNames}\r\n          onClick={this._togglePopup}\r\n          onKeyDown={this._handleKeyDown}\r\n          data-testid=\"components-popup-button\"\r\n          tabIndex={0}\r\n          ref={this._buttonRef}\r\n          title={this.props.title}\r\n          role=\"button\"\r\n        >\r\n          <div className={valueClassNames}>\r\n            {this.props.label || this.props.placeholder}\r\n          </div>\r\n          <div className={\"components-popup-button-arrow\"}>\r\n            <div className={classnames(\"components-popup-button-arrow-icon\", \"icon\", \"icon-chevron-down\")} />\r\n          </div>\r\n        </div>\r\n        <Popup className=\"components-popup-button-popup\" isOpen={this.state.showPopup} position={RelativePosition.Bottom}\r\n          onClose={this._closePopup} onEnter={this.props.onEnter} closeOnEnter={this.props.closeOnEnter} target={this._buttonRef.current}\r\n          showArrow={showArrow} showShadow={showShadow}\r\n          moveFocus={moveFocus} focusTarget={this.props.focusTarget}\r\n        >\r\n          {this.props.children}\r\n        </Popup>\r\n      </div>\r\n\r\n    );\r\n  }\r\n}\r\n\r\n/** Popup content with padding\r\n * @alpha\r\n */\r\nexport function PopupContent(props: CommonDivProps) {\r\n  return <Div {...props} mainClassName=\"components-editor-popup-content\" />;\r\n}\r\n\r\n/** Properties for [[PopupOkCancelButtons]] component\r\n * @alpha\r\n */\r\nexport interface OkCancelProps {\r\n  onOk: (event: React.MouseEvent) => void;\r\n  onCancel: (event: React.MouseEvent) => void;\r\n}\r\n\r\n/** OK/Cancel Buttons\r\n * @alpha\r\n */\r\nexport function PopupOkCancelButtons(props: OkCancelProps) {\r\n  return (\r\n    <div className=\"components-popup-bottom-buttons\">\r\n      <Button\r\n        className={classnames(\"components-popup-large-button\", \"components-popup-ok-button\")}\r\n        data-testid=\"components-popup-ok-button\"\r\n        styleType=\"cta\"\r\n        title={UiCore.translate(\"dialog.ok\")}\r\n        onClick={props.onOk}\r\n      >\r\n        <Icon iconSpec=\"icon-checkmark\" />\r\n      </Button>\r\n      <Button\r\n        className={classnames(\"components-popup-large-button\", \"components-popup-cancel-button\")}\r\n        data-testid=\"components-popup-cancel-button\"\r\n        title={UiCore.translate(\"dialog.cancel\")}\r\n        onClick={props.onCancel}\r\n      >\r\n        <Icon iconSpec=\"icon-remove\" />\r\n      </Button>\r\n    </div>\r\n  );\r\n}\r\n"]}
+{"version":3,"file":"PopupButton.js","sourceRoot":"","sources":["../../../../src/components-react/editors/PopupButton.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 PropertyEditors\r\n */\r\n\r\nimport \"./PopupButton.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { RelativePosition, SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { CommonDivProps, CommonProps, Div, Icon, Popup, UiCore } from \"@itwin/core-react\";\r\nimport { Button } from \"@itwin/itwinui-react\";\r\nimport { SvgCheckmark, SvgChevronDown, SvgRemove } from \"@itwin/itwinui-icons-react\";\r\n\r\n/** Properties for [[PopupButton]] component\r\n * @alpha\r\n */\r\nexport interface PopupButtonProps extends CommonProps {\r\n  /** Label to display in click area. */\r\n  label?: string | React.ReactNode;\r\n  /* Placeholder text used when there is no label yet */\r\n  placeholder?: string;\r\n  /** Contents of the popup */\r\n  children: React.ReactNode;\r\n  /** Title to display as tooltip. */\r\n  title?: string;\r\n\r\n  /** Set focus to popup - default is to set focus */\r\n  moveFocus?: boolean;\r\n  /** Element to receive focus, specified by React.RefObject or CSS selector string. If undefined and moveFocus is true then focus is moved to first focusable element. */\r\n  focusTarget?: React.RefObject<HTMLElement> | string;\r\n\r\n  /** Show or hide the box shadow (defaults to false) */\r\n  showShadow?: boolean;\r\n  /** Show or hide the arrow (defaults to false) */\r\n  showArrow?: boolean;\r\n  /** Indicates whether to set focus to the input element */\r\n  setFocus?: boolean;\r\n  /** Indicates whether to close the popup when Enter is pressed (defaults to true) */\r\n  closeOnEnter?: boolean;\r\n\r\n  /** Listens for click events on button area */\r\n  onClick?: (event: React.MouseEvent) => void;\r\n  /** Listens for popup close events */\r\n  onClose?: () => void;\r\n  /** Listens for Enter key in popup */\r\n  onEnter?: () => void;\r\n}\r\n\r\n/** @internal */\r\ninterface PopupButtonState {\r\n  showPopup: boolean;\r\n}\r\n\r\n/** PopupButton React component that is a button and property editor popup host\r\n * @alpha\r\n */\r\nexport class PopupButton extends React.PureComponent<PopupButtonProps, PopupButtonState> {\r\n  private _buttonRef = React.createRef<HTMLDivElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<PopupButtonState> = {\r\n    showPopup: false,\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    if (this.props.setFocus && this._buttonRef.current)\r\n      this._buttonRef.current.focus();\r\n  }\r\n\r\n  private _togglePopup = (event: React.MouseEvent) => {\r\n    this.setState(\r\n      (prevState) => ({ showPopup: !prevState.showPopup }),\r\n      () => this.props.onClick && this.props.onClick(event));\r\n  };\r\n\r\n  public closePopup() {\r\n    this._closePopup();\r\n  }\r\n\r\n  private _closePopup = () => {\r\n    this.setState(\r\n      { showPopup: false },\r\n      () => {\r\n        this.props.onClose && this.props.onClose();\r\n\r\n        // istanbul ignore else\r\n        if (this._buttonRef.current)\r\n          this._buttonRef.current.focus();\r\n      });\r\n  };\r\n\r\n  private _handleKeyDown = (event: React.KeyboardEvent) => {\r\n    // istanbul ignore else\r\n    if ((event.key === SpecialKey.ArrowDown || event.key === SpecialKey.Space || event.key === SpecialKey.Enter) && !this.state.showPopup) {\r\n      event.preventDefault();\r\n      event.stopPropagation();\r\n      this.setState({ showPopup: true });\r\n    }\r\n  };\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const showArrow = this.props.showArrow ?? false;\r\n    const showShadow = this.props.showShadow ?? false;\r\n    const moveFocus = this.props.moveFocus ?? true;\r\n    const showPlaceholder = this.props.label === undefined && this.props.placeholder !== undefined;\r\n\r\n    const classNames = classnames(\r\n      \"components-popup-button\",\r\n      this.state.showPopup && \"components-popup-expanded\",\r\n    );\r\n\r\n    const valueClassNames = classnames(\r\n      \"components-popup-button-value\",\r\n      showPlaceholder && \"components-popup-button-placeholder\",\r\n    );\r\n\r\n    return (\r\n      <div className={this.props.className}>\r\n        <div className={classNames}\r\n          onClick={this._togglePopup}\r\n          onKeyDown={this._handleKeyDown}\r\n          data-testid=\"components-popup-button\"\r\n          tabIndex={0}\r\n          ref={this._buttonRef}\r\n          title={this.props.title}\r\n          role=\"button\"\r\n        >\r\n          <div className={valueClassNames}>\r\n            {this.props.label || this.props.placeholder}\r\n          </div>\r\n          <div className={\"components-popup-button-arrow\"}>\r\n            <div className={classnames(\"components-popup-button-arrow-icon\", \"icon\")}><Icon iconSpec={<SvgChevronDown />} /></div>\r\n          </div>\r\n        </div>\r\n        <Popup className=\"components-popup-button-popup\" isOpen={this.state.showPopup} position={RelativePosition.Bottom}\r\n          onClose={this._closePopup} onEnter={this.props.onEnter} closeOnEnter={this.props.closeOnEnter} target={this._buttonRef.current}\r\n          showArrow={showArrow} showShadow={showShadow}\r\n          moveFocus={moveFocus} focusTarget={this.props.focusTarget}\r\n        >\r\n          {this.props.children}\r\n        </Popup>\r\n      </div>\r\n\r\n    );\r\n  }\r\n}\r\n\r\n/** Popup content with padding\r\n * @alpha\r\n */\r\nexport function PopupContent(props: CommonDivProps) {\r\n  return <Div {...props} mainClassName=\"components-editor-popup-content\" />;\r\n}\r\n\r\n/** Properties for [[PopupOkCancelButtons]] component\r\n * @alpha\r\n */\r\nexport interface OkCancelProps {\r\n  onOk: (event: React.MouseEvent) => void;\r\n  onCancel: (event: React.MouseEvent) => void;\r\n}\r\n\r\n/** OK/Cancel Buttons\r\n * @alpha\r\n */\r\nexport function PopupOkCancelButtons(props: OkCancelProps) {\r\n  return (\r\n    <div className=\"components-popup-bottom-buttons\">\r\n      <Button\r\n        className={classnames(\"components-popup-large-button\", \"components-popup-ok-button\")}\r\n        data-testid=\"components-popup-ok-button\"\r\n        styleType=\"cta\"\r\n        title={UiCore.translate(\"dialog.ok\")}\r\n        onClick={props.onOk}\r\n      >\r\n        <Icon iconSpec={<SvgCheckmark />} />\r\n      </Button>\r\n      <Button\r\n        className={classnames(\"components-popup-large-button\", \"components-popup-cancel-button\")}\r\n        data-testid=\"components-popup-cancel-button\"\r\n        title={UiCore.translate(\"dialog.cancel\")}\r\n        onClick={props.onCancel}\r\n      >\r\n        <Icon iconSpec={<SvgRemove />} />\r\n      </Button>\r\n    </div>\r\n  );\r\n}\r\n"]}

package/lib/cjs/components-react/editors/PopupButton.scss

@@ -7,7 +7,6 @@
 @import "~@itwin/core-react/lib/cjs/core-react/style/baseline";
 @import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
 @import "~@itwin/core-react/lib/cjs/core-react/style/variables";
-@import "~@itwin/itwinui-css/scss/style/variables";
 
 .components-popup-button {
   min-width: 100%;
@@ -16,8 +15,8 @@
   margin: 0;
   padding: 0;
   background-color: $buic-background-control;
-  border: 1px solid $buic-inputs-border;
-  border-radius: $iui-border-radius;
+  border: 1px solid var(--iui-color-border-foreground);
+  border-radius: var(--iui-border-radius-1);
   box-shadow: $buic-inputs-boxshadow 0px 1px 1px inset;
   box-sizing: border-box;
   cursor: pointer;
@@ -28,32 +27,32 @@
 
   font-weight: normal;
 
-  >.components-popup-button-value {
+  > .components-popup-button-value {
     flex-grow: 1;
-    max-width: calc(100% - #{$uicore-line-height});
+    max-width: calc(100% - var(--iui-size-l));
     overflow-x: hidden;
     padding: 0 3px;
 
     &.components-popup-button-placeholder {
-      color: $buic-foreground-disabled;
+      color: var(--iui-color-text-disabled);
     }
   }
 
-  >.components-popup-button-arrow {
+  > .components-popup-button-arrow {
     background-color: $buic-background-control;
-    width: $uicore-line-height;
-    height: $uicore-line-height;
+    width: var(--iui-size-l);
+    height: var(--iui-size-l);
 
-    >.components-popup-button-arrow-icon {
-      transition: transform .2s;
+    > .components-popup-button-arrow-icon {
+      transition: transform 0.2s;
 
       &:hover {
-        color: $buic-foreground-primary;
+        color: var(--iui-color-text-accent);
       }
 
       text-align: center;
-      font-size: $uicore-icons-x-small;
-      line-height: $uicore-line-height;
+      font-size: var(--iui-font-size-0);
+      line-height: var(--iui-size-l);
     }
   }
 
@@ -63,17 +62,16 @@
     outline: 0px;
     box-shadow: $uicore-inputs-focus-boxshadow;
 
-    >.components-popup-button-arrow {
+    > .components-popup-button-arrow {
       border: none;
       box-shadow: none;
       outline: 0px;
 
-      >.components-popup-button-arrow-icon {
-        color: $buic-foreground-primary;
+      > .components-popup-button-arrow-icon {
+        color: var(--iui-color-text-accent);
       }
     }
   }
-
 }
 
 .components-smallEditor-host {
@@ -83,7 +81,7 @@
 }
 
 .components-popup-button-popup {
-  background-color: $buic-background-dialog;
+  background-color: var(--iui-color-background);
 }
 
 .components-editor-popup-content {
@@ -95,26 +93,24 @@
   justify-content: flex-end;
   margin-top: 4px;
 
-  >.components-popup-large-button {
+  > .components-popup-large-button {
     width: 70px;
     font-size: 20px;
     margin-left: 6px;
   }
 
-  >.components-popup-cancel-button {
-
+  > .components-popup-cancel-button {
     &,
     &:active,
     &:focus {
       border: none;
-      background-color: $uicore-gray;
-      color: $uicore-white;
+      background-color: var(--iui-color-background-negative);
+      color: var(--iui-color-white);
     }
 
     &:hover {
-      background-color: $uicore-gray-5;
-      color: $uicore-white;
+      background-color: var(--iui-color-background-negative-hover);
+      color: var(--iui-color-white);
     }
-
   }
-}
+}

package/lib/cjs/components-react/editors/TextEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextEditor.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/TextEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACoG,aAAa,EACvH,MAAM,uBAAuB,CAAC;AAI/B,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGpE,gBAAgB;AAChB,UAAU,eAAe;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,eAAe,CAAE,YAAW,UAAU;IAC7G,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,UAAU,CAAyC;IAC3D,OAAO,CAAC,aAAa,CAAuC;IAE5D,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,eAAe,CAAC,CAGvD;IAEW,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAanE,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAE7B;IAED,OAAO,CAAC,iBAAiB,CAMvB;IAEF,gBAAgB;IACA,iBAAiB;IAKjC,gBAAgB;IACA,oBAAoB;IAIpC,gBAAgB;IACA,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;YAMnD,iBAAiB;IAuC/B,gBAAgB;IACA,MAAM,IAAI,KAAK,CAAC,SAAS;CA6C1C"}
+{"version":3,"file":"TextEditor.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/TextEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACoG,aAAa,EACvH,MAAM,uBAAuB,CAAC;AAI/B,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGpE,gBAAgB;AAChB,UAAU,eAAe;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,eAAe,CAAE,YAAW,UAAU;IAC7G,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,UAAU,CAAyC;IAC3D,OAAO,CAAC,aAAa,CAAuC;IAE5D,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,eAAe,CAAC,CAGvD;IAEW,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAanE,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAE7B;IAED,OAAO,CAAC,iBAAiB,CAavB;IAEF,gBAAgB;IACA,iBAAiB;IAKjC,gBAAgB;IACA,oBAAoB;IAIpC,gBAAgB;IACA,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;YAMnD,iBAAiB;IAuC/B,gBAAgB;IACA,MAAM,IAAI,KAAK,CAAC,SAAS;CA6C1C"}

package/lib/cjs/components-react/editors/TextEditor.js

@@ -57,6 +57,13 @@ class TextEditor extends React.PureComponent {
             if (this._isMounted)
                 this.setState({
                     inputValue: e.target.value,
+                }, async () => {
+                    if (this.props.shouldCommitOnChange && this.props.onCommit && this.props.propertyRecord) {
+                        const newValue = await this.getPropertyValue();
+                        // istanbul ignore else
+                        if (newValue)
+                            this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue });
+                    }
                 });
         };
     }

package/lib/cjs/components-react/editors/TextEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/TextEditor.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 PropertyEditors\r\n */\r\n\r\nimport \"./TextEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  IconEditorParams, InputEditorSizeParams, PrimitiveValue, PropertyEditorParams, PropertyEditorParamTypes, PropertyValue, PropertyValueFormat,\r\n} from \"@itwin/appui-abstract\";\r\nimport { Icon, IconInput } from \"@itwin/core-react\";\r\nimport { Input, InputProps } from \"@itwin/itwinui-react\";\r\nimport { TypeConverterManager } from \"../converters/TypeConverterManager\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { UiComponents } from \"../UiComponents\";\r\n\r\n/** @internal */\r\ninterface TextEditorState {\r\n  inputValue: string;\r\n  readonly: boolean;\r\n  isDisabled?: boolean;\r\n  size?: number;\r\n  maxLength?: number;\r\n  iconSpec?: string;\r\n}\r\n\r\n/** TextEditor React component that is a property editor with text input\r\n * @public\r\n */\r\nexport class TextEditor extends React.PureComponent<PropertyEditorProps, TextEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _ariaLabel = UiComponents.translate(\"editor.text\");\r\n  private _inputElement = React.createRef<HTMLInputElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<TextEditorState> = {\r\n    inputValue: \"\",\r\n    readonly: false,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = await TypeConverterManager.getConverter(record.property.typename, record.property.converter?.name).convertFromStringToPropertyValue(this.state.inputValue, record);\r\n      (propertyValue as PrimitiveValue).displayValue = this.state.inputValue;\r\n    }\r\n\r\n    return propertyValue;\r\n  }\r\n\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._inputElement.current;\r\n  }\r\n\r\n  public get hasFocus(): boolean {\r\n    return document.activeElement === this._inputElement.current;\r\n  }\r\n\r\n  private _updateInputValue = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        inputValue: e.target.value,\r\n      });\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const record = this.props.propertyRecord;\r\n    let initialValue = \"\";\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      const value = record.value.value;\r\n      initialValue = await TypeConverterManager.getConverter(record.property.typename, record.property.converter?.name).convertPropertyToString(record.property, value);\r\n    }\r\n\r\n    const readonly = record && undefined !== record.isReadonly ? record.isReadonly : false;\r\n    let size: number | undefined;\r\n    let maxLength: number | undefined;\r\n    let iconSpec: string | undefined;\r\n\r\n    const isDisabled = record ? record.isDisabled : undefined;\r\n\r\n    if (record && record.property && record.property.editor && record.property.editor.params) {\r\n      const editorSizeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.InputEditorSize) as InputEditorSizeParams;\r\n      if (editorSizeParams) {\r\n        // istanbul ignore else\r\n        if (editorSizeParams.size)\r\n          size = editorSizeParams.size;\r\n        // istanbul ignore else\r\n        if (editorSizeParams.maxLength)\r\n          maxLength = editorSizeParams.maxLength;\r\n      }\r\n\r\n      const iconParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.Icon) as IconEditorParams;\r\n      if (iconParams) {\r\n        iconSpec = iconParams.definition.iconSpec;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ inputValue: initialValue, readonly, size, maxLength, isDisabled, iconSpec });\r\n  }\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\"components-cell-editor\", \"components-text-editor\", this.props.className);\r\n    const minSize = this.state.size ? this.state.size : 8;\r\n    const minWidthStyle: React.CSSProperties = {\r\n      minWidth: `${minSize * 0.75}em`,\r\n    };\r\n    const inputProps: InputProps = {\r\n      type: \"text\",\r\n      className,\r\n      style: this.props.style ? this.props.style : minWidthStyle,\r\n      readOnly: this.state.readonly,\r\n      disabled: this.state.isDisabled,\r\n      maxLength: this.state.maxLength,\r\n      value: this.state.inputValue,\r\n      onBlur: this.props.onBlur,\r\n      onChange: this._updateInputValue,\r\n      setFocus: this.props.setFocus && !this.state.isDisabled,\r\n    };\r\n\r\n    inputProps[\"aria-label\"] = this._ariaLabel;\r\n\r\n    let reactNode: React.ReactNode;\r\n    if (this.state.iconSpec) {\r\n      const icon = <Icon iconSpec={this.state.iconSpec} />;\r\n      reactNode = (\r\n        <IconInput\r\n          {...inputProps}\r\n          ref={this._inputElement}\r\n          icon={icon}\r\n          data-testid=\"components-text-editor\"\r\n        />\r\n      );\r\n    } else {\r\n      reactNode = (\r\n        <Input\r\n          {...inputProps}\r\n          ref={this._inputElement}\r\n          data-testid=\"components-text-editor\"\r\n          size=\"small\"\r\n        />\r\n      );\r\n    }\r\n\r\n    return reactNode;\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"TextEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/TextEditor.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 PropertyEditors\r\n */\r\n\r\nimport \"./TextEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  IconEditorParams, InputEditorSizeParams, PrimitiveValue, PropertyEditorParams, PropertyEditorParamTypes, PropertyValue, PropertyValueFormat,\r\n} from \"@itwin/appui-abstract\";\r\nimport { Icon, IconInput } from \"@itwin/core-react\";\r\nimport { Input, InputProps } from \"@itwin/itwinui-react\";\r\nimport { TypeConverterManager } from \"../converters/TypeConverterManager\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { UiComponents } from \"../UiComponents\";\r\n\r\n/** @internal */\r\ninterface TextEditorState {\r\n  inputValue: string;\r\n  readonly: boolean;\r\n  isDisabled?: boolean;\r\n  size?: number;\r\n  maxLength?: number;\r\n  iconSpec?: string;\r\n}\r\n\r\n/** TextEditor React component that is a property editor with text input\r\n * @public\r\n */\r\nexport class TextEditor extends React.PureComponent<PropertyEditorProps, TextEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _ariaLabel = UiComponents.translate(\"editor.text\");\r\n  private _inputElement = React.createRef<HTMLInputElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<TextEditorState> = {\r\n    inputValue: \"\",\r\n    readonly: false,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = await TypeConverterManager.getConverter(record.property.typename, record.property.converter?.name).convertFromStringToPropertyValue(this.state.inputValue, record);\r\n      (propertyValue as PrimitiveValue).displayValue = this.state.inputValue;\r\n    }\r\n\r\n    return propertyValue;\r\n  }\r\n\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._inputElement.current;\r\n  }\r\n\r\n  public get hasFocus(): boolean {\r\n    return document.activeElement === this._inputElement.current;\r\n  }\r\n\r\n  private _updateInputValue = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        inputValue: e.target.value,\r\n      }, async () => {\r\n        if (this.props.shouldCommitOnChange && this.props.onCommit && this.props.propertyRecord) {\r\n          const newValue = await this.getPropertyValue();\r\n          // istanbul ignore else\r\n          if (newValue)\r\n            this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue });\r\n        }\r\n      });\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const record = this.props.propertyRecord;\r\n    let initialValue = \"\";\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      const value = record.value.value;\r\n      initialValue = await TypeConverterManager.getConverter(record.property.typename, record.property.converter?.name).convertPropertyToString(record.property, value);\r\n    }\r\n\r\n    const readonly = record && undefined !== record.isReadonly ? record.isReadonly : false;\r\n    let size: number | undefined;\r\n    let maxLength: number | undefined;\r\n    let iconSpec: string | undefined;\r\n\r\n    const isDisabled = record ? record.isDisabled : undefined;\r\n\r\n    if (record && record.property && record.property.editor && record.property.editor.params) {\r\n      const editorSizeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.InputEditorSize) as InputEditorSizeParams;\r\n      if (editorSizeParams) {\r\n        // istanbul ignore else\r\n        if (editorSizeParams.size)\r\n          size = editorSizeParams.size;\r\n        // istanbul ignore else\r\n        if (editorSizeParams.maxLength)\r\n          maxLength = editorSizeParams.maxLength;\r\n      }\r\n\r\n      const iconParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.Icon) as IconEditorParams;\r\n      if (iconParams) {\r\n        iconSpec = iconParams.definition.iconSpec;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ inputValue: initialValue, readonly, size, maxLength, isDisabled, iconSpec });\r\n  }\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\"components-cell-editor\", \"components-text-editor\", this.props.className);\r\n    const minSize = this.state.size ? this.state.size : 8;\r\n    const minWidthStyle: React.CSSProperties = {\r\n      minWidth: `${minSize * 0.75}em`,\r\n    };\r\n    const inputProps: InputProps = {\r\n      type: \"text\",\r\n      className,\r\n      style: this.props.style ? this.props.style : minWidthStyle,\r\n      readOnly: this.state.readonly,\r\n      disabled: this.state.isDisabled,\r\n      maxLength: this.state.maxLength,\r\n      value: this.state.inputValue,\r\n      onBlur: this.props.onBlur,\r\n      onChange: this._updateInputValue,\r\n      setFocus: this.props.setFocus && !this.state.isDisabled,\r\n    };\r\n\r\n    inputProps[\"aria-label\"] = this._ariaLabel;\r\n\r\n    let reactNode: React.ReactNode;\r\n    if (this.state.iconSpec) {\r\n      const icon = <Icon iconSpec={this.state.iconSpec} />;\r\n      reactNode = (\r\n        <IconInput\r\n          {...inputProps}\r\n          ref={this._inputElement}\r\n          icon={icon}\r\n          data-testid=\"components-text-editor\"\r\n        />\r\n      );\r\n    } else {\r\n      reactNode = (\r\n        <Input\r\n          {...inputProps}\r\n          ref={this._inputElement}\r\n          data-testid=\"components-text-editor\"\r\n          size=\"small\"\r\n        />\r\n      );\r\n    }\r\n\r\n    return reactNode;\r\n  }\r\n}\r\n"]}

package/lib/cjs/components-react/editors/TextareaEditor.js

@@ -169,7 +169,7 @@ class TextareaEditor extends React.PureComponent {
         };
         textareaProps["aria-label"] = this._ariaLabel;
         return (React.createElement("div", { className: className, ref: this._divElement },
-            React.createElement(PopupButton_1.PopupButton, { label: this.state.inputValue, closeOnEnter: false, setFocus: this.props.setFocus, focusTarget: ".uicore-inputs-textarea" },
+            React.createElement(PopupButton_1.PopupButton, { label: this.state.inputValue, closeOnEnter: false, setFocus: this.props.setFocus, focusTarget: ".iui-input" },
                 React.createElement(PopupButton_1.PopupContent, null,
                     React.createElement(itwinui_react_1.Textarea, { ...textareaProps, "data-testid": "components-textarea-editor" }),
                     React.createElement(PopupButton_1.PopupOkCancelButtons, { onOk: this._handleOk, onCancel: this._handleCancel })))));

package/lib/cjs/components-react/editors/TextareaEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextareaEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/TextareaEditor.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 PropertyEditors\r\n */\r\n\r\nimport \"./TextareaEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  InputEditorSizeParams, MultilineTextEditorParams, PrimitiveValue, PropertyEditorParams,\r\n  PropertyEditorParamTypes, PropertyValue, PropertyValueFormat,\r\n  StandardEditorNames, StandardTypeNames,\r\n} from \"@itwin/appui-abstract\";\r\nimport { Textarea, TextareaProps } from \"@itwin/itwinui-react\";\r\nimport { TypeConverterManager } from \"../converters/TypeConverterManager\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\r\nimport { PopupButton, PopupContent, PopupOkCancelButtons } from \"./PopupButton\";\r\nimport { UiComponents } from \"../UiComponents\";\r\n\r\n/** @internal */\r\ninterface TextareaEditorState {\r\n  inputValue: string;\r\n  readonly: boolean;\r\n  isDisabled?: boolean;\r\n  size?: number;\r\n  maxLength?: number;\r\n  rows: number;\r\n}\r\n\r\nconst DEFAULT_ROWS = 3;\r\n\r\n/** TextareaEditor React component that is a property editor with text input\r\n * @public\r\n */\r\nexport class TextareaEditor extends React.PureComponent<PropertyEditorProps, TextareaEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _ariaLabel = UiComponents.translate(\"editor.textarea\");\r\n  private _divElement = React.createRef<HTMLDivElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<TextareaEditorState> = {\r\n    inputValue: \"\",\r\n    readonly: false,\r\n    rows: DEFAULT_ROWS,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = await TypeConverterManager.getConverter(record.property.typename).convertFromStringToPropertyValue(this.state.inputValue, record);\r\n      (propertyValue as PrimitiveValue).displayValue = this.state.inputValue;\r\n    }\r\n\r\n    return propertyValue;\r\n  }\r\n\r\n  // istanbul ignore next\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._divElement.current;\r\n  }\r\n\r\n  // istanbul ignore next\r\n  public get hasFocus(): boolean {\r\n    let containsFocus = false;\r\n    // istanbul ignore else\r\n    if (this._divElement.current)\r\n      containsFocus = this._divElement.current.contains(document.activeElement);\r\n    return containsFocus;\r\n  }\r\n\r\n  private _updateTextareaValue = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        inputValue: e.target.value,\r\n      });\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const record = this.props.propertyRecord;\r\n    let initialValue = \"\";\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      const value = record.value.value;\r\n      initialValue = await TypeConverterManager.getConverter(record.property.typename).convertPropertyToString(record.property, value);\r\n    }\r\n\r\n    const readonly = record && undefined !== record.isReadonly ? record.isReadonly : false;\r\n    let size: number | undefined;\r\n    let maxLength: number | undefined;\r\n    let rows: number = DEFAULT_ROWS;\r\n\r\n    const isDisabled = record ? record.isDisabled : undefined;\r\n\r\n    if (record && record.property && record.property.editor && record.property.editor.params) {\r\n      const editorSizeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.InputEditorSize) as InputEditorSizeParams;\r\n      if (editorSizeParams) {\r\n        // istanbul ignore else\r\n        if (editorSizeParams.size)\r\n          size = editorSizeParams.size;\r\n        // istanbul ignore else\r\n        if (editorSizeParams.maxLength)\r\n          maxLength = editorSizeParams.maxLength;\r\n      }\r\n\r\n      const multilineParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.MultilineText) as MultilineTextEditorParams;\r\n      if (multilineParams) {\r\n        rows = multilineParams.rows;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ inputValue: initialValue, readonly, size, maxLength, isDisabled, rows });\r\n  }\r\n\r\n  private _handleOk = async (_event: React.MouseEvent): Promise<void> => {\r\n    // istanbul ignore else\r\n    if (this.props.propertyRecord && this.props.onCommit) {\r\n      const propertyValue = await this.getPropertyValue();\r\n      // istanbul ignore else\r\n      if (propertyValue !== undefined) {\r\n        this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\r\n      }\r\n    }\r\n  };\r\n\r\n  private _handleCancel = (_event: React.MouseEvent): void => {\r\n    // istanbul ignore else\r\n    if (this.props.onCancel) {\r\n      this.props.onCancel();\r\n    }\r\n  };\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\"components-cell-editor\", \"components-textarea-editor\", this.props.className);\r\n    const minSize = this.state.size ? this.state.size : 8;\r\n    const style: React.CSSProperties = {\r\n      ...this.props.style,\r\n      minWidth: `${minSize * 0.75}em`,\r\n    };\r\n    const textareaProps: TextareaProps = {\r\n      className: \"components-textarea-editor-textarea\",\r\n      style,\r\n      rows: this.state.rows,\r\n      readOnly: this.state.readonly,\r\n      disabled: this.state.isDisabled,\r\n      maxLength: this.state.maxLength,\r\n      value: this.state.inputValue,\r\n      onChange: this._updateTextareaValue,\r\n      setFocus: this.props.setFocus && !this.state.isDisabled,\r\n    };\r\n\r\n    textareaProps[\"aria-label\"] = this._ariaLabel;\r\n\r\n    return (\r\n      <div className={className} ref={this._divElement}>\r\n        <PopupButton label={this.state.inputValue}\r\n          closeOnEnter={false}\r\n          setFocus={this.props.setFocus} focusTarget=\".uicore-inputs-textarea\">\r\n          <PopupContent>\r\n            <Textarea\r\n              {...textareaProps}\r\n              data-testid=\"components-textarea-editor\"\r\n            />\r\n            <PopupOkCancelButtons onOk={this._handleOk} onCancel={this._handleCancel} />\r\n          </PopupContent>\r\n        </PopupButton>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\n/** Textarea Property Editor registered for the \"text\" and \"string\" type names and \"multi-line\" editor name.\r\n * It uses the [[Textarea]] React component.\r\n * @public\r\n */\r\nexport class TextareaPropertyEditor extends PropertyEditorBase {\r\n  // istanbul ignore next\r\n  public override get containerHandlesBlur(): boolean {\r\n    return false;\r\n  }\r\n  // istanbul ignore next\r\n  public override get containerHandlesEnter(): boolean {\r\n    return false;\r\n  }\r\n  // istanbul ignore next\r\n  public override get containerHandlesTab(): boolean {\r\n    return false;\r\n  }\r\n\r\n  public get reactNode(): React.ReactNode {\r\n    return <TextareaEditor />;\r\n  }\r\n}\r\n\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Text, TextareaPropertyEditor, StandardEditorNames.MultiLine);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.String, TextareaPropertyEditor, StandardEditorNames.MultiLine);\r\n"]}
+{"version":3,"file":"TextareaEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/TextareaEditor.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 PropertyEditors\r\n */\r\n\r\nimport \"./TextareaEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport {\r\n  InputEditorSizeParams, MultilineTextEditorParams, PrimitiveValue, PropertyEditorParams,\r\n  PropertyEditorParamTypes, PropertyValue, PropertyValueFormat,\r\n  StandardEditorNames, StandardTypeNames,\r\n} from \"@itwin/appui-abstract\";\r\nimport { Textarea, TextareaProps } from \"@itwin/itwinui-react\";\r\nimport { TypeConverterManager } from \"../converters/TypeConverterManager\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\r\nimport { PopupButton, PopupContent, PopupOkCancelButtons } from \"./PopupButton\";\r\nimport { UiComponents } from \"../UiComponents\";\r\n\r\n/** @internal */\r\ninterface TextareaEditorState {\r\n  inputValue: string;\r\n  readonly: boolean;\r\n  isDisabled?: boolean;\r\n  size?: number;\r\n  maxLength?: number;\r\n  rows: number;\r\n}\r\n\r\nconst DEFAULT_ROWS = 3;\r\n\r\n/** TextareaEditor React component that is a property editor with text input\r\n * @public\r\n */\r\nexport class TextareaEditor extends React.PureComponent<PropertyEditorProps, TextareaEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _ariaLabel = UiComponents.translate(\"editor.textarea\");\r\n  private _divElement = React.createRef<HTMLDivElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<TextareaEditorState> = {\r\n    inputValue: \"\",\r\n    readonly: false,\r\n    rows: DEFAULT_ROWS,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = await TypeConverterManager.getConverter(record.property.typename).convertFromStringToPropertyValue(this.state.inputValue, record);\r\n      (propertyValue as PrimitiveValue).displayValue = this.state.inputValue;\r\n    }\r\n\r\n    return propertyValue;\r\n  }\r\n\r\n  // istanbul ignore next\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._divElement.current;\r\n  }\r\n\r\n  // istanbul ignore next\r\n  public get hasFocus(): boolean {\r\n    let containsFocus = false;\r\n    // istanbul ignore else\r\n    if (this._divElement.current)\r\n      containsFocus = this._divElement.current.contains(document.activeElement);\r\n    return containsFocus;\r\n  }\r\n\r\n  private _updateTextareaValue = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({\r\n        inputValue: e.target.value,\r\n      });\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const record = this.props.propertyRecord;\r\n    let initialValue = \"\";\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      const value = record.value.value;\r\n      initialValue = await TypeConverterManager.getConverter(record.property.typename).convertPropertyToString(record.property, value);\r\n    }\r\n\r\n    const readonly = record && undefined !== record.isReadonly ? record.isReadonly : false;\r\n    let size: number | undefined;\r\n    let maxLength: number | undefined;\r\n    let rows: number = DEFAULT_ROWS;\r\n\r\n    const isDisabled = record ? record.isDisabled : undefined;\r\n\r\n    if (record && record.property && record.property.editor && record.property.editor.params) {\r\n      const editorSizeParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.InputEditorSize) as InputEditorSizeParams;\r\n      if (editorSizeParams) {\r\n        // istanbul ignore else\r\n        if (editorSizeParams.size)\r\n          size = editorSizeParams.size;\r\n        // istanbul ignore else\r\n        if (editorSizeParams.maxLength)\r\n          maxLength = editorSizeParams.maxLength;\r\n      }\r\n\r\n      const multilineParams = record.property.editor.params.find((param: PropertyEditorParams) => param.type === PropertyEditorParamTypes.MultilineText) as MultilineTextEditorParams;\r\n      if (multilineParams) {\r\n        rows = multilineParams.rows;\r\n      }\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ inputValue: initialValue, readonly, size, maxLength, isDisabled, rows });\r\n  }\r\n\r\n  private _handleOk = async (_event: React.MouseEvent): Promise<void> => {\r\n    // istanbul ignore else\r\n    if (this.props.propertyRecord && this.props.onCommit) {\r\n      const propertyValue = await this.getPropertyValue();\r\n      // istanbul ignore else\r\n      if (propertyValue !== undefined) {\r\n        this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\r\n      }\r\n    }\r\n  };\r\n\r\n  private _handleCancel = (_event: React.MouseEvent): void => {\r\n    // istanbul ignore else\r\n    if (this.props.onCancel) {\r\n      this.props.onCancel();\r\n    }\r\n  };\r\n\r\n  /** @internal */\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\"components-cell-editor\", \"components-textarea-editor\", this.props.className);\r\n    const minSize = this.state.size ? this.state.size : 8;\r\n    const style: React.CSSProperties = {\r\n      ...this.props.style,\r\n      minWidth: `${minSize * 0.75}em`,\r\n    };\r\n    const textareaProps: TextareaProps = {\r\n      className: \"components-textarea-editor-textarea\",\r\n      style,\r\n      rows: this.state.rows,\r\n      readOnly: this.state.readonly,\r\n      disabled: this.state.isDisabled,\r\n      maxLength: this.state.maxLength,\r\n      value: this.state.inputValue,\r\n      onChange: this._updateTextareaValue,\r\n      setFocus: this.props.setFocus && !this.state.isDisabled,\r\n    };\r\n\r\n    textareaProps[\"aria-label\"] = this._ariaLabel;\r\n\r\n    return (\r\n      <div className={className} ref={this._divElement}>\r\n        <PopupButton label={this.state.inputValue}\r\n          closeOnEnter={false}\r\n          setFocus={this.props.setFocus} focusTarget=\".iui-input\">\r\n          <PopupContent>\r\n            <Textarea\r\n              {...textareaProps}\r\n              data-testid=\"components-textarea-editor\"\r\n            />\r\n            <PopupOkCancelButtons onOk={this._handleOk} onCancel={this._handleCancel} />\r\n          </PopupContent>\r\n        </PopupButton>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\n/** Textarea Property Editor registered for the \"text\" and \"string\" type names and \"multi-line\" editor name.\r\n * It uses the [[Textarea]] React component.\r\n * @public\r\n */\r\nexport class TextareaPropertyEditor extends PropertyEditorBase {\r\n  // istanbul ignore next\r\n  public override get containerHandlesBlur(): boolean {\r\n    return false;\r\n  }\r\n  // istanbul ignore next\r\n  public override get containerHandlesEnter(): boolean {\r\n    return false;\r\n  }\r\n  // istanbul ignore next\r\n  public override get containerHandlesTab(): boolean {\r\n    return false;\r\n  }\r\n\r\n  public get reactNode(): React.ReactNode {\r\n    return <TextareaEditor />;\r\n  }\r\n}\r\n\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Text, TextareaPropertyEditor, StandardEditorNames.MultiLine);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.String, TextareaPropertyEditor, StandardEditorNames.MultiLine);\r\n"]}

package/lib/cjs/components-react/editors/ToggleEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleEditor.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/ToggleEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,qBAAqB,CAAC;AAE7B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,aAAa,EAA+D,MAAM,uBAAuB,CAAC;AACnH,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAyB,MAAM,yBAAyB,CAAC;AAGpF,gBAAgB;AAChB,UAAU,iBAAiB;IACzB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,qBAAa,YAAa,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,iBAAiB,CAAE,YAAW,UAAU;IACjH,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAAuC;IAE5D,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAGzD;IAEW,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAenE,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAE7B;IAED,OAAO,CAAC,kBAAkB,CA8BxB;IAEF,gBAAgB;IACA,iBAAiB;IAKjC,gBAAgB;IACA,oBAAoB;IAIpC,gBAAgB;IACA,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;YAMnD,iBAAiB;IAoB/B,gBAAgB;IACA,MAAM;CAkBvB;AAED;;;GAGG;AACH,qBAAa,oBAAqB,SAAQ,kBAAkB;IAE1D,IAAoB,oBAAoB,IAAI,OAAO,CAElD;IAED,IAAW,SAAS,IAAI,KAAK,CAAC,SAAS,CAEtC;CACF"}
+{"version":3,"file":"ToggleEditor.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/ToggleEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,qBAAqB,CAAC;AAE7B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,aAAa,EAA+D,MAAM,uBAAuB,CAAC;AACnH,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAyB,MAAM,yBAAyB,CAAC;AAGpF,gBAAgB;AAChB,UAAU,iBAAiB;IACzB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,qBAAa,YAAa,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,iBAAiB,CAAE,YAAW,UAAU;IACjH,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAAuC;IAE5D,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAGzD;IAEW,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAenE,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAE7B;IAED,OAAO,CAAC,kBAAkB,CAqBxB;IAEF,gBAAgB;IACA,iBAAiB;IAKjC,gBAAgB;IACA,oBAAoB;IAIpC,gBAAgB;IACA,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;YAMnD,iBAAiB;IAoB/B,gBAAgB;IACA,MAAM;CAkBvB;AAED;;;GAGG;AACH,qBAAa,oBAAqB,SAAQ,kBAAkB;IAE1D,IAAoB,oBAAoB,IAAI,OAAO,CAElD;IAED,IAAW,SAAS,IAAI,KAAK,CAAC,SAAS,CAEtC;CACF"}

package/lib/cjs/components-react/editors/ToggleEditor.js

@@ -54,15 +54,7 @@ class ToggleEditor extends React.PureComponent {
             if (this._isMounted) {
                 // istanbul ignore else
                 if (this._isMounted) {
-                    let toggleValue = false;
-                    // istanbul ignore if
-                    if (e.target.checked !== undefined) // Needed for unit test environment
-                        toggleValue = e.target.checked;
-                    else {
-                        // istanbul ignore else
-                        if (e.target.value !== undefined && typeof e.target.value === "boolean")
-                            toggleValue = e.target.value;
-                    }
+                    const toggleValue = !!e.target.checked;
                     this.setState({
                         toggleValue,
                     }, async () => {

package/lib/cjs/components-react/editors/ToggleEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/ToggleEditor.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;;;;;;;;;;;;;;;;;;;;;;;AAEH,+BAA6B;AAC7B,4DAAoC;AACpC,6CAA+B;AAC/B,0DAAmH;AAEnH,mEAAoF;AACpF,wDAAoD;AAQpD;;GAEG;AACH,MAAa,YAAa,SAAQ,KAAK,CAAC,aAAqD;IAA7F;;QACU,eAAU,GAAG,KAAK,CAAC;QACnB,kBAAa,GAAG,KAAK,CAAC,SAAS,EAAoB,CAAC;QAE5D,gBAAgB;QACS,UAAK,GAAgC;YAC5D,WAAW,EAAE,KAAK;YAClB,UAAU,EAAE,KAAK;SAClB,CAAC;QAyBM,uBAAkB,GAAG,CAAC,CAAsC,EAAO,EAAE;YAC3E,uBAAuB;YACvB,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,uBAAuB;gBACvB,IAAI,IAAI,CAAC,UAAU,EAAE;oBACnB,IAAI,WAAW,GAAY,KAAK,CAAC;oBAEjC,qBAAqB;oBACrB,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,KAAK,SAAS,EAAI,mCAAmC;wBACvE,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;yBAC5B;wBACH,uBAAuB;wBACvB,IAAI,CAAC,CAAC,MAAM,CAAC,KAAK,KAAK,SAAS,IAAI,OAAO,CAAC,CAAC,MAAM,CAAC,KAAK,KAAK,SAAS;4BACrE,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;qBAChC;oBAED,IAAI,CAAC,QAAQ,CAAC;wBACZ,WAAW;qBACZ,EAAE,KAAK,IAAI,EAAE;wBACZ,uBAAuB;wBACvB,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;4BACpD,MAAM,aAAa,GAAG,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAC;4BACpD,uBAAuB;4BACvB,IAAI,aAAa,KAAK,SAAS,EAAE;gCAC/B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,QAAQ,EAAE,aAAa,EAAE,CAAC,CAAC;6BAC7F;yBACF;oBACH,CAAC,CAAC,CAAC;iBACJ;aACF;QACH,CAAC,CAAC;IA2DJ,CAAC;IAhHQ,KAAK,CAAC,gBAAgB;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;QACzC,IAAI,aAAwC,CAAC;QAE7C,uBAAuB;QACvB,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,CAAC,WAAW,KAAK,oCAAmB,CAAC,SAAS,EAAE;YACxE,aAAa,GAAG;gBACd,WAAW,EAAE,oCAAmB,CAAC,SAAS;gBAC1C,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW;gBAC7B,YAAY,EAAE,EAAE;aACjB,CAAC;SACH;QACD,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC;IACpC,CAAC;IAED,IAAW,QAAQ;QACjB,OAAO,QAAQ,CAAC,aAAa,KAAK,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC;IAC/D,CAAC;IAkCD,gBAAgB;IACA,iBAAiB;QAC/B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;IAC1F,CAAC;IAED,gBAAgB;IACA,oBAAoB;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAED,gBAAgB;IACA,kBAAkB,CAAC,SAA8B;QAC/D,IAAI,IAAI,CAAC,KAAK,CAAC,cAAc,KAAK,SAAS,CAAC,cAAc,EAAE;YAC1D,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,8DAA8D;SACzF;IACH,CAAC;IAEO,KAAK,CAAC,iBAAiB;QAC7B,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACtC,IAAI,WAAW,GAAG,KAAK,CAAC;QACxB,IAAI,UAAU,GAAG,KAAK,CAAC;QAEvB,uBAAuB;QACvB,IAAI,cAAc,IAAI,cAAc,CAAC,KAAK,CAAC,WAAW,KAAK,oCAAmB,CAAC,SAAS,EAAE;YACxF,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC;YAClD,WAAW,GAAG,cAAyB,CAAC;SACzC;QAED,uBAAuB;QACvB,IAAI,cAAc,IAAI,cAAc,CAAC,UAAU;YAC7C,UAAU,GAAG,cAAc,CAAC,UAAU,CAAC;QAEzC,uBAAuB;QACvB,IAAI,IAAI,CAAC,UAAU;YACjB,IAAI,CAAC,QAAQ,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC,CAAC;IAC/C,CAAC;IAED,gBAAgB;IACA,MAAM;QACpB,MAAM,SAAS,GAAG,IAAA,oBAAU,EAAC,wBAAwB,EAAE,0BAA0B,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QACzG,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC;QACzC,MAAM,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;QAE3C,OAAO,CACL,oBAAC,4BAAY,IACX,GAAG,EAAE,IAAI,CAAC,aAAa,EACvB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EACzB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,IAAI,CAAC,kBAAkB,iBACrB,0BAA0B,EACtC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAI,CACpC,CAAC;IACJ,CAAC;CACF;AA1HD,oCA0HC;AAED;;;GAGG;AACH,MAAa,oBAAqB,SAAQ,0CAAkB;IAC1D,uBAAuB;IACvB,IAAoB,oBAAoB;QACtC,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IAAW,SAAS;QAClB,OAAO,oBAAC,YAAY,OAAG,CAAC;IAC1B,CAAC;CACF;AATD,oDASC;AAED,6CAAqB,CAAC,cAAc,CAAC,kCAAiB,CAAC,IAAI,EAAE,oBAAoB,EAAE,oCAAmB,CAAC,MAAM,CAAC,CAAC;AAC/G,6CAAqB,CAAC,cAAc,CAAC,kCAAiB,CAAC,OAAO,EAAE,oBAAoB,EAAE,oCAAmB,CAAC,MAAM,CAAC,CAAC","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 PropertyEditors\r\n */\r\n\r\nimport \"./ToggleEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { PropertyValue, PropertyValueFormat, StandardEditorNames, StandardTypeNames } from \"@itwin/appui-abstract\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\r\nimport { ToggleSwitch } from \"@itwin/itwinui-react\";\r\n\r\n/** @internal */\r\ninterface ToggleEditorState {\r\n  toggleValue: boolean;\r\n  isDisabled?: boolean;\r\n}\r\n\r\n/** ToggleEditor React component that is a property editor with checkbox input\r\n * @public\r\n */\r\nexport class ToggleEditor extends React.PureComponent<PropertyEditorProps, ToggleEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _inputElement = React.createRef<HTMLInputElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<ToggleEditorState> = {\r\n    toggleValue: false,\r\n    isDisabled: false,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = {\r\n        valueFormat: PropertyValueFormat.Primitive,\r\n        value: this.state.toggleValue,\r\n        displayValue: \"\",\r\n      };\r\n    }\r\n    return propertyValue;\r\n  }\r\n\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._inputElement.current;\r\n  }\r\n\r\n  public get hasFocus(): boolean {\r\n    return document.activeElement === this._inputElement.current;\r\n  }\r\n\r\n  private _updateToggleValue = (e: React.ChangeEvent<HTMLInputElement>): any => {\r\n    // istanbul ignore else\r\n    if (this._isMounted) {\r\n      // istanbul ignore else\r\n      if (this._isMounted) {\r\n        let toggleValue: boolean = false;\r\n\r\n        // istanbul ignore if\r\n        if (e.target.checked !== undefined)   // Needed for unit test environment\r\n          toggleValue = e.target.checked;\r\n        else {\r\n          // istanbul ignore else\r\n          if (e.target.value !== undefined && typeof e.target.value === \"boolean\")\r\n            toggleValue = e.target.value;\r\n        }\r\n\r\n        this.setState({\r\n          toggleValue,\r\n        }, async () => {\r\n          // istanbul ignore else\r\n          if (this.props.propertyRecord && this.props.onCommit) {\r\n            const propertyValue = await this.getPropertyValue();\r\n            // istanbul ignore else\r\n            if (propertyValue !== undefined) {\r\n              this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\r\n            }\r\n          }\r\n        });\r\n      }\r\n    }\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const { propertyRecord } = this.props;\r\n    let toggleValue = false;\r\n    let isDisabled = false;\r\n\r\n    // istanbul ignore else\r\n    if (propertyRecord && propertyRecord.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      const primitiveValue = propertyRecord.value.value;\r\n      toggleValue = primitiveValue as boolean;\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (propertyRecord && propertyRecord.isDisabled)\r\n      isDisabled = propertyRecord.isDisabled;\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ toggleValue, isDisabled });\r\n  }\r\n\r\n  /** @internal */\r\n  public override render() {\r\n    const className = classnames(\"components-cell-editor\", \"components-toggle-editor\", this.props.className);\r\n    const isChecked = this.state.toggleValue;\r\n    const isDisabled = !!this.state.isDisabled;\r\n\r\n    return (\r\n      <ToggleSwitch\r\n        ref={this._inputElement}\r\n        onBlur={this.props.onBlur}\r\n        className={className}\r\n        style={this.props.style}\r\n        checked={isChecked}\r\n        disabled={isDisabled}\r\n        onChange={this._updateToggleValue}\r\n        data-testid=\"components-toggle-editor\"\r\n        setFocus={this.props.setFocus} />\r\n    );\r\n  }\r\n}\r\n\r\n/** Toggle Property Editor registered for the \"bool\" and \"boolean\" type names and \"toggle\" editor name.\r\n * It uses the [[ToggleEditor]] React component.\r\n * @public\r\n */\r\nexport class TogglePropertyEditor extends PropertyEditorBase {\r\n  // istanbul ignore next\r\n  public override get containerHandlesBlur(): boolean {\r\n    return false;\r\n  }\r\n\r\n  public get reactNode(): React.ReactNode {\r\n    return <ToggleEditor />;\r\n  }\r\n}\r\n\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Bool, TogglePropertyEditor, StandardEditorNames.Toggle);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Boolean, TogglePropertyEditor, StandardEditorNames.Toggle);\r\n"]}
+{"version":3,"file":"ToggleEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/ToggleEditor.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 PropertyEditors\r\n */\r\n\r\nimport \"./ToggleEditor.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { PropertyValue, PropertyValueFormat, StandardEditorNames, StandardTypeNames } from \"@itwin/appui-abstract\";\r\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\r\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\r\nimport { ToggleSwitch } from \"@itwin/itwinui-react\";\r\n\r\n/** @internal */\r\ninterface ToggleEditorState {\r\n  toggleValue: boolean;\r\n  isDisabled?: boolean;\r\n}\r\n\r\n/** ToggleEditor React component that is a property editor with checkbox input\r\n * @public\r\n */\r\nexport class ToggleEditor extends React.PureComponent<PropertyEditorProps, ToggleEditorState> implements TypeEditor {\r\n  private _isMounted = false;\r\n  private _inputElement = React.createRef<HTMLInputElement>();\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<ToggleEditorState> = {\r\n    toggleValue: false,\r\n    isDisabled: false,\r\n  };\r\n\r\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\r\n    const record = this.props.propertyRecord;\r\n    let propertyValue: PropertyValue | undefined;\r\n\r\n    // istanbul ignore else\r\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      propertyValue = {\r\n        valueFormat: PropertyValueFormat.Primitive,\r\n        value: this.state.toggleValue,\r\n        displayValue: \"\",\r\n      };\r\n    }\r\n    return propertyValue;\r\n  }\r\n\r\n  public get htmlElement(): HTMLElement | null {\r\n    return this._inputElement.current;\r\n  }\r\n\r\n  public get hasFocus(): boolean {\r\n    return document.activeElement === this._inputElement.current;\r\n  }\r\n\r\n  private _updateToggleValue = (e: React.ChangeEvent<HTMLInputElement>): any => {\r\n    // istanbul ignore else\r\n    if (this._isMounted) {\r\n      // istanbul ignore else\r\n      if (this._isMounted) {\r\n        const toggleValue = !!e.target.checked;\r\n\r\n        this.setState({\r\n          toggleValue,\r\n        }, async () => {\r\n          // istanbul ignore else\r\n          if (this.props.propertyRecord && this.props.onCommit) {\r\n            const propertyValue = await this.getPropertyValue();\r\n            // istanbul ignore else\r\n            if (propertyValue !== undefined) {\r\n              this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\r\n            }\r\n          }\r\n        });\r\n      }\r\n    }\r\n  };\r\n\r\n  /** @internal */\r\n  public override componentDidMount() {\r\n    this._isMounted = true;\r\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentWillUnmount() {\r\n    this._isMounted = false;\r\n  }\r\n\r\n  /** @internal */\r\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\r\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\r\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\r\n    }\r\n  }\r\n\r\n  private async setStateFromProps() {\r\n    const { propertyRecord } = this.props;\r\n    let toggleValue = false;\r\n    let isDisabled = false;\r\n\r\n    // istanbul ignore else\r\n    if (propertyRecord && propertyRecord.value.valueFormat === PropertyValueFormat.Primitive) {\r\n      const primitiveValue = propertyRecord.value.value;\r\n      toggleValue = primitiveValue as boolean;\r\n    }\r\n\r\n    // istanbul ignore else\r\n    if (propertyRecord && propertyRecord.isDisabled)\r\n      isDisabled = propertyRecord.isDisabled;\r\n\r\n    // istanbul ignore else\r\n    if (this._isMounted)\r\n      this.setState({ toggleValue, isDisabled });\r\n  }\r\n\r\n  /** @internal */\r\n  public override render() {\r\n    const className = classnames(\"components-cell-editor\", \"components-toggle-editor\", this.props.className);\r\n    const isChecked = this.state.toggleValue;\r\n    const isDisabled = !!this.state.isDisabled;\r\n\r\n    return (\r\n      <ToggleSwitch\r\n        ref={this._inputElement}\r\n        onBlur={this.props.onBlur}\r\n        className={className}\r\n        style={this.props.style}\r\n        checked={isChecked}\r\n        disabled={isDisabled}\r\n        onChange={this._updateToggleValue}\r\n        data-testid=\"components-toggle-editor\"\r\n        setFocus={this.props.setFocus} />\r\n    );\r\n  }\r\n}\r\n\r\n/** Toggle Property Editor registered for the \"bool\" and \"boolean\" type names and \"toggle\" editor name.\r\n * It uses the [[ToggleEditor]] React component.\r\n * @public\r\n */\r\nexport class TogglePropertyEditor extends PropertyEditorBase {\r\n  // istanbul ignore next\r\n  public override get containerHandlesBlur(): boolean {\r\n    return false;\r\n  }\r\n\r\n  public get reactNode(): React.ReactNode {\r\n    return <ToggleEditor />;\r\n  }\r\n}\r\n\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Bool, TogglePropertyEditor, StandardEditorNames.Toggle);\r\nPropertyEditorManager.registerEditor(StandardTypeNames.Boolean, TogglePropertyEditor, StandardEditorNames.Toggle);\r\n"]}

package/lib/cjs/components-react/editors/ToggleEditor.scss

@@ -2,24 +2,22 @@
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
-@import "~@itwin/itwinui-css/scss/style/space";
-
 .components-property-list--horizontal {
   .components-toggle-editor {
-    margin-left:    $iui-xs;    // Clear the resizer in the PropertyGrid
+    margin-left: var(--iui-size-2xs); // Clear the resizer in the PropertyGrid
 
     &.iui-toggle-switch {
-      padding:      1px 0;
+      padding: 1px 0;
     }
   }
 }
 
 .components-property-list--vertical {
   .components-toggle-editor {
-    margin-left:    $iui-xxs;
+    margin-left: var(--iui-size-3xs);
 
     &.iui-toggle-switch {
-      padding:      1px 0;
+      padding: 1px 0;
     }
   }
 }

package/lib/cjs/components-react/favorite/FavoritePropertiesRenderer.d.ts

@@ -1,13 +1,37 @@
 /** @packageDocumentation
  * @module Favorite
  */
+import * as React from "react";
 import { Orientation } from "@itwin/core-react";
 import { PropertyData } from "../propertygrid/PropertyDataProvider";
+/**
+ * Basic recreation of the `createRoot` function type, intentionally not exported.
+ */
+declare type CreateRoot = (container: Element | DocumentFragment) => {
+    render(children: React.ReactNode): void;
+};
 /** Renderer for Favorite Property List
  * @public
  */
 export declare class FavoritePropertiesRenderer {
+    /**
+     * Evaluates if a PropertyData contain Favorite records.
+     * @param propertyData PropertyData containing records
+     * @returns true if it contains Favorite records
+     */
     hasFavorites(propertyData: PropertyData): boolean;
-    renderFavorites(propertyData: PropertyData, orientation?: Orientation): HTMLElement | string;
+    /**
+     * Allow creating an HTMLElement containing the `<FavoritePropertyList />` component so it can be added outside of a React component (`showCard` is the main expected use)
+     *
+     * Note: When using React18, in order to remove the `ReactDOM.render` warning you will need to provide the `createRoot` function to this function,
+     * the parameter type is intentionally simplified to not depend on React18 type.
+     *
+     * @param propertyData PropertyData containing Favorite records to display.
+     * @param orientation Orientation of the items
+     * @param createRoot `createRoot` function imported from `import { createRoot } from "react-dom/client";`
+     * @returns a `div` HTMLElement with the `<FavoritePropertyList />` rendered within it.
+     */
+    renderFavorites(propertyData: PropertyData, orientation?: Orientation, createRoot?: CreateRoot): HTMLElement | string;
 }
+export {};
 //# sourceMappingURL=FavoritePropertiesRenderer.d.ts.map

package/lib/cjs/components-react/favorite/FavoritePropertiesRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FavoritePropertiesRenderer.d.ts","sourceRoot":"","sources":["../../../../src/components-react/favorite/FavoritePropertiesRenderer.ts"],"names":[],"mappings":"AAIA;;GAEG;AAIH,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AAGpE;;GAEG;AACH,qBAAa,0BAA0B;IAE9B,YAAY,CAAC,YAAY,EAAE,YAAY,GAAG,OAAO;IAIjD,eAAe,CAAC,YAAY,EAAE,YAAY,EAAE,WAAW,CAAC,EAAE,WAAW,GAAG,WAAW,GAAG,MAAM;CAKpG"}
+{"version":3,"file":"FavoritePropertiesRenderer.d.ts","sourceRoot":"","sources":["../../../../src/components-react/favorite/FavoritePropertiesRenderer.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AAGpE;;GAEG;AACH,aAAK,UAAU,GAAG,CAAC,SAAS,EAAE,OAAO,GAAG,gBAAgB,KAAK;IAC3D,MAAM,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;CACzC,CAAC;AAEF;;GAEG;AACH,qBAAa,0BAA0B;IAErC;;;;OAIG;IACI,YAAY,CAAC,YAAY,EAAE,YAAY,GAAG,OAAO;IAIxD;;;;;;;;;;OAUG;IACI,eAAe,CAAC,YAAY,EAAE,YAAY,EAAE,WAAW,CAAC,EAAE,WAAW,EAAE,UAAU,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,MAAM;CAU7H"}