@itwin/appui-react 4.0.0-dev.11 → 4.0.0-dev.13

package/lib/cjs/appui-react/content/FloatingViewportContent.d.ts

@@ -1,40 +1,32 @@
-/** @packageDocumentation
- * @module ContentView
- */
-import * as React from "react";
-import { ScreenViewport } from "@itwin/core-frontend";
-import { ViewStateProp } from "@itwin/imodel-components-react";
-/**
- * @beta
- */
-export interface FloatingViewportContentProps {
-    /** callback used to construct context menu when user right-clicks on canvas/viewport */
-    onContextMenu?: (e: React.MouseEvent) => boolean;
-    /** viewport/content control uniqueId */
-    contentId: string;
-    /** The initial view state used to create the viewport, or a function that returns it (will refresh when the function changes) */
-    initialViewState: ViewStateProp;
-    /** Function to get a reference to the ScreenViewport */
-    viewportRef?: React.Ref<ScreenViewport>;
-}
-/** @beta */
-export declare function FloatingViewportContent(props: FloatingViewportContentProps): JSX.Element;
-/** @alpha */
-export interface FloatingViewportContentWrapperProps {
-    readonly children?: React.ReactNode;
-}
-/** @alpha */
-export declare function FloatingViewportContentWrapper({ children }: FloatingViewportContentWrapperProps): JSX.Element;
-/** @alpha */
-export interface UseFloatingViewportArgs {
-    /** viewport/content control uniqueId */
-    contentId: string;
-    /** The initial view state used to create the viewport, or a function that returns it (will refresh when the function changes) */
-    initialViewState: ViewStateProp;
-}
-/** @alpha */
-export declare function useFloatingViewport(args: UseFloatingViewportArgs): {
-    viewportRef: (v: ScreenViewport) => void;
-    viewState: import("@itwin/core-frontend").ViewState;
-};
+/** @packageDocumentation
+ * @module ContentView
+ */
+import * as React from "react";
+import { ScreenViewport } from "@itwin/core-frontend";
+import { ViewStateProp } from "@itwin/imodel-components-react";
+/**
+ * @beta
+ */
+export interface FloatingViewportContentProps {
+    /** callback used to construct context menu when user right-clicks on canvas/viewport */
+    onContextMenu?: (e: React.MouseEvent) => boolean;
+    /** viewport/content control uniqueId */
+    contentId: string;
+    /** The initial view state used to create the viewport, or a function that returns it (will refresh when the function changes) */
+    initialViewState: ViewStateProp;
+    /** Function to get a reference to the ScreenViewport */
+    viewportRef?: React.Ref<ScreenViewport>;
+}
+/** @beta */
+export declare function FloatingViewportContent(props: FloatingViewportContentProps): JSX.Element;
+/** @alpha */
+export interface FloatingViewportContentWrapperProps {
+    readonly children?: React.ReactNode;
+}
+/** @alpha */
+export declare function FloatingViewportContentWrapper({ children }: FloatingViewportContentWrapperProps): JSX.Element;
+/** @alpha */
+export declare function useFloatingViewport(args: FloatingViewportContentProps): {
+    viewportControl: JSX.Element;
+};
 //# sourceMappingURL=FloatingViewportContent.d.ts.map

package/lib/cjs/appui-react/content/FloatingViewportContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingViewportContent.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/content/FloatingViewportContent.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAa,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAqB,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAMlF;;GAEG;AACH,MAAM,WAAW,4BAA4B;IAC3C,wFAAwF;IACxF,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,OAAO,CAAC;IACjD,wCAAwC;IACxC,SAAS,EAAE,MAAM,CAAC;IAClB,iIAAiI;IACjI,gBAAgB,EAAE,aAAa,CAAC;IAChC,wDAAwD;IACxD,WAAW,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CACzC;AAED,YAAY;AACZ,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,4BAA4B,eAmB1E;AAED,aAAa;AACb,MAAM,WAAW,mCAAmC;IAClD,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACrC;AAED,aAAa;AACb,wBAAgB,8BAA8B,CAAC,EAAE,QAAQ,EAAE,EAAE,mCAAmC,eAM/F;AAED,aAAa;AACb,MAAM,WAAW,uBAAuB;IACtC,wCAAwC;IACxC,SAAS,EAAE,MAAM,CAAC;IAClB,iIAAiI;IACjI,gBAAgB,EAAE,aAAa,CAAC;CACjC;AAED,aAAa;AACb,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,uBAAuB;qBAMrB,cAAc;;EAsCzD"}
+{"version":3,"file":"FloatingViewportContent.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/content/FloatingViewportContent.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAa,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAqB,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAMlF;;GAEG;AACH,MAAM,WAAW,4BAA4B;IAC3C,wFAAwF;IACxF,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,OAAO,CAAC;IACjD,wCAAwC;IACxC,SAAS,EAAE,MAAM,CAAC;IAClB,iIAAiI;IACjI,gBAAgB,EAAE,aAAa,CAAC;IAChC,wDAAwD;IACxD,WAAW,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CACzC;AAED,YAAY;AACZ,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,4BAA4B,eAO1E;AAED,aAAa;AACb,MAAM,WAAW,mCAAmC;IAClD,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACrC;AAED,aAAa;AACb,wBAAgB,8BAA8B,CAAC,EAAE,QAAQ,EAAE,EAAE,mCAAmC,eAM/F;AAED,aAAa;AACb,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,4BAA4B;;EA2DrE"}

package/lib/cjs/appui-react/content/FloatingViewportContent.js

@@ -1,79 +1,79 @@
-"use strict";
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module ContentView
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFloatingViewport = exports.FloatingViewportContentWrapper = exports.FloatingViewportContent = void 0;
-const React = require("react");
-const core_frontend_1 = require("@itwin/core-frontend");
-const imodel_components_react_1 = require("@itwin/imodel-components-react");
-const ViewportContentControl_1 = require("./ViewportContentControl");
-const ContentLayout_1 = require("./ContentLayout");
-const core_react_1 = require("@itwin/core-react");
-const UiFramework_1 = require("../UiFramework");
-/** @beta */
-function FloatingViewportContent(props) {
-    const { contentId, initialViewState, viewportRef, onContextMenu } = props;
-    const { viewState, viewportRef: floatingViewportRef } = useFloatingViewport({
-        contentId,
-        initialViewState,
-    });
-    const refs = (0, core_react_1.useRefs)(viewportRef, floatingViewportRef);
-    return (React.createElement(FloatingViewportContentWrapper, null,
-        React.createElement(imodel_components_react_1.ViewportComponent, { key: contentId, imodel: viewState.iModel, viewState: viewState, controlId: contentId, onContextMenu: onContextMenu, viewportRef: refs })));
-}
-exports.FloatingViewportContent = FloatingViewportContent;
-/** @alpha */
-function FloatingViewportContentWrapper({ children }) {
-    return (React.createElement("div", { onMouseMove: UiFramework_1.UiFramework.visibility.handleContentMouseMove, className: "uifw-dialog-imodel-content", style: { height: "100%", position: "relative" } },
-        React.createElement(ContentLayout_1.ContentWrapper, { content: children, style: { height: "100%", position: "relative" } })));
-}
-exports.FloatingViewportContentWrapper = FloatingViewportContentWrapper;
-/** @alpha */
-function useFloatingViewport(args) {
-    const { contentId, initialViewState } = args;
-    const [viewport, setViewport] = React.useState();
-    const contentControl = React.useRef();
-    const viewState = React.useMemo(() => typeof initialViewState === "function" ? initialViewState() : initialViewState, [initialViewState]);
-    const viewportRef = React.useCallback((v) => {
-        setViewport(v);
-    }, []);
-    React.useEffect(() => {
-        if (!contentControl.current) {
-            contentControl.current = new ViewportContentControl_1.FloatingViewportContentControl(contentId, contentId, null);
-            UiFramework_1.UiFramework.content.addFloatingContentControl(contentControl.current);
-        }
-        return () => {
-            if (contentControl.current) {
-                UiFramework_1.UiFramework.content.dropFloatingContentControl(contentControl.current);
-                contentControl.current = undefined;
-            }
-        };
-    }, [contentId]);
-    React.useEffect(() => {
-        if (viewport && contentControl.current) {
-            contentControl.current.viewport = viewport;
-            void contentControl.current.viewport.changeView(viewState);
-        }
-    }, [viewState, viewport]);
-    React.useEffect(() => {
-        const onViewClose = (vp) => {
-            var _a;
-            if (((_a = contentControl.current) === null || _a === void 0 ? void 0 : _a.viewport) === vp) {
-                UiFramework_1.UiFramework.content.dropFloatingContentControl(contentControl.current);
-                contentControl.current = undefined;
-            }
-        };
-        return core_frontend_1.IModelApp.viewManager.onViewClose.addListener(onViewClose);
-    }, []);
-    return {
-        viewportRef,
-        viewState,
-    };
-}
-exports.useFloatingViewport = useFloatingViewport;
+"use strict";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module ContentView
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFloatingViewport = exports.FloatingViewportContentWrapper = exports.FloatingViewportContent = void 0;
+const React = require("react");
+const core_frontend_1 = require("@itwin/core-frontend");
+const imodel_components_react_1 = require("@itwin/imodel-components-react");
+const ViewportContentControl_1 = require("./ViewportContentControl");
+const ContentLayout_1 = require("./ContentLayout");
+const UiFramework_1 = require("../UiFramework");
+const core_react_1 = require("@itwin/core-react");
+/** @beta */
+function FloatingViewportContent(props) {
+    const { viewportControl } = useFloatingViewport(props);
+    return (React.createElement(FloatingViewportContentWrapper, null, viewportControl));
+}
+exports.FloatingViewportContent = FloatingViewportContent;
+/** @alpha */
+function FloatingViewportContentWrapper({ children }) {
+    return (React.createElement("div", { onMouseMove: UiFramework_1.UiFramework.visibility.handleContentMouseMove, className: "uifw-dialog-imodel-content", style: { height: "100%", position: "relative" } },
+        React.createElement(ContentLayout_1.ContentWrapper, { content: children, style: { height: "100%", position: "relative" } })));
+}
+exports.FloatingViewportContentWrapper = FloatingViewportContentWrapper;
+/** @alpha */
+function useFloatingViewport(args) {
+    const { contentId, initialViewState, onContextMenu, viewportRef } = args;
+    const [viewport, setViewport] = React.useState();
+    const contentControl = React.useRef();
+    const viewState = React.useMemo(() => typeof initialViewState === "function" ? initialViewState() : initialViewState, [initialViewState]);
+    const ref = React.useCallback((v) => {
+        setViewport(v);
+    }, []);
+    const refs = (0, core_react_1.useRefs)(ref, viewportRef);
+    const viewportControl = React.useMemo(() => {
+        const node = React.createElement(imodel_components_react_1.ViewportComponent, { key: contentId, imodel: viewState.iModel, viewState: viewState, controlId: contentId, onContextMenu: onContextMenu, viewportRef: refs });
+        return node;
+    }, [refs, onContextMenu, viewState, contentId]);
+    React.useEffect(() => {
+        if (!contentControl.current) {
+            contentControl.current = new ViewportContentControl_1.FloatingViewportContentControl(contentId, contentId, null);
+            UiFramework_1.UiFramework.content.addFloatingContentControl(contentControl.current);
+        }
+        return () => {
+            if (contentControl.current) {
+                UiFramework_1.UiFramework.content.dropFloatingContentControl(contentControl.current);
+                contentControl.current = undefined;
+            }
+        };
+    }, [contentId]);
+    React.useEffect(() => {
+        if (viewport && contentControl.current) {
+            contentControl.current.viewport = viewport;
+            if (null === contentControl.current.reactNode) {
+                contentControl.current.reactNode = viewportControl;
+            }
+            void contentControl.current.viewport.changeView(viewState);
+        }
+    }, [viewState, viewport, viewportControl]);
+    React.useEffect(() => {
+        const onViewClose = (vp) => {
+            if (contentControl.current?.viewport === vp) {
+                UiFramework_1.UiFramework.content.dropFloatingContentControl(contentControl.current);
+                contentControl.current = undefined;
+            }
+        };
+        return core_frontend_1.IModelApp.viewManager.onViewClose.addListener(onViewClose);
+    }, []);
+    return {
+        viewportControl,
+    };
+}
+exports.useFloatingViewport = useFloatingViewport;
 //# sourceMappingURL=FloatingViewportContent.js.map

package/lib/cjs/appui-react/content/FloatingViewportContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingViewportContent.js","sourceRoot":"","sources":["../../../../src/appui-react/content/FloatingViewportContent.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 ContentView\r\n */\r\n\r\nimport * as React from \"react\";\r\nimport { IModelApp, ScreenViewport } from \"@itwin/core-frontend\";\r\nimport { ViewportComponent, ViewStateProp } from \"@itwin/imodel-components-react\";\r\nimport { FloatingViewportContentControl } from \"./ViewportContentControl\";\r\nimport { ContentWrapper } from \"./ContentLayout\";\r\nimport { useRefs } from \"@itwin/core-react\";\r\nimport { UiFramework } from \"../UiFramework\";\r\n\r\n/**\r\n * @beta\r\n */\r\nexport interface FloatingViewportContentProps {\r\n  /** callback used to construct context menu when user right-clicks on canvas/viewport */\r\n  onContextMenu?: (e: React.MouseEvent) => boolean;\r\n  /** viewport/content control uniqueId */\r\n  contentId: string;\r\n  /** The initial view state used to create the viewport, or a function that returns it (will refresh when the function changes) */\r\n  initialViewState: ViewStateProp;\r\n  /** Function to get a reference to the ScreenViewport */\r\n  viewportRef?: React.Ref<ScreenViewport>;\r\n}\r\n\r\n/** @beta */\r\nexport function FloatingViewportContent(props: FloatingViewportContentProps) {\r\n  const { contentId, initialViewState, viewportRef, onContextMenu } = props;\r\n  const { viewState, viewportRef: floatingViewportRef } = useFloatingViewport({\r\n    contentId,\r\n    initialViewState,\r\n  });\r\n  const refs = useRefs(viewportRef, floatingViewportRef);\r\n  return (\r\n    <FloatingViewportContentWrapper>\r\n      <ViewportComponent\r\n        key={contentId}\r\n        imodel={viewState.iModel}\r\n        viewState={viewState}\r\n        controlId={contentId}\r\n        onContextMenu={onContextMenu}\r\n        viewportRef={refs}\r\n      />\r\n    </FloatingViewportContentWrapper>\r\n  );\r\n}\r\n\r\n/** @alpha */\r\nexport interface FloatingViewportContentWrapperProps {\r\n  readonly children?: React.ReactNode;\r\n}\r\n\r\n/** @alpha */\r\nexport function FloatingViewportContentWrapper({ children }: FloatingViewportContentWrapperProps) {\r\n  return (\r\n    <div onMouseMove={UiFramework.visibility.handleContentMouseMove} className=\"uifw-dialog-imodel-content\" style={{ height: \"100%\", position: \"relative\" }}>\r\n      <ContentWrapper content={children} style={{ height: \"100%\", position: \"relative\" }} />\r\n    </div>\r\n  );\r\n}\r\n\r\n/** @alpha */\r\nexport interface UseFloatingViewportArgs {\r\n  /** viewport/content control uniqueId */\r\n  contentId: string;\r\n  /** The initial view state used to create the viewport, or a function that returns it (will refresh when the function changes) */\r\n  initialViewState: ViewStateProp;\r\n}\r\n\r\n/** @alpha */\r\nexport function useFloatingViewport(args: UseFloatingViewportArgs) {\r\n  const { contentId, initialViewState } = args;\r\n  const [viewport, setViewport] = React.useState<ScreenViewport | undefined>();\r\n  const contentControl = React.useRef<FloatingViewportContentControl | undefined>();\r\n\r\n  const viewState = React.useMemo(() => typeof initialViewState === \"function\" ? initialViewState() : initialViewState, [initialViewState]);\r\n  const viewportRef = React.useCallback((v: ScreenViewport) => {\r\n    setViewport(v);\r\n  }, []);\r\n\r\n  React.useEffect(() => {\r\n    if (!contentControl.current) {\r\n      contentControl.current = new FloatingViewportContentControl(contentId, contentId, null);\r\n      UiFramework.content.addFloatingContentControl(contentControl.current);\r\n    }\r\n    return () => {\r\n      if (contentControl.current) {\r\n        UiFramework.content.dropFloatingContentControl(contentControl.current);\r\n        contentControl.current = undefined;\r\n      }\r\n    };\r\n  }, [contentId]);\r\n\r\n  React.useEffect(() => {\r\n    if (viewport && contentControl.current) {\r\n      contentControl.current.viewport = viewport;\r\n      void contentControl.current.viewport.changeView(viewState);\r\n    }\r\n  }, [viewState, viewport]);\r\n\r\n  React.useEffect(() => {\r\n    const onViewClose = (vp: ScreenViewport) => {\r\n      if (contentControl.current?.viewport === vp) {\r\n        UiFramework.content.dropFloatingContentControl(contentControl.current);\r\n        contentControl.current = undefined;\r\n      }\r\n    };\r\n    return IModelApp.viewManager.onViewClose.addListener(onViewClose);\r\n  }, []);\r\n\r\n  return {\r\n    viewportRef,\r\n    viewState,\r\n  };\r\n}\r\n"]}
+{"version":3,"file":"FloatingViewportContent.js","sourceRoot":"","sources":["../../../../src/appui-react/content/FloatingViewportContent.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 ContentView\n */\n\nimport * as React from \"react\";\nimport { IModelApp, ScreenViewport } from \"@itwin/core-frontend\";\nimport { ViewportComponent, ViewStateProp } from \"@itwin/imodel-components-react\";\nimport { FloatingViewportContentControl } from \"./ViewportContentControl\";\nimport { ContentWrapper } from \"./ContentLayout\";\nimport { UiFramework } from \"../UiFramework\";\nimport { useRefs } from \"@itwin/core-react\";\n\n/**\n * @beta\n */\nexport interface FloatingViewportContentProps {\n  /** callback used to construct context menu when user right-clicks on canvas/viewport */\n  onContextMenu?: (e: React.MouseEvent) => boolean;\n  /** viewport/content control uniqueId */\n  contentId: string;\n  /** The initial view state used to create the viewport, or a function that returns it (will refresh when the function changes) */\n  initialViewState: ViewStateProp;\n  /** Function to get a reference to the ScreenViewport */\n  viewportRef?: React.Ref<ScreenViewport>;\n}\n\n/** @beta */\nexport function FloatingViewportContent(props: FloatingViewportContentProps) {\n  const { viewportControl } = useFloatingViewport(props);\n  return (\n    <FloatingViewportContentWrapper>\n      {viewportControl}\n    </FloatingViewportContentWrapper>\n  );\n}\n\n/** @alpha */\nexport interface FloatingViewportContentWrapperProps {\n  readonly children?: React.ReactNode;\n}\n\n/** @alpha */\nexport function FloatingViewportContentWrapper({ children }: FloatingViewportContentWrapperProps) {\n  return (\n    <div onMouseMove={UiFramework.visibility.handleContentMouseMove} className=\"uifw-dialog-imodel-content\" style={{ height: \"100%\", position: \"relative\" }}>\n      <ContentWrapper content={children} style={{ height: \"100%\", position: \"relative\" }} />\n    </div>\n  );\n}\n\n/** @alpha */\nexport function useFloatingViewport(args: FloatingViewportContentProps) {\n  const { contentId, initialViewState, onContextMenu, viewportRef } = args;\n  const [viewport, setViewport] = React.useState<ScreenViewport | undefined>();\n  const contentControl = React.useRef<FloatingViewportContentControl | undefined>();\n\n  const viewState = React.useMemo(() => typeof initialViewState === \"function\" ? initialViewState() : initialViewState, [initialViewState]);\n  const ref = React.useCallback((v: ScreenViewport) => {\n    setViewport(v);\n  }, []);\n\n  const refs = useRefs(ref, viewportRef);\n  const viewportControl = React.useMemo(() => {\n    const node = <ViewportComponent\n      key={contentId}\n      imodel={viewState.iModel}\n      viewState={viewState}\n      controlId={contentId}\n      onContextMenu={onContextMenu}\n      viewportRef={refs}\n    />;\n    return node;\n  }, [refs, onContextMenu, viewState, contentId]);\n\n  React.useEffect(() => {\n    if (!contentControl.current) {\n      contentControl.current = new FloatingViewportContentControl(contentId, contentId, null);\n      UiFramework.content.addFloatingContentControl(contentControl.current);\n    }\n    return () => {\n      if (contentControl.current) {\n        UiFramework.content.dropFloatingContentControl(contentControl.current);\n        contentControl.current = undefined;\n      }\n    };\n  }, [contentId]);\n\n  React.useEffect(() => {\n    if (viewport && contentControl.current) {\n      contentControl.current.viewport = viewport;\n      if (null === contentControl.current.reactNode) {\n        contentControl.current.reactNode = viewportControl;\n      }\n      void contentControl.current.viewport.changeView(viewState);\n    }\n  }, [viewState, viewport, viewportControl]);\n\n  React.useEffect(() => {\n    const onViewClose = (vp: ScreenViewport) => {\n      if (contentControl.current?.viewport === vp) {\n        UiFramework.content.dropFloatingContentControl(contentControl.current);\n        contentControl.current = undefined;\n      }\n    };\n    return IModelApp.viewManager.onViewClose.addListener(onViewClose);\n  }, []);\n\n  return {\n    viewportControl,\n  };\n}\n"]}

package/lib/cjs/appui-react/content/IModelViewport.d.ts

@@ -1,81 +1,81 @@
-/** @packageDocumentation
- * @module ContentView
- */
-import * as React from "react";
-import { Id64String } from "@itwin/core-bentley";
-import { IModelConnection, ScreenViewport, ViewState } from "@itwin/core-frontend";
-import { ViewportComponent, ViewStateProp } from "@itwin/imodel-components-react";
-import { ConfigurableCreateInfo } from "../configurableui/ConfigurableUiControl";
-import { ViewportContentControl } from "./ViewportContentControl";
-/** Viewport that is connected to the IModelConnection property in the Redux store. The application must set up the Redux store and include the FrameworkReducer.
- * @public
- */
-export declare const IModelConnectedViewport: import("react-redux").ConnectedComponent<typeof ViewportComponent, any>;
-/** [[IModelViewportControl]] options. These options are set in the applicationData property of the [[ContentProps]].
- * @public
- */
-export interface IModelViewportControlOptions {
-    /** ViewState or a function to return a ViewState */
-    viewState?: ViewStateProp;
-    /** IModelConnection of data in Viewport */
-    iModelConnection?: IModelConnection | (() => IModelConnection);
-    /** Map of options that can be used to enable/disable features within the view */
-    featureOptions?: {
-        [key: string]: any;
-    };
-    /** Optional background color which may be used if viewState and iModelConnection are undefined */
-    bgColor?: string;
-    /** Optional property to always use the supplied `viewState` property instead of using viewport.view when set */
-    alwaysUseSuppliedViewState?: boolean;
-    /** Optional property to supply custom view overlay. Uses when caller want to supply custom overlay component. */
-    supplyViewOverlay?: (_viewport: ScreenViewport) => React.ReactNode;
-    /** Optional property to defer reactNode initialization until first reactNode property is needed. Useful when subclassing the `IModelViewportControl`. */
-    deferNodeInitialization?: boolean;
-}
-interface ViewOverlayHostProps {
-    viewport: ScreenViewport;
-    featureOptions?: {
-        [key: string]: any;
-    };
-    userSuppliedOverlay?: (_viewport: ScreenViewport) => React.ReactNode;
-}
-/** View Overlay component -- exported for testing
- * @internal
- */
-export declare function ViewOverlayHost({ viewport, featureOptions, userSuppliedOverlay }: ViewOverlayHostProps): JSX.Element | null;
-/** iModel Viewport Control
- * @public
- */
-export declare class IModelViewportControl extends ViewportContentControl {
-    protected _options: IModelViewportControlOptions;
-    static get id(): string;
-    protected _featureOptions: {
-        [key: string]: boolean | string;
-    };
-    protected _viewState: ViewStateProp | undefined;
-    protected _iModelConnection: IModelConnection | undefined;
-    protected _alwaysUseSuppliedViewState: boolean;
-    private _userSuppliedViewOverlay?;
-    constructor(info: ConfigurableCreateInfo, _options: IModelViewportControlOptions);
-    protected initializeReactNode(): void;
-    protected getReactNode(): React.ReactNode;
-    /**
-     * This is passed as a function to the ViewportComponent as the `viewState` prop in getImodelViewportReactElement().
-     * It is called by ViewportComponent on a mount to resolve the viewState.
-     */
-    private _determineViewState;
-    /** Get the React component that will contain the Viewport */
-    protected getImodelConnectedViewportReactElement(): React.ReactNode;
-    /** Get the React component that will contain the Viewport */
-    protected getImodelViewportReactElement(iModelConnection: IModelConnection, viewState: ViewStateProp): React.ReactNode;
-    /** Get the React component that will be shown when no iModel data is available */
-    protected getNoContentReactElement(_options: IModelViewportControlOptions): React.ReactNode;
-    /** Get the React.Element for a ViewSelector change. */
-    getReactElementForViewSelectorChange(iModelConnection: IModelConnection, _unusedViewDefinitionId: Id64String, viewState: ViewState, _name: string): React.ReactNode;
-    /** Get the default ViewOverlay unless parameter is set to not use it. May be override in an application specific sub-class  */
-    protected _getViewOverlay: (vp: ScreenViewport) => React.ReactNode;
-    /** Get the NavigationAidControl associated with this ContentControl */
-    get navigationAidControl(): string;
-}
-export {};
+/** @packageDocumentation
+ * @module ContentView
+ */
+import * as React from "react";
+import { Id64String } from "@itwin/core-bentley";
+import { IModelConnection, ScreenViewport, ViewState } from "@itwin/core-frontend";
+import { ViewportComponent, ViewStateProp } from "@itwin/imodel-components-react";
+import { ConfigurableCreateInfo } from "../configurableui/ConfigurableUiControl";
+import { ViewportContentControl } from "./ViewportContentControl";
+/** Viewport that is connected to the IModelConnection property in the Redux store. The application must set up the Redux store and include the FrameworkReducer.
+ * @public
+ */
+export declare const IModelConnectedViewport: import("react-redux").ConnectedComponent<typeof ViewportComponent, any>;
+/** [[IModelViewportControl]] options. These options are set in the applicationData property of the [[ContentProps]].
+ * @public
+ */
+export interface IModelViewportControlOptions {
+    /** ViewState or a function to return a ViewState */
+    viewState?: ViewStateProp;
+    /** IModelConnection of data in Viewport */
+    iModelConnection?: IModelConnection | (() => IModelConnection);
+    /** Map of options that can be used to enable/disable features within the view */
+    featureOptions?: {
+        [key: string]: any;
+    };
+    /** Optional background color which may be used if viewState and iModelConnection are undefined */
+    bgColor?: string;
+    /** Optional property to always use the supplied `viewState` property instead of using viewport.view when set */
+    alwaysUseSuppliedViewState?: boolean;
+    /** Optional property to supply custom view overlay. Uses when caller want to supply custom overlay component. */
+    supplyViewOverlay?: (_viewport: ScreenViewport) => React.ReactNode;
+    /** Optional property to defer reactNode initialization until first reactNode property is needed. Useful when subclassing the `IModelViewportControl`. */
+    deferNodeInitialization?: boolean;
+}
+interface ViewOverlayHostProps {
+    viewport: ScreenViewport;
+    featureOptions?: {
+        [key: string]: any;
+    };
+    userSuppliedOverlay?: (_viewport: ScreenViewport) => React.ReactNode;
+}
+/** View Overlay component -- exported for testing
+ * @internal
+ */
+export declare function ViewOverlayHost({ viewport, featureOptions, userSuppliedOverlay }: ViewOverlayHostProps): JSX.Element | null;
+/** iModel Viewport Control
+ * @public
+ */
+export declare class IModelViewportControl extends ViewportContentControl {
+    protected _options: IModelViewportControlOptions;
+    static get id(): string;
+    protected _featureOptions: {
+        [key: string]: boolean | string;
+    };
+    protected _viewState: ViewStateProp | undefined;
+    protected _iModelConnection: IModelConnection | undefined;
+    protected _alwaysUseSuppliedViewState: boolean;
+    private _userSuppliedViewOverlay?;
+    constructor(info: ConfigurableCreateInfo, _options: IModelViewportControlOptions);
+    protected initializeReactNode(): void;
+    protected getReactNode(): React.ReactNode;
+    /**
+     * This is passed as a function to the ViewportComponent as the `viewState` prop in getImodelViewportReactElement().
+     * It is called by ViewportComponent on a mount to resolve the viewState.
+     */
+    private _determineViewState;
+    /** Get the React component that will contain the Viewport */
+    protected getImodelConnectedViewportReactElement(): React.ReactNode;
+    /** Get the React component that will contain the Viewport */
+    protected getImodelViewportReactElement(iModelConnection: IModelConnection, viewState: ViewStateProp): React.ReactNode;
+    /** Get the React component that will be shown when no iModel data is available */
+    protected getNoContentReactElement(_options: IModelViewportControlOptions): React.ReactNode;
+    /** Get the React.Element for a ViewSelector change. */
+    getReactElementForViewSelectorChange(iModelConnection: IModelConnection, _unusedViewDefinitionId: Id64String, viewState: ViewState, _name: string): React.ReactNode;
+    /** Get the default ViewOverlay unless parameter is set to not use it. May be override in an application specific sub-class  */
+    protected _getViewOverlay: (vp: ScreenViewport) => React.ReactNode;
+    /** Get the NavigationAidControl associated with this ContentControl */
+    get navigationAidControl(): string;
+}
+export {};
 //# sourceMappingURL=IModelViewport.d.ts.map