@onerjs/shared-ui-components 8.48.4 → 8.48.5

package/modularTool/services/shellService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shellService.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/modularTool/services/shellService.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\r\n    type MenuTriggerProps,\r\n    Button,\r\n    Divider,\r\n    Toolbar as FluentToolbar,\r\n    makeStyles,\r\n    Menu,\r\n    MenuGroup,\r\n    MenuGroupHeader,\r\n    MenuItem,\r\n    MenuList,\r\n    MenuPopover,\r\n    MenuTrigger,\r\n    mergeClasses,\r\n    SplitButton,\r\n    Subtitle2Stronger,\r\n    tokens,\r\n    ToolbarRadioButton,\r\n} from \"@fluentui/react-components\";\r\nimport { type ComponentType, type FunctionComponent, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from \"react\";\r\n\r\nimport { type IDisposable, type Nullable } from \"core/index\";\r\nimport { type IService, type ServiceDefinition } from \"../modularity/serviceDefinition\";\r\nimport { type SettingDescriptor } from \"./settingsStore\";\r\n\r\nimport {\r\n    LayoutColumnTwoFocusLeftFilled,\r\n    LayoutColumnTwoFocusRightFilled,\r\n    LayoutColumnTwoSplitLeftFocusBottomLeftFilled,\r\n    LayoutColumnTwoSplitLeftFocusTopLeftFilled,\r\n    LayoutColumnTwoSplitRightFocusBottomRightFilled,\r\n    LayoutColumnTwoSplitRightFocusTopRightFilled,\r\n    MoreHorizontalRegular,\r\n    PanelLeftContractRegular,\r\n    PanelLeftExpandRegular,\r\n    PanelRightContractRegular,\r\n    PanelRightExpandRegular,\r\n    PictureInPictureEnterRegular,\r\n} from \"@fluentui/react-icons\";\r\nimport { Fade as FluentFade } from \"@fluentui/react-motion-components-preview\";\r\n\r\nimport { Observable } from \"core/Misc/observable\";\r\nimport { ChildWindow } from \"shared-ui-components/fluent/hoc/childWindow\";\r\nimport { Collapse } from \"shared-ui-components/fluent/primitives/collapse\";\r\nimport { Tooltip } from \"shared-ui-components/fluent/primitives/tooltip\";\r\nimport { ErrorBoundary } from \"../components/errorBoundary\";\r\nimport { TeachingMoment } from \"../components/teachingMoment\";\r\nimport { Theme } from \"../components/theme\";\r\nimport { useOrderedObservableCollection } from \"../hooks/observableHooks\";\r\nimport { useSetting } from \"../hooks/settingsHooks\";\r\nimport { MakePopoverTeachingMoment } from \"../hooks/teachingMomentHooks\";\r\nimport { useResizeHandle } from \"../hooks/useResizeHandle\";\r\nimport { ObservableCollection } from \"../misc/observableCollection\";\r\n\r\n/**\r\n * Setting descriptor for persisting side pane dock location overrides.\r\n */\r\nexport const SidePaneDockOverridesSettingDescriptor: SettingDescriptor<\r\n    Record<string, Readonly<{ horizontalLocation: HorizontalLocation; verticalLocation: VerticalLocation }> | undefined>\r\n> = {\r\n    key: \"SidePaneDockOverrides\",\r\n    defaultValue: {},\r\n};\r\n\r\n/**\r\n * Setting descriptor for persisting the left side pane width adjustment.\r\n */\r\nexport const LeftSidePaneWidthAdjustSettingDescriptor: SettingDescriptor<number> = {\r\n    key: \"Shell/LeftPane/WidthAdjust\",\r\n    defaultValue: 0,\r\n};\r\n\r\n/**\r\n * Setting descriptor for persisting the left side pane height adjustment.\r\n */\r\nexport const LeftSidePaneHeightAdjustSettingDescriptor: SettingDescriptor<number> = {\r\n    key: \"Shell/LeftPane/HeightAdjust\",\r\n    defaultValue: 0,\r\n};\r\n\r\n/**\r\n * Setting descriptor for persisting the right side pane width adjustment.\r\n */\r\nexport const RightSidePaneWidthAdjustSettingDescriptor: SettingDescriptor<number> = {\r\n    key: \"Shell/RightPane/WidthAdjust\",\r\n    defaultValue: 0,\r\n};\r\n\r\n/**\r\n * Setting descriptor for persisting the right side pane height adjustment.\r\n */\r\nexport const RightSidePaneHeightAdjustSettingDescriptor: SettingDescriptor<number> = {\r\n    key: \"Shell/RightPane/HeightAdjust\",\r\n    defaultValue: 0,\r\n};\r\n\r\n/**\r\n * Represents a horizontal location in the shell layout.\r\n */\r\nexport type HorizontalLocation = \"left\" | \"right\";\r\n\r\n/**\r\n * Represents a vertical location in the shell layout.\r\n */\r\nexport type VerticalLocation = \"top\" | \"bottom\";\r\n\r\ntype TeachingMomentInfo = boolean | { readonly title: string; readonly description: string };\r\n\r\ntype DockLocation = `${VerticalLocation}-${HorizontalLocation}` | `full-${HorizontalLocation}`;\r\n\r\n/**\r\n * Describes an item that can be added to one of the shell's toolbars.\r\n */\r\nexport type ToolbarItemDefinition = {\r\n    /**\r\n     * A unique key for the toolbar item.\r\n     */\r\n    key: string;\r\n\r\n    /**\r\n     * The component to render for the toolbar item.\r\n     */\r\n    component: ComponentType;\r\n\r\n    /**\r\n     * An optional order for the toolbar item, relative to other items.\r\n     * Defaults to 0.\r\n     */\r\n    order?: number;\r\n\r\n    /**\r\n     * The horizontal location of the toolbar item.\r\n     * Can be either \"left\" or \"right\".\r\n     * In \"compact\" toolbar mode, \"left\" and \"right\" mean the \"compact\" toolbars at the top/bottom of the left/right side panes.\r\n     * In \"full\" toolbar mode, \"left\" and \"right\" mean the left side and right side of the full width toolbars above/below the side panes.\r\n     */\r\n    horizontalLocation: HorizontalLocation;\r\n\r\n    /**\r\n     * The vertical location of the toolbar item.\r\n     * Can be either \"top\" or \"bottom\".\r\n     */\r\n    verticalLocation: VerticalLocation;\r\n\r\n    /**\r\n     * An optional display name for the toolbar item, used for teaching moments, tooltips, etc.\r\n     */\r\n    displayName?: string;\r\n\r\n    /**\r\n     * An optional teaching moment info. The default assumes the toolbar item was added by an extension and provides a generic title and description based on the display name or id, which is helpful for discoverability of new items.\r\n     * Set this to false to suppress the teaching moment, which may be desirable for built in items or items that are added in a non-dynamic way.\r\n     * Set it to an object with a title and description to provide a custom teaching moment, which may be desirable if the generic title and description are not sufficient.\r\n     * Teaching moments are more helpful for dynamically added items, possibly from extensions.\r\n     */\r\n    teachingMoment?: TeachingMomentInfo;\r\n};\r\n\r\n/**\r\n * Describes a side pane that can be added to the shell's left or right side.\r\n */\r\nexport type SidePaneDefinition = {\r\n    /**\r\n     * A unique key for the side pane.\r\n     */\r\n    key: string;\r\n\r\n    /**\r\n     * An icon component to render for the pane tab.\r\n     */\r\n    icon: ComponentType;\r\n\r\n    /**\r\n     * The component to render for the side pane's content.\r\n     */\r\n    content: ComponentType;\r\n\r\n    /**\r\n     * An optional order for the side pane, relative to other panes.\r\n     * Defaults to 0.\r\n     */\r\n    order?: number;\r\n\r\n    /**\r\n     * The horizontal location of the side pane.\r\n     * Can be either \"left\" or \"right\".\r\n     */\r\n    horizontalLocation: HorizontalLocation;\r\n\r\n    /**\r\n     * The vertical location of the side pane.\r\n     * Can be either \"top\" or \"bottom\".\r\n     */\r\n    verticalLocation: VerticalLocation;\r\n\r\n    /**\r\n     * The title of the side pane, displayed as a standardized header at the top of the pane.\r\n     */\r\n    title: string;\r\n\r\n    /**\r\n     * An optional teaching moment info. The default assumes the side pane was added by an extension and provides a generic title and description based on the display name or id, which is helpful for discoverability of new items.\r\n     * Set this to false to suppress the teaching moment, which may be desirable for built in items or items that are added in a non-dynamic way.\r\n     * Set it to an object with a title and description to provide a custom teaching moment, which may be desirable if the generic title and description are not sufficient.\r\n     * Teaching moments are more helpful for dynamically added panes, possibly from extensions.\r\n     */\r\n    teachingMoment?: TeachingMomentInfo;\r\n\r\n    /**\r\n     * Keep the pane mounted even when it is not visible. This is useful if you don't want the\r\n     * user to lose the complex visual state when switching between tabs.\r\n     */\r\n    keepMounted?: boolean;\r\n};\r\n\r\ntype RegisteredSidePane = {\r\n    readonly key: string;\r\n    select(): void;\r\n};\r\n\r\ntype SidePaneContainer = {\r\n    readonly isDocked: boolean;\r\n    dock(): void;\r\n    undock(): void;\r\n    readonly isCollapsed: boolean;\r\n    collapse(): void;\r\n    expand(): void;\r\n};\r\n\r\n/**\r\n * Describes content that can be added to the shell's central area (between the side panes and toolbars - e.g. the main content).\r\n */\r\nexport type CentralContentDefinition = {\r\n    /**\r\n     * A unique key for the central content.\r\n     */\r\n    key: string;\r\n\r\n    /**\r\n     * The component to render for the central content.\r\n     */\r\n    component: ComponentType;\r\n\r\n    /**\r\n     * An optional order for content, relative to other central content.\r\n     * Defaults to 0.\r\n     */\r\n    order?: number;\r\n};\r\n\r\n/**\r\n * The unique identity symbol for the root component service.\r\n */\r\nexport const RootComponentServiceIdentity = Symbol(\"RootComponent\");\r\n\r\n/**\r\n * Exposes a top level component that should be rendered as the React root.\r\n */\r\nexport interface IRootComponentService extends IService<typeof RootComponentServiceIdentity> {\r\n    /**\r\n     * The root component that should be rendered as the React root.\r\n     */\r\n    readonly rootComponent: ComponentType;\r\n}\r\n\r\n/**\r\n * The unique identity symbol for the shell service.\r\n */\r\nexport const ShellServiceIdentity = Symbol(\"ShellService\");\r\n\r\n/**\r\n * Provides a shell for the application, including toolbars, side panes, and central content.\r\n * This service allows adding toolbar items, side panes, and central content dynamically.\r\n */\r\nexport interface IShellService extends IService<typeof ShellServiceIdentity> {\r\n    /**\r\n     * Adds a new item to one of the shell's toolbars.\r\n     * @param item Defines the item to add.\r\n     */\r\n    addToolbarItem(item: Readonly<ToolbarItemDefinition>): IDisposable;\r\n\r\n    /**\r\n     * Adds a new side pane to the shell.\r\n     * @param pane Defines the side pane to add.\r\n     */\r\n    addSidePane(pane: Readonly<SidePaneDefinition>): IDisposable;\r\n\r\n    /**\r\n     * Adds new central content to the shell.\r\n     * @param content Defines the content area to add.\r\n     */\r\n    addCentralContent(content: Readonly<CentralContentDefinition>): IDisposable;\r\n\r\n    /**\r\n     * The left side pane container.\r\n     */\r\n    readonly leftSidePaneContainer: Nullable<SidePaneContainer>;\r\n\r\n    /**\r\n     * The right side pane container.\r\n     */\r\n    readonly rightSidePaneContainer: Nullable<SidePaneContainer>;\r\n\r\n    /**\r\n     * The side panes currently present in the shell.\r\n     */\r\n    readonly sidePanes: readonly RegisteredSidePane[];\r\n}\r\n\r\ntype ToolbarMode = \"full\" | \"compact\";\r\n\r\n/**\r\n * Options for configuring the shell service.\r\n */\r\nexport type ShellServiceOptions = {\r\n    /**\r\n     * The default width of the left side pane.\r\n     */\r\n    leftPaneDefaultWidth?: number;\r\n\r\n    /**\r\n     * The minimum width of the left side pane.\r\n     */\r\n    leftPaneMinWidth?: number;\r\n\r\n    /**\r\n     * The default width of the right side pane.\r\n     */\r\n    rightPaneDefaultWidth?: number;\r\n\r\n    /**\r\n     * The minimum width of the right side pane.\r\n     */\r\n    rightPaneMinWidth?: number;\r\n\r\n    /**\r\n     * The mode of the toolbars.\r\n     * Can be either \"full\" (default) or \"compact\".\r\n     * In \"full\" mode, toolbars are displayed above and below the side panes.\r\n     * In \"compact\" mode, toolbars are displayed at the top and bottom of the left and right side panes.\r\n     */\r\n    toolbarMode?: ToolbarMode;\r\n\r\n    /**\r\n     * Whether the left side pane should start collapsed. Default is false.\r\n     */\r\n    leftPaneDefaultCollapsed?: boolean;\r\n\r\n    /**\r\n     * Whether the right side pane should start collapsed. Default is false.\r\n     */\r\n    rightPaneDefaultCollapsed?: boolean;\r\n\r\n    /**\r\n     * A function that can remap the default location of side panes.\r\n     * @param sidePane The side pane to remap.\r\n     * @returns The new location for the side pane.\r\n     */\r\n    sidePaneRemapper?: (sidePane: Readonly<SidePaneDefinition>) => Nullable<{ horizontalLocation: HorizontalLocation; verticalLocation: VerticalLocation }>;\r\n};\r\n\r\nconst useStyles = makeStyles({\r\n    mainView: {\r\n        flex: 1,\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        overflow: \"hidden\",\r\n        backgroundColor: tokens.colorTransparentBackground,\r\n    },\r\n    verticallyCentralContent: {\r\n        flexGrow: 1,\r\n        display: \"flex\",\r\n        overflow: \"hidden\",\r\n        backgroundColor: tokens.colorTransparentBackground,\r\n    },\r\n    barDiv: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        flex: \"0 0 auto\",\r\n        height: \"36px\",\r\n        backgroundColor: tokens.colorNeutralBackground2,\r\n        pointerEvents: \"auto\",\r\n    },\r\n    bar: {\r\n        display: \"flex\",\r\n        flex: \"1\",\r\n        overflow: \"hidden\",\r\n        padding: `${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalXXS}`,\r\n        borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\r\n        backgroundColor: tokens.colorNeutralBackground2,\r\n    },\r\n    barTop: {\r\n        borderTopWidth: 0,\r\n    },\r\n    barBottom: {\r\n        borderTop: `1px solid ${tokens.colorNeutralStroke2}`,\r\n    },\r\n    barLeft: {\r\n        marginRight: \"auto\",\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        flexDirection: \"row\",\r\n        columnGap: tokens.spacingHorizontalSNudge,\r\n    },\r\n    barRight: {\r\n        marginLeft: \"auto\",\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        flexDirection: \"row-reverse\",\r\n        columnGap: tokens.spacingHorizontalSNudge,\r\n    },\r\n    barItem: {\r\n        display: \"flex\",\r\n    },\r\n    paneTabListDiv: {\r\n        backgroundColor: tokens.colorNeutralBackground1,\r\n        flex: \"0 0 auto\",\r\n        display: \"flex\",\r\n    },\r\n    paneTabListDivLeft: {\r\n        flexDirection: \"row-reverse\",\r\n    },\r\n    paneTabListDivRight: {\r\n        flexDirection: \"row\",\r\n    },\r\n    paneCollapseButton: {\r\n        padding: `0 0 0 ${tokens.spacingHorizontalXS}`,\r\n        borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\r\n    },\r\n    paneCollapseButtonWithBorder: {\r\n        borderLeft: `1px solid ${tokens.colorNeutralStroke2}`,\r\n    },\r\n    collapseMenuPopover: {\r\n        minWidth: 0,\r\n    },\r\n    pane: {\r\n        backgroundColor: tokens.colorNeutralBackground2,\r\n        display: \"flex\",\r\n        flex: 1,\r\n        alignItems: \"stretch\",\r\n        overflow: \"hidden\",\r\n    },\r\n    paneLeft: {\r\n        flexDirection: \"row\",\r\n    },\r\n    paneRight: {\r\n        flexDirection: \"row-reverse\",\r\n    },\r\n    paneContainer: {\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        overflowX: \"hidden\",\r\n        overflowY: \"hidden\",\r\n        zIndex: 1,\r\n        pointerEvents: \"auto\",\r\n    },\r\n    paneContent: {\r\n        display: \"flex\",\r\n        flexGrow: 1,\r\n        flexDirection: \"column\",\r\n        overflow: \"hidden\",\r\n    },\r\n    unselectedPane: {\r\n        display: \"none\",\r\n    },\r\n    paneHeaderDiv: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        alignItems: \"center\",\r\n        height: \"36px\",\r\n        backgroundColor: tokens.colorNeutralBackground1,\r\n        color: tokens.colorNeutralForeground1,\r\n    },\r\n    paneHeaderText: {\r\n        flex: 1,\r\n    },\r\n    paneHeaderTextNoIcon: {\r\n        marginLeft: tokens.spacingHorizontalM,\r\n    },\r\n    paneHeaderIcon: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        justifyContent: \"center\",\r\n        height: \"100%\",\r\n        aspectRatio: \"1\",\r\n        fontSize: \"20px\",\r\n    },\r\n    paneHeaderButton: {\r\n        color: \"inherit\",\r\n    },\r\n    paneDivider: {\r\n        flex: \"0 0 auto\",\r\n        marginTop: tokens.spacingVerticalM,\r\n        margin: \"0\",\r\n        minHeight: tokens.spacingVerticalM,\r\n        cursor: \"ns-resize\",\r\n        alignItems: \"end\",\r\n    },\r\n    tabToolbar: {\r\n        padding: 0,\r\n        borderLeft: `1px solid ${tokens.colorNeutralStroke2}`,\r\n        borderRight: `1px solid ${tokens.colorNeutralStroke2}`,\r\n    },\r\n    tab: {\r\n        display: \"flex\",\r\n        height: \"100%\",\r\n        boxSizing: \"border-box\",\r\n        justifyContent: \"center\",\r\n        border: `1px solid ${tokens.colorNeutralStroke2}`,\r\n        borderTop: \"none\",\r\n    },\r\n    firstTab: {\r\n        borderLeftColor: \"transparent\",\r\n    },\r\n    lastTab: {\r\n        borderRightColor: \"transparent\",\r\n    },\r\n    selectedTab: {\r\n        borderBottom: \"none\",\r\n    },\r\n    unselectedTab: {\r\n        borderLeftColor: \"transparent\",\r\n        borderRightColor: \"transparent\",\r\n    },\r\n    tabRadioButton: {\r\n        backgroundColor: \"transparent\",\r\n        borderRadius: 0,\r\n    },\r\n    resizer: {\r\n        width: \"8px\",\r\n        cursor: \"ew-resize\",\r\n        zIndex: 1000,\r\n    },\r\n    resizerLeft: {\r\n        marginRight: \"-8px\",\r\n        transform: \"translateX(-8px)\",\r\n    },\r\n    resizerRight: {\r\n        marginLeft: \"-8px\",\r\n        transform: \"translateX(8px)\",\r\n    },\r\n    centralContent: {\r\n        position: \"relative\",\r\n        flexGrow: 1,\r\n        display: \"flex\",\r\n        overflow: \"hidden\",\r\n        backgroundColor: tokens.colorTransparentBackground,\r\n        \"> *\": {\r\n            pointerEvents: \"auto\",\r\n        },\r\n    },\r\n    expandButtonContainer: {\r\n        position: \"absolute\",\r\n    },\r\n    expandButtonContainerLeft: {\r\n        left: 0,\r\n    },\r\n    expandButtonContainerRight: {\r\n        right: 0,\r\n    },\r\n    expandButton: {},\r\n});\r\n\r\nconst DockMenu: FunctionComponent<\r\n    Pick<MenuTriggerProps, \"children\"> & { openOnContext?: boolean; sidePaneId: string; dockOptions: Map<DockLocation, (sidePaneKey: string) => void> }\r\n> = (props) => {\r\n    const { openOnContext, sidePaneId, dockOptions, children } = props;\r\n\r\n    const dockLeft = dockOptions.get(\"full-left\");\r\n    const dockTopLeft = dockOptions.get(\"top-left\");\r\n    const dockBottomLeft = dockOptions.get(\"bottom-left\");\r\n    const dockRight = dockOptions.get(\"full-right\");\r\n    const dockTopRight = dockOptions.get(\"top-right\");\r\n    const dockBottomRight = dockOptions.get(\"bottom-right\");\r\n\r\n    return (\r\n        <Menu openOnContext={openOnContext}>\r\n            <MenuTrigger disableButtonEnhancement>{children}</MenuTrigger>\r\n            <Theme>\r\n                <MenuPopover>\r\n                    <MenuList>\r\n                        <MenuGroup>\r\n                            <MenuGroupHeader>Dock</MenuGroupHeader>\r\n                            {dockLeft && (\r\n                                <MenuItem icon={<LayoutColumnTwoFocusLeftFilled />} onClick={() => dockLeft(sidePaneId)}>\r\n                                    Left\r\n                                </MenuItem>\r\n                            )}\r\n                            {dockTopLeft && (\r\n                                <MenuItem icon={<LayoutColumnTwoSplitLeftFocusTopLeftFilled />} onClick={() => dockTopLeft(sidePaneId)}>\r\n                                    Top Left\r\n                                </MenuItem>\r\n                            )}\r\n                            {dockBottomLeft && (\r\n                                <MenuItem icon={<LayoutColumnTwoSplitLeftFocusBottomLeftFilled />} onClick={() => dockBottomLeft(sidePaneId)}>\r\n                                    Bottom Left\r\n                                </MenuItem>\r\n                            )}\r\n                            {dockRight && (\r\n                                <MenuItem icon={<LayoutColumnTwoFocusRightFilled />} onClick={() => dockRight(sidePaneId)}>\r\n                                    Right\r\n                                </MenuItem>\r\n                            )}\r\n                            {dockTopRight && (\r\n                                <MenuItem icon={<LayoutColumnTwoSplitRightFocusTopRightFilled />} onClick={() => dockTopRight(sidePaneId)}>\r\n                                    Top Right\r\n                                </MenuItem>\r\n                            )}\r\n                            {dockBottomRight && (\r\n                                <MenuItem icon={<LayoutColumnTwoSplitRightFocusBottomRightFilled />} onClick={() => dockBottomRight(sidePaneId)}>\r\n                                    Bottom Right\r\n                                </MenuItem>\r\n                            )}\r\n                        </MenuGroup>\r\n                    </MenuList>\r\n                </MenuPopover>\r\n            </Theme>\r\n        </Menu>\r\n    );\r\n};\r\n\r\nconst PaneHeader: FunctionComponent<{ id: string; title: string; icon?: ComponentType; dockOptions: Map<DockLocation, (sidePaneKey: string) => void> }> = (props) => {\r\n    const { id, title, dockOptions } = props;\r\n\r\n    const classes = useStyles();\r\n\r\n    return (\r\n        <div className={classes.paneHeaderDiv}>\r\n            {props.icon && (\r\n                <div className={classes.paneHeaderIcon}>\r\n                    <props.icon />\r\n                </div>\r\n            )}\r\n            <Subtitle2Stronger className={mergeClasses(classes.paneHeaderText, !props.icon && classes.paneHeaderTextNoIcon)}>{title}</Subtitle2Stronger>\r\n            <DockMenu sidePaneId={id} dockOptions={dockOptions}>\r\n                <Button className={classes.paneHeaderButton} appearance=\"transparent\" icon={<MoreHorizontalRegular />} />\r\n            </DockMenu>\r\n        </div>\r\n    );\r\n};\r\n\r\n// This is a wrapper for an item in a toolbar that simply adds a teaching moment, which is useful for dynamically added items, possibly from extensions.\r\nconst ToolbarItem: FunctionComponent<{\r\n    verticalLocation: VerticalLocation;\r\n    horizontalLocation: HorizontalLocation;\r\n    id: string;\r\n    component: ComponentType;\r\n    displayName?: string;\r\n    teachingMoment?: TeachingMomentInfo;\r\n}> = (props) => {\r\n    // eslint-disable-next-line @typescript-eslint/naming-convention\r\n    const { verticalLocation, horizontalLocation, id, component: Component, displayName } = props;\r\n    const classes = useStyles();\r\n\r\n    const useTeachingMoment = useMemo(() => MakePopoverTeachingMoment(`Bar/${verticalLocation}/${horizontalLocation}/${displayName ?? id}`), [displayName, id]);\r\n    const teachingMoment = useTeachingMoment(props.teachingMoment === false);\r\n\r\n    const title = typeof props.teachingMoment === \"object\" ? props.teachingMoment.title : (displayName ?? id);\r\n    const description = typeof props.teachingMoment === \"object\" ? props.teachingMoment.description : `The \"${displayName ?? id}\" extension can be accessed here.`;\r\n\r\n    return (\r\n        <>\r\n            <TeachingMoment {...teachingMoment} shouldDisplay={teachingMoment.shouldDisplay} title={title} description={description} />\r\n            <div className={classes.barItem} ref={teachingMoment.targetRef}>\r\n                <Component />\r\n            </div>\r\n        </>\r\n    );\r\n};\r\n\r\n// TODO: Handle overflow, possibly via https://react.fluentui.dev/?path=/docs/components-overflow--docs with priority.\r\n// This component just renders a toolbar with left aligned toolbar items on the left and right aligned toolbar items on the right.\r\nconst Toolbar: FunctionComponent<{ location: VerticalLocation; components: Readonly<ToolbarItemDefinition[]> }> = ({ location, components }) => {\r\n    const classes = useStyles();\r\n\r\n    const leftComponents = useMemo(() => components.filter((entry) => entry.horizontalLocation === \"left\"), [components]);\r\n    const rightComponents = useMemo(() => components.filter((entry) => entry.horizontalLocation === \"right\"), [components]);\r\n\r\n    return (\r\n        <>\r\n            {components.length > 0 && (\r\n                <div className={`${classes.bar} ${location === \"top\" ? classes.barTop : classes.barBottom}`}>\r\n                    <div className={classes.barLeft}>\r\n                        {leftComponents.map((entry) => (\r\n                            <ToolbarItem\r\n                                key={entry.key}\r\n                                verticalLocation={location}\r\n                                horizontalLocation={entry.horizontalLocation}\r\n                                id={entry.key}\r\n                                component={entry.component}\r\n                                displayName={entry.displayName}\r\n                                teachingMoment={entry.teachingMoment}\r\n                            />\r\n                        ))}\r\n                    </div>\r\n                    <div className={classes.barRight}>\r\n                        {rightComponents.map((entry) => (\r\n                            <ToolbarItem\r\n                                key={entry.key}\r\n                                verticalLocation={location}\r\n                                horizontalLocation={entry.horizontalLocation}\r\n                                id={entry.key}\r\n                                component={entry.component}\r\n                                displayName={entry.displayName}\r\n                                teachingMoment={entry.teachingMoment}\r\n                            />\r\n                        ))}\r\n                    </div>\r\n                </div>\r\n            )}\r\n        </>\r\n    );\r\n};\r\n\r\n// This is a wrapper for a tab in a side pane that simply adds a teaching moment, which is useful for dynamically added items, possibly from extensions.\r\nconst SidePaneTab: FunctionComponent<\r\n    { location: HorizontalLocation; id: string; isSelected: boolean; isFirst: boolean; isLast: boolean; dockOptions: Map<DockLocation, (sidePaneKey: string) => void> } & Pick<\r\n        Readonly<SidePaneDefinition>,\r\n        \"title\" | \"icon\" | \"teachingMoment\"\r\n    >\r\n> = (props) => {\r\n    const {\r\n        location,\r\n        id,\r\n        isSelected,\r\n        isFirst,\r\n        isLast,\r\n        dockOptions,\r\n        // eslint-disable-next-line @typescript-eslint/naming-convention\r\n        icon: Icon,\r\n        title,\r\n    } = props;\r\n    const classes = useStyles();\r\n    const useTeachingMoment = useMemo(() => MakePopoverTeachingMoment(`Pane/${location}/${title ?? id}`), [title, id]);\r\n    const teachingMoment = useTeachingMoment(props.teachingMoment === false);\r\n\r\n    const tabClass = mergeClasses(\r\n        classes.tab,\r\n        isSelected ? classes.selectedTab : classes.unselectedTab,\r\n        isFirst ? classes.firstTab : undefined,\r\n        isLast ? classes.lastTab : undefined\r\n    );\r\n\r\n    return (\r\n        <>\r\n            <TeachingMoment\r\n                {...teachingMoment}\r\n                shouldDisplay={teachingMoment.shouldDisplay}\r\n                title={typeof props.teachingMoment === \"object\" ? props.teachingMoment.title : (title ?? \"Extension\")}\r\n                description={typeof props.teachingMoment === \"object\" ? props.teachingMoment.description : `The \"${title ?? id}\" extension can be accessed here.`}\r\n            />\r\n            <div className={tabClass}>\r\n                <DockMenu openOnContext sidePaneId={id} dockOptions={dockOptions}>\r\n                    <Tooltip content={title ?? id}>\r\n                        <ToolbarRadioButton\r\n                            ref={teachingMoment.targetRef}\r\n                            appearance=\"transparent\"\r\n                            className={classes.tabRadioButton}\r\n                            name=\"selectedTab\"\r\n                            value={id}\r\n                            icon={{\r\n                                children: <Icon />,\r\n                            }}\r\n                        />\r\n                    </Tooltip>\r\n                </DockMenu>\r\n            </div>\r\n        </>\r\n    );\r\n};\r\n\r\n// This hook provides a side pane container and the tab list.\r\n// In \"compact\" mode, the tab list is integrated into the pane itself.\r\n// In \"full\" mode, the returned tab list is later injected into the toolbar.\r\nfunction usePane(\r\n    location: HorizontalLocation,\r\n    defaultWidth: number,\r\n    minWidth: number,\r\n    sidePanes: SidePaneDefinition[],\r\n    onSelectSidePane: Observable<string>,\r\n    dockOperations: Map<DockLocation, (sidePaneKey: string) => void>,\r\n    toolbarMode: ToolbarMode,\r\n    topBarItems: Readonly<ToolbarItemDefinition[]>,\r\n    bottomBarItems: Readonly<ToolbarItemDefinition[]>,\r\n    initialCollapsed: boolean\r\n) {\r\n    const classes = useStyles();\r\n\r\n    const [topSelectedTab, setTopSelectedTab] = useState<SidePaneDefinition>();\r\n    const [bottomSelectedTab, setBottomSelectedTab] = useState<SidePaneDefinition>();\r\n    const [collapsed, setCollapsed] = useState(initialCollapsed);\r\n    const childWindow = useRef<ChildWindow>(null);\r\n    const [isChildWindowOpen, setIsChildWindowOpen] = useState(false);\r\n    const paneContainerRef = useRef<HTMLDivElement>(null);\r\n\r\n    const onExpandCollapseClick = useCallback(() => {\r\n        setCollapsed((collapsed) => !collapsed);\r\n    }, []);\r\n\r\n    const [paneWidthSetting, setPaneWidthSetting] = useSetting(location === \"left\" ? LeftSidePaneWidthAdjustSettingDescriptor : RightSidePaneWidthAdjustSettingDescriptor);\r\n    const [paneHeightSetting, setPaneHeightSetting] = useSetting(location === \"left\" ? LeftSidePaneHeightAdjustSettingDescriptor : RightSidePaneHeightAdjustSettingDescriptor);\r\n\r\n    const currentSidePanes = useMemo(() => sidePanes.filter((entry) => entry.horizontalLocation === location), [sidePanes, location]);\r\n    const topPanes = useMemo(() => currentSidePanes.filter((entry) => entry.verticalLocation === \"top\"), [currentSidePanes]);\r\n    const bottomPanes = useMemo(() => currentSidePanes.filter((entry) => entry.verticalLocation === \"bottom\"), [currentSidePanes]);\r\n\r\n    const getValidDockOperations = useCallback(\r\n        (verticalLocation: VerticalLocation) => {\r\n            const validDockOperations = new Map(dockOperations);\r\n\r\n            // Can't re-dock to the current location.\r\n            validDockOperations.delete(`${verticalLocation}-${location}`);\r\n\r\n            // Full would mean there are no bottom panes, so this is also re-docking to the current location.\r\n            validDockOperations.delete(`full-${location}`);\r\n\r\n            // If there is only one pane left, it can't be docked to the bottom (as this would leave no top panes).\r\n            if (currentSidePanes.length === 1) {\r\n                validDockOperations.delete(`bottom-${location}`);\r\n            }\r\n\r\n            return validDockOperations;\r\n        },\r\n        [location, dockOperations, currentSidePanes]\r\n    );\r\n\r\n    const validTopDockOptions = useMemo(() => getValidDockOperations(\"top\"), [getValidDockOperations]);\r\n    const validBottomDockOptions = useMemo(() => getValidDockOperations(\"bottom\"), [getValidDockOperations]);\r\n\r\n    // Selects a default top tab (during initialization or if the selected tab is removed).\r\n    useEffect(() => {\r\n        if ((topSelectedTab && !topPanes.includes(topSelectedTab)) || (!topSelectedTab && topPanes.length > 0)) {\r\n            setTopSelectedTab(topPanes[0]);\r\n        } else if (topSelectedTab && topPanes.length === 0) {\r\n            setTopSelectedTab(undefined);\r\n        }\r\n    }, [topSelectedTab, topPanes]);\r\n\r\n    // Selects a default bottom tab (during initialization or if the selected tab is removed).\r\n    useEffect(() => {\r\n        if ((bottomSelectedTab && !bottomPanes.includes(bottomSelectedTab)) || (!bottomSelectedTab && bottomPanes.length > 0)) {\r\n            setBottomSelectedTab(bottomPanes[0]);\r\n        } else if (bottomSelectedTab && bottomPanes.length === 0) {\r\n            setBottomSelectedTab(undefined);\r\n        }\r\n    }, [bottomSelectedTab, bottomPanes]);\r\n\r\n    // Selects a tab when explicitly requested.\r\n    useEffect(() => {\r\n        const observer = onSelectSidePane.add((key) => {\r\n            const topPane = topPanes.find((entry) => entry.key === key);\r\n            if (topPane) {\r\n                setTopSelectedTab(topPane);\r\n                setCollapsed(false);\r\n            }\r\n\r\n            const bottomPane = bottomPanes.find((entry) => entry.key === key);\r\n            if (bottomPane) {\r\n                setBottomSelectedTab(bottomPane);\r\n                setCollapsed(false);\r\n            }\r\n        });\r\n\r\n        return () => observer.remove();\r\n    }, [topPanes, bottomPanes, onSelectSidePane]);\r\n\r\n    const setUndocked = useCallback(\r\n        (undocked: boolean) => {\r\n            if (!undocked) {\r\n                childWindow.current?.close();\r\n            } else {\r\n                const paneContainer = paneContainerRef.current;\r\n                if (!paneContainer) {\r\n                    // It shouldn't be possible to get here and have this ref be null, but just in case,\r\n                    // bail out of the undock operation.\r\n                    childWindow.current?.close();\r\n                } else {\r\n                    // This is the extra buffer needed on top of minWidth to account for window chrome to avoid a horizontal scrollbar.\r\n                    const widthBuffer = 4;\r\n                    // This offsets the window's top position to account for window chrome/title bar.\r\n                    const topOffset = 100;\r\n\r\n                    // Create the child window with approximately the same location and size as the side pane.\r\n                    const bounds = paneContainer.getBoundingClientRect();\r\n\r\n                    childWindow.current?.open({\r\n                        defaultWidth: Math.max(bounds.width, minWidth + widthBuffer),\r\n                        defaultHeight: bounds.height - topOffset,\r\n                        defaultTop: bounds.top + window.screenY + topOffset,\r\n                        defaultLeft: bounds.left + window.screenX,\r\n                        title: location === \"left\" ? \"Left\" : \"Right\",\r\n                    });\r\n                }\r\n            }\r\n        },\r\n        [childWindow, location]\r\n    );\r\n\r\n    const expandCollapseButton = useMemo(() => {\r\n        const expandCollapseIcon =\r\n            location === \"left\" ? collapsed ? <PanelLeftExpandRegular /> : <PanelLeftContractRegular /> : collapsed ? <PanelRightExpandRegular /> : <PanelRightContractRegular />;\r\n\r\n        return (\r\n            <Menu positioning=\"below-end\">\r\n                <MenuTrigger disableButtonEnhancement={true}>\r\n                    {(triggerProps) => (\r\n                        <Tooltip content={collapsed ? \"Show Side Pane\" : \"Hide Side Pane\"}>\r\n                            <SplitButton\r\n                                className={mergeClasses(\r\n                                    classes.paneCollapseButton,\r\n                                    location === \"right\" && toolbarMode === \"compact\" ? classes.paneCollapseButtonWithBorder : undefined\r\n                                )}\r\n                                menuButton={triggerProps}\r\n                                primaryActionButton={{ onClick: onExpandCollapseClick }}\r\n                                size=\"small\"\r\n                                appearance=\"transparent\"\r\n                                icon={expandCollapseIcon}\r\n                            />\r\n                        </Tooltip>\r\n                    )}\r\n                </MenuTrigger>\r\n                <MenuPopover className={classes.collapseMenuPopover}>\r\n                    <MenuList>\r\n                        <MenuItem icon={<PictureInPictureEnterRegular />} onClick={() => setUndocked(true)}>\r\n                            Undock\r\n                        </MenuItem>\r\n                    </MenuList>\r\n                </MenuPopover>\r\n            </Menu>\r\n        );\r\n    }, [collapsed, onExpandCollapseClick, location]);\r\n\r\n    const createPaneTabList = useCallback(\r\n        (\r\n            paneComponents: SidePaneDefinition[],\r\n            toolbarMode: \"full\" | \"compact\",\r\n            selectedTab: SidePaneDefinition | undefined,\r\n            setSelectedTab: (tab: SidePaneDefinition | undefined) => void,\r\n            dockOptions: Map<DockLocation, (sidePaneKey: string) => void>\r\n        ) => {\r\n            return (\r\n                <>\r\n                    {paneComponents.length > 0 && (\r\n                        <div className={`${classes.paneTabListDiv} ${location === \"left\" || toolbarMode === \"compact\" ? classes.paneTabListDivLeft : classes.paneTabListDivRight}`}>\r\n                            {/* Only render the tab list if there is more than tab. It's kind of pointless to show a tab list with just one tab. */}\r\n                            {paneComponents.length > 1 && (\r\n                                <>\r\n                                    <FluentToolbar\r\n                                        className={classes.tabToolbar}\r\n                                        checkedValues={{ selectedTab: [selectedTab?.key ?? \"\"] }}\r\n                                        onCheckedValueChange={(event, data) => {\r\n                                            const tab = paneComponents.find((entry) => entry.key === data.checkedItems[0]);\r\n                                            setSelectedTab(tab);\r\n                                            setCollapsed(false);\r\n                                        }}\r\n                                    >\r\n                                        {paneComponents.map((entry, index) => {\r\n                                            const isSelected = selectedTab?.key === entry.key;\r\n                                            return (\r\n                                                <SidePaneTab\r\n                                                    key={entry.key}\r\n                                                    location={location}\r\n                                                    id={entry.key}\r\n                                                    title={entry.title}\r\n                                                    icon={entry.icon}\r\n                                                    teachingMoment={entry.teachingMoment}\r\n                                                    isSelected={isSelected && !collapsed}\r\n                                                    isFirst={index === 0}\r\n                                                    isLast={index === paneComponents.length - 1}\r\n                                                    dockOptions={dockOptions}\r\n                                                />\r\n                                            );\r\n                                        })}\r\n                                    </FluentToolbar>\r\n                                </>\r\n                            )}\r\n\r\n                            {/* When the toolbar mode is \"full\", we add an extra button that allows the side panes to be collapsed. */}\r\n                            {toolbarMode === \"full\" && (\r\n                                <Collapse visible={!isChildWindowOpen} orientation=\"horizontal\">\r\n                                    {expandCollapseButton}\r\n                                </Collapse>\r\n                            )}\r\n                        </div>\r\n                    )}\r\n                </>\r\n            );\r\n        },\r\n        [location, collapsed, isChildWindowOpen, expandCollapseButton]\r\n    );\r\n\r\n    // This memos the TabList to make it easy for the JSX to be inserted at the top of the pane (in \"compact\" mode) or returned to the caller to be used in the toolbar (in \"full\" mode).\r\n    const topPaneTabList = useMemo(\r\n        () => createPaneTabList(topPanes, toolbarMode, topSelectedTab, setTopSelectedTab, validTopDockOptions),\r\n        [createPaneTabList, topPanes, toolbarMode, topSelectedTab]\r\n    );\r\n    const bottomPaneTabList = useMemo(\r\n        () => createPaneTabList(bottomPanes, \"compact\", bottomSelectedTab, setBottomSelectedTab, validBottomDockOptions),\r\n        [createPaneTabList, bottomPanes, bottomSelectedTab]\r\n    );\r\n\r\n    // This manages the CSS variable that controls the width of the side pane.\r\n    const paneWidthAdjustCSSVar = \"--pane-width-adjust\";\r\n    const {\r\n        elementRef: paneHorizontalResizeElementRef,\r\n        handleRef: paneHorizontalResizeHandleRef,\r\n        setValue: setPaneWidthAdjust,\r\n    } = useResizeHandle({\r\n        growDirection: location === \"left\" ? \"end\" : \"start\",\r\n        variableName: paneWidthAdjustCSSVar,\r\n        minValue: minWidth - defaultWidth,\r\n        onChange: (value) => {\r\n            // Whenever the width is adjusted, store the value.\r\n            setPaneWidthSetting(value);\r\n        },\r\n    });\r\n\r\n    // This manages the CSS variable that controls the height of the bottom pane.\r\n    const paneHeightAdjustCSSVar = \"--pane-height-adjust\";\r\n    const {\r\n        elementRef: paneVerticalResizeElementRef,\r\n        handleRef: paneVerticalResizeHandleRef,\r\n        setValue: setPaneHeightAdjust,\r\n    } = useResizeHandle({\r\n        growDirection: \"up\",\r\n        variableName: paneHeightAdjustCSSVar,\r\n        onChange: (value) => {\r\n            // Whenever the height is adjusted, store the value.\r\n            setPaneHeightSetting(value);\r\n        },\r\n    });\r\n\r\n    // This ensures that when the component is first rendered, the CSS variable is set from storage.\r\n    useLayoutEffect(() => {\r\n        setPaneWidthAdjust(paneWidthSetting);\r\n        setPaneHeightAdjust(paneHeightSetting);\r\n    }, [paneWidthSetting, paneHeightSetting]);\r\n\r\n    // This effect closes the window if all panes have been removed.\r\n    useEffect(() => {\r\n        if (isChildWindowOpen && topPanes.length === 0 && bottomPanes.length === 0) {\r\n            childWindow.current?.close();\r\n        }\r\n    }, [childWindow, isChildWindowOpen, topPanes, bottomPanes]);\r\n\r\n    // This memoizes the pane itself, which may or may not include the tab list, depending on the toolbar mode.\r\n    const corePane = useMemo(() => {\r\n        return (\r\n            <>\r\n                {/* If toolbar mode is \"compact\" then the top toolbar is embedded at the top of the pane. */}\r\n                {toolbarMode === \"compact\" && (topPanes.length > 1 || topBarItems.length > 0) && (\r\n                    <>\r\n                        <div className={classes.barDiv}>\r\n                            {/* The tablist gets merged in with the toolbar. */}\r\n                            {!isChildWindowOpen && location === \"left\" && expandCollapseButton}\r\n                            {topPaneTabList}\r\n                            <Toolbar location=\"top\" components={topBarItems} />\r\n                            {!isChildWindowOpen && location === \"right\" && expandCollapseButton}\r\n                        </div>\r\n                    </>\r\n                )}\r\n\r\n                {/* Render the top pane content. */}\r\n                {topPanes.length > 0 && (\r\n                    <div className={classes.paneContent}>\r\n                        {topSelectedTab && (\r\n                            <>\r\n                                <PaneHeader\r\n                                    id={topSelectedTab.key}\r\n                                    title={topSelectedTab.title}\r\n                                    icon={topPanes.length > 1 ? undefined : topSelectedTab.icon}\r\n                                    dockOptions={validTopDockOptions}\r\n                                />\r\n                                {/* Render all panes to retain their state even when they are not selected, but only display the selected pane. */}\r\n                                {topPanes\r\n                                    .filter((pane) => pane.key === topSelectedTab.key || pane.keepMounted)\r\n                                    .map((pane) => (\r\n                                        <div key={pane.key} className={mergeClasses(classes.paneContent, pane.key !== topSelectedTab.key ? classes.unselectedPane : undefined)}>\r\n                                            <ErrorBoundary name={pane.title}>\r\n                                                <pane.content />\r\n                                            </ErrorBoundary>\r\n                                        </div>\r\n                                    ))}\r\n                            </>\r\n                        )}\r\n                    </div>\r\n                )}\r\n\r\n                {/* If we have both top and bottom panes, show a divider. This divider is also the resizer for the bottom pane. */}\r\n                {topPanes.length > 0 && bottomPanes.length > 0 && <Divider ref={paneVerticalResizeHandleRef} className={classes.paneDivider} />}\r\n\r\n                {/* Render the bottom pane tablist. */}\r\n                {bottomPanes.length > 1 && (\r\n                    <>\r\n                        <div className={classes.barDiv}>{bottomPaneTabList}</div>\r\n                    </>\r\n                )}\r\n\r\n                {/* Render the bottom pane content. This is the element that can be resized vertically. */}\r\n                {bottomPanes.length > 0 && (\r\n                    <div\r\n                        ref={paneVerticalResizeElementRef}\r\n                        className={classes.paneContent}\r\n                        style={{ height: `clamp(200px, calc(45% + var(${paneHeightAdjustCSSVar}, 0px)), 100% - 300px)`, flex: \"0 0 auto\" }}\r\n                    >\r\n                        {bottomSelectedTab && (\r\n                            <>\r\n                                <PaneHeader\r\n                                    id={bottomSelectedTab.key}\r\n                                    title={bottomSelectedTab.title}\r\n                                    icon={bottomPanes.length > 1 ? undefined : bottomSelectedTab.icon}\r\n                                    dockOptions={validBottomDockOptions}\r\n                                />\r\n                                {/* Render all panes to retain their state even when they are not selected, but only display the selected pane. */}\r\n                                {bottomPanes\r\n                                    .filter((pane) => pane.key === bottomSelectedTab.key || pane.keepMounted)\r\n                                    .map((pane) => (\r\n                                        <div key={pane.key} className={mergeClasses(classes.paneContent, pane.key !== bottomSelectedTab.key ? classes.unselectedPane : undefined)}>\r\n                                            <ErrorBoundary name={pane.title}>\r\n                                                <pane.content />\r\n                                            </ErrorBoundary>\r\n                                        </div>\r\n                                    ))}\r\n                            </>\r\n                        )}\r\n                    </div>\r\n                )}\r\n\r\n                {/* If toolbar mode is \"compact\" then the bottom toolbar is embedded at the bottom of the pane. */}\r\n                {toolbarMode === \"compact\" && bottomBarItems.length > 0 && (\r\n                    <>\r\n                        <div className={classes.barDiv}>\r\n                            <Toolbar location=\"bottom\" components={bottomBarItems} />\r\n                        </div>\r\n                    </>\r\n                )}\r\n            </>\r\n        );\r\n    }, [\r\n        topPanes,\r\n        topSelectedTab,\r\n        validTopDockOptions,\r\n        bottomPanes,\r\n        bottomSelectedTab,\r\n        validBottomDockOptions,\r\n        topBarItems,\r\n        bottomBarItems,\r\n        topPaneTabList,\r\n        bottomPaneTabList,\r\n        isChildWindowOpen,\r\n    ]);\r\n\r\n    // This deals with docked vs undocked state, where undocked is rendered into a separate window via a portal.\r\n    const pane = useMemo(() => {\r\n        return (\r\n            <>\r\n                {/* If there is no window state, then we are docked, so render the resizable div and the collapse container. */}\r\n                {!isChildWindowOpen && (\r\n                    <div ref={paneContainerRef} className={classes.paneContainer}>\r\n                        {(topPanes.length > 0 || bottomPanes.length > 0) && (\r\n                            <div className={`${classes.pane} ${location === \"left\" ? classes.paneLeft : classes.paneRight}`}>\r\n                                <Collapse orientation=\"horizontal\" visible={!collapsed}>\r\n                                    <div\r\n                                        ref={paneHorizontalResizeElementRef}\r\n                                        className={classes.paneContainer}\r\n                                        style={{ width: `clamp(${minWidth}px, calc(${defaultWidth}px + var(${paneWidthAdjustCSSVar}, 0px)), 1000px)` }}\r\n                                    >\r\n                                        {corePane}\r\n                                    </div>\r\n                                </Collapse>\r\n                                {/* This is the resizer (width) for the pane container. */}\r\n                                <div\r\n                                    ref={paneHorizontalResizeHandleRef}\r\n                                    className={`${classes.resizer} ${location === \"left\" ? classes.resizerLeft : classes.resizerRight}`}\r\n                                    style={{ pointerEvents: `${collapsed ? \"none\" : \"auto\"}` }}\r\n                                />\r\n                            </div>\r\n                        )}\r\n                    </div>\r\n                )}\r\n                <ChildWindow imperativeRef={childWindow} onOpenChange={(isOpen) => setIsChildWindowOpen(isOpen)}>\r\n                    {corePane}\r\n                </ChildWindow>\r\n            </>\r\n        );\r\n    }, [collapsed, corePane]);\r\n\r\n    const hasPanes = topPanes.length > 0 || bottomPanes.length > 0;\r\n\r\n    return [topPaneTabList, pane, collapsed, setCollapsed, isChildWindowOpen, setUndocked, hasPanes] as const;\r\n}\r\n\r\nexport function MakeShellServiceDefinition({\r\n    leftPaneDefaultWidth = 350,\r\n    leftPaneMinWidth = 350,\r\n    rightPaneDefaultWidth = 350,\r\n    rightPaneMinWidth = 350,\r\n    leftPaneDefaultCollapsed = false,\r\n    rightPaneDefaultCollapsed = false,\r\n    toolbarMode = \"full\",\r\n    sidePaneRemapper = undefined,\r\n}: ShellServiceOptions = {}): ServiceDefinition<[IShellService, IRootComponentService], []> {\r\n    return {\r\n        friendlyName: \"Shell Service\",\r\n        produces: [ShellServiceIdentity, RootComponentServiceIdentity],\r\n        factory: () => {\r\n            const toolbarItemCollection = new ObservableCollection<Readonly<ToolbarItemDefinition>>();\r\n            const sidePaneCollection = new ObservableCollection<Readonly<SidePaneDefinition>>();\r\n            const centralContentCollection = new ObservableCollection<Readonly<CentralContentDefinition>>();\r\n\r\n            const onSelectSidePane = new Observable<string>(undefined, true);\r\n\r\n            const onDockChanged = new Observable<{ location: HorizontalLocation; dock: boolean }>(undefined, true);\r\n            const onCollapseChanged = new Observable<{ location: HorizontalLocation; collapsed: boolean }>();\r\n            const leftSidePaneContainerState = {\r\n                isPresent: false,\r\n                isDocked: true,\r\n                dock: () => onDockChanged.notifyObservers({ location: \"left\", dock: true }),\r\n                undock: () => onDockChanged.notifyObservers({ location: \"left\", dock: false }),\r\n                isCollapsed: leftPaneDefaultCollapsed,\r\n                collapse: () => onCollapseChanged.notifyObservers({ location: \"left\", collapsed: true }),\r\n                expand: () => onCollapseChanged.notifyObservers({ location: \"left\", collapsed: false }),\r\n            };\r\n            const rightSidePaneContainerState = {\r\n                isPresent: false,\r\n                isDocked: true,\r\n                dock: () => onDockChanged.notifyObservers({ location: \"right\", dock: true }),\r\n                undock: () => onDockChanged.notifyObservers({ location: \"right\", dock: false }),\r\n                isCollapsed: rightPaneDefaultCollapsed,\r\n                collapse: () => onCollapseChanged.notifyObservers({ location: \"right\", collapsed: true }),\r\n                expand: () => onCollapseChanged.notifyObservers({ location: \"right\", collapsed: false }),\r\n            };\r\n\r\n            const rootComponent: FunctionComponent = () => {\r\n                const classes = useStyles();\r\n\r\n                const [sidePaneDockOverrides, setSidePaneDockOverrides] = useSetting(SidePaneDockOverridesSettingDescriptor);\r\n\r\n                // This function returns a promise that resolves after the dock change takes effect so that\r\n                // we can then select the re-docked pane.\r\n                const pendingPaneReselects = useRef<string[]>([]);\r\n                const updateSidePaneDockOverride = useCallback(\r\n                    (key: string, horizontalLocation: HorizontalLocation, verticalLocation: VerticalLocation) => {\r\n                        setSidePaneDockOverrides((current) => ({\r\n                            ...current,\r\n                            [key]: { horizontalLocation, verticalLocation },\r\n                        }));\r\n\r\n                        pendingPaneReselects.current.push(key);\r\n                    },\r\n                    [setSidePaneDockOverrides]\r\n                );\r\n\r\n                const toolbarItems = useOrderedObservableCollection(toolbarItemCollection);\r\n\r\n                const sidePanes = useOrderedObservableCollection(sidePaneCollection);\r\n                const coercedSidePaneCache = useRef(new Map<string, SidePaneDefinition>());\r\n                const coercedSidePanes = useMemo(() => {\r\n                    // First pass - apply overrides and respect the side pane mode.\r\n                    const coercedSidePanes = sidePanes\r\n                        .map((sidePaneDefinition) => {\r\n                            let coercedSidePane = coercedSidePaneCache.current.get(sidePaneDefinition.key);\r\n                            if (!coercedSidePane) {\r\n                                coercedSidePane = { ...sidePaneDefinition };\r\n                                coercedSidePaneCache.current.set(sidePaneDefinition.key, coercedSidePane);\r\n                            }\r\n\r\n                            const override = sidePaneDockOverrides[sidePaneDefinition.key];\r\n                            if (override) {\r\n                                // Override (user manually re-docked) has the highest priority.\r\n                                coercedSidePane.horizontalLocation = override.horizontalLocation;\r\n                                coercedSidePane.verticalLocation = override.verticalLocation;\r\n                            } else if (sidePaneRemapper) {\r\n                                // A side pane remapper has the next highest priority.\r\n                                const remapping = sidePaneRemapper(sidePaneDefinition);\r\n                                if (!remapping) {\r\n                                    coercedSidePane = undefined;\r\n                                } else {\r\n                                    coercedSidePane.horizontalLocation = remapping.horizontalLocation;\r\n                                    coercedSidePane.verticalLocation = remapping.verticalLocation;\r\n                                }\r\n                            } else {\r\n                                // Otherwise use the default defined location.\r\n                                coercedSidePane.horizontalLocation = sidePaneDefinition.horizontalLocation;\r\n                                coercedSidePane.verticalLocation = sidePaneDefinition.verticalLocation;\r\n                            }\r\n\r\n                            return coercedSidePane;\r\n                        })\r\n                        .filter((sidePane): sidePane is SidePaneDefinition => !!sidePane);\r\n\r\n                    // Second pass - correct any invalid state, specifically if there are only bottom panes, force them to be top panes.\r\n                    for (const side of [\"left\", \"right\"] as const) {\r\n                        const topPanes = coercedSidePanes.filter((entry) => entry.horizontalLocation === side && entry.verticalLocation === \"top\");\r\n                        const bottomPanes = coercedSidePanes.filter((entry) => entry.horizontalLocation === side && entry.verticalLocation === \"bottom\");\r\n                        if (bottomPanes.length > 0 && topPanes.length === 0) {\r\n                            for (const pane of bottomPanes) {\r\n                                pane.verticalLocation = \"top\";\r\n                                updateSidePaneDockOverride(pane.key, side, \"top\");\r\n                            }\r\n                        }\r\n                    }\r\n\r\n                    // Cleanup any cached panes that are no longer present.\r\n                    for (const key of coercedSidePaneCache.current.keys()) {\r\n                        if (!coercedSidePanes.some((entry) => entry.key === key)) {\r\n                            coercedSidePaneCache.current.delete(key);\r\n                        }\r\n                    }\r\n\r\n                    return coercedSidePanes;\r\n                }, [sidePanes, sidePaneDockOverrides, updateSidePaneDockOverride, sidePaneRemapper]);\r\n\r\n                useEffect(() => {\r\n                    for (const paneKey of pendingPaneReselects.current.splice(0)) {\r\n                        onSelectSidePane.notifyObservers(paneKey);\r\n                    }\r\n                }, [coercedSidePanes]);\r\n\r\n                const sidePaneDockOperations = useMemo(() => {\r\n                    const sidePaneDockOperations = new Map<DockLocation, (sidePaneKey: string) => void>();\r\n                    for (const side of [\"left\", \"right\"] as const) {\r\n                        const currentSidePanes = coercedSidePanes.filter((entry) => entry.horizontalLocation === side);\r\n\r\n                        const dockTop = (sidePaneKey: string) => {\r\n                            updateSidePaneDockOverride(sidePaneKey, side, \"top\");\r\n                        };\r\n                        const dockBottom = (sidePaneKey: string) => {\r\n                            updateSidePaneDockOverride(sidePaneKey, side, \"bottom\");\r\n                        };\r\n\r\n                        if (currentSidePanes.some((entry) => entry.verticalLocation === \"bottom\")) {\r\n                            // If there are bottom panes, there must also be top panes, and so top and bottom are valid locations.\r\n                            sidePaneDockOperations.set(`top-${side}`, dockTop);\r\n                            sidePaneDockOperations.set(`bottom-${side}`, dockBottom);\r\n                        } else if (currentSidePanes.length > 0) {\r\n                            // If there are only top panes, then full and bottom are valid locations.\r\n                            sidePaneDockOperations.set(`full-${side}`, dockTop);\r\n                            sidePaneDockOperations.set(`bottom-${side}`, dockBottom);\r\n                        } else {\r\n                            // If there are no panes, then only full is a valid location.\r\n                            sidePaneDockOperations.set(`full-${side}`, dockTop);\r\n                        }\r\n                    }\r\n                    return sidePaneDockOperations;\r\n                }, [coercedSidePanes]);\r\n\r\n                const hasLeftPanes = coercedSidePanes.some((entry) => entry.horizontalLocation === \"left\");\r\n                const hasRightPanes = coercedSidePanes.some((entry) => entry.horizontalLocation === \"right\");\r\n\r\n                useEffect(() => {\r\n                    leftSidePaneContainerState.isPresent = hasLeftPanes;\r\n                    rightSidePaneContainerState.isPresent = hasRightPanes;\r\n\r\n                    return () => {\r\n                        leftSidePaneContainerState.isPresent = false;\r\n                        rightSidePaneContainerState.isPresent = false;\r\n                    };\r\n                }, [hasLeftPanes, hasRightPanes]);\r\n\r\n                // If we are in compact toolbar mode, we may need to move toolbar items from the left to the right or vice versa,\r\n                // depending on whether there are any side panes on that side.\r\n                const coerceToolBarItemHorizontalLocation = useMemo(\r\n                    () => (item: Readonly<ToolbarItemDefinition>) => {\r\n                        let horizontalLocation = item.horizontalLocation;\r\n                        // Coercion is only needed in compact toolbar mode since there might not be a left or right pane.\r\n                        if (toolbarMode === \"compact\") {\r\n                            if (horizontalLocation === \"left\" && !hasLeftPanes) {\r\n                                horizontalLocation = \"right\";\r\n                            }\r\n                            if (horizontalLocation === \"right\" && !hasRightPanes) {\r\n                                horizontalLocation = \"left\";\r\n                            }\r\n                        }\r\n                        return horizontalLocation;\r\n                    },\r\n                    [toolbarMode, hasLeftPanes, hasRightPanes]\r\n                );\r\n\r\n                const topToolBarItems = useMemo(() => toolbarItems.filter((entry) => entry.verticalLocation === \"top\"), [toolbarItems]);\r\n                const bottomToolBarItems = useMemo(() => toolbarItems.filter((entry) => entry.verticalLocation === \"bottom\"), [toolbarItems]);\r\n\r\n                const topBarLeftItems = useMemo(\r\n                    () => topToolBarItems.filter((entry) => coerceToolBarItemHorizontalLocation(entry) === \"left\"),\r\n                    [topToolBarItems, coerceToolBarItemHorizontalLocation]\r\n                );\r\n                const topBarRightItems = useMemo(\r\n                    () => topToolBarItems.filter((entry) => coerceToolBarItemHorizontalLocation(entry) === \"right\"),\r\n                    [topToolBarItems, coerceToolBarItemHorizontalLocation]\r\n                );\r\n                const bottomBarLeftItems = useMemo(\r\n                    () => bottomToolBarItems.filter((entry) => coerceToolBarItemHorizontalLocation(entry) === \"left\"),\r\n                    [bottomToolBarItems, coerceToolBarItemHorizontalLocation]\r\n                );\r\n                const bottomBarRightItems = useMemo(\r\n                    () => bottomToolBarItems.filter((entry) => coerceToolBarItemHorizontalLocation(entry) === \"right\"),\r\n                    [bottomToolBarItems, coerceToolBarItemHorizontalLocation]\r\n                );\r\n\r\n                const centralContents = useOrderedObservableCollection(centralContentCollection);\r\n\r\n                const [leftPaneTabList, leftPane, leftPaneCollapsed, setLeftPaneCollapsed, leftPaneUndocked, setLeftPaneUndocked, leftPaneHasPanes] = usePane(\r\n                    \"left\",\r\n                    leftPaneDefaultWidth,\r\n                    leftPaneMinWidth,\r\n                    coercedSidePanes,\r\n                    onSelectSidePane,\r\n                    sidePaneDockOperations,\r\n                    toolbarMode,\r\n                    topBarLeftItems,\r\n                    bottomBarLeftItems,\r\n                    leftPaneDefaultCollapsed\r\n                );\r\n\r\n                useEffect(() => {\r\n                    // Propagate shorter lived React component state out to longer lived service state.\r\n                    leftSidePaneContainerState.isDocked = !leftPaneUndocked;\r\n                }, [leftPaneUndocked]);\r\n\r\n                useEffect(() => {\r\n                    // Propagate shorter lived React component state out to longer lived service state.\r\n                    leftSidePaneContainerState.isCollapsed = leftPaneCollapsed;\r\n                }, [leftPaneCollapsed]);\r\n\r\n                const [rightPaneTabList, rightPane, rightPaneCollapsed, setRightPaneCollapsed, rightPaneUndocked, setRightPaneUndocked, rightPaneHasPanes] = usePane(\r\n                    \"right\",\r\n                    rightPaneDefaultWidth,\r\n                    rightPaneMinWidth,\r\n                    coercedSidePanes,\r\n                    onSelectSidePane,\r\n                    sidePaneDockOperations,\r\n                    toolbarMode,\r\n                    topBarRightItems,\r\n                    bottomBarRightItems,\r\n                    rightPaneDefaultCollapsed\r\n                );\r\n\r\n                useEffect(() => {\r\n                    // Propagate shorter lived React component state out to longer lived service state.\r\n                    rightSidePaneContainerState.isDocked = !rightPaneUndocked;\r\n                }, [rightPaneUndocked]);\r\n\r\n                useEffect(() => {\r\n                    // Propagate shorter lived React component state out to longer lived service state.\r\n                    rightSidePaneContainerState.isCollapsed = rightPaneCollapsed;\r\n                }, [rightPaneCollapsed]);\r\n\r\n                useEffect(() => {\r\n                    // If at the service level dock state change is requested, propagate to the React component state.\r\n                    const observer = onDockChanged.add(({ location, dock }) => {\r\n                        if (location === \"left\") {\r\n                            setLeftPaneUndocked(!dock);\r\n                        } else {\r\n                            setRightPaneUndocked(!dock);\r\n                        }\r\n                    });\r\n\r\n                    return () => {\r\n                        observer.remove();\r\n                        leftSidePaneContainerState.isDocked = true;\r\n                        rightSidePaneContainerState.isDocked = true;\r\n                    };\r\n                }, [setLeftPaneUndocked, setRightPaneUndocked]);\r\n\r\n                useEffect(() => {\r\n                    // If at the service level collapse state change is requested, propagate to the React component state.\r\n                    const observer = onCollapseChanged.add(({ location, collapsed }) => {\r\n                        if (location === \"left\") {\r\n                            setLeftPaneCollapsed(collapsed);\r\n                        } else {\r\n                            setRightPaneCollapsed(collapsed);\r\n                        }\r\n                    });\r\n\r\n                    return () => {\r\n                        observer.remove();\r\n                        leftSidePaneContainerState.isCollapsed = false;\r\n                        rightSidePaneContainerState.isCollapsed = false;\r\n                    };\r\n                }, [setLeftPaneCollapsed, setRightPaneCollapsed]);\r\n\r\n                return (\r\n                    <div className={classes.mainView}>\r\n                        {/* Only render the top toolbar if the toolbar mode is \"full\". Otherwise it will be embedded at the top of the side panes. */}\r\n                        {toolbarMode === \"full\" && (\r\n                            <>\r\n                                <div className={classes.barDiv}>\r\n                                    {leftPaneTabList}\r\n                                    <Toolbar location=\"top\" components={topToolBarItems} />\r\n                                    {rightPaneTabList}\r\n                                </div>\r\n                            </>\r\n                        )}\r\n\r\n                        {/* This renders the side panes and the main/central content. */}\r\n                        <div className={classes.verticallyCentralContent}>\r\n                            {/* Render the left pane container. */}\r\n                            {leftPane}\r\n\r\n                            {/* Render the main/central content. */}\r\n                            <div className={classes.centralContent}>\r\n                                {centralContents.map((entry) => (\r\n                                    <ErrorBoundary key={entry.key} name={entry.key}>\r\n                                        <entry.component />\r\n                                    </ErrorBoundary>\r\n                                ))}\r\n                                {toolbarMode === \"compact\" && (\r\n                                    <>\r\n                                        <FluentFade visible={leftPaneCollapsed && leftPaneHasPanes} delay={50} duration={100} unmountOnExit>\r\n                                            <div className={mergeClasses(classes.expandButtonContainer, classes.expandButtonContainerLeft)}>\r\n                                                <Tooltip content=\"Show Side Pane\">\r\n                                                    <Button className={classes.expandButton} icon={<PanelLeftExpandRegular />} onClick={() => setLeftPaneCollapsed(false)} />\r\n                                                </Tooltip>\r\n                                            </div>\r\n                                        </FluentFade>\r\n                                        <FluentFade visible={rightPaneCollapsed && rightPaneHasPanes} delay={50} duration={100} unmountOnExit>\r\n                                            <div className={mergeClasses(classes.expandButtonContainer, classes.expandButtonContainerRight)}>\r\n                                                <Tooltip content=\"Show Side Pane\">\r\n                                                    <Button className={classes.expandButton} icon={<PanelRightExpandRegular />} onClick={() => setRightPaneCollapsed(false)} />\r\n                                                </Tooltip>\r\n                                            </div>\r\n                                        </FluentFade>\r\n                                    </>\r\n                                )}\r\n                            </div>\r\n\r\n                            {/* Render the right pane container. */}\r\n                            {rightPane}\r\n                        </div>\r\n\r\n                        {/* Only render the bottom toolbar if the toolbar mode is \"full\". Otherwise it will be embedded at the bottom of the side panes. */}\r\n                        {toolbarMode === \"full\" && (\r\n                            <>\r\n                                <div className={classes.barDiv}>\r\n                                    <Toolbar location=\"bottom\" components={bottomToolBarItems} />\r\n                                </div>\r\n                            </>\r\n                        )}\r\n                    </div>\r\n                );\r\n            };\r\n            rootComponent.displayName = \"Shell Service Root\";\r\n\r\n            return {\r\n                addToolbarItem: (entry) => {\r\n                    if (!entry.component.displayName) {\r\n                        entry.component.displayName = `${entry.key} | ${entry.verticalLocation} ${entry.horizontalLocation} bar item`;\r\n                    }\r\n\r\n                    return toolbarItemCollection.add(entry);\r\n                },\r\n                addSidePane: (entry) => {\r\n                    if (!entry.content.displayName) {\r\n                        entry.content.displayName = `${entry.key} | ${entry.horizontalLocation} pane`;\r\n                    }\r\n\r\n                    return sidePaneCollection.add(entry);\r\n                },\r\n                addCentralContent: (entry) => centralContentCollection.add(entry),\r\n                get leftSidePaneContainer() {\r\n                    return leftSidePaneContainerState.isPresent ? leftSidePaneContainerState : null;\r\n                },\r\n                get rightSidePaneContainer() {\r\n                    return rightSidePaneContainerState.isPresent ? rightSidePaneContainerState : null;\r\n                },\r\n                onDockChanged,\r\n                get sidePanes() {\r\n                    return [...sidePaneCollection.items].map((sidePaneDefinition) => {\r\n                        return {\r\n                            key: sidePaneDefinition.key,\r\n                            select: () => onSelectSidePane.notifyObservers(sidePaneDefinition.key),\r\n                        };\r\n                    });\r\n                },\r\n                rootComponent,\r\n            };\r\n        },\r\n    };\r\n}\r\n"]}

package/modularTool/services/shellSettingsService.d.ts

@@ -0,0 +1,3 @@
+import { type ServiceDefinition } from "../modularity/serviceDefinition.js";
+import { type ISettingsService } from "./settingsService.js";
+export declare const ShellSettingsServiceDefinition: ServiceDefinition<[], [ISettingsService]>;

package/modularTool/services/shellSettingsService.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { SettingsServiceIdentity } from "./settingsService.js";
+import { ButtonLine } from "../../fluent/hoc/buttonLine.js";
+import { useSetting } from "../hooks/settingsHooks.js";
+import { SidePaneDockOverridesSettingDescriptor, LeftSidePaneWidthAdjustSettingDescriptor, LeftSidePaneHeightAdjustSettingDescriptor, RightSidePaneHeightAdjustSettingDescriptor, RightSidePaneWidthAdjustSettingDescriptor, } from "./shellService.js";
+export const ShellSettingsServiceDefinition = {
+    friendlyName: "Shell Settings Service",
+    consumes: [SettingsServiceIdentity],
+    factory: (settingsService) => {
+        const settingRegistration = settingsService.addSectionContent({
+            key: "Shell Settings",
+            section: "UI",
+            component: () => {
+                const [, , resetSidePaneDockOverrides] = useSetting(SidePaneDockOverridesSettingDescriptor);
+                const [, , resetLeftPaneWidthAdjust] = useSetting(LeftSidePaneWidthAdjustSettingDescriptor);
+                const [, , resetLeftPaneHeightAdjust] = useSetting(LeftSidePaneHeightAdjustSettingDescriptor);
+                const [, , resetRightPaneWidthAdjust] = useSetting(RightSidePaneWidthAdjustSettingDescriptor);
+                const [, , resetRightPaneHeightAdjust] = useSetting(RightSidePaneHeightAdjustSettingDescriptor);
+                return (_jsx(ButtonLine, { label: "Reset Layout", onClick: () => {
+                        resetSidePaneDockOverrides();
+                        resetLeftPaneWidthAdjust();
+                        resetLeftPaneHeightAdjust();
+                        resetRightPaneWidthAdjust();
+                        resetRightPaneHeightAdjust();
+                    } }));
+            },
+        });
+        return {
+            dispose: () => {
+                settingRegistration.dispose();
+            },
+        };
+    },
+};
+//# sourceMappingURL=shellSettingsService.js.map

package/modularTool/services/shellSettingsService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shellSettingsService.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/modularTool/services/shellSettingsService.tsx"],"names":[],"mappings":";AACA,OAAO,EAAyB,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,UAAU,EAAE,MAAM,4CAA4C,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AACpD,OAAO,EACH,sCAAsC,EACtC,wCAAwC,EACxC,yCAAyC,EACzC,0CAA0C,EAC1C,yCAAyC,GAC5C,MAAM,gBAAgB,CAAC;AAExB,MAAM,CAAC,MAAM,8BAA8B,GAA8C;IACrF,YAAY,EAAE,wBAAwB;IACtC,QAAQ,EAAE,CAAC,uBAAuB,CAAC;IACnC,OAAO,EAAE,CAAC,eAAe,EAAE,EAAE;QACzB,MAAM,mBAAmB,GAAG,eAAe,CAAC,iBAAiB,CAAC;YAC1D,GAAG,EAAE,gBAAgB;YACrB,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,GAAG,EAAE;gBACZ,MAAM,CAAC,EAAE,AAAD,EAAG,0BAA0B,CAAC,GAAG,UAAU,CAAC,sCAAsC,CAAC,CAAC;gBAC5F,MAAM,CAAC,EAAE,AAAD,EAAG,wBAAwB,CAAC,GAAG,UAAU,CAAC,wCAAwC,CAAC,CAAC;gBAC5F,MAAM,CAAC,EAAE,AAAD,EAAG,yBAAyB,CAAC,GAAG,UAAU,CAAC,yCAAyC,CAAC,CAAC;gBAC9F,MAAM,CAAC,EAAE,AAAD,EAAG,yBAAyB,CAAC,GAAG,UAAU,CAAC,yCAAyC,CAAC,CAAC;gBAC9F,MAAM,CAAC,EAAE,AAAD,EAAG,0BAA0B,CAAC,GAAG,UAAU,CAAC,0CAA0C,CAAC,CAAC;gBAChG,OAAO,CACH,KAAC,UAAU,IACP,KAAK,EAAC,cAAc,EACpB,OAAO,EAAE,GAAG,EAAE;wBACV,0BAA0B,EAAE,CAAC;wBAC7B,wBAAwB,EAAE,CAAC;wBAC3B,yBAAyB,EAAE,CAAC;wBAC5B,yBAAyB,EAAE,CAAC;wBAC5B,0BAA0B,EAAE,CAAC;oBACjC,CAAC,GACH,CACL,CAAC;YACN,CAAC;SACJ,CAAC,CAAC;QAEH,OAAO;YACH,OAAO,EAAE,GAAG,EAAE;gBACV,mBAAmB,CAAC,OAAO,EAAE,CAAC;YAClC,CAAC;SACJ,CAAC;IACN,CAAC;CACJ,CAAC","sourcesContent":["import { type ServiceDefinition } from \"../modularity/serviceDefinition\";\r\nimport { type ISettingsService, SettingsServiceIdentity } from \"./settingsService\";\r\n\r\nimport { ButtonLine } from \"shared-ui-components/fluent/hoc/buttonLine\";\r\nimport { useSetting } from \"../hooks/settingsHooks\";\r\nimport {\r\n    SidePaneDockOverridesSettingDescriptor,\r\n    LeftSidePaneWidthAdjustSettingDescriptor,\r\n    LeftSidePaneHeightAdjustSettingDescriptor,\r\n    RightSidePaneHeightAdjustSettingDescriptor,\r\n    RightSidePaneWidthAdjustSettingDescriptor,\r\n} from \"./shellService\";\r\n\r\nexport const ShellSettingsServiceDefinition: ServiceDefinition<[], [ISettingsService]> = {\r\n    friendlyName: \"Shell Settings Service\",\r\n    consumes: [SettingsServiceIdentity],\r\n    factory: (settingsService) => {\r\n        const settingRegistration = settingsService.addSectionContent({\r\n            key: \"Shell Settings\",\r\n            section: \"UI\",\r\n            component: () => {\r\n                const [, , resetSidePaneDockOverrides] = useSetting(SidePaneDockOverridesSettingDescriptor);\r\n                const [, , resetLeftPaneWidthAdjust] = useSetting(LeftSidePaneWidthAdjustSettingDescriptor);\r\n                const [, , resetLeftPaneHeightAdjust] = useSetting(LeftSidePaneHeightAdjustSettingDescriptor);\r\n                const [, , resetRightPaneWidthAdjust] = useSetting(RightSidePaneWidthAdjustSettingDescriptor);\r\n                const [, , resetRightPaneHeightAdjust] = useSetting(RightSidePaneHeightAdjustSettingDescriptor);\r\n                return (\r\n                    <ButtonLine\r\n                        label=\"Reset Layout\"\r\n                        onClick={() => {\r\n                            resetSidePaneDockOverrides();\r\n                            resetLeftPaneWidthAdjust();\r\n                            resetLeftPaneHeightAdjust();\r\n                            resetRightPaneWidthAdjust();\r\n                            resetRightPaneHeightAdjust();\r\n                        }}\r\n                    />\r\n                );\r\n            },\r\n        });\r\n\r\n        return {\r\n            dispose: () => {\r\n                settingRegistration.dispose();\r\n            },\r\n        };\r\n    },\r\n};\r\n"]}

package/modularTool/services/themeSelectorService.d.ts

@@ -0,0 +1,3 @@
+import { type ServiceDefinition } from "../modularity/serviceDefinition.js";
+import { type IShellService } from "./shellService.js";
+export declare const ThemeSelectorServiceDefinition: ServiceDefinition<[], [IShellService]>;

package/modularTool/services/themeSelectorService.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { makeStyles, Menu, MenuItemRadio, MenuList, MenuPopover, MenuTrigger, SplitButton, Tooltip, } from "@fluentui/react-components";
+import { ShellServiceIdentity } from "./shellService.js";
+import { WeatherMoonRegular, WeatherSunnyRegular } from "@fluentui/react-icons";
+import { useCallback } from "react";
+import { useThemeMode } from "../hooks/themeHooks.js";
+const useStyles = makeStyles({
+    themeButton: {
+        margin: 0,
+    },
+    themeMenuPopover: {
+        minWidth: 0,
+    },
+});
+export const ThemeSelectorServiceDefinition = {
+    friendlyName: "ThemeSelector",
+    consumes: [ShellServiceIdentity],
+    factory: (shellService) => {
+        const registration = shellService.addToolbarItem({
+            key: "ThemeSelector",
+            horizontalLocation: "right",
+            verticalLocation: "top",
+            teachingMoment: false,
+            order: -300,
+            component: () => {
+                const classes = useStyles();
+                const { isDarkMode, themeMode, setThemeMode } = useThemeMode();
+                const onSelectedThemeChange = useCallback((e, data) => {
+                    setThemeMode(data.checkedItems.includes("System") ? "system" : data.checkedItems[0].toLocaleLowerCase());
+                }, []);
+                const toggleTheme = useCallback(() => {
+                    setThemeMode(isDarkMode ? "light" : "dark");
+                }, [isDarkMode]);
+                return (_jsxs(Menu, { positioning: "below-end", checkedValues: { theme: [themeMode] }, onCheckedValueChange: onSelectedThemeChange, children: [_jsx(MenuTrigger, { disableButtonEnhancement: true, children: (triggerProps) => (_jsx(Tooltip, { content: "Select Theme", relationship: "label", children: _jsx(SplitButton, { className: classes.themeButton, menuButton: triggerProps, primaryActionButton: { onClick: toggleTheme }, size: "small", appearance: "transparent", shape: "circular", icon: isDarkMode ? _jsx(WeatherSunnyRegular, {}) : _jsx(WeatherMoonRegular, {}) }) })) }), _jsx(MenuPopover, { className: classes.themeMenuPopover, children: _jsxs(MenuList, { children: [_jsx(MenuItemRadio, { name: "theme", value: "system", children: "System" }), _jsx(MenuItemRadio, { name: "theme", value: "light", children: "Light" }), _jsx(MenuItemRadio, { name: "theme", value: "dark", children: "Dark" })] }) })] }));
+            },
+        });
+        return {
+            dispose: () => registration.dispose(),
+        };
+    },
+};
+//# sourceMappingURL=themeSelectorService.js.map

package/modularTool/services/themeSelectorService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeSelectorService.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/modularTool/services/themeSelectorService.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\r\n    type MenuButtonProps,\r\n    type MenuCheckedValueChangeData,\r\n    type MenuCheckedValueChangeEvent,\r\n    makeStyles,\r\n    Menu,\r\n    MenuItemRadio,\r\n    MenuList,\r\n    MenuPopover,\r\n    MenuTrigger,\r\n    SplitButton,\r\n    Tooltip,\r\n} from \"@fluentui/react-components\";\r\nimport { type ServiceDefinition } from \"../modularity/serviceDefinition\";\r\nimport { type IShellService, ShellServiceIdentity } from \"./shellService\";\r\nimport { type ThemeMode } from \"./themeService\";\r\n\r\nimport { WeatherMoonRegular, WeatherSunnyRegular } from \"@fluentui/react-icons\";\r\nimport { useCallback } from \"react\";\r\n\r\nimport { useThemeMode } from \"../hooks/themeHooks\";\r\n\r\nconst useStyles = makeStyles({\r\n    themeButton: {\r\n        margin: 0,\r\n    },\r\n    themeMenuPopover: {\r\n        minWidth: 0,\r\n    },\r\n});\r\n\r\nexport const ThemeSelectorServiceDefinition: ServiceDefinition<[], [IShellService]> = {\r\n    friendlyName: \"ThemeSelector\",\r\n    consumes: [ShellServiceIdentity],\r\n    factory: (shellService) => {\r\n        const registration = shellService.addToolbarItem({\r\n            key: \"ThemeSelector\",\r\n            horizontalLocation: \"right\",\r\n            verticalLocation: \"top\",\r\n            teachingMoment: false,\r\n            order: -300,\r\n            component: () => {\r\n                const classes = useStyles();\r\n\r\n                const { isDarkMode, themeMode, setThemeMode } = useThemeMode();\r\n\r\n                const onSelectedThemeChange = useCallback((e: MenuCheckedValueChangeEvent, data: MenuCheckedValueChangeData) => {\r\n                    setThemeMode(data.checkedItems.includes(\"System\") ? \"system\" : (data.checkedItems[0].toLocaleLowerCase() as ThemeMode));\r\n                }, []);\r\n\r\n                const toggleTheme = useCallback(() => {\r\n                    setThemeMode(isDarkMode ? \"light\" : \"dark\");\r\n                }, [isDarkMode]);\r\n\r\n                return (\r\n                    <Menu positioning=\"below-end\" checkedValues={{ theme: [themeMode] }} onCheckedValueChange={onSelectedThemeChange}>\r\n                        <MenuTrigger disableButtonEnhancement={true}>\r\n                            {(triggerProps: MenuButtonProps) => (\r\n                                <Tooltip content=\"Select Theme\" relationship=\"label\">\r\n                                    <SplitButton\r\n                                        className={classes.themeButton}\r\n                                        menuButton={triggerProps}\r\n                                        primaryActionButton={{ onClick: toggleTheme }}\r\n                                        size=\"small\"\r\n                                        appearance=\"transparent\"\r\n                                        shape=\"circular\"\r\n                                        icon={isDarkMode ? <WeatherSunnyRegular /> : <WeatherMoonRegular />}\r\n                                    ></SplitButton>\r\n                                </Tooltip>\r\n                            )}\r\n                        </MenuTrigger>\r\n\r\n                        <MenuPopover className={classes.themeMenuPopover}>\r\n                            <MenuList>\r\n                                <MenuItemRadio name=\"theme\" value={\"system\" satisfies ThemeMode}>\r\n                                    System\r\n                                </MenuItemRadio>\r\n                                <MenuItemRadio name=\"theme\" value={\"light\" satisfies ThemeMode}>\r\n                                    Light\r\n                                </MenuItemRadio>\r\n                                <MenuItemRadio name=\"theme\" value={\"dark\" satisfies ThemeMode}>\r\n                                    Dark\r\n                                </MenuItemRadio>\r\n                            </MenuList>\r\n                        </MenuPopover>\r\n                    </Menu>\r\n                );\r\n            },\r\n        });\r\n\r\n        return {\r\n            dispose: () => registration.dispose(),\r\n        };\r\n    },\r\n};\r\n"]}

package/modularTool/services/themeService.d.ts

@@ -0,0 +1,60 @@
+import { type Theme } from "@fluentui/react-components";
+import { type IDisposable, type IReadonlyObservable } from "@onerjs/core/index.js";
+import { type IService, type ServiceDefinition } from "../modularity/serviceDefinition.js";
+import { type ISettingsStore, type SettingDescriptor } from "./settingsStore.js";
+/**
+ * Represents the theme mode preference.
+ */
+export type ThemeMode = "system" | "light" | "dark";
+/**
+ * The setting descriptor for persisting the theme mode preference.
+ */
+export declare const ThemeModeSettingDescriptor: SettingDescriptor<ThemeMode>;
+/**
+ * Resolves the current theme based on user preference and system settings.
+ * Listens for changes to both the persisted theme mode and the OS-level dark mode preference.
+ */
+export declare class ThemeResolver implements IDisposable {
+    private readonly _settingsStore;
+    private readonly _darkModeMediaQuery;
+    private readonly _onChanged;
+    private readonly _onDarkModeMediaQueryChange;
+    private readonly _settingsStoreObserver;
+    constructor(_settingsStore: ISettingsStore);
+    get onChanged(): IReadonlyObservable<void>;
+    get mode(): ThemeMode;
+    set mode(value: ThemeMode);
+    get isDark(): boolean;
+    toggle(): void;
+    dispose(): void;
+}
+/**
+ * The unique identity symbol for the theme service.
+ */
+export declare const ThemeServiceIdentity: unique symbol;
+/**
+ * Exposes the current theme used by the application.
+ */
+export interface IThemeService extends IService<typeof ThemeServiceIdentity> {
+    /**
+     * Whether the current theme is the dark variant or not.
+     */
+    readonly isDark: boolean;
+    /**
+     * The current theme mode, which can be either "light", "dark" or "system". When set to "system", the theme will match the user's OS-level preference and update automatically when it changes.
+     */
+    mode: ThemeMode;
+    /**
+     * Toggles the theme mode between light and dark. If the current mode is "system", it will toggle based on the current OS-level preference.
+     */
+    toggle(): void;
+    /**
+     * The current theme used by the application.
+     */
+    readonly theme: Theme;
+    /**
+     * Observable that fires whenever the theme changes.
+     */
+    readonly onChanged: IReadonlyObservable<void>;
+}
+export declare const ThemeServiceDefinition: ServiceDefinition<[IThemeService], [ISettingsStore]>;

package/modularTool/services/themeService.js

@@ -0,0 +1,69 @@
+import { SettingsStoreIdentity } from "./settingsStore.js";
+import { Observable } from "@onerjs/core/Misc/observable.js";
+import { DarkTheme, LightTheme } from "../themes/babylonTheme.js";
+/**
+ * The setting descriptor for persisting the theme mode preference.
+ */
+export const ThemeModeSettingDescriptor = {
+    key: "ThemeMode",
+    defaultValue: "system",
+};
+/**
+ * Resolves the current theme based on user preference and system settings.
+ * Listens for changes to both the persisted theme mode and the OS-level dark mode preference.
+ */
+export class ThemeResolver {
+    constructor(_settingsStore) {
+        this._settingsStore = _settingsStore;
+        this._darkModeMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+        this._onChanged = new Observable();
+        this._onDarkModeMediaQueryChange = () => this._onChanged.notifyObservers();
+        this._darkModeMediaQuery.addEventListener("change", this._onDarkModeMediaQueryChange);
+        this._settingsStoreObserver = this._settingsStore.onChanged.add((key) => {
+            if (key === ThemeModeSettingDescriptor.key) {
+                this._onChanged.notifyObservers();
+            }
+        });
+    }
+    get onChanged() {
+        return this._onChanged;
+    }
+    get mode() {
+        return this._settingsStore.readSetting(ThemeModeSettingDescriptor);
+    }
+    set mode(value) {
+        if (value !== this.mode) {
+            this._settingsStore.writeSetting(ThemeModeSettingDescriptor, value);
+        }
+    }
+    get isDark() {
+        const themeMode = this.mode;
+        return themeMode === "dark" || (themeMode === "system" && this._darkModeMediaQuery.matches);
+    }
+    toggle() {
+        this.mode = this.isDark ? "light" : "dark";
+    }
+    dispose() {
+        this._onChanged.clear();
+        this._darkModeMediaQuery.removeEventListener("change", this._onDarkModeMediaQueryChange);
+        this._settingsStoreObserver.remove();
+    }
+}
+/**
+ * The unique identity symbol for the theme service.
+ */
+export const ThemeServiceIdentity = Symbol("ThemeService");
+export const ThemeServiceDefinition = {
+    friendlyName: "Theme Service",
+    produces: [ThemeServiceIdentity],
+    consumes: [SettingsStoreIdentity],
+    factory: (settingsStore) => {
+        const themeResolver = new ThemeResolver(settingsStore);
+        return Object.assign(themeResolver, {
+            get theme() {
+                return themeResolver.isDark ? DarkTheme : LightTheme;
+            },
+        });
+    },
+};
+//# sourceMappingURL=themeService.js.map

package/modularTool/services/themeService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeService.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/modularTool/services/themeService.ts"],"names":[],"mappings":"AAIA,OAAO,EAA+C,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAErG,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAO/D;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAiC;IACpE,GAAG,EAAE,WAAW;IAChB,YAAY,EAAE,QAAQ;CACzB,CAAC;AAEF;;;GAGG;AACH,MAAM,OAAO,aAAa;IAMtB,YAAoC,cAA8B;QAA9B,mBAAc,GAAd,cAAc,CAAgB;QALjD,wBAAmB,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;QACxE,eAAU,GAAG,IAAI,UAAU,EAAQ,CAAC;QACpC,gCAA2B,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,eAAe,EAAE,CAAC;QAInF,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,2BAA2B,CAAC,CAAC;QACtF,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;YACpE,IAAI,GAAG,KAAK,0BAA0B,CAAC,GAAG,EAAE,CAAC;gBACzC,IAAI,CAAC,UAAU,CAAC,eAAe,EAAE,CAAC;YACtC,CAAC;QACL,CAAC,CAAC,CAAC;IACP,CAAC;IAED,IAAW,SAAS;QAChB,OAAO,IAAI,CAAC,UAAU,CAAC;IAC3B,CAAC;IAED,IAAW,IAAI;QACX,OAAO,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,0BAA0B,CAAC,CAAC;IACvE,CAAC;IAED,IAAW,IAAI,CAAC,KAAgB;QAC5B,IAAI,KAAK,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC;YACtB,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,0BAA0B,EAAE,KAAK,CAAC,CAAC;QACxE,CAAC;IACL,CAAC;IAED,IAAW,MAAM;QACb,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC;QAC5B,OAAO,SAAS,KAAK,MAAM,IAAI,CAAC,SAAS,KAAK,QAAQ,IAAI,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC;IAChG,CAAC;IAEM,MAAM;QACT,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC;IAC/C,CAAC;IAEM,OAAO;QACV,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;QACxB,IAAI,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,2BAA2B,CAAC,CAAC;QACzF,IAAI,CAAC,sBAAsB,CAAC,MAAM,EAAE,CAAC;IACzC,CAAC;CACJ;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;AAgC3D,MAAM,CAAC,MAAM,sBAAsB,GAAyD;IACxF,YAAY,EAAE,eAAe;IAC7B,QAAQ,EAAE,CAAC,oBAAoB,CAAC;IAChC,QAAQ,EAAE,CAAC,qBAAqB,CAAC;IACjC,OAAO,EAAE,CAAC,aAAa,EAAE,EAAE;QACvB,MAAM,aAAa,GAAG,IAAI,aAAa,CAAC,aAAa,CAAC,CAAC;QACvD,OAAO,MAAM,CAAC,MAAM,CAAC,aAAa,EAAE;YAChC,IAAI,KAAK;gBACL,OAAO,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC;YACzD,CAAC;SACJ,CAAC,CAAC;IACP,CAAC;CACJ,CAAC","sourcesContent":["import { type Theme } from \"@fluentui/react-components\";\r\n\r\nimport { type IDisposable, type IObserver, type IReadonlyObservable } from \"core/index\";\r\nimport { type IService, type ServiceDefinition } from \"../modularity/serviceDefinition\";\r\nimport { type ISettingsStore, type SettingDescriptor, SettingsStoreIdentity } from \"./settingsStore\";\r\n\r\nimport { Observable } from \"core/Misc/observable\";\r\nimport { DarkTheme, LightTheme } from \"../themes/babylonTheme\";\r\n\r\n/**\r\n * Represents the theme mode preference.\r\n */\r\nexport type ThemeMode = \"system\" | \"light\" | \"dark\";\r\n\r\n/**\r\n * The setting descriptor for persisting the theme mode preference.\r\n */\r\nexport const ThemeModeSettingDescriptor: SettingDescriptor<ThemeMode> = {\r\n    key: \"ThemeMode\",\r\n    defaultValue: \"system\",\r\n};\r\n\r\n/**\r\n * Resolves the current theme based on user preference and system settings.\r\n * Listens for changes to both the persisted theme mode and the OS-level dark mode preference.\r\n */\r\nexport class ThemeResolver implements IDisposable {\r\n    private readonly _darkModeMediaQuery = window.matchMedia(\"(prefers-color-scheme: dark)\");\r\n    private readonly _onChanged = new Observable<void>();\r\n    private readonly _onDarkModeMediaQueryChange = () => this._onChanged.notifyObservers();\r\n    private readonly _settingsStoreObserver: IObserver;\r\n\r\n    public constructor(private readonly _settingsStore: ISettingsStore) {\r\n        this._darkModeMediaQuery.addEventListener(\"change\", this._onDarkModeMediaQueryChange);\r\n        this._settingsStoreObserver = this._settingsStore.onChanged.add((key) => {\r\n            if (key === ThemeModeSettingDescriptor.key) {\r\n                this._onChanged.notifyObservers();\r\n            }\r\n        });\r\n    }\r\n\r\n    public get onChanged(): IReadonlyObservable<void> {\r\n        return this._onChanged;\r\n    }\r\n\r\n    public get mode(): ThemeMode {\r\n        return this._settingsStore.readSetting(ThemeModeSettingDescriptor);\r\n    }\r\n\r\n    public set mode(value: ThemeMode) {\r\n        if (value !== this.mode) {\r\n            this._settingsStore.writeSetting(ThemeModeSettingDescriptor, value);\r\n        }\r\n    }\r\n\r\n    public get isDark() {\r\n        const themeMode = this.mode;\r\n        return themeMode === \"dark\" || (themeMode === \"system\" && this._darkModeMediaQuery.matches);\r\n    }\r\n\r\n    public toggle() {\r\n        this.mode = this.isDark ? \"light\" : \"dark\";\r\n    }\r\n\r\n    public dispose() {\r\n        this._onChanged.clear();\r\n        this._darkModeMediaQuery.removeEventListener(\"change\", this._onDarkModeMediaQueryChange);\r\n        this._settingsStoreObserver.remove();\r\n    }\r\n}\r\n\r\n/**\r\n * The unique identity symbol for the theme service.\r\n */\r\nexport const ThemeServiceIdentity = Symbol(\"ThemeService\");\r\n\r\n/**\r\n * Exposes the current theme used by the application.\r\n */\r\nexport interface IThemeService extends IService<typeof ThemeServiceIdentity> {\r\n    /**\r\n     * Whether the current theme is the dark variant or not.\r\n     */\r\n    readonly isDark: boolean;\r\n\r\n    /**\r\n     * The current theme mode, which can be either \"light\", \"dark\" or \"system\". When set to \"system\", the theme will match the user's OS-level preference and update automatically when it changes.\r\n     */\r\n    mode: ThemeMode;\r\n\r\n    /**\r\n     * Toggles the theme mode between light and dark. If the current mode is \"system\", it will toggle based on the current OS-level preference.\r\n     */\r\n    toggle(): void;\r\n\r\n    /**\r\n     * The current theme used by the application.\r\n     */\r\n    readonly theme: Theme;\r\n\r\n    /**\r\n     * Observable that fires whenever the theme changes.\r\n     */\r\n    readonly onChanged: IReadonlyObservable<void>;\r\n}\r\n\r\nexport const ThemeServiceDefinition: ServiceDefinition<[IThemeService], [ISettingsStore]> = {\r\n    friendlyName: \"Theme Service\",\r\n    produces: [ThemeServiceIdentity],\r\n    consumes: [SettingsStoreIdentity],\r\n    factory: (settingsStore) => {\r\n        const themeResolver = new ThemeResolver(settingsStore);\r\n        return Object.assign(themeResolver, {\r\n            get theme() {\r\n                return themeResolver.isDark ? DarkTheme : LightTheme;\r\n            },\r\n        });\r\n    },\r\n};\r\n"]}

package/modularTool/themes/babylonTheme.d.ts

@@ -0,0 +1,3 @@
+import { type Theme } from "@fluentui/react-components";
+export declare const LightTheme: Theme;
+export declare const DarkTheme: Theme;

package/modularTool/themes/babylonTheme.js

@@ -0,0 +1,36 @@
+import { createDarkTheme, createLightTheme } from "@fluentui/react-components";
+// Generated from https://react.fluentui.dev/?path=/docs/theme-theme-designer--docs
+// Key color: #3A94FC
+/* eslint-disable @typescript-eslint/naming-convention */
+const BabylonRamp = {
+    10: "#020305",
+    20: "#121721",
+    30: "#1A263A",
+    40: "#1F314F",
+    50: "#243E64",
+    60: "#294B7B",
+    70: "#2D5892",
+    80: "#3166AA",
+    90: "#3473C3",
+    100: "#3782DC",
+    110: "#3990F6",
+    120: "#5A9EFD",
+    130: "#7BACFE",
+    140: "#96BAFF",
+    150: "#AFC9FF",
+    160: "#C6D8FF",
+};
+/* eslint-enable @typescript-eslint/naming-convention */
+const BaseLightTheme = createLightTheme(BabylonRamp);
+export const LightTheme = {
+    ...BaseLightTheme,
+    // Reduce the max contrast between foreground and background by just replacing the most intense foreground color with the second most intense one.
+    colorNeutralForeground1: BaseLightTheme.colorNeutralForeground2,
+};
+const BaseDarkTheme = createDarkTheme(BabylonRamp);
+export const DarkTheme = {
+    ...BaseDarkTheme,
+    // Reduce the max contrast between foreground and background by just replacing the most intense foreground color with the second most intense one.
+    colorNeutralForeground1: BaseDarkTheme.colorNeutralForeground2,
+};
+//# sourceMappingURL=babylonTheme.js.map

package/modularTool/themes/babylonTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"babylonTheme.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/modularTool/themes/babylonTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkC,eAAe,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAE/G,mFAAmF;AACnF,qBAAqB;AACrB,yDAAyD;AACzD,MAAM,WAAW,GAAkB;IAC/B,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;CACjB,CAAC;AACF,wDAAwD;AAExD,MAAM,cAAc,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;AACrD,MAAM,CAAC,MAAM,UAAU,GAAU;IAC7B,GAAG,cAAc;IACjB,kJAAkJ;IAClJ,uBAAuB,EAAE,cAAc,CAAC,uBAAuB;CAClE,CAAC;AAEF,MAAM,aAAa,GAAG,eAAe,CAAC,WAAW,CAAC,CAAC;AACnD,MAAM,CAAC,MAAM,SAAS,GAAU;IAC5B,GAAG,aAAa;IAChB,kJAAkJ;IAClJ,uBAAuB,EAAE,aAAa,CAAC,uBAAuB;CACjE,CAAC","sourcesContent":["import { type BrandVariants, type Theme, createDarkTheme, createLightTheme } from \"@fluentui/react-components\";\r\n\r\n// Generated from https://react.fluentui.dev/?path=/docs/theme-theme-designer--docs\r\n// Key color: #3A94FC\r\n/* eslint-disable @typescript-eslint/naming-convention */\r\nconst BabylonRamp: BrandVariants = {\r\n    10: \"#020305\",\r\n    20: \"#121721\",\r\n    30: \"#1A263A\",\r\n    40: \"#1F314F\",\r\n    50: \"#243E64\",\r\n    60: \"#294B7B\",\r\n    70: \"#2D5892\",\r\n    80: \"#3166AA\",\r\n    90: \"#3473C3\",\r\n    100: \"#3782DC\",\r\n    110: \"#3990F6\",\r\n    120: \"#5A9EFD\",\r\n    130: \"#7BACFE\",\r\n    140: \"#96BAFF\",\r\n    150: \"#AFC9FF\",\r\n    160: \"#C6D8FF\",\r\n};\r\n/* eslint-enable @typescript-eslint/naming-convention */\r\n\r\nconst BaseLightTheme = createLightTheme(BabylonRamp);\r\nexport const LightTheme: Theme = {\r\n    ...BaseLightTheme,\r\n    // Reduce the max contrast between foreground and background by just replacing the most intense foreground color with the second most intense one.\r\n    colorNeutralForeground1: BaseLightTheme.colorNeutralForeground2,\r\n};\r\n\r\nconst BaseDarkTheme = createDarkTheme(BabylonRamp);\r\nexport const DarkTheme: Theme = {\r\n    ...BaseDarkTheme,\r\n    // Reduce the max contrast between foreground and background by just replacing the most intense foreground color with the second most intense one.\r\n    colorNeutralForeground1: BaseDarkTheme.colorNeutralForeground2,\r\n};\r\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@onerjs/shared-ui-components",
-    "version": "8.48.4",
+    "version": "8.48.5",
     "main": "index.js",
     "module": "index.js",
     "types": "index.d.ts",