@hubspot/ui-extensions 0.11.0 → 0.11.2

package/dist/experimental/testing/internal/query.js

@@ -0,0 +1,213 @@
+import { __hubSpotComponentRegistry } from '../../../__synced__/remoteComponents.synced';
+import { isRenderedElementNode, isRenderedFragmentNode } from '../type-utils';
+import { ComponentNotFoundError, FindInvalidComponentError, InvalidComponentsError, } from './errors';
+import { checkElementMatches } from './match';
+const addMatchToFindResult = (findResult, match, options) => {
+    if (options.findFirstOnly) {
+        findResult.match = match;
+    }
+    else {
+        findResult.allMatches.push(match);
+    }
+};
+/**
+ * Recursive helper for finding elements in the rendered tree.
+ * NOTE: The input `findResult` is mutated in place.
+ *
+ * @param parentNode The parent node to search in.
+ * @param options The options for the find operation.
+ * @param findResult The find result to mutate.
+ */
+const findInternalHelper = (parentNode, options, findResult) => {
+    const { children } = parentNode;
+    const { targetComponent, matcher, findFirstOnly, findDirectChildrenOnly } = options;
+    const targetComponentName = __hubSpotComponentRegistry.getComponentName(targetComponent);
+    for (const child of children) {
+        if (!isRenderedElementNode(child)) {
+            // Skip over non-element child nodes (just text nodes)
+            continue;
+        }
+        if (child.name === targetComponentName &&
+            checkElementMatches(child, matcher)) {
+            // We found a match, so add it to the find result
+            addMatchToFindResult(findResult, child, options);
+            if (findFirstOnly) {
+                return;
+            }
+        }
+        // We only search in nested children and fragment props if we're not only looking for children
+        if (!findDirectChildrenOnly) {
+            // Search for the component in the fragment props
+            const { props } = child;
+            const fragmentProps = __hubSpotComponentRegistry.getComponentFragmentPropNames(child.name);
+            for (const fragmentPropName of fragmentProps) {
+                const maybeFragment = props[fragmentPropName];
+                // NOTE: As part of the conversion process of converting remote nodes to rendered nodes, we
+                //       create a RenderedFragmentNode for each fragment prop and put that into the props object.
+                if (isRenderedFragmentNode(maybeFragment)) {
+                    findInternalHelper(maybeFragment, options, findResult);
+                    if (findFirstOnly && findResult.match) {
+                        return;
+                    }
+                }
+            }
+            // Search for the component in the child
+            findInternalHelper(child, options, findResult);
+            if (findFirstOnly && findResult.match) {
+                return;
+            }
+        }
+    }
+    return;
+};
+/**
+ * Internal utility that centralizes finding elements in the rendered tree (including error handling).
+ *
+ * @param parentNode The parent node to search in.
+ * @param options The options for the find operation.
+ * @returns The find result.
+ */
+const findInternal = (parentNode, options) => {
+    const { document } = parentNode;
+    const { targetComponent, findMethodName, shouldThrowErrorIfNotFound } = options;
+    const targetComponentName = __hubSpotComponentRegistry.getComponentName(targetComponent);
+    if (!targetComponentName) {
+        throw new FindInvalidComponentError({
+            findMethodName,
+        });
+    }
+    // We always validate the document before running the find operation since the document may
+    // have been updated asynchronously in the background.
+    if (document.hasInvalidComponentNames()) {
+        throw new InvalidComponentsError(document.rootNode);
+    }
+    // Initialize the find result that will be mutated in place
+    const findResult = {
+        match: null,
+        allMatches: [],
+    };
+    // Run the internal find helper to recursively search the rendered tree
+    findInternalHelper(parentNode, options, findResult);
+    if (findResult.match === null && shouldThrowErrorIfNotFound) {
+        throw new ComponentNotFoundError({
+            findMethodName: options.findMethodName,
+            parentNode,
+            componentName: targetComponentName,
+        });
+    }
+    return findResult;
+};
+/**
+ * Finds the first descendant element node that matches the given component.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param matcher An optional matcher to filter the elements.
+ * @returns The first element node that matches the given component or `null` if no match is found.
+ */
+export const maybeFind = (parentNode, targetComponent, matcher) => {
+    const { match } = findInternal(parentNode, {
+        targetComponent,
+        matcher,
+        findFirstOnly: true,
+        findDirectChildrenOnly: false,
+        findMethodName: 'maybeFind',
+        shouldThrowErrorIfNotFound: false,
+    });
+    return match;
+};
+/**
+ * Finds the first descendant element node that matches the given component.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param matcher An optional matcher to filter the elements.
+ * @returns The first element node that matches the given component.
+ */
+export const find = (parentNode, targetComponent, matcher) => {
+    const { match } = findInternal(parentNode, {
+        targetComponent,
+        matcher,
+        findFirstOnly: true,
+        findDirectChildrenOnly: false,
+        findMethodName: 'find',
+        shouldThrowErrorIfNotFound: true,
+    });
+    return match;
+};
+/**
+ * Finds all descendant element nodes that match the given component.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param matcher An optional matcher to filter the elements.
+ * @returns An array of element nodes that match the given component.
+ */
+export const findAll = (parentNode, targetComponent, matcher) => {
+    const { allMatches } = findInternal(parentNode, {
+        targetComponent,
+        matcher,
+        findFirstOnly: false,
+        findDirectChildrenOnly: false,
+        findMethodName: 'findAll',
+        shouldThrowErrorIfNotFound: false,
+    });
+    return allMatches;
+};
+/**
+ * Finds the first direct child element node that matches the given component.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param matcher An optional matcher to filter the elements.
+ * @returns The first child element node that matches the given component.
+ */
+export const findChild = (parentNode, targetComponent, matcher) => {
+    const { match } = findInternal(parentNode, {
+        targetComponent,
+        matcher,
+        findFirstOnly: true,
+        findDirectChildrenOnly: true,
+        findMethodName: 'findChild',
+        shouldThrowErrorIfNotFound: true,
+    });
+    return match;
+};
+/**
+ * Finds the first direct child element node that matches the given component.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param matcher An optional matcher to filter the elements.
+ * @returns The first child element node that matches the given component.
+ */
+export const maybeFindChild = (parentNode, targetComponent, matcher) => {
+    const { match } = findInternal(parentNode, {
+        targetComponent,
+        matcher,
+        findFirstOnly: true,
+        findDirectChildrenOnly: true,
+        findMethodName: 'maybeFindChild',
+        shouldThrowErrorIfNotFound: false,
+    });
+    return match;
+};
+/**
+ * Finds all direct child element nodes that match the given component.
+ *
+ * @param parentNode The parent node to search in.
+ * @param targetComponent The component to find.
+ * @param matcher An optional matcher to filter the elements.
+ * @returns An array of child element nodes that match the given component.
+ */
+export const findAllChildren = (parentNode, targetComponent, matcher) => {
+    const { allMatches } = findInternal(parentNode, {
+        targetComponent,
+        matcher,
+        findFirstOnly: false,
+        findDirectChildrenOnly: true,
+        findMethodName: 'findAllChildren',
+        shouldThrowErrorIfNotFound: false,
+    });
+    return allMatches;
+};

package/dist/experimental/testing/internal/root.d.ts

@@ -0,0 +1,8 @@
+import type { RenderedDocumentInternal, RenderedRootNodeInternal } from './types-internal';
+/**
+ * Creates a rendered root node.
+ *
+ * @param document The document that the root belongs to.
+ * @returns A rendered root node.
+ */
+export declare const createRootNode: (document: RenderedDocumentInternal) => RenderedRootNodeInternal;

package/dist/experimental/testing/internal/root.js

@@ -0,0 +1,44 @@
+import { RenderedNodeType } from '../types';
+import { EMPTY_CHILDREN } from './constants';
+import { debugLog } from './debug';
+import { printNode } from './print';
+import { find, findAll, findAllChildren, findChild, maybeFind, maybeFindChild, } from './query';
+/**
+ * Creates a rendered root node.
+ *
+ * @param document The document that the root belongs to.
+ * @returns A rendered root node.
+ */
+export const createRootNode = (document) => {
+    const rootNode = {
+        nodeType: RenderedNodeType.Root,
+        text: null,
+        children: EMPTY_CHILDREN,
+        document,
+        debugLog: (label) => {
+            debugLog(rootNode, label);
+        },
+        find: (targetComponent, matcher) => {
+            return find(rootNode, targetComponent, matcher);
+        },
+        findAll: (targetComponent, matcher) => {
+            return findAll(rootNode, targetComponent, matcher);
+        },
+        findChild: (targetComponent, matcher) => {
+            return findChild(rootNode, targetComponent, matcher);
+        },
+        findAllChildren: (targetComponent, matcher) => {
+            return findAllChildren(rootNode, targetComponent, matcher);
+        },
+        maybeFind: (targetComponent, matcher) => {
+            return maybeFind(rootNode, targetComponent, matcher);
+        },
+        maybeFindChild: (targetComponent, matcher) => {
+            return maybeFindChild(rootNode, targetComponent, matcher);
+        },
+        toString: () => {
+            return printNode(rootNode);
+        },
+    };
+    return rootNode;
+};

package/dist/experimental/testing/internal/text.d.ts

@@ -0,0 +1,9 @@
+import { type RemoteRoot, type RemoteText } from '@remote-ui/core';
+import { type RenderedTextNode } from '../types';
+/**
+ * Creates a rendered text node.
+ *
+ * @param remoteText The remote text node or string to create a text node from.
+ * @returns A rendered text node.
+ */
+export declare const createTextNode: (remoteText: RemoteText<RemoteRoot> | string) => RenderedTextNode;

package/dist/experimental/testing/internal/text.js

@@ -0,0 +1,16 @@
+import { RenderedNodeType } from '../types';
+/**
+ * Creates a rendered text node.
+ *
+ * @param remoteText The remote text node or string to create a text node from.
+ * @returns A rendered text node.
+ */
+export const createTextNode = (remoteText) => {
+    const text = typeof remoteText === 'string' ? remoteText : remoteText.text;
+    const textNode = {
+        nodeType: RenderedNodeType.Text,
+        text,
+        toString: () => text,
+    };
+    return textNode;
+};

package/dist/experimental/testing/internal/utils/promise-utils.d.ts

@@ -0,0 +1,14 @@
+/**
+ * A deferred promise that can be resolved or rejected externally.
+ */
+export interface Deferred<T = unknown> {
+    promise: Promise<T>;
+    resolve: (value: T) => void;
+    reject: (error: unknown) => void;
+}
+/**
+ * Creates a deferred promise that can be resolved or rejected externally.
+ *
+ * @returns A deferred promise object.
+ */
+export declare const createDeferred: <T = unknown>() => Deferred<T>;

package/dist/experimental/testing/internal/utils/promise-utils.js

@@ -0,0 +1,14 @@
+/**
+ * Creates a deferred promise that can be resolved or rejected externally.
+ *
+ * @returns A deferred promise object.
+ */
+export const createDeferred = () => {
+    let resolve;
+    let reject;
+    const promise = new Promise((_resolve, _reject) => {
+        resolve = _resolve;
+        reject = _reject;
+    });
+    return { promise, resolve: resolve, reject: reject };
+};

package/dist/experimental/testing/render.d.ts

@@ -0,0 +1,9 @@
+import { type ReactNode } from 'react';
+import { type RenderResult } from './types';
+/**
+ * Renders a UI extension component using React so that assertions can be made against the rendered output.
+ *
+ * @param node The React node to render.
+ * @returns A render result object that can be used to query the rendered DOM.
+ */
+export declare const render: (node: ReactNode) => RenderResult;

package/dist/experimental/testing/render.js

@@ -0,0 +1,155 @@
+import { createRemoteRoot } from '@remote-ui/core';
+import { createRoot as createReactRoot } from '@remote-ui/react';
+import { convertRemoteRoot } from './internal/convert';
+import { createDocument } from './internal/document';
+import { InvalidComponentsError, WaitForTimeoutError } from './internal/errors';
+import { isMatch } from './internal/match';
+import { find, findAll, findAllChildren, findChild, maybeFind, maybeFindChild, } from './internal/query';
+import { createRootNode } from './internal/root';
+import { createDeferred } from './internal/utils/promise-utils';
+const DEFAULT_WAIT_FOR_TIMEOUT_IN_MS = 1000;
+const DEFAULT_WAIT_FOR_OPTIONS = {
+    timeoutInMs: DEFAULT_WAIT_FOR_TIMEOUT_IN_MS,
+};
+/**
+ * Renders a UI extension component using React so that assertions can be made against the rendered output.
+ *
+ * @param node The React node to render.
+ * @returns A render result object that can be used to query the rendered DOM.
+ */
+export const render = (node) => {
+    let dirty = true;
+    let waitForChecksQueued = false;
+    let waitForList = [];
+    const runWaitForChecks = () => {
+        waitForChecksQueued = false;
+        waitForList = waitForList.filter((waitFor) => {
+            // eslint-disable-next-line @typescript-eslint/no-use-before-define
+            const renderedRootNode = getLatestRootNode();
+            if (renderedRootNode.document.hasInvalidComponentNames()) {
+                // Reject the waitFor promise if we detect invalid components in the rendered output.
+                waitFor.deferred.reject(new InvalidComponentsError(renderedRootNode));
+                if (waitFor.setTimeoutId) {
+                    // Clear the timeout so that we don't reject the promise if the check passes before the timeout expires.
+                    // Technically, calling reject on a promise that has already been resolved is a no-op.
+                    clearTimeout(waitFor.setTimeoutId);
+                }
+                return false;
+            }
+            try {
+                waitFor.check(); // Run the user provided check function.
+                if (waitFor.setTimeoutId) {
+                    // Clear the timeout so that we don't reject the promise if the check passes before the timeout expires.
+                    // Technically, calling reject on a promise that has already been resolved is a no-op.
+                    clearTimeout(waitFor.setTimeoutId);
+                }
+                waitFor.deferred.resolve(); // Resolve the promise that was originally returned by the waitFor function.
+                return false; // Remove the waitFor from the list since the check passed and we resolved the promise
+            }
+            catch (error) {
+                return true; // Keep the waitFor in the list since the check failed and we didn't resolve the promise.
+            }
+        });
+    };
+    /**
+     * This function will be invoked any time there are changes to the remote DOM.
+     * We don't really care what the changes were because we are not actually sending them
+     * to a host page. We are only interested in the fact that the DOM has been updated
+     * so that we can know that we need rebuild our own tree of rendered nodes.
+     */
+    const remoteChannel = () => {
+        dirty = true;
+        if (waitForList.length > 0) {
+            // Even though @remote-ui/core is notifying us that the DOM has been updated, it hasn't actually
+            // applied the DOMs to the remote DOM representation. Therefore, we need to queue a microtask to
+            // run the waitFor checks at the end of the event loop to give the DOM a chance to be updated...
+            if (!waitForChecksQueued) {
+                waitForChecksQueued = true;
+                queueMicrotask(runWaitForChecks);
+            }
+        }
+    };
+    const remoteRoot = createRemoteRoot(remoteChannel);
+    const reactRoot = createReactRoot(remoteRoot);
+    reactRoot.render(node);
+    remoteRoot.mount();
+    let maybeRenderedRootNode;
+    /**
+     * Returns the latest rendered root node. If the root node has not been rendered yet, it will be rendered.
+     * If there were no changes to the remote DOM then the previously rendered root node will be returned.
+     */
+    const getLatestRootNode = () => {
+        if (maybeRenderedRootNode && !dirty) {
+            // Return the previously rendered root node if there were no changes to the remote DOM.
+            return maybeRenderedRootNode;
+        }
+        // Create a new document for the next rendered DOM tree
+        const document = createDocument({
+            getLatestRootNode,
+        });
+        const nextRootNode = createRootNode(document);
+        document.rootNode = nextRootNode;
+        // Convert the tree of remote nodes to a tree of rendered nodes.
+        convertRemoteRoot(nextRootNode, remoteRoot);
+        maybeRenderedRootNode = nextRootNode;
+        dirty = false;
+        return maybeRenderedRootNode;
+    };
+    const initialRenderedRootNode = getLatestRootNode();
+    if (initialRenderedRootNode.document.hasInvalidComponentNames()) {
+        throw new InvalidComponentsError(initialRenderedRootNode);
+    }
+    return {
+        find: (component, matcher) => {
+            return find(getLatestRootNode(), component, matcher);
+        },
+        findAll: (component, matcher) => {
+            return findAll(getLatestRootNode(), component, matcher);
+        },
+        findChild: (component, matcher) => {
+            return findChild(getLatestRootNode(), component, matcher);
+        },
+        findAllChildren: (component, matcher) => {
+            return findAllChildren(getLatestRootNode(), component, matcher);
+        },
+        maybeFindChild: (component, matcher) => {
+            return maybeFindChild(getLatestRootNode(), component, matcher);
+        },
+        maybeFind: (component, matcher) => {
+            return maybeFind(getLatestRootNode(), component, matcher);
+        },
+        waitFor: (check, options = DEFAULT_WAIT_FOR_OPTIONS) => {
+            const { timeoutInMs = DEFAULT_WAIT_FOR_TIMEOUT_IN_MS } = options;
+            try {
+                check();
+                // Nothing to wait for since the check passed! Resolve the promise immediately.
+                return Promise.resolve();
+            }
+            catch (error) {
+                // If the check failed then we need to put it in the waitForList so that we
+                // can check it again later. We return a promise that will be resolved when
+                // the provided check passes.
+            }
+            const deferred = createDeferred();
+            const waitFor = { check, deferred, setTimeoutId: null };
+            waitForList.push(waitFor);
+            if (timeoutInMs > 0) {
+                waitFor.setTimeoutId = setTimeout(() => {
+                    // Remove the wait for from the list since the timeout expired and we rejected the promise.
+                    waitForList = waitForList.filter((currentWaitFor) => currentWaitFor !== waitFor);
+                    deferred.reject(new WaitForTimeoutError(timeoutInMs));
+                }, timeoutInMs);
+            }
+            return deferred.promise;
+        },
+        debugLog: (label) => {
+            return getLatestRootNode().debugLog(label);
+        },
+        getRootNode: () => {
+            return getLatestRootNode();
+        },
+        isMatch: (targetNode, component, matcher) => {
+            return isMatch(targetNode, component, matcher);
+        },
+    };
+};

package/dist/experimental/testing/types.d.ts

@@ -1,4 +1,4 @@
-import { HubSpotReactComponent, HubSpotReactFragmentProp, UnknownComponentProps } from '../../types';
+import { HubSpotReactComponent, HubSpotReactFragmentProp, UnknownComponentProps } from '../../__synced__/types/shared.synced';
 /**
  * The type of a rendered node.
  */
@@ -235,6 +235,7 @@ export interface RenderResult extends CommonQueryMethods {
      * @returns The root node.
      */
     getRootNode: () => RenderedRootNode;
+    isMatch: <TComponentProps extends UnknownComponentProps>(node: RenderedNode | null | undefined, component: HubSpotReactComponent<TComponentProps>, matcher?: ElementMatcher<TComponentProps>) => node is RenderedElementNode<TComponentProps>;
 }
 export type RenderedNode = RenderedElementNode<any> | RenderedRootNode | RenderedFragmentNode | RenderedTextNode;
 export {};

package/dist/hubspot.d.ts

@@ -1,5 +1,5 @@
 import { ReactElement } from 'react';
-import type { ExtensionPoints, ExtensionPointApi, ServerlessRunnerParams, HubSpotFetchRequestURI, HubSpotFetchOptions } from './types';
+import type { ExtensionPoints, ExtensionPointApi, ServerlessRunnerParams, HubSpotFetchRequestURI, HubSpotFetchOptions } from './__synced__/types/index.synced';
 export declare function extend_V2<ExtensionPointName extends keyof ExtensionPoints>(renderExtensionCallback: (api: ExtensionPointApi<ExtensionPointName>) => ReactElement<any>): any;
 export declare function serverless<T = any>(name: ServerlessRunnerParams['name'], options?: Omit<ServerlessRunnerParams, 'name'>): Promise<T>;
 export declare function fetch(url: HubSpotFetchRequestURI, options?: HubSpotFetchOptions): Promise<Response>;

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import './clientTypes';
 export { hubspot } from './hubspot';
 export { logger } from './logger';
-export * from './coreComponents';
-export * from './types';
+export * from './__synced__/types/index.synced';
+export { Accordion, Alert, AutoGrid, BarChart, Box, Button, ButtonRow, Card, Checkbox, CurrencyInput, DateInput, DescriptionList, DescriptionListItem, Divider, Dropdown, EmptyState, ErrorState, Flex, Form, Heading, Icon, Illustration, Image, Inline, Input, LineChart, Link, List, LoadingButton, LoadingSpinner, Modal, ModalBody, ModalFooter, MultiSelect, NumberInput, Panel, PanelBody, PanelFooter, PanelSection, ProgressBar, RadioButton, SearchInput, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, StatusTag, StepIndicator, StepperInput, Tab, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Tag, Text, TextArea, Textarea, Tile, TimeInput, Toggle, ToggleGroup, Tooltip, } from './__synced__/remoteComponents.synced';

package/dist/index.js

@@ -2,5 +2,5 @@
 import './clientTypes';
 export { hubspot } from './hubspot';
 export { logger } from './logger';
-export * from './coreComponents';
-export * from './types';
+export * from './__synced__/types/index.synced';
+export { Accordion, Alert, AutoGrid, BarChart, Box, Button, ButtonRow, Card, Checkbox, CurrencyInput, DateInput, DescriptionList, DescriptionListItem, Divider, Dropdown, EmptyState, ErrorState, Flex, Form, Heading, Icon, Illustration, Image, Inline, Input, LineChart, Link, List, LoadingButton, LoadingSpinner, Modal, ModalBody, ModalFooter, MultiSelect, NumberInput, Panel, PanelBody, PanelFooter, PanelSection, ProgressBar, RadioButton, SearchInput, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, StatusTag, StepIndicator, StepperInput, Tab, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Tag, Text, TextArea, Textarea, Tile, TimeInput, Toggle, ToggleGroup, Tooltip, } from './__synced__/remoteComponents.synced';

package/dist/pages/home/index.d.ts

@@ -1 +1 @@
-export type { HeaderActions, PrimaryHeaderActionButton, SecondaryHeaderActionButton, } from '../../__synced__/appHomeRemoteComponents.synced';
+export { HeaderActions, PrimaryHeaderActionButton, SecondaryHeaderActionButton, } from '../../__synced__/remoteComponents.synced';

package/dist/pages/home/index.js

@@ -1 +1 @@
-export {};
+export { HeaderActions, PrimaryHeaderActionButton, SecondaryHeaderActionButton, } from '../../__synced__/remoteComponents.synced';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/ui-extensions",
-  "version": "0.11.0",
+  "version": "0.11.2",
   "description": "",
   "type": "module",
   "main": "dist/index.js",
@@ -8,11 +8,13 @@
   "scripts": {
     "clean": "rm -rf dist/",
     "build": "npm run clean && tsc",
+    "check:tsc": "tsc",
     "watch": "npm run clean && tsc --watch",
     "prepare": "npm run build",
     "lint": "echo 'No linter configured for @hubspot/ui-extensions'",
-    "test": "jest && tsd",
-    "jest": "jest --watch",
+    "test": "vitest run && tsd",
+    "test:coverage": "vitest run --coverage",
+    "test:watch": "vitest",
     "test:types": "tsd"
   },
   "files": [
@@ -25,19 +27,21 @@
     ".": "./dist/index.js",
     "./crm": "./dist/crm/index.js",
     "./pages/home": "./dist/pages/home/index.js",
-    "./experimental": "./dist/experimental/index.js"
+    "./experimental": "./dist/experimental/index.js",
+    "./experimental/testing": "./dist/experimental/testing/index.js"
   },
   "license": "MIT",
   "dependencies": {
+    "@remote-ui/core": "2.2.7",
     "@remote-ui/react": "5.0.2",
-    "react": "18.2.0"
+    "react": "18.3.1"
   },
   "engines": {
     "node": ">=16"
   },
   "peerDependencies": {
     "@remote-ui/react": "^5.0.0",
-    "react": "^18.2.0",
+    "react": "18.3.1",
     "typescript": "^5.0.4"
   },
   "peerDependenciesMeta": {
@@ -49,25 +53,24 @@
     },
     "typescript": {
       "optional": true
-    },
-    "jest": {
-      "optional": true
     }
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^14.1.2",
-    "@types/jest": "^29.5.13",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
-    "react-dom": "^18.2.0",
+    "@types/node": "^20.11.0",
+    "@types/react": "^18.3.1",
+    "@types/react-dom": "^18.3.1",
+    "@vitest/coverage-v8": "2.1.8",
+    "jsdom": "26.1.0",
+    "react-dom": "18.3.1",
     "react-reconciler": "^0.29.0",
-    "ts-jest": "^29.1.1",
     "tsd": "^0.33.0",
-    "typescript": "5.0.4"
+    "typescript": "5.0.4",
+    "vitest": "2.1.9"
   },
   "tsd": {
     "directory": "src/__tests__/test-d"
   },
-  "gitHead": "aeebbd7fb6aefc9aeb948cc9ca4028e94d5320cc"
+  "gitHead": "6545e14f68b8927c84d75ae45f287a43f19a0bb2"
 }

package/dist/__synced__/appHomeRemoteComponents.synced.d.ts

@@ -1,28 +0,0 @@
-import type * as componentTypes from './types/components/index.synced';
-/**
- * The `HeaderActions` component renders a container for action buttons in the app home header. It accepts `PrimaryHeaderActionButton` and `SecondaryHeaderActionButton` as children.
- *
- */
-export declare const HeaderActions: "HeaderActions" & {
-    readonly type?: "HeaderActions" | undefined;
-    readonly props?: componentTypes.HeaderActionsProps | undefined;
-    readonly children?: true | undefined;
-} & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"HeaderActions", componentTypes.HeaderActionsProps, true>>;
-/**
- * The `PrimaryHeaderActionButton` component renders a primary action button in the app home header. This button is styled as the main call-to-action and only one should be used per `HeaderActions` container.
- *
- */
-export declare const PrimaryHeaderActionButton: "PrimaryHeaderActionButton" & {
-    readonly type?: "PrimaryHeaderActionButton" | undefined;
-    readonly props?: componentTypes.HeaderActionButtonProps | undefined;
-    readonly children?: true | undefined;
-} & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"PrimaryHeaderActionButton", componentTypes.HeaderActionButtonProps, true>>;
-/**
- * The `SecondaryHeaderActionButton` component renders a secondary action button in the app home header. Multiple secondary actions can be used and they will be grouped appropriately in the header.
- *
- */
-export declare const SecondaryHeaderActionButton: "SecondaryHeaderActionButton" & {
-    readonly type?: "SecondaryHeaderActionButton" | undefined;
-    readonly props?: componentTypes.HeaderActionButtonProps | undefined;
-    readonly children?: true | undefined;
-} & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"SecondaryHeaderActionButton", componentTypes.HeaderActionButtonProps, true>>;