npm - @itwin/appui-react - Versions diffs - 4.0.0-dev.3 → 4.0.0-dev.6 - Mend

@itwin/appui-react 4.0.0-dev.3 → 4.0.0-dev.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1397) hide show

package/lib/cjs/appui-react/navigationaids/SheetNavigationAid.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SheetNavigationAid.js","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/SheetNavigationAid.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 \"./SheetNavigationAid.scss\";\r\nimport classnames from \"classnames\";\r\nimport as React from \"react\";\r\nimport { IModelApp, IModelConnection, ScreenViewport, SelectedViewportChangedArgs } from \"@itwin/core-frontend\";\r\nimport { UiComponents } from \"@itwin/components-react\";\r\nimport { ViewIdChangedEventArgs, ViewportComponentEvents } from \"@itwin/imodel-components-react\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { ConfigurableCreateInfo } from \"../configurableui/ConfigurableUiControl\";\r\nimport { FrontstageManager, ModalFrontstageInfo } from \"../frontstage/FrontstageManager\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { ViewUtilities } from \"../utils/ViewUtilities\";\r\nimport { NavigationAidControl } from \"./NavigationAidControl\";\r\nimport { CardContainer, CardSelectedEventArgs, SheetsModalFrontstage } from \"./SheetsModalFrontstage\";\r\nimport { ProgressRadial } from \"@itwin/itwinui-react\";\r\n\r\n/** A Sheet Navigation Aid control.\r\n * @alpha\r\n /\r\nexport class SheetNavigationAidControl extends NavigationAidControl {\r\n public static navigationAidId = \"SheetNavigationAid\";\r\n\r\n constructor(info: ConfigurableCreateInfo, options: any) {\r\n super(info, options);\r\n this.reactNode = <SheetNavigationAid iModelConnection={options.imodel} />;\r\n }\r\n\r\n // istanbul ignore next\r\n public override getSize(): string \| undefined { return \"96px\"; }\r\n}\r\n\r\n/* Data displayed about sheet\r\n * @alpha\r\n /\r\nexport interface SheetData {\r\n name: string;\r\n viewId: string;\r\n}\r\n\r\n/* Properties for the [[SheetNavigationAid]] component\r\n * @alpha\r\n /\r\nexport interface SheetNavigationProps extends CommonProps {\r\n iModelConnection: IModelConnection;\r\n}\r\n\r\n/* @internal /\r\ninterface SheetNavigationState {\r\n index: number;\r\n sheetData: SheetData[];\r\n}\r\n\r\n/* A Sheet Navigation Aid.\r\n * @alpha\r\n /\r\nexport class SheetNavigationAid extends React.Component<SheetNavigationProps, SheetNavigationState> {\r\n private _isMounted = false;\r\n\r\n /* @internal /\r\n public override readonly state: Readonly<SheetNavigationState> = {\r\n index: 0,\r\n sheetData: [],\r\n };\r\n\r\n private _viewport: ScreenViewport \| undefined;\r\n\r\n constructor(props: SheetNavigationProps) {\r\n super(props);\r\n\r\n this._viewport = IModelApp.viewManager.selectedView;\r\n }\r\n\r\n /* Adds listeners when components mounts /\r\n public override async componentDidMount() {\r\n this._isMounted = true;\r\n\r\n CardContainer.onCardSelectedEvent.addListener(this._handleCardSelected);\r\n ViewportComponentEvents.onViewIdChangedEvent.addListener(this._handleViewIdChanged);\r\n\r\n IModelApp.viewManager.onSelectedViewportChanged.addListener(this._handleSelectedViewportChanged);\r\n\r\n const stateData = await this._setupSheets();\r\n\r\n if (this._isMounted)\r\n this.setState(stateData);\r\n }\r\n\r\n /* Removes listeners when component will unmount /\r\n public override componentWillUnmount() {\r\n this._isMounted = false;\r\n\r\n CardContainer.onCardSelectedEvent.removeListener(this._handleCardSelected);\r\n ViewportComponentEvents.onViewIdChangedEvent.removeListener(this._handleViewIdChanged);\r\n\r\n IModelApp.viewManager.onSelectedViewportChanged.removeListener(this._handleSelectedViewportChanged);\r\n }\r\n\r\n /* Queries for sheet info and sets as sheetData /\r\n private async _setupSheets(): Promise<SheetNavigationState> {\r\n const stateData: SheetNavigationState = {\r\n index: 0,\r\n sheetData: [],\r\n };\r\n\r\n // istanbul ignore else\r\n if (!this.props.iModelConnection \|\| !this.props.iModelConnection.views.getViewList)\r\n return stateData;\r\n\r\n // istanbul ignore next\r\n let viewId = \"\";\r\n // istanbul ignore next\r\n if (this._viewport) {\r\n viewId = this._viewport.view.id.toString();\r\n }\r\n\r\n // istanbul ignore next\r\n const sheets = await this.props.iModelConnection.views.getViewList({ from: \"BisCore.SheetViewDefinition\" });\r\n // istanbul ignore next\r\n sheets.forEach((viewSpec: IModelConnection.ViewSpec, index: number) => {\r\n stateData.sheetData.push({ name: viewSpec.name, viewId: viewSpec.id });\r\n if (viewSpec.id === viewId)\r\n stateData.index = index;\r\n });\r\n\r\n // istanbul ignore next\r\n return stateData;\r\n }\r\n\r\n /* @internal /\r\n public override render(): React.ReactNode {\r\n const name = (this.state.sheetData.length > 0) ? / istanbul ignore next / this.state.sheetData[this.state.index].name : \"\";\r\n const sheet = UiFramework.translate(\"general.sheet\");\r\n const ofStr = UiComponents.translate(\"general.of\");\r\n const leftIndex = this.state.index === 0 ? this.state.sheetData.length - 1 : / istanbul ignore next / this.state.index - 1;\r\n const rightIndex = this.state.index >= this.state.sheetData.length - 1 ? 0 : / istanbul ignore next /this.state.index + 1;\r\n const leftTitle = this.state.sheetData[leftIndex] ? / istanbul ignore next / this.state.sheetData[leftIndex].name : undefined;\r\n const rightTitle = this.state.sheetData[rightIndex] ? / istanbul ignore next / this.state.sheetData[rightIndex].name : undefined;\r\n\r\n let content: React.ReactNode;\r\n // istanbul ignore if\r\n if (this.state.sheetData.length > 0) {\r\n content = (\r\n <>\r\n <div className=\"sheet-title\">{sheet}</div>\r\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events /}\r\n <div className=\"sheet-name\" title={name} onClick={this._handleOnClickSheetName}\r\n role=\"button\" tabIndex={-1}>\r\n {name}\r\n </div>\r\n <div className=\"sheet-container\">\r\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events /}\r\n <div className=\"sheet-caret icon icon-caret-left\" onClick={this._handleOnClickLeftArrow}\r\n role=\"button\" tabIndex={-1} title={leftTitle} />\r\n <div>{this.state.index + 1} {ofStr} {this.state.sheetData.length}</div>\r\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events /}\r\n <div className=\"sheet-caret icon icon-caret-right\" onClick={this._handleOnClickRightArrow}\r\n role=\"button\" tabIndex={-1} title={rightTitle} />\r\n </div>\r\n </>\r\n );\r\n } else {\r\n content = <ProgressRadial size=\"x-small\" indeterminate />;\r\n }\r\n\r\n return (\r\n <div className={classnames(\"uifw-sheet-navigation\", this.props.className)} style={this.props.style}>\r\n <div className=\"gradient\"></div>\r\n {content}\r\n </div>\r\n );\r\n }\r\n\r\n /* Sets index of newly selected card /\r\n private _handleCardSelected = (event: CardSelectedEventArgs) => {\r\n event && this.setState({\r\n index: event.index,\r\n });\r\n };\r\n\r\n /* Updates view to the next lowest index in sheetData /\r\n // istanbul ignore next\r\n private _handleOnClickLeftArrow = () => {\r\n this.setState(\r\n (prevState) => ({ index: prevState.index <= 0 ? prevState.sheetData.length - 1 : prevState.index - 1 }),\r\n async () => this._updateView());\r\n };\r\n\r\n /* Updates view to next highest index in sheetData /\r\n // istanbul ignore next\r\n private _handleOnClickRightArrow = () => {\r\n this.setState(\r\n (prevState) => ({ index: (prevState.index + 1) % prevState.sheetData.length }),\r\n async () => this._updateView());\r\n };\r\n\r\n /* Handles a Viewport change & synchs the index /\r\n // istanbul ignore next\r\n private _handleSelectedViewportChanged = (args: SelectedViewportChangedArgs) => {\r\n if (args.current) {\r\n this._handleViewportChanged(args.current);\r\n }\r\n };\r\n\r\n // istanbul ignore next\r\n private _handleViewIdChanged = (args: ViewIdChangedEventArgs) => {\r\n if (this._viewport === args.viewport)\r\n this._handleViewportChanged(args.viewport as ScreenViewport);\r\n };\r\n\r\n /* Handles a Viewport change & synchs the index /\r\n // istanbul ignore next\r\n private _handleViewportChanged = (viewport: ScreenViewport) => {\r\n const className = ViewUtilities.getBisBaseClass(viewport.view.classFullName);\r\n\r\n if (ViewUtilities.isSheet(className)) {\r\n this._viewport = viewport;\r\n\r\n const viewId = this._viewport.view.id.toString();\r\n\r\n const index = this.state.sheetData.findIndex((sheetData: SheetData) => {\r\n return (viewId === sheetData.viewId);\r\n });\r\n\r\n if (index >= 0)\r\n this.setState({ index });\r\n }\r\n };\r\n\r\n /* Updates view to currently set sheet /\r\n // istanbul ignore next\r\n private async _updateView() {\r\n const viewState = await this.props.iModelConnection.views.load(this.state.sheetData[this.state.index].viewId);\r\n if (this._viewport)\r\n this._viewport.changeView(viewState);\r\n }\r\n\r\n /* Creates a new SheetsModalFrontstage /\r\n // istanbul ignore next\r\n private modalFrontstage(): ModalFrontstageInfo {\r\n return new SheetsModalFrontstage(this.state.sheetData, this.props.iModelConnection, this.state.index);\r\n }\r\n\r\n /* Opens a new SheetsModelFrontstage on sheetName click */\r\n // istanbul ignore next\r\n private _handleOnClickSheetName = () => {\r\n FrontstageManager.openModalFrontstage(this.modalFrontstage());\r\n };\r\n}\r\n"]}
1	+ {"version":3,"file":"SheetNavigationAid.js","sourceRoot":"","sources":["../../../../src/appui-react/navigationaids/SheetNavigationAid.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;AAEH,qCAAmC;AACnC,2CAAoC;AACpC,+BAA+B;AAC/B,wDAAgH;AAChH,8DAAuD;AACvD,4EAAiG;AAGjG,uEAAyF;AACzF,gDAA6C;AAC7C,0DAAuD;AACvD,iEAA8D;AAC9D,mEAAsG;AACtG,wDAAsD;AAEtD;;GAEG;AACH,MAAa,yBAA0B,SAAQ,2CAAoB;IAGjE,YAAY,IAA4B,EAAE,OAAY;QACpD,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACrB,IAAI,CAAC,SAAS,GAAG,oBAAC,kBAAkB,IAAC,gBAAgB,EAAE,OAAO,CAAC,MAAM,GAAI,CAAC;IAC5E,CAAC;IAEe,OAAO,KAAyB,OAAO,MAAM,CAAC,CAAC,CAAC;;AARlE,8DASC;AARe,yCAAe,GAAG,oBAAoB,CAAC;AA+BvD;;GAEG;AACH,MAAa,kBAAmB,SAAQ,KAAK,CAAC,SAAqD;IAWjG,YAAY,KAA2B;QACrC,KAAK,CAAC,KAAK,CAAC,CAAC;QAXP,eAAU,GAAG,KAAK,CAAC;QAE3B,gBAAgB;QACS,UAAK,GAAmC;YAC/D,KAAK,EAAE,CAAC;YACR,SAAS,EAAE,EAAE;SACd,CAAC;QA8GF,wCAAwC;QAChC,wBAAmB,GAAG,CAAC,KAA4B,EAAE,EAAE;YAC7D,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC;gBACrB,KAAK,EAAE,KAAK,CAAC,KAAK;aACnB,CAAC,CAAC;QACL,CAAC,CAAC;QAEF,yDAAyD;QACzD,uBAAuB;QACf,4BAAuB,GAAG,GAAG,EAAE;YACrC,IAAI,CAAC,QAAQ,CACX,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,EACvG,KAAK,IAAI,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;QACpC,CAAC,CAAC;QAEF,sDAAsD;QACtD,uBAAuB;QACf,6BAAwB,GAAG,GAAG,EAAE;YACtC,IAAI,CAAC,QAAQ,CACX,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,EAC9E,KAAK,IAAI,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;QACpC,CAAC,CAAC;QAEF,mDAAmD;QACnD,uBAAuB;QACf,mCAA8B,GAAG,CAAC,IAAiC,EAAE,EAAE;YAC7E,IAAI,IAAI,CAAC,OAAO,EAAE;gBAChB,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;aAC3C;QACH,CAAC,CAAC;QAEF,uBAAuB;QACf,yBAAoB,GAAG,CAAC,IAA4B,EAAE,EAAE;YAC9D,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC,QAAQ;gBAClC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,QAA0B,CAAC,CAAC;QACjE,CAAC,CAAC;QAEF,mDAAmD;QACnD,uBAAuB;QACf,2BAAsB,GAAG,CAAC,QAAwB,EAAE,EAAE;YAC5D,MAAM,SAAS,GAAG,6BAAa,CAAC,eAAe,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;YAE7E,IAAI,6BAAa,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE;gBACpC,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;gBAE1B,MAAM,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC;gBAEjD,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,SAAoB,EAAE,EAAE;oBACpE,OAAO,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM,CAAC,CAAC;gBACvC,CAAC,CAAC,CAAC;gBAEH,IAAI,KAAK,IAAI,CAAC;oBACZ,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;aAC5B;QACH,CAAC,CAAC;QAgBF,2DAA2D;QAC3D,uBAAuB;QACf,4BAAuB,GAAG,GAAG,EAAE;YACrC,qCAAiB,CAAC,mBAAmB,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC;QAChE,CAAC,CAAC;QAjLA,IAAI,CAAC,SAAS,GAAG,yBAAS,CAAC,WAAW,CAAC,YAAY,CAAC;IACtD,CAAC;IAED,4CAA4C;IAC5B,KAAK,CAAC,iBAAiB;QACrC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QAEvB,qCAAa,CAAC,mBAAmB,CAAC,WAAW,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;QACxE,iDAAuB,CAAC,oBAAoB,CAAC,WAAW,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QAEpF,yBAAS,CAAC,WAAW,CAAC,yBAAyB,CAAC,WAAW,CAAC,IAAI,CAAC,8BAA8B,CAAC,CAAC;QAEjG,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC;QAE5C,IAAI,IAAI,CAAC,UAAU;YACjB,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IAC7B,CAAC;IAED,oDAAoD;IACpC,oBAAoB;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAExB,qCAAa,CAAC,mBAAmB,CAAC,cAAc,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;QAC3E,iDAAuB,CAAC,oBAAoB,CAAC,cAAc,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QAEvF,yBAAS,CAAC,WAAW,CAAC,yBAAyB,CAAC,cAAc,CAAC,IAAI,CAAC,8BAA8B,CAAC,CAAC;IACtG,CAAC;IAED,mDAAmD;IAC3C,KAAK,CAAC,YAAY;QACxB,MAAM,SAAS,GAAyB;YACtC,KAAK,EAAE,CAAC;YACR,SAAS,EAAE,EAAE;SACd,CAAC;QAEF,uBAAuB;QACvB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,KAAK,CAAC,WAAW;YAChF,OAAO,SAAS,CAAC;QAEnB,uBAAuB;QACvB,IAAI,MAAM,GAAG,EAAE,CAAC;QAChB,uBAAuB;QACvB,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC;SAC5C;QAED,uBAAuB;QACvB,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,6BAA6B,EAAE,CAAC,CAAC;QAC5G,uBAAuB;QACvB,MAAM,CAAC,OAAO,CAAC,CAAC,QAAmC,EAAE,KAAa,EAAE,EAAE;YACpE,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,EAAE,CAAC,CAAC;YACvE,IAAI,QAAQ,CAAC,EAAE,KAAK,MAAM;gBACxB,SAAS,CAAC,KAAK,GAAG,KAAK,CAAC;QAC5B,CAAC,CAAC,CAAC;QAEH,uBAAuB;QACvB,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,gBAAgB;IACA,MAAM;QACpB,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;QAC7H,MAAM,KAAK,GAAG,yBAAW,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC;QACrD,MAAM,KAAK,GAAG,+BAAY,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;QACnD,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC;QAC7H,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,0BAA0B,CAAA,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC;QAC5H,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;QAChI,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,0BAA0B,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;QAEnI,IAAI,OAAwB,CAAC;QAC7B,qBAAqB;QACrB,IAAI,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;YACnC,OAAO,GAAG,CACR;gBACE,6BAAK,SAAS,EAAC,aAAa,IAAE,KAAK,CAAO;gBAE1C,6BAAK,SAAS,EAAC,YAAY,EAAC,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,uBAAuB,EAC5E,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,CAAC,IACzB,IAAI,CACD;gBACN,6BAAK,SAAS,EAAC,iBAAiB;oBAE9B,6BAAK,SAAS,EAAC,kCAAkC,EAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB,EACrF,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,GAAI;oBAClD;wBAAM,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC;;wBAAG,KAAK;;wBAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAO;oBAEvE,6BAAK,SAAS,EAAC,mCAAmC,EAAC,OAAO,EAAE,IAAI,CAAC,wBAAwB,EACvF,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,GAAI,CAC/C,CACL,CACJ,CAAC;SACH;aAAM;YACL,OAAO,GAAG,oBAAC,8BAAc,IAAC,IAAI,EAAC,SAAS,EAAC,aAAa,SAAG,CAAC;SAC3D;QAED,OAAO,CACL,6BAAK,SAAS,EAAE,IAAA,oBAAU,EAAC,uBAAuB,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YAChG,6BAAK,SAAS,EAAC,UAAU,GAAO;YAC/B,OAAO,CACJ,CACP,CAAC;IACJ,CAAC;IA0DD,0CAA0C;IAC1C,uBAAuB;IACf,KAAK,CAAC,WAAW;QACvB,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC;QAC9G,IAAI,IAAI,CAAC,SAAS;YAChB,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC;IACzC,CAAC;IAED,0CAA0C;IAC1C,uBAAuB;IACf,eAAe;QACrB,OAAO,IAAI,6CAAqB,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACxG,CAAC;CAOF;AAhMD,gDAgMC","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 \"./SheetNavigationAid.scss\";\r\nimport classnames from \"classnames\";\r\nimport as React from \"react\";\r\nimport { IModelApp, IModelConnection, ScreenViewport, SelectedViewportChangedArgs } from \"@itwin/core-frontend\";\r\nimport { UiComponents } from \"@itwin/components-react\";\r\nimport { ViewIdChangedEventArgs, ViewportComponentEvents } from \"@itwin/imodel-components-react\";\r\nimport { CommonProps } from \"@itwin/core-react\";\r\nimport { ConfigurableCreateInfo } from \"../configurableui/ConfigurableUiControl\";\r\nimport { FrontstageManager, ModalFrontstageInfo } from \"../frontstage/FrontstageManager\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { ViewUtilities } from \"../utils/ViewUtilities\";\r\nimport { NavigationAidControl } from \"./NavigationAidControl\";\r\nimport { CardContainer, CardSelectedEventArgs, SheetsModalFrontstage } from \"./SheetsModalFrontstage\";\r\nimport { ProgressRadial } from \"@itwin/itwinui-react\";\r\n\r\n/** A Sheet Navigation Aid control.\r\n * @alpha\r\n /\r\nexport class SheetNavigationAidControl extends NavigationAidControl {\r\n public static navigationAidId = \"SheetNavigationAid\";\r\n\r\n constructor(info: ConfigurableCreateInfo, options: any) {\r\n super(info, options);\r\n this.reactNode = <SheetNavigationAid iModelConnection={options.imodel} />;\r\n }\r\n\r\n public override getSize(): string \| undefined { return \"96px\"; }\r\n}\r\n\r\n/* Data displayed about sheet\r\n * @alpha\r\n /\r\nexport interface SheetData {\r\n name: string;\r\n viewId: string;\r\n}\r\n\r\n/* Properties for the [[SheetNavigationAid]] component\r\n * @alpha\r\n /\r\nexport interface SheetNavigationProps extends CommonProps {\r\n iModelConnection: IModelConnection;\r\n}\r\n\r\n/* @internal /\r\ninterface SheetNavigationState {\r\n index: number;\r\n sheetData: SheetData[];\r\n}\r\n\r\n/* A Sheet Navigation Aid.\r\n * @alpha\r\n /\r\nexport class SheetNavigationAid extends React.Component<SheetNavigationProps, SheetNavigationState> {\r\n private _isMounted = false;\r\n\r\n /* @internal /\r\n public override readonly state: Readonly<SheetNavigationState> = {\r\n index: 0,\r\n sheetData: [],\r\n };\r\n\r\n private _viewport: ScreenViewport \| undefined;\r\n\r\n constructor(props: SheetNavigationProps) {\r\n super(props);\r\n\r\n this._viewport = IModelApp.viewManager.selectedView;\r\n }\r\n\r\n /* Adds listeners when components mounts /\r\n public override async componentDidMount() {\r\n this._isMounted = true;\r\n\r\n CardContainer.onCardSelectedEvent.addListener(this._handleCardSelected);\r\n ViewportComponentEvents.onViewIdChangedEvent.addListener(this._handleViewIdChanged);\r\n\r\n IModelApp.viewManager.onSelectedViewportChanged.addListener(this._handleSelectedViewportChanged);\r\n\r\n const stateData = await this._setupSheets();\r\n\r\n if (this._isMounted)\r\n this.setState(stateData);\r\n }\r\n\r\n /* Removes listeners when component will unmount /\r\n public override componentWillUnmount() {\r\n this._isMounted = false;\r\n\r\n CardContainer.onCardSelectedEvent.removeListener(this._handleCardSelected);\r\n ViewportComponentEvents.onViewIdChangedEvent.removeListener(this._handleViewIdChanged);\r\n\r\n IModelApp.viewManager.onSelectedViewportChanged.removeListener(this._handleSelectedViewportChanged);\r\n }\r\n\r\n /* Queries for sheet info and sets as sheetData /\r\n private async _setupSheets(): Promise<SheetNavigationState> {\r\n const stateData: SheetNavigationState = {\r\n index: 0,\r\n sheetData: [],\r\n };\r\n\r\n // istanbul ignore else\r\n if (!this.props.iModelConnection \|\| !this.props.iModelConnection.views.getViewList)\r\n return stateData;\r\n\r\n // istanbul ignore next\r\n let viewId = \"\";\r\n // istanbul ignore next\r\n if (this._viewport) {\r\n viewId = this._viewport.view.id.toString();\r\n }\r\n\r\n // istanbul ignore next\r\n const sheets = await this.props.iModelConnection.views.getViewList({ from: \"BisCore.SheetViewDefinition\" });\r\n // istanbul ignore next\r\n sheets.forEach((viewSpec: IModelConnection.ViewSpec, index: number) => {\r\n stateData.sheetData.push({ name: viewSpec.name, viewId: viewSpec.id });\r\n if (viewSpec.id === viewId)\r\n stateData.index = index;\r\n });\r\n\r\n // istanbul ignore next\r\n return stateData;\r\n }\r\n\r\n /* @internal /\r\n public override render(): React.ReactNode {\r\n const name = (this.state.sheetData.length > 0) ? / istanbul ignore next / this.state.sheetData[this.state.index].name : \"\";\r\n const sheet = UiFramework.translate(\"general.sheet\");\r\n const ofStr = UiComponents.translate(\"general.of\");\r\n const leftIndex = this.state.index === 0 ? this.state.sheetData.length - 1 : / istanbul ignore next / this.state.index - 1;\r\n const rightIndex = this.state.index >= this.state.sheetData.length - 1 ? 0 : / istanbul ignore next /this.state.index + 1;\r\n const leftTitle = this.state.sheetData[leftIndex] ? / istanbul ignore next / this.state.sheetData[leftIndex].name : undefined;\r\n const rightTitle = this.state.sheetData[rightIndex] ? / istanbul ignore next / this.state.sheetData[rightIndex].name : undefined;\r\n\r\n let content: React.ReactNode;\r\n // istanbul ignore if\r\n if (this.state.sheetData.length > 0) {\r\n content = (\r\n <>\r\n <div className=\"sheet-title\">{sheet}</div>\r\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events /}\r\n <div className=\"sheet-name\" title={name} onClick={this._handleOnClickSheetName}\r\n role=\"button\" tabIndex={-1}>\r\n {name}\r\n </div>\r\n <div className=\"sheet-container\">\r\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events /}\r\n <div className=\"sheet-caret icon icon-caret-left\" onClick={this._handleOnClickLeftArrow}\r\n role=\"button\" tabIndex={-1} title={leftTitle} />\r\n <div>{this.state.index + 1} {ofStr} {this.state.sheetData.length}</div>\r\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events /}\r\n <div className=\"sheet-caret icon icon-caret-right\" onClick={this._handleOnClickRightArrow}\r\n role=\"button\" tabIndex={-1} title={rightTitle} />\r\n </div>\r\n </>\r\n );\r\n } else {\r\n content = <ProgressRadial size=\"x-small\" indeterminate />;\r\n }\r\n\r\n return (\r\n <div className={classnames(\"uifw-sheet-navigation\", this.props.className)} style={this.props.style}>\r\n <div className=\"gradient\"></div>\r\n {content}\r\n </div>\r\n );\r\n }\r\n\r\n /* Sets index of newly selected card /\r\n private _handleCardSelected = (event: CardSelectedEventArgs) => {\r\n event && this.setState({\r\n index: event.index,\r\n });\r\n };\r\n\r\n /* Updates view to the next lowest index in sheetData /\r\n // istanbul ignore next\r\n private _handleOnClickLeftArrow = () => {\r\n this.setState(\r\n (prevState) => ({ index: prevState.index <= 0 ? prevState.sheetData.length - 1 : prevState.index - 1 }),\r\n async () => this._updateView());\r\n };\r\n\r\n /* Updates view to next highest index in sheetData /\r\n // istanbul ignore next\r\n private _handleOnClickRightArrow = () => {\r\n this.setState(\r\n (prevState) => ({ index: (prevState.index + 1) % prevState.sheetData.length }),\r\n async () => this._updateView());\r\n };\r\n\r\n /* Handles a Viewport change & synchs the index /\r\n // istanbul ignore next\r\n private _handleSelectedViewportChanged = (args: SelectedViewportChangedArgs) => {\r\n if (args.current) {\r\n this._handleViewportChanged(args.current);\r\n }\r\n };\r\n\r\n // istanbul ignore next\r\n private _handleViewIdChanged = (args: ViewIdChangedEventArgs) => {\r\n if (this._viewport === args.viewport)\r\n this._handleViewportChanged(args.viewport as ScreenViewport);\r\n };\r\n\r\n /* Handles a Viewport change & synchs the index /\r\n // istanbul ignore next\r\n private _handleViewportChanged = (viewport: ScreenViewport) => {\r\n const className = ViewUtilities.getBisBaseClass(viewport.view.classFullName);\r\n\r\n if (ViewUtilities.isSheet(className)) {\r\n this._viewport = viewport;\r\n\r\n const viewId = this._viewport.view.id.toString();\r\n\r\n const index = this.state.sheetData.findIndex((sheetData: SheetData) => {\r\n return (viewId === sheetData.viewId);\r\n });\r\n\r\n if (index >= 0)\r\n this.setState({ index });\r\n }\r\n };\r\n\r\n /* Updates view to currently set sheet /\r\n // istanbul ignore next\r\n private async _updateView() {\r\n const viewState = await this.props.iModelConnection.views.load(this.state.sheetData[this.state.index].viewId);\r\n if (this._viewport)\r\n this._viewport.changeView(viewState);\r\n }\r\n\r\n /* Creates a new SheetsModalFrontstage /\r\n // istanbul ignore next\r\n private modalFrontstage(): ModalFrontstageInfo {\r\n return new SheetsModalFrontstage(this.state.sheetData, this.props.iModelConnection, this.state.index);\r\n }\r\n\r\n /* Opens a new SheetsModelFrontstage on sheetName click */\r\n // istanbul ignore next\r\n private _handleOnClickSheetName = () => {\r\n FrontstageManager.openModalFrontstage(this.modalFrontstage());\r\n };\r\n}\r\n"]}

package/lib/cjs/appui-react/navigationaids/SheetNavigationAid.scss CHANGED Viewed

@@ -10,7 +10,7 @@
   box-sizing: border-box;
   border-color: $buic-background-widget-stroke;
   border-width: 1px;
-  border-radius: var(--iui-border-radius-1);
+  border-radius: 3px;
   border-style: solid;
   color: $buic-foreground-body;
   background: $buic-background-window;
@@ -20,12 +20,12 @@
   align-items: center;
   justify-content: center;
-  > .sheet-title {
+  >.sheet-title {
     font-size: 12px;
     font-weight: bold;
   }
-  > .sheet-name {
+  >.sheet-name {
     cursor: pointer;
     font-size: 11px;
     z-index: 1;
@@ -38,18 +38,18 @@
     }
   }
-  > .sheet-container {
+  >.sheet-container {
     flex: 1 1 100%;
     display: flex;
     align-items: center;
     justify-content: space-between;
     font-size: 11px;
-    > * {
+    >* {
       text-align: center;
     }
-    > .sheet-caret {
+    >.sheet-caret {
       cursor: pointer;
       font-size: 15px;
       filter: drop-shadow(0 1px 0 $buic-foreground-body-reverse);
@@ -70,12 +70,8 @@
     }
   }
-  > .gradient {
-    background: linear-gradient(
-      to bottom,
-      $buic-button-gradient1,
-      $buic-button-gradient2
-    );
+  >.gradient {
+    background: linear-gradient(to bottom, $buic-button-gradient1, $buic-button-gradient2);
     position: absolute;
     width: 100%;
     height: 100%;
@@ -84,4 +80,4 @@
     display: none;
   }
-}
+}

package/lib/cjs/appui-react/navigationaids/StandardRotationNavigationAid.d.ts.map CHANGED Viewed

	@@ -1 +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;~~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~~"}
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"}

package/lib/cjs/appui-react/navigationaids/StandardRotationNavigationAid.js CHANGED Viewed

@@ -18,7 +18,8 @@ const core_react_1 = require("@itwin/core-react");
 const appui_layout_react_1 = require("@itwin/appui-layout-react");
 const UiFramework_1 = require("../UiFramework");
 const NavigationAidControl_1 = require("./NavigationAidControl");
-const components_react_1 = require("@itwin/components-react");
+// eslint-disable-next-line @typescript-eslint/naming-convention, deprecation/deprecation
+const NZ_ContainedTray = (0, appui_layout_react_1.withContainIn)(appui_layout_react_1.Group);
 /** A 3D Standard Rotation Navigation Aid control.
  * @alpha
  */
@@ -94,11 +95,11 @@ class StandardRotationNavigationAid extends React.Component {
     getExpandedContent() {
         if (!this.state.isExpanded)
             return undefined;
-        return (React.createElement(components_react_1.Panel, null,
-            React.createElement(components_react_1.Columns, null,
-                React.createElement(components_react_1.GroupColumn, null, this.state.list.map((item, itemIndex) => {
-                    return (React.createElement(components_react_1.GroupTool, { key: itemIndex.toString(), label: item.label, icon: React.createElement(core_react_1.Icon, { iconSpec: item.iconClassName }), isActive: this.state.selected === itemIndex, onClick: () => this._handleListItemClicked(itemIndex), item: appui_abstract_1.ToolbarItemUtilities.createActionButton("", 0, "", "", () => { }) }));
-                })))));
+        return (React.createElement(NZ_ContainedTray, { containFn: appui_layout_react_1.containHorizontally, columns: React.createElement(appui_layout_react_1.GroupColumn, null,
+                " ",
+                this.state.list.map((item, itemIndex) => {
+                    return (React.createElement(appui_layout_react_1.GroupTool, { key: itemIndex.toString(), ref: itemIndex.toString(), label: item.label, icon: React.createElement(core_react_1.Icon, { iconSpec: item.iconClassName }), isActive: this.state.selected === itemIndex, onClick: () => this._handleListItemClicked(itemIndex) }));
+                })) }));
     }
 }
 exports.StandardRotationNavigationAid = StandardRotationNavigationAid;

package/lib/cjs/appui-react/navigationaids/StandardRotationNavigationAid.js.map CHANGED Viewed

	@@ -1 +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, ToolbarItemUtilities } from \"@itwin/appui-abstract\";\r\nimport { ViewportComponentEvents } from \"@itwin/imodel-components-react\";\r\nimport { CommonProps, Icon, Popup } from \"@itwin/core-react\";\r\nimport { ExpandableButton as NZ_Expandable, ToolbarIcon as NZ_Icon } from \"@itwin/appui-layout-react\";\r\nimport { ConfigurableCreateInfo } from \"../configurableui/ConfigurableUiControl\";\r\nimport { UiFramework } from \"../UiFramework\";\r\nimport { NavigationAidControl } from \"./NavigationAidControl\";\r\nimport { Columns, GroupColumn, GroupTool, Panel } from \"@itwin/components-react\";\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 <Panel>\r\n <Columns>\r\n <GroupColumn>\r\n {this.state.list.map((item, itemIndex) => {\r\n return (\r\n <GroupTool\r\n key={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 item={ToolbarItemUtilities.createActionButton(\"\", 0, \"\", \"\", () => { })}\r\n />\r\n );\r\n })}\r\n </GroupColumn>\r\n </Columns>\r\n </Panel>\r\n );\r\n }\r\n}\r\n"]}
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"]}

package/lib/cjs/appui-react/pickers/ListPicker.d.ts CHANGED Viewed

@@ -23,7 +23,7 @@ export interface ListItem {
     type?: ListItemType;
     children?: ListItem[];
 }
-/** Properties for the [[ListPicker]] component
+/** Properties for the [[ListPickerBase]] component
  * @beta
  */
 export interface ListPickerProps {
@@ -34,6 +34,12 @@ export interface ListPickerProps {
     onExpanded?: (expand: boolean) => void;
     onSizeKnown?: (size: SizeProps) => void;
 }
+/** State for the [[ListPickerBase]] component
+ * @internal
+ */
+interface ListPickerState {
+    expanded: boolean;
+}
 /** Properties for the [[ListPickerItem]] component
  * @beta
  */
@@ -57,8 +63,6 @@ export declare class ListPickerItem extends React.PureComponent<ListPickerItemPr
 export interface ExpandableSectionProps extends CommonProps {
     title?: string;
     expanded?: boolean;
-    /** Content */
-    children?: React.ReactNode;
 }
 /** State for the [[ExpandableSection]] component
  * @internal
@@ -78,6 +82,34 @@ export declare class ExpandableSection extends React.PureComponent<ExpandableSec
 }
 /** @beta */
 export declare function getListPanel(props: ListPickerProps): React.ReactNode;
+/**
+ * List picker base class.
+ * Used to provide an expandable list of items to enable/disable items.
+ * @deprecated in 3.5. Used in UI1.0 only.
+ * @beta
+ */
+export declare class ListPickerBase extends React.PureComponent<ListPickerProps, ListPickerState> {
+    private _isMounted;
+    private _closeOnPanelOpened;
+    private _ref;
+    /** Creates a ListPickerBase */
+    constructor(props: any);
+    /** Minimizes the expandable component. */
+    minimize: () => void;
+    /** Checks if ExpandableItem is expanded. */
+    isExpanded: () => boolean;
+    /** @internal */
+    componentDidMount(): void;
+    /** @internal */
+    componentWillUnmount(): void;
+    /** Renders ListPickerBase */
+    render(): JSX.Element;
+    /** Returns the list with the items */
+    getExpandedContent(): React.ReactNode;
+    private _handleOnOutsideClick;
+    private _handleToolPanelOpenedEvent;
+    private _handleClick;
+}
 /** Properties for the [[ListPicker]] component
  * @beta
  */

package/lib/cjs/appui-react/pickers/ListPicker.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListPicker.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/pickers/ListPicker.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,mBAAmB,CAAC;AAE3B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAQ,SAAS,~~EAAE~~,MAAM,mBAAmB,CAAC;~~AAIjE~~;;GAEG;AACH,oBAAY,YAAY;IACtB,IAAI,IAAI;IACR,SAAS,IAAI;IACb,SAAS,IAAI;CACd;AAED;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;CACvB;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACpC,UAAU,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,KAAK,GAAG,CAAC;IACtD,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;CACzC;AAED;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,WAAW;IACtD,GAAG,EAAE,GAAG,CAAC;IACT,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,qBAAa,cAAe,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC;IAC1E,6BAA6B;IACb,MAAM;CAmBvB;AAED;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,WAAW;IACzD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;~~IACnB,cAAc~~;~~IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;~~AAED;;GAEG;AACH,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED;;GAEG;AACH,qBAAa,iBAAkB,SAAQ,KAAK,CAAC,aAAa,CAAC,sBAAsB,EAAE,sBAAsB,CAAC;IACxG,mCAAmC;gBACvB,KAAK,EAAE,sBAAsB;IAKzC,OAAO,CAAC,QAAQ,CAEd;IAEF,gCAAgC;IAChB,MAAM;CA4BvB;AAED,YAAY;AACZ,wBAAgB,YAAY,CAAC,KAAK,EAAE,eAAe,GAAG,KAAK,CAAC,SAAS,~~CA8DpE~~;AAyBD;;GAEG;AACH,MAAM,WAAW,uBAAwB,SAAQ,eAAe;IAC9D,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED;;;;GAIG;AACH,qBAAa,UAAW,SAAQ,KAAK,CAAC,SAAS,CAAC,uBAAuB,CAAC;IACtE,WAAkB,OAAO,WAAiB;IAC1C,WAAkB,QAAQ,WAAiB;IAC3C,WAAkB,UAAU,WAAiB;IAC7C,WAAkB,aAAa,WAAiB;IAEhD,2BAA2B;gBACf,KAAK,EAAE,uBAAuB;IAK1C,OAAO,CAAC,WAAW;IA0BnB;;;OAGG;IACI,aAAa,CAAC,IAAI,EAAE,QAAQ;IAMnC,OAAO,CAAC,WAAW,CA0BjB;IAEF,yBAAyB;IACT,MAAM;~~CAYvB~~"}
1	+ {"version":3,"file":"ListPicker.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/pickers/ListPicker.tsx"],"names":[],"mappings":"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"}

package/lib/cjs/appui-react/pickers/ListPicker.js CHANGED Viewed

@@ -7,14 +7,19 @@
  * @module Picker
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ListPicker = exports.getListPanel = exports.ExpandableSection = exports.ListPickerItem = exports.ListItemType = void 0;
+exports.ListPicker = exports.ListPickerBase = exports.getListPanel = exports.ExpandableSection = exports.ListPickerItem = exports.ListItemType = void 0;
 require("./ListPicker.scss");
 const classnames_1 = require("classnames");
 const React = require("react");
 const components_react_1 = require("@itwin/components-react");
 const core_react_1 = require("@itwin/core-react");
+const appui_layout_react_1 = require("@itwin/appui-layout-react");
+const FrontstageManager_1 = require("../frontstage/FrontstageManager");
+const useFrameworkVersion_1 = require("../hooks/useFrameworkVersion");
 const DragInteraction_1 = require("../toolbar/DragInteraction");
 const UiFramework_1 = require("../UiFramework");
+// eslint-disable-next-line @typescript-eslint/naming-convention, deprecation/deprecation
+const ContainedGroup = (0, core_react_1.withOnOutsideClick)((0, appui_layout_react_1.withContainIn)(appui_layout_react_1.Group), undefined, false);
 /** Enum for the list picker item type
  * @beta
  */
@@ -24,6 +29,7 @@ var ListItemType;
     ListItemType[ListItemType["Separator"] = 1] = "Separator";
     ListItemType[ListItemType["Container"] = 2] = "Container";
 })(ListItemType = exports.ListItemType || (exports.ListItemType = {}));
+let lastOpenedPicker; // eslint-disable-line deprecation/deprecation
 /** List Picker Item React component
  * @beta
  */
@@ -56,13 +62,16 @@ class ExpandableSection extends React.PureComponent {
     render() {
         const className = (0, classnames_1.default)("nz-toolbar-item-expandable-group-group", this.props.className);
         const icon = this.state.expanded ? React.createElement("i", { className: "icon icon-chevron-down" }) : React.createElement("i", { className: "icon icon-chevron-right" });
-        return (React.createElement(components_react_1.Panel, { className: className, style: this.props.style, key: this.props.title },
+        return (React.createElement(appui_layout_react_1.Panel, { className: className, style: this.props.style, key: this.props.title },
+            " ",
             React.createElement("div", { onClick: this._onClick, className: this.state.expanded ? "ListPickerInnerContainer-header-expanded" : "ListPickerInnerContainer-header", role: "button", tabIndex: -1, "aria-expanded": this.state.expanded },
                 React.createElement("div", { className: "ListPickerInnerContainer-header-content" },
                     React.createElement("div", { className: "ListPickerInnerContainer-expander" }, icon),
                     React.createElement("div", { className: "ListPickerInnerContainer-title" }, this.props.title))),
             this.state.expanded ?
-                React.createElement(components_react_1.GroupColumn, null, this.props.children) : React.createElement("div", null)));
+                React.createElement(appui_layout_react_1.GroupColumn, null,
+                    " ",
+                    this.props.children) : React.createElement("div", null)));
     }
 }
 exports.ExpandableSection = ExpandableSection;
@@ -85,7 +94,9 @@ function getListPanel(props) {
             case ListItemType.Container:
                 if (item.children.length !== 0) {
                     return (React.createElement(ExpandableSection, { key: itemIndex.toString(), title: item.name, className: "ListPickerInnerContainer", expanded: expandSingleSection() },
-                        React.createElement(components_react_1.GroupColumn, null, item.children.map(listItemToElement))));
+                        React.createElement(appui_layout_react_1.GroupColumn, null,
+                            " ",
+                            item.children.map(listItemToElement))));
                 }
                 else {
                     return (React.createElement("div", { key: itemIndex.toString() }));
@@ -95,12 +106,134 @@ function getListPanel(props) {
                 return (React.createElement("div", { key: itemIndex.toString() }));
         }
     };
-    return (React.createElement(components_react_1.Panel, { className: "ListPickerContainer" },
-        React.createElement(components_react_1.Title, null, props.title),
-        React.createElement(components_react_1.Columns, null,
-            React.createElement(components_react_1.GroupColumn, { className: "ListPicker-column" }, props.items.map(listItemToElement)))));
+    return (React.createElement(ContainedGroup, { className: "ListPickerContainer", columns: React.createElement(appui_layout_react_1.GroupColumn, { className: "ListPicker-column" },
+            " ",
+            props.items.map(listItemToElement)), containFn: appui_layout_react_1.containHorizontally, title: props.title }));
 }
 exports.getListPanel = getListPanel;
+/**
+ * List picker base class.
+ * Used to provide an expandable list of items to enable/disable items.
+ * @deprecated in 3.5. Used in UI1.0 only.
+ * @beta
+ */
+class ListPickerBase extends React.PureComponent {
+    /** Creates a ListPickerBase */
+    constructor(props) {
+        super(props);
+        this._isMounted = false;
+        this._closeOnPanelOpened = true;
+        this._ref = React.createRef();
+        /** Minimizes the expandable component. */
+        this.minimize = () => {
+            // istanbul ignore else
+            if (this._isMounted)
+                this.setState({
+                    expanded: false,
+                });
+        };
+        /** Checks if ExpandableItem is expanded. */
+        this.isExpanded = () => {
+            return this.state.expanded;
+        };
+        this._handleOnOutsideClick = (e) => {
+            if (!this._ref.current || !(e.target instanceof Node) || this._ref.current.contains(e.target))
+                return;
+            this.minimize();
+            this.props.onExpanded && this.props.onExpanded(false);
+        };
+        this._handleToolPanelOpenedEvent = () => {
+            if (!this._closeOnPanelOpened)
+                return;
+            this.minimize();
+        };
+        this._handleClick = () => {
+            // istanbul ignore next
+            if (!this._isMounted)
+                return;
+            this.setState((prevState) => {
+                const expanded = !prevState.expanded;
+                return {
+                    expanded,
+                };
+            }, () => {
+                const expanded = this.state.expanded;
+                if (expanded) {
+                    // Minimize any other list picker that has been opened
+                    // This is to mimic Bimium's behavior where pickers only close when other pickers are opened
+                    if (lastOpenedPicker && lastOpenedPicker !== this && lastOpenedPicker.isExpanded())
+                        lastOpenedPicker.minimize();
+                    lastOpenedPicker = this;
+                    this._closeOnPanelOpened = false;
+                    expanded && FrontstageManager_1.FrontstageManager.onToolPanelOpenedEvent.emit();
+                    this._closeOnPanelOpened = true;
+                }
+                this.props.onExpanded && this.props.onExpanded(expanded);
+            });
+        };
+        this.state = {
+            expanded: false,
+        };
+    }
+    /** @internal */
+    componentDidMount() {
+        this._isMounted = true;
+        FrontstageManager_1.FrontstageManager.onToolPanelOpenedEvent.addListener(this._handleToolPanelOpenedEvent);
+    }
+    /** @internal */
+    componentWillUnmount() {
+        this._isMounted = false;
+        FrontstageManager_1.FrontstageManager.onToolPanelOpenedEvent.addListener(this._handleToolPanelOpenedEvent);
+    }
+    /** Renders ListPickerBase */
+    render() {
+        const icon = this.props.iconSpec ? /* istanbul ignore next */ (typeof this.props.iconSpec === "string" ?
+            /* istanbul ignore next */ React.createElement(core_react_1.Icon, { iconSpec: this.props.iconSpec }) : React.createElement("i", { className: "icon uifw-item-svg-icon" }, this.props.iconSpec)) :
+            React.createElement("i", { className: "icon icon-list" });
+        return (React.createElement(DragInteraction_1.ToolbarDragInteractionContext.Consumer, null, (isEnabled) => {
+            return (React.createElement(appui_layout_react_1.ExpandableItem // eslint-disable-line deprecation/deprecation
+            , { ...this.props, hideIndicator: isEnabled, panel: this.getExpandedContent() },
+                React.createElement("div", { ref: this._ref },
+                    React.createElement(appui_layout_react_1.Item // eslint-disable-line deprecation/deprecation
+                    , { icon: icon, onClick: this._handleClick, onSizeKnown: this.props.onSizeKnown, title: this.props.title }))));
+        }));
+    }
+    /** Returns the list with the items */
+    getExpandedContent() {
+        if (!this.state.expanded)
+            return undefined;
+        const expandSingleSection = () => {
+            const populatedContainers = this.props.items.filter((item) => {
+                return (item.type === ListItemType.Container && item.children.length !== 0);
+            });
+            return populatedContainers.length === 1;
+        };
+        const listItemToElement = (item, itemIndex) => {
+            switch (item.type) {
+                case ListItemType.Item:
+                    return (React.createElement(ListPickerItem, { ...this.props, key: itemIndex.toString(), label: item.name, isActive: item.enabled, onClick: () => { this.props.setEnabled(item, !item.enabled); } }));
+                case ListItemType.Separator:
+                    return (React.createElement("div", { key: itemIndex.toString(), className: "ListPicker-separator" }));
+                case ListItemType.Container:
+                    if (item.children.length !== 0) {
+                        return (React.createElement(ExpandableSection, { key: itemIndex.toString(), title: item.name, className: "ListPickerInnerContainer", expanded: expandSingleSection() },
+                            React.createElement(appui_layout_react_1.GroupColumn, null,
+                                " ",
+                                item.children.map(listItemToElement))));
+                    }
+                    else {
+                        return (React.createElement("div", { key: itemIndex.toString() }));
+                    }
+                default:
+                    return (React.createElement("div", { key: itemIndex.toString() }));
+            }
+        };
+        return (React.createElement(ContainedGroup, { className: "ListPickerContainer", columns: React.createElement(appui_layout_react_1.GroupColumn, { className: "ListPicker-column" },
+                " ",
+                this.props.items.map(listItemToElement)), containFn: appui_layout_react_1.containHorizontally, onOutsideClick: this._handleOnOutsideClick, title: this.props.title }));
+    }
+}
+exports.ListPickerBase = ListPickerBase;
 /**
  * List picker toolbar popup item.
  * Used to provide an expandable list of items to enable/disable items.
@@ -188,7 +321,8 @@ class ListPicker extends React.Component {
     }
     /** Renders ListPicker */
     render() {
-        return (React.createElement(ListPickerPopupItem, { ...this.props, title: this.props.title, setEnabled: this._setEnabled, onExpanded: this.props.onExpanded, items: this.createItems(this.props.items), iconSpec: this.props.iconSpec }));
+        return (React.createElement(useFrameworkVersion_1.FrameworkVersionSwitch, { v1: React.createElement(ListPickerBase // eslint-disable-line deprecation/deprecation
+            , { ...this.props, title: this.props.title, setEnabled: this._setEnabled, onExpanded: this.props.onExpanded, items: this.createItems(this.props.items), iconSpec: this.props.iconSpec }), v2: React.createElement(ListPickerPopupItem, { ...this.props, title: this.props.title, setEnabled: this._setEnabled, onExpanded: this.props.onExpanded, items: this.createItems(this.props.items), iconSpec: this.props.iconSpec }) }));
     }
 }
 exports.ListPicker = ListPicker;