Hello,

I have a query regarding multiple cell paste and transpose paste

1. Multiple cell pastes:

Mouse selection of multiple cells after selecting, the contents present in the cells should get copied and while pasting it should get paste in multiple cells.
e.g i) column no 3 and 4 having value 200 and 56700 after selection of this  value gets copied while pasting into column no 3 and 4,250 and 3250 replace by copied value
      ii) column no 3 and 4 having value 200 and 56700 and next row value i,e 250and 3250 after selection of this  value gets copied while pasting into column no 5, so the           values 2400,98250,6750,34500 replace by copied values

2.Transpose Paste:

Mouse selection of two or more cells, then the contents present in that cells should get copied then after clicking on transpose paste the copied cell content get pasted vertically in multiple cells.

e.g column no 3 and 4 having value 200 and 56700 after selection of this  value gets copied while pasting into column no 3,250 and 300 replace by copied value

all cells should be editable

Hello,

Please allow the Form component to submit even if it's not marked as modified internally. I am trying to use the Form within a Stepper workflow, and the Form can have default values based on what they submitted in the previous Step. If they return to the Step with the Form on it, though, and those initial values are not changed while displaying the Form, then the Form internally is not marked as modified, therefor the submit event never fires.

It'd be nice if we could have a boolean to tell the Form if we care to block submission based on modified or not.

Thank you

For example, the user goes to an URL where the query string is created initially with the toDataSourceRequestString method, we need a method that will parse that query string to the Grid data state object, so it can be applied to the Grid when the user returns to that URL.

Is it possible to add a target line to the ArcGauge?   I have attached a picture of what I would like to accomplish using the ArcGauge component.

Hello!

I use DateRangePicker to filter data in some period in the past.
Now, when I open DateRangePicker, it renders a calendar with current and future month. Therefore our users always have to click on the "left arrow" to select previous month.

Is it possible to open DateRangePicker with calendar, that renders previous and current month? I tried propfocusedDate, but it is not suitable in this case, because the component is "controlled" (it always has some value, by default it is current date).

It would be great, if you will add some settings to do this.

We use "@progress/kendo-react-dateinputs": "3.10.1"

How we use it:

<DateRange
  onChange={handleDateChange}
  value={selectedDates}
/>

Actual result: April and May month in view.

Expected result: March and April month in view. 

Thanks for your attention. I’m looking forward to your reply. 

In Kendo angular you can tell the tooltips to flip when they collide with the edge of the viewport:

https://stackblitz.com/edit/angular-gaezr2?file=app/app.component.ts

A problem with angular is it can't detect a collision in both directions. In the above example, the top tooltip only flips downwards but not to the right.

As for Kendo React there is less control. It seems to always want to "fit" with no option to flip when a collision happens. I have prepared 3 examples below. for position left, right and default:

https://stackblitz.com/edit/react-vfdvtk?file=app/main.jsx

Hi,

I'm seeing a bug in TreeList which seems to be related to how locked column positions are being set.  The issue I'm seeing is when I scroll to the right the columns either overlap of have a gap between them.  See image below.

I also created a demo that demonstrates this issue: https://stackblitz.com/edit/react-lwp4ua?file=app%2Fmain.jsx

Seeing this issue in:

Hi,

I need to implement two functionality for treelist control

1. Freezing of column and rows

2. Drag and Drop column and rows

Steps:

1. Create web component with shadow-root.

2. Attach all.css styles behide shadow root.

3. Add compoent with icon from WebComponentIcon font.

Result:

Icon are not displayed properly.

I'm trying out the KendoReact Conversational UI and there are two things that I would expect to exist in the API that I can't seem to find.

1. Unread indicator - I'd like to mark where the last unread message was but there doesn't seem to be a way to do that with the API.

2. Load more messages - I'd like to be able to only load a certain number of messages from the chat history on initial load and then load more messages as the user scrolls (or possibly have a "load more" button) but there doesn't seem to be any callback for that.

I already have ideas to work around both of these with the "messageTemplate" but I wanted to check if I might be missing something obvious first.

-- Erik Sandberg

UPDATE: This is live code I prepared for you: https://stackblitz.com/edit/react-ts-dhhsaz?file=index.tsx

I get error:

 Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

But error appears to be inside KendoDrawer component. I can't figure out what is wrong. This is my component:

import React, { useState } from 'react';
import { withRouter, useLocation, useHistory } from 'react-router-dom';

import { Drawer, DrawerContent } from '@progress/kendo-react-layout';
import { Button } from '@progress/kendo-react-buttons';



export const SidebarDrawer = (props:any) => {

    const items = [
        { text: 'Povezivanje', icon: 'k-i-inbox', selected: true, route: '/povezivanje' },
        { separator: true },
        { text: 'Notifications', icon: 'k-i-bell', route: '/notifications' },
        { text: 'Calendar', icon: 'k-i-calendar', route: '/calendar' },
        { separator: true },
        { text: 'Attachments', icon: 'k-i-hyperlink-email', route: '/attachments' },
        { text: 'Favourites', icon: 'k-i-star-outline', route: '/favourites' }
    ];

    const [expanded, setExpanded] = React.useState(true);
    const [position, setPosition] = React.useState(true);
    const [selectedId, setSelectedId] = React.useState(items.findIndex(x => x.selected === true));

    let positionMode = position ? 'start' : 'end';

    const handleSelect = (ev:any) => {
        setSelectedId(ev.itemIndex);
        setExpanded(false);
    };

    const handleClick = () => { setExpanded(prevState => !prevState); };

    const handleChange = () => { setPosition(prevState => !prevState); };

    const drawerProps = {
        expanded: expanded,
        position: positionMode,
        mode: 'push',
        items: items.map(
            (item, index) => ({ ...item, selected: index === selectedId })),

        onSelect: handleSelect,
    }

    return (
        <Drawer {...drawerProps}>
            <DrawerContent>
                {props.children}
            </DrawerContent>
        </Drawer >
    );

};

export default withRouter(SidebarDrawer);

And this is how I use it inside App component:

import React, { useState } from 'react';
import { hot } from 'react-hot-loader';
import { Button } from '@progress/kendo-react-buttons'
import { Grid, GridColumn, GridDetailRow, GridToolbar } from '@progress/kendo-react-grid';
import '@progress/kendo-theme-bootstrap/dist/all.css';

import 'bootstrap/dist/css/bootstrap.min.css';
import { Drawer, DrawerContent } from '@progress/kendo-react-layout';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

import urlConstants from 'ClientApp/constants/urlConstants'
import { Connecting } from '../containers/connecting/Connecting';
import SidebarDrawer from 'ClientApp/components/SidebarDrawer/SidebarDrawer';

export const App: React.FC = () => {


    return (
        <React.Fragment>
            <Router>
                <SidebarDrawer>
                    <Switch>
                        <Route exact={true} path="/" component={Connecting} />

                    </Switch>
                </SidebarDrawer>
            </Router>
        </React.Fragment>
            )
}

export default hot(module)(App);

Is the Chunk upload for file is not there for react. I Could find the chunk upload option for Jquery and Angular but not for react.

Is it not available yet/ when can we expect that?

Walkthrough component.

The component will allow the developer the create a step by step guide over the page.

This will highlight a collection of elements in a set order on the page with a tooltip showing the newly introduced feature.

When using the tab strip, it'd be nice if there were an event that fired before the tab changed so that we could abort a tab chat. For example, if a tab has some input fields that allow a user to change some setting but they change the tab without hitting save or something. It'd be nice if I could pop up a modal and ask them to save before changing tab.

The function could just return true or false to allow the tab change, etc.

I have a need for the 'Drop files here to upload' text to always be visible in the drop area of the KendoReact Upload component. Example of what I am talking about is in attached images.