Echo JS 0.11.0

For react components, be sure to have a peer-dependency with an appropriate range setup for your features used.

For example:

    "peerDependencies": {
      "react": ">=16.11.0 <18.0.0"

Start with the version of react you're testing against and up to the version after next.  React does very well at not removing features until a version after next... in the example above, 16.11.0 has the feature needed, and your component is up to date, and not using anything marked deprecated.  This way you can generally rely on the features in use until the version after next (18).

----

On a typescript definition file, this also is beneficial to all users of VS Code, or where code completion is based on or enhanced by typescript definitions, including JS usage in VS Code.

----

On publishing, if you're on a public repository, and you should probably be for public packages, you should use a CI/CD pipeline based on a trigger, tag or admin comment for a release on PR approval.  It's relatively easy to automate. 

If you're creating a fork of an existing project, prefer namespacing for your package naming... it will help to avoid confusing names like foo3, etc where @yourid/foo would be better.

Interesting.. not sure why one might want this over straight svg support though.

Don't use the pre-built CSS in practice... setup your SCSS processor, and reference the built-ins directly... copy the main scss, update the paths and comment out the pieces you aren't using... override your variables (colors, details, options) and build directly.  This will help you if you're integrating other tooling.  Devs tend to make the mistake of modifying the original css build to change colors etc, and it winds up breaking things.  Worse is when designers do it, and release patch css files for components, with a lot of duplications and more bugs.

Use the source, it's there for you.

Angular is probably not something you should jump into from a tutorial, if you aren't working against an existing project, you probably want to start with a good book, or from the getting started documentation[1].

Also, you probably don't want to work with Bootstrap this way... you should probably look toward ng-bootstrap[2] or another library meant for integration into the framework.  You may also want to look into material design[3].

1. https://angular.io/start
2. https://ng-bootstrap.github.io/
3. https://material.angular.io/

Aside: Personally, I don't like Angular, I've used it from the old AngularJS to some of the newer versions.  The DSL, API and complexity just irritate me.  Creating just a simple hello world component in Angular compared to React or Vue will show you why you probably don't want to dive down that rabbit hole.  Over half of Angular developers wouldn't want to use it again, and I've only ever met one developer who has worked with Angular and either React or Vue and would choose Angular... all of the rest would choose mostly React and a couple for Vue.

I would suggest fclone for your deep cloning, which will handle the non-iterable properties from errors, as well as typed arrays.

This is about the only place I would choose Vue over React is when I'm enhancing an existing, mostly static site/app.  I feel the story is a lot better here for Vue.  On the flip side, I find that for entire applications, I like React much better than everything else.

Cool.. wish it were more widely supported...  Could probably do similar with a detached canvas to a URL string.

https://caniuse.com/#feat=css-paint-api
https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL

cute...

I have a relatively limited set of plugins I use though, and this is unlikely to make it onto the list.  Would suggest, if you are considering it, to audit the code and the dependency code, then dev install.

Not saying this is a bad extension, only that with all that has come to light recently on plugins, trust is limited.

I really like the date picker... it's like an updated MS Ajax Toolkit picker, which imho is about the most intuitive layout for this component.

"React's use of JSX results in a steeper learning curve as you must learn this on top of familiarizing yourself with the library."

I cannot disagree more... JSX is an XML syntax mostly similar to html in it's lowest common denominator + JavaScript.  For someone who should be familiar with JS and HTML going in, JSX is much less of a learning curve than a specific rendering DSL like Angular or others in practice.

The co-mingling of your component markup into your component JS is harder for those locked into a certain mindset to change, that does not make it harder conceptually.

Aside: materal-ui is the single nicest component library I have ever used in 24 years of working on web based applications.  I've seen and used a *LOT* of tools and frameworks over the years.  React + Material-UI feels right to me.