@itwin/components-react 4.0.0-dev.3 → 4.0.0-dev.6

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

@@ -1 +1 @@
-{"version":3,"file":"ToggleEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/ToggleEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport \"./ToggleEditor.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { PropertyValue, PropertyValueFormat, StandardEditorNames, StandardTypeNames } from \"@itwin/appui-abstract\";\nimport { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\nimport { PropertyEditorBase, PropertyEditorManager } from \"./PropertyEditorManager\";\nimport { ToggleSwitch } from \"@itwin/itwinui-react\";\n\n/** @internal */\ninterface ToggleEditorState {\n  toggleValue: boolean;\n  isDisabled?: boolean;\n}\n\n/** ToggleEditor React component that is a property editor with checkbox input\n * @public\n */\nexport class ToggleEditor extends React.PureComponent<PropertyEditorProps, ToggleEditorState> implements TypeEditor {\n  private _isMounted = false;\n  private _inputElement = React.createRef<HTMLInputElement>();\n\n  /** @internal */\n  public override readonly state: Readonly<ToggleEditorState> = {\n    toggleValue: false,\n    isDisabled: false,\n  };\n\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\n    const record = this.props.propertyRecord;\n    let propertyValue: PropertyValue | undefined;\n\n    // istanbul ignore else\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n      propertyValue = {\n        valueFormat: PropertyValueFormat.Primitive,\n        value: this.state.toggleValue,\n        displayValue: \"\",\n      };\n    }\n    return propertyValue;\n  }\n\n  public get htmlElement(): HTMLElement | null {\n    return this._inputElement.current;\n  }\n\n  public get hasFocus(): boolean {\n    return document.activeElement === this._inputElement.current;\n  }\n\n  private _updateToggleValue = (e: React.ChangeEvent<HTMLInputElement>): any => {\n    // istanbul ignore else\n    if (this._isMounted) {\n      // istanbul ignore else\n      if (this._isMounted) {\n        const toggleValue = !!e.target.checked;\n\n        this.setState({\n          toggleValue,\n        }, async () => {\n          // istanbul ignore else\n          if (this.props.propertyRecord && this.props.onCommit) {\n            const propertyValue = await this.getPropertyValue();\n            // istanbul ignore else\n            if (propertyValue !== undefined) {\n              this.props.onCommit({ propertyRecord: this.props.propertyRecord, newValue: propertyValue });\n            }\n          }\n        });\n      }\n    }\n  };\n\n  /** @internal */\n  public override componentDidMount() {\n    this._isMounted = true;\n    this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\n  }\n\n  /** @internal */\n  public override componentWillUnmount() {\n    this._isMounted = false;\n  }\n\n  /** @internal */\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\n      this.setStateFromProps(); // eslint-disable-line @typescript-eslint/no-floating-promises\n    }\n  }\n\n  private async setStateFromProps() {\n    const { propertyRecord } = this.props;\n    let toggleValue = false;\n    let isDisabled = false;\n\n    // istanbul ignore else\n    if (propertyRecord && propertyRecord.value.valueFormat === PropertyValueFormat.Primitive) {\n      const primitiveValue = propertyRecord.value.value;\n      toggleValue = primitiveValue as boolean;\n    }\n\n    // istanbul ignore else\n    if (propertyRecord && propertyRecord.isDisabled)\n      isDisabled = propertyRecord.isDisabled;\n\n    // istanbul ignore else\n    if (this._isMounted)\n      this.setState({ toggleValue, isDisabled });\n  }\n\n  /** @internal */\n  public override render() {\n    const className = classnames(\"components-cell-editor\", \"components-toggle-editor\", this.props.className);\n    const isChecked = this.state.toggleValue;\n    const isDisabled = !!this.state.isDisabled;\n\n    return (\n      <ToggleSwitch\n        ref={this._inputElement}\n        onBlur={this.props.onBlur}\n        className={className}\n        style={this.props.style}\n        checked={isChecked}\n        disabled={isDisabled}\n        onChange={this._updateToggleValue}\n        data-testid=\"components-toggle-editor\"\n        setFocus={this.props.setFocus} />\n    );\n  }\n}\n\n/** Toggle Property Editor registered for the \"bool\" and \"boolean\" type names and \"toggle\" editor name.\n * It uses the [[ToggleEditor]] React component.\n * @public\n */\nexport class TogglePropertyEditor extends PropertyEditorBase {\n  // istanbul ignore next\n  public override get containerHandlesBlur(): boolean {\n    return false;\n  }\n\n  public get reactNode(): React.ReactNode {\n    return <ToggleEditor />;\n  }\n}\n\nPropertyEditorManager.registerEditor(StandardTypeNames.Bool, TogglePropertyEditor, StandardEditorNames.Toggle);\nPropertyEditorManager.registerEditor(StandardTypeNames.Boolean, TogglePropertyEditor, StandardEditorNames.Toggle);\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        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"]}

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

@@ -1,23 +1,25 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-.components-property-list--horizontal {
-  .components-toggle-editor {
-    margin-left: var(--iui-size-2xs); // Clear the resizer in the PropertyGrid
-
-    &.iui-toggle-switch {
-      padding: 1px 0;
-    }
-  }
-}
-
-.components-property-list--vertical {
-  .components-toggle-editor {
-    margin-left: var(--iui-size-3xs);
-
-    &.iui-toggle-switch {
-      padding: 1px 0;
-    }
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* 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
+
+    &.iui-toggle-switch {
+      padding:      1px 0;
+    }
+  }
+}
+
+.components-property-list--vertical {
+  .components-toggle-editor {
+    margin-left:    $iui-xxs;
+
+    &.iui-toggle-switch {
+      padding:      1px 0;
+    }
+  }
+}

package/lib/esm/components-react/editors/variables.scss

@@ -1,7 +1,7 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/inputs/variables";
-
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/core-react/lib/cjs/core-react/inputs/variables";
+
 $editor-iui-input-padding: $uicore-iui-input-padding;

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

@@ -1,13 +1,13 @@
-/** @packageDocumentation
- * @module Favorite
- */
-import { Orientation } from "@itwin/core-react";
-import { PropertyData } from "../propertygrid/PropertyDataProvider";
-/** Renderer for Favorite Property List
- * @public
- */
-export declare class FavoritePropertiesRenderer {
-    hasFavorites(propertyData: PropertyData): boolean;
-    renderFavorites(propertyData: PropertyData, orientation?: Orientation): HTMLElement | string;
-}
+/** @packageDocumentation
+ * @module Favorite
+ */
+import { Orientation } from "@itwin/core-react";
+import { PropertyData } from "../propertygrid/PropertyDataProvider";
+/** Renderer for Favorite Property List
+ * @public
+ */
+export declare class FavoritePropertiesRenderer {
+    hasFavorites(propertyData: PropertyData): boolean;
+    renderFavorites(propertyData: PropertyData, orientation?: Orientation): HTMLElement | string;
+}
 //# sourceMappingURL=FavoritePropertiesRenderer.d.ts.map

package/lib/esm/components-react/favorite/FavoritePropertiesRenderer.js

@@ -1,24 +1,24 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Favorite
- */
-import * as React from "react";
-import * as ReactDOM from "react-dom";
-import { FavoritePropertyList } from "./FavoritePropertyList";
-/** Renderer for Favorite Property List
- * @public
- */
-export class FavoritePropertiesRenderer {
-    hasFavorites(propertyData) {
-        return propertyData.records.Favorite !== undefined;
-    }
-    renderFavorites(propertyData, orientation) {
-        const div = document.createElement("div");
-        ReactDOM.render(React.createElement(FavoritePropertyList, { propertyData, orientation }, null), div);
-        return div;
-    }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Favorite
+ */
+import * as React from "react";
+import * as ReactDOM from "react-dom";
+import { FavoritePropertyList } from "./FavoritePropertyList";
+/** Renderer for Favorite Property List
+ * @public
+ */
+export class FavoritePropertiesRenderer {
+    hasFavorites(propertyData) {
+        return propertyData.records.Favorite !== undefined;
+    }
+    renderFavorites(propertyData, orientation) {
+        const div = document.createElement("div");
+        ReactDOM.render(React.createElement(FavoritePropertyList, { propertyData, orientation }, null), div);
+        return div;
+    }
+}
 //# sourceMappingURL=FavoritePropertiesRenderer.js.map

package/lib/esm/components-react/favorite/FavoritePropertiesRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"FavoritePropertiesRenderer.js","sourceRoot":"","sources":["../../../../src/components-react/favorite/FavoritePropertiesRenderer.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAC;AAGtC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D;;GAEG;AACH,MAAM,OAAO,0BAA0B;IAE9B,YAAY,CAAC,YAA0B;QAC5C,OAAO,YAAY,CAAC,OAAO,CAAC,QAAQ,KAAK,SAAS,CAAC;IACrD,CAAC;IAEM,eAAe,CAAC,YAA0B,EAAE,WAAyB;QAC1E,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1C,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,oBAAoB,EAAE,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;QACrG,OAAO,GAAG,CAAC;IACb,CAAC;CACF","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Favorite\n */\n\nimport * as React from \"react\";\nimport * as ReactDOM from \"react-dom\";\nimport { Orientation } from \"@itwin/core-react\";\nimport { PropertyData } from \"../propertygrid/PropertyDataProvider\";\nimport { FavoritePropertyList } from \"./FavoritePropertyList\";\n\n/** Renderer for Favorite Property List\n * @public\n */\nexport class FavoritePropertiesRenderer {\n\n  public hasFavorites(propertyData: PropertyData): boolean {\n    return propertyData.records.Favorite !== undefined;\n  }\n\n  public renderFavorites(propertyData: PropertyData, orientation?: Orientation): HTMLElement | string {\n    const div = document.createElement(\"div\");\n    ReactDOM.render(React.createElement(FavoritePropertyList, { propertyData, orientation }, null), div);\n    return div;\n  }\n}\n"]}
+{"version":3,"file":"FavoritePropertiesRenderer.js","sourceRoot":"","sources":["../../../../src/components-react/favorite/FavoritePropertiesRenderer.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAC;AAGtC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D;;GAEG;AACH,MAAM,OAAO,0BAA0B;IAE9B,YAAY,CAAC,YAA0B;QAC5C,OAAO,YAAY,CAAC,OAAO,CAAC,QAAQ,KAAK,SAAS,CAAC;IACrD,CAAC;IAEM,eAAe,CAAC,YAA0B,EAAE,WAAyB;QAC1E,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1C,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,oBAAoB,EAAE,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;QACrG,OAAO,GAAG,CAAC;IACb,CAAC;CACF","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 Favorite\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport * as ReactDOM from \"react-dom\";\r\nimport { Orientation } from \"@itwin/core-react\";\r\nimport { PropertyData } from \"../propertygrid/PropertyDataProvider\";\r\nimport { FavoritePropertyList } from \"./FavoritePropertyList\";\r\n\r\n/** Renderer for Favorite Property List\r\n * @public\r\n */\r\nexport class FavoritePropertiesRenderer {\r\n\r\n  public hasFavorites(propertyData: PropertyData): boolean {\r\n    return propertyData.records.Favorite !== undefined;\r\n  }\r\n\r\n  public renderFavorites(propertyData: PropertyData, orientation?: Orientation): HTMLElement | string {\r\n    const div = document.createElement(\"div\");\r\n    ReactDOM.render(React.createElement(FavoritePropertyList, { propertyData, orientation }, null), div);\r\n    return div;\r\n  }\r\n}\r\n"]}

package/lib/esm/components-react/favorite/FavoritePropertyList.d.ts

@@ -1,20 +1,20 @@
-/** @packageDocumentation
- * @module Favorite
- */
-/// <reference types="react" />
-import { Orientation } from "@itwin/core-react";
-import { PropertyValueRendererManager } from "../properties/ValueRendererManager";
-import { PropertyData } from "../propertygrid/PropertyDataProvider";
-/** Properties for [[FavoritePropertyList]] React component
- * @alpha
- */
-export interface FavoritePropertyListProps {
-    propertyData: PropertyData;
-    propertyValueRendererManager?: PropertyValueRendererManager;
-    orientation?: Orientation;
-}
-/** Favorite Property List React component
- * @alpha
- */
-export declare function FavoritePropertyList(props: FavoritePropertyListProps): JSX.Element | null;
+/** @packageDocumentation
+ * @module Favorite
+ */
+/// <reference types="react" />
+import { Orientation } from "@itwin/core-react";
+import { PropertyValueRendererManager } from "../properties/ValueRendererManager";
+import { PropertyData } from "../propertygrid/PropertyDataProvider";
+/** Properties for [[FavoritePropertyList]] React component
+ * @alpha
+ */
+export interface FavoritePropertyListProps {
+    propertyData: PropertyData;
+    propertyValueRendererManager?: PropertyValueRendererManager;
+    orientation?: Orientation;
+}
+/** Favorite Property List React component
+ * @alpha
+ */
+export declare function FavoritePropertyList(props: FavoritePropertyListProps): JSX.Element | null;
 //# sourceMappingURL=FavoritePropertyList.d.ts.map

package/lib/esm/components-react/favorite/FavoritePropertyList.js

@@ -1,29 +1,29 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Favorite
- */
-import * as React from "react";
-import { Orientation, ResizableContainerObserver } from "@itwin/core-react";
-import { PropertyValueRendererManager } from "../properties/ValueRendererManager";
-import { PropertyList } from "../propertygrid/component/PropertyList";
-/** Favorite Property List React component
- * @alpha
- */
-export function FavoritePropertyList(props) {
-    var _a, _b;
-    const [listWidth, setListWidth] = React.useState();
-    const onListResize = React.useCallback(setListWidth, [setListWidth]);
-    if (props.propertyData.records.Favorite !== undefined) {
-        const propertyValueRendererManager = (_a = props.propertyValueRendererManager) !== null && _a !== void 0 ? _a : PropertyValueRendererManager.defaultManager;
-        const orientation = (_b = props.orientation) !== null && _b !== void 0 ? _b : Orientation.Horizontal;
-        return (React.createElement("div", { className: "components-favorite-property-list" },
-            React.createElement(ResizableContainerObserver, { onResize: onListResize }),
-            listWidth ?
-                React.createElement(PropertyList, { orientation: orientation, width: listWidth, properties: props.propertyData.records.Favorite, columnRatio: 1 / 3, propertyValueRendererManager: propertyValueRendererManager }) : null));
-    }
-    return null;
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Favorite
+ */
+import * as React from "react";
+import { Orientation, ResizableContainerObserver } from "@itwin/core-react";
+import { PropertyValueRendererManager } from "../properties/ValueRendererManager";
+import { PropertyList } from "../propertygrid/component/PropertyList";
+/** Favorite Property List React component
+ * @alpha
+ */
+export function FavoritePropertyList(props) {
+    var _a, _b;
+    const [listWidth, setListWidth] = React.useState();
+    const onListResize = React.useCallback(setListWidth, [setListWidth]);
+    if (props.propertyData.records.Favorite !== undefined) {
+        const propertyValueRendererManager = (_a = props.propertyValueRendererManager) !== null && _a !== void 0 ? _a : PropertyValueRendererManager.defaultManager;
+        const orientation = (_b = props.orientation) !== null && _b !== void 0 ? _b : Orientation.Horizontal;
+        return (React.createElement("div", { className: "components-favorite-property-list" },
+            React.createElement(ResizableContainerObserver, { onResize: onListResize }),
+            listWidth ?
+                React.createElement(PropertyList, { orientation: orientation, width: listWidth, properties: props.propertyData.records.Favorite, columnRatio: 1 / 3, propertyValueRendererManager: propertyValueRendererManager }) : null));
+    }
+    return null;
+}
 //# sourceMappingURL=FavoritePropertyList.js.map

package/lib/esm/components-react/favorite/FavoritePropertyList.js.map

@@ -1 +1 @@
-{"version":3,"file":"FavoritePropertyList.js","sourceRoot":"","sources":["../../../../src/components-react/favorite/FavoritePropertyList.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,0BAA0B,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAAE,4BAA4B,EAAE,MAAM,oCAAoC,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAYtE;;GAEG;AACH,MAAM,UAAU,oBAAoB,CAAC,KAAgC;;IACnE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAsB,CAAC;IACvE,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IACrE,IAAI,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,KAAK,SAAS,EAAE;QACrD,MAAM,4BAA4B,GAAG,MAAA,KAAK,CAAC,4BAA4B,mCAAI,4BAA4B,CAAC,cAAc,CAAC;QACvH,MAAM,WAAW,GAAG,MAAA,KAAK,CAAC,WAAW,mCAAI,WAAW,CAAC,UAAU,CAAC;QAChE,OAAO,CACL,6BAAK,SAAS,EAAC,mCAAmC;YAChD,oBAAC,0BAA0B,IAAC,QAAQ,EAAE,YAAY,GAAI;YACrD,SAAS,CAAC,CAAC;gBACV,oBAAC,YAAY,IACX,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,SAAS,EAChB,UAAU,EAAE,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,EAC/C,WAAW,EAAE,CAAC,GAAG,CAAC,EAClB,4BAA4B,EAAE,4BAA4B,GAC1D,CAAC,CAAC,CAAC,IAAI,CACP,CACP,CAAC;KACH;IACD,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Favorite\n */\n\nimport * as React from \"react\";\nimport { Orientation, ResizableContainerObserver } from \"@itwin/core-react\";\nimport { PropertyValueRendererManager } from \"../properties/ValueRendererManager\";\nimport { PropertyList } from \"../propertygrid/component/PropertyList\";\nimport { PropertyData } from \"../propertygrid/PropertyDataProvider\";\n\n/** Properties for [[FavoritePropertyList]] React component\n * @alpha\n */\nexport interface FavoritePropertyListProps {\n  propertyData: PropertyData;\n  propertyValueRendererManager?: PropertyValueRendererManager;\n  orientation?: Orientation;\n}\n\n/** Favorite Property List React component\n * @alpha\n */\nexport function FavoritePropertyList(props: FavoritePropertyListProps) {\n  const [listWidth, setListWidth] = React.useState<number | undefined>();\n  const onListResize = React.useCallback(setListWidth, [setListWidth]);\n  if (props.propertyData.records.Favorite !== undefined) {\n    const propertyValueRendererManager = props.propertyValueRendererManager ?? PropertyValueRendererManager.defaultManager;\n    const orientation = props.orientation ?? Orientation.Horizontal;\n    return (\n      <div className=\"components-favorite-property-list\">\n        <ResizableContainerObserver onResize={onListResize} />\n        {listWidth ?\n          <PropertyList\n            orientation={orientation}\n            width={listWidth}\n            properties={props.propertyData.records.Favorite}\n            columnRatio={1 / 3}\n            propertyValueRendererManager={propertyValueRendererManager}\n          /> : null}\n      </div>\n    );\n  }\n  return null;\n}\n"]}
+{"version":3,"file":"FavoritePropertyList.js","sourceRoot":"","sources":["../../../../src/components-react/favorite/FavoritePropertyList.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,0BAA0B,EAAE,MAAM,mBAAmB,CAAC;AAC5E,OAAO,EAAE,4BAA4B,EAAE,MAAM,oCAAoC,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAYtE;;GAEG;AACH,MAAM,UAAU,oBAAoB,CAAC,KAAgC;;IACnE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,EAAsB,CAAC;IACvE,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CAAC,YAAY,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IACrE,IAAI,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,KAAK,SAAS,EAAE;QACrD,MAAM,4BAA4B,GAAG,MAAA,KAAK,CAAC,4BAA4B,mCAAI,4BAA4B,CAAC,cAAc,CAAC;QACvH,MAAM,WAAW,GAAG,MAAA,KAAK,CAAC,WAAW,mCAAI,WAAW,CAAC,UAAU,CAAC;QAChE,OAAO,CACL,6BAAK,SAAS,EAAC,mCAAmC;YAChD,oBAAC,0BAA0B,IAAC,QAAQ,EAAE,YAAY,GAAI;YACrD,SAAS,CAAC,CAAC;gBACV,oBAAC,YAAY,IACX,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,SAAS,EAChB,UAAU,EAAE,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,EAC/C,WAAW,EAAE,CAAC,GAAG,CAAC,EAClB,4BAA4B,EAAE,4BAA4B,GAC1D,CAAC,CAAC,CAAC,IAAI,CACP,CACP,CAAC;KACH;IACD,OAAO,IAAI,CAAC;AACd,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 Favorite\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { Orientation, ResizableContainerObserver } from \"@itwin/core-react\";\r\nimport { PropertyValueRendererManager } from \"../properties/ValueRendererManager\";\r\nimport { PropertyList } from \"../propertygrid/component/PropertyList\";\r\nimport { PropertyData } from \"../propertygrid/PropertyDataProvider\";\r\n\r\n/** Properties for [[FavoritePropertyList]] React component\r\n * @alpha\r\n */\r\nexport interface FavoritePropertyListProps {\r\n  propertyData: PropertyData;\r\n  propertyValueRendererManager?: PropertyValueRendererManager;\r\n  orientation?: Orientation;\r\n}\r\n\r\n/** Favorite Property List React component\r\n * @alpha\r\n */\r\nexport function FavoritePropertyList(props: FavoritePropertyListProps) {\r\n  const [listWidth, setListWidth] = React.useState<number | undefined>();\r\n  const onListResize = React.useCallback(setListWidth, [setListWidth]);\r\n  if (props.propertyData.records.Favorite !== undefined) {\r\n    const propertyValueRendererManager = props.propertyValueRendererManager ?? PropertyValueRendererManager.defaultManager;\r\n    const orientation = props.orientation ?? Orientation.Horizontal;\r\n    return (\r\n      <div className=\"components-favorite-property-list\">\r\n        <ResizableContainerObserver onResize={onListResize} />\r\n        {listWidth ?\r\n          <PropertyList\r\n            orientation={orientation}\r\n            width={listWidth}\r\n            properties={props.propertyData.records.Favorite}\r\n            columnRatio={1 / 3}\r\n            propertyValueRendererManager={propertyValueRendererManager}\r\n          /> : null}\r\n      </div>\r\n    );\r\n  }\r\n  return null;\r\n}\r\n"]}

package/lib/esm/components-react/filter-builder/FilterBuilder.d.ts

@@ -1,38 +1,38 @@
-/** @packageDocumentation
- * @module PropertyFilterBuilder
- */
-import * as React from "react";
-import { PropertyDescription } from "@itwin/appui-abstract";
-import { PropertyFilterBuilderRuleOperatorProps } from "./FilterBuilderRuleOperator";
-import { PropertyFilterBuilderRuleValueProps } from "./FilterBuilderRuleValue";
-import { PropertyFilter } from "./Types";
-/**
- * Props for [[PropertyFilterBuilder]] component.
- * @beta
- */
-export interface PropertyFilterBuilderProps {
-    /** List of properties available to be used in filter rules. */
-    properties: PropertyDescription[];
-    /** Callback that is invoked when filter changes. */
-    onFilterChanged: (filter?: PropertyFilter) => void;
-    /** Callback that is invoked when property is selected in any rule. */
-    onRulePropertySelected?: (property: PropertyDescription) => void;
-    /** Custom renderer for rule operator selector. */
-    ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;
-    /** Custom renderer for rule value input. */
-    ruleValueRenderer?: (props: PropertyFilterBuilderRuleValueProps) => React.ReactNode;
-    /** Custom renderer for property selector in rule. */
-    propertyRenderer?: (name: string) => React.ReactNode;
-    /** Specifies how deep rule groups can be nested. */
-    ruleGroupDepthLimit?: number;
-    /** Specifies whether component is disabled or not. */
-    isDisabled?: boolean;
-    /** Initial filter that should be shown when component is mounted. */
-    initialFilter?: PropertyFilter;
-}
-/**
- * Component for building complex filters. It allows to create filter rules or rule groups based on provided list of properties.
- * @beta
- */
-export declare function PropertyFilterBuilder(props: PropertyFilterBuilderProps): JSX.Element;
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
+import * as React from "react";
+import { PropertyDescription } from "@itwin/appui-abstract";
+import { PropertyFilterBuilderRuleOperatorProps } from "./FilterBuilderRuleOperator";
+import { PropertyFilterBuilderRuleValueProps } from "./FilterBuilderRuleValue";
+import { PropertyFilter } from "./Types";
+/**
+ * Props for [[PropertyFilterBuilder]] component.
+ * @beta
+ */
+export interface PropertyFilterBuilderProps {
+    /** List of properties available to be used in filter rules. */
+    properties: PropertyDescription[];
+    /** Callback that is invoked when filter changes. */
+    onFilterChanged: (filter?: PropertyFilter) => void;
+    /** Callback that is invoked when property is selected in any rule. */
+    onRulePropertySelected?: (property: PropertyDescription) => void;
+    /** Custom renderer for rule operator selector. */
+    ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;
+    /** Custom renderer for rule value input. */
+    ruleValueRenderer?: (props: PropertyFilterBuilderRuleValueProps) => React.ReactNode;
+    /** Custom renderer for property selector in rule. */
+    propertyRenderer?: (name: string) => React.ReactNode;
+    /** Specifies how deep rule groups can be nested. */
+    ruleGroupDepthLimit?: number;
+    /** Specifies whether component is disabled or not. */
+    isDisabled?: boolean;
+    /** Initial filter that should be shown when component is mounted. */
+    initialFilter?: PropertyFilter;
+}
+/**
+ * Component for building complex filters. It allows to create filter rules or rule groups based on provided list of properties.
+ * @beta
+ */
+export declare function PropertyFilterBuilder(props: PropertyFilterBuilderProps): JSX.Element;
 //# sourceMappingURL=FilterBuilder.d.ts.map

package/lib/esm/components-react/filter-builder/FilterBuilder.js

@@ -1,36 +1,36 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module PropertyFilterBuilder
- */
-import * as React from "react";
-import { ActiveRuleGroupContext, PropertyFilterBuilderContext, PropertyFilterBuilderRuleRenderingContext, useActiveRuleGroupContextProps, } from "./FilterBuilderContext";
-import { PropertyFilterBuilderRuleGroupRenderer } from "./FilterBuilderRuleGroup";
-import { buildPropertyFilter, usePropertyFilterBuilderState } from "./FilterBuilderState";
-const ROOT_GROUP_PATH = [];
-/**
- * Component for building complex filters. It allows to create filter rules or rule groups based on provided list of properties.
- * @beta
- */
-export function PropertyFilterBuilder(props) {
-    const { properties, onFilterChanged, onRulePropertySelected, ruleOperatorRenderer, ruleValueRenderer, ruleGroupDepthLimit, propertyRenderer, isDisabled, initialFilter } = props;
-    const { state, actions } = usePropertyFilterBuilderState(initialFilter);
-    const rootRef = React.useRef(null);
-    const firstRender = React.useRef(true);
-    const filter = React.useMemo(() => buildPropertyFilter(state.rootGroup), [state]);
-    React.useEffect(() => {
-        if (!firstRender.current)
-            onFilterChanged(filter);
-        firstRender.current = false;
-    }, [filter, onFilterChanged]);
-    const contextValue = React.useMemo(() => ({ actions, properties, onRulePropertySelected, ruleGroupDepthLimit }), [actions, properties, onRulePropertySelected, ruleGroupDepthLimit]);
-    const renderingContextValue = React.useMemo(() => ({ ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled }), [ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled]);
-    return (React.createElement(PropertyFilterBuilderRuleRenderingContext.Provider, { value: renderingContextValue },
-        React.createElement(PropertyFilterBuilderContext.Provider, { value: contextValue },
-            React.createElement(ActiveRuleGroupContext.Provider, { value: useActiveRuleGroupContextProps(rootRef) },
-                React.createElement("div", { ref: rootRef, className: "filter-builder" },
-                    React.createElement(PropertyFilterBuilderRuleGroupRenderer, { path: ROOT_GROUP_PATH, group: state.rootGroup }))))));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
+import * as React from "react";
+import { ActiveRuleGroupContext, PropertyFilterBuilderContext, PropertyFilterBuilderRuleRenderingContext, useActiveRuleGroupContextProps, } from "./FilterBuilderContext";
+import { PropertyFilterBuilderRuleGroupRenderer } from "./FilterBuilderRuleGroup";
+import { buildPropertyFilter, usePropertyFilterBuilderState } from "./FilterBuilderState";
+const ROOT_GROUP_PATH = [];
+/**
+ * Component for building complex filters. It allows to create filter rules or rule groups based on provided list of properties.
+ * @beta
+ */
+export function PropertyFilterBuilder(props) {
+    const { properties, onFilterChanged, onRulePropertySelected, ruleOperatorRenderer, ruleValueRenderer, ruleGroupDepthLimit, propertyRenderer, isDisabled, initialFilter } = props;
+    const { state, actions } = usePropertyFilterBuilderState(initialFilter);
+    const rootRef = React.useRef(null);
+    const firstRender = React.useRef(true);
+    const filter = React.useMemo(() => buildPropertyFilter(state.rootGroup), [state]);
+    React.useEffect(() => {
+        if (!firstRender.current)
+            onFilterChanged(filter);
+        firstRender.current = false;
+    }, [filter, onFilterChanged]);
+    const contextValue = React.useMemo(() => ({ actions, properties, onRulePropertySelected, ruleGroupDepthLimit }), [actions, properties, onRulePropertySelected, ruleGroupDepthLimit]);
+    const renderingContextValue = React.useMemo(() => ({ ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled }), [ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled]);
+    return (React.createElement(PropertyFilterBuilderRuleRenderingContext.Provider, { value: renderingContextValue },
+        React.createElement(PropertyFilterBuilderContext.Provider, { value: contextValue },
+            React.createElement(ActiveRuleGroupContext.Provider, { value: useActiveRuleGroupContextProps(rootRef) },
+                React.createElement("div", { ref: rootRef, className: "filter-builder" },
+                    React.createElement(PropertyFilterBuilderRuleGroupRenderer, { path: ROOT_GROUP_PATH, group: state.rootGroup }))))));
+}
 //# sourceMappingURL=FilterBuilder.js.map

package/lib/esm/components-react/filter-builder/FilterBuilder.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBuilder.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilder.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,sBAAsB,EAAE,4BAA4B,EAAqC,yCAAyC,EAClF,8BAA8B,GAC/E,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,sCAAsC,EAAE,MAAM,0BAA0B,CAAC;AAGlF,OAAO,EAAE,mBAAmB,EAAE,6BAA6B,EAAE,MAAM,sBAAsB,CAAC;AA4B1F,MAAM,eAAe,GAAa,EAAE,CAAC;AAErC;;;GAGG;AACH,MAAM,UAAU,qBAAqB,CAAC,KAAiC;IACrE,MAAM,EAAE,UAAU,EAAE,eAAe,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IACjL,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,6BAA6B,CAAC,aAAa,CAAC,CAAC;IACxE,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEnD,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAClF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,WAAW,CAAC,OAAO;YACtB,eAAe,CAAC,MAAM,CAAC,CAAC;QAC1B,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC;IAC9B,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC;IAE9B,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAChC,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,sBAAsB,EAAE,mBAAmB,EAAE,CAAC,EAC5E,CAAC,OAAO,EAAE,UAAU,EAAE,sBAAsB,EAAE,mBAAmB,CAAC,CACnE,CAAC;IACF,MAAM,qBAAqB,GAAG,KAAK,CAAC,OAAO,CACzC,GAAG,EAAE,CAAC,CAAC,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,UAAU,EAAE,CAAC,EACjF,CAAC,oBAAoB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,UAAU,CAAC,CACxE,CAAC;IACF,OAAO,CACL,oBAAC,yCAAyC,CAAC,QAAQ,IAAC,KAAK,EAAE,qBAAqB;QAC9E,oBAAC,4BAA4B,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY;YACxD,oBAAC,sBAAsB,CAAC,QAAQ,IAAC,KAAK,EAAE,8BAA8B,CAAC,OAAO,CAAC;gBAC7E,6BAAK,GAAG,EAAE,OAAO,EAAE,SAAS,EAAC,gBAAgB;oBAC3C,oBAAC,sCAAsC,IAAC,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,CAAC,SAAS,GAAI,CACrF,CAC0B,CACI,CACW,CACtD,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyFilterBuilder\n */\n\nimport * as React from \"react\";\nimport { PropertyDescription } from \"@itwin/appui-abstract\";\nimport {\n  ActiveRuleGroupContext, PropertyFilterBuilderContext, PropertyFilterBuilderContextProps, PropertyFilterBuilderRuleRenderingContext,\n  PropertyFilterBuilderRuleRenderingContextProps, useActiveRuleGroupContextProps,\n} from \"./FilterBuilderContext\";\nimport { PropertyFilterBuilderRuleGroupRenderer } from \"./FilterBuilderRuleGroup\";\nimport { PropertyFilterBuilderRuleOperatorProps } from \"./FilterBuilderRuleOperator\";\nimport { PropertyFilterBuilderRuleValueProps } from \"./FilterBuilderRuleValue\";\nimport { buildPropertyFilter, usePropertyFilterBuilderState } from \"./FilterBuilderState\";\nimport { PropertyFilter } from \"./Types\";\n\n/**\n * Props for [[PropertyFilterBuilder]] component.\n * @beta\n */\nexport interface PropertyFilterBuilderProps {\n  /** List of properties available to be used in filter rules. */\n  properties: PropertyDescription[];\n  /** Callback that is invoked when filter changes. */\n  onFilterChanged: (filter?: PropertyFilter) => void;\n  /** Callback that is invoked when property is selected in any rule. */\n  onRulePropertySelected?: (property: PropertyDescription) => void;\n  /** Custom renderer for rule operator selector. */\n  ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;\n  /** Custom renderer for rule value input. */\n  ruleValueRenderer?: (props: PropertyFilterBuilderRuleValueProps) => React.ReactNode;\n  /** Custom renderer for property selector in rule. */\n  propertyRenderer?: (name: string) => React.ReactNode;\n  /** Specifies how deep rule groups can be nested. */\n  ruleGroupDepthLimit?: number;\n  /** Specifies whether component is disabled or not. */\n  isDisabled?: boolean;\n  /** Initial filter that should be shown when component is mounted. */\n  initialFilter?: PropertyFilter;\n}\n\nconst ROOT_GROUP_PATH: string[] = [];\n\n/**\n * Component for building complex filters. It allows to create filter rules or rule groups based on provided list of properties.\n * @beta\n */\nexport function PropertyFilterBuilder(props: PropertyFilterBuilderProps) {\n  const { properties, onFilterChanged, onRulePropertySelected, ruleOperatorRenderer, ruleValueRenderer, ruleGroupDepthLimit, propertyRenderer, isDisabled, initialFilter } = props;\n  const { state, actions } = usePropertyFilterBuilderState(initialFilter);\n  const rootRef = React.useRef<HTMLDivElement>(null);\n\n  const firstRender = React.useRef(true);\n  const filter = React.useMemo(() => buildPropertyFilter(state.rootGroup), [state]);\n  React.useEffect(() => {\n    if (!firstRender.current)\n      onFilterChanged(filter);\n    firstRender.current = false;\n  }, [filter, onFilterChanged]);\n\n  const contextValue = React.useMemo<PropertyFilterBuilderContextProps>(\n    () => ({ actions, properties, onRulePropertySelected, ruleGroupDepthLimit }),\n    [actions, properties, onRulePropertySelected, ruleGroupDepthLimit]\n  );\n  const renderingContextValue = React.useMemo<PropertyFilterBuilderRuleRenderingContextProps>(\n    () => ({ ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled }),\n    [ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled]\n  );\n  return (\n    <PropertyFilterBuilderRuleRenderingContext.Provider value={renderingContextValue}>\n      <PropertyFilterBuilderContext.Provider value={contextValue}>\n        <ActiveRuleGroupContext.Provider value={useActiveRuleGroupContextProps(rootRef)}>\n          <div ref={rootRef} className=\"filter-builder\">\n            <PropertyFilterBuilderRuleGroupRenderer path={ROOT_GROUP_PATH} group={state.rootGroup} />\n          </div>\n        </ActiveRuleGroupContext.Provider>\n      </PropertyFilterBuilderContext.Provider>\n    </PropertyFilterBuilderRuleRenderingContext.Provider>\n  );\n}\n"]}
+{"version":3,"file":"FilterBuilder.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilder.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,sBAAsB,EAAE,4BAA4B,EAAqC,yCAAyC,EAClF,8BAA8B,GAC/E,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,sCAAsC,EAAE,MAAM,0BAA0B,CAAC;AAGlF,OAAO,EAAE,mBAAmB,EAAE,6BAA6B,EAAE,MAAM,sBAAsB,CAAC;AA4B1F,MAAM,eAAe,GAAa,EAAE,CAAC;AAErC;;;GAGG;AACH,MAAM,UAAU,qBAAqB,CAAC,KAAiC;IACrE,MAAM,EAAE,UAAU,EAAE,eAAe,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IACjL,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,6BAA6B,CAAC,aAAa,CAAC,CAAC;IACxE,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEnD,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAClF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,WAAW,CAAC,OAAO;YACtB,eAAe,CAAC,MAAM,CAAC,CAAC;QAC1B,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC;IAC9B,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC;IAE9B,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAChC,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,sBAAsB,EAAE,mBAAmB,EAAE,CAAC,EAC5E,CAAC,OAAO,EAAE,UAAU,EAAE,sBAAsB,EAAE,mBAAmB,CAAC,CACnE,CAAC;IACF,MAAM,qBAAqB,GAAG,KAAK,CAAC,OAAO,CACzC,GAAG,EAAE,CAAC,CAAC,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,UAAU,EAAE,CAAC,EACjF,CAAC,oBAAoB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,UAAU,CAAC,CACxE,CAAC;IACF,OAAO,CACL,oBAAC,yCAAyC,CAAC,QAAQ,IAAC,KAAK,EAAE,qBAAqB;QAC9E,oBAAC,4BAA4B,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY;YACxD,oBAAC,sBAAsB,CAAC,QAAQ,IAAC,KAAK,EAAE,8BAA8B,CAAC,OAAO,CAAC;gBAC7E,6BAAK,GAAG,EAAE,OAAO,EAAE,SAAS,EAAC,gBAAgB;oBAC3C,oBAAC,sCAAsC,IAAC,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,CAAC,SAAS,GAAI,CACrF,CAC0B,CACI,CACW,CACtD,CAAC;AACJ,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 PropertyFilterBuilder\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { PropertyDescription } from \"@itwin/appui-abstract\";\r\nimport {\r\n  ActiveRuleGroupContext, PropertyFilterBuilderContext, PropertyFilterBuilderContextProps, PropertyFilterBuilderRuleRenderingContext,\r\n  PropertyFilterBuilderRuleRenderingContextProps, useActiveRuleGroupContextProps,\r\n} from \"./FilterBuilderContext\";\r\nimport { PropertyFilterBuilderRuleGroupRenderer } from \"./FilterBuilderRuleGroup\";\r\nimport { PropertyFilterBuilderRuleOperatorProps } from \"./FilterBuilderRuleOperator\";\r\nimport { PropertyFilterBuilderRuleValueProps } from \"./FilterBuilderRuleValue\";\r\nimport { buildPropertyFilter, usePropertyFilterBuilderState } from \"./FilterBuilderState\";\r\nimport { PropertyFilter } from \"./Types\";\r\n\r\n/**\r\n * Props for [[PropertyFilterBuilder]] component.\r\n * @beta\r\n */\r\nexport interface PropertyFilterBuilderProps {\r\n  /** List of properties available to be used in filter rules. */\r\n  properties: PropertyDescription[];\r\n  /** Callback that is invoked when filter changes. */\r\n  onFilterChanged: (filter?: PropertyFilter) => void;\r\n  /** Callback that is invoked when property is selected in any rule. */\r\n  onRulePropertySelected?: (property: PropertyDescription) => void;\r\n  /** Custom renderer for rule operator selector. */\r\n  ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;\r\n  /** Custom renderer for rule value input. */\r\n  ruleValueRenderer?: (props: PropertyFilterBuilderRuleValueProps) => React.ReactNode;\r\n  /** Custom renderer for property selector in rule. */\r\n  propertyRenderer?: (name: string) => React.ReactNode;\r\n  /** Specifies how deep rule groups can be nested. */\r\n  ruleGroupDepthLimit?: number;\r\n  /** Specifies whether component is disabled or not. */\r\n  isDisabled?: boolean;\r\n  /** Initial filter that should be shown when component is mounted. */\r\n  initialFilter?: PropertyFilter;\r\n}\r\n\r\nconst ROOT_GROUP_PATH: string[] = [];\r\n\r\n/**\r\n * Component for building complex filters. It allows to create filter rules or rule groups based on provided list of properties.\r\n * @beta\r\n */\r\nexport function PropertyFilterBuilder(props: PropertyFilterBuilderProps) {\r\n  const { properties, onFilterChanged, onRulePropertySelected, ruleOperatorRenderer, ruleValueRenderer, ruleGroupDepthLimit, propertyRenderer, isDisabled, initialFilter } = props;\r\n  const { state, actions } = usePropertyFilterBuilderState(initialFilter);\r\n  const rootRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const firstRender = React.useRef(true);\r\n  const filter = React.useMemo(() => buildPropertyFilter(state.rootGroup), [state]);\r\n  React.useEffect(() => {\r\n    if (!firstRender.current)\r\n      onFilterChanged(filter);\r\n    firstRender.current = false;\r\n  }, [filter, onFilterChanged]);\r\n\r\n  const contextValue = React.useMemo<PropertyFilterBuilderContextProps>(\r\n    () => ({ actions, properties, onRulePropertySelected, ruleGroupDepthLimit }),\r\n    [actions, properties, onRulePropertySelected, ruleGroupDepthLimit]\r\n  );\r\n  const renderingContextValue = React.useMemo<PropertyFilterBuilderRuleRenderingContextProps>(\r\n    () => ({ ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled }),\r\n    [ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled]\r\n  );\r\n  return (\r\n    <PropertyFilterBuilderRuleRenderingContext.Provider value={renderingContextValue}>\r\n      <PropertyFilterBuilderContext.Provider value={contextValue}>\r\n        <ActiveRuleGroupContext.Provider value={useActiveRuleGroupContextProps(rootRef)}>\r\n          <div ref={rootRef} className=\"filter-builder\">\r\n            <PropertyFilterBuilderRuleGroupRenderer path={ROOT_GROUP_PATH} group={state.rootGroup} />\r\n          </div>\r\n        </ActiveRuleGroupContext.Provider>\r\n      </PropertyFilterBuilderContext.Provider>\r\n    </PropertyFilterBuilderRuleRenderingContext.Provider>\r\n  );\r\n}\r\n"]}