@onerjs/shared-ui-components 8.38.5 → 8.38.6

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 { 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"]}
+{"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\nimport { useKeyState } from \"../hooks/keyboardHooks\";\r\n\r\nfunction CoerceStepValue(step: number, isAltKeyPressed: boolean, isShiftKeyPressed: boolean): number {\r\n    // When the alt key is pressed, decrease step by a factor of 10.\r\n    if (isAltKeyPressed) {\r\n        return step * 0.1;\r\n    }\r\n\r\n    // When the shift key is pressed, increase step by a factor of 10.\r\n    if (isShiftKeyPressed) {\r\n        return step * 10;\r\n    }\r\n\r\n    return step;\r\n}\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\r\n    // When the input does not have keyboard focus\r\n    const isUnfocusedAltKeyPressed = useKeyState(\"Alt\");\r\n    const isUnfocusedShiftKeyPressed = useKeyState(\"Shift\");\r\n\r\n    // When the input does have keyboard focus\r\n    const [isFocusedAltKeyPressed, setIsFocusedAltKeyPressed] = useState(false);\r\n    const [isFocusedShiftKeyPressed, setIsFocusedShiftKeyPressed] = useState(false);\r\n\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 = CoerceStepValue(props.step ?? 1, isUnfocusedAltKeyPressed || isFocusedAltKeyPressed, isUnfocusedShiftKeyPressed || isFocusedShiftKeyPressed);\r\n    const precision = Math.min(4, Math.max(0, CalculatePrecision(step))); // 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 handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\r\n        if (event.key === \"Alt\") {\r\n            setIsFocusedAltKeyPressed(true);\r\n        } else if (event.key === \"Shift\") {\r\n            setIsFocusedShiftKeyPressed(true);\r\n        }\r\n\r\n        HandleKeyDown(event);\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            if (event.key === \"Alt\") {\r\n                setIsFocusedAltKeyPressed(false);\r\n            } else if (event.key === \"Shift\") {\r\n                setIsFocusedShiftKeyPressed(false);\r\n            }\r\n\r\n            // Allow arbitrary expressions, primarily for math operations (e.g. 10*60 for 10 minutes in seconds).\r\n            // Use Function constructor to safely evaluate the expression without allowing access to scope.\r\n            // If the expression is invalid, fallback to NaN which will be caught by validateValue and prevent committing.\r\n            const currVal = ((val: string): number => {\r\n                try {\r\n                    return Number(Function(`\"use strict\";return (${val})`)());\r\n                } catch {\r\n                    return NaN;\r\n                }\r\n            })((event.target as any).value);\r\n\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            onKeyDown={handleKeyDown}\r\n            onKeyUp={handleKeyUp}\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/toast.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FluentProvider, Toast, ToastBody, Toaster, useId, useToastController, useFluent } from "@fluentui/react-components";
+import { FluentProvider, Toast, Toaster, ToastTitle, useFluent, useId, useToastController } from "@fluentui/react-components";
 import { createContext, useCallback, useContext } from "react";
 const ToastContext = createContext({ showToast: () => { } });
 export const ToastProvider = ({ children }) => {
@@ -7,7 +7,7 @@ export const ToastProvider = ({ children }) => {
     const { dispatchToast } = useToastController(toasterId);
     const { targetDocument } = useFluent();
     const showToast = useCallback((message) => {
-        dispatchToast(_jsx(Toast, { children: _jsx(ToastBody, { children: message }) }), { intent: "success", timeout: 1000 });
+        dispatchToast(_jsx(Toast, { children: _jsx(ToastTitle, { children: message }) }), { intent: "info", timeout: 2000 });
     }, [dispatchToast]);
     return (_jsxs(ToastContext.Provider, { value: { showToast }, children: [children, _jsx(FluentProvider, { applyStylesToPortals: true, targetDocument: targetDocument, children: _jsx(Toaster, { toasterId: toasterId, position: "bottom-end" }) })] }));
 };

package/fluent/primitives/toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/toast.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAE7H,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAM/D,MAAM,YAAY,GAAG,aAAa,CAAmB,EAAE,SAAS,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,CAAC,CAAC;AAE9E,MAAM,CAAC,MAAM,aAAa,GAAyC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAChF,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;IACnC,MAAM,EAAE,aAAa,EAAE,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxD,MAAM,EAAE,cAAc,EAAE,GAAG,SAAS,EAAE,CAAC;IAEvC,MAAM,SAAS,GAAG,WAAW,CACzB,CAAC,OAAe,EAAE,EAAE;QAChB,aAAa,CACT,KAAC,KAAK,cACF,KAAC,SAAS,cAAE,OAAO,GAAa,GAC5B,EACR,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,CACvC,CAAC;IACN,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,OAAO,CACH,MAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,SAAS,EAAE,aACtC,QAAQ,EACT,KAAC,cAAc,IAAC,oBAAoB,QAAC,cAAc,EAAE,cAAc,YAC/D,KAAC,OAAO,IAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAC,YAAY,GAAG,GAC1C,IACG,CAC3B,CAAC;AACN,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,UAAU,QAAQ;IACpB,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC;AACpC,CAAC","sourcesContent":["import { FluentProvider, Toast, ToastBody, Toaster, useId, useToastController, useFluent } from \"@fluentui/react-components\";\r\nimport type { FunctionComponent, PropsWithChildren } from \"react\";\r\nimport { createContext, useCallback, useContext } from \"react\";\r\n\r\ntype ToastContextType = {\r\n    showToast: (message: string) => void;\r\n};\r\n\r\nconst ToastContext = createContext<ToastContextType>({ showToast: () => {} });\r\n\r\nexport const ToastProvider: FunctionComponent<PropsWithChildren> = ({ children }) => {\r\n    const toasterId = useId(\"toaster\");\r\n    const { dispatchToast } = useToastController(toasterId);\r\n    const { targetDocument } = useFluent();\r\n\r\n    const showToast = useCallback(\r\n        (message: string) => {\r\n            dispatchToast(\r\n                <Toast>\r\n                    <ToastBody>{message}</ToastBody>\r\n                </Toast>,\r\n                { intent: \"success\", timeout: 1000 }\r\n            );\r\n        },\r\n        [dispatchToast]\r\n    );\r\n\r\n    return (\r\n        <ToastContext.Provider value={{ showToast }}>\r\n            {children}\r\n            <FluentProvider applyStylesToPortals targetDocument={targetDocument}>\r\n                <Toaster toasterId={toasterId} position=\"bottom-end\" />\r\n            </FluentProvider>\r\n        </ToastContext.Provider>\r\n    );\r\n};\r\n\r\n/**\r\n * Hook to show toast notifications.\r\n * @returns Object with showToast function that accepts a message string\r\n */\r\nexport function useToast() {\r\n    return useContext(ToastContext);\r\n}\r\n"]}
+{"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/toast.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAC9H,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAM/D,MAAM,YAAY,GAAG,aAAa,CAAmB,EAAE,SAAS,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,CAAC,CAAC;AAE9E,MAAM,CAAC,MAAM,aAAa,GAAyC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAChF,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;IACnC,MAAM,EAAE,aAAa,EAAE,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxD,MAAM,EAAE,cAAc,EAAE,GAAG,SAAS,EAAE,CAAC;IAEvC,MAAM,SAAS,GAAG,WAAW,CACzB,CAAC,OAAe,EAAE,EAAE;QAChB,aAAa,CACT,KAAC,KAAK,cACF,KAAC,UAAU,cAAE,OAAO,GAAc,GAC9B,EACR,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CACpC,CAAC;IACN,CAAC,EACD,CAAC,aAAa,CAAC,CAClB,CAAC;IAEF,OAAO,CACH,MAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,SAAS,EAAE,aACtC,QAAQ,EACT,KAAC,cAAc,IAAC,oBAAoB,QAAC,cAAc,EAAE,cAAc,YAC/D,KAAC,OAAO,IAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAC,YAAY,GAAG,GAC1C,IACG,CAC3B,CAAC;AACN,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,UAAU,QAAQ;IACpB,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC;AACpC,CAAC","sourcesContent":["import type { FunctionComponent, PropsWithChildren } from \"react\";\r\n\r\nimport { FluentProvider, Toast, Toaster, ToastTitle, useFluent, useId, useToastController } from \"@fluentui/react-components\";\r\nimport { createContext, useCallback, useContext } from \"react\";\r\n\r\ntype ToastContextType = {\r\n    showToast: (message: string) => void;\r\n};\r\n\r\nconst ToastContext = createContext<ToastContextType>({ showToast: () => {} });\r\n\r\nexport const ToastProvider: FunctionComponent<PropsWithChildren> = ({ children }) => {\r\n    const toasterId = useId(\"toaster\");\r\n    const { dispatchToast } = useToastController(toasterId);\r\n    const { targetDocument } = useFluent();\r\n\r\n    const showToast = useCallback(\r\n        (message: string) => {\r\n            dispatchToast(\r\n                <Toast>\r\n                    <ToastTitle>{message}</ToastTitle>\r\n                </Toast>,\r\n                { intent: \"info\", timeout: 2000 }\r\n            );\r\n        },\r\n        [dispatchToast]\r\n    );\r\n\r\n    return (\r\n        <ToastContext.Provider value={{ showToast }}>\r\n            {children}\r\n            <FluentProvider applyStylesToPortals targetDocument={targetDocument}>\r\n                <Toaster toasterId={toasterId} position=\"bottom-end\" />\r\n            </FluentProvider>\r\n        </ToastContext.Provider>\r\n    );\r\n};\r\n\r\n/**\r\n * Hook to show toast notifications.\r\n * @returns Object with showToast function that accepts a message string\r\n */\r\nexport function useToast() {\r\n    return useContext(ToastContext);\r\n}\r\n"]}

package/fluent/primitives/utils.d.ts

@@ -28,7 +28,7 @@ export declare const CustomTokens: {
     rightAlignOffset: string;
 };
 export declare const UniformWidthStyling: GriffelStyle;
-export declare const useInputStyles: () => Record<"input" | "container" | "inputSlot" | "invalid", string>;
+export declare const useInputStyles: () => Record<"input" | "container" | "invalid" | "inputSlot", string>;
 export declare function HandleOnBlur(event: FocusEvent<HTMLInputElement>): void;
 export declare function HandleKeyDown(event: KeyboardEvent<HTMLInputElement>): void;
 /**

package/nodeGraphSystem/graphCanvas.js

@@ -337,6 +337,9 @@ export class GraphCanvasComponent extends React.Component {
         if (this.selectedLink) {
             needRebuild = true;
             this.selectedLink.dispose();
+            if (this.selectedLink.nodeB) {
+                RefreshNode(this.selectedLink.nodeB);
+            }
         }
         if (this.selectedFrames.length) {
             needRebuild = true;