@harborclient/sdk 1.0.23 → 1.0.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Autocomplete/SuggestionList.js +1 -1
- package/dist/components/Button/index.js +1 -1
- package/dist/components/CodeEditor/config.d.ts +4 -0
- package/dist/components/CodeEditor/config.d.ts.map +1 -1
- package/dist/components/CodeEditor/config.js +3 -2
- package/dist/components/CodeEditor/editorChrome.d.ts +23 -0
- package/dist/components/CodeEditor/editorChrome.d.ts.map +1 -0
- package/dist/components/CodeEditor/editorChrome.js +136 -0
- package/dist/components/CodeEditor/index.d.ts +133 -1
- package/dist/components/CodeEditor/index.d.ts.map +1 -1
- package/dist/components/CodeEditor/index.js +387 -134
- package/dist/components/CodeEditor/renderHighlightedPlaceholder.d.ts +32 -0
- package/dist/components/CodeEditor/renderHighlightedPlaceholder.d.ts.map +1 -0
- package/dist/components/CodeEditor/renderHighlightedPlaceholder.js +105 -0
- package/dist/components/CodeEditor/slashCommandHighlighter.d.ts +17 -0
- package/dist/components/CodeEditor/slashCommandHighlighter.d.ts.map +1 -0
- package/dist/components/CodeEditor/slashCommandHighlighter.js +56 -0
- package/dist/components/CodeEditor/syntaxHighlightedPlaceholder.d.ts +15 -0
- package/dist/components/CodeEditor/syntaxHighlightedPlaceholder.d.ts.map +1 -0
- package/dist/components/CodeEditor/syntaxHighlightedPlaceholder.js +99 -0
- package/dist/components/EmptyState/index.js +1 -1
- package/dist/components/FooterButton/index.js +2 -2
- package/dist/components/Resizable/useResizable.d.ts +5 -4
- package/dist/components/Resizable/useResizable.d.ts.map +1 -1
- package/dist/components/Resizable/useResizable.js +19 -10
- package/dist/components/SegmentedTabs/index.d.ts.map +1 -1
- package/dist/components/SegmentedTabs/index.js +1 -1
- package/dist/components/SegmentedTabs/types.d.ts +3 -1
- package/dist/components/SegmentedTabs/types.d.ts.map +1 -1
- package/dist/components/Table/index.js +1 -1
- package/dist/components/Toolbar/index.d.ts +75 -0
- package/dist/components/Toolbar/index.d.ts.map +1 -0
- package/dist/components/Toolbar/index.js +38 -0
- package/dist/components/VariableInput/index.js +1 -1
- package/dist/components/classes.js +2 -2
- package/dist/components/forms/classes.d.ts +4 -4
- package/dist/components/forms/classes.d.ts.map +1 -1
- package/dist/components/forms/classes.js +4 -4
- package/dist/components/index.d.ts +3 -1
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +1 -0
- package/dist/styles.css +42 -0
- package/dist/ui/codeEditorSettings.d.ts +15 -0
- package/dist/ui/codeEditorSettings.d.ts.map +1 -1
- package/dist/ui/codeEditorSettings.js +40 -0
- package/dist/ui/index.d.ts +1 -1
- package/dist/ui/index.d.ts.map +1 -1
- package/dist/ui/index.js +1 -1
- package/package.json +1 -1
|
@@ -66,7 +66,7 @@ export function SuggestionList({ open, items, activeIndex, anchorRef, listboxId,
|
|
|
66
66
|
if (!open || items.length === 0 || !position) {
|
|
67
67
|
return null;
|
|
68
68
|
}
|
|
69
|
-
return portalToBody(_jsx("ul", { id: listboxId, role: "listbox", className: "hc-suggestion-list fixed z-50 max-h-48 overflow-y-auto rounded-
|
|
69
|
+
return portalToBody(_jsx("ul", { id: listboxId, role: "listbox", className: "hc-suggestion-list fixed z-50 max-h-48 overflow-y-auto rounded-lg border border-separator bg-surface py-1 text-[14px] text-text shadow-md", style: { top: position.top, left: position.left, width: position.width }, children: items.map((item, index) => (_jsx("li", { id: `${listboxId}-option-${index}`, role: "option", "aria-selected": index === activeIndex, className: index === activeIndex
|
|
70
70
|
? 'hc-suggestion-list-option cursor-pointer bg-selection px-2 py-1'
|
|
71
71
|
: 'hc-suggestion-list-option cursor-pointer px-2 py-1 hover:bg-selection', onMouseEnter: () => onActiveIndexChange(index), onMouseDown: (event) => event.preventDefault(), onClick: () => onSelect(item), children: item }, item))) }));
|
|
72
72
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "@harborclient/sdk/jsx-runtime";
|
|
2
|
-
const BUTTON_BASE = 'inline-flex cursor-pointer items-center rounded-
|
|
2
|
+
const BUTTON_BASE = 'inline-flex cursor-pointer items-center rounded-full app-no-drag';
|
|
3
3
|
const VARIANT_CLASSES = {
|
|
4
4
|
primary: `${BUTTON_BASE} min-h-[32px] justify-center border border-transparent bg-accent px-3 py-1 text-[15px] font-medium text-white shadow-sm hover:brightness-110 disabled:cursor-not-allowed disabled:opacity-50`,
|
|
5
5
|
secondary: `${BUTTON_BASE} min-h-[32px] justify-center border border-separator bg-control px-3 py-1 text-[15px] text-text shadow-sm hover:bg-selection disabled:cursor-not-allowed disabled:opacity-50`,
|
|
@@ -13,6 +13,10 @@ export interface CodeEditorConfig {
|
|
|
13
13
|
* CodeMirror basicSetup options for editable editor instances.
|
|
14
14
|
*/
|
|
15
15
|
setup: CodeEditorSetup;
|
|
16
|
+
/**
|
|
17
|
+
* Editor font size applied to CodeMirror content and in-editor tooltips.
|
|
18
|
+
*/
|
|
19
|
+
fontSize: string;
|
|
16
20
|
}
|
|
17
21
|
/**
|
|
18
22
|
* Default CodeEditor configuration when no provider or store snapshot is available.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../../src/components/CodeEditor/config.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../../src/components/CodeEditor/config.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAMvE;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,KAAK,EAAE,eAAe,CAAC;IAEvB;;OAEG;IACH,KAAK,EAAE,eAAe,CAAC;IAEvB;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,eAAO,MAAM,0BAA0B,EAAE,gBAIxC,CAAC;AAQF;;;;GAIG;AACH,wBAAgB,wBAAwB,IAAI,UAAU,CACpD,OAAO,mBAAmB,CAAC,gBAAgB,CAAC,CAC7C,CAMA;AAkBD,UAAU,aAAa;IACrB;;OAEG;IACH,KAAK,EAAE,gBAAgB,CAAC;IAExB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;GAKG;AACH,wBAAgB,wBAAwB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CAWxF;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,IAAI,gBAAgB,CAKtD"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { createContext, createElement, useContext, useEffect, useSyncExternalStore } from '@harborclient/sdk/react';
|
|
2
2
|
import { createExternalStore } from '../../runtime/store.js';
|
|
3
|
-
import { DEFAULT_CODE_EDITOR_SETUP } from '../../ui/codeEditorSettings.js';
|
|
3
|
+
import { DEFAULT_CODE_EDITOR_FONT_SIZE, DEFAULT_CODE_EDITOR_SETUP } from '../../ui/codeEditorSettings.js';
|
|
4
4
|
/**
|
|
5
5
|
* Default CodeEditor configuration when no provider or store snapshot is available.
|
|
6
6
|
*/
|
|
7
7
|
export const DEFAULT_CODE_EDITOR_CONFIG = {
|
|
8
8
|
theme: 'default',
|
|
9
|
-
setup: DEFAULT_CODE_EDITOR_SETUP
|
|
9
|
+
setup: DEFAULT_CODE_EDITOR_SETUP,
|
|
10
|
+
fontSize: DEFAULT_CODE_EDITOR_FONT_SIZE
|
|
10
11
|
};
|
|
11
12
|
const GLOBAL_STORE_KEY = '__hc_codeEditorConfigStore';
|
|
12
13
|
/**
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
|
|
2
|
+
import { EditorView } from '@codemirror/view';
|
|
3
|
+
/**
|
|
4
|
+
* Built-in light syntax colors when no third-party CodeMirror theme is selected.
|
|
5
|
+
*/
|
|
6
|
+
export declare const lightHighlight: HighlightStyle;
|
|
7
|
+
/**
|
|
8
|
+
* Built-in dark syntax colors when no third-party CodeMirror theme is selected.
|
|
9
|
+
*/
|
|
10
|
+
export declare const darkHighlight: HighlightStyle;
|
|
11
|
+
/**
|
|
12
|
+
* Builds CodeMirror chrome styles for the resolved editor font size.
|
|
13
|
+
*
|
|
14
|
+
* @param fontSize - Normalized CSS font size such as `16px`.
|
|
15
|
+
*/
|
|
16
|
+
export declare function createEditorTheme(fontSize: string): ReturnType<typeof EditorView.theme>;
|
|
17
|
+
/**
|
|
18
|
+
* Returns built-in syntax highlighting for the active system color scheme.
|
|
19
|
+
*
|
|
20
|
+
* @param isDark - Whether the host prefers dark mode.
|
|
21
|
+
*/
|
|
22
|
+
export declare function createBuiltInSyntaxHighlighting(isDark: boolean): ReturnType<typeof syntaxHighlighting>;
|
|
23
|
+
//# sourceMappingURL=editorChrome.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"editorChrome.d.ts","sourceRoot":"","sources":["../../../src/components/CodeEditor/editorChrome.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAG9C;;GAEG;AACH,eAAO,MAAM,cAAc,gBAUzB,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,aAAa,gBAUxB,CAAC;AAEH;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,CA2FvF;AAED;;;;GAIG;AACH,wBAAgB,+BAA+B,CAC7C,MAAM,EAAE,OAAO,GACd,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAEvC"}
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
|
|
2
|
+
import { EditorView } from '@codemirror/view';
|
|
3
|
+
import { tags } from '@lezer/highlight';
|
|
4
|
+
/**
|
|
5
|
+
* Built-in light syntax colors when no third-party CodeMirror theme is selected.
|
|
6
|
+
*/
|
|
7
|
+
export const lightHighlight = HighlightStyle.define([
|
|
8
|
+
{ tag: tags.propertyName, color: '#881391' },
|
|
9
|
+
{ tag: tags.string, color: '#c41a16' },
|
|
10
|
+
{ tag: tags.number, color: '#1c00cf' },
|
|
11
|
+
{ tag: tags.bool, color: '#1c00cf' },
|
|
12
|
+
{ tag: tags.null, color: '#1c00cf' },
|
|
13
|
+
{ tag: tags.keyword, color: '#881391' },
|
|
14
|
+
{ tag: tags.bracket, color: 'var(--mac-text)' },
|
|
15
|
+
{ tag: tags.punctuation, color: 'var(--mac-muted)' },
|
|
16
|
+
{ tag: tags.comment, color: 'var(--mac-muted)', fontStyle: 'italic' }
|
|
17
|
+
]);
|
|
18
|
+
/**
|
|
19
|
+
* Built-in dark syntax colors when no third-party CodeMirror theme is selected.
|
|
20
|
+
*/
|
|
21
|
+
export const darkHighlight = HighlightStyle.define([
|
|
22
|
+
{ tag: tags.propertyName, color: '#ff7ab2' },
|
|
23
|
+
{ tag: tags.string, color: '#ff8170' },
|
|
24
|
+
{ tag: tags.number, color: '#78dce8' },
|
|
25
|
+
{ tag: tags.bool, color: '#78dce8' },
|
|
26
|
+
{ tag: tags.null, color: '#78dce8' },
|
|
27
|
+
{ tag: tags.keyword, color: '#ff7ab2' },
|
|
28
|
+
{ tag: tags.bracket, color: 'var(--mac-text)' },
|
|
29
|
+
{ tag: tags.punctuation, color: 'var(--mac-muted)' },
|
|
30
|
+
{ tag: tags.comment, color: 'var(--mac-muted)', fontStyle: 'italic' }
|
|
31
|
+
]);
|
|
32
|
+
/**
|
|
33
|
+
* Builds CodeMirror chrome styles for the resolved editor font size.
|
|
34
|
+
*
|
|
35
|
+
* @param fontSize - Normalized CSS font size such as `16px`.
|
|
36
|
+
*/
|
|
37
|
+
export function createEditorTheme(fontSize) {
|
|
38
|
+
return EditorView.theme({
|
|
39
|
+
'&': {
|
|
40
|
+
backgroundColor: 'transparent',
|
|
41
|
+
color: 'var(--mac-text)'
|
|
42
|
+
},
|
|
43
|
+
'.cm-scroller': {
|
|
44
|
+
overflow: 'auto',
|
|
45
|
+
fontFamily: 'var(--font-mono)'
|
|
46
|
+
},
|
|
47
|
+
'.cm-content': {
|
|
48
|
+
padding: '8px 0',
|
|
49
|
+
fontFamily: 'var(--font-mono)',
|
|
50
|
+
fontSize,
|
|
51
|
+
caretColor: 'var(--mac-accent)'
|
|
52
|
+
},
|
|
53
|
+
'.cm-line': {
|
|
54
|
+
padding: '0 8px'
|
|
55
|
+
},
|
|
56
|
+
'&.cm-focused': {
|
|
57
|
+
outline: 'none'
|
|
58
|
+
},
|
|
59
|
+
'&.cm-focused .cm-cursor': {
|
|
60
|
+
borderLeftColor: 'var(--mac-accent)'
|
|
61
|
+
},
|
|
62
|
+
'.cm-selectionBackground, &.cm-focused .cm-selectionBackground, ::selection': {
|
|
63
|
+
backgroundColor: 'var(--mac-selection) !important'
|
|
64
|
+
},
|
|
65
|
+
'.cm-gutters': {
|
|
66
|
+
backgroundColor: 'transparent',
|
|
67
|
+
color: 'var(--mac-muted)',
|
|
68
|
+
border: 'none'
|
|
69
|
+
},
|
|
70
|
+
'.cm-activeLineGutter': {
|
|
71
|
+
backgroundColor: 'var(--mac-selection)'
|
|
72
|
+
},
|
|
73
|
+
'.cm-activeLine': {
|
|
74
|
+
backgroundColor: 'color-mix(in srgb, var(--mac-selection) 45%, transparent)'
|
|
75
|
+
},
|
|
76
|
+
'.cm-variable-token': {
|
|
77
|
+
color: '#32D2E2'
|
|
78
|
+
},
|
|
79
|
+
'.cm-slash-command': {
|
|
80
|
+
color: 'var(--mac-accent)'
|
|
81
|
+
},
|
|
82
|
+
'.cm-slash-command-args': {
|
|
83
|
+
color: 'var(--mac-muted)',
|
|
84
|
+
fontStyle: 'italic'
|
|
85
|
+
},
|
|
86
|
+
'.cm-tooltip.cm-tooltip-hover': {
|
|
87
|
+
border: '1px solid var(--mac-separator)',
|
|
88
|
+
backgroundColor: 'var(--mac-surface)',
|
|
89
|
+
borderRadius: '6px',
|
|
90
|
+
boxShadow: '0 4px 12px rgba(0,0,0,0.15)'
|
|
91
|
+
},
|
|
92
|
+
'.cm-variable-tooltip': {
|
|
93
|
+
display: 'flex',
|
|
94
|
+
flexDirection: 'column',
|
|
95
|
+
gap: '6px',
|
|
96
|
+
padding: '8px 12px',
|
|
97
|
+
fontSize,
|
|
98
|
+
color: 'var(--mac-text)'
|
|
99
|
+
},
|
|
100
|
+
'.cm-variable-tooltip-muted': {
|
|
101
|
+
color: 'var(--mac-muted)'
|
|
102
|
+
},
|
|
103
|
+
'.cm-variable-tooltip-edit': {
|
|
104
|
+
alignSelf: 'flex-start',
|
|
105
|
+
background: 'none',
|
|
106
|
+
border: 'none',
|
|
107
|
+
padding: '0',
|
|
108
|
+
cursor: 'pointer',
|
|
109
|
+
fontSize,
|
|
110
|
+
color: 'var(--mac-accent)'
|
|
111
|
+
},
|
|
112
|
+
'.cm-tooltip.cm-tooltip-autocomplete': {
|
|
113
|
+
border: '1px solid var(--mac-separator)',
|
|
114
|
+
backgroundColor: 'var(--mac-surface)',
|
|
115
|
+
borderRadius: '6px',
|
|
116
|
+
boxShadow: '0 4px 12px rgba(0,0,0,0.15)',
|
|
117
|
+
fontSize
|
|
118
|
+
},
|
|
119
|
+
'.cm-completionLabel': {
|
|
120
|
+
fontFamily: 'var(--font-mono)'
|
|
121
|
+
},
|
|
122
|
+
'.cm-completionDetail': {
|
|
123
|
+
color: 'var(--mac-muted)',
|
|
124
|
+
fontStyle: 'normal',
|
|
125
|
+
marginLeft: '8px'
|
|
126
|
+
}
|
|
127
|
+
});
|
|
128
|
+
}
|
|
129
|
+
/**
|
|
130
|
+
* Returns built-in syntax highlighting for the active system color scheme.
|
|
131
|
+
*
|
|
132
|
+
* @param isDark - Whether the host prefers dark mode.
|
|
133
|
+
*/
|
|
134
|
+
export function createBuiltInSyntaxHighlighting(isDark) {
|
|
135
|
+
return syntaxHighlighting(isDark ? darkHighlight : lightHighlight);
|
|
136
|
+
}
|
|
@@ -3,6 +3,95 @@ import type { JSX } from 'react';
|
|
|
3
3
|
import type { CodeEditorSetup, CodeEditorTheme, Variable } from '../../types.js';
|
|
4
4
|
export { CODE_EDITOR_THEME_OPTIONS } from './themes.js';
|
|
5
5
|
export type CodeEditorLanguage = 'json' | 'text' | 'javascript' | 'shell';
|
|
6
|
+
/**
|
|
7
|
+
* One slash command offered at the start of a line in the editor.
|
|
8
|
+
*/
|
|
9
|
+
export interface CodeEditorSlashCommand {
|
|
10
|
+
/**
|
|
11
|
+
* Command name without the leading slash (for example `ask`).
|
|
12
|
+
*/
|
|
13
|
+
name: string;
|
|
14
|
+
/**
|
|
15
|
+
* Short description shown in autocomplete.
|
|
16
|
+
*/
|
|
17
|
+
description?: string;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Screen coordinates for anchoring host UI near a slash command.
|
|
21
|
+
*/
|
|
22
|
+
export interface CodeEditorSlashCoords {
|
|
23
|
+
/**
|
|
24
|
+
* Top edge in viewport pixels.
|
|
25
|
+
*/
|
|
26
|
+
top: number;
|
|
27
|
+
/**
|
|
28
|
+
* Left edge in viewport pixels.
|
|
29
|
+
*/
|
|
30
|
+
left: number;
|
|
31
|
+
/**
|
|
32
|
+
* Bottom edge in viewport pixels.
|
|
33
|
+
*/
|
|
34
|
+
bottom: number;
|
|
35
|
+
/**
|
|
36
|
+
* Right edge in viewport pixels.
|
|
37
|
+
*/
|
|
38
|
+
right: number;
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* Parsed slash command at the caret line, passed to {@link Props.onSlashCommand}.
|
|
42
|
+
*/
|
|
43
|
+
export interface CodeEditorSlashTrigger {
|
|
44
|
+
/**
|
|
45
|
+
* Matched command name without the leading slash.
|
|
46
|
+
*/
|
|
47
|
+
command: string;
|
|
48
|
+
/**
|
|
49
|
+
* Optional arguments typed after the command on the same line.
|
|
50
|
+
*/
|
|
51
|
+
args: string;
|
|
52
|
+
/**
|
|
53
|
+
* 1-based line number where the command appears.
|
|
54
|
+
*/
|
|
55
|
+
line: number;
|
|
56
|
+
/**
|
|
57
|
+
* Document offset of the leading slash character.
|
|
58
|
+
*/
|
|
59
|
+
from: number;
|
|
60
|
+
/**
|
|
61
|
+
* Document offset after the matched command span (exclusive).
|
|
62
|
+
*/
|
|
63
|
+
to: number;
|
|
64
|
+
/**
|
|
65
|
+
* Viewport coordinates near the command for positioning host UI.
|
|
66
|
+
*/
|
|
67
|
+
coords: CodeEditorSlashCoords;
|
|
68
|
+
}
|
|
69
|
+
/**
|
|
70
|
+
* Document offsets for a CodeMirror selection range.
|
|
71
|
+
*/
|
|
72
|
+
export interface CodeEditorSelectionRange {
|
|
73
|
+
/**
|
|
74
|
+
* Anchor offset in the document.
|
|
75
|
+
*/
|
|
76
|
+
anchor: number;
|
|
77
|
+
/**
|
|
78
|
+
* Head (active caret) offset in the document.
|
|
79
|
+
*/
|
|
80
|
+
head: number;
|
|
81
|
+
}
|
|
82
|
+
/**
|
|
83
|
+
* Scroll and selection snapshot reported by {@link Props.onViewStateChange}.
|
|
84
|
+
*/
|
|
85
|
+
export interface CodeEditorViewState {
|
|
86
|
+
/**
|
|
87
|
+
* Vertical scroll offset of the CodeMirror scroller in pixels.
|
|
88
|
+
*/
|
|
89
|
+
scrollTop: number;
|
|
90
|
+
/**
|
|
91
|
+
* Current selection range in document offsets.
|
|
92
|
+
*/
|
|
93
|
+
selection: CodeEditorSelectionRange;
|
|
94
|
+
}
|
|
6
95
|
export interface Props {
|
|
7
96
|
/**
|
|
8
97
|
* Editor content.
|
|
@@ -22,14 +111,45 @@ export interface Props {
|
|
|
22
111
|
* When true, the editor cannot be edited.
|
|
23
112
|
*/
|
|
24
113
|
readOnly?: boolean;
|
|
114
|
+
/**
|
|
115
|
+
* When false, blocks user input while keeping normal editor chrome (gutters, border).
|
|
116
|
+
* Defaults to the inverse of {@link readOnly}. Use for temporary locks during async work.
|
|
117
|
+
*/
|
|
118
|
+
editable?: boolean;
|
|
25
119
|
/**
|
|
26
120
|
* Placeholder shown when the editor is empty.
|
|
27
121
|
*/
|
|
28
122
|
placeholder?: string;
|
|
123
|
+
/**
|
|
124
|
+
* When true, renders the placeholder as muted syntax-highlighted ghost content (JavaScript only).
|
|
125
|
+
*/
|
|
126
|
+
placeholderHighlight?: boolean;
|
|
29
127
|
/**
|
|
30
128
|
* Minimum editor height in CSS units.
|
|
31
129
|
*/
|
|
32
130
|
minHeight?: string;
|
|
131
|
+
/**
|
|
132
|
+
* Explicit editor height in CSS units. When set, restores a user-resized height.
|
|
133
|
+
*/
|
|
134
|
+
height?: string;
|
|
135
|
+
/**
|
|
136
|
+
* Called when the wrapper height changes (for example after native resize-y drag).
|
|
137
|
+
*
|
|
138
|
+
* @param heightPx - Observed wrapper height rounded to the nearest pixel.
|
|
139
|
+
*/
|
|
140
|
+
onHeightChange?: (heightPx: number) => void;
|
|
141
|
+
/**
|
|
142
|
+
* Restores vertical scroll when the editor is created.
|
|
143
|
+
*/
|
|
144
|
+
initialScrollTop?: number;
|
|
145
|
+
/**
|
|
146
|
+
* Restores caret/selection when the editor is created.
|
|
147
|
+
*/
|
|
148
|
+
initialSelection?: CodeEditorSelectionRange;
|
|
149
|
+
/**
|
|
150
|
+
* Called when scroll or selection changes, debounced, and once on unmount.
|
|
151
|
+
*/
|
|
152
|
+
onViewStateChange?: (state: CodeEditorViewState) => void;
|
|
33
153
|
/**
|
|
34
154
|
* Additional wrapper classes.
|
|
35
155
|
*/
|
|
@@ -46,6 +166,14 @@ export interface Props {
|
|
|
46
166
|
* When set on a JavaScript editor, enables custom autocomplete (e.g. hc API completions).
|
|
47
167
|
*/
|
|
48
168
|
completionSource?: CompletionSource;
|
|
169
|
+
/**
|
|
170
|
+
* Slash commands recognized at the start of a line (for example `/ask`).
|
|
171
|
+
*/
|
|
172
|
+
slashCommands?: CodeEditorSlashCommand[];
|
|
173
|
+
/**
|
|
174
|
+
* Called when the user presses Enter on a complete slash command line.
|
|
175
|
+
*/
|
|
176
|
+
onSlashCommand?: (trigger: CodeEditorSlashTrigger) => void;
|
|
49
177
|
/**
|
|
50
178
|
* When set, overrides the persisted CodeMirror theme (used by the settings preview).
|
|
51
179
|
*/
|
|
@@ -54,6 +182,10 @@ export interface Props {
|
|
|
54
182
|
* When set, overrides persisted basicSetup options (used by the settings preview).
|
|
55
183
|
*/
|
|
56
184
|
setupOverride?: CodeEditorSetup;
|
|
185
|
+
/**
|
|
186
|
+
* When set, overrides the persisted editor font size (used by the settings preview).
|
|
187
|
+
*/
|
|
188
|
+
fontSize?: string;
|
|
57
189
|
/**
|
|
58
190
|
* DOM id applied to the editable region for label association.
|
|
59
191
|
*/
|
|
@@ -81,5 +213,5 @@ export interface Props {
|
|
|
81
213
|
* Styling relies on host CSS variables (`--mac-*`, `--font-mono`) and the `.app-no-drag`
|
|
82
214
|
* class defined in HarborClient `styles.css`.
|
|
83
215
|
*/
|
|
84
|
-
export declare function CodeEditor({ value, onChange, language, readOnly, placeholder, minHeight, className, variables, onEditVariable, completionSource, themeOverride, setupOverride, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy }: Props): JSX.Element;
|
|
216
|
+
export declare function CodeEditor({ value, onChange, language, readOnly, editable, placeholder, placeholderHighlight, minHeight, height, onHeightChange, initialScrollTop, initialSelection, onViewStateChange, className, variables, onEditVariable, completionSource, slashCommands, onSlashCommand, themeOverride, setupOverride, fontSize, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy }: Props): JSX.Element;
|
|
85
217
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CodeEditor/index.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CodeEditor/index.tsx"],"names":[],"mappings":"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"}
|