Hello,

I'm using latest next.js framework, with Dart Sass 1.63.4. I've been trying to customize material theme, see:

Sample app

However, I'm encountering this error:

Syntax error: Selector "[hidden]" is not pure (pure selectors must contain at least one local class or id)

I've been following the documentation.

Hi All,

IS there any chance to add keyboard event support like tab stop for Chart component interaction events?

Or is there any demo to best practice of doing that?

Is there an out of the box, or an example of a customization, for adding pattern fills to Charts?

I know that custom svg treatments can be added via the ChartSeriesItem visual prop but I wasn't sure if that was the correct approach or if there was a simpler method.

I also want to understand if all charts can have pattern fills or if there are limitations.

We are doing an accessibility audit and adding patterns was suggested as an accessibility enhancement.

Thanks in advance.

Hello,

I am using PDFExport, and in text there are also some German characters (Ü Ö Ä ).

When I open the created PDF, then the text is not right.

Example of created PDF:

 I also tried this on StackBlitz and it is the same output.

Text example:

ÜÖÄLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer felis libero, lobortis ac rutrum quis, varius a velit. Donec lacus erat, cursus sed porta quis, adipiscing et ligula. Duis volutpat, sem pharetra accumsan pharetra, mi ligula cursus felis, ac aliquet leo diam eget risus. Integer facilisis, justo cursus venenatis vehicula, massa nisl tempor sem, in ullamcorper neque mauris in orci.

What can I dot that the text will be displayed correctly.

Thank, you, Matjaz Reberc

Hi,

I have a problem when I use k-grid: When the vertical scroll bar appears on the page, the horizontal scroll bar of k-grid cannot be scrolled with the mouse, but can be scrolled with the touch pad

you can try in  React (forked) - StackBlitz

Since my page also needs to display other information, if the height is set for the k-grid, the visible area of the table is too small and not easy to read, what should I do to solve the issue.

Thanks a lot for each help.

Hi,

Do you have any example or advice how we could achieve the 2 scenarios:

1) We put custom filters in the command bar of the grid - one dropdown with categories, one text box with product name search - custom filters, not column filters

We want to make them prepopulated with initial state and grid already filtered when we land on the page - e.g. url is ?categoryId=5&product=MY PRODUCT

And when the grid opens, already in dropdown with Categories a category with id 5 is preselected, and in the textbox already text for filtering MY PRODUCT is entered, and both values are already used as initial query values with the data shown in the grid



2) Also an external link behavior...we have an inline editable grid which has an ID column

And we call the page with something like ?Id=23&mode=edit

Result is that the row with ID = 23 is already in edit model (cells changed to inputs and state of row to edit) for that row with ID 23



We did it in the past with JQuery and ASP.NET with your grids, but would now like to do these 2 scenarios with your KendoReact Grid.

Can these 2 scenarios be done?

Thnx!

Sanja

Ok I actually started asking this question but I think I figured it out in the process of trying to get an example.  However, still posting here as I think it could help someone, plus the behavior seems a bit like a bug to me.

What I was trying to do is create a grid with a toolbar with various tools.  The list of available tools changes based on if the user is an admin or not (some tools are hidden for non-admins).  The basic pseudo-code I'm using for this is as follows:

<Grid ...other options>
    <GridToolbar>
        <Button ... />
        { isAdmin && <Button ... /> }
    </GridToolbar>
    { ... columns }
</Grid>

Basically, making the second button conditional on a variable (in this case a props bool variable that is passed to the component).  This works just fine on the page and it renders properly based on that variable.  However, when you export to Excel you get this error:

Uncaught TypeError: Cannot read properties of undefined (reading 'children')
    at ExcelExport._this.extractChild (ExcelExport.js:55:1)
    at ExcelExport.js:47:1
    at Array.map (<anonymous>)
    at ExcelExport._this.extractColumns (ExcelExport.js:45:1)
    at ExcelExport._this.extractChild (ExcelExport.js:54:1)
    at ExcelExport.js:47:1
    at Array.map (<anonymous>)
    at ExcelExport._this.extractColumns (ExcelExport.js:45:1)
    at ExcelExport.workbookOptions (ExcelExport.js:138:1)
    at ExcelExport.toDataURL (ExcelExport.js:119:1)

The toolbar shouldn't have anything to do with the Excel export so I would consider this a bug.  The workaround I have found is to return an empty div if the tool should not show up.  Like this:

<Grid ...other options>
    <GridToolbar>
        <Button ... />
        { isAdmin ? <Button ... /> : <div /> }
    </GridToolbar>
    { ... columns }
</Grid>