Step by step instructions on how to reproduce the problem

Try entering a negative value in the filter column using the StackBlitz example here https://stackblitz.com/edit/react-dx7cna?file=app/main.jsx

This works using "ES" as locale (your example) https://stackblitz.com/run/?file=app/main.jsx

Github issue here https://github.com/telerik/kendo-react/issues/897

Description:

When the NumericTextBox is set to "c0" format and has a value of 0 ($0), it doesn't capture the first digit entered.

Reproduction Steps:

1. Set the field value to 0 ($0)
2. Hit "Tab" to blur the field
3. Hit "Shift-Tab" to focus the field (field contents will be highlighted)
4. Enter "123"
5. Repeat steps 2 through 4

Browser:

Chrome -- Version 89.0.4389.114 (Official Build) (64-bit)

Expected Behavior:

• After step 4, field shows "$123"
• After step 5, field shows "$123"

Observed Behavior:

• After step 4, the field shows "$230"
• After step 5, the field (correctly) shows "$123"

Notes:

• This bug seems to occur when the field has a value of 0 ($0) before gaining focus
• This doesn't occur when the specified format is "c2" or "n0"

Code Snippet:

<NumericTextBox format="c0" />

Description:

When typing into a React autocomplete with the "suggest" prop, the component does not always display the suggestion in the dropdown. It appears that in Chrome, only the very top of the suggestion is visible in the dropdown, while in Edge, it isn't at all.

Reproduction Steps:

1. Navigate to https://www.telerik.com/kendo-react-ui/components/dropdowns/autocomplete/suggestions/
2. Type "d" into the AutoComplete in Uncontrolled Mode example

Browser:

• Chrome -- Version 89.0.4389.114 (Official Build) (64-bit)
• Edge -- Version 89.0.774.68 (Official build) (64-bit)

Expected Behavior:

• The suggestion is fully visible in the dropdown

Observed Behavior:

• The suggestion is either not visible, or only partially visible

Screenshots:

Chrome:

Edge:

Hi,

Currently, we're facing a performance issue in react scheduler, when it has more grouping items(i.e. browser hangs indefinitely). I'm requesting the feature based on the below ticket

https://www.telerik.com/account/support-tickets/view-ticket/1513927

Hi Team,

We are trying to implement infinite scrolling for server data to our combobox based on virtual.

Do you have any event in combobox to handle on scroll.

Please help us with any examples you have on this topic. preferably using hooks.

Within the jQuery samples, there is a way to have the MonthView for Scheduler to have 'adaptive' height.

https://demos.telerik.com/kendo-ui/scheduler/adaptive-slot-height

Is this available for the <MonthView> part of the REACT components ?   How would this work ??     [adaptiveSlotHeight=true] isn't valid... 

The same issue exists for the 'autoeventheight' - is this planned for the REACT component/s ??

https://demos.telerik.com/kendo-ui/scheduler/auto-event-height

Hi,

I'm using the NumericTextBox to receive a value stored in a state, it has a percent "p3" format so it display numbers like this "0,000 %". When the state change, the value displayed in the NumericTextBox loses its format. If I click in the field and press space or any other key, the format comes back. The expected result was the NumericTextBox always keeping the format, what can be done in this situation?

NumericTextBox code

This is the textbox when I change the value direct in the field, it works fine

The state is shared between 2 NumericTextBox. if I change the value in the other textbox, it loses the format in this textbox

If I go in this textbox and just hit space, the format comes back

What can be done to keep the textbox format?

Thank you

Defined a date rang. But it allows to enter a date larger than a max date of the range. Both via calendar and manually.

const minDate = new Date(1, 1, 1);
const maxDate = new Date(9999, 12, 31);

          return (
           
              <DatePicker value = {this.state.value}
                 
                  min={minDate}
                  max={maxDate}
                
              /> 
           

We have database constraints on certain fields e.g. varchar(10) and would like to prevent the user from entering invalid data into the combo box fields. If it's not too much trouble a minLength field would also be convenient.

The SCSS files from the kendo-theme-material contain !important rule, that makes it difficult to override the styles in the consuming application.

We have a requirement to customize the DatePicker Kendo React component so that it has a border around all 4 sizes, as by default the theme has the border only on the bottom.

We have applied a new custom style to k-picker-wrap  and added the 
border-top-color: $datetime-border !important;

style

But due to the !import rule in the file 

@progress\kendo-theme-material\scss\datetime\_layout.scss, line 15

the custom style that we applied in the consuming application does not get applied.

Please find screenshots with the details of the problem.

The screenshots indicate that the custom style for the border-top-color did not get overriden, and the box is missing the top border.

Kindly advise approach that we can use to customize the CSS styles that has !important CSS rule, so that we can override the styles defined in the material theme.

We are implementing the application level zooming.

When user changes the zoom level from "100%" to , say, "200%",

all the components on the web page rerender proportionally bigger.

And we need to zoom the DatePicker react component as well.

We tried to use unofficial "zoom" CSS style property

https://developer.mozilla.org/en-US/docs/Web/CSS/zoom

and "scale" CSS function, but that does not give a good solution.

https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/scale()

If that takes time, please advise an approach how we can achieve zooming of the DatePicker/DateInput react component.

So far only interested in zooming of the DateInput and calendar toggle button (not popup Calendar itself).

Hello,

i am new to React and Kendo React UI.

I am reading the documentation for Gantt, and if i understand it correctly i can customize header column (headerCell?), but I dont know how. Is there any examle ?

I wound like to customize the column with dates.

Thank you, Matjaz Reberc

Hi,

How to set the default operator of a second date filter which is different from first,

I have attached the screenshot for two different operator i need in case of date filter.

Hi, 

How do I create a multi-row cell in footer? I have attached a screenshot as reference. Thank you

Hi,

Good day!

Thanks for this wonderful library - we actually have a paid license in using ReactKendo.

Just a concern, because right now we are using TypeScript for us to improve our code quality but most of the Components in KendoReact is using any and not even allowing to pass a generic type.

Like for example in using KendoGrid - the data has `any` property so when rowClick is triggered, it returns `any` data type for `dataItem`

So what I did was, I wrapped the KendoGrid Component that would allow Type-Safety and override the `onRowClick` and any other functions that involve sending `dataItem` property.

Thanks!

Best Regards,

Lee