https://github.com/apioo/typeschema-angular-editor
https://github.com/apioo/typeschema-angular-editor
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/apioo/typeschema-angular-editor
- Owner: apioo
- License: mit
- Created: 2021-08-28T20:54:15.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2025-03-21T21:19:26.000Z (10 months ago)
- Last Synced: 2025-04-12T05:37:18.722Z (9 months ago)
- Language: TypeScript
- Size: 1010 KB
- Stars: 5
- Watchers: 3
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# TypeSchemaAngularEditor
This package provides an Angular Editor Component which provides a visual editor to design a
[TypeSchema](https://typeschema.org/) or [TypeAPI](https://typeapi.org) specification.
It also integrates with the [typehub.cloud](https://typehub.cloud/) API so that a user can integrate
remote schemas registered at the TypeHub cloud platform. The following screenshot shows an example
of the editor:
We use this component in different products:
* [Fusio](https://www.fusio-project.org/)
* [TypeHub](https://typehub.cloud/)
* [APIgen](https://apigen.app/)
* [SDKgen](https://sdkgen.app/)
## Usage
You can use the `typeschema-editor` component directly in your template
```angular2html
```
In your controller you can then listen on the save or change event:
```typescript
export class DesignerComponent implements OnInit {
spec: Specification = {
imports: [],
types: []
};
ngOnInit(): void {
}
submit(spec: Specification) {
// is called everytime a user clicks on the save button
}
change(spec: Specification) {
// is called everytime the user changes the schema through the editor
}
}
```
## Input
### `specification`
The specification object
### `operationEnabled`
Default: false
Whether it is possible to manage operations
### `importEnabled`
Default: true
Whether it is possible to import specifications from remote sources
### `readonly`
Default: false
Whether the editor is readonly, if true the editor only renders the specification with no option to
modify the specification.
## Development
Internally the component does not work directly on a TypeSchema/TypeAPI JSON instead it uses
an internal representation. The `Specification` is the internal representation, if
you want to turn this into a TypeSchema you can use the `ExportService`
service. There is also an `ImportService` service which converts a specification into the
internal `Specification` representation.