React NPM Packages

React NPM Packages

Posted by: lovebondz on 14 September 2017, 2:51 am EST

• 

  lovebondz

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 14 September 2017, 2:51 am EST

  Are there plans for creating NPM Packages that could be consumed in a react application for Wijmo controls?

  Something along the lines of

  
  import FlexGrid from 'wijmo/flexgrid';
  ...
  const grid = (props) => { <FlexGrid {...props} /> };
  

  or

  
  import { FlexGrid } from 'wijmo';
  ...
  const grid = (props) => { <FlexGrid {...props} /> };
  

  this is currently the way, most components are used in the react ecosystem, bundled with webpack 2.

  Most applications across teams I’ve seen, had to disable linting in components that import Wijmo controls.

  
  // eslint-disable-next-line
  <Wj.FlexGrid ... />
  

  Since you currently have this supported for Angular Apps, could this be done for react apps too?

  I’d have to assume most of your customers are Angular devs, and that takes priority (although, I await the result of your survey), this would be a good way to really support developing in react with your controls.

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hi,
  
  This issue is still with our development team with tracking id 240095. We have requested for an update. We will let you know as soon as we get any update one this.

  Thanks,
  
  Manish Kumar Gupta

• 

  fwanicka

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Is there an ETA for this? Currently, we cannot use your controls with our build system. This will be a major factor in whether we purchase your software.

• 

  skochan

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hi,

  Sorry for the delay on this. This is on the to do list of our dev team for the next release.

  We should be able to have a pre-release build with NPM React packages by end of next month, the official release will follow soon after.

• 

  skochan

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hi,

  Yes, this is in the to do list of our dev team. Hopefully we should have some concrete updates in Feb 2017.

  We shall keep the community posted from time to time.

  Thanks,
  
  Abhishek

• 

  lovebondz

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Any updates as to when to expect a new release with the packages?

• 

  austinnichols

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Was this included as part of the 5.20171.282 release? It wasn’t clear which release was

  next

  …

  Please place me on the list of those who are waiting…

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hi,
  
  We are sorry, this release does not contain NPM package for React.
  
  Just for information, our development team is actively working on this and expected to be completed in the mid or end of May,2017.

  We assure you that once NPM Package will be included in release build or prerelease build, you will be notified here.

  Thanks ,
  
  Manish Kumar Gupta

• 

  fwanicka

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  What is the status of this issue?

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hi All,
  
  NPM packages for React has been included in latest build 5.20171.293 which can be downloaded from here.

  NPM Images for React can be found at the following location:
  
  Folder_Path\C1Wijmo-Eval_5.20171.293\NpmImages\wijmo-amd-min

  Thanks,
  
  Manish Kumar Gupta

• 

  fwanicka

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Thanks very much.

• 

  danotex1128

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hello, currently trying to incorporate Wijmo into a React project. The package.json references the files like what was explained in the Readme however that does not seem to work as expected.

  I either get an error of

   TS2605: JSX element type 'InputDate' is not a constructor function for JSX elements.
        Property 'setState' is missing in type 'InputDate'.

  Or I am unable to reference the package at all. I have tried multiple attempts. But I think I am just missing something somewhere?

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hi,
  
  Please refer to the following demo sample that depicts how to use React with external modules in react project.
  
  http://demos.wijmo.com/5/React/ReactExternalModules/ReactExternalModules/

  Hope it helps!

  Thanks,
  
  Manish Kumar Gupta

• 

  adam-dyson

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  I also get these errors everywhere. It’s probably because you are using some typings for react and the wijmo react components seem incompatible with them as the definition files just have all the components extending object rather than React.Component. They also seem to have incompatible constructor signatures that take the wijmo control type and not react context.

  TS2605: JSX element type 'InputDate' is not a constructor function for JSX elements. Property 'setState' is missing in type 'InputDate'.

  I got rid of the error by changing wijmo.react.base.d.ts to

  export declare class ComponentBase extends React.Component<any, {}> {

  but this is obviously not the best solution.

• 

  fwanicka

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Same here. I had to hack up the typings to get it to work at all. Now I am stuck trying to get the grid to work. That’s the main component we need. I finally found why it isn’t working in this thread:

  http://wijmo.com/topic/flexgrid-react-doesnt-update-when-i-change-the-data/

  No offense, but it doesn’t seem like your React integration has been tested much at all in any real world scenarios. It’s definitely not confidence-inspiring that I have to hack your typings to get a grid to render at all, and then I can never re-render it with updated data.

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hello,
  
  We are sorry, we are unable to replicate the issue with latest build 5.20171.300

  We tried with External module and Jquery files.

  If the issue persists, if possible, please share a demo sample depicting your issue so that we can debug and assist you accordingly.

  Thanks,
  
  Manish Kumar Gupta

• 

  fwanicka

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  That’s the build I’m using, along with the latest version of TypeScript, React and the typings for React. I noticed your demo code was using old versions of everything. Maybe that’s the difference.

  I am buried in other work at the moment, so I don’t have time to create a demo at the moment. I have seen this issue mentioned by people in a couple of other threads as well.

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hi,
  
  We are investigating on this.
  
  Thanks,
  
  Manish Kumar Gupta

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hello,
  
  Thank you for reporting this issue and additional information that help us in replicating issue.
  
  This issue requires further investigation. Hence, this issue has been escalated to the concerned team for further investigation with tracking id 265775.
  
  We will let you know as soon as we get any update on this.

  In the meantime, please replace Object with React.Component<any, {}> in wijmo.react.base.d.ts

  Thanks,
  
  Manish Kumar Gupta

• 

  jennifer-otoole

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hey there - Just wanted to also express my frustration in including Wijmo in my React projects.

  My renewal is in a month, and I’m now looking at other products as it’s not worth the hours I’ve drowned into trying to get this to work. It’s really disappointing because I really do like your product! But if it can’t integrate with webpack in react projects it’s no longer useful to me. If anything changes with this in the next month, please let me know.

• 

  manish-gupta1

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 2:51 am EST

  Hello Jennifer,
  
  The issue #265775 has been fixed today and can be verified using the following build 5.20172.341 (Aug 11, 2017).
  
  http://prerelease.componentone.com/wijmo5/Nightly_C1Wijmo_5.20172.341_2017.08.11.zip

  You can also get web pack sample with React external module within the samples folder at following location:
  
  “Nightly_C1Wijmo_5.20172.341_2017.08.11\Samples\TS\React\ReactExternalModules\ReactExternalModules”

  PS: The provided build is just for verifying only. It did not go through QA process.

  Thanks,
  
  Manish Kumar Gupta

• 

  noah.shipley

  • Post Options:
  • Link
    Copy

  Posted 4 October 2017, 2:08 pm EST

  I too am running into a lot of problems that seem inane. This should be as simple as a

  yarn add package

  The wijmo.react.ts that is included in my 2017 q1 distribution (Platinum license…) doesn’t seem to have many of the components listed at http://demos.wijmo.com/5/Angular/WijmoHelp/WijmoHelp/topic/wijmo.react.Module.html most notable the TreeView. What am I missing?

• 

  Charles.Curtis

  • Post Options:
  • Link
    Copy

  Posted 23 November 2017, 3:25 am EST

  Hey there! I appreciate that this functionality actually exists now, but I’m concerned that when using webpack2 you are required to conform to the build practice specified.

  I (and many other developers) use create-react-app to build/bundle/run and deploy:

  https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md

  I am not going to eject to use wijmo. Do you have any suggestions in this case?