Telerik Forums
KendoReact Forum
1 answer
112 views

Hi Team, 

Please can you advise on the following error while building a TypeScript project using Vite?

[commonjs--resolver] Unexpected token (32:79) in /opt/actions-runner/_work/blue-file-operational-map-web/blue-file-operational-map-web/node_modules/@progress/kendo-react-ripple/dist/es/Ripple.js

Full stack error screenshot attached.

Thanks,

Grant

 

Grant
Top achievements
Rank 3
Iron
Iron
Iron
 answered on 26 May 2023
1 answer
72 views

Hello,

do you plan to support React server components? if so, when could it be?

Thanks

Kiril
Telerik team
 answered on 25 May 2023
1 answer
101 views

Hi guys, 

I'm trying to use the Typography component, but the margin is not being set. I obtained this example from the documentation.
React Common Utilities Library & Typography Component - Appearance - KendoReact Docs & Demos (telerik.com)


optimistic-cache-oslpq9 - CodeSandbox

All examples here have the same margin... is it a bug?

Thanks,


Vessy
Telerik team
 answered on 24 May 2023
0 answers
110 views

Hello,

I would like to customize theme, but as node-sass is deprecated I wanted to use sass npm package (https://www.npmjs.com/package/sass). Problem is that during compilation I get an error: "Syntax error: Selector "[hidden]" is not pure (pure selectors must contain at least one local class or id)". Is it possible to make it work? Do you plan to support sass package?

Thanks

Matúš
Top achievements
Rank 1
Iron
 asked on 24 May 2023
1 answer
139 views

We’re currently trying to make our web Application compliant with the WCAG standards, and right now it fails a few of the requirements. 

we're getting "The CSS outline or border style on this element makes it difficult or impossible to see the dotted link focus outline." accessibility issue.

After a lot of troubleshooting, we discovered that this problem is caused by a CSS file that comes from Kendo, a third-party tool we use. Unfortunately, we can't change that CSS file. We also tried to override the styling with our own, but the problem still persists.

all.scss , this is the file containing the css coming by importing this module,  @progress/kendo-theme-bootstrap/dist/all.scss

Kindly refer to attached file for more clarity.

(p.s. we're using sortsite standard for accessibility)

Vessy
Telerik team
 answered on 24 May 2023
0 answers
168 views

i am creating a upload component to upload file and images to DB via link.
following is the code snippet for the same
i am able to upload the files and images
but when editing the data, onAdd function is cancelling the upload


if i remove setSignImgPathAzure then component works fine but i need to set the state to empty string for other dependency

i tried with using callbacks and basic debugging
not able to solve the error

  const onChangeHandler = (event: UploadOnAddEvent) => {
      fieldRenderProps.onChange({ value: event.newState });
      setSignImgPathAzure("");

    };

 

<Upload
            className="k-mt-5"
            batch={false}
            multiple={true}
            defaultFiles={[]}
            withCredentials={false}
            saveUrl={LOGO_UPLOAD_SAVE}
            onAdd={onChangeHandler}
            onRemove={onRemoveHandler}
            onStatusChange={getImgPath}
            restrictions={{
              allowedExtensions: FIELD_ALLOWED_IMAGE_TYPES,
              maxFileSize: 2000000,
            }}

          />

 

 

 

 

 

Tejas
Top achievements
Rank 2
Iron
Iron
Iron
 asked on 24 May 2023
1 answer
178 views

Hey,

can i use google maps tile api or bing maps tile api with your https://www.telerik.com/kendo-react-ui/components/map/ ?

we search a good component which works with both (or three if you add openstreetmaps) maps. all customer have another mapsservice (bing, google or openstreet)

Do you have a example? And you dont have maps as tags ;)

Thank you for your reply

Filip
Telerik team
 answered on 23 May 2023
1 answer
211 views

Issues reported in GitHub too. Grid is failing accessibility. · Issue #1575 · telerik/kendo-react (github.com)

During accessibility testing, there are 5 violations. The violations are:

  • aria-required-children in Grid itself.
    image

And when add footerCell to only some of the columns, elements in .k-grid-footer have several violations

  • aria-allowed-attr in footer cell which column has no footerCell property.

    • Path: .k-table-td[aria-colindex="1"][role="columnfooter"]
    • Snippet: <td class="k-table-td" role="columnfooter" aria-selected="false" aria-colindex="1"></td>
    • How to fix: ARIA attribute is not allowed: aria-selected="false"
  • aria-allowed-role in colgroup in footer.

    • Path: .k-grid-footer-table > colgroup
    • Snippet: <colgroup role="presentation">
    • How to fix: ARIA role presentation is not allowed for given element
  • aria-roles in footer cell which column has no footerCell property.

    • Path: .k-table-td[aria-colindex="1"][role="columnfooter"]
    • Snippet: <td class="k-table-td" role="columnfooter" aria-selected="false" aria-colindex="1"></td>
    • How to fix: Role must be one of the valid ARIA roles: columnfooter

In pagination, the pageSize selector also have a violation.

  • aria-input-field-name: I guess it's because the span element have an input type role, but didn't meet the needs of an input.
    • Path: .k-pager-sizes > .k-dropdownlist.k-picker-solid[role="combobox"]
    • Snippet: <span class="k-dropdownlist k-picker k-picker-md k-rounded-md k-picker-solid" tabindex="0" role="combobox" aria-required="false" aria-haspopup="listbox" aria-expanded="false" aria-owns="d22e899f-3cc6-49c4-a4d2-d6153e17a2f6" aria-describedby="ea34d15b-a71a-48fa-a95d-d773f6fcb50a">
    • How to fix:
      • aria-label attribute does not exist or is empty
      • aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
      • Element has no title attribute

Package version: "@progress/kendo-react-grid": "^5.11.0". By the way, I checked the changelog and there is no related update.

Thanks for your help.

Filip
Telerik team
 answered on 23 May 2023
1 answer
62 views

Hello.


It's a picture that I want to make.


I want the chart to show two values and one should be shown above the chart and the other should be shown below.


I tried using the stack chart, but it didn't work out the way I wanted it to.


Can you make it like a picture using Kendo?

 

Filip
Telerik team
 answered on 22 May 2023
0 answers
164 views

Hello Telerik Support Team,
is it possible to customize the filter values of a GridColumnMenuCheckboxFilter to include spaces in the rendering and then arrive in the backend without it.

Otherwise the assignment to the corresponding member does not work correctly in the backend and the filter then follows the convention "no spaces" in the FE, which leads to not nice display values.

Here is a screenshot of the described scenario:

 

Thanks in advance

Christian
Top achievements
Rank 1
Iron
Iron
Iron
 updated question on 22 May 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?