# Host Actions

Besides [context and events](/serverless-apps/building-app/context/), the SDK exposes the host's action API: typed functions that make the surrounding Crowdin UI do things. Everything on this page is exported from the framework-free core entry point:

```ts
import { editor, project, modal, redirect, resize } from "@crowdin/serverless-apps-sdk";
```

| Export | Available in | What it covers |
|--------|--------------|----------------|
| `editor` | editor modules | ~50 methods: strings and translations, filters and search, navigation, notifications, workflow steps, the app's modal |
| `project` | project-scoped modules | navigation inside the project area, opening the editor |
| `profile` | profile-scoped modules | navigation inside the profile area |
| `modal` | `modal` modules | resizing the open modal |
| global functions | everywhere | theme, sizing, redirects, [assets](/serverless-apps/building-app/assets/), intersection observer |

Every method is fully typed, so the definitive reference is your editor's autocomplete on these exports. The sections below cover the calls most apps need. A method only works where its UI exists: outside it, fire-and-forget calls are silently ignored, while promise-returning calls reject with an `AP method … is unavailable` error - guard with `try`/`catch` or a `context.app.type` check when one bundle serves several placements.

## Editor content

Read what the translator is working on and change the translation draft:

```ts
import { editor } from "@crowdin/serverless-apps-sdk";

const active = await editor.getString();
const translations = await editor.getTranslations();

editor.setTranslation("Bonjour");
editor.appendTranslation(" le monde");
editor.clearTranslation();
```

`getStringsList()` returns the currently loaded page of strings, `getSelectedStrings()` the multi-selection (or `"all"`). Pair these with the [`string.change` and `string.selected` events](/serverless-apps/building-app/context/#events) to stay in sync as the translator moves around.

For suggesting translations in bulk there is the unsaved-suggestions family: `setUnsavedSuggestion` / `setUnsavedSuggestions`, `removeUnsavedSuggestions`, and `applyUnsavedTranslations` fill translation drafts without saving them, leaving the translator in control.

## Filters, search, and navigation

```ts
editor.search("checkout");
editor.setCroqlFilter('updated_at > "2026-01-01"');
editor.setFilter(2);
editor.changeFile(fileId);
editor.setTargetLanguage("uk");
```

`getFiltersList()` enumerates the editor's built-in filters for `setFilter`; `setCustomFilter` and `setCroqlFilter` (with their `reset*` counterparts) apply advanced filters; `setPage`, `setMode`, and `setWorkflowStep` move the editor view.

## Notifications

```ts
editor.successMessage("Translations imported");
editor.errorMessage("Import failed");
editor.setApplicationNotification(3);
```

The `*Message` methods show a toast in the editor; `setApplicationNotification` / `clearApplicationNotification` manage the counter badge on your app's panel icon.

## Modals

A [`modal` module](/serverless-apps/building-app/modules/) is rendered when the host opens it. From an editor module, open your app's modal by its manifest `key`:

```ts
const opened = await editor.openModal({ resource: "details", size: "large" });
```

`resource` is the key of one of your app's `modal` modules; the call resolves `false` when no such module exists. Sizes are `small`, `medium` (default), `large`, and `xlarge`.

Inside the modal, the same bundle renders with `context.app.type === "modal"`. From there:

```ts
import { modal, closeAppModal } from "@crowdin/serverless-apps-sdk";

modal.setSize({ width: 800, height: 600 });
closeAppModal();
```

Context-menu entries with `"type": "modal"` open modals the same way - declaratively, via the [manifest](/serverless-apps/reference/manifest/#options-context-menu).

## Sizing

```ts
resize();
resize(400, 600);
const viewport = await getViewportSize();
```

`resize()` without arguments fits the iframe to its content. `getViewportSize()`, `getWindowSize()`, and `getScrollPosition()` report the host page's dimensions; `getSize()` (and its synchronous twin `getSizeSync()`) returns the app iframe's own content size instead.

## Navigation

```ts
import { redirect, project } from "@crowdin/serverless-apps-sdk";

redirect("/project/my-project/settings");
project.openEditor(fileId);
project.redirect("/tools");
```

The global `redirect(path, queryParams?)` navigates the top Crowdin page; `project.redirect` and `profile.redirect` navigate within their areas; `project.openEditor(fileId, view?, languageCode?)` jumps straight into the editor.

## Advanced

- `editor.registerContextMenuAction(action, handler)` adds an entry to the editor's context menus at runtime and returns an unsubscribe function - unlike manifest-declared [`context-menu` modules](/serverless-apps/reference/manifest/#options-context-menu), which are static.
- `registerIntersectionObserver(handler)` reports when the app's iframe scrolls in and out of view (the `intersection.changed` event).
- `closeNavbarExtension()` closes the app's `navbar-extension` flyout.
- `editor.getHotKeys()` / `editor.propagateHotKeyPress()` integrate the app's textareas with the editor's keyboard shortcuts.
- `editor.applyCustomThemeStyle()` / `editor.resetCustomThemeStyle()` apply and clear editor color-theme `--crowdin-*` style overrides programmatically.
- `getFormData()` / `formDataUpdated(detail)` / `getSchema()` / `getRenderData()` exchange data with a form the Crowdin host renders around the app in some placements; where the host renders no form, they resolve empty data.
- `getCssVariables()` returns the host's `--crowdin-*` CSS variables - [`AppUiProvider`](/serverless-apps/building-app/context/#theme) applies them for you.