### Start Development Environment

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/README.md

Start the development servers and TypeScript compilers in watch mode. This is the recommended way to begin development.

```sh
pnpm start
```

--------------------------------

### Install Content Model Migration Package

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/040000-content-model-migration.adoc

Install the content engine model migration package as a development dependency.

```bash
npm install -D @com.mgmtp.a12.contentengine/contentengine-model-migration
```

--------------------------------

### Install Project Dependencies

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/README.md

Install all project dependencies and link local packages using pnpm. This is a prerequisite for building the project.

```sh
pnpm install
```

--------------------------------

### Install Content Engine Core Package

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/020101-installation.adoc

Installs the main Content Engine npm package. Ensure you have Node.js and npm installed.

```bash
npm install @com.mgmtp.a12.contentengine/contentengine-core
```

--------------------------------

### Install Content Engine Core and Default Element Library

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/README.md

Install the necessary packages for using the Content Engine in your project. This includes the core engine and the default element library.

```sh
npm install @com.mgmtp.a12.contentengine/contentengine-core @com.mgmtp.a12.contentengine/contentengine-default-element-library
```

--------------------------------

### Compile All Packages

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/README.md

Build all packages within the project after installing dependencies. This command compiles the source code.

```sh
pnpm compile
```

--------------------------------

### Register ElementLibraryRegistry and Data Handlers

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/020102-setup.adoc

This TypeScript code demonstrates the registration of essential components for the application setup. For dynamic content models, it includes registering DataProvider and DataReducers in addition to the ElementLibraryRegistry.

```typescript
import {
  DataProvider,
  DataReducers,
  ElementLibraryRegistry,
} from '@mgm/a12-content-engine';

// For static content models, only ElementLibraryRegistry is needed.
const registry = new ElementLibraryRegistry();

// For dynamic content models, also register DataProvider and DataReducers.
const dataProvider = new DataProvider();
const dataReducers = new DataReducers();

// Register all components with the application
registry.registerComponentFactory('DataProvider', dataProvider);
registry.registerComponentFactory('DataReducers', dataReducers);

```

--------------------------------

### Customize Document Loading with RequestSelectorMap

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/020302-request-selector-map.adoc

This example shows how to customize the document loading behavior of the Content Engine's data provider by overriding the `loadDocument` method. Ensure you spread the `DefaultRequestSelectorMap` when creating your custom map.

```typescriptjsx
const requestSelectorMap = {
  ...DefaultRequestSelectorMap,
  loadDocument: (documentId: string) => {
    console.log(`Loading document: ${documentId}`);
    return DefaultRequestSelectorMap.loadDocument(documentId);
  },
};
```

--------------------------------

### Badge Node JSON Representation

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/020200-key-concepts.adoc

Illustrates the JSON structure of a 'Badge' element node, showcasing its ID, namespace, type, and properties like variant, count, and size. This example demonstrates how element properties are defined.

```json
{
  "id": "badge-a7b8d6e3",
  "namespace": "com.mgmtp.a12.my-engine",
  "type": "Badge",
  "props": {
    "variant": "warning",
    "count": "3",
    "tiny": true
  },
  "children": []
}
```

--------------------------------

### Run Content Model Migration CLI

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/040000-content-model-migration.adoc

Execute the content model migration CLI tool, providing the path to the content model file or directory.

```bash
npx content-model-migration <path>
```

--------------------------------

### nodeIdByPath

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Returns a selector that provides a function to get node ID by its path.

```APIDOC
## nodeIdByPath

### Description
Returns a selector that provides a function to get node ID by its path.

### Signature
`nodeIdByPath(nodePath: NodePath): Selector<ModelState, string | undefined>;`
```

--------------------------------

### createModule

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

Creates a new module instance with optional settings. This function is the entry point for initializing the content engine module.

```APIDOC
## createModule

### Description
Creates a new module instance with optional settings. This function is the entry point for initializing the content engine module.

### Signature
export function createModule(settings?: ModuleSettings): Module;

### Parameters
#### Optional Parameters
- **settings** (ModuleSettings) - Optional - Configuration settings for the module, including request selectors.

### Returns
- **Module** - An instance of the Module.
```

--------------------------------

### nodeDataByPath

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Returns a selector that provides a function to get node data by its path.

```APIDOC
## nodeDataByPath

### Description
Returns a selector that provides a function to get node data by its path.

### Signature
`nodeDataByPath(nodePath: NodePath): Selector<ModelState, NodeData | undefined>;`
```

--------------------------------

### nodeDataById

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Returns a selector that provides a function to get node data by node ID.

```APIDOC
## nodeDataById

### Description
Returns a selector that provides a function to get node data by node ID.

### Signature
`nodeDataById(): Selector<ModelState, (nodeId: string) => NodeData | undefined>;`
```

--------------------------------

### Create Content Engine Module

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

Creates a new content engine module with optional settings. Use this to initialize the content engine.

```typescript
export function createModule(settings?: ModuleSettings): Module;
```

--------------------------------

### PreviewApplicationTemplate Props

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Props for the PreviewApplicationTemplate, defining its configuration.

```APIDOC
## PreviewApplicationTemplate Props

### Description
Defines the properties required for configuring the `PreviewApplicationTemplate`.

### Interface
```typescript
interface Props extends Container {
  readonly activityId: string;
  readonly additionalMenuItems?: MenuItem[];
  readonly applicationName?: string;
  readonly applicationVersion?: string;
}
```

### Fields
- **activityId** (string) - Required - Identifier for the activity.
- **additionalMenuItems** (MenuItem[]) - Optional - A list of additional menu items to display.
- **applicationName** (string) - Optional - The name of the application.
- **applicationVersion** (string) - Optional - The version of the application.
```

--------------------------------

### modelPathById

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Returns a selector that provides a function to get the model path by node ID.

```APIDOC
## modelPathById

### Description
Returns a selector that provides a function to get the model path by node ID.

### Signature
`modelPathById(): Selector<ModelState, (elementId: string) => Throwable<string>>;`
```

--------------------------------

### Width Controller

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A controller for managing width-related settings.

```APIDOC
## `widthController`

A settings store controller specifically for managing width-related settings, including keyword length.
```

--------------------------------

### createContentMigrationTool

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/migration-tool/api.api.md

Creates a new instance of the MigrationTool for content migration. It requires user configuration to initialize the migration process.

```APIDOC
## createContentMigrationTool

### Description
Creates a new instance of the MigrationTool for content migration. It requires user configuration to initialize the migration process.

### Method
(Function Signature)

### Parameters
#### Path Parameters
- **userConfig** (UserConfiguration) - Required - The user-specific configuration for the migration tool.

### Response
(Returns MigrationTool instance)
```

--------------------------------

### createKeywordLengthController

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a controller for managing keyword length settings, using a provided configuration object.

```APIDOC
## createKeywordLengthController

### Description
Creates a controller for managing keyword length settings, using a provided configuration object.

### Method
createKeywordLengthController(params: KeywordLength.ControllerConfig): SettingsStore.Controller<KeywordLength.SettingState, KeywordLength.ModelState, KeywordLength.UIState>

### Parameters
#### Path Parameters
- **params** (KeywordLength.ControllerConfig) - The configuration object for the keyword length controller.

### Returns
SettingsStore.Controller<KeywordLength.SettingState, KeywordLength.ModelState, KeywordLength.UIState>
```

--------------------------------

### createURLController

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a controller for managing URL settings, using provided options.

```APIDOC
## createURLController

### Description
Creates a controller for managing URL settings, using provided options.

### Method
createURLController(options: URLControllerOptions): SettingsStore.Controller<SettingState, ModelState_2, UIState_2>

### Parameters
#### Path Parameters
- **options** (URLControllerOptions) - The options for configuring the URL controller.

### Returns
SettingsStore.Controller<SettingState, ModelState_2, UIState_2>
```

--------------------------------

### Run Unit Tests

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/README.md

Execute unit tests across all packages in the project. This helps ensure the code functions as expected.

```sh
pnpm test
```

--------------------------------

### createStringController

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a controller for managing string settings, with options for requiring the value and trimming whitespace.

```APIDOC
## createStringController

### Description
Creates a controller for managing string settings, with options for requiring the value and trimming whitespace.

### Method
createStringController(required?: boolean, trim?: boolean): SettingsStore.Controller<SettingState_3, ModelState_4, UIState_4>

### Parameters
#### Path Parameters
- **required** (boolean) - Optional. Specifies if the string value is required.
- **trim** (boolean) - Optional. Specifies if whitespace should be trimmed from the string value.

### Returns
SettingsStore.Controller<SettingState_3, ModelState_4, UIState_4>
```

--------------------------------

### PreviewApplication Component

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A React functional component for rendering the preview application.

```APIDOC
## PreviewApplication Component

### Description
A React functional component that serves as the main entry point for the preview application. It integrates various preview-related functionalities.

### Props
```typescript
interface Props extends ContentEnginePreview.Props, PreviewApplicationTemplate.Props, PreviewContextProvider.Props {}
```

### Usage
```jsx
<PreviewApplication {...props} />
```
```

--------------------------------

### Content Model Preview Window Functions

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides functions for interacting with the content preview window, including creation, retrieval, checking existence, and posting messages.

```typescript
export namespace ContentModelPreviewWindow {
    export function create(): Window | null;
    export function get(): Window | null;
    export function has(): boolean;
    export function isInstance(): boolean;
    export function postMessage(message: ContentPreviewMessage.BaseMessage): void;
    export function set(newWindow: Window | null): void;
}
```

--------------------------------

### Content Model Configuration for Screen Reader Column

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/020303-screen-reader-column.adoc

This JSON excerpt shows how to configure a Table node in the Content Model to enable the screen reader column feature by referencing a column ID.

```json
{
  "type": "Table",
  "namespace": "com.mgmtp.a12.contentengine",
  "props": {
    "columns": [
      { "id": "name-col", "width": "1fr" },
      { "id": "action-col", "width": "auto", "actionColumn": true }
    ],
    "screenReaderColumnRef": "name-col"
  }
}
```

--------------------------------

### Content Model with Namespace Version

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/020200-key-concepts.adoc

Shows a partial Content model configuration that declares the version for a specific namespace. This approach centralizes versioning information for all elements within a namespace.

```json
{
  "header": {},
  "content": {
    "root": {},
    "configuration": {
      "namespaceVersions": {
        "com.mgmtp.a12.my-engine": "1.0.0"
      }
    }
  }
}
```

--------------------------------

### Content Model Preview Window

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides utilities for managing the content preview window.

```APIDOC
## Window Management

### `ContentModelPreviewWindow.create()`

Creates a new content preview window.

- **Returns**: `Window | null`

### `ContentModelPreviewWindow.get()`

Gets the existing content preview window.

- **Returns**: `Window | null`

### `ContentModelPreviewWindow.has()`

Checks if a content preview window exists.

- **Returns**: `boolean`

### `ContentModelPreviewWindow.isInstance()`

Checks if the current context is an instance of the content preview window.

- **Returns**: `boolean`

### `ContentModelPreviewWindow.postMessage(message)`

Posts a message to the content preview window.

- **`message`** (ContentPreviewMessage.BaseMessage) - The message to post.

### `ContentModelPreviewWindow.set(newWindow)`

Sets the content preview window.

- **`newWindow`** (Window | null) - The new window to set.
```

--------------------------------

### ContentMigrationTool

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/migration-tool/api.api.md

Represents the main migration tool instance for content. It is a constant available for direct use.

```APIDOC
## ContentMigrationTool

### Description
Represents the main migration tool instance for content. It is a constant available for direct use.

### Type
MigrationTool
```

--------------------------------

### StringSetting

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A React functional component for rendering a string setting input.

```APIDOC
## StringSetting

### Description
A React functional component for rendering a string setting input.

### Props
(Props are defined in `StringSetting_2.Props`, but not detailed in the source)

### Type
`React.FC<StringSetting_2.Props>`
```

--------------------------------

### createDocumentModelService

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a service for interacting with a document model.

```APIDOC
## createDocumentModelService

### Description
Creates a service for interacting with a document model.

### Method
createDocumentModelService(documentModel: DocumentModel): DocumentModelService

### Parameters
#### Path Parameters
- **documentModel** (DocumentModel) - The document model to create the service for.

### Returns
DocumentModelService
```

--------------------------------

### ElementLibraryRegistry

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A registry for managing ElementLibrary instances.

```APIDOC
## ElementLibraryRegistry

### Description
A registry for managing ElementLibrary instances.

### Type
Provider<Registry<ElementLibrary>>
```

--------------------------------

### Importing Widget Core Modules

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/element-library/index.api.md

This snippet demonstrates importing essential types and components from the widgets core library. These are used for defining UI elements like columns, tooltips, buttons, and interactive tiles within the content engine.

```typescript
import { BaseColumnType } from '@com.mgmtp.a12.widgets/widgets-core';
import { BaseTooltipProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { ButtonGroupContainerProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { ButtonGroupProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { ButtonProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { Column } from '@com.mgmtp.a12.widgets/widgets-core';
import { IconProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { IconTheme } from '@com.mgmtp.a12.widgets/widgets-core';
import { InteractiveTileProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { ListItemProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { ListProps } from '@com.mgmtp.a12.widgets/widgets-core';
import { MessageBoxProps } from '@com.mgmtp.a12.widgets/widgets-core';
```

--------------------------------

### PreviewContextProvider Props

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Props for the PreviewContextProvider, used to provide preview context.

```APIDOC
## PreviewContextProvider Props

### Description
Defines the properties for the `PreviewContextProvider`, which supplies context for preview-related operations.

### Interface
```typescript
interface Props extends Container {
  readonly activityId: string;
}
```

### Fields
- **activityId** (string) - Required - Identifier for the activity.
```

--------------------------------

### useElementLibrary

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A hook that returns the Element Library instance.

```APIDOC
## useElementLibrary()

### Description
A hook that returns the Element Library instance.

### Signature
`useElementLibrary(): ElementLibrary`

### Returns
- **ElementLibrary** - The Element Library instance.
```

--------------------------------

### Create ContentMigrationTool function

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/migration-tool/api.api.md

Factory function to create a MigrationTool instance for content migration, accepting a UserConfiguration object.

```typescript
// @public (undocumented)
export function createContentMigrationTool(userConfig: UserConfiguration): MigrationTool;
```

--------------------------------

### Run Linting

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/README.md

Execute linting checks on the project code. This helps maintain code quality and consistency.

```sh
pnpm lint
```

--------------------------------

### URL Controller and Setting Components

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Components and interfaces for handling URL settings within the editor.

```APIDOC
## URL Handling

### `URLControllerOptions`

Interface for options when configuring a URL controller, including whether it's required.

### `URLSetting.Props`

Props for the `URLSetting` component, extending text line properties and specifying the source property name.

### `URLSetting`

A React functional component for rendering a URL setting input.

### `URLSettingState`

Type alias for the UI state related to URL settings.
```

--------------------------------

### Commands

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides a set of action creators for dispatching commands to the Content Engine Editor. These commands allow for manipulation of the editor's state, such as setting models, updating settings, and controlling UI visibility.

```APIDOC
## Commands

### Description
Provides a set of action creators for dispatching commands to the Content Engine Editor. These commands allow for manipulation of the editor's state, such as setting models, updating settings, and controlling UI visibility.

### Available Commands

- **factory**: An action creator factory.
- **setModel**: Action creator to set the content model.
  - Payload: `SetModelPayload`
    - `model` (ContentModel) - The content model to set.
- **setSelectedNode**: Action creator to set the selected node.
  - Payload: `SetSelectedNodePayload`
    - `initializeSettingsState` (boolean) - Optional. If true, initializes settings state.
    - `selectedNode` (SelectedNodeState | null) - The selected node state.
- **setSettingScreens**: Action creator to set the setting screens.
  - Payload: `SetSettingScreensPayload`
    - `settingScreens` (SettingScreen[]) - An array of setting screens.
- **setInsertPanel**: Action creator to set the insert panel.
  - Payload: `SetInsertPanelPayload`
    - `insertPanel` (InsertPanel | null) - The insert panel to set.
- **setShowSettingPanel**: Action creator to show or hide the setting panel.
  - Payload: `SetShowSettingPanelPayload`
    - `showSettingPanel` (boolean) - Whether to show the setting panel.
- **setShowComponentPanel**: Action creator to show or hide the component panel.
  - Payload: `SetShowComponentPanelPayload`
    - `showComponentPanel` (boolean) - Whether to show the component panel.
- **setGlobalSearchResults**: Action creator to set global search results.
  - Payload: `SetGlobalSearchResultsPayload`
    - `query` (string) - The search query.
    - `results` (Map<string, GlobalSearch.SearchResult | null>) - A map of search results.
- **setDialog**: Action creator to set the dialog.
  - Payload: `SetDialogPayload`
    - `dialog` (Dialog | null) - The dialog to set.
- **setVisibleConditionalNodes**: Action creator to set visible conditional nodes.
  - Payload: `SetVisibleConditionalNodesPayload`
    - `visibleConditionalNodes` (Record<string, boolean>) - A record of visible conditional nodes.
- **updateSettingsState**: Action creator to update the settings state.
  - Payload: `UpdateSettingsStatePayload`
- **newResetSettingsState**: Action creator to create a new reset settings state.
  - Payload: `NewResetSettingsStatePayload` (extends `Events.NewResetSettingPayload`)
- **resetSettingsState**: Action creator to reset the settings state.
  - Payload: `ResetSettingsStatePayload` (extends `SettingEvents.ResetPayload`)
- **rescueSettingsState**: Action creator to rescue the settings state.
  - Payload: `RescueSettingsStatePayload`

```

--------------------------------

### MenuTemplate Namespace

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides components and types for creating menu templates, including Menu, Divider, and Spacer.

```APIDOC
## Namespace: MenuTemplate

### Description
Provides components and types for creating menu templates.

### Nested Namespaces/Interfaces
- **Menu**: Contains interface for Menu props.
  - **Interface: Props**
    - **leftSlots** (React.ReactNode[]): Nodes for the left side of the menu.
    - **rightSlots** (React.ReactNode[]): Nodes for the right side of the menu.

### Components
- **Menu**: A React functional component for rendering a menu. Accepts `Props`.
- **Divider**: A component representing a divider in the menu.
- **Spacer**: A styled component for creating space within the menu.
```

--------------------------------

### marginController

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A settings controller for managing margin properties, supporting both simple and oriented modes.

```APIDOC
## Variable: marginController

### Description
A settings controller for managing margin properties. It supports two modes: `SIMPLE` and `ORIENTED`. In `SIMPLE` mode, it uses a single `simpleState`. In `ORIENTED` mode, it uses `simpleState` and `orientedStates` for different orientations.

### Type
SettingsStore_2.Controller<{
  mode: SettingMode_2.SIMPLE;
  simpleState: SingularOriented_2.SettingState<"px" | "%" | "rem", "auto">;
} | {
  mode: SettingMode_2.ORIENTED;
  simpleState: SingularOriented_2.SettingState<never, "auto">;
  orientedStates: Record<Orientation_2, SingularOriented_2.SettingState<"px" | "%" | "rem", "auto">>;
}, string | undefined, {
  mode: SettingMode_2.SIMPLE;
  simpleState: SingularOriented_2.UIState;
} | {
  mode: SettingMode_2.ORIENTED;
  simpleState: SingularOriented_2.UIState;
  orientedStates: Record<Orientation_2, SingularOriented_2.UIState>;
}, any>
```

--------------------------------

### Configure Content Model Migration

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/040000-content-model-migration.adoc

Configure the migration process by defining a configuration file (e.g., content-model-migration.config.ts) and specifying custom migrators.

```typescript
import { defineConfig, DefaultMigrator } from "@com.mgmtp.a12.contentengine/contentengine-model-migration";

import { OtherPackageMigrator } from "other-package";

export default defineConfig({
	migrators: [DefaultMigrator, OtherPackageMigrator]
});
```

--------------------------------

### createColorController

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a controller for managing color settings. It is designed to work with specific state types for settings, model, and UI.

```APIDOC
## createColorController

### Description
Creates a controller for managing color settings. It is designed to work with specific state types for settings, model, and UI.

### Method
createColorController()

### Returns
SettingsStore.Controller<SettingState_2, ModelState_3, UIState_3>
```

--------------------------------

### Importing Core Content Engine Modules

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/element-library/index.api.md

This snippet shows the necessary imports from the Content Engine core modules for building and managing content. It includes types for clients, factories, sizes, models, and the main ElementLibrary and ElementModule.

```typescript
import { ContentEngineClientContainer } from '@com.mgmtp.a12.contentengine/contentengine-core';
import { ContentEngineFactories } from '@com.mgmtp.a12.contentengine/contentengine-core';
import { ContentEngineSize } from '@com.mgmtp.a12.contentengine/contentengine-core';
import { ContentModel } from '@com.mgmtp.a12.contentengine/contentengine-core';
import { ElementLibrary } from '@com.mgmtp.a12.contentengine/contentengine-core';
import { ElementModule } from '@com.mgmtp.a12.contentengine/contentengine-core';
```

--------------------------------

### createInitialContentEditorState

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates the initial state for a content editor, optionally using provided library ID, document model, and content model.

```APIDOC
## createInitialContentEditorState

### Description
Creates the initial state for a content editor, optionally using provided library ID, document model, and content model.

### Method
createInitialContentEditorState(params: {
    libraryId?: string;
    documentModel?: DocumentModel;
    contentModel: ContentModel | undefined;
}): ContentEditorState

### Parameters
#### Path Parameters
- **params** (object) - An object containing initialization parameters.
  - **libraryId** (string) - Optional. The ID of the library to use.
  - **documentModel** (DocumentModel) - Optional. The document model to use.
  - **contentModel** (ContentModel | undefined) - The content model to use.

### Returns
ContentEditorState
```

--------------------------------

### defineConfig

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/migration-tool/api.api.md

Defines or returns the user configuration for the migration tool. This function is used to structure and validate the migration settings.

```APIDOC
## defineConfig

### Description
Defines or returns the user configuration for the migration tool. This function is used to structure and validate the migration settings.

### Method
(Function Signature)

### Parameters
#### Path Parameters
- **params** (UserConfiguration) - Required - The parameters object containing user configuration details.

### Response
(Returns UserConfiguration object)
```

--------------------------------

### createBooleanController Function

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a controller for boolean settings.

```APIDOC
## Function createBooleanController<SettingState_6, ModelState_6, UIState_6>(defaultValue: boolean, reverse?: boolean): SettingsStore.Controller<SettingState_6, ModelState_6, UIState_6>

### Description
Creates a controller for boolean settings.

### Parameters

- **defaultValue** (boolean) - The default value for the boolean setting.
- **reverse** (boolean, optional) - If true, the controller will operate in reverse.

### Returns
SettingsStore.Controller<SettingState_6, ModelState_6, UIState_6>
```

--------------------------------

### Confirmation Interface

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/element-library/index.api.md

Defines the structure for confirmation dialogs, including optional labels.

```APIDOC
## Confirmation

### Description
An interface used to configure confirmation prompts before an action is executed.

### Props
- **cancelLabel** (string) - Optional - The text displayed on the cancel button of the confirmation dialog.
```

--------------------------------

### VideoNode.createVideoSourceUrl

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/element-library/index.api.md

Utility function to create a valid source URL for a video.

```APIDOC
## VideoNode.createVideoSourceUrl

### Description
Utility function to create a valid source URL for a video.

### Signature
createVideoSourceUrl(url: string): string

### Parameters
#### Parameters
- **url** (string) - Required - The base URL for the video source.
```

--------------------------------

### ContentEnginePreview

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A React component for previewing content engine content.

```APIDOC
## ContentEnginePreview

### Description
A React functional component used for previewing content generated by the Content Engine. It accepts properties to customize the preview, such as an application name template.

### Props
- **applicationNameTemplate** (string) - Optional - A template string for the application name.
- **contentModel** (ContentModel) - Required - The content model to preview.
- Other properties from `ContentEngine.Props` (excluding `contentModel`) are also accepted.
```

--------------------------------

### LocalizableFactory Namespace

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides factory methods for creating localizable resources.

```APIDOC
## Namespace: LocalizableFactory

### Description
Provides factory methods for creating localizable resources.

### Static Methods
- **createResourceLocalizables(resourceKey: string, args?: LocalizableArgs): Localizable[]**
  Creates an array of `Localizable` objects for a given resource key and optional arguments.
```

--------------------------------

### PreviewDocument Interface

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Represents a document intended for preview, including its metadata.

```APIDOC
## PreviewDocument Interface

### Description
Represents a document that can be previewed, containing its content, model information, and attachments.

### Fields
- **attachments** (Record<string, string | undefined>) - Optional - A record of attachments associated with the document.
- **document** (Document_2) - Required - The actual document content.
- **documentModelName** (string) - Required - The name of the document model.
- **id** (string) - Required - The unique identifier for the preview document.
```

--------------------------------

### Importing Client Core Module

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/element-library/index.api.md

This snippet imports the Module type from '@com.mgmtp.a12.client/client-core', which is likely used for defining modules within the client architecture.

```typescript
import { Module } from '@com.mgmtp.a12.client/client-core';
```

--------------------------------

### withContentEngineView

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A higher-order component that configures the application with a Content Engine view for a specific library.

```APIDOC
## withContentEngineView

### Description
A higher-order component that configures the application with a Content Engine view for a specific library.

### Signature
`withContentEngineView(libraryId: string) => <T extends ApplicationWithContentEngineConfig>(cfg: T) => T`

### Parameters
- **libraryId** (string) - The ID of the library for which to configure the Content Engine view.

### Returns
- **<T extends ApplicationWithContentEngineConfig>(cfg: T) => T** - A higher-order component that applies the Content Engine view configuration.
```

--------------------------------

### SwitchSetting

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A React functional component for rendering a switch setting input.

```APIDOC
## SwitchSetting

### Description
A React functional component for rendering a switch setting input.

### Props
(Props are defined in `SwitchSetting_2.Props`, but not detailed in the source)

### Type
`React.FC<SwitchSetting_2.Props>`
```

--------------------------------

### Clean Build Artifacts

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/README.md

Remove all build artifacts from the project. Use this command to perform a clean build.

```sh
pnpm clean
```

--------------------------------

### Context interface

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/migration-tool/api.api.md

Defines the Context interface, which extends UserConfiguration and PostMigrationContext, providing access to a logger, the content model, node paths, and a reporter.

```typescript
// @public (undocumented)
export interface Context extends UserConfiguration, PostMigrationContext {
    // (undocumented)
    readonly logger: Logger;
    // (undocumented)
    readonly model: ContentModel;
    // (undocumented)
    readonly nodePaths: ContentModel.Node[];
    // (undocumented)
    readonly reporter: Reporter;
}
```

--------------------------------

### Preview Trigger Hook

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides a hook to trigger a preview action.

```APIDOC
## `usePreviewTrigger(params: PreviewTriggerParams): () => void`

Returns a function that, when called, triggers a preview action with the specified parameters.
```

--------------------------------

### ContentModelPreviewActions

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Actions related to previewing content models.

```APIDOC
## ContentModelPreviewActions

### Description
Provides action creators for managing content model previews.

### Actions
- **onModelsChanged**: An action creator that signals changes in content models. It accepts a payload containing the updated content model, document IDs, document model, and theme names.
  - **ModelsChangedPayload**:
    - **contentModel** (ContentModel) - Required - The updated content model.
    - **documentIds** (string[]) - Optional - An array of document IDs that have changed.
    - **documentModel** (DocumentModel) - Optional - The updated document model.
    - **themeNames** (string[]) - Optional - An array of theme names that have changed.
- **onReceiveDocument**: An action creator for receiving a document. It accepts a payload containing document-related information.
```

--------------------------------

### withConfiguredContentEngine

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A higher-order component that configures the application with the Content Engine.

```APIDOC
## withConfiguredContentEngine

### Description
A higher-order component that configures the application with the Content Engine.

### Signature
`withConfiguredContentEngine<T extends ApplicationWithContentEngineConfig>(cfg: T): T`

### Parameters
- **cfg** (T) - The application configuration object.

### Returns
- **T** - The modified application configuration object.
```

--------------------------------

### withContentEngine

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A higher-order component that enables the Content Engine for a specific library.

```APIDOC
## withContentEngine

### Description
A higher-order component that enables the Content Engine for a specific library.

### Signature
`withContentEngine(library: string) => <T extends ApplicationWithContentEngineConfig>(cfg: T) => ApplicationWithConfiguredFeature<T, "contentEngine">`

### Parameters
- **library** (string) - The ID of the library to enable the Content Engine for.

### Returns
- **<T extends ApplicationWithContentEngineConfig>(cfg: T) => ApplicationWithConfiguredFeature<T, "contentEngine">** - A higher-order component that applies the Content Engine configuration.
```

--------------------------------

### Content Model Preview Factories

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides factory functions for creating modules and reducers related to content model preview.

```typescript
export namespace ContentModelPreviewFactories {
    export function createModule(): Module;
    const createDataReducers: () => ActivityReducers.DataReducer[];
    const createRootReducer: () => (reducer: Reducer<object>) => Reducer<object>;
}
```

--------------------------------

### Content Model Preview Selectors

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides selectors for accessing various pieces of state related to the content model preview.

```APIDOC
## Selectors

### `selectAdditionalThemeNames(activityId)`

Selects the additional theme names for a given activity.

- **`activityId`** (string) - The ID of the activity.
- **Returns**: (state: object) => string[]

### `selectDocumentIds(activityId)`

Selects the document IDs for a given activity.

- **`activityId`** (string) - The ID of the activity.
- **Returns**: (state: object) => string[]

### `selectLoadingState(activityId)`

Selects the loading state of the content model preview for a given activity.

- **`activityId`** (string) - The ID of the activity.
- **Returns**: (state: object) => LoadingState | "without"

### `selectPreviewDocument(activityId, documentName)`

Selects a specific preview document by name for a given activity.

- **`activityId`** (string) - The ID of the activity.
- **`documentName`** (string) - The name of the document.
- **Returns**: (state: object) => PreviewDocument | undefined

### `selectSelectedPreviewDocumentId(activityId)`

Selects the ID of the selected preview document for a given activity.

- **`activityId`** (string) - The ID of the activity.
- **Returns**: (state: object) => string

### `selectSlices(activityId)`

Selects the slices of the content model preview for a given activity.

- **`activityId`** (string) - The ID of the activity.
- **Returns**: (state: object) => ContentModelPreviewDataHolder.Slices | undefined

### `selectData(activityId)`

Selects the raw data for a given activity.

- **`activityId`** (string) - The ID of the activity.
- **Returns**: (state: object) => object | undefined
```

--------------------------------

### Border Controllers

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides controllers for managing border styles, widths, colors, and radii. These are used to configure the visual appearance of elements.

```APIDOC
## BorderControllers

### Description
An object containing controllers for various border properties.

### Properties
- **"style.borderStyle"** (SettingsStore.Controller) - Controller for the border style.
- **"style.borderWidth"** (SettingsStore.Controller) - Controller for the border width.
- **"style.borderColor"** (SettingsStore.Controller) - Controller for the border color.
- **"style.borderRadius"** (SettingsStore.Controller) - Controller for the border radius.

## borderControllers

### Description
Exported instance of BorderControllers, providing access to border styling controls.

### Type
BorderControllers

## BorderSetting

### Description
A React component for configuring border settings.

### Usage
```jsx
<BorderSetting />
```
```

--------------------------------

### onClickSettingPanelButton

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Handles clicks on buttons within the setting panel. Requires a payload specifying the button click event.

```APIDOC
## onClickSettingPanelButton

### Description
Handles user interactions with buttons located in the settings panel.

### Method
Not applicable (SDK Action)

### Parameters
#### Request Body
- **ClickSettingPanelButtonPayload** - Required - Payload containing information about the clicked button and its context.
```

--------------------------------

### createContentEditorMiddlewares

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a collection of middleware functions for the content editor. These can be used to extend editor functionality.

```APIDOC
## createContentEditorMiddlewares

### Description
Creates a collection of middleware functions for the content editor. These can be used to extend editor functionality.

### Method
createContentEditorMiddlewares()

### Returns
Middleware[]
```

--------------------------------

### withContentModelSupport

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A higher-order component that adds support for Content Models to the application.

```APIDOC
## withContentModelSupport

### Description
A higher-order component that adds support for Content Models to the application.

### Signature
`withContentModelSupport<T extends ApplicationWithContentEngineConfig>(cfg: T): T`

### Parameters
- **cfg** (T) - The application configuration object.

### Returns
- **T** - The modified application configuration object.
```

--------------------------------

### DocumentContextProvider

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A React context provider for managing document-related context. It accepts various configuration props to customize document, event, and model selection.

```APIDOC
## DocumentContextProvider

### Description
A React context provider for managing document-related context. It accepts various configuration props to customize document, event, and model selection.

### Props
- **docRef** (string) - Required - A reference to the document.
- **documentSelectors** (Partial<DocumentContext["document"]>) - Optional - Selectors for the document context.
- **engineDispatch** (function) - Required - A function to dispatch engine actions.
- **eventSelectors** (Partial<DocumentContext["event"]>) - Optional - Selectors for the event context.
- **modelSelectors** (Partial<DocumentContext["model"]>) - Optional - Selectors for the model context.
```

--------------------------------

### DocumentPathContextProvider

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A React context provider for managing document path information. It requires a group path to be provided.

```APIDOC
## DocumentPathContextProvider

### Description
A React context provider for managing document path information. It requires a group path to be provided.

### Props
- **groupPath** (DataReference) - Required - The group path for the document.

### Methods
- **resolveChildGroupPath**(childGroupId: string, index: number): DataReference
- **resolveFieldPath**(fieldId: string): DataReference
```

--------------------------------

### SettingEvents Namespace

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Namespace containing event payloads and action creators for setting-related events.

```APIDOC
## SettingEvents Namespace

### Description
This namespace groups event-related types and action creators for managing settings.

### Members
- **onReset**: Action creator for the reset event.
- **ChangeInputPayload**: Interface for payload when an input change occurs, extending `ChangePayload` and including an `input` field.
- **onChangeUnit**: Action creator for changing the unit of a setting.
- **ChangePayload**: Interface for general change payloads, including optional `element` and `orientation`.
- **onChangeValue**: Action creator for changing the value of a setting.
```

--------------------------------

### useHeadlineIcon

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/element-library/index.api.md

Hook for rendering a headline icon with customizable size.

```APIDOC
## useHeadlineIcon

### Description
Hook for rendering a headline icon with customizable size.

### Signature
useHeadlineIcon(params: { icon?: IconNode.IconIdentifier; size: string | undefined; }): JSX.Element | undefined

### Parameters
#### Parameters
- **params** ({ icon?: IconNode.IconIdentifier; size: string | undefined; }) - Required - An object containing the icon identifier and size.
```

--------------------------------

### createNumberController

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Creates a controller for managing number settings, with an optional default value.

```APIDOC
## createNumberController

### Description
Creates a controller for managing number settings, with an optional default value.

### Method
createNumberController(defaultValue?: number): SettingsStore.Controller<SettingState_4, ModelState_5, UIState_5>

### Parameters
#### Path Parameters
- **defaultValue** (number) - Optional. The default value for the number setting.

### Returns
SettingsStore.Controller<SettingState_4, ModelState_5, UIState_5>
```

--------------------------------

### Throwable

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Utilities for handling operations that may result in success or failure.

```APIDOC
## namespace Throwable

### Description
Utilities for handling operations that may result in success or failure.

### Functions
#### wrap<T>(operation: () => T): Result<T, Error>
Wraps an operation that may throw an error, returning a Result type.

### Constants
#### Success
Represents a successful operation result.

#### Failure
Represents a failed operation result.
```

--------------------------------

### PingMessage Namespace

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides utility functions for creating and checking instances of PingMessage.

```APIDOC
## Namespace PingMessage

### Description
Provides utility functions for creating and checking instances of PingMessage.

### Functions

#### create()
- **Description**: Creates a new PingMessage object.
- **Returns**: PingMessage

#### isInstance(data: { type: string })
- **Description**: Checks if the provided data is an instance of PingMessage.
- **Parameters**:
  - **data** ({ type: string }) - The data to check.
- **Returns**: data is PingMessage
```

--------------------------------

### Handle Node Event with Middewares

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/documentation/src/020301-engine-actions.adoc

Uses middlewares for simpler synchronous processing and data transformations, suitable for validation, logging, or basic business logic. This approach is good for cross-cutting concerns.

```typescript
import { type Action } from "typescript-fsa";
import { type EngineAction } from "@mgm/a12-content-engine";

export const handleNodeEventInMiddleware = (storeAPI) => (next) => (action) => {
	if (action.type === "@mgm/a12-content-engine/NODE_EVENT") {
		const engineAction = action as EngineAction;
		console.log("Node event in middleware:", engineAction.payload);
		// Example: Data validation or transformation
		// const processedPayload = {
		// 	...engineAction.payload,
		// 	processedData: "someValue"
		// };
		// action = { ...action, payload: processedPayload };
	}

	return next(action);
};

```

--------------------------------

### withContentEngineDataProviders

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

A higher-order component that configures the application with Content Engine data providers.

```APIDOC
## withContentEngineDataProviders

### Description
A higher-order component that configures the application with Content Engine data providers.

### Signature
`withContentEngineDataProviders<T extends ApplicationWithContentEngineConfig>(cfg: T): T`

### Parameters
- **cfg** (T) - The application configuration object.

### Returns
- **T** - The modified application configuration object.
```

--------------------------------

### LibraryStateSelector Namespace

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Provides selectors for accessing specific properties of the LibraryState.

```APIDOC
## Namespace: LibraryStateSelector

### Description
Provides selectors for accessing specific properties of the `LibraryState`.

### Static Methods
- **library(): Selector<LibraryState, EditorElementLibrary>**
  Returns a selector for the entire `EditorElementLibrary` associated with the `LibraryState`.
- **libraryId(): Selector<LibraryState, string>**
  Returns a selector for the `libraryId` from the `LibraryState`.
```

--------------------------------

### DynamicSourceSetting

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A React functional component for configuring dynamic data sources. It accepts a nodeId as a prop to specify the target node.

```APIDOC
## DynamicSourceSetting

### Description
A React functional component for configuring dynamic data sources. It accepts a nodeId as a prop to specify the target node.

### Props
- **nodeId** (string) - Required - The ID of the node to configure.

### Usage
```jsx
<DynamicSourceSetting nodeId="some-node-id" />
```
```

--------------------------------

### Library Interface

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/core/index.api.md

Represents a library containing identifiable modules and a configuration.

```typescript
export interface Library<Module extends Identifiable = Identifiable, Configuration = unknown> extends Identifiable {
    readonly configuration: Configuration;
    readonly modules: Module[];
}
```

--------------------------------

### PreviewTriggerParams Interface

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Parameters used to trigger a preview, specifying selectors for content and document data.

```APIDOC
## PreviewTriggerParams Interface

### Description
Defines the parameters required to initiate a preview, using selectors to retrieve necessary data.

### Fields
- **selectContentModel** (Selector_2<ContentModel | undefined>) - A selector function to get the content model.
- **selectDocumentIds** (Selector_2<string[]>) - A selector function to get the document IDs.
- **selectDocumentModel** (Selector_2<DocumentModel | undefined>) - A selector function to get the document model.
- **selectThemeNames** (Selector_2<string[]>) - A selector function to get the theme names.
```

--------------------------------

### Importing Action Creator and Lexical Types

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/element-library/index.api.md

This snippet includes imports for ActionCreator from 'typescript-fsa' and EditorThemeClasses from 'lexical'. These are used for defining actions and theming within the content engine's components.

```typescript
import { ActionCreator } from 'typescript-fsa';
import type { EditorThemeClasses } from 'lexical';
```

--------------------------------

### RESOURCE_KEYS Object

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

A constant object containing resource keys for UI elements and messages.

```APIDOC
## RESOURCE_KEYS Object

### Description
Provides access to predefined resource keys, primarily used for internationalization and UI messaging within the content engine.

### Structure
```json
{
  "contentEngine": {
    "dialog": {
      "invalidChanges": {
        "title": "string",
        "message": "string",
        "cancelLabel": "string",
        "confirmLabel": "string"
      }
    }
  }
}
```
```

--------------------------------

### onChangeLexicalState

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Changes the lexical state of the editor. Requires a payload containing the new editor state.

```APIDOC
## onChangeLexicalState

### Description
Updates the editor's lexical state with new content or structure.

### Method
Not applicable (SDK Action)

### Parameters
#### Request Body
- **ChangeLexicalEditorPayload** - Required - Payload containing the new lexical editor state.
```

--------------------------------

### ModelState Interface

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Represents the overall state of the model, including content and document models, and experimental features.

```APIDOC
## Interface: ModelState

### Description
Represents the overall state of the model, including the content model, document model, and settings for experimental features.

### Properties
- **contentModel** (ContentModel): The content model.
- **documentModel** (DocumentModel | undefined): The document model, if available.
- **enableExperimentalElements** (boolean | undefined): Flag to enable experimental elements.

### Static Methods
- **isInstance(obj: unknown): obj is ModelState**
  Checks if an object is an instance of `ModelState`.
```

--------------------------------

### newOnResetSetting

Source: https://github.com/mgm-tp/a12-content-engine/blob/main/editor/index.api.md

Resets specific settings for a node or globally. Requires a payload specifying which settings to reset.

```APIDOC
## newOnResetSetting

### Description
Resets one or more settings to their default values. This can be applied to a specific node or globally.

### Method
Not applicable (SDK Action)

### Parameters
#### Request Body
- **nodeId** (string) - Optional - The ID of the node whose settings should be reset.
- **settingPaths** (SettingPath[]) - Required - An array of paths specifying which settings to reset.
```