Hello kane81,
You’re encountering warnings related to type assignments for the Editor component.
<Editor bind:this={editor}/>
Type 'SvelteComponent<$$ComponentProps, unknown, unknown> & { triggerAction: (values: { item: any; values: any; onDiscardChanges: any; }) => boolean; } & { $$bindings: ""; }' is not assignable to type 'null'.js(2322)
Make sure to properly initialize the editor and its types. Here you can find information of the correct initialization.
editor.triggerAction({ item: { id: 'close-action' } });
Property 'triggerAction' does not exist on type 'never'.js(2339)
Editor doesn't have method or action triggerAction. Please read this article to learn more about handling actions in editor.
api.intercept('open-editor', ({ id }) => {
if (!valuesToEdit) {
valuesToEdit = api.getRow(id);
if (valuesToEdit) {
valuesToEdit.created = formatDateForAdCreated(valuesToEdit.created);
valuesToEdit.modified = formatDateForAdCreated(valuesToEdit.modified);
}
}
return false;
Binding element 'id' implicitly has an 'any' type.
Here you need to explicitly define the parameter types in your function.
For example:
api.intercept('open-editor', ({ id }: { id: string }) => {
// Your logic here
});
Property 'created' and 'modified' does not exist on type 'never'
Ensure that valuesToEdit is typed correctly. Specify its type explicitly.
For example:
interface YourObjectType {
created: Date // if it is date;
modified: Date // if it is date;
//all other typed properties of the object
}
let valuesToEdit: YourObjectType;
Our library has types for editor's data IRow .
You can use it this way: let dataToEdit = $state(null as IRow | null);
<Editor bind:this={onaction}/>
Type '({ item, values, onDiscardChanges }: { item: any; values: any; onDiscardChanges: any; }) => boolean' is not assignable to type '(ev: { item: IToolbarItem; values: Record<string, any>; changes: Record<string, any>; }) => void'.
Types of parameters '__0' and 'ev' are incompatible.
Property 'onDiscardChanges' is missing in type '{ item: IToolbarItem; values: Record<string, any>; changes: Record<string, any>; }' but required in type '{ item: any; values: any; onDiscardChanges: any; }'.
Here you can read the information about the correct usage of events in editor.
const onaction = ({ item, values, onDiscardChanges }) => {
Binding element 'item', values, onDiscardChanges implicitly has an 'any' type.
You should explicitly type the parameters of functions as well.
For example:
const onaction = ({ item, values, onDiscardChanges }: { item: IToolbarItem; values: ValuesType; onDiscardChanges: (changes: ChangesType ) => void }) => {
// Your action logic here
};
Please check the example of integration grid with editor: https://stackblitz.com/edit/vitejs-vite-2ob3rf7g?file=src%2FApp.svelte,src%2Flib%2FGridComponent.svelte,src%2Flib%2Fdata.js&terminal=dev
