### Install Axii App with npx

Source: https://axii.dev/docs/api/axii/index

Use this command to create a new Axii application. It initializes a new project with the necessary Axii setup.

```bash
npx create-axii-app myapp
```

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

### Axii Quick Start Example

Source: https://axii.dev/docs/api/axii/index

A basic Axii application demonstrating reactive input and display. It utilizes `createElement` for JSX-like syntax and `atom` for reactive state management. The application binds an input field's value to a reactive atom and displays the atom's value in a separate div.

```javascript
/* @jsx createElement */  
import { createRoot, createElement, atom } from 'axii'  
  
function App({}, { createElement }) {  
  const name = atom('world')  
  const onInput = (e) => name(e.target.value)  
  
  return (  
    <div>  
      <input value={name} onInput={onInput} />  
      <div>Hello, {name}!</div>  
    </div>  
  )  
}  
  
const root = document.getElementById('root')!  
const appRoot = createRoot(root)  
appRoot.render(<App />)
```

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

### DataContext Methods

Source: https://axii.dev/docs/api/axii/classes/datacontext

Documentation for the get and set methods of the DataContext class.

```APIDOC
## Methods DataContext

### Description
Methods available on the DataContext class.

### Methods

#### get

##### Description
Retrieves a value based on its context type.

##### Method
`get(contextType: any): any`

##### Parameters
- **contextType** (any) - The type of context to retrieve the value for.

##### Returns
- any: The value associated with the context type.

#### set

##### Description
Sets a value for a given context type.

##### Method
`set(contextType: any, value: any): void`

##### Parameters
- **contextType** (any) - The type of context to set the value for.
- **value** (any) - The value to set.

##### Returns
- void: This method does not return a value.
```

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

### Get value from DataContext by contextType

Source: https://axii.dev/docs/api/axii/classes/DataContext

The get method retrieves a value from the DataContext based on the provided contextType. The return type is any.

```typescript
get(contextType: any): any
```

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

### ReusableHost Constructor

Source: https://axii.dev/docs/api/axii/classes/ReusableHost

Initializes a new instance of the ReusableHost class. It accepts the source data, a placeholder element, and the path context as parameters.

```typescript
new ReusableHost(source: any, placeholder: Comment, pathContext: PathContext): ReusableHost
```

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

### ReusableHost Class API

Source: https://axii.dev/docs/api/axii/classes/reusablehost

Documentation for the ReusableHost class, its constructors, properties, and methods.

```APIDOC
## Class ReusableHost

**Implements**: Host

### Constructors

#### constructor

`new ReusableHost(source: any, placeholder: Comment, pathContext: PathContext): ReusableHost`

**Parameters**:

*   `source` (any) - The source element.
*   `placeholder` (Comment) - The placeholder comment.
*   `pathContext` (PathContext) - The path context.

**Returns**: ReusableHost

### Properties

*   **element** (HTMLElement | Text | SVGElement | Comment): The HTML element, text node, SVG element, or comment node.
*   **innerHost** (Host): The inner host.
*   **pathContext** (PathContext): The path context.
*   **placeholder** (Comment): The placeholder comment.
*   **rendered** (boolean): Indicates if the component has been rendered. Defaults to `false`.
*   **reusePlaceholder** (Comment) - Optional: The placeholder to reuse.
*   **source** (any): The source of the component.

### Methods

#### destroy

`destroy(parentHandle?: boolean, parentHandleComputed?: boolean): void`

**Parameters**:

*   `parentHandle` (boolean) - Optional: Whether to destroy the parent handle.
*   `parentHandleComputed` (boolean) - Optional: Whether to destroy the parent handle computed.

**Returns**: void

#### destroyReusable

`destroyReusable(): void`

**Returns**: void

#### moveTo

`moveTo(reusePlaceholder: Comment): void`

**Parameters**:

*   `reusePlaceholder` (Comment) - The placeholder to move to.

**Returns**: void

#### render

`render(): void`

**Returns**: void
```

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

### ReusableHost Methods

Source: https://axii.dev/docs/api/axii/classes/reusablehost

Outlines the methods available for interacting with the ReusableHost class. These include 'destroy' for cleaning up resources, 'destroyReusable' for specific reusable cleanup, 'moveTo' for repositioning the placeholder, and 'render' to display the component. Each method serves a distinct lifecycle management function.

```typescript
destroy(parentHandle?, parentHandleComputed?): void
destroyReusable(): void
moveTo(reusePlaceholder): void
render(): void
```

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

### StyleSize Class Documentation

Source: https://axii.dev/docs/api/axii/classes/StyleSize

Documentation for the StyleSize class, covering its constructors, properties, and methods.

```APIDOC
## Class StyleSize

### Constructors

#### constructor

* `new StyleSize(value, unit?): StyleSize`
* **Parameters**
  * `value` (string | number) - The value for the style size.
  * `unit` (Unit | "mixed", optional) - The unit for the style size. Defaults to 'px'.

## Properties

### unit

* `unit`: Unit | "mixed" = 'px'
  * The unit of the StyleSize.

### value

* `value`: string | number
  * The numerical or string value of the StyleSize.

## Methods

### add

* `add(value, unit?): StyleSize`
* **Parameters**
  * `value` (number | StyleSize) - The value to add.
  * `unit` (Unit, optional) - The unit to add.
* **Returns** `StyleSize` - A new StyleSize instance representing the sum.

### clone

* `clone(): StyleSize`
* **Returns** `StyleSize` - A deep copy of the StyleSize instance.

### div

* `div(value): StyleSize`
* **Parameters**
  * `value` (number) - The number to divide by.
* **Returns** `StyleSize` - A new StyleSize instance representing the division result.

### mul

* `mul(value): StyleSize`
* **Parameters**
  * `value` (number) - The number to multiply by.
* **Returns** `StyleSize` - A new StyleSize instance representing the multiplication result.

### sub

* `sub(value, unit?): StyleSize`
* **Parameters**
  * `value` (number | StyleSize) - The value to subtract.
  * `unit` (Unit, optional) - The unit to subtract.
* **Returns** `StyleSize` - A new StyleSize instance representing the difference.

### toString

* `toString(): string`
* **Returns** `string` - A string representation of the StyleSize.

### valueOf

* `valueOf(): string`
* **Returns** `string` - The primitive value of the StyleSize.
```

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

### DataContext Constructor

Source: https://axii.dev/docs/api/axii/classes/datacontext

Initializes a new instance of the DataContext class with a specified host path.

```APIDOC
## Constructor DataContext

### Description
Initializes a new instance of the DataContext class.

### Method
`constructor`

### Endpoint
N/A (Class Constructor)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
```javascript
// Example usage (hypothetical)
const hostPath = new HostPath(...);
const dataContext = new DataContext(hostPath);
```

### Response
#### Success Response (200)
N/A (Constructor)

#### Response Example
N/A (Constructor)
```

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

### StyleSize Class API

Source: https://axii.dev/docs/api/axii/classes/stylesize

Documentation for the StyleSize class, covering its constructors, properties, and methods.

```APIDOC
## Class StyleSize

### Description
The StyleSize class represents a size value with a unit.

### Constructors
#### constructor

* `new StyleSize(value, unit?): StyleSize`

##### Parameters
* `value` (string | number) - The numeric or string value for the size.
* `unit` (Unit | "mixed", optional) - The unit for the size. Defaults to 'px'.

##### Returns
* `StyleSize` - A new StyleSize object.

### Properties
#### unit
* `unit` (Unit | "mixed") - The unit of the StyleSize. Defaults to 'px'.

#### value
* `value` (string | number) - The numeric or string value of the size.

### Methods
#### add

* `add(value, unit?): StyleSize`

Adds a value to the current StyleSize.

##### Parameters
* `value` (number | StyleSize) - The value to add. Can be a number or another StyleSize object.
* `unit` (Unit, optional) - The unit to use when adding a numeric value.

##### Returns
* `StyleSize` - A new StyleSize object representing the sum.

#### clone

* `clone(): StyleSize`

Creates a deep copy of the StyleSize object.

##### Returns
* `StyleSize` - A new, independent StyleSize object with the same properties.

#### div

* `div(value): StyleSize`

Divides the current StyleSize by a number.

##### Parameters
* `value` (number) - The number to divide by.

##### Returns
* `StyleSize` - A new StyleSize object representing the result of the division.

#### mul

* `mul(value): StyleSize`

Multiplies the current StyleSize by a number.

##### Parameters
* `value` (number) - The number to multiply by.

##### Returns
* `StyleSize` - A new StyleSize object representing the result of the multiplication.

#### sub

* `sub(value, unit?): StyleSize`

Subtracts a value from the current StyleSize.

##### Parameters
* `value` (number | StyleSize) - The value to subtract. Can be a number or another StyleSize object.
* `unit` (Unit, optional) - The unit to use when subtracting a numeric value.

##### Returns
* `StyleSize` - A new StyleSize object representing the difference.

#### toString

* `toString(): string`

Converts the StyleSize to its string representation.

##### Returns
* `string` - The string representation of the StyleSize (e.g., "10px").

#### valueOf

* `valueOf(): string`

Returns the primitive value of the StyleSize object, typically its string representation.

##### Returns
* `string` - The primitive string value of the StyleSize.
```

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

### ReusableHost Methods

Source: https://axii.dev/docs/api/axii/classes/ReusableHost

Details the methods available on the ReusableHost class for managing its lifecycle and rendering. This includes methods for destruction, moving, and rendering.

```typescript
destroy(parentHandle?: boolean, parentHandleComputed?: boolean): void
destroyReusable(): void
moveTo(reusePlaceholder: Comment): void
render(): void
```

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

### Initialize DataContext with hostPath

Source: https://axii.dev/docs/api/axii/classes/DataContext

This constructor initializes a new instance of the DataContext class, requiring a LinkedNode<Host> object for the hostPath.

```typescript
new DataContext(hostPath: LinkedNode<Host>): DataContext
```

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

### ThemeOSLightDark Settings

Source: https://axii.dev/docs/api/axii/functions/withpreventdefault

Information regarding the ThemeOSLightDark settings, specifically member visibility.

```APIDOC
## ThemeOSLightDark Settings

### Description
Settings related to the `ThemeOSLightDark` component, including member visibility.

### Member Visibility
* **Protected**
* **Inherited**
```

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

### Context Creation API

Source: https://axii.dev/docs/api/axii/functions/createContext

This section details the `createContext` function, which is used to create a new context in the Axii system. It outlines the type parameters, input parameters, and the structure of the returned context object.

```APIDOC
## createContext

### Description
Creates a new context with a given name and type. This context can then be used with a Provider component to manage and provide values throughout the application.

### Method
N/A (This is a function definition, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### Type Parameters
* **T** - The type of the value that the context will hold.

#### Parameters
* **name** (string) - Required - The unique name for the context.

### Returns
An object representing the created context, including its name, value type, and a Provider component.

#### Success Response (200)
* **name** (string) - The name of the context.
* **valueType** (T) - The type of the value the context holds.
* **Provider** (function) - A React component used to provide the context value.
  * #### Parameters
    * **__namedParameters: ContextProviderProps** - Props for the Provider component.
    * **__namedParameters: RenderContext** - Context for rendering.
  * #### Returns
    * any

#### Response Example
```json
{
  "name": "MyContextName",
  "valueType": "string",
  "Provider": "function"
}
```
```

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

### DataContext Class API

Source: https://axii.dev/docs/api/axii/classes/DataContext

Details regarding the DataContext class, including its constructor, properties, and methods.

```APIDOC
## DataContext Class

### Constructor

#### `constructor(hostPath: LinkedNode<Host>): DataContext`

*   **Parameters**
    *   `hostPath` (LinkedNode<Host>) - The host path for the DataContext.

### Properties

*   **`hostPath`** (`LinkedNode<Host>`)
    *   Represents the host path associated with the DataContext.
*   **`valueByType`** (`Map<any, any>`)
    *   A map storing values indexed by their type.

### Methods

#### `get(contextType: any): any`

*   **Description**: Retrieves a value based on the provided context type.
*   **Parameters**
    *   `contextType` (any) - The type of context to retrieve the value for.
*   **Returns** (`any`) - The retrieved value.

#### `set(contextType: any, value: any): void`

*   **Description**: Sets a value for a given context type.
*   **Parameters**
    *   `contextType` (any) - The type of context to set the value for.
    *   `value` (any) - The value to set.
*   **Returns** (`void`)
```

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

### StyleSize Class Constructor (TypeScript)

Source: https://axii.dev/docs/api/axii/classes/stylesize

Initializes a new StyleSize object. It accepts a value (string or number) and an optional unit (Unit or 'mixed'), defaulting to 'px'.

```typescript
new StyleSize(value: string | number, unit?: Unit | "mixed")
```

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

### createElement API

Source: https://axii.dev/docs/api/axii/functions/createElement

The `createElement` function is used to create a new component node, HTML element, DocumentFragment, or SVGElement.

```APIDOC
## createElement

### Description
Creates a new component node, HTML element, DocumentFragment, or SVGElement.

### Method
createElement

### Parameters
#### Parameters
- **type** (JSXElementType) - Required - The type of element to create.
- **rawProps** (AttributesArg) - Optional - The properties for the element.
- **...rawChildren** (any[]) - Optional - The children of the element.

### Returns
| ComponentNode |
| HTMLElement |
| DocumentFragment |
| SVGElement
```

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

### ReusableHost Properties

Source: https://axii.dev/docs/api/axii/classes/ReusableHost

Defines the properties of the ReusableHost class, including the DOM element, inner host reference, path context, placeholder, rendering status, optional reuse placeholder, and the source data.

```typescript
element: HTMLElement | Text | SVGElement | Comment
innerHost: Host
pathContext: PathContext
placeholder: Comment
rendered: boolean = false
reusePlaceholder?: Comment
source: any
```

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

### Axii API - onKey Function

Source: https://axii.dev/docs/api/axii/functions/onkey

The onKey function is used to register a callback for keyboard events. It takes a key string and an optional configuration object. The function returns a handler that can be used to attach the event listener.

```APIDOC
## Function onKey

### Description
Registers a callback for keyboard events associated with a specific key.

### Method
Not applicable (this is a function signature, not an HTTP endpoint)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Parameters
- **key** (string) - Required - The key to listen for (e.g., 'Enter', 'Escape').
- **config** (onKeyConfig) - Optional - Configuration options for the key event listener.

### Returns
A function that takes a `handle` callback and returns another function. The returned function is responsible for attaching and detaching the event listener.

#### Inner Function (`handle` parameter)
- **handle** (function) - Required - A callback function that will be executed when the key event occurs.
  - Parameters:
    - **e** (KeyboardEvent) - The keyboard event object.
  - Returns: any

#### Inner Function (`Returns`) 
- **Returns** (function) - This function is returned by the outer `onKey` function and is used to manage the event listener.
  - Parameters:
    - **e** (KeyboardEvent) - The keyboard event object.
  - Returns: any

### Request Example
```javascript
// Example usage:
const myHandler = (e) => {
  console.log('Key event occurred:', e.type);
};

const keyListener = axii.onKey('Enter', { /* optional config */ })(myHandler);

// To remove the listener, you would typically need a way to access and remove it,
// which depends on the internal implementation of axii.onKey.
```

### Response
#### Success Response
This function does not directly return a success response in the typical API sense. It returns functions for event handling.

#### Response Example
```javascript
// The return value is a function that manages the event listener.
// Example of the structure returned:
() => { /* internal event handling logic */ }
```

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

### onMiddleMouseDown Function

Source: https://axii.dev/docs/api/axii/functions/onMiddleMouseDown

Details of the `onMiddleMouseDown` function, including its parameters, return types, and usage.

```APIDOC
## Function onMiddleMouseDown

### Description
Handles the middle mouse button down event.

### Method
N/A (This is a function definition, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
None

### Response
#### Success Response (200)
None

#### Response Example
None

### Function Signature
`onMiddleMouseDown(handle: (e: MouseEvent) => any): (e: MouseEvent) => any`

### Parameters
#### handle
- **handle** ((e: MouseEvent) => any) - The callback function to execute when the middle mouse button is pressed.
  - **e** (MouseEvent) - The mouse event object.

### Returns
- **((e: MouseEvent) => any)** - A function that takes a MouseEvent and returns any.
```

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

### DOM Utility Methods

Source: https://axii.dev/docs/api/axii/functions/createElement

Utility functions for managing DOM references and attribute validation.

```APIDOC
## attachRef

### Description
Attaches a reference to an HTML element.

### Method
attachRef

### Parameters
#### Parameters
- **el** (HTMLElement) - Required - The HTML element to attach the ref to.
- **ref** (RefObject | RefFn | (RefObject | RefFn)[]) - Required - The ref object or function to attach.

### Returns
void

## detachRef

### Description
Detaches a reference from an element.

### Method
detachRef

### Parameters
#### Parameters
- **ref** (RefObject | RefFn | (RefObject | RefFn)[]) - Required - The ref object or function to detach.

### Returns
void

## isValidAttribute

### Description
Validates if an attribute is valid for an element. Supports object and string styles for `style`, but not nested objects. Supports functions or arrays of functions for events. `className` supports objects.

### Method
isValidAttribute

### Parameters
#### Parameters
- **name** (string) - Required - The name of the attribute.
- **value** (any) - Required - The value of the attribute.

### Returns
boolean
```

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

### ReusableHost Properties

Source: https://axii.dev/docs/api/axii/classes/reusablehost

Details the properties of the ReusableHost class, including 'element' (the DOM element), 'innerHost', 'pathContext', 'placeholder', a boolean 'rendered' flag, an optional 'reusePlaceholder', and the 'source' of the reusable element. These properties manage the state and references for the reusable component.

```typescript
element: HTMLElement | Text | SVGElement | Comment = ...
innerHost: Host
pathContext: PathContext
placeholder: Comment
rendered: boolean = false
reusePlaceholder?: Comment
source: any
```

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

### Axii API - onKey Function

Source: https://axii.dev/docs/api/axii/functions/onKey

The onKey function in the Axii API allows for handling keyboard events with a provided key and optional configuration. It returns a handler that processes keyboard events.

```APIDOC
## Axii API - onKey Function

### Description
The `onKey` function is used to attach event listeners for specific key presses. It takes a key identifier and an optional configuration object. It returns a function that accepts a handler for processing the keyboard event.

### Method
N/A (This is a function, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### Function Parameters
- **key** (string) - Required - The identifier for the key to listen for.
- **config** (onKeyConfig) - Optional - Configuration options for the key event listener.

### Returns
((handle: ((e: KeyboardEvent) => any)) => ((e: KeyboardEvent) => any))
  - This function returns another function that takes a `handle` function as an argument. The `handle` function will be called when the specified key event occurs.

### Request Example
```javascript
// Example usage (conceptual, actual implementation may vary)
const myHandler = (event) => {
  console.log('Key pressed:', event.key);
};

const attachListener = onKey('Enter', { /* optional config */ });
const detachListener = attachListener(myHandler);

// To remove the listener later:
// detachListener();
```

### Response
#### Success Response
N/A (This is a function's return value, not an HTTP response)

#### Response Example
```javascript
// The returned function signature:
(handle: (e: KeyboardEvent) => any) => (e: KeyboardEvent) => any
```
```

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

### createElementNS Function

Source: https://axii.dev/docs/api/axii/functions/createElementNS

The createElementNS function allows for the creation of various element types within the Axii framework.

```APIDOC
## createElementNS

### Description
Creates a new element with a specified namespace, properties, and children.

### Method
Function (JavaScript)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
- **type** (string) - Required - The type of element to create (e.g., 'div', 'span').
- **props** (AttributesArg) - Optional - An object containing attributes for the element.
- **children** (any[]) - Optional - Any number of child nodes or elements to append.

### Request Example
```javascript
createElementNS('div', { id: 'myDiv' }, 'Hello, world!');
```

### Response
#### Success Response
- **DocumentFragment | HTMLElement | SVGElement | ComponentNode** - The created element or fragment.

#### Response Example
```javascript
// Returns an HTMLElement
const myElement = createElementNS('div', { className: 'container' }); 
```
```

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

### DataContext Properties

Source: https://axii.dev/docs/api/axii/classes/datacontext

Details the properties of the DataContext class: hostPath and valueByType.

```APIDOC
## Properties DataContext

### Description
Properties available on the DataContext class.

### Properties

- **hostPath** (LinkedNode<Host>) - The host path associated with the DataContext.
- **valueByType** (Map<any, any>) - A map storing values categorized by type.
```

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

### Axii API - onDownKey Function

Source: https://axii.dev/docs/api/axii/functions/onDownKey

Documentation for the `onDownKey` function within the Axii API. This function appears to handle keyboard events.

```APIDOC
## Function onDownKey

### Description
Handles a keyboard event when a key is pressed down.

### Method
(Not specified, likely a JavaScript function call)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
```javascript
onDownKey(callbackFunction);
```

### Response
#### Success Response
- **(e: KeyboardEvent) => any**: The function returns a callback that accepts a KeyboardEvent and returns any type.

#### Response Example
```javascript
// Example of the returned callback signature
const handler = (e: KeyboardEvent) => {
  console.log('Key pressed:', e.key);
  return "handled";
};

onDownKey(handler);
```
```

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

### Axii API - onRightKey Function

Source: https://axii.dev/docs/api/axii/functions/onRightKey

Documentation for the onRightKey function within the Axii API. This function handles keyboard events on the right key.

```APIDOC
## Axii API - onRightKey Function

### Description
Handles keyboard events when the right key is pressed. It takes a callback function as a parameter.

### Method
Not applicable (this describes a function, not a REST endpoint).

### Endpoint
Not applicable (this describes a function, not a REST endpoint).

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
```javascript
// Example usage (conceptual)
axii.onRightKey(event => {
  console.log('Right key pressed:', event);
});
```

### Response
#### Success Response
This function returns a callback of type `(e: KeyboardEvent) => any`.

#### Response Example
```javascript
// Conceptual return value
() => {
  // ... function body ...
}
```

### Parameters in Detail
* **handle** ((e: KeyboardEvent) => any) - The callback function to be executed when the right key is pressed.
  * **e** (KeyboardEvent) - The keyboard event object associated with the key press.
```

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

### Create Element with Axii API

Source: https://axii.dev/docs/api/axii/functions/createelement

The `createElement` function is used to create UI components. It accepts the element type, properties, and child elements as arguments. It can return various types of DOM nodes, including ComponentNode, HTMLElement, DocumentFragment, or SVGElement.

```javascript
createElement(type, rawProps, ...rawChildren)
```

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

### Axii API - onLeftMouseDown Function

Source: https://axii.dev/docs/api/axii/functions/onleftmousedown

Details for the onLeftMouseDown function within the Axii API, including its parameters and return type.

```APIDOC
## Axii API - onLeftMouseDown Function

### Description
Handles the event when the left mouse button is pressed down.

### Method
N/A (This describes a function, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### Function Parameters
- **handle** ((e: MouseEvent) => any) - Required - A callback function that receives a MouseEvent.
  - **e** (MouseEvent) - Required - The mouse event object.

#### Returns
((e: MouseEvent) => any) - The function returns a callback that processes the mouse event.
```

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

### Context Creation API

Source: https://axii.dev/docs/api/axii/functions/createcontext

Provides functionality to create a new context within the Axii system. This context can be used to manage and share state across different parts of the application.

```APIDOC
## POST /axii/createContext

### Description
Creates a new context with a specified name and value type. The created context includes a Provider component for managing context values.

### Method
POST

### Endpoint
/axii/createContext

### Parameters
#### Query Parameters
- **name** (string) - Required - The name of the context to be created.

#### Request Body
This endpoint does not have a request body.

### Request Example
```json
{
  "example": "No request body"
}
```

### Response
#### Success Response (200)
- **name** (string) - The name of the created context.
- **valueType** (type) - The type of the value that the context will hold.
- **Provider** (function) - A React component used to provide the context value to its children.

#### Response Example
```json
{
  "name": "MyContextName",
  "valueType": "string",
  "Provider": "function"
}
```
```

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

### onUpKey Function

Source: https://axii.dev/docs/api/axii/functions/onUpKey

Handles the 'up' key event, accepting a callback function that receives a KeyboardEvent.

```APIDOC
## Function onUpKey

### Description
Handles the 'up' key event. It takes a callback function `handle` which will be executed when the 'up' key is pressed. The callback receives a `KeyboardEvent` object.

### Method
N/A (This describes a function, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### Function Parameters
- **handle** ((e: KeyboardEvent) => any) - Required - A callback function to be executed on 'up' key press. It receives a `KeyboardEvent` object `e`.

### Request Example
N/A

### Response
#### Returns
((e: KeyboardEvent) => any) - The function itself, or the return value of the provided callback.

#### Response Example
N/A
```

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

### Axii API - createReactivePosition

Source: https://axii.dev/docs/api/axii/functions/createreactiveposition

The createReactivePosition function is used to create a reactive position for an element or window. It takes an options object and returns a cleanup function.

```APIDOC
## POST /api/axii/createReactivePosition

### Description
Creates a reactive position for a given HTML element or window. This function observes changes and updates the provided position atom accordingly. It returns a cleanup function to stop observation.

### Method
POST

### Endpoint
/api/axii/createReactivePosition

### Parameters
#### Request Body
- **options** (ReactivePositionOptions) - Required - Configuration for the reactive position.
  - **elOrWindow** (HTMLElement | Window) - Required - The element or window to observe.
  - **value** (Atom<null | PositionObject>) - Required - An atom that will hold the position object.

### Request Example
```json
{
  "options": {
    "elOrWindow": "window",
    "value": null // Assuming 'value' is an atom object or its initial state
  }
}
```

### Response
#### Success Response (200)
- **cleanupFunction** (function) - A function that can be called to stop observing changes and clean up resources.

#### Response Example
```json
{
  "cleanupFunction": "() => void"
}
```
```

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

### Axii API - createElementNS

Source: https://axii.dev/docs/api/axii/functions/createelementns

Creates a new element of the specified type with given properties and children. It supports creating DocumentFragments, HTMLElements, SVGElements, and ComponentNodes.

```APIDOC
## POST /createElementNS

### Description
Creates a new element of the specified type with given properties and children. It supports creating DocumentFragments, HTMLElements, SVGElements, and ComponentNodes.

### Method
POST

### Endpoint
/createElementNS

### Parameters
#### Request Body
- **type** (string) - Required - The type of element to create.
- **props** (AttributesArg) - Optional - The properties to apply to the element.
- **children** (any[]) - Optional - The child nodes or content for the element.

### Request Example
```json
{
  "type": "div",
  "props": {
    "className": "container"
  },
  "children": [
    "Hello, World!",
    {
      "type": "span",
      "children": "inner"
    }
  ]
}
```

### Response
#### Success Response (200)
- **result** (DocumentFragment | HTMLElement | SVGElement | ComponentNode) - The newly created element.

#### Response Example
```json
{
  "result": "<div class=\"container\">Hello, World!<span>inner</span></div>"
}
```
```

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

### Axii API - onRightMouseDown Function

Source: https://axii.dev/docs/api/axii/functions/onrightmousedown

Documentation for the onRightMouseDown function, which handles right-click mouse events.

```APIDOC
## Function onRightMouseDown

### Description
Handles the right-click mouse event and provides an event object to a callback handler.

### Method
N/A (This describes a function, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
```javascript
// Example usage within a component
const myHandler = (e) => {
  console.log('Right-clicked:', e);
};

onRightMouseDown(myHandler);
```

### Response
#### Success Response (N/A)
This function does not return an HTTP response.

#### Response Example
N/A
```

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

### StyleSize Class Methods - Arithmetic Operations (TypeScript)

Source: https://axii.dev/docs/api/axii/classes/stylesize

Provides methods for performing arithmetic operations on StyleSize objects. Includes 'add' and 'sub' for addition and subtraction, accepting a number or another StyleSize object, and 'mul' and 'div' for multiplication and division by a number.

```typescript
add(value: number | StyleSize, unit?: Unit): StyleSize
sub(value: number | StyleSize, unit?: Unit): StyleSize
mul(value: number): StyleSize
div(value: number): StyleSize
```

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

### Axii API - createReactiveDragTarget

Source: https://axii.dev/docs/api/axii/functions/createreactivedragtarget

Creates a reactive drag target that synchronizes DOM element references with a snapshot function.

```APIDOC
## POST /axii/createReactiveDragTarget

### Description
Creates a reactive drag target. This function takes a `getSnapshot` function as an argument, which is responsible for retrieving the current state or snapshot of a DOM element. It returns a cleanup function that should be called when the drag target is no longer needed.

### Method
POST

### Endpoint
/axii/createReactiveDragTarget

### Parameters
#### Request Body
- **getSnapshot** (function) - Required - A function that takes an HTMLElement reference and returns its current snapshot value.
  - **Parameters**:
    - **ref** (HTMLElement) - Required - The reference to the DOM element.
  - **Returns** (any) - The snapshot value of the element.

### Request Example
```json
{
  "getSnapshot": "(ref) => ref.textContent"
}
```

### Response
#### Success Response (200)
- **cleanupFunction** (function) - A function that, when called, cleans up the drag target and its associated listeners. This function takes two arguments: `ref` (HTMLElement) and `value` (any), and returns a `void` function.

#### Response Example
```json
{
  "cleanupFunction": "(ref, value) => () => { console.log('Cleaned up'); }"
}
```
```

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

### StyleSize Class Methods - Utility Operations (TypeScript)

Source: https://axii.dev/docs/api/axii/classes/stylesize

Offers utility methods for StyleSize objects. 'clone' creates a deep copy, 'toString' converts the size to a string representation, and 'valueOf' returns the primitive value of the size.

```typescript
clone(): StyleSize
toString(): string
valueOf(): string
```

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

### Axii API - createOnDragMove

Source: https://axii.dev/docs/api/axii/functions/createondragmove

The createOnDragMove function is used to set up drag-and-drop functionality for an HTML element. It takes optional configuration options and returns a cleanup function.

```APIDOC
## Function createOnDragMove

### Description
Initializes drag-and-drop behavior for a given HTML element. It accepts optional configuration options and returns a function to clean up event listeners.

### Method
*This is a function, not a traditional HTTP method.*

### Endpoint
*N/A - Client-side function.*

### Parameters
#### Path Parameters
*None*

#### Query Parameters
*None*

#### Request Body
*None*

### Parameters
*   **options** (`DragMoveOptions` | `undefined`) - Optional. Configuration options for drag-and-drop behavior.

### Returns
*   A function that accepts an `HTMLElement` reference and returns a cleanup function.
    *   **ref** (`HTMLElement`) - The HTML element to attach drag listeners to.
    *   **Returns** (`() => void`) - A function that, when called, removes all event listeners associated with the drag functionality.
        *   **Returns** (`void`)

```

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

### Axii API - createReactiveDragTarget

Source: https://axii.dev/docs/api/axii/functions/createReactiveDragTarget

The createReactiveDragTarget function in the Axii API is used to create a reactive drag target. It takes a getSnapshot function as a parameter and returns a function that sets up the drag target.

```APIDOC
## createReactiveDragTarget

### Description
Creates a reactive drag target. It accepts a `getSnapshot` function to capture the current state and returns a setup function.

### Method
N/A (This is a function, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### getSnapshot
- **getSnapshot** (function) - Required - A function that takes an HTMLElement reference and returns its current snapshot.
  - #### Parameters
    - **ref** (HTMLElement) - Required - The reference to the element.
  - #### Returns any - The snapshot of the element's state.

#### Returns
- **function** - Returns a function that takes an HTMLElement reference and a value, and returns a cleanup function.
  - #### Parameters
    - **ref** (HTMLElement) - Required - The reference to the element.
    - **value** (any) - Required - The value to be associated with the drag target.
  - #### Returns (() => void) - A function to clean up the drag target.
    - #### Returns void
```

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

### Axii API - Search Index Status

Source: https://axii.dev/docs/api/axii/functions/withCurrentRange

Information regarding the status and availability of the search index for the Axii API.

```APIDOC
## Search Index Status

### Description
Checks the status of the search index used by the Axii API.

### Method
GET

### Endpoint
/websites/axii_dev_api_axii/search/status

### Parameters
None

### Response
#### Success Response (200)
* **status** (string) - The current status of the search index (e.g., "Preparing", "Available", "Not Available").

#### Response Example
```json
{
  "status": "Preparing search index..."
}
```

### Error Handling
* **404 Not Found**: If the search index endpoint is not configured.
* **503 Service Unavailable**: If the search index is temporarily unavailable.
```

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

### Axii API - onSpaceKey Function

Source: https://axii.dev/docs/api/axii/functions/onspacekey

The onSpaceKey function handles keyboard events, specifically the space key.

```APIDOC
## Axii API - onSpaceKey Function

### Description
Handles keyboard events, specifically the space key. It takes a callback function as a parameter.

### Method
N/A (This is a function, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
```json
{
  "callback": "(e: KeyboardEvent) => any"
}
```

### Response
#### Success Response (200)
N/A (Function return type is specified below)

#### Response Example
```json
{
  "return_type": "(e: KeyboardEvent) => any"
}
```

### Return Type
- **(e: KeyboardEvent) => any**: The function returns a callback that accepts a KeyboardEvent and returns any type.
```

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

### Axii API - createReactivePosition

Source: https://axii.dev/docs/api/axii/functions/createReactivePosition

The createReactivePosition function is used to create a reactive position observer. It takes an element or window and an atom for position updates, returning a cleanup function.

```APIDOC
## createReactivePosition

### Description
Creates a reactive position observer for a given element or window, updating a provided atom with position information. Returns a function to clean up the observer.

### Method
N/A (Function Signature)

### Endpoint
N/A (Internal Function)

### Parameters
#### Parameters
- **options** (ReactivePositionOptions) - Required - Options for creating the reactive position.
  - **elOrWindow** (HTMLElement | Window) - The element or window to observe.
  - **value** (Atom<null | PositionObject>) - An atom to store the position updates.

### Request Example
```json
{
  "elOrWindow": "document.body",
  "value": "positionAtom"
}
```

### Response
#### Success Response (200)
- **cleanupFunction** (() => void) - A function that, when called, will stop observing the position.

#### Response Example
```json
{
  "cleanupFunction": "() => void"
}
```
```

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

### Search Index Status

Source: https://axii.dev/docs/api/axii/functions/onUpKey

Provides information about the status of the search index.

```APIDOC
## Search Index Status

### Description
Indicates whether the search index is currently available or being prepared.

### Method
N/A (This describes a status, not an HTTP endpoint)

### Endpoint
N/A

### Parameters
N/A

### Request Example
N/A

### Response
#### Status
- **message** (string) - "Preparing search index..." or "The search index is not available."
```

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

### StyleSize.toString Method

Source: https://axii.dev/docs/api/axii/classes/StyleSize

Converts the StyleSize object into its string representation. This method is useful for displaying the size in a human-readable format, including its value and unit.

```typescript
toString(): string
```

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

### Define onEnterKey Function

Source: https://axii.dev/docs/api/axii/functions/onenterkey

Defines the onEnterKey function which accepts a keyboard event handler. The function is typed to return any, and the handler itself is a callback that receives a KeyboardEvent and returns any.

```typescript
function onEnterKey(handle: (e: KeyboardEvent) => any): (e: KeyboardEvent) => any;
```

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

### StyleSize.clone Method

Source: https://axii.dev/docs/api/axii/classes/StyleSize

Creates a deep copy of the current StyleSize object. This is useful for performing operations without modifying the original StyleSize instance. Returns a new StyleSize instance.

```typescript
clone(): StyleSize
```

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

### Axii API: onUpKey Function Signature

Source: https://axii.dev/docs/api/axii/functions/onUpKey

Defines the TypeScript signature for the onUpKey function. It takes a 'handle' function as a parameter, which itself processes KeyboardEvents, and returns a function of the same type. This highlights the event-driven nature of the API.

```typescript
onUpKey(handle: ((e: KeyboardEvent) => any)): ((e: KeyboardEvent) => any)
```

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

### StyleSize.add Method

Source: https://axii.dev/docs/api/axii/classes/StyleSize

Adds a value and an optional unit to the current StyleSize. The value can be a number or another StyleSize object. If a unit is provided, it's applied to the numerical value. Returns a new StyleSize instance.

```typescript
add(value: number | StyleSize, unit?: Unit): StyleSize
```

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

### Create Element with Axii

Source: https://axii.dev/docs/api/axii/functions/createElement

The createElement function in Axii is used to construct UI components. It accepts a type, raw properties, and child elements. It can return various element types including ComponentNode, HTMLElement, DocumentFragment, or SVGElement. Supports JSXElementType for type and AttributesArg for props.

```typescript
createElement(type: JSXElementType, rawProps: AttributesArg, ...rawChildren: any[]): ComponentNode | HTMLElement | DocumentFragment | SVGElement
```

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

### createReactiveDragPosition

Source: https://axii.dev/docs/api/axii/functions/createreactivedragposition

Creates a reactive drag position listener for a given HTML element.

```APIDOC
## createReactiveDragPosition

### Description
Creates a reactive drag position listener for a given HTML element.

### Method
Not explicitly defined, but implies a function call.

### Endpoint
Not applicable (this is a function, not an API endpoint).

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Request Example
```json
{
  "shouldRecord": true
}
```

### Response
#### Success Response (200)
Returns a function that can be called to clean up the listener.

#### Response Example
```json
{
  "cleanupFunction": "() => void"
}
```
```

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

### Axii API - createOnDragMove

Source: https://axii.dev/docs/api/axii/functions/createOnDragMove

The createOnDragMove function is used to initialize drag-and-drop behavior for an HTML element. It accepts optional configuration options and returns a function that cleans up the drag-and-drop listeners.

```APIDOC
## Function createOnDragMove

### Description
Initializes drag-and-drop behavior for an HTML element. It accepts optional configuration options and returns a cleanup function.

### Method
(Function Signature - not a typical HTTP method)

### Endpoint
(Not applicable for this function signature)

### Parameters
#### Options Parameter
- **options** (DragMoveOptions) - Optional - Configuration options for the drag-and-move behavior.

### Returns
- **((ref: HTMLElement) => (() => void))** - A function that takes an HTMLElement reference and returns a cleanup function.

#### Inner Function (Cleanup Function)
- **(ref: HTMLElement)** - A function that receives an HTMLElement reference.
  - **Returns**: (() => void) - A function to remove the drag-and-drop event listeners.

### Request Example
(Not applicable for this function signature)

### Response
#### Success Response
- **(ref: HTMLElement) => (() => void)** - Returns a function that, when called with an HTMLElement, returns another function to remove event listeners.

#### Response Example
(Not applicable for this function signature)
```

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

### Create Reactive Position (Axii API)

Source: https://axii.dev/docs/api/axii/functions/createReactivePosition

The `createReactivePosition` function in the Axii API is used to establish a reactive link between an HTML element or the window and a position object. It accepts an `elOrWindow` (HTMLElement or Window) and a `value` (an Atom of `null | PositionObject`). It returns `undefined` or a cleanup function to detach the reactive positioning. This is useful for dynamically updating element positions based on state changes.

```typescript
createReactivePosition(options: ReactivePositionOptions): (elOrWindow: HTMLElement | Window, value: Atom<null | PositionObject>) => undefined | (() => void)
```