@onerjs/shared-ui-components 8.36.7 → 8.36.9

package/fluent/hoc/propertyLines/propertyLine.d.ts

@@ -45,10 +45,6 @@ type ExpandableProperty = {
      * If true, the expanded content will be shown by default.
      */
     expandByDefault?: boolean;
-    /**
-     * If true, the expanded content will be indented to the right.
-     */
-    indentExpandedContent?: boolean;
 };
 type NonExpandableProperty = {
     expandedContent?: undefined;

package/fluent/hoc/propertyLines/propertyLine.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Body1, Checkbox, makeStyles, tokens, mergeClasses, Tooltip } from "@fluentui/react-components";
+import { Body1, Checkbox, makeStyles, tokens, mergeClasses } from "@fluentui/react-components";
 import { ChevronCircleDown20Regular, ChevronCircleDown16Regular, ChevronCircleRight16Regular, ChevronCircleRight20Regular, CopyRegular, Copy16Regular, } from "@fluentui/react-icons";
 import { useContext, useState, forwardRef, cloneElement, isValidElement, useRef } from "react";
 import { Collapse } from "../../primitives/collapse.js";
@@ -10,6 +10,7 @@ import { ToggleButton } from "../../primitives/toggleButton.js";
 import { Button } from "../../primitives/button.js";
 import { CustomTokens, TokenMap } from "../../primitives/utils.js";
 import { InfoLabel } from "../../primitives/infoLabel.js";
+import { Tooltip } from "../../primitives/tooltip.js";
 const usePropertyLineStyles = makeStyles({
     baseLine: {
         display: "flex",
@@ -46,8 +47,6 @@ const usePropertyLineStyles = makeStyles({
     },
     expandedContentDiv: {
         overflow: "hidden",
-    },
-    expandedContentDivIndented: {
         paddingLeft: tokens.spacingHorizontalM,
     },
     checkbox: {
@@ -87,7 +86,7 @@ export const PropertyLine = forwardRef((props, ref) => {
         : children;
     return (_jsxs(LineContainer, { ref: ref, children: [_jsxs("div", { className: classes.baseLine, children: [_jsx(InfoLabel, { className: classes.infoLabel, htmlFor: "property", info: description, label: label, flexLabel: true }), _jsxs("div", { className: classes.rightContent, id: "property", children: [expandedContent && (_jsx(ToggleButton, { title: "Expand/Collapse property", appearance: "transparent", checkedIcon: size === "small" ? ChevronCircleDown16Regular : ChevronCircleDown20Regular, uncheckedIcon: size === "small" ? ChevronCircleRight16Regular : ChevronCircleRight20Regular, value: expanded === true, onChange: setExpanded })), nullable && !ignoreNullable && (
                             // If this is a nullableProperty and ignoreNullable was not sent, display a checkbox used to toggle null ('checked' means 'non null')
-                            _jsx(Tooltip, { relationship: "label", content: props.value == null ? "Enable property" : "Disable property (set to null)", children: _jsx(Checkbox, { className: classes.checkbox, indicator: { className: classes.checkboxIndicator }, checked: !(props.value == null), onChange: (_, data) => {
+                            _jsx(Tooltip, { content: props.value == null ? "Enable property" : "Disable property (set to null)", children: _jsx(Checkbox, { className: classes.checkbox, indicator: { className: classes.checkboxIndicator }, checked: !(props.value == null), onChange: (_, data) => {
                                         if (data.checked) {
                                             // if checked this means we are returning to non-null, use cached value if exists. If no cached value, use default value
                                             cachedVal.current != null ? props.onChange(cachedVal.current) : props.onChange(props.defaultValue);
@@ -97,7 +96,7 @@ export const PropertyLine = forwardRef((props, ref) => {
                                             cachedVal.current = props.value;
                                             props.onChange(null);
                                         }
-                                    } }) })), _jsx("div", { className: classes.childWrapper, children: processedChildren }), onCopy && !disableCopy && (_jsx(Button, { className: classes.copy, title: "Copy to clipboard", appearance: "transparent", icon: size === "small" ? Copy16Regular : CopyRegular, onClick: () => copyCommandToClipboard(onCopy()) }))] })] }), expandedContent && (_jsx(Collapse, { visible: !!expanded, children: _jsx("div", { className: mergeClasses(classes.expandedContentDiv, props.indentExpandedContent ? classes.expandedContentDivIndented : undefined), children: expandedContent }) }))] }));
+                                    } }) })), _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: () => copyCommandToClipboard(onCopy()) }) }))] })] }), expandedContent && (_jsx(Collapse, { visible: !!expanded, children: _jsx("div", { className: classes.expandedContentDiv, children: expandedContent }) }))] }));
 });
 const useLineStyles = makeStyles({
     container: {

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, Tooltip } 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 } from \"react\";\r\nimport { useContext, useState, forwardRef, cloneElement, isValidElement, useRef } 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\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    },\r\n    expandedContentDivIndented: {\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     * 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 or indentExpandedContent 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 true, the expanded content will be indented to the right.\r\n     */\r\n    indentExpandedContent?: 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, 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 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}>\r\n            <div className={classes.baseLine}>\r\n                <InfoLabel className={classes.infoLabel} htmlFor=\"property\" info={description} label={label} flexLabel />\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 relationship=\"label\" 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                        <Button\r\n                            className={classes.copy}\r\n                            title=\"Copy to clipboard\"\r\n                            appearance=\"transparent\"\r\n                            icon={size === \"small\" ? Copy16Regular : CopyRegular}\r\n                            onClick={() => copyCommandToClipboard(onCopy())}\r\n                        />\r\n                    )}\r\n                </div>\r\n            </div>\r\n            {expandedContent && (\r\n                <Collapse visible={!!expanded}>\r\n                    <div className={mergeClasses(classes.expandedContentDiv, props.indentExpandedContent ? classes.expandedContentDivIndented : undefined)}>{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>>>((props, ref) => {\r\n    const { size } = useContext(ToolContext);\r\n    const classes = useLineStyles();\r\n\r\n    return (\r\n        <div ref={ref} className={mergeClasses(classes.container, size == \"small\" ? classes.containerSmall : undefined)} {...props}>\r\n            {props.children}\r\n        </div>\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 } from \"react\";\r\nimport { useContext, useState, forwardRef, cloneElement, isValidElement, useRef } 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\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     * 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, 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 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}>\r\n            <div className={classes.baseLine}>\r\n                <InfoLabel className={classes.infoLabel} htmlFor=\"property\" info={description} label={label} flexLabel />\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\r\n                                className={classes.copy}\r\n                                appearance=\"transparent\"\r\n                                icon={size === \"small\" ? Copy16Regular : CopyRegular}\r\n                                onClick={() => copyCommandToClipboard(onCopy())}\r\n                            />\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>>>((props, ref) => {\r\n    const { size } = useContext(ToolContext);\r\n    const classes = useLineStyles();\r\n\r\n    return (\r\n        <div ref={ref} className={mergeClasses(classes.container, size == \"small\" ? classes.containerSmall : undefined)} {...props}>\r\n            {props.children}\r\n        </div>\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/icons.d.ts

@@ -1,3 +1,8 @@
 export declare const MeshIcon: import("@fluentui/react-icons").FluentIcon;
 export declare const TranslateIcon: import("@fluentui/react-icons").FluentIcon;
 export declare const MaterialIcon: import("@fluentui/react-icons").FluentIcon;
+export declare const FlatTangentIcon: import("@fluentui/react-icons").FluentIcon;
+export declare const LinearTangentIcon: import("@fluentui/react-icons").FluentIcon;
+export declare const BreakTangentIcon: import("@fluentui/react-icons").FluentIcon;
+export declare const UnifyTangentIcon: import("@fluentui/react-icons").FluentIcon;
+export declare const StepTangentIcon: import("@fluentui/react-icons").FluentIcon;

package/fluent/icons.js

@@ -2,4 +2,9 @@ import { createFluentIcon } from "@fluentui/react-icons";
 export const MeshIcon = createFluentIcon("Mesh", "16", '<path d="M14.03,3.54l-5.11-2.07c-.61-.25-1.27-.25-1.88,0L1.93,3.54c-.57.23-.94.78-.94,1.39v6.15c0,.61.37,1.16.94,1.39l5.11,2.07c.3.12.62.18.94.18s.64-.06.94-.18l5.12-2.07c.57-.23.94-.78.94-1.39v-6.15c0-.61-.37-1.16-.94-1.39ZM13.97,7.71l-2.11.86v-2.71l2.11-.86v2.71ZM1.99,5l2.11.86v2.71l-2.11-.86v-2.71ZM11.35,4.98l-2.04-.83,1.78-.72,2.04.83-1.78.72ZM10.02,5.52l-2.04.83-2.04-.83,2.04-.83,2.04.83ZM4.6,4.98l-1.78-.72,2.04-.83,1.78.72-2.04.83ZM5.1,6.26l2.38.96v2.71l-2.38-.96v-2.71ZM8.48,7.22l2.38-.96v2.71l-2.38.96v-2.71ZM7.41,2.39c.18-.07.37-.11.56-.11s.38.04.56.11l1.22.49-1.78.72-1.79-.72,1.22-.49ZM1.99,11.07v-2.29l2.11.86v2.62l-1.8-.73c-.19-.08-.31-.26-.31-.46ZM5.1,12.67v-2.62l2.38.96v2.61s-.04,0-.06-.01l-2.31-.94ZM8.54,13.61s-.04,0-.06.01v-2.61l2.38-.96v2.62l-2.31.94ZM13.66,11.54l-1.8.73v-2.62l2.11-.86v2.29c0,.2-.12.39-.31.46Z"/>');
 export const TranslateIcon = createFluentIcon("Translate", "24", '<path d="M20.16,12.98l-2.75-2.75c-.29-.29-.77-.29-1.06,0-.29.29-.29.77,0,1.06l1.47,1.47h-6.69v-6.69l1.47,1.47c.29.29.77.29,1.06,0,.29-.29.29-.77,0-1.06l-2.75-2.75c-.14-.14-.33-.22-.53-.22s-.39.08-.53.22l-2.75,2.75c-.29.29-.29.77,0,1.06.29.29.77.29,1.06,0l1.47-1.47v7.13l-3.52,3.52v-2.08c0-.41-.34-.75-.75-.75s-.75.34-.75.75v3.89c0,.2.08.39.22.53.14.14.33.22.53.22h3.89c.41,0,.75-.34.75-.75s-.34-.75-.75-.75h-2.08s3.52-3.52,3.52-3.52h7.13l-1.47,1.47c-.29.29-.29.77,0,1.06s.77.29,1.06,0l2.75-2.75c.14-.14.22-.33.22-.53s-.08-.39-.22-.53Z" />');
 export const MaterialIcon = createFluentIcon("Material", "16", '<path d="M14.74,6.3c-.09-.36-.38-.64-.75-.72-.04-.09-.08-.18-.12-.27.1-.15.16-.32.16-.51,0-.18-.05-.34-.13-.48-1.23-1.97-3.41-3.28-5.9-3.28C4.16,1.04,1.04,4.16,1.04,7.99c0,.39.23.72.57.88.02.12.03.25.06.37-.18.18-.3.42-.3.7,0,.11.02.21.06.31.94,2.74,3.53,4.71,6.58,4.71,3.84,0,6.96-3.12,6.96-6.96,0-.59-.08-1.16-.22-1.7ZM2.07,8.58c-.02-.19-.03-.39-.03-.58,0-3.29,2.67-5.96,5.96-5.96,2.23,0,4.17,1.23,5.2,3.05.05.18-.07.45-.3.75-.57-.73-1.45-1.21-2.45-1.21-1.72,0-3.12,1.4-3.12,3.11,0,.33.07.65.16.95-3.05.82-5.17.52-5.42-.11ZM12.56,7.75c0,1.17-.95,2.11-2.11,2.11s-2.12-.95-2.12-2.11.95-2.11,2.12-2.11,2.11.95,2.11,2.11ZM8,13.96c-2.6,0-4.81-1.68-5.62-4.01.5.16,1.11.24,1.79.24,1.15,0,2.49-.22,3.79-.59.57.76,1.47,1.26,2.49,1.26,1.72,0,3.11-1.4,3.11-3.11,0-.34-.07-.65-.17-.96.13-.13.24-.26.34-.39.14.51.22,1.04.22,1.6,0,3.29-2.67,5.96-5.96,5.96Z"/>');
+export const FlatTangentIcon = createFluentIcon("FlatTangent", "20", '<g transform="scale(0.5)"><path d="M28,18.5a1.51,1.51,0,0,0-1.41,1H11.5v1H26.59a1.5,1.5,0,1,0,1.41-2Z"/></g>');
+export const LinearTangentIcon = createFluentIcon("LinearTangent", "20", '<g transform="scale(0.5)"><path d="M26,14a1.49,1.49,0,0,0-2.4,1.69l-10,10,.71.71,10-10A1.49,1.49,0,0,0,26,14Z"/></g>');
+export const BreakTangentIcon = createFluentIcon("BreakTangent", "20", '<g transform="scale(0.5)"><path d="M27.11,13.05a1.49,1.49,0,0,0-2.05.53,1.47,1.47,0,0,0,.14,1.72l-4.78,8L20,22.92l-.42.42-4.78-8a1.47,1.47,0,0,0,.14-1.72,1.49,1.49,0,0,0-2-.53,1.5,1.5,0,0,0,1,2.76l4.91,8.26-1,1L20,27.16,22.12,25l-1-1,4.91-8.26a1.5,1.5,0,0,0,1.05-2.76Z"/></g>');
+export const UnifyTangentIcon = createFluentIcon("UnifyTangent", "20", '<g transform="scale(0.5)"><path d="M27.94,18.28a1.49,1.49,0,0,0-1.41,1h-5l-1.62-1.63-1.62,1.63h-5a1.5,1.5,0,1,0,0,1h5l1.62,1.62,1.62-1.62h5a1.5,1.5,0,1,0,1.41-2Z"/></g>');
+export const StepTangentIcon = createFluentIcon("StepTangent", "20", '<g transform="scale(0.5)"><path d="M29,16.71a1.5,1.5,0,1,0-2,1.41v5.67H11v1H28V18.12A1.51,1.51,0,0,0,29,16.71Z"/></g>');
 //# sourceMappingURL=icons.js.map

package/fluent/icons.js.map

@@ -1 +1 @@
-{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/fluent/icons.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,MAAM,CAAC,MAAM,QAAQ,GAAG,gBAAgB,CACpC,MAAM,EACN,IAAI,EACJ,w0BAAw0B,CAC30B,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,gBAAgB,CACzC,WAAW,EACX,IAAI,EACJ,4hBAA4hB,CAC/hB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,gBAAgB,CACxC,UAAU,EACV,IAAI,EACJ,i1BAAi1B,CACp1B,CAAC","sourcesContent":["import { createFluentIcon } from \"@fluentui/react-icons\";\r\n\r\nexport const MeshIcon = createFluentIcon(\r\n    \"Mesh\",\r\n    \"16\",\r\n    '<path d=\"M14.03,3.54l-5.11-2.07c-.61-.25-1.27-.25-1.88,0L1.93,3.54c-.57.23-.94.78-.94,1.39v6.15c0,.61.37,1.16.94,1.39l5.11,2.07c.3.12.62.18.94.18s.64-.06.94-.18l5.12-2.07c.57-.23.94-.78.94-1.39v-6.15c0-.61-.37-1.16-.94-1.39ZM13.97,7.71l-2.11.86v-2.71l2.11-.86v2.71ZM1.99,5l2.11.86v2.71l-2.11-.86v-2.71ZM11.35,4.98l-2.04-.83,1.78-.72,2.04.83-1.78.72ZM10.02,5.52l-2.04.83-2.04-.83,2.04-.83,2.04.83ZM4.6,4.98l-1.78-.72,2.04-.83,1.78.72-2.04.83ZM5.1,6.26l2.38.96v2.71l-2.38-.96v-2.71ZM8.48,7.22l2.38-.96v2.71l-2.38.96v-2.71ZM7.41,2.39c.18-.07.37-.11.56-.11s.38.04.56.11l1.22.49-1.78.72-1.79-.72,1.22-.49ZM1.99,11.07v-2.29l2.11.86v2.62l-1.8-.73c-.19-.08-.31-.26-.31-.46ZM5.1,12.67v-2.62l2.38.96v2.61s-.04,0-.06-.01l-2.31-.94ZM8.54,13.61s-.04,0-.06.01v-2.61l2.38-.96v2.62l-2.31.94ZM13.66,11.54l-1.8.73v-2.62l2.11-.86v2.29c0,.2-.12.39-.31.46Z\"/>'\r\n);\r\n\r\nexport const TranslateIcon = createFluentIcon(\r\n    \"Translate\",\r\n    \"24\",\r\n    '<path d=\"M20.16,12.98l-2.75-2.75c-.29-.29-.77-.29-1.06,0-.29.29-.29.77,0,1.06l1.47,1.47h-6.69v-6.69l1.47,1.47c.29.29.77.29,1.06,0,.29-.29.29-.77,0-1.06l-2.75-2.75c-.14-.14-.33-.22-.53-.22s-.39.08-.53.22l-2.75,2.75c-.29.29-.29.77,0,1.06.29.29.77.29,1.06,0l1.47-1.47v7.13l-3.52,3.52v-2.08c0-.41-.34-.75-.75-.75s-.75.34-.75.75v3.89c0,.2.08.39.22.53.14.14.33.22.53.22h3.89c.41,0,.75-.34.75-.75s-.34-.75-.75-.75h-2.08s3.52-3.52,3.52-3.52h7.13l-1.47,1.47c-.29.29-.29.77,0,1.06s.77.29,1.06,0l2.75-2.75c.14-.14.22-.33.22-.53s-.08-.39-.22-.53Z\" />'\r\n);\r\n\r\nexport const MaterialIcon = createFluentIcon(\r\n    \"Material\",\r\n    \"16\",\r\n    '<path d=\"M14.74,6.3c-.09-.36-.38-.64-.75-.72-.04-.09-.08-.18-.12-.27.1-.15.16-.32.16-.51,0-.18-.05-.34-.13-.48-1.23-1.97-3.41-3.28-5.9-3.28C4.16,1.04,1.04,4.16,1.04,7.99c0,.39.23.72.57.88.02.12.03.25.06.37-.18.18-.3.42-.3.7,0,.11.02.21.06.31.94,2.74,3.53,4.71,6.58,4.71,3.84,0,6.96-3.12,6.96-6.96,0-.59-.08-1.16-.22-1.7ZM2.07,8.58c-.02-.19-.03-.39-.03-.58,0-3.29,2.67-5.96,5.96-5.96,2.23,0,4.17,1.23,5.2,3.05.05.18-.07.45-.3.75-.57-.73-1.45-1.21-2.45-1.21-1.72,0-3.12,1.4-3.12,3.11,0,.33.07.65.16.95-3.05.82-5.17.52-5.42-.11ZM12.56,7.75c0,1.17-.95,2.11-2.11,2.11s-2.12-.95-2.12-2.11.95-2.11,2.12-2.11,2.11.95,2.11,2.11ZM8,13.96c-2.6,0-4.81-1.68-5.62-4.01.5.16,1.11.24,1.79.24,1.15,0,2.49-.22,3.79-.59.57.76,1.47,1.26,2.49,1.26,1.72,0,3.11-1.4,3.11-3.11,0-.34-.07-.65-.17-.96.13-.13.24-.26.34-.39.14.51.22,1.04.22,1.6,0,3.29-2.67,5.96-5.96,5.96Z\"/>'\r\n);\r\n"]}
+{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/fluent/icons.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,MAAM,CAAC,MAAM,QAAQ,GAAG,gBAAgB,CACpC,MAAM,EACN,IAAI,EACJ,w0BAAw0B,CAC30B,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,gBAAgB,CACzC,WAAW,EACX,IAAI,EACJ,4hBAA4hB,CAC/hB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,gBAAgB,CACxC,UAAU,EACV,IAAI,EACJ,i1BAAi1B,CACp1B,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,gBAAgB,CAC3C,aAAa,EACb,IAAI,EACJ,8GAA8G,CACjH,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,gBAAgB,CAC7C,eAAe,EACf,IAAI,EACJ,sHAAsH,CACzH,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,gBAAgB,CAC5C,cAAc,EACd,IAAI,EACJ,qRAAqR,CACxR,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,gBAAgB,CAC5C,cAAc,EACd,IAAI,EACJ,0KAA0K,CAC7K,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,gBAAgB,CAC3C,aAAa,EACb,IAAI,EACJ,uHAAuH,CAC1H,CAAC","sourcesContent":["import { createFluentIcon } from \"@fluentui/react-icons\";\r\n\r\nexport const MeshIcon = createFluentIcon(\r\n    \"Mesh\",\r\n    \"16\",\r\n    '<path d=\"M14.03,3.54l-5.11-2.07c-.61-.25-1.27-.25-1.88,0L1.93,3.54c-.57.23-.94.78-.94,1.39v6.15c0,.61.37,1.16.94,1.39l5.11,2.07c.3.12.62.18.94.18s.64-.06.94-.18l5.12-2.07c.57-.23.94-.78.94-1.39v-6.15c0-.61-.37-1.16-.94-1.39ZM13.97,7.71l-2.11.86v-2.71l2.11-.86v2.71ZM1.99,5l2.11.86v2.71l-2.11-.86v-2.71ZM11.35,4.98l-2.04-.83,1.78-.72,2.04.83-1.78.72ZM10.02,5.52l-2.04.83-2.04-.83,2.04-.83,2.04.83ZM4.6,4.98l-1.78-.72,2.04-.83,1.78.72-2.04.83ZM5.1,6.26l2.38.96v2.71l-2.38-.96v-2.71ZM8.48,7.22l2.38-.96v2.71l-2.38.96v-2.71ZM7.41,2.39c.18-.07.37-.11.56-.11s.38.04.56.11l1.22.49-1.78.72-1.79-.72,1.22-.49ZM1.99,11.07v-2.29l2.11.86v2.62l-1.8-.73c-.19-.08-.31-.26-.31-.46ZM5.1,12.67v-2.62l2.38.96v2.61s-.04,0-.06-.01l-2.31-.94ZM8.54,13.61s-.04,0-.06.01v-2.61l2.38-.96v2.62l-2.31.94ZM13.66,11.54l-1.8.73v-2.62l2.11-.86v2.29c0,.2-.12.39-.31.46Z\"/>'\r\n);\r\n\r\nexport const TranslateIcon = createFluentIcon(\r\n    \"Translate\",\r\n    \"24\",\r\n    '<path d=\"M20.16,12.98l-2.75-2.75c-.29-.29-.77-.29-1.06,0-.29.29-.29.77,0,1.06l1.47,1.47h-6.69v-6.69l1.47,1.47c.29.29.77.29,1.06,0,.29-.29.29-.77,0-1.06l-2.75-2.75c-.14-.14-.33-.22-.53-.22s-.39.08-.53.22l-2.75,2.75c-.29.29-.29.77,0,1.06.29.29.77.29,1.06,0l1.47-1.47v7.13l-3.52,3.52v-2.08c0-.41-.34-.75-.75-.75s-.75.34-.75.75v3.89c0,.2.08.39.22.53.14.14.33.22.53.22h3.89c.41,0,.75-.34.75-.75s-.34-.75-.75-.75h-2.08s3.52-3.52,3.52-3.52h7.13l-1.47,1.47c-.29.29-.29.77,0,1.06s.77.29,1.06,0l2.75-2.75c.14-.14.22-.33.22-.53s-.08-.39-.22-.53Z\" />'\r\n);\r\n\r\nexport const MaterialIcon = createFluentIcon(\r\n    \"Material\",\r\n    \"16\",\r\n    '<path d=\"M14.74,6.3c-.09-.36-.38-.64-.75-.72-.04-.09-.08-.18-.12-.27.1-.15.16-.32.16-.51,0-.18-.05-.34-.13-.48-1.23-1.97-3.41-3.28-5.9-3.28C4.16,1.04,1.04,4.16,1.04,7.99c0,.39.23.72.57.88.02.12.03.25.06.37-.18.18-.3.42-.3.7,0,.11.02.21.06.31.94,2.74,3.53,4.71,6.58,4.71,3.84,0,6.96-3.12,6.96-6.96,0-.59-.08-1.16-.22-1.7ZM2.07,8.58c-.02-.19-.03-.39-.03-.58,0-3.29,2.67-5.96,5.96-5.96,2.23,0,4.17,1.23,5.2,3.05.05.18-.07.45-.3.75-.57-.73-1.45-1.21-2.45-1.21-1.72,0-3.12,1.4-3.12,3.11,0,.33.07.65.16.95-3.05.82-5.17.52-5.42-.11ZM12.56,7.75c0,1.17-.95,2.11-2.11,2.11s-2.12-.95-2.12-2.11.95-2.11,2.12-2.11,2.11.95,2.11,2.11ZM8,13.96c-2.6,0-4.81-1.68-5.62-4.01.5.16,1.11.24,1.79.24,1.15,0,2.49-.22,3.79-.59.57.76,1.47,1.26,2.49,1.26,1.72,0,3.11-1.4,3.11-3.11,0-.34-.07-.65-.17-.96.13-.13.24-.26.34-.39.14.51.22,1.04.22,1.6,0,3.29-2.67,5.96-5.96,5.96Z\"/>'\r\n);\r\n\r\nexport const FlatTangentIcon = createFluentIcon(\r\n    \"FlatTangent\",\r\n    \"20\",\r\n    '<g transform=\"scale(0.5)\"><path d=\"M28,18.5a1.51,1.51,0,0,0-1.41,1H11.5v1H26.59a1.5,1.5,0,1,0,1.41-2Z\"/></g>'\r\n);\r\n\r\nexport const LinearTangentIcon = createFluentIcon(\r\n    \"LinearTangent\",\r\n    \"20\",\r\n    '<g transform=\"scale(0.5)\"><path d=\"M26,14a1.49,1.49,0,0,0-2.4,1.69l-10,10,.71.71,10-10A1.49,1.49,0,0,0,26,14Z\"/></g>'\r\n);\r\n\r\nexport const BreakTangentIcon = createFluentIcon(\r\n    \"BreakTangent\",\r\n    \"20\",\r\n    '<g transform=\"scale(0.5)\"><path d=\"M27.11,13.05a1.49,1.49,0,0,0-2.05.53,1.47,1.47,0,0,0,.14,1.72l-4.78,8L20,22.92l-.42.42-4.78-8a1.47,1.47,0,0,0,.14-1.72,1.49,1.49,0,0,0-2-.53,1.5,1.5,0,0,0,1,2.76l4.91,8.26-1,1L20,27.16,22.12,25l-1-1,4.91-8.26a1.5,1.5,0,0,0,1.05-2.76Z\"/></g>'\r\n);\r\n\r\nexport const UnifyTangentIcon = createFluentIcon(\r\n    \"UnifyTangent\",\r\n    \"20\",\r\n    '<g transform=\"scale(0.5)\"><path d=\"M27.94,18.28a1.49,1.49,0,0,0-1.41,1h-5l-1.62-1.63-1.62,1.63h-5a1.5,1.5,0,1,0,0,1h5l1.62,1.62,1.62-1.62h5a1.5,1.5,0,1,0,1.41-2Z\"/></g>'\r\n);\r\n\r\nexport const StepTangentIcon = createFluentIcon(\r\n    \"StepTangent\",\r\n    \"20\",\r\n    '<g transform=\"scale(0.5)\"><path d=\"M29,16.71a1.5,1.5,0,1,0-2,1.41v5.67H11v1H28V18.12A1.51,1.51,0,0,0,29,16.71Z\"/></g>'\r\n);\r\n"]}

package/fluent/primitives/button.js

@@ -3,6 +3,7 @@ import { Button as FluentButton, makeStyles, Spinner } from "@fluentui/react-com
 import { forwardRef, useCallback, useContext, useState } from "react";
 import { ToolContext } from "../hoc/fluentToolWrapper.js";
 import { TokenMap } from "./utils.js";
+import { Tooltip } from "./tooltip.js";
 const useButtonStyles = makeStyles({
     smallIcon: {
         fontSize: TokenMap.px16,
@@ -15,7 +16,7 @@ export const Button = forwardRef((props, ref) => {
     const { size } = useContext(ToolContext);
     const classes = useButtonStyles();
     // eslint-disable-next-line @typescript-eslint/naming-convention
-    const { icon: Icon, label, onClick, disabled, className, ...buttonProps } = props;
+    const { icon: Icon, label, onClick, disabled, className, title, ...buttonProps } = props;
     const [isOnClickBusy, setIsOnClickBusy] = useState(false);
     const handleOnClick = useCallback(async (e) => {
         const result = onClick?.(e);
@@ -30,7 +31,7 @@ export const Button = forwardRef((props, ref) => {
         }
     }, [onClick]);
     const iconClass = size === "small" ? classes.smallIcon : classes.mediumIcon;
-    return (_jsx(FluentButton, { ref: ref, iconPosition: "after", ...buttonProps, className: className, size: size, icon: isOnClickBusy ? _jsx(Spinner, { size: "extra-tiny" }) : Icon && _jsx(Icon, { className: iconClass }), onClick: handleOnClick, disabled: disabled || isOnClickBusy, children: label && props.label }));
+    return (_jsx(Tooltip, { content: title ?? "", children: _jsx(FluentButton, { ref: ref, iconPosition: "after", ...buttonProps, className: className, size: size, icon: isOnClickBusy ? _jsx(Spinner, { size: "extra-tiny" }) : Icon && _jsx(Icon, { className: iconClass }), onClick: handleOnClick, disabled: disabled || isOnClickBusy, children: label && props.label }) }));
 });
 Button.displayName = "Button";
 //# sourceMappingURL=button.js.map

package/fluent/primitives/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAEzF,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGtE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnC,MAAM,eAAe,GAAG,UAAU,CAAC;IAC/B,SAAS,EAAE;QACP,QAAQ,EAAE,QAAQ,CAAC,IAAI;KAC1B;IACD,UAAU,EAAE;QACR,QAAQ,EAAE,QAAQ,CAAC,IAAI;KAC1B;CACJ,CAAC,CAAC;AASH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAiC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC5E,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,OAAO,GAAG,eAAe,EAAE,CAAC;IAClC,gEAAgE;IAChE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,WAAW,EAAE,GAAG,KAAK,CAAC;IAElF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,aAAa,GAAG,WAAW,CAC7B,KAAK,EAAE,CAAgC,EAAE,EAAE;QACvC,MAAM,MAAM,GAAG,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,MAAM,YAAY,OAAO,EAAE,CAAC;YAC5B,gBAAgB,CAAC,IAAI,CAAC,CAAC;YACvB,IAAI,CAAC;gBACD,MAAM,MAAM,CAAC;YACjB,CAAC;oBAAS,CAAC;gBACP,gBAAgB,CAAC,KAAK,CAAC,CAAC;YAC5B,CAAC;QACL,CAAC;IACL,CAAC,EACD,CAAC,OAAO,CAAC,CACZ,CAAC;IAEF,MAAM,SAAS,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC;IAE5E,OAAO,CACH,KAAC,YAAY,IACT,GAAG,EAAE,GAAG,EACR,YAAY,EAAC,OAAO,KAChB,WAAW,EACf,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC,CAAC,CAAC,IAAI,IAAI,KAAC,IAAI,IAAC,SAAS,EAAE,SAAS,GAAI,EAC5F,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,QAAQ,IAAI,aAAa,YAElC,KAAK,IAAI,KAAK,CAAC,KAAK,GACV,CAClB,CAAC;AACN,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import { Button as FluentButton, makeStyles, Spinner } from \"@fluentui/react-components\";\r\nimport type { MouseEvent } from \"react\";\r\nimport { forwardRef, useCallback, useContext, useState } from \"react\";\r\nimport type { FluentIcon } from \"@fluentui/react-icons\";\r\nimport type { BasePrimitiveProps } from \"./primitive\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\nimport { TokenMap } from \"./utils\";\r\n\r\nconst useButtonStyles = makeStyles({\r\n    smallIcon: {\r\n        fontSize: TokenMap.px16,\r\n    },\r\n    mediumIcon: {\r\n        fontSize: TokenMap.px20,\r\n    },\r\n});\r\n\r\nexport type ButtonProps = BasePrimitiveProps & {\r\n    onClick?: (e?: MouseEvent<HTMLButtonElement>) => unknown | Promise<unknown>;\r\n    icon?: FluentIcon;\r\n    appearance?: \"subtle\" | \"transparent\" | \"primary\" | \"secondary\";\r\n    label?: string;\r\n};\r\n\r\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {\r\n    const { size } = useContext(ToolContext);\r\n    const classes = useButtonStyles();\r\n    // eslint-disable-next-line @typescript-eslint/naming-convention\r\n    const { icon: Icon, label, onClick, disabled, className, ...buttonProps } = props;\r\n\r\n    const [isOnClickBusy, setIsOnClickBusy] = useState(false);\r\n    const handleOnClick = useCallback(\r\n        async (e: MouseEvent<HTMLButtonElement>) => {\r\n            const result = onClick?.(e);\r\n            if (result instanceof Promise) {\r\n                setIsOnClickBusy(true);\r\n                try {\r\n                    await result;\r\n                } finally {\r\n                    setIsOnClickBusy(false);\r\n                }\r\n            }\r\n        },\r\n        [onClick]\r\n    );\r\n\r\n    const iconClass = size === \"small\" ? classes.smallIcon : classes.mediumIcon;\r\n\r\n    return (\r\n        <FluentButton\r\n            ref={ref}\r\n            iconPosition=\"after\"\r\n            {...buttonProps}\r\n            className={className}\r\n            size={size}\r\n            icon={isOnClickBusy ? <Spinner size=\"extra-tiny\" /> : Icon && <Icon className={iconClass} />}\r\n            onClick={handleOnClick}\r\n            disabled={disabled || isOnClickBusy}\r\n        >\r\n            {label && props.label}\r\n        </FluentButton>\r\n    );\r\n});\r\n\r\nButton.displayName = \"Button\";\r\n"]}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAEzF,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGtE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,MAAM,eAAe,GAAG,UAAU,CAAC;IAC/B,SAAS,EAAE;QACP,QAAQ,EAAE,QAAQ,CAAC,IAAI;KAC1B;IACD,UAAU,EAAE;QACR,QAAQ,EAAE,QAAQ,CAAC,IAAI;KAC1B;CACJ,CAAC,CAAC;AASH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAiC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC5E,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,OAAO,GAAG,eAAe,EAAE,CAAC;IAClC,gEAAgE;IAChE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,GAAG,KAAK,CAAC;IAEzF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,aAAa,GAAG,WAAW,CAC7B,KAAK,EAAE,CAAgC,EAAE,EAAE;QACvC,MAAM,MAAM,GAAG,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;QAC5B,IAAI,MAAM,YAAY,OAAO,EAAE,CAAC;YAC5B,gBAAgB,CAAC,IAAI,CAAC,CAAC;YACvB,IAAI,CAAC;gBACD,MAAM,MAAM,CAAC;YACjB,CAAC;oBAAS,CAAC;gBACP,gBAAgB,CAAC,KAAK,CAAC,CAAC;YAC5B,CAAC;QACL,CAAC;IACL,CAAC,EACD,CAAC,OAAO,CAAC,CACZ,CAAC;IAEF,MAAM,SAAS,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC;IAE5E,OAAO,CACH,KAAC,OAAO,IAAC,OAAO,EAAE,KAAK,IAAI,EAAE,YACzB,KAAC,YAAY,IACT,GAAG,EAAE,GAAG,EACR,YAAY,EAAC,OAAO,KAChB,WAAW,EACf,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC,CAAC,CAAC,IAAI,IAAI,KAAC,IAAI,IAAC,SAAS,EAAE,SAAS,GAAI,EAC5F,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,QAAQ,IAAI,aAAa,YAElC,KAAK,IAAI,KAAK,CAAC,KAAK,GACV,GACT,CACb,CAAC;AACN,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import { Button as FluentButton, makeStyles, Spinner } from \"@fluentui/react-components\";\r\nimport type { MouseEvent } from \"react\";\r\nimport { forwardRef, useCallback, useContext, useState } from \"react\";\r\nimport type { FluentIcon } from \"@fluentui/react-icons\";\r\nimport type { BasePrimitiveProps } from \"./primitive\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\nimport { TokenMap } from \"./utils\";\r\nimport { Tooltip } from \"./tooltip\";\r\n\r\nconst useButtonStyles = makeStyles({\r\n    smallIcon: {\r\n        fontSize: TokenMap.px16,\r\n    },\r\n    mediumIcon: {\r\n        fontSize: TokenMap.px20,\r\n    },\r\n});\r\n\r\nexport type ButtonProps = BasePrimitiveProps & {\r\n    onClick?: (e?: MouseEvent<HTMLButtonElement>) => unknown | Promise<unknown>;\r\n    icon?: FluentIcon;\r\n    appearance?: \"subtle\" | \"transparent\" | \"primary\" | \"secondary\";\r\n    label?: string;\r\n};\r\n\r\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {\r\n    const { size } = useContext(ToolContext);\r\n    const classes = useButtonStyles();\r\n    // eslint-disable-next-line @typescript-eslint/naming-convention\r\n    const { icon: Icon, label, onClick, disabled, className, title, ...buttonProps } = props;\r\n\r\n    const [isOnClickBusy, setIsOnClickBusy] = useState(false);\r\n    const handleOnClick = useCallback(\r\n        async (e: MouseEvent<HTMLButtonElement>) => {\r\n            const result = onClick?.(e);\r\n            if (result instanceof Promise) {\r\n                setIsOnClickBusy(true);\r\n                try {\r\n                    await result;\r\n                } finally {\r\n                    setIsOnClickBusy(false);\r\n                }\r\n            }\r\n        },\r\n        [onClick]\r\n    );\r\n\r\n    const iconClass = size === \"small\" ? classes.smallIcon : classes.mediumIcon;\r\n\r\n    return (\r\n        <Tooltip content={title ?? \"\"}>\r\n            <FluentButton\r\n                ref={ref}\r\n                iconPosition=\"after\"\r\n                {...buttonProps}\r\n                className={className}\r\n                size={size}\r\n                icon={isOnClickBusy ? <Spinner size=\"extra-tiny\" /> : Icon && <Icon className={iconClass} />}\r\n                onClick={handleOnClick}\r\n                disabled={disabled || isOnClickBusy}\r\n            >\r\n                {label && props.label}\r\n            </FluentButton>\r\n        </Tooltip>\r\n    );\r\n});\r\n\r\nButton.displayName = \"Button\";\r\n"]}

package/fluent/primitives/colorPicker.js

@@ -128,7 +128,7 @@ const InputRgbField = (props) => {
         newColor[rgbKey] = val / 255.0; // Convert to 0-1 range
         onChange(newColor);
     }, [value, onChange, rgbKey]);
-    return (_jsx(SpinButton, { title: title, infoLabel: title ? { label: title } : undefined, className: classes.inputField, min: 0, max: 255, value: Math.round(value[rgbKey] * 255), forceInt: true, onChange: handleChange }));
+    return (_jsx(SpinButton, { infoLabel: title ? { label: title } : undefined, className: classes.inputField, min: 0, max: 255, value: Math.round(value[rgbKey] * 255), forceInt: true, onChange: handleChange }));
 };
 function rgbaToHsv(color) {
     const c = new Color3(color.r, color.g, color.b);
@@ -154,7 +154,7 @@ export const InputHsvField = (props) => {
         }
         props.onChange(newColor);
     }, [value, onChange, hsvKey, scale]);
-    return (_jsx(SpinButton, { infoLabel: title ? { label: title } : undefined, title: title, className: classes.inputField, min: 0, max: max, value: Math.round(rgbaToHsv(value)[hsvKey] * scale), forceInt: true, onChange: handleChange }));
+    return (_jsx(SpinButton, { infoLabel: title ? { label: title } : undefined, className: classes.inputField, min: 0, max: max, value: Math.round(rgbaToHsv(value)[hsvKey] * scale), forceInt: true, onChange: handleChange }));
 };
 /**
  * Displays the alpha value of a color, either in the disabled state (if color is Color3) or as a spin button (if color is Color4).

package/fluent/primitives/colorPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"colorPicker.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/colorPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable jsdoc/require-returns */\r\n/* eslint-disable @typescript-eslint/naming-convention */\r\nimport { forwardRef, useState, useEffect, useCallback, useContext } from \"react\";\r\nimport type { FunctionComponent } from \"react\";\r\nimport { ColorPicker as FluentColorPicker, ColorSlider, ColorArea, AlphaSlider, makeStyles, tokens, Body1Strong, ColorSwatch, Body1 } from \"@fluentui/react-components\";\r\nimport type { ColorPickerProps as FluentColorPickerProps } from \"@fluentui/react-components\";\r\nimport { Color3, Color4 } from \"core/Maths/math.color\";\r\nimport type { PrimitiveProps } from \"./primitive\";\r\nimport { SpinButton } from \"./spinButton\";\r\nimport { TextInput } from \"./textInput\";\r\nimport { NumberDropdown } from \"./dropdown\";\r\nimport { ValidateColorHex } from \"./utils\";\r\nimport { Link } from \"./link\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\nimport { Popover } from \"./popover\";\r\n\r\nconst useColorPickerStyles = makeStyles({\r\n    container: {\r\n        width: \"350px\",\r\n        display: \"flex\", // becomes a flexbox\r\n        flexDirection: \"column\", // with children in a column\r\n        alignItems: \"center\", // centers children horizontally\r\n        justifyContent: \"center\", // centers children vertically (if height is set)\r\n        gap: tokens.spacingVerticalM,\r\n        overflow: \"visible\",\r\n    },\r\n    row: {\r\n        flex: 1, // is a row in the container's flex column\r\n        display: \"flex\", // becomes its own flexbox\r\n        flexDirection: \"row\", // with children in a row\r\n        gap: tokens.spacingHorizontalXL,\r\n        alignItems: \"center\", // align items vertically\r\n        width: \"100%\",\r\n    },\r\n    colorPicker: {\r\n        flex: 1,\r\n        width: \"350px\",\r\n        height: \"350px\",\r\n    },\r\n    previewColor: {\r\n        width: \"60px\",\r\n        height: \"60px\",\r\n        borderRadius: tokens.borderRadiusMedium, // 4px?\r\n        border: `${tokens.spacingVerticalXXS} solid ${tokens.colorNeutralShadowKeyLighter}`,\r\n        \"@media (forced-colors: active)\": {\r\n            forcedColorAdjust: \"none\", // ensures elmement maintains color in high constrast mode\r\n        },\r\n    },\r\n    inputRow: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        flex: 1, // grow and fill available space\r\n        justifyContent: \"center\",\r\n        gap: \"10px\",\r\n        width: \"100%\",\r\n    },\r\n    inputField: {\r\n        flex: 1, // grow and fill available space\r\n        width: \"auto\",\r\n        minWidth: 0,\r\n        gap: tokens.spacingVerticalSNudge, // 6px\r\n    },\r\n    trigger: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n    },\r\n});\r\n\r\nexport type ColorPickerProps<C extends Color3 | Color4> = {\r\n    isLinearMode?: boolean;\r\n} & PrimitiveProps<C>;\r\n\r\nexport const ColorPickerPopup = forwardRef<HTMLButtonElement, ColorPickerProps<Color3 | Color4>>((props, ref) => {\r\n    ColorPickerPopup.displayName = \"ColorPickerPopup\";\r\n    const { value, onChange, isLinearMode, ...rest } = props;\r\n    const classes = useColorPickerStyles();\r\n    const [color, setColor] = useState(value);\r\n    const [isLinear, setIsLinear] = useState(isLinearMode ?? false);\r\n    const [isFloat, setFloat] = useState(false);\r\n    const { size } = useContext(ToolContext);\r\n    useEffect(() => {\r\n        setColor(value); // Ensures the trigger color updates when props.value changes\r\n    }, [value]);\r\n\r\n    const handleColorPickerChange: FluentColorPickerProps[\"onColorChange\"] = (_, data) => {\r\n        let color: Color3 | Color4 = Color3.FromHSV(data.color.h, data.color.s, data.color.v);\r\n        if (value instanceof Color4) {\r\n            color = Color4.FromColor3(color, data.color.a ?? 1);\r\n        }\r\n        handleChange(color);\r\n    };\r\n\r\n    const handleChange = (newColor: Color3 | Color4) => {\r\n        setColor(newColor);\r\n        onChange(newColor); // Ensures the parent is notified when color changes from within colorPicker\r\n    };\r\n\r\n    return (\r\n        <Popover\r\n            trigger={\r\n                <ColorSwatch\r\n                    className={classes.trigger}\r\n                    ref={ref}\r\n                    {...rest}\r\n                    borderColor={tokens.colorNeutralShadowKeyDarker}\r\n                    size={size === \"small\" ? \"extra-small\" : \"small\"}\r\n                    shape=\"rounded\"\r\n                    color={color.toHexString()}\r\n                    value={color.toHexString().slice(1)}\r\n                />\r\n            }\r\n        >\r\n            <div className={classes.container}>\r\n                <FluentColorPicker className={classes.colorPicker} color={rgbaToHsv(color)} onColorChange={handleColorPickerChange}>\r\n                    <ColorArea inputX={{ \"aria-label\": \"Saturation\" }} inputY={{ \"aria-label\": \"Brightness\" }} />\r\n                    <ColorSlider aria-label=\"Hue\" />\r\n                    {color instanceof Color4 && <AlphaSlider aria-label=\"Alpha\" />}\r\n                </FluentColorPicker>\r\n                {/* Top Row: Preview, Gamma Hex, Linear Hex */}\r\n                <div className={classes.row}>\r\n                    <div className={classes.previewColor} style={{ backgroundColor: color.toHexString() }} />\r\n                    <NumberDropdown\r\n                        className={classes.inputField}\r\n                        infoLabel={{\r\n                            label: \"Color Space\",\r\n                            info: <Body1>Today this is not mutable as the color space is determined by the entity. Soon we will allow swapping</Body1>,\r\n                        }}\r\n                        options={[\r\n                            { label: \"Gamma\", value: 0 },\r\n                            { label: \"Linear\", value: 1 },\r\n                        ]}\r\n                        disabled={true}\r\n                        value={isLinear ? 1 : 0}\r\n                        onChange={(val: number) => setIsLinear(val === 1)}\r\n                    />\r\n                    <NumberDropdown\r\n                        className={classes.inputField}\r\n                        infoLabel={{\r\n                            label: \"Data Type\",\r\n                            info: <Body1>We will introduce this functionality soon!</Body1>,\r\n                        }}\r\n                        options={[\r\n                            { label: \"Int\", value: 0 },\r\n                            { label: \"Float\", value: 1 },\r\n                        ]}\r\n                        disabled={true}\r\n                        value={isFloat ? 1 : 0}\r\n                        onChange={(val: number) => setFloat(val === 1)}\r\n                    />\r\n                </div>\r\n\r\n                {/* Middle Row: Red, Green, Blue, Alpha */}\r\n                <div className={classes.inputRow}>\r\n                    <InputRgbField title=\"Red\" value={color} rgbKey=\"r\" onChange={handleChange} />\r\n                    <InputRgbField title=\"Green\" value={color} rgbKey=\"g\" onChange={handleChange} />\r\n                    <InputRgbField title=\"Blue\" value={color} rgbKey=\"b\" onChange={handleChange} />\r\n                    <InputAlphaField color={color} onChange={handleChange} />\r\n                </div>\r\n\r\n                {/* Bottom Row: Hue, Saturation, Value */}\r\n                <div className={classes.inputRow}>\r\n                    <InputHsvField title=\"Hue\" value={color} hsvKey=\"h\" max={360} onChange={handleChange} />\r\n                    <InputHsvField title=\"Saturation\" value={color} hsvKey=\"s\" max={100} scale={100} onChange={handleChange} />\r\n                    <InputHsvField title=\"Value\" value={color} hsvKey=\"v\" max={100} scale={100} onChange={handleChange} />\r\n                </div>\r\n\r\n                <div className={classes.inputRow}>\r\n                    <InputHexField title=\"Hexadecimal\" linearHex={isLinear} isLinearMode={isLinear} value={color} onChange={handleChange} />\r\n                </div>\r\n            </div>\r\n        </Popover>\r\n    );\r\n});\r\n\r\nexport type InputHexProps = PrimitiveProps<Color3 | Color4> & {\r\n    linearHex?: boolean;\r\n    isLinearMode?: boolean;\r\n};\r\n/**\r\n * Component which displays the passed in color's HEX value, either in linearSpace (if linearHex is true) or in gamma space\r\n * When the hex color is changed by user, component calculates the new Color3/4 value and calls onChange\r\n *\r\n * Component uses the isLinearMode boolean to display an informative label regarding linear / gamma space\r\n * @param props - The properties for the InputHexField component.\r\n * @returns\r\n */\r\nexport const InputHexField: FunctionComponent<InputHexProps> = (props) => {\r\n    const classes = useColorPickerStyles();\r\n    const { title, value, onChange, linearHex, isLinearMode } = props;\r\n\r\n    return (\r\n        <TextInput\r\n            disabled={linearHex ? !isLinearMode : false}\r\n            className={classes.inputField}\r\n            value={linearHex ? value.toLinearSpace().toHexString() : value.toHexString()}\r\n            validator={ValidateColorHex}\r\n            onChange={(val) => (linearHex ? onChange(Color3.FromHexString(val).toGammaSpace()) : onChange(Color3.FromHexString(val)))}\r\n            infoLabel={\r\n                title\r\n                    ? {\r\n                          label: title,\r\n                          // If not representing a linearHex, no info is needed.\r\n                          info: !props.linearHex ? undefined : !isLinearMode ? ( // If representing a linear hex but we are in gammaMode, simple message explaining why linearHex is disabled\r\n                              <> This color picker is attached to an entity whose color is stored in gamma space, so we are showing linear hex in disabled view </>\r\n                          ) : (\r\n                              // If representing a linear hex and we are in linearMode, give information about how to use these hex values\r\n                              <>\r\n                                  This color picker is attached to an entity whose color is stored in linear space (ex: PBR Material), and Babylon converts the color to gamma space\r\n                                  before rendering on screen because the human eye is best at processing colors in gamma space. We thus also want to display the color picker in\r\n                                  gamma space so that the color chosen here will match the color seen in your entity.\r\n                                  <br />\r\n                                  If you want to copy/paste the HEX into your code, you can either use\r\n                                  <Body1Strong>Color3.FromHexString(LINEAR_HEX)</Body1Strong>\r\n                                  <br />\r\n                                  or\r\n                                  <br />\r\n                                  <Body1Strong>Color3.FromHexString(GAMMA_HEX).toLinearSpace()</Body1Strong>\r\n                                  <br />\r\n                                  <br />\r\n                                  <Link url=\"https://doc.babylonjs.com/preparingArtForBabylon/controllingColorSpace/\" value=\"Read more in our docs!\" />\r\n                              </>\r\n                          ),\r\n                      }\r\n                    : undefined\r\n            }\r\n        />\r\n    );\r\n};\r\n\r\ntype RgbKey = \"r\" | \"g\" | \"b\";\r\ntype InputRgbFieldProps = PrimitiveProps<Color3 | Color4> & {\r\n    rgbKey: RgbKey;\r\n};\r\n\r\nconst InputRgbField: FunctionComponent<InputRgbFieldProps> = (props) => {\r\n    const { value, onChange, title, rgbKey } = props;\r\n    const classes = useColorPickerStyles();\r\n\r\n    const handleChange = useCallback(\r\n        (val: number) => {\r\n            const newColor = value.clone();\r\n            newColor[rgbKey] = val / 255.0; // Convert to 0-1 range\r\n            onChange(newColor);\r\n        },\r\n        [value, onChange, rgbKey]\r\n    );\r\n\r\n    return (\r\n        <SpinButton\r\n            title={title}\r\n            infoLabel={title ? { label: title } : undefined}\r\n            className={classes.inputField}\r\n            min={0}\r\n            max={255}\r\n            value={Math.round(value[rgbKey] * 255)}\r\n            forceInt\r\n            onChange={handleChange}\r\n        />\r\n    );\r\n};\r\n\r\nfunction rgbaToHsv(color: { r: number; g: number; b: number; a?: number }): { h: number; s: number; v: number; a?: number } {\r\n    const c = new Color3(color.r, color.g, color.b);\r\n    const hsv = c.toHSV();\r\n    return { h: hsv.r, s: hsv.g, v: hsv.b, a: color.a };\r\n}\r\n\r\ntype HsvKey = \"h\" | \"s\" | \"v\";\r\ntype InputHsvFieldProps = PrimitiveProps<Color3 | Color4> & {\r\n    hsvKey: HsvKey;\r\n    max: number;\r\n    scale?: number;\r\n};\r\n\r\n/**\r\n * In the HSV (Hue, Saturation, Value) color model, Hue (H) ranges from 0 to 360 degrees, representing the color's position on the color wheel.\r\n * Saturation (S) ranges from 0 to 100%, indicating the intensity or purity of the color, with 0 being shades of gray and 100 being a fully saturated color.\r\n * Value (V) ranges from 0 to 100%, representing the brightness of the color, with 0 being black and 100 being the brightest.\r\n * @param props - The properties for the InputHsvField component.\r\n */\r\nexport const InputHsvField: FunctionComponent<InputHsvFieldProps> = (props) => {\r\n    const { value, title, hsvKey, max, onChange, scale = 1 } = props;\r\n\r\n    const classes = useColorPickerStyles();\r\n\r\n    const handleChange = useCallback(\r\n        (val: number) => {\r\n            // Convert current color to HSV, update the new hsv value, then call onChange prop\r\n            const hsv = rgbaToHsv(value);\r\n            hsv[hsvKey] = val / scale;\r\n            let newColor: Color3 | Color4 = Color3.FromHSV(hsv.h, hsv.s, hsv.v);\r\n            if (value instanceof Color4) {\r\n                newColor = Color4.FromColor3(newColor, value.a ?? 1);\r\n            }\r\n            props.onChange(newColor);\r\n        },\r\n        [value, onChange, hsvKey, scale]\r\n    );\r\n\r\n    return (\r\n        <SpinButton\r\n            infoLabel={title ? { label: title } : undefined}\r\n            title={title}\r\n            className={classes.inputField}\r\n            min={0}\r\n            max={max}\r\n            value={Math.round(rgbaToHsv(value)[hsvKey] * scale)}\r\n            forceInt\r\n            onChange={handleChange}\r\n        />\r\n    );\r\n};\r\n\r\ntype InputAlphaProps = {\r\n    color: Color3 | Color4;\r\n    onChange: (color: Color4) => void;\r\n};\r\n\r\n/**\r\n * Displays the alpha value of a color, either in the disabled state (if color is Color3) or as a spin button (if color is Color4).\r\n * @param props\r\n * @returns\r\n */\r\nconst InputAlphaField: FunctionComponent<InputAlphaProps> = (props) => {\r\n    const classes = useColorPickerStyles();\r\n    const { color, onChange } = props;\r\n\r\n    const handleChange = useCallback(\r\n        (value: number) => {\r\n            if (Number.isNaN(value) || value < 0 || value > 1) {\r\n                return;\r\n            }\r\n\r\n            if (color instanceof Color4) {\r\n                const newColor = color.clone();\r\n                newColor.a = value;\r\n                return newColor;\r\n            } else {\r\n                return Color4.FromColor3(color, value);\r\n            }\r\n        },\r\n        [onChange]\r\n    );\r\n\r\n    return (\r\n        <SpinButton\r\n            disabled={color instanceof Color3}\r\n            min={0}\r\n            max={1}\r\n            className={classes.inputField}\r\n            value={color instanceof Color3 ? 1 : color.a}\r\n            step={0.01}\r\n            onChange={handleChange}\r\n            infoLabel={{\r\n                label: \"Alpha\",\r\n                info:\r\n                    color instanceof Color3 ? (\r\n                        <>\r\n                            Because this color picker is representing a Color3, we do not permit modifying alpha from the color picker. You can however modify the entity's alpha\r\n                            property directly, either in code via entity.alpha OR via inspector's transparency section.\r\n                        </>\r\n                    ) : undefined,\r\n            }}\r\n        />\r\n    );\r\n};\r\n"]}
+{"version":3,"file":"colorPicker.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/colorPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable jsdoc/require-returns */\r\n/* eslint-disable @typescript-eslint/naming-convention */\r\nimport { forwardRef, useState, useEffect, useCallback, useContext } from \"react\";\r\nimport type { FunctionComponent } from \"react\";\r\nimport { ColorPicker as FluentColorPicker, ColorSlider, ColorArea, AlphaSlider, makeStyles, tokens, Body1Strong, ColorSwatch, Body1 } from \"@fluentui/react-components\";\r\nimport type { ColorPickerProps as FluentColorPickerProps } from \"@fluentui/react-components\";\r\nimport { Color3, Color4 } from \"core/Maths/math.color\";\r\nimport type { PrimitiveProps } from \"./primitive\";\r\nimport { SpinButton } from \"./spinButton\";\r\nimport { TextInput } from \"./textInput\";\r\nimport { NumberDropdown } from \"./dropdown\";\r\nimport { ValidateColorHex } from \"./utils\";\r\nimport { Link } from \"./link\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\nimport { Popover } from \"./popover\";\r\n\r\nconst useColorPickerStyles = makeStyles({\r\n    container: {\r\n        width: \"350px\",\r\n        display: \"flex\", // becomes a flexbox\r\n        flexDirection: \"column\", // with children in a column\r\n        alignItems: \"center\", // centers children horizontally\r\n        justifyContent: \"center\", // centers children vertically (if height is set)\r\n        gap: tokens.spacingVerticalM,\r\n        overflow: \"visible\",\r\n    },\r\n    row: {\r\n        flex: 1, // is a row in the container's flex column\r\n        display: \"flex\", // becomes its own flexbox\r\n        flexDirection: \"row\", // with children in a row\r\n        gap: tokens.spacingHorizontalXL,\r\n        alignItems: \"center\", // align items vertically\r\n        width: \"100%\",\r\n    },\r\n    colorPicker: {\r\n        flex: 1,\r\n        width: \"350px\",\r\n        height: \"350px\",\r\n    },\r\n    previewColor: {\r\n        width: \"60px\",\r\n        height: \"60px\",\r\n        borderRadius: tokens.borderRadiusMedium, // 4px?\r\n        border: `${tokens.spacingVerticalXXS} solid ${tokens.colorNeutralShadowKeyLighter}`,\r\n        \"@media (forced-colors: active)\": {\r\n            forcedColorAdjust: \"none\", // ensures elmement maintains color in high constrast mode\r\n        },\r\n    },\r\n    inputRow: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        flex: 1, // grow and fill available space\r\n        justifyContent: \"center\",\r\n        gap: \"10px\",\r\n        width: \"100%\",\r\n    },\r\n    inputField: {\r\n        flex: 1, // grow and fill available space\r\n        width: \"auto\",\r\n        minWidth: 0,\r\n        gap: tokens.spacingVerticalSNudge, // 6px\r\n    },\r\n    trigger: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n    },\r\n});\r\n\r\nexport type ColorPickerProps<C extends Color3 | Color4> = {\r\n    isLinearMode?: boolean;\r\n} & PrimitiveProps<C>;\r\n\r\nexport const ColorPickerPopup = forwardRef<HTMLButtonElement, ColorPickerProps<Color3 | Color4>>((props, ref) => {\r\n    ColorPickerPopup.displayName = \"ColorPickerPopup\";\r\n    const { value, onChange, isLinearMode, ...rest } = props;\r\n    const classes = useColorPickerStyles();\r\n    const [color, setColor] = useState(value);\r\n    const [isLinear, setIsLinear] = useState(isLinearMode ?? false);\r\n    const [isFloat, setFloat] = useState(false);\r\n    const { size } = useContext(ToolContext);\r\n    useEffect(() => {\r\n        setColor(value); // Ensures the trigger color updates when props.value changes\r\n    }, [value]);\r\n\r\n    const handleColorPickerChange: FluentColorPickerProps[\"onColorChange\"] = (_, data) => {\r\n        let color: Color3 | Color4 = Color3.FromHSV(data.color.h, data.color.s, data.color.v);\r\n        if (value instanceof Color4) {\r\n            color = Color4.FromColor3(color, data.color.a ?? 1);\r\n        }\r\n        handleChange(color);\r\n    };\r\n\r\n    const handleChange = (newColor: Color3 | Color4) => {\r\n        setColor(newColor);\r\n        onChange(newColor); // Ensures the parent is notified when color changes from within colorPicker\r\n    };\r\n\r\n    return (\r\n        <Popover\r\n            trigger={\r\n                <ColorSwatch\r\n                    className={classes.trigger}\r\n                    ref={ref}\r\n                    {...rest}\r\n                    borderColor={tokens.colorNeutralShadowKeyDarker}\r\n                    size={size === \"small\" ? \"extra-small\" : \"small\"}\r\n                    shape=\"rounded\"\r\n                    color={color.toHexString()}\r\n                    value={color.toHexString().slice(1)}\r\n                />\r\n            }\r\n        >\r\n            <div className={classes.container}>\r\n                <FluentColorPicker className={classes.colorPicker} color={rgbaToHsv(color)} onColorChange={handleColorPickerChange}>\r\n                    <ColorArea inputX={{ \"aria-label\": \"Saturation\" }} inputY={{ \"aria-label\": \"Brightness\" }} />\r\n                    <ColorSlider aria-label=\"Hue\" />\r\n                    {color instanceof Color4 && <AlphaSlider aria-label=\"Alpha\" />}\r\n                </FluentColorPicker>\r\n                {/* Top Row: Preview, Gamma Hex, Linear Hex */}\r\n                <div className={classes.row}>\r\n                    <div className={classes.previewColor} style={{ backgroundColor: color.toHexString() }} />\r\n                    <NumberDropdown\r\n                        className={classes.inputField}\r\n                        infoLabel={{\r\n                            label: \"Color Space\",\r\n                            info: <Body1>Today this is not mutable as the color space is determined by the entity. Soon we will allow swapping</Body1>,\r\n                        }}\r\n                        options={[\r\n                            { label: \"Gamma\", value: 0 },\r\n                            { label: \"Linear\", value: 1 },\r\n                        ]}\r\n                        disabled={true}\r\n                        value={isLinear ? 1 : 0}\r\n                        onChange={(val: number) => setIsLinear(val === 1)}\r\n                    />\r\n                    <NumberDropdown\r\n                        className={classes.inputField}\r\n                        infoLabel={{\r\n                            label: \"Data Type\",\r\n                            info: <Body1>We will introduce this functionality soon!</Body1>,\r\n                        }}\r\n                        options={[\r\n                            { label: \"Int\", value: 0 },\r\n                            { label: \"Float\", value: 1 },\r\n                        ]}\r\n                        disabled={true}\r\n                        value={isFloat ? 1 : 0}\r\n                        onChange={(val: number) => setFloat(val === 1)}\r\n                    />\r\n                </div>\r\n\r\n                {/* Middle Row: Red, Green, Blue, Alpha */}\r\n                <div className={classes.inputRow}>\r\n                    <InputRgbField title=\"Red\" value={color} rgbKey=\"r\" onChange={handleChange} />\r\n                    <InputRgbField title=\"Green\" value={color} rgbKey=\"g\" onChange={handleChange} />\r\n                    <InputRgbField title=\"Blue\" value={color} rgbKey=\"b\" onChange={handleChange} />\r\n                    <InputAlphaField color={color} onChange={handleChange} />\r\n                </div>\r\n\r\n                {/* Bottom Row: Hue, Saturation, Value */}\r\n                <div className={classes.inputRow}>\r\n                    <InputHsvField title=\"Hue\" value={color} hsvKey=\"h\" max={360} onChange={handleChange} />\r\n                    <InputHsvField title=\"Saturation\" value={color} hsvKey=\"s\" max={100} scale={100} onChange={handleChange} />\r\n                    <InputHsvField title=\"Value\" value={color} hsvKey=\"v\" max={100} scale={100} onChange={handleChange} />\r\n                </div>\r\n\r\n                <div className={classes.inputRow}>\r\n                    <InputHexField title=\"Hexadecimal\" linearHex={isLinear} isLinearMode={isLinear} value={color} onChange={handleChange} />\r\n                </div>\r\n            </div>\r\n        </Popover>\r\n    );\r\n});\r\n\r\nexport type InputHexProps = PrimitiveProps<Color3 | Color4> & {\r\n    linearHex?: boolean;\r\n    isLinearMode?: boolean;\r\n};\r\n/**\r\n * Component which displays the passed in color's HEX value, either in linearSpace (if linearHex is true) or in gamma space\r\n * When the hex color is changed by user, component calculates the new Color3/4 value and calls onChange\r\n *\r\n * Component uses the isLinearMode boolean to display an informative label regarding linear / gamma space\r\n * @param props - The properties for the InputHexField component.\r\n * @returns\r\n */\r\nexport const InputHexField: FunctionComponent<InputHexProps> = (props) => {\r\n    const classes = useColorPickerStyles();\r\n    const { title, value, onChange, linearHex, isLinearMode } = props;\r\n\r\n    return (\r\n        <TextInput\r\n            disabled={linearHex ? !isLinearMode : false}\r\n            className={classes.inputField}\r\n            value={linearHex ? value.toLinearSpace().toHexString() : value.toHexString()}\r\n            validator={ValidateColorHex}\r\n            onChange={(val) => (linearHex ? onChange(Color3.FromHexString(val).toGammaSpace()) : onChange(Color3.FromHexString(val)))}\r\n            infoLabel={\r\n                title\r\n                    ? {\r\n                          label: title,\r\n                          // If not representing a linearHex, no info is needed.\r\n                          info: !props.linearHex ? undefined : !isLinearMode ? ( // If representing a linear hex but we are in gammaMode, simple message explaining why linearHex is disabled\r\n                              <> This color picker is attached to an entity whose color is stored in gamma space, so we are showing linear hex in disabled view </>\r\n                          ) : (\r\n                              // If representing a linear hex and we are in linearMode, give information about how to use these hex values\r\n                              <>\r\n                                  This color picker is attached to an entity whose color is stored in linear space (ex: PBR Material), and Babylon converts the color to gamma space\r\n                                  before rendering on screen because the human eye is best at processing colors in gamma space. We thus also want to display the color picker in\r\n                                  gamma space so that the color chosen here will match the color seen in your entity.\r\n                                  <br />\r\n                                  If you want to copy/paste the HEX into your code, you can either use\r\n                                  <Body1Strong>Color3.FromHexString(LINEAR_HEX)</Body1Strong>\r\n                                  <br />\r\n                                  or\r\n                                  <br />\r\n                                  <Body1Strong>Color3.FromHexString(GAMMA_HEX).toLinearSpace()</Body1Strong>\r\n                                  <br />\r\n                                  <br />\r\n                                  <Link url=\"https://doc.babylonjs.com/preparingArtForBabylon/controllingColorSpace/\" value=\"Read more in our docs!\" />\r\n                              </>\r\n                          ),\r\n                      }\r\n                    : undefined\r\n            }\r\n        />\r\n    );\r\n};\r\n\r\ntype RgbKey = \"r\" | \"g\" | \"b\";\r\ntype InputRgbFieldProps = PrimitiveProps<Color3 | Color4> & {\r\n    rgbKey: RgbKey;\r\n};\r\n\r\nconst InputRgbField: FunctionComponent<InputRgbFieldProps> = (props) => {\r\n    const { value, onChange, title, rgbKey } = props;\r\n    const classes = useColorPickerStyles();\r\n\r\n    const handleChange = useCallback(\r\n        (val: number) => {\r\n            const newColor = value.clone();\r\n            newColor[rgbKey] = val / 255.0; // Convert to 0-1 range\r\n            onChange(newColor);\r\n        },\r\n        [value, onChange, rgbKey]\r\n    );\r\n\r\n    return (\r\n        <SpinButton\r\n            infoLabel={title ? { label: title } : undefined}\r\n            className={classes.inputField}\r\n            min={0}\r\n            max={255}\r\n            value={Math.round(value[rgbKey] * 255)}\r\n            forceInt\r\n            onChange={handleChange}\r\n        />\r\n    );\r\n};\r\n\r\nfunction rgbaToHsv(color: { r: number; g: number; b: number; a?: number }): { h: number; s: number; v: number; a?: number } {\r\n    const c = new Color3(color.r, color.g, color.b);\r\n    const hsv = c.toHSV();\r\n    return { h: hsv.r, s: hsv.g, v: hsv.b, a: color.a };\r\n}\r\n\r\ntype HsvKey = \"h\" | \"s\" | \"v\";\r\ntype InputHsvFieldProps = PrimitiveProps<Color3 | Color4> & {\r\n    hsvKey: HsvKey;\r\n    max: number;\r\n    scale?: number;\r\n};\r\n\r\n/**\r\n * In the HSV (Hue, Saturation, Value) color model, Hue (H) ranges from 0 to 360 degrees, representing the color's position on the color wheel.\r\n * Saturation (S) ranges from 0 to 100%, indicating the intensity or purity of the color, with 0 being shades of gray and 100 being a fully saturated color.\r\n * Value (V) ranges from 0 to 100%, representing the brightness of the color, with 0 being black and 100 being the brightest.\r\n * @param props - The properties for the InputHsvField component.\r\n */\r\nexport const InputHsvField: FunctionComponent<InputHsvFieldProps> = (props) => {\r\n    const { value, title, hsvKey, max, onChange, scale = 1 } = props;\r\n\r\n    const classes = useColorPickerStyles();\r\n\r\n    const handleChange = useCallback(\r\n        (val: number) => {\r\n            // Convert current color to HSV, update the new hsv value, then call onChange prop\r\n            const hsv = rgbaToHsv(value);\r\n            hsv[hsvKey] = val / scale;\r\n            let newColor: Color3 | Color4 = Color3.FromHSV(hsv.h, hsv.s, hsv.v);\r\n            if (value instanceof Color4) {\r\n                newColor = Color4.FromColor3(newColor, value.a ?? 1);\r\n            }\r\n            props.onChange(newColor);\r\n        },\r\n        [value, onChange, hsvKey, scale]\r\n    );\r\n\r\n    return (\r\n        <SpinButton\r\n            infoLabel={title ? { label: title } : undefined}\r\n            className={classes.inputField}\r\n            min={0}\r\n            max={max}\r\n            value={Math.round(rgbaToHsv(value)[hsvKey] * scale)}\r\n            forceInt\r\n            onChange={handleChange}\r\n        />\r\n    );\r\n};\r\n\r\ntype InputAlphaProps = {\r\n    color: Color3 | Color4;\r\n    onChange: (color: Color4) => void;\r\n};\r\n\r\n/**\r\n * Displays the alpha value of a color, either in the disabled state (if color is Color3) or as a spin button (if color is Color4).\r\n * @param props\r\n * @returns\r\n */\r\nconst InputAlphaField: FunctionComponent<InputAlphaProps> = (props) => {\r\n    const classes = useColorPickerStyles();\r\n    const { color, onChange } = props;\r\n\r\n    const handleChange = useCallback(\r\n        (value: number) => {\r\n            if (Number.isNaN(value) || value < 0 || value > 1) {\r\n                return;\r\n            }\r\n\r\n            if (color instanceof Color4) {\r\n                const newColor = color.clone();\r\n                newColor.a = value;\r\n                return newColor;\r\n            } else {\r\n                return Color4.FromColor3(color, value);\r\n            }\r\n        },\r\n        [onChange]\r\n    );\r\n\r\n    return (\r\n        <SpinButton\r\n            disabled={color instanceof Color3}\r\n            min={0}\r\n            max={1}\r\n            className={classes.inputField}\r\n            value={color instanceof Color3 ? 1 : color.a}\r\n            step={0.01}\r\n            onChange={handleChange}\r\n            infoLabel={{\r\n                label: \"Alpha\",\r\n                info:\r\n                    color instanceof Color3 ? (\r\n                        <>\r\n                            Because this color picker is representing a Color3, we do not permit modifying alpha from the color picker. You can however modify the entity's alpha\r\n                            property directly, either in code via entity.alpha OR via inspector's transparency section.\r\n                        </>\r\n                    ) : undefined,\r\n            }}\r\n        />\r\n    );\r\n};\r\n"]}

package/fluent/primitives/messageBar.js

@@ -10,8 +10,8 @@ const useClasses = makeStyles({
 });
 export const MessageBar = (props) => {
     MessageBar.displayName = "MessageBar";
-    const { message, title: header, intent, docLink } = props;
+    const { message, title, intent, docLink } = props;
     const classes = useClasses();
-    return (_jsx("div", { className: classes.container, children: _jsx(FluentMessageBar, { intent: intent, layout: "multiline", children: _jsxs(MessageBarBody, { children: [header && _jsx(MessageBarTitle, { children: header }), message, docLink && (_jsxs(_Fragment, { children: [" - ", _jsx(Link, { url: docLink, value: "Learn More" })] }))] }) }) }));
+    return (_jsx("div", { className: classes.container, children: _jsx(FluentMessageBar, { intent: intent, layout: "multiline", children: _jsxs(MessageBarBody, { children: [title && _jsx(MessageBarTitle, { children: title }), message, docLink && (_jsxs(_Fragment, { children: [" - ", _jsx(Link, { url: docLink, value: "Learn More" })] }))] }) }) }));
 };
 //# sourceMappingURL=messageBar.js.map

package/fluent/primitives/messageBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"messageBar.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/messageBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,IAAI,gBAAgB,EAAE,eAAe,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAEjI,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,MAAM,UAAU,GAAG,UAAU,CAAC;IAC1B,SAAS,EAAE;QACP,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,GAAG,EAAE,MAAM,CAAC,gBAAgB,EAAE,MAAM;KACvC;CACJ,CAAC,CAAC;AAQH,MAAM,CAAC,MAAM,UAAU,GAAuC,CAAC,KAAK,EAAE,EAAE;IACpE,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;IACtC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAC1D,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAE7B,OAAO,CACH,cAAK,SAAS,EAAE,OAAO,CAAC,SAAS,YAC7B,KAAC,gBAAgB,IAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAC,WAAW,YAChD,MAAC,cAAc,eACV,MAAM,IAAI,KAAC,eAAe,cAAE,MAAM,GAAmB,EACrD,OAAO,EACP,OAAO,IAAI,CACR,8BACK,KAAK,EACN,KAAC,IAAI,IAAC,GAAG,EAAE,OAAO,EAAE,KAAK,EAAC,YAAY,GAAG,IAC1C,CACN,IACY,GACF,GACjB,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { MessageBar as FluentMessageBar, MessageBarTitle, MessageBarBody, makeStyles, tokens } from \"@fluentui/react-components\";\r\nimport type { FunctionComponent } from \"react\";\r\nimport { Link } from \"./link\";\r\n\r\nconst useClasses = makeStyles({\r\n    container: {\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        gap: tokens.spacingVerticalS, // 8px\r\n    },\r\n});\r\n\r\ntype MessageBarProps = {\r\n    message: string;\r\n    title?: string;\r\n    docLink?: string;\r\n    intent: \"info\" | \"success\" | \"warning\" | \"error\";\r\n};\r\nexport const MessageBar: FunctionComponent<MessageBarProps> = (props) => {\r\n    MessageBar.displayName = \"MessageBar\";\r\n    const { message, title: header, intent, docLink } = props;\r\n    const classes = useClasses();\r\n\r\n    return (\r\n        <div className={classes.container}>\r\n            <FluentMessageBar intent={intent} layout=\"multiline\">\r\n                <MessageBarBody>\r\n                    {header && <MessageBarTitle>{header}</MessageBarTitle>}\r\n                    {message}\r\n                    {docLink && (\r\n                        <>\r\n                            {\" - \"}\r\n                            <Link url={docLink} value=\"Learn More\" />\r\n                        </>\r\n                    )}\r\n                </MessageBarBody>\r\n            </FluentMessageBar>\r\n        </div>\r\n    );\r\n};\r\n"]}
+{"version":3,"file":"messageBar.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/messageBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,IAAI,gBAAgB,EAAE,eAAe,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAEjI,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,MAAM,UAAU,GAAG,UAAU,CAAC;IAC1B,SAAS,EAAE;QACP,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,GAAG,EAAE,MAAM,CAAC,gBAAgB,EAAE,MAAM;KACvC;CACJ,CAAC,CAAC;AAQH,MAAM,CAAC,MAAM,UAAU,GAAuC,CAAC,KAAK,EAAE,EAAE;IACpE,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;IACtC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAClD,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAE7B,OAAO,CACH,cAAK,SAAS,EAAE,OAAO,CAAC,SAAS,YAC7B,KAAC,gBAAgB,IAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAC,WAAW,YAChD,MAAC,cAAc,eACV,KAAK,IAAI,KAAC,eAAe,cAAE,KAAK,GAAmB,EACnD,OAAO,EACP,OAAO,IAAI,CACR,8BACK,KAAK,EACN,KAAC,IAAI,IAAC,GAAG,EAAE,OAAO,EAAE,KAAK,EAAC,YAAY,GAAG,IAC1C,CACN,IACY,GACF,GACjB,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { MessageBar as FluentMessageBar, MessageBarTitle, MessageBarBody, makeStyles, tokens } from \"@fluentui/react-components\";\r\nimport type { FunctionComponent } from \"react\";\r\nimport { Link } from \"./link\";\r\n\r\nconst useClasses = makeStyles({\r\n    container: {\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        gap: tokens.spacingVerticalS, // 8px\r\n    },\r\n});\r\n\r\ntype MessageBarProps = {\r\n    message: string;\r\n    title?: string;\r\n    docLink?: string;\r\n    intent: \"info\" | \"success\" | \"warning\" | \"error\";\r\n};\r\nexport const MessageBar: FunctionComponent<MessageBarProps> = (props) => {\r\n    MessageBar.displayName = \"MessageBar\";\r\n    const { message, title, intent, docLink } = props;\r\n    const classes = useClasses();\r\n\r\n    return (\r\n        <div className={classes.container}>\r\n            <FluentMessageBar intent={intent} layout=\"multiline\">\r\n                <MessageBarBody>\r\n                    {title && <MessageBarTitle>{title}</MessageBarTitle>}\r\n                    {message}\r\n                    {docLink && (\r\n                        <>\r\n                            {\" - \"}\r\n                            <Link url={docLink} value=\"Learn More\" />\r\n                        </>\r\n                    )}\r\n                </MessageBarBody>\r\n            </FluentMessageBar>\r\n        </div>\r\n    );\r\n};\r\n"]}

package/fluent/primitives/spinButton.d.ts

@@ -1,4 +1,3 @@
-import type { FunctionComponent } from "react";
 import type { PrimitiveProps } from "./primitive.js";
 export type SpinButtonProps = PrimitiveProps<number> & {
     min?: number;
@@ -12,4 +11,20 @@ export type SpinButtonProps = PrimitiveProps<number> & {
     /** Optional className for the input element */
     inputClassName?: string;
 };
-export declare const SpinButton: FunctionComponent<SpinButtonProps>;
+export declare const SpinButton: import("react").ForwardRefExoticComponent<import("./primitive.js").BasePrimitiveProps & {
+    value: number;
+    infoLabel?: import("./infoLabel.js").InfoLabelParentProps;
+} & {
+    onChange: (value: number) => void;
+} & {
+    min?: number;
+    max?: number;
+    /** Determines how much the spinbutton increments with the arrow keys. Note this also determines the precision value (# of decimals in display value)
+     * i.e. if step = 1, precision = 0. step = 0.0089, precision = 4. step = 300, precision = 2. step = 23.00, precision = 2. */
+    step?: number;
+    unit?: string;
+    forceInt?: boolean;
+    validator?: (value: number) => boolean;
+    /** Optional className for the input element */
+    inputClassName?: string;
+} & import("react").RefAttributes<HTMLInputElement>>;

package/fluent/primitives/spinButton.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { SpinButton as FluentSpinButton, mergeClasses, useId } from "@fluentui/react-components";
-import { useEffect, useState, useRef, useContext } from "react";
+import { forwardRef, useEffect, useState, useRef, useContext } from "react";
 import { InfoLabel } from "./infoLabel.js";
 import { CalculatePrecision, HandleKeyDown, HandleOnBlur, useInputStyles } from "./utils.js";
 import { ToolContext } from "../hoc/fluentToolWrapper.js";
-export const SpinButton = (props) => {
+export const SpinButton = forwardRef((props, ref) => {
     SpinButton.displayName = "SpinButton";
     const classes = useInputStyles();
     const { size } = useContext(ToolContext);
@@ -55,7 +55,7 @@ export const SpinButton = (props) => {
     const inputSlot = {
         className: mergeClasses(classes.inputSlot, props.inputClassName),
     };
-    const spinButton = (_jsx(FluentSpinButton, { ...props, appearance: "outline", input: inputSlot, step: step, id: id, size: size, precision: precision, displayValue: `${value.toFixed(precision)}${props.unit ? " " + props.unit : ""}`, value: value, onChange: handleChange, onKeyUp: handleKeyUp, onKeyDown: HandleKeyDown, onBlur: HandleOnBlur, className: mergedClassName }));
+    const spinButton = (_jsx(FluentSpinButton, { ref: ref, ...props, appearance: "outline", input: inputSlot, step: step, id: id, size: size, precision: precision, displayValue: `${value.toFixed(precision)}${props.unit ? " " + props.unit : ""}`, value: value, onChange: handleChange, onKeyUp: handleKeyUp, onKeyDown: HandleKeyDown, onBlur: HandleOnBlur, className: mergedClassName }));
     return props.infoLabel ? (_jsxs("div", { className: classes.container, children: [_jsx(InfoLabel, { ...props.infoLabel, htmlFor: id }), spinButton] })) : (spinButton);
-};
+});
 //# sourceMappingURL=spinButton.js.map

package/fluent/primitives/spinButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"spinButton.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/spinButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { SpinButton as FluentSpinButton, mergeClasses, useId } from \"@fluentui/react-components\";\r\nimport type { SpinButtonOnChangeData, SpinButtonChangeEvent } from \"@fluentui/react-components\";\r\nimport type { FunctionComponent, KeyboardEvent } from \"react\";\r\nimport { useEffect, useState, useRef, useContext } from \"react\";\r\nimport type { PrimitiveProps } from \"./primitive\";\r\nimport { InfoLabel } from \"./infoLabel\";\r\nimport { CalculatePrecision, HandleKeyDown, HandleOnBlur, useInputStyles } from \"./utils\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\n\r\nexport type SpinButtonProps = PrimitiveProps<number> & {\r\n    min?: number;\r\n    max?: number;\r\n    /** Determines how much the spinbutton increments with the arrow keys. Note this also determines the precision value (# of decimals in display value)\r\n     * i.e. if step = 1, precision = 0. step = 0.0089, precision = 4. step = 300, precision = 2. step = 23.00, precision = 2. */\r\n    step?: number;\r\n    unit?: string;\r\n    forceInt?: boolean;\r\n    validator?: (value: number) => boolean;\r\n    /** Optional className for the input element */\r\n    inputClassName?: string;\r\n};\r\n\r\nexport const SpinButton: FunctionComponent<SpinButtonProps> = (props) => {\r\n    SpinButton.displayName = \"SpinButton\";\r\n    const classes = useInputStyles();\r\n    const { size } = useContext(ToolContext);\r\n\r\n    const { min, max } = props;\r\n\r\n    const [value, setValue] = useState(props.value);\r\n    const lastCommittedValue = useRef(props.value);\r\n    // step and forceInt are not mutually exclusive since there could be cases where you want to forceInt but have spinButton jump >1 int per spin\r\n    const step = props.step != undefined ? props.step : props.forceInt ? 1 : undefined;\r\n    const precision = Math.min(4, step !== undefined ? Math.max(0, CalculatePrecision(step)) : 2); // If no step, set precision to 2. Regardless, cap precision at 4 to avoid wild numbers\r\n\r\n    useEffect(() => {\r\n        if (props.value !== lastCommittedValue.current) {\r\n            lastCommittedValue.current = props.value;\r\n            setValue(props.value); // Update local state when props.value changes\r\n        }\r\n    }, [props.value]);\r\n\r\n    const validateValue = (numericValue: number): boolean => {\r\n        const outOfBounds = (min !== undefined && numericValue < min) || (max !== undefined && numericValue > max);\r\n        const failsValidator = props.validator && !props.validator(numericValue);\r\n        const failsIntCheck = props.forceInt ? !Number.isInteger(numericValue) : false;\r\n        const invalid = !!outOfBounds || !!failsValidator || isNaN(numericValue) || !!failsIntCheck;\r\n        return !invalid;\r\n    };\r\n\r\n    const tryCommitValue = (currVal: number) => {\r\n        // Only commit if valid and different from last committed value\r\n        if (validateValue(currVal) && currVal !== lastCommittedValue.current) {\r\n            lastCommittedValue.current = currVal;\r\n            props.onChange(currVal);\r\n        }\r\n    };\r\n\r\n    const handleChange = (event: SpinButtonChangeEvent, data: SpinButtonOnChangeData) => {\r\n        event.stopPropagation(); // Prevent event propagation\r\n        if (data.value != null && !Number.isNaN(data.value)) {\r\n            setValue(data.value);\r\n            tryCommitValue(data.value);\r\n        }\r\n    };\r\n\r\n    const handleKeyUp = (event: KeyboardEvent<HTMLInputElement>) => {\r\n        event.stopPropagation(); // Prevent event propagation\r\n\r\n        if (event.key !== \"Enter\") {\r\n            const currVal = parseFloat((event.target as any).value); // Cannot use currentTarget.value as it won't have the most recently typed value\r\n            setValue(currVal);\r\n            tryCommitValue(currVal);\r\n        }\r\n    };\r\n\r\n    const id = useId(\"spin-button\");\r\n    const mergedClassName = mergeClasses(classes.input, !validateValue(value) ? classes.invalid : \"\", props.className);\r\n\r\n    // Build input slot from inputClassName\r\n    const inputSlot = {\r\n        className: mergeClasses(classes.inputSlot, props.inputClassName),\r\n    };\r\n\r\n    const spinButton = (\r\n        <FluentSpinButton\r\n            {...props}\r\n            appearance=\"outline\"\r\n            input={inputSlot}\r\n            step={step}\r\n            id={id}\r\n            size={size}\r\n            precision={precision}\r\n            displayValue={`${value.toFixed(precision)}${props.unit ? \" \" + props.unit : \"\"}`}\r\n            value={value}\r\n            onChange={handleChange}\r\n            onKeyUp={handleKeyUp}\r\n            onKeyDown={HandleKeyDown}\r\n            onBlur={HandleOnBlur}\r\n            className={mergedClassName}\r\n        />\r\n    );\r\n\r\n    return props.infoLabel ? (\r\n        <div className={classes.container}>\r\n            <InfoLabel {...props.infoLabel} htmlFor={id} />\r\n            {spinButton}\r\n        </div>\r\n    ) : (\r\n        spinButton\r\n    );\r\n};\r\n"]}
+{"version":3,"file":"spinButton.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/spinButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { SpinButton as FluentSpinButton, mergeClasses, useId } from \"@fluentui/react-components\";\r\nimport type { SpinButtonOnChangeData, SpinButtonChangeEvent } from \"@fluentui/react-components\";\r\nimport type { KeyboardEvent } from \"react\";\r\nimport { forwardRef, useEffect, useState, useRef, useContext } from \"react\";\r\nimport type { PrimitiveProps } from \"./primitive\";\r\nimport { InfoLabel } from \"./infoLabel\";\r\nimport { CalculatePrecision, HandleKeyDown, HandleOnBlur, useInputStyles } from \"./utils\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\n\r\nexport type SpinButtonProps = PrimitiveProps<number> & {\r\n    min?: number;\r\n    max?: number;\r\n    /** Determines how much the spinbutton increments with the arrow keys. Note this also determines the precision value (# of decimals in display value)\r\n     * i.e. if step = 1, precision = 0. step = 0.0089, precision = 4. step = 300, precision = 2. step = 23.00, precision = 2. */\r\n    step?: number;\r\n    unit?: string;\r\n    forceInt?: boolean;\r\n    validator?: (value: number) => boolean;\r\n    /** Optional className for the input element */\r\n    inputClassName?: string;\r\n};\r\n\r\nexport const SpinButton = forwardRef<HTMLInputElement, SpinButtonProps>((props, ref) => {\r\n    SpinButton.displayName = \"SpinButton\";\r\n    const classes = useInputStyles();\r\n    const { size } = useContext(ToolContext);\r\n\r\n    const { min, max } = props;\r\n\r\n    const [value, setValue] = useState(props.value);\r\n    const lastCommittedValue = useRef(props.value);\r\n    // step and forceInt are not mutually exclusive since there could be cases where you want to forceInt but have spinButton jump >1 int per spin\r\n    const step = props.step != undefined ? props.step : props.forceInt ? 1 : undefined;\r\n    const precision = Math.min(4, step !== undefined ? Math.max(0, CalculatePrecision(step)) : 2); // If no step, set precision to 2. Regardless, cap precision at 4 to avoid wild numbers\r\n\r\n    useEffect(() => {\r\n        if (props.value !== lastCommittedValue.current) {\r\n            lastCommittedValue.current = props.value;\r\n            setValue(props.value); // Update local state when props.value changes\r\n        }\r\n    }, [props.value]);\r\n\r\n    const validateValue = (numericValue: number): boolean => {\r\n        const outOfBounds = (min !== undefined && numericValue < min) || (max !== undefined && numericValue > max);\r\n        const failsValidator = props.validator && !props.validator(numericValue);\r\n        const failsIntCheck = props.forceInt ? !Number.isInteger(numericValue) : false;\r\n        const invalid = !!outOfBounds || !!failsValidator || isNaN(numericValue) || !!failsIntCheck;\r\n        return !invalid;\r\n    };\r\n\r\n    const tryCommitValue = (currVal: number) => {\r\n        // Only commit if valid and different from last committed value\r\n        if (validateValue(currVal) && currVal !== lastCommittedValue.current) {\r\n            lastCommittedValue.current = currVal;\r\n            props.onChange(currVal);\r\n        }\r\n    };\r\n\r\n    const handleChange = (event: SpinButtonChangeEvent, data: SpinButtonOnChangeData) => {\r\n        event.stopPropagation(); // Prevent event propagation\r\n        if (data.value != null && !Number.isNaN(data.value)) {\r\n            setValue(data.value);\r\n            tryCommitValue(data.value);\r\n        }\r\n    };\r\n\r\n    const handleKeyUp = (event: KeyboardEvent<HTMLInputElement>) => {\r\n        event.stopPropagation(); // Prevent event propagation\r\n\r\n        if (event.key !== \"Enter\") {\r\n            const currVal = parseFloat((event.target as any).value); // Cannot use currentTarget.value as it won't have the most recently typed value\r\n            setValue(currVal);\r\n            tryCommitValue(currVal);\r\n        }\r\n    };\r\n\r\n    const id = useId(\"spin-button\");\r\n    const mergedClassName = mergeClasses(classes.input, !validateValue(value) ? classes.invalid : \"\", props.className);\r\n\r\n    // Build input slot from inputClassName\r\n    const inputSlot = {\r\n        className: mergeClasses(classes.inputSlot, props.inputClassName),\r\n    };\r\n\r\n    const spinButton = (\r\n        <FluentSpinButton\r\n            ref={ref}\r\n            {...props}\r\n            appearance=\"outline\"\r\n            input={inputSlot}\r\n            step={step}\r\n            id={id}\r\n            size={size}\r\n            precision={precision}\r\n            displayValue={`${value.toFixed(precision)}${props.unit ? \" \" + props.unit : \"\"}`}\r\n            value={value}\r\n            onChange={handleChange}\r\n            onKeyUp={handleKeyUp}\r\n            onKeyDown={HandleKeyDown}\r\n            onBlur={HandleOnBlur}\r\n            className={mergedClassName}\r\n        />\r\n    );\r\n\r\n    return props.infoLabel ? (\r\n        <div className={classes.container}>\r\n            <InfoLabel {...props.infoLabel} htmlFor={id} />\r\n            {spinButton}\r\n        </div>\r\n    ) : (\r\n        spinButton\r\n    );\r\n});\r\n"]}

package/fluent/primitives/toggleButton.js

@@ -2,6 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { ToggleButton as FluentToggleButton, makeStyles } from "@fluentui/react-components";
 import { useCallback, useContext, useEffect, useState } from "react";
 import { ToolContext } from "../hoc/fluentToolWrapper.js";
+import { Tooltip } from "./tooltip.js";
 const useStyles = makeStyles({
     button: {
         display: "flex",
@@ -32,6 +33,6 @@ export const ToggleButton = (props) => {
     useEffect(() => {
         setChecked(props.value);
     }, [props.value]);
-    return (_jsx(FluentToggleButton, { className: classes.button, title: title, size: size, icon: checked ? _jsx(props.checkedIcon, {}) : props.uncheckedIcon ? _jsx(props.uncheckedIcon, {}) : _jsx(props.checkedIcon, {}), appearance: appearance, checked: checked, onClick: toggle }));
+    return (_jsx(Tooltip, { content: title ?? "", children: _jsx(FluentToggleButton, { className: classes.button, size: size, icon: checked ? _jsx(props.checkedIcon, {}) : props.uncheckedIcon ? _jsx(props.uncheckedIcon, {}) : _jsx(props.checkedIcon, {}), appearance: appearance, checked: checked, onClick: toggle }) }));
 };
 //# sourceMappingURL=toggleButton.js.map

package/fluent/primitives/toggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggleButton.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/toggleButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,IAAI,kBAAkB,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAE5F,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGrE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,MAAM,EAAE;QACJ,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;KAC3B;CACJ,CAAC,CAAC;AASH;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,YAAY,GAAyC,CAAC,KAAK,EAAE,EAAE;IACxE,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;IAC1C,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAC;IAChE,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAC5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,UAAU,CAAC,CAAC,IAAI,EAAE,EAAE;YAChB,MAAM,OAAO,GAAG,CAAC,IAAI,CAAC;YACtB,QAAQ,CAAC,OAAO,CAAC,CAAC;YAClB,OAAO,OAAO,CAAC;QACnB,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,SAAS,CAAC,GAAG,EAAE;QACX,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElB,OAAO,CACH,KAAC,kBAAkB,IACf,SAAS,EAAE,OAAO,CAAC,MAAM,EACzB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,KAAC,KAAK,CAAC,WAAW,KAAG,CAAC,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAC,KAAK,CAAC,aAAa,KAAG,CAAC,CAAC,CAAC,KAAC,KAAK,CAAC,WAAW,KAAG,EAC7G,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,MAAM,GACjB,CACL,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { ToggleButton as FluentToggleButton, makeStyles } from \"@fluentui/react-components\";\r\nimport type { ButtonProps } from \"./button\";\r\nimport { useCallback, useContext, useEffect, useState } from \"react\";\r\nimport type { FunctionComponent } from \"react\";\r\nimport type { FluentIcon } from \"@fluentui/react-icons\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\n\r\nconst useStyles = makeStyles({\r\n    button: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        justifyContent: \"center\",\r\n    },\r\n});\r\n\r\ntype ToggleButtonProps = Omit<ButtonProps, \"icon\" | \"onClick\"> & {\r\n    value: boolean;\r\n    checkedIcon: FluentIcon;\r\n    uncheckedIcon?: FluentIcon;\r\n    onChange: (checked: boolean) => void;\r\n};\r\n\r\n/**\r\n * Toggles between two states using a button with icons.\r\n * If no disabledIcon is provided, the button will toggle between visual enabled/disabled states without an icon change\r\n *\r\n * @param props\r\n * @returns\r\n */\r\nexport const ToggleButton: FunctionComponent<ToggleButtonProps> = (props) => {\r\n    ToggleButton.displayName = \"ToggleButton\";\r\n    const { value, onChange, title, appearance = \"subtle\" } = props;\r\n    const { size } = useContext(ToolContext);\r\n    const classes = useStyles();\r\n    const [checked, setChecked] = useState(value);\r\n    const toggle = useCallback(() => {\r\n        setChecked((prev) => {\r\n            const enabled = !prev;\r\n            onChange(enabled);\r\n            return enabled;\r\n        });\r\n    }, [setChecked]);\r\n\r\n    useEffect(() => {\r\n        setChecked(props.value);\r\n    }, [props.value]);\r\n\r\n    return (\r\n        <FluentToggleButton\r\n            className={classes.button}\r\n            title={title}\r\n            size={size}\r\n            icon={checked ? <props.checkedIcon /> : props.uncheckedIcon ? <props.uncheckedIcon /> : <props.checkedIcon />}\r\n            appearance={appearance}\r\n            checked={checked}\r\n            onClick={toggle}\r\n        />\r\n    );\r\n};\r\n"]}
+{"version":3,"file":"toggleButton.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/toggleButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,IAAI,kBAAkB,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAE5F,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGrE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,MAAM,EAAE;QACJ,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;KAC3B;CACJ,CAAC,CAAC;AASH;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,YAAY,GAAyC,CAAC,KAAK,EAAE,EAAE;IACxE,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;IAC1C,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAC;IAChE,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACzC,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAC5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,UAAU,CAAC,CAAC,IAAI,EAAE,EAAE;YAChB,MAAM,OAAO,GAAG,CAAC,IAAI,CAAC;YACtB,QAAQ,CAAC,OAAO,CAAC,CAAC;YAClB,OAAO,OAAO,CAAC;QACnB,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,SAAS,CAAC,GAAG,EAAE;QACX,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElB,OAAO,CACH,KAAC,OAAO,IAAC,OAAO,EAAE,KAAK,IAAI,EAAE,YACzB,KAAC,kBAAkB,IACf,SAAS,EAAE,OAAO,CAAC,MAAM,EACzB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,KAAC,KAAK,CAAC,WAAW,KAAG,CAAC,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAC,KAAK,CAAC,aAAa,KAAG,CAAC,CAAC,CAAC,KAAC,KAAK,CAAC,WAAW,KAAG,EAC7G,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,MAAM,GACjB,GACI,CACb,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { ToggleButton as FluentToggleButton, makeStyles } from \"@fluentui/react-components\";\r\nimport type { ButtonProps } from \"./button\";\r\nimport { useCallback, useContext, useEffect, useState } from \"react\";\r\nimport type { FunctionComponent } from \"react\";\r\nimport type { FluentIcon } from \"@fluentui/react-icons\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\nimport { Tooltip } from \"./tooltip\";\r\n\r\nconst useStyles = makeStyles({\r\n    button: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        justifyContent: \"center\",\r\n    },\r\n});\r\n\r\ntype ToggleButtonProps = Omit<ButtonProps, \"icon\" | \"onClick\"> & {\r\n    value: boolean;\r\n    checkedIcon: FluentIcon;\r\n    uncheckedIcon?: FluentIcon;\r\n    onChange: (checked: boolean) => void;\r\n};\r\n\r\n/**\r\n * Toggles between two states using a button with icons.\r\n * If no disabledIcon is provided, the button will toggle between visual enabled/disabled states without an icon change\r\n *\r\n * @param props\r\n * @returns\r\n */\r\nexport const ToggleButton: FunctionComponent<ToggleButtonProps> = (props) => {\r\n    ToggleButton.displayName = \"ToggleButton\";\r\n    const { value, onChange, title, appearance = \"subtle\" } = props;\r\n    const { size } = useContext(ToolContext);\r\n    const classes = useStyles();\r\n    const [checked, setChecked] = useState(value);\r\n    const toggle = useCallback(() => {\r\n        setChecked((prev) => {\r\n            const enabled = !prev;\r\n            onChange(enabled);\r\n            return enabled;\r\n        });\r\n    }, [setChecked]);\r\n\r\n    useEffect(() => {\r\n        setChecked(props.value);\r\n    }, [props.value]);\r\n\r\n    return (\r\n        <Tooltip content={title ?? \"\"}>\r\n            <FluentToggleButton\r\n                className={classes.button}\r\n                size={size}\r\n                icon={checked ? <props.checkedIcon /> : props.uncheckedIcon ? <props.uncheckedIcon /> : <props.checkedIcon />}\r\n                appearance={appearance}\r\n                checked={checked}\r\n                onClick={toggle}\r\n            />\r\n        </Tooltip>\r\n    );\r\n};\r\n"]}

package/fluent/primitives/tooltip.d.ts

@@ -0,0 +1,7 @@
+import type { Nullable } from "@onerjs/core/index.js";
+import type { FunctionComponent, ReactElement } from "react";
+export type TooltipProps = {
+    content?: Nullable<string>;
+    children: ReactElement;
+};
+export declare const Tooltip: FunctionComponent<TooltipProps>;

package/fluent/primitives/tooltip.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Tooltip as FluentTooltip } from "@fluentui/react-components";
+export const Tooltip = (props) => {
+    const { content, children } = props;
+    if (!content) {
+        return children;
+    }
+    return (_jsx(FluentTooltip, { relationship: "description", content: content, children: children }));
+};
+//# sourceMappingURL=tooltip.js.map

package/fluent/primitives/tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/tooltip.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAItE,MAAM,CAAC,MAAM,OAAO,GAAoC,CAAC,KAAK,EAAE,EAAE;IAC9D,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAEpC,IAAI,CAAC,OAAO,EAAE,CAAC;QACX,OAAO,QAAQ,CAAC;IACpB,CAAC;IAED,OAAO,CACH,KAAC,aAAa,IAAC,YAAY,EAAC,aAAa,EAAC,OAAO,EAAE,OAAO,YACrD,QAAQ,GACG,CACnB,CAAC;AACN,CAAC,CAAC","sourcesContent":["import type { Nullable } from \"core/index\";\r\n\r\nimport type { FunctionComponent, ReactElement } from \"react\";\r\n\r\nimport { Tooltip as FluentTooltip } from \"@fluentui/react-components\";\r\n\r\nexport type TooltipProps = { content?: Nullable<string>; children: ReactElement };\r\n\r\nexport const Tooltip: FunctionComponent<TooltipProps> = (props) => {\r\n    const { content, children } = props;\r\n\r\n    if (!content) {\r\n        return children;\r\n    }\r\n\r\n    return (\r\n        <FluentTooltip relationship=\"description\" content={content}>\r\n            {children}\r\n        </FluentTooltip>\r\n    );\r\n};\r\n"]}

package/nodeGraphSystem/automaticProperties.d.ts

@@ -6,5 +6,6 @@ import type { StateManager } from "./stateManager.js";
  * @param stateManager defines the state manager to use
  * @param propertyName name of the property that has been changed
  * @param notifiers list of notifiers to use
+ * @param engageActiveRefresh if active refresh should be engaged
  */
-export declare function ForceRebuild(source: any, stateManager: StateManager, propertyName: string, notifiers?: IEditablePropertyOption["notifiers"]): void;
+export declare function ForceRebuild(source: any, stateManager: StateManager, propertyName: string, notifiers?: IEditablePropertyOption["notifiers"], engageActiveRefresh?: boolean): void;

package/nodeGraphSystem/automaticProperties.js

@@ -4,8 +4,9 @@
  * @param stateManager defines the state manager to use
  * @param propertyName name of the property that has been changed
  * @param notifiers list of notifiers to use
+ * @param engageActiveRefresh if active refresh should be engaged
  */
-export function ForceRebuild(source, stateManager, propertyName, notifiers) {
+export function ForceRebuild(source, stateManager, propertyName, notifiers, engageActiveRefresh = true) {
     if (notifiers?.onValidation && !notifiers?.onValidation(source, propertyName)) {
         return;
     }
@@ -24,5 +25,10 @@ export function ForceRebuild(source, stateManager, propertyName, notifiers) {
     if (notifiers?.activatePreviewCommand) {
         stateManager.onPreviewCommandActivated.notifyObservers(true);
     }
+    if (engageActiveRefresh && stateManager.activeNode) {
+        for (const refresh of stateManager.activeNode._visualPropertiesRefresh) {
+            refresh();
+        }
+    }
 }
 //# sourceMappingURL=automaticProperties.js.map

package/nodeGraphSystem/automaticProperties.js.map

@@ -1 +1 @@
-{"version":3,"file":"automaticProperties.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/automaticProperties.ts"],"names":[],"mappings":"AAGA;;;;;;GAMG;AACH,MAAM,UAAU,YAAY,CAAC,MAAW,EAAE,YAA0B,EAAE,YAAoB,EAAE,SAAgD;IACxI,IAAI,SAAS,EAAE,YAAY,IAAI,CAAC,SAAS,EAAE,YAAY,CAAC,MAAM,EAAE,YAAY,CAAC,EAAE,CAAC;QAC5E,OAAO;IACX,CAAC;IAED,IAAI,YAAY,CAAC,QAAQ,EAAE,CAAC;QACxB,MAAM,OAAO,GAAG,SAAS,EAAE,QAAQ,EAAE,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,MAAM,CAAC,IAAI,KAAK,CAAC;QAEhF,IAAI,OAAO,EAAE,CAAC;YACV,YAAY,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;QAC/D,CAAC;IACL,CAAC;IAED,IAAI,CAAC,SAAS,IAAI,SAAS,CAAC,MAAM,EAAE,CAAC;QACjC,YAAY,CAAC,0BAA0B,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;IACpE,CAAC;IAED,IAAI,CAAC,SAAS,IAAI,SAAS,CAAC,OAAO,EAAE,CAAC;QAClC,YAAY,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;IAC/D,CAAC;IAED,IAAI,SAAS,EAAE,sBAAsB,EAAE,CAAC;QACpC,YAAY,CAAC,yBAAyB,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IACjE,CAAC;AACL,CAAC","sourcesContent":["import type { IEditablePropertyOption } from \"core/Decorators/nodeDecorator\";\r\nimport type { StateManager } from \"./stateManager\";\r\n\r\n/**\r\n * Function used to force a rebuild of the node system\r\n * @param source source object\r\n * @param stateManager defines the state manager to use\r\n * @param propertyName name of the property that has been changed\r\n * @param notifiers list of notifiers to use\r\n */\r\nexport function ForceRebuild(source: any, stateManager: StateManager, propertyName: string, notifiers?: IEditablePropertyOption[\"notifiers\"]) {\r\n    if (notifiers?.onValidation && !notifiers?.onValidation(source, propertyName)) {\r\n        return;\r\n    }\r\n\r\n    if (stateManager.getScene) {\r\n        const rebuild = notifiers?.callback?.(stateManager.getScene(), source) ?? false;\r\n\r\n        if (rebuild) {\r\n            stateManager.onRebuildRequiredObservable.notifyObservers();\r\n        }\r\n    }\r\n\r\n    if (!notifiers || notifiers.update) {\r\n        stateManager.onUpdateRequiredObservable.notifyObservers(source);\r\n    }\r\n\r\n    if (!notifiers || notifiers.rebuild) {\r\n        stateManager.onRebuildRequiredObservable.notifyObservers();\r\n    }\r\n\r\n    if (notifiers?.activatePreviewCommand) {\r\n        stateManager.onPreviewCommandActivated.notifyObservers(true);\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"automaticProperties.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/automaticProperties.ts"],"names":[],"mappings":"AAGA;;;;;;;GAOG;AACH,MAAM,UAAU,YAAY,CAAC,MAAW,EAAE,YAA0B,EAAE,YAAoB,EAAE,SAAgD,EAAE,mBAAmB,GAAG,IAAI;IACpK,IAAI,SAAS,EAAE,YAAY,IAAI,CAAC,SAAS,EAAE,YAAY,CAAC,MAAM,EAAE,YAAY,CAAC,EAAE,CAAC;QAC5E,OAAO;IACX,CAAC;IAED,IAAI,YAAY,CAAC,QAAQ,EAAE,CAAC;QACxB,MAAM,OAAO,GAAG,SAAS,EAAE,QAAQ,EAAE,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,MAAM,CAAC,IAAI,KAAK,CAAC;QAEhF,IAAI,OAAO,EAAE,CAAC;YACV,YAAY,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;QAC/D,CAAC;IACL,CAAC;IAED,IAAI,CAAC,SAAS,IAAI,SAAS,CAAC,MAAM,EAAE,CAAC;QACjC,YAAY,CAAC,0BAA0B,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;IACpE,CAAC;IAED,IAAI,CAAC,SAAS,IAAI,SAAS,CAAC,OAAO,EAAE,CAAC;QAClC,YAAY,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;IAC/D,CAAC;IAED,IAAI,SAAS,EAAE,sBAAsB,EAAE,CAAC;QACpC,YAAY,CAAC,yBAAyB,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IACjE,CAAC;IAED,IAAI,mBAAmB,IAAI,YAAY,CAAC,UAAU,EAAE,CAAC;QACjD,KAAK,MAAM,OAAO,IAAI,YAAY,CAAC,UAAU,CAAC,wBAAwB,EAAE,CAAC;YACrE,OAAO,EAAE,CAAC;QACd,CAAC;IACL,CAAC;AACL,CAAC","sourcesContent":["import type { IEditablePropertyOption } from \"core/Decorators/nodeDecorator\";\r\nimport type { StateManager } from \"./stateManager\";\r\n\r\n/**\r\n * Function used to force a rebuild of the node system\r\n * @param source source object\r\n * @param stateManager defines the state manager to use\r\n * @param propertyName name of the property that has been changed\r\n * @param notifiers list of notifiers to use\r\n * @param engageActiveRefresh if active refresh should be engaged\r\n */\r\nexport function ForceRebuild(source: any, stateManager: StateManager, propertyName: string, notifiers?: IEditablePropertyOption[\"notifiers\"], engageActiveRefresh = true) {\r\n    if (notifiers?.onValidation && !notifiers?.onValidation(source, propertyName)) {\r\n        return;\r\n    }\r\n\r\n    if (stateManager.getScene) {\r\n        const rebuild = notifiers?.callback?.(stateManager.getScene(), source) ?? false;\r\n\r\n        if (rebuild) {\r\n            stateManager.onRebuildRequiredObservable.notifyObservers();\r\n        }\r\n    }\r\n\r\n    if (!notifiers || notifiers.update) {\r\n        stateManager.onUpdateRequiredObservable.notifyObservers(source);\r\n    }\r\n\r\n    if (!notifiers || notifiers.rebuild) {\r\n        stateManager.onRebuildRequiredObservable.notifyObservers();\r\n    }\r\n\r\n    if (notifiers?.activatePreviewCommand) {\r\n        stateManager.onPreviewCommandActivated.notifyObservers(true);\r\n    }\r\n\r\n    if (engageActiveRefresh && stateManager.activeNode) {\r\n        for (const refresh of stateManager.activeNode._visualPropertiesRefresh) {\r\n            refresh();\r\n        }\r\n    }\r\n}\r\n"]}

package/nodeGraphSystem/graphNode.d.ts

@@ -44,8 +44,8 @@ export declare class GraphNode {
     private _displayManager;
     private _isVisible;
     private _enclosingFrameId;
-    private _visualPropertiesRefresh;
     private _lastClick;
+    _visualPropertiesRefresh: Array<() => void>;
     addClassToVisual(className: string): void;
     removeClassFromVisual(className: string): void;
     get isCollapsed(): boolean;

package/nodeGraphSystem/graphNode.js

@@ -129,8 +129,8 @@ export class GraphNode {
         this._displayManager = null;
         this._isVisible = true;
         this._enclosingFrameId = -1;
-        this._visualPropertiesRefresh = [];
         this._lastClick = 0.0;
+        this._visualPropertiesRefresh = [];
         this._isCollapsed = false;
         this._portUICount = 0;
         this._stateManager = stateManager;
@@ -145,8 +145,12 @@ export class GraphNode {
                 if (this._displayManager && this._displayManager.onSelectionChanged) {
                     this._displayManager.onSelectionChanged(this.content, node.content, this._stateManager);
                 }
+                this._stateManager.activeNode = this;
             }
             else {
+                if (this._stateManager.activeNode === this) {
+                    this._stateManager.activeNode = null;
+                }
                 if (this._ownerCanvas.selectedNodes.indexOf(this) === -1) {
                     if (this.content.canBeActivated && this.content.isActive) {
                         this.content.setIsActive?.(false);
@@ -518,7 +522,7 @@ export class GraphNode {
         for (const refresh of this._visualPropertiesRefresh) {
             refresh();
         }
-        ForceRebuild(source, this._stateManager, propertyName, notifiers);
+        ForceRebuild(source, this._stateManager, propertyName, notifiers, false);
     }
     /**
      * Collapse the node
@@ -746,6 +750,9 @@ export class GraphNode {
         };
     }
     dispose() {
+        if (this._stateManager.activeNode === this) {
+            this._stateManager.activeNode = null;
+        }
         if (this._displayManager && this._displayManager.onDispose) {
             this._displayManager.onDispose(this.content, this._stateManager);
         }

package/nodeGraphSystem/graphNode.js.map

@@ -1 +1 @@
-{"version":3,"file":"graphNode.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/graphNode.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Nullable } from \"core/types\";\r\nimport type { Observer } from \"core/Misc/observable\";\r\nimport type { GraphCanvasComponent } from \"./graphCanvas\";\r\nimport * as React from \"react\";\r\nimport { NodePort } from \"./nodePort\";\r\nimport type { GraphFrame } from \"./graphFrame\";\r\nimport type { NodeLink } from \"./nodeLink\";\r\nimport type { StateManager } from \"./stateManager\";\r\nimport type { ISelectionChangedOptions } from \"./interfaces/selectionChangedOptions\";\r\nimport type { IDisplayManager } from \"./interfaces/displayManager\";\r\nimport { PropertyLedger } from \"./propertyLedger\";\r\nimport { DisplayLedger } from \"./displayLedger\";\r\nimport type { INodeData } from \"./interfaces/nodeData\";\r\nimport type { IPortData } from \"./interfaces/portData\";\r\nimport * as localStyles from \"./graphNode.module.scss\";\r\nimport * as commonStyles from \"./common.module.scss\";\r\nimport type { IEditablePropertyListOption, IEditablePropertyOption, IPropertyDescriptionForEdition } from \"core/Decorators/nodeDecorator\";\r\nimport { PropertyTypeForEdition } from \"core/Decorators/nodeDecorator\";\r\nimport { ForceRebuild } from \"./automaticProperties\";\r\nimport dropdownArrowIcon from \"../imgs/dropdownArrowIcon_white.svg\";\r\nimport { BuildFloatUI } from \"./tools\";\r\n\r\nexport class GraphNode {\r\n    private static _IdGenerator = 0;\r\n    private _visual: HTMLDivElement;\r\n    private _headerContainer: HTMLDivElement;\r\n    private _headerIcon: HTMLDivElement;\r\n    private _headerIconImg: HTMLImageElement;\r\n    private _headerCollapseImg: HTMLImageElement;\r\n    private _header: HTMLDivElement;\r\n    private _headerCollapse: HTMLDivElement;\r\n    private _connections: HTMLDivElement;\r\n    private _optionsContainer: HTMLDivElement;\r\n    private _inputsContainer: HTMLDivElement;\r\n    private _outputsContainer: HTMLDivElement;\r\n    private _content: HTMLDivElement;\r\n    private _comments: HTMLDivElement;\r\n    private _executionTime: HTMLDivElement;\r\n    private _selectionBorder: HTMLDivElement;\r\n    private _inputPorts: NodePort[] = [];\r\n    private _outputPorts: NodePort[] = [];\r\n    private _links: NodeLink[] = [];\r\n    private _x = 0;\r\n    private _y = 0;\r\n    private _gridAlignedX = 0;\r\n    private _gridAlignedY = 0;\r\n    private _mouseStartPointX: Nullable<number> = null;\r\n    private _mouseStartPointY: Nullable<number> = null;\r\n    private _stateManager: StateManager;\r\n    private _onSelectionChangedObserver: Nullable<Observer<Nullable<ISelectionChangedOptions>>>;\r\n    private _onSelectionBoxMovedObserver: Nullable<Observer<ClientRect | DOMRect>>;\r\n    private _onFrameCreatedObserver: Nullable<Observer<GraphFrame>>;\r\n    private _onUpdateRequiredObserver: Nullable<Observer<Nullable<INodeData>>>;\r\n    private _onHighlightNodeObserver: Nullable<Observer<any>>;\r\n    private _ownerCanvas: GraphCanvasComponent;\r\n    private _displayManager: Nullable<IDisplayManager> = null;\r\n    private _isVisible = true;\r\n    private _enclosingFrameId = -1;\r\n    private _visualPropertiesRefresh: Array<() => void> = [];\r\n    private _lastClick = 0.0;\r\n\r\n    public addClassToVisual(className: string) {\r\n        this._visual.classList.add(className);\r\n    }\r\n\r\n    public removeClassFromVisual(className: string) {\r\n        this._visual.classList.remove(className);\r\n    }\r\n\r\n    public get isCollapsed() {\r\n        return this._isCollapsed;\r\n    }\r\n\r\n    public get isVisible() {\r\n        return this._isVisible;\r\n    }\r\n\r\n    public set isVisible(value: boolean) {\r\n        this._isVisible = value;\r\n\r\n        if (!value) {\r\n            this._visual.classList.add(commonStyles[\"hidden\"]);\r\n        } else {\r\n            this._visual.classList.remove(commonStyles[\"hidden\"]);\r\n            this._upateNodePortNames();\r\n        }\r\n\r\n        for (const link of this._links) {\r\n            link.isVisible = value;\r\n        }\r\n\r\n        this._refreshLinks();\r\n    }\r\n\r\n    private _upateNodePortNames() {\r\n        for (const port of this._inputPorts.concat(this._outputPorts)) {\r\n            if (port.hasLabel()) {\r\n                port.portName = port.portData.name;\r\n            }\r\n        }\r\n    }\r\n\r\n    public get outputPorts() {\r\n        return this._outputPorts;\r\n    }\r\n\r\n    public get inputPorts() {\r\n        return this._inputPorts;\r\n    }\r\n\r\n    public get links() {\r\n        return this._links;\r\n    }\r\n\r\n    public get gridAlignedX() {\r\n        return this._gridAlignedX;\r\n    }\r\n\r\n    public get gridAlignedY() {\r\n        return this._gridAlignedY;\r\n    }\r\n\r\n    public get x() {\r\n        return this._x;\r\n    }\r\n\r\n    public set x(value: number) {\r\n        if (this._x === value) {\r\n            return;\r\n        }\r\n        this._x = value;\r\n\r\n        this._gridAlignedX = this._ownerCanvas.getGridPosition(value);\r\n        this._visual.style.left = `${this._gridAlignedX}px`;\r\n\r\n        this._refreshLinks();\r\n        this._refreshFrames();\r\n    }\r\n\r\n    public get y() {\r\n        return this._y;\r\n    }\r\n\r\n    public set y(value: number) {\r\n        if (this._y === value) {\r\n            return;\r\n        }\r\n\r\n        this._y = value;\r\n\r\n        this._gridAlignedY = this._ownerCanvas.getGridPosition(value);\r\n        this._visual.style.top = `${this._gridAlignedY}px`;\r\n\r\n        this._refreshLinks();\r\n        this._refreshFrames();\r\n    }\r\n\r\n    public get width() {\r\n        return this._visual.clientWidth;\r\n    }\r\n\r\n    public get height() {\r\n        return this._visual.clientHeight;\r\n    }\r\n\r\n    public get id() {\r\n        return this.content.uniqueId;\r\n    }\r\n\r\n    public get name() {\r\n        return this.content.name;\r\n    }\r\n\r\n    public get enclosingFrameId() {\r\n        return this._enclosingFrameId;\r\n    }\r\n\r\n    public set enclosingFrameId(value: number) {\r\n        this._enclosingFrameId = value;\r\n    }\r\n\r\n    public setIsSelected(value: boolean, marqueeSelection: boolean) {\r\n        if (!value) {\r\n            this._visual.classList.remove(localStyles[\"selected\"]);\r\n            const indexInSelection = this._ownerCanvas.selectedNodes.indexOf(this);\r\n\r\n            if (indexInSelection > -1) {\r\n                this._ownerCanvas.selectedNodes.splice(indexInSelection, 1);\r\n            }\r\n        } else {\r\n            this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: this, marqueeSelection });\r\n        }\r\n    }\r\n\r\n    public get rootElement() {\r\n        return this._visual;\r\n    }\r\n\r\n    public constructor(\r\n        public content: INodeData,\r\n        stateManager: StateManager\r\n    ) {\r\n        this._stateManager = stateManager;\r\n\r\n        this._onSelectionChangedObserver = this._stateManager.onSelectionChangedObservable.add((options) => {\r\n            const { selection: node } = options || {};\r\n            if (node === this) {\r\n                if (this.content.canBeActivated) {\r\n                    this.content.setIsActive?.(true);\r\n                    this._stateManager.queueRebuildCommand();\r\n                }\r\n                this._visual.classList.add(localStyles[\"selected\"]);\r\n                if (this._displayManager && this._displayManager.onSelectionChanged) {\r\n                    this._displayManager.onSelectionChanged(this.content, node.content, this._stateManager);\r\n                }\r\n            } else {\r\n                if (this._ownerCanvas.selectedNodes.indexOf(this) === -1) {\r\n                    if (this.content.canBeActivated && this.content.isActive) {\r\n                        this.content.setIsActive?.(false);\r\n                        this._stateManager.queueRebuildCommand();\r\n                    }\r\n                    this._visual.classList.remove(localStyles[\"selected\"]);\r\n                    if (this._displayManager && this._displayManager.onSelectionChanged) {\r\n                        this._displayManager.onSelectionChanged(this.content, node && (node as GraphNode).content ? (node as GraphNode).content : null, this._stateManager);\r\n                    }\r\n                }\r\n            }\r\n        });\r\n\r\n        this._onHighlightNodeObserver = this._stateManager.onHighlightNodeObservable.add((data) => {\r\n            if (data.data !== this.content.data) {\r\n                return;\r\n            }\r\n            if (data.active) {\r\n                this._visual.classList.add(localStyles[\"highlighted\"]);\r\n            } else {\r\n                this._visual.classList.remove(localStyles[\"highlighted\"]);\r\n            }\r\n        });\r\n\r\n        this._onUpdateRequiredObserver = this._stateManager.onUpdateRequiredObservable.add((data) => {\r\n            if (data !== this.content.data) {\r\n                return;\r\n            }\r\n            this.refresh();\r\n        });\r\n\r\n        this._onSelectionBoxMovedObserver = this._stateManager.onSelectionBoxMoved.add((rect1) => {\r\n            const rect2 = this._visual.getBoundingClientRect();\r\n            const overlap = !(rect1.right < rect2.left || rect1.left > rect2.right || rect1.bottom < rect2.top || rect1.top > rect2.bottom);\r\n\r\n            this.setIsSelected(overlap, true);\r\n        });\r\n\r\n        this._onFrameCreatedObserver = this._stateManager.onFrameCreatedObservable.add((frame) => {\r\n            if (this._ownerCanvas.frames.some((f) => f.nodes.indexOf(this) !== -1)) {\r\n                return;\r\n            }\r\n\r\n            if (this.isOverlappingFrame(frame)) {\r\n                frame.nodes.push(this);\r\n            }\r\n        });\r\n\r\n        content.onInputCountChanged = () => {\r\n            this._buildInputPorts(true);\r\n        };\r\n    }\r\n\r\n    public isOverlappingFrame(frame: GraphFrame) {\r\n        const rect2 = this._visual.getBoundingClientRect();\r\n        const rect1 = frame.element.getBoundingClientRect();\r\n\r\n        // Add a tiny margin\r\n        rect1.width -= 5;\r\n        rect1.height -= 5;\r\n\r\n        const isOverlappingFrame = !(rect1.right < rect2.left || rect1.left > rect2.right || rect1.bottom < rect2.top || rect1.top > rect2.bottom);\r\n\r\n        if (isOverlappingFrame) {\r\n            this.enclosingFrameId = frame.id;\r\n        }\r\n        return isOverlappingFrame;\r\n    }\r\n\r\n    public getPortForPortData(portData: IPortData) {\r\n        for (const port of this._inputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint === portData || (attachedPoint.ownerData === portData.ownerData && attachedPoint.internalName === portData.internalName)) {\r\n                return port;\r\n            }\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint === portData || (attachedPoint.ownerData === portData.ownerData && attachedPoint.internalName === portData.internalName)) {\r\n                return port;\r\n            }\r\n        }\r\n\r\n        return null;\r\n    }\r\n\r\n    public getPortDataForPortDataContent(data: any) {\r\n        for (const port of this._inputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint.data === data) {\r\n                return attachedPoint;\r\n            }\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint.data === data) {\r\n                return attachedPoint;\r\n            }\r\n        }\r\n\r\n        return null;\r\n    }\r\n\r\n    public getLinksForPortDataContent(data: any) {\r\n        return this._links.filter((link) => link.portA.portData.data === data || link.portB!.portData.data === data);\r\n    }\r\n\r\n    public getLinksForPortData(portData: IPortData) {\r\n        return this._links.filter((link) => link.portA.portData === portData || link.portB!.portData === portData);\r\n    }\r\n\r\n    private _refreshFrames() {\r\n        if (this._ownerCanvas._frameIsMoving || this._ownerCanvas._isLoading) {\r\n            return;\r\n        }\r\n\r\n        // Frames\r\n        for (const frame of this._ownerCanvas.frames) {\r\n            frame.syncNode(this);\r\n        }\r\n    }\r\n\r\n    public _refreshLinks() {\r\n        if (this._ownerCanvas._isLoading) {\r\n            return;\r\n        }\r\n        for (const link of this._links) {\r\n            link.update();\r\n        }\r\n    }\r\n\r\n    public refresh() {\r\n        if (this._displayManager) {\r\n            this._header.innerHTML = this._displayManager.getHeaderText(this.content);\r\n            this._displayManager.updatePreviewContent(this.content, this._content);\r\n            const backgroundColor = this._displayManager.getBackgroundColor(this.content);\r\n            if (backgroundColor) {\r\n                this._visual.style.background = backgroundColor;\r\n            }\r\n            const additionalClass = this._displayManager.getHeaderClass(this.content);\r\n            this._header.classList.value = localStyles.header;\r\n            this._headerContainer.classList.value = localStyles[\"header-container\"];\r\n            if (additionalClass) {\r\n                this._headerContainer.classList.add(additionalClass);\r\n            }\r\n            if (this._displayManager.updateFullVisualContent) {\r\n                this._displayManager.updateFullVisualContent(this.content, {\r\n                    visual: this._visual,\r\n                    header: this._header,\r\n                    headerContainer: this._headerContainer,\r\n                    headerIcon: this._headerIcon,\r\n                    headerIconImg: this._headerIconImg,\r\n                    comments: this._comments,\r\n                    connections: this._connections,\r\n                    inputsContainer: this._inputsContainer,\r\n                    outputsContainer: this._outputsContainer,\r\n                    content: this._content,\r\n                    selectionBorder: this._selectionBorder,\r\n                });\r\n            }\r\n        } else {\r\n            this._header.innerHTML = this.content.name;\r\n        }\r\n\r\n        for (const refresh of this._visualPropertiesRefresh) {\r\n            refresh();\r\n        }\r\n\r\n        for (const port of this._inputPorts) {\r\n            port.refresh();\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            port.refresh();\r\n        }\r\n\r\n        if (this.enclosingFrameId !== -1) {\r\n            const index = this._ownerCanvas.frames.findIndex((frame) => frame.id === this.enclosingFrameId);\r\n            if (index >= 0 && this._ownerCanvas.frames[index].isCollapsed) {\r\n                this._ownerCanvas.frames[index].redrawFramePorts();\r\n            }\r\n        }\r\n\r\n        this._comments.innerHTML = this.content.comments || \"\";\r\n        this._comments.title = this.content.comments || \"\";\r\n\r\n        const executionTime = this.content.executionTime || 0;\r\n        this._executionTime.innerHTML = executionTime >= 0 ? `${executionTime.toFixed(2)} ms` : \"\";\r\n\r\n        this.content.prepareHeaderIcon(this._headerIcon, this._headerIconImg);\r\n    }\r\n\r\n    // Search nodes is direction of node from this\r\n    private _expand(node: GraphNode) {\r\n        const queue: GraphNode[] = [];\r\n        let right = undefined;\r\n        for (const link of this.links) {\r\n            if (link.nodeA == this && link.nodeB == node) {\r\n                right = false;\r\n            }\r\n            if (link.nodeB == this && link.nodeA == node) {\r\n                right = true;\r\n            }\r\n        }\r\n        if (right != undefined) {\r\n            const loop = (right: boolean) => {\r\n                const last = queue[queue.length - 1];\r\n                for (const link of last.links) {\r\n                    if (right && link.nodeA == last && link.nodeB != undefined) {\r\n                        queue.push(link.nodeB);\r\n                        loop(right);\r\n                    }\r\n                    if (!right && link.nodeB == last && link.nodeA != undefined) {\r\n                        queue.push(link.nodeA);\r\n                        loop(right);\r\n                    }\r\n                }\r\n            };\r\n            queue.push(node);\r\n            loop(right);\r\n        }\r\n        return queue;\r\n    }\r\n\r\n    // Search nodes between node and this\r\n    private _searchMiddle(node: GraphNode) {\r\n        let middle: GraphNode[] = [];\r\n        const loop = (nodes: GraphNode[], right: boolean) => {\r\n            const last = nodes[nodes.length - 1];\r\n            for (const link of last.links) {\r\n                const newNodes = Object.assign([], nodes);\r\n                if (right && link.nodeA == last && link.nodeB != undefined) {\r\n                    newNodes.push(link.nodeB);\r\n                    if (link.nodeB == this) {\r\n                        middle = newNodes;\r\n                        return;\r\n                    } else {\r\n                        loop(newNodes, right);\r\n                    }\r\n                }\r\n                if (!right && link.nodeB == last && link.nodeA != undefined) {\r\n                    newNodes.push(link.nodeA);\r\n                    if (link.nodeA == this) {\r\n                        middle = newNodes;\r\n                        return;\r\n                    } else {\r\n                        loop(newNodes, right);\r\n                    }\r\n                }\r\n            }\r\n        };\r\n        loop([node], true);\r\n        if (!middle.length) {\r\n            loop([node], false);\r\n        }\r\n        return middle;\r\n    }\r\n\r\n    private _onDown(evt: PointerEvent) {\r\n        // Check if this is coming from the port\r\n        if (evt.target && (evt.target as HTMLElement).classList.contains(\"port-icon\")) {\r\n            return;\r\n        }\r\n\r\n        const indexInSelection = this._ownerCanvas.selectedNodes.indexOf(this);\r\n        if (indexInSelection === -1) {\r\n            this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: this });\r\n        } else if (evt.ctrlKey) {\r\n            this.setIsSelected(false, false);\r\n        }\r\n\r\n        // Shift key\r\n        if (evt.shiftKey && this._ownerCanvas.selectedNodes.length > 1) {\r\n            // Last selected\r\n            const last = this._ownerCanvas.selectedNodes[this._ownerCanvas.selectedNodes.length - 2];\r\n            if (performance.now() - this._lastClick > 300) {\r\n                // Simple click\r\n                const middle = this._searchMiddle(last);\r\n                for (const node of middle) {\r\n                    this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: node });\r\n                }\r\n            } else {\r\n                // Double click\r\n                const queue = this._expand(last);\r\n                for (const node of queue) {\r\n                    this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: node });\r\n                }\r\n            }\r\n        }\r\n\r\n        evt.stopPropagation();\r\n\r\n        for (const selectedNode of this._ownerCanvas.selectedNodes) {\r\n            selectedNode.cleanAccumulation();\r\n        }\r\n\r\n        this._mouseStartPointX = evt.clientX;\r\n        this._mouseStartPointY = evt.clientY;\r\n\r\n        this._visual.setPointerCapture(evt.pointerId);\r\n\r\n        this._lastClick = performance.now();\r\n    }\r\n\r\n    public cleanAccumulation(useCeil = false) {\r\n        this.x = this._ownerCanvas.getGridPosition(this.x, useCeil);\r\n        this.y = this._ownerCanvas.getGridPosition(this.y, useCeil);\r\n    }\r\n\r\n    private _onUp(evt: PointerEvent) {\r\n        evt.stopPropagation();\r\n\r\n        for (const selectedNode of this._ownerCanvas.selectedNodes) {\r\n            selectedNode.cleanAccumulation();\r\n        }\r\n\r\n        this._mouseStartPointX = null;\r\n        this._mouseStartPointY = null;\r\n        this._visual.releasePointerCapture(evt.pointerId);\r\n\r\n        if (!this._ownerCanvas._targetLinkCandidate) {\r\n            this._stateManager.onNodeMovedObservable.notifyObservers(this);\r\n            return;\r\n        }\r\n\r\n        // Connect the ports\r\n        const inputs: Nullable<IPortData>[] = [];\r\n        const outputs: Nullable<IPortData>[] = [];\r\n        const availableNodeInputs: Nullable<IPortData>[] = [];\r\n        const availableNodeOutputs: Nullable<IPortData>[] = [];\r\n        const leftNode = this._ownerCanvas._targetLinkCandidate.nodeA;\r\n        const rightNode = this._ownerCanvas._targetLinkCandidate.nodeB!;\r\n        const leftPort = this._ownerCanvas._targetLinkCandidate.portA.portData;\r\n        const rightPort = this._ownerCanvas._targetLinkCandidate.portB!.portData;\r\n\r\n        // Delete previous\r\n        this._ownerCanvas._targetLinkCandidate.dispose();\r\n        this._ownerCanvas._targetLinkCandidate = null;\r\n\r\n        // Get the ports\r\n        availableNodeInputs.push(...this.content.inputs.filter((i) => !i.isConnected));\r\n\r\n        availableNodeOutputs.push(...this.content.outputs);\r\n\r\n        inputs.push(...leftNode.content.outputs);\r\n\r\n        outputs.push(...rightNode.content.inputs.filter((i) => !i.isConnected));\r\n\r\n        // Prioritize the already connected ports\r\n        const leftPortIndex = inputs.indexOf(leftPort);\r\n        const rightPortIndex = outputs.indexOf(rightPort);\r\n\r\n        if (leftPortIndex > 0) {\r\n            inputs.splice(leftPortIndex, 1);\r\n            inputs.splice(0, 0, leftPort);\r\n        }\r\n\r\n        if (rightPortIndex > 0) {\r\n            outputs.splice(rightPortIndex, 1);\r\n            outputs.splice(0, 0, rightPort);\r\n        }\r\n\r\n        // Reconnect\r\n        this._ownerCanvas.automaticRewire(inputs, availableNodeInputs, true);\r\n        this._ownerCanvas.automaticRewire(availableNodeOutputs, outputs, true);\r\n\r\n        this._stateManager.onRebuildRequiredObservable.notifyObservers();\r\n        this._stateManager.onNodeMovedObservable.notifyObservers(this);\r\n    }\r\n\r\n    private _onMove(evt: PointerEvent) {\r\n        this._ownerCanvas._targetLinkCandidate = null;\r\n        if (this._mouseStartPointX === null || this._mouseStartPointY === null || evt.ctrlKey) {\r\n            return;\r\n        }\r\n\r\n        // Move\r\n        const newX = (evt.clientX - this._mouseStartPointX) / this._ownerCanvas.zoom;\r\n        const newY = (evt.clientY - this._mouseStartPointY) / this._ownerCanvas.zoom;\r\n\r\n        for (const selectedNode of this._ownerCanvas.selectedNodes) {\r\n            selectedNode.x += newX;\r\n            selectedNode.y += newY;\r\n        }\r\n        for (const frame of this._ownerCanvas.selectedFrames) {\r\n            frame._moveFrame(newX, newY);\r\n        }\r\n\r\n        this._mouseStartPointX = evt.clientX;\r\n        this._mouseStartPointY = evt.clientY;\r\n\r\n        evt.stopPropagation();\r\n\r\n        if (this._inputPorts.some((p) => p.portData.isConnected) || this._outputPorts.some((o) => o.portData.hasEndpoints)) {\r\n            return;\r\n        }\r\n\r\n        // Check wires that could be underneath\r\n        const rect = this._visual.getBoundingClientRect();\r\n        for (const link of this._ownerCanvas.links) {\r\n            if (link.portA.node === this || link.portB!.node === this) {\r\n                link.isTargetCandidate = false;\r\n                continue;\r\n            }\r\n            link.isTargetCandidate = link.intersectsWith(rect);\r\n\r\n            if (link.isTargetCandidate) {\r\n                if (this._ownerCanvas._targetLinkCandidate !== link) {\r\n                    if (this._ownerCanvas._targetLinkCandidate) {\r\n                        this._ownerCanvas._targetLinkCandidate.isTargetCandidate = false;\r\n                    }\r\n                    this._ownerCanvas._targetLinkCandidate = link;\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    public renderProperties(): Nullable<JSX.Element> {\r\n        let control = PropertyLedger.RegisteredControls[this.content.getClassName()];\r\n\r\n        if (!control) {\r\n            control = PropertyLedger.DefaultControl;\r\n        }\r\n\r\n        return React.createElement(control, { stateManager: this._stateManager, nodeData: this.content });\r\n    }\r\n\r\n    public _forceRebuild(source: any, propertyName: string, notifiers?: IEditablePropertyOption[\"notifiers\"]) {\r\n        for (const refresh of this._visualPropertiesRefresh) {\r\n            refresh();\r\n        }\r\n        ForceRebuild(source, this._stateManager, propertyName, notifiers);\r\n    }\r\n\r\n    private _isCollapsed = false;\r\n\r\n    /**\r\n     * Collapse the node\r\n     */\r\n    public collapse() {\r\n        this._headerCollapse.classList.add(localStyles.collapsed);\r\n        const inputs = this._inputPorts.filter((p) => !p.portData.isConnected);\r\n\r\n        for (const p of inputs) {\r\n            p.container.classList.add(commonStyles.hidden);\r\n        }\r\n\r\n        const outputs = this._outputPorts.filter((p) => !p.portData.isConnected);\r\n\r\n        for (const p of outputs) {\r\n            p.container.classList.add(commonStyles.hidden);\r\n        }\r\n\r\n        this._refreshLinks();\r\n    }\r\n\r\n    /**\r\n     * Expand the node\r\n     */\r\n    public expand() {\r\n        this._headerCollapse.classList.remove(localStyles.collapsed);\r\n        const inputs = this._inputPorts.filter((p) => !p.portData.isConnected);\r\n        for (const p of inputs) {\r\n            p.container.classList.remove(commonStyles.hidden);\r\n        }\r\n\r\n        const outputs = this._outputPorts.filter((p) => !p.portData.isConnected);\r\n        for (const p of outputs) {\r\n            p.container.classList.remove(commonStyles.hidden);\r\n        }\r\n\r\n        this._refreshLinks();\r\n    }\r\n\r\n    private _portUICount = 0;\r\n    private _buildInputPorts(addOnly = false) {\r\n        for (const input of this.content.inputs) {\r\n            if (addOnly) {\r\n                // Search if the port already exists\r\n                const existingPort = this._inputPorts.find((p) => p.portData === input);\r\n                if (existingPort) {\r\n                    continue;\r\n                }\r\n            }\r\n\r\n            if (input.directValueDefinition) {\r\n                this._portUICount++;\r\n            }\r\n            this._inputPorts.push(NodePort.CreatePortElement(input, this, this._inputsContainer, this._displayManager, this._stateManager));\r\n        }\r\n    }\r\n\r\n    public appendVisual(root: HTMLDivElement, owner: GraphCanvasComponent) {\r\n        this._ownerCanvas = owner;\r\n\r\n        // Display manager\r\n        const displayManagerClass = DisplayLedger.RegisteredControls[this.content.getClassName()];\r\n\r\n        if (displayManagerClass) {\r\n            this._displayManager = new displayManagerClass();\r\n        }\r\n\r\n        // DOM\r\n        this._visual = root.ownerDocument.createElement(\"div\");\r\n        this._visual.classList.add(localStyles.visual);\r\n\r\n        this._visual.addEventListener(\"pointerdown\", (evt) => this._onDown(evt));\r\n        this._visual.addEventListener(\"pointerup\", (evt) => this._onUp(evt));\r\n        this._visual.addEventListener(\"pointermove\", (evt) => this._onMove(evt));\r\n\r\n        this._headerContainer = root.ownerDocument.createElement(\"div\");\r\n        this._headerContainer.classList.add(localStyles[\"header-container\"]);\r\n        this._visual.appendChild(this._headerContainer);\r\n\r\n        this._header = root.ownerDocument.createElement(\"div\");\r\n        this._header.classList.add(localStyles.header);\r\n        this._headerContainer.appendChild(this._header);\r\n\r\n        this._headerIcon = root.ownerDocument.createElement(\"div\");\r\n        this._headerIcon.classList.add(localStyles.headerIcon);\r\n        this._headerIconImg = root.ownerDocument.createElement(\"img\");\r\n        this._headerIconImg.draggable = false;\r\n        this._headerIcon.appendChild(this._headerIconImg);\r\n        this._headerContainer.appendChild(this._headerIcon);\r\n\r\n        if (this.content.inputs.length > 1 || this.content.outputs.length > 1) {\r\n            this._headerCollapse = root.ownerDocument.createElement(\"div\");\r\n            this._headerCollapse.classList.add(localStyles.headerCollapse);\r\n            this._headerCollapseImg = root.ownerDocument.createElement(\"img\");\r\n            this._headerCollapseImg.src = dropdownArrowIcon;\r\n            this._headerCollapseImg.draggable = false;\r\n            this._headerCollapse.appendChild(this._headerCollapseImg);\r\n            this._headerContainer.appendChild(this._headerCollapse);\r\n            this._headerCollapse.addEventListener(\"pointerup\", (evt) => evt.stopPropagation());\r\n            this._headerCollapse.addEventListener(\"pointermove\", (evt) => evt.stopPropagation());\r\n            this._headerCollapse.addEventListener(\"pointerdown\", (evt) => {\r\n                this._isCollapsed = !this._isCollapsed;\r\n                if (this._isCollapsed) {\r\n                    this.collapse();\r\n                } else {\r\n                    this.expand();\r\n                }\r\n                evt.stopPropagation();\r\n            });\r\n        }\r\n\r\n        this._selectionBorder = root.ownerDocument.createElement(\"div\");\r\n        this._selectionBorder.classList.add(\"selection-border\");\r\n        this._visual.appendChild(this._selectionBorder);\r\n\r\n        this._connections = root.ownerDocument.createElement(\"div\");\r\n        this._connections.classList.add(localStyles.connections);\r\n        this._visual.appendChild(this._connections);\r\n\r\n        this._optionsContainer = root.ownerDocument.createElement(\"div\");\r\n        this._optionsContainer.classList.add(localStyles.optionsContainer);\r\n        this._connections.appendChild(this._optionsContainer);\r\n\r\n        this._inputsContainer = root.ownerDocument.createElement(\"div\");\r\n        this._inputsContainer.classList.add(commonStyles.inputsContainer);\r\n        this._connections.appendChild(this._inputsContainer);\r\n\r\n        this._outputsContainer = root.ownerDocument.createElement(\"div\");\r\n        this._outputsContainer.classList.add(commonStyles.outputsContainer);\r\n        this._connections.appendChild(this._outputsContainer);\r\n\r\n        this._content = root.ownerDocument.createElement(\"div\");\r\n        this._content.classList.add(localStyles.content);\r\n        this._visual.appendChild(this._content);\r\n\r\n        root.appendChild(this._visual);\r\n\r\n        // Comments\r\n        this._comments = root.ownerDocument.createElement(\"div\");\r\n        this._comments.classList.add(localStyles.comments);\r\n\r\n        this._visual.appendChild(this._comments);\r\n\r\n        // Execution time\r\n        this._executionTime = root.ownerDocument.createElement(\"div\");\r\n        this._executionTime.classList.add(localStyles.executionTime);\r\n\r\n        this._visual.appendChild(this._executionTime);\r\n\r\n        // Options\r\n        const propStore: IPropertyDescriptionForEdition[] = this.content.data._propStore;\r\n        if (propStore) {\r\n            const source = this.content.data;\r\n\r\n            const classes: string[] = [];\r\n\r\n            let proto = Object.getPrototypeOf(source);\r\n            while (proto && proto.getClassName) {\r\n                classes.push(proto.getClassName());\r\n                proto = Object.getPrototypeOf(proto);\r\n            }\r\n\r\n            for (const { propertyName, displayName, type, options, className } of propStore) {\r\n                if (!options || !options.embedded || classes.indexOf(className) === -1) {\r\n                    continue;\r\n                }\r\n\r\n                const container = root.ownerDocument.createElement(\"div\");\r\n                container.addEventListener(\"pointerdown\", (evt) => evt.stopPropagation());\r\n                container.addEventListener(\"pointerup\", (evt) => evt.stopPropagation());\r\n                container.addEventListener(\"pointermove\", (evt) => evt.stopPropagation());\r\n                this._optionsContainer.appendChild(container);\r\n                switch (type) {\r\n                    case PropertyTypeForEdition.Boolean: {\r\n                        container.classList.add(localStyles.booleanContainer);\r\n                        const checkbox = root.ownerDocument.createElement(\"input\");\r\n                        checkbox.type = \"checkbox\";\r\n                        checkbox.id = `checkbox-${GraphNode._IdGenerator++}`;\r\n                        checkbox.checked = source[propertyName];\r\n                        this._visualPropertiesRefresh.push(() => {\r\n                            checkbox.checked = source[propertyName];\r\n                        });\r\n                        checkbox.onchange = () => {\r\n                            source[propertyName] = !source[propertyName];\r\n                            this._forceRebuild(source, propertyName, options?.notifiers);\r\n                        };\r\n                        container.appendChild(checkbox);\r\n                        const label = root.ownerDocument.createElement(\"label\");\r\n                        label.innerText = displayName;\r\n                        label.htmlFor = checkbox.id;\r\n                        container.appendChild(label);\r\n                        break;\r\n                    }\r\n                    case PropertyTypeForEdition.Int:\r\n                    case PropertyTypeForEdition.Float: {\r\n                        this._optionsContainer.appendChild(container);\r\n                        BuildFloatUI(\r\n                            container,\r\n                            root.ownerDocument,\r\n                            displayName,\r\n                            type === PropertyTypeForEdition.Int,\r\n                            source,\r\n                            propertyName,\r\n                            () => {\r\n                                this._forceRebuild(source, propertyName, options?.notifiers);\r\n                            },\r\n                            options.min,\r\n                            options.max,\r\n                            this._visualPropertiesRefresh,\r\n                            localStyles.standalone\r\n                        );\r\n                        break;\r\n                    }\r\n                    case PropertyTypeForEdition.List: {\r\n                        container.classList.add(localStyles.listContainer);\r\n                        const select = root.ownerDocument.createElement(\"div\");\r\n                        select.classList.add(localStyles.select);\r\n                        container.appendChild(select);\r\n                        const selectText = root.ownerDocument.createElement(\"div\");\r\n                        selectText.classList.add(localStyles.selectText);\r\n                        select.appendChild(selectText);\r\n                        const items = options.options as IEditablePropertyListOption[];\r\n\r\n                        this._visualPropertiesRefresh.push(() => {\r\n                            const currentValue = source[propertyName] as number;\r\n                            const matchedItem = items.find((item) => item.value === currentValue);\r\n                            // Back-compat fallback for index based lists\r\n                            const fallbackItem =\r\n                                matchedItem ?? (typeof currentValue === \"number\" && currentValue >= 0 && currentValue < items.length ? items[currentValue] : undefined);\r\n                            selectText.innerText = fallbackItem?.label ?? \"\";\r\n                        });\r\n                        const selectList = root.ownerDocument.createElement(\"div\");\r\n                        selectList.classList.add(localStyles.selectList);\r\n                        selectList.classList.add(commonStyles.hidden);\r\n                        select.appendChild(selectList);\r\n                        for (const item of items) {\r\n                            const option = root.ownerDocument.createElement(\"div\");\r\n                            option.classList.add(localStyles.option);\r\n                            option.innerText = item.label;\r\n                            option.onclick = () => {\r\n                                source[propertyName] = item.value;\r\n                                this._forceRebuild(source, propertyName, options?.notifiers);\r\n                            };\r\n                            selectList.appendChild(option);\r\n                        }\r\n\r\n                        select.onclick = () => {\r\n                            selectList.classList.toggle(commonStyles.hidden);\r\n                            select.classList.toggle(localStyles.activeNode);\r\n                            this._visual.classList.toggle(localStyles.topMost);\r\n                            this._stateManager.modalIsDisplayed = !this._stateManager.modalIsDisplayed;\r\n                        };\r\n\r\n                        select.onpointerleave = () => {\r\n                            selectList.classList.add(commonStyles.hidden);\r\n                            select.classList.remove(localStyles.activeNode);\r\n                            this._visual.classList.remove(localStyles.topMost);\r\n                            this._stateManager.modalIsDisplayed = false;\r\n                        };\r\n                    }\r\n                }\r\n            }\r\n        }\r\n\r\n        // Connections\r\n        this._buildInputPorts();\r\n\r\n        for (const output of this.content.outputs) {\r\n            this._outputPorts.push(NodePort.CreatePortElement(output, this, this._outputsContainer, this._displayManager, this._stateManager));\r\n        }\r\n\r\n        if (this._visualPropertiesRefresh.length === 0 && this._portUICount === 0) {\r\n            this._inputsContainer.classList.add(commonStyles.inputsContainerUp);\r\n        }\r\n\r\n        this.refresh();\r\n\r\n        this.content.refreshCallback = () => {\r\n            this.refresh();\r\n        };\r\n    }\r\n\r\n    public dispose() {\r\n        if (this._displayManager && this._displayManager.onDispose) {\r\n            this._displayManager.onDispose(this.content, this._stateManager);\r\n        }\r\n\r\n        // notify frame observers that this node is being deleted\r\n        this._stateManager.onGraphNodeRemovalObservable.notifyObservers(this);\r\n\r\n        if (this._onSelectionChangedObserver) {\r\n            this._stateManager.onSelectionChangedObservable.remove(this._onSelectionChangedObserver);\r\n        }\r\n\r\n        if (this._onUpdateRequiredObserver) {\r\n            this._stateManager.onUpdateRequiredObservable.remove(this._onUpdateRequiredObserver);\r\n        }\r\n\r\n        if (this._onHighlightNodeObserver) {\r\n            this._stateManager.onHighlightNodeObservable.remove(this._onHighlightNodeObserver);\r\n        }\r\n\r\n        if (this._onSelectionBoxMovedObserver) {\r\n            this._stateManager.onSelectionBoxMoved.remove(this._onSelectionBoxMovedObserver);\r\n        }\r\n\r\n        if (this._visual.parentElement) {\r\n            this._visual.parentElement.removeChild(this._visual);\r\n        }\r\n\r\n        if (this._onFrameCreatedObserver) {\r\n            this._stateManager.onFrameCreatedObservable.remove(this._onFrameCreatedObserver);\r\n        }\r\n\r\n        for (const port of this._inputPorts) {\r\n            port.dispose();\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            port.dispose();\r\n        }\r\n\r\n        const links = this._links.slice(0);\r\n        for (const link of links) {\r\n            link.dispose();\r\n        }\r\n\r\n        this.content.dispose();\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"graphNode.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/graphNode.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Nullable } from \"core/types\";\r\nimport type { Observer } from \"core/Misc/observable\";\r\nimport type { GraphCanvasComponent } from \"./graphCanvas\";\r\nimport * as React from \"react\";\r\nimport { NodePort } from \"./nodePort\";\r\nimport type { GraphFrame } from \"./graphFrame\";\r\nimport type { NodeLink } from \"./nodeLink\";\r\nimport type { StateManager } from \"./stateManager\";\r\nimport type { ISelectionChangedOptions } from \"./interfaces/selectionChangedOptions\";\r\nimport type { IDisplayManager } from \"./interfaces/displayManager\";\r\nimport { PropertyLedger } from \"./propertyLedger\";\r\nimport { DisplayLedger } from \"./displayLedger\";\r\nimport type { INodeData } from \"./interfaces/nodeData\";\r\nimport type { IPortData } from \"./interfaces/portData\";\r\nimport * as localStyles from \"./graphNode.module.scss\";\r\nimport * as commonStyles from \"./common.module.scss\";\r\nimport type { IEditablePropertyListOption, IEditablePropertyOption, IPropertyDescriptionForEdition } from \"core/Decorators/nodeDecorator\";\r\nimport { PropertyTypeForEdition } from \"core/Decorators/nodeDecorator\";\r\nimport { ForceRebuild } from \"./automaticProperties\";\r\nimport dropdownArrowIcon from \"../imgs/dropdownArrowIcon_white.svg\";\r\nimport { BuildFloatUI } from \"./tools\";\r\n\r\nexport class GraphNode {\r\n    private static _IdGenerator = 0;\r\n    private _visual: HTMLDivElement;\r\n    private _headerContainer: HTMLDivElement;\r\n    private _headerIcon: HTMLDivElement;\r\n    private _headerIconImg: HTMLImageElement;\r\n    private _headerCollapseImg: HTMLImageElement;\r\n    private _header: HTMLDivElement;\r\n    private _headerCollapse: HTMLDivElement;\r\n    private _connections: HTMLDivElement;\r\n    private _optionsContainer: HTMLDivElement;\r\n    private _inputsContainer: HTMLDivElement;\r\n    private _outputsContainer: HTMLDivElement;\r\n    private _content: HTMLDivElement;\r\n    private _comments: HTMLDivElement;\r\n    private _executionTime: HTMLDivElement;\r\n    private _selectionBorder: HTMLDivElement;\r\n    private _inputPorts: NodePort[] = [];\r\n    private _outputPorts: NodePort[] = [];\r\n    private _links: NodeLink[] = [];\r\n    private _x = 0;\r\n    private _y = 0;\r\n    private _gridAlignedX = 0;\r\n    private _gridAlignedY = 0;\r\n    private _mouseStartPointX: Nullable<number> = null;\r\n    private _mouseStartPointY: Nullable<number> = null;\r\n    private _stateManager: StateManager;\r\n    private _onSelectionChangedObserver: Nullable<Observer<Nullable<ISelectionChangedOptions>>>;\r\n    private _onSelectionBoxMovedObserver: Nullable<Observer<ClientRect | DOMRect>>;\r\n    private _onFrameCreatedObserver: Nullable<Observer<GraphFrame>>;\r\n    private _onUpdateRequiredObserver: Nullable<Observer<Nullable<INodeData>>>;\r\n    private _onHighlightNodeObserver: Nullable<Observer<any>>;\r\n    private _ownerCanvas: GraphCanvasComponent;\r\n    private _displayManager: Nullable<IDisplayManager> = null;\r\n    private _isVisible = true;\r\n    private _enclosingFrameId = -1;\r\n    private _lastClick = 0.0;\r\n\r\n    public _visualPropertiesRefresh: Array<() => void> = [];\r\n\r\n    public addClassToVisual(className: string) {\r\n        this._visual.classList.add(className);\r\n    }\r\n\r\n    public removeClassFromVisual(className: string) {\r\n        this._visual.classList.remove(className);\r\n    }\r\n\r\n    public get isCollapsed() {\r\n        return this._isCollapsed;\r\n    }\r\n\r\n    public get isVisible() {\r\n        return this._isVisible;\r\n    }\r\n\r\n    public set isVisible(value: boolean) {\r\n        this._isVisible = value;\r\n\r\n        if (!value) {\r\n            this._visual.classList.add(commonStyles[\"hidden\"]);\r\n        } else {\r\n            this._visual.classList.remove(commonStyles[\"hidden\"]);\r\n            this._upateNodePortNames();\r\n        }\r\n\r\n        for (const link of this._links) {\r\n            link.isVisible = value;\r\n        }\r\n\r\n        this._refreshLinks();\r\n    }\r\n\r\n    private _upateNodePortNames() {\r\n        for (const port of this._inputPorts.concat(this._outputPorts)) {\r\n            if (port.hasLabel()) {\r\n                port.portName = port.portData.name;\r\n            }\r\n        }\r\n    }\r\n\r\n    public get outputPorts() {\r\n        return this._outputPorts;\r\n    }\r\n\r\n    public get inputPorts() {\r\n        return this._inputPorts;\r\n    }\r\n\r\n    public get links() {\r\n        return this._links;\r\n    }\r\n\r\n    public get gridAlignedX() {\r\n        return this._gridAlignedX;\r\n    }\r\n\r\n    public get gridAlignedY() {\r\n        return this._gridAlignedY;\r\n    }\r\n\r\n    public get x() {\r\n        return this._x;\r\n    }\r\n\r\n    public set x(value: number) {\r\n        if (this._x === value) {\r\n            return;\r\n        }\r\n        this._x = value;\r\n\r\n        this._gridAlignedX = this._ownerCanvas.getGridPosition(value);\r\n        this._visual.style.left = `${this._gridAlignedX}px`;\r\n\r\n        this._refreshLinks();\r\n        this._refreshFrames();\r\n    }\r\n\r\n    public get y() {\r\n        return this._y;\r\n    }\r\n\r\n    public set y(value: number) {\r\n        if (this._y === value) {\r\n            return;\r\n        }\r\n\r\n        this._y = value;\r\n\r\n        this._gridAlignedY = this._ownerCanvas.getGridPosition(value);\r\n        this._visual.style.top = `${this._gridAlignedY}px`;\r\n\r\n        this._refreshLinks();\r\n        this._refreshFrames();\r\n    }\r\n\r\n    public get width() {\r\n        return this._visual.clientWidth;\r\n    }\r\n\r\n    public get height() {\r\n        return this._visual.clientHeight;\r\n    }\r\n\r\n    public get id() {\r\n        return this.content.uniqueId;\r\n    }\r\n\r\n    public get name() {\r\n        return this.content.name;\r\n    }\r\n\r\n    public get enclosingFrameId() {\r\n        return this._enclosingFrameId;\r\n    }\r\n\r\n    public set enclosingFrameId(value: number) {\r\n        this._enclosingFrameId = value;\r\n    }\r\n\r\n    public setIsSelected(value: boolean, marqueeSelection: boolean) {\r\n        if (!value) {\r\n            this._visual.classList.remove(localStyles[\"selected\"]);\r\n            const indexInSelection = this._ownerCanvas.selectedNodes.indexOf(this);\r\n\r\n            if (indexInSelection > -1) {\r\n                this._ownerCanvas.selectedNodes.splice(indexInSelection, 1);\r\n            }\r\n        } else {\r\n            this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: this, marqueeSelection });\r\n        }\r\n    }\r\n\r\n    public get rootElement() {\r\n        return this._visual;\r\n    }\r\n\r\n    public constructor(\r\n        public content: INodeData,\r\n        stateManager: StateManager\r\n    ) {\r\n        this._stateManager = stateManager;\r\n\r\n        this._onSelectionChangedObserver = this._stateManager.onSelectionChangedObservable.add((options) => {\r\n            const { selection: node } = options || {};\r\n            if (node === this) {\r\n                if (this.content.canBeActivated) {\r\n                    this.content.setIsActive?.(true);\r\n                    this._stateManager.queueRebuildCommand();\r\n                }\r\n                this._visual.classList.add(localStyles[\"selected\"]);\r\n                if (this._displayManager && this._displayManager.onSelectionChanged) {\r\n                    this._displayManager.onSelectionChanged(this.content, node.content, this._stateManager);\r\n                }\r\n                this._stateManager.activeNode = this;\r\n            } else {\r\n                if (this._stateManager.activeNode === this) {\r\n                    this._stateManager.activeNode = null;\r\n                }\r\n                if (this._ownerCanvas.selectedNodes.indexOf(this) === -1) {\r\n                    if (this.content.canBeActivated && this.content.isActive) {\r\n                        this.content.setIsActive?.(false);\r\n                        this._stateManager.queueRebuildCommand();\r\n                    }\r\n                    this._visual.classList.remove(localStyles[\"selected\"]);\r\n                    if (this._displayManager && this._displayManager.onSelectionChanged) {\r\n                        this._displayManager.onSelectionChanged(this.content, node && (node as GraphNode).content ? (node as GraphNode).content : null, this._stateManager);\r\n                    }\r\n                }\r\n            }\r\n        });\r\n\r\n        this._onHighlightNodeObserver = this._stateManager.onHighlightNodeObservable.add((data) => {\r\n            if (data.data !== this.content.data) {\r\n                return;\r\n            }\r\n            if (data.active) {\r\n                this._visual.classList.add(localStyles[\"highlighted\"]);\r\n            } else {\r\n                this._visual.classList.remove(localStyles[\"highlighted\"]);\r\n            }\r\n        });\r\n\r\n        this._onUpdateRequiredObserver = this._stateManager.onUpdateRequiredObservable.add((data) => {\r\n            if (data !== this.content.data) {\r\n                return;\r\n            }\r\n            this.refresh();\r\n        });\r\n\r\n        this._onSelectionBoxMovedObserver = this._stateManager.onSelectionBoxMoved.add((rect1) => {\r\n            const rect2 = this._visual.getBoundingClientRect();\r\n            const overlap = !(rect1.right < rect2.left || rect1.left > rect2.right || rect1.bottom < rect2.top || rect1.top > rect2.bottom);\r\n\r\n            this.setIsSelected(overlap, true);\r\n        });\r\n\r\n        this._onFrameCreatedObserver = this._stateManager.onFrameCreatedObservable.add((frame) => {\r\n            if (this._ownerCanvas.frames.some((f) => f.nodes.indexOf(this) !== -1)) {\r\n                return;\r\n            }\r\n\r\n            if (this.isOverlappingFrame(frame)) {\r\n                frame.nodes.push(this);\r\n            }\r\n        });\r\n\r\n        content.onInputCountChanged = () => {\r\n            this._buildInputPorts(true);\r\n        };\r\n    }\r\n\r\n    public isOverlappingFrame(frame: GraphFrame) {\r\n        const rect2 = this._visual.getBoundingClientRect();\r\n        const rect1 = frame.element.getBoundingClientRect();\r\n\r\n        // Add a tiny margin\r\n        rect1.width -= 5;\r\n        rect1.height -= 5;\r\n\r\n        const isOverlappingFrame = !(rect1.right < rect2.left || rect1.left > rect2.right || rect1.bottom < rect2.top || rect1.top > rect2.bottom);\r\n\r\n        if (isOverlappingFrame) {\r\n            this.enclosingFrameId = frame.id;\r\n        }\r\n        return isOverlappingFrame;\r\n    }\r\n\r\n    public getPortForPortData(portData: IPortData) {\r\n        for (const port of this._inputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint === portData || (attachedPoint.ownerData === portData.ownerData && attachedPoint.internalName === portData.internalName)) {\r\n                return port;\r\n            }\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint === portData || (attachedPoint.ownerData === portData.ownerData && attachedPoint.internalName === portData.internalName)) {\r\n                return port;\r\n            }\r\n        }\r\n\r\n        return null;\r\n    }\r\n\r\n    public getPortDataForPortDataContent(data: any) {\r\n        for (const port of this._inputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint.data === data) {\r\n                return attachedPoint;\r\n            }\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            const attachedPoint = port.portData;\r\n\r\n            if (attachedPoint.data === data) {\r\n                return attachedPoint;\r\n            }\r\n        }\r\n\r\n        return null;\r\n    }\r\n\r\n    public getLinksForPortDataContent(data: any) {\r\n        return this._links.filter((link) => link.portA.portData.data === data || link.portB!.portData.data === data);\r\n    }\r\n\r\n    public getLinksForPortData(portData: IPortData) {\r\n        return this._links.filter((link) => link.portA.portData === portData || link.portB!.portData === portData);\r\n    }\r\n\r\n    private _refreshFrames() {\r\n        if (this._ownerCanvas._frameIsMoving || this._ownerCanvas._isLoading) {\r\n            return;\r\n        }\r\n\r\n        // Frames\r\n        for (const frame of this._ownerCanvas.frames) {\r\n            frame.syncNode(this);\r\n        }\r\n    }\r\n\r\n    public _refreshLinks() {\r\n        if (this._ownerCanvas._isLoading) {\r\n            return;\r\n        }\r\n        for (const link of this._links) {\r\n            link.update();\r\n        }\r\n    }\r\n\r\n    public refresh() {\r\n        if (this._displayManager) {\r\n            this._header.innerHTML = this._displayManager.getHeaderText(this.content);\r\n            this._displayManager.updatePreviewContent(this.content, this._content);\r\n            const backgroundColor = this._displayManager.getBackgroundColor(this.content);\r\n            if (backgroundColor) {\r\n                this._visual.style.background = backgroundColor;\r\n            }\r\n            const additionalClass = this._displayManager.getHeaderClass(this.content);\r\n            this._header.classList.value = localStyles.header;\r\n            this._headerContainer.classList.value = localStyles[\"header-container\"];\r\n            if (additionalClass) {\r\n                this._headerContainer.classList.add(additionalClass);\r\n            }\r\n            if (this._displayManager.updateFullVisualContent) {\r\n                this._displayManager.updateFullVisualContent(this.content, {\r\n                    visual: this._visual,\r\n                    header: this._header,\r\n                    headerContainer: this._headerContainer,\r\n                    headerIcon: this._headerIcon,\r\n                    headerIconImg: this._headerIconImg,\r\n                    comments: this._comments,\r\n                    connections: this._connections,\r\n                    inputsContainer: this._inputsContainer,\r\n                    outputsContainer: this._outputsContainer,\r\n                    content: this._content,\r\n                    selectionBorder: this._selectionBorder,\r\n                });\r\n            }\r\n        } else {\r\n            this._header.innerHTML = this.content.name;\r\n        }\r\n\r\n        for (const refresh of this._visualPropertiesRefresh) {\r\n            refresh();\r\n        }\r\n\r\n        for (const port of this._inputPorts) {\r\n            port.refresh();\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            port.refresh();\r\n        }\r\n\r\n        if (this.enclosingFrameId !== -1) {\r\n            const index = this._ownerCanvas.frames.findIndex((frame) => frame.id === this.enclosingFrameId);\r\n            if (index >= 0 && this._ownerCanvas.frames[index].isCollapsed) {\r\n                this._ownerCanvas.frames[index].redrawFramePorts();\r\n            }\r\n        }\r\n\r\n        this._comments.innerHTML = this.content.comments || \"\";\r\n        this._comments.title = this.content.comments || \"\";\r\n\r\n        const executionTime = this.content.executionTime || 0;\r\n        this._executionTime.innerHTML = executionTime >= 0 ? `${executionTime.toFixed(2)} ms` : \"\";\r\n\r\n        this.content.prepareHeaderIcon(this._headerIcon, this._headerIconImg);\r\n    }\r\n\r\n    // Search nodes is direction of node from this\r\n    private _expand(node: GraphNode) {\r\n        const queue: GraphNode[] = [];\r\n        let right = undefined;\r\n        for (const link of this.links) {\r\n            if (link.nodeA == this && link.nodeB == node) {\r\n                right = false;\r\n            }\r\n            if (link.nodeB == this && link.nodeA == node) {\r\n                right = true;\r\n            }\r\n        }\r\n        if (right != undefined) {\r\n            const loop = (right: boolean) => {\r\n                const last = queue[queue.length - 1];\r\n                for (const link of last.links) {\r\n                    if (right && link.nodeA == last && link.nodeB != undefined) {\r\n                        queue.push(link.nodeB);\r\n                        loop(right);\r\n                    }\r\n                    if (!right && link.nodeB == last && link.nodeA != undefined) {\r\n                        queue.push(link.nodeA);\r\n                        loop(right);\r\n                    }\r\n                }\r\n            };\r\n            queue.push(node);\r\n            loop(right);\r\n        }\r\n        return queue;\r\n    }\r\n\r\n    // Search nodes between node and this\r\n    private _searchMiddle(node: GraphNode) {\r\n        let middle: GraphNode[] = [];\r\n        const loop = (nodes: GraphNode[], right: boolean) => {\r\n            const last = nodes[nodes.length - 1];\r\n            for (const link of last.links) {\r\n                const newNodes = Object.assign([], nodes);\r\n                if (right && link.nodeA == last && link.nodeB != undefined) {\r\n                    newNodes.push(link.nodeB);\r\n                    if (link.nodeB == this) {\r\n                        middle = newNodes;\r\n                        return;\r\n                    } else {\r\n                        loop(newNodes, right);\r\n                    }\r\n                }\r\n                if (!right && link.nodeB == last && link.nodeA != undefined) {\r\n                    newNodes.push(link.nodeA);\r\n                    if (link.nodeA == this) {\r\n                        middle = newNodes;\r\n                        return;\r\n                    } else {\r\n                        loop(newNodes, right);\r\n                    }\r\n                }\r\n            }\r\n        };\r\n        loop([node], true);\r\n        if (!middle.length) {\r\n            loop([node], false);\r\n        }\r\n        return middle;\r\n    }\r\n\r\n    private _onDown(evt: PointerEvent) {\r\n        // Check if this is coming from the port\r\n        if (evt.target && (evt.target as HTMLElement).classList.contains(\"port-icon\")) {\r\n            return;\r\n        }\r\n\r\n        const indexInSelection = this._ownerCanvas.selectedNodes.indexOf(this);\r\n        if (indexInSelection === -1) {\r\n            this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: this });\r\n        } else if (evt.ctrlKey) {\r\n            this.setIsSelected(false, false);\r\n        }\r\n\r\n        // Shift key\r\n        if (evt.shiftKey && this._ownerCanvas.selectedNodes.length > 1) {\r\n            // Last selected\r\n            const last = this._ownerCanvas.selectedNodes[this._ownerCanvas.selectedNodes.length - 2];\r\n            if (performance.now() - this._lastClick > 300) {\r\n                // Simple click\r\n                const middle = this._searchMiddle(last);\r\n                for (const node of middle) {\r\n                    this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: node });\r\n                }\r\n            } else {\r\n                // Double click\r\n                const queue = this._expand(last);\r\n                for (const node of queue) {\r\n                    this._stateManager.onSelectionChangedObservable.notifyObservers({ selection: node });\r\n                }\r\n            }\r\n        }\r\n\r\n        evt.stopPropagation();\r\n\r\n        for (const selectedNode of this._ownerCanvas.selectedNodes) {\r\n            selectedNode.cleanAccumulation();\r\n        }\r\n\r\n        this._mouseStartPointX = evt.clientX;\r\n        this._mouseStartPointY = evt.clientY;\r\n\r\n        this._visual.setPointerCapture(evt.pointerId);\r\n\r\n        this._lastClick = performance.now();\r\n    }\r\n\r\n    public cleanAccumulation(useCeil = false) {\r\n        this.x = this._ownerCanvas.getGridPosition(this.x, useCeil);\r\n        this.y = this._ownerCanvas.getGridPosition(this.y, useCeil);\r\n    }\r\n\r\n    private _onUp(evt: PointerEvent) {\r\n        evt.stopPropagation();\r\n\r\n        for (const selectedNode of this._ownerCanvas.selectedNodes) {\r\n            selectedNode.cleanAccumulation();\r\n        }\r\n\r\n        this._mouseStartPointX = null;\r\n        this._mouseStartPointY = null;\r\n        this._visual.releasePointerCapture(evt.pointerId);\r\n\r\n        if (!this._ownerCanvas._targetLinkCandidate) {\r\n            this._stateManager.onNodeMovedObservable.notifyObservers(this);\r\n            return;\r\n        }\r\n\r\n        // Connect the ports\r\n        const inputs: Nullable<IPortData>[] = [];\r\n        const outputs: Nullable<IPortData>[] = [];\r\n        const availableNodeInputs: Nullable<IPortData>[] = [];\r\n        const availableNodeOutputs: Nullable<IPortData>[] = [];\r\n        const leftNode = this._ownerCanvas._targetLinkCandidate.nodeA;\r\n        const rightNode = this._ownerCanvas._targetLinkCandidate.nodeB!;\r\n        const leftPort = this._ownerCanvas._targetLinkCandidate.portA.portData;\r\n        const rightPort = this._ownerCanvas._targetLinkCandidate.portB!.portData;\r\n\r\n        // Delete previous\r\n        this._ownerCanvas._targetLinkCandidate.dispose();\r\n        this._ownerCanvas._targetLinkCandidate = null;\r\n\r\n        // Get the ports\r\n        availableNodeInputs.push(...this.content.inputs.filter((i) => !i.isConnected));\r\n\r\n        availableNodeOutputs.push(...this.content.outputs);\r\n\r\n        inputs.push(...leftNode.content.outputs);\r\n\r\n        outputs.push(...rightNode.content.inputs.filter((i) => !i.isConnected));\r\n\r\n        // Prioritize the already connected ports\r\n        const leftPortIndex = inputs.indexOf(leftPort);\r\n        const rightPortIndex = outputs.indexOf(rightPort);\r\n\r\n        if (leftPortIndex > 0) {\r\n            inputs.splice(leftPortIndex, 1);\r\n            inputs.splice(0, 0, leftPort);\r\n        }\r\n\r\n        if (rightPortIndex > 0) {\r\n            outputs.splice(rightPortIndex, 1);\r\n            outputs.splice(0, 0, rightPort);\r\n        }\r\n\r\n        // Reconnect\r\n        this._ownerCanvas.automaticRewire(inputs, availableNodeInputs, true);\r\n        this._ownerCanvas.automaticRewire(availableNodeOutputs, outputs, true);\r\n\r\n        this._stateManager.onRebuildRequiredObservable.notifyObservers();\r\n        this._stateManager.onNodeMovedObservable.notifyObservers(this);\r\n    }\r\n\r\n    private _onMove(evt: PointerEvent) {\r\n        this._ownerCanvas._targetLinkCandidate = null;\r\n        if (this._mouseStartPointX === null || this._mouseStartPointY === null || evt.ctrlKey) {\r\n            return;\r\n        }\r\n\r\n        // Move\r\n        const newX = (evt.clientX - this._mouseStartPointX) / this._ownerCanvas.zoom;\r\n        const newY = (evt.clientY - this._mouseStartPointY) / this._ownerCanvas.zoom;\r\n\r\n        for (const selectedNode of this._ownerCanvas.selectedNodes) {\r\n            selectedNode.x += newX;\r\n            selectedNode.y += newY;\r\n        }\r\n        for (const frame of this._ownerCanvas.selectedFrames) {\r\n            frame._moveFrame(newX, newY);\r\n        }\r\n\r\n        this._mouseStartPointX = evt.clientX;\r\n        this._mouseStartPointY = evt.clientY;\r\n\r\n        evt.stopPropagation();\r\n\r\n        if (this._inputPorts.some((p) => p.portData.isConnected) || this._outputPorts.some((o) => o.portData.hasEndpoints)) {\r\n            return;\r\n        }\r\n\r\n        // Check wires that could be underneath\r\n        const rect = this._visual.getBoundingClientRect();\r\n        for (const link of this._ownerCanvas.links) {\r\n            if (link.portA.node === this || link.portB!.node === this) {\r\n                link.isTargetCandidate = false;\r\n                continue;\r\n            }\r\n            link.isTargetCandidate = link.intersectsWith(rect);\r\n\r\n            if (link.isTargetCandidate) {\r\n                if (this._ownerCanvas._targetLinkCandidate !== link) {\r\n                    if (this._ownerCanvas._targetLinkCandidate) {\r\n                        this._ownerCanvas._targetLinkCandidate.isTargetCandidate = false;\r\n                    }\r\n                    this._ownerCanvas._targetLinkCandidate = link;\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    public renderProperties(): Nullable<JSX.Element> {\r\n        let control = PropertyLedger.RegisteredControls[this.content.getClassName()];\r\n\r\n        if (!control) {\r\n            control = PropertyLedger.DefaultControl;\r\n        }\r\n\r\n        return React.createElement(control, { stateManager: this._stateManager, nodeData: this.content });\r\n    }\r\n\r\n    public _forceRebuild(source: any, propertyName: string, notifiers?: IEditablePropertyOption[\"notifiers\"]) {\r\n        for (const refresh of this._visualPropertiesRefresh) {\r\n            refresh();\r\n        }\r\n        ForceRebuild(source, this._stateManager, propertyName, notifiers, false);\r\n    }\r\n\r\n    private _isCollapsed = false;\r\n\r\n    /**\r\n     * Collapse the node\r\n     */\r\n    public collapse() {\r\n        this._headerCollapse.classList.add(localStyles.collapsed);\r\n        const inputs = this._inputPorts.filter((p) => !p.portData.isConnected);\r\n\r\n        for (const p of inputs) {\r\n            p.container.classList.add(commonStyles.hidden);\r\n        }\r\n\r\n        const outputs = this._outputPorts.filter((p) => !p.portData.isConnected);\r\n\r\n        for (const p of outputs) {\r\n            p.container.classList.add(commonStyles.hidden);\r\n        }\r\n\r\n        this._refreshLinks();\r\n    }\r\n\r\n    /**\r\n     * Expand the node\r\n     */\r\n    public expand() {\r\n        this._headerCollapse.classList.remove(localStyles.collapsed);\r\n        const inputs = this._inputPorts.filter((p) => !p.portData.isConnected);\r\n        for (const p of inputs) {\r\n            p.container.classList.remove(commonStyles.hidden);\r\n        }\r\n\r\n        const outputs = this._outputPorts.filter((p) => !p.portData.isConnected);\r\n        for (const p of outputs) {\r\n            p.container.classList.remove(commonStyles.hidden);\r\n        }\r\n\r\n        this._refreshLinks();\r\n    }\r\n\r\n    private _portUICount = 0;\r\n    private _buildInputPorts(addOnly = false) {\r\n        for (const input of this.content.inputs) {\r\n            if (addOnly) {\r\n                // Search if the port already exists\r\n                const existingPort = this._inputPorts.find((p) => p.portData === input);\r\n                if (existingPort) {\r\n                    continue;\r\n                }\r\n            }\r\n\r\n            if (input.directValueDefinition) {\r\n                this._portUICount++;\r\n            }\r\n            this._inputPorts.push(NodePort.CreatePortElement(input, this, this._inputsContainer, this._displayManager, this._stateManager));\r\n        }\r\n    }\r\n\r\n    public appendVisual(root: HTMLDivElement, owner: GraphCanvasComponent) {\r\n        this._ownerCanvas = owner;\r\n\r\n        // Display manager\r\n        const displayManagerClass = DisplayLedger.RegisteredControls[this.content.getClassName()];\r\n\r\n        if (displayManagerClass) {\r\n            this._displayManager = new displayManagerClass();\r\n        }\r\n\r\n        // DOM\r\n        this._visual = root.ownerDocument.createElement(\"div\");\r\n        this._visual.classList.add(localStyles.visual);\r\n\r\n        this._visual.addEventListener(\"pointerdown\", (evt) => this._onDown(evt));\r\n        this._visual.addEventListener(\"pointerup\", (evt) => this._onUp(evt));\r\n        this._visual.addEventListener(\"pointermove\", (evt) => this._onMove(evt));\r\n\r\n        this._headerContainer = root.ownerDocument.createElement(\"div\");\r\n        this._headerContainer.classList.add(localStyles[\"header-container\"]);\r\n        this._visual.appendChild(this._headerContainer);\r\n\r\n        this._header = root.ownerDocument.createElement(\"div\");\r\n        this._header.classList.add(localStyles.header);\r\n        this._headerContainer.appendChild(this._header);\r\n\r\n        this._headerIcon = root.ownerDocument.createElement(\"div\");\r\n        this._headerIcon.classList.add(localStyles.headerIcon);\r\n        this._headerIconImg = root.ownerDocument.createElement(\"img\");\r\n        this._headerIconImg.draggable = false;\r\n        this._headerIcon.appendChild(this._headerIconImg);\r\n        this._headerContainer.appendChild(this._headerIcon);\r\n\r\n        if (this.content.inputs.length > 1 || this.content.outputs.length > 1) {\r\n            this._headerCollapse = root.ownerDocument.createElement(\"div\");\r\n            this._headerCollapse.classList.add(localStyles.headerCollapse);\r\n            this._headerCollapseImg = root.ownerDocument.createElement(\"img\");\r\n            this._headerCollapseImg.src = dropdownArrowIcon;\r\n            this._headerCollapseImg.draggable = false;\r\n            this._headerCollapse.appendChild(this._headerCollapseImg);\r\n            this._headerContainer.appendChild(this._headerCollapse);\r\n            this._headerCollapse.addEventListener(\"pointerup\", (evt) => evt.stopPropagation());\r\n            this._headerCollapse.addEventListener(\"pointermove\", (evt) => evt.stopPropagation());\r\n            this._headerCollapse.addEventListener(\"pointerdown\", (evt) => {\r\n                this._isCollapsed = !this._isCollapsed;\r\n                if (this._isCollapsed) {\r\n                    this.collapse();\r\n                } else {\r\n                    this.expand();\r\n                }\r\n                evt.stopPropagation();\r\n            });\r\n        }\r\n\r\n        this._selectionBorder = root.ownerDocument.createElement(\"div\");\r\n        this._selectionBorder.classList.add(\"selection-border\");\r\n        this._visual.appendChild(this._selectionBorder);\r\n\r\n        this._connections = root.ownerDocument.createElement(\"div\");\r\n        this._connections.classList.add(localStyles.connections);\r\n        this._visual.appendChild(this._connections);\r\n\r\n        this._optionsContainer = root.ownerDocument.createElement(\"div\");\r\n        this._optionsContainer.classList.add(localStyles.optionsContainer);\r\n        this._connections.appendChild(this._optionsContainer);\r\n\r\n        this._inputsContainer = root.ownerDocument.createElement(\"div\");\r\n        this._inputsContainer.classList.add(commonStyles.inputsContainer);\r\n        this._connections.appendChild(this._inputsContainer);\r\n\r\n        this._outputsContainer = root.ownerDocument.createElement(\"div\");\r\n        this._outputsContainer.classList.add(commonStyles.outputsContainer);\r\n        this._connections.appendChild(this._outputsContainer);\r\n\r\n        this._content = root.ownerDocument.createElement(\"div\");\r\n        this._content.classList.add(localStyles.content);\r\n        this._visual.appendChild(this._content);\r\n\r\n        root.appendChild(this._visual);\r\n\r\n        // Comments\r\n        this._comments = root.ownerDocument.createElement(\"div\");\r\n        this._comments.classList.add(localStyles.comments);\r\n\r\n        this._visual.appendChild(this._comments);\r\n\r\n        // Execution time\r\n        this._executionTime = root.ownerDocument.createElement(\"div\");\r\n        this._executionTime.classList.add(localStyles.executionTime);\r\n\r\n        this._visual.appendChild(this._executionTime);\r\n\r\n        // Options\r\n        const propStore: IPropertyDescriptionForEdition[] = this.content.data._propStore;\r\n        if (propStore) {\r\n            const source = this.content.data;\r\n\r\n            const classes: string[] = [];\r\n\r\n            let proto = Object.getPrototypeOf(source);\r\n            while (proto && proto.getClassName) {\r\n                classes.push(proto.getClassName());\r\n                proto = Object.getPrototypeOf(proto);\r\n            }\r\n\r\n            for (const { propertyName, displayName, type, options, className } of propStore) {\r\n                if (!options || !options.embedded || classes.indexOf(className) === -1) {\r\n                    continue;\r\n                }\r\n\r\n                const container = root.ownerDocument.createElement(\"div\");\r\n                container.addEventListener(\"pointerdown\", (evt) => evt.stopPropagation());\r\n                container.addEventListener(\"pointerup\", (evt) => evt.stopPropagation());\r\n                container.addEventListener(\"pointermove\", (evt) => evt.stopPropagation());\r\n                this._optionsContainer.appendChild(container);\r\n                switch (type) {\r\n                    case PropertyTypeForEdition.Boolean: {\r\n                        container.classList.add(localStyles.booleanContainer);\r\n                        const checkbox = root.ownerDocument.createElement(\"input\");\r\n                        checkbox.type = \"checkbox\";\r\n                        checkbox.id = `checkbox-${GraphNode._IdGenerator++}`;\r\n                        checkbox.checked = source[propertyName];\r\n                        this._visualPropertiesRefresh.push(() => {\r\n                            checkbox.checked = source[propertyName];\r\n                        });\r\n                        checkbox.onchange = () => {\r\n                            source[propertyName] = !source[propertyName];\r\n                            this._forceRebuild(source, propertyName, options?.notifiers);\r\n                        };\r\n                        container.appendChild(checkbox);\r\n                        const label = root.ownerDocument.createElement(\"label\");\r\n                        label.innerText = displayName;\r\n                        label.htmlFor = checkbox.id;\r\n                        container.appendChild(label);\r\n                        break;\r\n                    }\r\n                    case PropertyTypeForEdition.Int:\r\n                    case PropertyTypeForEdition.Float: {\r\n                        this._optionsContainer.appendChild(container);\r\n                        BuildFloatUI(\r\n                            container,\r\n                            root.ownerDocument,\r\n                            displayName,\r\n                            type === PropertyTypeForEdition.Int,\r\n                            source,\r\n                            propertyName,\r\n                            () => {\r\n                                this._forceRebuild(source, propertyName, options?.notifiers);\r\n                            },\r\n                            options.min,\r\n                            options.max,\r\n                            this._visualPropertiesRefresh,\r\n                            localStyles.standalone\r\n                        );\r\n                        break;\r\n                    }\r\n                    case PropertyTypeForEdition.List: {\r\n                        container.classList.add(localStyles.listContainer);\r\n                        const select = root.ownerDocument.createElement(\"div\");\r\n                        select.classList.add(localStyles.select);\r\n                        container.appendChild(select);\r\n                        const selectText = root.ownerDocument.createElement(\"div\");\r\n                        selectText.classList.add(localStyles.selectText);\r\n                        select.appendChild(selectText);\r\n                        const items = options.options as IEditablePropertyListOption[];\r\n\r\n                        this._visualPropertiesRefresh.push(() => {\r\n                            const currentValue = source[propertyName] as number;\r\n                            const matchedItem = items.find((item) => item.value === currentValue);\r\n                            // Back-compat fallback for index based lists\r\n                            const fallbackItem =\r\n                                matchedItem ?? (typeof currentValue === \"number\" && currentValue >= 0 && currentValue < items.length ? items[currentValue] : undefined);\r\n                            selectText.innerText = fallbackItem?.label ?? \"\";\r\n                        });\r\n                        const selectList = root.ownerDocument.createElement(\"div\");\r\n                        selectList.classList.add(localStyles.selectList);\r\n                        selectList.classList.add(commonStyles.hidden);\r\n                        select.appendChild(selectList);\r\n                        for (const item of items) {\r\n                            const option = root.ownerDocument.createElement(\"div\");\r\n                            option.classList.add(localStyles.option);\r\n                            option.innerText = item.label;\r\n                            option.onclick = () => {\r\n                                source[propertyName] = item.value;\r\n                                this._forceRebuild(source, propertyName, options?.notifiers);\r\n                            };\r\n                            selectList.appendChild(option);\r\n                        }\r\n\r\n                        select.onclick = () => {\r\n                            selectList.classList.toggle(commonStyles.hidden);\r\n                            select.classList.toggle(localStyles.activeNode);\r\n                            this._visual.classList.toggle(localStyles.topMost);\r\n                            this._stateManager.modalIsDisplayed = !this._stateManager.modalIsDisplayed;\r\n                        };\r\n\r\n                        select.onpointerleave = () => {\r\n                            selectList.classList.add(commonStyles.hidden);\r\n                            select.classList.remove(localStyles.activeNode);\r\n                            this._visual.classList.remove(localStyles.topMost);\r\n                            this._stateManager.modalIsDisplayed = false;\r\n                        };\r\n                    }\r\n                }\r\n            }\r\n        }\r\n\r\n        // Connections\r\n        this._buildInputPorts();\r\n\r\n        for (const output of this.content.outputs) {\r\n            this._outputPorts.push(NodePort.CreatePortElement(output, this, this._outputsContainer, this._displayManager, this._stateManager));\r\n        }\r\n\r\n        if (this._visualPropertiesRefresh.length === 0 && this._portUICount === 0) {\r\n            this._inputsContainer.classList.add(commonStyles.inputsContainerUp);\r\n        }\r\n\r\n        this.refresh();\r\n\r\n        this.content.refreshCallback = () => {\r\n            this.refresh();\r\n        };\r\n    }\r\n\r\n    public dispose() {\r\n        if (this._stateManager.activeNode === this) {\r\n            this._stateManager.activeNode = null;\r\n        }\r\n        if (this._displayManager && this._displayManager.onDispose) {\r\n            this._displayManager.onDispose(this.content, this._stateManager);\r\n        }\r\n\r\n        // notify frame observers that this node is being deleted\r\n        this._stateManager.onGraphNodeRemovalObservable.notifyObservers(this);\r\n\r\n        if (this._onSelectionChangedObserver) {\r\n            this._stateManager.onSelectionChangedObservable.remove(this._onSelectionChangedObserver);\r\n        }\r\n\r\n        if (this._onUpdateRequiredObserver) {\r\n            this._stateManager.onUpdateRequiredObservable.remove(this._onUpdateRequiredObserver);\r\n        }\r\n\r\n        if (this._onHighlightNodeObserver) {\r\n            this._stateManager.onHighlightNodeObservable.remove(this._onHighlightNodeObserver);\r\n        }\r\n\r\n        if (this._onSelectionBoxMovedObserver) {\r\n            this._stateManager.onSelectionBoxMoved.remove(this._onSelectionBoxMovedObserver);\r\n        }\r\n\r\n        if (this._visual.parentElement) {\r\n            this._visual.parentElement.removeChild(this._visual);\r\n        }\r\n\r\n        if (this._onFrameCreatedObserver) {\r\n            this._stateManager.onFrameCreatedObservable.remove(this._onFrameCreatedObserver);\r\n        }\r\n\r\n        for (const port of this._inputPorts) {\r\n            port.dispose();\r\n        }\r\n\r\n        for (const port of this._outputPorts) {\r\n            port.dispose();\r\n        }\r\n\r\n        const links = this._links.slice(0);\r\n        for (const link of links) {\r\n            link.dispose();\r\n        }\r\n\r\n        this.content.dispose();\r\n    }\r\n}\r\n"]}

package/nodeGraphSystem/stateManager.d.ts

@@ -17,6 +17,7 @@ export declare class StateManager {
     lockObject: any;
     modalIsDisplayed: boolean;
     historyStack: HistoryStack;
+    activeNode: Nullable<GraphNode>;
     onSearchBoxRequiredObservable: Observable<{
         x: number;
         y: number;

package/nodeGraphSystem/stateManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"stateManager.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/stateManager.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,wCAA6B;AAalD,MAAM,OAAO,YAAY;IAAzB;QAOI,kCAA6B,GAAG,IAAI,UAAU,EAA4B,CAAC;QAC3E,iCAA4B,GAAG,IAAI,UAAU,EAAsC,CAAC;QACpF,6BAAwB,GAAG,IAAI,UAAU,EAAc,CAAC;QACxD,+BAA0B,GAAG,IAAI,UAAU,EAAiB,CAAC;QAC7D,iCAA4B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC3D,wBAAmB,GAAG,IAAI,UAAU,EAAwB,CAAC;QAC7D,yBAAoB,GAAG,IAAI,UAAU,EAAqB,CAAC;QAC3D,sCAAiC,GAAG,IAAI,UAAU,EAAsC,CAAC;QACzF,+BAA0B,GAAG,IAAI,UAAU,EAAa,CAAC;QACzD,gCAA2B,GAAG,IAAI,UAAU,EAAQ,CAAC;QACrD,0BAAqB,GAAG,IAAI,UAAU,EAAa,CAAC;QACpD,2CAAsC,GAAG,IAAI,UAAU,EAAU,CAAC;QAClE,kCAA6B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC5D,sBAAiB,GAAG,IAAI,UAAU,EAAQ,CAAC;QAC3C,iCAA4B,GAAG,IAAI,UAAU,EAAuG,CAAC;QACrJ,8BAAyB,GAAG,IAAI,UAAU,EAAkC,CAAC;QAC7E,8BAAyB,GAAG,IAAI,UAAU,EAAW,CAAC;IA+B1D,CAAC;IAZG,mBAAmB;QACf,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACX,CAAC;QAED,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;QAE7B,UAAU,CAAC,GAAG,EAAE;YACZ,IAAI,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;YACnD,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAClC,CAAC,EAAE,CAAC,CAAC,CAAC;IACV,CAAC;CACJ","sourcesContent":["import type { Vector2 } from \"core/Maths/math.vector\";\r\nimport { Observable } from \"core/Misc/observable\";\r\nimport type { Nullable } from \"core/types\";\r\nimport type { FrameNodePort } from \"./frameNodePort\";\r\nimport type { GraphFrame } from \"./graphFrame\";\r\nimport type { GraphNode } from \"./graphNode\";\r\nimport type { INodeContainer } from \"./interfaces/nodeContainer\";\r\nimport type { INodeData } from \"./interfaces/nodeData\";\r\nimport type { IPortData } from \"./interfaces/portData\";\r\nimport type { ISelectionChangedOptions } from \"./interfaces/selectionChangedOptions\";\r\nimport type { NodePort } from \"./nodePort\";\r\nimport type { HistoryStack } from \"../historyStack\";\r\nimport type { Scene } from \"core/scene\";\r\n\r\nexport class StateManager {\r\n    data: any;\r\n    hostDocument: Document;\r\n    lockObject: any;\r\n    modalIsDisplayed: boolean;\r\n    historyStack: HistoryStack;\r\n\r\n    onSearchBoxRequiredObservable = new Observable<{ x: number; y: number }>();\r\n    onSelectionChangedObservable = new Observable<Nullable<ISelectionChangedOptions>>();\r\n    onFrameCreatedObservable = new Observable<GraphFrame>();\r\n    onUpdateRequiredObservable = new Observable<Nullable<any>>();\r\n    onGraphNodeRemovalObservable = new Observable<GraphNode>();\r\n    onSelectionBoxMoved = new Observable<ClientRect | DOMRect>();\r\n    onCandidateLinkMoved = new Observable<Nullable<Vector2>>();\r\n    onCandidatePortSelectedObservable = new Observable<Nullable<NodePort | FrameNodePort>>();\r\n    onNewNodeCreatedObservable = new Observable<GraphNode>();\r\n    onRebuildRequiredObservable = new Observable<void>();\r\n    onNodeMovedObservable = new Observable<GraphNode>();\r\n    onErrorMessageDialogRequiredObservable = new Observable<string>();\r\n    onExposePortOnFrameObservable = new Observable<GraphNode>();\r\n    onGridSizeChanged = new Observable<void>();\r\n    onNewBlockRequiredObservable = new Observable<{ type: string; targetX: number; targetY: number; needRepositioning?: boolean; smartAdd?: boolean }>();\r\n    onHighlightNodeObservable = new Observable<{ data: any; active: boolean }>();\r\n    onPreviewCommandActivated = new Observable<boolean>();\r\n\r\n    exportData: (data: any, frame?: Nullable<GraphFrame>) => string;\r\n    isElbowConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    isDebugConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    applyNodePortDesign: (data: IPortData, element: HTMLElement, imgHost: HTMLImageElement, pip: HTMLDivElement) => boolean;\r\n\r\n    getPortColor: (portData: IPortData) => string;\r\n\r\n    storeEditorData: (serializationObject: any, frame?: Nullable<GraphFrame>) => void;\r\n\r\n    getEditorDataMap: () => { [key: number]: number };\r\n\r\n    getScene?: () => Scene;\r\n\r\n    createDefaultInputData: (rootData: any, portData: IPortData, nodeContainer: INodeContainer) => Nullable<{ data: INodeData; name: string }>;\r\n\r\n    private _isRebuildQueued: boolean;\r\n\r\n    queueRebuildCommand() {\r\n        if (this._isRebuildQueued) {\r\n            return;\r\n        }\r\n\r\n        this._isRebuildQueued = true;\r\n\r\n        setTimeout(() => {\r\n            this.onRebuildRequiredObservable.notifyObservers();\r\n            this._isRebuildQueued = false;\r\n        }, 1);\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"stateManager.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/stateManager.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,wCAA6B;AAalD,MAAM,OAAO,YAAY;IAAzB;QAQI,kCAA6B,GAAG,IAAI,UAAU,EAA4B,CAAC;QAC3E,iCAA4B,GAAG,IAAI,UAAU,EAAsC,CAAC;QACpF,6BAAwB,GAAG,IAAI,UAAU,EAAc,CAAC;QACxD,+BAA0B,GAAG,IAAI,UAAU,EAAiB,CAAC;QAC7D,iCAA4B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC3D,wBAAmB,GAAG,IAAI,UAAU,EAAwB,CAAC;QAC7D,yBAAoB,GAAG,IAAI,UAAU,EAAqB,CAAC;QAC3D,sCAAiC,GAAG,IAAI,UAAU,EAAsC,CAAC;QACzF,+BAA0B,GAAG,IAAI,UAAU,EAAa,CAAC;QACzD,gCAA2B,GAAG,IAAI,UAAU,EAAQ,CAAC;QACrD,0BAAqB,GAAG,IAAI,UAAU,EAAa,CAAC;QACpD,2CAAsC,GAAG,IAAI,UAAU,EAAU,CAAC;QAClE,kCAA6B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC5D,sBAAiB,GAAG,IAAI,UAAU,EAAQ,CAAC;QAC3C,iCAA4B,GAAG,IAAI,UAAU,EAAuG,CAAC;QACrJ,8BAAyB,GAAG,IAAI,UAAU,EAAkC,CAAC;QAC7E,8BAAyB,GAAG,IAAI,UAAU,EAAW,CAAC;IA+B1D,CAAC;IAZG,mBAAmB;QACf,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACX,CAAC;QAED,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;QAE7B,UAAU,CAAC,GAAG,EAAE;YACZ,IAAI,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;YACnD,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAClC,CAAC,EAAE,CAAC,CAAC,CAAC;IACV,CAAC;CACJ","sourcesContent":["import type { Vector2 } from \"core/Maths/math.vector\";\r\nimport { Observable } from \"core/Misc/observable\";\r\nimport type { Nullable } from \"core/types\";\r\nimport type { FrameNodePort } from \"./frameNodePort\";\r\nimport type { GraphFrame } from \"./graphFrame\";\r\nimport type { GraphNode } from \"./graphNode\";\r\nimport type { INodeContainer } from \"./interfaces/nodeContainer\";\r\nimport type { INodeData } from \"./interfaces/nodeData\";\r\nimport type { IPortData } from \"./interfaces/portData\";\r\nimport type { ISelectionChangedOptions } from \"./interfaces/selectionChangedOptions\";\r\nimport type { NodePort } from \"./nodePort\";\r\nimport type { HistoryStack } from \"../historyStack\";\r\nimport type { Scene } from \"core/scene\";\r\n\r\nexport class StateManager {\r\n    data: any;\r\n    hostDocument: Document;\r\n    lockObject: any;\r\n    modalIsDisplayed: boolean;\r\n    historyStack: HistoryStack;\r\n    activeNode: Nullable<GraphNode>;\r\n\r\n    onSearchBoxRequiredObservable = new Observable<{ x: number; y: number }>();\r\n    onSelectionChangedObservable = new Observable<Nullable<ISelectionChangedOptions>>();\r\n    onFrameCreatedObservable = new Observable<GraphFrame>();\r\n    onUpdateRequiredObservable = new Observable<Nullable<any>>();\r\n    onGraphNodeRemovalObservable = new Observable<GraphNode>();\r\n    onSelectionBoxMoved = new Observable<ClientRect | DOMRect>();\r\n    onCandidateLinkMoved = new Observable<Nullable<Vector2>>();\r\n    onCandidatePortSelectedObservable = new Observable<Nullable<NodePort | FrameNodePort>>();\r\n    onNewNodeCreatedObservable = new Observable<GraphNode>();\r\n    onRebuildRequiredObservable = new Observable<void>();\r\n    onNodeMovedObservable = new Observable<GraphNode>();\r\n    onErrorMessageDialogRequiredObservable = new Observable<string>();\r\n    onExposePortOnFrameObservable = new Observable<GraphNode>();\r\n    onGridSizeChanged = new Observable<void>();\r\n    onNewBlockRequiredObservable = new Observable<{ type: string; targetX: number; targetY: number; needRepositioning?: boolean; smartAdd?: boolean }>();\r\n    onHighlightNodeObservable = new Observable<{ data: any; active: boolean }>();\r\n    onPreviewCommandActivated = new Observable<boolean>();\r\n\r\n    exportData: (data: any, frame?: Nullable<GraphFrame>) => string;\r\n    isElbowConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    isDebugConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    applyNodePortDesign: (data: IPortData, element: HTMLElement, imgHost: HTMLImageElement, pip: HTMLDivElement) => boolean;\r\n\r\n    getPortColor: (portData: IPortData) => string;\r\n\r\n    storeEditorData: (serializationObject: any, frame?: Nullable<GraphFrame>) => void;\r\n\r\n    getEditorDataMap: () => { [key: number]: number };\r\n\r\n    getScene?: () => Scene;\r\n\r\n    createDefaultInputData: (rootData: any, portData: IPortData, nodeContainer: INodeContainer) => Nullable<{ data: INodeData; name: string }>;\r\n\r\n    private _isRebuildQueued: boolean;\r\n\r\n    queueRebuildCommand() {\r\n        if (this._isRebuildQueued) {\r\n            return;\r\n        }\r\n\r\n        this._isRebuildQueued = true;\r\n\r\n        setTimeout(() => {\r\n            this.onRebuildRequiredObservable.notifyObservers();\r\n            this._isRebuildQueued = false;\r\n        }, 1);\r\n    }\r\n}\r\n"]}

package/package.json

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