npm - @babylonjs/shared-ui-components - Versions diffs - 9.0.0 → 9.1.0 - Mend

@babylonjs/shared-ui-components 9.0.0 → 9.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (353) hide show

package/fluent/primitives/syncedSlider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"syncedSlider.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/syncedSlider.tsx"],"names":[],"mappings":";~~AACA~~,OAAO,EAAE,~~UAAU~~,EAAE,~~YAAY~~,EAAE,MAAM,~~4BAA4B~~,CAAC;~~AACtE~~,OAAO,EAAE,UAAU,EAAE,MAAM,~~cAAc~~,CAAC;~~AAC1C~~,OAAO,EAAE,~~MAAM~~,EAAE,MAAM,~~UAAU~~,CAAC;~~AAClC~~,OAAO,EAAE,~~SAAS,EAAE,QAAQ,EAAE,~~MAAM,EAAE,MAAM,~~OAAO~~,CAAC;~~AAEpD~~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","sourcesContent":["import type { FunctionComponent } from \"react\";\r\nimport { makeStyles, mergeClasses } from \"@fluentui/react-components\";\r\nimport { SpinButton } from \"./spinButton\";\r\nimport { Slider } from \"./slider\";\r\nimport { ~~useEffect, useState, useRef } from \"react\";\r\nimport~~ type { PrimitiveProps } from \"./primitive\";\r\nimport { InfoLabel } from \"./infoLabel\";\r\n\r\nconst useSyncedSliderStyles = makeStyles({\r\n container: { display: \"flex\", minWidth: 0 },\r\n syncedSlider: {\r\n flex: \"1 1 0\",\r\n flexDirection: \"row\",\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n minWidth: 0,\r\n },\r\n // Default: 50/50 split between slider and spinbutton\r\n slider: {\r\n flex: \"1 1 0\",\r\n minWidth: 0,\r\n },\r\n spinButton: {\r\n flex: \"1 1 0\",\r\n minWidth: 0,\r\n },\r\n spinButtonInput: {\r\n minWidth: \"0\",\r\n },\r\n // compact/growSlider overrides for standalone (non-PropertyLine) usage\r\n compactSlider: {\r\n flex: \"1 1 auto\",\r\n minWidth: \"50px\",\r\n maxWidth: \"75px\",\r\n },\r\n growSlider: {\r\n flex: \"1 1 auto\",\r\n minWidth: \"50px\",\r\n },\r\n compactSpinButton: {\r\n width: \"65px\",\r\n minWidth: \"65px\",\r\n maxWidth: \"65px\",\r\n },\r\n compactSpinButtonInput: {\r\n minWidth: \"0\",\r\n },\r\n});\r\n\r\nexport type SyncedSliderProps = PrimitiveProps<number> & {\r\n /** Minimum value for the slider /\r\n min?: number;\r\n /* Maximum value for the slider /\r\n max?: number;\r\n /* Step size for the slider /\r\n step?: number;\r\n /* Optional fixed precision (number of decimal digits). Overrides the automatically computed display precision. /\r\n precision?: number;\r\n /* Displayed in the ux to indicate unit of measurement /\r\n unit?: string;\r\n /* When true, onChange is only called when the user releases the slider, not during drag /\r\n notifyOnlyOnRelease?: boolean;\r\n /* When true, slider grows to fill space and SpinButton is fixed at 65px /\r\n compact?: boolean;\r\n /* When true, slider grows to fill all available space (no maxWidth constraint) /\r\n growSlider?: boolean;\r\n};\r\n\r\n/\r\n Component which synchronizes a slider and an input field, allowing the user to change the value using either control\r\n * @param props\r\n * @returns SyncedSlider component\r\n */\r\nexport const SyncedSliderInput: FunctionComponent<SyncedSliderProps> = (props) => {\r\n SyncedSliderInput.displayName = \"SyncedSliderInput\";\r\n const { infoLabel, ...passthroughProps } = props;\r\n const classes = useSyncedSliderStyles();\r\n const [value, setValue] = useState<number>(props.value ?? 0);\r\n const pendingValueRef = useRef<number>(undefined);\r\n const isDraggingRef = useRef(false);\r\n\r\n useEffect(() => {\r\n !isDraggingRef.current && setValue(props.value ?? 0); // Update local state when props.value changes as long as user is not actively dragging\r\n }, [props.value]);\r\n\r\n const handleSliderChange = (newValue: number) => {\r\n setValue(newValue);\r\n\r\n if (props.notifyOnlyOnRelease) {\r\n // Store the value but don't notify parent yet\r\n pendingValueRef.current = newValue;\r\n } else {\r\n // Notify parent as slider changes\r\n props.onChange(newValue);\r\n }\r\n };\r\n\r\n const handleSliderPointerDown = () => {\r\n isDraggingRef.current = true;\r\n };\r\n\r\n const handleSliderPointerUp = () => {\r\n if (props.notifyOnlyOnRelease && isDraggingRef.current && pendingValueRef.current !== undefined) {\r\n props.onChange(pendingValueRef.current);\r\n pendingValueRef.current = undefined;\r\n }\r\n isDraggingRef.current = false;\r\n };\r\n\r\n const handleInputChange = (value: number) => {\r\n setValue(value);\r\n props.onChange(value); // Input always updates immediately\r\n };\r\n\r\n const hasSlider = props.min !== undefined && props.max !== undefined;\r\n const useCompactSizing = props.compact \|\| props.growSlider;\r\n\r\n const getSliderClassName = () => {\r\n if (props.growSlider) {\r\n return classes.growSlider;\r\n }\r\n if (props.compact) {\r\n return classes.compactSlider;\r\n }\r\n return classes.slider;\r\n };\r\n\r\n return (\r\n <div className={mergeClasses(classes.container, props.className)}>\r\n {infoLabel && <InfoLabel {...infoLabel} htmlFor={\"syncedSlider\"} />}\r\n <div id=\"syncedSlider\" className={classes.syncedSlider}>\r\n {hasSlider && (\r\n <Slider\r\n className={getSliderClassName()}\r\n value={value}\r\n onChange={handleSliderChange}\r\n min={props.min}\r\n max={props.max}\r\n step={props.step}\r\n disabled={props.disabled}\r\n onPointerDown={handleSliderPointerDown}\r\n onPointerUp={handleSliderPointerUp}\r\n />\r\n )}\r\n <SpinButton\r\n {...passthroughProps}\r\n className={useCompactSizing ? classes.compactSpinButton : classes.spinButton}\r\n inputClassName={useCompactSizing ? classes.compactSpinButtonInput : classes.spinButtonInput}\r\n value={value}\r\n onChange={handleInputChange}\r\n step={props.step}\r\n disabled={props.disabled}\r\n disableDragButton\r\n />\r\n </div>\r\n </div>\r\n );\r\n};\r\n"]}
1	+ {"version":3,"file":"syncedSlider.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/syncedSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { type FunctionComponent, useEffect, useState, useRef } from \"react\";\r\nimport { makeStyles, mergeClasses } from \"@fluentui/react-components\";\r\nimport { SpinButton } from \"./spinButton\";\r\nimport { Slider } from \"./slider\";\r\nimport { type PrimitiveProps } from \"./primitive\";\r\nimport { InfoLabel } from \"./infoLabel\";\r\n\r\nconst useSyncedSliderStyles = makeStyles({\r\n container: { display: \"flex\", minWidth: 0 },\r\n syncedSlider: {\r\n flex: \"1 1 0\",\r\n flexDirection: \"row\",\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n minWidth: 0,\r\n },\r\n // Default: 50/50 split between slider and spinbutton\r\n slider: {\r\n flex: \"1 1 0\",\r\n minWidth: 0,\r\n },\r\n spinButton: {\r\n flex: \"1 1 0\",\r\n minWidth: 0,\r\n },\r\n spinButtonInput: {\r\n minWidth: \"0\",\r\n },\r\n // compact/growSlider overrides for standalone (non-PropertyLine) usage\r\n compactSlider: {\r\n flex: \"1 1 auto\",\r\n minWidth: \"50px\",\r\n maxWidth: \"75px\",\r\n },\r\n growSlider: {\r\n flex: \"1 1 auto\",\r\n minWidth: \"50px\",\r\n },\r\n compactSpinButton: {\r\n width: \"65px\",\r\n minWidth: \"65px\",\r\n maxWidth: \"65px\",\r\n },\r\n compactSpinButtonInput: {\r\n minWidth: \"0\",\r\n },\r\n});\r\n\r\nexport type SyncedSliderProps = PrimitiveProps<number> & {\r\n /** Minimum value for the slider /\r\n min?: number;\r\n /* Maximum value for the slider /\r\n max?: number;\r\n /* Step size for the slider /\r\n step?: number;\r\n /* Optional fixed precision (number of decimal digits). Overrides the automatically computed display precision. /\r\n precision?: number;\r\n /* Displayed in the ux to indicate unit of measurement /\r\n unit?: string;\r\n /* When true, onChange is only called when the user releases the slider, not during drag /\r\n notifyOnlyOnRelease?: boolean;\r\n /* When true, slider grows to fill space and SpinButton is fixed at 65px /\r\n compact?: boolean;\r\n /* When true, slider grows to fill all available space (no maxWidth constraint) /\r\n growSlider?: boolean;\r\n};\r\n\r\n/\r\n Component which synchronizes a slider and an input field, allowing the user to change the value using either control\r\n * @param props\r\n * @returns SyncedSlider component\r\n */\r\nexport const SyncedSliderInput: FunctionComponent<SyncedSliderProps> = (props) => {\r\n SyncedSliderInput.displayName = \"SyncedSliderInput\";\r\n const { infoLabel, ...passthroughProps } = props;\r\n const classes = useSyncedSliderStyles();\r\n const [value, setValue] = useState<number>(props.value ?? 0);\r\n const pendingValueRef = useRef<number>(undefined);\r\n const isDraggingRef = useRef(false);\r\n\r\n useEffect(() => {\r\n !isDraggingRef.current && setValue(props.value ?? 0); // Update local state when props.value changes as long as user is not actively dragging\r\n }, [props.value]);\r\n\r\n const handleSliderChange = (newValue: number) => {\r\n setValue(newValue);\r\n\r\n if (props.notifyOnlyOnRelease) {\r\n // Store the value but don't notify parent yet\r\n pendingValueRef.current = newValue;\r\n } else {\r\n // Notify parent as slider changes\r\n props.onChange(newValue);\r\n }\r\n };\r\n\r\n const handleSliderPointerDown = () => {\r\n isDraggingRef.current = true;\r\n };\r\n\r\n const handleSliderPointerUp = () => {\r\n if (props.notifyOnlyOnRelease && isDraggingRef.current && pendingValueRef.current !== undefined) {\r\n props.onChange(pendingValueRef.current);\r\n pendingValueRef.current = undefined;\r\n }\r\n isDraggingRef.current = false;\r\n };\r\n\r\n const handleInputChange = (value: number) => {\r\n setValue(value);\r\n props.onChange(value); // Input always updates immediately\r\n };\r\n\r\n const hasSlider = props.min !== undefined && props.max !== undefined;\r\n const useCompactSizing = props.compact \|\| props.growSlider;\r\n\r\n const getSliderClassName = () => {\r\n if (props.growSlider) {\r\n return classes.growSlider;\r\n }\r\n if (props.compact) {\r\n return classes.compactSlider;\r\n }\r\n return classes.slider;\r\n };\r\n\r\n return (\r\n <div className={mergeClasses(classes.container, props.className)}>\r\n {infoLabel && <InfoLabel {...infoLabel} htmlFor={\"syncedSlider\"} />}\r\n <div id=\"syncedSlider\" className={classes.syncedSlider}>\r\n {hasSlider && (\r\n <Slider\r\n className={getSliderClassName()}\r\n value={value}\r\n onChange={handleSliderChange}\r\n min={props.min}\r\n max={props.max}\r\n step={props.step}\r\n disabled={props.disabled}\r\n onPointerDown={handleSliderPointerDown}\r\n onPointerUp={handleSliderPointerUp}\r\n />\r\n )}\r\n <SpinButton\r\n {...passthroughProps}\r\n className={useCompactSizing ? classes.compactSpinButton : classes.spinButton}\r\n inputClassName={useCompactSizing ? classes.compactSpinButtonInput : classes.spinButtonInput}\r\n value={value}\r\n onChange={handleInputChange}\r\n step={props.step}\r\n disabled={props.disabled}\r\n disableDragButton\r\n />\r\n </div>\r\n </div>\r\n );\r\n};\r\n"]}

package/fluent/primitives/textInput.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { FunctionComponent } from "react";
-import type { PrimitiveProps } from "./primitive.js";
+import { type FunctionComponent } from "react";
+import { type PrimitiveProps } from "./primitive.js";
 export type TextInputProps = PrimitiveProps<string> & {
     validator?: (value: string) => boolean;
     validateOnlyOnBlur?: boolean;

package/fluent/primitives/textInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"textInput.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/textInput.tsx"],"names":[],"mappings":";~~AACA~~,OAAO,~~EAAE~~,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;~~AAEhE~~,OAAO,~~EAAE~~,KAAK,IAAI,WAAW,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;~~AAEvF~~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","sourcesContent":["import type { FunctionComponent, KeyboardEvent, ChangeEvent, FocusEvent ~~} from \"react\";\r\nimport {~~ useContext, useEffect, useRef, useState } from \"react\";\r\nimport type { InputOnChangeData ~~} from \"@fluentui/react-components\";\r\nimport {~~ Input as FluentInput, mergeClasses, useId } from \"@fluentui/react-components\";\r\nimport type { PrimitiveProps } from \"./primitive\";\r\nimport { InfoLabel } from \"./infoLabel\";\r\nimport { HandleKeyDown, HandleOnBlur, useInputStyles } from \"./utils\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\n\r\nexport type TextInputProps = PrimitiveProps<string> & {\r\n validator?: (value: string) => boolean;\r\n validateOnlyOnBlur?: boolean;\r\n};\r\n\r\nexport const TextInput: FunctionComponent<TextInputProps> = (props) => {\r\n TextInput.displayName = \"TextInput\";\r\n const classes = useInputStyles();\r\n const [value, setValue] = useState(props.value);\r\n const lastCommittedValue = useRef(props.value);\r\n const { size } = useContext(ToolContext);\r\n useEffect(() => {\r\n if (props.value !== lastCommittedValue.current) {\r\n setValue(props.value); // Update local state when props.value changes\r\n lastCommittedValue.current = props.value;\r\n }\r\n }, [props.value]);\r\n\r\n const validateValue = (val: string): boolean => {\r\n if (!props.validator) {\r\n return true;\r\n }\r\n return props.validator(val);\r\n };\r\n\r\n const tryCommitValue = (currVal: string) => {\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: ChangeEvent<HTMLInputElement>, data: InputOnChangeData) => {\r\n event.stopPropagation();\r\n setValue(data.value);\r\n if (!props.validateOnlyOnBlur) {\r\n tryCommitValue(data.value);\r\n }\r\n };\r\n\r\n const handleKeyUp = (event: KeyboardEvent<HTMLInputElement>) => {\r\n event.stopPropagation();\r\n if (!props.validateOnlyOnBlur) {\r\n tryCommitValue(event.currentTarget.value);\r\n }\r\n };\r\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\r\n HandleKeyDown(event);\r\n // When validateOnlyOnBlur is set, also commit on Enter for better UX\r\n if (event.key === \"Enter\" && props.validateOnlyOnBlur) {\r\n tryCommitValue(event.currentTarget.value);\r\n }\r\n };\r\n\r\n const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\r\n HandleOnBlur(event);\r\n if (props.validateOnlyOnBlur) {\r\n tryCommitValue(event.currentTarget.value);\r\n }\r\n };\r\n\r\n const mergedClassName = mergeClasses(classes.inputFill, !validateValue(value) ? classes.invalid : \"\");\r\n\r\n const id = useId(\"input-button\");\r\n return (\r\n <div className={mergeClasses(classes.container, props.className)}>\r\n {props.infoLabel && <InfoLabel {...props.infoLabel} htmlFor={id} />}\r\n <FluentInput\r\n {...props}\r\n input={{ className: classes.inputSlot }}\r\n id={id}\r\n size={size}\r\n value={value}\r\n onChange={handleChange}\r\n onKeyUp={handleKeyUp}\r\n onKeyDown={handleKeyDown}\r\n onBlur={handleBlur}\r\n className={mergedClassName}\r\n />\r\n </div>\r\n );\r\n};\r\n"]}
1	+ {"version":3,"file":"textInput.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/textInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { type FunctionComponent, type KeyboardEvent, type ChangeEvent, type FocusEvent, useContext, useEffect, useRef, useState } from \"react\";\r\nimport { type InputOnChangeData, Input as FluentInput, mergeClasses, useId } from \"@fluentui/react-components\";\r\nimport { type PrimitiveProps } from \"./primitive\";\r\nimport { InfoLabel } from \"./infoLabel\";\r\nimport { HandleKeyDown, HandleOnBlur, useInputStyles } from \"./utils\";\r\nimport { ToolContext } from \"../hoc/fluentToolWrapper\";\r\n\r\nexport type TextInputProps = PrimitiveProps<string> & {\r\n validator?: (value: string) => boolean;\r\n validateOnlyOnBlur?: boolean;\r\n};\r\n\r\nexport const TextInput: FunctionComponent<TextInputProps> = (props) => {\r\n TextInput.displayName = \"TextInput\";\r\n const classes = useInputStyles();\r\n const [value, setValue] = useState(props.value);\r\n const lastCommittedValue = useRef(props.value);\r\n const { size } = useContext(ToolContext);\r\n useEffect(() => {\r\n if (props.value !== lastCommittedValue.current) {\r\n setValue(props.value); // Update local state when props.value changes\r\n lastCommittedValue.current = props.value;\r\n }\r\n }, [props.value]);\r\n\r\n const validateValue = (val: string): boolean => {\r\n if (!props.validator) {\r\n return true;\r\n }\r\n return props.validator(val);\r\n };\r\n\r\n const tryCommitValue = (currVal: string) => {\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: ChangeEvent<HTMLInputElement>, data: InputOnChangeData) => {\r\n event.stopPropagation();\r\n setValue(data.value);\r\n if (!props.validateOnlyOnBlur) {\r\n tryCommitValue(data.value);\r\n }\r\n };\r\n\r\n const handleKeyUp = (event: KeyboardEvent<HTMLInputElement>) => {\r\n event.stopPropagation();\r\n if (!props.validateOnlyOnBlur) {\r\n tryCommitValue(event.currentTarget.value);\r\n }\r\n };\r\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\r\n HandleKeyDown(event);\r\n // When validateOnlyOnBlur is set, also commit on Enter for better UX\r\n if (event.key === \"Enter\" && props.validateOnlyOnBlur) {\r\n tryCommitValue(event.currentTarget.value);\r\n }\r\n };\r\n\r\n const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\r\n HandleOnBlur(event);\r\n if (props.validateOnlyOnBlur) {\r\n tryCommitValue(event.currentTarget.value);\r\n }\r\n };\r\n\r\n const mergedClassName = mergeClasses(classes.inputFill, !validateValue(value) ? classes.invalid : \"\");\r\n\r\n const id = useId(\"input-button\");\r\n return (\r\n <div className={mergeClasses(classes.container, props.className)}>\r\n {props.infoLabel && <InfoLabel {...props.infoLabel} htmlFor={id} />}\r\n <FluentInput\r\n {...props}\r\n input={{ className: classes.inputSlot }}\r\n id={id}\r\n size={size}\r\n value={value}\r\n onChange={handleChange}\r\n onKeyUp={handleKeyUp}\r\n onKeyDown={handleKeyDown}\r\n onBlur={handleBlur}\r\n className={mergedClassName}\r\n />\r\n </div>\r\n );\r\n};\r\n"]}

package/fluent/primitives/textarea.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { FunctionComponent } from "react";
-import type { PrimitiveProps } from "./primitive.js";
+import { type FunctionComponent } from "react";
+import { type PrimitiveProps } from "./primitive.js";
 export type TextareaProps = PrimitiveProps<string> & {
     placeholder?: string;
 };

package/fluent/primitives/textarea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/textarea.tsx"],"names":[],"mappings":";~~AACA~~,OAAO,~~EAAE~~,QAAQ,IAAI,cAAc,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;~~AAIpF~~,MAAM,cAAc,GAAG,UAAU,CAAC;IAC9B,QAAQ,EAAE;QACN,SAAS,EAAE,OAAO;QAClB,SAAS,EAAE,OAAO;KACrB;CACJ,CAAC,CAAC;AAMH;;;;GAIG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAqC,CAAC,KAAK,EAAE,EAAE;IAChE,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;IAElC,MAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IACjC,MAAM,YAAY,GAAG,CAAC,KAAuC,EAAE,KAA2B,EAAE,EAAE;QAC1F,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC,4BAA4B;QACrD,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;YACjB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,oDAAoD;QAC5F,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,KAAyC,EAAE,EAAE;QAChE,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC,4BAA4B;IACzD,CAAC,CAAC;IAEF,OAAO,KAAC,cAAc,OAAK,KAAK,EAAE,QAAQ,EAAE,EAAE,SAAS,EAAE,OAAO,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,GAAI,CAAC;AACtI,CAAC,CAAC","sourcesContent":["import type { TextareaOnChangeData ~~} from \"@fluentui/react-components\";\r\nimport {~~ Textarea as FluentTextarea, makeStyles } from \"@fluentui/react-components\";\r\nimport type { FunctionComponent, KeyboardEvent, ChangeEvent } from \"react\";\r\nimport type { PrimitiveProps } from \"./primitive\";\r\n\r\nconst useInputStyles = makeStyles({\r\n textarea: {\r\n minHeight: \"100px\",\r\n maxHeight: \"500px\",\r\n },\r\n});\r\n\r\nexport type TextareaProps = PrimitiveProps<string> & {\r\n placeholder?: string;\r\n};\r\n\r\n/*\r\n This is a texarea box that stops propagation of change/keydown events\r\n * @param props\r\n * @returns\r\n */\r\nexport const Textarea: FunctionComponent<TextareaProps> = (props) => {\r\n Textarea.displayName = \"Textarea\";\r\n\r\n const classes = useInputStyles();\r\n const handleChange = (event: ChangeEvent<HTMLTextAreaElement>, _data: TextareaOnChangeData) => {\r\n event.stopPropagation(); // Prevent event propagation\r\n if (props.onChange) {\r\n props.onChange(event.target.value); // Call the original onChange handler passed as prop\r\n }\r\n };\r\n\r\n const handleKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {\r\n event.stopPropagation(); // Prevent event propagation\r\n };\r\n\r\n return <FluentTextarea {...props} textarea={{ className: classes.textarea }} onChange={handleChange} onKeyDown={handleKeyDown} />;\r\n};\r\n"]}
1	+ {"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/textarea.tsx"],"names":[],"mappings":";AAAA,OAAO,EAA6B,QAAQ,IAAI,cAAc,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAI/G,MAAM,cAAc,GAAG,UAAU,CAAC;IAC9B,QAAQ,EAAE;QACN,SAAS,EAAE,OAAO;QAClB,SAAS,EAAE,OAAO;KACrB;CACJ,CAAC,CAAC;AAMH;;;;GAIG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAqC,CAAC,KAAK,EAAE,EAAE;IAChE,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;IAElC,MAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IACjC,MAAM,YAAY,GAAG,CAAC,KAAuC,EAAE,KAA2B,EAAE,EAAE;QAC1F,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC,4BAA4B;QACrD,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;YACjB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,oDAAoD;QAC5F,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,KAAyC,EAAE,EAAE;QAChE,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC,4BAA4B;IACzD,CAAC,CAAC;IAEF,OAAO,KAAC,cAAc,OAAK,KAAK,EAAE,QAAQ,EAAE,EAAE,SAAS,EAAE,OAAO,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,GAAI,CAAC;AACtI,CAAC,CAAC","sourcesContent":["import { type TextareaOnChangeData, Textarea as FluentTextarea, makeStyles } from \"@fluentui/react-components\";\r\nimport { type FunctionComponent, type KeyboardEvent, type ChangeEvent } from \"react\";\r\nimport { type PrimitiveProps } from \"./primitive\";\r\n\r\nconst useInputStyles = makeStyles({\r\n textarea: {\r\n minHeight: \"100px\",\r\n maxHeight: \"500px\",\r\n },\r\n});\r\n\r\nexport type TextareaProps = PrimitiveProps<string> & {\r\n placeholder?: string;\r\n};\r\n\r\n/*\r\n This is a texarea box that stops propagation of change/keydown events\r\n * @param props\r\n * @returns\r\n */\r\nexport const Textarea: FunctionComponent<TextareaProps> = (props) => {\r\n Textarea.displayName = \"Textarea\";\r\n\r\n const classes = useInputStyles();\r\n const handleChange = (event: ChangeEvent<HTMLTextAreaElement>, _data: TextareaOnChangeData) => {\r\n event.stopPropagation(); // Prevent event propagation\r\n if (props.onChange) {\r\n props.onChange(event.target.value); // Call the original onChange handler passed as prop\r\n }\r\n };\r\n\r\n const handleKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {\r\n event.stopPropagation(); // Prevent event propagation\r\n };\r\n\r\n return <FluentTextarea {...props} textarea={{ className: classes.textarea }} onChange={handleChange} onKeyDown={handleKeyDown} />;\r\n};\r\n"]}

package/fluent/primitives/textureSelector.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
-import type { BaseTexture } from "@babylonjs/core/Materials/Textures/baseTexture.js";
-import type { Scene } from "@babylonjs/core/scene.js";
-import type { Nullable } from "@babylonjs/core/types.js";
-import type { FunctionComponent } from "react";
-import type { PrimitiveProps } from "./primitive.js";
-import type { EntitySelectorProps } from "./entitySelector.js";
+import { type BaseTexture } from "@babylonjs/core/Materials/Textures/baseTexture.js";
+import { type Scene } from "@babylonjs/core/scene.js";
+import { type Nullable } from "@babylonjs/core/types.js";
+import { type FunctionComponent } from "react";
+import { type PrimitiveProps } from "./primitive.js";
+import { type EntitySelectorProps } from "./entitySelector.js";
 export type TextureSelectorProps = PrimitiveProps<Nullable<BaseTexture>> & {
     /**
      * The scene to get textures from

package/fluent/primitives/textureSelector.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { makeStyles, tokens } from "@fluentui/react-components";
 import { useCallback } from "react";
-import { TextureUpload } from "../hoc/textureUpload.js";
 import { EntitySelector } from "./entitySelector.js";
+import { makeStyles, tokens } from "@fluentui/react-components";
+import { TextureUpload } from "../hoc/textureUpload.js";
 const useStyles = makeStyles({
     container: {
         display: "flex",

package/fluent/primitives/textureSelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"textureSelector.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/textureSelector.tsx"],"names":[],"mappings":";~~AAOA~~,OAAO,~~EAAE~~,~~UAAU~~,EAAE,MAAM,~~EAAE~~,~~MAAM,4BAA4B,~~CAAC;~~AAChE~~,OAAO,~~EAAE~~,~~WAAW~~,EAAE,MAAM,~~OAAO~~,CAAC;~~AACpC~~,OAAO,EAAE,~~aAAa~~,EAAE,MAAM,~~sBAAsB~~,CAAC;~~AACrD~~,OAAO,EAAE,~~cAAc~~,EAAE,MAAM,~~kBAAkB~~,CAAC;~~AAElD~~,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,SAAS,EAAE;QACP,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;QACpB,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,MAAM,CAAC,kBAAkB;KACjC;CACJ,CAAC,CAAC;AAiBH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,eAAe,GAA4C,CAAC,KAAK,EAAE,EAAE;IAC9E,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC;IAChD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;IACzE,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAE5B,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IACxE,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,OAAoB,EAAE,EAAE,CAAC,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,IAAI,IAAI,GAAG,OAAO,CAAC,YAAY,EAAE,IAAI,iBAAiB,KAAK,OAAO,CAAC,QAAQ,GAAG,EAAE,EAAE,CAAC,CAAC;IACzK,MAAM,MAAM,GAAG,WAAW,CAAC,CAAC,OAAoB,EAAE,EAAE,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAE9F,OAAO,CACH,eAAK,SAAS,EAAE,OAAO,CAAC,SAAS,aAC7B,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,EAC3J,CAAC,KAAK,IAAI,KAAC,aAAa,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,GAAI,IAChF,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import type { BaseTexture } from \"core/Materials/Textures/baseTexture\";\r\nimport type { Scene } from \"core/scene\";\r\nimport type { Nullable } from \"core/types\";\r\nimport type { FunctionComponent } from \"react\";\r\nimport type { PrimitiveProps } from \"./primitive\";\r\nimport type { EntitySelectorProps } from \"./entitySelector\";\r\n\r\nimport { makeStyles, tokens } from \"@fluentui/react-components\";\r\nimport { ~~useCallback } from \"react\";\r\nimport {~~ TextureUpload } from \"../hoc/textureUpload\";\r\~~nimport { EntitySelector } from \"./entitySelector\";\r\~~n\r\nconst useStyles = makeStyles({\r\n container: {\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n alignItems: \"center\",\r\n gap: tokens.spacingHorizontalS,\r\n },\r\n});\r\n\r\nexport type TextureSelectorProps = PrimitiveProps<Nullable<BaseTexture>> & {\r\n /*\r\n The scene to get textures from\r\n /\r\n scene: Scene;\r\n /\r\n File types to accept for upload\r\n /\r\n accept?: string;\r\n /\r\n Whether to only allow cube textures\r\n /\r\n cubeOnly?: boolean;\r\n} & Omit<EntitySelectorProps<BaseTexture>, \"getEntities\" \| \"getName\">;\r\n\r\n/\r\n A primitive component with a ComboBox for selecting from existing scene textures\r\n * and a button for uploading new texture files.\r\n * @param props TextureSelectorProps\r\n * @returns TextureSelector component\r\n */\r\nexport const TextureSelector: FunctionComponent<TextureSelectorProps> = (props) => {\r\n TextureSelector.displayName = \"TextureSelector\";\r\n const { scene, cubeOnly, value, onChange, onLink, defaultValue } = props;\r\n const classes = useStyles();\r\n\r\n const getTextures = useCallback(() => scene.textures, [scene.textures]);\r\n const getName = useCallback((texture: BaseTexture) => texture.displayName \|\| texture.name \|\| `${texture.getClassName() \|\| \"Unnamed Texture\"} (${texture.uniqueId})`, []);\r\n const filter = useCallback((texture: BaseTexture) => !cubeOnly \|\| texture.isCube, [cubeOnly]);\r\n\r\n return (\r\n <div className={classes.container}>\r\n <EntitySelector value={value} onChange={onChange} onLink={onLink} defaultValue={defaultValue} getEntities={getTextures} getName={getName} filter={filter} />\r\n {!value && <TextureUpload scene={scene} onChange={onChange} cubeOnly={cubeOnly} />}\r\n </div>\r\n );\r\n};\r\n"]}
1	+ {"version":3,"file":"textureSelector.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/textureSelector.tsx"],"names":[],"mappings":";AAGA,OAAO,EAA0B,WAAW,EAAE,MAAM,OAAO,CAAC;AAE5D,OAAO,EAA4B,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE5E,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAErD,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,SAAS,EAAE;QACP,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,KAAK;QACpB,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,MAAM,CAAC,kBAAkB;KACjC;CACJ,CAAC,CAAC;AAiBH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,eAAe,GAA4C,CAAC,KAAK,EAAE,EAAE;IAC9E,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC;IAChD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,GAAG,KAAK,CAAC;IACzE,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAE5B,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IACxE,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,OAAoB,EAAE,EAAE,CAAC,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,IAAI,IAAI,GAAG,OAAO,CAAC,YAAY,EAAE,IAAI,iBAAiB,KAAK,OAAO,CAAC,QAAQ,GAAG,EAAE,EAAE,CAAC,CAAC;IACzK,MAAM,MAAM,GAAG,WAAW,CAAC,CAAC,OAAoB,EAAE,EAAE,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAE9F,OAAO,CACH,eAAK,SAAS,EAAE,OAAO,CAAC,SAAS,aAC7B,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,EAC3J,CAAC,KAAK,IAAI,KAAC,aAAa,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,GAAI,IAChF,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { type BaseTexture } from \"core/Materials/Textures/baseTexture\";\r\nimport { type Scene } from \"core/scene\";\r\nimport { type Nullable } from \"core/types\";\r\nimport { type FunctionComponent, useCallback } from \"react\";\r\nimport { type PrimitiveProps } from \"./primitive\";\r\nimport { type EntitySelectorProps, EntitySelector } from \"./entitySelector\";\r\n\r\nimport { makeStyles, tokens } from \"@fluentui/react-components\";\r\nimport { TextureUpload } from \"../hoc/textureUpload\";\r\n\r\nconst useStyles = makeStyles({\r\n container: {\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n alignItems: \"center\",\r\n gap: tokens.spacingHorizontalS,\r\n },\r\n});\r\n\r\nexport type TextureSelectorProps = PrimitiveProps<Nullable<BaseTexture>> & {\r\n /*\r\n The scene to get textures from\r\n /\r\n scene: Scene;\r\n /\r\n File types to accept for upload\r\n /\r\n accept?: string;\r\n /\r\n Whether to only allow cube textures\r\n /\r\n cubeOnly?: boolean;\r\n} & Omit<EntitySelectorProps<BaseTexture>, \"getEntities\" \| \"getName\">;\r\n\r\n/\r\n A primitive component with a ComboBox for selecting from existing scene textures\r\n * and a button for uploading new texture files.\r\n * @param props TextureSelectorProps\r\n * @returns TextureSelector component\r\n */\r\nexport const TextureSelector: FunctionComponent<TextureSelectorProps> = (props) => {\r\n TextureSelector.displayName = \"TextureSelector\";\r\n const { scene, cubeOnly, value, onChange, onLink, defaultValue } = props;\r\n const classes = useStyles();\r\n\r\n const getTextures = useCallback(() => scene.textures, [scene.textures]);\r\n const getName = useCallback((texture: BaseTexture) => texture.displayName \|\| texture.name \|\| `${texture.getClassName() \|\| \"Unnamed Texture\"} (${texture.uniqueId})`, []);\r\n const filter = useCallback((texture: BaseTexture) => !cubeOnly \|\| texture.isCube, [cubeOnly]);\r\n\r\n return (\r\n <div className={classes.container}>\r\n <EntitySelector value={value} onChange={onChange} onLink={onLink} defaultValue={defaultValue} getEntities={getTextures} getName={getName} filter={filter} />\r\n {!value && <TextureUpload scene={scene} onChange={onChange} cubeOnly={cubeOnly} />}\r\n </div>\r\n );\r\n};\r\n"]}

package/fluent/primitives/toast.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { FunctionComponent, PropsWithChildren } from "react";
+import { type FunctionComponent, type PropsWithChildren } from "react";
 type ToastContextType = {
     showToast: (message: string) => void;
 };

package/fluent/primitives/toast.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FluentProvider, Toast, Toaster, ToastTitle, useFluent, useId, useToastController } from "@fluentui/react-components";
 import { createContext, useCallback, useContext } from "react";
+import { FluentProvider, Toast, Toaster, ToastTitle, useFluent, useId, useToastController } from "@fluentui/react-components";
 const ToastContext = createContext({ showToast: () => { } });
 export const ToastProvider = ({ children }) => {
     const toasterId = useId("toaster");

package/fluent/primitives/toast.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"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,QAAQ,GAAG,GACtC,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\" />\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"]}
1	+ {"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/toast.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAkD,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE/G,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAM9H,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,QAAQ,GAAG,GACtC,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, type PropsWithChildren, createContext, useCallback, useContext } from \"react\";\r\n\r\nimport { FluentProvider, Toast, Toaster, ToastTitle, useFluent, useId, useToastController } from \"@fluentui/react-components\";\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\" />\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/toggleButton.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import type { ButtonProps } from "./button.js";
-import type { FunctionComponent } from "react";
-import type { FluentIcon } from "@fluentui/react-icons";
+import { type ButtonProps } from "./button.js";
+import { type FunctionComponent } from "react";
+import { type FluentIcon } from "@fluentui/react-icons";
 type ToggleButtonProps = Omit<ButtonProps, "icon" | "onClick"> & {
     value: boolean;
     checkedIcon: FluentIcon;

package/fluent/primitives/toggleButton.js.map CHANGED Viewed

	@@ -1 +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;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,WAAW,EAAE,EAAE;YACvB,MAAM,OAAO,GAAG,CAAC,WAAW,CAAC;YAC7B,QAAQ,CAAC,OAAO,CAAC,CAAC;YAClB,OAAO,OAAO,CAAC;QACnB,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,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((prevChecked) => {\r\n const enabled = !prevChecked;\r\n onChange(enabled);\r\n return enabled;\r\n });\r\n }, [onChange]);\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"]}
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,EAA0B,MAAM,OAAO,CAAC;AAE7F,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,WAAW,EAAE,EAAE;YACvB,MAAM,OAAO,GAAG,CAAC,WAAW,CAAC;YAC7B,QAAQ,CAAC,OAAO,CAAC,CAAC;YAClB,OAAO,OAAO,CAAC;QACnB,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,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, 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((prevChecked) => {\r\n const enabled = !prevChecked;\r\n onChange(enabled);\r\n return enabled;\r\n });\r\n }, [onChange]);\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 CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { Nullable } from "@babylonjs/core/index.js";
-import type { ReactElement } from "react";
+import { type Nullable } from "@babylonjs/core/index.js";
+import { type ReactElement } from "react";
 export type TooltipProps = {
     content?: Nullable<string>;
     children: ReactElement;

package/fluent/primitives/tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/tooltip.tsx"],"names":[],"mappings":";~~AAGA~~,OAAO,~~EAAE~~,UAAU,EAAE,MAAM,OAAO,CAAC;~~AAEnC~~,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAItE,iFAAiF;AACjF,8FAA8F;AAC9F,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAA4B,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;IACzE,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,CAAC;AAEH,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import type { Nullable } from \"core/index\";\r\n\r\nimport type { ReactElement ~~} from \"react\";\r\nimport {~~ forwardRef } 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\n// forwardRef wrapper to avoid \"function components cannot be given refs\" warning\r\n// FluentTooltip handles ref forwarding to children internally via applyTriggerPropsToChildren\r\nexport const Tooltip = forwardRef<HTMLElement, TooltipProps>((props, _ref) => {\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\r\nTooltip.displayName = \"Tooltip\";\r\n"]}
1	+ {"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/tooltip.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAqB,UAAU,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAItE,iFAAiF;AACjF,8FAA8F;AAC9F,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAA4B,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;IACzE,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,CAAC;AAEH,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import { type Nullable } from \"core/index\";\r\n\r\nimport { type ReactElement, forwardRef } 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\n// forwardRef wrapper to avoid \"function components cannot be given refs\" warning\r\n// FluentTooltip handles ref forwarding to children internally via applyTriggerPropsToChildren\r\nexport const Tooltip = forwardRef<HTMLElement, TooltipProps>((props, _ref) => {\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\r\nTooltip.displayName = \"Tooltip\";\r\n"]}

package/fluent/primitives/uploadButton.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { FunctionComponent } from "react";
-import type { ButtonProps } from "./button.js";
+import { type FunctionComponent } from "react";
+import { type ButtonProps } from "./button.js";
 type UploadButtonProps = Omit<ButtonProps, "onClick" | "icon"> & {
     /**
      * Callback when files are selected

package/fluent/primitives/uploadButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"uploadButton.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/uploadButton.tsx"],"names":[],"mappings":";~~AACA~~,OAAO,~~EAAE~~,MAAM,EAAE,MAAM,OAAO,CAAC;~~AAC/B~~,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,MAAM,~~EAAE~~,MAAM,UAAU,CAAC;~~AAkBlC~~;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAyC,CAAC,KAAK,EAAE,EAAE;IACxE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,GAAG,KAAK,CAAC;IAC1D,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;IAC1C,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAEhD,MAAM,WAAW,GAAG,GAAG,EAAE;QACrB,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,GAAwC,EAAE,EAAE;QAC9D,MAAM,KAAK,GAAG,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC;QAC/B,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;YACxB,QAAQ,CAAC,KAAK,CAAC,CAAC;QACpB,CAAC;QACD,GAAG,CAAC,MAAM,CAAC,KAAK,GAAG,EAAE,CAAC;IAC1B,CAAC,CAAC;IAEF,OAAO,CACH,8BACI,KAAC,MAAM,IAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,KAAK,IAAI,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,KAAM,WAAW,GAAI,EACnH,gBAAO,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,MAAM,EAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,YAAY,GAAI,IACzG,CACN,CAAC;AACN,CAAC,CAAC","sourcesContent":["import type { FunctionComponent ~~} from \"react\";\r\nimport {~~ useRef } from \"react\";\r\nimport { ArrowUploadRegular } from \"@fluentui/react-icons\";\r\nimport { Button ~~} from \"./button\";\r\nimport~~ type { ButtonProps } from \"./button\";\r\n\r\ntype UploadButtonProps = Omit<ButtonProps, \"onClick\" \| \"icon\"> & {\r\n /*\r\n Callback when files are selected\r\n /\r\n onUpload: (files: FileList) => void;\r\n /\r\n File types to accept (e.g., \".jpg, .png, .dds\")\r\n /\r\n accept?: string;\r\n /\r\n Text label to display on the button (optional)\r\n /\r\n label?: string;\r\n};\r\n\r\n/\r\n A button that triggers a file upload dialog.\r\n * Combines a Button with a hidden file input.\r\n * @param props UploadButtonProps\r\n * @returns UploadButton component\r\n */\r\nexport const UploadButton: FunctionComponent<UploadButtonProps> = (props) => {\r\n const { onUpload, accept, label, ...buttonProps } = props;\r\n UploadButton.displayName = \"UploadButton\";\r\n const inputRef = useRef<HTMLInputElement>(null);\r\n\r\n const handleClick = () => {\r\n inputRef.current?.click();\r\n };\r\n\r\n const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {\r\n const files = evt.target.files;\r\n if (files && files.length) {\r\n onUpload(files);\r\n }\r\n evt.target.value = \"\";\r\n };\r\n\r\n return (\r\n <>\r\n <Button icon={ArrowUploadRegular} title={label ?? \"Upload\"} label={label} onClick={handleClick} {...buttonProps} />\r\n <input ref={inputRef} type=\"file\" accept={accept} style={{ display: \"none\" }} onChange={handleChange} />\r\n </>\r\n );\r\n};\r\n"]}
1	+ {"version":3,"file":"uploadButton.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/uploadButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAA0B,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,MAAM,EAAoB,MAAM,UAAU,CAAC;AAiBpD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAyC,CAAC,KAAK,EAAE,EAAE;IACxE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,GAAG,KAAK,CAAC;IAC1D,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;IAC1C,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAEhD,MAAM,WAAW,GAAG,GAAG,EAAE;QACrB,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,GAAwC,EAAE,EAAE;QAC9D,MAAM,KAAK,GAAG,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC;QAC/B,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;YACxB,QAAQ,CAAC,KAAK,CAAC,CAAC;QACpB,CAAC;QACD,GAAG,CAAC,MAAM,CAAC,KAAK,GAAG,EAAE,CAAC;IAC1B,CAAC,CAAC;IAEF,OAAO,CACH,8BACI,KAAC,MAAM,IAAC,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,KAAK,IAAI,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,KAAM,WAAW,GAAI,EACnH,gBAAO,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,MAAM,EAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,YAAY,GAAI,IACzG,CACN,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { type FunctionComponent, useRef } from \"react\";\r\nimport { ArrowUploadRegular } from \"@fluentui/react-icons\";\r\nimport { Button, type ButtonProps } from \"./button\";\r\n\r\ntype UploadButtonProps = Omit<ButtonProps, \"onClick\" \| \"icon\"> & {\r\n /*\r\n Callback when files are selected\r\n /\r\n onUpload: (files: FileList) => void;\r\n /\r\n File types to accept (e.g., \".jpg, .png, .dds\")\r\n /\r\n accept?: string;\r\n /\r\n Text label to display on the button (optional)\r\n /\r\n label?: string;\r\n};\r\n\r\n/\r\n A button that triggers a file upload dialog.\r\n * Combines a Button with a hidden file input.\r\n * @param props UploadButtonProps\r\n * @returns UploadButton component\r\n */\r\nexport const UploadButton: FunctionComponent<UploadButtonProps> = (props) => {\r\n const { onUpload, accept, label, ...buttonProps } = props;\r\n UploadButton.displayName = \"UploadButton\";\r\n const inputRef = useRef<HTMLInputElement>(null);\r\n\r\n const handleClick = () => {\r\n inputRef.current?.click();\r\n };\r\n\r\n const handleChange = (evt: React.ChangeEvent<HTMLInputElement>) => {\r\n const files = evt.target.files;\r\n if (files && files.length) {\r\n onUpload(files);\r\n }\r\n evt.target.value = \"\";\r\n };\r\n\r\n return (\r\n <>\r\n <Button icon={ArrowUploadRegular} title={label ?? \"Upload\"} label={label} onClick={handleClick} {...buttonProps} />\r\n <input ref={inputRef} type=\"file\" accept={accept} style={{ display: \"none\" }} onChange={handleChange} />\r\n </>\r\n );\r\n};\r\n"]}

package/fluent/primitives/utils.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { GriffelStyle } from "@fluentui/react-components";
-import type { KeyboardEvent, FocusEvent } from "react";
+import { type GriffelStyle } from "@fluentui/react-components";
+import { type KeyboardEvent, type FocusEvent } from "react";
 export declare const TokenMap: {
     px2: string;
     px4: string;

package/fluent/primitives/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,~~EAAE~~,MAAM,4BAA4B,CAAC;~~AAKhE~~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","sourcesContent":["import { makeStyles, tokens ~~} from \"@fluentui/react-components\";\r\nimport~~ type { GriffelStyle } from \"@fluentui/react-components\";\r\n\r\nimport type { KeyboardEvent, FocusEvent } from \"react\";\r\n\r\nexport const TokenMap = {\r\n px2: tokens.borderRadiusSmall,\r\n px4: tokens.borderRadiusMedium,\r\n px6: tokens.borderRadiusLarge,\r\n px8: tokens.borderRadiusXLarge,\r\n px10: tokens.fontSizeBase100,\r\n px12: tokens.fontSizeBase200,\r\n px14: tokens.fontSizeBase300,\r\n px16: tokens.fontSizeBase400,\r\n px20: tokens.fontSizeBase500,\r\n px24: tokens.fontSizeBase600,\r\n px28: tokens.lineHeightBase500,\r\n px32: tokens.lineHeightBase600,\r\n px36: tokens.lineHeightHero700,\r\n px40: tokens.lineHeightHero800,\r\n};\r\n\r\nexport const CustomTokens = {\r\n valueWidth: \"150px\",\r\n lineHeight: TokenMap.px36,\r\n lineHeightSmall: TokenMap.px28,\r\n dividerGap: TokenMap.px10,\r\n dividerGapSmall: TokenMap.px4,\r\n labelMinWidth: \"50px\",\r\n sliderMinWidth: \"30px\",\r\n sliderMaxWidth: \"80px\",\r\n rightAlignOffset: `-${TokenMap.px8}`,\r\n};\r\n\r\nexport const UniformWidthStyling: GriffelStyle = { width: CustomTokens.valueWidth, boxSizing: \"border-box\" };\r\nexport const useInputStyles = makeStyles({\r\n inputSlot: { textAlign: \"right\" },\r\n invalid: { backgroundColor: tokens.colorPaletteRedBackground2 },\r\n container: {\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n justifyContent: \"center\", // align items vertically\r\n minWidth: 0, // Allow shrinking\r\n },\r\n inputFill: {\r\n width: \"100%\",\r\n minWidth: 0,\r\n },\r\n});\r\n\r\nexport function HandleOnBlur(event: FocusEvent<HTMLInputElement>) {\r\n event.stopPropagation();\r\n event.preventDefault();\r\n}\r\n\r\nexport function HandleKeyDown(event: KeyboardEvent<HTMLInputElement>) {\r\n event.stopPropagation(); // Prevent event propagation\r\n\r\n // Prevent Enter key from causing form submission or value reversion\r\n if (event.key === \"Enter\") {\r\n event.preventDefault();\r\n }\r\n}\r\n\r\n/*\r\n Fluent's CalculatePrecision function\r\n * https://github.com/microsoft/fluentui/blob/dcbf775d37938eacffa37922fc0b43a3cdd5753f/packages/utilities/src/math.ts#L91C1\r\n \r\n Calculates a number's precision based on the number of trailing\r\n * zeros if the number does not have a decimal indicated by a negative\r\n * precision. Otherwise, it calculates the number of digits after\r\n * the decimal point indicated by a positive precision.\r\n \r\n @param value - the value to determine the precision of\r\n * @returns the calculated precision\r\n /\r\nexport function CalculatePrecision(value: number) {\r\n /\r\n Group 1:\r\n * [1-9]([0]+$) matches trailing zeros\r\n * Group 2:\r\n * \\.([0-9]) matches all digits after a decimal point.\r\n / const groups = /[1-9]([0]+$)\|\\.([0-9]*)/.exec(String(value));\r\n if (!groups) {\r\n return 0;\r\n }\r\n if (groups[1]) {\r\n return -groups[1].length;\r\n }\r\n if (groups[2]) {\r\n return groups[2].length;\r\n }\r\n return 0;\r\n}\r\n\r\nconst HEX_REGEX = RegExp(/^#([A-Fa-f0-9]{6}\|[A-Fa-f0-9]{3}\|[A-Fa-f0-9]{8})$/);\r\nexport function ValidateColorHex(val: string) {\r\n return val != \"\" && HEX_REGEX.test(val);\r\n}\r\n"]}
1	+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../dev/sharedUiComponents/src/fluent/primitives/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { makeStyles, tokens, type GriffelStyle } from \"@fluentui/react-components\";\r\n\r\nimport { type KeyboardEvent, type FocusEvent } from \"react\";\r\n\r\nexport const TokenMap = {\r\n px2: tokens.borderRadiusSmall,\r\n px4: tokens.borderRadiusMedium,\r\n px6: tokens.borderRadiusLarge,\r\n px8: tokens.borderRadiusXLarge,\r\n px10: tokens.fontSizeBase100,\r\n px12: tokens.fontSizeBase200,\r\n px14: tokens.fontSizeBase300,\r\n px16: tokens.fontSizeBase400,\r\n px20: tokens.fontSizeBase500,\r\n px24: tokens.fontSizeBase600,\r\n px28: tokens.lineHeightBase500,\r\n px32: tokens.lineHeightBase600,\r\n px36: tokens.lineHeightHero700,\r\n px40: tokens.lineHeightHero800,\r\n};\r\n\r\nexport const CustomTokens = {\r\n valueWidth: \"150px\",\r\n lineHeight: TokenMap.px36,\r\n lineHeightSmall: TokenMap.px28,\r\n dividerGap: TokenMap.px10,\r\n dividerGapSmall: TokenMap.px4,\r\n labelMinWidth: \"50px\",\r\n sliderMinWidth: \"30px\",\r\n sliderMaxWidth: \"80px\",\r\n rightAlignOffset: `-${TokenMap.px8}`,\r\n};\r\n\r\nexport const UniformWidthStyling: GriffelStyle = { width: CustomTokens.valueWidth, boxSizing: \"border-box\" };\r\nexport const useInputStyles = makeStyles({\r\n inputSlot: { textAlign: \"right\" },\r\n invalid: { backgroundColor: tokens.colorPaletteRedBackground2 },\r\n container: {\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n justifyContent: \"center\", // align items vertically\r\n minWidth: 0, // Allow shrinking\r\n },\r\n inputFill: {\r\n width: \"100%\",\r\n minWidth: 0,\r\n },\r\n});\r\n\r\nexport function HandleOnBlur(event: FocusEvent<HTMLInputElement>) {\r\n event.stopPropagation();\r\n event.preventDefault();\r\n}\r\n\r\nexport function HandleKeyDown(event: KeyboardEvent<HTMLInputElement>) {\r\n event.stopPropagation(); // Prevent event propagation\r\n\r\n // Prevent Enter key from causing form submission or value reversion\r\n if (event.key === \"Enter\") {\r\n event.preventDefault();\r\n }\r\n}\r\n\r\n/*\r\n Fluent's CalculatePrecision function\r\n * https://github.com/microsoft/fluentui/blob/dcbf775d37938eacffa37922fc0b43a3cdd5753f/packages/utilities/src/math.ts#L91C1\r\n \r\n Calculates a number's precision based on the number of trailing\r\n * zeros if the number does not have a decimal indicated by a negative\r\n * precision. Otherwise, it calculates the number of digits after\r\n * the decimal point indicated by a positive precision.\r\n \r\n @param value - the value to determine the precision of\r\n * @returns the calculated precision\r\n /\r\nexport function CalculatePrecision(value: number) {\r\n /\r\n Group 1:\r\n * [1-9]([0]+$) matches trailing zeros\r\n * Group 2:\r\n * \\.([0-9]) matches all digits after a decimal point.\r\n / const groups = /[1-9]([0]+$)\|\\.([0-9]*)/.exec(String(value));\r\n if (!groups) {\r\n return 0;\r\n }\r\n if (groups[1]) {\r\n return -groups[1].length;\r\n }\r\n if (groups[2]) {\r\n return groups[2].length;\r\n }\r\n return 0;\r\n}\r\n\r\nconst HEX_REGEX = RegExp(/^#([A-Fa-f0-9]{6}\|[A-Fa-f0-9]{3}\|[A-Fa-f0-9]{8})$/);\r\nexport function ValidateColorHex(val: string) {\r\n return val != \"\" && HEX_REGEX.test(val);\r\n}\r\n"]}

package/historyStack.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { IDisposable } from "@babylonjs/core/scene.js";
+import { type IDisposable } from "@babylonjs/core/scene.js";
 /**
  * Class handling undo / redo operations
  */
@@ -45,6 +45,14 @@ export declare class HistoryStack implements IDisposable {
      * Checks if there is any data in the history stack
      */
     get hasData(): boolean;
+    /**
+     * Whether an undo operation is available
+     */
+    get canUndo(): boolean;
+    /**
+     * Whether a redo operation is available
+     */
+    get canRedo(): boolean;
     /**
      * Undo the latest operation
      */

package/historyStack.js CHANGED Viewed

@@ -165,6 +165,9 @@ export class HistoryStack {
         try {
             // _dataProvider can return T or Promise<T>; await handles both.
             const provided = await this._dataProvider();
+            if (provided == null) {
+                return;
+            }
             const data = this._copy(provided);
             if (this._activeData) {
                 const diff = this._generateJSONDiff(data, this._activeData);
@@ -189,6 +192,18 @@ export class HistoryStack {
     get hasData() {
         return this._historyStack.length > 0;
     }
+    /**
+     * Whether an undo operation is available
+     */
+    get canUndo() {
+        return this._historyStack.length > 0;
+    }
+    /**
+     * Whether a redo operation is available
+     */
+    get canRedo() {
+        return this._redoStack.length > 0;
+    }
     /**
      * Undo the latest operation
      */

package/historyStack.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"historyStack.js","sourceRoot":"","sources":["../../../dev/sharedUiComponents/src/historyStack.ts"],"names":[],"mappings":"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","sourcesContent":["import type { IDisposable } from \"core/scene\";\r\n\r\n/*\r\n Class handling undo / redo operations\r\n /\r\nexport class HistoryStack implements IDisposable {\r\n private _historyStack: string[] = [];\r\n private _redoStack: string[] = [];\r\n private _activeData: any;\r\n private readonly _maxHistoryLength = 256;\r\n private _locked = false;\r\n private _dataProvider: () => any;\r\n private _applyUpdate: (data: any) => void;\r\n\r\n /\r\n Gets or sets a boolean indicating if the stack is enabled\r\n /\r\n public isEnabled = true;\r\n\r\n /\r\n Constructor\r\n * @param dataProvider defines the data provider function\r\n * @param applyUpdate defines the code to execute when undo/redo operation is required\r\n /\r\n constructor(dataProvider: () => any, applyUpdate: (data: any) => void) {\r\n this._dataProvider = dataProvider;\r\n this._applyUpdate = applyUpdate;\r\n }\r\n\r\n /\r\n Process key event to handle undo / redo\r\n * @param evt defines the keyboard event to process\r\n * @returns true if the event was processed\r\n /\r\n processKeyEvent(evt: KeyboardEvent): boolean {\r\n if (!this.isEnabled) {\r\n return false;\r\n }\r\n\r\n if (evt.ctrlKey \|\| evt.metaKey) {\r\n if (evt.key === \"z\" \|\| evt.key === \"Z\") {\r\n if (evt.shiftKey) {\r\n this.redo();\r\n return true;\r\n }\r\n\r\n this.undo();\r\n return true;\r\n }\r\n if (evt.key === \"y\" \|\| evt.key === \"Y\") {\r\n this.redo();\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n\r\n /\r\n Resets the stack\r\n /\r\n public reset() {\r\n this._historyStack = [];\r\n this._redoStack = [];\r\n this._activeData = null;\r\n void this.storeAsync();\r\n }\r\n\r\n /\r\n Remove the n-1 element of the stack\r\n /\r\n public collapseLastTwo() {\r\n if (this._historyStack.length < 2) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n const diff = this._historyStack.pop()!;\r\n const diff2 = this._historyStack.pop()!;\r\n\r\n let newState = this._applyJSONDiff(this._activeData, JSON.parse(diff));\r\n newState = this._applyJSONDiff(newState, JSON.parse(diff2));\r\n\r\n this._historyStack.push(JSON.stringify(this._generateJSONDiff(this._activeData, newState)));\r\n\r\n this._locked = false;\r\n }\r\n\r\n private _generateJSONDiff(obj1: any, obj2: any): any {\r\n if (obj1 === obj2) {\r\n return undefined;\r\n }\r\n if (obj1 === null \|\| obj2 === null \|\| typeof obj1 !== \"object\" \|\| typeof obj2 !== \"object\") {\r\n if (obj1 !== obj2 && obj2 === undefined) {\r\n return \"@d@\";\r\n }\r\n return obj2;\r\n }\r\n\r\n if (Array.isArray(obj1) && Array.isArray(obj2)) {\r\n const diff = [];\r\n const maxLength = Math.max(obj1.length, obj2.length);\r\n let hasChanges = false;\r\n\r\n for (let i = 0; i < maxLength; i++) {\r\n const localDiff = this._generateJSONDiff(obj1[i], obj2[i]);\r\n if (localDiff !== undefined) {\r\n diff[i] = localDiff;\r\n hasChanges = true;\r\n }\r\n }\r\n\r\n return hasChanges ? diff : undefined;\r\n }\r\n\r\n const diff: any = {};\r\n const keys = new Set([...Object.keys(obj1), ...Object.keys(obj2)]);\r\n let hasChanges = false;\r\n\r\n for (const key of keys) {\r\n if (!(key in obj1)) {\r\n diff[key] = obj2[key];\r\n hasChanges = true;\r\n } else if (!(key in obj2)) {\r\n diff[key] = \"@d@\"; // Mark for deletion\r\n hasChanges = true;\r\n } else {\r\n const nestedDiff = this._generateJSONDiff(obj1[key], obj2[key]);\r\n if (nestedDiff !== undefined) {\r\n diff[key] = nestedDiff;\r\n hasChanges = true;\r\n }\r\n }\r\n }\r\n\r\n return hasChanges ? diff : undefined;\r\n }\r\n\r\n private _applyJSONDiff(obj1: any, diff: any) {\r\n if (diff === undefined) {\r\n return obj1;\r\n }\r\n if (typeof diff !== \"object\" \|\| diff === null \|\| obj1 == null) {\r\n return diff;\r\n }\r\n\r\n const result: any = Array.isArray(obj1) ? [] : {};\r\n\r\n if (Array.isArray(diff)) {\r\n for (let i = 0; i < Math.max(obj1.length, diff.length); i++) {\r\n if (diff[i] === null && i < obj1.length) {\r\n result[i] = obj1[i];\r\n } else if (diff[i] !== \"@d@\") {\r\n result[i] = this._applyJSONDiff(obj1[i], diff[i]);\r\n }\r\n }\r\n } else {\r\n for (const key in obj1) {\r\n if (!(key in diff)) {\r\n result[key] = obj1[key];\r\n }\r\n }\r\n for (const key in diff) {\r\n if (diff[key] === \"@d@\") {\r\n // Skip this key (it's been deleted)\r\n } else if (typeof diff[key] === \"object\" && diff[key] !== null) {\r\n result[key] = this._applyJSONDiff(obj1[key], diff[key]);\r\n } else {\r\n result[key] = diff[key];\r\n }\r\n }\r\n }\r\n\r\n return result;\r\n }\r\n\r\n private _copy(source: any) {\r\n return JSON.parse(JSON.stringify(source));\r\n }\r\n\r\n /\r\n Stores the current state\r\n /\r\n public async storeAsync() {\r\n if (this._locked \|\| !this.isEnabled) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n try {\r\n // _dataProvider can return T or Promise<T>; await handles both.\r\n const provided = await this._dataProvider();\r\n const data = this._copy(provided);\r\n\r\n if (this._activeData) {\r\n const diff = this._generateJSONDiff(data, this._activeData);\r\n if (!diff) {\r\n return; // finally will still run and release the lock\r\n }\r\n this._historyStack.push(JSON.stringify(diff));\r\n }\r\n\r\n this._activeData = data;\r\n\r\n if (this._historyStack.length > this._maxHistoryLength) {\r\n this._historyStack.shift();\r\n }\r\n\r\n this._redoStack.length = 0;\r\n } finally {\r\n this._locked = false;\r\n }\r\n }\r\n\r\n /\r\n Checks if there is any data in the history stack\r\n /\r\n public get hasData(): boolean {\r\n return this._historyStack.length > 0;\r\n }\r\n\r\n /\r\n Undo the latest operation\r\n /\r\n public undo() {\r\n if (!this._historyStack.length) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n const diff = this._historyStack.pop()!;\r\n\r\n const newState = this._applyJSONDiff(this._activeData, JSON.parse(diff));\r\n this._redoStack.push(JSON.stringify(this._generateJSONDiff(newState, this._activeData)));\r\n\r\n this._applyUpdate(this._copy(newState));\r\n\r\n this._activeData = newState;\r\n\r\n this._locked = false;\r\n }\r\n\r\n /\r\n Redo the latest undo operation\r\n /\r\n public redo() {\r\n if (!this._redoStack.length) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n const diff = this._redoStack.pop()!;\r\n\r\n const newState = this._applyJSONDiff(this._activeData, JSON.parse(diff));\r\n this._historyStack.push(JSON.stringify(this._generateJSONDiff(newState, this._activeData)));\r\n\r\n this._applyUpdate(this._copy(newState));\r\n this._activeData = newState;\r\n\r\n this._locked = false;\r\n }\r\n\r\n /\r\n Disposes the stack\r\n */\r\n public dispose() {\r\n this._historyStack = [];\r\n this._redoStack = [];\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"historyStack.js","sourceRoot":"","sources":["../../../dev/sharedUiComponents/src/historyStack.ts"],"names":[],"mappings":"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","sourcesContent":["import { type IDisposable } from \"core/scene\";\r\n\r\n/*\r\n Class handling undo / redo operations\r\n /\r\nexport class HistoryStack implements IDisposable {\r\n private _historyStack: string[] = [];\r\n private _redoStack: string[] = [];\r\n private _activeData: any;\r\n private readonly _maxHistoryLength = 256;\r\n private _locked = false;\r\n private _dataProvider: () => any;\r\n private _applyUpdate: (data: any) => void;\r\n\r\n /\r\n Gets or sets a boolean indicating if the stack is enabled\r\n /\r\n public isEnabled = true;\r\n\r\n /\r\n Constructor\r\n * @param dataProvider defines the data provider function\r\n * @param applyUpdate defines the code to execute when undo/redo operation is required\r\n /\r\n constructor(dataProvider: () => any, applyUpdate: (data: any) => void) {\r\n this._dataProvider = dataProvider;\r\n this._applyUpdate = applyUpdate;\r\n }\r\n\r\n /\r\n Process key event to handle undo / redo\r\n * @param evt defines the keyboard event to process\r\n * @returns true if the event was processed\r\n /\r\n processKeyEvent(evt: KeyboardEvent): boolean {\r\n if (!this.isEnabled) {\r\n return false;\r\n }\r\n\r\n if (evt.ctrlKey \|\| evt.metaKey) {\r\n if (evt.key === \"z\" \|\| evt.key === \"Z\") {\r\n if (evt.shiftKey) {\r\n this.redo();\r\n return true;\r\n }\r\n\r\n this.undo();\r\n return true;\r\n }\r\n if (evt.key === \"y\" \|\| evt.key === \"Y\") {\r\n this.redo();\r\n return true;\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n\r\n /\r\n Resets the stack\r\n /\r\n public reset() {\r\n this._historyStack = [];\r\n this._redoStack = [];\r\n this._activeData = null;\r\n void this.storeAsync();\r\n }\r\n\r\n /\r\n Remove the n-1 element of the stack\r\n /\r\n public collapseLastTwo() {\r\n if (this._historyStack.length < 2) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n const diff = this._historyStack.pop()!;\r\n const diff2 = this._historyStack.pop()!;\r\n\r\n let newState = this._applyJSONDiff(this._activeData, JSON.parse(diff));\r\n newState = this._applyJSONDiff(newState, JSON.parse(diff2));\r\n\r\n this._historyStack.push(JSON.stringify(this._generateJSONDiff(this._activeData, newState)));\r\n\r\n this._locked = false;\r\n }\r\n\r\n private _generateJSONDiff(obj1: any, obj2: any): any {\r\n if (obj1 === obj2) {\r\n return undefined;\r\n }\r\n if (obj1 === null \|\| obj2 === null \|\| typeof obj1 !== \"object\" \|\| typeof obj2 !== \"object\") {\r\n if (obj1 !== obj2 && obj2 === undefined) {\r\n return \"@d@\";\r\n }\r\n return obj2;\r\n }\r\n\r\n if (Array.isArray(obj1) && Array.isArray(obj2)) {\r\n const diff = [];\r\n const maxLength = Math.max(obj1.length, obj2.length);\r\n let hasChanges = false;\r\n\r\n for (let i = 0; i < maxLength; i++) {\r\n const localDiff = this._generateJSONDiff(obj1[i], obj2[i]);\r\n if (localDiff !== undefined) {\r\n diff[i] = localDiff;\r\n hasChanges = true;\r\n }\r\n }\r\n\r\n return hasChanges ? diff : undefined;\r\n }\r\n\r\n const diff: any = {};\r\n const keys = new Set([...Object.keys(obj1), ...Object.keys(obj2)]);\r\n let hasChanges = false;\r\n\r\n for (const key of keys) {\r\n if (!(key in obj1)) {\r\n diff[key] = obj2[key];\r\n hasChanges = true;\r\n } else if (!(key in obj2)) {\r\n diff[key] = \"@d@\"; // Mark for deletion\r\n hasChanges = true;\r\n } else {\r\n const nestedDiff = this._generateJSONDiff(obj1[key], obj2[key]);\r\n if (nestedDiff !== undefined) {\r\n diff[key] = nestedDiff;\r\n hasChanges = true;\r\n }\r\n }\r\n }\r\n\r\n return hasChanges ? diff : undefined;\r\n }\r\n\r\n private _applyJSONDiff(obj1: any, diff: any) {\r\n if (diff === undefined) {\r\n return obj1;\r\n }\r\n if (typeof diff !== \"object\" \|\| diff === null \|\| obj1 == null) {\r\n return diff;\r\n }\r\n\r\n const result: any = Array.isArray(obj1) ? [] : {};\r\n\r\n if (Array.isArray(diff)) {\r\n for (let i = 0; i < Math.max(obj1.length, diff.length); i++) {\r\n if (diff[i] === null && i < obj1.length) {\r\n result[i] = obj1[i];\r\n } else if (diff[i] !== \"@d@\") {\r\n result[i] = this._applyJSONDiff(obj1[i], diff[i]);\r\n }\r\n }\r\n } else {\r\n for (const key in obj1) {\r\n if (!(key in diff)) {\r\n result[key] = obj1[key];\r\n }\r\n }\r\n for (const key in diff) {\r\n if (diff[key] === \"@d@\") {\r\n // Skip this key (it's been deleted)\r\n } else if (typeof diff[key] === \"object\" && diff[key] !== null) {\r\n result[key] = this._applyJSONDiff(obj1[key], diff[key]);\r\n } else {\r\n result[key] = diff[key];\r\n }\r\n }\r\n }\r\n\r\n return result;\r\n }\r\n\r\n private _copy(source: any) {\r\n return JSON.parse(JSON.stringify(source));\r\n }\r\n\r\n /\r\n Stores the current state\r\n /\r\n public async storeAsync() {\r\n if (this._locked \|\| !this.isEnabled) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n try {\r\n // _dataProvider can return T or Promise<T>; await handles both.\r\n const provided = await this._dataProvider();\r\n if (provided == null) {\r\n return;\r\n }\r\n const data = this._copy(provided);\r\n\r\n if (this._activeData) {\r\n const diff = this._generateJSONDiff(data, this._activeData);\r\n if (!diff) {\r\n return; // finally will still run and release the lock\r\n }\r\n this._historyStack.push(JSON.stringify(diff));\r\n }\r\n\r\n this._activeData = data;\r\n\r\n if (this._historyStack.length > this._maxHistoryLength) {\r\n this._historyStack.shift();\r\n }\r\n\r\n this._redoStack.length = 0;\r\n } finally {\r\n this._locked = false;\r\n }\r\n }\r\n\r\n /\r\n Checks if there is any data in the history stack\r\n /\r\n public get hasData(): boolean {\r\n return this._historyStack.length > 0;\r\n }\r\n\r\n /\r\n Whether an undo operation is available\r\n /\r\n public get canUndo(): boolean {\r\n return this._historyStack.length > 0;\r\n }\r\n\r\n /\r\n Whether a redo operation is available\r\n /\r\n public get canRedo(): boolean {\r\n return this._redoStack.length > 0;\r\n }\r\n\r\n /\r\n Undo the latest operation\r\n /\r\n public undo() {\r\n if (!this._historyStack.length) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n const diff = this._historyStack.pop()!;\r\n\r\n const newState = this._applyJSONDiff(this._activeData, JSON.parse(diff));\r\n this._redoStack.push(JSON.stringify(this._generateJSONDiff(newState, this._activeData)));\r\n\r\n this._applyUpdate(this._copy(newState));\r\n\r\n this._activeData = newState;\r\n\r\n this._locked = false;\r\n }\r\n\r\n /\r\n Redo the latest undo operation\r\n /\r\n public redo() {\r\n if (!this._redoStack.length) {\r\n return;\r\n }\r\n\r\n this._locked = true;\r\n const diff = this._redoStack.pop()!;\r\n\r\n const newState = this._applyJSONDiff(this._activeData, JSON.parse(diff));\r\n this._historyStack.push(JSON.stringify(this._generateJSONDiff(newState, this._activeData)));\r\n\r\n this._applyUpdate(this._copy(newState));\r\n this._activeData = newState;\r\n\r\n this._locked = false;\r\n }\r\n\r\n /\r\n Disposes the stack\r\n */\r\n public dispose() {\r\n this._historyStack = [];\r\n this._redoStack = [];\r\n }\r\n}\r\n"]}

package/lines/booleanLineComponent.js CHANGED Viewed

@@ -2,8 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faCheck, faTimesCircle } from "@fortawesome/free-solid-svg-icons";
-import { BooleanBadgePropertyLine } from "shared-ui-components/fluent/hoc/propertyLines/booleanBadgePropertyLine";
-import { ToolContext } from "shared-ui-components/fluent/hoc/fluentToolWrapper";
+import { BooleanBadgePropertyLine } from "../fluent/hoc/propertyLines/booleanBadgePropertyLine.js";
+import { ToolContext } from "../fluent/hoc/fluentToolWrapper.js";
 export class BooleanLineComponent extends React.Component {
     constructor(props) {
         super(props);

package/lines/checkBoxLineComponent.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import * as React from "react";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-import type { PropertyChangedEvent } from "./../propertyChangedEvent.js";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import { type Observable } from "@babylonjs/core/Misc/observable.js";
+import { type PropertyChangedEvent } from "./../propertyChangedEvent.js";
+import { type IconDefinition } from "@fortawesome/fontawesome-common-types";
 export interface ICheckBoxLineComponentProps {
     label?: string;
     target?: any;

package/lines/checkBoxLineComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"checkBoxLineComponent.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/lines/checkBoxLineComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"./../propertyChangedEvent\";\r\nimport { copyCommandToClipboard, getClassNameWithNamespace } from \"../copyCommandToClipboard\";\r\nimport type { IconDefinition } from \"@fortawesome/fontawesome-common-types\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { conflictingValuesPlaceholder } from \"./targetsProxy\";\r\nimport copyIcon from \"../imgs/copy.svg\";\r\nimport { ToolContext } from \"../fluent/hoc/fluentToolWrapper\";\r\nimport { SwitchPropertyLine } from \"../fluent/hoc/propertyLines/switchPropertyLine\";\r\nimport { Checkbox } from \"../fluent/primitives/checkbox\";\r\n\r\nexport interface ICheckBoxLineComponentProps {\r\n label?: string;\r\n target?: any;\r\n propertyName?: string;\r\n isSelected?: boolean \| (() => boolean);\r\n onSelect?: (value: boolean) => void;\r\n onValueChanged?: () => void;\r\n onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n disabled?: boolean;\r\n icon?: string;\r\n iconLabel?: string;\r\n faIcons?: { enabled: IconDefinition; disabled: IconDefinition };\r\n large?: boolean;\r\n}\r\n\r\nimport toggleOnIcon40px from \"../imgs/toggleOnIcon_40px.svg\";\r\nimport toggleOffIcon40px from \"../imgs/toggleOffIcon_40px.svg\";\r\nimport toggleOnIcon30px from \"../imgs/toggleOnIcon_30px.svg\";\r\nimport toggleMixedIcon30px from \"../imgs/toggleMixedIcon_30px.svg\";\r\nimport toggleOffIcon30px from \"../imgs/toggleOffIcon_30px.svg\";\r\n\r\nconst Icons = {\r\n size30: {\r\n on: toggleOnIcon30px,\r\n mixed: toggleMixedIcon30px,\r\n off: toggleOffIcon30px,\r\n },\r\n size40: {\r\n on: toggleOnIcon40px,\r\n mixed: \"\", // unneeded\r\n off: toggleOffIcon40px,\r\n },\r\n};\r\n\r\nexport class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, { isSelected: boolean; isDisabled?: boolean; isConflict: boolean }> {\r\n private _localChange = false;\r\n constructor(props: ICheckBoxLineComponentProps) {\r\n super(props);\r\n\r\n if (this.props.isSelected !== undefined) {\r\n this.state = {\r\n isSelected: typeof this.props.isSelected === \"boolean\" ? this.props.isSelected : this.props.isSelected(),\r\n isConflict: false,\r\n };\r\n } else {\r\n this.state = {\r\n isSelected: this.props.target[this.props.propertyName!] === true,\r\n isConflict: this.props.target[this.props.propertyName!] === conflictingValuesPlaceholder,\r\n };\r\n }\r\n\r\n if (this.props.disabled) {\r\n this.state = { ...this.state, isDisabled: this.props.disabled };\r\n }\r\n }\r\n\r\n override shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: { isSelected: boolean; isDisabled: boolean; isConflict: boolean }) {\r\n let selected: boolean;\r\n\r\n if (nextProps.isSelected !== undefined) {\r\n selected = typeof nextProps.isSelected === \"boolean\" ? nextProps.isSelected : nextProps.isSelected();\r\n } else {\r\n selected = nextProps.target[nextProps.propertyName!] === true;\r\n if (nextProps.target[nextProps.propertyName!] === conflictingValuesPlaceholder) {\r\n nextState.isConflict = true;\r\n }\r\n }\r\n\r\n if (selected !== nextState.isSelected \|\| this._localChange) {\r\n nextState.isSelected = selected;\r\n this._localChange = false;\r\n return true;\r\n }\r\n\r\n if (nextProps.disabled !== nextState.isDisabled) {\r\n return true;\r\n }\r\n\r\n return nextProps.label !== this.props.label \|\| nextProps.target !== this.props.target \|\| nextState.isConflict !== this.state.isConflict;\r\n }\r\n\r\n onChange() {\r\n this._localChange = true;\r\n if (this.props.onSelect) {\r\n this.props.onSelect(!this.state.isSelected);\r\n } else {\r\n if (this.props.onPropertyChangedObservable) {\r\n this.props.onPropertyChangedObservable.notifyObservers({\r\n object: this.props.target,\r\n property: this.props.propertyName!,\r\n value: !this.state.isSelected,\r\n initialValue: this.state.isSelected,\r\n });\r\n }\r\n\r\n if (this.props.target && this.props.propertyName) {\r\n this.props.target[this.props.propertyName] = !this.state.isSelected;\r\n }\r\n }\r\n\r\n if (this.props.onValueChanged) {\r\n this.props.onValueChanged();\r\n }\r\n\r\n this.setState({ isSelected: !this.state.isSelected, isConflict: false });\r\n }\r\n\r\n // Copy to clipboard the code this checkbox actually does\r\n // Example : mesh.checkCollisions = true;\r\n onCopyClick() {\r\n if (this.props && this.props.target) {\r\n const { className, babylonNamespace } = getClassNameWithNamespace(this.props.target);\r\n const targetName = \"globalThis.debugNode\";\r\n const targetProperty = this.props.propertyName;\r\n const value = this.props.target[this.props.propertyName!];\r\n const strCommand = targetName + \".\" + targetProperty + \" = \" + value + \";// (debugNode as \" + babylonNamespace + className + \")\";\r\n copyCommandToClipboard(strCommand);\r\n } else {\r\n copyCommandToClipboard(\"undefined\");\r\n }\r\n }\r\n\r\n renderOriginal() {\r\n const icons = this.props.large ? Icons.size40 : Icons.size30;\r\n const icon = this.state.isConflict ? icons.mixed : this.state.isSelected ? icons.on : icons.off;\r\n return (\r\n <div className=\"checkBoxLine\">\r\n {this.props.icon && <img src={this.props.icon} title={this.props.iconLabel} alt={this.props.iconLabel} className=\"icon\" />}\r\n {this.props.label && (\r\n <div className=\"label\" title={this.props.iconLabel}>\r\n {this.props.label}\r\n </div>\r\n )}\r\n {this.props.faIcons && (\r\n <FontAwesomeIcon\r\n className={`cbx ${this.props.disabled ? \"disabled\" : \"\"}`}\r\n icon={this.state.isSelected ? this.props.faIcons.enabled : this.props.faIcons.disabled}\r\n onClick={() => !this.props.disabled && this.onChange()}\r\n />\r\n )}\r\n {!this.props.faIcons && (\r\n <div className=\"checkBox\">\r\n <label className={`container lbl${this.props.disabled ? \" disabled\" : \"\"} ${this.state.isSelected ? \"checked\" : \"\"}`}>\r\n <input\r\n type=\"checkbox\"\r\n className={`cbx hidden ${this.state.isConflict ? \"conflict\" : \"\"}`}\r\n checked={this.state.isSelected}\r\n onChange={() => this.onChange()}\r\n disabled={!!this.props.disabled}\r\n />\r\n <img className=\"icon\" src={icon} alt={this.props.label} />\r\n </label>\r\n </div>\r\n )}\r\n <div className=\"copy hoverIcon\" onClick={() => this.onCopyClick()} title=\"Copy to clipboard\">\r\n <img src={copyIcon} alt=\"Copy\" />\r\n </div>\r\n </div>\r\n );\r\n }\r\n\r\n renderFluent() {\r\n // if faIcons are sent (to mimic a checkbox) use fluent checkbox\r\n if (this.props.faIcons) {\r\n return <Checkbox disabled={this.props.disabled} value={this.state.isSelected} onChange={() => !this.props.disabled && this.onChange()} />;\r\n }\r\n return <SwitchPropertyLine label={this.props.label \|\| \"\"} value={this.state.isSelected} onChange={() => this.onChange()} disabled={!!this.props.disabled} />;\r\n }\r\n\r\n override render() {\r\n return <ToolContext.Consumer>{({ useFluent }) => (useFluent ? this.renderFluent() : this.renderOriginal())}</ToolContext.Consumer>;\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"checkBoxLineComponent.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/lines/checkBoxLineComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport { type Observable } from \"core/Misc/observable\";\r\nimport { type PropertyChangedEvent } from \"./../propertyChangedEvent\";\r\nimport { copyCommandToClipboard, getClassNameWithNamespace } from \"../copyCommandToClipboard\";\r\nimport { type IconDefinition } from \"@fortawesome/fontawesome-common-types\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { conflictingValuesPlaceholder } from \"./targetsProxy\";\r\nimport copyIcon from \"../imgs/copy.svg\";\r\nimport { ToolContext } from \"../fluent/hoc/fluentToolWrapper\";\r\nimport { SwitchPropertyLine } from \"../fluent/hoc/propertyLines/switchPropertyLine\";\r\nimport { Checkbox } from \"../fluent/primitives/checkbox\";\r\n\r\nexport interface ICheckBoxLineComponentProps {\r\n label?: string;\r\n target?: any;\r\n propertyName?: string;\r\n isSelected?: boolean \| (() => boolean);\r\n onSelect?: (value: boolean) => void;\r\n onValueChanged?: () => void;\r\n onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n disabled?: boolean;\r\n icon?: string;\r\n iconLabel?: string;\r\n faIcons?: { enabled: IconDefinition; disabled: IconDefinition };\r\n large?: boolean;\r\n}\r\n\r\nimport toggleOnIcon40px from \"../imgs/toggleOnIcon_40px.svg\";\r\nimport toggleOffIcon40px from \"../imgs/toggleOffIcon_40px.svg\";\r\nimport toggleOnIcon30px from \"../imgs/toggleOnIcon_30px.svg\";\r\nimport toggleMixedIcon30px from \"../imgs/toggleMixedIcon_30px.svg\";\r\nimport toggleOffIcon30px from \"../imgs/toggleOffIcon_30px.svg\";\r\n\r\nconst Icons = {\r\n size30: {\r\n on: toggleOnIcon30px,\r\n mixed: toggleMixedIcon30px,\r\n off: toggleOffIcon30px,\r\n },\r\n size40: {\r\n on: toggleOnIcon40px,\r\n mixed: \"\", // unneeded\r\n off: toggleOffIcon40px,\r\n },\r\n};\r\n\r\nexport class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, { isSelected: boolean; isDisabled?: boolean; isConflict: boolean }> {\r\n private _localChange = false;\r\n constructor(props: ICheckBoxLineComponentProps) {\r\n super(props);\r\n\r\n if (this.props.isSelected !== undefined) {\r\n this.state = {\r\n isSelected: typeof this.props.isSelected === \"boolean\" ? this.props.isSelected : this.props.isSelected(),\r\n isConflict: false,\r\n };\r\n } else {\r\n this.state = {\r\n isSelected: this.props.target[this.props.propertyName!] === true,\r\n isConflict: this.props.target[this.props.propertyName!] === conflictingValuesPlaceholder,\r\n };\r\n }\r\n\r\n if (this.props.disabled) {\r\n this.state = { ...this.state, isDisabled: this.props.disabled };\r\n }\r\n }\r\n\r\n override shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: { isSelected: boolean; isDisabled: boolean; isConflict: boolean }) {\r\n let selected: boolean;\r\n\r\n if (nextProps.isSelected !== undefined) {\r\n selected = typeof nextProps.isSelected === \"boolean\" ? nextProps.isSelected : nextProps.isSelected();\r\n } else {\r\n selected = nextProps.target[nextProps.propertyName!] === true;\r\n if (nextProps.target[nextProps.propertyName!] === conflictingValuesPlaceholder) {\r\n nextState.isConflict = true;\r\n }\r\n }\r\n\r\n if (selected !== nextState.isSelected \|\| this._localChange) {\r\n nextState.isSelected = selected;\r\n this._localChange = false;\r\n return true;\r\n }\r\n\r\n if (nextProps.disabled !== nextState.isDisabled) {\r\n return true;\r\n }\r\n\r\n return nextProps.label !== this.props.label \|\| nextProps.target !== this.props.target \|\| nextState.isConflict !== this.state.isConflict;\r\n }\r\n\r\n onChange() {\r\n this._localChange = true;\r\n if (this.props.onSelect) {\r\n this.props.onSelect(!this.state.isSelected);\r\n } else {\r\n if (this.props.onPropertyChangedObservable) {\r\n this.props.onPropertyChangedObservable.notifyObservers({\r\n object: this.props.target,\r\n property: this.props.propertyName!,\r\n value: !this.state.isSelected,\r\n initialValue: this.state.isSelected,\r\n });\r\n }\r\n\r\n if (this.props.target && this.props.propertyName) {\r\n this.props.target[this.props.propertyName] = !this.state.isSelected;\r\n }\r\n }\r\n\r\n if (this.props.onValueChanged) {\r\n this.props.onValueChanged();\r\n }\r\n\r\n this.setState({ isSelected: !this.state.isSelected, isConflict: false });\r\n }\r\n\r\n // Copy to clipboard the code this checkbox actually does\r\n // Example : mesh.checkCollisions = true;\r\n onCopyClick() {\r\n if (this.props && this.props.target) {\r\n const { className, babylonNamespace } = getClassNameWithNamespace(this.props.target);\r\n const targetName = \"globalThis.debugNode\";\r\n const targetProperty = this.props.propertyName;\r\n const value = this.props.target[this.props.propertyName!];\r\n const strCommand = targetName + \".\" + targetProperty + \" = \" + value + \";// (debugNode as \" + babylonNamespace + className + \")\";\r\n copyCommandToClipboard(strCommand);\r\n } else {\r\n copyCommandToClipboard(\"undefined\");\r\n }\r\n }\r\n\r\n renderOriginal() {\r\n const icons = this.props.large ? Icons.size40 : Icons.size30;\r\n const icon = this.state.isConflict ? icons.mixed : this.state.isSelected ? icons.on : icons.off;\r\n return (\r\n <div className=\"checkBoxLine\">\r\n {this.props.icon && <img src={this.props.icon} title={this.props.iconLabel} alt={this.props.iconLabel} className=\"icon\" />}\r\n {this.props.label && (\r\n <div className=\"label\" title={this.props.iconLabel}>\r\n {this.props.label}\r\n </div>\r\n )}\r\n {this.props.faIcons && (\r\n <FontAwesomeIcon\r\n className={`cbx ${this.props.disabled ? \"disabled\" : \"\"}`}\r\n icon={this.state.isSelected ? this.props.faIcons.enabled : this.props.faIcons.disabled}\r\n onClick={() => !this.props.disabled && this.onChange()}\r\n />\r\n )}\r\n {!this.props.faIcons && (\r\n <div className=\"checkBox\">\r\n <label className={`container lbl${this.props.disabled ? \" disabled\" : \"\"} ${this.state.isSelected ? \"checked\" : \"\"}`}>\r\n <input\r\n type=\"checkbox\"\r\n className={`cbx hidden ${this.state.isConflict ? \"conflict\" : \"\"}`}\r\n checked={this.state.isSelected}\r\n onChange={() => this.onChange()}\r\n disabled={!!this.props.disabled}\r\n />\r\n <img className=\"icon\" src={icon} alt={this.props.label} />\r\n </label>\r\n </div>\r\n )}\r\n <div className=\"copy hoverIcon\" onClick={() => this.onCopyClick()} title=\"Copy to clipboard\">\r\n <img src={copyIcon} alt=\"Copy\" />\r\n </div>\r\n </div>\r\n );\r\n }\r\n\r\n renderFluent() {\r\n // if faIcons are sent (to mimic a checkbox) use fluent checkbox\r\n if (this.props.faIcons) {\r\n return <Checkbox disabled={this.props.disabled} value={this.state.isSelected} onChange={() => !this.props.disabled && this.onChange()} />;\r\n }\r\n return <SwitchPropertyLine label={this.props.label \|\| \"\"} value={this.state.isSelected} onChange={() => this.onChange()} disabled={!!this.props.disabled} />;\r\n }\r\n\r\n override render() {\r\n return <ToolContext.Consumer>{({ useFluent }) => (useFluent ? this.renderFluent() : this.renderOriginal())}</ToolContext.Consumer>;\r\n }\r\n}\r\n"]}

package/lines/color3LineComponent.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import * as React from "react";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-import type { PropertyChangedEvent } from "../propertyChangedEvent.js";
-import type { LockObject } from "../tabs/propertyGrids/lockObject.js";
+import { type Observable } from "@babylonjs/core/Misc/observable.js";
+import { type PropertyChangedEvent } from "../propertyChangedEvent.js";
+import { type LockObject } from "../tabs/propertyGrids/lockObject.js";
 export interface IColor3LineComponentProps {
     label: string;
     target: any;

package/lines/color3LineComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"color3LineComponent.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/lines/color3LineComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAcjD,MAAM,OAAO,mBAAoB,SAAQ,KAAK,CAAC,SAAoC;IACtE,MAAM;QACX,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,OAAO,KAAC,SAAS,IAAC,YAAY,EAAE,IAAI,KAAM,KAAK,GAAI,CAAC;IACxD,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../propertyChangedEvent\";\r\nimport type { LockObject } from \"../tabs/propertyGrids/lockObject\";\r\nimport { ColorLine } from \"./colorLineComponent\";\r\n\r\nexport interface IColor3LineComponentProps {\r\n label: string;\r\n target: any;\r\n propertyName: string;\r\n onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n isLinear?: boolean;\r\n icon?: string;\r\n lockObject: LockObject;\r\n iconLabel?: string;\r\n onChange?: () => void;\r\n}\r\n\r\nexport class Color3LineComponent extends React.Component<IColor3LineComponentProps> {\r\n override render() {\r\n const props = this.props;\r\n return <ColorLine disableAlpha={true} {...props} />;\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"color3LineComponent.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/lines/color3LineComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAcjD,MAAM,OAAO,mBAAoB,SAAQ,KAAK,CAAC,SAAoC;IACtE,MAAM;QACX,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACzB,OAAO,KAAC,SAAS,IAAC,YAAY,EAAE,IAAI,KAAM,KAAK,GAAI,CAAC;IACxD,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport { type Observable } from \"core/Misc/observable\";\r\nimport { type PropertyChangedEvent } from \"../propertyChangedEvent\";\r\nimport { type LockObject } from \"../tabs/propertyGrids/lockObject\";\r\nimport { ColorLine } from \"./colorLineComponent\";\r\n\r\nexport interface IColor3LineComponentProps {\r\n label: string;\r\n target: any;\r\n propertyName: string;\r\n onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n isLinear?: boolean;\r\n icon?: string;\r\n lockObject: LockObject;\r\n iconLabel?: string;\r\n onChange?: () => void;\r\n}\r\n\r\nexport class Color3LineComponent extends React.Component<IColor3LineComponentProps> {\r\n override render() {\r\n const props = this.props;\r\n return <ColorLine disableAlpha={true} {...props} />;\r\n }\r\n}\r\n"]}