@itwin/components-react 4.0.0-dev.2 → 4.0.0-dev.21

package/lib/cjs/components-react/filter-builder/FilterBuilderRule.js

@@ -1,7 +1,18 @@
 "use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -20,24 +31,23 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PropertyFilterBuilderRuleRenderer = void 0;
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+require("./FilterBuilderRule.scss");
 const React = __importStar(require("react"));
 const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
 const itwinui_react_1 = require("@itwin/itwinui-react");
-const FilterBuilder_1 = require("./FilterBuilder");
+const FilterBuilderContext_1 = require("./FilterBuilderContext");
 const FilterBuilderRuleOperator_1 = require("./FilterBuilderRuleOperator");
 const FilterBuilderRuleProperty_1 = require("./FilterBuilderRuleProperty");
 const FilterBuilderRuleValue_1 = require("./FilterBuilderRuleValue");
 const Operators_1 = require("./Operators");
-require("./FilterBuilderRule.scss");
-/** @alpha */
+/**
+ * Component that renders single rule in [[PropertyFilterBuilder]] component.
+ * @internal
+ */
 function PropertyFilterBuilderRuleRenderer(props) {
     const { path, rule } = props;
-    const { properties, actions, onRulePropertySelected } = React.useContext(FilterBuilder_1.PropertyFilterBuilderContext);
-    const { ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, disablePropertySelection } = React.useContext(FilterBuilder_1.PropertyFilterBuilderRuleRenderingContext);
+    const { properties, actions, onRulePropertySelected } = React.useContext(FilterBuilderContext_1.PropertyFilterBuilderContext);
+    const { ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled } = React.useContext(FilterBuilderContext_1.PropertyFilterBuilderRuleRenderingContext);
     const { property, operator, value } = rule;
     const onSelectedPropertyChanged = React.useCallback((newProperty) => {
         actions.setRuleProperty(path, newProperty);
@@ -68,9 +78,13 @@ function PropertyFilterBuilderRuleRenderer(props) {
             React.createElement(itwinui_react_1.IconButton, { onClick: removeRule, styleType: "borderless", size: "small" },
                 React.createElement(itwinui_icons_react_1.SvgDelete, null))),
         React.createElement("div", { className: "rule-condition" },
-            React.createElement(FilterBuilderRuleProperty_1.PropertyFilterBuilderRuleProperty, { properties: properties, selectedProperty: rule.property, onSelectedPropertyChanged: onSelectedPropertyChanged, propertyRenderer: propertyRenderer, isDisabled: disablePropertySelection }),
-            property && operatorRenderer(property),
-            property && operator && !(0, Operators_1.isUnaryPropertyFilterOperator)(operator) && valueRenderer(property)));
+            React.createElement(FilterBuilderRuleProperty_1.PropertyFilterBuilderRuleProperty, { properties: properties, selectedProperty: rule.property, onSelectedPropertyChanged: onSelectedPropertyChanged, propertyRenderer: propertyRenderer, isDisabled: isDisabled }),
+            property !== undefined
+                ? operatorRenderer(property)
+                : null,
+            property !== undefined && operator !== undefined && !(0, Operators_1.isUnaryPropertyFilterOperator)(operator)
+                ? valueRenderer(property)
+                : null));
 }
 exports.PropertyFilterBuilderRuleRenderer = PropertyFilterBuilderRuleRenderer;
 //# sourceMappingURL=FilterBuilderRule.js.map

package/lib/cjs/components-react/filter-builder/FilterBuilderRule.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBuilderRule.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRule.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*--------------------------------------------------------------------------------------------*/\nimport * as React from \"react\";\nimport { PropertyDescription, PropertyValue } from \"@itwin/appui-abstract\";\nimport { SvgDelete } from \"@itwin/itwinui-icons-react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport { PropertyFilterBuilderContext, PropertyFilterBuilderRuleRenderingContext } from \"./FilterBuilder\";\nimport { PropertyFilterBuilderRuleOperator } from \"./FilterBuilderRuleOperator\";\nimport { PropertyFilterBuilderRuleProperty } from \"./FilterBuilderRuleProperty\";\nimport { PropertyFilterBuilderRuleValue } from \"./FilterBuilderRuleValue\";\nimport { PropertyFilterBuilderRule } from \"./FilterBuilderState\";\nimport { isUnaryPropertyFilterOperator, PropertyFilterRuleOperator } from \"./Operators\";\nimport \"./FilterBuilderRule.scss\";\n\n/** @alpha */\nexport interface PropertyFilterBuilderRuleRendererProps {\n  path: string[];\n  rule: PropertyFilterBuilderRule;\n}\n\n/** @alpha */\nexport function PropertyFilterBuilderRuleRenderer(props: PropertyFilterBuilderRuleRendererProps) {\n  const { path, rule } = props;\n  const { properties, actions, onRulePropertySelected } = React.useContext(PropertyFilterBuilderContext);\n  const { ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, disablePropertySelection } = React.useContext(PropertyFilterBuilderRuleRenderingContext);\n  const { property, operator, value } = rule;\n\n  const onSelectedPropertyChanged = React.useCallback((newProperty?: PropertyDescription) => {\n    actions.setRuleProperty(path, newProperty);\n    // invoke 'onRulePropertySelected' when new property is selected. There is no way to deselect property\n    // so 'newProperty' will be 'undefined' only if selected property is no longer in 'properties' list.\n    if (onRulePropertySelected && newProperty)\n      onRulePropertySelected(newProperty);\n  }, [path, onRulePropertySelected, actions]);\n\n  const onRuleOperatorChange = React.useCallback((newOperator: PropertyFilterRuleOperator) => {\n    actions.setRuleOperator(path, newOperator);\n  }, [path, actions]);\n\n  const onRuleValueChange = React.useCallback((newValue: PropertyValue) => {\n    actions.setRuleValue(path, newValue);\n  }, [path, actions]);\n\n  const removeRule = () => actions.removeItem(path);\n\n  const operatorRenderer = React.useCallback((prop: PropertyDescription) => {\n    if (ruleOperatorRenderer)\n      return ruleOperatorRenderer({ property: prop, operator, onChange: onRuleOperatorChange });\n    return <PropertyFilterBuilderRuleOperator property={prop} onChange={onRuleOperatorChange} operator={operator} />;\n  }, [operator, ruleOperatorRenderer, onRuleOperatorChange]);\n\n  const valueRenderer = React.useCallback((prop: PropertyDescription) => {\n    if (ruleValueRenderer)\n      return ruleValueRenderer({ property: prop, value, onChange: onRuleValueChange });\n    return <PropertyFilterBuilderRuleValue property={prop} onChange={onRuleValueChange} value={value} />;\n  }, [value, ruleValueRenderer, onRuleValueChange]);\n\n  return <div className=\"rule\">\n    <div className=\"rule-remove-action\">\n      <IconButton onClick={removeRule} styleType=\"borderless\" size=\"small\">\n        <SvgDelete />\n      </IconButton>\n    </div>\n    <div className=\"rule-condition\">\n      <PropertyFilterBuilderRuleProperty\n        properties={properties}\n        selectedProperty={rule.property}\n        onSelectedPropertyChanged={onSelectedPropertyChanged}\n        propertyRenderer={propertyRenderer}\n        isDisabled={disablePropertySelection}\n      />\n      {property && operatorRenderer(property)}\n      {property && operator && !isUnaryPropertyFilterOperator(operator) && valueRenderer(property)}\n    </div>\n  </div>;\n}\n"]}
+{"version":3,"file":"FilterBuilderRule.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRule.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 PropertyFilterBuilder\r\n */\r\n\r\nimport \"./FilterBuilderRule.scss\";\r\nimport * as React from \"react\";\r\nimport { PropertyDescription, PropertyValue } from \"@itwin/appui-abstract\";\r\nimport { SvgDelete } from \"@itwin/itwinui-icons-react\";\r\nimport { IconButton } from \"@itwin/itwinui-react\";\r\nimport { PropertyFilterBuilderContext, PropertyFilterBuilderRuleRenderingContext } from \"./FilterBuilderContext\";\r\nimport { PropertyFilterBuilderRuleOperator } from \"./FilterBuilderRuleOperator\";\r\nimport { PropertyFilterBuilderRuleProperty } from \"./FilterBuilderRuleProperty\";\r\nimport { PropertyFilterBuilderRuleValue } from \"./FilterBuilderRuleValue\";\r\nimport { PropertyFilterBuilderRule } from \"./FilterBuilderState\";\r\nimport { isUnaryPropertyFilterOperator, PropertyFilterRuleOperator } from \"./Operators\";\r\n\r\n/**\r\n * Props for [[PropertyFilterBuilderRuleRenderer]] component.\r\n * @internal\r\n */\r\nexport interface PropertyFilterBuilderRuleRendererProps {\r\n  /** Path from [[PropertyFilterBuilder]] root to this rule. */\r\n  path: string[];\r\n  /** Rule to render. */\r\n  rule: PropertyFilterBuilderRule;\r\n}\r\n\r\n/**\r\n * Component that renders single rule in [[PropertyFilterBuilder]] component.\r\n * @internal\r\n */\r\nexport function PropertyFilterBuilderRuleRenderer(props: PropertyFilterBuilderRuleRendererProps) {\r\n  const { path, rule } = props;\r\n  const { properties, actions, onRulePropertySelected } = React.useContext(PropertyFilterBuilderContext);\r\n  const { ruleOperatorRenderer, ruleValueRenderer, propertyRenderer, isDisabled } = React.useContext(PropertyFilterBuilderRuleRenderingContext);\r\n  const { property, operator, value } = rule;\r\n\r\n  const onSelectedPropertyChanged = React.useCallback((newProperty?: PropertyDescription) => {\r\n    actions.setRuleProperty(path, newProperty);\r\n    // invoke 'onRulePropertySelected' when new property is selected. There is no way to deselect property\r\n    // so 'newProperty' will be 'undefined' only if selected property is no longer in 'properties' list.\r\n    if (onRulePropertySelected && newProperty)\r\n      onRulePropertySelected(newProperty);\r\n  }, [path, onRulePropertySelected, actions]);\r\n\r\n  const onRuleOperatorChange = React.useCallback((newOperator: PropertyFilterRuleOperator) => {\r\n    actions.setRuleOperator(path, newOperator);\r\n  }, [path, actions]);\r\n\r\n  const onRuleValueChange = React.useCallback((newValue: PropertyValue) => {\r\n    actions.setRuleValue(path, newValue);\r\n  }, [path, actions]);\r\n\r\n  const removeRule = () => actions.removeItem(path);\r\n\r\n  const operatorRenderer = React.useCallback((prop: PropertyDescription) => {\r\n    if (ruleOperatorRenderer)\r\n      return ruleOperatorRenderer({ property: prop, operator, onChange: onRuleOperatorChange });\r\n    return <PropertyFilterBuilderRuleOperator property={prop} onChange={onRuleOperatorChange} operator={operator} />;\r\n  }, [operator, ruleOperatorRenderer, onRuleOperatorChange]);\r\n\r\n  const valueRenderer = React.useCallback((prop: PropertyDescription) => {\r\n    if (ruleValueRenderer)\r\n      return ruleValueRenderer({ property: prop, value, onChange: onRuleValueChange });\r\n    return <PropertyFilterBuilderRuleValue property={prop} onChange={onRuleValueChange} value={value} />;\r\n  }, [value, ruleValueRenderer, onRuleValueChange]);\r\n\r\n  return <div className=\"rule\">\r\n    <div className=\"rule-remove-action\">\r\n      <IconButton onClick={removeRule} styleType=\"borderless\" size=\"small\">\r\n        <SvgDelete />\r\n      </IconButton>\r\n    </div>\r\n    <div className=\"rule-condition\">\r\n      <PropertyFilterBuilderRuleProperty\r\n        properties={properties}\r\n        selectedProperty={rule.property}\r\n        onSelectedPropertyChanged={onSelectedPropertyChanged}\r\n        propertyRenderer={propertyRenderer}\r\n        isDisabled={isDisabled}\r\n      />\r\n      {\r\n        property !== undefined\r\n          ? operatorRenderer(property)\r\n          : null\r\n      }\r\n      {\r\n        property !== undefined && operator !== undefined && !isUnaryPropertyFilterOperator(operator)\r\n          ? valueRenderer(property)\r\n          : null\r\n      }\r\n    </div>\r\n  </div>;\r\n}\r\n"]}

package/lib/cjs/components-react/filter-builder/FilterBuilderRule.scss

@@ -1,40 +1,38 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-
-.rule {
-  display: grid;
-  grid-template-columns: min-content auto;
-  padding: 3px 0;
-
-  .rule-condition {
-    display: grid;
-    grid-template-columns: minmax(auto, 500px) 150px minmax(auto, 300px);
-    grid-column-gap: var(--iui-size-m);
-
-    .rule-property .iui-input {
-      padding-top: 1.5px;
-      padding-bottom: 1.5px;
-      min-height: 27px;
-    }
-  }
-
-  .rule-remove-action {
-    padding-right: var(--iui-size-s);
-    visibility: hidden;
-  }
-
-  &:focus-within .rule-remove-action,
-  &:hover .rule-remove-action {
-    visibility: visible;
-  }
-}
-
-.rule-group-items > .rule {
-  padding-bottom: 14px;
-
-  &:first-child {
-    padding-top: 14px;
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+
+.rule {
+  display: grid;
+  grid-template-columns: min-content auto;
+  padding: 3px 0;
+
+  .rule-condition {
+    display: grid;
+    grid-template-columns: minmax(auto, 500px) 150px minmax(auto, 300px);
+    grid-column-gap: var(--iui-size-m);
+  }
+
+  .rule-remove-action {
+    padding-right: var(--iui-size-s);
+    visibility: hidden;
+  }
+
+  &:focus-within .rule-remove-action,
+  &:hover .rule-remove-action {
+    visibility: visible;
+  }
+}
+
+.rule-group-items > .rule {
+  padding-bottom: 14px;
+
+  &:first-child {
+    padding-top: 14px;
+  }
+
+  &:only-child {
+    padding-top: 3px;
+  }
+}

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleGroup.d.ts

@@ -1,29 +1,38 @@
-import * as React from "react";
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
+/// <reference types="react" />
+import "./FilterBuilderRuleGroup.scss";
 import { PropertyFilterBuilderRuleGroup } from "./FilterBuilderState";
 import { PropertyFilterRuleGroupOperator } from "./Operators";
-import "./FilterBuilderRuleGroup.scss";
-/** @alpha */
-export interface ActiveRuleGroupContextProps {
-    activeElement: HTMLElement | undefined;
-    onFocus: React.FocusEventHandler<HTMLElement>;
-    onBlur: React.FocusEventHandler<HTMLElement>;
-    onMouseOver: React.MouseEventHandler<HTMLElement>;
-    onMouseOut: React.MouseEventHandler<HTMLElement>;
-}
-/** @alpha */
-export declare const ActiveRuleGroupContext: React.Context<ActiveRuleGroupContextProps>;
-/** @alpha */
+/**
+ * Props for [[PropertyFilterBuilderRuleGroupRenderer]] component.
+ * @internal
+ */
 export interface PropertyFilterBuilderRuleGroupRendererProps {
+    /** Path from [[PropertyFilterBuilder]] root to this rule group. */
     path: string[];
+    /** Rule group to render. */
     group: PropertyFilterBuilderRuleGroup;
 }
-/** @alpha */
+/**
+ * Component that renders group of rules in [[PropertyFilterBuilder]] component.
+ * @internal
+ */
 export declare function PropertyFilterBuilderRuleGroupRenderer(props: PropertyFilterBuilderRuleGroupRendererProps): JSX.Element;
-/** @alpha */
+/**
+ * Props for [[PropertyFilterBuilderRuleGroupOperator]] component.
+ * @internal
+ */
 export interface PropertyFilterBuilderRuleGroupOperatorProps {
+    /** Currently selected operator. */
     operator: PropertyFilterRuleGroupOperator;
+    /** Callback that is invoked when selected operator changes. */
     onChange: (operator: PropertyFilterRuleGroupOperator) => void;
 }
-/** @alpha */
+/**
+ * Component that renders [[PropertyFilterBuilderRuleGroup]] operator selector.
+ * @internal
+ */
 export declare function PropertyFilterBuilderRuleGroupOperator(props: PropertyFilterBuilderRuleGroupOperatorProps): JSX.Element;
 //# sourceMappingURL=FilterBuilderRuleGroup.d.ts.map

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBuilderRuleGroup.d.ts","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRuleGroup.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAoC,8BAA8B,EAAsC,MAAM,sBAAsB,CAAC;AAC5I,OAAO,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,+BAA+B,CAAC;AAEvC,aAAa;AACb,MAAM,WAAW,2BAA2B;IAC1C,aAAa,EAAE,WAAW,GAAG,SAAS,CAAC;IACvC,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC9C,MAAM,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC7C,WAAW,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAClD,UAAU,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAClD;AAED,aAAa;AACb,eAAO,MAAM,sBAAsB,4CAA0D,CAAC;AAE9F,aAAa;AACb,MAAM,WAAW,2CAA2C;IAC1D,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,KAAK,EAAE,8BAA8B,CAAC;CACvC;AAED,aAAa;AACb,wBAAgB,sCAAsC,CAAC,KAAK,EAAE,2CAA2C,eAwCxG;AAED,aAAa;AACb,MAAM,WAAW,2CAA2C;IAC1D,QAAQ,EAAE,+BAA+B,CAAC;IAC1C,QAAQ,EAAE,CAAC,QAAQ,EAAE,+BAA+B,KAAK,IAAI,CAAC;CAC/D;AAED,aAAa;AACb,wBAAgB,sCAAsC,CAAC,KAAK,EAAE,2CAA2C,eAWxG"}
+{"version":3,"file":"FilterBuilderRuleGroup.d.ts","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRuleGroup.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,+BAA+B,CAAC;AAOvC,OAAO,EAAoC,8BAA8B,EAAsC,MAAM,sBAAsB,CAAC;AAC5I,OAAO,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,2CAA2C;IAC1D,mEAAmE;IACnE,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,4BAA4B;IAC5B,KAAK,EAAE,8BAA8B,CAAC;CACvC;AAED;;;GAGG;AACH,wBAAgB,sCAAsC,CAAC,KAAK,EAAE,2CAA2C,eA0CxG;AAED;;;GAGG;AACH,MAAM,WAAW,2CAA2C;IAC1D,mCAAmC;IACnC,QAAQ,EAAE,+BAA+B,CAAC;IAC1C,+DAA+D;IAC/D,QAAQ,EAAE,CAAC,QAAQ,EAAE,+BAA+B,KAAK,IAAI,CAAC;CAC/D;AAED;;;GAGG;AACH,wBAAgB,sCAAsC,CAAC,KAAK,EAAE,2CAA2C,eAWxG"}

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleGroup.js

@@ -1,7 +1,18 @@
 "use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -19,26 +30,23 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PropertyFilterBuilderRuleGroupOperator = exports.PropertyFilterBuilderRuleGroupRenderer = exports.ActiveRuleGroupContext = void 0;
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+exports.PropertyFilterBuilderRuleGroupOperator = exports.PropertyFilterBuilderRuleGroupRenderer = void 0;
+require("./FilterBuilderRuleGroup.scss");
 const React = __importStar(require("react"));
 const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
 const itwinui_react_1 = require("@itwin/itwinui-react");
 const UiComponents_1 = require("../UiComponents");
-const FilterBuilder_1 = require("./FilterBuilder");
+const FilterBuilderContext_1 = require("./FilterBuilderContext");
 const FilterBuilderRule_1 = require("./FilterBuilderRule");
 const FilterBuilderState_1 = require("./FilterBuilderState");
 const Operators_1 = require("./Operators");
-require("./FilterBuilderRuleGroup.scss");
-/** @alpha */
-exports.ActiveRuleGroupContext = React.createContext(null);
-/** @alpha */
+/**
+ * Component that renders group of rules in [[PropertyFilterBuilder]] component.
+ * @internal
+ */
 function PropertyFilterBuilderRuleGroupRenderer(props) {
     const { path, group } = props;
-    const { actions, ruleGroupDepthLimit } = React.useContext(FilterBuilder_1.PropertyFilterBuilderContext);
+    const { actions, ruleGroupDepthLimit } = React.useContext(FilterBuilderContext_1.PropertyFilterBuilderContext);
     const groupRef = React.useRef(null);
     const addRule = () => actions.addItem(path, "RULE");
     const addRuleGroup = () => actions.addItem(path, "RULE_GROUP");
@@ -47,19 +55,23 @@ function PropertyFilterBuilderRuleGroupRenderer(props) {
         actions.setRuleGroupOperator(path, operator);
     }, [path, actions]);
     const allowToAddGroup = ruleGroupDepthLimit === undefined || path.length < ruleGroupDepthLimit;
-    const { activeElement, ...eventHandlers } = React.useContext(exports.ActiveRuleGroupContext);
+    const { activeElement, ...eventHandlers } = React.useContext(FilterBuilderContext_1.ActiveRuleGroupContext);
+    const showOperator = group.items.length > 1;
     return React.createElement("div", { ref: groupRef, className: "rule-group", "data-isactive": groupRef.current === activeElement, ...eventHandlers },
         React.createElement("div", { className: "rule-group-remove-action" }, group.groupId !== undefined && React.createElement(itwinui_react_1.IconButton, { "data-testid": "rule-group-remove", onClick: removeGroup, styleType: "borderless", size: "small" },
             React.createElement(itwinui_icons_react_1.SvgDelete, null))),
         React.createElement("div", { className: "rule-group-content" },
-            React.createElement(PropertyFilterBuilderRuleGroupOperator, { operator: group.operator, onChange: onOperatorChange }),
+            showOperator ? React.createElement(PropertyFilterBuilderRuleGroupOperator, { operator: group.operator, onChange: onOperatorChange }) : null,
             React.createElement("div", { className: "rule-group-items" }, group.items.map((item) => React.createElement(PropertyFilterBuilderGroupOrRule, { key: item.id, path: path, item: item }))),
             React.createElement("div", { className: "rule-group-actions" },
                 React.createElement(itwinui_react_1.Button, { key: "add-rule-button", "data-testid": "rule-group-add-rule", onClick: addRule, styleType: "borderless", size: "small", startIcon: React.createElement(itwinui_icons_react_1.SvgAdd, null) }, UiComponents_1.UiComponents.translate("filterBuilder.rule")),
                 allowToAddGroup && React.createElement(itwinui_react_1.Button, { key: "add-rule-group-button", "data-testid": "rule-group-add-rule-group", onClick: addRuleGroup, styleType: "borderless", size: "small", startIcon: React.createElement(itwinui_icons_react_1.SvgAdd, null) }, UiComponents_1.UiComponents.translate("filterBuilder.ruleGroup")))));
 }
 exports.PropertyFilterBuilderRuleGroupRenderer = PropertyFilterBuilderRuleGroupRenderer;
-/** @alpha */
+/**
+ * Component that renders [[PropertyFilterBuilderRuleGroup]] operator selector.
+ * @internal
+ */
 function PropertyFilterBuilderRuleGroupOperator(props) {
     const { operator, onChange } = props;
     const options = React.useMemo(() => ([

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBuilderRuleGroup.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRuleGroup.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*--------------------------------------------------------------------------------------------*/\nimport * as React from \"react\";\nimport { SvgAdd, SvgDelete } from \"@itwin/itwinui-icons-react\";\nimport { Button, IconButton, Select, SelectOption } from \"@itwin/itwinui-react\";\nimport { UiComponents } from \"../UiComponents\";\nimport { PropertyFilterBuilderContext } from \"./FilterBuilder\";\nimport { PropertyFilterBuilderRuleRenderer } from \"./FilterBuilderRule\";\nimport { isPropertyFilterBuilderRuleGroup, PropertyFilterBuilderRuleGroup, PropertyFilterBuilderRuleGroupItem } from \"./FilterBuilderState\";\nimport { PropertyFilterRuleGroupOperator } from \"./Operators\";\nimport \"./FilterBuilderRuleGroup.scss\";\n\n/** @alpha */\nexport interface ActiveRuleGroupContextProps {\n  activeElement: HTMLElement | undefined;\n  onFocus: React.FocusEventHandler<HTMLElement>;\n  onBlur: React.FocusEventHandler<HTMLElement>;\n  onMouseOver: React.MouseEventHandler<HTMLElement>;\n  onMouseOut: React.MouseEventHandler<HTMLElement>;\n}\n\n/** @alpha */\nexport const ActiveRuleGroupContext = React.createContext<ActiveRuleGroupContextProps>(null!);\n\n/** @alpha */\nexport interface PropertyFilterBuilderRuleGroupRendererProps {\n  path: string[];\n  group: PropertyFilterBuilderRuleGroup;\n}\n\n/** @alpha */\nexport function PropertyFilterBuilderRuleGroupRenderer(props: PropertyFilterBuilderRuleGroupRendererProps) {\n  const { path, group } = props;\n  const { actions, ruleGroupDepthLimit } = React.useContext(PropertyFilterBuilderContext);\n  const groupRef = React.useRef<HTMLDivElement>(null);\n\n  const addRule = () => actions.addItem(path, \"RULE\");\n  const addRuleGroup = () => actions.addItem(path, \"RULE_GROUP\");\n  const removeGroup = () => actions.removeItem(path);\n\n  const onOperatorChange = React.useCallback((operator: PropertyFilterRuleGroupOperator) => {\n    actions.setRuleGroupOperator(path, operator);\n  }, [path, actions]);\n\n  const allowToAddGroup = ruleGroupDepthLimit === undefined || path.length < ruleGroupDepthLimit;\n  const { activeElement, ...eventHandlers } = React.useContext(ActiveRuleGroupContext);\n\n  return <div\n    ref={groupRef}\n    className=\"rule-group\"\n    data-isactive={groupRef.current === activeElement}\n    {...eventHandlers}\n  >\n    <div className=\"rule-group-remove-action\">\n      {group.groupId !== undefined && <IconButton data-testid=\"rule-group-remove\" onClick={removeGroup} styleType=\"borderless\" size=\"small\"><SvgDelete /></IconButton>}\n    </div>\n    <div className=\"rule-group-content\">\n      <PropertyFilterBuilderRuleGroupOperator operator={group.operator} onChange={onOperatorChange}/>\n      <div className=\"rule-group-items\">\n        {group.items.map((item) => <PropertyFilterBuilderGroupOrRule key={item.id} path={path} item={item} />)}\n      </div>\n      <div className=\"rule-group-actions\">\n        <Button key=\"add-rule-button\" data-testid=\"rule-group-add-rule\" onClick={addRule} styleType=\"borderless\" size=\"small\" startIcon={<SvgAdd />}>\n          {UiComponents.translate(\"filterBuilder.rule\")}\n        </Button>\n        {allowToAddGroup && <Button key=\"add-rule-group-button\" data-testid=\"rule-group-add-rule-group\" onClick={addRuleGroup} styleType=\"borderless\" size=\"small\" startIcon={<SvgAdd />}>\n          {UiComponents.translate(\"filterBuilder.ruleGroup\")}\n        </Button>}\n      </div>\n    </div>\n  </div>;\n}\n\n/** @alpha */\nexport interface PropertyFilterBuilderRuleGroupOperatorProps {\n  operator: PropertyFilterRuleGroupOperator;\n  onChange: (operator: PropertyFilterRuleGroupOperator) => void;\n}\n\n/** @alpha */\nexport function PropertyFilterBuilderRuleGroupOperator(props: PropertyFilterBuilderRuleGroupOperatorProps) {\n  const { operator, onChange } = props;\n\n  const options = React.useMemo<Array<SelectOption<PropertyFilterRuleGroupOperator>>>(() => ([\n    { value: PropertyFilterRuleGroupOperator.And, label: UiComponents.translate(\"filterBuilder.operators.and\") },\n    { value: PropertyFilterRuleGroupOperator.Or, label: UiComponents.translate(\"filterBuilder.operators.or\") },\n  ]), []);\n\n  return <div className=\"rule-group-operator\">\n    <Select options={options} value={operator} onChange={onChange} size=\"small\" />\n  </div>;\n}\ninterface PropertyFilterBuilderGroupOrRuleProps {\n  path: string[];\n  item: PropertyFilterBuilderRuleGroupItem;\n}\n\nconst PropertyFilterBuilderGroupOrRule = React.memo(\n  function PropertyFilterBuilderGroupOrRule({path, item}: PropertyFilterBuilderGroupOrRuleProps) {\n    const itemPath = [...path, item.id];\n\n    if (isPropertyFilterBuilderRuleGroup(item))\n      return <PropertyFilterBuilderRuleGroupRenderer path={itemPath} group={item} />;\n    return <PropertyFilterBuilderRuleRenderer path={itemPath} rule={item} />;\n  }\n);\n"]}
+{"version":3,"file":"FilterBuilderRuleGroup.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRuleGroup.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 PropertyFilterBuilder\r\n */\r\n\r\nimport \"./FilterBuilderRuleGroup.scss\";\r\nimport * as React from \"react\";\r\nimport { SvgAdd, SvgDelete } from \"@itwin/itwinui-icons-react\";\r\nimport { Button, IconButton, Select, SelectOption } from \"@itwin/itwinui-react\";\r\nimport { UiComponents } from \"../UiComponents\";\r\nimport { ActiveRuleGroupContext, PropertyFilterBuilderContext } from \"./FilterBuilderContext\";\r\nimport { PropertyFilterBuilderRuleRenderer } from \"./FilterBuilderRule\";\r\nimport { isPropertyFilterBuilderRuleGroup, PropertyFilterBuilderRuleGroup, PropertyFilterBuilderRuleGroupItem } from \"./FilterBuilderState\";\r\nimport { PropertyFilterRuleGroupOperator } from \"./Operators\";\r\n\r\n/**\r\n * Props for [[PropertyFilterBuilderRuleGroupRenderer]] component.\r\n * @internal\r\n */\r\nexport interface PropertyFilterBuilderRuleGroupRendererProps {\r\n  /** Path from [[PropertyFilterBuilder]] root to this rule group. */\r\n  path: string[];\r\n  /** Rule group to render. */\r\n  group: PropertyFilterBuilderRuleGroup;\r\n}\r\n\r\n/**\r\n * Component that renders group of rules in [[PropertyFilterBuilder]] component.\r\n * @internal\r\n */\r\nexport function PropertyFilterBuilderRuleGroupRenderer(props: PropertyFilterBuilderRuleGroupRendererProps) {\r\n  const { path, group } = props;\r\n  const { actions, ruleGroupDepthLimit } = React.useContext(PropertyFilterBuilderContext);\r\n  const groupRef = React.useRef<HTMLDivElement>(null);\r\n\r\n  const addRule = () => actions.addItem(path, \"RULE\");\r\n  const addRuleGroup = () => actions.addItem(path, \"RULE_GROUP\");\r\n  const removeGroup = () => actions.removeItem(path);\r\n\r\n  const onOperatorChange = React.useCallback((operator: PropertyFilterRuleGroupOperator) => {\r\n    actions.setRuleGroupOperator(path, operator);\r\n  }, [path, actions]);\r\n\r\n  const allowToAddGroup = ruleGroupDepthLimit === undefined || path.length < ruleGroupDepthLimit;\r\n  const { activeElement, ...eventHandlers } = React.useContext(ActiveRuleGroupContext);\r\n\r\n  const showOperator = group.items.length > 1;\r\n\r\n  return <div\r\n    ref={groupRef}\r\n    className=\"rule-group\"\r\n    data-isactive={groupRef.current === activeElement}\r\n    {...eventHandlers}\r\n  >\r\n    <div className=\"rule-group-remove-action\">\r\n      {group.groupId !== undefined && <IconButton data-testid=\"rule-group-remove\" onClick={removeGroup} styleType=\"borderless\" size=\"small\"><SvgDelete /></IconButton>}\r\n    </div>\r\n    <div className=\"rule-group-content\">\r\n      {showOperator ? <PropertyFilterBuilderRuleGroupOperator operator={group.operator} onChange={onOperatorChange} /> : null}\r\n      <div className=\"rule-group-items\">\r\n        {group.items.map((item) => <PropertyFilterBuilderGroupOrRule key={item.id} path={path} item={item} />)}\r\n      </div>\r\n      <div className=\"rule-group-actions\">\r\n        <Button key=\"add-rule-button\" data-testid=\"rule-group-add-rule\" onClick={addRule} styleType=\"borderless\" size=\"small\" startIcon={<SvgAdd />}>\r\n          {UiComponents.translate(\"filterBuilder.rule\")}\r\n        </Button>\r\n        {allowToAddGroup && <Button key=\"add-rule-group-button\" data-testid=\"rule-group-add-rule-group\" onClick={addRuleGroup} styleType=\"borderless\" size=\"small\" startIcon={<SvgAdd />}>\r\n          {UiComponents.translate(\"filterBuilder.ruleGroup\")}\r\n        </Button>}\r\n      </div>\r\n    </div>\r\n  </div>;\r\n}\r\n\r\n/**\r\n * Props for [[PropertyFilterBuilderRuleGroupOperator]] component.\r\n * @internal\r\n */\r\nexport interface PropertyFilterBuilderRuleGroupOperatorProps {\r\n  /** Currently selected operator. */\r\n  operator: PropertyFilterRuleGroupOperator;\r\n  /** Callback that is invoked when selected operator changes. */\r\n  onChange: (operator: PropertyFilterRuleGroupOperator) => void;\r\n}\r\n\r\n/**\r\n * Component that renders [[PropertyFilterBuilderRuleGroup]] operator selector.\r\n * @internal\r\n */\r\nexport function PropertyFilterBuilderRuleGroupOperator(props: PropertyFilterBuilderRuleGroupOperatorProps) {\r\n  const { operator, onChange } = props;\r\n\r\n  const options = React.useMemo<Array<SelectOption<PropertyFilterRuleGroupOperator>>>(() => ([\r\n    { value: PropertyFilterRuleGroupOperator.And, label: UiComponents.translate(\"filterBuilder.operators.and\") },\r\n    { value: PropertyFilterRuleGroupOperator.Or, label: UiComponents.translate(\"filterBuilder.operators.or\") },\r\n  ]), []);\r\n\r\n  return <div className=\"rule-group-operator\">\r\n    <Select options={options} value={operator} onChange={onChange} size=\"small\" />\r\n  </div>;\r\n}\r\ninterface PropertyFilterBuilderGroupOrRuleProps {\r\n  path: string[];\r\n  item: PropertyFilterBuilderRuleGroupItem;\r\n}\r\n\r\nconst PropertyFilterBuilderGroupOrRule = React.memo(\r\n  function PropertyFilterBuilderGroupOrRule({ path, item }: PropertyFilterBuilderGroupOrRuleProps) {\r\n    const itemPath = [...path, item.id];\r\n\r\n    if (isPropertyFilterBuilderRuleGroup(item))\r\n      return <PropertyFilterBuilderRuleGroupRenderer path={itemPath} group={item} />;\r\n    return <PropertyFilterBuilderRuleRenderer path={itemPath} rule={item} />;\r\n  }\r\n);\r\n"]}

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleGroup.scss

@@ -1,76 +1,68 @@
-/*---------------------------------------------------------------------------------------------
-* 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/index";
-@import "~@itwin/itwinui-css/scss/button/disabled";
-
-.filter-builder > .rule-group {
-  & > .rule-group-content {
-    border-left: 0;
-    padding-left: 0;
-  }
-
-  & > .rule-group-remove-action {
-    padding-right: 0;
-  }
-}
-
-.rule-group {
-  display: grid;
-  grid-template-columns: min-content auto;
-  padding: 11px 0;
-
-  &[data-isactive="true"] > .rule-group-remove-action {
-    visibility: visible;
-  }
-
-  &[data-isactive="true"] > .rule-group-content {
-    @include themed {
-      border-color: t(iui-color-background-1--light);
-    }
-  }
-
-  &[data-isactive="false"]
-    > .rule-group-content
-    > .rule-group-actions
-    .iui-button {
-    @include themed {
-      color: t(iui-icons-color);
-    }
-  }
-
-  .rule-group-remove-action {
-    padding: 3px var(--iui-size-s) 3px 0;
-    visibility: hidden;
-  }
-
-  .rule-group-content {
-    padding-left: var(--iui-size-s);
-    border-left: 1px solid;
-    box-sizing: border-box;
-    @include themed {
-      border-color: t(iui-color-background-border);
-    }
-
-    .rule-group-operator {
-      padding: 3px 0;
-      width: max-content;
-    }
-
-    .rule-group-actions {
-      padding: 3px 0;
-      display: grid;
-      grid-template-columns: min-content min-content;
-      gap: 8px;
-    }
-  }
-}
-
-.rule-group-items > .rule-group {
-  padding-bottom: 22px;
-
-  &:last-child {
-    padding-bottom: 11px;
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+
+.filter-builder > .rule-group {
+  & > .rule-group-content {
+    border-left: 0;
+    padding-left: 0;
+  }
+
+  & > .rule-group-remove-action {
+    padding-right: 0;
+  }
+}
+
+.rule-group {
+  display: grid;
+  grid-template-columns: min-content auto;
+  padding: 11px 0;
+
+  &[data-isactive="true"] > .rule-group-remove-action {
+    visibility: visible;
+  }
+
+  &[data-isactive="true"] > .rule-group-content {
+    border-color: var(--iui-color-border-foreground-hover);
+  }
+
+  &[data-isactive="false"]
+    > .rule-group-content
+    > .rule-group-actions
+    .iui-button {
+    color: var(--iui-color-icon);
+  }
+
+  .rule-group-remove-action {
+    padding: 3px var(--iui-size-s) 3px 0;
+    visibility: hidden;
+  }
+
+  .rule-group-content {
+    padding-left: var(--iui-size-s);
+    border-left: 1px solid;
+    box-sizing: border-box;
+    border-color: var(--iui-color-border-subtle);
+
+    .rule-group-operator {
+      padding: 3px 0;
+      width: max-content;
+    }
+
+    .rule-group-actions {
+      padding: 3px 0;
+      display: grid;
+      grid-template-columns: min-content min-content;
+      gap: 8px;
+    }
+  }
+}
+
+.rule-group-items > .rule-group {
+  padding-bottom: 22px;
+
+  &:last-child {
+    padding-bottom: 11px;
+  }
+}

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleOperator.d.ts

@@ -1,12 +1,24 @@
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
 /// <reference types="react" />
 import { PropertyDescription } from "@itwin/appui-abstract";
 import { PropertyFilterRuleOperator } from "./Operators";
-/** @alpha */
+/**
+ * Props for [[PropertyFilterBuilderRuleOperator]] component.
+ * @internal
+ */
 export interface PropertyFilterBuilderRuleOperatorProps {
+    /** Currently selected operator. */
     operator?: PropertyFilterRuleOperator;
+    /** Property used in rule for which this operator will be used. */
     property: PropertyDescription;
+    /** Callback that is invoked when selected operator changes. */
     onChange: (operator: PropertyFilterRuleOperator) => void;
 }
-/** @alpha */
+/**
+ * Component that renders [[PropertyFilterBuilderRuleRenderer]] operator selector.
+ * @internal
+ */
 export declare function PropertyFilterBuilderRuleOperator(props: PropertyFilterBuilderRuleOperatorProps): JSX.Element;
 //# sourceMappingURL=FilterBuilderRuleOperator.d.ts.map

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleOperator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBuilderRuleOperator.d.ts","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRuleOperator.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAA8D,0BAA0B,EAAE,MAAM,aAAa,CAAC;AAErH,aAAa;AACb,MAAM,WAAW,sCAAsC;IACrD,QAAQ,CAAC,EAAE,0BAA0B,CAAC;IACtC,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,QAAQ,EAAE,CAAC,QAAQ,EAAE,0BAA0B,KAAK,IAAI,CAAC;CAC1D;AAED,aAAa;AACb,wBAAgB,iCAAiC,CAAC,KAAK,EAAE,sCAAsC,eAkB9F"}
+{"version":3,"file":"FilterBuilderRuleOperator.d.ts","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderRuleOperator.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAGH,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAA8D,0BAA0B,EAAE,MAAM,aAAa,CAAC;AAErH;;;GAGG;AACH,MAAM,WAAW,sCAAsC;IACrD,mCAAmC;IACnC,QAAQ,CAAC,EAAE,0BAA0B,CAAC;IACtC,kEAAkE;IAClE,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,+DAA+D;IAC/D,QAAQ,EAAE,CAAC,QAAQ,EAAE,0BAA0B,KAAK,IAAI,CAAC;CAC1D;AAED;;;GAGG;AACH,wBAAgB,iCAAiC,CAAC,KAAK,EAAE,sCAAsC,eAkB9F"}

package/lib/cjs/components-react/filter-builder/FilterBuilderRuleOperator.js

@@ -1,7 +1,18 @@
 "use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -20,19 +31,17 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PropertyFilterBuilderRuleOperator = void 0;
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
 const React = __importStar(require("react"));
 const itwinui_react_1 = require("@itwin/itwinui-react");
 const Operators_1 = require("./Operators");
-/** @alpha */
+/**
+ * Component that renders [[PropertyFilterBuilderRuleRenderer]] operator selector.
+ * @internal
+ */
 function PropertyFilterBuilderRuleOperator(props) {
-    var _a;
     const { operator, property, onChange } = props;
     const availableOperators = React.useMemo(() => (0, Operators_1.getPropertyFilterOperators)(property), [property]);
-    const selectedOperator = (_a = availableOperators.find((op) => op === operator)) !== null && _a !== void 0 ? _a : availableOperators[0];
+    const selectedOperator = availableOperators.find((op) => op === operator) ?? availableOperators[0];
     React.useEffect(() => {
         onChange(selectedOperator);
     }, [onChange, selectedOperator]);