@onerjs/shared-ui-components 8.41.5 → 8.41.7

package/fluent/hoc/childWindow.js

@@ -107,22 +107,9 @@ export const ChildWindow = (props) => {
             body.style.padding = "0";
             body.style.display = "flex";
             body.style.overflow = "hidden";
-            const applyWindowState = () => {
-                // Setup the window state, including creating a Fluent/Griffel "renderer" for managing runtime styles/classes in the child window.
-                setWindowState({ mountNode: body, renderer: createDOMRenderer(childWindow.document) });
-                onOpenChange?.(true);
-            };
-            // Once the child window document is ready, setup the window state which will trigger another effect that renders into the child window.
-            if (childWindow.document.readyState === "complete") {
-                applyWindowState();
-            }
-            else {
-                const onChildWindowLoad = () => {
-                    applyWindowState();
-                };
-                childWindow.addEventListener("load", onChildWindowLoad, { once: true });
-                disposeActions.push(() => childWindow.removeEventListener("load", onChildWindowLoad));
-            }
+            // Setup the window state, including creating a Fluent/Griffel "renderer" for managing runtime styles/classes in the child window.
+            setWindowState({ mountNode: body, renderer: createDOMRenderer(childWindow.document) });
+            onOpenChange?.(true);
             // When the child window is closed for any reason, transition back to a closed state.
             const onChildWindowUnload = () => {
                 setWindowState(undefined);

package/fluent/hoc/childWindow.js.map

@@ -1 +1 @@
-{"version":3,"file":"childWindow.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/hoc/childWindow.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { GriffelRenderer } from \"@fluentui/react-components\";\r\nimport type { FunctionComponent, PropsWithChildren, Ref } from \"react\";\r\n\r\nimport { createDOMRenderer, FluentProvider, Portal, RendererProvider } from \"@fluentui/react-components\";\r\nimport { useCallback, useEffect, useImperativeHandle, useState } from \"react\";\r\n\r\nimport { Logger } from \"core/Misc/logger\";\r\nimport { ToastProvider } from \"../primitives/toast\";\r\n\r\nfunction ToFeaturesString(options: ChildWindowOptions) {\r\n    const { defaultWidth, defaultHeight, defaultLeft, defaultTop } = options;\r\n\r\n    const features: { key: string; value: string }[] = [];\r\n\r\n    if (defaultWidth !== undefined) {\r\n        features.push({ key: \"width\", value: defaultWidth.toString() });\r\n    }\r\n    if (defaultHeight !== undefined) {\r\n        features.push({ key: \"height\", value: defaultHeight.toString() });\r\n    }\r\n    if (defaultLeft !== undefined) {\r\n        features.push({ key: \"left\", value: defaultLeft.toString() });\r\n    }\r\n    if (defaultTop !== undefined) {\r\n        features.push({ key: \"top\", value: defaultTop.toString() });\r\n    }\r\n    features.push({ key: \"location\", value: \"no\" });\r\n\r\n    return features.map((feature) => `${feature.key}=${feature.value}`).join(\",\");\r\n}\r\n\r\nexport type ChildWindowOptions = {\r\n    /**\r\n     * The default width of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultWidth?: number;\r\n\r\n    /**\r\n     * The default height of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultHeight?: number;\r\n\r\n    /**\r\n     * The default left position of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultLeft?: number;\r\n\r\n    /**\r\n     * The default top position of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultTop?: number;\r\n\r\n    /**\r\n     * The title of the child window.\r\n     * @remarks If not provided, the id will be used instead (if any).\r\n     */\r\n    title?: string;\r\n};\r\n\r\nexport type ChildWindow = {\r\n    /**\r\n     * Opens the child window.\r\n     * @param options Options for opening the child window.\r\n     */\r\n    open: (options?: ChildWindowOptions) => void;\r\n\r\n    /**\r\n     * Closes the child window.\r\n     */\r\n    close: () => void;\r\n};\r\n\r\nexport type ChildWindowProps = {\r\n    /**\r\n     * An optional unique identity for the child window.\r\n     * @remarks If provided, the child window's bounds will be saved/restored using this identity.\r\n     */\r\n    id?: string;\r\n\r\n    /**\r\n     * Called when the open state of the child window changes.\r\n     * @param isOpen Whether the child window is open.\r\n     */\r\n    onOpenChange?: (isOpen: boolean) => void;\r\n\r\n    /**\r\n     * A ref that exposes the ChildWindow imperative API.\r\n     */\r\n    imperativeRef?: Ref<ChildWindow>;\r\n};\r\n\r\n/**\r\n * Allows displaying a child window that can contain child components.\r\n * @param props Props for the child window.\r\n * @returns The child window component.\r\n */\r\nexport const ChildWindow: FunctionComponent<PropsWithChildren<ChildWindowProps>> = (props) => {\r\n    const { id, children, onOpenChange, imperativeRef: imperativeRef } = props;\r\n\r\n    const [windowState, setWindowState] = useState<{ mountNode: HTMLElement; renderer: GriffelRenderer }>();\r\n    const [childWindow, setChildWindow] = useState<Window>();\r\n\r\n    const storageKey = id ? `Babylon/Settings/ChildWindow/${id}/Bounds` : null;\r\n\r\n    // This function is just for creating the child window itself. It is a function because\r\n    // it must be called synchronously in response to a user interaction (e.g. button click),\r\n    // otherwise the browser will block it as a scripted popup.\r\n    const createWindow = useCallback(\r\n        (options: ChildWindowOptions = {}) => {\r\n            if (storageKey) {\r\n                // If we are persisting window bounds, but the window is already open, just use the existing bounds.\r\n                // Otherwise, try to load bounds from storage.\r\n                if (childWindow) {\r\n                    options.defaultLeft = childWindow.screenX;\r\n                    options.defaultTop = childWindow.screenY;\r\n                    options.defaultWidth = childWindow.innerWidth;\r\n                    options.defaultHeight = childWindow.innerHeight;\r\n                } else {\r\n                    const savedBounds = localStorage.getItem(storageKey);\r\n                    if (savedBounds) {\r\n                        try {\r\n                            const bounds = JSON.parse(savedBounds);\r\n                            options.defaultLeft = bounds.left;\r\n                            options.defaultTop = bounds.top;\r\n                            options.defaultWidth = bounds.width;\r\n                            options.defaultHeight = bounds.height;\r\n                        } catch {\r\n                            Logger.Warn(`Could not parse saved bounds for child window with key ${storageKey}`);\r\n                        }\r\n                    }\r\n                }\r\n            }\r\n\r\n            // Half width by default.\r\n            if (!options.defaultWidth) {\r\n                options.defaultWidth = window.innerWidth * (2 / 3);\r\n            }\r\n            // Half height by default.\r\n            if (!options.defaultHeight) {\r\n                options.defaultHeight = window.innerHeight * (2 / 3);\r\n            }\r\n            // Horizontally centered by default.\r\n            if (!options.defaultLeft) {\r\n                options.defaultLeft = window.screenX + (window.innerWidth - options.defaultWidth) * (2 / 3);\r\n            }\r\n            // Vertically centered by default.\r\n            if (!options.defaultTop) {\r\n                options.defaultTop = window.screenY + (window.innerHeight - options.defaultHeight) * (2 / 3);\r\n            }\r\n\r\n            // Try to create the child window (can be null if popups are blocked).\r\n            const newChildWindow = window.open(\"\", \"\", ToFeaturesString(options));\r\n            if (newChildWindow) {\r\n                // Set the title if provided.\r\n                newChildWindow.document.title = options.title ?? id ?? \"\";\r\n\r\n                // Set the child window state.\r\n                setChildWindow((current) => {\r\n                    // But first close any existing child window.\r\n                    current?.close();\r\n                    return newChildWindow;\r\n                });\r\n            }\r\n        },\r\n        [childWindow, storageKey]\r\n    );\r\n\r\n    useImperativeHandle(imperativeRef, () => {\r\n        return {\r\n            open: createWindow,\r\n            close: () => setChildWindow(undefined),\r\n        };\r\n    }, [createWindow]);\r\n\r\n    // This side effect runs any time the child window instance changes. It does the rest of the child window\r\n    // setup work, including creating resources and state needed to properly render the content of the child window.\r\n    useEffect(() => {\r\n        const disposeActions: (() => void)[] = [];\r\n\r\n        if (childWindow) {\r\n            const body = childWindow.document.body;\r\n            body.style.width = \"100%\";\r\n            body.style.height = \"100%\";\r\n            body.style.margin = \"0\";\r\n            body.style.padding = \"0\";\r\n            body.style.display = \"flex\";\r\n            body.style.overflow = \"hidden\";\r\n\r\n            const applyWindowState = () => {\r\n                // Setup the window state, including creating a Fluent/Griffel \"renderer\" for managing runtime styles/classes in the child window.\r\n                setWindowState({ mountNode: body, renderer: createDOMRenderer(childWindow.document) });\r\n                onOpenChange?.(true);\r\n            };\r\n\r\n            // Once the child window document is ready, setup the window state which will trigger another effect that renders into the child window.\r\n            if (childWindow.document.readyState === \"complete\") {\r\n                applyWindowState();\r\n            } else {\r\n                const onChildWindowLoad = () => {\r\n                    applyWindowState();\r\n                };\r\n                childWindow.addEventListener(\"load\", onChildWindowLoad, { once: true });\r\n                disposeActions.push(() => childWindow.removeEventListener(\"load\", onChildWindowLoad));\r\n            }\r\n\r\n            // When the child window is closed for any reason, transition back to a closed state.\r\n            const onChildWindowUnload = () => {\r\n                setWindowState(undefined);\r\n                setChildWindow(undefined);\r\n                onOpenChange?.(false);\r\n            };\r\n            childWindow.addEventListener(\"unload\", onChildWindowUnload, { once: true });\r\n            disposeActions.push(() => childWindow.removeEventListener(\"unload\", onChildWindowUnload));\r\n\r\n            // If the main window closes, close any open child windows as well (don't leave them orphaned).\r\n            const onParentWindowUnload = () => {\r\n                childWindow.close();\r\n            };\r\n            window.addEventListener(\"unload\", onParentWindowUnload, { once: true });\r\n            disposeActions.push(() => window.removeEventListener(\"unload\", onParentWindowUnload));\r\n\r\n            // On dispose, close the child window.\r\n            disposeActions.push(() => childWindow.close());\r\n\r\n            // On dispose, save the window bounds.\r\n            disposeActions.push(() => {\r\n                if (storageKey) {\r\n                    localStorage.setItem(\r\n                        storageKey,\r\n                        JSON.stringify({\r\n                            left: childWindow.screenX,\r\n                            top: childWindow.screenY,\r\n                            width: childWindow.innerWidth,\r\n                            height: childWindow.innerHeight,\r\n                        })\r\n                    );\r\n                }\r\n            });\r\n        }\r\n\r\n        return () => {\r\n            disposeActions.reverse().forEach((dispose) => dispose());\r\n        };\r\n    }, [childWindow]);\r\n\r\n    if (!windowState) {\r\n        return null;\r\n    }\r\n\r\n    const { mountNode, renderer } = windowState;\r\n\r\n    return (\r\n        // Portal targets the body of the child window.\r\n        <Portal mountNode={mountNode}>\r\n            {/* RenderProvider manages Fluent style/class state. */}\r\n            <RendererProvider renderer={renderer} targetDocument={mountNode.ownerDocument}>\r\n                {/* Fluent Provider is needed for managing other Fluent state and applying the current theme mode. */}\r\n                <FluentProvider\r\n                    style={{\r\n                        display: \"flex\",\r\n                        flexGrow: 1,\r\n                        flexDirection: \"column\",\r\n                        overflow: \"hidden\",\r\n                    }}\r\n                    applyStylesToPortals={false}\r\n                    targetDocument={mountNode.ownerDocument}\r\n                >\r\n                    <ToastProvider>{children}</ToastProvider>\r\n                </FluentProvider>\r\n            </RendererProvider>\r\n        </Portal>\r\n    );\r\n};\r\n"]}
+{"version":3,"file":"childWindow.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/hoc/childWindow.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { GriffelRenderer } from \"@fluentui/react-components\";\r\nimport type { FunctionComponent, PropsWithChildren, Ref } from \"react\";\r\n\r\nimport { createDOMRenderer, FluentProvider, Portal, RendererProvider } from \"@fluentui/react-components\";\r\nimport { useCallback, useEffect, useImperativeHandle, useState } from \"react\";\r\n\r\nimport { Logger } from \"core/Misc/logger\";\r\nimport { ToastProvider } from \"../primitives/toast\";\r\n\r\nfunction ToFeaturesString(options: ChildWindowOptions) {\r\n    const { defaultWidth, defaultHeight, defaultLeft, defaultTop } = options;\r\n\r\n    const features: { key: string; value: string }[] = [];\r\n\r\n    if (defaultWidth !== undefined) {\r\n        features.push({ key: \"width\", value: defaultWidth.toString() });\r\n    }\r\n    if (defaultHeight !== undefined) {\r\n        features.push({ key: \"height\", value: defaultHeight.toString() });\r\n    }\r\n    if (defaultLeft !== undefined) {\r\n        features.push({ key: \"left\", value: defaultLeft.toString() });\r\n    }\r\n    if (defaultTop !== undefined) {\r\n        features.push({ key: \"top\", value: defaultTop.toString() });\r\n    }\r\n    features.push({ key: \"location\", value: \"no\" });\r\n\r\n    return features.map((feature) => `${feature.key}=${feature.value}`).join(\",\");\r\n}\r\n\r\nexport type ChildWindowOptions = {\r\n    /**\r\n     * The default width of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultWidth?: number;\r\n\r\n    /**\r\n     * The default height of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultHeight?: number;\r\n\r\n    /**\r\n     * The default left position of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultLeft?: number;\r\n\r\n    /**\r\n     * The default top position of the child window in pixels.\r\n     * @remarks Ignored if the ChildWindow was passed an id and previous bounds were saved.\r\n     */\r\n    defaultTop?: number;\r\n\r\n    /**\r\n     * The title of the child window.\r\n     * @remarks If not provided, the id will be used instead (if any).\r\n     */\r\n    title?: string;\r\n};\r\n\r\nexport type ChildWindow = {\r\n    /**\r\n     * Opens the child window.\r\n     * @param options Options for opening the child window.\r\n     */\r\n    open: (options?: ChildWindowOptions) => void;\r\n\r\n    /**\r\n     * Closes the child window.\r\n     */\r\n    close: () => void;\r\n};\r\n\r\nexport type ChildWindowProps = {\r\n    /**\r\n     * An optional unique identity for the child window.\r\n     * @remarks If provided, the child window's bounds will be saved/restored using this identity.\r\n     */\r\n    id?: string;\r\n\r\n    /**\r\n     * Called when the open state of the child window changes.\r\n     * @param isOpen Whether the child window is open.\r\n     */\r\n    onOpenChange?: (isOpen: boolean) => void;\r\n\r\n    /**\r\n     * A ref that exposes the ChildWindow imperative API.\r\n     */\r\n    imperativeRef?: Ref<ChildWindow>;\r\n};\r\n\r\n/**\r\n * Allows displaying a child window that can contain child components.\r\n * @param props Props for the child window.\r\n * @returns The child window component.\r\n */\r\nexport const ChildWindow: FunctionComponent<PropsWithChildren<ChildWindowProps>> = (props) => {\r\n    const { id, children, onOpenChange, imperativeRef: imperativeRef } = props;\r\n\r\n    const [windowState, setWindowState] = useState<{ mountNode: HTMLElement; renderer: GriffelRenderer }>();\r\n    const [childWindow, setChildWindow] = useState<Window>();\r\n\r\n    const storageKey = id ? `Babylon/Settings/ChildWindow/${id}/Bounds` : null;\r\n\r\n    // This function is just for creating the child window itself. It is a function because\r\n    // it must be called synchronously in response to a user interaction (e.g. button click),\r\n    // otherwise the browser will block it as a scripted popup.\r\n    const createWindow = useCallback(\r\n        (options: ChildWindowOptions = {}) => {\r\n            if (storageKey) {\r\n                // If we are persisting window bounds, but the window is already open, just use the existing bounds.\r\n                // Otherwise, try to load bounds from storage.\r\n                if (childWindow) {\r\n                    options.defaultLeft = childWindow.screenX;\r\n                    options.defaultTop = childWindow.screenY;\r\n                    options.defaultWidth = childWindow.innerWidth;\r\n                    options.defaultHeight = childWindow.innerHeight;\r\n                } else {\r\n                    const savedBounds = localStorage.getItem(storageKey);\r\n                    if (savedBounds) {\r\n                        try {\r\n                            const bounds = JSON.parse(savedBounds);\r\n                            options.defaultLeft = bounds.left;\r\n                            options.defaultTop = bounds.top;\r\n                            options.defaultWidth = bounds.width;\r\n                            options.defaultHeight = bounds.height;\r\n                        } catch {\r\n                            Logger.Warn(`Could not parse saved bounds for child window with key ${storageKey}`);\r\n                        }\r\n                    }\r\n                }\r\n            }\r\n\r\n            // Half width by default.\r\n            if (!options.defaultWidth) {\r\n                options.defaultWidth = window.innerWidth * (2 / 3);\r\n            }\r\n            // Half height by default.\r\n            if (!options.defaultHeight) {\r\n                options.defaultHeight = window.innerHeight * (2 / 3);\r\n            }\r\n            // Horizontally centered by default.\r\n            if (!options.defaultLeft) {\r\n                options.defaultLeft = window.screenX + (window.innerWidth - options.defaultWidth) * (2 / 3);\r\n            }\r\n            // Vertically centered by default.\r\n            if (!options.defaultTop) {\r\n                options.defaultTop = window.screenY + (window.innerHeight - options.defaultHeight) * (2 / 3);\r\n            }\r\n\r\n            // Try to create the child window (can be null if popups are blocked).\r\n            const newChildWindow = window.open(\"\", \"\", ToFeaturesString(options));\r\n            if (newChildWindow) {\r\n                // Set the title if provided.\r\n                newChildWindow.document.title = options.title ?? id ?? \"\";\r\n\r\n                // Set the child window state.\r\n                setChildWindow((current) => {\r\n                    // But first close any existing child window.\r\n                    current?.close();\r\n                    return newChildWindow;\r\n                });\r\n            }\r\n        },\r\n        [childWindow, storageKey]\r\n    );\r\n\r\n    useImperativeHandle(imperativeRef, () => {\r\n        return {\r\n            open: createWindow,\r\n            close: () => setChildWindow(undefined),\r\n        };\r\n    }, [createWindow]);\r\n\r\n    // This side effect runs any time the child window instance changes. It does the rest of the child window\r\n    // setup work, including creating resources and state needed to properly render the content of the child window.\r\n    useEffect(() => {\r\n        const disposeActions: (() => void)[] = [];\r\n\r\n        if (childWindow) {\r\n            const body = childWindow.document.body;\r\n            body.style.width = \"100%\";\r\n            body.style.height = \"100%\";\r\n            body.style.margin = \"0\";\r\n            body.style.padding = \"0\";\r\n            body.style.display = \"flex\";\r\n            body.style.overflow = \"hidden\";\r\n\r\n            // Setup the window state, including creating a Fluent/Griffel \"renderer\" for managing runtime styles/classes in the child window.\r\n            setWindowState({ mountNode: body, renderer: createDOMRenderer(childWindow.document) });\r\n            onOpenChange?.(true);\r\n\r\n            // When the child window is closed for any reason, transition back to a closed state.\r\n            const onChildWindowUnload = () => {\r\n                setWindowState(undefined);\r\n                setChildWindow(undefined);\r\n                onOpenChange?.(false);\r\n            };\r\n            childWindow.addEventListener(\"unload\", onChildWindowUnload, { once: true });\r\n            disposeActions.push(() => childWindow.removeEventListener(\"unload\", onChildWindowUnload));\r\n\r\n            // If the main window closes, close any open child windows as well (don't leave them orphaned).\r\n            const onParentWindowUnload = () => {\r\n                childWindow.close();\r\n            };\r\n            window.addEventListener(\"unload\", onParentWindowUnload, { once: true });\r\n            disposeActions.push(() => window.removeEventListener(\"unload\", onParentWindowUnload));\r\n\r\n            // On dispose, close the child window.\r\n            disposeActions.push(() => childWindow.close());\r\n\r\n            // On dispose, save the window bounds.\r\n            disposeActions.push(() => {\r\n                if (storageKey) {\r\n                    localStorage.setItem(\r\n                        storageKey,\r\n                        JSON.stringify({\r\n                            left: childWindow.screenX,\r\n                            top: childWindow.screenY,\r\n                            width: childWindow.innerWidth,\r\n                            height: childWindow.innerHeight,\r\n                        })\r\n                    );\r\n                }\r\n            });\r\n        }\r\n\r\n        return () => {\r\n            disposeActions.reverse().forEach((dispose) => dispose());\r\n        };\r\n    }, [childWindow]);\r\n\r\n    if (!windowState) {\r\n        return null;\r\n    }\r\n\r\n    const { mountNode, renderer } = windowState;\r\n\r\n    return (\r\n        // Portal targets the body of the child window.\r\n        <Portal mountNode={mountNode}>\r\n            {/* RenderProvider manages Fluent style/class state. */}\r\n            <RendererProvider renderer={renderer} targetDocument={mountNode.ownerDocument}>\r\n                {/* Fluent Provider is needed for managing other Fluent state and applying the current theme mode. */}\r\n                <FluentProvider\r\n                    style={{\r\n                        display: \"flex\",\r\n                        flexGrow: 1,\r\n                        flexDirection: \"column\",\r\n                        overflow: \"hidden\",\r\n                    }}\r\n                    applyStylesToPortals={false}\r\n                    targetDocument={mountNode.ownerDocument}\r\n                >\r\n                    <ToastProvider>{children}</ToastProvider>\r\n                </FluentProvider>\r\n            </RendererProvider>\r\n        </Portal>\r\n    );\r\n};\r\n"]}

package/fluent/hoc/propertyLines/propertyLine.js

@@ -71,7 +71,7 @@ const usePropertyLineStyles = makeStyles({
  */
 export const PropertyLine = forwardRef((props, ref) => {
     PropertyLine.displayName = "PropertyLine";
-    const { disableCopy, size } = useContext(ToolContext);
+    const { size } = useContext(ToolContext);
     const classes = usePropertyLineStyles();
     const { label, uniqueId, onCopy, expandedContent, children, nullable, ignoreNullable } = props;
     const [expanded, setExpanded] = useState("expandByDefault" in props ? props.expandByDefault : false);
@@ -109,7 +109,7 @@ export const PropertyLine = forwardRef((props, ref) => {
                                             cachedVal.current = props.value;
                                             props.onChange(null);
                                         }
-                                    } }) })), _jsx("div", { className: classes.childWrapper, children: processedChildren }), onCopy && !disableCopy && (_jsx(Tooltip, { content: "Copy to Clipboard", children: _jsx(Button, { className: classes.copy, appearance: "transparent", icon: size === "small" ? Copy16Regular : CopyRegular, onClick: handleCopy }) }))] })] }), expandedContent && (_jsx(Collapse, { visible: !!expanded, children: _jsx("div", { className: classes.expandedContentDiv, children: expandedContent }) }))] }));
+                                    } }) })), _jsx("div", { className: classes.childWrapper, children: processedChildren }), onCopy && _jsx(CopyButton, { onCopy: handleCopy })] })] }), expandedContent && (_jsx(Collapse, { visible: !!expanded, children: _jsx("div", { className: classes.expandedContentDiv, children: expandedContent }) }))] }));
 });
 const useLineStyles = makeStyles({
     container: {
@@ -138,6 +138,19 @@ export const LineContainer = forwardRef((props, ref) => {
     const classes = useLineStyles();
     return (_jsx(AccordionSectionItem, { uniqueId: uniqueId, label: label, children: _jsx("div", { ref: ref, className: mergeClasses(classes.container, size == "small" ? classes.containerSmall : undefined), ...rest, children: children }) }));
 });
+/**
+ * Copy button that reads ToolContext at its own position in the tree.
+ * This allows AccordionSectionItem's ToolContext.Provider override (e.g. ctrl+hover) to control visibility.
+ * @returns The copy button element.
+ */
+const CopyButton = ({ onCopy }) => {
+    const { disableCopy, size } = useContext(ToolContext);
+    const classes = usePropertyLineStyles();
+    if (disableCopy) {
+        return null;
+    }
+    return (_jsx(Tooltip, { content: "Copy to Clipboard", children: _jsx(Button, { className: classes.copy, appearance: "transparent", icon: size === "small" ? Copy16Regular : CopyRegular, onClick: onCopy }) }));
+};
 export const PlaceholderPropertyLine = (props) => {
     return (_jsx(PropertyLine, { ...props, children: _jsx(Body1, { children: props.value }) }));
 };

package/fluent/hoc/propertyLines/propertyLine.js.map

@@ -1 +1 @@
-{"version":3,"file":"propertyLine.js","sourceRoot":"","sources":["../../../../../../dev/sharedUiComponents/src/fluent/hoc/propertyLines/propertyLine.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Body1, Checkbox, makeStyles, tokens, mergeClasses } from \"@fluentui/react-components\";\r\nimport {\r\n    ChevronCircleDown20Regular,\r\n    ChevronCircleDown16Regular,\r\n    ChevronCircleRight16Regular,\r\n    ChevronCircleRight20Regular,\r\n    CopyRegular,\r\n    Copy16Regular,\r\n} from \"@fluentui/react-icons\";\r\nimport type { FunctionComponent, HTMLProps, PropsWithChildren, MouseEvent } from \"react\";\r\nimport type { AccordionSectionItemProps } from \"../../primitives/accordion\";\r\nimport { AccordionSectionItem } from \"../../primitives/accordion\";\r\nimport { useContext, useState, forwardRef, cloneElement, isValidElement, useRef, useCallback } from \"react\";\r\nimport { Collapse } from \"../../primitives/collapse\";\r\nimport { copyCommandToClipboard } from \"../../../copyCommandToClipboard\";\r\nimport { ToolContext } from \"../fluentToolWrapper\";\r\nimport type { PrimitiveProps } from \"../../primitives/primitive\";\r\nimport { Link } from \"../../primitives/link\";\r\nimport { ToggleButton } from \"../../primitives/toggleButton\";\r\nimport { Button } from \"../../primitives/button\";\r\nimport { CustomTokens, TokenMap } from \"../../primitives/utils\";\r\nimport { InfoLabel } from \"../../primitives/infoLabel\";\r\nimport { Tooltip } from \"../../primitives/tooltip\";\r\nimport { useToast } from \"../../primitives/toast\";\r\n\r\nconst usePropertyLineStyles = makeStyles({\r\n    baseLine: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        justifyContent: \"flex-start\",\r\n        width: \"100%\",\r\n    },\r\n    infoLabel: {\r\n        display: \"flex\",\r\n        flex: \"1 1 0\", // grow=1, shrink =1, basis = 0 initial size before\r\n        minWidth: CustomTokens.labelMinWidth,\r\n        textAlign: \"left\",\r\n    },\r\n    rightContent: {\r\n        flex: \"0 1 auto\",\r\n        minWidth: 0,\r\n        overflow: \"hidden\",\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        justifyContent: \"flex-end\",\r\n    },\r\n    childWrapper: {\r\n        minWidth: 0,\r\n        overflow: \"hidden\",\r\n        textOverflow: \"ellipsis\",\r\n        whiteSpace: \"nowrap\",\r\n    },\r\n    infoPopup: {\r\n        whiteSpace: \"normal\",\r\n        wordBreak: \"break-word\",\r\n    },\r\n    copy: {\r\n        marginRight: CustomTokens.rightAlignOffset, // Accounts for the padding baked into fluent button / ensures propertyLine looks visually aligned at the right\r\n    },\r\n    expandedContentDiv: {\r\n        overflow: \"hidden\",\r\n        paddingLeft: tokens.spacingHorizontalM,\r\n    },\r\n    checkbox: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        marginRight: tokens.spacingHorizontalXS,\r\n    },\r\n    checkboxIndicator: {\r\n        margin: TokenMap.px2,\r\n        width: TokenMap.px12,\r\n        height: TokenMap.px12,\r\n    },\r\n});\r\n\r\ntype BasePropertyLineProps = {\r\n    /**\r\n     * The name of the property to display in the property line.\r\n     */\r\n    label: string;\r\n    /**\r\n     * The ID of the property line to be used when the label cannot be used as a persistent ID.\r\n     *\r\n     * Note that when a property line is used within an accordion section, this ID must be unique within that section in order\r\n     * for property pinning and filtering to work correctly. If not, error will be shown in console.\r\n     */\r\n    uniqueId?: string;\r\n    /**\r\n     * Optional description for the property, shown on hover of the info icon\r\n     */\r\n    description?: string;\r\n    /**\r\n     * Optional function returning a string to copy to clipboard.\r\n     */\r\n    onCopy?: () => string;\r\n    /**\r\n     * Link to the documentation for this property, available from the info icon either linked from the description (if provided) or default 'docs' text\r\n     */\r\n    docLink?: string;\r\n};\r\n\r\n// Only require value/onChange/defaultValue props if nullable is true\r\ntype NullableProperty<ValueT> = {\r\n    nullable: true;\r\n    ignoreNullable: false;\r\n    value: ValueT;\r\n    onChange: (value: ValueT) => void;\r\n    defaultValue?: ValueT;\r\n};\r\n\r\ntype IgnoreNullable<ValueT> = {\r\n    ignoreNullable: true;\r\n    nullable: false;\r\n    value: ValueT;\r\n    onChange: (value: ValueT) => void;\r\n    defaultValue: ValueT;\r\n};\r\n\r\ntype NonNullableProperty = {\r\n    nullable?: false;\r\n    ignoreNullable?: false;\r\n};\r\n\r\n// Only expect optional expandByDefault prop if expandedContent is defined\r\ntype ExpandableProperty = {\r\n    /**\r\n     * If supplied, an 'expand' icon will be shown which, when clicked, renders this component within the property line.\r\n     */\r\n    expandedContent: JSX.Element;\r\n\r\n    /**\r\n     * If true, the expanded content will be shown by default.\r\n     */\r\n    expandByDefault?: boolean;\r\n};\r\n\r\n// If expanded content is undefined, don't expect expandByDefault prop\r\ntype NonExpandableProperty = {\r\n    expandedContent?: undefined;\r\n};\r\n\r\nexport type PropertyLineProps<ValueT> = BasePropertyLineProps &\r\n    (NullableProperty<ValueT> | NonNullableProperty | IgnoreNullable<ValueT>) &\r\n    (ExpandableProperty | NonExpandableProperty);\r\n\r\n/**\r\n * A reusable component that renders a property line with a label and child content, and an optional description, copy button, and expandable section.\r\n *\r\n * @param props - The properties for the PropertyLine component.\r\n * @returns A React element representing the property line.\r\n *\r\n */\r\nexport const PropertyLine = forwardRef<HTMLDivElement, PropsWithChildren<PropertyLineProps<any>>>((props, ref) => {\r\n    PropertyLine.displayName = \"PropertyLine\";\r\n    const { disableCopy, size } = useContext(ToolContext);\r\n    const classes = usePropertyLineStyles();\r\n    const { label, uniqueId, onCopy, expandedContent, children, nullable, ignoreNullable } = props;\r\n\r\n    const [expanded, setExpanded] = useState(\"expandByDefault\" in props ? props.expandByDefault : false);\r\n    const cachedVal = useRef(nullable ? props.value : null);\r\n\r\n    const { showToast } = useToast();\r\n\r\n    const handleCopy = useCallback(() => {\r\n        if (onCopy) {\r\n            copyCommandToClipboard(onCopy());\r\n            showToast(\"Copied property to clipboard\");\r\n        }\r\n    }, [onCopy, showToast]);\r\n\r\n    const handleContextMenu = useCallback(\r\n        (e: MouseEvent) => {\r\n            e.preventDefault();\r\n            handleCopy();\r\n        },\r\n        [handleCopy]\r\n    );\r\n\r\n    const description = props.docLink ? <Link url={props.docLink} value={props.description ?? \"Docs\"} /> : props.description ? <Body1>{props.description}</Body1> : undefined;\r\n\r\n    // Process children to handle nullable state -- creating component in disabled state with default value in lieu of null value\r\n    const processedChildren =\r\n        (nullable || ignoreNullable) && isValidElement(children)\r\n            ? cloneElement(children, {\r\n                  ...children.props,\r\n                  disabled: children.props.disabled || (nullable && props.value == null),\r\n                  value: props.value ?? props.defaultValue,\r\n                  defaultValue: undefined, // Don't pass defaultValue to children as there is no guarantee how this will be used and we can't mix controlled + uncontrolled state\r\n              })\r\n            : children;\r\n\r\n    return (\r\n        <LineContainer ref={ref} uniqueId={uniqueId ?? label} label={label}>\r\n            <div className={classes.baseLine}>\r\n                <InfoLabel className={classes.infoLabel} htmlFor=\"property\" info={description} label={label} flexLabel onContextMenu={onCopy ? handleContextMenu : undefined} />\r\n                <div className={classes.rightContent} id=\"property\">\r\n                    {expandedContent && (\r\n                        <ToggleButton\r\n                            title=\"Expand/Collapse property\"\r\n                            appearance=\"transparent\"\r\n                            checkedIcon={size === \"small\" ? ChevronCircleDown16Regular : ChevronCircleDown20Regular}\r\n                            uncheckedIcon={size === \"small\" ? ChevronCircleRight16Regular : ChevronCircleRight20Regular}\r\n                            value={expanded === true}\r\n                            onChange={setExpanded}\r\n                        />\r\n                    )}\r\n\r\n                    {nullable && !ignoreNullable && (\r\n                        // If this is a nullableProperty and ignoreNullable was not sent, display a checkbox used to toggle null ('checked' means 'non null')\r\n                        <Tooltip content={props.value == null ? \"Enable property\" : \"Disable property (set to null)\"}>\r\n                            <Checkbox\r\n                                className={classes.checkbox}\r\n                                indicator={{ className: classes.checkboxIndicator }}\r\n                                checked={!(props.value == null)}\r\n                                onChange={(_, data) => {\r\n                                    if (data.checked) {\r\n                                        // if checked this means we are returning to non-null, use cached value if exists. If no cached value, use default value\r\n                                        cachedVal.current != null ? props.onChange(cachedVal.current) : props.onChange(props.defaultValue);\r\n                                    } else {\r\n                                        // if moving to un-checked state, this means moving to null value. Cache the old value and tell props.onChange(null)\r\n                                        cachedVal.current = props.value;\r\n                                        props.onChange(null);\r\n                                    }\r\n                                }}\r\n                            />\r\n                        </Tooltip>\r\n                    )}\r\n                    <div className={classes.childWrapper}>{processedChildren}</div>\r\n                    {onCopy && !disableCopy && (\r\n                        <Tooltip content=\"Copy to Clipboard\">\r\n                            <Button className={classes.copy} appearance=\"transparent\" icon={size === \"small\" ? Copy16Regular : CopyRegular} onClick={handleCopy} />\r\n                        </Tooltip>\r\n                    )}\r\n                </div>\r\n            </div>\r\n            {expandedContent && (\r\n                <Collapse visible={!!expanded}>\r\n                    <div className={classes.expandedContentDiv}>{expandedContent}</div>\r\n                </Collapse>\r\n            )}\r\n        </LineContainer>\r\n    );\r\n});\r\n\r\nconst useLineStyles = makeStyles({\r\n    container: {\r\n        width: \"100%\",\r\n        display: \"flex\",\r\n        flexDirection: \"column\", // Stack line + expanded content\r\n        minHeight: CustomTokens.lineHeight,\r\n        boxSizing: \"border-box\",\r\n        justifyContent: \"center\",\r\n        paddingTop: tokens.spacingVerticalXXS,\r\n        paddingBottom: tokens.spacingVerticalXXS,\r\n        borderTop: `1px solid transparent`,\r\n        borderBottom: `1px solid transparent`,\r\n        \":hover\": {\r\n            borderTopColor: tokens.colorNeutralStroke2,\r\n            borderBottomColor: tokens.colorNeutralStroke2,\r\n        },\r\n    },\r\n    containerSmall: {\r\n        minHeight: CustomTokens.lineHeightSmall,\r\n    },\r\n});\r\n\r\nexport const LineContainer = forwardRef<HTMLDivElement, PropsWithChildren<HTMLProps<HTMLDivElement> & AccordionSectionItemProps>>((props, ref) => {\r\n    const { size } = useContext(ToolContext);\r\n    const { children, uniqueId, label, ...rest } = props;\r\n    const classes = useLineStyles();\r\n\r\n    return (\r\n        <AccordionSectionItem uniqueId={uniqueId} label={label}>\r\n            <div ref={ref} className={mergeClasses(classes.container, size == \"small\" ? classes.containerSmall : undefined)} {...rest}>\r\n                {children}\r\n            </div>\r\n        </AccordionSectionItem>\r\n    );\r\n});\r\n\r\nexport const PlaceholderPropertyLine: FunctionComponent<PrimitiveProps<any> & PropertyLineProps<any>> = (props) => {\r\n    return (\r\n        <PropertyLine {...props}>\r\n            <Body1>{props.value}</Body1>\r\n        </PropertyLine>\r\n    );\r\n};\r\n"]}
+{"version":3,"file":"propertyLine.js","sourceRoot":"","sources":["../../../../../../dev/sharedUiComponents/src/fluent/hoc/propertyLines/propertyLine.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Body1, Checkbox, makeStyles, tokens, mergeClasses } from \"@fluentui/react-components\";\r\nimport {\r\n    ChevronCircleDown20Regular,\r\n    ChevronCircleDown16Regular,\r\n    ChevronCircleRight16Regular,\r\n    ChevronCircleRight20Regular,\r\n    CopyRegular,\r\n    Copy16Regular,\r\n} from \"@fluentui/react-icons\";\r\nimport type { FunctionComponent, HTMLProps, PropsWithChildren, MouseEvent } from \"react\";\r\nimport type { AccordionSectionItemProps } from \"../../primitives/accordion\";\r\nimport { AccordionSectionItem } from \"../../primitives/accordion\";\r\nimport { useContext, useState, forwardRef, cloneElement, isValidElement, useRef, useCallback } from \"react\";\r\nimport { Collapse } from \"../../primitives/collapse\";\r\nimport { copyCommandToClipboard } from \"../../../copyCommandToClipboard\";\r\nimport { ToolContext } from \"../fluentToolWrapper\";\r\nimport type { PrimitiveProps } from \"../../primitives/primitive\";\r\nimport { Link } from \"../../primitives/link\";\r\nimport { ToggleButton } from \"../../primitives/toggleButton\";\r\nimport { Button } from \"../../primitives/button\";\r\nimport { CustomTokens, TokenMap } from \"../../primitives/utils\";\r\nimport { InfoLabel } from \"../../primitives/infoLabel\";\r\nimport { Tooltip } from \"../../primitives/tooltip\";\r\nimport { useToast } from \"../../primitives/toast\";\r\n\r\nconst usePropertyLineStyles = makeStyles({\r\n    baseLine: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        justifyContent: \"flex-start\",\r\n        width: \"100%\",\r\n    },\r\n    infoLabel: {\r\n        display: \"flex\",\r\n        flex: \"1 1 0\", // grow=1, shrink =1, basis = 0 initial size before\r\n        minWidth: CustomTokens.labelMinWidth,\r\n        textAlign: \"left\",\r\n    },\r\n    rightContent: {\r\n        flex: \"0 1 auto\",\r\n        minWidth: 0,\r\n        overflow: \"hidden\",\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        justifyContent: \"flex-end\",\r\n    },\r\n    childWrapper: {\r\n        minWidth: 0,\r\n        overflow: \"hidden\",\r\n        textOverflow: \"ellipsis\",\r\n        whiteSpace: \"nowrap\",\r\n    },\r\n    infoPopup: {\r\n        whiteSpace: \"normal\",\r\n        wordBreak: \"break-word\",\r\n    },\r\n    copy: {\r\n        marginRight: CustomTokens.rightAlignOffset, // Accounts for the padding baked into fluent button / ensures propertyLine looks visually aligned at the right\r\n    },\r\n    expandedContentDiv: {\r\n        overflow: \"hidden\",\r\n        paddingLeft: tokens.spacingHorizontalM,\r\n    },\r\n    checkbox: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        marginRight: tokens.spacingHorizontalXS,\r\n    },\r\n    checkboxIndicator: {\r\n        margin: TokenMap.px2,\r\n        width: TokenMap.px12,\r\n        height: TokenMap.px12,\r\n    },\r\n});\r\n\r\ntype BasePropertyLineProps = {\r\n    /**\r\n     * The name of the property to display in the property line.\r\n     */\r\n    label: string;\r\n    /**\r\n     * The ID of the property line to be used when the label cannot be used as a persistent ID.\r\n     *\r\n     * Note that when a property line is used within an accordion section, this ID must be unique within that section in order\r\n     * for property pinning and filtering to work correctly. If not, error will be shown in console.\r\n     */\r\n    uniqueId?: string;\r\n    /**\r\n     * Optional description for the property, shown on hover of the info icon\r\n     */\r\n    description?: string;\r\n    /**\r\n     * Optional function returning a string to copy to clipboard.\r\n     */\r\n    onCopy?: () => string;\r\n    /**\r\n     * Link to the documentation for this property, available from the info icon either linked from the description (if provided) or default 'docs' text\r\n     */\r\n    docLink?: string;\r\n};\r\n\r\n// Only require value/onChange/defaultValue props if nullable is true\r\ntype NullableProperty<ValueT> = {\r\n    nullable: true;\r\n    ignoreNullable: false;\r\n    value: ValueT;\r\n    onChange: (value: ValueT) => void;\r\n    defaultValue?: ValueT;\r\n};\r\n\r\ntype IgnoreNullable<ValueT> = {\r\n    ignoreNullable: true;\r\n    nullable: false;\r\n    value: ValueT;\r\n    onChange: (value: ValueT) => void;\r\n    defaultValue: ValueT;\r\n};\r\n\r\ntype NonNullableProperty = {\r\n    nullable?: false;\r\n    ignoreNullable?: false;\r\n};\r\n\r\n// Only expect optional expandByDefault prop if expandedContent is defined\r\ntype ExpandableProperty = {\r\n    /**\r\n     * If supplied, an 'expand' icon will be shown which, when clicked, renders this component within the property line.\r\n     */\r\n    expandedContent: JSX.Element;\r\n\r\n    /**\r\n     * If true, the expanded content will be shown by default.\r\n     */\r\n    expandByDefault?: boolean;\r\n};\r\n\r\n// If expanded content is undefined, don't expect expandByDefault prop\r\ntype NonExpandableProperty = {\r\n    expandedContent?: undefined;\r\n};\r\n\r\nexport type PropertyLineProps<ValueT> = BasePropertyLineProps &\r\n    (NullableProperty<ValueT> | NonNullableProperty | IgnoreNullable<ValueT>) &\r\n    (ExpandableProperty | NonExpandableProperty);\r\n\r\n/**\r\n * A reusable component that renders a property line with a label and child content, and an optional description, copy button, and expandable section.\r\n *\r\n * @param props - The properties for the PropertyLine component.\r\n * @returns A React element representing the property line.\r\n *\r\n */\r\nexport const PropertyLine = forwardRef<HTMLDivElement, PropsWithChildren<PropertyLineProps<any>>>((props, ref) => {\r\n    PropertyLine.displayName = \"PropertyLine\";\r\n    const { size } = useContext(ToolContext);\r\n    const classes = usePropertyLineStyles();\r\n    const { label, uniqueId, onCopy, expandedContent, children, nullable, ignoreNullable } = props;\r\n\r\n    const [expanded, setExpanded] = useState(\"expandByDefault\" in props ? props.expandByDefault : false);\r\n    const cachedVal = useRef(nullable ? props.value : null);\r\n\r\n    const { showToast } = useToast();\r\n\r\n    const handleCopy = useCallback(() => {\r\n        if (onCopy) {\r\n            copyCommandToClipboard(onCopy());\r\n            showToast(\"Copied property to clipboard\");\r\n        }\r\n    }, [onCopy, showToast]);\r\n\r\n    const handleContextMenu = useCallback(\r\n        (e: MouseEvent) => {\r\n            e.preventDefault();\r\n            handleCopy();\r\n        },\r\n        [handleCopy]\r\n    );\r\n\r\n    const description = props.docLink ? <Link url={props.docLink} value={props.description ?? \"Docs\"} /> : props.description ? <Body1>{props.description}</Body1> : undefined;\r\n\r\n    // Process children to handle nullable state -- creating component in disabled state with default value in lieu of null value\r\n    const processedChildren =\r\n        (nullable || ignoreNullable) && isValidElement(children)\r\n            ? cloneElement(children, {\r\n                  ...children.props,\r\n                  disabled: children.props.disabled || (nullable && props.value == null),\r\n                  value: props.value ?? props.defaultValue,\r\n                  defaultValue: undefined, // Don't pass defaultValue to children as there is no guarantee how this will be used and we can't mix controlled + uncontrolled state\r\n              })\r\n            : children;\r\n\r\n    return (\r\n        <LineContainer ref={ref} uniqueId={uniqueId ?? label} label={label}>\r\n            <div className={classes.baseLine}>\r\n                <InfoLabel className={classes.infoLabel} htmlFor=\"property\" info={description} label={label} flexLabel onContextMenu={onCopy ? handleContextMenu : undefined} />\r\n                <div className={classes.rightContent} id=\"property\">\r\n                    {expandedContent && (\r\n                        <ToggleButton\r\n                            title=\"Expand/Collapse property\"\r\n                            appearance=\"transparent\"\r\n                            checkedIcon={size === \"small\" ? ChevronCircleDown16Regular : ChevronCircleDown20Regular}\r\n                            uncheckedIcon={size === \"small\" ? ChevronCircleRight16Regular : ChevronCircleRight20Regular}\r\n                            value={expanded === true}\r\n                            onChange={setExpanded}\r\n                        />\r\n                    )}\r\n\r\n                    {nullable && !ignoreNullable && (\r\n                        // If this is a nullableProperty and ignoreNullable was not sent, display a checkbox used to toggle null ('checked' means 'non null')\r\n                        <Tooltip content={props.value == null ? \"Enable property\" : \"Disable property (set to null)\"}>\r\n                            <Checkbox\r\n                                className={classes.checkbox}\r\n                                indicator={{ className: classes.checkboxIndicator }}\r\n                                checked={!(props.value == null)}\r\n                                onChange={(_, data) => {\r\n                                    if (data.checked) {\r\n                                        // if checked this means we are returning to non-null, use cached value if exists. If no cached value, use default value\r\n                                        cachedVal.current != null ? props.onChange(cachedVal.current) : props.onChange(props.defaultValue);\r\n                                    } else {\r\n                                        // if moving to un-checked state, this means moving to null value. Cache the old value and tell props.onChange(null)\r\n                                        cachedVal.current = props.value;\r\n                                        props.onChange(null);\r\n                                    }\r\n                                }}\r\n                            />\r\n                        </Tooltip>\r\n                    )}\r\n                    <div className={classes.childWrapper}>{processedChildren}</div>\r\n                    {onCopy && <CopyButton onCopy={handleCopy} />}\r\n                </div>\r\n            </div>\r\n            {expandedContent && (\r\n                <Collapse visible={!!expanded}>\r\n                    <div className={classes.expandedContentDiv}>{expandedContent}</div>\r\n                </Collapse>\r\n            )}\r\n        </LineContainer>\r\n    );\r\n});\r\n\r\nconst useLineStyles = makeStyles({\r\n    container: {\r\n        width: \"100%\",\r\n        display: \"flex\",\r\n        flexDirection: \"column\", // Stack line + expanded content\r\n        minHeight: CustomTokens.lineHeight,\r\n        boxSizing: \"border-box\",\r\n        justifyContent: \"center\",\r\n        paddingTop: tokens.spacingVerticalXXS,\r\n        paddingBottom: tokens.spacingVerticalXXS,\r\n        borderTop: `1px solid transparent`,\r\n        borderBottom: `1px solid transparent`,\r\n        \":hover\": {\r\n            borderTopColor: tokens.colorNeutralStroke2,\r\n            borderBottomColor: tokens.colorNeutralStroke2,\r\n        },\r\n    },\r\n    containerSmall: {\r\n        minHeight: CustomTokens.lineHeightSmall,\r\n    },\r\n});\r\n\r\nexport const LineContainer = forwardRef<HTMLDivElement, PropsWithChildren<HTMLProps<HTMLDivElement> & AccordionSectionItemProps>>((props, ref) => {\r\n    const { size } = useContext(ToolContext);\r\n    const { children, uniqueId, label, ...rest } = props;\r\n    const classes = useLineStyles();\r\n\r\n    return (\r\n        <AccordionSectionItem uniqueId={uniqueId} label={label}>\r\n            <div ref={ref} className={mergeClasses(classes.container, size == \"small\" ? classes.containerSmall : undefined)} {...rest}>\r\n                {children}\r\n            </div>\r\n        </AccordionSectionItem>\r\n    );\r\n});\r\n\r\n/**\r\n * Copy button that reads ToolContext at its own position in the tree.\r\n * This allows AccordionSectionItem's ToolContext.Provider override (e.g. ctrl+hover) to control visibility.\r\n * @returns The copy button element.\r\n */\r\nconst CopyButton: FunctionComponent<{ onCopy: () => void }> = ({ onCopy }) => {\r\n    const { disableCopy, size } = useContext(ToolContext);\r\n    const classes = usePropertyLineStyles();\r\n\r\n    if (disableCopy) {\r\n        return null;\r\n    }\r\n\r\n    return (\r\n        <Tooltip content=\"Copy to Clipboard\">\r\n            <Button className={classes.copy} appearance=\"transparent\" icon={size === \"small\" ? Copy16Regular : CopyRegular} onClick={onCopy} />\r\n        </Tooltip>\r\n    );\r\n};\r\n\r\nexport const PlaceholderPropertyLine: FunctionComponent<PrimitiveProps<any> & PropertyLineProps<any>> = (props) => {\r\n    return (\r\n        <PropertyLine {...props}>\r\n            <Body1>{props.value}</Body1>\r\n        </PropertyLine>\r\n    );\r\n};\r\n"]}

package/fluent/primitives/accordion.contexts.d.ts

@@ -31,6 +31,9 @@ export type AccordionAction = {
 } | {
     type: "MOVE_PINNED_UP";
     itemId: string;
+} | {
+    type: "REMOVE_STALE_IDS";
+    activeIds: Set<string>;
 } | {
     type: "SHOW_ALL";
 } | {
@@ -62,8 +65,8 @@ export type AccordionContextValue = {
     features: AccordionFeatures;
     /** Ref for the pinned items portal container. */
     pinnedContainerRef: RefObject<HTMLDivElement>;
-    /** Set of registered item IDs (for duplicate detection). */
-    registeredItemIds: React.MutableRefObject<Set<string>>;
+    /** Map of registered item IDs to labels (for duplicate detection and section empty checks). */
+    registeredItemIds: Map<string, string>;
 };
 export declare const AccordionContext: import("react").Context<AccordionContextValue | undefined>;
 /**
@@ -85,9 +88,12 @@ export declare const AccordionSectionBlockContext: import("react").Context<Accor
  * Hook to create the AccordionSectionBlockContext value.
  *
  * @param props - AccordionSectionBlockProps
- * @returns AccordionSectionBlockContextValue
+ * @returns AccordionSectionBlockContextValue and isEmpty state
  */
-export declare function useAccordionSectionBlockContext(props: AccordionSectionBlockProps): AccordionSectionBlockContextValue;
+export declare function useAccordionSectionBlockContext(props: AccordionSectionBlockProps): {
+    context: AccordionSectionBlockContextValue;
+    isEmpty: boolean;
+};
 /**
  * Context to track whether we're inside an AccordionSectionItem.
  * Used to prevent nested items from being individually manageable.
@@ -109,6 +115,8 @@ export type AccordionItemState = {
     isMatch: boolean;
     /** The index of this item in the pinned list (for ordering). */
     pinnedIndex: number;
+    /** Whether this pinned item can be moved up (is not first in the pinned list). */
+    canMoveUp: boolean;
     /** Whether edit mode is active. */
     inEditMode: boolean;
     /** Callbacks to modify state. */
@@ -125,12 +133,3 @@ export type AccordionItemState = {
  * @returns AccordionItemState, or undefined if no accordion context or nested item.
  */
 export declare function useAccordionSectionItemState(props: AccordionSectionItemProps): AccordionItemState | undefined;
-/**
- * Hook to determine if a section should be hidden because it has no visible items.
- * This is computed during render based on the current state.
- *
- * @param sectionId - The section ID to check.
- * @param registeredItems - Map of item IDs to their labels in this section.
- * @returns Whether the section is empty (has no visible items).
- */
-export declare function useIsSectionEmpty(sectionId: string, registeredItems: Map<string, string>): boolean;

package/fluent/primitives/accordion.contexts.js

@@ -49,6 +49,14 @@ const AccordionReducer = (state, action) => {
             [newPinnedIds[index - 1], newPinnedIds[index]] = [newPinnedIds[index], newPinnedIds[index - 1]];
             return { ...state, pinnedIds: newPinnedIds };
         }
+        case "REMOVE_STALE_IDS": {
+            const pinnedIds = state.pinnedIds.filter((id) => action.activeIds.has(id));
+            const hiddenIds = state.hiddenIds.filter((id) => action.activeIds.has(id));
+            if (pinnedIds.length === state.pinnedIds.length && hiddenIds.length === state.hiddenIds.length) {
+                return state;
+            }
+            return { ...state, pinnedIds, hiddenIds };
+        }
         case "SHOW_ALL":
             return { ...state, hiddenIds: [] };
         case "HIDE_ALL_VISIBLE":
@@ -89,7 +97,7 @@ export function useAccordionContext(props) {
     }, [accordionId, hasFeatures, features.pinning, features.hiding]);
     const [state, dispatch] = useReducer(AccordionReducer, initialState);
     const pinnedContainerRef = useRef(null);
-    const registeredItemIds = useRef(new Set());
+    const registeredItemIds = useRef(new Map());
     // Persist pinnedIds to localStorage when they change
     useEffect(() => {
         if (accordionId && features.pinning) {
@@ -102,6 +110,13 @@ export function useAccordionContext(props) {
             WriteToStorage(`Hidden/${accordionId}`, state.hiddenIds);
         }
     }, [accordionId, features.hiding, state.hiddenIds]);
+    // Clean stale IDs from localStorage on mount. Parent effects run after
+    // children's, so all items will have registered by the time this fires.
+    useEffect(() => {
+        if (accordionId && hasFeatures) {
+            dispatch({ type: "REMOVE_STALE_IDS", activeIds: new Set(registeredItemIds.current.keys()) });
+        }
+    }, [accordionId, hasFeatures]);
     // Return undefined if no accordionId or no features enabled
     if (!accordionId || !hasFeatures) {
         return undefined;
@@ -112,7 +127,7 @@ export function useAccordionContext(props) {
         dispatch,
         features,
         pinnedContainerRef,
-        registeredItemIds,
+        registeredItemIds: registeredItemIds.current,
     };
 }
 export const AccordionSectionBlockContext = createContext(undefined);
@@ -120,11 +135,13 @@ export const AccordionSectionBlockContext = createContext(undefined);
  * Hook to create the AccordionSectionBlockContext value.
  *
  * @param props - AccordionSectionBlockProps
- * @returns AccordionSectionBlockContextValue
+ * @returns AccordionSectionBlockContextValue and isEmpty state
  */
 export function useAccordionSectionBlockContext(props) {
     const { sectionId } = props;
-    return useMemo(() => ({ sectionId }), [sectionId]);
+    const context = useMemo(() => ({ sectionId }), [sectionId]);
+    const isEmpty = useIsSectionEmpty(sectionId);
+    return { context, isEmpty };
 }
 // ============================================================================
 // Item Depth Context (to detect nested AccordionSectionItems)
@@ -150,7 +167,7 @@ export function useAccordionSectionItemState(props) {
         if (!accordionCtx || !sectionCtx) {
             return "";
         }
-        return `${accordionCtx.accordionId}\0${sectionCtx.sectionId}\0${itemId}`;
+        return `${accordionCtx.accordionId}/${sectionCtx.sectionId}/${itemId}`;
     }, [accordionCtx?.accordionId, sectionCtx?.sectionId, itemId]);
     // Debug: warn if itemId changes (should be stable)
     const prevItemIdRef = useRef(itemId);
@@ -161,23 +178,21 @@ export function useAccordionSectionItemState(props) {
         }
         prevItemIdRef.current = itemId;
     }, [itemId, sectionCtx?.sectionId]);
-    // Debug: warn if itemUniqueId is not unique (duplicate detection)
+    // Register item and detect duplicates (skip nested items, as children of other AccordionSectionItem should not participate in pin/hide/search).
     useEffect(() => {
-        if (!accordionCtx || !itemUniqueId) {
+        if (!accordionCtx || !itemUniqueId || isNested) {
             return;
         }
         const { registeredItemIds } = accordionCtx;
-        if (registeredItemIds.current.has(itemUniqueId)) {
+        if (registeredItemIds.has(itemUniqueId)) {
             Logger.Warn(`Accordion: Duplicate uniqueId "${itemId}" detected in section "${sectionCtx?.sectionId}". ` +
                 `Each item must have a unique ID within its section for pin/hide persistence to work correctly.`);
         }
-        else {
-            registeredItemIds.current.add(itemUniqueId);
-        }
+        registeredItemIds.set(itemUniqueId, itemLabel ?? itemId);
         return () => {
-            registeredItemIds.current.delete(itemUniqueId);
+            registeredItemIds.delete(itemUniqueId);
         };
-    }, [accordionCtx, itemUniqueId, itemId, sectionCtx?.sectionId]);
+    }, [accordionCtx, itemUniqueId, itemId, itemLabel, sectionCtx?.sectionId, isNested]);
     // If no context, static item, or nested, return undefined
     if (!accordionCtx || staticItem) {
         return undefined;
@@ -188,6 +203,7 @@ export function useAccordionSectionItemState(props) {
     const isPinned = features.pinning && pinnedIds.includes(itemUniqueId);
     const isHidden = features.hiding && hiddenIds.includes(itemUniqueId);
     const pinnedIndex = isPinned ? pinnedIds.indexOf(itemUniqueId) : -1;
+    const canMoveUp = isPinned && pinnedIndex > 0;
     // Search matching
     const searchText = (itemLabel ?? itemId).toLowerCase();
     const isMatch = !features.search || !searchTerm || searchText.includes(searchTerm.toLowerCase());
@@ -198,6 +214,7 @@ export function useAccordionSectionItemState(props) {
         isHidden,
         isMatch,
         pinnedIndex,
+        canMoveUp,
         inEditMode: editMode,
         actions: {
             togglePinned: () => dispatch({ type: "TOGGLE_PINNED", itemId: itemUniqueId }),
@@ -206,48 +223,38 @@ export function useAccordionSectionItemState(props) {
         },
     };
 }
-// ============================================================================
-// Helper hook to check if a section is empty
-// ============================================================================
 /**
- * Hook to determine if a section should be hidden because it has no visible items.
- * This is computed during render based on the current state.
+ * Hook to determine if a section is empty (has no visible items).
+ * Derived from accordion state + globally registered items filtered by section prefix.
  *
  * @param sectionId - The section ID to check.
- * @param registeredItems - Map of item IDs to their labels in this section.
- * @returns Whether the section is empty (has no visible items).
+ * @returns Whether the section has no visible items.
  */
-export function useIsSectionEmpty(sectionId, registeredItems) {
+function useIsSectionEmpty(sectionId) {
     const accordionCtx = useContext(AccordionContext);
     if (!accordionCtx) {
-        return false; // No context means no filtering, section is not empty
+        return false;
     }
-    const { state, features, accordionId } = accordionCtx;
+    const { state, features, accordionId, registeredItemIds } = accordionCtx;
     const { pinnedIds, hiddenIds, searchTerm, editMode } = state;
-    // In edit mode, always show sections
     if (editMode) {
         return false;
     }
-    // Check if any item in this section is visible
-    for (const [itemId, itemLabel] of registeredItems) {
-        const itemUniqueId = `${accordionId}\0${sectionId}\0${itemId}`;
-        const isPinned = features.pinning && pinnedIds.includes(itemUniqueId);
-        const isHidden = features.hiding && hiddenIds.includes(itemUniqueId);
-        const searchText = (itemLabel ?? itemId).toLowerCase();
-        const isMatch = !features.search || !searchTerm || searchText.includes(searchTerm.toLowerCase());
-        // For the Pinned section, show items that are pinned and match
-        if (sectionId === "Pinned") {
-            if (isPinned && isMatch) {
-                return false;
-            }
+    const sectionPrefix = `${accordionId}/${sectionId}/`;
+    let hasItems = false;
+    for (const [itemId, itemLabel] of registeredItemIds) {
+        if (!itemId.startsWith(sectionPrefix)) {
+            continue;
         }
-        else {
-            // For regular sections, show items that are not pinned, not hidden, and match
-            if (!isPinned && !isHidden && isMatch) {
-                return false;
-            }
+        hasItems = true;
+        const isPinned = features.pinning && pinnedIds.includes(itemId);
+        const isHidden = features.hiding && hiddenIds.includes(itemId);
+        const searchText = (itemLabel || itemId).toLowerCase();
+        const isMatch = !features.search || !searchTerm || searchText.includes(searchTerm.toLowerCase());
+        if (!isPinned && !isHidden && isMatch) {
+            return false;
         }
     }
-    return true;
+    return hasItems;
 }
 //# sourceMappingURL=accordion.contexts.js.map

package/fluent/primitives/accordion.contexts.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.contexts.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/accordion.contexts.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { RefObject } from \"react\";\nimport type { AccordionProps, AccordionSectionBlockProps, AccordionSectionItemProps } from \"./accordion\";\nimport { createContext, useContext, useEffect, useMemo, useReducer, useRef } from \"react\";\nimport { DataStorage } from \"core/Misc/dataStorage\";\nimport { Logger } from \"core/Misc/logger\";\n\n// ============================================================================\n// Storage Helpers\n// ============================================================================\n\nconst STORAGE_KEY_ROOT = \"Babylon/Accordion\";\n\nconst ReadFromStorage = <T,>(path: string, initial: T): T => {\n    try {\n        const stored = DataStorage.ReadString(`${STORAGE_KEY_ROOT}/${path}`, \"\");\n        return stored ? JSON.parse(stored) : initial;\n    } catch {\n        return initial;\n    }\n};\n\nconst WriteToStorage = (path: string, data: unknown): void => {\n    DataStorage.WriteString(`${STORAGE_KEY_ROOT}/${path}`, JSON.stringify(data));\n};\n\n// ============================================================================\n// State Types\n// ============================================================================\n\n/**\n * Immutable state for the Accordion.\n */\nexport type AccordionState = {\n    /** IDs of pinned items (persisted to localStorage). */\n    pinnedIds: string[];\n    /** IDs of hidden items (persisted to localStorage). */\n    hiddenIds: string[];\n    /** Current search/filter term. */\n    searchTerm: string;\n    /** Whether edit mode is active (shows pin/hide controls). */\n    editMode: boolean;\n};\n\n/**\n * Actions that can be dispatched to update accordion state.\n */\nexport type AccordionAction =\n    | { type: \"SET_SEARCH_TERM\"; term: string }\n    | { type: \"SET_EDIT_MODE\"; enabled: boolean }\n    | { type: \"TOGGLE_PINNED\"; itemId: string }\n    | { type: \"TOGGLE_HIDDEN\"; itemId: string }\n    | { type: \"MOVE_PINNED_UP\"; itemId: string }\n    | { type: \"SHOW_ALL\" }\n    | { type: \"HIDE_ALL_VISIBLE\"; visibleItemIds: string[] };\n\n/**\n * Feature flags for the Accordion (immutable after initialization).\n */\nexport type AccordionFeatures = {\n    /** Whether pinning is enabled. */\n    pinning: boolean;\n    /** Whether hiding is enabled. */\n    hiding: boolean;\n    /** Whether search is enabled. */\n    search: boolean;\n};\n\n// ============================================================================\n// Reducer\n// ============================================================================\n\nconst AccordionReducer = (state: AccordionState, action: AccordionAction): AccordionState => {\n    switch (action.type) {\n        case \"SET_SEARCH_TERM\":\n            return { ...state, searchTerm: action.term };\n\n        case \"SET_EDIT_MODE\":\n            return { ...state, editMode: action.enabled };\n\n        case \"TOGGLE_PINNED\": {\n            const isPinned = state.pinnedIds.includes(action.itemId);\n            return {\n                ...state,\n                pinnedIds: isPinned ? state.pinnedIds.filter((id) => id !== action.itemId) : [...state.pinnedIds, action.itemId],\n            };\n        }\n\n        case \"TOGGLE_HIDDEN\": {\n            const isHidden = state.hiddenIds.includes(action.itemId);\n            return {\n                ...state,\n                hiddenIds: isHidden ? state.hiddenIds.filter((id) => id !== action.itemId) : [...state.hiddenIds, action.itemId],\n            };\n        }\n\n        case \"MOVE_PINNED_UP\": {\n            const index = state.pinnedIds.indexOf(action.itemId);\n            if (index <= 0) {\n                return state;\n            }\n            const newPinnedIds = [...state.pinnedIds];\n            [newPinnedIds[index - 1], newPinnedIds[index]] = [newPinnedIds[index], newPinnedIds[index - 1]];\n            return { ...state, pinnedIds: newPinnedIds };\n        }\n\n        case \"SHOW_ALL\":\n            return { ...state, hiddenIds: [] };\n\n        case \"HIDE_ALL_VISIBLE\":\n            return {\n                ...state,\n                hiddenIds: [...new Set([...state.hiddenIds, ...action.visibleItemIds])],\n            };\n\n        default:\n            return state;\n    }\n};\n\n// ============================================================================\n// Accordion Context\n// ============================================================================\n\n/**\n * Context value for the Accordion component.\n */\nexport type AccordionContextValue = {\n    /** The unique ID of the Accordion instance. */\n    accordionId: string;\n    /** State for the Accordion, managed via dispatch function. */\n    state: AccordionState;\n    /** Dispatch function to update state. */\n    dispatch: React.Dispatch<AccordionAction>;\n    /** Feature flags. */\n    features: AccordionFeatures;\n    /** Ref for the pinned items portal container. */\n    pinnedContainerRef: RefObject<HTMLDivElement>;\n    /** Set of registered item IDs (for duplicate detection). */\n    registeredItemIds: React.MutableRefObject<Set<string>>;\n};\n\nexport const AccordionContext = createContext<AccordionContextValue | undefined>(undefined);\n\n/**\n * Hook to create and manage the AccordionContext value.\n *\n * @param props - AccordionProps\n * @returns AccordionContextValue, or undefined if no features are enabled or no uniqueId is provided.\n */\nexport function useAccordionContext(props: AccordionProps): AccordionContextValue | undefined {\n    const { uniqueId: accordionId, enablePinnedItems, enableHiddenItems, enableSearchItems } = props;\n\n    const features: AccordionFeatures = useMemo(\n        () => ({\n            pinning: enablePinnedItems ?? false,\n            hiding: enableHiddenItems ?? false,\n            search: enableSearchItems ?? false,\n        }),\n        [enablePinnedItems, enableHiddenItems, enableSearchItems]\n    );\n\n    const hasFeatures = features.pinning || features.hiding || features.search;\n\n    // Initialize state from localStorage\n    const initialState = useMemo((): AccordionState => {\n        if (!accordionId || !hasFeatures) {\n            return { pinnedIds: [], hiddenIds: [], searchTerm: \"\", editMode: false };\n        }\n        return {\n            pinnedIds: features.pinning ? ReadFromStorage<string[]>(`Pinned/${accordionId}`, []) : [],\n            hiddenIds: features.hiding ? ReadFromStorage<string[]>(`Hidden/${accordionId}`, []) : [],\n            searchTerm: \"\",\n            editMode: false,\n        };\n    }, [accordionId, hasFeatures, features.pinning, features.hiding]);\n\n    const [state, dispatch] = useReducer(AccordionReducer, initialState);\n\n    const pinnedContainerRef = useRef<HTMLDivElement>(null);\n    const registeredItemIds = useRef<Set<string>>(new Set());\n\n    // Persist pinnedIds to localStorage when they change\n    useEffect(() => {\n        if (accordionId && features.pinning) {\n            WriteToStorage(`Pinned/${accordionId}`, state.pinnedIds);\n        }\n    }, [accordionId, features.pinning, state.pinnedIds]);\n\n    // Persist hiddenIds to localStorage when they change\n    useEffect(() => {\n        if (accordionId && features.hiding) {\n            WriteToStorage(`Hidden/${accordionId}`, state.hiddenIds);\n        }\n    }, [accordionId, features.hiding, state.hiddenIds]);\n\n    // Return undefined if no accordionId or no features enabled\n    if (!accordionId || !hasFeatures) {\n        return undefined;\n    }\n\n    return {\n        accordionId,\n        state,\n        dispatch,\n        features,\n        pinnedContainerRef,\n        registeredItemIds,\n    };\n}\n\n// ============================================================================\n// Section Context\n// ============================================================================\n\n/**\n * Context value for an AccordionSectionBlock.\n */\nexport type AccordionSectionBlockContextValue = {\n    /** The section ID. */\n    sectionId: string;\n};\n\nexport const AccordionSectionBlockContext = createContext<AccordionSectionBlockContextValue | undefined>(undefined);\n\n/**\n * Hook to create the AccordionSectionBlockContext value.\n *\n * @param props - AccordionSectionBlockProps\n * @returns AccordionSectionBlockContextValue\n */\nexport function useAccordionSectionBlockContext(props: AccordionSectionBlockProps): AccordionSectionBlockContextValue {\n    const { sectionId } = props;\n    return useMemo(() => ({ sectionId }), [sectionId]);\n}\n\n// ============================================================================\n// Item Depth Context (to detect nested AccordionSectionItems)\n// ============================================================================\n\n/**\n * Context to track whether we're inside an AccordionSectionItem.\n * Used to prevent nested items from being individually manageable.\n */\nexport const AccordionItemDepthContext = createContext<boolean>(false);\n\n// ============================================================================\n// Item Context Hook\n// ============================================================================\n\n/**\n * Derived item state, computed from the accordion state during render.\n */\nexport type AccordionItemState = {\n    /** The globally unique item ID. */\n    itemUniqueId: string;\n    /** Whether this item is nested inside another AccordionSectionItem. */\n    isNested: boolean;\n    /** Whether this item is pinned. */\n    isPinned: boolean;\n    /** Whether this item is hidden. */\n    isHidden: boolean;\n    /** Whether this item matches the current search term. */\n    isMatch: boolean;\n    /** The index of this item in the pinned list (for ordering). */\n    pinnedIndex: number;\n    /** Whether edit mode is active. */\n    inEditMode: boolean;\n    /** Callbacks to modify state. */\n    actions: {\n        togglePinned: () => void;\n        toggleHidden: () => void;\n        movePinnedUp: () => void;\n    };\n};\n\n/**\n * Hook to compute item state from accordion context.\n *\n * @param props - AccordionSectionItemProps\n * @returns AccordionItemState, or undefined if no accordion context or nested item.\n */\nexport function useAccordionSectionItemState(props: AccordionSectionItemProps): AccordionItemState | undefined {\n    const { uniqueId: itemId, label: itemLabel, staticItem } = props;\n\n    const accordionCtx = useContext(AccordionContext);\n    const sectionCtx = useContext(AccordionSectionBlockContext);\n    const isNested = useContext(AccordionItemDepthContext);\n\n    // Build the globally unique item ID\n    const itemUniqueId = useMemo(() => {\n        if (!accordionCtx || !sectionCtx) {\n            return \"\";\n        }\n        return `${accordionCtx.accordionId}\\0${sectionCtx.sectionId}\\0${itemId}`;\n    }, [accordionCtx?.accordionId, sectionCtx?.sectionId, itemId]);\n\n    // Debug: warn if itemId changes (should be stable)\n    const prevItemIdRef = useRef(itemId);\n    useEffect(() => {\n        if (prevItemIdRef.current !== itemId) {\n            Logger.Warn(\n                `Accordion: The uniqueId \"${itemId}\" in section \"${sectionCtx?.sectionId}\" has changed from \"${prevItemIdRef.current}\". ` +\n                    `Each item must have a unique, stable ID for pin/hide persistence to work correctly.`\n            );\n        }\n        prevItemIdRef.current = itemId;\n    }, [itemId, sectionCtx?.sectionId]);\n\n    // Debug: warn if itemUniqueId is not unique (duplicate detection)\n    useEffect(() => {\n        if (!accordionCtx || !itemUniqueId) {\n            return;\n        }\n        const { registeredItemIds } = accordionCtx;\n        if (registeredItemIds.current.has(itemUniqueId)) {\n            Logger.Warn(\n                `Accordion: Duplicate uniqueId \"${itemId}\" detected in section \"${sectionCtx?.sectionId}\". ` +\n                    `Each item must have a unique ID within its section for pin/hide persistence to work correctly.`\n            );\n        } else {\n            registeredItemIds.current.add(itemUniqueId);\n        }\n        return () => {\n            registeredItemIds.current.delete(itemUniqueId);\n        };\n    }, [accordionCtx, itemUniqueId, itemId, sectionCtx?.sectionId]);\n\n    // If no context, static item, or nested, return undefined\n    if (!accordionCtx || staticItem) {\n        return undefined;\n    }\n\n    const { state, dispatch, features } = accordionCtx;\n    const { pinnedIds, hiddenIds, searchTerm, editMode } = state;\n\n    // Compute derived state\n    const isPinned = features.pinning && pinnedIds.includes(itemUniqueId);\n    const isHidden = features.hiding && hiddenIds.includes(itemUniqueId);\n    const pinnedIndex = isPinned ? pinnedIds.indexOf(itemUniqueId) : -1;\n\n    // Search matching\n    const searchText = (itemLabel ?? itemId).toLowerCase();\n    const isMatch = !features.search || !searchTerm || searchText.includes(searchTerm.toLowerCase());\n\n    return {\n        itemUniqueId,\n        isNested,\n        isPinned,\n        isHidden,\n        isMatch,\n        pinnedIndex,\n        inEditMode: editMode,\n        actions: {\n            togglePinned: () => dispatch({ type: \"TOGGLE_PINNED\", itemId: itemUniqueId }),\n            toggleHidden: () => dispatch({ type: \"TOGGLE_HIDDEN\", itemId: itemUniqueId }),\n            movePinnedUp: () => dispatch({ type: \"MOVE_PINNED_UP\", itemId: itemUniqueId }),\n        },\n    };\n}\n\n// ============================================================================\n// Helper hook to check if a section is empty\n// ============================================================================\n\n/**\n * Hook to determine if a section should be hidden because it has no visible items.\n * This is computed during render based on the current state.\n *\n * @param sectionId - The section ID to check.\n * @param registeredItems - Map of item IDs to their labels in this section.\n * @returns Whether the section is empty (has no visible items).\n */\nexport function useIsSectionEmpty(sectionId: string, registeredItems: Map<string, string>): boolean {\n    const accordionCtx = useContext(AccordionContext);\n\n    if (!accordionCtx) {\n        return false; // No context means no filtering, section is not empty\n    }\n\n    const { state, features, accordionId } = accordionCtx;\n    const { pinnedIds, hiddenIds, searchTerm, editMode } = state;\n\n    // In edit mode, always show sections\n    if (editMode) {\n        return false;\n    }\n\n    // Check if any item in this section is visible\n    for (const [itemId, itemLabel] of registeredItems) {\n        const itemUniqueId = `${accordionId}\\0${sectionId}\\0${itemId}`;\n        const isPinned = features.pinning && pinnedIds.includes(itemUniqueId);\n        const isHidden = features.hiding && hiddenIds.includes(itemUniqueId);\n        const searchText = (itemLabel ?? itemId).toLowerCase();\n        const isMatch = !features.search || !searchTerm || searchText.includes(searchTerm.toLowerCase());\n\n        // For the Pinned section, show items that are pinned and match\n        if (sectionId === \"Pinned\") {\n            if (isPinned && isMatch) {\n                return false;\n            }\n        } else {\n            // For regular sections, show items that are not pinned, not hidden, and match\n            if (!isPinned && !isHidden && isMatch) {\n                return false;\n            }\n        }\n    }\n\n    return true;\n}\n"]}
+{"version":3,"file":"accordion.contexts.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/accordion.contexts.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { RefObject } from \"react\";\nimport type { AccordionProps, AccordionSectionBlockProps, AccordionSectionItemProps } from \"./accordion\";\nimport { createContext, useContext, useEffect, useMemo, useReducer, useRef } from \"react\";\nimport { DataStorage } from \"core/Misc/dataStorage\";\nimport { Logger } from \"core/Misc/logger\";\n\n// ============================================================================\n// Storage Helpers\n// ============================================================================\n\nconst STORAGE_KEY_ROOT = \"Babylon/Accordion\";\n\nconst ReadFromStorage = <T,>(path: string, initial: T): T => {\n    try {\n        const stored = DataStorage.ReadString(`${STORAGE_KEY_ROOT}/${path}`, \"\");\n        return stored ? JSON.parse(stored) : initial;\n    } catch {\n        return initial;\n    }\n};\n\nconst WriteToStorage = (path: string, data: unknown): void => {\n    DataStorage.WriteString(`${STORAGE_KEY_ROOT}/${path}`, JSON.stringify(data));\n};\n\n// ============================================================================\n// State Types\n// ============================================================================\n\n/**\n * Immutable state for the Accordion.\n */\nexport type AccordionState = {\n    /** IDs of pinned items (persisted to localStorage). */\n    pinnedIds: string[];\n    /** IDs of hidden items (persisted to localStorage). */\n    hiddenIds: string[];\n    /** Current search/filter term. */\n    searchTerm: string;\n    /** Whether edit mode is active (shows pin/hide controls). */\n    editMode: boolean;\n};\n\n/**\n * Actions that can be dispatched to update accordion state.\n */\nexport type AccordionAction =\n    | { type: \"SET_SEARCH_TERM\"; term: string }\n    | { type: \"SET_EDIT_MODE\"; enabled: boolean }\n    | { type: \"TOGGLE_PINNED\"; itemId: string }\n    | { type: \"TOGGLE_HIDDEN\"; itemId: string }\n    | { type: \"MOVE_PINNED_UP\"; itemId: string }\n    | { type: \"REMOVE_STALE_IDS\"; activeIds: Set<string> }\n    | { type: \"SHOW_ALL\" }\n    | { type: \"HIDE_ALL_VISIBLE\"; visibleItemIds: string[] };\n\n/**\n * Feature flags for the Accordion (immutable after initialization).\n */\nexport type AccordionFeatures = {\n    /** Whether pinning is enabled. */\n    pinning: boolean;\n    /** Whether hiding is enabled. */\n    hiding: boolean;\n    /** Whether search is enabled. */\n    search: boolean;\n};\n\n// ============================================================================\n// Reducer\n// ============================================================================\n\nconst AccordionReducer = (state: AccordionState, action: AccordionAction): AccordionState => {\n    switch (action.type) {\n        case \"SET_SEARCH_TERM\":\n            return { ...state, searchTerm: action.term };\n\n        case \"SET_EDIT_MODE\":\n            return { ...state, editMode: action.enabled };\n\n        case \"TOGGLE_PINNED\": {\n            const isPinned = state.pinnedIds.includes(action.itemId);\n            return {\n                ...state,\n                pinnedIds: isPinned ? state.pinnedIds.filter((id) => id !== action.itemId) : [...state.pinnedIds, action.itemId],\n            };\n        }\n\n        case \"TOGGLE_HIDDEN\": {\n            const isHidden = state.hiddenIds.includes(action.itemId);\n            return {\n                ...state,\n                hiddenIds: isHidden ? state.hiddenIds.filter((id) => id !== action.itemId) : [...state.hiddenIds, action.itemId],\n            };\n        }\n\n        case \"MOVE_PINNED_UP\": {\n            const index = state.pinnedIds.indexOf(action.itemId);\n            if (index <= 0) {\n                return state;\n            }\n            const newPinnedIds = [...state.pinnedIds];\n            [newPinnedIds[index - 1], newPinnedIds[index]] = [newPinnedIds[index], newPinnedIds[index - 1]];\n            return { ...state, pinnedIds: newPinnedIds };\n        }\n\n        case \"REMOVE_STALE_IDS\": {\n            const pinnedIds = state.pinnedIds.filter((id) => action.activeIds.has(id));\n            const hiddenIds = state.hiddenIds.filter((id) => action.activeIds.has(id));\n            if (pinnedIds.length === state.pinnedIds.length && hiddenIds.length === state.hiddenIds.length) {\n                return state;\n            }\n            return { ...state, pinnedIds, hiddenIds };\n        }\n\n        case \"SHOW_ALL\":\n            return { ...state, hiddenIds: [] };\n\n        case \"HIDE_ALL_VISIBLE\":\n            return {\n                ...state,\n                hiddenIds: [...new Set([...state.hiddenIds, ...action.visibleItemIds])],\n            };\n\n        default:\n            return state;\n    }\n};\n\n// ============================================================================\n// Accordion Context\n// ============================================================================\n\n/**\n * Context value for the Accordion component.\n */\nexport type AccordionContextValue = {\n    /** The unique ID of the Accordion instance. */\n    accordionId: string;\n    /** State for the Accordion, managed via dispatch function. */\n    state: AccordionState;\n    /** Dispatch function to update state. */\n    dispatch: React.Dispatch<AccordionAction>;\n    /** Feature flags. */\n    features: AccordionFeatures;\n    /** Ref for the pinned items portal container. */\n    pinnedContainerRef: RefObject<HTMLDivElement>;\n    /** Map of registered item IDs to labels (for duplicate detection and section empty checks). */\n    registeredItemIds: Map<string, string>;\n};\n\nexport const AccordionContext = createContext<AccordionContextValue | undefined>(undefined);\n\n/**\n * Hook to create and manage the AccordionContext value.\n *\n * @param props - AccordionProps\n * @returns AccordionContextValue, or undefined if no features are enabled or no uniqueId is provided.\n */\nexport function useAccordionContext(props: AccordionProps): AccordionContextValue | undefined {\n    const { uniqueId: accordionId, enablePinnedItems, enableHiddenItems, enableSearchItems } = props;\n\n    const features: AccordionFeatures = useMemo(\n        () => ({\n            pinning: enablePinnedItems ?? false,\n            hiding: enableHiddenItems ?? false,\n            search: enableSearchItems ?? false,\n        }),\n        [enablePinnedItems, enableHiddenItems, enableSearchItems]\n    );\n\n    const hasFeatures = features.pinning || features.hiding || features.search;\n\n    // Initialize state from localStorage\n    const initialState = useMemo((): AccordionState => {\n        if (!accordionId || !hasFeatures) {\n            return { pinnedIds: [], hiddenIds: [], searchTerm: \"\", editMode: false };\n        }\n        return {\n            pinnedIds: features.pinning ? ReadFromStorage<string[]>(`Pinned/${accordionId}`, []) : [],\n            hiddenIds: features.hiding ? ReadFromStorage<string[]>(`Hidden/${accordionId}`, []) : [],\n            searchTerm: \"\",\n            editMode: false,\n        };\n    }, [accordionId, hasFeatures, features.pinning, features.hiding]);\n\n    const [state, dispatch] = useReducer(AccordionReducer, initialState);\n\n    const pinnedContainerRef = useRef<HTMLDivElement>(null);\n    const registeredItemIds = useRef<Map<string, string>>(new Map());\n\n    // Persist pinnedIds to localStorage when they change\n    useEffect(() => {\n        if (accordionId && features.pinning) {\n            WriteToStorage(`Pinned/${accordionId}`, state.pinnedIds);\n        }\n    }, [accordionId, features.pinning, state.pinnedIds]);\n\n    // Persist hiddenIds to localStorage when they change\n    useEffect(() => {\n        if (accordionId && features.hiding) {\n            WriteToStorage(`Hidden/${accordionId}`, state.hiddenIds);\n        }\n    }, [accordionId, features.hiding, state.hiddenIds]);\n\n    // Clean stale IDs from localStorage on mount. Parent effects run after\n    // children's, so all items will have registered by the time this fires.\n    useEffect(() => {\n        if (accordionId && hasFeatures) {\n            dispatch({ type: \"REMOVE_STALE_IDS\", activeIds: new Set(registeredItemIds.current.keys()) });\n        }\n    }, [accordionId, hasFeatures]);\n\n    // Return undefined if no accordionId or no features enabled\n    if (!accordionId || !hasFeatures) {\n        return undefined;\n    }\n\n    return {\n        accordionId,\n        state,\n        dispatch,\n        features,\n        pinnedContainerRef,\n        registeredItemIds: registeredItemIds.current,\n    };\n}\n\n// ============================================================================\n// Section Context\n// ============================================================================\n\n/**\n * Context value for an AccordionSectionBlock.\n */\nexport type AccordionSectionBlockContextValue = {\n    /** The section ID. */\n    sectionId: string;\n};\n\nexport const AccordionSectionBlockContext = createContext<AccordionSectionBlockContextValue | undefined>(undefined);\n\n/**\n * Hook to create the AccordionSectionBlockContext value.\n *\n * @param props - AccordionSectionBlockProps\n * @returns AccordionSectionBlockContextValue and isEmpty state\n */\nexport function useAccordionSectionBlockContext(props: AccordionSectionBlockProps): {\n    context: AccordionSectionBlockContextValue;\n    isEmpty: boolean;\n} {\n    const { sectionId } = props;\n    const context = useMemo(() => ({ sectionId }), [sectionId]);\n    const isEmpty = useIsSectionEmpty(sectionId);\n\n    return { context, isEmpty };\n}\n\n// ============================================================================\n// Item Depth Context (to detect nested AccordionSectionItems)\n// ============================================================================\n\n/**\n * Context to track whether we're inside an AccordionSectionItem.\n * Used to prevent nested items from being individually manageable.\n */\nexport const AccordionItemDepthContext = createContext<boolean>(false);\n\n// ============================================================================\n// Item Context Hook\n// ============================================================================\n\n/**\n * Derived item state, computed from the accordion state during render.\n */\nexport type AccordionItemState = {\n    /** The globally unique item ID. */\n    itemUniqueId: string;\n    /** Whether this item is nested inside another AccordionSectionItem. */\n    isNested: boolean;\n    /** Whether this item is pinned. */\n    isPinned: boolean;\n    /** Whether this item is hidden. */\n    isHidden: boolean;\n    /** Whether this item matches the current search term. */\n    isMatch: boolean;\n    /** The index of this item in the pinned list (for ordering). */\n    pinnedIndex: number;\n    /** Whether this pinned item can be moved up (is not first in the pinned list). */\n    canMoveUp: boolean;\n    /** Whether edit mode is active. */\n    inEditMode: boolean;\n    /** Callbacks to modify state. */\n    actions: {\n        togglePinned: () => void;\n        toggleHidden: () => void;\n        movePinnedUp: () => void;\n    };\n};\n\n/**\n * Hook to compute item state from accordion context.\n *\n * @param props - AccordionSectionItemProps\n * @returns AccordionItemState, or undefined if no accordion context or nested item.\n */\nexport function useAccordionSectionItemState(props: AccordionSectionItemProps): AccordionItemState | undefined {\n    const { uniqueId: itemId, label: itemLabel, staticItem } = props;\n\n    const accordionCtx = useContext(AccordionContext);\n    const sectionCtx = useContext(AccordionSectionBlockContext);\n    const isNested = useContext(AccordionItemDepthContext);\n\n    // Build the globally unique item ID\n    const itemUniqueId = useMemo(() => {\n        if (!accordionCtx || !sectionCtx) {\n            return \"\";\n        }\n        return `${accordionCtx.accordionId}/${sectionCtx.sectionId}/${itemId}`;\n    }, [accordionCtx?.accordionId, sectionCtx?.sectionId, itemId]);\n\n    // Debug: warn if itemId changes (should be stable)\n    const prevItemIdRef = useRef(itemId);\n    useEffect(() => {\n        if (prevItemIdRef.current !== itemId) {\n            Logger.Warn(\n                `Accordion: The uniqueId \"${itemId}\" in section \"${sectionCtx?.sectionId}\" has changed from \"${prevItemIdRef.current}\". ` +\n                    `Each item must have a unique, stable ID for pin/hide persistence to work correctly.`\n            );\n        }\n        prevItemIdRef.current = itemId;\n    }, [itemId, sectionCtx?.sectionId]);\n\n    // Register item and detect duplicates (skip nested items, as children of other AccordionSectionItem should not participate in pin/hide/search).\n    useEffect(() => {\n        if (!accordionCtx || !itemUniqueId || isNested) {\n            return;\n        }\n        const { registeredItemIds } = accordionCtx;\n        if (registeredItemIds.has(itemUniqueId)) {\n            Logger.Warn(\n                `Accordion: Duplicate uniqueId \"${itemId}\" detected in section \"${sectionCtx?.sectionId}\". ` +\n                    `Each item must have a unique ID within its section for pin/hide persistence to work correctly.`\n            );\n        }\n        registeredItemIds.set(itemUniqueId, itemLabel ?? itemId);\n        return () => {\n            registeredItemIds.delete(itemUniqueId);\n        };\n    }, [accordionCtx, itemUniqueId, itemId, itemLabel, sectionCtx?.sectionId, isNested]);\n\n    // If no context, static item, or nested, return undefined\n    if (!accordionCtx || staticItem) {\n        return undefined;\n    }\n\n    const { state, dispatch, features } = accordionCtx;\n    const { pinnedIds, hiddenIds, searchTerm, editMode } = state;\n\n    // Compute derived state\n    const isPinned = features.pinning && pinnedIds.includes(itemUniqueId);\n    const isHidden = features.hiding && hiddenIds.includes(itemUniqueId);\n    const pinnedIndex = isPinned ? pinnedIds.indexOf(itemUniqueId) : -1;\n\n    const canMoveUp = isPinned && pinnedIndex > 0;\n\n    // Search matching\n    const searchText = (itemLabel ?? itemId).toLowerCase();\n    const isMatch = !features.search || !searchTerm || searchText.includes(searchTerm.toLowerCase());\n\n    return {\n        itemUniqueId,\n        isNested,\n        isPinned,\n        isHidden,\n        isMatch,\n        pinnedIndex,\n        canMoveUp,\n        inEditMode: editMode,\n        actions: {\n            togglePinned: () => dispatch({ type: \"TOGGLE_PINNED\", itemId: itemUniqueId }),\n            toggleHidden: () => dispatch({ type: \"TOGGLE_HIDDEN\", itemId: itemUniqueId }),\n            movePinnedUp: () => dispatch({ type: \"MOVE_PINNED_UP\", itemId: itemUniqueId }),\n        },\n    };\n}\n/**\n * Hook to determine if a section is empty (has no visible items).\n * Derived from accordion state + globally registered items filtered by section prefix.\n *\n * @param sectionId - The section ID to check.\n * @returns Whether the section has no visible items.\n */\nfunction useIsSectionEmpty(sectionId: string): boolean {\n    const accordionCtx = useContext(AccordionContext);\n\n    if (!accordionCtx) {\n        return false;\n    }\n\n    const { state, features, accordionId, registeredItemIds } = accordionCtx;\n    const { pinnedIds, hiddenIds, searchTerm, editMode } = state;\n\n    if (editMode) {\n        return false;\n    }\n\n    const sectionPrefix = `${accordionId}/${sectionId}/`;\n    let hasItems = false;\n\n    for (const [itemId, itemLabel] of registeredItemIds) {\n        if (!itemId.startsWith(sectionPrefix)) {\n            continue;\n        }\n        hasItems = true;\n        const isPinned = features.pinning && pinnedIds.includes(itemId);\n        const isHidden = features.hiding && hiddenIds.includes(itemId);\n        const searchText = (itemLabel || itemId).toLowerCase();\n        const isMatch = !features.search || !searchTerm || searchText.includes(searchTerm.toLowerCase());\n        if (!isPinned && !isHidden && isMatch) {\n            return false;\n        }\n    }\n\n    return hasItems;\n}\n"]}