import { EditorView } from '@codemirror/view'; import type { EditorLanguageConfiguration } from './configuration/configuration.js'; import type { GutterConfiguration } from './configuration/getDefaultConfigurations.js'; import type { AriaLabelingProps } from '../../core/types/a11y-props.js'; import type { BehaviorTrackingProps } from '../../core/types/behavior-tracking-props.js'; import type { DataTestId } from '../../core/types/data-props.js'; import type { FormControlStateProps } from '../../core/types/form-control-state.js'; import type { MaskingProps } from '../../core/types/masking-props.js'; import type { StylingProps } from '../../core/types/styling-props.js'; /** * Props shared by all code editor components. * @public */ export interface SharedBaseCodeEditorProps extends FormControlStateProps, AriaLabelingProps, StylingProps, DataTestId, MaskingProps, BehaviorTrackingProps { /** * The ID for the DOM element. */ id?: string; /** * Callback that is called when the value in the editor changes. */ onChange?: (value: string) => void; /** * Displayed initially in the editor when there is no other content. */ placeholder?: string; /** * Whether spellcheck should be enabled. * @defaultValue false */ spellCheck?: boolean; /** * If set to true, the code editor uses the full height available in its parent. * @defaultValue false */ fullHeight?: boolean; /** * The start indices (character position) that should be folded initially in uncontrolled scenarios. */ defaultFolding?: number[]; /** * The start indices (character position) that should be folded initially in controlled scenarios. */ folding?: number[]; /** * Callback that is called when folding changes. */ onFoldingChange?: (values: number[]) => void; /** * Whether the input is readonly. * @defaultValue false */ readOnly?: boolean; /** * Whether long lines should be wrapped. * @defaultValue false */ lineWrap?: boolean; /** * Callback that is called when the editor loses focus. */ onBlur?: (e: FocusEvent) => void; /** * Callback that is called when the editor receives focus. */ onFocus?: (e: FocusEvent) => void; /** * Editor layout size, 'default' for standard spacing and 'condensed' for reduced font size, padding and margins. * @defaultValue 'default' */ size?: 'default' | 'condensed'; /** * If set to true, `aria-required` will be set to true on the input element. * @defaultValue false */ required?: boolean; /** * Opts in to fully controlled semantics on `value`. When `true`, every user * keystroke is blocked until the consumer updates `value` in response to * `onChange`; the editor always reflects `value` exactly. * * When `false` (the default), `value` seeds and re-syncs the document but * user keystrokes are applied immediately without waiting for `onChange`. * * @remarks * IME composition transactions are always let through so that candidate * characters display correctly during an active IME session. * Autocomplete completions (selecting an item) are applied immediately and * forwarded via `onChange` so the consumer can accept the new value. * * @deprecated Will be removed when controlled behaviour becomes the default. * @defaultValue false */ isControlled?: boolean; } /** * Base props shared by both controlled and uncontrolled `BaseCodeEditor` usages. * @internal **/ export interface BaseCodeEditorBaseProps extends SharedBaseCodeEditorProps { /** * The language configuration. */ configuration?: EditorLanguageConfiguration; /** * If set to true, the code editor allows only one line and the line number will not be displayed. * @defaultValue false */ singleLine?: boolean; /** * If set to true, the code editor will hide the line numbers. * @defaultValue false */ hideLineNumbers?: boolean; /** * Provides the gutter configuration to display a marker next to the fold gutter. */ gutterConfiguration?: GutterConfiguration; /** * Formatter function that receives the current value and returns the formatted value. * When provided, registers a keyboard shortcut for formatting. */ format?: (value: string) => string; } /** * Props for the `BaseCodeEditor` in controlled usage. * @internal */ export type BaseCodeEditorControlledProps = { /** * The contents of the editor. Treated as the initial CodeMirror document and * synchronised with the editor on subsequent prop changes. * @defaultValue '' */ value?: string; defaultValue?: never; }; /** * Props for the `BaseCodeEditor` in uncontrolled usage. * @internal */ export type BaseCodeEditorUncontrolledProps = { value?: never; /** * The initial contents of the editor for uncontrolled usage. Used only when the * editor mounts; subsequent changes to this prop are ignored. */ defaultValue?: string; }; /** * Props used for BaseCodeEditor. * @internal */ export type BaseCodeEditorProps = BaseCodeEditorBaseProps & (BaseCodeEditorControlledProps | BaseCodeEditorUncontrolledProps); /** * public ref type * @internal */ export type BaseCodeEditorRef = { focus: () => void; selectRange: (range: { from: number; to: number; }) => void; readonly element: HTMLDivElement | null; setCursorPosition: (position: number | 'end') => void; editorView?: () => EditorView; format?: () => void; }; /** * Provides a base/core component for other code editors to share a common base. * * @internal */ export declare const BaseCodeEditor: (props: BaseCodeEditorProps & import("react").RefAttributes) => import("react").ReactElement | null;