when trying to import any of Kendo Vue's types to have IDE autocomplete, my vue compiler crashes with

[plugin:vite:vue] [@vue/compiler-sfc] Failed to resolve import source "@progress/kendo-vue-scheduler".

import this this

Is there any way around this? The autocompletion is working fine and I am getting the types to my IDE, but the project just won't launch.

EDIT

I changed the code to this:

and now it is working. But still, any other way to do this?

I have several questions here:

1. How can I implement my own tools (Vue component)?
2. How to implement an emoji picker (Vue component)?
3. How to implement mentions (@name) with a Vue component?

I can't find anything about it in the docs.

Hi, kendo

I used the grid for reference "https://www.telerik.com/kendo-vue-ui/components/grid/columns/locked/"
At the same time, I added resizable props.

like this,

I resized "Name" column, then I could see the bug that a gap has occurred between Name and CategoryName.

Can I fix it?

Hello Kendo VUE Forum, does anyone have an idea how to integrate an emoji picker into the VUE editor?

Hi,

Is it possible to implement a filter in a multiSelectTree so that when a search term matches a parent item, it automatically displays all of its children as well?

example:

For instance, if one were to search for "decor," would the system also show "Bed Linen," "Curtains & Blinds," and "Carpets"?

Thanks in advance,
Ziggy

Hello,

When I use TextBox in Navtive components of Vue3, I want to distinguish between the input value and the displayed value.

For example,
I uesd TextBox like this.

<TextBox v-model="inputValue" />

If I enter "1234567", "1,234,567" will be displayed. but inputValue has "1234567".
or
If I enter "AbcD", "abcd" will be displayed. but inputValue has "AbcD".

Can I only change the displayed value while maintaining the value I entered?
ps... I don't want use the NumericTextBox. because of lowercase and uppercase.

Hello! 

We want to customize the InsertImage tool in the Editor, as we want to allow image upload. We found the React Documentation, and that's exactly what we want in Vue.

React Editor Component & Paste, Drag and Drop, and Upload Images - KendoReact Docs & Demos (telerik.com)

In React, (see this example main.tsx - nodebox - CodeSandbox) it looks straightforward to stop using the InsertImage from EditorTools and use the one in the example. 

But in Vue (main.vue - nodebox - CodeSandbox), how do we replace the InsertImage by the implementation in insertImageTool? 

Thank you 

Lucía

We are starting to use Kendo UI for Vue HTML Editor for an application with support with multiple languages. 

Is there any way to make a contribution to the community translations?

I've seen some funny things (like translating "Audaz" for "Bold") in the github repo for react, and missing items for vue

kendo-react-messages/messages/es-ES/es-ES.json at master · telerik/kendo-react-messages · GitHub

Lucía

So this is my datasource... I would assume the schema is what it would read to render the properties in the sheet, but it's just verbatim taking the JSON object and plopping it in.  So example, there's a LastUpdated property on each object, it's not defined in the schema... but it's rendering in the sheet.

Am I missing something?

 dataSource: {
            transport: {
                dataType: "json",
                read: {
                    url: this.baseUrl + "/groups?format=json",
                    type: "GET",
                    data: function () {
                        return {
                            cohort: $editorData.cohort
                        };
                    }
                },
                /*
                update: {
                    url: baseUrl + "/groups?format=json",
                    dataType: "json",
                    type: "POST"
                },
                */
            },
            requestEnd: function (e) {
                var response = e.response;
                var type = e.type;
                
                console.log("requestEnd", type, response);
            },
            schema: {
                model: {
                    id: "UserId",
                    fields: {
                        UserName: { type: "string", editable: false },
                        FirstName: { type: "string", editable: false },
                        LastName: { type: "string", editable: false },
                        Campus: { type: "string", editable: false },
                        Cohort: { type: "number", editable: false },
                        MF1: { type: "number" },
                        MF3: { type: "number" },
                        MF4: { type: "number" },
                        MF2: { type: "number" },
                        MF5: { type: "number" },
                        ClerkshipGroup: { type: "number" },
                        PediatricsStream: { type: "number" },
                        ProCompGroup: { type: "number" }
                    }
                }
            },

            <kendo-spreadsheet 
              ref="spreadsheet"
             :toolbar="false" 
             :sheetsbar="false"
             :excel-proxy-URL="'/RestApi/utility/proxy/save'"
             :pdf-proxy-URL="'/RestApi/utility/proxy/save'"
             :columns="15"
             :rows="300"
             style="width: 100%; height: 800px">
                        <kendo-spreadsheet-sheet 
                            :name="'Groups'" 
                            :data-source="dataSource"
                            :rows="rows"
                            :columns="columns"
                        >
                        </kendo-spreadsheet-sheet>
            </kendo-spreadsheet>

Hi all,

I cannot find any way to increase the event height of the kendo native scheduler component for vue. when artificially changing it for the .k-event class the top values don't line up, how do I make this bigger? In the meantime I also want to make the width the same as the actual value and not be the correct width -20px (as in the picture)

The height should be like the box, and the width should increase so the whitespace where the arrow is pointing is not there. Can anyone help with this?

Discussion: I think its awful how Kendo keeps pushing the Native Vue component in favor of the JQuery one, but the vue native one is just so outrageous, I wrote about 800 lines just to fix stupid rendering bugs with this. When will this get better?