@itwin/appui-react 5.25.0 → 5.26.0
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.
- package/CHANGELOG.md +24 -0
- package/lib/appui-react/layout/target/TitleBarTarget.d.ts +1 -1
- package/lib/appui-react/layout/target/TitleBarTarget.d.ts.map +1 -1
- package/lib/appui-react/layout/target/TitleBarTarget.js +3 -3
- package/lib/appui-react/layout/target/TitleBarTarget.js.map +1 -1
- package/lib/appui-react/layout/target/TitleBarTarget.scss +9 -7
- package/lib/appui-react/layout/widget/ContentContainer.d.ts +2 -0
- package/lib/appui-react/layout/widget/ContentContainer.d.ts.map +1 -1
- package/lib/appui-react/layout/widget/ContentContainer.js +16 -16
- package/lib/appui-react/layout/widget/ContentContainer.js.map +1 -1
- package/lib/appui-react/layout/widget/FloatingWidget.d.ts +56 -4
- package/lib/appui-react/layout/widget/FloatingWidget.d.ts.map +1 -1
- package/lib/appui-react/layout/widget/FloatingWidget.js +97 -51
- package/lib/appui-react/layout/widget/FloatingWidget.js.map +1 -1
- package/lib/appui-react/layout/widget/PanelWidget.d.ts +2 -2
- package/lib/appui-react/layout/widget/PanelWidget.d.ts.map +1 -1
- package/lib/appui-react/layout/widget/PanelWidget.js +6 -4
- package/lib/appui-react/layout/widget/PanelWidget.js.map +1 -1
- package/lib/appui-react/layout/widget/TabBar.d.ts +2 -0
- package/lib/appui-react/layout/widget/TabBar.d.ts.map +1 -1
- package/lib/appui-react/layout/widget/TabBar.js +13 -12
- package/lib/appui-react/layout/widget/TabBar.js.map +1 -1
- package/lib/appui-react/layout/widget/Widget.d.ts +6 -3
- package/lib/appui-react/layout/widget/Widget.d.ts.map +1 -1
- package/lib/appui-react/layout/widget/Widget.js +29 -31
- package/lib/appui-react/layout/widget/Widget.js.map +1 -1
- package/lib/appui-react/preview/PreviewFeatures.d.ts +11 -3
- package/lib/appui-react/preview/PreviewFeatures.d.ts.map +1 -1
- package/lib/appui-react/preview/PreviewFeatures.js +4 -2
- package/lib/appui-react/preview/PreviewFeatures.js.map +1 -1
- package/lib/appui-react/preview/control-widget-visibility/CloseWidgetButton.d.ts +3 -0
- package/lib/appui-react/preview/control-widget-visibility/CloseWidgetButton.d.ts.map +1 -1
- package/lib/appui-react/preview/control-widget-visibility/CloseWidgetButton.js +11 -2
- package/lib/appui-react/preview/control-widget-visibility/CloseWidgetButton.js.map +1 -1
- package/lib/appui-react/preview/widget-tab-actions/Widget.d.ts +10 -0
- package/lib/appui-react/preview/widget-tab-actions/Widget.d.ts.map +1 -0
- package/lib/appui-react/preview/widget-tab-actions/Widget.js +242 -0
- package/lib/appui-react/preview/widget-tab-actions/Widget.js.map +1 -0
- package/lib/appui-react/preview/widget-tab-actions/Widget.scss +198 -0
- package/lib/appui-react/preview/widget-tab-actions/useWidgetTabActions.d.ts +6 -0
- package/lib/appui-react/preview/widget-tab-actions/useWidgetTabActions.d.ts.map +1 -0
- package/lib/appui-react/preview/widget-tab-actions/useWidgetTabActions.js +18 -0
- package/lib/appui-react/preview/widget-tab-actions/useWidgetTabActions.js.map +1 -0
- package/lib/cjs/appui-react/layout/target/TitleBarTarget.scss +9 -7
- package/lib/cjs/appui-react/preview/widget-tab-actions/Widget.scss +198 -0
- package/lib/esm/appui-react/layout/target/TitleBarTarget.scss +9 -7
- package/lib/esm/appui-react/preview/widget-tab-actions/Widget.scss +198 -0
- package/package.json +8 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PanelWidget.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/PanelWidget.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"PanelWidget.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/PanelWidget.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAkB3D,UAAU,gBAAgB;IACxB,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;CAC7B;AAED,gBAAgB;AAChB,eAAO,MAAM,WAAW,yFAgDvB,CAAC;AAcF,gBAAgB;AAChB,wBAAgB,OAAO,CAAC,QAAQ,EAAE,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,WAAW,CAwBtE;AAED,gBAAgB;AAChB,wBAAgB,UAAU,CAAC,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC;;;;;EAqErD"}
|
|
@@ -18,6 +18,8 @@ import { WidgetTarget } from "../target/WidgetTarget.js";
|
|
|
18
18
|
import { isHorizontalPanelState } from "../state/PanelState.js";
|
|
19
19
|
import { useLayout } from "../base/LayoutStore.js";
|
|
20
20
|
import { getWidgetState } from "../state/internal/WidgetStateHelpers.js";
|
|
21
|
+
import { PanelWidget as TabActionsPanelWidget } from "../../preview/widget-tab-actions/Widget.js";
|
|
22
|
+
import { useWidgetTabActions } from "../../preview/widget-tab-actions/useWidgetTabActions.js";
|
|
21
23
|
/** @internal */
|
|
22
24
|
export const PanelWidget = React.forwardRef(function PanelWidget({ widgetId }, ref) {
|
|
23
25
|
const side = React.useContext(PanelSideContext);
|
|
@@ -38,10 +40,10 @@ export const PanelWidget = React.forwardRef(function PanelWidget({ widgetId }, r
|
|
|
38
40
|
const content = React.useMemo(() => (React.createElement(WidgetContentContainer, null,
|
|
39
41
|
showTarget && React.createElement(WidgetTarget, null),
|
|
40
42
|
React.createElement(WidgetOutline, null))), [showTarget]);
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
43
|
+
const widgetTabActions = useWidgetTabActions();
|
|
44
|
+
return (React.createElement(WidgetProvider, { id: widgetId }, widgetTabActions ? (React.createElement(TabActionsPanelWidget, null)) : (React.createElement(Widget, { className: className, ref: ref },
|
|
45
|
+
React.createElement(WidgetTabBar, { separator: isHorizontalPanelSide(side) ? true : !minimized }),
|
|
46
|
+
content))));
|
|
45
47
|
});
|
|
46
48
|
function findFillWidget(state, side) {
|
|
47
49
|
const panelWidgets = state.panels[side].widgets;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PanelWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/PanelWidget.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 Widget\n */\n\nimport \"./PanelWidget.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport type { WidgetState } from \"../state/WidgetState.js\";\nimport type { PanelSide } from \"../widget-panels/PanelTypes.js\";\nimport {\n isHorizontalPanelSide,\n PanelSideContext,\n} from \"../widget-panels/Panel.js\";\nimport { WidgetContentContainer } from \"./ContentContainer.js\";\nimport { WidgetTabBar } from \"./TabBar.js\";\nimport { Widget, WidgetProvider } from \"./Widget.js\";\nimport { WidgetOutline } from \"../outline/WidgetOutline.js\";\nimport { WidgetTarget } from \"../target/WidgetTarget.js\";\nimport { isHorizontalPanelState } from \"../state/PanelState.js\";\nimport { useLayout } from \"../base/LayoutStore.js\";\nimport { getWidgetState } from \"../state/internal/WidgetStateHelpers.js\";\nimport type { NineZoneState } from \"../state/NineZoneState.js\";\n\n/** @internal */\nexport interface PanelWidgetProps {\n widgetId: WidgetState[\"id\"];\n}\n\n/** @internal */\nexport const PanelWidget = React.forwardRef<HTMLDivElement, PanelWidgetProps>(\n function PanelWidget({ widgetId }, ref) {\n const side = React.useContext(PanelSideContext);\n assert(!!side);\n const widgetsLength = useLayout((state) => {\n const panel = state.panels[side];\n return panel.widgets.length;\n });\n const minimized = useLayout((state) => {\n const widget = getWidgetState(state, widgetId);\n return widget.minimized;\n });\n const horizontal = isHorizontalPanelSide(side);\n const mode = useMode(widgetId);\n const borders = useBorders(widgetId);\n const showTarget = widgetsLength !== 1;\n const className = classnames(\n \"nz-widget-panelWidget\",\n horizontal && \"nz-horizontal\",\n `nz-${mode}`,\n borders\n );\n const content = React.useMemo(\n () => (\n <WidgetContentContainer>\n {showTarget && <WidgetTarget />}\n <WidgetOutline />\n </WidgetContentContainer>\n ),\n [showTarget]\n );\n return (\n <WidgetProvider id={widgetId}>\n <Widget className={className} ref={ref}>\n <WidgetTabBar\n separator={isHorizontalPanelSide(side) ? true : !minimized}\n />\n {content}\n </Widget>\n </WidgetProvider>\n );\n }\n);\n\nfunction findFillWidget(state: NineZoneState, side: PanelSide) {\n const panelWidgets = state.panels[side].widgets;\n return panelWidgets.find((widgetId) => {\n const widget = getWidgetState(state, widgetId);\n if (widget.minimized) return false;\n const tabId = widget.activeTabId;\n const tab = state.tabs[tabId];\n if (!tab.preferredPanelWidgetSize) return true;\n return false;\n });\n}\n\n/** @internal */\nexport function useMode(widgetId: string): \"fit\" | \"fill\" | \"minimized\" {\n const side = React.useContext(PanelSideContext);\n assert(!!side);\n return useLayout((state) => {\n const fillWidget = findFillWidget(state, side);\n\n // Force `fill` for last panel widget that is not minimized.\n if (!fillWidget) {\n const panel = state.panels[side];\n for (let i = panel.widgets.length - 1; i >= 0; i--) {\n const wId = panel.widgets[i];\n const w = getWidgetState(state, wId);\n if (w.minimized) continue;\n if (wId === widgetId) return \"fill\";\n break;\n }\n }\n\n const widget = getWidgetState(state, widgetId);\n if (widget.minimized) return \"minimized\";\n const tabId = widget.activeTabId;\n const tab = state.tabs[tabId];\n return tab.preferredPanelWidgetSize ? \"fit\" : \"fill\";\n });\n}\n\n/** @internal */\nexport function useBorders(widgetId: WidgetState[\"id\"]) {\n const side = React.useContext(PanelSideContext);\n assert(!!side);\n return useLayout((state) => {\n const panels = state.panels;\n const panel = panels[side];\n const toolSettings = state.toolSettings;\n const isHorizontal = isHorizontalPanelSide(panel.side);\n const isVertical = !isHorizontal;\n const isFirst = panel.widgets[0] === widgetId;\n const isLast = panel.widgets[panel.widgets.length - 1] === widgetId;\n const isTopMostPanelBorder =\n panel.side === \"top\" ||\n (isVertical && !panels.top.span) ||\n (isVertical && panels.top.span && panels.top.collapsed) ||\n (isVertical && panels.top.widgets.length === 0);\n\n let top = true;\n let bottom = true;\n let left = true;\n let right = true;\n if (panel.side === \"bottom\") {\n bottom = false;\n }\n if (isVertical && isLast) {\n bottom = false;\n }\n if (isTopMostPanelBorder && toolSettings?.type === \"docked\") {\n top = false;\n }\n if (isVertical && !isFirst) {\n top = false;\n }\n if (\n isVertical &&\n panels.top.span &&\n !panels.top.collapsed &&\n panels.top.widgets.length > 0\n ) {\n top = false;\n }\n if (isHorizontal && !isFirst) {\n left = false;\n }\n if (\n isHorizontalPanelState(panel) &&\n !panel.span &&\n isFirst &&\n !panels.left.collapsed &&\n panels.left.widgets.length > 0\n ) {\n left = false;\n }\n if (\n isHorizontalPanelState(panel) &&\n !panel.span &&\n isLast &&\n !panels.right.collapsed &&\n panels.right.widgets.length > 0\n ) {\n right = false;\n }\n return {\n \"nz-border-top\": top,\n \"nz-border-bottom\": bottom,\n \"nz-border-left\": left,\n \"nz-border-right\": right,\n };\n }, true);\n}\n"]}
|
|
1
|
+
{"version":3,"file":"PanelWidget.js","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/PanelWidget.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 Widget\n */\n\nimport \"./PanelWidget.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport type { WidgetState } from \"../state/WidgetState.js\";\nimport type { PanelSide } from \"../widget-panels/PanelTypes.js\";\nimport {\n isHorizontalPanelSide,\n PanelSideContext,\n} from \"../widget-panels/Panel.js\";\nimport { WidgetContentContainer } from \"./ContentContainer.js\";\nimport { WidgetTabBar } from \"./TabBar.js\";\nimport { Widget, WidgetProvider } from \"./Widget.js\";\nimport { WidgetOutline } from \"../outline/WidgetOutline.js\";\nimport { WidgetTarget } from \"../target/WidgetTarget.js\";\nimport { isHorizontalPanelState } from \"../state/PanelState.js\";\nimport { useLayout } from \"../base/LayoutStore.js\";\nimport { getWidgetState } from \"../state/internal/WidgetStateHelpers.js\";\nimport type { NineZoneState } from \"../state/NineZoneState.js\";\nimport { PanelWidget as TabActionsPanelWidget } from \"../../preview/widget-tab-actions/Widget.js\";\nimport { useWidgetTabActions } from \"../../preview/widget-tab-actions/useWidgetTabActions.js\";\n\ninterface PanelWidgetProps {\n widgetId: WidgetState[\"id\"];\n}\n\n/** @internal */\nexport const PanelWidget = React.forwardRef<HTMLDivElement, PanelWidgetProps>(\n function PanelWidget({ widgetId }, ref) {\n const side = React.useContext(PanelSideContext);\n assert(!!side);\n const widgetsLength = useLayout((state) => {\n const panel = state.panels[side];\n return panel.widgets.length;\n });\n const minimized = useLayout((state) => {\n const widget = getWidgetState(state, widgetId);\n return widget.minimized;\n });\n const horizontal = isHorizontalPanelSide(side);\n const mode = useMode(widgetId);\n const borders = useBorders(widgetId);\n const showTarget = widgetsLength !== 1;\n const className = classnames(\n \"nz-widget-panelWidget\",\n horizontal && \"nz-horizontal\",\n `nz-${mode}`,\n borders\n );\n const content = React.useMemo(\n () => (\n <WidgetContentContainer>\n {showTarget && <WidgetTarget />}\n <WidgetOutline />\n </WidgetContentContainer>\n ),\n [showTarget]\n );\n\n const widgetTabActions = useWidgetTabActions();\n return (\n <WidgetProvider id={widgetId}>\n {widgetTabActions ? (\n <TabActionsPanelWidget />\n ) : (\n <Widget className={className} ref={ref}>\n <WidgetTabBar\n separator={isHorizontalPanelSide(side) ? true : !minimized}\n />\n {content}\n </Widget>\n )}\n </WidgetProvider>\n );\n }\n);\n\nfunction findFillWidget(state: NineZoneState, side: PanelSide) {\n const panelWidgets = state.panels[side].widgets;\n return panelWidgets.find((widgetId) => {\n const widget = getWidgetState(state, widgetId);\n if (widget.minimized) return false;\n const tabId = widget.activeTabId;\n const tab = state.tabs[tabId];\n if (!tab.preferredPanelWidgetSize) return true;\n return false;\n });\n}\n\n/** @internal */\nexport function useMode(widgetId: string): \"fit\" | \"fill\" | \"minimized\" {\n const side = React.useContext(PanelSideContext);\n assert(!!side);\n return useLayout((state) => {\n const fillWidget = findFillWidget(state, side);\n\n // Force `fill` for last panel widget that is not minimized.\n if (!fillWidget) {\n const panel = state.panels[side];\n for (let i = panel.widgets.length - 1; i >= 0; i--) {\n const wId = panel.widgets[i];\n const w = getWidgetState(state, wId);\n if (w.minimized) continue;\n if (wId === widgetId) return \"fill\";\n break;\n }\n }\n\n const widget = getWidgetState(state, widgetId);\n if (widget.minimized) return \"minimized\";\n const tabId = widget.activeTabId;\n const tab = state.tabs[tabId];\n return tab.preferredPanelWidgetSize ? \"fit\" : \"fill\";\n });\n}\n\n/** @internal */\nexport function useBorders(widgetId: WidgetState[\"id\"]) {\n const side = React.useContext(PanelSideContext);\n assert(!!side);\n return useLayout((state) => {\n const panels = state.panels;\n const panel = panels[side];\n const toolSettings = state.toolSettings;\n const isHorizontal = isHorizontalPanelSide(panel.side);\n const isVertical = !isHorizontal;\n const isFirst = panel.widgets[0] === widgetId;\n const isLast = panel.widgets[panel.widgets.length - 1] === widgetId;\n const isTopMostPanelBorder =\n panel.side === \"top\" ||\n (isVertical && !panels.top.span) ||\n (isVertical && panels.top.span && panels.top.collapsed) ||\n (isVertical && panels.top.widgets.length === 0);\n\n let top = true;\n let bottom = true;\n let left = true;\n let right = true;\n if (panel.side === \"bottom\") {\n bottom = false;\n }\n if (isVertical && isLast) {\n bottom = false;\n }\n if (isTopMostPanelBorder && toolSettings?.type === \"docked\") {\n top = false;\n }\n if (isVertical && !isFirst) {\n top = false;\n }\n if (\n isVertical &&\n panels.top.span &&\n !panels.top.collapsed &&\n panels.top.widgets.length > 0\n ) {\n top = false;\n }\n if (isHorizontal && !isFirst) {\n left = false;\n }\n if (\n isHorizontalPanelState(panel) &&\n !panel.span &&\n isFirst &&\n !panels.left.collapsed &&\n panels.left.widgets.length > 0\n ) {\n left = false;\n }\n if (\n isHorizontalPanelState(panel) &&\n !panel.span &&\n isLast &&\n !panels.right.collapsed &&\n panels.right.widgets.length > 0\n ) {\n right = false;\n }\n return {\n \"nz-border-top\": top,\n \"nz-border-bottom\": bottom,\n \"nz-border-left\": left,\n \"nz-border-right\": right,\n };\n }, true);\n}\n"]}
|
|
@@ -10,6 +10,8 @@ export interface WidgetTabBarProps {
|
|
|
10
10
|
}
|
|
11
11
|
/** @internal */
|
|
12
12
|
export declare function WidgetTabBar(props: WidgetTabBarProps): React.JSX.Element;
|
|
13
|
+
/** @internal */
|
|
14
|
+
export declare function useDragWidgetHandle(): (instance: HTMLElement | null) => void;
|
|
13
15
|
/** Hook to control drag interactions.
|
|
14
16
|
* Starts drag interaction after pointer moves or after timeout.
|
|
15
17
|
* @internal
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBar.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/TabBar.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,eAAe,CAAC;AAEvB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"TabBar.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/TabBar.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,eAAe,CAAC;AAEvB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AAkBnD,gBAAgB;AAChB,MAAM,WAAW,iBAAiB;IAChC,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,gBAAgB;AAChB,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBAoBpD;AAED,gBAAgB;AAChB,wBAAgB,mBAAmB,2CAmElC;AAED;;;GAGG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,WAAW,EAC3C,WAAW,CAAC,EAAE,CAAC,sBAAsB,EAAE,KAAK,EAAE,eAAe,EAAE,KAAK,KAAK,IAAI,EAC7E,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,KAAK,IAAI,EAClC,SAAS,CAAC,EAAE,MAAM,IAAI,EACtB,YAAY,CAAC,EAAE,MAAM,IAAI,EACzB,aAAa,CAAC,EAAE,MAAM,IAAI,gCAqD3B"}
|
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
import "./TabBar.scss";
|
|
9
9
|
import classnames from "classnames";
|
|
10
10
|
import * as React from "react";
|
|
11
|
-
import { assert } from "@itwin/core-bentley";
|
|
12
11
|
import { Timer } from "@itwin/core-react";
|
|
13
12
|
import { Point } from "@itwin/core-react/internal";
|
|
14
13
|
import { useDragWidget } from "../base/DragManager.js";
|
|
@@ -21,13 +20,22 @@ import { useFloatingWidgetId } from "./FloatingWidget.js";
|
|
|
21
20
|
import { useMaximizedWidgetTabBarHandle } from "../../preview/enable-maximized-widget/useMaximizedWidget.js";
|
|
22
21
|
import { WidgetActions } from "./WidgetActions.js";
|
|
23
22
|
import { ConfigurableUiContext } from "../../configurableui/ConfigurableUiContent.js";
|
|
23
|
+
import { useSafeContext } from "../../hooks/useSafeContext.js";
|
|
24
24
|
/** @internal */
|
|
25
25
|
export function WidgetTabBar(props) {
|
|
26
|
-
const dispatch = React.useContext(NineZoneDispatchContext);
|
|
27
|
-
const id = React.useContext(WidgetIdContext);
|
|
28
26
|
const { widgetActions } = React.useContext(ConfigurableUiContext);
|
|
27
|
+
const ref = useDragWidgetHandle();
|
|
28
|
+
const maximizedWidgetHandle = useMaximizedWidgetTabBarHandle();
|
|
29
|
+
return (React.createElement("div", { className: classnames("nz-widget-tabBar", props.separator && "nz-separator") },
|
|
30
|
+
React.createElement("div", { className: classnames("nz-handle", maximizedWidgetHandle), ref: ref }),
|
|
31
|
+
React.createElement(WidgetTabs, null),
|
|
32
|
+
widgetActions ?? React.createElement(WidgetActions, null)));
|
|
33
|
+
}
|
|
34
|
+
/** @internal */
|
|
35
|
+
export function useDragWidgetHandle() {
|
|
36
|
+
const id = useSafeContext(WidgetIdContext);
|
|
37
|
+
const dispatch = React.useContext(NineZoneDispatchContext);
|
|
29
38
|
const floatingWidgetId = useFloatingWidgetId();
|
|
30
|
-
assert(!!id);
|
|
31
39
|
const widgetId = floatingWidgetId === undefined ? id : floatingWidgetId;
|
|
32
40
|
const handleDoubleClick = React.useCallback(() => {
|
|
33
41
|
floatingWidgetId &&
|
|
@@ -59,7 +67,6 @@ export function WidgetTabBar(props) {
|
|
|
59
67
|
onDrag,
|
|
60
68
|
onDragEnd,
|
|
61
69
|
});
|
|
62
|
-
const containerRef = React.useRef(null);
|
|
63
70
|
const handleDragStart = React.useCallback((initialPointerPosition, pointerPosition) => {
|
|
64
71
|
handleWidgetDragStart({
|
|
65
72
|
initialPointerPosition,
|
|
@@ -74,13 +81,7 @@ export function WidgetTabBar(props) {
|
|
|
74
81
|
});
|
|
75
82
|
}, [dispatch, floatingWidgetId]);
|
|
76
83
|
const ref = useDrag(handleDragStart, undefined, undefined, handleTouchStart, handleDoubleClick);
|
|
77
|
-
|
|
78
|
-
const className = classnames("nz-widget-tabBar", props.separator && "nz-separator");
|
|
79
|
-
const handleClassName = classnames("nz-handle", maximizedWidgetHandle);
|
|
80
|
-
return (React.createElement("div", { ref: containerRef, className: className },
|
|
81
|
-
React.createElement("div", { className: handleClassName, ref: ref }),
|
|
82
|
-
React.createElement(WidgetTabs, null),
|
|
83
|
-
widgetActions ?? React.createElement(WidgetActions, null)));
|
|
84
|
+
return ref;
|
|
84
85
|
}
|
|
85
86
|
/** Hook to control drag interactions.
|
|
86
87
|
* Starts drag interaction after pointer moves or after timeout.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBar.js","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/TabBar.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 Widget\n */\n\nimport \"./TabBar.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport { Timer } from \"@itwin/core-react\";\nimport { Point } from \"@itwin/core-react/internal\";\nimport type { UseDragWidgetArgs } from \"../base/DragManager.js\";\nimport { useDragWidget } from \"../base/DragManager.js\";\nimport { NineZoneDispatchContext } from \"../base/NineZone.js\";\nimport type {\n PointerCaptorArgs,\n PointerCaptorEvent,\n} from \"../base/usePointerCaptor.js\";\nimport { usePointerCaptor } from \"../base/usePointerCaptor.js\";\nimport { WidgetTabs } from \"./Tabs.js\";\nimport { WidgetIdContext } from \"./Widget.js\";\nimport { useDoubleClick } from \"../widget-panels/Grip.js\";\nimport { useFloatingWidgetId } from \"./FloatingWidget.js\";\nimport { useMaximizedWidgetTabBarHandle } from \"../../preview/enable-maximized-widget/useMaximizedWidget.js\";\nimport { WidgetActions } from \"./WidgetActions.js\";\nimport { ConfigurableUiContext } from \"../../configurableui/ConfigurableUiContent.js\";\n\n/** @internal */\nexport interface WidgetTabBarProps {\n separator?: boolean;\n}\n\n/** @internal */\nexport function WidgetTabBar(props: WidgetTabBarProps) {\n const dispatch = React.useContext(NineZoneDispatchContext);\n const id = React.useContext(WidgetIdContext);\n const { widgetActions } = React.useContext(ConfigurableUiContext);\n const floatingWidgetId = useFloatingWidgetId();\n assert(!!id);\n const widgetId = floatingWidgetId === undefined ? id : floatingWidgetId;\n const handleDoubleClick = React.useCallback(() => {\n floatingWidgetId &&\n dispatch({\n type: \"FLOATING_WIDGET_CLEAR_USER_SIZED\",\n id: floatingWidgetId,\n });\n }, [dispatch, floatingWidgetId]);\n const handleActionAreaClick = useDoubleClick(handleDoubleClick);\n\n const onDrag = React.useCallback<NonNullable<UseDragWidgetArgs[\"onDrag\"]>>(\n (dragBy) => {\n floatingWidgetId !== undefined &&\n dispatch({\n type: \"WIDGET_DRAG\",\n dragBy,\n floatingWidgetId,\n });\n },\n [dispatch, floatingWidgetId]\n );\n const onDragEnd = React.useCallback<\n NonNullable<UseDragWidgetArgs[\"onDragEnd\"]>\n >(\n (target) => {\n floatingWidgetId !== undefined && handleActionAreaClick();\n floatingWidgetId !== undefined &&\n dispatch({\n type: \"WIDGET_DRAG_END\",\n floatingWidgetId,\n target,\n });\n },\n [dispatch, floatingWidgetId, handleActionAreaClick]\n );\n const handleWidgetDragStart = useDragWidget({\n widgetId,\n onDrag,\n onDragEnd,\n });\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const handleDragStart = React.useCallback(\n (initialPointerPosition: Point, pointerPosition: Point) => {\n handleWidgetDragStart({\n initialPointerPosition,\n pointerPosition,\n });\n },\n [handleWidgetDragStart]\n );\n const handleTouchStart = React.useCallback(() => {\n floatingWidgetId &&\n dispatch({\n type: \"FLOATING_WIDGET_BRING_TO_FRONT\",\n id: floatingWidgetId,\n });\n }, [dispatch, floatingWidgetId]);\n const ref = useDrag(\n handleDragStart,\n undefined,\n undefined,\n handleTouchStart,\n handleDoubleClick\n );\n const maximizedWidgetHandle = useMaximizedWidgetTabBarHandle();\n const className = classnames(\n \"nz-widget-tabBar\",\n props.separator && \"nz-separator\"\n );\n const handleClassName = classnames(\"nz-handle\", maximizedWidgetHandle);\n return (\n <div ref={containerRef} className={className}>\n <div className={handleClassName} ref={ref} />\n <WidgetTabs />\n {widgetActions ?? <WidgetActions />}\n </div>\n );\n}\n\n/** Hook to control drag interactions.\n * Starts drag interaction after pointer moves or after timeout.\n * @internal\n */\nexport function useDrag<T extends HTMLElement>(\n onDragStart?: (initialPointerPosition: Point, pointerPosition: Point) => void,\n onDrag?: (position: Point) => void,\n onDragEnd?: () => void,\n onTouchStart?: () => void,\n onDoubleClick?: () => void\n) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n const doubleClickTimer = React.useRef(new Timer(300));\n const clickCount = React.useRef(0);\n const initialPointerPosition = React.useRef<Point | undefined>(undefined);\n\n React.useEffect(() => {\n const handleExecute = () => {\n if (clickCount.current === 2) onDoubleClick && onDoubleClick();\n clickCount.current = 0;\n };\n const timer = doubleClickTimer.current;\n timer.setOnExecute(handleExecute);\n return () => {\n timer.setOnExecute(undefined);\n };\n }, [onDoubleClick]);\n\n const handlePointerDown = React.useCallback(\n (args: PointerCaptorArgs, e: PointerCaptorEvent) => {\n initialPointerPosition.current = new Point(args.clientX, args.clientY);\n e.type === \"touchstart\" && onTouchStart && onTouchStart();\n },\n [onTouchStart]\n );\n const handlePointerMove = React.useCallback(\n (args: PointerCaptorArgs) => {\n if (initialPointerPosition.current) {\n onDragStart &&\n onDragStart(\n initialPointerPosition.current,\n new Point(args.clientX, args.clientY)\n );\n initialPointerPosition.current = undefined;\n return;\n }\n onDrag && onDrag(new Point(args.clientX, args.clientY));\n },\n [onDragStart, onDrag]\n );\n const handlePointerUp = React.useCallback(() => {\n clickCount.current++;\n doubleClickTimer.current.start();\n initialPointerPosition.current = undefined;\n onDragEnd && onDragEnd();\n }, [onDragEnd]);\n const ref = usePointerCaptor<T>(\n handlePointerDown,\n handlePointerMove,\n handlePointerUp\n );\n return ref;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"TabBar.js","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/TabBar.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 Widget\n */\n\nimport \"./TabBar.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { Timer } from \"@itwin/core-react\";\nimport { Point } from \"@itwin/core-react/internal\";\nimport type { UseDragWidgetArgs } from \"../base/DragManager.js\";\nimport { useDragWidget } from \"../base/DragManager.js\";\nimport { NineZoneDispatchContext } from \"../base/NineZone.js\";\nimport type {\n PointerCaptorArgs,\n PointerCaptorEvent,\n} from \"../base/usePointerCaptor.js\";\nimport { usePointerCaptor } from \"../base/usePointerCaptor.js\";\nimport { WidgetTabs } from \"./Tabs.js\";\nimport { WidgetIdContext } from \"./Widget.js\";\nimport { useDoubleClick } from \"../widget-panels/Grip.js\";\nimport { useFloatingWidgetId } from \"./FloatingWidget.js\";\nimport { useMaximizedWidgetTabBarHandle } from \"../../preview/enable-maximized-widget/useMaximizedWidget.js\";\nimport { WidgetActions } from \"./WidgetActions.js\";\nimport { ConfigurableUiContext } from \"../../configurableui/ConfigurableUiContent.js\";\nimport { useSafeContext } from \"../../hooks/useSafeContext.js\";\n\n/** @internal */\nexport interface WidgetTabBarProps {\n separator?: boolean;\n}\n\n/** @internal */\nexport function WidgetTabBar(props: WidgetTabBarProps) {\n const { widgetActions } = React.useContext(ConfigurableUiContext);\n\n const ref = useDragWidgetHandle();\n const maximizedWidgetHandle = useMaximizedWidgetTabBarHandle();\n return (\n <div\n className={classnames(\n \"nz-widget-tabBar\",\n props.separator && \"nz-separator\"\n )}\n >\n <div\n className={classnames(\"nz-handle\", maximizedWidgetHandle)}\n ref={ref}\n />\n <WidgetTabs />\n {widgetActions ?? <WidgetActions />}\n </div>\n );\n}\n\n/** @internal */\nexport function useDragWidgetHandle() {\n const id = useSafeContext(WidgetIdContext);\n const dispatch = React.useContext(NineZoneDispatchContext);\n const floatingWidgetId = useFloatingWidgetId();\n const widgetId = floatingWidgetId === undefined ? id : floatingWidgetId;\n const handleDoubleClick = React.useCallback(() => {\n floatingWidgetId &&\n dispatch({\n type: \"FLOATING_WIDGET_CLEAR_USER_SIZED\",\n id: floatingWidgetId,\n });\n }, [dispatch, floatingWidgetId]);\n const handleActionAreaClick = useDoubleClick(handleDoubleClick);\n const onDrag = React.useCallback<NonNullable<UseDragWidgetArgs[\"onDrag\"]>>(\n (dragBy) => {\n floatingWidgetId !== undefined &&\n dispatch({\n type: \"WIDGET_DRAG\",\n dragBy,\n floatingWidgetId,\n });\n },\n [dispatch, floatingWidgetId]\n );\n const onDragEnd = React.useCallback<\n NonNullable<UseDragWidgetArgs[\"onDragEnd\"]>\n >(\n (target) => {\n floatingWidgetId !== undefined && handleActionAreaClick();\n floatingWidgetId !== undefined &&\n dispatch({\n type: \"WIDGET_DRAG_END\",\n floatingWidgetId,\n target,\n });\n },\n [dispatch, floatingWidgetId, handleActionAreaClick]\n );\n const handleWidgetDragStart = useDragWidget({\n widgetId,\n onDrag,\n onDragEnd,\n });\n const handleDragStart = React.useCallback(\n (initialPointerPosition: Point, pointerPosition: Point) => {\n handleWidgetDragStart({\n initialPointerPosition,\n pointerPosition,\n });\n },\n [handleWidgetDragStart]\n );\n const handleTouchStart = React.useCallback(() => {\n floatingWidgetId &&\n dispatch({\n type: \"FLOATING_WIDGET_BRING_TO_FRONT\",\n id: floatingWidgetId,\n });\n }, [dispatch, floatingWidgetId]);\n const ref = useDrag(\n handleDragStart,\n undefined,\n undefined,\n handleTouchStart,\n handleDoubleClick\n );\n return ref;\n}\n\n/** Hook to control drag interactions.\n * Starts drag interaction after pointer moves or after timeout.\n * @internal\n */\nexport function useDrag<T extends HTMLElement>(\n onDragStart?: (initialPointerPosition: Point, pointerPosition: Point) => void,\n onDrag?: (position: Point) => void,\n onDragEnd?: () => void,\n onTouchStart?: () => void,\n onDoubleClick?: () => void\n) {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n const doubleClickTimer = React.useRef(new Timer(300));\n const clickCount = React.useRef(0);\n const initialPointerPosition = React.useRef<Point | undefined>(undefined);\n\n React.useEffect(() => {\n const handleExecute = () => {\n if (clickCount.current === 2) onDoubleClick && onDoubleClick();\n clickCount.current = 0;\n };\n const timer = doubleClickTimer.current;\n timer.setOnExecute(handleExecute);\n return () => {\n timer.setOnExecute(undefined);\n };\n }, [onDoubleClick]);\n\n const handlePointerDown = React.useCallback(\n (args: PointerCaptorArgs, e: PointerCaptorEvent) => {\n initialPointerPosition.current = new Point(args.clientX, args.clientY);\n e.type === \"touchstart\" && onTouchStart && onTouchStart();\n },\n [onTouchStart]\n );\n const handlePointerMove = React.useCallback(\n (args: PointerCaptorArgs) => {\n if (initialPointerPosition.current) {\n onDragStart &&\n onDragStart(\n initialPointerPosition.current,\n new Point(args.clientX, args.clientY)\n );\n initialPointerPosition.current = undefined;\n return;\n }\n onDrag && onDrag(new Point(args.clientX, args.clientY));\n },\n [onDragStart, onDrag]\n );\n const handlePointerUp = React.useCallback(() => {\n clickCount.current++;\n doubleClickTimer.current.start();\n initialPointerPosition.current = undefined;\n onDragEnd && onDragEnd();\n }, [onDragEnd]);\n const ref = usePointerCaptor<T>(\n handlePointerDown,\n handlePointerMove,\n handlePointerUp\n );\n return ref;\n}\n"]}
|
|
@@ -14,17 +14,19 @@ export interface WidgetProviderProps {
|
|
|
14
14
|
}
|
|
15
15
|
/** @internal */
|
|
16
16
|
export declare function WidgetProvider(props: WidgetProviderProps): React.JSX.Element;
|
|
17
|
-
|
|
18
|
-
export interface WidgetProps extends CommonProps {
|
|
17
|
+
interface WidgetProps extends CommonProps {
|
|
19
18
|
children?: React.ReactNode;
|
|
20
19
|
onMouseEnter?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
21
20
|
onMouseLeave?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
22
21
|
onTransitionEnd?(): void;
|
|
23
|
-
widgetId?: string;
|
|
24
22
|
}
|
|
25
23
|
/** @internal */
|
|
26
24
|
export declare const Widget: React.ForwardRefExoticComponent<WidgetProps & React.RefAttributes<HTMLDivElement>>;
|
|
27
25
|
/** @internal */
|
|
26
|
+
export declare function useDragPanelWidget(): React.RefObject<HTMLDivElement | null>;
|
|
27
|
+
/** @internal */
|
|
28
|
+
export declare function useWidgetContextValue(): readonly [React.RefObject<HTMLDivElement | null>, WidgetContextArgs];
|
|
29
|
+
/** @internal */
|
|
28
30
|
export declare const WidgetIdContext: React.Context<string | undefined>;
|
|
29
31
|
/** @internal */
|
|
30
32
|
export interface WidgetContextArgs {
|
|
@@ -36,4 +38,5 @@ export declare const WidgetContext: React.Context<WidgetContextArgs>;
|
|
|
36
38
|
export declare function restrainInitialWidgetSize(size: SizeProps, nzSize: SizeProps): SizeProps;
|
|
37
39
|
/** @internal */
|
|
38
40
|
export declare function useActiveTabId(): string;
|
|
41
|
+
export {};
|
|
39
42
|
//# sourceMappingURL=Widget.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Widget.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/Widget.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,eAAe,CAAC;AAEvB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAW,MAAM,4BAA4B,CAAC;AAQhE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAK3D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"Widget.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/Widget.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,eAAe,CAAC;AAEvB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAW,MAAM,4BAA4B,CAAC;AAQhE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAK3D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAG1D,gBAAgB;AAChB,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,gBAAgB;AAChB,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,qBAMxD;AAGD,UAAU,WAAY,SAAQ,WAAW;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC1E,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC1E,eAAe,CAAC,IAAI,IAAI,CAAC;CAC1B;AAED,gBAAgB;AAChB,eAAO,MAAM,MAAM,oFAuBlB,CAAC;AAEF,gBAAgB;AAChB,wBAAgB,kBAAkB,2CA+EjC;AAED,gBAAgB;AAChB,wBAAgB,qBAAqB,yEAcpC;AAED,gBAAgB;AAChB,eAAO,MAAM,eAAe,mCAEhB,CAAC;AAGb,gBAAgB;AAChB,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,SAAS,CAAC;CAC1B;AAED,gBAAgB;AAChB,eAAO,MAAM,aAAa,kCAAgD,CAAC;AAM3E,gBAAgB;AAChB,wBAAgB,yBAAyB,CACvC,IAAI,EAAE,SAAS,EACf,MAAM,EAAE,SAAS,GAChB,SAAS,CAOX;AAED,gBAAgB;AAChB,wBAAgB,cAAc,WAM7B"}
|
|
@@ -16,18 +16,29 @@ import { PanelSideContext } from "../widget-panels/Panel.js";
|
|
|
16
16
|
import { useLayout } from "../base/LayoutStore.js";
|
|
17
17
|
import { getWidgetState } from "../state/internal/WidgetStateHelpers.js";
|
|
18
18
|
import { useFloatingWidgetId } from "./FloatingWidget.js";
|
|
19
|
+
import { useSafeContext } from "../../hooks/useSafeContext.js";
|
|
19
20
|
/** @internal */
|
|
20
21
|
export function WidgetProvider(props) {
|
|
21
22
|
return (React.createElement(WidgetIdContext.Provider, { value: props.id }, props.children));
|
|
22
23
|
}
|
|
23
24
|
/** @internal */
|
|
24
25
|
export const Widget = React.forwardRef(function Widget(props, forwardedRef) {
|
|
25
|
-
const dispatch = React.useContext(NineZoneDispatchContext);
|
|
26
|
-
const side = React.useContext(PanelSideContext);
|
|
27
26
|
const id = React.useContext(WidgetIdContext);
|
|
27
|
+
const [widgetRef, value] = useWidgetContextValue();
|
|
28
|
+
const dockedWidgetRef = useDragPanelWidget();
|
|
29
|
+
const ref = useRefs(forwardedRef, widgetRef, dockedWidgetRef);
|
|
30
|
+
const className = classnames("nz-widget-widget", props.className);
|
|
31
|
+
return (React.createElement(WidgetContext.Provider, { value: value },
|
|
32
|
+
React.createElement("div", { className: className, onMouseEnter: props.onMouseEnter, onMouseLeave: props.onMouseLeave, onTransitionEnd: props.onTransitionEnd, ref: ref, style: props.style, "data-widget-id": id }, props.children)));
|
|
33
|
+
});
|
|
34
|
+
/** @internal */
|
|
35
|
+
export function useDragPanelWidget() {
|
|
36
|
+
const id = useSafeContext(WidgetIdContext);
|
|
37
|
+
const side = React.useContext(PanelSideContext);
|
|
28
38
|
const measureNz = React.useContext(MeasureContext);
|
|
39
|
+
const dispatch = React.useContext(NineZoneDispatchContext);
|
|
29
40
|
const floatingWidgetId = useFloatingWidgetId();
|
|
30
|
-
|
|
41
|
+
const widgetId = floatingWidgetId === undefined ? id : floatingWidgetId;
|
|
31
42
|
const { preferredFloatingWidgetSize, userSized } = useLayout((state) => {
|
|
32
43
|
const widget = getWidgetState(state, id);
|
|
33
44
|
const tab = state.tabs[widget.activeTabId];
|
|
@@ -37,14 +48,14 @@ export const Widget = React.forwardRef(function Widget(props, forwardedRef) {
|
|
|
37
48
|
(tab.isFloatingWidgetResizable && !!tab.preferredFloatingWidgetSize),
|
|
38
49
|
};
|
|
39
50
|
}, true);
|
|
40
|
-
const
|
|
41
|
-
const widgetId = floatingWidgetId === undefined ? id : floatingWidgetId;
|
|
51
|
+
const ref = React.useRef(null);
|
|
42
52
|
const onDragStart = React.useCallback((updateId, initialPointerPosition, pointerPosition) => {
|
|
43
|
-
|
|
53
|
+
if (!ref.current)
|
|
54
|
+
return;
|
|
44
55
|
if (floatingWidgetId !== undefined)
|
|
45
56
|
return;
|
|
46
57
|
const nzBounds = measureNz();
|
|
47
|
-
let bounds = Rectangle.create(
|
|
58
|
+
let bounds = Rectangle.create(ref.current.getBoundingClientRect());
|
|
48
59
|
const size = restrainInitialWidgetSize(bounds.getSize(), nzBounds.getSize());
|
|
49
60
|
bounds = bounds.setSize(size);
|
|
50
61
|
if (preferredFloatingWidgetSize) {
|
|
@@ -83,34 +94,22 @@ export const Widget = React.forwardRef(function Widget(props, forwardedRef) {
|
|
|
83
94
|
widgetId,
|
|
84
95
|
onDragStart,
|
|
85
96
|
});
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
id: floatingWidgetId,
|
|
92
|
-
});
|
|
93
|
-
};
|
|
94
|
-
const element = elementRef.current;
|
|
95
|
-
element?.addEventListener("click", listener);
|
|
96
|
-
return () => {
|
|
97
|
-
element?.removeEventListener("click", listener);
|
|
98
|
-
};
|
|
99
|
-
}, [dispatch, floatingWidgetId]);
|
|
97
|
+
return ref;
|
|
98
|
+
}
|
|
99
|
+
/** @internal */
|
|
100
|
+
export function useWidgetContextValue() {
|
|
101
|
+
const ref = React.useRef(null);
|
|
100
102
|
const measure = React.useCallback(() => {
|
|
101
|
-
if (!
|
|
103
|
+
if (!ref.current)
|
|
102
104
|
return new Rectangle();
|
|
103
|
-
const bounds =
|
|
105
|
+
const bounds = ref.current.getBoundingClientRect();
|
|
104
106
|
return Rectangle.create(bounds);
|
|
105
107
|
}, []);
|
|
106
|
-
const
|
|
108
|
+
const value = React.useMemo(() => ({
|
|
107
109
|
measure,
|
|
108
110
|
}), [measure]);
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
return (React.createElement(WidgetContext.Provider, { value: widgetContextValue },
|
|
112
|
-
React.createElement("div", { className: className, onMouseEnter: props.onMouseEnter, onMouseLeave: props.onMouseLeave, onTransitionEnd: props.onTransitionEnd, ref: ref, style: props.style, "data-widget-id": props.widgetId }, props.children)));
|
|
113
|
-
});
|
|
111
|
+
return [ref, value];
|
|
112
|
+
}
|
|
114
113
|
/** @internal */
|
|
115
114
|
export const WidgetIdContext = React.createContext(undefined);
|
|
116
115
|
WidgetIdContext.displayName = "nz:WidgetIdContext";
|
|
@@ -130,8 +129,7 @@ export function restrainInitialWidgetSize(size, nzSize) {
|
|
|
130
129
|
}
|
|
131
130
|
/** @internal */
|
|
132
131
|
export function useActiveTabId() {
|
|
133
|
-
const id =
|
|
134
|
-
assert(!!id);
|
|
132
|
+
const id = useSafeContext(WidgetIdContext);
|
|
135
133
|
return useLayout((state) => {
|
|
136
134
|
const widget = getWidgetState(state, id);
|
|
137
135
|
return widget.activeTabId;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Widget.js","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/Widget.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 Widget\n */\n\nimport \"./Widget.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Rectangle, useRefs } from \"@itwin/core-react/internal\";\nimport type { UseDragWidgetArgs } from \"../base/DragManager.js\";\nimport { useDragWidget } from \"../base/DragManager.js\";\nimport {\n getUniqueId,\n MeasureContext,\n NineZoneDispatchContext,\n} from \"../base/NineZone.js\";\nimport type { WidgetState } from \"../state/WidgetState.js\";\nimport { PanelSideContext } from \"../widget-panels/Panel.js\";\nimport { useLayout } from \"../base/LayoutStore.js\";\nimport { getWidgetState } from \"../state/internal/WidgetStateHelpers.js\";\nimport { useFloatingWidgetId } from \"./FloatingWidget.js\";\nimport type { SizeProps } from \"../../utils/SizeProps.js\";\n\n/** @internal */\nexport interface WidgetProviderProps {\n id: WidgetState[\"id\"];\n children?: React.ReactNode;\n}\n\n/** @internal */\nexport function WidgetProvider(props: WidgetProviderProps) {\n return (\n <WidgetIdContext.Provider value={props.id}>\n {props.children}\n </WidgetIdContext.Provider>\n );\n}\n\n/** @internal */\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport interface WidgetProps extends CommonProps {\n children?: React.ReactNode;\n onMouseEnter?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n onMouseLeave?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n onTransitionEnd?(): void;\n widgetId?: string;\n}\n\n/** @internal */\nexport const Widget = React.forwardRef<HTMLDivElement, WidgetProps>(\n function Widget(props, forwardedRef) {\n const dispatch = React.useContext(NineZoneDispatchContext);\n const side = React.useContext(PanelSideContext);\n const id = React.useContext(WidgetIdContext);\n const measureNz = React.useContext(MeasureContext);\n const floatingWidgetId = useFloatingWidgetId();\n assert(!!id);\n const { preferredFloatingWidgetSize, userSized } = useLayout((state) => {\n const widget = getWidgetState(state, id);\n const tab = state.tabs[widget.activeTabId];\n return {\n preferredFloatingWidgetSize: tab.preferredFloatingWidgetSize,\n userSized:\n tab.userSized ||\n (tab.isFloatingWidgetResizable && !!tab.preferredFloatingWidgetSize),\n };\n }, true);\n const elementRef = React.useRef<HTMLDivElement>(null);\n const widgetId = floatingWidgetId === undefined ? id : floatingWidgetId;\n const onDragStart = React.useCallback<\n NonNullable<UseDragWidgetArgs[\"onDragStart\"]>\n >(\n (updateId, initialPointerPosition, pointerPosition) => {\n assert(!!elementRef.current);\n if (floatingWidgetId !== undefined) return;\n const nzBounds = measureNz();\n let bounds = Rectangle.create(\n elementRef.current.getBoundingClientRect()\n );\n\n const size = restrainInitialWidgetSize(\n bounds.getSize(),\n nzBounds.getSize()\n );\n bounds = bounds.setSize(size);\n\n if (preferredFloatingWidgetSize) {\n bounds = bounds.setSize(preferredFloatingWidgetSize);\n }\n\n // Pointer is outside of tab area. Need to re-adjust widget bounds so that tab is behind pointer\n if (initialPointerPosition.x > bounds.right) {\n const offset = initialPointerPosition.x - bounds.right + 20;\n bounds = bounds.offsetX(offset);\n }\n\n const dragOffset = initialPointerPosition.getOffsetTo(pointerPosition);\n bounds = bounds.offset(dragOffset);\n\n // Adjust bounds to be relative to 9z origin\n bounds = bounds.offset({ x: -nzBounds.left, y: -nzBounds.top });\n\n const newFloatingWidgetId = getUniqueId();\n updateId(newFloatingWidgetId);\n\n assert(!!side);\n dispatch({\n type: \"PANEL_WIDGET_DRAG_START\",\n newFloatingWidgetId,\n id,\n bounds,\n side,\n userSized,\n });\n },\n [\n dispatch,\n floatingWidgetId,\n id,\n side,\n measureNz,\n preferredFloatingWidgetSize,\n userSized,\n ]\n );\n useDragWidget({\n widgetId,\n onDragStart,\n });\n React.useEffect(() => {\n const listener = () => {\n floatingWidgetId &&\n dispatch({\n type: \"FLOATING_WIDGET_BRING_TO_FRONT\",\n id: floatingWidgetId,\n });\n };\n const element = elementRef.current;\n element?.addEventListener(\"click\", listener);\n return () => {\n element?.removeEventListener(\"click\", listener);\n };\n }, [dispatch, floatingWidgetId]);\n const measure = React.useCallback<WidgetContextArgs[\"measure\"]>(() => {\n if (!elementRef.current) return new Rectangle();\n const bounds = elementRef.current.getBoundingClientRect();\n return Rectangle.create(bounds);\n }, []);\n const widgetContextValue = React.useMemo<WidgetContextArgs>(\n () => ({\n measure,\n }),\n [measure]\n );\n\n const ref = useRefs(forwardedRef, elementRef);\n const className = classnames(\"nz-widget-widget\", props.className);\n return (\n <WidgetContext.Provider value={widgetContextValue}>\n <div\n className={className}\n onMouseEnter={props.onMouseEnter}\n onMouseLeave={props.onMouseLeave}\n onTransitionEnd={props.onTransitionEnd}\n ref={ref}\n style={props.style}\n data-widget-id={props.widgetId}\n >\n {props.children}\n </div>\n </WidgetContext.Provider>\n );\n }\n);\n\n/** @internal */\nexport const WidgetIdContext = React.createContext<\n WidgetState[\"id\"] | undefined\n>(undefined);\nWidgetIdContext.displayName = \"nz:WidgetIdContext\";\n\n/** @internal */\nexport interface WidgetContextArgs {\n measure: () => Rectangle;\n}\n\n/** @internal */\nexport const WidgetContext = React.createContext<WidgetContextArgs>(null!);\nWidgetContext.displayName = \"nz:WidgetContext\";\n\nconst minWidth = 200;\nconst minHeight = 200;\n\n/** @internal */\nexport function restrainInitialWidgetSize(\n size: SizeProps,\n nzSize: SizeProps\n): SizeProps {\n const width = Math.max(Math.min(nzSize.width / 3, size.width), minWidth);\n const height = Math.max(Math.min(nzSize.height / 3, size.height), minHeight);\n return {\n width,\n height,\n };\n}\n\n/** @internal */\nexport function useActiveTabId() {\n const id = React.useContext(WidgetIdContext);\n assert(!!id);\n return useLayout((state) => {\n const widget = getWidgetState(state, id);\n return widget.activeTabId;\n });\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Widget.js","sourceRoot":"","sources":["../../../../src/appui-react/layout/widget/Widget.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 Widget\n */\n\nimport \"./Widget.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { assert } from \"@itwin/core-bentley\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Rectangle, useRefs } from \"@itwin/core-react/internal\";\nimport type { UseDragWidgetArgs } from \"../base/DragManager.js\";\nimport { useDragWidget } from \"../base/DragManager.js\";\nimport {\n getUniqueId,\n MeasureContext,\n NineZoneDispatchContext,\n} from \"../base/NineZone.js\";\nimport type { WidgetState } from \"../state/WidgetState.js\";\nimport { PanelSideContext } from \"../widget-panels/Panel.js\";\nimport { useLayout } from \"../base/LayoutStore.js\";\nimport { getWidgetState } from \"../state/internal/WidgetStateHelpers.js\";\nimport { useFloatingWidgetId } from \"./FloatingWidget.js\";\nimport type { SizeProps } from \"../../utils/SizeProps.js\";\nimport { useSafeContext } from \"../../hooks/useSafeContext.js\";\n\n/** @internal */\nexport interface WidgetProviderProps {\n id: WidgetState[\"id\"];\n children?: React.ReactNode;\n}\n\n/** @internal */\nexport function WidgetProvider(props: WidgetProviderProps) {\n return (\n <WidgetIdContext.Provider value={props.id}>\n {props.children}\n </WidgetIdContext.Provider>\n );\n}\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\ninterface WidgetProps extends CommonProps {\n children?: React.ReactNode;\n onMouseEnter?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n onMouseLeave?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n onTransitionEnd?(): void;\n}\n\n/** @internal */\nexport const Widget = React.forwardRef<HTMLDivElement, WidgetProps>(\n function Widget(props, forwardedRef) {\n const id = React.useContext(WidgetIdContext);\n const [widgetRef, value] = useWidgetContextValue();\n const dockedWidgetRef = useDragPanelWidget();\n const ref = useRefs(forwardedRef, widgetRef, dockedWidgetRef);\n const className = classnames(\"nz-widget-widget\", props.className);\n return (\n <WidgetContext.Provider value={value}>\n <div\n className={className}\n onMouseEnter={props.onMouseEnter}\n onMouseLeave={props.onMouseLeave}\n onTransitionEnd={props.onTransitionEnd}\n ref={ref}\n style={props.style}\n data-widget-id={id}\n >\n {props.children}\n </div>\n </WidgetContext.Provider>\n );\n }\n);\n\n/** @internal */\nexport function useDragPanelWidget() {\n const id = useSafeContext(WidgetIdContext);\n const side = React.useContext(PanelSideContext);\n const measureNz = React.useContext(MeasureContext);\n const dispatch = React.useContext(NineZoneDispatchContext);\n const floatingWidgetId = useFloatingWidgetId();\n const widgetId = floatingWidgetId === undefined ? id : floatingWidgetId;\n const { preferredFloatingWidgetSize, userSized } = useLayout((state) => {\n const widget = getWidgetState(state, id);\n const tab = state.tabs[widget.activeTabId];\n return {\n preferredFloatingWidgetSize: tab.preferredFloatingWidgetSize,\n userSized:\n tab.userSized ||\n (tab.isFloatingWidgetResizable && !!tab.preferredFloatingWidgetSize),\n };\n }, true);\n\n const ref = React.useRef<HTMLDivElement>(null);\n\n const onDragStart = React.useCallback<\n NonNullable<UseDragWidgetArgs[\"onDragStart\"]>\n >(\n (updateId, initialPointerPosition, pointerPosition) => {\n if (!ref.current) return;\n if (floatingWidgetId !== undefined) return;\n const nzBounds = measureNz();\n let bounds = Rectangle.create(ref.current.getBoundingClientRect());\n\n const size = restrainInitialWidgetSize(\n bounds.getSize(),\n nzBounds.getSize()\n );\n bounds = bounds.setSize(size);\n\n if (preferredFloatingWidgetSize) {\n bounds = bounds.setSize(preferredFloatingWidgetSize);\n }\n\n // Pointer is outside of tab area. Need to re-adjust widget bounds so that tab is behind pointer\n if (initialPointerPosition.x > bounds.right) {\n const offset = initialPointerPosition.x - bounds.right + 20;\n bounds = bounds.offsetX(offset);\n }\n\n const dragOffset = initialPointerPosition.getOffsetTo(pointerPosition);\n bounds = bounds.offset(dragOffset);\n\n // Adjust bounds to be relative to 9z origin\n bounds = bounds.offset({ x: -nzBounds.left, y: -nzBounds.top });\n\n const newFloatingWidgetId = getUniqueId();\n updateId(newFloatingWidgetId);\n\n assert(!!side);\n dispatch({\n type: \"PANEL_WIDGET_DRAG_START\",\n newFloatingWidgetId,\n id,\n bounds,\n side,\n userSized,\n });\n },\n [\n dispatch,\n floatingWidgetId,\n id,\n side,\n measureNz,\n preferredFloatingWidgetSize,\n userSized,\n ]\n );\n useDragWidget({\n widgetId,\n onDragStart,\n });\n return ref;\n}\n\n/** @internal */\nexport function useWidgetContextValue() {\n const ref = React.useRef<HTMLDivElement>(null);\n const measure = React.useCallback<WidgetContextArgs[\"measure\"]>(() => {\n if (!ref.current) return new Rectangle();\n const bounds = ref.current.getBoundingClientRect();\n return Rectangle.create(bounds);\n }, []);\n const value = React.useMemo<WidgetContextArgs>(\n () => ({\n measure,\n }),\n [measure]\n );\n return [ref, value] as const;\n}\n\n/** @internal */\nexport const WidgetIdContext = React.createContext<\n WidgetState[\"id\"] | undefined\n>(undefined);\nWidgetIdContext.displayName = \"nz:WidgetIdContext\";\n\n/** @internal */\nexport interface WidgetContextArgs {\n measure: () => Rectangle;\n}\n\n/** @internal */\nexport const WidgetContext = React.createContext<WidgetContextArgs>(null!);\nWidgetContext.displayName = \"nz:WidgetContext\";\n\nconst minWidth = 200;\nconst minHeight = 200;\n\n/** @internal */\nexport function restrainInitialWidgetSize(\n size: SizeProps,\n nzSize: SizeProps\n): SizeProps {\n const width = Math.max(Math.min(nzSize.width / 3, size.width), minWidth);\n const height = Math.max(Math.min(nzSize.height / 3, size.height), minHeight);\n return {\n width,\n height,\n };\n}\n\n/** @internal */\nexport function useActiveTabId() {\n const id = useSafeContext(WidgetIdContext);\n return useLayout((state) => {\n const widget = getWidgetState(state, id);\n return widget.activeTabId;\n });\n}\n"]}
|
|
@@ -53,6 +53,12 @@ interface KnownPreviewFeatures {
|
|
|
53
53
|
* Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/859
|
|
54
54
|
*/
|
|
55
55
|
controlWidgetVisibility: boolean | WidgetDef["id"][];
|
|
56
|
+
/** If `true`, widget tab actions are displayed for individual tabs instead of the default behavior where only active tab actions are exposed.
|
|
57
|
+
* Note that this feature replaces the overflow dropdown menu with a scrollable container to display all tab actions.
|
|
58
|
+
*
|
|
59
|
+
* Close button will be shown in widget tab when `controlWidgetVisibility` preview feature is enabled.
|
|
60
|
+
*/
|
|
61
|
+
widgetTabActions: boolean;
|
|
56
62
|
/**
|
|
57
63
|
* If `true`, the tool settings will be using the new editor API. The new system delivers same default editors as the old one.
|
|
58
64
|
* However, in order to use custom editors they need to be provided using `EditorsRegistryProvider` component.
|
|
@@ -77,7 +83,7 @@ interface KnownPreviewFeatures {
|
|
|
77
83
|
* This list is expected to change over time, the interface is made
|
|
78
84
|
* so that new features can be added or removed without breaking existing code.
|
|
79
85
|
* A console warning will simply appear if unknown features are passed.
|
|
80
|
-
* @
|
|
86
|
+
* @public
|
|
81
87
|
*/
|
|
82
88
|
export interface PreviewFeatures extends Partial<KnownPreviewFeatures> {
|
|
83
89
|
[featureName: string]: any;
|
|
@@ -88,11 +94,13 @@ export interface PreviewFeatures extends Partial<KnownPreviewFeatures> {
|
|
|
88
94
|
export declare function usePreviewFeatures(): PreviewFeatures;
|
|
89
95
|
/** Props for PreviewFeaturesProvider.
|
|
90
96
|
* @beta
|
|
97
|
+
* @deprecated in 5.26.0. Use `React.ComponentProps<typeof PreviewFeaturesProvider>`
|
|
91
98
|
*/
|
|
92
99
|
export interface PreviewFeaturesProviderProps {
|
|
93
100
|
children?: React.ReactNode;
|
|
94
101
|
features?: PreviewFeatures;
|
|
95
102
|
}
|
|
103
|
+
type ProviderProps = PreviewFeaturesProviderProps;
|
|
96
104
|
/** Set which preview features are enabled. These features are not yet ready for production use nor have
|
|
97
105
|
* a proper API defined yet.
|
|
98
106
|
* The available set of features are defined in the [[PreviewFeatures]] interface.
|
|
@@ -108,8 +116,8 @@ export interface PreviewFeaturesProviderProps {
|
|
|
108
116
|
* </Provider>
|
|
109
117
|
* </PreviewFeaturesProvider>
|
|
110
118
|
* ```
|
|
111
|
-
* @
|
|
119
|
+
* @public
|
|
112
120
|
*/
|
|
113
|
-
export declare function PreviewFeaturesProvider(
|
|
121
|
+
export declare function PreviewFeaturesProvider(props: ProviderProps): React.JSX.Element;
|
|
114
122
|
export {};
|
|
115
123
|
//# sourceMappingURL=PreviewFeatures.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PreviewFeatures.d.ts","sourceRoot":"","sources":["../../../src/appui-react/preview/PreviewFeatures.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGzD,sCAAsC;AACtC,UAAU,oBAAoB;IAC5B;;;;OAIG;IACH,oBAAoB,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,6BAA6B,EAAE,OAAO,CAAC;IACvC;;;OAGG;IACH,0BAA0B,EAAE,OAAO,CAAC;IACpC;;;OAGG;IACH,wBAAwB,EAAE,OAAO,CAAC;IAClC;;;OAGG;IACH,oBAAoB,EAAE;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IAC5C;;;OAGG;IACH,wCAAwC,EAAE,OAAO,CAAC;IAClD;;;;;;OAMG;IACH,qBAAqB,EAAE,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;IACnD;;;;;OAKG;IACH,uBAAuB,EAAE,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;IACrD;;;OAGG;IACH,sBAAsB,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,sBAAsB,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,0BAA0B,EAAE,OAAO,CAAC;IACpC;;OAEG;IACH,mBAAmB,EAAE,OAAO,CAAC;CAC9B;
|
|
1
|
+
{"version":3,"file":"PreviewFeatures.d.ts","sourceRoot":"","sources":["../../../src/appui-react/preview/PreviewFeatures.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGzD,sCAAsC;AACtC,UAAU,oBAAoB;IAC5B;;;;OAIG;IACH,oBAAoB,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,6BAA6B,EAAE,OAAO,CAAC;IACvC;;;OAGG;IACH,0BAA0B,EAAE,OAAO,CAAC;IACpC;;;OAGG;IACH,wBAAwB,EAAE,OAAO,CAAC;IAClC;;;OAGG;IACH,oBAAoB,EAAE;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IAC5C;;;OAGG;IACH,wCAAwC,EAAE,OAAO,CAAC;IAClD;;;;;;OAMG;IACH,qBAAqB,EAAE,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;IACnD;;;;;OAKG;IACH,uBAAuB,EAAE,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;IACrD;;;;OAIG;IACH,gBAAgB,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,sBAAsB,EAAE,OAAO,CAAC;IAChC;;;;OAIG;IACH,sBAAsB,EAAE,OAAO,CAAC;IAChC;;OAEG;IACH,0BAA0B,EAAE,OAAO,CAAC;IACpC;;OAEG;IACH,mBAAmB,EAAE,OAAO,CAAC;CAC9B;AAqBD;;;;;GAKG;AACH,MAAM,WAAW,eAAgB,SAAQ,OAAO,CAAC,oBAAoB,CAAC;IACpE,CAAC,WAAW,EAAE,MAAM,GAAG,GAAG,CAAC;CAC5B;AAuDD;;GAEG;AACH,wBAAgB,kBAAkB,oBAEjC;AAED;;;GAGG;AACH,MAAM,WAAW,4BAA4B;IAC3C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,eAAe,CAAC;CAC5B;AAGD,KAAK,aAAa,GAAG,4BAA4B,CAAC;AAElD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,aAAa,qBAiB3D"}
|
|
@@ -21,6 +21,7 @@ const knownFeaturesObject = {
|
|
|
21
21
|
allowBearingLettersInAccuDrawInputFields: undefined,
|
|
22
22
|
reparentPopoutWidgets: undefined,
|
|
23
23
|
controlWidgetVisibility: undefined,
|
|
24
|
+
widgetTabActions: undefined,
|
|
24
25
|
toolSettingsNewEditors: undefined,
|
|
25
26
|
toolSettingsLockButton: undefined,
|
|
26
27
|
toolSettingsKeyPressCommit: undefined,
|
|
@@ -85,9 +86,10 @@ export function usePreviewFeatures() {
|
|
|
85
86
|
* </Provider>
|
|
86
87
|
* </PreviewFeaturesProvider>
|
|
87
88
|
* ```
|
|
88
|
-
* @
|
|
89
|
+
* @public
|
|
89
90
|
*/
|
|
90
|
-
export function PreviewFeaturesProvider(
|
|
91
|
+
export function PreviewFeaturesProvider(props) {
|
|
92
|
+
const { children, features } = props;
|
|
91
93
|
const setPreviewFeatures = usePreviewFeaturesStore((state) => state.setPreviewFeatures);
|
|
92
94
|
React.useEffect(() => {
|
|
93
95
|
setPreviewFeatures(features ?? {});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PreviewFeatures.js","sourceRoot":"","sources":["../../../src/appui-react/preview/PreviewFeatures.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AA0EhD;;GAEG;AACH,MAAM,mBAAmB,GAAkD;IACzE,oBAAoB,EAAE,SAAS;IAC/B,6BAA6B,EAAE,SAAS;IACxC,0BAA0B,EAAE,SAAS;IACrC,wBAAwB,EAAE,SAAS;IACnC,oBAAoB,EAAE,SAAS;IAC/B,wCAAwC,EAAE,SAAS;IACnD,qBAAqB,EAAE,SAAS;IAChC,uBAAuB,EAAE,SAAS;IAClC,sBAAsB,EAAE,SAAS;IACjC,sBAAsB,EAAE,SAAS;IACjC,0BAA0B,EAAE,SAAS;IACrC,mBAAmB,EAAE,SAAS;CAC/B,CAAC;AAYF;;;;GAIG;AACH,SAAS,uBAAuB,CAAC,eAAgC;IAC/D,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAC1D,MAAM,CAAC,aAAa,EAAE,eAAe,CAAC,GAAG,MAAM,CAAC,OAAO,CACrD,eAAe,CAChB,CAAC,MAAM,CACN,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;QACjC,IAAI,gBAAgB,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YACnC,KAAK,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QACrB,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACpB,CAAC;QACD,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAC1B,CAAC,EACD,CAAC,EAAE,EAAE,EAAE,CAAgC,CACxC,CAAC;IACF,IAAI,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAC5C,MAAM,CAAC,UAAU,CACf,WAAW,CAAC,cAAc,CAAC,yBAAyB,CAAC,EACrD,2EAA2E,EAC3E;YACE,eAAe;SAChB,CACF,CAAC;IACJ,CAAC;IACD,OAAO,aAAa,CAAC;AACvB,CAAC;AAOD;;;;;GAKG;AACH,MAAM,uBAAuB,GAAG,MAAM,CAAuB,CAAC,GAAG,EAAE,EAAE;IACnE,OAAO;QACL,eAAe,EAAE,EAAE;QACnB,kBAAkB,EAAE,CAAC,kBAAmC,EAAE,EAAE;YAC1D,MAAM,eAAe,GAAG,uBAAuB,CAAC,kBAAkB,CAAC,CAAC;YACpE,GAAG,CAAC,EAAE,eAAe,EAAE,CAAC,CAAC;QAC3B,CAAC;KACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,UAAU,kBAAkB;IAChC,OAAO,uBAAuB,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;AACnE,CAAC;AAUD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,uBAAuB,CAAC,EACtC,QAAQ,EACR,QAAQ,GACqB;IAC7B,MAAM,kBAAkB,GAAG,uBAAuB,CAChD,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,kBAAkB,CACpC,CAAC;IACF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,kBAAkB,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAEnC,0CAA0C;IAC1C,KAAK,CAAC,SAAS,CACb,GAAG,EAAE,CAAC,GAAG,EAAE;QACT,kBAAkB,CAAC,EAAE,CAAC,CAAC;IACzB,CAAC,EACD,CAAC,kBAAkB,CAAC,CACrB,CAAC;IACF,OAAO,0CAAG,QAAQ,CAAI,CAAC;AACzB,CAAC","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 Utilities\n */\n\nimport * as React from \"react\";\nimport { create } from \"zustand\";\nimport { Logger } from \"@itwin/core-bentley\";\nimport { UiFramework } from \"../UiFramework.js\";\nimport type { useTransientState } from \"../widget-panels/useTransientState.js\";\nimport type { WidgetDef } from \"../widgets/WidgetDef.js\";\nimport type { UiItemsManager } from \"../ui-items-provider/UiItemsManager.js\";\n\n/** List of known preview features. */\ninterface KnownPreviewFeatures {\n /** If `true`, the panels and tool settings will always be rendered over the content.\n * The content will never change size.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/672\n */\n contentAlwaysMaxSize: boolean;\n /** If `true`, the floating widget will have a \"maximize\" button. Use `enableMaximizedPanelWidget` to enable the feature for panel widgets.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/673\n */\n enableMaximizedFloatingWidget: boolean;\n /** If `true`, the panel widget will have a \"maximize\" button. Use `enableMaximizedFloatingWidget` to enable the feature for floating widgets.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/673\n */\n enableMaximizedPanelWidget: boolean;\n /** If `true`, the horizontal panels will have an additional \"Align\" button.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/706\n */\n horizontalPanelAlignment: boolean;\n /** If enabled, a dropdown menu will be rendered for widgets that exceed the specified threshold of title bar buttons.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/723\n */\n widgetActionDropdown: { threshold: number };\n /** If `true`, the accudraw input field will accept some letters for bearing angle. Defaults to `false`.\n *\n * This allows to type letters for Bearing angles in the accudraw input field. (N, S, E, W)\n */\n allowBearingLettersInAccuDrawInputFields: boolean;\n /** If `true`, popout widgets will not be rendered in a separate element tree, instead widget content will be re-parented to a popout content container.\n * Alternatively, an array of widget ids can be specified to only re-parent specific widgets.\n * @note Use {@link useTransientState} to save and restore DOM transient state when re-parenting widgets.\n * @note There is a known limitation where iTwinUI v2 popover elements will be rendered in the main window. Prefer using iTwinUI v3 when using this feature.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/925\n */\n reparentPopoutWidgets: boolean | WidgetDef[\"id\"][];\n /** If `true`, additional UI elements are rendered to allow the end user of the layout to control widget visibility.\n * Alternatively, an array of widget ids can be specified to only control specific widgets.\n * @note Use {@link UiItemsManager} APIs to manage what widgets are available to the end-user.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/859\n */\n controlWidgetVisibility: boolean | WidgetDef[\"id\"][];\n /**\n * If `true`, the tool settings will be using the new editor API. The new system delivers same default editors as the old one.\n * However, in order to use custom editors they need to be provided using `EditorsRegistryProvider` component.\n */\n toolSettingsNewEditors: boolean;\n /**\n * If `true`, the default tool settings lock editor will be rendered as an icon button rather than a checkbox.\n * Consumers can still use a custom component to render the lock by customizing the `PropertyDescription`.\n * Additionally, the icon button will be rendered as an input decoration in editors that support it.\n */\n toolSettingsLockButton: boolean;\n /**\n * If `true`, the input-like editors rendered in the tool settings will commit the entered value on key press.\n */\n toolSettingsKeyPressCommit: boolean;\n /**\n * If `true`, the content layout will not re-mount given the same configuration.\n */\n stableContentLayout: boolean;\n}\n\n/** Object used trim to only known features at runtime.\n * @internal\n */\nconst knownFeaturesObject: Record<keyof KnownPreviewFeatures, undefined> = {\n contentAlwaysMaxSize: undefined,\n enableMaximizedFloatingWidget: undefined,\n enableMaximizedPanelWidget: undefined,\n horizontalPanelAlignment: undefined,\n widgetActionDropdown: undefined,\n allowBearingLettersInAccuDrawInputFields: undefined,\n reparentPopoutWidgets: undefined,\n controlWidgetVisibility: undefined,\n toolSettingsNewEditors: undefined,\n toolSettingsLockButton: undefined,\n toolSettingsKeyPressCommit: undefined,\n stableContentLayout: undefined,\n};\n\n/** List of preview features that can be enabled/disabled.\n * This list is expected to change over time, the interface is made\n * so that new features can be added or removed without breaking existing code.\n * A console warning will simply appear if unknown features are passed.\n * @beta\n */\nexport interface PreviewFeatures extends Partial<KnownPreviewFeatures> {\n [featureName: string]: any;\n}\n\n/** Trim an object to only contain known feature keys.\n * @param previewFeatures object potentially containing unknown features\n * @returns object containing only known features\n * @internal\n */\nfunction trimToKnownFeaturesOnly(previewFeatures: PreviewFeatures) {\n const knownFeatureKeys = Object.keys(knownFeaturesObject);\n const [knownFeatures, unknownFeatures] = Object.entries(\n previewFeatures\n ).reduce(\n ([known, unknown], [key, value]) => {\n if (knownFeatureKeys.includes(key)) {\n known[key] = value;\n } else {\n unknown.push(key);\n }\n return [known, unknown];\n },\n [{}, []] as [PreviewFeatures, string[]]\n );\n if (Object.keys(unknownFeatures).length > 0) {\n Logger.logWarning(\n UiFramework.loggerCategory(\"trimToKnownFeaturesOnly\"),\n `Features used in \"setPreviewFeatures\" are unknown or no longer in preview`,\n {\n unknownFeatures,\n }\n );\n }\n return knownFeatures;\n}\n\ninterface PreviewFeaturesState {\n previewFeatures: PreviewFeatures;\n setPreviewFeatures: (previewFeatures: PreviewFeatures) => void;\n}\n\n/** Preview features store used by `UiFramework.previewFeatures` and `UiFramework.setPreviewFeatures()` APIs to manage the preview features.\n * Use `usePreviewFeatures` hook to access the preview features set from a react component.\n * Use `usePreviewFeaturesStore.getState().previewFeatures` to access the preview features set from a non-react component.\n * Use `usePreviewFeaturesStore.subscribe()` to subscribe to changes to the preview features set from a non-react component.\n * @internal\n */\nconst usePreviewFeaturesStore = create<PreviewFeaturesState>((set) => {\n return {\n previewFeatures: {},\n setPreviewFeatures: (newPreviewFeatures: PreviewFeatures) => {\n const previewFeatures = trimToKnownFeaturesOnly(newPreviewFeatures);\n set({ previewFeatures });\n },\n };\n});\n\n/** Hook to access the preview features set.\n * @internal\n */\nexport function usePreviewFeatures() {\n return usePreviewFeaturesStore((state) => state.previewFeatures);\n}\n\n/** Props for PreviewFeaturesProvider.\n * @beta\n */\nexport interface PreviewFeaturesProviderProps {\n children?: React.ReactNode;\n features?: PreviewFeatures;\n}\n\n/** Set which preview features are enabled. These features are not yet ready for production use nor have\n * a proper API defined yet.\n * The available set of features are defined in the [[PreviewFeatures]] interface.\n *\n * This component should wrap the Provider component.\n *\n * ```tsx\n * <PreviewFeaturesProvider features={{ enableMaximizedFloatingWidget: true }}>\n * <Provider store={UiFramework.store}>\n * [...]\n * <ConfigurableUIContent />\n * [/...]\n * </Provider>\n * </PreviewFeaturesProvider>\n * ```\n * @beta\n */\nexport function PreviewFeaturesProvider({\n children,\n features,\n}: PreviewFeaturesProviderProps) {\n const setPreviewFeatures = usePreviewFeaturesStore(\n (state) => state.setPreviewFeatures\n );\n React.useEffect(() => {\n setPreviewFeatures(features ?? {});\n }, [features, setPreviewFeatures]);\n\n // Clear preview features when unmounting.\n React.useEffect(\n () => () => {\n setPreviewFeatures({});\n },\n [setPreviewFeatures]\n );\n return <>{children}</>;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"PreviewFeatures.js","sourceRoot":"","sources":["../../../src/appui-react/preview/PreviewFeatures.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 Utilities\n */\n\nimport * as React from \"react\";\nimport { create } from \"zustand\";\nimport { Logger } from \"@itwin/core-bentley\";\nimport { UiFramework } from \"../UiFramework.js\";\nimport type { useTransientState } from \"../widget-panels/useTransientState.js\";\nimport type { WidgetDef } from \"../widgets/WidgetDef.js\";\nimport type { UiItemsManager } from \"../ui-items-provider/UiItemsManager.js\";\n\n/** List of known preview features. */\ninterface KnownPreviewFeatures {\n /** If `true`, the panels and tool settings will always be rendered over the content.\n * The content will never change size.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/672\n */\n contentAlwaysMaxSize: boolean;\n /** If `true`, the floating widget will have a \"maximize\" button. Use `enableMaximizedPanelWidget` to enable the feature for panel widgets.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/673\n */\n enableMaximizedFloatingWidget: boolean;\n /** If `true`, the panel widget will have a \"maximize\" button. Use `enableMaximizedFloatingWidget` to enable the feature for floating widgets.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/673\n */\n enableMaximizedPanelWidget: boolean;\n /** If `true`, the horizontal panels will have an additional \"Align\" button.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/706\n */\n horizontalPanelAlignment: boolean;\n /** If enabled, a dropdown menu will be rendered for widgets that exceed the specified threshold of title bar buttons.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/723\n */\n widgetActionDropdown: { threshold: number };\n /** If `true`, the accudraw input field will accept some letters for bearing angle. Defaults to `false`.\n *\n * This allows to type letters for Bearing angles in the accudraw input field. (N, S, E, W)\n */\n allowBearingLettersInAccuDrawInputFields: boolean;\n /** If `true`, popout widgets will not be rendered in a separate element tree, instead widget content will be re-parented to a popout content container.\n * Alternatively, an array of widget ids can be specified to only re-parent specific widgets.\n * @note Use {@link useTransientState} to save and restore DOM transient state when re-parenting widgets.\n * @note There is a known limitation where iTwinUI v2 popover elements will be rendered in the main window. Prefer using iTwinUI v3 when using this feature.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/925\n */\n reparentPopoutWidgets: boolean | WidgetDef[\"id\"][];\n /** If `true`, additional UI elements are rendered to allow the end user of the layout to control widget visibility.\n * Alternatively, an array of widget ids can be specified to only control specific widgets.\n * @note Use {@link UiItemsManager} APIs to manage what widgets are available to the end-user.\n *\n * Discuss or upvote this feature: https://github.com/iTwin/appui/discussions/859\n */\n controlWidgetVisibility: boolean | WidgetDef[\"id\"][];\n /** If `true`, widget tab actions are displayed for individual tabs instead of the default behavior where only active tab actions are exposed.\n * Note that this feature replaces the overflow dropdown menu with a scrollable container to display all tab actions.\n *\n * Close button will be shown in widget tab when `controlWidgetVisibility` preview feature is enabled.\n */\n widgetTabActions: boolean;\n /**\n * If `true`, the tool settings will be using the new editor API. The new system delivers same default editors as the old one.\n * However, in order to use custom editors they need to be provided using `EditorsRegistryProvider` component.\n */\n toolSettingsNewEditors: boolean;\n /**\n * If `true`, the default tool settings lock editor will be rendered as an icon button rather than a checkbox.\n * Consumers can still use a custom component to render the lock by customizing the `PropertyDescription`.\n * Additionally, the icon button will be rendered as an input decoration in editors that support it.\n */\n toolSettingsLockButton: boolean;\n /**\n * If `true`, the input-like editors rendered in the tool settings will commit the entered value on key press.\n */\n toolSettingsKeyPressCommit: boolean;\n /**\n * If `true`, the content layout will not re-mount given the same configuration.\n */\n stableContentLayout: boolean;\n}\n\n/** Object used trim to only known features at runtime.\n * @internal\n */\nconst knownFeaturesObject: Record<keyof KnownPreviewFeatures, undefined> = {\n contentAlwaysMaxSize: undefined,\n enableMaximizedFloatingWidget: undefined,\n enableMaximizedPanelWidget: undefined,\n horizontalPanelAlignment: undefined,\n widgetActionDropdown: undefined,\n allowBearingLettersInAccuDrawInputFields: undefined,\n reparentPopoutWidgets: undefined,\n controlWidgetVisibility: undefined,\n widgetTabActions: undefined,\n toolSettingsNewEditors: undefined,\n toolSettingsLockButton: undefined,\n toolSettingsKeyPressCommit: undefined,\n stableContentLayout: undefined,\n};\n\n/** List of preview features that can be enabled/disabled.\n * This list is expected to change over time, the interface is made\n * so that new features can be added or removed without breaking existing code.\n * A console warning will simply appear if unknown features are passed.\n * @public\n */\nexport interface PreviewFeatures extends Partial<KnownPreviewFeatures> {\n [featureName: string]: any;\n}\n\n/** Trim an object to only contain known feature keys.\n * @param previewFeatures object potentially containing unknown features\n * @returns object containing only known features\n * @internal\n */\nfunction trimToKnownFeaturesOnly(previewFeatures: PreviewFeatures) {\n const knownFeatureKeys = Object.keys(knownFeaturesObject);\n const [knownFeatures, unknownFeatures] = Object.entries(\n previewFeatures\n ).reduce(\n ([known, unknown], [key, value]) => {\n if (knownFeatureKeys.includes(key)) {\n known[key] = value;\n } else {\n unknown.push(key);\n }\n return [known, unknown];\n },\n [{}, []] as [PreviewFeatures, string[]]\n );\n if (Object.keys(unknownFeatures).length > 0) {\n Logger.logWarning(\n UiFramework.loggerCategory(\"trimToKnownFeaturesOnly\"),\n `Features used in \"setPreviewFeatures\" are unknown or no longer in preview`,\n {\n unknownFeatures,\n }\n );\n }\n return knownFeatures;\n}\n\ninterface PreviewFeaturesState {\n previewFeatures: PreviewFeatures;\n setPreviewFeatures: (previewFeatures: PreviewFeatures) => void;\n}\n\n/** Preview features store used by `UiFramework.previewFeatures` and `UiFramework.setPreviewFeatures()` APIs to manage the preview features.\n * Use `usePreviewFeatures` hook to access the preview features set from a react component.\n * Use `usePreviewFeaturesStore.getState().previewFeatures` to access the preview features set from a non-react component.\n * Use `usePreviewFeaturesStore.subscribe()` to subscribe to changes to the preview features set from a non-react component.\n * @internal\n */\nconst usePreviewFeaturesStore = create<PreviewFeaturesState>((set) => {\n return {\n previewFeatures: {},\n setPreviewFeatures: (newPreviewFeatures: PreviewFeatures) => {\n const previewFeatures = trimToKnownFeaturesOnly(newPreviewFeatures);\n set({ previewFeatures });\n },\n };\n});\n\n/** Hook to access the preview features set.\n * @internal\n */\nexport function usePreviewFeatures() {\n return usePreviewFeaturesStore((state) => state.previewFeatures);\n}\n\n/** Props for PreviewFeaturesProvider.\n * @beta\n * @deprecated in 5.26.0. Use `React.ComponentProps<typeof PreviewFeaturesProvider>`\n */\nexport interface PreviewFeaturesProviderProps {\n children?: React.ReactNode;\n features?: PreviewFeatures;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\ntype ProviderProps = PreviewFeaturesProviderProps;\n\n/** Set which preview features are enabled. These features are not yet ready for production use nor have\n * a proper API defined yet.\n * The available set of features are defined in the [[PreviewFeatures]] interface.\n *\n * This component should wrap the Provider component.\n *\n * ```tsx\n * <PreviewFeaturesProvider features={{ enableMaximizedFloatingWidget: true }}>\n * <Provider store={UiFramework.store}>\n * [...]\n * <ConfigurableUIContent />\n * [/...]\n * </Provider>\n * </PreviewFeaturesProvider>\n * ```\n * @public\n */\nexport function PreviewFeaturesProvider(props: ProviderProps) {\n const { children, features } = props;\n const setPreviewFeatures = usePreviewFeaturesStore(\n (state) => state.setPreviewFeatures\n );\n React.useEffect(() => {\n setPreviewFeatures(features ?? {});\n }, [features, setPreviewFeatures]);\n\n // Clear preview features when unmounting.\n React.useEffect(\n () => () => {\n setPreviewFeatures({});\n },\n [setPreviewFeatures]\n );\n return <>{children}</>;\n}\n"]}
|
|
@@ -2,8 +2,11 @@
|
|
|
2
2
|
* @module Widget
|
|
3
3
|
*/
|
|
4
4
|
import * as React from "react";
|
|
5
|
+
import type { TabState } from "../../layout/state/TabState.js";
|
|
5
6
|
/** @internal */
|
|
6
7
|
export declare function CloseWidgetButton(): React.JSX.Element;
|
|
7
8
|
/** @internal */
|
|
9
|
+
export declare function useControlWidgetVisibility(id: TabState["id"]): boolean;
|
|
10
|
+
/** @internal */
|
|
8
11
|
export declare function useCloseTab(): boolean;
|
|
9
12
|
//# sourceMappingURL=CloseWidgetButton.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CloseWidgetButton.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/preview/control-widget-visibility/CloseWidgetButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CloseWidgetButton.d.ts","sourceRoot":"","sources":["../../../../src/appui-react/preview/control-widget-visibility/CloseWidgetButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE/D,gBAAgB;AAChB,wBAAgB,iBAAiB,sBAgBhC;AAED,gBAAgB;AAChB,wBAAgB,0BAA0B,CAAC,EAAE,EAAE,QAAQ,CAAC,IAAI,CAAC,WAM5D;AAED,gBAAgB;AAChB,wBAAgB,WAAW,YAO1B"}
|
|
@@ -23,12 +23,21 @@ export function CloseWidgetButton() {
|
|
|
23
23
|
} }));
|
|
24
24
|
}
|
|
25
25
|
/** @internal */
|
|
26
|
-
export function
|
|
27
|
-
const id = useActiveTabId();
|
|
26
|
+
export function useControlWidgetVisibility(id) {
|
|
28
27
|
const { controlWidgetVisibility } = usePreviewFeatures();
|
|
29
28
|
if (Array.isArray(controlWidgetVisibility)) {
|
|
30
29
|
return controlWidgetVisibility.includes(id);
|
|
31
30
|
}
|
|
32
31
|
return !!controlWidgetVisibility;
|
|
33
32
|
}
|
|
33
|
+
/** @internal */
|
|
34
|
+
export function useCloseTab() {
|
|
35
|
+
const id = useActiveTabId();
|
|
36
|
+
const controlWidgetVisibility = useControlWidgetVisibility(id);
|
|
37
|
+
const { widgetTabActions } = usePreviewFeatures();
|
|
38
|
+
// Close tab button is displayed for each individual tab.
|
|
39
|
+
if (widgetTabActions)
|
|
40
|
+
return false;
|
|
41
|
+
return controlWidgetVisibility;
|
|
42
|
+
}
|
|
34
43
|
//# sourceMappingURL=CloseWidgetButton.js.map
|