@aurodesignsystem/auro-dropdown - npm Package Compare versions

Comparing version 2.9.7 to 2.9.8

CHANGELOG.md

 # Semantic Release Automated Changelog
 
+## [2.9.8](https://github.com/AlaskaAirlines/auro-dropdown/compare/v2.9.7...v2.9.8) (2023-05-24)
+
+
+### Performance Improvements
+
+* **es5:** remove legacy es5 bundling resources [#188](https://github.com/AlaskaAirlines/auro-dropdown/issues/188) ([00fc103](https://github.com/AlaskaAirlines/auro-dropdown/commit/00fc103b0ccd06df0def6219e044ff191420956e))
+* **husky:** update .husky/pre-commit and necessary pre-commit actions ([1dd87cc](https://github.com/AlaskaAirlines/auro-dropdown/commit/1dd87cc6b69da2d5c9584655952784cec72142ae))
+* remove unused script ([6f13cd2](https://github.com/AlaskaAirlines/auro-dropdown/commit/6f13cd22e90d09b385dc743e10c679abf83159ff))
+* update general feedback for update node 18 ([af2692e](https://github.com/AlaskaAirlines/auro-dropdown/commit/af2692edfb6a5c74f57ed59f50ec0d3f84e442ad))
+* update to Lit2.0, TS support, issue templates, component registration extension and update to Node 18+ ([8432071](https://github.com/AlaskaAirlines/auro-dropdown/commit/843207104c7286d73f273265206ecf3496bb93f0))
+* update webcorestylesheets from "@alaskaairux/webcorestylesheets": "^3.7.3" into "@aurodesignsystem/webcorestylesheets": "^4.2.0" ([5566dbf](https://github.com/AlaskaAirlines/auro-dropdown/commit/5566dbf1c26c26d6d2c08e4ccff3bbff739da125))
+
 ## [2.9.7](https://github.com/AlaskaAirlines/auro-dropdown/compare/v2.9.6...v2.9.7) (2023-04-20)
@@ -4,0 +16,0 @@

package.json

@@ -10,3 +10,3 @@ {
   "name": "@aurodesignsystem/auro-dropdown",
-  "version": "2.9.7",
+  "version": "2.9.8",
   "description": "auro-dropdown HTML custom element",
@@ -20,9 +20,8 @@ "repository": {
   "engines": {
-    "node": ">=16.13.0"
+    "node": ">=18.15.0"
   },
   "dependencies": {
-    "@popperjs/core": "^2.11.6",
-    "chalk": "^4.1.2",
-    "lit-element": "^2.5.1",
-    "lit-html": "^1.4.1"
+    "@popperjs/core": "^2.11.7",
+    "chalk": "^5.2.0",
+    "lit": "^2.7.4"
   },
@@ -32,56 +31,47 @@ "peerDependencies": {
     "@alaskaairux/design-tokens": "^3.11.0",
-    "@alaskaairux/webcorestylesheets": "^3.7.3"
+    "@aurodesignsystem/webcorestylesheets": "^4.2.0"
   },
   "devDependencies": {
-    "@alaskaairux/design-tokens": "^3.12.2",
-    "@alaskaairux/webcorestylesheets": "^3.7.3",
+    "@alaskaairux/design-tokens": "^3.13.0",
+    "@aurodesignsystem/webcorestylesheets": "^4.2.0",
     "@aurodesignsystem/eslint-config": "^1.3.0",
-    "@commitlint/cli": "^17.4.3",
-    "@commitlint/config-conventional": "^17.4.3",
-    "@open-wc/testing": "^3.1.7",
-    "@rollup/plugin-commonjs": "^24.0.0",
-    "@rollup/plugin-node-resolve": "^15.0.1",
-    "@semantic-release/changelog": "^6.0.2",
+    "@commitlint/cli": "^17.6.3",
+    "@commitlint/config-conventional": "^17.6.3",
+    "@open-wc/testing": "^3.1.8",
+    "@rollup/plugin-node-resolve": "^15.0.2",
+    "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
-    "@semantic-release/npm": "^9.0.0",
-    "@web/dev-server": "^0.1.35",
-    "@web/test-runner": "^0.15.0",
-    "autoprefixer": "^10.4.13",
-    "babel-loader": "^9.1.0",
+    "@semantic-release/npm": "^10.0.3",
+    "@web/dev-server": "^0.2.1",
+    "@web/test-runner": "^0.16.1",
+    "autoprefixer": "^10.4.14",
     "compression": "^1.7.4",
     "concat": "^1.0.3",
-    "concurrently": "^7.6.0",
+    "concurrently": "^8.0.1",
     "copyfiles": "^2.4.1",
-    "core-js": "^3.27.1",
-    "eslint": "^8.34.0",
-    "eslint-plugin-jsdoc": "^40.0.0",
-    "husky": "^8.0.2",
+    "core-js": "^3.30.1",
+    "eslint": "^8.39.0",
+    "eslint-plugin-jsdoc": "^43.1.1",
+    "husky": "^8.0.3",
     "lodash": "^4.17.21",
     "markdown-magic": "^2.6.1",
-    "marked": "^4.2.5",
-    "nodemon": "^2.0.20",
+    "nodemon": "^2.0.22",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.20",
-    "postcss-custom-properties": "^13.1.3",
-    "postcss-discard-comments": "^5.0.1",
-    "postcss-rem-to-pixel": "^4.1.2",
-    "postcss-remove-rules": "^1.0.0",
+    "postcss": "^8.4.23",
+    "postcss-discard-comments": "^6.0.0",
     "postcss-selector-replace": "^1.0.2",
-    "prismjs": "^1.29.0",
-    "rollup": "^2.63.0",
-    "rollup-plugin-minify-html-literals": "^1.2.6",
-    "rollup-plugin-serve": "^1.1.0",
-    "rollup-plugin-terser": "^7.0.2",
-    "sass": "^1.58.1",
-    "semantic-release": "^19.0.5",
-    "stylelint": "^15.1.0",
+    "rollup": "^3.21.5",
+    "rollup-plugin-serve": "^2.0.2",
+    "semantic-release": "^21.0.2",
+    "stylelint": "^15.6.1",
     "stylelint-config-idiomatic-order": "^9.0.0",
-    "stylelint-config-standard": "^30.0.1",
-    "stylelint-config-standard-scss": "^7.0.1",
-    "stylelint-order": "^6.0.2",
-    "stylelint-scss": "^4.4.0",
+    "stylelint-config-standard": "^33.0.0",
+    "stylelint-config-standard-scss": "^9.0.0",
+    "stylelint-order": "^6.0.3",
+    "stylelint-scss": "^5.0.0",
+    "typescript": "^5.0.4",
     "wc-sass-render": "^1.4.0",
-    "web-component-analyzer": "^1.1.6",
+    "web-component-analyzer": "^1.1.7",
     "whatwg-fetch": "^3.6.2",
-    "yaml-lint": "^1.2.4"
+    "yaml-lint": "^1.7.0"
   },
@@ -140,21 +130,15 @@ "browserslist": [
   "scripts": {
-    "build": "npm-run-all build:sass sass:render dist:js build:api test build:markdownDocs bundler postinstall",
-    "build:ci": "npm-run-all sweep build",
+    "build": "npm-run-all build:sass sass:render dist:js bundler postinstall build:api types",
     "build:api": "wca analyze 'src/auro-dropdown.js' --outFiles docs/api.md",
-    "build:demo": "npm-run-all build demo:rm:build demo:new:build demo:copy:index demo:copy:demo demo:update:index",
-    "build:dev:assets": "npm-run-all build:sass:demo build:sass:component postCss:component sass:render build:docs",
-    "build:markdownDocs": "node scripts/generateDocs.js",
-    "build:docs": "npm run build:markdownDocs",
-    "build:sass": "npm-run-all build:sass:demo build:sass:component postCss:component sass:render",
-    "build:sass:demo": "sass --no-source-map demo:demo",
+    "build:dev:assets": "npm-run-all build:sass:component postCss:component sass:render",
+    "build:sass": "npm-run-all build:sass:component postCss:component sass:render",
+    "build:sass:dev": "npm-run-all build:sass:component postCss:component sass:render",
+    "build:sass:demo": "sass ./demo/sass/ --output ./demo/css/",
     "build:sass:component": "sass --no-source-map src:src",
     "build:watch": "nodemon -e scss,js,html --watch src --watch apiExamples --exec npm run build:dev:assets",
+    "build:demo": "npm-run-all build demo:rm:build demo:new:build demo:copy:index demo:copy:demo demo:update:index",
+    "build:docs": "node scripts/generateDocs.js",
     "bundler": "rollup -c",
     "bundler:test": "rollup -c -w",
     "scssLint": "stylelint \"./src/**/*.scss\"",
-    "demo:copy:demo": "copyfiles -u 1 -V './demo/demo.md' ./build/demo",
-    "demo:copy:index": "copyfiles -u 1 -V './demo/index.html' ./build",
-    "demo:new:build": "mkdir ./build && mkdir ./build/css && mkdir ./build/demo",
-    "demo:rm:build": "rm -rf ./build",
-    "demo:update:index": "node ./scripts/prepForBuild",
     "dev": "concurrently --kill-others 'npm run build:watch' 'npm run serve'",
@@ -164,5 +148,5 @@ "dist:js": "copyfiles -u 1 -V './src/**/*.js' ./dist",
     "linters": "npm-run-all scssLint esLint",
-    "preCommit": "node scripts/pre-commit.js",
+    "preCommit": "node scripts/pre-commit.mjs",
     "postCss:component": "node ./scripts/postCss.js",
-    "postinstall": "node packageScripts/postinstall.js",
+    "postinstall": "node packageScripts/postinstall.mjs",
     "sass:render": "sass-render src/*.css -t ./scripts/staticStyles-template.js",
@@ -173,4 +157,5 @@ "serve": "web-dev-server --open demo/ --node-resolve --watch",
     "test:watch": "wtr --watch",
-    "prepare": "husky install"
+    "prepare": "husky install",
+    "types": "tsc"
   }
 }

README.md

@@ -72,18 +72,21 @@ <!--
 
-## Install bundled assets from CDN
+## CDN Use
 
-In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Two bundles are available -- `auro-dropdown__bundled.js` for modern browsers and `auro-dropdown__bundled.es5.js` for legacy browsers (including IE11).
+In cases where the project is not able to process JS assets, there are pre-processed assets available for use.
 
-Since the legacy bundle includes many polyfills that are not needed by modern browsers, we recommend you load these bundles using [differential serving](https://philipwalton.com/articles/deploying-es2015-code-in-production-today/) so that the browser only loads the bundle it needs. To accomplish this, the script tag for the modern bundle should have `type="module"` and the script tag for the legacy bundle should have the `nomodule` attribute. See the example below.
+### Install
+Include the following example HTML code in the `<head>` element of your page.
 
-### Bundle example code
-
 ```html
-<!-- **NOTE:** Be sure to replace `@latest` in the URL with the version of the asset you want. @latest is NOT aware of any MAJOR releases, use at your own risk. -->
-<link rel="stylesheet" href="https://unpkg.com/@alaskaairux/design-tokens@latest/dist/tokens/CSSCustomProperties.css" />
-<link rel="stylesheet" href="https://unpkg.com/@alaskaairux/webcorestylesheets@latest/dist/bundled/essentials.css" />
-<script src="https://unpkg.com/@aurodesignsystem/auro-dropdown@latest/dist/auro-dropdown__bundled.js" type="module"></script>
-<script src="https://unpkg.com/@aurodesignsystem/auro-dropdown@latest/dist/auro-dropdown__bundled.es5.js" nomodule></script>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/tokens/CSSCustomProperties.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/essentials.css" />
+<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-dropdown@latest/dist/auro-dropdown__bundled.js" type="module"></script>
 ```
 
+**NOTE:** Be sure to replace `@latest` in the URL with the version of the asset you want. @latest is NOT aware of any MAJOR releases, use at your own risk.
+
+### CDN options
+
+Both [Unpkg](https://www.unpkg.com/) and [JSDelivr](https://www.jsdelivr.com/) are free open source options that you can use. These are 3rd party resources and Auro is not responsible for their uptime. **Use at your own risk.** These bundle resources are included with the npm package, you are free to use any CDN resource that fits your needs.
+
 ## auro-dropdown use cases
@@ -90,0 +93,0 @@

src/auro-dropdown.js

@@ -8,3 +8,3 @@ // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 
-import { LitElement, html, css } from "lit-element";
+import { LitElement, html } from "lit";
 import styleCss from "./style-css.js";
@@ -128,5 +128,3 @@ import Popover from "../lib/popover";
   static get styles() {
-    return css`
-      ${styleCss},
-    `;
+    return [styleCss];
   }
@@ -133,0 +131,0 @@

src/style-css.js

@@ -1,2 +0,2 @@
-import {css} from 'lit-element';
+import {css} from 'lit';
 export default css`.popover{display:inline-block;box-sizing:border-box;border-width:1px;border-style:solid;border-color:transparent;background-color:var(--auro-color-background-lightest);box-shadow:-2px 0 5px 2px rgba(0, 0, 0, 0.08),0 2px 5px 1px rgba(0, 0, 0, 0.08);color:var(--auro-color-text-primary-on-light)}.label{color:var(--auro-color-text-secondary-on-light);font-size:var(--auro-text-body-size-xs);line-height:var(--auro-text-body-size-default)}.trigger{position:relative;display:flex;align-items:center;border-width:1px;border-style:solid;border-color:transparent;background-color:var(--auro-color-background-lightest);color:var(--auro-color-text-primary-on-light)}.trigger:focus-within,.trigger:active{border-color:var(--auro-color-border-active-on-light)}.trigger:focus-within:not(:active){box-shadow:inset 0 0 0 1px var(--auro-color-ui-default-on-light)}@media(hover: hover){.trigger:hover{cursor:pointer}}.triggerContentWrapper{flex:1}#showStateIcon{display:flex;height:100%;align-items:center;margin-left:var(--auro-size-xs);color:var(--auro-color-icon-primary-on-light)}#showStateIcon auro-icon{height:1.5rem;line-height:1.5rem}#showStateIcon[data-expanded=true] auro-icon{transform:rotate(-180deg)}.helpText{margin-top:4px;color:var(--auro-color-text-secondary-on-light);font-size:var(--auro-text-body-size-xs);line-height:var(--auro-text-body-size-default)}:host(:not([data-show])) .popover{display:none}:host([data-show]) .popover{z-index:var(--auro-depth-tooltip)}:host([common]) .trigger,:host([common]) .popover,:host([rounded]) .trigger,:host([rounded]) .popover{overflow:hidden;border-radius:var(--auro-border-radius)}:host([common]) .trigger,:host([inset]) .trigger{padding:var(--auro-size-xs) var(--auro-size-sm)}:host([disabled]){pointer-events:none}:host([disabled]) .trigger,:host([disabled]) .label,:host([disabled]) #showStateIcon{color:var(--auro-color-text-disabled-on-light)}:host([common]) .trigger,:host([bordered]) .trigger{border-color:var(--auro-color-border-primary-on-light)}:host([common]) .trigger:active,:host([common]) .trigger:focus-within,:host([bordered]) .trigger:active,:host([bordered]) .trigger:focus-within{border-color:var(--auro-color-border-active-on-light)}:host([error]) .helpText{color:var(--auro-color-text-error-on-light)}:host([error]) .trigger{border-color:var(--auro-color-border-error-on-light);box-shadow:inset 0 0 0 1px var(--auro-color-border-error-on-light)}:host([error]) .trigger:focus-within{border-color:var(--auro-color-border-active-on-light);box-shadow:none}:host([error]) .trigger:active{border-color:var(--auro-color-border-active-on-light);box-shadow:inset 0 0 0 1px var(--auro-color-border-active-on-light)}:host([disabled][common]) .trigger,:host([disabled][bordered]) .trigger{border-color:var(--auro-color-border-disabled)}:host([common][error]) .trigger,:host([bordered][error]) .trigger{border-color:var(--auro-color-border-error-on-light);box-shadow:inset 0 0 0 1px var(--auro-color-border-error-on-light)}:host([common][error]) .trigger:focus-within,:host([bordered][error]) .trigger:focus-within{border-color:var(--auro-color-border-active-on-light);box-shadow:none}:host([common][error]) .trigger:active,:host([bordered][error]) .trigger:active{border-color:var(--auro-color-border-active-on-light);box-shadow:inset 0 0 0 1px var(--auro-color-border-active-on-light)}:host([onDark]) .trigger{color:var(--auro-color-text-primary-on-dark)}:host([onDark]) .trigger:focus-within{border-color:var(--auro-color-border-active-on-dark);box-shadow:none}:host([onDark]) .trigger:active{border-color:var(--auro-color-border-active-on-dark);box-shadow:inset 0 0 0 1px var(--auro-color-border-active-on-dark)}:host([onDark]) .label,:host([onDark]) .helpText{color:var(--auro-color-text-secondary-on-dark)}:host([onDark]) #showStateIcon{color:var(--auro-color-icon-primary-on-dark)}@media(hover: hover){:host([onDark]) .trigger:hover{background-color:rgba(178, 178, 178, 0.1)}}:host([onDark][error]) .helpText{color:var(--auro-color-text-error-on-dark)}:host([onDark][error]) .trigger{border-color:var(--auro-color-border-error-on-dark);box-shadow:inset 0 0 0 1px var(--auro-color-border-error-on-dark)}:host([onDark][error]) .trigger:focus-within{border-color:var(--auro-color-border-active-on-dark);box-shadow:none}:host([onDark][error]) .trigger:active{border-color:var(--auro-color-border-active-on-dark);box-shadow:inset 0 0 0 1px var(--auro-color-border-active-on-dark)}:host([onDark][disabled]) .trigger,:host([onDark][disabled]) .label,:host([onDark][disabled]) .helpText{color:var(--auro-color-text-disabled-on-dark)}:host([onDark][disabled][bordered]) .trigger{border-color:var(--auro-color-border-disabled-on-dark)}`;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Install scripts

Supply chain risk

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Install scripts

Supply chain risk

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

194274

increased by3.81%

Dependency count

6

decreased by-14.29%

Dev dependency count

42

decreased by-17.65%

License quality

100

increased by25%

Lines of code

2706

increased by113.41%

Number of lines in readme file

152

increased by2.01%

Worsened metrics

Number of package files

21

decreased by-70.83%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedlit@^2.7.4

• + Added@aurodesignsystem/webcorestylesheets@4.8.0(transitive)

• + Added@lit-labs/ssr-dom-shim@1.2.1(transitive)

• + Added@lit/reactive-element@1.6.3(transitive)

• + Added@types/trusted-types@2.0.7(transitive)

• + Addedlit@2.8.0(transitive)

• + Addedlit-element@3.3.3(transitive)

• + Addedlit-html@2.8.0(transitive)

• - Removedlit-element@^2.5.1

• - Removedlit-html@^1.4.1

• Updated@popperjs/core@^2.11.7

• Updatedchalk@^5.2.0