We have the requirement to have a data grid with drag and drop configured to support auto scroll when the data grid has no fixed height set and overflow/scrollbar is enabled on the a parent element (div or body).

Full details as per support ticket 1571735.

Hi,

I would like to request a feature for the scatter line type chart for the crosshair line depending on axis to snap to points on the scatter chart. 
An example of this would be like showing X axis crosshair only and having on hover of mouse to snap to nearest dot. (not showing crosshair between points, but always on a point.)

The closest working example I can find of this on kendo react is the bar chart for crosshair tool tip first example https://www.telerik.com/kendo-react-ui/components/charts/chart/elements/crosshairs/ but after talking to support it does not support scatter line chart.

but only with category axis(X axis). 

The desired behavior would be the above but on a scatter line chart using separate axis y or x crosshair only and having them to snap to points instead of hovering between points. If you do hover between points, it should snap to nearest point to mouse cursor.

This sandbox has the behavior but only for a bar chart. https://stackblitz.com/edit/react-qnn9h4?file=app%2Fmain.jsx

We'd liked to have a wrapped loader similar to other third party loaders.

The code should be something like this:

<Loader show={props.isLoading} message={'loading'}>
  <SomeComponent />
</Loader>

Other solutions are also acceptable.  The requirement is that the loader is positioned above the main component without having it rerender or reposition.

Set the default width of the MultiColumnComboBox columns based on the input width.

In order to position the Popup of the MultiColumnComboBox correctly, we need each column to have fixed width.

Currently, we are setting the default width to 200px for each column that has not width set from the options.

We can add a second option to take the width of the input, subtract the width of the columns with fixed width and divide the remaining space between the other columns.

Just as a first note, the documentation on how to write a custom `messagesMap` function for use in the `Pager` component is extremely vague. Without access to the KendoReact source code, it would have been near impossible.

First request: on the `GridProps` API page, the `pager` prop is defined as being the type "null" or `ComponentType<PagerProps>`. Please convert the text "ComponentType<PagerProps>" into a link to the `PagerProps` page. This will greatly aid in quickly linking to the appropriate documentation.

Second request (and the bulk of the feature request): please make (at least) the pager-related constants and default messages (string templates) available to consuming components. As of v5.4.0 of `@progress/kendo-react-data-tools`, the constants are exported from {kendo-react-private}/packages/datatools/src/messages/index.ts and they are consumed within the `Pager` (and subcomponents), but are not re-exported.

Not having access to the pager-related constants (`pagerInfo`, `pagerFirstPage`, `pagerPreviousPage`, `pagerNextPage`, `pagerLastPage`, `pagerItemPerPage`, `pagerPage`, `pagerOf` and `pagerTotalPages`) means it's a complete shot in the dark at how to write an override function to supply as the `messagesMap` prop. Not only that, but without access to the pager-related default messages (string templates) and given the way the `Pager`'s `render` method is written, we are unable to change just one or just a couple messages; we have to address all nine.

Right now in v5.4.0, the way the `Pager`'s `render` method is written, it simply checks to see if `messagesMap` is non-null (lines 214 through 223 of Pager.tsx, lines 38-43 of PagerInput.tsx and lines 36 and 37 of PagerPageSizes.tsx). This means that if we pass in a custom function for `messagesMap`, the custom function will be used to evaluate the message/string-template for `pagerFirstPage`, `pagerPreviousPage`, `pagerNextPage`, `pagerLastPage`, `pagerInfo`, `pagerPage`, `pagerOf`, `pagerTotalPages` and `pagerItemPerPage` (just in those three, aforementioned files). This means that we have to somehow know that `pagerInfo`, for example, will come through to the custom function as the string "pager.info" or that `pagerPage` will come through as "pager.page" so that the custom function knows which `messageKey` it's being passed so it can send out the object with the appropriate message/string-template as the object's `defaultMessage` property.

Instead, if the pager-related constants and default messages were exposed, we could very easily write a custom `messagesMap` function that could address any number of the nine default messages.

As an example, the Telerik/Kendo default string template for `pagerInfo` is "{0} - {1} of {2} items" that could be better scoped to the type of data the grid shows. Let's say the grid displays products and we'd like the pager to show "Displaying products 5 - 10 of 302" in the bottom right. If the pager-related constants and messages were exposed, this becomes a very simple task while not disturbing all other Telerik/Kendo default messages:

import React from 'react';
import { Grid, GridColumn, GridNoRecords, GridColumnMenuFilter } from '@progress/kendo-react-grid';
import { pagerInfo, pagerOf, messages as defaultPagerMessages, Pager } from '@progress/kendo-react-data-tools';

export default function MyComponent() {
    const customMessagesMap = messageKey  => {
        switch (messageKey) {
            case pagerInfo: return { messageKey, defaultMessage: 'Displaying products {0} - {1} of {2}' };
            default: return { messageKey, defaultMessage: defaultPagerMessages[messageKey] };
        }
    };

    const CustomPager = () => (
        <Pager
            skip={...}
            take={...}
            total={...}
            buttonCount={...}
            type="numeric"
            info={true}
            pageSizes={[...]}
            messagesMap={customMessagesMap}
    );

    return (
        <div className='my-component'>
            <Grid data={[...]} pager={CustomPager}>
                <GridColumn ... />
            </Grid>
        </div>
    );
};

Allow the Grid to update its data without remounting the whole component, so the current selection of the filtering menu would be persisted.

We have scenarios where the data is constantly updating the filter selection is lost if the Grid is updated before pressing the `Filter` button.

Test Environment:

1. Go to system settings.

2. Navigate to 'Accessibility' and activate it.

3. Navigate to 'Contrast theme' and activate it.

4. Select 'Desert/Aquatic' High Contrast theme in the combo box.

Repro Steps:

1. Open given URL https://canvasjs.com/docs/charts/chart-options/axisx/viewport-minimum/ in Edge.

2. Graph page will be open. 

3. Turn on High contrast theme. 

4. Verify that Graphs are not adapting high contrast Aquatic and Desert modes or not. 

Actual Behavior:

Graphs are not adapting high contrast Aquatic and Desert modes. They remain same as in normal mode.  

Expected Behavior:

 Graphs should adapt high contrast Aquatic and Desert modes as defined. All elements should adapt to respective modes properly. 

Test Environment:

Hello,

I would like this feature https://docs.telerik.com/kendo-ui/knowledge-base/add-event-programatically?_ga=2.240140043.929456162.1660247660-2049658922.1660247660 to be available in KendoReact.

1. I need to be able to open the "create a new appointment dialog" from the scheduler programmatically.
2. Additionally, opening an existing event programmatically would also be a requirement.

The use case for #2 is so I can open an event directly from a link (e.g. use query params with an eventId, load it into the scheduler, and then open the edit dialog; all programmatically).

Thanks!

Currently when viewing the scheduler timeline view on tablet/mobile, in order to scroll the timeline back and forward you need to drag on an empty part of timeline. If the drag is started on an event then you are unable to scroll.

Would it be possible to make it so that if editing was disabled that dragging an event would scroll the timeline?

scroll pagination is available in ListView but item selection is not there and in other side item selection is available in ListBox but scroll pagination is not availed, 

we have mostly very common and frequent requirement user can select a item from a big data list, where we need pagination to improve component performance.

this only we can achieve only if ListBox supports scroll pagination

StackBlitz example: https://stackblitz.com/edit/react-vg8pu5?file=app/main.jsx

If you have a Form <Field component={Input}> inside an <ExpansionPanel>, if you press space or enter within the input, the expansion panel also receives the key event and will expand/collapse. It seems like these key events should not bubble out of the Field component.

Is It Possible to Add Persian Datetime format In Datetime Picker

Thanks

In the Checkbox onChange callback, event.nativeEvent.target.checked seems to be set differently depending on whether the input was toggled by mouse click or by pressing space.

After clicking on the Checkbox, event.value and event.nativeEvent.target.checked will have the same value, consistent with the Checkbox's new state.

After pressing space with the Checkbox focused, event.value and event.nativeEvent.target.checked will have different values, with event.value containing the Checkbox's new state and event.nativeEvent.target.checked containing the Checkbox's old state.

I would expect event.nativeEvent.target.checked to be set the same way regardless of whether I am toggling the Checkbox with mouse or keyboard.  Furthermore, I would expect event.value and event.nativeEvent.target.checked to always be equal to each other.

I made a code sandbox to demonstrate the bug here: https://codesandbox.io/s/kendo-react-checkbox-bug-26f7ur

The current grouping implementation renders the resources in each parent group, making duplicates.

The request is for providing an option for grouping resources by adding child items to a specific parent item only (without duplicating them in each group). The UI could be something similar to the following (with collapse/expand functionality):

• https://doc.daypilot.org/scheduler/react/

The data tool Filter component allows me to build an AND/OR filter query. It has a button for adding additional Group objects for nesting query parameters.

Can you please add an option that disables that button so that the user can only add basic AND/OR filters? No additional Groups?

Thank you,

Ryan

We are currently on implementing a component for data grids using the Kendo React Grid and virtual scrolling.
The problem is that the "page down" and "page up" is not working correctly, because of the virtualization (We already contacted the support for it).
Here is a stackblitz where the problem can be reproduced: https://stackblitz.com/edit/react-rapzu9?file=app/main.tsx
Reproduction steps:
1. Click inside the grid
2. Press "Page down" - Page changes, but focus goes to the header cell
3. Press "Page down" again - Nothing happens

Another problem which maybe has the same source is navigating with the arrow keys.
Reproduction steps:
1. Scroll somewhere deeper down
2. Use arrow up to scroll up again
3. At some point it scrolls not up anymore but the focus also changes into the header cell - Not okay

In my opinion its a bug, at least for the arrow keys. If you disagree please open a feature request for it, this functionality will be needed by out customers.

Best regards

Yui