@itwin/appui-react 3.0.0-dev.100

package/lib/cjs/appui-react/backstage/BackstageComposer.js

@@ -0,0 +1,123 @@
+"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 Backstage
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BackstageComposer = exports.useGroupedItems = void 0;
+const React = require("react");
+const appui_abstract_1 = require("@itwin/appui-abstract");
+const appui_layout_react_1 = require("@itwin/appui-layout-react"); // eslint-disable-line sort-imports
+const SafeAreaContext_1 = require("../safearea/SafeAreaContext");
+const SyncUiEventDispatcher_1 = require("../syncui/SyncUiEventDispatcher");
+const BackstageComposerItem_1 = require("./BackstageComposerItem");
+const BackstageManager_1 = require("./BackstageManager");
+const useDefaultBackstageItems_1 = require("./useDefaultBackstageItems");
+const useUiItemsProviderBackstageItems_1 = require("./useUiItemsProviderBackstageItems");
+// cSpell:ignore safearea
+/** Private function to set up sync event monitoring of backstage items */
+function useBackstageItemSyncEffect(itemsManager, syncIdsOfInterest) {
+    const isInitialMount = React.useRef(true);
+    React.useEffect(() => {
+        const handleSyncUiEvent = (args) => {
+            if (0 === syncIdsOfInterest.length)
+                return;
+            // istanbul ignore else
+            if (syncIdsOfInterest.some((value) => args.eventIds.has(value.toLowerCase()))) {
+                // process each item that has interest
+                itemsManager.refreshAffectedItems(args.eventIds);
+            }
+        };
+        if (isInitialMount.current) {
+            isInitialMount.current = false;
+            // initialize the display state of any items with syncIds/condition defined
+            itemsManager.refreshAffectedItems(new Set(syncIdsOfInterest));
+        }
+        SyncUiEventDispatcher_1.SyncUiEventDispatcher.onSyncUiEvent.addListener(handleSyncUiEvent);
+        return () => {
+            SyncUiEventDispatcher_1.SyncUiEventDispatcher.onSyncUiEvent.removeListener(handleSyncUiEvent);
+        };
+    }, [itemsManager, itemsManager.items, syncIdsOfInterest]);
+}
+/** local function to combine items from Stage and from Extensions */
+function combineItems(stageItems, addonItems) {
+    const items = [];
+    if (stageItems.length)
+        items.push(...stageItems);
+    if (addonItems.length)
+        items.push(...addonItems);
+    return items;
+}
+/** @internal */
+const useGroupedItems = (items) => {
+    return React.useMemo(() => {
+        const grouped = items.reduce((acc, item) => {
+            if (appui_abstract_1.ConditionalBooleanValue.getValue(item.isHidden))
+                return acc;
+            const groupIndex = acc.findIndex((group) => group[0].groupPriority === item.groupPriority);
+            if (groupIndex >= 0)
+                return [
+                    ...acc.slice(0, groupIndex),
+                    [
+                        ...acc[groupIndex],
+                        item,
+                    ],
+                    ...acc.slice(groupIndex + 1),
+                ];
+            return [
+                ...acc,
+                [
+                    item,
+                ],
+            ];
+        }, []);
+        const sortedGroups = grouped.reduce((acc, group) => {
+            const sortedGroup = [...group].sort((a, b) => a.itemPriority - b.itemPriority);
+            return [
+                ...acc,
+                sortedGroup,
+            ];
+        }, []);
+        return [...sortedGroups].sort((a, b) => a[0].groupPriority - b[0].groupPriority);
+    }, [items]);
+};
+exports.useGroupedItems = useGroupedItems;
+/** Backstage component composed from [[BackstageManager]] items.
+ * @public
+ */
+function BackstageComposer(props) {
+    const [defaultItemsManager, setDefaultItemsManager] = React.useState(new appui_abstract_1.BackstageItemsManager(props.items));
+    const initialItems = React.useRef(props.items);
+    React.useEffect(() => {
+        if (initialItems.current !== props.items) {
+            initialItems.current = props.items;
+            setDefaultItemsManager(new appui_abstract_1.BackstageItemsManager(props.items));
+        }
+    }, [props.items]);
+    const manager = (0, BackstageManager_1.useBackstageManager)();
+    const isOpen = (0, BackstageManager_1.useIsBackstageOpen)(manager);
+    const safeAreaInsets = React.useContext(SafeAreaContext_1.SafeAreaContext);
+    const handleClose = React.useCallback(() => {
+        manager.close();
+    }, [manager]);
+    const defaultItems = (0, useDefaultBackstageItems_1.useDefaultBackstageItems)(defaultItemsManager);
+    const syncIdsOfInterest = React.useMemo(() => appui_abstract_1.BackstageItemsManager.getSyncIdsOfInterest(defaultItems), [defaultItems]);
+    useBackstageItemSyncEffect(defaultItemsManager, syncIdsOfInterest);
+    const [addonItemsManager] = React.useState(new appui_abstract_1.BackstageItemsManager());
+    const addonItems = (0, useUiItemsProviderBackstageItems_1.useUiItemsProviderBackstageItems)(addonItemsManager);
+    const addonSyncIdsOfInterest = React.useMemo(() => appui_abstract_1.BackstageItemsManager.getSyncIdsOfInterest(addonItems), [addonItems]);
+    useBackstageItemSyncEffect(addonItemsManager, addonSyncIdsOfInterest);
+    const combinedBackstageItems = React.useMemo(() => combineItems(defaultItems, addonItems), [defaultItems, addonItems]);
+    const groups = (0, exports.useGroupedItems)(combinedBackstageItems);
+    return (React.createElement(appui_layout_react_1.Backstage, { className: props.className, header: props.header, isOpen: isOpen, onClose: handleClose, safeAreaInsets: safeAreaInsets, showOverlay: props.showOverlay, style: props.style }, groups.map((group, groupIndex) => (group.map((item, itemIndex) => {
+        const composerItem = (React.createElement(BackstageComposerItem_1.BackstageComposerItem, { item: item, key: item.id }));
+        return itemIndex === 0 && groupIndex > 0 ? (React.createElement(React.Fragment, { key: groupIndex },
+            React.createElement(appui_layout_react_1.BackstageSeparator, null),
+            composerItem)) : composerItem;
+    })))));
+}
+exports.BackstageComposer = BackstageComposer;
+//# sourceMappingURL=BackstageComposer.js.map

package/lib/cjs/appui-react/backstage/BackstageComposer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageComposer.js","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposer.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 Backstage\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { BackstageItem, BackstageItemsManager, ConditionalBooleanValue } from \"@itwin/appui-abstract\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { Backstage as NZ_Backstage, BackstageSeparator } from \"@itwin/appui-layout-react\"; // eslint-disable-line sort-imports\r\nimport { SafeAreaContext } from \"../safearea/SafeAreaContext\";\r\nimport { SyncUiEventArgs, SyncUiEventDispatcher } from \"../syncui/SyncUiEventDispatcher\";\r\nimport { BackstageComposerItem } from \"./BackstageComposerItem\";\r\nimport { useBackstageManager, useIsBackstageOpen } from \"./BackstageManager\";\r\nimport { useDefaultBackstageItems } from \"./useDefaultBackstageItems\";\r\nimport { useUiItemsProviderBackstageItems } from \"./useUiItemsProviderBackstageItems\";\r\n\r\n// cSpell:ignore safearea\r\n\r\n/** Private function to set up sync event monitoring of backstage items */\r\nfunction useBackstageItemSyncEffect(itemsManager: BackstageItemsManager, syncIdsOfInterest: string[]) {\r\n  const isInitialMount = React.useRef(true);\r\n\r\n  React.useEffect(() => {\r\n    const handleSyncUiEvent = (args: SyncUiEventArgs) => {\r\n      if (0 === syncIdsOfInterest.length)\r\n        return;\r\n\r\n      // istanbul ignore else\r\n      if (syncIdsOfInterest.some((value: string): boolean => args.eventIds.has(value.toLowerCase()))) {\r\n        // process each item that has interest\r\n        itemsManager.refreshAffectedItems(args.eventIds);\r\n      }\r\n    };\r\n\r\n    if (isInitialMount.current) {\r\n      isInitialMount.current = false;\r\n      // initialize the display state of any items with syncIds/condition defined\r\n      itemsManager.refreshAffectedItems(new Set(syncIdsOfInterest));\r\n    }\r\n\r\n    SyncUiEventDispatcher.onSyncUiEvent.addListener(handleSyncUiEvent);\r\n    return () => {\r\n      SyncUiEventDispatcher.onSyncUiEvent.removeListener(handleSyncUiEvent);\r\n    };\r\n  }, [itemsManager, itemsManager.items, syncIdsOfInterest]);\r\n}\r\n\r\n/** local function to combine items from Stage and from Extensions */\r\nfunction combineItems(stageItems: ReadonlyArray<BackstageItem>, addonItems: ReadonlyArray<BackstageItem>) {\r\n  const items: BackstageItem[] = [];\r\n  if (stageItems.length)\r\n    items.push(...stageItems);\r\n  if (addonItems.length)\r\n    items.push(...addonItems);\r\n  return items;\r\n}\r\n\r\n/** @internal */\r\nexport type GroupedItems = ReadonlyArray<ReadonlyArray<BackstageItem>>;\r\n\r\n/** @internal */\r\nexport const useGroupedItems = (items: ReadonlyArray<BackstageItem>): GroupedItems => {\r\n  return React.useMemo(() => {\r\n    const grouped = items.reduce<GroupedItems>((acc, item) => {\r\n      if (ConditionalBooleanValue.getValue(item.isHidden))\r\n        return acc;\r\n      const groupIndex = acc.findIndex((group) => group[0].groupPriority === item.groupPriority);\r\n      if (groupIndex >= 0)\r\n        return [\r\n          ...acc.slice(0, groupIndex),\r\n          [\r\n            ...acc[groupIndex],\r\n            item,\r\n          ],\r\n          ...acc.slice(groupIndex + 1),\r\n        ];\r\n      return [\r\n        ...acc,\r\n        [\r\n          item,\r\n        ],\r\n      ];\r\n    }, []);\r\n    const sortedGroups = grouped.reduce<GroupedItems>((acc, group) => {\r\n      const sortedGroup = [...group].sort((a, b) => a.itemPriority - b.itemPriority);\r\n      return [\r\n        ...acc,\r\n        sortedGroup,\r\n      ];\r\n    }, []);\r\n    return [...sortedGroups].sort((a, b) => a[0].groupPriority - b[0].groupPriority);\r\n  }, [items]);\r\n};\r\n\r\n/** Props of [[BackstageComposer]] component.\r\n * @public\r\n */\r\nexport interface BackstageComposerProps extends CommonProps {\r\n  /** React node for an optional header item */\r\n  readonly header?: React.ReactNode;\r\n  /** Indicates whether to place an overlay over the frontstage when the backstage is displayed */\r\n  readonly showOverlay?: boolean;\r\n  /** List of backstage items to show */\r\n  readonly items: BackstageItem[];\r\n}\r\n\r\n/** Backstage component composed from [[BackstageManager]] items.\r\n * @public\r\n */\r\nexport function BackstageComposer(props: BackstageComposerProps) {\r\n  const [defaultItemsManager, setDefaultItemsManager] = React.useState(new BackstageItemsManager(props.items));\r\n  const initialItems = React.useRef(props.items);\r\n\r\n  React.useEffect(() => {\r\n    if (initialItems.current !== props.items) {\r\n      initialItems.current = props.items;\r\n      setDefaultItemsManager(new BackstageItemsManager(props.items));\r\n    }\r\n  }, [props.items]);\r\n\r\n  const manager = useBackstageManager();\r\n  const isOpen = useIsBackstageOpen(manager);\r\n  const safeAreaInsets = React.useContext(SafeAreaContext);\r\n  const handleClose = React.useCallback(() => {\r\n    manager.close();\r\n  }, [manager]);\r\n\r\n  const defaultItems = useDefaultBackstageItems(defaultItemsManager);\r\n  const syncIdsOfInterest = React.useMemo(() => BackstageItemsManager.getSyncIdsOfInterest(defaultItems), [defaultItems]);\r\n  useBackstageItemSyncEffect(defaultItemsManager, syncIdsOfInterest);\r\n\r\n  const [addonItemsManager] = React.useState(new BackstageItemsManager());\r\n  const addonItems = useUiItemsProviderBackstageItems(addonItemsManager);\r\n  const addonSyncIdsOfInterest = React.useMemo(() => BackstageItemsManager.getSyncIdsOfInterest(addonItems), [addonItems]);\r\n  useBackstageItemSyncEffect(addonItemsManager, addonSyncIdsOfInterest);\r\n\r\n  const combinedBackstageItems = React.useMemo(() => combineItems(defaultItems, addonItems), [defaultItems, addonItems]);\r\n  const groups = useGroupedItems(combinedBackstageItems);\r\n\r\n  return (\r\n    <NZ_Backstage\r\n      className={props.className}\r\n      header={props.header}\r\n      isOpen={isOpen}\r\n      onClose={handleClose}\r\n      safeAreaInsets={safeAreaInsets}\r\n      showOverlay={props.showOverlay}\r\n      style={props.style}\r\n    >\r\n      {groups.map((group, groupIndex) => (\r\n        group.map((item, itemIndex) => {\r\n          const composerItem = (\r\n            <BackstageComposerItem\r\n              item={item}\r\n              key={item.id}\r\n            />\r\n          );\r\n          return itemIndex === 0 && groupIndex > 0 ? (\r\n            <React.Fragment key={groupIndex}>\r\n              <BackstageSeparator />\r\n              {composerItem}\r\n            </React.Fragment>\r\n          ) : composerItem;\r\n        })\r\n      ))}\r\n    </NZ_Backstage>\r\n  );\r\n}\r\n"]}

package/lib/cjs/appui-react/backstage/BackstageComposerItem.d.ts

@@ -0,0 +1,29 @@
+/** @packageDocumentation
+ * @module Backstage
+ */
+/// <reference types="react" />
+import { BackstageActionItem, BackstageItem, BackstageStageLauncher } from "@itwin/appui-abstract";
+/** @internal */
+export interface BackstageComposerActionItemProps {
+    readonly item: BackstageActionItem;
+}
+/** @internal */
+export declare function BackstageComposerActionItem({ item }: BackstageComposerActionItemProps): JSX.Element;
+/** @internal */
+export interface BackstageComposerStageLauncherProps {
+    readonly item: BackstageStageLauncher;
+}
+/** @internal */
+export declare function BackstageComposerStageLauncher({ item }: BackstageComposerStageLauncherProps): JSX.Element;
+/** Props of [[BackstageComposerItem]] component.
+ * @beta
+ */
+export interface BackstageComposerItemProps {
+    /** Backstage item to render */
+    readonly item: BackstageItem;
+}
+/** Item of [[BackstageComposer]].
+ * @beta
+ */
+export declare function BackstageComposerItem({ item }: BackstageComposerItemProps): JSX.Element;
+//# sourceMappingURL=BackstageComposerItem.d.ts.map

package/lib/cjs/appui-react/backstage/BackstageComposerItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageComposerItem.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposerItem.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAIH,OAAO,EACL,mBAAmB,EAAE,aAAa,EAAE,sBAAsB,EAC3D,MAAM,uBAAuB,CAAC;AAO/B,gBAAgB;AAChB,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,CAAC,IAAI,EAAE,mBAAmB,CAAC;CACpC;AAED,gBAAgB;AAChB,wBAAgB,2BAA2B,CAAC,EAAE,IAAI,EAAE,EAAE,gCAAgC,eAmBrF;AAED,gBAAgB;AAChB,MAAM,WAAW,mCAAmC;IAClD,QAAQ,CAAC,IAAI,EAAE,sBAAsB,CAAC;CACvC;AAED,gBAAgB;AAChB,wBAAgB,8BAA8B,CAAC,EAAE,IAAI,EAAE,EAAE,mCAAmC,eAuB3F;AAED;;GAEG;AACH,MAAM,WAAW,0BAA0B;IACzC,+BAA+B;IAC/B,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;CAC9B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,IAAI,EAAE,EAAE,0BAA0B,eAazE"}

package/lib/cjs/appui-react/backstage/BackstageComposerItem.js

@@ -0,0 +1,54 @@
+"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 Backstage
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BackstageComposerItem = exports.BackstageComposerStageLauncher = exports.BackstageComposerActionItem = void 0;
+const React = require("react");
+const core_bentley_1 = require("@itwin/core-bentley");
+const appui_abstract_1 = require("@itwin/appui-abstract");
+const core_react_1 = require("@itwin/core-react");
+const appui_layout_react_1 = require("@itwin/appui-layout-react");
+const Frontstage_1 = require("../frontstage/Frontstage");
+const FrontstageManager_1 = require("../frontstage/FrontstageManager");
+const BackstageManager_1 = require("./BackstageManager");
+/** @internal */
+function BackstageComposerActionItem({ item }) {
+    const manager = (0, BackstageManager_1.useBackstageManager)();
+    const handleClick = React.useCallback(() => {
+        manager.close();
+        item.execute();
+    }, [manager, item]);
+    return (React.createElement(appui_layout_react_1.BackstageItem, { itemId: item.id, icon: React.createElement(core_react_1.Icon, { iconSpec: appui_abstract_1.ConditionalStringValue.getValue(item.icon) }), isActive: appui_abstract_1.ConditionalBooleanValue.getValue(item.isActive), isDisabled: appui_abstract_1.ConditionalBooleanValue.getValue(item.isDisabled), onClick: handleClick, subtitle: appui_abstract_1.ConditionalStringValue.getValue(item.subtitle), badge: core_react_1.BadgeUtilities.getComponentForBadgeType(item.badgeType) }, appui_abstract_1.ConditionalStringValue.getValue(item.label)));
+}
+exports.BackstageComposerActionItem = BackstageComposerActionItem;
+/** @internal */
+function BackstageComposerStageLauncher({ item }) {
+    var _a;
+    const manager = (0, BackstageManager_1.useBackstageManager)();
+    const handleClick = React.useCallback(() => {
+        manager.close();
+        if (!FrontstageManager_1.FrontstageManager.hasFrontstage(item.stageId))
+            return core_bentley_1.Logger.logError("BackstageComposerStageLauncher", `Frontstage with id '${item.stageId}' not found`);
+        void FrontstageManager_1.FrontstageManager.setActiveFrontstage(item.stageId);
+    }, [manager, item.stageId]);
+    const activeFrontstageId = (0, Frontstage_1.useActiveFrontstageId)();
+    const isActive = appui_abstract_1.ConditionalBooleanValue.getValue((_a = item.isActive) !== null && _a !== void 0 ? _a : item.stageId === activeFrontstageId);
+    return (React.createElement(appui_layout_react_1.BackstageItem, { itemId: item.id, icon: React.createElement(core_react_1.Icon, { iconSpec: appui_abstract_1.ConditionalStringValue.getValue(item.icon) }), isActive: isActive, isDisabled: appui_abstract_1.ConditionalBooleanValue.getValue(item.isDisabled), onClick: handleClick, subtitle: appui_abstract_1.ConditionalStringValue.getValue(item.subtitle), badge: core_react_1.BadgeUtilities.getComponentForBadgeType(item.badgeType) }, appui_abstract_1.ConditionalStringValue.getValue(item.label)));
+}
+exports.BackstageComposerStageLauncher = BackstageComposerStageLauncher;
+/** Item of [[BackstageComposer]].
+ * @beta
+ */
+function BackstageComposerItem({ item }) {
+    if ((0, appui_abstract_1.isStageLauncher)(item)) {
+        return (React.createElement(BackstageComposerStageLauncher, { item: item }));
+    }
+    return (React.createElement(BackstageComposerActionItem, { item: item }));
+}
+exports.BackstageComposerItem = BackstageComposerItem;
+//# sourceMappingURL=BackstageComposerItem.js.map

package/lib/cjs/appui-react/backstage/BackstageComposerItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageComposerItem.js","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageComposerItem.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 Backstage\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { Logger } from \"@itwin/core-bentley\";\r\nimport {\r\n  BackstageActionItem, BackstageItem, BackstageStageLauncher, ConditionalBooleanValue, ConditionalStringValue, isStageLauncher,\r\n} from \"@itwin/appui-abstract\";\r\nimport { BadgeUtilities, Icon } from \"@itwin/core-react\";\r\nimport { BackstageItem as NZ_BackstageItem } from \"@itwin/appui-layout-react\";\r\nimport { useActiveFrontstageId } from \"../frontstage/Frontstage\";\r\nimport { FrontstageManager } from \"../frontstage/FrontstageManager\";\r\nimport { useBackstageManager } from \"./BackstageManager\";\r\n\r\n/** @internal */\r\nexport interface BackstageComposerActionItemProps {\r\n  readonly item: BackstageActionItem;\r\n}\r\n\r\n/** @internal */\r\nexport function BackstageComposerActionItem({ item }: BackstageComposerActionItemProps) {\r\n  const manager = useBackstageManager();\r\n  const handleClick = React.useCallback(() => {\r\n    manager.close();\r\n    item.execute();\r\n  }, [manager, item]);\r\n  return (\r\n    <NZ_BackstageItem\r\n      itemId={item.id}\r\n      icon={<Icon iconSpec={ConditionalStringValue.getValue(item.icon)} />}\r\n      isActive={ConditionalBooleanValue.getValue(item.isActive)}\r\n      isDisabled={ConditionalBooleanValue.getValue(item.isDisabled)}\r\n      onClick={handleClick}\r\n      subtitle={ConditionalStringValue.getValue(item.subtitle)}\r\n      badge={BadgeUtilities.getComponentForBadgeType(item.badgeType)}\r\n    >\r\n      {ConditionalStringValue.getValue(item.label)}\r\n    </NZ_BackstageItem>\r\n  );\r\n}\r\n\r\n/** @internal */\r\nexport interface BackstageComposerStageLauncherProps {\r\n  readonly item: BackstageStageLauncher;\r\n}\r\n\r\n/** @internal */\r\nexport function BackstageComposerStageLauncher({ item }: BackstageComposerStageLauncherProps) {\r\n  const manager = useBackstageManager();\r\n  const handleClick = React.useCallback(() => {\r\n    manager.close();\r\n    if (!FrontstageManager.hasFrontstage(item.stageId))\r\n      return Logger.logError(\"BackstageComposerStageLauncher\", `Frontstage with id '${item.stageId}' not found`);\r\n    void FrontstageManager.setActiveFrontstage(item.stageId);\r\n  }, [manager, item.stageId]);\r\n  const activeFrontstageId = useActiveFrontstageId();\r\n  const isActive = ConditionalBooleanValue.getValue(item.isActive ?? item.stageId === activeFrontstageId);\r\n  return (\r\n    <NZ_BackstageItem\r\n      itemId={item.id}\r\n      icon={<Icon iconSpec={ConditionalStringValue.getValue(item.icon)} />}\r\n      isActive={isActive}\r\n      isDisabled={ConditionalBooleanValue.getValue(item.isDisabled)}\r\n      onClick={handleClick}\r\n      subtitle={ConditionalStringValue.getValue(item.subtitle)}\r\n      badge={BadgeUtilities.getComponentForBadgeType(item.badgeType)}\r\n    >\r\n      {ConditionalStringValue.getValue(item.label)}\r\n    </NZ_BackstageItem>\r\n  );\r\n}\r\n\r\n/** Props of [[BackstageComposerItem]] component.\r\n * @beta\r\n */\r\nexport interface BackstageComposerItemProps {\r\n  /** Backstage item to render */\r\n  readonly item: BackstageItem;\r\n}\r\n\r\n/** Item of [[BackstageComposer]].\r\n * @beta\r\n */\r\nexport function BackstageComposerItem({ item }: BackstageComposerItemProps) {\r\n  if (isStageLauncher(item)) {\r\n    return (\r\n      <BackstageComposerStageLauncher\r\n        item={item}\r\n      />\r\n    );\r\n  }\r\n  return (\r\n    <BackstageComposerActionItem\r\n      item={item}\r\n    />\r\n  );\r\n}\r\n"]}

package/lib/cjs/appui-react/backstage/BackstageItemProps.d.ts

@@ -0,0 +1,49 @@
+/** @packageDocumentation
+ * @module Backstage
+ */
+import { StringGetter } from "@itwin/appui-abstract";
+import { IconProps, IconSpec } from "@itwin/core-react";
+/** Base properties for a [[Backstage]] item.
+ * @public
+ * @deprecated - use [BackstageItem]($appui-abstract) in bentley/appui-abstract instead
+ */
+export interface BackstageItemProps extends IconProps {
+    /** if set, component will be enabled - defaults to true */
+    isEnabled?: boolean;
+    /** if set, component will be shown with as the active item - defaults to false */
+    isActive?: boolean;
+    /** optional function to set state of backstage item */
+    stateFunc?: (state: Readonly<BackstageItemState>) => BackstageItemState;
+    /** optional SyncUi event ids that will trigger the state function to run. */
+    stateSyncIds?: string[];
+    /** if set, it is used to explicitly set the label shown by a component. */
+    label?: string | StringGetter;
+    /** if set, it is used to define a key that is used to look up a localized string. This value is used only if label is not explicitly set. */
+    labelKey?: string;
+    /** if set, it is used to explicitly set the description shown by a component. */
+    description?: string | StringGetter;
+    /** if set, it is used to define a key that is used to look up a localized string. This value is used only if description is not explicitly set. */
+    descriptionKey?: string;
+    /** used to explicitly set the tooltip shown by a component. */
+    tooltip?: string | StringGetter;
+    /** if set, it is used to define a key that is used to look up a localized string. This value is used only if label is not explicitly set. */
+    tooltipKey?: string;
+}
+/** Properties that define the state of a Backstage items.
+ * @public
+ * @deprecated - use [BackstageItem]($appui-abstract) in bentley/appui-abstract instead
+ */
+export interface BackstageItemState {
+    isEnabled: boolean;
+    label: string;
+    subtitle: string;
+    tooltip: string;
+    iconSpec: IconSpec;
+    isActive?: boolean;
+}
+/** Helper method to set backstage item state from props.
+ * @public
+ * @deprecated - use [BackstageItem]($appui-abstract) in bentley/appui-abstract instead
+ */
+export declare const getBackstageItemStateFromProps: (props: BackstageItemProps) => BackstageItemState;
+//# sourceMappingURL=BackstageItemProps.d.ts.map

package/lib/cjs/appui-react/backstage/BackstageItemProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageItemProps.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageItemProps.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAGxD;;;GAGG;AACH,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,2DAA2D;IAC3D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uDAAuD;IACvD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,kBAAkB,CAAC,KAAK,kBAAkB,CAAC;IACxE,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IAC9B,6IAA6I;IAC7I,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iFAAiF;IACjF,WAAW,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IACpC,mJAAmJ;IACnJ,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,MAAM,GAAG,YAAY,CAAC;IAChC,6IAA6I;IAC7I,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;GAGG;AACH,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;GAGG;AAEH,eAAO,MAAM,8BAA8B,UAAW,kBAAkB,KAAG,kBAG1E,CAAC"}

package/lib/cjs/appui-react/backstage/BackstageItemProps.js

@@ -0,0 +1,22 @@
+"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 Backstage
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getBackstageItemStateFromProps = void 0;
+const BackstageItemUtilities_1 = require("./BackstageItemUtilities");
+/** Helper method to set backstage item state from props.
+ * @public
+ * @deprecated - use [BackstageItem]($appui-abstract) in bentley/appui-abstract instead
+ */
+// istanbul ignore next
+const getBackstageItemStateFromProps = (props) => {
+    // eslint-disable-next-line deprecation/deprecation
+    return BackstageItemUtilities_1.BackstageItemUtilities.getBackstageItemStateFromProps(props);
+};
+exports.getBackstageItemStateFromProps = getBackstageItemStateFromProps;
+//# sourceMappingURL=BackstageItemProps.js.map

package/lib/cjs/appui-react/backstage/BackstageItemProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageItemProps.js","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageItemProps.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAIH,qEAAkE;AA0ClE;;;GAGG;AACH,uBAAuB;AAChB,MAAM,8BAA8B,GAAG,CAAC,KAAyB,EAAsB,EAAE;IAC9F,mDAAmD;IACnD,OAAO,+CAAsB,CAAC,8BAA8B,CAAC,KAAK,CAAC,CAAC;AACtE,CAAC,CAAC;AAHW,QAAA,8BAA8B,kCAGzC","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 Backstage\r\n */\r\n\r\nimport { StringGetter } from \"@itwin/appui-abstract\";\r\nimport { IconProps, IconSpec } from \"@itwin/core-react\";\r\nimport { BackstageItemUtilities } from \"./BackstageItemUtilities\";\r\n\r\n/** Base properties for a [[Backstage]] item.\r\n * @public\r\n * @deprecated - use [BackstageItem]($appui-abstract) in bentley/appui-abstract instead\r\n */\r\nexport interface BackstageItemProps extends IconProps {\r\n  /** if set, component will be enabled - defaults to true */\r\n  isEnabled?: boolean;\r\n  /** if set, component will be shown with as the active item - defaults to false */\r\n  isActive?: boolean;\r\n  /** optional function to set state of backstage item */\r\n  stateFunc?: (state: Readonly<BackstageItemState>) => BackstageItemState; // eslint-disable-line deprecation/deprecation\r\n  /** optional SyncUi event ids that will trigger the state function to run. */\r\n  stateSyncIds?: string[];\r\n  /** if set, it is used to explicitly set the label shown by a component. */\r\n  label?: string | StringGetter;\r\n  /** if set, it is used to define a key that is used to look up a localized string. This value is used only if label is not explicitly set. */\r\n  labelKey?: string;\r\n  /** if set, it is used to explicitly set the description shown by a component. */\r\n  description?: string | StringGetter;\r\n  /** if set, it is used to define a key that is used to look up a localized string. This value is used only if description is not explicitly set. */\r\n  descriptionKey?: string;\r\n  /** used to explicitly set the tooltip shown by a component. */\r\n  tooltip?: string | StringGetter;\r\n  /** if set, it is used to define a key that is used to look up a localized string. This value is used only if label is not explicitly set. */\r\n  tooltipKey?: string;\r\n}\r\n\r\n/** Properties that define the state of a Backstage items.\r\n * @public\r\n * @deprecated - use [BackstageItem]($appui-abstract) in bentley/appui-abstract instead\r\n */\r\nexport interface BackstageItemState {\r\n  isEnabled: boolean;\r\n  label: string;\r\n  subtitle: string;\r\n  tooltip: string;\r\n  iconSpec: IconSpec;\r\n  isActive?: boolean;\r\n}\r\n\r\n/** Helper method to set backstage item state from props.\r\n * @public\r\n * @deprecated - use [BackstageItem]($appui-abstract) in bentley/appui-abstract instead\r\n */\r\n// istanbul ignore next\r\nexport const getBackstageItemStateFromProps = (props: BackstageItemProps): BackstageItemState => { // eslint-disable-line deprecation/deprecation\r\n  // eslint-disable-next-line deprecation/deprecation\r\n  return BackstageItemUtilities.getBackstageItemStateFromProps(props);\r\n};\r\n"]}

package/lib/cjs/appui-react/backstage/BackstageItemUtilities.d.ts

@@ -0,0 +1,47 @@
+/** @packageDocumentation
+ * @module Backstage
+ */
+import { BackstageActionItem as UIA_BackstageActionItem, BackstageStageLauncher as UIA_BackstageStageLauncher } from "@itwin/appui-abstract";
+import { BackstageItemProps, BackstageItemState } from "./BackstageItemProps";
+/** Used to specify the item type added to the backstage menu.
+ * @beta
+ * @deprecated Use [BackstageItemType]($appui-abstract) in bentley/appui-abstract instead
+ */
+export declare enum BackstageItemType {
+    /** Item that executes an action function */
+    ActionItem = 1,
+    /** Item that activate a stage. */
+    StageLauncher = 2
+}
+/** Describes the data needed to insert an action button into the backstage menu.
+ * @beta
+ * @deprecated Use [BackstageActionItem]($appui-abstract) in bentley/appui-abstract instead
+ */
+export interface BackstageActionItem extends UIA_BackstageActionItem {
+    readonly type: BackstageItemType.ActionItem;
+}
+/** Describes the data needed to insert an action button into the backstage menu.
+ * @beta
+ * @deprecated Use [BackstageStageLauncher]($appui-abstract) in bentley/appui-abstract instead
+ */
+export interface BackstageStageLauncher extends UIA_BackstageStageLauncher {
+    readonly type: BackstageItemType.StageLauncher;
+}
+/** Utilities for creating and maintaining backstage items
+ * @beta @deprecated
+ */
+export declare class BackstageItemUtilities {
+    /** Creates a stage launcher backstage item
+     * @beta
+     * @deprecated Use BackstageItemUtilities.createStageLauncher in bentley/appui-abstract instead
+     */
+    static createStageLauncher: (frontstageId: string, groupPriority: number, itemPriority: number, label: string, subtitle?: string | undefined, iconSpec?: string | undefined, overrides?: Partial<BackstageStageLauncher> | undefined) => BackstageStageLauncher;
+    /** Creates an action backstage item
+     * @beta
+     * @deprecated Use BackstageItemUtilities.createActionItem in bentley/appui-abstract instead
+     */
+    static createActionItem: (itemId: string, groupPriority: number, itemPriority: number, execute: () => void, label: string, subtitle?: string | undefined, iconSpec?: string | undefined, overrides?: Partial<BackstageActionItem> | undefined) => BackstageActionItem;
+    /** Helper method to set backstage item state from props */
+    static getBackstageItemStateFromProps: (props: BackstageItemProps) => BackstageItemState;
+}
+//# sourceMappingURL=BackstageItemUtilities.d.ts.map

package/lib/cjs/appui-react/backstage/BackstageItemUtilities.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageItemUtilities.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageItemUtilities.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,EAAE,mBAAmB,IAAI,uBAAuB,EAAE,sBAAsB,IAAI,0BAA0B,EAAE,MAAM,uBAAuB,CAAC;AAE7I,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE9E;;;GAGG;AACH,oBAAY,iBAAiB;IAC3B,4CAA4C;IAC5C,UAAU,IAAI;IACd,kCAAkC;IAClC,aAAa,IAAI;CAClB;AAED;;;GAGG;AACH,MAAM,WAAW,mBAAoB,SAAQ,uBAAuB;IAClE,QAAQ,CAAC,IAAI,EAAE,iBAAiB,CAAC,UAAU,CAAC;CAC7C;AAED;;;GAGG;AACH,MAAM,WAAW,sBAAuB,SAAQ,0BAA0B;IACxE,QAAQ,CAAC,IAAI,EAAE,iBAAiB,CAAC,aAAa,CAAC;CAChD;AAED;;GAEG;AACH,qBAAa,sBAAsB;IACjC;;;OAGG;IACH,OAAc,mBAAmB,iBAAkB,MAAM,iBAAiB,MAAM,gBAAgB,MAAM,SAAS,MAAM,4HAAsF,sBAAsB,CAU9N;IAEH;;;OAGG;IACH,OAAc,gBAAgB,WAAY,MAAM,iBAAiB,MAAM,gBAAgB,MAAM,WAAW,MAAM,IAAI,SAAS,MAAM,yHAAmF,mBAAmB,CAUpO;IAEH,2DAA2D;IAC3D,OAAc,8BAA8B,UAAW,kBAAkB,KAAG,kBAAkB,CAa5F;CACH"}

package/lib/cjs/appui-react/backstage/BackstageItemUtilities.js

@@ -0,0 +1,73 @@
+"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 Backstage
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BackstageItemUtilities = exports.BackstageItemType = void 0;
+const PropsHelper_1 = require("../utils/PropsHelper");
+/** Used to specify the item type added to the backstage menu.
+ * @beta
+ * @deprecated Use [BackstageItemType]($appui-abstract) in bentley/appui-abstract instead
+ */
+var BackstageItemType;
+(function (BackstageItemType) {
+    /** Item that executes an action function */
+    BackstageItemType[BackstageItemType["ActionItem"] = 1] = "ActionItem";
+    /** Item that activate a stage. */
+    BackstageItemType[BackstageItemType["StageLauncher"] = 2] = "StageLauncher";
+})(BackstageItemType = exports.BackstageItemType || (exports.BackstageItemType = {}));
+/** Utilities for creating and maintaining backstage items
+ * @beta @deprecated
+ */
+class BackstageItemUtilities {
+}
+exports.BackstageItemUtilities = BackstageItemUtilities;
+/** Creates a stage launcher backstage item
+ * @beta
+ * @deprecated Use BackstageItemUtilities.createStageLauncher in bentley/appui-abstract instead
+ */
+BackstageItemUtilities.createStageLauncher = (frontstageId, groupPriority, itemPriority, label, subtitle, iconSpec, overrides) => ({
+    groupPriority,
+    icon: iconSpec,
+    id: frontstageId,
+    itemPriority,
+    type: BackstageItemType.StageLauncher,
+    label,
+    stageId: frontstageId,
+    subtitle,
+    ...overrides,
+});
+/** Creates an action backstage item
+ * @beta
+ * @deprecated Use BackstageItemUtilities.createActionItem in bentley/appui-abstract instead
+ */
+BackstageItemUtilities.createActionItem = (itemId, groupPriority, itemPriority, execute, label, subtitle, iconSpec, overrides) => ({
+    execute,
+    groupPriority,
+    icon: iconSpec,
+    id: itemId,
+    itemPriority,
+    type: BackstageItemType.ActionItem,
+    label,
+    subtitle,
+    ...overrides,
+});
+/** Helper method to set backstage item state from props */
+BackstageItemUtilities.getBackstageItemStateFromProps = (props) => {
+    const labelSpec = PropsHelper_1.PropsHelper.getStringSpec(props.label, props.labelKey);
+    const subtitleSpec = PropsHelper_1.PropsHelper.getStringSpec(props.description, props.descriptionKey);
+    const tooltipSpec = PropsHelper_1.PropsHelper.getStringSpec(props.tooltip, props.tooltipKey);
+    return {
+        isEnabled: undefined !== props.isEnabled ? props.isEnabled : /* istanbul ignore next */ false,
+        label: PropsHelper_1.PropsHelper.getStringFromSpec(labelSpec),
+        subtitle: PropsHelper_1.PropsHelper.getStringFromSpec(subtitleSpec),
+        tooltip: PropsHelper_1.PropsHelper.getStringFromSpec(tooltipSpec),
+        iconSpec: props.iconSpec,
+        isActive: undefined !== props.isActive ? props.isActive : false,
+    };
+};
+//# sourceMappingURL=BackstageItemUtilities.js.map

package/lib/cjs/appui-react/backstage/BackstageItemUtilities.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageItemUtilities.js","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageItemUtilities.ts"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAGH,sDAAmD;AAGnD;;;GAGG;AACH,IAAY,iBAKX;AALD,WAAY,iBAAiB;IAC3B,4CAA4C;IAC5C,qEAAc,CAAA;IACd,kCAAkC;IAClC,2EAAiB,CAAA;AACnB,CAAC,EALW,iBAAiB,GAAjB,yBAAiB,KAAjB,yBAAiB,QAK5B;AAkBD;;GAEG;AACH,MAAa,sBAAsB;;AAAnC,wDAgDC;AA/CC;;;GAGG;AACW,0CAAmB,GAAG,CAAC,YAAoB,EAAE,aAAqB,EAAE,YAAoB,EAAE,KAAa,EAAE,QAAiB,EAAE,QAAiB,EAAE,SAA2C,EAA0B,EAAE,CAAC,CAAC;IACpO,aAAa;IACb,IAAI,EAAE,QAAQ;IACd,EAAE,EAAE,YAAY;IAChB,YAAY;IACZ,IAAI,EAAE,iBAAiB,CAAC,aAAa;IACrC,KAAK;IACL,OAAO,EAAE,YAAY;IACrB,QAAQ;IACR,GAAG,SAAS;CACb,CAAC,CAAC;AAEH;;;GAGG;AACW,uCAAgB,GAAG,CAAC,MAAc,EAAE,aAAqB,EAAE,YAAoB,EAAE,OAAmB,EAAE,KAAa,EAAE,QAAiB,EAAE,QAAiB,EAAE,SAAwC,EAAuB,EAAE,CAAC,CAAC;IAC1O,OAAO;IACP,aAAa;IACb,IAAI,EAAE,QAAQ;IACd,EAAE,EAAE,MAAM;IACV,YAAY;IACZ,IAAI,EAAE,iBAAiB,CAAC,UAAU;IAClC,KAAK;IACL,QAAQ;IACR,GAAG,SAAS;CACb,CAAC,CAAC;AAEH,2DAA2D;AAC7C,qDAA8B,GAAG,CAAC,KAAyB,EAAsB,EAAE;IAC/F,MAAM,SAAS,GAAG,yBAAW,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;IACzE,MAAM,YAAY,GAAG,yBAAW,CAAC,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC;IACxF,MAAM,WAAW,GAAG,yBAAW,CAAC,aAAa,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAE/E,OAAO;QACL,SAAS,EAAE,SAAS,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,0BAA0B,CAAA,KAAK;QAC5F,KAAK,EAAE,yBAAW,CAAC,iBAAiB,CAAC,SAAS,CAAC;QAC/C,QAAQ,EAAE,yBAAW,CAAC,iBAAiB,CAAC,YAAY,CAAC;QACrD,OAAO,EAAE,yBAAW,CAAC,iBAAiB,CAAC,WAAW,CAAC;QACnD,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,QAAQ,EAAE,SAAS,KAAK,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK;KAChE,CAAC;AACJ,CAAC,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 Backstage\r\n */\r\n\r\nimport { BackstageActionItem as UIA_BackstageActionItem, BackstageStageLauncher as UIA_BackstageStageLauncher } from \"@itwin/appui-abstract\";\r\nimport { PropsHelper } from \"../utils/PropsHelper\";\r\nimport { BackstageItemProps, BackstageItemState } from \"./BackstageItemProps\";\r\n\r\n/** Used to specify the item type added to the backstage menu.\r\n * @beta\r\n * @deprecated Use [BackstageItemType]($appui-abstract) in bentley/appui-abstract instead\r\n */\r\nexport enum BackstageItemType {\r\n  /** Item that executes an action function */\r\n  ActionItem = 1,\r\n  /** Item that activate a stage. */\r\n  StageLauncher = 2,\r\n}\r\n\r\n/** Describes the data needed to insert an action button into the backstage menu.\r\n * @beta\r\n * @deprecated Use [BackstageActionItem]($appui-abstract) in bentley/appui-abstract instead\r\n */\r\nexport interface BackstageActionItem extends UIA_BackstageActionItem {\r\n  readonly type: BackstageItemType.ActionItem; // eslint-disable-line deprecation/deprecation\r\n}\r\n\r\n/** Describes the data needed to insert an action button into the backstage menu.\r\n * @beta\r\n * @deprecated Use [BackstageStageLauncher]($appui-abstract) in bentley/appui-abstract instead\r\n */\r\nexport interface BackstageStageLauncher extends UIA_BackstageStageLauncher {\r\n  readonly type: BackstageItemType.StageLauncher; // eslint-disable-line deprecation/deprecation\r\n}\r\n\r\n/** Utilities for creating and maintaining backstage items\r\n * @beta @deprecated\r\n */\r\nexport class BackstageItemUtilities {\r\n  /** Creates a stage launcher backstage item\r\n   * @beta\r\n   * @deprecated Use BackstageItemUtilities.createStageLauncher in bentley/appui-abstract instead\r\n   */\r\n  public static createStageLauncher = (frontstageId: string, groupPriority: number, itemPriority: number, label: string, subtitle?: string, iconSpec?: string, overrides?: Partial<BackstageStageLauncher>): BackstageStageLauncher => ({ // eslint-disable-line deprecation/deprecation\r\n    groupPriority,\r\n    icon: iconSpec,\r\n    id: frontstageId,\r\n    itemPriority,\r\n    type: BackstageItemType.StageLauncher, // eslint-disable-line deprecation/deprecation\r\n    label,\r\n    stageId: frontstageId,\r\n    subtitle,\r\n    ...overrides,\r\n  });\r\n\r\n  /** Creates an action backstage item\r\n   * @beta\r\n   * @deprecated Use BackstageItemUtilities.createActionItem in bentley/appui-abstract instead\r\n   */\r\n  public static createActionItem = (itemId: string, groupPriority: number, itemPriority: number, execute: () => void, label: string, subtitle?: string, iconSpec?: string, overrides?: Partial<BackstageActionItem>): BackstageActionItem => ({ // eslint-disable-line deprecation/deprecation\r\n    execute,\r\n    groupPriority,\r\n    icon: iconSpec,\r\n    id: itemId,\r\n    itemPriority,\r\n    type: BackstageItemType.ActionItem, // eslint-disable-line deprecation/deprecation\r\n    label,\r\n    subtitle,\r\n    ...overrides,\r\n  });\r\n\r\n  /** Helper method to set backstage item state from props */\r\n  public static getBackstageItemStateFromProps = (props: BackstageItemProps): BackstageItemState => { // eslint-disable-line deprecation/deprecation\r\n    const labelSpec = PropsHelper.getStringSpec(props.label, props.labelKey);\r\n    const subtitleSpec = PropsHelper.getStringSpec(props.description, props.descriptionKey);\r\n    const tooltipSpec = PropsHelper.getStringSpec(props.tooltip, props.tooltipKey);\r\n\r\n    return {\r\n      isEnabled: undefined !== props.isEnabled ? props.isEnabled : /* istanbul ignore next */false,\r\n      label: PropsHelper.getStringFromSpec(labelSpec),\r\n      subtitle: PropsHelper.getStringFromSpec(subtitleSpec),\r\n      tooltip: PropsHelper.getStringFromSpec(tooltipSpec),\r\n      iconSpec: props.iconSpec,\r\n      isActive: undefined !== props.isActive ? props.isActive : false,\r\n    };\r\n  };\r\n}\r\n"]}

package/lib/cjs/appui-react/backstage/BackstageManager.d.ts

@@ -0,0 +1,36 @@
+/** @packageDocumentation
+ * @module Backstage
+ */
+import { BeEvent } from "@itwin/core-bentley";
+import { IconSpec } from "@itwin/core-react";
+import { CommandItemDef } from "../shared/CommandItemDef";
+/** Arguments of [[BackstageManager.onToggled]].
+ * @public
+ */
+export interface BackstageToggledArgs {
+    readonly isOpen: boolean;
+}
+/** Controls backstage.
+ * @public
+ */
+export declare class BackstageManager {
+    private _isOpen;
+    /** Event raised when backstage is opened or closed. */
+    readonly onToggled: BeEvent<(args: BackstageToggledArgs) => void>;
+    get isOpen(): boolean;
+    private setIsOpen;
+    open(): void;
+    close(): void;
+    toggle(): void;
+    /** Get CommandItemDef that will toggle display of Backstage and allow iconSpec to be overridden */
+    static getBackstageToggleCommand(overrideIconSpec?: IconSpec): CommandItemDef;
+}
+/** Hook that returns isOpen flag of the backstage.
+ * @public
+ */
+export declare const useIsBackstageOpen: (manager: BackstageManager) => boolean;
+/** Hook that returns backstage manager.
+ * @public
+ */
+export declare const useBackstageManager: () => BackstageManager;
+//# sourceMappingURL=BackstageManager.d.ts.map

package/lib/cjs/appui-react/backstage/BackstageManager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageManager.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageManager.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAGH,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAI1D;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,gBAAgB;IAC3B,OAAO,CAAC,OAAO,CAAS;IAExB,uDAAuD;IACvD,SAAgB,SAAS,iBAAsB,oBAAoB,KAAK,IAAI,EAAI;IAEhF,IAAW,MAAM,YAEhB;IAED,OAAO,CAAC,SAAS;IAUV,IAAI;IAIJ,KAAK;IAIL,MAAM;IAIb,mGAAmG;WACrF,yBAAyB,CAAC,gBAAgB,CAAC,EAAE,QAAQ;CAUpE;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,YAAa,gBAAgB,YAa3D,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,mBAAmB,wBAG/B,CAAC"}

package/lib/cjs/appui-react/backstage/BackstageManager.js

@@ -0,0 +1,85 @@
+"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 Backstage
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useBackstageManager = exports.useIsBackstageOpen = exports.BackstageManager = void 0;
+const React = require("react");
+const core_bentley_1 = require("@itwin/core-bentley");
+const CommandItemDef_1 = require("../shared/CommandItemDef");
+const UiFramework_1 = require("../UiFramework");
+const Backstage_1 = require("./Backstage");
+/** Controls backstage.
+ * @public
+ */
+class BackstageManager {
+    constructor() {
+        this._isOpen = false;
+        /** Event raised when backstage is opened or closed. */
+        this.onToggled = new core_bentley_1.BeEvent();
+    }
+    get isOpen() {
+        return this._isOpen;
+    }
+    setIsOpen(isOpen) {
+        if (isOpen === this._isOpen)
+            return;
+        this._isOpen = isOpen;
+        this.onToggled.raiseEvent({
+            isOpen,
+        });
+        Backstage_1.Backstage.onBackstageEvent.emit({ isVisible: isOpen }); // eslint-disable-line deprecation/deprecation
+    }
+    open() {
+        this.setIsOpen(true);
+    }
+    close() {
+        this.setIsOpen(false);
+    }
+    toggle() {
+        this.setIsOpen(!this.isOpen);
+    }
+    /** Get CommandItemDef that will toggle display of Backstage and allow iconSpec to be overridden */
+    static getBackstageToggleCommand(overrideIconSpec) {
+        return new CommandItemDef_1.CommandItemDef({
+            commandId: "UiFramework.openBackstage",
+            iconSpec: overrideIconSpec ? overrideIconSpec : "icon-home",
+            labelKey: "UiFramework:commands.openBackstage",
+            execute: () => {
+                UiFramework_1.UiFramework.backstageManager.toggle();
+            },
+        });
+    }
+}
+exports.BackstageManager = BackstageManager;
+/** Hook that returns isOpen flag of the backstage.
+ * @public
+ */
+const useIsBackstageOpen = (manager) => {
+    const [isOpen, setIsOpen] = React.useState(manager.isOpen);
+    React.useEffect(() => {
+        const handleToggled = (args) => {
+            setIsOpen(args.isOpen);
+        };
+        setIsOpen(manager.isOpen);
+        manager.onToggled.addListener(handleToggled);
+        return () => {
+            manager.onToggled.removeListener(handleToggled);
+        };
+    }, [manager]);
+    return isOpen;
+};
+exports.useIsBackstageOpen = useIsBackstageOpen;
+/** Hook that returns backstage manager.
+ * @public
+ */
+const useBackstageManager = () => {
+    const [manager] = React.useState(UiFramework_1.UiFramework.backstageManager);
+    return manager;
+};
+exports.useBackstageManager = useBackstageManager;
+//# sourceMappingURL=BackstageManager.js.map

package/lib/cjs/appui-react/backstage/BackstageManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackstageManager.js","sourceRoot":"","sources":["../../../../src/appui-react/backstage/BackstageManager.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,+BAA+B;AAC/B,sDAA8C;AAE9C,6DAA0D;AAC1D,gDAA6C;AAC7C,2CAAwC;AASxC;;GAEG;AACH,MAAa,gBAAgB;IAA7B;QACU,YAAO,GAAG,KAAK,CAAC;QAExB,uDAAuD;QACvC,cAAS,GAAG,IAAI,sBAAO,EAAwC,CAAC;IAuClF,CAAC;IArCC,IAAW,MAAM;QACf,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAEO,SAAS,CAAC,MAAe;QAC/B,IAAI,MAAM,KAAK,IAAI,CAAC,OAAO;YACzB,OAAO;QACT,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;QACtB,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC;YACxB,MAAM;SACP,CAAC,CAAC;QACH,qBAAS,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,8CAA8C;IACxG,CAAC;IAEM,IAAI;QACT,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;IAEM,KAAK;QACV,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC;IAEM,MAAM;QACX,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC/B,CAAC;IAED,mGAAmG;IAC5F,MAAM,CAAC,yBAAyB,CAAC,gBAA2B;QACjE,OAAO,IAAI,+BAAc,CAAC;YACxB,SAAS,EAAE,2BAA2B;YACtC,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,WAAW;YAC3D,QAAQ,EAAE,oCAAoC;YAC9C,OAAO,EAAE,GAAG,EAAE;gBACZ,yBAAW,CAAC,gBAAgB,CAAC,MAAM,EAAE,CAAC;YACxC,CAAC;SACF,CAAC,CAAC;IACL,CAAC;CACF;AA3CD,4CA2CC;AAED;;GAEG;AACI,MAAM,kBAAkB,GAAG,CAAC,OAAyB,EAAE,EAAE;IAC9D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAC3D,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,aAAa,GAAG,CAAC,IAA0B,EAAE,EAAE;YACnD,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACzB,CAAC,CAAC;QACF,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAC1B,OAAO,CAAC,SAAS,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;QAC7C,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,SAAS,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;QAClD,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IACd,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC;AAbW,QAAA,kBAAkB,sBAa7B;AAEF;;GAEG;AACI,MAAM,mBAAmB,GAAG,GAAG,EAAE;IACtC,MAAM,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,yBAAW,CAAC,gBAAgB,CAAC,CAAC;IAC/D,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAHW,QAAA,mBAAmB,uBAG9B","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 Backstage\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { BeEvent } from \"@itwin/core-bentley\";\r\nimport { IconSpec } from \"@itwin/core-react\";\r\nimport { CommandItemDef } from \"../shared/CommandItemDef\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { Backstage } from \"./Backstage\";\r\n\r\n/** Arguments of [[BackstageManager.onToggled]].\r\n * @public\r\n */\r\nexport interface BackstageToggledArgs {\r\n  readonly isOpen: boolean;\r\n}\r\n\r\n/** Controls backstage.\r\n * @public\r\n */\r\nexport class BackstageManager {\r\n  private _isOpen = false;\r\n\r\n  /** Event raised when backstage is opened or closed. */\r\n  public readonly onToggled = new BeEvent<(args: BackstageToggledArgs) => void>();\r\n\r\n  public get isOpen() {\r\n    return this._isOpen;\r\n  }\r\n\r\n  private setIsOpen(isOpen: boolean) {\r\n    if (isOpen === this._isOpen)\r\n      return;\r\n    this._isOpen = isOpen;\r\n    this.onToggled.raiseEvent({\r\n      isOpen,\r\n    });\r\n    Backstage.onBackstageEvent.emit({ isVisible: isOpen }); // eslint-disable-line deprecation/deprecation\r\n  }\r\n\r\n  public open() {\r\n    this.setIsOpen(true);\r\n  }\r\n\r\n  public close() {\r\n    this.setIsOpen(false);\r\n  }\r\n\r\n  public toggle() {\r\n    this.setIsOpen(!this.isOpen);\r\n  }\r\n\r\n  /** Get CommandItemDef that will toggle display of Backstage and allow iconSpec to be overridden */\r\n  public static getBackstageToggleCommand(overrideIconSpec?: IconSpec) {\r\n    return new CommandItemDef({\r\n      commandId: \"UiFramework.openBackstage\",\r\n      iconSpec: overrideIconSpec ? overrideIconSpec : \"icon-home\",\r\n      labelKey: \"UiFramework:commands.openBackstage\",\r\n      execute: () => {\r\n        UiFramework.backstageManager.toggle();\r\n      },\r\n    });\r\n  }\r\n}\r\n\r\n/** Hook that returns isOpen flag of the backstage.\r\n * @public\r\n */\r\nexport const useIsBackstageOpen = (manager: BackstageManager) => {\r\n  const [isOpen, setIsOpen] = React.useState(manager.isOpen);\r\n  React.useEffect(() => {\r\n    const handleToggled = (args: BackstageToggledArgs) => {\r\n      setIsOpen(args.isOpen);\r\n    };\r\n    setIsOpen(manager.isOpen);\r\n    manager.onToggled.addListener(handleToggled);\r\n    return () => {\r\n      manager.onToggled.removeListener(handleToggled);\r\n    };\r\n  }, [manager]);\r\n  return isOpen;\r\n};\r\n\r\n/** Hook that returns backstage manager.\r\n * @public\r\n */\r\nexport const useBackstageManager = () => {\r\n  const [manager] = React.useState(UiFramework.backstageManager);\r\n  return manager;\r\n};\r\n"]}