# code/editor/environment (zidane-ui)

Import: `import { … } from 'zidane-ui'`. Source: [ui/src/code/editor/environment.tsx](https://github.com/Tahul/zidane/blob/main/ui/src/code/editor/environment.tsx).

## Components

### `EditorEnvironmentProvider`

Component.

Sets the environment of every editor surface below.

```ts
function EditorEnvironmentProvider(props: EditorEnvironmentProviderProps): Element
```

**Parameters**

- `props` (`EditorEnvironmentProviderProps`): The environment and the tree that reads it.

**Returns** `Element`

**Props**

- `children` (`ReactNode`): The subtree it applies to.
- `value` (`EditorEnvironment`): The environment the editors below read.

Source: [ui/src/code/editor/environment.tsx:70](https://github.com/Tahul/zidane/blob/main/ui/src/code/editor/environment.tsx#L70)

## Functions

### `useEditorEnvironment`

Function.

Returns the editor environment in effect.

```ts
function useEditorEnvironment(): EditorEnvironment
```

**Returns** `EditorEnvironment`

Source: [ui/src/code/editor/environment.tsx:75](https://github.com/Tahul/zidane/blob/main/ui/src/code/editor/environment.tsx#L75)

## Constants

### `DEFAULT_EDITOR_SETTINGS`

Constant.

The settings without an [`EditorEnvironmentProvider`](https://zidane.si/docs/reference/ui-code-editor-environment.md#EditorEnvironmentProvider): editable, manual saves, 2-space tabs, no wrap.

```ts
const DEFAULT_EDITOR_SETTINGS: EditorSettings
```

Source: [ui/src/code/editor/environment.tsx:33](https://github.com/Tahul/zidane/blob/main/ui/src/code/editor/environment.tsx#L33)

## Interfaces

### `EditorEnvironment`

Interface.

The value of [`EditorEnvironmentProvider`](https://zidane.si/docs/reference/ui-code-editor-environment.md#EditorEnvironmentProvider).

```ts
interface EditorEnvironment
```

**Properties**

- `appearance` (`Appearance`): Light or dark: picks pierre's palette to match the theme.
- `reducedMotion` (`boolean`): Scrolls jump instead of gliding (find, reveal).
- `settings` (`EditorSettings`): How the editors behave.
- `shikiTheme` (`string`): A bundled code theme id.

Source: [ui/src/code/editor/environment.tsx:44](https://github.com/Tahul/zidane/blob/main/ui/src/code/editor/environment.tsx#L44)

### `EditorEnvironmentProviderProps`

Interface.

Props for [`EditorEnvironmentProvider`](https://zidane.si/docs/reference/ui-code-editor-environment.md#EditorEnvironmentProvider).

```ts
interface EditorEnvironmentProviderProps
```

**Properties**

- `children` (`ReactNode`): The subtree it applies to.
- `value` (`EditorEnvironment`): The environment the editors below read.

Source: [ui/src/code/editor/environment.tsx:58](https://github.com/Tahul/zidane/blob/main/ui/src/code/editor/environment.tsx#L58)

### `EditorSettings`

Interface.

How the editor behaves.

```ts
interface EditorSettings
```

**Properties**

- `autoSurround` (`'quotes' | 'default' | 'never' | 'brackets'`): Which pairs typing an opener wraps around a selection: the language's default, none, brackets only or quotes only.
- `editing` (`boolean`): Files are editable (⌘S saves). Off: every editor stays read-only.
- `matchBrackets` (`boolean`): Highlight the bracket matching the one at the caret.
- `roundedSelection` (`boolean`): Round the corners of selection highlights.
- `saveOn` (`'manual' | 'blur'`): `blur`: save when the editor loses focus too.
- `tabSize` (`number`): How many columns a tab character paints across.
- `wordWrap` (`boolean`): Wrap long lines instead of scrolling sideways.

Source: [ui/src/code/editor/environment.tsx:15](https://github.com/Tahul/zidane/blob/main/ui/src/code/editor/environment.tsx#L15)