@granite-elements/granite-clipboard - npm Package Compare versions

Comparing version 3.1.1 to 4.0.0

package.json

 {
+  "name": "@granite-elements/granite-clipboard",
+  "version": "4.0.0",
   "description": "A lightweight element wrapping-up clipboard.js",
@@ -14,16 +16,56 @@ "keywords": [
   },
-  "name": "@granite-elements/granite-clipboard",
-  "main": "granite-clipboard.js",
-  "author": "Horacio Gonzalez <[e-mail]>",
+  "author": "granite-clipboard",
   "license": "MIT",
+  "main": "index.js",
+  "module": "index.js",
+  "scripts": {
+    "start": "es-dev-server --app-index demo/index.html --node-resolve --open --watch",
+    "lint:eslint": "eslint --ext .js,.html . --ignore-path .gitignore",
+    "format:eslint": "eslint --ext .js,.html . --fix --ignore-path .gitignore",
+    "lint:prettier": "prettier \"**/*.js\" --check --ignore-path .gitignore",
+    "format:prettier": "prettier \"**/*.js\" --write --ignore-path .gitignore",
+    "lint": "npm run lint:eslint && npm run lint:prettier",
+    "format": "npm run format:eslint && npm run format:prettier",
+    "test": "karma start --coverage",
+    "test:watch": "karma start --auto-watch=true --single-run=false",
+    "storybook": "start-storybook",
+    "storybook:build": "build-storybook"
+  },
   "dependencies": {
-    "@migrate-to-esm/clipboard": "2.0.1-1",
+    "@migrate-to-esm/clipboard": "2.0.6-1",
+    "lit-html": "^1.1.2",
     "lit-element": "^2.2.1"
   },
   "devDependencies": {
-    "@polymer/iron-demo-helpers": "^3.0.0-pre.19",
-    "@webcomponents/webcomponentsjs": "^2.0.0",
-    "wct-browser-legacy": "^1.0.0"
+    "@open-wc/demoing-storybook": "^2.0.0",
+    "@open-wc/eslint-config": "^2.0.0",
+    "@open-wc/prettier-config": "^0.1.10",
+    "@open-wc/testing": "^2.0.0",
+    "@open-wc/testing-karma": "^3.0.0",
+    "deepmerge": "^3.2.0",
+    "es-dev-server": "^1.23.0",
+    "eslint": "^6.1.0",
+    "husky": "^1.0.0",
+    "karma-firefox-launcher": "^1.3.0",
+    "lint-staged": "^8.0.0"
   },
-  "version": "3.1.1"
+  "eslintConfig": {
+    "extends": [
+      "@open-wc/eslint-config",
+      "eslint-config-prettier"
+    ]
+  },
+  "prettier": "@open-wc/prettier-config",
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  },
+  "lint-staged": {
+    "*.js": [
+      "eslint --fix",
+      "prettier --write",
+      "git add"
+    ]
+  }
 }

README.md

 [![Published on Vaadin  Directory](https://img.shields.io/badge/Vaadin%20Directory-published-00b4f0.svg)](https://vaadin.com/directory/component/LostInBrittanygranite-clipboard)
 [![Stars on vaadin.com/directory](https://img.shields.io/vaadin-directory/star/LostInBrittanygranite-clipboard.svg)](https://vaadin.com/directory/component/LostInBrittanygranite-clipboard)
 
-# granite-clipboard #
+# \<granite-clipboard>
 
-A simple, lightweight element wrapping-up [clipboard.js](https://clipboardjs.com/)
+A simple, lightweight element wrapping-up [clipboard.js](https://clipboardjs.com/).
 
+Built on [lit-element](https://github.com/Polymer/lit-element) following the [open-wc](https://github.com/open-wc/open-wc) recommendation.
 
-> Built on [lit-element](https://github.com/Polymer/lit-element)
->
 > The old Polymer 2.x-1.x version is available on the [`polymer-hybrid-1.x-2.x` branch](https://github.com/LostInBrittany/granite-clipboard/tree/polymer-hybrid-1.x-2.x).
 
 
+## Installation
+```bash
+npm i granite-clipboard
+```
 
-## Doc & demo
+## Usage
+```html
+<script type="module">
+  import 'granite-clipboard/granite-clipboard.js';
+</script>
 
-[https://lostinbrittany.github.io/granite-clipboard](https://lostinbrittany.github.io/granite-clipboard)
-
-
-## Usage example
-
-<!---
-```
-<custom-element-demo>
-  <template>
-    <script src="@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
-    <script src="@granite-elements/granite-clipboard/granite-clipboard.js"></script>
-    <next-code-block></next-code-block>
-  </template>
-</custom-element-demo>
-```
--->
-```html
 <granite-clipboard text="Text to be copied">
@@ -39,44 +29,66 @@ <div style="width:250px;height:50px;border-radius:5px;background-color:#aaaaff;cursor:pointer;">Click here</div>
 
+## Linting with ESLint, Prettier, and Types
+To scan the project for linting errors, run
+```bash
+npm run lint
+```
 
-## Install
+You can lint with ESLint and Prettier individually as well
+```bash
+npm run lint:eslint
+```
+```bash
+npm run lint:prettier
+```
 
+To automatically fix many linting errors, run
+```bash
+npm run format
+```
 
-Install the component using [npm](https://www.npmjs.com/):
+You can format using ESLint and Prettier individually as well
+```bash
+npm run format:eslint
+```
+```bash
+npm run format:prettier
+```
 
-```sh
-$ npm i @granite-elements/granite-clipboard 
+## Testing with Karma
+To run the suite of karma tests, run
+```bash
+npm run test
 ```
 
-Once installed, import it in your application:
+To run the tests in watch mode (for <abbr title="test driven development">TDD</abbr>, for example), run
 
-import '@granite-elements/granite-clipboard/granite-clipboard.js';
+```bash
+npm run test:watch
+```
 
+## Demoing with Storybook
+To run a local instance of Storybook for your component, run
+```bash
+npm run storybook
+```
 
+To build a production version of Storybook, run
+```bash
+npm run storybook:build
+```
 
-## Running demos and tests in browser
 
-1. Fork the `granite-clipboard` repository and clone it locally.
+## Tooling configs
 
-1. Make sure you have [npm](https://www.npmjs.com/) 
-and the [Polymer CLI](https://www.polymer-project.org/3.0/docs/tools/polymer-cli) installed.
+For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.
 
-1. When in the `granite-clipboard` directory, run `npm install` to install dependencies.
+If you customize the configuration a lot, you can consider moving them to individual files.
 
-1. Serve the project using Polyumer CLI:
+## Local Demo with `es-dev-server`
+```bash
+npm start
+```
+To run a local development server that serves the basic demo located in `demo/index.html`
 
-    `polymer serve --npm`
 
-1. Open the demo in the browser
-
-    - http://127.0.0.1:8080/components/@greanite-elements/granite-clipboard/demo
-
-
-## Attributes
-
-Attribute     | Type      | Default  | Description
----           | ---       | ---      | ---
-`text`        | *String*  | ``       | The text to copy
-`action`      | *String*  | `copy`   | The action to do (either `copy` or `cut`)  
-
-
 ## Contributing
@@ -83,0 +95,0 @@

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

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

Network access

Supply chain risk

This module accesses the network.

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

Improved metrics

Total package byte prevSize

34937

increased by180.98%

Number of package files

14

increased by100%

Lines of code

257

increased by102.36%

Number of lines in readme file

103

increased by13.19%

Worsened metrics

Dependency count

3

increased by50%

Dev dependency count

11

increased by266.67%

Number of medium supply chain risk alerts

2

increased byInfinity%

Dependency changes

• + Addedlit-html@^1.1.2

• + Added@migrate-to-esm/clipboard@2.0.6-1(transitive)

• - Removed@migrate-to-esm/clipboard@2.0.1-1(transitive)

• Updated@migrate-to-esm/clipboard@2.0.6-1