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

package/lib/esm/core-react/tabs/Tabs.js

@@ -1,122 +1,122 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Tabs
- */
-import classnames from "classnames";
-import * as React from "react";
-import { Orientation } from "../enums/Orientation";
-import { ItemKeyboardNavigator } from "../focus/ItemKeyboardNavigator";
-import { IconHelper } from "../utils/IconHelper";
-function isTabLabelWithIcon(item) {
-    return (typeof item !== "string") && !!(item).icon;
-}
-function isTabLabel(item) {
-    return (typeof item !== "string");
-}
-/** Tabs meant to represent the current position in a page/section
- * @public
- */
-export class Tabs extends React.PureComponent {
-    constructor(props) {
-        super(props);
-        this._anchorRefs = [];
-        this._handleFocusItem = (index) => {
-            const itemRef = this._anchorRefs[index];
-            // istanbul ignore else
-            if (itemRef && itemRef.current)
-                itemRef.current.focus();
-        };
-        this._handleTabClick = (index) => {
-            this._activateTab(index);
-        };
-        this._activateTab = (index) => {
-            this.props.onActivateTab && this.props.onActivateTab(index);
-            this.setState({ activeIndex: index });
-        };
-        const activeIndex = this.validateActiveIndex(props.activeIndex);
-        this.state = {
-            activeIndex,
-        };
-        props.labels.forEach(() => this._anchorRefs.push(React.createRef()));
-        this._itemKeyboardNavigator = new ItemKeyboardNavigator(this._handleFocusItem, this._activateTab);
-    }
-    validateActiveIndex(idx) {
-        let activeIndex = 0;
-        if (idx && idx >= 0 && idx < this.props.labels.length)
-            activeIndex = idx;
-        return activeIndex;
-    }
-    /** @internal */
-    componentDidMount() {
-        this._itemKeyboardNavigator.itemCount = this.props.labels.length;
-        this._itemKeyboardNavigator.orientation = this.props.orientation;
-    }
-    /** @internal */
-    componentDidUpdate(prevProps) {
-        if (prevProps.labels !== this.props.labels)
-            this._itemKeyboardNavigator.itemCount = this.props.labels.length;
-        if (prevProps.orientation !== this.props.orientation)
-            this._itemKeyboardNavigator.orientation = this.props.orientation;
-        if (prevProps.activeIndex !== this.props.activeIndex) {
-            let hadFocus = false;
-            const element = this._anchorRefs[this.state.activeIndex].current;
-            // istanbul ignore else
-            if (element && document.activeElement === element)
-                hadFocus = true;
-            const activeIndex = this.validateActiveIndex(this.props.activeIndex);
-            this.setState(() => ({ activeIndex }), () => {
-                // istanbul ignore else
-                if (hadFocus) {
-                    const newElement = this._anchorRefs[activeIndex].current;
-                    // istanbul ignore else
-                    if (newElement)
-                        newElement.focus();
-                }
-            });
-        }
-    }
-    /** Handle keydown on tabs */
-    _handleKeyDownEvent(event, index) {
-        this._itemKeyboardNavigator.handleKeyDownEvent(event, index);
-    }
-    /** Handle keyup on tabs */
-    _handleKeyUpEvent(event, index) {
-        this._itemKeyboardNavigator.handleKeyUpEvent(event, index);
-    }
-    /** @internal */
-    render() {
-        const ulClassNames = classnames(this.props.mainClassName, this.props.green && "uicore-tabs-green", this.props.className);
-        const anyIconsPresent = (this.props.labels.reduce((a, b) => a + (isTabLabelWithIcon(b) ? 1 : 0), 0)) > 0;
-        return (React.createElement("ul", { className: ulClassNames, style: this.props.style, role: "tablist", "aria-orientation": this.props.orientation === Orientation.Vertical ? "vertical" : "horizontal" }, this.props.labels.map((label, index) => {
-            let disabled;
-            let tooltipElement;
-            let title;
-            let subLabel;
-            let tabId = "";
-            let icon;
-            if (isTabLabel(label)) {
-                icon = IconHelper.getIconReactNode(label.icon);
-                subLabel = label.subLabel;
-                disabled = label.disabled;
-                tabId = label.tabId;
-                if (React.isValidElement(label.tooltip))
-                    tooltipElement = label.tooltip;
-                else if (typeof label.tooltip === "string")
-                    title = label.tooltip;
-            }
-            return React.createElement("li", { key: index, title: title, className: classnames(index === this.state.activeIndex && "core-active", disabled && "core-tab-item-disabled"), role: "tab", "aria-selected": index === this.state.activeIndex, "data-for": `${tabId}` },
-                tooltipElement,
-                React.createElement("a", { ref: this._anchorRefs[index], tabIndex: index === this.state.activeIndex ? 0 : -1, onClick: () => this._handleTabClick(index), onKeyDown: (event) => this._handleKeyDownEvent(event, index), onKeyUp: (event) => this._handleKeyUpEvent(event, index), "data-testid": `${tabId}`, role: "button" },
-                    " ",
-                    React.createElement("div", { className: classnames("uicore-tabs-inline-label", disabled && "core-tab-item-disabled") },
-                        anyIconsPresent && React.createElement("span", { className: "uicore-tabs-icon" }, icon),
-                        React.createElement("div", { className: "uicore-tabs-label-subLabel-container" },
-                            React.createElement("span", null, (typeof label === "string") ? label : label.label),
-                            subLabel && React.createElement("span", { className: "uicore-tabs-subLabel" }, subLabel)))));
-        })));
-    }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Tabs
+ */
+import classnames from "classnames";
+import * as React from "react";
+import { Orientation } from "../enums/Orientation";
+import { ItemKeyboardNavigator } from "../focus/ItemKeyboardNavigator";
+import { IconHelper } from "../utils/IconHelper";
+function isTabLabelWithIcon(item) {
+    return (typeof item !== "string") && !!(item).icon;
+}
+function isTabLabel(item) {
+    return (typeof item !== "string");
+}
+/** Tabs meant to represent the current position in a page/section
+ * @public
+ */
+export class Tabs extends React.PureComponent {
+    constructor(props) {
+        super(props);
+        this._anchorRefs = [];
+        this._handleFocusItem = (index) => {
+            const itemRef = this._anchorRefs[index];
+            // istanbul ignore else
+            if (itemRef && itemRef.current)
+                itemRef.current.focus();
+        };
+        this._handleTabClick = (index) => {
+            this._activateTab(index);
+        };
+        this._activateTab = (index) => {
+            this.props.onActivateTab && this.props.onActivateTab(index);
+            this.setState({ activeIndex: index });
+        };
+        const activeIndex = this.validateActiveIndex(props.activeIndex);
+        this.state = {
+            activeIndex,
+        };
+        props.labels.forEach(() => this._anchorRefs.push(React.createRef()));
+        this._itemKeyboardNavigator = new ItemKeyboardNavigator(this._handleFocusItem, this._activateTab);
+    }
+    validateActiveIndex(idx) {
+        let activeIndex = 0;
+        if (idx && idx >= 0 && idx < this.props.labels.length)
+            activeIndex = idx;
+        return activeIndex;
+    }
+    /** @internal */
+    componentDidMount() {
+        this._itemKeyboardNavigator.itemCount = this.props.labels.length;
+        this._itemKeyboardNavigator.orientation = this.props.orientation;
+    }
+    /** @internal */
+    componentDidUpdate(prevProps) {
+        if (prevProps.labels !== this.props.labels)
+            this._itemKeyboardNavigator.itemCount = this.props.labels.length;
+        if (prevProps.orientation !== this.props.orientation)
+            this._itemKeyboardNavigator.orientation = this.props.orientation;
+        if (prevProps.activeIndex !== this.props.activeIndex) {
+            let hadFocus = false;
+            const element = this._anchorRefs[this.state.activeIndex].current;
+            // istanbul ignore else
+            if (element && document.activeElement === element)
+                hadFocus = true;
+            const activeIndex = this.validateActiveIndex(this.props.activeIndex);
+            this.setState(() => ({ activeIndex }), () => {
+                // istanbul ignore else
+                if (hadFocus) {
+                    const newElement = this._anchorRefs[activeIndex].current;
+                    // istanbul ignore else
+                    if (newElement)
+                        newElement.focus();
+                }
+            });
+        }
+    }
+    /** Handle keydown on tabs */
+    _handleKeyDownEvent(event, index) {
+        this._itemKeyboardNavigator.handleKeyDownEvent(event, index);
+    }
+    /** Handle keyup on tabs */
+    _handleKeyUpEvent(event, index) {
+        this._itemKeyboardNavigator.handleKeyUpEvent(event, index);
+    }
+    /** @internal */
+    render() {
+        const ulClassNames = classnames(this.props.mainClassName, this.props.green && "uicore-tabs-green", this.props.className);
+        const anyIconsPresent = (this.props.labels.reduce((a, b) => a + (isTabLabelWithIcon(b) ? 1 : 0), 0)) > 0;
+        return (React.createElement("ul", { className: ulClassNames, style: this.props.style, role: "tablist", "aria-orientation": this.props.orientation === Orientation.Vertical ? "vertical" : "horizontal" }, this.props.labels.map((label, index) => {
+            let disabled;
+            let tooltipElement;
+            let title;
+            let subLabel;
+            let tabId = "";
+            let icon;
+            if (isTabLabel(label)) {
+                icon = IconHelper.getIconReactNode(label.icon);
+                subLabel = label.subLabel;
+                disabled = label.disabled;
+                tabId = label.tabId;
+                if (React.isValidElement(label.tooltip))
+                    tooltipElement = label.tooltip;
+                else if (typeof label.tooltip === "string")
+                    title = label.tooltip;
+            }
+            return React.createElement("li", { key: index, title: title, className: classnames(index === this.state.activeIndex && "core-active", disabled && "core-tab-item-disabled"), role: "tab", "aria-selected": index === this.state.activeIndex, "data-for": `${tabId}` },
+                tooltipElement,
+                React.createElement("a", { ref: this._anchorRefs[index], tabIndex: index === this.state.activeIndex ? 0 : -1, onClick: () => this._handleTabClick(index), onKeyDown: (event) => this._handleKeyDownEvent(event, index), onKeyUp: (event) => this._handleKeyUpEvent(event, index), "data-testid": `${tabId}`, role: "button" },
+                    " ",
+                    React.createElement("div", { className: classnames("uicore-tabs-inline-label", disabled && "core-tab-item-disabled") },
+                        anyIconsPresent && React.createElement("span", { className: "uicore-tabs-icon" }, icon),
+                        React.createElement("div", { className: "uicore-tabs-label-subLabel-container" },
+                            React.createElement("span", null, (typeof label === "string") ? label : label.label),
+                            subLabel && React.createElement("span", { className: "uicore-tabs-subLabel" }, subLabel)))));
+        })));
+    }
+}
 //# sourceMappingURL=Tabs.js.map

package/lib/esm/core-react/tabs/VerticalTabs.d.ts

@@ -1,10 +1,10 @@
-/** @packageDocumentation
- * @module Tabs
- */
-/// <reference types="react" />
-import { TabsProps } from "./Tabs";
-/** Vertical tabs meant to represent the current position in a page/section
- * @public
- */
-export declare function VerticalTabs(props: TabsProps): JSX.Element;
+/** @packageDocumentation
+ * @module Tabs
+ */
+/// <reference types="react" />
+import { TabsProps } from "./Tabs";
+/** Vertical tabs meant to represent the current position in a page/section
+ * @public
+ */
+export declare function VerticalTabs(props: TabsProps): JSX.Element;
 //# sourceMappingURL=VerticalTabs.d.ts.map

package/lib/esm/core-react/tabs/VerticalTabs.js

@@ -1,17 +1,17 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Tabs
- */
-import * as React from "react";
-import { Tabs } from "./Tabs";
-import { Orientation } from "../enums/Orientation";
-/** Vertical tabs meant to represent the current position in a page/section
- * @public
- */
-export function VerticalTabs(props) {
-    return (React.createElement(Tabs, { mainClassName: "uicore-tabs-vertical", orientation: Orientation.Vertical, ...props }));
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Tabs
+ */
+import * as React from "react";
+import { Tabs } from "./Tabs";
+import { Orientation } from "../enums/Orientation";
+/** Vertical tabs meant to represent the current position in a page/section
+ * @public
+ */
+export function VerticalTabs(props) {
+    return (React.createElement(Tabs, { mainClassName: "uicore-tabs-vertical", orientation: Orientation.Vertical, ...props }));
+}
 //# sourceMappingURL=VerticalTabs.js.map

package/lib/esm/core-react/text/BlockText.d.ts

@@ -1,10 +1,10 @@
-/** @packageDocumentation
- * @module Text
- */
-/// <reference types="react" />
-import { TextProps } from "./TextProps";
-/** Styled block text React functional component
- * @public
- */
-export declare function BlockText(props: TextProps): JSX.Element;
+/** @packageDocumentation
+ * @module Text
+ */
+/// <reference types="react" />
+import { TextProps } from "./TextProps";
+/** Styled block text React functional component
+ * @public
+ */
+export declare function BlockText(props: TextProps): JSX.Element;
 //# sourceMappingURL=BlockText.d.ts.map

package/lib/esm/core-react/text/BlockText.js

@@ -1,17 +1,17 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Text
- */
-import * as React from "react";
-import { StyledText } from "./StyledText";
-/** Styled block text React functional component
- * @public
- */
-export function BlockText(props) {
-    { /* eslint-disable-next-line */ }
-    return React.createElement(StyledText, { ...props, mainClassName: "uicore-text-block" });
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Text
+ */
+import * as React from "react";
+import { StyledText } from "./StyledText";
+/** Styled block text React functional component
+ * @public
+ */
+export function BlockText(props) {
+    { /* eslint-disable-next-line */ }
+    return React.createElement(StyledText, { ...props, mainClassName: "uicore-text-block" });
+}
 //# sourceMappingURL=BlockText.js.map

package/lib/esm/core-react/text/BodyText.d.ts

@@ -1,11 +1,11 @@
-/** @packageDocumentation
- * @module Text
- */
-/// <reference types="react" />
-import { TextProps } from "./TextProps";
-/** Styled body text React functional component
- * @public
- * @deprecated Use <Text variant='body' /> from iTwinUI-react package.
- */
-export declare function BodyText(props: TextProps): JSX.Element;
+/** @packageDocumentation
+ * @module Text
+ */
+/// <reference types="react" />
+import { TextProps } from "./TextProps";
+/** Styled body text React functional component
+ * @public
+ * @deprecated in 4.0 Use \<Text variant='body' /\> from iTwinUI-react package.
+ */
+export declare function BodyText(props: TextProps): JSX.Element;
 //# sourceMappingURL=BodyText.d.ts.map

package/lib/esm/core-react/text/BodyText.js

@@ -1,18 +1,18 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Text
- */
-import * as React from "react";
-import { StyledText } from "./StyledText";
-/** Styled body text React functional component
- * @public
- * @deprecated Use <Text variant='body' /> from iTwinUI-react package.
- */
-export function BodyText(props) {
-    { /* eslint-disable-next-line */ }
-    return React.createElement(StyledText, { ...props, mainClassName: "uicore-text-body" });
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Text
+ */
+import * as React from "react";
+import { StyledText } from "./StyledText";
+/** Styled body text React functional component
+ * @public
+ * @deprecated in 4.0 Use \<Text variant='body' /\> from iTwinUI-react package.
+ */
+export function BodyText(props) {
+    { /* eslint-disable-next-line */ }
+    return React.createElement(StyledText, { ...props, mainClassName: "uicore-text-body" });
+}
 //# sourceMappingURL=BodyText.js.map

package/lib/esm/core-react/text/BodyText.js.map

@@ -1 +1 @@
-{"version":3,"file":"BodyText.js","sourceRoot":"","sources":["../../../../src/core-react/text/BodyText.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C;;;GAGG;AACH,MAAM,UAAU,QAAQ,CAAC,KAAgB;IACvC,EAAC,8BAA8B,EAAC;IAChC,OAAO,oBAAC,UAAU,OAAK,KAAK,EAAE,aAAa,EAAC,kBAAkB,GAAG,CAAC;AACpE,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 Text\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { StyledText } from \"./StyledText\";\r\nimport { TextProps } from \"./TextProps\";\r\n\r\n/** Styled body text React functional component\r\n * @public\r\n * @deprecated Use <Text variant='body' /> from iTwinUI-react package.\r\n */\r\nexport function BodyText(props: TextProps) {\r\n  {/* eslint-disable-next-line */}\r\n  return <StyledText {...props} mainClassName=\"uicore-text-body\" />;\r\n}\r\n"]}
+{"version":3,"file":"BodyText.js","sourceRoot":"","sources":["../../../../src/core-react/text/BodyText.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C;;;GAGG;AACH,MAAM,UAAU,QAAQ,CAAC,KAAgB;IACvC,EAAC,8BAA8B,EAAC;IAChC,OAAO,oBAAC,UAAU,OAAK,KAAK,EAAE,aAAa,EAAC,kBAAkB,GAAG,CAAC;AACpE,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 Text\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { StyledText } from \"./StyledText\";\r\nimport { TextProps } from \"./TextProps\";\r\n\r\n/** Styled body text React functional component\r\n * @public\r\n * @deprecated in 4.0 Use \\<Text variant='body' /\\> from iTwinUI-react package.\r\n */\r\nexport function BodyText(props: TextProps) {\r\n  {/* eslint-disable-next-line */}\r\n  return <StyledText {...props} mainClassName=\"uicore-text-body\" />;\r\n}\r\n"]}

package/lib/esm/core-react/text/DisabledText.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="react" />
-import { TextProps } from "./TextProps";
-/** Styled disabled text React functional component
- * @public
- */
-export declare function DisabledText(props: TextProps): JSX.Element;
+/// <reference types="react" />
+import { TextProps } from "./TextProps";
+/** Styled disabled text React functional component
+ * @public
+ */
+export declare function DisabledText(props: TextProps): JSX.Element;
 //# sourceMappingURL=DisabledText.d.ts.map

package/lib/esm/core-react/text/DisabledText.js

@@ -1,17 +1,17 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Text
- */
-import * as React from "react";
-import { StyledText } from "./StyledText";
-/** Styled disabled text React functional component
- * @public
- */
-export function DisabledText(props) {
-    { /* eslint-disable-next-line */ }
-    return React.createElement(StyledText, { ...props, mainClassName: "uicore-text-disabled" });
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Text
+ */
+import * as React from "react";
+import { StyledText } from "./StyledText";
+/** Styled disabled text React functional component
+ * @public
+ */
+export function DisabledText(props) {
+    { /* eslint-disable-next-line */ }
+    return React.createElement(StyledText, { ...props, mainClassName: "uicore-text-disabled" });
+}
 //# sourceMappingURL=DisabledText.js.map

package/lib/esm/core-react/text/FilteredText.d.ts

@@ -1,25 +1,25 @@
-/** @packageDocumentation
- * @module Text
- */
-import * as React from "react";
-import { IMatch } from "@itwin/appui-abstract";
-import { CommonProps } from "../utils/Props";
-import "./FilteredText.scss";
-/** Props supported by [FilteredText] component
- * @alpha
- */
-export interface FilteredTextProps extends CommonProps {
-    /** string that matched a filter string */
-    value: string;
-    /** define array of start and end positions of filter matches. */
-    matches?: IMatch[];
-    /** holds class name for matching span text. */
-    matchClassName?: string;
-    /** holds style for matching span text. */
-    matchStyle?: React.CSSProperties;
-}
-/** Component used to highlight filter matches within a text string.
- * @alpha
- */
-export declare function FilteredText(props: FilteredTextProps): JSX.Element;
+/** @packageDocumentation
+ * @module Text
+ */
+import * as React from "react";
+import { IMatch } from "@itwin/appui-abstract";
+import { CommonProps } from "../utils/Props";
+import "./FilteredText.scss";
+/** Props supported by [FilteredText] component
+ * @alpha
+ */
+export interface FilteredTextProps extends CommonProps {
+    /** string that matched a filter string */
+    value: string;
+    /** define array of start and end positions of filter matches. */
+    matches?: IMatch[];
+    /** holds class name for matching span text. */
+    matchClassName?: string;
+    /** holds style for matching span text. */
+    matchStyle?: React.CSSProperties;
+}
+/** Component used to highlight filter matches within a text string.
+ * @alpha
+ */
+export declare function FilteredText(props: FilteredTextProps): JSX.Element;
 //# sourceMappingURL=FilteredText.d.ts.map

package/lib/esm/core-react/text/FilteredText.js

@@ -1,37 +1,37 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Text
- */
-// cSpell:ignore focusvalue
-import * as React from "react";
-import classnames from "classnames";
-import "./FilteredText.scss";
-/** Component used to highlight filter matches within a text string.
- * @alpha
- */
-export function FilteredText(props) {
-    const { value, className, matches, matchClassName, matchStyle, ...otherProps } = props;
-    // istanbul ignore else
-    if (matches && matches.length > 0) {
-        const spans = [];
-        let startPos = 0;
-        for (const span of matches) {
-            // istanbul ignore else
-            if (span.start !== startPos)
-                spans.push(React.createElement("span", { key: startPos, className: "uicore-partial-filtered-text" }, value.substr(startPos, span.start - startPos)));
-            spans.push(React.createElement("span", { key: span.start, style: matchStyle, className: classnames("uicore-filtered-text-match", matchClassName) }, value.substr(span.start, span.end - span.start)));
-            startPos = span.end;
-        }
-        const endPos = value.length;
-        // istanbul ignore else
-        if (startPos < endPos) {
-            spans.push(React.createElement("span", { key: startPos, className: "uicore-partial-filtered-text" }, value.substr(startPos, endPos - startPos)));
-        }
-        return React.createElement("div", { ...otherProps, className: classnames("uicore-filtered-text", className), title: value }, spans);
-    }
-    return React.createElement("span", { ...otherProps, className: classnames("uicore-filtered-text", className), title: value }, value);
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Text
+ */
+// cSpell:ignore focusvalue
+import * as React from "react";
+import classnames from "classnames";
+import "./FilteredText.scss";
+/** Component used to highlight filter matches within a text string.
+ * @alpha
+ */
+export function FilteredText(props) {
+    const { value, className, matches, matchClassName, matchStyle, ...otherProps } = props;
+    // istanbul ignore else
+    if (matches && matches.length > 0) {
+        const spans = [];
+        let startPos = 0;
+        for (const span of matches) {
+            // istanbul ignore else
+            if (span.start !== startPos)
+                spans.push(React.createElement("span", { key: startPos, className: "uicore-partial-filtered-text" }, value.substring(startPos, span.start)));
+            spans.push(React.createElement("span", { key: span.start, style: matchStyle, className: classnames("uicore-filtered-text-match", matchClassName) }, value.substring(span.start, span.end)));
+            startPos = span.end;
+        }
+        const endPos = value.length;
+        // istanbul ignore else
+        if (startPos < endPos) {
+            spans.push(React.createElement("span", { key: startPos, className: "uicore-partial-filtered-text" }, value.substring(startPos, endPos)));
+        }
+        return React.createElement("div", { ...otherProps, className: classnames("uicore-filtered-text", className), title: value }, spans);
+    }
+    return React.createElement("span", { ...otherProps, className: classnames("uicore-filtered-text", className), title: value }, value);
+}
 //# sourceMappingURL=FilteredText.js.map

package/lib/esm/core-react/text/FilteredText.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilteredText.js","sourceRoot":"","sources":["../../../../src/core-react/text/FilteredText.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,2BAA2B;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AAGpC,OAAO,qBAAqB,CAAC;AAgB7B;;GAEG;AACH,MAAM,UAAU,YAAY,CAAC,KAAwB;IACnD,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IACvF,uBAAuB;IACvB,IAAI,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;QACjC,MAAM,KAAK,GAAsB,EAAE,CAAC;QAEpC,IAAI,QAAQ,GAAG,CAAC,CAAC;QACjB,KAAK,MAAM,IAAI,IAAI,OAAO,EAAE;YAC5B,uBAAuB;YACrB,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ;gBACzB,KAAK,CAAC,IAAI,CAAC,8BAAM,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,8BAA8B,IAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,CAAS,CAAC,CAAC;YACpI,KAAK,CAAC,IAAI,CAAC,8BAAM,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,CAAC,4BAA4B,EAAE,cAAc,CAAC,IAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAQ,CAAC,CAAC;YACpL,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC;SACrB;QACD,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;QAC5B,uBAAuB;QACvB,IAAI,QAAQ,GAAG,MAAM,EAAE;YACrB,KAAK,CAAC,IAAI,CAAC,8BAAM,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,8BAA8B,IAAE,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAAC,CAAQ,CAAC,CAAC;SAC9H;QACD,OAAO,gCAAS,UAAU,EAAE,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IAAG,KAAK,CAAO,CAAC;KACnH;IAED,OAAO,iCAAU,UAAU,EAAE,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IAAG,KAAK,CAAQ,CAAC;AACtH,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 Text\r\n */\r\n\r\n// cSpell:ignore focusvalue\r\n\r\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\nimport { IMatch } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport \"./FilteredText.scss\";\r\n\r\n/** Props supported by [FilteredText] component\r\n * @alpha\r\n */\r\nexport interface FilteredTextProps extends CommonProps {\r\n  /** string that matched a filter string */\r\n  value: string;\r\n  /** define array of start and end positions of filter matches. */\r\n  matches?: IMatch[];\r\n  /** holds class name for matching span text. */\r\n  matchClassName?: string;\r\n  /** holds style for matching span text. */\r\n  matchStyle?: React.CSSProperties;\r\n}\r\n\r\n/** Component used to highlight filter matches within a text string.\r\n * @alpha\r\n */\r\nexport function FilteredText(props: FilteredTextProps) {\r\n  const { value, className, matches, matchClassName, matchStyle, ...otherProps } = props;\r\n  // istanbul ignore else\r\n  if (matches && matches.length > 0) {\r\n    const spans: React.ReactNode[] = [];\r\n\r\n    let startPos = 0;\r\n    for (const span of matches) {\r\n    // istanbul ignore else\r\n      if (span.start !== startPos)\r\n        spans.push(<span key={startPos} className=\"uicore-partial-filtered-text\">{value.substr(startPos, span.start - startPos)}</span >);\r\n      spans.push(<span key={span.start} style={matchStyle} className={classnames(\"uicore-filtered-text-match\", matchClassName)}>{value.substr(span.start, span.end - span.start)}</span>);\r\n      startPos = span.end;\r\n    }\r\n    const endPos = value.length;\r\n    // istanbul ignore else\r\n    if (startPos < endPos) {\r\n      spans.push(<span key={startPos} className=\"uicore-partial-filtered-text\">{value.substr(startPos, endPos - startPos)}</span>);\r\n    }\r\n    return <div {...otherProps} className={classnames(\"uicore-filtered-text\", className)} title={value}>{spans}</div>;\r\n  }\r\n\r\n  return <span {...otherProps} className={classnames(\"uicore-filtered-text\", className)} title={value}>{value}</span>;\r\n}\r\n"]}
+{"version":3,"file":"FilteredText.js","sourceRoot":"","sources":["../../../../src/core-react/text/FilteredText.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,2BAA2B;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,UAAU,MAAM,YAAY,CAAC;AAGpC,OAAO,qBAAqB,CAAC;AAgB7B;;GAEG;AACH,MAAM,UAAU,YAAY,CAAC,KAAwB;IACnD,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,GAAG,UAAU,EAAE,GAAG,KAAK,CAAC;IACvF,uBAAuB;IACvB,IAAI,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;QACjC,MAAM,KAAK,GAAsB,EAAE,CAAC;QAEpC,IAAI,QAAQ,GAAG,CAAC,CAAC;QACjB,KAAK,MAAM,IAAI,IAAI,OAAO,EAAE;YAC5B,uBAAuB;YACrB,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ;gBACzB,KAAK,CAAC,IAAI,CAAC,8BAAM,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,8BAA8B,IAAE,KAAK,CAAC,SAAS,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,CAAS,CAAC,CAAC;YAC5H,KAAK,CAAC,IAAI,CAAC,8BAAM,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,CAAC,4BAA4B,EAAE,cAAc,CAAC,IAAG,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAQ,CAAC,CAAC;YAC1K,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC;SACrB;QACD,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;QAC5B,uBAAuB;QACvB,IAAI,QAAQ,GAAG,MAAM,EAAE;YACrB,KAAK,CAAC,IAAI,CAAC,8BAAM,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,8BAA8B,IAAE,KAAK,CAAC,SAAS,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAQ,CAAC,CAAC;SACtH;QACD,OAAO,gCAAS,UAAU,EAAE,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IAAG,KAAK,CAAO,CAAC;KACnH;IAED,OAAO,iCAAU,UAAU,EAAE,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IAAG,KAAK,CAAQ,CAAC;AACtH,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 Text\r\n */\r\n\r\n// cSpell:ignore focusvalue\r\n\r\nimport * as React from \"react\";\r\nimport classnames from \"classnames\";\r\nimport { IMatch } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"../utils/Props\";\r\nimport \"./FilteredText.scss\";\r\n\r\n/** Props supported by [FilteredText] component\r\n * @alpha\r\n */\r\nexport interface FilteredTextProps extends CommonProps {\r\n  /** string that matched a filter string */\r\n  value: string;\r\n  /** define array of start and end positions of filter matches. */\r\n  matches?: IMatch[];\r\n  /** holds class name for matching span text. */\r\n  matchClassName?: string;\r\n  /** holds style for matching span text. */\r\n  matchStyle?: React.CSSProperties;\r\n}\r\n\r\n/** Component used to highlight filter matches within a text string.\r\n * @alpha\r\n */\r\nexport function FilteredText(props: FilteredTextProps) {\r\n  const { value, className, matches, matchClassName, matchStyle, ...otherProps } = props;\r\n  // istanbul ignore else\r\n  if (matches && matches.length > 0) {\r\n    const spans: React.ReactNode[] = [];\r\n\r\n    let startPos = 0;\r\n    for (const span of matches) {\r\n    // istanbul ignore else\r\n      if (span.start !== startPos)\r\n        spans.push(<span key={startPos} className=\"uicore-partial-filtered-text\">{value.substring(startPos, span.start)}</span >);\r\n      spans.push(<span key={span.start} style={matchStyle} className={classnames(\"uicore-filtered-text-match\", matchClassName)}>{value.substring(span.start, span.end)}</span>);\r\n      startPos = span.end;\r\n    }\r\n    const endPos = value.length;\r\n    // istanbul ignore else\r\n    if (startPos < endPos) {\r\n      spans.push(<span key={startPos} className=\"uicore-partial-filtered-text\">{value.substring(startPos, endPos)}</span>);\r\n    }\r\n    return <div {...otherProps} className={classnames(\"uicore-filtered-text\", className)} title={value}>{spans}</div>;\r\n  }\r\n\r\n  return <span {...otherProps} className={classnames(\"uicore-filtered-text\", className)} title={value}>{value}</span>;\r\n}\r\n"]}