@itwin/appui-react 3.6.0-dev.7 → 4.0.0-dev.2

package/lib/esm/appui-react/navigationaids/SheetsModalFrontstage.scss

@@ -1,73 +1,73 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-@import "~@itwin/core-react/lib/cjs/core-react/style/colors";
-
-$sheets-modal-padding: 10px;
-
-.uifw-sheet-card {
-  position: relative;
-  background-color: #f1f1f1;
-  width: 200px;
-  height: 250px;
-  margin: 10px;
-  padding: $sheets-modal-padding;
-  text-align: center;
-  font-size: 16px;
-  font-weight: bold;
-  border-color: #f1f1f1;
-  border-width: 8px;
-  border-radius: 12px;
-  border-style: solid;
-  box-sizing: border-box;
-  user-select: none;
-
-  &:hover {
-    cursor: pointer;
-  }
-
-  &:focus {
-    outline: none;
-  }
-
-  .sheet-image-container {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-
-    .icon {
-      width: 50px;
-      height: 50px;
-      font-size: 50px;
-    }
-  }
-
-  .sheet-index {
-    position: absolute;
-    width: 100%;
-    bottom: $sheets-modal-padding;
-    left: 0;
-  }
-
-  &.is-active {
-    border-color: $uicore-blue;
-  }
-
-  &.is-pressed {
-    border-color: $uicore-blue;
-  }
-
-  &:not(.is-active) {
-    &:not(.is-pressed) {
-      &:hover {
-        border-color: $uicore-blue-a;
-      }
-    }
-  }
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/core-react/lib/cjs/core-react/style/colors";
+
+$sheets-modal-padding: 10px;
+
+.uifw-sheet-card {
+  position: relative;
+  background-color: #f1f1f1;
+  width: 200px;
+  height: 250px;
+  margin: 10px;
+  padding: $sheets-modal-padding;
+  text-align: center;
+  font-size: 16px;
+  font-weight: bold;
+  border-color: #f1f1f1;
+  border-width: 8px;
+  border-radius: 12px;
+  border-style: solid;
+  box-sizing: border-box;
+  user-select: none;
+
+  &:hover {
+    cursor: pointer;
+  }
+
+  &:focus {
+    outline: none;
+  }
+
+  .sheet-image-container {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    .icon {
+      width: 50px;
+      height: 50px;
+      font-size: 50px;
+    }
+  }
+
+  .sheet-index {
+    position: absolute;
+    width: 100%;
+    bottom: $sheets-modal-padding;
+    left: 0;
+  }
+
+  &.is-active {
+    border-color: $uicore-blue;
+  }
+
+  &.is-pressed {
+    border-color: $uicore-blue;
+  }
+
+  &:not(.is-active) {
+    &:not(.is-pressed) {
+      &:hover {
+        border-color: $uicore-blue-a;
+      }
+    }
+  }
 }

package/lib/esm/appui-react/navigationaids/StandardRotationNavigationAid.d.ts

@@ -1,45 +1,45 @@
-/** @packageDocumentation
- * @module NavigationAids
- */
-import "./StandardRotationNavigationAid.scss";
-import * as React from "react";
-import { StandardViewId } from "@itwin/core-frontend";
-import { CommonProps } from "@itwin/core-react";
-import { ConfigurableCreateInfo } from "../configurableui/ConfigurableUiControl";
-import { NavigationAidControl } from "./NavigationAidControl";
-/** A 3D Standard Rotation Navigation Aid control.
- * @alpha
- */
-export declare class StandardRotationNavigationAidControl extends NavigationAidControl {
-    static navigationAidId: string;
-    constructor(info: ConfigurableCreateInfo, options: any);
-}
-/** @internal */
-export interface RotationData {
-    label: string;
-    iconClassName: string;
-}
-/** @internal */
-interface StandardRotationNavigationAidState {
-    element: HTMLDivElement | null;
-    isExpanded: boolean;
-    list: RotationData[];
-    selected: StandardViewId;
-}
-/** A 3D Standard Rotation Navigation Aid.
- * @alpha
- */
-export declare class StandardRotationNavigationAid extends React.Component<CommonProps, StandardRotationNavigationAidState> {
-    private _title;
-    /** @internal */
-    readonly state: Readonly<StandardRotationNavigationAidState>;
-    constructor(props: any);
-    render(): React.ReactNode;
-    private _handleRef;
-    private _handlePopupClose;
-    private _toggleIsExpanded;
-    private _handleListItemClicked;
-    private getExpandedContent;
-}
-export {};
+/** @packageDocumentation
+ * @module NavigationAids
+ */
+import "./StandardRotationNavigationAid.scss";
+import * as React from "react";
+import { StandardViewId } from "@itwin/core-frontend";
+import { CommonProps } from "@itwin/core-react";
+import { ConfigurableCreateInfo } from "../configurableui/ConfigurableUiControl";
+import { NavigationAidControl } from "./NavigationAidControl";
+/** A 3D Standard Rotation Navigation Aid control.
+ * @alpha
+ */
+export declare class StandardRotationNavigationAidControl extends NavigationAidControl {
+    static navigationAidId: string;
+    constructor(info: ConfigurableCreateInfo, options: any);
+}
+/** @internal */
+export interface RotationData {
+    label: string;
+    iconClassName: string;
+}
+/** @internal */
+interface StandardRotationNavigationAidState {
+    element: HTMLDivElement | null;
+    isExpanded: boolean;
+    list: RotationData[];
+    selected: StandardViewId;
+}
+/** A 3D Standard Rotation Navigation Aid.
+ * @alpha
+ */
+export declare class StandardRotationNavigationAid extends React.Component<CommonProps, StandardRotationNavigationAidState> {
+    private _title;
+    /** @internal */
+    readonly state: Readonly<StandardRotationNavigationAidState>;
+    constructor(props: any);
+    render(): React.ReactNode;
+    private _handleRef;
+    private _handlePopupClose;
+    private _toggleIsExpanded;
+    private _handleListItemClicked;
+    private getExpandedContent;
+}
+export {};
 //# sourceMappingURL=StandardRotationNavigationAid.d.ts.map

package/lib/esm/appui-react/navigationaids/StandardRotationNavigationAid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StandardRotationNavigationAid.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/StandardRotationNavigationAid.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,sCAAsC,CAAC;AAE9C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAGtD,OAAO,EAAE,WAAW,EAAe,MAAM,mBAAmB,CAAC;AAK7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AAEjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAK9D;;GAEG;AACH,qBAAa,oCAAqC,SAAQ,oBAAoB;IAC5E,OAAc,eAAe,SAAmC;gBAEpD,IAAI,EAAE,sBAAsB,EAAE,OAAO,EAAE,GAAG;CAIvD;AAED,gBAAgB;AAChB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,gBAAgB;AAChB,UAAU,kCAAkC;IAC1C,OAAO,EAAE,cAAc,GAAG,IAAI,CAAC;IAC/B,UAAU,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,QAAQ,EAAE,cAAc,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,6BAA8B,SAAQ,KAAK,CAAC,SAAS,CAAC,WAAW,EAAE,kCAAkC,CAAC;IACjH,OAAO,CAAC,MAAM,CAAgE;IAE9E,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,kCAAkC,CAAC,CAAC;gBAEjE,KAAK,EAAE,GAAG;IAqCN,MAAM,IAAI,KAAK,CAAC,SAAS;IAoCzC,OAAO,CAAC,UAAU,CAEhB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,sBAAsB,CAO5B;IAEF,OAAO,CAAC,kBAAkB;CA2B3B"}
+{"version":3,"file":"StandardRotationNavigationAid.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/StandardRotationNavigationAid.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,sCAAsC,CAAC;AAE9C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAGtD,OAAO,EAAE,WAAW,EAAe,MAAM,mBAAmB,CAAC;AAE7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AAEjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAG9D;;GAEG;AACH,qBAAa,oCAAqC,SAAQ,oBAAoB;IAC5E,OAAc,eAAe,SAAmC;gBAEpD,IAAI,EAAE,sBAAsB,EAAE,OAAO,EAAE,GAAG;CAIvD;AAED,gBAAgB;AAChB,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,gBAAgB;AAChB,UAAU,kCAAkC;IAC1C,OAAO,EAAE,cAAc,GAAG,IAAI,CAAC;IAC/B,UAAU,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,QAAQ,EAAE,cAAc,CAAC;CAC1B;AAED;;GAEG;AACH,qBAAa,6BAA8B,SAAQ,KAAK,CAAC,SAAS,CAAC,WAAW,EAAE,kCAAkC,CAAC;IACjH,OAAO,CAAC,MAAM,CAAgE;IAE9E,gBAAgB;IAChB,SAAyB,KAAK,EAAE,QAAQ,CAAC,kCAAkC,CAAC,CAAC;gBAEjE,KAAK,EAAE,GAAG;IAqCN,MAAM,IAAI,KAAK,CAAC,SAAS;IAoCzC,OAAO,CAAC,UAAU,CAEhB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,sBAAsB,CAO5B;IAEF,OAAO,CAAC,kBAAkB;CAyB3B"}

package/lib/esm/appui-react/navigationaids/StandardRotationNavigationAid.js

@@ -1,101 +1,100 @@
-/*---------------------------------------------------------------------------------------------
-* 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
- */
-import "./StandardRotationNavigationAid.scss";
-import classnames from "classnames";
-import * as React from "react";
-import { StandardViewId } from "@itwin/core-frontend";
-import { RelativePosition } from "@itwin/appui-abstract";
-import { ViewportComponentEvents } from "@itwin/imodel-components-react";
-import { Icon, Popup } from "@itwin/core-react";
-import { containHorizontally, GroupColumn as NZ_Column, ExpandableButton as NZ_Expandable, ToolbarIcon as NZ_Icon, GroupTool as NZ_Item, Group as NZ_Tray, withContainIn, } from "@itwin/appui-layout-react";
-import { UiFramework } from "../UiFramework";
-import { NavigationAidControl } from "./NavigationAidControl";
-// eslint-disable-next-line @typescript-eslint/naming-convention, deprecation/deprecation
-const NZ_ContainedTray = withContainIn(NZ_Tray);
-/** A 3D Standard Rotation Navigation Aid control.
- * @alpha
- */
-export class StandardRotationNavigationAidControl extends NavigationAidControl {
-    constructor(info, options) {
-        super(info, options);
-        this.reactNode = React.createElement(StandardRotationNavigationAid, null);
-    }
-}
-StandardRotationNavigationAidControl.navigationAidId = "StandardRotationNavigationAid";
-/** A 3D Standard Rotation Navigation Aid.
- * @alpha
- */
-export class StandardRotationNavigationAid extends React.Component {
-    constructor(props) {
-        super(props);
-        this._title = UiFramework.translate("standardRotationNavigationAid.title");
-        this._handleRef = (element) => {
-            this.setState(() => ({ element }));
-        };
-        this._handlePopupClose = () => {
-            this.setState(() => ({ isExpanded: false }));
-        };
-        this._toggleIsExpanded = () => {
-            this.setState((prevState) => ({ isExpanded: !prevState.isExpanded }));
-        };
-        this._handleListItemClicked = (item) => {
-            const selected = item;
-            this.setState(() => ({ isExpanded: false, selected }), () => ViewportComponentEvents.setStandardRotation(selected));
-        };
-        const list = [
-            {
-                label: UiFramework.translate("rotations.top"),
-                iconClassName: "icon-cube-faces-top",
-            }, {
-                label: UiFramework.translate("rotations.bottom"),
-                iconClassName: "icon-cube-faces-bottom",
-            }, {
-                label: UiFramework.translate("rotations.left"),
-                iconClassName: "icon-cube-faces-left",
-            }, {
-                label: UiFramework.translate("rotations.right"),
-                iconClassName: "icon-cube-faces-right",
-            }, {
-                label: UiFramework.translate("rotations.front"),
-                iconClassName: "icon-cube-faces-front",
-            }, {
-                label: UiFramework.translate("rotations.rear"),
-                iconClassName: "icon-cube-faces-rear",
-            }, {
-                label: UiFramework.translate("rotations.isoLeft"),
-                iconClassName: "icon-cube-faces-iso-left",
-            }, {
-                label: UiFramework.translate("rotations.isoRight"),
-                iconClassName: "icon-cube-faces-iso-right",
-            },
-        ];
-        this.state = {
-            element: null,
-            isExpanded: false,
-            list,
-            selected: StandardViewId.Top,
-        };
-    }
-    render() {
-        const className = classnames("uifw-standard-rotation-navigation", this.props.className);
-        return (React.createElement("div", { className: className, style: this.props.style, ref: this._handleRef },
-            React.createElement(NZ_Expandable, { className: "expandable" },
-                React.createElement(NZ_Icon, { className: "icon-button", icon: React.createElement("span", { className: classnames("three-d-icon", "icon", this.state.list[this.state.selected].iconClassName) }), onClick: this._toggleIsExpanded, title: this._title })),
-            React.createElement(Popup, { isOpen: this.state.isExpanded, offset: 0, onClose: this._handlePopupClose, position: RelativePosition.Bottom, target: this.state.element }, this.getExpandedContent())));
-    }
-    getExpandedContent() {
-        if (!this.state.isExpanded)
-            return undefined;
-        return (React.createElement(NZ_ContainedTray, { containFn: containHorizontally, columns: React.createElement(NZ_Column, null,
-                " ",
-                this.state.list.map((item, itemIndex) => {
-                    return (React.createElement(NZ_Item, { key: itemIndex.toString(), ref: itemIndex.toString(), label: item.label, icon: React.createElement(Icon, { iconSpec: item.iconClassName }), isActive: this.state.selected === itemIndex, onClick: () => this._handleListItemClicked(itemIndex) }));
-                })) }));
-    }
-}
+/*---------------------------------------------------------------------------------------------
+* 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
+ */
+import "./StandardRotationNavigationAid.scss";
+import classnames from "classnames";
+import * as React from "react";
+import { StandardViewId } from "@itwin/core-frontend";
+import { RelativePosition, ToolbarItemUtilities } from "@itwin/appui-abstract";
+import { ViewportComponentEvents } from "@itwin/imodel-components-react";
+import { Icon, Popup } from "@itwin/core-react";
+import { ExpandableButton as NZ_Expandable, ToolbarIcon as NZ_Icon } from "@itwin/appui-layout-react";
+import { UiFramework } from "../UiFramework";
+import { NavigationAidControl } from "./NavigationAidControl";
+import { Columns, GroupColumn, GroupTool, Panel } from "@itwin/components-react";
+/** A 3D Standard Rotation Navigation Aid control.
+ * @alpha
+ */
+export class StandardRotationNavigationAidControl extends NavigationAidControl {
+    constructor(info, options) {
+        super(info, options);
+        this.reactNode = React.createElement(StandardRotationNavigationAid, null);
+    }
+}
+StandardRotationNavigationAidControl.navigationAidId = "StandardRotationNavigationAid";
+/** A 3D Standard Rotation Navigation Aid.
+ * @alpha
+ */
+export class StandardRotationNavigationAid extends React.Component {
+    constructor(props) {
+        super(props);
+        this._title = UiFramework.translate("standardRotationNavigationAid.title");
+        this._handleRef = (element) => {
+            this.setState(() => ({ element }));
+        };
+        this._handlePopupClose = () => {
+            this.setState(() => ({ isExpanded: false }));
+        };
+        this._toggleIsExpanded = () => {
+            this.setState((prevState) => ({ isExpanded: !prevState.isExpanded }));
+        };
+        this._handleListItemClicked = (item) => {
+            const selected = item;
+            this.setState(() => ({ isExpanded: false, selected }), () => ViewportComponentEvents.setStandardRotation(selected));
+        };
+        const list = [
+            {
+                label: UiFramework.translate("rotations.top"),
+                iconClassName: "icon-cube-faces-top",
+            }, {
+                label: UiFramework.translate("rotations.bottom"),
+                iconClassName: "icon-cube-faces-bottom",
+            }, {
+                label: UiFramework.translate("rotations.left"),
+                iconClassName: "icon-cube-faces-left",
+            }, {
+                label: UiFramework.translate("rotations.right"),
+                iconClassName: "icon-cube-faces-right",
+            }, {
+                label: UiFramework.translate("rotations.front"),
+                iconClassName: "icon-cube-faces-front",
+            }, {
+                label: UiFramework.translate("rotations.rear"),
+                iconClassName: "icon-cube-faces-rear",
+            }, {
+                label: UiFramework.translate("rotations.isoLeft"),
+                iconClassName: "icon-cube-faces-iso-left",
+            }, {
+                label: UiFramework.translate("rotations.isoRight"),
+                iconClassName: "icon-cube-faces-iso-right",
+            },
+        ];
+        this.state = {
+            element: null,
+            isExpanded: false,
+            list,
+            selected: StandardViewId.Top,
+        };
+    }
+    render() {
+        const className = classnames("uifw-standard-rotation-navigation", this.props.className);
+        return (React.createElement("div", { className: className, style: this.props.style, ref: this._handleRef },
+            React.createElement(NZ_Expandable, { className: "expandable" },
+                React.createElement(NZ_Icon, { className: "icon-button", icon: React.createElement("span", { className: classnames("three-d-icon", "icon", this.state.list[this.state.selected].iconClassName) }), onClick: this._toggleIsExpanded, title: this._title })),
+            React.createElement(Popup, { isOpen: this.state.isExpanded, offset: 0, onClose: this._handlePopupClose, position: RelativePosition.Bottom, target: this.state.element }, this.getExpandedContent())));
+    }
+    getExpandedContent() {
+        if (!this.state.isExpanded)
+            return undefined;
+        return (React.createElement(Panel, null,
+            React.createElement(Columns, null,
+                React.createElement(GroupColumn, null, this.state.list.map((item, itemIndex) => {
+                    return (React.createElement(GroupTool, { key: itemIndex.toString(), label: item.label, icon: React.createElement(Icon, { iconSpec: item.iconClassName }), isActive: this.state.selected === itemIndex, onClick: () => this._handleListItemClicked(itemIndex), item: ToolbarItemUtilities.createActionButton("", 0, "", "", () => { }) }));
+                })))));
+    }
+}
 //# sourceMappingURL=StandardRotationNavigationAid.js.map

package/lib/esm/appui-react/navigationaids/StandardRotationNavigationAid.js.map

@@ -1 +1 @@
-{"version":3,"file":"StandardRotationNavigationAid.js","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/StandardRotationNavigationAid.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 \"./StandardRotationNavigationAid.scss\";\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { StandardViewId } from \"@itwin/core-frontend\";\r\nimport { RelativePosition } from \"@itwin/appui-abstract\";\r\nimport { ViewportComponentEvents } from \"@itwin/imodel-components-react\";\r\nimport { CommonProps, Icon, Popup } from \"@itwin/core-react\";\r\nimport {\r\n  containHorizontally, GroupColumn as NZ_Column, ExpandableButton as NZ_Expandable, ToolbarIcon as NZ_Icon, GroupTool as NZ_Item, Group as NZ_Tray,\r\n  withContainIn,\r\n} from \"@itwin/appui-layout-react\";\r\nimport { ConfigurableCreateInfo } from \"../configurableui/ConfigurableUiControl\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { NavigationAidControl } from \"./NavigationAidControl\";\r\n\r\n// eslint-disable-next-line @typescript-eslint/naming-convention, deprecation/deprecation\r\nconst NZ_ContainedTray = withContainIn(NZ_Tray);\r\n\r\n/** A 3D Standard Rotation Navigation Aid control.\r\n * @alpha\r\n */\r\nexport class StandardRotationNavigationAidControl extends NavigationAidControl {\r\n  public static navigationAidId = \"StandardRotationNavigationAid\";\r\n\r\n  constructor(info: ConfigurableCreateInfo, options: any) {\r\n    super(info, options);\r\n    this.reactNode = <StandardRotationNavigationAid />;\r\n  }\r\n}\r\n\r\n/** @internal */\r\nexport interface RotationData {\r\n  label: string;\r\n  iconClassName: string;\r\n}\r\n\r\n/** @internal */\r\ninterface StandardRotationNavigationAidState {\r\n  element: HTMLDivElement | null;\r\n  isExpanded: boolean;\r\n  list: RotationData[];\r\n  selected: StandardViewId;\r\n}\r\n\r\n/** A 3D Standard Rotation Navigation Aid.\r\n * @alpha\r\n */\r\nexport class StandardRotationNavigationAid extends React.Component<CommonProps, StandardRotationNavigationAidState> {\r\n  private _title = UiFramework.translate(\"standardRotationNavigationAid.title\");\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<StandardRotationNavigationAidState>;\r\n\r\n  constructor(props: any) {\r\n    super(props);\r\n    const list: RotationData[] = [\r\n      {\r\n        label: UiFramework.translate(\"rotations.top\"),\r\n        iconClassName: \"icon-cube-faces-top\",\r\n      }, {\r\n        label: UiFramework.translate(\"rotations.bottom\"),\r\n        iconClassName: \"icon-cube-faces-bottom\",\r\n      }, {\r\n        label: UiFramework.translate(\"rotations.left\"),\r\n        iconClassName: \"icon-cube-faces-left\",\r\n      }, {\r\n        label: UiFramework.translate(\"rotations.right\"),\r\n        iconClassName: \"icon-cube-faces-right\",\r\n      }, {\r\n        label: UiFramework.translate(\"rotations.front\"),\r\n        iconClassName: \"icon-cube-faces-front\",\r\n      }, {\r\n        label: UiFramework.translate(\"rotations.rear\"),\r\n        iconClassName: \"icon-cube-faces-rear\",\r\n      }, {\r\n        label: UiFramework.translate(\"rotations.isoLeft\"),\r\n        iconClassName: \"icon-cube-faces-iso-left\",\r\n      }, {\r\n        label: UiFramework.translate(\"rotations.isoRight\"),\r\n        iconClassName: \"icon-cube-faces-iso-right\",\r\n      },\r\n    ];\r\n    this.state = {\r\n      element: null,\r\n      isExpanded: false,\r\n      list,\r\n      selected: StandardViewId.Top,\r\n    };\r\n  }\r\n\r\n  public override render(): React.ReactNode {\r\n    const className = classnames(\r\n      \"uifw-standard-rotation-navigation\",\r\n      this.props.className,\r\n    );\r\n\r\n    return (\r\n      <div className={className} style={this.props.style}\r\n        ref={this._handleRef}\r\n      >\r\n        <NZ_Expandable\r\n          className={\"expandable\"}\r\n        >\r\n          <NZ_Icon\r\n            className={\"icon-button\"}\r\n            icon={\r\n              <span className={classnames(\"three-d-icon\", \"icon\", this.state.list[this.state.selected].iconClassName)} />\r\n            }\r\n            onClick={this._toggleIsExpanded}\r\n            title={this._title}\r\n          >\r\n          </NZ_Icon>\r\n        </NZ_Expandable>\r\n        <Popup\r\n          isOpen={this.state.isExpanded}\r\n          offset={0}\r\n          onClose={this._handlePopupClose}\r\n          position={RelativePosition.Bottom}\r\n          target={this.state.element}\r\n        >\r\n          {this.getExpandedContent()}\r\n        </Popup>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private _handleRef = (element: HTMLDivElement | null) => {\r\n    this.setState(() => ({ element }));\r\n  };\r\n\r\n  private _handlePopupClose = () => {\r\n    this.setState(() => ({ isExpanded: false }));\r\n  };\r\n\r\n  private _toggleIsExpanded = () => {\r\n    this.setState((prevState) => ({ isExpanded: !prevState.isExpanded }));\r\n  };\r\n\r\n  private _handleListItemClicked = (item: number) => {\r\n    const selected = item;\r\n\r\n    this.setState(\r\n      () => ({ isExpanded: false, selected }),\r\n      () => ViewportComponentEvents.setStandardRotation(selected),\r\n    );\r\n  };\r\n\r\n  private getExpandedContent(): React.ReactNode {\r\n    if (!this.state.isExpanded)\r\n      return undefined;\r\n\r\n    return (\r\n      <NZ_ContainedTray\r\n        containFn={containHorizontally} // eslint-disable-line deprecation/deprecation\r\n        columns={\r\n          <NZ_Column> {/* eslint-disable-line deprecation/deprecation */}\r\n            {this.state.list.map((item, itemIndex) => {\r\n              return (\r\n                <NZ_Item\r\n                  key={itemIndex.toString()}\r\n                  ref={itemIndex.toString()}\r\n                  label={item.label}\r\n                  icon={<Icon iconSpec={item.iconClassName} />}\r\n                  isActive={this.state.selected === itemIndex}\r\n                  onClick={() => this._handleListItemClicked(itemIndex)}\r\n                >\r\n                </NZ_Item>\r\n              );\r\n            })}\r\n          </NZ_Column>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"StandardRotationNavigationAid.js","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/StandardRotationNavigationAid.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module NavigationAids\n */\n\nimport \"./StandardRotationNavigationAid.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { StandardViewId } from \"@itwin/core-frontend\";\nimport { RelativePosition, ToolbarItemUtilities } from \"@itwin/appui-abstract\";\nimport { ViewportComponentEvents } from \"@itwin/imodel-components-react\";\nimport { CommonProps, Icon, Popup } from \"@itwin/core-react\";\nimport { ExpandableButton as NZ_Expandable, ToolbarIcon as NZ_Icon } from \"@itwin/appui-layout-react\";\nimport { ConfigurableCreateInfo } from \"../configurableui/ConfigurableUiControl\";\nimport { UiFramework } from \"../UiFramework\";\nimport { NavigationAidControl } from \"./NavigationAidControl\";\nimport { Columns, GroupColumn, GroupTool, Panel } from \"@itwin/components-react\";\n\n/** A 3D Standard Rotation Navigation Aid control.\n * @alpha\n */\nexport class StandardRotationNavigationAidControl extends NavigationAidControl {\n  public static navigationAidId = \"StandardRotationNavigationAid\";\n\n  constructor(info: ConfigurableCreateInfo, options: any) {\n    super(info, options);\n    this.reactNode = <StandardRotationNavigationAid />;\n  }\n}\n\n/** @internal */\nexport interface RotationData {\n  label: string;\n  iconClassName: string;\n}\n\n/** @internal */\ninterface StandardRotationNavigationAidState {\n  element: HTMLDivElement | null;\n  isExpanded: boolean;\n  list: RotationData[];\n  selected: StandardViewId;\n}\n\n/** A 3D Standard Rotation Navigation Aid.\n * @alpha\n */\nexport class StandardRotationNavigationAid extends React.Component<CommonProps, StandardRotationNavigationAidState> {\n  private _title = UiFramework.translate(\"standardRotationNavigationAid.title\");\n\n  /** @internal */\n  public override readonly state: Readonly<StandardRotationNavigationAidState>;\n\n  constructor(props: any) {\n    super(props);\n    const list: RotationData[] = [\n      {\n        label: UiFramework.translate(\"rotations.top\"),\n        iconClassName: \"icon-cube-faces-top\",\n      }, {\n        label: UiFramework.translate(\"rotations.bottom\"),\n        iconClassName: \"icon-cube-faces-bottom\",\n      }, {\n        label: UiFramework.translate(\"rotations.left\"),\n        iconClassName: \"icon-cube-faces-left\",\n      }, {\n        label: UiFramework.translate(\"rotations.right\"),\n        iconClassName: \"icon-cube-faces-right\",\n      }, {\n        label: UiFramework.translate(\"rotations.front\"),\n        iconClassName: \"icon-cube-faces-front\",\n      }, {\n        label: UiFramework.translate(\"rotations.rear\"),\n        iconClassName: \"icon-cube-faces-rear\",\n      }, {\n        label: UiFramework.translate(\"rotations.isoLeft\"),\n        iconClassName: \"icon-cube-faces-iso-left\",\n      }, {\n        label: UiFramework.translate(\"rotations.isoRight\"),\n        iconClassName: \"icon-cube-faces-iso-right\",\n      },\n    ];\n    this.state = {\n      element: null,\n      isExpanded: false,\n      list,\n      selected: StandardViewId.Top,\n    };\n  }\n\n  public override render(): React.ReactNode {\n    const className = classnames(\n      \"uifw-standard-rotation-navigation\",\n      this.props.className,\n    );\n\n    return (\n      <div className={className} style={this.props.style}\n        ref={this._handleRef}\n      >\n        <NZ_Expandable\n          className={\"expandable\"}\n        >\n          <NZ_Icon\n            className={\"icon-button\"}\n            icon={\n              <span className={classnames(\"three-d-icon\", \"icon\", this.state.list[this.state.selected].iconClassName)} />\n            }\n            onClick={this._toggleIsExpanded}\n            title={this._title}\n          >\n          </NZ_Icon>\n        </NZ_Expandable>\n        <Popup\n          isOpen={this.state.isExpanded}\n          offset={0}\n          onClose={this._handlePopupClose}\n          position={RelativePosition.Bottom}\n          target={this.state.element}\n        >\n          {this.getExpandedContent()}\n        </Popup>\n      </div>\n    );\n  }\n\n  private _handleRef = (element: HTMLDivElement | null) => {\n    this.setState(() => ({ element }));\n  };\n\n  private _handlePopupClose = () => {\n    this.setState(() => ({ isExpanded: false }));\n  };\n\n  private _toggleIsExpanded = () => {\n    this.setState((prevState) => ({ isExpanded: !prevState.isExpanded }));\n  };\n\n  private _handleListItemClicked = (item: number) => {\n    const selected = item;\n\n    this.setState(\n      () => ({ isExpanded: false, selected }),\n      () => ViewportComponentEvents.setStandardRotation(selected),\n    );\n  };\n\n  private getExpandedContent(): React.ReactNode {\n    if (!this.state.isExpanded)\n      return undefined;\n\n    return (\n      <Panel>\n        <Columns>\n          <GroupColumn>\n            {this.state.list.map((item, itemIndex) => {\n              return (\n                <GroupTool\n                  key={itemIndex.toString()}\n                  label={item.label}\n                  icon={<Icon iconSpec={item.iconClassName} />}\n                  isActive={this.state.selected === itemIndex}\n                  onClick={() => this._handleListItemClicked(itemIndex)}\n                  item={ToolbarItemUtilities.createActionButton(\"\", 0, \"\", \"\", () => { })}\n                />\n              );\n            })}\n          </GroupColumn>\n        </Columns>\n      </Panel>\n    );\n  }\n}\n"]}

package/lib/esm/appui-react/navigationaids/StandardRotationNavigationAid.scss

@@ -1,13 +1,13 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-.uifw-standard-rotation-navigation {
-  > .expandable {
-    .icon-button {
-      height: 64px;
-      width: 64px;
-      font-size: 36px;
-    }
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+.uifw-standard-rotation-navigation {
+  > .expandable {
+    .icon-button {
+      height: 64px;
+      width: 64px;
+      font-size: 36px;
+    }
+  }
+}