@itwin/appui-react 4.0.0-dev.9 → 4.0.0

package/lib/cjs/appui-react/navigationaids/SheetsModalFrontstage.d.ts

@@ -1,118 +1,118 @@
-/** @packageDocumentation
- * @module NavigationAids
- */
-import "./SheetsModalFrontstage.scss";
-import * as React from "react";
-import { IModelConnection } from "@itwin/core-frontend";
-import { UiEvent } from "@itwin/appui-abstract";
-import { CommonProps } from "@itwin/core-react";
-import { ModalFrontstageInfo } from "../framework/FrameworkFrontstages";
-import { SheetData } from "./SheetNavigationAid";
-/** Data about a sheet card
- * @alpha
- */
-export interface CardInfo {
-    index: number;
-    label: string;
-    iconSpec: string;
-    isActive: boolean;
-    viewId: any;
-}
-/** Arguments for CardSelectedEvent
- * @alpha
- */
-export interface CardSelectedEventArgs {
-    id: any;
-    index: number;
-}
-/** Class for CardSelectedEvent
- * @alpha
- */
-export declare class CardSelectedEvent extends UiEvent<CardSelectedEventArgs> {
-}
-/** Modal frontstage displaying sheet information in cards.
- * @alpha
- */
-export declare class SheetsModalFrontstage implements ModalFrontstageInfo {
-    title: string;
-    private _cards;
-    private _connection;
-    private _currentIndex;
-    private _searchValue;
-    /**
-     * Creates a SheetsModalFrontstage
-     * @param sheets Collection of sheets available in SheetNavigationAid
-     * @param connection IModelConnection to query for sheet ViewState
-     */
-    constructor(sheets: SheetData[], connection: IModelConnection, currentIndex: number);
-    /**
-     * Gathers card info from available sheets
-     * @param sheets SheetData from available sheets
-     */
-    private _storeSheetsAsCards;
-    /** Gets set of cards */
-    get content(): React.ReactNode;
-    /** Gets components to be placed in the app bar */
-    get appBarRight(): React.ReactNode;
-    /** Updates stage based on search value */
-    private _handleSearchValueChanged;
-}
-/** Properties for [[CardContainer]]
- * @alpha
- */
-export interface CardContainerProps extends CommonProps {
-    cards: CardInfo[];
-    searchValue: string;
-    connection: IModelConnection;
-}
-/** Displays cards in SheetModalFrontstage
- * @alpha
- */
-export declare class CardContainer extends React.Component<CardContainerProps> {
-    private static _cardSelectedEvent;
-    /** Get CardSelectedEvent event */
-    static get onCardSelectedEvent(): CardSelectedEvent;
-    /** @internal */
-    render(): JSX.Element;
-    /**
-     * Determines if string contains a substring
-     * @param valueA The string to search through
-     * @param valueB The value to search for
-     * @return True if valueB can be found in valueA, false otherwise
-     */
-    private contains;
-    /**
-     * Updates view with ViewState for selected card.
-     * @param card Data about the sheet card selected.
-     */
-    private _handleCardSelected;
-}
-/** Properties for [[SheetCard]]
- * @alpha
- */
-export interface SheetCardProps {
-    label: string;
-    index: number;
-    iconSpec: string;
-    isActive: boolean;
-    onClick: () => void;
-}
-/** State for [[SheetCard]]
- * @internal
- */
-interface SheetCardState {
-    isActive: boolean;
-    isPressed: boolean;
-}
-/** Displays information about an individual sheet
- * @alpha
- */
-export declare class SheetCard extends React.Component<SheetCardProps, SheetCardState> {
-    constructor(props: SheetCardProps);
-    private _onClick;
-    private _onMouseDown;
-    private _onMouseLeave;
-    render(): JSX.Element;
-}
-export {};
+/** @packageDocumentation
+ * @module NavigationAids
+ */
+import "./SheetsModalFrontstage.scss";
+import * as React from "react";
+import { IModelConnection } from "@itwin/core-frontend";
+import { UiEvent } from "@itwin/appui-abstract";
+import { CommonProps, IconSpec } from "@itwin/core-react";
+import { ModalFrontstageInfo } from "../framework/FrameworkFrontstages";
+import { SheetData } from "./SheetNavigationAid";
+/** Data about a sheet card
+ * @alpha
+ */
+export interface CardInfo {
+    index: number;
+    label: string;
+    iconSpec: IconSpec;
+    isActive: boolean;
+    viewId: any;
+}
+/** Arguments for CardSelectedEvent
+ * @alpha
+ */
+export interface CardSelectedEventArgs {
+    id: any;
+    index: number;
+}
+/** Class for CardSelectedEvent
+ * @alpha
+ */
+export declare class CardSelectedEvent extends UiEvent<CardSelectedEventArgs> {
+}
+/** Modal frontstage displaying sheet information in cards.
+ * @alpha
+ */
+export declare class SheetsModalFrontstage implements ModalFrontstageInfo {
+    title: string;
+    private _cards;
+    private _connection;
+    private _currentIndex;
+    private _searchValue;
+    /**
+     * Creates a SheetsModalFrontstage
+     * @param sheets Collection of sheets available in SheetNavigationAid
+     * @param connection IModelConnection to query for sheet ViewState
+     */
+    constructor(sheets: SheetData[], connection: IModelConnection, currentIndex: number);
+    /**
+     * Gathers card info from available sheets
+     * @param sheets SheetData from available sheets
+     */
+    private _storeSheetsAsCards;
+    /** Gets set of cards */
+    get content(): React.ReactNode;
+    /** Gets components to be placed in the app bar */
+    get appBarRight(): React.ReactNode;
+    /** Updates stage based on search value */
+    private _handleSearchValueChanged;
+}
+/** Properties for [[CardContainer]]
+ * @alpha
+ */
+export interface CardContainerProps extends CommonProps {
+    cards: CardInfo[];
+    searchValue: string;
+    connection: IModelConnection;
+}
+/** Displays cards in SheetModalFrontstage
+ * @alpha
+ */
+export declare class CardContainer extends React.Component<CardContainerProps> {
+    private static _cardSelectedEvent;
+    /** Get CardSelectedEvent event */
+    static get onCardSelectedEvent(): CardSelectedEvent;
+    /** @internal */
+    render(): JSX.Element;
+    /**
+     * Determines if string contains a substring
+     * @param valueA The string to search through
+     * @param valueB The value to search for
+     * @return True if valueB can be found in valueA, false otherwise
+     */
+    private contains;
+    /**
+     * Updates view with ViewState for selected card.
+     * @param card Data about the sheet card selected.
+     */
+    private _handleCardSelected;
+}
+/** Properties for [[SheetCard]]
+ * @alpha
+ */
+export interface SheetCardProps {
+    label: string;
+    index: number;
+    iconSpec: IconSpec;
+    isActive: boolean;
+    onClick: () => void;
+}
+/** State for [[SheetCard]]
+ * @internal
+ */
+interface SheetCardState {
+    isActive: boolean;
+    isPressed: boolean;
+}
+/** Displays information about an individual sheet
+ * @alpha
+ */
+export declare class SheetCard extends React.Component<SheetCardProps, SheetCardState> {
+    constructor(props: SheetCardProps);
+    private _onClick;
+    private _onMouseDown;
+    private _onMouseLeave;
+    render(): JSX.Element;
+}
+export {};
 //# sourceMappingURL=SheetsModalFrontstage.d.ts.map

package/lib/cjs/appui-react/navigationaids/SheetsModalFrontstage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SheetsModalFrontstage.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/SheetsModalFrontstage.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAa,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAoD,MAAM,mBAAmB,CAAC;AAClG,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAExE,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,GAAG,CAAC;CACb;AAED;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,GAAG,CAAC;IACR,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,qBAAa,iBAAkB,SAAQ,OAAO,CAAC,qBAAqB,CAAC;CAAI;AAEzE;;GAEG;AACH,qBAAa,qBAAsB,YAAW,mBAAmB;IACxD,KAAK,EAAE,MAAM,CAAgE;IACpF,OAAO,CAAC,MAAM,CAAkB;IAChC,OAAO,CAAC,WAAW,CAAmB;IACtC,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,YAAY,CAAc;IAElC;;;;OAIG;gBACS,MAAM,EAAE,SAAS,EAAE,EAAE,UAAU,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM;IAMnF;;;OAGG;IACH,OAAO,CAAC,mBAAmB;IAM3B,wBAAwB;IACxB,IAAW,OAAO,IAAI,KAAK,CAAC,SAAS,CAEpC;IAED,kDAAkD;IAClD,IAAW,WAAW,IAAI,KAAK,CAAC,SAAS,CAIxC;IAED,0CAA0C;IAE1C,OAAO,CAAC,yBAAyB,CAG/B;CACH;AAED;;GAEG;AACH,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,gBAAgB,CAAC;CAC9B;AAED;;GAEG;AACH,qBAAa,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,CAAC;IACpE,OAAO,CAAC,MAAM,CAAC,kBAAkB,CAA8C;IAE/E,kCAAkC;IAClC,WAAkB,mBAAmB,IAAI,iBAAiB,CAA6C;IAEvG,gBAAgB;IACA,MAAM;IA2BtB;;;;;OAKG;IACH,OAAO,CAAC,QAAQ;IAUhB;;;OAGG;YACW,mBAAmB;CAYlC;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED;;GAEG;AACH,UAAU,cAAc;IACtB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,EAAE,cAAc,CAAC;gBAChE,KAAK,EAAE,cAAc;IAKjC,OAAO,CAAC,QAAQ,CAEd;IAEF,OAAO,CAAC,YAAY,CAElB;IAEF,OAAO,CAAC,aAAa,CAGnB;IAEc,MAAM;CAyBvB"}
+{"version":3,"file":"SheetsModalFrontstage.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/SheetsModalFrontstage.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAa,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,WAAW,EAA2B,QAAQ,EAAiC,MAAM,mBAAmB,CAAC;AAClH,OAAO,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAExE,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAGjD;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,GAAG,CAAC;CACb;AAED;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,GAAG,CAAC;IACR,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,qBAAa,iBAAkB,SAAQ,OAAO,CAAC,qBAAqB,CAAC;CAAI;AAEzE;;GAEG;AACH,qBAAa,qBAAsB,YAAW,mBAAmB;IACxD,KAAK,EAAE,MAAM,CAAgE;IACpF,OAAO,CAAC,MAAM,CAAkB;IAChC,OAAO,CAAC,WAAW,CAAmB;IACtC,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,YAAY,CAAc;IAElC;;;;OAIG;gBACS,MAAM,EAAE,SAAS,EAAE,EAAE,UAAU,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM;IAMnF;;;OAGG;IACH,OAAO,CAAC,mBAAmB;IAM3B,wBAAwB;IACxB,IAAW,OAAO,IAAI,KAAK,CAAC,SAAS,CAEpC;IAED,kDAAkD;IAClD,IAAW,WAAW,IAAI,KAAK,CAAC,SAAS,CAIxC;IAED,0CAA0C;IAE1C,OAAO,CAAC,yBAAyB,CAG/B;CACH;AAED;;GAEG;AACH,MAAM,WAAW,kBAAmB,SAAQ,WAAW;IACrD,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,gBAAgB,CAAC;CAC9B;AAED;;GAEG;AACH,qBAAa,aAAc,SAAQ,KAAK,CAAC,SAAS,CAAC,kBAAkB,CAAC;IACpE,OAAO,CAAC,MAAM,CAAC,kBAAkB,CAA8C;IAE/E,kCAAkC;IAClC,WAAkB,mBAAmB,IAAI,iBAAiB,CAA6C;IAEvG,gBAAgB;IACA,MAAM;IAyBtB;;;;;OAKG;IACH,OAAO,CAAC,QAAQ;IAUhB;;;OAGG;YACW,mBAAmB;CAYlC;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED;;GAEG;AACH,UAAU,cAAc;IACtB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,qBAAa,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,EAAE,cAAc,CAAC;gBAChE,KAAK,EAAE,cAAc;IAKjC,OAAO,CAAC,QAAQ,CAEd;IAEF,OAAO,CAAC,YAAY,CAElB;IAEF,OAAO,CAAC,aAAa,CAGnB;IAEc,MAAM;CAsBvB"}

package/lib/cjs/appui-react/navigationaids/SheetsModalFrontstage.js

@@ -1,150 +1,152 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module NavigationAids
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SheetCard = exports.CardContainer = exports.SheetsModalFrontstage = exports.CardSelectedEvent = void 0;
-require("./SheetsModalFrontstage.scss");
-const classnames_1 = require("classnames");
-const React = require("react");
-const core_frontend_1 = require("@itwin/core-frontend");
-const appui_abstract_1 = require("@itwin/appui-abstract");
-const core_react_1 = require("@itwin/core-react");
-const UiFramework_1 = require("../UiFramework");
-/** Class for CardSelectedEvent
- * @alpha
- */
-class CardSelectedEvent extends appui_abstract_1.UiEvent {
-}
-exports.CardSelectedEvent = CardSelectedEvent;
-/** Modal frontstage displaying sheet information in cards.
- * @alpha
- */
-class SheetsModalFrontstage {
-    /**
-     * Creates a SheetsModalFrontstage
-     * @param sheets Collection of sheets available in SheetNavigationAid
-     * @param connection IModelConnection to query for sheet ViewState
-     */
-    constructor(sheets, connection, currentIndex) {
-        this.title = UiFramework_1.UiFramework.translate("navigationAid.sheetsModalFrontstage");
-        this._cards = [];
-        this._searchValue = "";
-        /** Updates stage based on search value */
-        // istanbul ignore next
-        this._handleSearchValueChanged = (value) => {
-            this._searchValue = value;
-            UiFramework_1.UiFramework.frontstages.updateModalFrontstage();
-        };
-        this._connection = connection;
-        this._currentIndex = currentIndex;
-        this._storeSheetsAsCards(sheets);
-    }
-    /**
-     * Gathers card info from available sheets
-     * @param sheets SheetData from available sheets
-     */
-    _storeSheetsAsCards(sheets) {
-        sheets.forEach((sheet, index) => {
-            this._cards.push({ index, label: sheet.name, iconSpec: "icon-document", viewId: sheet.viewId, isActive: index === this._currentIndex });
-        });
-    }
-    /** Gets set of cards */
-    get content() {
-        return React.createElement(CardContainer, { cards: this._cards, searchValue: this._searchValue, connection: this._connection });
-    }
-    /** Gets components to be placed in the app bar */
-    get appBarRight() {
-        return (React.createElement(core_react_1.SearchBox, { placeholder: core_react_1.UiCore.translate("general.search"), onValueChanged: this._handleSearchValueChanged, valueChangedDelay: 250 }));
-    }
-}
-exports.SheetsModalFrontstage = SheetsModalFrontstage;
-/** Displays cards in SheetModalFrontstage
- * @alpha
- */
-class CardContainer extends React.Component {
-    /** Get CardSelectedEvent event */
-    static get onCardSelectedEvent() { return CardContainer._cardSelectedEvent; }
-    /** @internal */
-    render() {
-        return (React.createElement(core_react_1.ScrollView, { className: this.props.className, style: this.props.style },
-            React.createElement(core_react_1.FlexWrapContainer, null, this.props.cards.map((card, _index) => {
-                let includeCard = true;
-                const iconClassName = (typeof card.iconSpec === "string") ? card.iconSpec : /* istanbul ignore next */ "icon-placeholder";
-                if (this.props.searchValue) {
-                    includeCard = this.contains(card.label, this.props.searchValue);
-                }
-                if (includeCard) {
-                    return (React.createElement(SheetCard, { key: card.label, label: card.label, index: card.index, iconSpec: iconClassName, isActive: card.isActive, onClick: async () => this._handleCardSelected(card) }));
-                }
-                return null;
-            }))));
-    }
-    /**
-     * Determines if string contains a substring
-     * @param valueA The string to search through
-     * @param valueB The value to search for
-     * @return True if valueB can be found in valueA, false otherwise
-     */
-    contains(valueA, valueB) {
-        if (!valueA || !valueB)
-            return false;
-        if (valueB.length > valueA.length)
-            return false;
-        return valueA.toLocaleUpperCase().indexOf(valueB.toLocaleUpperCase(), 0) !== -1;
-    }
-    /**
-     * Updates view with ViewState for selected card.
-     * @param card Data about the sheet card selected.
-     */
-    async _handleCardSelected(card) {
-        // istanbul ignore if
-        if (core_frontend_1.IModelApp.viewManager && core_frontend_1.IModelApp.viewManager.selectedView) {
-            const vp = core_frontend_1.IModelApp.viewManager.selectedView;
-            const viewState = await this.props.connection.views.load(card.viewId);
-            vp.changeView(viewState);
-        }
-        card.isActive = true;
-        UiFramework_1.UiFramework.frontstages.closeModalFrontstage();
-        CardContainer.onCardSelectedEvent.emit({ id: card.viewId, index: card.index });
-    }
-}
-exports.CardContainer = CardContainer;
-CardContainer._cardSelectedEvent = new CardSelectedEvent();
-/** Displays information about an individual sheet
- * @alpha
- */
-class SheetCard extends React.Component {
-    constructor(props) {
-        super(props);
-        this._onClick = () => {
-            this.setState({ isActive: true }, () => this.props.onClick());
-        };
-        this._onMouseDown = () => {
-            this.setState({ isPressed: true });
-        };
-        this._onMouseLeave = () => {
-            if (this.state.isPressed)
-                this.setState({ isPressed: false });
-        };
-        this.state = { isActive: this.props.isActive, isPressed: false };
-    }
-    render() {
-        const { label, index, iconSpec } = this.props;
-        const className = (0, classnames_1.default)("uifw-sheet-card", this.state.isActive && "is-active", this.state.isPressed && "is-pressed");
-        const iconClassName = (0, classnames_1.default)("icon", (typeof iconSpec === "string") ? iconSpec : /* istanbul ignore next */ "icon-placeholder");
-        return (
-        // eslint-disable-next-line jsx-a11y/click-events-have-key-events
-        React.createElement("div", { className: className, onClick: this._onClick, onMouseDown: this._onMouseDown, onMouseLeave: this._onMouseLeave, role: "button", tabIndex: -1 },
-            label,
-            React.createElement("div", { className: "sheet-image-container" },
-                React.createElement("div", { className: iconClassName })),
-            React.createElement("div", { className: "sheet-index" }, index + 1)));
-    }
-}
-exports.SheetCard = SheetCard;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module NavigationAids
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SheetCard = exports.CardContainer = exports.SheetsModalFrontstage = exports.CardSelectedEvent = void 0;
+require("./SheetsModalFrontstage.scss");
+const classnames_1 = require("classnames");
+const React = require("react");
+const core_frontend_1 = require("@itwin/core-frontend");
+const appui_abstract_1 = require("@itwin/appui-abstract");
+const core_react_1 = require("@itwin/core-react");
+const UiFramework_1 = require("../UiFramework");
+const itwinui_icons_react_1 = require("@itwin/itwinui-icons-react");
+/** Class for CardSelectedEvent
+ * @alpha
+ */
+class CardSelectedEvent extends appui_abstract_1.UiEvent {
+}
+exports.CardSelectedEvent = CardSelectedEvent;
+/** Modal frontstage displaying sheet information in cards.
+ * @alpha
+ */
+class SheetsModalFrontstage {
+    /**
+     * Creates a SheetsModalFrontstage
+     * @param sheets Collection of sheets available in SheetNavigationAid
+     * @param connection IModelConnection to query for sheet ViewState
+     */
+    constructor(sheets, connection, currentIndex) {
+        this.title = UiFramework_1.UiFramework.translate("navigationAid.sheetsModalFrontstage");
+        this._cards = [];
+        this._searchValue = "";
+        /** Updates stage based on search value */
+        // istanbul ignore next
+        this._handleSearchValueChanged = (value) => {
+            this._searchValue = value;
+            UiFramework_1.UiFramework.frontstages.updateModalFrontstage();
+        };
+        this._connection = connection;
+        this._currentIndex = currentIndex;
+        this._storeSheetsAsCards(sheets);
+    }
+    /**
+     * Gathers card info from available sheets
+     * @param sheets SheetData from available sheets
+     */
+    _storeSheetsAsCards(sheets) {
+        sheets.forEach((sheet, index) => {
+            this._cards.push({ index, label: sheet.name, iconSpec: React.createElement(itwinui_icons_react_1.SvgDocument, null), viewId: sheet.viewId, isActive: index === this._currentIndex });
+        });
+    }
+    /** Gets set of cards */
+    get content() {
+        return React.createElement(CardContainer, { cards: this._cards, searchValue: this._searchValue, connection: this._connection });
+    }
+    /** Gets components to be placed in the app bar */
+    get appBarRight() {
+        return (React.createElement(core_react_1.SearchBox, { placeholder: core_react_1.UiCore.translate("general.search"), onValueChanged: this._handleSearchValueChanged, valueChangedDelay: 250 }));
+    }
+}
+exports.SheetsModalFrontstage = SheetsModalFrontstage;
+/** Displays cards in SheetModalFrontstage
+ * @alpha
+ */
+class CardContainer extends React.Component {
+    /** Get CardSelectedEvent event */
+    static get onCardSelectedEvent() { return CardContainer._cardSelectedEvent; }
+    /** @internal */
+    render() {
+        return (React.createElement(core_react_1.ScrollView, { className: this.props.className, style: this.props.style },
+            React.createElement(core_react_1.FlexWrapContainer, null, this.props.cards.map((card, _index) => {
+                let includeCard = true;
+                if (this.props.searchValue) {
+                    includeCard = this.contains(card.label, this.props.searchValue);
+                }
+                if (includeCard) {
+                    return (React.createElement(SheetCard, { key: card.label, label: card.label, index: card.index, iconSpec: card.iconSpec, isActive: card.isActive, onClick: async () => this._handleCardSelected(card) }));
+                }
+                return null;
+            }))));
+    }
+    /**
+     * Determines if string contains a substring
+     * @param valueA The string to search through
+     * @param valueB The value to search for
+     * @return True if valueB can be found in valueA, false otherwise
+     */
+    contains(valueA, valueB) {
+        if (!valueA || !valueB)
+            return false;
+        if (valueB.length > valueA.length)
+            return false;
+        return valueA.toLocaleUpperCase().indexOf(valueB.toLocaleUpperCase(), 0) !== -1;
+    }
+    /**
+     * Updates view with ViewState for selected card.
+     * @param card Data about the sheet card selected.
+     */
+    async _handleCardSelected(card) {
+        // istanbul ignore if
+        if (core_frontend_1.IModelApp.viewManager && core_frontend_1.IModelApp.viewManager.selectedView) {
+            const vp = core_frontend_1.IModelApp.viewManager.selectedView;
+            const viewState = await this.props.connection.views.load(card.viewId);
+            vp.changeView(viewState);
+        }
+        card.isActive = true;
+        UiFramework_1.UiFramework.frontstages.closeModalFrontstage();
+        CardContainer.onCardSelectedEvent.emit({ id: card.viewId, index: card.index });
+    }
+}
+CardContainer._cardSelectedEvent = new CardSelectedEvent();
+exports.CardContainer = CardContainer;
+/** Displays information about an individual sheet
+ * @alpha
+ */
+class SheetCard extends React.Component {
+    constructor(props) {
+        super(props);
+        this._onClick = () => {
+            this.setState({ isActive: true }, () => this.props.onClick());
+        };
+        this._onMouseDown = () => {
+            this.setState({ isPressed: true });
+        };
+        this._onMouseLeave = () => {
+            if (this.state.isPressed)
+                this.setState({ isPressed: false });
+        };
+        this.state = { isActive: this.props.isActive, isPressed: false };
+    }
+    render() {
+        const { label, index } = this.props;
+        const className = (0, classnames_1.default)("uifw-sheet-card", this.state.isActive && "is-active", this.state.isPressed && "is-pressed");
+        const iconSpec = this.props.iconSpec ? this.props.iconSpec : React.createElement(itwinui_icons_react_1.SvgPlaceholder, null);
+        return (
+        // eslint-disable-next-line jsx-a11y/click-events-have-key-events
+        React.createElement("div", { className: className, onClick: this._onClick, onMouseDown: this._onMouseDown, onMouseLeave: this._onMouseLeave, role: "button", tabIndex: -1 },
+            label,
+            React.createElement("div", { className: "sheet-image-container" },
+                React.createElement("div", { className: "icon" },
+                    " ",
+                    React.createElement(core_react_1.Icon, { iconSpec: iconSpec }))),
+            React.createElement("div", { className: "sheet-index" }, index + 1)));
+    }
+}
+exports.SheetCard = SheetCard;
 //# sourceMappingURL=SheetsModalFrontstage.js.map

package/lib/cjs/appui-react/navigationaids/SheetsModalFrontstage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SheetsModalFrontstage.js","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/SheetsModalFrontstage.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module NavigationAids\r\n */\r\n\r\nimport \"./SheetsModalFrontstage.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { IModelApp, IModelConnection } from \"@itwin/core-frontend\";\r\nimport { UiEvent } from \"@itwin/appui-abstract\";\r\nimport { CommonProps, FlexWrapContainer, ScrollView, SearchBox, UiCore } from \"@itwin/core-react\";\r\nimport { ModalFrontstageInfo } from \"../framework/FrameworkFrontstages\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { SheetData } from \"./SheetNavigationAid\";\r\n\r\n/** Data about a sheet card\r\n * @alpha\r\n */\r\nexport interface CardInfo {\r\n  index: number;\r\n  label: string;\r\n  iconSpec: string;\r\n  isActive: boolean;\r\n  viewId: any;\r\n}\r\n\r\n/** Arguments for CardSelectedEvent\r\n * @alpha\r\n */\r\nexport interface CardSelectedEventArgs {\r\n  id: any;\r\n  index: number;\r\n}\r\n\r\n/** Class for CardSelectedEvent\r\n * @alpha\r\n */\r\nexport class CardSelectedEvent extends UiEvent<CardSelectedEventArgs> { }\r\n\r\n/** Modal frontstage displaying sheet information in cards.\r\n * @alpha\r\n */\r\nexport class SheetsModalFrontstage implements ModalFrontstageInfo {\r\n  public title: string = UiFramework.translate(\"navigationAid.sheetsModalFrontstage\");\r\n  private _cards: CardInfo[] = [];\r\n  private _connection: IModelConnection;\r\n  private _currentIndex: number;\r\n  private _searchValue: string = \"\";\r\n\r\n  /**\r\n   * Creates a SheetsModalFrontstage\r\n   * @param sheets Collection of sheets available in SheetNavigationAid\r\n   * @param connection IModelConnection to query for sheet ViewState\r\n   */\r\n  constructor(sheets: SheetData[], connection: IModelConnection, currentIndex: number) {\r\n    this._connection = connection;\r\n    this._currentIndex = currentIndex;\r\n    this._storeSheetsAsCards(sheets);\r\n  }\r\n\r\n  /**\r\n   * Gathers card info from available sheets\r\n   * @param sheets SheetData from available sheets\r\n   */\r\n  private _storeSheetsAsCards(sheets: SheetData[]) {\r\n    sheets.forEach((sheet: SheetData, index: number) => {\r\n      this._cards.push({ index, label: sheet.name, iconSpec: \"icon-document\", viewId: sheet.viewId, isActive: index === this._currentIndex });\r\n    });\r\n  }\r\n\r\n  /** Gets set of cards */\r\n  public get content(): React.ReactNode {\r\n    return <CardContainer cards={this._cards} searchValue={this._searchValue} connection={this._connection} />;\r\n  }\r\n\r\n  /** Gets components to be placed in the app bar */\r\n  public get appBarRight(): React.ReactNode {\r\n    return (\r\n      <SearchBox placeholder={UiCore.translate(\"general.search\")} onValueChanged={this._handleSearchValueChanged} valueChangedDelay={250} />\r\n    );\r\n  }\r\n\r\n  /** Updates stage based on search value */\r\n  // istanbul ignore next\r\n  private _handleSearchValueChanged = (value: string): void => {\r\n    this._searchValue = value;\r\n    UiFramework.frontstages.updateModalFrontstage();\r\n  };\r\n}\r\n\r\n/** Properties for [[CardContainer]]\r\n * @alpha\r\n */\r\nexport interface CardContainerProps extends CommonProps {\r\n  cards: CardInfo[];\r\n  searchValue: string;\r\n  connection: IModelConnection;\r\n}\r\n\r\n/** Displays cards in SheetModalFrontstage\r\n * @alpha\r\n */\r\nexport class CardContainer extends React.Component<CardContainerProps> {\r\n  private static _cardSelectedEvent: CardSelectedEvent = new CardSelectedEvent();\r\n\r\n  /** Get CardSelectedEvent event */\r\n  public static get onCardSelectedEvent(): CardSelectedEvent { return CardContainer._cardSelectedEvent; }\r\n\r\n  /** @internal */\r\n  public override render() {\r\n    return (\r\n      <ScrollView className={this.props.className} style={this.props.style}>\r\n        <FlexWrapContainer>\r\n          {\r\n            this.props.cards.map((card: CardInfo, _index: number) => {\r\n              let includeCard = true;\r\n              const iconClassName = (typeof card.iconSpec === \"string\") ? card.iconSpec : /* istanbul ignore next */ \"icon-placeholder\";\r\n\r\n              if (this.props.searchValue) {\r\n                includeCard = this.contains(card.label, this.props.searchValue);\r\n              }\r\n\r\n              if (includeCard) {\r\n                return (\r\n                  <SheetCard key={card.label} label={card.label} index={card.index} iconSpec={iconClassName} isActive={card.isActive} onClick={async () => this._handleCardSelected(card)} />\r\n                );\r\n              }\r\n\r\n              return null;\r\n            })\r\n          }\r\n        </FlexWrapContainer>\r\n      </ScrollView>\r\n    );\r\n  }\r\n\r\n  /**\r\n   * Determines if string contains a substring\r\n   * @param valueA The string to search through\r\n   * @param valueB The value to search for\r\n   * @return True if valueB can be found in valueA, false otherwise\r\n   */\r\n  private contains(valueA: string, valueB: string): boolean {\r\n    if (!valueA || !valueB)\r\n      return false;\r\n\r\n    if (valueB.length > valueA.length)\r\n      return false;\r\n\r\n    return valueA.toLocaleUpperCase().indexOf(valueB.toLocaleUpperCase(), 0) !== -1;\r\n  }\r\n\r\n  /**\r\n   * Updates view with ViewState for selected card.\r\n   * @param card Data about the sheet card selected.\r\n   */\r\n  private async _handleCardSelected(card: CardInfo) {\r\n    // istanbul ignore if\r\n    if (IModelApp.viewManager && IModelApp.viewManager.selectedView) {\r\n      const vp = IModelApp.viewManager.selectedView;\r\n      const viewState = await this.props.connection.views.load(card.viewId);\r\n      vp.changeView(viewState);\r\n    }\r\n\r\n    card.isActive = true;\r\n    UiFramework.frontstages.closeModalFrontstage();\r\n    CardContainer.onCardSelectedEvent.emit({ id: card.viewId, index: card.index });\r\n  }\r\n}\r\n\r\n/** Properties for [[SheetCard]]\r\n * @alpha\r\n */\r\nexport interface SheetCardProps {\r\n  label: string;\r\n  index: number;\r\n  iconSpec: string;\r\n  isActive: boolean;\r\n  onClick: () => void;\r\n}\r\n\r\n/** State for [[SheetCard]]\r\n * @internal\r\n */\r\ninterface SheetCardState {\r\n  isActive: boolean;\r\n  isPressed: boolean;\r\n}\r\n\r\n/** Displays information about an individual sheet\r\n * @alpha\r\n */\r\nexport class SheetCard extends React.Component<SheetCardProps, SheetCardState> {\r\n  constructor(props: SheetCardProps) {\r\n    super(props);\r\n    this.state = { isActive: this.props.isActive, isPressed: false };\r\n  }\r\n\r\n  private _onClick = () => {\r\n    this.setState({ isActive: true }, () => this.props.onClick());\r\n  };\r\n\r\n  private _onMouseDown = () => {\r\n    this.setState({ isPressed: true });\r\n  };\r\n\r\n  private _onMouseLeave = () => {\r\n    if (this.state.isPressed)\r\n      this.setState({ isPressed: false });\r\n  };\r\n\r\n  public override render() {\r\n    const { label, index, iconSpec } = this.props;\r\n\r\n    const className = classnames(\r\n      \"uifw-sheet-card\",\r\n      this.state.isActive && \"is-active\",\r\n      this.state.isPressed && \"is-pressed\",\r\n    );\r\n\r\n    const iconClassName = classnames(\r\n      \"icon\",\r\n      (typeof iconSpec === \"string\") ? iconSpec : /* istanbul ignore next */ \"icon-placeholder\",\r\n    );\r\n\r\n    return (\r\n      // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n      <div className={className} onClick={this._onClick} onMouseDown={this._onMouseDown} onMouseLeave={this._onMouseLeave} role=\"button\" tabIndex={-1} >\r\n        {label}\r\n        <div className=\"sheet-image-container\">\r\n          <div className={iconClassName} />\r\n        </div >\r\n        <div className=\"sheet-index\">{index + 1}</div>\r\n      </div >\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"SheetsModalFrontstage.js","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/SheetsModalFrontstage.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module NavigationAids\r\n */\r\n\r\nimport \"./SheetsModalFrontstage.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { IModelApp, IModelConnection } from \"@itwin/core-frontend\";\r\nimport { UiEvent } from \"@itwin/appui-abstract\";\r\nimport { CommonProps, FlexWrapContainer, Icon, IconSpec, ScrollView, SearchBox, UiCore } from \"@itwin/core-react\";\r\nimport { ModalFrontstageInfo } from \"../framework/FrameworkFrontstages\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { SheetData } from \"./SheetNavigationAid\";\r\nimport { SvgDocument, SvgPlaceholder } from \"@itwin/itwinui-icons-react\";\r\n\r\n/** Data about a sheet card\r\n * @alpha\r\n */\r\nexport interface CardInfo {\r\n  index: number;\r\n  label: string;\r\n  iconSpec: IconSpec;\r\n  isActive: boolean;\r\n  viewId: any;\r\n}\r\n\r\n/** Arguments for CardSelectedEvent\r\n * @alpha\r\n */\r\nexport interface CardSelectedEventArgs {\r\n  id: any;\r\n  index: number;\r\n}\r\n\r\n/** Class for CardSelectedEvent\r\n * @alpha\r\n */\r\nexport class CardSelectedEvent extends UiEvent<CardSelectedEventArgs> { }\r\n\r\n/** Modal frontstage displaying sheet information in cards.\r\n * @alpha\r\n */\r\nexport class SheetsModalFrontstage implements ModalFrontstageInfo {\r\n  public title: string = UiFramework.translate(\"navigationAid.sheetsModalFrontstage\");\r\n  private _cards: CardInfo[] = [];\r\n  private _connection: IModelConnection;\r\n  private _currentIndex: number;\r\n  private _searchValue: string = \"\";\r\n\r\n  /**\r\n   * Creates a SheetsModalFrontstage\r\n   * @param sheets Collection of sheets available in SheetNavigationAid\r\n   * @param connection IModelConnection to query for sheet ViewState\r\n   */\r\n  constructor(sheets: SheetData[], connection: IModelConnection, currentIndex: number) {\r\n    this._connection = connection;\r\n    this._currentIndex = currentIndex;\r\n    this._storeSheetsAsCards(sheets);\r\n  }\r\n\r\n  /**\r\n   * Gathers card info from available sheets\r\n   * @param sheets SheetData from available sheets\r\n   */\r\n  private _storeSheetsAsCards(sheets: SheetData[]) {\r\n    sheets.forEach((sheet: SheetData, index: number) => {\r\n      this._cards.push({ index, label: sheet.name, iconSpec: <SvgDocument />, viewId: sheet.viewId, isActive: index === this._currentIndex });\r\n    });\r\n  }\r\n\r\n  /** Gets set of cards */\r\n  public get content(): React.ReactNode {\r\n    return <CardContainer cards={this._cards} searchValue={this._searchValue} connection={this._connection} />;\r\n  }\r\n\r\n  /** Gets components to be placed in the app bar */\r\n  public get appBarRight(): React.ReactNode {\r\n    return (\r\n      <SearchBox placeholder={UiCore.translate(\"general.search\")} onValueChanged={this._handleSearchValueChanged} valueChangedDelay={250} />\r\n    );\r\n  }\r\n\r\n  /** Updates stage based on search value */\r\n  // istanbul ignore next\r\n  private _handleSearchValueChanged = (value: string): void => {\r\n    this._searchValue = value;\r\n    UiFramework.frontstages.updateModalFrontstage();\r\n  };\r\n}\r\n\r\n/** Properties for [[CardContainer]]\r\n * @alpha\r\n */\r\nexport interface CardContainerProps extends CommonProps {\r\n  cards: CardInfo[];\r\n  searchValue: string;\r\n  connection: IModelConnection;\r\n}\r\n\r\n/** Displays cards in SheetModalFrontstage\r\n * @alpha\r\n */\r\nexport class CardContainer extends React.Component<CardContainerProps> {\r\n  private static _cardSelectedEvent: CardSelectedEvent = new CardSelectedEvent();\r\n\r\n  /** Get CardSelectedEvent event */\r\n  public static get onCardSelectedEvent(): CardSelectedEvent { return CardContainer._cardSelectedEvent; }\r\n\r\n  /** @internal */\r\n  public override render() {\r\n    return (\r\n      <ScrollView className={this.props.className} style={this.props.style}>\r\n        <FlexWrapContainer>\r\n          {\r\n            this.props.cards.map((card: CardInfo, _index: number) => {\r\n              let includeCard = true;\r\n              if (this.props.searchValue) {\r\n                includeCard = this.contains(card.label, this.props.searchValue);\r\n              }\r\n\r\n              if (includeCard) {\r\n                return (\r\n                  <SheetCard key={card.label} label={card.label} index={card.index} iconSpec={card.iconSpec} isActive={card.isActive} onClick={async () => this._handleCardSelected(card)} />\r\n                );\r\n              }\r\n\r\n              return null;\r\n            })\r\n          }\r\n        </FlexWrapContainer>\r\n      </ScrollView>\r\n    );\r\n  }\r\n\r\n  /**\r\n   * Determines if string contains a substring\r\n   * @param valueA The string to search through\r\n   * @param valueB The value to search for\r\n   * @return True if valueB can be found in valueA, false otherwise\r\n   */\r\n  private contains(valueA: string, valueB: string): boolean {\r\n    if (!valueA || !valueB)\r\n      return false;\r\n\r\n    if (valueB.length > valueA.length)\r\n      return false;\r\n\r\n    return valueA.toLocaleUpperCase().indexOf(valueB.toLocaleUpperCase(), 0) !== -1;\r\n  }\r\n\r\n  /**\r\n   * Updates view with ViewState for selected card.\r\n   * @param card Data about the sheet card selected.\r\n   */\r\n  private async _handleCardSelected(card: CardInfo) {\r\n    // istanbul ignore if\r\n    if (IModelApp.viewManager && IModelApp.viewManager.selectedView) {\r\n      const vp = IModelApp.viewManager.selectedView;\r\n      const viewState = await this.props.connection.views.load(card.viewId);\r\n      vp.changeView(viewState);\r\n    }\r\n\r\n    card.isActive = true;\r\n    UiFramework.frontstages.closeModalFrontstage();\r\n    CardContainer.onCardSelectedEvent.emit({ id: card.viewId, index: card.index });\r\n  }\r\n}\r\n\r\n/** Properties for [[SheetCard]]\r\n * @alpha\r\n */\r\nexport interface SheetCardProps {\r\n  label: string;\r\n  index: number;\r\n  iconSpec: IconSpec;\r\n  isActive: boolean;\r\n  onClick: () => void;\r\n}\r\n\r\n/** State for [[SheetCard]]\r\n * @internal\r\n */\r\ninterface SheetCardState {\r\n  isActive: boolean;\r\n  isPressed: boolean;\r\n}\r\n\r\n/** Displays information about an individual sheet\r\n * @alpha\r\n */\r\nexport class SheetCard extends React.Component<SheetCardProps, SheetCardState> {\r\n  constructor(props: SheetCardProps) {\r\n    super(props);\r\n    this.state = { isActive: this.props.isActive, isPressed: false };\r\n  }\r\n\r\n  private _onClick = () => {\r\n    this.setState({ isActive: true }, () => this.props.onClick());\r\n  };\r\n\r\n  private _onMouseDown = () => {\r\n    this.setState({ isPressed: true });\r\n  };\r\n\r\n  private _onMouseLeave = () => {\r\n    if (this.state.isPressed)\r\n      this.setState({ isPressed: false });\r\n  };\r\n\r\n  public override render() {\r\n    const { label, index } = this.props;\r\n\r\n    const className = classnames(\r\n      \"uifw-sheet-card\",\r\n      this.state.isActive && \"is-active\",\r\n      this.state.isPressed && \"is-pressed\",\r\n    );\r\n\r\n    const iconSpec = this.props.iconSpec ? this.props.iconSpec : <SvgPlaceholder />;\r\n\r\n    return (\r\n      // eslint-disable-next-line jsx-a11y/click-events-have-key-events\r\n      <div className={className} onClick={this._onClick} onMouseDown={this._onMouseDown} onMouseLeave={this._onMouseLeave} role=\"button\" tabIndex={-1} >\r\n        {label}\r\n        <div className=\"sheet-image-container\">\r\n          <div className=\"icon\"> <Icon iconSpec={iconSpec} /></div>\r\n        </div >\r\n        <div className=\"sheet-index\">{index + 1}</div>\r\n      </div >\r\n    );\r\n  }\r\n}\r\n"]}