@itwin/components-react 4.0.0-dev.12 → 4.0.0-dev.13

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

@@ -1,29 +1,28 @@
-/*---------------------------------------------------------------------------------------------
-* 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) {
+    const [listWidth, setListWidth] = React.useState();
+    const onListResize = React.useCallback(setListWidth, [setListWidth]);
+    if (props.propertyData.records.Favorite !== undefined) {
+        const propertyValueRendererManager = props.propertyValueRendererManager ?? PropertyValueRendererManager.defaultManager;
+        const orientation = props.orientation ?? 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":["/*---------------------------------------------------------------------------------------------\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"]}
+{"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,KAAK,CAAC,4BAA4B,IAAI,4BAA4B,CAAC,cAAc,CAAC;QACvH,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,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"]}

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":["/*---------------------------------------------------------------------------------------------\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"]}
+{"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"]}

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

@@ -1,80 +1,80 @@
-/** @packageDocumentation
- * @module PropertyFilterBuilder
- */
-import * as React from "react";
-import { PropertyDescription } from "@itwin/appui-abstract";
-import { PropertyFilterBuilderActions } from "./FilterBuilderState";
-import { PropertyFilterBuilderRuleOperatorProps } from "./FilterBuilderRuleOperator";
-import { PropertyFilterBuilderRuleValueProps } from "./FilterBuilderRuleValue";
-/**
- * Data structure that describes [[PropertyFilterBuilderContext]] value.
- * @internal
- */
-export interface PropertyFilterBuilderContextProps {
-    /** Actions for modifying [[PropertyFilterBuilder]] state. */
-    actions: PropertyFilterBuilderActions;
-    /** List of available properties. */
-    properties: PropertyDescription[];
-    /** Callback to invoke when property is selected in any rule. */
-    onRulePropertySelected?: (property: PropertyDescription) => void;
-    /** Specifies how deep rule groups can be nested. */
-    ruleGroupDepthLimit?: number;
-}
-/**
- * Context used to store data for rules and rule groups rendered inside [[PropertyFilterBuilder]] component.
- * @internal
- */
-export declare const PropertyFilterBuilderContext: React.Context<PropertyFilterBuilderContextProps>;
-/**
- * Data structure that describes [[PropertyFilterBuilderRuleRenderingContext]] value.
- * @internal
- */
-export interface PropertyFilterBuilderRuleRenderingContextProps {
-    /** Custom renderer for operator selector in rule. */
-    ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;
-    /** Custom renderer for value input in rule. */
-    ruleValueRenderer?: (props: PropertyFilterBuilderRuleValueProps) => React.ReactNode;
-    /** Custom renderer for property selector in rule. */
-    propertyRenderer?: (name: string) => React.ReactNode;
-    /** Specifies that properties selection is disabled. */
-    isDisabled?: boolean;
-}
-/**
- * Context for rendering rules and rule groups inside [[PropertyFilterBuilder]] component.
- * @internal
- */
-export declare const PropertyFilterBuilderRuleRenderingContext: React.Context<PropertyFilterBuilderRuleRenderingContextProps>;
-/**
- * Data structure that describes value of [[ActiveRuleGroupContext]].
- * @internal
- */
-export interface ActiveRuleGroupContextProps {
-    /** Element of currently active rule group. */
-    activeElement: HTMLElement | undefined;
-    /** Even handler for rule group element 'onFocus' event */
-    onFocus: React.FocusEventHandler<HTMLElement>;
-    /** Even handler for rule group element 'onBlur' event */
-    onBlur: React.FocusEventHandler<HTMLElement>;
-    /** Even handler for rule group element 'onMouseOver' event */
-    onMouseOver: React.MouseEventHandler<HTMLElement>;
-    /** Even handler for rule group element 'onMouseOut' event */
-    onMouseOut: React.MouseEventHandler<HTMLElement>;
-}
-/**
- * Context for tracking and storing active rule group in [[PropertyFilterBuilder]].
- * Group is considered active if it is focused or hovered.
- * @internal
- */
-export declare const ActiveRuleGroupContext: React.Context<ActiveRuleGroupContextProps>;
-/**
- * Custom hook that created value for [[ActiveRuleGroupContext]].
- * @internal
- */
-export declare function useActiveRuleGroupContextProps(rootElementRef: React.RefObject<HTMLElement>): {
-    activeElement: HTMLElement | undefined;
-    onFocus: React.FocusEventHandler<HTMLElement>;
-    onBlur: React.FocusEventHandler<HTMLElement>;
-    onMouseOver: React.MouseEventHandler<HTMLElement>;
-    onMouseOut: React.MouseEventHandler<HTMLElement>;
-};
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
+import * as React from "react";
+import { PropertyDescription } from "@itwin/appui-abstract";
+import { PropertyFilterBuilderActions } from "./FilterBuilderState";
+import { PropertyFilterBuilderRuleOperatorProps } from "./FilterBuilderRuleOperator";
+import { PropertyFilterBuilderRuleValueProps } from "./FilterBuilderRuleValue";
+/**
+ * Data structure that describes [[PropertyFilterBuilderContext]] value.
+ * @internal
+ */
+export interface PropertyFilterBuilderContextProps {
+    /** Actions for modifying [[PropertyFilterBuilder]] state. */
+    actions: PropertyFilterBuilderActions;
+    /** List of available properties. */
+    properties: PropertyDescription[];
+    /** Callback to invoke when property is selected in any rule. */
+    onRulePropertySelected?: (property: PropertyDescription) => void;
+    /** Specifies how deep rule groups can be nested. */
+    ruleGroupDepthLimit?: number;
+}
+/**
+ * Context used to store data for rules and rule groups rendered inside [[PropertyFilterBuilder]] component.
+ * @internal
+ */
+export declare const PropertyFilterBuilderContext: React.Context<PropertyFilterBuilderContextProps>;
+/**
+ * Data structure that describes [[PropertyFilterBuilderRuleRenderingContext]] value.
+ * @internal
+ */
+export interface PropertyFilterBuilderRuleRenderingContextProps {
+    /** Custom renderer for operator selector in rule. */
+    ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;
+    /** Custom renderer for value input in rule. */
+    ruleValueRenderer?: (props: PropertyFilterBuilderRuleValueProps) => React.ReactNode;
+    /** Custom renderer for property selector in rule. */
+    propertyRenderer?: (name: string) => React.ReactNode;
+    /** Specifies that properties selection is disabled. */
+    isDisabled?: boolean;
+}
+/**
+ * Context for rendering rules and rule groups inside [[PropertyFilterBuilder]] component.
+ * @internal
+ */
+export declare const PropertyFilterBuilderRuleRenderingContext: React.Context<PropertyFilterBuilderRuleRenderingContextProps>;
+/**
+ * Data structure that describes value of [[ActiveRuleGroupContext]].
+ * @internal
+ */
+export interface ActiveRuleGroupContextProps {
+    /** Element of currently active rule group. */
+    activeElement: HTMLElement | undefined;
+    /** Even handler for rule group element 'onFocus' event */
+    onFocus: React.FocusEventHandler<HTMLElement>;
+    /** Even handler for rule group element 'onBlur' event */
+    onBlur: React.FocusEventHandler<HTMLElement>;
+    /** Even handler for rule group element 'onMouseOver' event */
+    onMouseOver: React.MouseEventHandler<HTMLElement>;
+    /** Even handler for rule group element 'onMouseOut' event */
+    onMouseOut: React.MouseEventHandler<HTMLElement>;
+}
+/**
+ * Context for tracking and storing active rule group in [[PropertyFilterBuilder]].
+ * Group is considered active if it is focused or hovered.
+ * @internal
+ */
+export declare const ActiveRuleGroupContext: React.Context<ActiveRuleGroupContextProps>;
+/**
+ * Custom hook that created value for [[ActiveRuleGroupContext]].
+ * @internal
+ */
+export declare function useActiveRuleGroupContextProps(rootElementRef: React.RefObject<HTMLElement>): {
+    activeElement: HTMLElement | undefined;
+    onFocus: React.FocusEventHandler<HTMLElement>;
+    onBlur: React.FocusEventHandler<HTMLElement>;
+    onMouseOver: React.MouseEventHandler<HTMLElement>;
+    onMouseOut: React.MouseEventHandler<HTMLElement>;
+};
 //# sourceMappingURL=FilterBuilderContext.d.ts.map

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

@@ -1,60 +1,60 @@
-/*---------------------------------------------------------------------------------------------
-* 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";
-/**
- * Context used to store data for rules and rule groups rendered inside [[PropertyFilterBuilder]] component.
- * @internal
- */
-export const PropertyFilterBuilderContext = React.createContext(null);
-/**
- * Context for rendering rules and rule groups inside [[PropertyFilterBuilder]] component.
- * @internal
- */
-export const PropertyFilterBuilderRuleRenderingContext = React.createContext({});
-/**
- * Context for tracking and storing active rule group in [[PropertyFilterBuilder]].
- * Group is considered active if it is focused or hovered.
- * @internal
- */
-export const ActiveRuleGroupContext = React.createContext(null);
-/**
- * Custom hook that created value for [[ActiveRuleGroupContext]].
- * @internal
- */
-export function useActiveRuleGroupContextProps(rootElementRef) {
-    const [activeElement, setActiveElement] = React.useState();
-    const onFocus = React.useCallback((e) => {
-        e.stopPropagation();
-        setActiveElement(e.currentTarget);
-    }, []);
-    const onBlur = React.useCallback((e) => {
-        e.stopPropagation();
-        if (activeElement !== e.currentTarget || (rootElementRef.current && rootElementRef.current.contains(e.relatedTarget)))
-            return;
-        setActiveElement(undefined);
-    }, [activeElement, rootElementRef]);
-    const onMouseOver = React.useCallback((e) => {
-        e.stopPropagation();
-        setActiveElement(e.currentTarget);
-    }, []);
-    const onMouseOut = React.useCallback((e) => {
-        e.stopPropagation();
-        // istanbul ignore if
-        if (activeElement !== e.currentTarget)
-            return;
-        setActiveElement(undefined);
-    }, [activeElement]);
-    return React.useMemo(() => ({
-        activeElement,
-        onFocus,
-        onBlur,
-        onMouseOver,
-        onMouseOut,
-    }), [activeElement, onFocus, onBlur, onMouseOver, onMouseOut]);
-}
+/*---------------------------------------------------------------------------------------------
+* 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";
+/**
+ * Context used to store data for rules and rule groups rendered inside [[PropertyFilterBuilder]] component.
+ * @internal
+ */
+export const PropertyFilterBuilderContext = React.createContext(null);
+/**
+ * Context for rendering rules and rule groups inside [[PropertyFilterBuilder]] component.
+ * @internal
+ */
+export const PropertyFilterBuilderRuleRenderingContext = React.createContext({});
+/**
+ * Context for tracking and storing active rule group in [[PropertyFilterBuilder]].
+ * Group is considered active if it is focused or hovered.
+ * @internal
+ */
+export const ActiveRuleGroupContext = React.createContext(null);
+/**
+ * Custom hook that created value for [[ActiveRuleGroupContext]].
+ * @internal
+ */
+export function useActiveRuleGroupContextProps(rootElementRef) {
+    const [activeElement, setActiveElement] = React.useState();
+    const onFocus = React.useCallback((e) => {
+        e.stopPropagation();
+        setActiveElement(e.currentTarget);
+    }, []);
+    const onBlur = React.useCallback((e) => {
+        e.stopPropagation();
+        if (activeElement !== e.currentTarget || (rootElementRef.current && rootElementRef.current.contains(e.relatedTarget)))
+            return;
+        setActiveElement(undefined);
+    }, [activeElement, rootElementRef]);
+    const onMouseOver = React.useCallback((e) => {
+        e.stopPropagation();
+        setActiveElement(e.currentTarget);
+    }, []);
+    const onMouseOut = React.useCallback((e) => {
+        e.stopPropagation();
+        // istanbul ignore if
+        if (activeElement !== e.currentTarget)
+            return;
+        setActiveElement(undefined);
+    }, [activeElement]);
+    return React.useMemo(() => ({
+        activeElement,
+        onFocus,
+        onBlur,
+        onMouseOver,
+        onMouseOut,
+    }), [activeElement, onFocus, onBlur, onMouseOver, onMouseOut]);
+}
 //# sourceMappingURL=FilterBuilderContext.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FilterBuilderContext.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderContext.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAqB/B;;;GAGG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,KAAK,CAAC,aAAa,CAAoC,IAAK,CAAC,CAAC;AAiB1G;;;GAGG;AACH,MAAM,CAAC,MAAM,yCAAyC,GAAG,KAAK,CAAC,aAAa,CAAiD,EAAE,CAAC,CAAC;AAmBjI;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,KAAK,CAAC,aAAa,CAA8B,IAAK,CAAC,CAAC;AAE9F;;;GAGG;AACH,MAAM,UAAU,8BAA8B,CAAC,cAA4C;IACzF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAA2B,CAAC;IAEpF,MAAM,OAAO,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAC5E,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,gBAAgB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IACpC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,MAAM,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAC3E,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,aAAa,KAAK,CAAC,CAAC,aAAa,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;YACnH,OAAO;QAET,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,aAAa,EAAE,cAAc,CAAC,CAAC,CAAC;IAEpC,MAAM,WAAW,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAChF,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,gBAAgB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IACpC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,UAAU,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAC/E,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,qBAAqB;QACrB,IAAI,aAAa,KAAK,CAAC,CAAC,aAAa;YACnC,OAAO;QAET,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,OAAO,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;QAC1B,aAAa;QACb,OAAO;QACP,MAAM;QACN,WAAW;QACX,UAAU;KACX,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC;AACjE,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 { PropertyFilterBuilderActions } from \"./FilterBuilderState\";\r\nimport { PropertyFilterBuilderRuleOperatorProps } from \"./FilterBuilderRuleOperator\";\r\nimport { PropertyFilterBuilderRuleValueProps } from \"./FilterBuilderRuleValue\";\r\n\r\n/**\r\n * Data structure that describes [[PropertyFilterBuilderContext]] value.\r\n * @internal\r\n */\r\nexport interface PropertyFilterBuilderContextProps {\r\n  /** Actions for modifying [[PropertyFilterBuilder]] state. */\r\n  actions: PropertyFilterBuilderActions;\r\n  /** List of available properties. */\r\n  properties: PropertyDescription[];\r\n  /** Callback to invoke when property is selected in any rule. */\r\n  onRulePropertySelected?: (property: PropertyDescription) => void;\r\n  /** Specifies how deep rule groups can be nested. */\r\n  ruleGroupDepthLimit?: number;\r\n}\r\n\r\n/**\r\n * Context used to store data for rules and rule groups rendered inside [[PropertyFilterBuilder]] component.\r\n * @internal\r\n */\r\nexport const PropertyFilterBuilderContext = React.createContext<PropertyFilterBuilderContextProps>(null!);\r\n\r\n/**\r\n * Data structure that describes [[PropertyFilterBuilderRuleRenderingContext]] value.\r\n * @internal\r\n */\r\nexport interface PropertyFilterBuilderRuleRenderingContextProps {\r\n  /** Custom renderer for operator selector in rule. */\r\n  ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;\r\n  /** Custom renderer for value input in rule. */\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 that properties selection is disabled. */\r\n  isDisabled?: boolean;\r\n}\r\n\r\n/**\r\n * Context for rendering rules and rule groups inside [[PropertyFilterBuilder]] component.\r\n * @internal\r\n */\r\nexport const PropertyFilterBuilderRuleRenderingContext = React.createContext<PropertyFilterBuilderRuleRenderingContextProps>({});\r\n\r\n/**\r\n * Data structure that describes value of [[ActiveRuleGroupContext]].\r\n * @internal\r\n */\r\nexport interface ActiveRuleGroupContextProps {\r\n  /** Element of currently active rule group. */\r\n  activeElement: HTMLElement | undefined;\r\n  /** Even handler for rule group element 'onFocus' event */\r\n  onFocus: React.FocusEventHandler<HTMLElement>;\r\n  /** Even handler for rule group element 'onBlur' event */\r\n  onBlur: React.FocusEventHandler<HTMLElement>;\r\n  /** Even handler for rule group element 'onMouseOver' event */\r\n  onMouseOver: React.MouseEventHandler<HTMLElement>;\r\n  /** Even handler for rule group element 'onMouseOut' event */\r\n  onMouseOut: React.MouseEventHandler<HTMLElement>;\r\n}\r\n\r\n/**\r\n * Context for tracking and storing active rule group in [[PropertyFilterBuilder]].\r\n * Group is considered active if it is focused or hovered.\r\n * @internal\r\n */\r\nexport const ActiveRuleGroupContext = React.createContext<ActiveRuleGroupContextProps>(null!);\r\n\r\n/**\r\n * Custom hook that created value for [[ActiveRuleGroupContext]].\r\n * @internal\r\n */\r\nexport function useActiveRuleGroupContextProps(rootElementRef: React.RefObject<HTMLElement>) {\r\n  const [activeElement, setActiveElement] = React.useState<HTMLElement | undefined>();\r\n\r\n  const onFocus: React.FocusEventHandler<HTMLElement> = React.useCallback((e) => {\r\n    e.stopPropagation();\r\n    setActiveElement(e.currentTarget);\r\n  }, []);\r\n\r\n  const onBlur: React.FocusEventHandler<HTMLElement> = React.useCallback((e) => {\r\n    e.stopPropagation();\r\n    if (activeElement !== e.currentTarget || (rootElementRef.current && rootElementRef.current.contains(e.relatedTarget)))\r\n      return;\r\n\r\n    setActiveElement(undefined);\r\n  }, [activeElement, rootElementRef]);\r\n\r\n  const onMouseOver: React.MouseEventHandler<HTMLElement> = React.useCallback((e) => {\r\n    e.stopPropagation();\r\n    setActiveElement(e.currentTarget);\r\n  }, []);\r\n\r\n  const onMouseOut: React.MouseEventHandler<HTMLElement> = React.useCallback((e) => {\r\n    e.stopPropagation();\r\n    // istanbul ignore if\r\n    if (activeElement !== e.currentTarget)\r\n      return;\r\n\r\n    setActiveElement(undefined);\r\n  }, [activeElement]);\r\n\r\n  return React.useMemo(() => ({\r\n    activeElement,\r\n    onFocus,\r\n    onBlur,\r\n    onMouseOver,\r\n    onMouseOut,\r\n  }), [activeElement, onFocus, onBlur, onMouseOver, onMouseOut]);\r\n}\r\n"]}
+{"version":3,"file":"FilterBuilderContext.js","sourceRoot":"","sources":["../../../../src/components-react/filter-builder/FilterBuilderContext.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAqB/B;;;GAGG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,KAAK,CAAC,aAAa,CAAoC,IAAK,CAAC,CAAC;AAiB1G;;;GAGG;AACH,MAAM,CAAC,MAAM,yCAAyC,GAAG,KAAK,CAAC,aAAa,CAAiD,EAAE,CAAC,CAAC;AAmBjI;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,KAAK,CAAC,aAAa,CAA8B,IAAK,CAAC,CAAC;AAE9F;;;GAGG;AACH,MAAM,UAAU,8BAA8B,CAAC,cAA4C;IACzF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,EAA2B,CAAC;IAEpF,MAAM,OAAO,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAC5E,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,gBAAgB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IACpC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,MAAM,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAC3E,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,aAAa,KAAK,CAAC,CAAC,aAAa,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;YACnH,OAAO;QAET,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,aAAa,EAAE,cAAc,CAAC,CAAC,CAAC;IAEpC,MAAM,WAAW,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAChF,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,gBAAgB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IACpC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,UAAU,GAAyC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE;QAC/E,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,qBAAqB;QACrB,IAAI,aAAa,KAAK,CAAC,CAAC,aAAa;YACnC,OAAO;QAET,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,OAAO,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;QAC1B,aAAa;QACb,OAAO;QACP,MAAM;QACN,WAAW;QACX,UAAU;KACX,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC;AACjE,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 { PropertyFilterBuilderActions } from \"./FilterBuilderState\";\nimport { PropertyFilterBuilderRuleOperatorProps } from \"./FilterBuilderRuleOperator\";\nimport { PropertyFilterBuilderRuleValueProps } from \"./FilterBuilderRuleValue\";\n\n/**\n * Data structure that describes [[PropertyFilterBuilderContext]] value.\n * @internal\n */\nexport interface PropertyFilterBuilderContextProps {\n  /** Actions for modifying [[PropertyFilterBuilder]] state. */\n  actions: PropertyFilterBuilderActions;\n  /** List of available properties. */\n  properties: PropertyDescription[];\n  /** Callback to invoke when property is selected in any rule. */\n  onRulePropertySelected?: (property: PropertyDescription) => void;\n  /** Specifies how deep rule groups can be nested. */\n  ruleGroupDepthLimit?: number;\n}\n\n/**\n * Context used to store data for rules and rule groups rendered inside [[PropertyFilterBuilder]] component.\n * @internal\n */\nexport const PropertyFilterBuilderContext = React.createContext<PropertyFilterBuilderContextProps>(null!);\n\n/**\n * Data structure that describes [[PropertyFilterBuilderRuleRenderingContext]] value.\n * @internal\n */\nexport interface PropertyFilterBuilderRuleRenderingContextProps {\n  /** Custom renderer for operator selector in rule. */\n  ruleOperatorRenderer?: (props: PropertyFilterBuilderRuleOperatorProps) => React.ReactNode;\n  /** Custom renderer for value input in rule. */\n  ruleValueRenderer?: (props: PropertyFilterBuilderRuleValueProps) => React.ReactNode;\n  /** Custom renderer for property selector in rule. */\n  propertyRenderer?: (name: string) => React.ReactNode;\n  /** Specifies that properties selection is disabled. */\n  isDisabled?: boolean;\n}\n\n/**\n * Context for rendering rules and rule groups inside [[PropertyFilterBuilder]] component.\n * @internal\n */\nexport const PropertyFilterBuilderRuleRenderingContext = React.createContext<PropertyFilterBuilderRuleRenderingContextProps>({});\n\n/**\n * Data structure that describes value of [[ActiveRuleGroupContext]].\n * @internal\n */\nexport interface ActiveRuleGroupContextProps {\n  /** Element of currently active rule group. */\n  activeElement: HTMLElement | undefined;\n  /** Even handler for rule group element 'onFocus' event */\n  onFocus: React.FocusEventHandler<HTMLElement>;\n  /** Even handler for rule group element 'onBlur' event */\n  onBlur: React.FocusEventHandler<HTMLElement>;\n  /** Even handler for rule group element 'onMouseOver' event */\n  onMouseOver: React.MouseEventHandler<HTMLElement>;\n  /** Even handler for rule group element 'onMouseOut' event */\n  onMouseOut: React.MouseEventHandler<HTMLElement>;\n}\n\n/**\n * Context for tracking and storing active rule group in [[PropertyFilterBuilder]].\n * Group is considered active if it is focused or hovered.\n * @internal\n */\nexport const ActiveRuleGroupContext = React.createContext<ActiveRuleGroupContextProps>(null!);\n\n/**\n * Custom hook that created value for [[ActiveRuleGroupContext]].\n * @internal\n */\nexport function useActiveRuleGroupContextProps(rootElementRef: React.RefObject<HTMLElement>) {\n  const [activeElement, setActiveElement] = React.useState<HTMLElement | undefined>();\n\n  const onFocus: React.FocusEventHandler<HTMLElement> = React.useCallback((e) => {\n    e.stopPropagation();\n    setActiveElement(e.currentTarget);\n  }, []);\n\n  const onBlur: React.FocusEventHandler<HTMLElement> = React.useCallback((e) => {\n    e.stopPropagation();\n    if (activeElement !== e.currentTarget || (rootElementRef.current && rootElementRef.current.contains(e.relatedTarget)))\n      return;\n\n    setActiveElement(undefined);\n  }, [activeElement, rootElementRef]);\n\n  const onMouseOver: React.MouseEventHandler<HTMLElement> = React.useCallback((e) => {\n    e.stopPropagation();\n    setActiveElement(e.currentTarget);\n  }, []);\n\n  const onMouseOut: React.MouseEventHandler<HTMLElement> = React.useCallback((e) => {\n    e.stopPropagation();\n    // istanbul ignore if\n    if (activeElement !== e.currentTarget)\n      return;\n\n    setActiveElement(undefined);\n  }, [activeElement]);\n\n  return React.useMemo(() => ({\n    activeElement,\n    onFocus,\n    onBlur,\n    onMouseOver,\n    onMouseOut,\n  }), [activeElement, onFocus, onBlur, onMouseOver, onMouseOut]);\n}\n"]}

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

@@ -1,22 +1,22 @@
-/** @packageDocumentation
- * @module PropertyFilterBuilder
- */
-/// <reference types="react" />
-import "./FilterBuilderRule.scss";
-import { PropertyFilterBuilderRule } from "./FilterBuilderState";
-/**
- * Props for [[PropertyFilterBuilderRuleRenderer]] component.
- * @internal
- */
-export interface PropertyFilterBuilderRuleRendererProps {
-    /** Path from [[PropertyFilterBuilder]] root to this rule. */
-    path: string[];
-    /** Rule to render. */
-    rule: PropertyFilterBuilderRule;
-}
-/**
- * Component that renders single rule in [[PropertyFilterBuilder]] component.
- * @internal
- */
-export declare function PropertyFilterBuilderRuleRenderer(props: PropertyFilterBuilderRuleRendererProps): JSX.Element;
+/** @packageDocumentation
+ * @module PropertyFilterBuilder
+ */
+/// <reference types="react" />
+import "./FilterBuilderRule.scss";
+import { PropertyFilterBuilderRule } from "./FilterBuilderState";
+/**
+ * Props for [[PropertyFilterBuilderRuleRenderer]] component.
+ * @internal
+ */
+export interface PropertyFilterBuilderRuleRendererProps {
+    /** Path from [[PropertyFilterBuilder]] root to this rule. */
+    path: string[];
+    /** Rule to render. */
+    rule: PropertyFilterBuilderRule;
+}
+/**
+ * Component that renders single rule in [[PropertyFilterBuilder]] component.
+ * @internal
+ */
+export declare function PropertyFilterBuilderRuleRenderer(props: PropertyFilterBuilderRuleRendererProps): JSX.Element;
 //# sourceMappingURL=FilterBuilderRule.d.ts.map