@acorex/components 21.0.0-next.5 → 21.0.0-next.7
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/code-editor/README.md +291 -1
- package/code-editor/index.d.ts +260 -12
- package/fesm2022/acorex-components-accordion.mjs +15 -15
- package/fesm2022/acorex-components-accordion.mjs.map +1 -1
- package/fesm2022/acorex-components-action-sheet.mjs +12 -12
- package/fesm2022/acorex-components-action-sheet.mjs.map +1 -1
- package/fesm2022/acorex-components-alert.mjs +10 -10
- package/fesm2022/acorex-components-alert.mjs.map +1 -1
- package/fesm2022/acorex-components-aspect-ratio.mjs +4 -4
- package/fesm2022/acorex-components-aspect-ratio.mjs.map +1 -1
- package/fesm2022/acorex-components-audio-wave.mjs +8 -8
- package/fesm2022/acorex-components-audio-wave.mjs.map +1 -1
- package/fesm2022/acorex-components-autocomplete.mjs +8 -8
- package/fesm2022/acorex-components-autocomplete.mjs.map +1 -1
- package/fesm2022/acorex-components-avatar.mjs +12 -12
- package/fesm2022/acorex-components-avatar.mjs.map +1 -1
- package/fesm2022/acorex-components-badge.mjs +9 -9
- package/fesm2022/acorex-components-badge.mjs.map +1 -1
- package/fesm2022/acorex-components-bottom-navigation.mjs +11 -11
- package/fesm2022/acorex-components-bottom-navigation.mjs.map +1 -1
- package/fesm2022/acorex-components-breadcrumbs.mjs +11 -11
- package/fesm2022/acorex-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/acorex-components-button-group.mjs +13 -13
- package/fesm2022/acorex-components-button-group.mjs.map +1 -1
- package/fesm2022/acorex-components-button.mjs +19 -19
- package/fesm2022/acorex-components-button.mjs.map +1 -1
- package/fesm2022/acorex-components-calendar.mjs +18 -18
- package/fesm2022/acorex-components-calendar.mjs.map +1 -1
- package/fesm2022/acorex-components-check-box.mjs +8 -8
- package/fesm2022/acorex-components-check-box.mjs.map +1 -1
- package/fesm2022/acorex-components-chips.mjs +9 -9
- package/fesm2022/acorex-components-chips.mjs.map +1 -1
- package/fesm2022/acorex-components-circular-progress.mjs +9 -9
- package/fesm2022/acorex-components-circular-progress.mjs.map +1 -1
- package/fesm2022/acorex-components-code-editor.mjs +494 -162
- package/fesm2022/acorex-components-code-editor.mjs.map +1 -1
- package/fesm2022/acorex-components-collapse.mjs +11 -26
- package/fesm2022/acorex-components-collapse.mjs.map +1 -1
- package/fesm2022/acorex-components-color-box.mjs +9 -9
- package/fesm2022/acorex-components-color-box.mjs.map +1 -1
- package/fesm2022/acorex-components-color-palette.mjs +29 -29
- package/fesm2022/acorex-components-color-palette.mjs.map +1 -1
- package/fesm2022/acorex-components-command.mjs +10 -10
- package/fesm2022/acorex-components-command.mjs.map +1 -1
- package/fesm2022/acorex-components-comment.mjs +30 -30
- package/fesm2022/acorex-components-comment.mjs.map +1 -1
- package/fesm2022/acorex-components-conversation.mjs +54 -63
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/fesm2022/acorex-components-cron-job.mjs +53 -53
- package/fesm2022/acorex-components-cron-job.mjs.map +1 -1
- package/fesm2022/acorex-components-data-list.mjs +5 -5
- package/fesm2022/acorex-components-data-list.mjs.map +1 -1
- package/fesm2022/acorex-components-data-pager.mjs +49 -37
- package/fesm2022/acorex-components-data-pager.mjs.map +1 -1
- package/fesm2022/acorex-components-data-table.mjs +45 -43
- package/fesm2022/acorex-components-data-table.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-box.mjs +8 -8
- package/fesm2022/acorex-components-datetime-box.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-input.mjs +8 -8
- package/fesm2022/acorex-components-datetime-input.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-picker.mjs +9 -9
- package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-decorators.mjs +84 -42
- package/fesm2022/acorex-components-decorators.mjs.map +1 -1
- package/fesm2022/acorex-components-dialog.mjs +11 -11
- package/fesm2022/acorex-components-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-drawer-2.mjs +11 -11
- package/fesm2022/acorex-components-drawer-2.mjs.map +1 -1
- package/fesm2022/acorex-components-drawer.mjs +14 -14
- package/fesm2022/acorex-components-drawer.mjs.map +1 -1
- package/fesm2022/acorex-components-dropdown-button.mjs +9 -9
- package/fesm2022/acorex-components-dropdown-button.mjs.map +1 -1
- package/fesm2022/acorex-components-dropdown.mjs +15 -15
- package/fesm2022/acorex-components-dropdown.mjs.map +1 -1
- package/fesm2022/acorex-components-file-explorer.mjs +28 -28
- package/fesm2022/acorex-components-file-explorer.mjs.map +1 -1
- package/fesm2022/acorex-components-flow-chart.mjs +18 -18
- package/fesm2022/acorex-components-flow-chart.mjs.map +1 -1
- package/fesm2022/acorex-components-form.mjs +22 -28
- package/fesm2022/acorex-components-form.mjs.map +1 -1
- package/fesm2022/acorex-components-grid-layout-builder.mjs +14 -15
- package/fesm2022/acorex-components-grid-layout-builder.mjs.map +1 -1
- package/fesm2022/acorex-components-image-editor.mjs +38 -38
- package/fesm2022/acorex-components-image-editor.mjs.map +1 -1
- package/fesm2022/acorex-components-image.mjs +8 -8
- package/fesm2022/acorex-components-image.mjs.map +1 -1
- package/fesm2022/acorex-components-json-viewer.mjs +9 -9
- package/fesm2022/acorex-components-json-viewer.mjs.map +1 -1
- package/fesm2022/acorex-components-kanban.mjs +5 -5
- package/fesm2022/acorex-components-kanban.mjs.map +1 -1
- package/fesm2022/acorex-components-kbd.mjs +8 -8
- package/fesm2022/acorex-components-kbd.mjs.map +1 -1
- package/fesm2022/acorex-components-label.mjs +7 -7
- package/fesm2022/acorex-components-label.mjs.map +1 -1
- package/fesm2022/acorex-components-list.mjs +8 -8
- package/fesm2022/acorex-components-list.mjs.map +1 -1
- package/fesm2022/acorex-components-loading-dialog.mjs +11 -11
- package/fesm2022/acorex-components-loading-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-loading.mjs +18 -18
- package/fesm2022/acorex-components-loading.mjs.map +1 -1
- package/fesm2022/acorex-components-map.mjs +14 -14
- package/fesm2022/acorex-components-map.mjs.map +1 -1
- package/fesm2022/acorex-components-media-viewer.mjs +61 -87
- package/fesm2022/acorex-components-media-viewer.mjs.map +1 -1
- package/fesm2022/acorex-components-menu.mjs +19 -19
- package/fesm2022/acorex-components-menu.mjs.map +1 -1
- package/fesm2022/{acorex-components-modal-acorex-components-modal-h5Y-qcbh.mjs → acorex-components-modal-acorex-components-modal-ClSGRCam.mjs} +23 -23
- package/fesm2022/acorex-components-modal-acorex-components-modal-ClSGRCam.mjs.map +1 -0
- package/fesm2022/{acorex-components-modal-modal-content.component-B6tyMLdU.mjs → acorex-components-modal-modal-content.component-BC-z7O0z.mjs} +7 -30
- package/fesm2022/acorex-components-modal-modal-content.component-BC-z7O0z.mjs.map +1 -0
- package/fesm2022/acorex-components-modal.mjs +1 -1
- package/fesm2022/acorex-components-navbar.mjs +8 -8
- package/fesm2022/acorex-components-navbar.mjs.map +1 -1
- package/fesm2022/acorex-components-notification.mjs +14 -14
- package/fesm2022/acorex-components-notification.mjs.map +1 -1
- package/fesm2022/acorex-components-number-box-2.mjs +4 -4
- package/fesm2022/acorex-components-number-box-2.mjs.map +1 -1
- package/fesm2022/acorex-components-number-box.mjs +12 -30
- package/fesm2022/acorex-components-number-box.mjs.map +1 -1
- package/fesm2022/acorex-components-otp.mjs +10 -10
- package/fesm2022/acorex-components-otp.mjs.map +1 -1
- package/fesm2022/acorex-components-page.mjs +10 -10
- package/fesm2022/acorex-components-page.mjs.map +1 -1
- package/fesm2022/acorex-components-paint.mjs +27 -27
- package/fesm2022/acorex-components-paint.mjs.map +1 -1
- package/fesm2022/acorex-components-password-box.mjs +11 -11
- package/fesm2022/acorex-components-password-box.mjs.map +1 -1
- package/fesm2022/acorex-components-pdf-reader.mjs +8 -8
- package/fesm2022/acorex-components-pdf-reader.mjs.map +1 -1
- package/fesm2022/acorex-components-phone-box.mjs +8 -8
- package/fesm2022/acorex-components-phone-box.mjs.map +1 -1
- package/fesm2022/acorex-components-picker.mjs +17 -17
- package/fesm2022/acorex-components-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-popover.mjs +12 -12
- package/fesm2022/acorex-components-popover.mjs.map +1 -1
- package/fesm2022/acorex-components-popup.mjs +13 -13
- package/fesm2022/acorex-components-popup.mjs.map +1 -1
- package/fesm2022/acorex-components-progress-bar.mjs +8 -8
- package/fesm2022/acorex-components-progress-bar.mjs.map +1 -1
- package/fesm2022/acorex-components-qrcode.mjs +8 -8
- package/fesm2022/acorex-components-qrcode.mjs.map +1 -1
- package/fesm2022/acorex-components-query-builder.mjs +8 -8
- package/fesm2022/acorex-components-query-builder.mjs.map +1 -1
- package/fesm2022/acorex-components-radio.mjs +7 -7
- package/fesm2022/acorex-components-radio.mjs.map +1 -1
- package/fesm2022/acorex-components-rail-navigation.mjs +16 -16
- package/fesm2022/acorex-components-rail-navigation.mjs.map +1 -1
- package/fesm2022/acorex-components-range-slider.mjs +8 -8
- package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-rate-picker.mjs +10 -10
- package/fesm2022/acorex-components-rate-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-rest-api-generator.mjs +23 -23
- package/fesm2022/acorex-components-rest-api-generator.mjs.map +1 -1
- package/fesm2022/acorex-components-result.mjs +7 -7
- package/fesm2022/acorex-components-result.mjs.map +1 -1
- package/fesm2022/acorex-components-routing-progress.mjs +7 -7
- package/fesm2022/acorex-components-routing-progress.mjs.map +1 -1
- package/fesm2022/acorex-components-rrule.mjs +11 -11
- package/fesm2022/acorex-components-rrule.mjs.map +1 -1
- package/fesm2022/acorex-components-scheduler.mjs +43 -43
- package/fesm2022/acorex-components-scheduler.mjs.map +1 -1
- package/fesm2022/acorex-components-scss.mjs +4 -4
- package/fesm2022/acorex-components-scss.mjs.map +1 -1
- package/fesm2022/acorex-components-search-box.mjs +8 -8
- package/fesm2022/acorex-components-search-box.mjs.map +1 -1
- package/fesm2022/acorex-components-select-box.mjs +20 -13
- package/fesm2022/acorex-components-select-box.mjs.map +1 -1
- package/fesm2022/acorex-components-selection-list-2.mjs +10 -10
- package/fesm2022/acorex-components-selection-list-2.mjs.map +1 -1
- package/fesm2022/acorex-components-selection-list.mjs +10 -10
- package/fesm2022/acorex-components-selection-list.mjs.map +1 -1
- package/fesm2022/acorex-components-side-menu.mjs +31 -38
- package/fesm2022/acorex-components-side-menu.mjs.map +1 -1
- package/fesm2022/acorex-components-skeleton.mjs +8 -8
- package/fesm2022/acorex-components-skeleton.mjs.map +1 -1
- package/fesm2022/acorex-components-slider.mjs +10 -10
- package/fesm2022/acorex-components-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-sliding-item.mjs +16 -16
- package/fesm2022/acorex-components-sliding-item.mjs.map +1 -1
- package/fesm2022/acorex-components-step-wizard.mjs +16 -16
- package/fesm2022/acorex-components-step-wizard.mjs.map +1 -1
- package/fesm2022/acorex-components-switch.mjs +12 -12
- package/fesm2022/acorex-components-switch.mjs.map +1 -1
- package/fesm2022/acorex-components-tabs.mjs +16 -16
- package/fesm2022/acorex-components-tabs.mjs.map +1 -1
- package/fesm2022/acorex-components-tag-box.mjs +8 -8
- package/fesm2022/acorex-components-tag-box.mjs.map +1 -1
- package/fesm2022/acorex-components-tag.mjs +8 -8
- package/fesm2022/acorex-components-tag.mjs.map +1 -1
- package/fesm2022/acorex-components-text-area.mjs +7 -7
- package/fesm2022/acorex-components-text-area.mjs.map +1 -1
- package/fesm2022/acorex-components-text-box.mjs +11 -11
- package/fesm2022/acorex-components-text-box.mjs.map +1 -1
- package/fesm2022/acorex-components-time-duration.mjs +54 -14
- package/fesm2022/acorex-components-time-duration.mjs.map +1 -1
- package/fesm2022/acorex-components-time-line.mjs +13 -28
- package/fesm2022/acorex-components-time-line.mjs.map +1 -1
- package/fesm2022/acorex-components-toast.mjs +14 -14
- package/fesm2022/acorex-components-toast.mjs.map +1 -1
- package/fesm2022/acorex-components-toolbar.mjs +8 -8
- package/fesm2022/acorex-components-toolbar.mjs.map +1 -1
- package/fesm2022/acorex-components-tooltip.mjs +12 -12
- package/fesm2022/acorex-components-tooltip.mjs.map +1 -1
- package/fesm2022/acorex-components-tree-view.mjs +16 -45
- package/fesm2022/acorex-components-tree-view.mjs.map +1 -1
- package/fesm2022/acorex-components-uploader.mjs +24 -39
- package/fesm2022/acorex-components-uploader.mjs.map +1 -1
- package/fesm2022/acorex-components-video-player.mjs +8 -8
- package/fesm2022/acorex-components-video-player.mjs.map +1 -1
- package/fesm2022/acorex-components-wysiwyg.mjs +207 -458
- package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
- package/grid-layout-builder/index.d.ts +1 -2
- package/media-viewer/index.d.ts +1 -0
- package/package.json +13 -11
- package/phone-box/index.d.ts +4 -4
- package/select-box/index.d.ts +1 -0
- package/side-menu/index.d.ts +3 -2
- package/time-duration/index.d.ts +19 -3
- package/wysiwyg/index.d.ts +56 -159
- package/fesm2022/acorex-components-modal-acorex-components-modal-h5Y-qcbh.mjs.map +0 -1
- package/fesm2022/acorex-components-modal-modal-content.component-B6tyMLdU.mjs.map +0 -1
package/code-editor/README.md
CHANGED
|
@@ -1,3 +1,293 @@
|
|
|
1
1
|
# @acorex/components/code-editor
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
A modular, plugin-based code editor component built on CodeMirror 6.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- 🔌 **Plugin Architecture** - Fully modular with external plugin support
|
|
8
|
+
- 🎨 **Themeable** - Custom theme plugins or platform-aware themes
|
|
9
|
+
- 🌍 **Multi-Language** - Support for any language via plugins
|
|
10
|
+
- ✨ **Formatting** - Pluggable formatters (Prettier included)
|
|
11
|
+
- 📝 **Rich API** - Comprehensive component API with signals
|
|
12
|
+
- ♿ **Accessible** - ARIA support and keyboard navigation
|
|
13
|
+
|
|
14
|
+
## Installation
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
npm install @acorex/components
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## Basic Usage
|
|
21
|
+
|
|
22
|
+
### With Default Plugins
|
|
23
|
+
|
|
24
|
+
```typescript
|
|
25
|
+
import { Component } from '@angular/core';
|
|
26
|
+
import { AXCodeEditorComponent, provideDefaultCodeEditorConfig } from '@acorex/components/code-editor';
|
|
27
|
+
import { bootstrapApplication } from '@angular/platform-browser';
|
|
28
|
+
|
|
29
|
+
@Component({
|
|
30
|
+
selector: 'app-root',
|
|
31
|
+
imports: [AXCodeEditorComponent],
|
|
32
|
+
template: `
|
|
33
|
+
<ax-code-editor
|
|
34
|
+
[(value)]="code"
|
|
35
|
+
language="typescript"
|
|
36
|
+
[lineNumbers]="true"
|
|
37
|
+
[formatOnSave]="true"
|
|
38
|
+
/>
|
|
39
|
+
`
|
|
40
|
+
})
|
|
41
|
+
export class AppComponent {
|
|
42
|
+
code = 'const hello = "world";';
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
// Provide default plugins in your app config
|
|
46
|
+
bootstrapApplication(AppComponent, {
|
|
47
|
+
providers: [provideDefaultCodeEditorConfig()]
|
|
48
|
+
});
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
### Without Default Plugins (Custom Configuration)
|
|
52
|
+
|
|
53
|
+
```typescript
|
|
54
|
+
import {
|
|
55
|
+
provideCodeEditorPlugins,
|
|
56
|
+
JavaScriptLanguagePlugin,
|
|
57
|
+
TypeScriptLanguagePlugin,
|
|
58
|
+
OneDarkThemePlugin,
|
|
59
|
+
LightThemePlugin,
|
|
60
|
+
PrettierFormatterPlugin
|
|
61
|
+
} from '@acorex/components/code-editor';
|
|
62
|
+
|
|
63
|
+
bootstrapApplication(AppComponent, {
|
|
64
|
+
providers: [
|
|
65
|
+
provideCodeEditorPlugins({
|
|
66
|
+
languages: [
|
|
67
|
+
new JavaScriptLanguagePlugin(),
|
|
68
|
+
new TypeScriptLanguagePlugin(),
|
|
69
|
+
],
|
|
70
|
+
themes: [
|
|
71
|
+
new OneDarkThemePlugin(),
|
|
72
|
+
new LightThemePlugin(),
|
|
73
|
+
],
|
|
74
|
+
formatters: [
|
|
75
|
+
new PrettierFormatterPlugin(),
|
|
76
|
+
],
|
|
77
|
+
extensions: []
|
|
78
|
+
})
|
|
79
|
+
]
|
|
80
|
+
});
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
## Plugin System
|
|
84
|
+
|
|
85
|
+
### Built-in Language Plugins
|
|
86
|
+
|
|
87
|
+
- `JavaScriptLanguagePlugin` - JavaScript (js, javascript)
|
|
88
|
+
- `TypeScriptLanguagePlugin` - TypeScript (ts, typescript)
|
|
89
|
+
- `JSONLanguagePlugin` - JSON
|
|
90
|
+
- `HTMLLanguagePlugin` - HTML
|
|
91
|
+
- `CSSLanguagePlugin` - CSS
|
|
92
|
+
- `SassLanguagePlugin` - Sass/SCSS
|
|
93
|
+
- `SQLLanguagePlugin` - SQL
|
|
94
|
+
- `XMLLanguagePlugin` - XML
|
|
95
|
+
- `MarkdownLanguagePlugin` - Markdown
|
|
96
|
+
|
|
97
|
+
### Built-in Theme Plugins
|
|
98
|
+
|
|
99
|
+
- `OneDarkThemePlugin` - Dark theme
|
|
100
|
+
- `LightThemePlugin` - Light theme
|
|
101
|
+
|
|
102
|
+
### Built-in Formatter Plugins
|
|
103
|
+
|
|
104
|
+
- `PrettierFormatterPlugin` - Prettier formatter (JS, TS, JSON, HTML, CSS, Markdown)
|
|
105
|
+
|
|
106
|
+
### Creating Custom Plugins
|
|
107
|
+
|
|
108
|
+
#### Custom Language Plugin
|
|
109
|
+
|
|
110
|
+
```typescript
|
|
111
|
+
import { AXCodeEditorLanguagePlugin } from '@acorex/components/code-editor';
|
|
112
|
+
import type { Extension } from '@codemirror/state';
|
|
113
|
+
|
|
114
|
+
export class PythonLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
115
|
+
readonly id = 'python';
|
|
116
|
+
readonly name = 'Python';
|
|
117
|
+
readonly version = '1.0.0';
|
|
118
|
+
readonly languages = ['python', 'py'];
|
|
119
|
+
|
|
120
|
+
async getExtension(): Promise<Extension> {
|
|
121
|
+
const { python } = await import('@codemirror/lang-python');
|
|
122
|
+
return python();
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
#### Custom Theme Plugin
|
|
128
|
+
|
|
129
|
+
```typescript
|
|
130
|
+
import { AXCodeEditorThemePlugin } from '@acorex/components/code-editor';
|
|
131
|
+
import type { Extension } from '@codemirror/state';
|
|
132
|
+
|
|
133
|
+
export class CustomThemePlugin implements AXCodeEditorThemePlugin {
|
|
134
|
+
readonly id = 'custom-theme';
|
|
135
|
+
readonly name = 'Custom Theme';
|
|
136
|
+
readonly version = '1.0.0';
|
|
137
|
+
readonly dark = false;
|
|
138
|
+
|
|
139
|
+
async getExtension(): Promise<Extension> {
|
|
140
|
+
const { EditorView } = await import('@codemirror/view');
|
|
141
|
+
return EditorView.theme({
|
|
142
|
+
'&': {
|
|
143
|
+
backgroundColor: '#f5f5f5',
|
|
144
|
+
color: '#333'
|
|
145
|
+
},
|
|
146
|
+
'.cm-gutters': {
|
|
147
|
+
backgroundColor: '#e0e0e0'
|
|
148
|
+
}
|
|
149
|
+
}, { dark: false });
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
```
|
|
153
|
+
|
|
154
|
+
#### Custom Formatter Plugin
|
|
155
|
+
|
|
156
|
+
```typescript
|
|
157
|
+
import { AXCodeEditorFormatterPlugin } from '@acorex/components/code-editor';
|
|
158
|
+
|
|
159
|
+
export class CustomFormatterPlugin implements AXCodeEditorFormatterPlugin {
|
|
160
|
+
readonly id = 'custom-formatter';
|
|
161
|
+
readonly name = 'Custom Formatter';
|
|
162
|
+
readonly version = '1.0.0';
|
|
163
|
+
readonly languages = ['custom'];
|
|
164
|
+
|
|
165
|
+
async format(text: string, language: string): Promise<string | null> {
|
|
166
|
+
// Your formatting logic
|
|
167
|
+
return text.trim();
|
|
168
|
+
}
|
|
169
|
+
}
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
### Runtime Plugin Registration
|
|
173
|
+
|
|
174
|
+
```typescript
|
|
175
|
+
import { inject } from '@angular/core';
|
|
176
|
+
import { AXCodeEditorPluginRegistry } from '@acorex/components/code-editor';
|
|
177
|
+
|
|
178
|
+
export class MyComponent {
|
|
179
|
+
private registry = inject(AXCodeEditorPluginRegistry);
|
|
180
|
+
|
|
181
|
+
ngOnInit() {
|
|
182
|
+
// Register plugins at runtime
|
|
183
|
+
this.registry.registerLanguagePlugin(new PythonLanguagePlugin());
|
|
184
|
+
this.registry.registerThemePlugin(new CustomThemePlugin());
|
|
185
|
+
this.registry.registerFormatterPlugin(new CustomFormatterPlugin());
|
|
186
|
+
}
|
|
187
|
+
}
|
|
188
|
+
```
|
|
189
|
+
|
|
190
|
+
## Component API
|
|
191
|
+
|
|
192
|
+
### Inputs
|
|
193
|
+
|
|
194
|
+
| Input | Type | Default | Description |
|
|
195
|
+
| ------------------- | ---------------------------------- | -------------- | -------------------------------- |
|
|
196
|
+
| `value` | `string` | `''` | Editor content (two-way binding) |
|
|
197
|
+
| `language` | `string` | `'javascript'` | Language identifier |
|
|
198
|
+
| `theme` | `string \| null` | `null` | Theme ID (null = platform theme) |
|
|
199
|
+
| `readOnly` | `boolean` | `false` | Read-only mode |
|
|
200
|
+
| `placeholder` | `string` | `''` | Placeholder text |
|
|
201
|
+
| `lineNumbers` | `boolean` | `true` | Show line numbers |
|
|
202
|
+
| `lineWrapping` | `boolean` | `false` | Wrap long lines |
|
|
203
|
+
| `tabSize` | `number` | `2` | Tab size in spaces |
|
|
204
|
+
| `indentWithTab` | `boolean` | `true` | Use Tab key for indentation |
|
|
205
|
+
| `height` | `string \| null` | `null` | Fixed height |
|
|
206
|
+
| `minHeight` | `string \| null` | `null` | Minimum height |
|
|
207
|
+
| `maxHeight` | `string \| null` | `null` | Maximum height |
|
|
208
|
+
| `extensions` | `Extension[]` | `[]` | Additional CodeMirror extensions |
|
|
209
|
+
| `customCompletions` | `Completion[] \| CompletionSource` | `null` | Custom autocomplete |
|
|
210
|
+
| `ariaLabel` | `string \| null` | `null` | ARIA label |
|
|
211
|
+
| `focusOnReady` | `boolean` | `false` | Auto-focus on mount |
|
|
212
|
+
| `formatOnSave` | `boolean` | `false` | Format on Ctrl+S |
|
|
213
|
+
|
|
214
|
+
### Outputs
|
|
215
|
+
|
|
216
|
+
| Output | Type | Description |
|
|
217
|
+
| ------------- | -------- | -------------------------------- |
|
|
218
|
+
| `valueChange` | `string` | Emits when content changes |
|
|
219
|
+
| `ready` | `void` | Emits when editor is initialized |
|
|
220
|
+
| `save` | `string` | Emits on Ctrl+S |
|
|
221
|
+
|
|
222
|
+
### Methods
|
|
223
|
+
|
|
224
|
+
| Method | Returns | Description |
|
|
225
|
+
| ---------------------- | ------------------------- | ------------------- |
|
|
226
|
+
| `focus()` | `void` | Focus the editor |
|
|
227
|
+
| `selectAll()` | `void` | Select all text |
|
|
228
|
+
| `format(affect?)` | `Promise<string \| null>` | Format document |
|
|
229
|
+
| `getTotalCharacters()` | `number` | Get character count |
|
|
230
|
+
| `getTotalLines()` | `number` | Get line count |
|
|
231
|
+
|
|
232
|
+
## Examples
|
|
233
|
+
|
|
234
|
+
### With Custom Theme
|
|
235
|
+
|
|
236
|
+
```typescript
|
|
237
|
+
<ax-code-editor
|
|
238
|
+
[(value)]="code"
|
|
239
|
+
language="typescript"
|
|
240
|
+
theme="one-dark"
|
|
241
|
+
/>
|
|
242
|
+
```
|
|
243
|
+
|
|
244
|
+
### With Formatting
|
|
245
|
+
|
|
246
|
+
```typescript
|
|
247
|
+
<ax-code-editor
|
|
248
|
+
[(value)]="code"
|
|
249
|
+
language="json"
|
|
250
|
+
[formatOnSave]="true"
|
|
251
|
+
(save)="onSave($event)"
|
|
252
|
+
/>
|
|
253
|
+
```
|
|
254
|
+
|
|
255
|
+
### Programmatic Formatting
|
|
256
|
+
|
|
257
|
+
```typescript
|
|
258
|
+
@Component({
|
|
259
|
+
template: `
|
|
260
|
+
<ax-code-editor #editor [(value)]="code" />
|
|
261
|
+
<button (click)="formatCode()">Format</button>
|
|
262
|
+
`
|
|
263
|
+
})
|
|
264
|
+
export class MyComponent {
|
|
265
|
+
editor = viewChild<AXCodeEditorComponent>('editor');
|
|
266
|
+
|
|
267
|
+
async formatCode() {
|
|
268
|
+
await this.editor().format();
|
|
269
|
+
}
|
|
270
|
+
}
|
|
271
|
+
```
|
|
272
|
+
|
|
273
|
+
## Migration from v1
|
|
274
|
+
|
|
275
|
+
The component now uses a plugin architecture. Update your app configuration:
|
|
276
|
+
|
|
277
|
+
**Before:**
|
|
278
|
+
|
|
279
|
+
```typescript
|
|
280
|
+
// Languages were hardcoded
|
|
281
|
+
```
|
|
282
|
+
|
|
283
|
+
**After:**
|
|
284
|
+
|
|
285
|
+
```typescript
|
|
286
|
+
import { provideDefaultCodeEditorConfig } from '@acorex/components/code-editor';
|
|
287
|
+
|
|
288
|
+
bootstrapApplication(AppComponent, {
|
|
289
|
+
providers: [provideDefaultCodeEditorConfig()]
|
|
290
|
+
});
|
|
291
|
+
```
|
|
292
|
+
|
|
293
|
+
The `AXCodeEditorSupportedLanguage` type is deprecated but still available for backward compatibility. Use `string` type directly for language inputs.
|
package/code-editor/index.d.ts
CHANGED
|
@@ -1,20 +1,267 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
|
-
import { ElementRef } from '@angular/core';
|
|
2
|
+
import { InjectionToken, ElementRef } from '@angular/core';
|
|
3
3
|
import * as _codemirror_autocomplete from '@codemirror/autocomplete';
|
|
4
4
|
import * as _codemirror_state from '@codemirror/state';
|
|
5
|
+
import { Extension } from '@codemirror/state';
|
|
5
6
|
import { MXValueComponent } from '@acorex/cdk/common';
|
|
6
7
|
import * as i1 from '@angular/common';
|
|
7
8
|
|
|
9
|
+
/**
|
|
10
|
+
* Base interface for all code editor plugins
|
|
11
|
+
*/
|
|
12
|
+
interface AXCodeEditorPlugin {
|
|
13
|
+
/** Unique identifier for the plugin */
|
|
14
|
+
readonly id: string;
|
|
15
|
+
/** Human-readable name */
|
|
16
|
+
readonly name: string;
|
|
17
|
+
/** Plugin version */
|
|
18
|
+
readonly version?: string;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* Language plugin provides syntax highlighting and language-specific features
|
|
22
|
+
*/
|
|
23
|
+
interface AXCodeEditorLanguagePlugin extends AXCodeEditorPlugin {
|
|
24
|
+
/** Language identifiers this plugin supports (e.g., 'javascript', 'js') */
|
|
25
|
+
readonly languages: ReadonlyArray<string>;
|
|
26
|
+
/** Load and return the CodeMirror extension for this language */
|
|
27
|
+
getExtension(): Promise<Extension>;
|
|
28
|
+
}
|
|
29
|
+
/**
|
|
30
|
+
* Theme plugin provides visual styling for the editor
|
|
31
|
+
*/
|
|
32
|
+
interface AXCodeEditorThemePlugin extends AXCodeEditorPlugin {
|
|
33
|
+
/** Whether this is a dark theme */
|
|
34
|
+
readonly dark: boolean;
|
|
35
|
+
/** Load and return the CodeMirror theme extension */
|
|
36
|
+
getExtension(): Promise<Extension>;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* Formatter plugin provides code formatting capabilities
|
|
40
|
+
*/
|
|
41
|
+
interface AXCodeEditorFormatterPlugin extends AXCodeEditorPlugin {
|
|
42
|
+
/** Languages this formatter supports */
|
|
43
|
+
readonly languages: ReadonlyArray<string>;
|
|
44
|
+
/** Format the given text */
|
|
45
|
+
format(text: string, language: string): Promise<string | null>;
|
|
46
|
+
}
|
|
47
|
+
/**
|
|
48
|
+
* Extension plugin provides additional CodeMirror extensions
|
|
49
|
+
*/
|
|
50
|
+
interface AXCodeEditorExtensionPlugin extends AXCodeEditorPlugin {
|
|
51
|
+
/** Get the CodeMirror extension */
|
|
52
|
+
getExtension(): Promise<Extension>;
|
|
53
|
+
}
|
|
54
|
+
/**
|
|
55
|
+
* Plugin configuration for the code editor
|
|
56
|
+
*/
|
|
57
|
+
interface AXCodeEditorPluginConfig {
|
|
58
|
+
/** Language plugins */
|
|
59
|
+
languages?: ReadonlyArray<AXCodeEditorLanguagePlugin>;
|
|
60
|
+
/** Theme plugins */
|
|
61
|
+
themes?: ReadonlyArray<AXCodeEditorThemePlugin>;
|
|
62
|
+
/** Formatter plugins */
|
|
63
|
+
formatters?: ReadonlyArray<AXCodeEditorFormatterPlugin>;
|
|
64
|
+
/** Additional extension plugins */
|
|
65
|
+
extensions?: ReadonlyArray<AXCodeEditorExtensionPlugin>;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
/**
|
|
69
|
+
* Injection token for providing code editor plugin configuration
|
|
70
|
+
*/
|
|
71
|
+
declare const AX_CODE_EDITOR_PLUGIN_CONFIG: InjectionToken<AXCodeEditorPluginConfig>;
|
|
72
|
+
|
|
73
|
+
/**
|
|
74
|
+
* Registry service for managing code editor plugins
|
|
75
|
+
*/
|
|
76
|
+
declare class AXCodeEditorPluginRegistry {
|
|
77
|
+
private config;
|
|
78
|
+
private languagePlugins;
|
|
79
|
+
private themePlugins;
|
|
80
|
+
private formatterPlugins;
|
|
81
|
+
private extensionPlugins;
|
|
82
|
+
constructor();
|
|
83
|
+
private initializePlugins;
|
|
84
|
+
/**
|
|
85
|
+
* Get language extension for the specified language
|
|
86
|
+
*/
|
|
87
|
+
getLanguageExtension(language: string): Promise<Extension>;
|
|
88
|
+
/**
|
|
89
|
+
* Get theme extension by theme ID
|
|
90
|
+
*/
|
|
91
|
+
getThemeExtension(themeId: string): Promise<Extension>;
|
|
92
|
+
/**
|
|
93
|
+
* Format text using the appropriate formatter for the language
|
|
94
|
+
*/
|
|
95
|
+
format(text: string, language: string): Promise<string | null>;
|
|
96
|
+
/**
|
|
97
|
+
* Get all registered extension plugins
|
|
98
|
+
*/
|
|
99
|
+
getExtensionPlugins(): Promise<Extension[]>;
|
|
100
|
+
/**
|
|
101
|
+
* Check if a language is supported
|
|
102
|
+
*/
|
|
103
|
+
hasLanguage(language: string): boolean;
|
|
104
|
+
/**
|
|
105
|
+
* Check if a theme is available
|
|
106
|
+
*/
|
|
107
|
+
hasTheme(themeId: string): boolean;
|
|
108
|
+
/**
|
|
109
|
+
* Check if a formatter is available for a language
|
|
110
|
+
*/
|
|
111
|
+
hasFormatter(language: string): boolean;
|
|
112
|
+
/**
|
|
113
|
+
* Get all available language identifiers
|
|
114
|
+
*/
|
|
115
|
+
getAvailableLanguages(): string[];
|
|
116
|
+
/**
|
|
117
|
+
* Get all available theme identifiers
|
|
118
|
+
*/
|
|
119
|
+
getAvailableThemes(): string[];
|
|
120
|
+
/**
|
|
121
|
+
* Register a language plugin at runtime
|
|
122
|
+
*/
|
|
123
|
+
registerLanguagePlugin(plugin: AXCodeEditorLanguagePlugin): void;
|
|
124
|
+
/**
|
|
125
|
+
* Register a theme plugin at runtime
|
|
126
|
+
*/
|
|
127
|
+
registerThemePlugin(plugin: AXCodeEditorThemePlugin): void;
|
|
128
|
+
/**
|
|
129
|
+
* Register a formatter plugin at runtime
|
|
130
|
+
*/
|
|
131
|
+
registerFormatterPlugin(plugin: AXCodeEditorFormatterPlugin): void;
|
|
132
|
+
/**
|
|
133
|
+
* Register an extension plugin at runtime
|
|
134
|
+
*/
|
|
135
|
+
registerExtensionPlugin(plugin: AXCodeEditorExtensionPlugin): void;
|
|
136
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXCodeEditorPluginRegistry, never>;
|
|
137
|
+
static ɵprov: _angular_core.ɵɵInjectableDeclaration<AXCodeEditorPluginRegistry>;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
declare class JavaScriptLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
141
|
+
readonly id = "javascript";
|
|
142
|
+
readonly name = "JavaScript";
|
|
143
|
+
readonly version = "1.0.0";
|
|
144
|
+
readonly languages: readonly ["javascript", "js"];
|
|
145
|
+
getExtension(): Promise<Extension>;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
declare class TypeScriptLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
149
|
+
readonly id = "typescript";
|
|
150
|
+
readonly name = "TypeScript";
|
|
151
|
+
readonly version = "1.0.0";
|
|
152
|
+
readonly languages: readonly ["typescript", "ts"];
|
|
153
|
+
getExtension(): Promise<Extension>;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
declare class JSONLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
157
|
+
readonly id = "json";
|
|
158
|
+
readonly name = "JSON";
|
|
159
|
+
readonly version = "1.0.0";
|
|
160
|
+
readonly languages: readonly ["json"];
|
|
161
|
+
getExtension(): Promise<Extension>;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
declare class HTMLLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
165
|
+
readonly id = "html";
|
|
166
|
+
readonly name = "HTML";
|
|
167
|
+
readonly version = "1.0.0";
|
|
168
|
+
readonly languages: readonly ["html"];
|
|
169
|
+
getExtension(): Promise<Extension>;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
declare class CSSLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
173
|
+
readonly id = "css";
|
|
174
|
+
readonly name = "CSS";
|
|
175
|
+
readonly version = "1.0.0";
|
|
176
|
+
readonly languages: readonly ["css"];
|
|
177
|
+
getExtension(): Promise<Extension>;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
declare class SassLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
181
|
+
readonly id = "sass";
|
|
182
|
+
readonly name = "Sass/SCSS";
|
|
183
|
+
readonly version = "1.0.0";
|
|
184
|
+
readonly languages: readonly ["sass", "scss"];
|
|
185
|
+
getExtension(): Promise<Extension>;
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
declare class SQLLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
189
|
+
readonly id = "sql";
|
|
190
|
+
readonly name = "SQL";
|
|
191
|
+
readonly version = "1.0.0";
|
|
192
|
+
readonly languages: readonly ["sql"];
|
|
193
|
+
getExtension(): Promise<Extension>;
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
declare class XMLLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
197
|
+
readonly id = "xml";
|
|
198
|
+
readonly name = "XML";
|
|
199
|
+
readonly version = "1.0.0";
|
|
200
|
+
readonly languages: readonly ["xml"];
|
|
201
|
+
getExtension(): Promise<Extension>;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
declare class MarkdownLanguagePlugin implements AXCodeEditorLanguagePlugin {
|
|
205
|
+
readonly id = "markdown";
|
|
206
|
+
readonly name = "Markdown";
|
|
207
|
+
readonly version = "1.0.0";
|
|
208
|
+
readonly languages: readonly ["markdown"];
|
|
209
|
+
getExtension(): Promise<Extension>;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
type AXCodeEditorDefaultLanguage = 'javascript' | 'js' | 'typescript' | 'ts' | 'json' | 'html' | 'css' | 'scss' | 'sass' | 'sql' | 'xml' | 'markdown';
|
|
213
|
+
|
|
214
|
+
declare class OneDarkThemePlugin implements AXCodeEditorThemePlugin {
|
|
215
|
+
readonly id = "one-dark";
|
|
216
|
+
readonly name = "One Dark";
|
|
217
|
+
readonly version = "1.0.0";
|
|
218
|
+
readonly dark = true;
|
|
219
|
+
getExtension(): Promise<Extension>;
|
|
220
|
+
}
|
|
221
|
+
|
|
222
|
+
declare class LightThemePlugin implements AXCodeEditorThemePlugin {
|
|
223
|
+
readonly id = "light";
|
|
224
|
+
readonly name = "Light";
|
|
225
|
+
readonly version = "1.0.0";
|
|
226
|
+
readonly dark = false;
|
|
227
|
+
getExtension(): Promise<Extension>;
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
declare class GitHubLightThemePlugin implements AXCodeEditorThemePlugin {
|
|
231
|
+
readonly id = "github-light";
|
|
232
|
+
readonly name = "GitHub Light";
|
|
233
|
+
readonly version = "1.0.0";
|
|
234
|
+
readonly dark = false;
|
|
235
|
+
getExtension(): Promise<Extension>;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
declare class GitHubDarkThemePlugin implements AXCodeEditorThemePlugin {
|
|
239
|
+
readonly id = "github-dark";
|
|
240
|
+
readonly name = "GitHub Dark";
|
|
241
|
+
readonly version = "1.0.0";
|
|
242
|
+
readonly dark = true;
|
|
243
|
+
getExtension(): Promise<Extension>;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
declare class PrettierFormatterPlugin implements AXCodeEditorFormatterPlugin {
|
|
247
|
+
readonly id = "prettier";
|
|
248
|
+
readonly name = "Prettier";
|
|
249
|
+
readonly version = "1.0.0";
|
|
250
|
+
readonly languages: readonly ["javascript", "js", "typescript", "ts", "json", "html", "css", "markdown"];
|
|
251
|
+
format(text: string, language: string): Promise<string | null>;
|
|
252
|
+
}
|
|
253
|
+
|
|
254
|
+
/**
|
|
255
|
+
* Default plugin configuration with all built-in plugins
|
|
256
|
+
*/
|
|
257
|
+
declare function provideDefaultCodeEditorPlugins(): AXCodeEditorPluginConfig;
|
|
258
|
+
|
|
8
259
|
type AXCodeEditorExtensionLike = _codemirror_state.Extension;
|
|
9
260
|
type AXCodeEditorCompletionLike = _codemirror_autocomplete.Completion;
|
|
10
261
|
type AXCodeEditorCompletionSourceLike = _codemirror_autocomplete.CompletionSource;
|
|
11
|
-
/**
|
|
12
|
-
* Supported syntax highlighting modes for the editor.
|
|
13
|
-
*/
|
|
14
|
-
type AXCodeEditorSupportedLanguage = 'javascript' | 'js' | 'typescript' | 'ts' | 'json' | 'html' | 'css' | 'scss' | 'sass' | 'sql' | 'xml' | 'markdown' | 'text';
|
|
15
262
|
declare class AXCodeEditorComponent extends MXValueComponent<string> {
|
|
16
|
-
/** Active language
|
|
17
|
-
language: _angular_core.InputSignal<
|
|
263
|
+
/** Active language identifier from default plugins. Default: 'javascript'. */
|
|
264
|
+
language: _angular_core.InputSignal<AXCodeEditorDefaultLanguage>;
|
|
18
265
|
/** When true, the editor becomes readonly (non-editable). */
|
|
19
266
|
readOnly: _angular_core.InputSignal<boolean>;
|
|
20
267
|
/** Placeholder text shown when the document is empty. */
|
|
@@ -33,6 +280,8 @@ declare class AXCodeEditorComponent extends MXValueComponent<string> {
|
|
|
33
280
|
minHeight: _angular_core.InputSignal<string>;
|
|
34
281
|
/** Maximum height for the editor. */
|
|
35
282
|
maxHeight: _angular_core.InputSignal<string>;
|
|
283
|
+
/** Theme identifier. If null, uses platform theme mode (dark/light). */
|
|
284
|
+
theme: _angular_core.InputSignal<string>;
|
|
36
285
|
/** Additional CodeMirror extensions to apply. Reconfigures at runtime. */
|
|
37
286
|
extensions: _angular_core.InputSignal<readonly _codemirror_state.Extension[]>;
|
|
38
287
|
/** ARIA label for accessibility. */
|
|
@@ -54,6 +303,7 @@ declare class AXCodeEditorComponent extends MXValueComponent<string> {
|
|
|
54
303
|
private platformId;
|
|
55
304
|
private destroyRef;
|
|
56
305
|
private platformService;
|
|
306
|
+
private pluginRegistry;
|
|
57
307
|
private editorViewSig;
|
|
58
308
|
private languageCompartment;
|
|
59
309
|
private readOnlyCompartment;
|
|
@@ -76,8 +326,6 @@ declare class AXCodeEditorComponent extends MXValueComponent<string> {
|
|
|
76
326
|
private loadCodeMirrorModules;
|
|
77
327
|
private createCompartments;
|
|
78
328
|
private buildKeymaps;
|
|
79
|
-
private tryFormatWithPrettier;
|
|
80
|
-
private resolveLanguageExtension;
|
|
81
329
|
private resolveThemeExtension;
|
|
82
330
|
private buildCustomCompletionSources;
|
|
83
331
|
/** Programmatically focus the editor. */
|
|
@@ -90,7 +338,7 @@ declare class AXCodeEditorComponent extends MXValueComponent<string> {
|
|
|
90
338
|
/** Returns the total number of lines in the current document. */
|
|
91
339
|
getTotalLines(): number;
|
|
92
340
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXCodeEditorComponent, never>;
|
|
93
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXCodeEditorComponent, "ax-code-editor", never, { "language": { "alias": "language"; "required": false; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "lineNumbers": { "alias": "lineNumbers"; "required": false; "isSignal": true; }; "lineWrapping": { "alias": "lineWrapping"; "required": false; "isSignal": true; }; "tabSize": { "alias": "tabSize"; "required": false; "isSignal": true; }; "indentWithTab": { "alias": "indentWithTab"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "extensions": { "alias": "extensions"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "focusOnReady": { "alias": "focusOnReady"; "required": false; "isSignal": true; }; "formatOnSave": { "alias": "formatOnSave"; "required": false; "isSignal": true; }; "customCompletions": { "alias": "customCompletions"; "required": false; "isSignal": true; }; }, { "ready": "ready"; "save": "save"; }, never, never, true, never>;
|
|
341
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXCodeEditorComponent, "ax-code-editor", never, { "language": { "alias": "language"; "required": false; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "lineNumbers": { "alias": "lineNumbers"; "required": false; "isSignal": true; }; "lineWrapping": { "alias": "lineWrapping"; "required": false; "isSignal": true; }; "tabSize": { "alias": "tabSize"; "required": false; "isSignal": true; }; "indentWithTab": { "alias": "indentWithTab"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "theme": { "alias": "theme"; "required": false; "isSignal": true; }; "extensions": { "alias": "extensions"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "focusOnReady": { "alias": "focusOnReady"; "required": false; "isSignal": true; }; "formatOnSave": { "alias": "formatOnSave"; "required": false; "isSignal": true; }; "customCompletions": { "alias": "customCompletions"; "required": false; "isSignal": true; }; }, { "ready": "ready"; "save": "save"; }, never, never, true, never>;
|
|
94
342
|
}
|
|
95
343
|
|
|
96
344
|
declare class AXCodeEditorModule {
|
|
@@ -99,5 +347,5 @@ declare class AXCodeEditorModule {
|
|
|
99
347
|
static ɵinj: _angular_core.ɵɵInjectorDeclaration<AXCodeEditorModule>;
|
|
100
348
|
}
|
|
101
349
|
|
|
102
|
-
export { AXCodeEditorComponent, AXCodeEditorModule };
|
|
103
|
-
export type { AXCodeEditorCompletionLike, AXCodeEditorCompletionSourceLike, AXCodeEditorExtensionLike,
|
|
350
|
+
export { AXCodeEditorComponent, AXCodeEditorModule, AXCodeEditorPluginRegistry, AX_CODE_EDITOR_PLUGIN_CONFIG, CSSLanguagePlugin, GitHubDarkThemePlugin, GitHubLightThemePlugin, HTMLLanguagePlugin, JSONLanguagePlugin, JavaScriptLanguagePlugin, LightThemePlugin, MarkdownLanguagePlugin, OneDarkThemePlugin, PrettierFormatterPlugin, SQLLanguagePlugin, SassLanguagePlugin, TypeScriptLanguagePlugin, XMLLanguagePlugin, provideDefaultCodeEditorPlugins };
|
|
351
|
+
export type { AXCodeEditorCompletionLike, AXCodeEditorCompletionSourceLike, AXCodeEditorDefaultLanguage, AXCodeEditorExtensionLike, AXCodeEditorExtensionPlugin, AXCodeEditorFormatterPlugin, AXCodeEditorLanguagePlugin, AXCodeEditorPlugin, AXCodeEditorPluginConfig, AXCodeEditorThemePlugin };
|