npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

availity-angular

v4.3.0

Published

Availity Angular SDK

Downloads

392

Readme

availity-angular

Availity Angular SDK

License NPM Build

Table of Contents

Intro

Demo

availity.github.io/availity-angular

Supported Browsers

  • Internet Explorer 9 and newer
  • Google Chrome
  • Mozilla Firefox

Other browsers should be supported as well but you may experience some issues.

Migrating to angularjs 1.7.x to 1.8.2

Version 4.2.0 of availity-angular is migration from 1.7.x angular to 1.8.2. In addition, jquery is updated to 3.6.0, to satisfy security requirements. The primary change of what is fixed with security update can be explained with jquery upgrade guide located here https://jquery.com/upgrade-guide/3.5/.
Note: 1.7.x to 1.8.2 is really just an update underlying jquery component embeded in angularjs, and since availity-angular overrides this by including the full jquery. The real upgrade is just the jquery upgrade.

Here is list of known issues with upgrade.

  • Self-closing tags, like "<div/> <span/> <p/>". As referenced in upgrade-guide, jquery no changes these tags. The result of which is if you have some template like following in your page it will not display and actually cause page to stop rendering due to unmatching tags.

    <div class="broken">
         <p>This would display before tag.</p>
         <div data-my-directive/> 
         <p>But directive and items after might not display.</p>
     </div>
    
     <div class="fixed">
         <p>Fix is to change to remove self closing empty html tag</p>
         <div data-my-directive></div> 
         <p>Now this should display.</p>
     </div>
    
    <div class="nochange">
         <p>Tags that html supports as self closing tags do not need to change since they are not effected.</p> 
          <span>Example: All the following are valid</span>
          <input data-my-directive />
          <input data-my-directive >
          <img data-my-directive />
          <img data-my-directive >
    </div>

    Unfortunately not good solution to this fix besides just fixing tags. Luckily this regex from here seems to be pretty code at replacing. https://www.reddit.com/r/regex/comments/6mpc7b/replace_invalid_selfclosing_nonvoid_html_tags/ In editor that supports reg expression replace use following:

    find: <(?!area|base|br|col|command|embed|hr|img|input|keygen|link|meta|param|source|track|wbr)([a-z|A-Z|_|\-|:|0-9]+)([^>]*)\/>
    replace: <$1$2></$1>
  • bootstrap-datapicker issue. One issue noticed on upgrading is that some projects where getting issue where AvDatepicker was no longer working. This seemed to be dependency resolution where bootstrap-datepicker was pulling in one version of jquery and application was using 3.6 version. The fix was to force resolution to same version using resolution block.

      "resolutions": {
        "jquery": "3.6.0"
      }
  • uglify-js 3.11.x issue. Although not related angularjs upgrade an issue was noticed with dependencies. After some effort it was found with uglify-js 3.11.x or greater, the signature of some constructors where changed. In particular the av-block directive's BlockController was effected causing console error "regExp --> regExpProvider not found". Error would only show up on production builds of project. The fix for this is locking in ugligfy-js to 3.10.4.

     "resolutions": {
       "jquery": "3.6.0",
       "uglify-js": "3.10.4",
       "uglifyjs-webpack-plugin": "2.2.0"
     },

Quickstart

Install the Availity Angular SDK with npm.

$ npm install availity-angular --save

Acknowledgments

The Availity Angular lib was heavily inspired by multiple open source frameworks. If for some reason a library could not be used directly (IE9 limitation), we've reused that projects code directly in this project. Please check out the libs below for some beautifully written code.

Contributing

Dependency Status

  1. Ensure release is occurring on master branch: git checkout master
  2. Run npm install to ensure dependencies are up to date.
  3. Run npm test and ensure all test are passing
  4. Run npm run release

License

Copyright (c) 2017-present Availity, LLC. Code released under the the MIT license