@babylonjs/inspector 9.0.0 → 9.1.0

package/lib/extensionsListService-BmiNjZiw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"extensionsListService-BmiNjZiw.js","sources":["../../../../../../../../dev/inspector-v2/src/services/extensionsListService.tsx"],"sourcesContent":["import {\r\n    type SelectTabData,\r\n    type SelectTabEvent,\r\n    Accordion,\r\n    AccordionHeader,\r\n    AccordionItem,\r\n    AccordionPanel,\r\n    AvatarGroup,\r\n    AvatarGroupItem,\r\n    Body1,\r\n    Body1Strong,\r\n    Button,\r\n    Caption1,\r\n    Card,\r\n    CardFooter,\r\n    CardHeader,\r\n    CardPreview,\r\n    Dialog,\r\n    DialogBody,\r\n    DialogContent,\r\n    DialogSurface,\r\n    DialogTitle,\r\n    DialogTrigger,\r\n    makeStyles,\r\n    Persona,\r\n    Popover,\r\n    PopoverSurface,\r\n    PopoverTrigger,\r\n    PresenceBadge,\r\n    Spinner,\r\n    Tab,\r\n    TabList,\r\n    tokens,\r\n    Tooltip,\r\n} from \"@fluentui/react-components\";\r\nimport { type TriggerProps } from \"@fluentui/react-utilities\";\r\nimport { type FunctionComponent, memo, useCallback, useEffect, useMemo, useState } from \"react\";\r\nimport { type PersonMetadata } from \"../extensibility/extensionFeed\";\r\nimport { type IExtension } from \"../extensibility/extensionManager\";\r\nimport { type ServiceDefinition } from \"../modularity/serviceDefinition\";\r\nimport { type IShellService, ShellServiceIdentity } from \"./shellService\";\r\n\r\nimport {\r\n    AppsAddInRegular,\r\n    ArrowDownloadRegular,\r\n    BranchForkRegular,\r\n    BugRegular,\r\n    DeleteRegular,\r\n    DismissRegular,\r\n    LinkRegular,\r\n    MailRegular,\r\n    PeopleCommunityRegular,\r\n} from \"@fluentui/react-icons\";\r\nimport { Fade } from \"@fluentui/react-motion-components-preview\";\r\n\r\nimport { Logger } from \"core/Misc/logger\";\r\n\r\nimport { Link } from \"shared-ui-components/fluent/primitives/link\";\r\nimport { useExtensionManager } from \"../contexts/extensionManagerContext\";\r\n\r\nconst useStyles = makeStyles({\r\n    extensionButton: {},\r\n    extensionsDialogSurface: {\r\n        height: \"auto\",\r\n        width: \"70vw\",\r\n        maxWidth: \"600px\",\r\n        maxHeight: \"70vh\",\r\n        backgroundColor: tokens.colorNeutralBackground2,\r\n    },\r\n    extensionDialogBody: {\r\n        maxWidth: \"100%\",\r\n        maxHeight: \"100%\",\r\n    },\r\n    extensionDialogContent: {\r\n        marginLeft: `calc(-1 * ${tokens.spacingHorizontalM})`,\r\n        marginRight: `calc(-1 * ${tokens.spacingHorizontalS})`,\r\n    },\r\n    extensionHeader: {},\r\n    extensionItem: {},\r\n    extensionCardPreview: {\r\n        padding: `${tokens.spacingVerticalM} ${tokens.spacingHorizontalM}`,\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        rowGap: tokens.spacingVerticalL,\r\n    },\r\n    extensionIntro: {\r\n        display: \"flex\",\r\n        alignItems: \"center\",\r\n        columnGap: tokens.spacingHorizontalM,\r\n    },\r\n    extensionDescription: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        columnGap: tokens.spacingHorizontalS,\r\n    },\r\n    extensionButtonContainer: {\r\n        marginLeft: \"auto\",\r\n        alignSelf: \"flex-start\",\r\n    },\r\n    spinner: {\r\n        animationDuration: \"1s\",\r\n        animationName: {\r\n            from: { opacity: 0 },\r\n            to: { opacity: 1 },\r\n        },\r\n    },\r\n    webResourceDiv: {\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n    },\r\n    webResourceLink: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        columnGap: tokens.spacingHorizontalS,\r\n        alignItems: \"center\",\r\n    },\r\n    personPopoverSurfaceDiv: {\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        rowGap: tokens.spacingVerticalS,\r\n    },\r\n    accordionHeaderDiv: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        columnGap: tokens.spacingHorizontalS,\r\n        alignItems: \"center\",\r\n    },\r\n    resourceDetailsDiv: {\r\n        display: \"flex\",\r\n        flexDirection: \"column\",\r\n        rowGap: tokens.spacingVerticalS,\r\n    },\r\n    peopleDetailsDiv: {\r\n        display: \"flex\",\r\n        flexDirection: \"row\",\r\n        columnGap: tokens.spacingHorizontalXL,\r\n    },\r\n    avatarGroupItem: {\r\n        cursor: \"pointer\",\r\n    },\r\n});\r\n\r\nfunction AsPersonMetadata(person: string | PersonMetadata): PersonMetadata {\r\n    if (typeof person === \"string\") {\r\n        return { name: person } satisfies PersonMetadata;\r\n    }\r\n    return person;\r\n}\r\n\r\nfunction GetAvatarImage(person: PersonMetadata): { src: string } | undefined {\r\n    return person.avatar ? { src: `data:image/png;base64,${person.avatar}` } : undefined;\r\n}\r\n\r\nfunction usePeopleMetadata(people?: readonly (string | PersonMetadata | undefined)[]): PersonMetadata[] {\r\n    const definedPeople = useMemo(() => (people ? people.filter((person): person is string | PersonMetadata => !!person) : []), [people]);\r\n    return useMemo(() => definedPeople.map(AsPersonMetadata), [definedPeople]);\r\n}\r\n\r\nconst WebResource: FunctionComponent<{ url: string; urlDisplay?: string; icon: JSX.Element; label: string }> = (props) => {\r\n    const { url, urlDisplay, icon, label } = props;\r\n    const classes = useStyles();\r\n\r\n    return (\r\n        <div className={classes.webResourceDiv}>\r\n            <Tooltip content={label} relationship=\"label\" positioning=\"before\" withArrow>\r\n                <div className={classes.webResourceLink}>\r\n                    {icon}\r\n                    <Link url={url} value={urlDisplay || url} />\r\n                </div>\r\n            </Tooltip>\r\n        </div>\r\n    );\r\n};\r\n\r\nconst PersonDetailsPopover: FunctionComponent<TriggerProps & { person: PersonMetadata; title: string; disabled?: boolean }> = (props) => {\r\n    const { person, title, disabled, children } = props;\r\n    const classes = useStyles();\r\n\r\n    if (disabled) {\r\n        return <>{children}</>;\r\n    }\r\n\r\n    return (\r\n        <Popover withArrow>\r\n            <PopoverTrigger disableButtonEnhancement>{children}</PopoverTrigger>\r\n            <PopoverSurface>\r\n                <div className={classes.personPopoverSurfaceDiv}>\r\n                    <Persona name={person.name} secondaryText={title} avatar={{ image: GetAvatarImage(person) }} />\r\n                    {person.email && <WebResource url={`mailto:${person.email}`} urlDisplay={person.email} icon={<MailRegular />} label=\"Email\" />}\r\n                    {person.url && <WebResource url={person.url} urlDisplay={person.url} icon={<LinkRegular />} label=\"Website\" />}\r\n                    {person.forumUserName && (\r\n                        <WebResource\r\n                            url={`https://forum.babylonjs.com/u/${person.forumUserName}`}\r\n                            urlDisplay={person.forumUserName}\r\n                            icon={<PeopleCommunityRegular />}\r\n                            label=\"Forum\"\r\n                        />\r\n                    )}\r\n                </div>\r\n            </PopoverSurface>\r\n        </Popover>\r\n    );\r\n};\r\n\r\nconst ExtensionDetails: FunctionComponent<{ extension: IExtension }> = memo((props) => {\r\n    const { extension } = props;\r\n    const { metadata } = extension;\r\n\r\n    const classes = useStyles();\r\n\r\n    const [canInstall, setCanInstall] = useState(false);\r\n    const [canUninstall, setCanUninstall] = useState(false);\r\n    const [isStateChanging, setIsStateChanging] = useState(false);\r\n\r\n    useEffect(() => {\r\n        const updateState = () => {\r\n            setCanInstall(!extension.isInstalled && !extension.isStateChanging);\r\n            setCanUninstall(extension.isInstalled && !extension.isStateChanging);\r\n            setIsStateChanging(extension.isStateChanging);\r\n        };\r\n\r\n        const stateChangedHandlerRegistration = extension.addStateChangedHandler(updateState);\r\n        updateState();\r\n\r\n        return stateChangedHandlerRegistration.dispose;\r\n    }, [extension]);\r\n\r\n    const [author] = usePeopleMetadata(useMemo(() => [metadata.author], [metadata.author]));\r\n    const contributors = usePeopleMetadata(metadata.contributors);\r\n\r\n    const hasResourceDetails = metadata.homepage || metadata.repository || metadata.bugs;\r\n    const hasPeopleDetails = author || contributors.length > 0;\r\n    const hasPreviewDetails = hasResourceDetails || hasPeopleDetails;\r\n    const hasAuthorDetails = author?.email || author?.url || author?.forumUserName;\r\n    const subHeader = [metadata.version ? `${metadata.version}` : null, metadata.license ? `${metadata.license}` : null].filter(Boolean).join(\" | \");\r\n\r\n    const install = useCallback(async () => {\r\n        try {\r\n            await extension.installAsync();\r\n        } catch {\r\n            // Ignore errors. Other parts of the infrastructure handle them and communicate them to the user.\r\n        }\r\n    }, [extension]);\r\n\r\n    const uninstall = useCallback(async () => {\r\n        try {\r\n            await extension.uninstallAsync();\r\n        } catch {\r\n            // Ignore errors. Other parts of the infrastructure handle them and communicate them to the user.\r\n        }\r\n    }, [extension]);\r\n\r\n    return (\r\n        <AccordionItem className={classes.extensionItem} value={extension.metadata.name}>\r\n            <AccordionHeader className={classes.extensionHeader} expandIconPosition=\"end\">\r\n                <div className={classes.accordionHeaderDiv}>\r\n                    <Body1Strong>{extension.metadata.name}</Body1Strong>\r\n                    <Fade visible={extension.isInstalled}>\r\n                        <PresenceBadge size=\"small\" />\r\n                    </Fade>\r\n                </div>\r\n            </AccordionHeader>\r\n            <AccordionPanel>\r\n                <Card>\r\n                    <CardHeader header={<Body1>{metadata.description}</Body1>} description={<Caption1 italic>{subHeader}</Caption1>} />\r\n                    {hasPreviewDetails && (\r\n                        <CardPreview className={classes.extensionCardPreview}>\r\n                            {hasResourceDetails && (\r\n                                <div className={classes.resourceDetailsDiv} style={{ display: \"flex\" }}>\r\n                                    {metadata.homepage && <WebResource url={metadata.homepage} icon={<LinkRegular />} label=\"Website\" />}\r\n                                    {metadata.repository && <WebResource url={metadata.repository} icon={<BranchForkRegular />} label=\"Repository\" />}\r\n                                    {metadata.bugs && <WebResource url={metadata.bugs} icon={<BugRegular />} label=\"Report Issues\" />}\r\n                                </div>\r\n                            )}\r\n                            {hasPeopleDetails && (\r\n                                <div className={classes.peopleDetailsDiv} style={{ display: \"flex\" }}>\r\n                                    {author && (\r\n                                        <PersonDetailsPopover person={author} title=\"Author\" disabled={!hasAuthorDetails}>\r\n                                            <Persona\r\n                                                name={author.name}\r\n                                                secondaryText=\"Author\"\r\n                                                avatar={{ image: GetAvatarImage(author) }}\r\n                                                style={{ cursor: hasAuthorDetails ? \"pointer\" : \"default\" }}\r\n                                            />\r\n                                        </PersonDetailsPopover>\r\n                                    )}\r\n                                    {contributors.length > 0 && (\r\n                                        <AvatarGroup layout=\"stack\">\r\n                                            {contributors.map((contributor) => {\r\n                                                return (\r\n                                                    <PersonDetailsPopover key={contributor.name} person={contributor} title=\"Contributor\">\r\n                                                        <AvatarGroupItem name={contributor.name} className={classes.avatarGroupItem} image={GetAvatarImage(contributor)} />\r\n                                                    </PersonDetailsPopover>\r\n                                                );\r\n                                            })}\r\n                                        </AvatarGroup>\r\n                                    )}\r\n                                </div>\r\n                            )}\r\n                        </CardPreview>\r\n                    )}\r\n                    <CardFooter>\r\n                        {canInstall && (\r\n                            <Button appearance=\"primary\" size=\"small\" icon={<ArrowDownloadRegular />} onClick={install}>\r\n                                Get\r\n                            </Button>\r\n                        )}\r\n                        {canUninstall && (\r\n                            <Button appearance=\"secondary\" size=\"small\" icon={<DeleteRegular />} onClick={uninstall}>\r\n                                Remove\r\n                            </Button>\r\n                        )}\r\n                        {isStateChanging && <Spinner className={classes.spinner} size=\"extra-small\" />}\r\n                    </CardFooter>\r\n                </Card>\r\n            </AccordionPanel>\r\n        </AccordionItem>\r\n    );\r\n});\r\n\r\ntype TabValue = \"available\" | \"installed\";\r\n\r\nexport const ExtensionListServiceDefinition: ServiceDefinition<[], [IShellService]> = {\r\n    friendlyName: \"ExtensionList\",\r\n    consumes: [ShellServiceIdentity],\r\n    factory: (shellService) => {\r\n        const registration = shellService.addToolbarItem({\r\n            key: \"ExtensionList\",\r\n            horizontalLocation: \"right\",\r\n            verticalLocation: \"top\",\r\n            teachingMoment: {\r\n                title: \"Extensions\",\r\n                description: \"Extensions provide new optional features that can be useful to your specific task or workflow. Click this button to manage extensions.\",\r\n            },\r\n            order: -200,\r\n            component: () => {\r\n                const classes = useStyles();\r\n\r\n                const [selectedTab, setSelectedTab] = useState<TabValue>(\"available\");\r\n                const extensionManager = useExtensionManager();\r\n                const [extensions, setExtensions] = useState<IExtension[]>([]);\r\n\r\n                useEffect(() => {\r\n                    if (extensionManager) {\r\n                        const populateExtensionsAsync = async () => {\r\n                            const query = await extensionManager.queryExtensionsAsync(undefined, undefined, selectedTab === \"installed\");\r\n                            const extensions = await query.getExtensionsAsync(0, query.totalCount);\r\n                            setExtensions(extensions);\r\n                        };\r\n\r\n                        // eslint-disable-next-line github/no-then\r\n                        populateExtensionsAsync().catch((error) => {\r\n                            Logger.Warn(`Failed to populate extensions: ${error}`);\r\n                        });\r\n                    }\r\n                }, [extensionManager, selectedTab]);\r\n\r\n                return (\r\n                    <Dialog>\r\n                        <DialogTrigger disableButtonEnhancement>\r\n                            <Tooltip content=\"Manage Extensions\" relationship=\"label\">\r\n                                <Button className={classes.extensionButton} appearance=\"subtle\" icon={<AppsAddInRegular />} />\r\n                            </Tooltip>\r\n                        </DialogTrigger>\r\n                        <DialogSurface className={classes.extensionsDialogSurface}>\r\n                            <DialogBody className={classes.extensionDialogBody}>\r\n                                <DialogTitle\r\n                                    action={\r\n                                        <DialogTrigger action=\"close\">\r\n                                            <Button appearance=\"subtle\" aria-label=\"close\" icon={<DismissRegular />} />\r\n                                        </DialogTrigger>\r\n                                    }\r\n                                >\r\n                                    <>\r\n                                        Extensions\r\n                                        <TabList\r\n                                            className={classes.extensionDialogContent}\r\n                                            selectedValue={selectedTab}\r\n                                            onTabSelect={(event: SelectTabEvent, data: SelectTabData) => {\r\n                                                setSelectedTab(data.value as TabValue);\r\n                                            }}\r\n                                        >\r\n                                            <Tab value={\"available\" satisfies TabValue}>Available</Tab>\r\n                                            <Tab value={\"installed\" satisfies TabValue}>Installed</Tab>\r\n                                        </TabList>\r\n                                    </>\r\n                                </DialogTitle>\r\n                                <DialogContent className={classes.extensionDialogContent}>\r\n                                    <Accordion collapsible>\r\n                                        {extensions.map((extension) => (\r\n                                            <ExtensionDetails key={extension.metadata.name} extension={extension} />\r\n                                        ))}\r\n                                    </Accordion>\r\n                                </DialogContent>\r\n                            </DialogBody>\r\n                        </DialogSurface>\r\n                    </Dialog>\r\n                );\r\n            },\r\n        });\r\n\r\n        return {\r\n            dispose: () => registration.dispose(),\r\n        };\r\n    },\r\n};\r\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DA,MAAM,SAAS,GAAG,UAAU,CAAC;AACzB,IAAA,eAAe,EAAE,EAAE;AACnB,IAAA,uBAAuB,EAAE;AACrB,QAAA,MAAM,EAAE,MAAM;AACd,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,QAAQ,EAAE,OAAO;AACjB,QAAA,SAAS,EAAE,MAAM;QACjB,eAAe,EAAE,MAAM,CAAC,uBAAuB;AAClD,KAAA;AACD,IAAA,mBAAmB,EAAE;AACjB,QAAA,QAAQ,EAAE,MAAM;AAChB,QAAA,SAAS,EAAE,MAAM;AACpB,KAAA;AACD,IAAA,sBAAsB,EAAE;AACpB,QAAA,UAAU,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,kBAAkB,CAAA,CAAA,CAAG;AACrD,QAAA,WAAW,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,kBAAkB,CAAA,CAAA,CAAG;AACzD,KAAA;AACD,IAAA,eAAe,EAAE,EAAE;AACnB,IAAA,aAAa,EAAE,EAAE;AACjB,IAAA,oBAAoB,EAAE;QAClB,OAAO,EAAE,GAAG,MAAM,CAAC,gBAAgB,CAAA,CAAA,EAAI,MAAM,CAAC,kBAAkB,CAAA,CAAE;AAClE,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,QAAQ;QACvB,MAAM,EAAE,MAAM,CAAC,gBAAgB;AAClC,KAAA;AACD,IAAA,cAAc,EAAE;AACZ,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE,MAAM,CAAC,kBAAkB;AACvC,KAAA;AACD,IAAA,oBAAoB,EAAE;AAClB,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,KAAK;QACpB,SAAS,EAAE,MAAM,CAAC,kBAAkB;AACvC,KAAA;AACD,IAAA,wBAAwB,EAAE;AACtB,QAAA,UAAU,EAAE,MAAM;AAClB,QAAA,SAAS,EAAE,YAAY;AAC1B,KAAA;AACD,IAAA,OAAO,EAAE;AACL,QAAA,iBAAiB,EAAE,IAAI;AACvB,QAAA,aAAa,EAAE;AACX,YAAA,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;AACpB,YAAA,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;AACrB,SAAA;AACJ,KAAA;AACD,IAAA,cAAc,EAAE;AACZ,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,QAAQ;AAC1B,KAAA;AACD,IAAA,eAAe,EAAE;AACb,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,KAAK;QACpB,SAAS,EAAE,MAAM,CAAC,kBAAkB;AACpC,QAAA,UAAU,EAAE,QAAQ;AACvB,KAAA;AACD,IAAA,uBAAuB,EAAE;AACrB,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,QAAQ;QACvB,MAAM,EAAE,MAAM,CAAC,gBAAgB;AAClC,KAAA;AACD,IAAA,kBAAkB,EAAE;AAChB,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,KAAK;QACpB,SAAS,EAAE,MAAM,CAAC,kBAAkB;AACpC,QAAA,UAAU,EAAE,QAAQ;AACvB,KAAA;AACD,IAAA,kBAAkB,EAAE;AAChB,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,QAAQ;QACvB,MAAM,EAAE,MAAM,CAAC,gBAAgB;AAClC,KAAA;AACD,IAAA,gBAAgB,EAAE;AACd,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,aAAa,EAAE,KAAK;QACpB,SAAS,EAAE,MAAM,CAAC,mBAAmB;AACxC,KAAA;AACD,IAAA,eAAe,EAAE;AACb,QAAA,MAAM,EAAE,SAAS;AACpB,KAAA;AACJ,CAAA,CAAC;AAEF,SAAS,gBAAgB,CAAC,MAA+B,EAAA;AACrD,IAAA,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;AAC5B,QAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAA2B;IACpD;AACA,IAAA,OAAO,MAAM;AACjB;AAEA,SAAS,cAAc,CAAC,MAAsB,EAAA;AAC1C,IAAA,OAAO,MAAM,CAAC,MAAM,GAAG,EAAE,GAAG,EAAE,yBAAyB,MAAM,CAAC,MAAM,CAAA,CAAE,EAAE,GAAG,SAAS;AACxF;AAEA,SAAS,iBAAiB,CAAC,MAAyD,EAAA;AAChF,IAAA,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,KAAwC,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;AACrI,IAAA,OAAO,OAAO,CAAC,MAAM,aAAa,CAAC,GAAG,CAAC,gBAAgB,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC;AAC9E;AAEA,MAAM,WAAW,GAA8F,CAAC,KAAK,KAAI;IACrH,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK;AAC9C,IAAA,MAAM,OAAO,GAAG,SAAS,EAAE;IAE3B,QACIA,aAAK,SAAS,EAAE,OAAO,CAAC,cAAc,EAAA,QAAA,EAClCA,GAAA,CAAC,OAAO,EAAA,EAAC,OAAO,EAAE,KAAK,EAAE,YAAY,EAAC,OAAO,EAAC,WAAW,EAAC,QAAQ,EAAC,SAAS,EAAA,IAAA,EAAA,QAAA,EACxEC,cAAK,SAAS,EAAE,OAAO,CAAC,eAAe,EAAA,QAAA,EAAA,CAClC,IAAI,EACLD,GAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,UAAU,IAAI,GAAG,GAAI,CAAA,EAAA,CAC1C,EAAA,CACA,EAAA,CACR;AAEd,CAAC;AAED,MAAM,oBAAoB,GAAoG,CAAC,KAAK,KAAI;IACpI,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK;AACnD,IAAA,MAAM,OAAO,GAAG,SAAS,EAAE;IAE3B,IAAI,QAAQ,EAAE;QACV,OAAOA,GAAA,CAAAE,QAAA,EAAA,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAI;IAC1B;AAEA,IAAA,QACID,IAAA,CAAC,OAAO,EAAA,EAAC,SAAS,EAAA,IAAA,EAAA,QAAA,EAAA,CACdD,GAAA,CAAC,cAAc,EAAA,EAAC,wBAAwB,EAAA,IAAA,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAkB,EACpEA,IAAC,cAAc,EAAA,EAAA,QAAA,EACXC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,uBAAuB,aAC3CD,GAAA,CAAC,OAAO,EAAA,EAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,EAAE,GAAI,EAC9F,MAAM,CAAC,KAAK,IAAIA,GAAA,CAAC,WAAW,EAAA,EAAC,GAAG,EAAE,CAAA,OAAA,EAAU,MAAM,CAAC,KAAK,CAAA,CAAE,EAAE,UAAU,EAAE,MAAM,CAAC,KAAK,EAAE,IAAI,EAAEA,GAAA,CAAC,WAAW,EAAA,EAAA,CAAG,EAAE,KAAK,EAAC,OAAO,EAAA,CAAG,EAC7H,MAAM,CAAC,GAAG,IAAIA,IAAC,WAAW,EAAA,EAAC,GAAG,EAAE,MAAM,CAAC,GAAG,EAAE,UAAU,EAAE,MAAM,CAAC,GAAG,EAAE,IAAI,EAAEA,GAAA,CAAC,WAAW,KAAG,EAAE,KAAK,EAAC,SAAS,GAAG,EAC7G,MAAM,CAAC,aAAa,KACjBA,GAAA,CAAC,WAAW,IACR,GAAG,EAAE,CAAA,8BAAA,EAAiC,MAAM,CAAC,aAAa,CAAA,CAAE,EAC5D,UAAU,EAAE,MAAM,CAAC,aAAa,EAChC,IAAI,EAAEA,GAAA,CAAC,sBAAsB,KAAG,EAChC,KAAK,EAAC,OAAO,GACf,CACL,CAAA,EAAA,CACC,EAAA,CACO,CAAA,EAAA,CACX;AAElB,CAAC;AAED,MAAM,gBAAgB,GAAiD,IAAI,CAAC,CAAC,KAAK,KAAI;AAClF,IAAA,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK;AAC3B,IAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS;AAE9B,IAAA,MAAM,OAAO,GAAG,SAAS,EAAE;IAE3B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACnD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IACvD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAE7D,SAAS,CAAC,MAAK;QACX,MAAM,WAAW,GAAG,MAAK;YACrB,aAAa,CAAC,CAAC,SAAS,CAAC,WAAW,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC;YACnE,eAAe,CAAC,SAAS,CAAC,WAAW,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC;AACpE,YAAA,kBAAkB,CAAC,SAAS,CAAC,eAAe,CAAC;AACjD,QAAA,CAAC;QAED,MAAM,+BAA+B,GAAG,SAAS,CAAC,sBAAsB,CAAC,WAAW,CAAC;AACrF,QAAA,WAAW,EAAE;QAEb,OAAO,+BAA+B,CAAC,OAAO;AAClD,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;IAEf,MAAM,CAAC,MAAM,CAAC,GAAG,iBAAiB,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC;IACvF,MAAM,YAAY,GAAG,iBAAiB,CAAC,QAAQ,CAAC,YAAY,CAAC;AAE7D,IAAA,MAAM,kBAAkB,GAAG,QAAQ,CAAC,QAAQ,IAAI,QAAQ,CAAC,UAAU,IAAI,QAAQ,CAAC,IAAI;IACpF,MAAM,gBAAgB,GAAG,MAAM,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC;AAC1D,IAAA,MAAM,iBAAiB,GAAG,kBAAkB,IAAI,gBAAgB;AAChE,IAAA,MAAM,gBAAgB,GAAG,MAAM,EAAE,KAAK,IAAI,MAAM,EAAE,GAAG,IAAI,MAAM,EAAE,aAAa;IAC9E,MAAM,SAAS,GAAG,CAAC,QAAQ,CAAC,OAAO,GAAG,CAAA,EAAG,QAAQ,CAAC,OAAO,EAAE,GAAG,IAAI,EAAE,QAAQ,CAAC,OAAO,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;AAEhJ,IAAA,MAAM,OAAO,GAAG,WAAW,CAAC,YAAW;AACnC,QAAA,IAAI;AACA,YAAA,MAAM,SAAS,CAAC,YAAY,EAAE;QAClC;AAAE,QAAA,MAAM;;QAER;AACJ,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAEf,IAAA,MAAM,SAAS,GAAG,WAAW,CAAC,YAAW;AACrC,QAAA,IAAI;AACA,YAAA,MAAM,SAAS,CAAC,cAAc,EAAE;QACpC;AAAE,QAAA,MAAM;;QAER;AACJ,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAEf,IAAA,QACIC,IAAA,CAAC,aAAa,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,aAAa,EAAE,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAA,QAAA,EAAA,CAC3ED,GAAA,CAAC,eAAe,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,eAAe,EAAE,kBAAkB,EAAC,KAAK,EAAA,QAAA,EACzEC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,kBAAkB,EAAA,QAAA,EAAA,CACtCD,GAAA,CAAC,WAAW,EAAA,EAAA,QAAA,EAAE,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAA,CAAe,EACpDA,GAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAE,SAAS,CAAC,WAAW,EAAA,QAAA,EAChCA,GAAA,CAAC,aAAa,EAAA,EAAC,IAAI,EAAC,OAAO,EAAA,CAAG,EAAA,CAC3B,CAAA,EAAA,CACL,GACQ,EAClBA,GAAA,CAAC,cAAc,EAAA,EAAA,QAAA,EACXC,KAAC,IAAI,EAAA,EAAA,QAAA,EAAA,CACDD,GAAA,CAAC,UAAU,EAAA,EAAC,MAAM,EAAEA,GAAA,CAAC,KAAK,EAAA,EAAA,QAAA,EAAE,QAAQ,CAAC,WAAW,GAAS,EAAE,WAAW,EAAEA,GAAA,CAAC,QAAQ,EAAA,EAAC,MAAM,EAAA,IAAA,EAAA,QAAA,EAAE,SAAS,EAAA,CAAY,EAAA,CAAI,EAClH,iBAAiB,KACdC,IAAA,CAAC,WAAW,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,oBAAoB,aAC/C,kBAAkB,KACfA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,kBAAkB,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,QAAA,EAAA,CACjE,QAAQ,CAAC,QAAQ,IAAID,GAAA,CAAC,WAAW,EAAA,EAAC,GAAG,EAAE,QAAQ,CAAC,QAAQ,EAAE,IAAI,EAAEA,IAAC,WAAW,EAAA,EAAA,CAAG,EAAE,KAAK,EAAC,SAAS,EAAA,CAAG,EACnG,QAAQ,CAAC,UAAU,IAAIA,GAAA,CAAC,WAAW,EAAA,EAAC,GAAG,EAAE,QAAQ,CAAC,UAAU,EAAE,IAAI,EAAEA,IAAC,iBAAiB,EAAA,EAAA,CAAG,EAAE,KAAK,EAAC,YAAY,EAAA,CAAG,EAChH,QAAQ,CAAC,IAAI,IAAIA,GAAA,CAAC,WAAW,EAAA,EAAC,GAAG,EAAE,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAEA,GAAA,CAAC,UAAU,EAAA,EAAA,CAAG,EAAE,KAAK,EAAC,eAAe,EAAA,CAAG,CAAA,EAAA,CAC/F,CACT,EACA,gBAAgB,KACbC,cAAK,SAAS,EAAE,OAAO,CAAC,gBAAgB,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,QAAA,EAAA,CAC/D,MAAM,KACHD,GAAA,CAAC,oBAAoB,IAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,gBAAgB,EAAA,QAAA,EAC5EA,IAAC,OAAO,EAAA,EACJ,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,aAAa,EAAC,QAAQ,EACtB,MAAM,EAAE,EAAE,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,EAAE,EACzC,KAAK,EAAE,EAAE,MAAM,EAAE,gBAAgB,GAAG,SAAS,GAAG,SAAS,EAAE,EAAA,CAC7D,EAAA,CACiB,CAC1B,EACA,YAAY,CAAC,MAAM,GAAG,CAAC,KACpBA,GAAA,CAAC,WAAW,EAAA,EAAC,MAAM,EAAC,OAAO,EAAA,QAAA,EACtB,YAAY,CAAC,GAAG,CAAC,CAAC,WAAW,KAAI;AAC9B,gDAAA,QACIA,GAAA,CAAC,oBAAoB,IAAwB,MAAM,EAAE,WAAW,EAAE,KAAK,EAAC,aAAa,YACjFA,GAAA,CAAC,eAAe,IAAC,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,eAAe,EAAE,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,GAAI,EAAA,EAD5F,WAAW,CAAC,IAAI,CAEpB;AAE/B,4CAAA,CAAC,CAAC,EAAA,CACQ,CACjB,CAAA,EAAA,CACC,CACT,IACS,CACjB,EACDC,IAAA,CAAC,UAAU,eACN,UAAU,KACPD,GAAA,CAAC,MAAM,IAAC,UAAU,EAAC,SAAS,EAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAEA,IAAC,oBAAoB,EAAA,EAAA,CAAG,EAAE,OAAO,EAAE,OAAO,EAAA,QAAA,EAAA,KAAA,EAAA,CAEjF,CACZ,EACA,YAAY,KACTA,GAAA,CAAC,MAAM,EAAA,EAAC,UAAU,EAAC,WAAW,EAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAEA,GAAA,CAAC,aAAa,EAAA,EAAA,CAAG,EAAE,OAAO,EAAE,SAAS,uBAE9E,CACZ,EACA,eAAe,IAAIA,IAAC,OAAO,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,OAAO,EAAE,IAAI,EAAC,aAAa,EAAA,CAAG,CAAA,EAAA,CACrE,IACV,EAAA,CACM,CAAA,EAAA,CACL;AAExB,CAAC,CAAC;AAIK,MAAM,8BAA8B,GAA2C;AAClF,IAAA,YAAY,EAAE,eAAe;IAC7B,QAAQ,EAAE,CAAC,oBAAoB,CAAC;AAChC,IAAA,OAAO,EAAE,CAAC,YAAY,KAAI;AACtB,QAAA,MAAM,YAAY,GAAG,YAAY,CAAC,cAAc,CAAC;AAC7C,YAAA,GAAG,EAAE,eAAe;AACpB,YAAA,kBAAkB,EAAE,OAAO;AAC3B,YAAA,gBAAgB,EAAE,KAAK;AACvB,YAAA,cAAc,EAAE;AACZ,gBAAA,KAAK,EAAE,YAAY;AACnB,gBAAA,WAAW,EAAE,wIAAwI;AACxJ,aAAA;YACD,KAAK,EAAE,IAAI;YACX,SAAS,EAAE,MAAK;AACZ,gBAAA,MAAM,OAAO,GAAG,SAAS,EAAE;gBAE3B,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAW,WAAW,CAAC;AACrE,gBAAA,MAAM,gBAAgB,GAAG,mBAAmB,EAAE;gBAC9C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAe,EAAE,CAAC;gBAE9D,SAAS,CAAC,MAAK;oBACX,IAAI,gBAAgB,EAAE;AAClB,wBAAA,MAAM,uBAAuB,GAAG,YAAW;AACvC,4BAAA,MAAM,KAAK,GAAG,MAAM,gBAAgB,CAAC,oBAAoB,CAAC,SAAS,EAAE,SAAS,EAAE,WAAW,KAAK,WAAW,CAAC;AAC5G,4BAAA,MAAM,UAAU,GAAG,MAAM,KAAK,CAAC,kBAAkB,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC;4BACtE,aAAa,CAAC,UAAU,CAAC;AAC7B,wBAAA,CAAC;;AAGD,wBAAA,uBAAuB,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,KAAI;AACtC,4BAAA,MAAM,CAAC,IAAI,CAAC,kCAAkC,KAAK,CAAA,CAAE,CAAC;AAC1D,wBAAA,CAAC,CAAC;oBACN;AACJ,gBAAA,CAAC,EAAE,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAC;gBAEnC,QACIC,IAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EAAA,CACHD,GAAA,CAAC,aAAa,EAAA,EAAC,wBAAwB,EAAA,IAAA,EAAA,QAAA,EACnCA,GAAA,CAAC,OAAO,EAAA,EAAC,OAAO,EAAC,mBAAmB,EAAC,YAAY,EAAC,OAAO,YACrDA,GAAA,CAAC,MAAM,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,eAAe,EAAE,UAAU,EAAC,QAAQ,EAAC,IAAI,EAAEA,GAAA,CAAC,gBAAgB,EAAA,EAAA,CAAG,EAAA,CAAI,EAAA,CACxF,GACE,EAChBA,GAAA,CAAC,aAAa,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,uBAAuB,EAAA,QAAA,EACrDC,IAAA,CAAC,UAAU,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,mBAAmB,EAAA,QAAA,EAAA,CAC9CD,GAAA,CAAC,WAAW,IACR,MAAM,EACFA,GAAA,CAAC,aAAa,EAAA,EAAC,MAAM,EAAC,OAAO,EAAA,QAAA,EACzBA,GAAA,CAAC,MAAM,EAAA,EAAC,UAAU,EAAC,QAAQ,EAAA,YAAA,EAAY,OAAO,EAAC,IAAI,EAAEA,IAAC,cAAc,EAAA,EAAA,CAAG,EAAA,CAAI,EAAA,CAC/D,EAAA,QAAA,EAGpBC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CAAA,YAAA,EAEID,KAAC,OAAO,EAAA,EACJ,SAAS,EAAE,OAAO,CAAC,sBAAsB,EACzC,aAAa,EAAE,WAAW,EAC1B,WAAW,EAAE,CAAC,KAAqB,EAAE,IAAmB,KAAI;AACxD,wDAAA,cAAc,CAAC,IAAI,CAAC,KAAiB,CAAC;AAC1C,oDAAA,CAAC,EAAA,QAAA,EAAA,CAEDD,GAAA,CAAC,GAAG,EAAA,EAAC,KAAK,EAAE,WAA8B,EAAA,QAAA,EAAA,WAAA,EAAA,CAAiB,EAC3DA,GAAA,CAAC,GAAG,EAAA,EAAC,KAAK,EAAE,WAA8B,EAAA,QAAA,EAAA,WAAA,EAAA,CAAiB,CAAA,EAAA,CACrD,CAAA,EAAA,CACX,EAAA,CACO,EACdA,GAAA,CAAC,aAAa,EAAA,EAAC,SAAS,EAAE,OAAO,CAAC,sBAAsB,EAAA,QAAA,EACpDA,IAAC,SAAS,EAAA,EAAC,WAAW,EAAA,IAAA,EAAA,QAAA,EACjB,UAAU,CAAC,GAAG,CAAC,CAAC,SAAS,MACtBA,GAAA,CAAC,gBAAgB,IAA+B,SAAS,EAAE,SAAS,EAAA,EAA7C,SAAS,CAAC,QAAQ,CAAC,IAAI,CAA0B,CAC3E,CAAC,EAAA,CACM,EAAA,CACA,CAAA,EAAA,CACP,EAAA,CACD,CAAA,EAAA,CACX;YAEjB,CAAC;AACJ,SAAA,CAAC;QAEF,OAAO;AACH,YAAA,OAAO,EAAE,MAAM,YAAY,CAAC,OAAO,EAAE;SACxC;IACL,CAAC;;;;;"}

package/lib/hooks/compoundPropertyHooks.d.ts

@@ -0,0 +1,24 @@
+import { Color3, Color4 } from "@babylonjs/core/Maths/math.color.js";
+import { Quaternion, Vector3 } from "@babylonjs/core/Maths/math.vector.js";
+type PropertyKeys<TargetT, PropertyT> = {
+    [PropertyKeyT in keyof TargetT]: TargetT[PropertyKeyT] extends PropertyT | null | undefined ? PropertyKeyT : never;
+}[keyof TargetT];
+export declare function useProperty<TargetT extends object, PropertyKeyT extends keyof TargetT>(target: TargetT, propertyKey: PropertyKeyT): TargetT[PropertyKeyT];
+export declare function useProperty<TargetT extends object, PropertyKeyT extends keyof TargetT>(target: TargetT | null | undefined, propertyKey: PropertyKeyT): TargetT[PropertyKeyT] | undefined;
+export declare function useVector3Property<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Vector3>>(target: TargetT, propertyKey: PropertyKeyT): TargetT[PropertyKeyT];
+export declare function useVector3Property<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Vector3>>(target: TargetT | null | undefined, propertyKey: PropertyKeyT): TargetT[PropertyKeyT] | undefined;
+export declare function useColor3Property<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Color3>>(target: TargetT, propertyKey: PropertyKeyT): TargetT[PropertyKeyT];
+export declare function useColor3Property<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Color3>>(target: TargetT | null | undefined, propertyKey: PropertyKeyT): TargetT[PropertyKeyT] | undefined;
+export declare function useColor4Property<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Color4>>(target: TargetT, propertyKey: PropertyKeyT): TargetT[PropertyKeyT];
+export declare function useColor4Property<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Color4>>(target: TargetT | null | undefined, propertyKey: PropertyKeyT): TargetT[PropertyKeyT] | null;
+export declare function useQuaternionProperty<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Quaternion>>(target: TargetT, propertyKey: PropertyKeyT): TargetT[PropertyKeyT];
+export declare function useQuaternionProperty<TargetT extends object, PropertyKeyT extends PropertyKeys<TargetT, Quaternion>>(target: TargetT | null | undefined, propertyKey: PropertyKeyT): TargetT[PropertyKeyT] | undefined;
+/**
+ * Creates a hook for a concrete value. For example, if the value is a Vector3,
+ * it will return a hook that can intercept a change to the Vector3 property or
+ * any of its components (x, y, z).
+ * @param value The current value of a property that will be hooked.
+ * @returns A hook function that can be used to observe changes to the property.
+ */
+export declare function MakePropertyHook(value: unknown): typeof useProperty;
+export {};

package/lib/hooks/instrumentationHooks.d.ts

@@ -0,0 +1,9 @@
+import { type IReadonlyObservable } from "@babylonjs/core/index.js";
+/**
+ * Provides an observable that fires when a specified function/property is called/set.
+ * @param type The type of the interceptor, either "function" or "property".
+ * @param target The object containing the function/property to intercept.
+ * @param propertyKey The key of the function/property to intercept.
+ * @returns An observable that fires when the function/property is called/set.
+ */
+export declare function useInterceptObservable<T extends object>(type: "function" | "property", target: T | null | undefined, propertyKey: keyof T): IReadonlyObservable<void>;

package/lib/hooks/observableHooks.d.ts

@@ -0,0 +1,35 @@
+import { type IReadonlyObservable } from "@babylonjs/core/index.js";
+import { type ObservableCollection } from "../misc/observableCollection";
+/**
+ * Returns the current value of the accessor and updates it when the specified event is fired on the specified element.
+ * @param accessor A function that returns the current value.
+ * @param element The element to listen for the event on.
+ * @param eventNames The names of the events to listen for.
+ * @returns The current value of the accessor.
+ *  * @remarks If the accessor function is not idempotent (e.g. it returns a different array or object instance each time it is called),
+ * then there is a good chance it should be wrapped in a `useCallback` to prevent unnecessary re-renders or re-render infinite loops.
+ */
+export declare function useEventfulState<T>(accessor: () => T, element: HTMLElement | null | undefined, ...eventNames: string[]): T;
+/**
+ * Returns the current value of the accessor and updates it when any of the specified observables change.
+ * @param accessor A function that returns the current value.
+ * @param observables The observables to listen for changes on.
+ * @returns The current value of the accessor.
+ * @remarks If the accessor function is not idempotent (e.g. it returns a different array or object instance each time it is called),
+ * then there is a good chance it should be wrapped in a `useCallback` to prevent unnecessary re-renders or re-render infinite loops.
+ */
+export declare function useObservableState<T>(accessor: () => T, ...observables: Array<IReadonlyObservable | null | undefined>): T;
+/**
+ * Returns a copy of the items in the collection and updates it when the collection changes.
+ * @param collection The collection to observe.
+ * @returns A copy of the items in the collection.
+ */
+export declare function useObservableCollection<T>(collection: ObservableCollection<T>): T[];
+/**
+ * Returns a copy of the items in the collection sorted by the order property and updates it when the collection changes.
+ * @param collection The collection to observe.
+ * @returns A copy of the items in the collection sorted by the order property.
+ */
+export declare function useOrderedObservableCollection<T extends Readonly<{
+    order?: number;
+}>>(collection: ObservableCollection<T>): T[];

package/lib/hooks/pollingHooks.d.ts

@@ -0,0 +1,7 @@
+import { type IReadonlyObservable } from "@babylonjs/core/index.js";
+/**
+ * Creates a polling observable that notifies its observers at a specified interval.
+ * @param delay The polling interval in milliseconds.
+ * @returns A readonly observable that can be used to subscribe to polling notifications.
+ */
+export declare function usePollingObservable(delay: number): IReadonlyObservable<void>;

package/lib/hooks/resourceHooks.d.ts

@@ -0,0 +1,20 @@
+import { type DependencyList } from "react";
+import { type IDisposable } from "@babylonjs/core/index.js";
+/**
+ * Custom hook to manage a resource with automatic disposal. The resource is created once initially, and recreated
+ * if the factory function or any dependency changes. Whenever the resource is recreated, the previous instance is
+ * disposed. The final instance is disposed when the component using this hook unmounts.
+ * @param factory A function that creates the resource.
+ * @param deps An optional dependency list. When any dependency changes, the resource is disposed and recreated.
+ * @returns The created resource.
+ */
+export declare function useResource<T extends IDisposable | null | undefined>(factory: () => T, deps?: DependencyList): T;
+/**
+ * Custom hook to manage an asynchronous resource with automatic disposal. The resource is created once initially, and recreated
+ * if the factory function or any dependency changes. Whenever the resource is recreated, the previous instance is
+ * disposed. The final instance is disposed when the component using this hook unmounts.
+ * @param factory A function that creates the resource.
+ * @param deps An optional dependency list. When any dependency changes, the resource is disposed and recreated.
+ * @returns The created resource.
+ */
+export declare function useAsyncResource<T extends IDisposable | null | undefined>(factory: (abortSignal: AbortSignal) => Promise<T>, deps?: DependencyList): T | undefined;

package/lib/hooks/settingsHooks.d.ts

@@ -0,0 +1,13 @@
+import { type Dispatch, type SetStateAction } from "react";
+import { type SettingDescriptor } from "../services/settingsStore";
+/**
+ * Hook that reads and writes a setting from the settings store.
+ * @param descriptor The setting descriptor that identifies the setting and its default value.
+ * @returns A tuple of [currentValue, setValue, resetValue] similar to React's useState.
+ */
+export declare function useSetting<T>(descriptor: SettingDescriptor<T>): [T, Dispatch<SetStateAction<T>>, () => void];
+/**
+ * Gets functions used to convert to/from display values for angles based on the current settings.
+ * @returns A tuple containing the functions to convert to and from display values.
+ */
+export declare function useAngleConverters(): readonly [(angle: number, wrap?: boolean) => number, (angle: number, wrap?: boolean) => number, boolean];

package/lib/hooks/teachingMomentHooks.d.ts

@@ -0,0 +1,34 @@
+import { type Nullable } from "@babylonjs/core/index.js";
+import { type OnOpenChangeData, type PositioningImperativeRef } from "@fluentui/react-components";
+/**
+ * Creates a hook for managing teaching moment state.
+ * @param name The unique name of the teaching moment.
+ * @returns A hook that returns the teaching moment state.
+ */
+export declare function MakeTeachingMoment(name: string): (suppress?: boolean) => {
+    readonly shouldDisplay: boolean;
+    readonly onDismissed: () => void;
+    readonly reset: () => void;
+};
+/**
+ * Creates a hook for managing teaching moment state for a dialog.
+ * @param name The unique name of the teaching moment.
+ * @returns A hook that returns the teaching moment state for a dialog.
+ */
+export declare function MakeDialogTeachingMoment(name: string): (suppress?: boolean) => {
+    readonly shouldDisplay: boolean;
+    readonly onOpenChange: (e: unknown, data: OnOpenChangeData) => void;
+    readonly reset: () => void;
+};
+/**
+ * Creates a hook for managing teaching moment state for a popover.
+ * @param name The unique name of the teaching moment.
+ * @returns A hook that returns the teaching moment state for a popover.
+ */
+export declare function MakePopoverTeachingMoment(name: string): (suppress?: boolean) => {
+    readonly shouldDisplay: boolean;
+    readonly positioningRef: import("react").Dispatch<import("react").SetStateAction<Nullable<PositioningImperativeRef>>>;
+    readonly targetRef: import("react").Dispatch<import("react").SetStateAction<Nullable<HTMLElement>>>;
+    readonly onOpenChange: (e: unknown, data: OnOpenChangeData) => void;
+    readonly reset: () => void;
+};

package/lib/hooks/themeHooks.d.ts

@@ -0,0 +1,17 @@
+import { type ThemeMode } from "../services/themeService";
+/**
+ * Hook that provides the current theme mode state and controls for changing it.
+ * @returns An object with the current dark mode state, theme mode, and functions to set or toggle the theme.
+ */
+export declare function useThemeMode(): {
+    readonly isDarkMode: boolean;
+    readonly themeMode: ThemeMode;
+    readonly setThemeMode: (mode: ThemeMode) => void;
+    readonly toggleThemeMode: () => void | undefined;
+};
+/**
+ * Hook that returns the current Fluent UI theme based on the active theme mode.
+ * @param invert If true, inverts the theme (returns light theme in dark mode and vice versa). Defaults to false.
+ * @returns The current Fluent UI theme object.
+ */
+export declare function useTheme(invert?: boolean): import("@fluentui/tokens").Theme;

package/lib/hooks/useObservableArray.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Return a copied array and re-render when array mutators run.
+ * Intercept add/remove/change functions because the underlying APIs update internal arrays in-place.
+ * @param target The target object containing the observable array, or null if the array is not applicable.
+ * @param getItems A function to get the current items in the array.
+ * @param addFn The name of the function to add an item to the array.
+ * @param removeFn The name of the function to remove an item from the array.
+ * @param changeFn The name of the function to change an item in the array.
+ * @returns A copied array that re-renders when array mutators run.
+ */
+export declare function useObservableArray<TargetT extends object, ItemT>(target: TargetT | null, getItems: () => ReadonlyArray<ItemT> | null | undefined, addFn: keyof TargetT, removeFn: keyof TargetT, changeFn?: keyof TargetT): ItemT[];

package/lib/hooks/useResizeHandle.d.ts

@@ -0,0 +1,35 @@
+export type GrowDirection = "end" | "start" | "up" | "down";
+export type UseResizeHandleParams = {
+    /**
+     * The direction in which the element is considered growing in size ('end', 'start', 'up', or 'down').
+     */
+    growDirection: GrowDirection;
+    /**
+     * The name of the CSS variable that will be set on the wrapper element to reflect the current size of the element.
+     */
+    variableName: string;
+    /**
+     * A callback that will be called when the element is resized.
+     *
+     * @remarks The passed function should be memoized for better performance.
+     */
+    onChange?: (value: number) => void;
+    /**
+     * The minimum change allowed (e.g. the smallest negative number allowed).
+     */
+    minValue?: number;
+    /**
+     * The maximum change allowed (e.g. the largest positive number allowed).
+     */
+    maxValue?: number;
+};
+/**
+ * A custom hook that helps with element resizing.
+ * @param params The parameters for the resize handle.
+ * @returns An object containing refs and a function to set the value.
+ */
+export declare function useResizeHandle(params: UseResizeHandleParams): {
+    elementRef: import("react").Dispatch<import("react").SetStateAction<HTMLElement | null>>;
+    handleRef: import("react").Dispatch<import("react").SetStateAction<HTMLElement | null>>;
+    setValue: (value: number) => void;
+};