posthtml-attrs-parser - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

package.json

 {
   "name": "posthtml-attrs-parser",
-  "version": "0.1.1",
-  "description": "PostHTML helper that gives a better API to work with tag's attrs",
-  "main": "index.js",
+  "version": "0.1.2",
+  "description": "PostHTML helper that provides a better API to work with tag attributes.",
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "main": "dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "files": [
+    "dist"
+  ],
   "author": "Kirill Maltsev <[e-mail]>",
   "license": "MIT",
   "scripts": {
-    "compile": "rm -f lib/*.js && node_modules/.bin/babel -d lib/ lib/",
-    "lint": "node_modules/.bin/eslint *.js lib/*.es6 test/",
-    "pretest": "npm run lint && npm run compile",
-    "test": "node_modules/.bin/_mocha --compilers js:babel-core/register",
-    "prepublish": "npm run compile"
+    "dev": "vitest",
+    "release": "np",
+    "build": "unbuild",
+    "prepack": "unbuild",
+    "lint": "eslint lib/*.js",
+    "pretest": "npm run lint",
+    "test": "vitest run --coverage"
   },
@@ -19,31 +32,23 @@ "keywords": [
     "html",
-    "postproccessor",
-    "parser"
+    "post-processor",
+    "parser",
+    "attributes"
   ],
-  "babel": {
-    "presets": [
-      "es2015"
-    ]
+  "devDependencies": {
+    "@vitest/coverage-v8": "^1.2.1",
+    "eslint": "^8.57.0",
+    "np": "^10.0.0",
+    "posthtml": "^0.16.6",
+    "unbuild": "^2.0.0",
+    "vitest": "^1.2.1"
   },
-  "dependencies": {
-    "object-assign": "^4.0.1"
+  "engines": {
+    "node": ">=16.0.0"
   },
-  "devDependencies": {
-    "babel-cli": "^6.3.15",
-    "babel-core": "^6.3.15",
-    "babel-eslint": "^4.1.6",
-    "babel-preset-es2015": "^6.3.13",
-    "eslint": "^1.10.3",
-    "expect": "^1.13.0",
-    "mocha": "^2.3.4",
-    "posthtml": "^0.8.0"
-  },
   "repository": {
     "type": "git",
-    "url": "git://github.com/maltsev/posthtml-attrs-parser.git"
+    "url": "https://github.com/posthtml/posthtml-attrs-parser.git"
   },
-  "bugs": {
-    "url": "https://github.com/maltsev/posthtml-attrs-parser/issues"
-  },
-  "homepage": "https://github.com/maltsev/posthtml-attrs-parser"
+  "bugs": "https://github.com/posthtml/posthtml-attrs-parser/issues",
+  "homepage": "https://github.com/posthtml/posthtml-attrs-parser"
 }

README.md

@@ -1,28 +0,43 @@
-# PostHTML Attrs Parser
-[![npm version](https://badge.fury.io/js/posthtml-attrs-parser.svg)](http://badge.fury.io/js/posthtml-attrs-parser)
-[![Build Status](https://travis-ci.org/maltsev/posthtml-attrs-parser.svg?branch=master)](https://travis-ci.org/maltsev/posthtml-attrs-parser)
+<div align="center">
+  <img width="150" height="150" alt="PostHTML" src="https://posthtml.github.io/posthtml/logo.svg">
+  <h1>posthtml-attrs-parser</h1>
+  <p>PostHTML plugin for parsing HTML attributes</p>
 
-[PostHTML](https://github.com/posthtml/posthtml) helper that gives a better API to work with tag's attrs.
+  [![Version][npm-version-shield]][npm]
+  [![Build][github-ci-shield]][github-ci]
+  [![License][license-shield]][license]
+  [![Downloads][npm-stats-shield]][npm-stats]
+</div>
 
+[npm]: https://www.npmjs.com/package/posthtml-attrs-parser
+[npm-version-shield]: https://img.shields.io/npm/v/posthtml-attrs-parser/old-stable
+[npm-stats]: http://npm-stat.com/charts.html?package=posthtml-attrs-parser
+[npm-stats-shield]: https://img.shields.io/npm/dt/posthtml-attrs-parser.svg
+[github-ci]: https://github.com/posthtml/posthtml-attrs-parser/actions/workflows/nodejs.yml
+[github-ci-shield]: https://github.com/posthtml/posthtml-attrs-parser/actions/workflows/nodejs.yml/badge.svg
+[license]: ./license
+[license-shield]: https://img.shields.io/npm/l/posthtml-attrs-parser.svg
 
+A [PostHTML](https://github.com/posthtml/posthtml) helper plugin that provides a better API for working with tag attributes.
+
 ## Usage
 ```js
-var posthtml = require('posthtml'),
-    parseAttrs = require('posthtml-attrs-parser');
+import posthtml from 'posthtml';
+import parseAttrs from 'posthtml-attrs-parser';
 
 posthtml()
-    .use(function (tree) {
-        var div = tree[0],
-            attrs = parseAttrs(div.attrs);
+  .use(function (tree) {
+    const div = tree[0];
+    const attrs = parseAttrs(div.attrs);
 
-        attrs.style['font-size'] = '15px';
-        attrs.class.push('title-sub');
+    attrs.style['font-size'] = '15px';
+    attrs.class.push('title-sub');
 
-		// Compose attrs back to PostHTML-compatible format
-        div.attrs = attrs.compose();
-    })
-    .process('<div class="title" style="font-size: 14px">Hello!</div>')
-    .then(function (result) {
-        console.log(result.html);
-    });
+    // Compose attributes back to PostHTML-compatible format
+    div.attrs = attrs.compose();
+  })
+  .process('<div class="title" style="font-size: 14px">Hello!</div>')
+  .then(function (result) {
+    console.log(result.html);
+  });
 
@@ -32,20 +47,32 @@ // <div class="title title-sub" style="font-size: 15px">Hello!</div>
 
+Both ESM and CJS exports are provided, you can use the plugin in CJS too:
 
+```js
+const posthtml = require('posthtml');
+const parseAttrs = require('posthtml-attrs-parser');
+
+// ...
+```
+
 ## Attributes
-Only `style` and `class` attributes are parsed by default (as object and array, respectively).
-For other attributes the parsing rules should be specified (see "Custom parsing rule" below).
 
+Only `style` and `class` attributes are parsed by default (as object and array, respectively). For other attributes, the parsing rules should be specified (see [Custom parsing rule](#custom-parsing-rule) below).
 
 ### Default attributes
+
 #### `style`
+
+```html
+<div style="color: red; font-size: 14px; color: blue"></div>
+```
 ```js
-// <div style="color: red; font-size: 14px; color: blue"></div>
-var attrs = parseAttrs(div.attrs);
+const attrs = parseAttrs(div.attrs);
+
 console.log(attrs.style);
 /*
 {
-    // If there is several properties with the same name,
-    // then the values are packed in array
-    'color': ['red', 'blue'],
-    'font-size': '14px'
+  // If there are several properties with the same name,
+  // the values are packed in array
+  'color': ['red', 'blue'],
+  'font-size': '14px'
 }
@@ -55,7 +82,10 @@ */
 
+#### `class`
 
-#### `class`
+```html
+<div class="title title-sub"></div>
+```
 ```js
-// <div class="title title-sub"></div>
-var attrs = parseAttrs(div.attrs);
+const attrs = parseAttrs(div.attrs);
+
 console.log(attrs.class);
@@ -65,19 +95,23 @@ // ['title', 'title-sub']
 
-
 ### Custom parsing rule
-You can also define the parsing rule for other attributes.
 
+You may also define the parsing rule for other attributes.
+
 #### Array-like attribute
+
+```html
+<div data-ids="1  2 4 5   6"></div>
+```
 ```js
-// <div data-ids="1  2 4 5   6"></div>
-var attrs = parseAttrs(div.attrs, {
-    rules: {
-		'data-ids': {
-			delimiter: /\s+/,
-            // Optional parameter for stringifying attribute's values
-            // If not set, glue = delimiter
-			glue: ' '
-		}
-	}
+const attrs = parseAttrs(div.attrs, {
+  rules: {
+  'data-ids': {
+    delimiter: /\s+/,
+    // Optional parameter for stringifying attribute's values
+    // If not set, glue = delimiter
+    glue: ' '
+  }
+}
 });
+
 console.log(attrs['data-ids']);
@@ -90,23 +124,25 @@ // ['1', '2', '4', '5', '6']
 
+#### Object-like attribute
 
-#### Object-like attribute
+```html
+<div data-config="TEST=1;ENV=debug;PATH=."></div>
+```
 ```js
-// <div data-config="TEST=1;ENV=debug;PATH=."></div>
-var attrs = parseAttrs(div.attrs, {
-	rules: {
-		'data-config': {
-            // Delimiter for key-value pairs
-			delimiter: ';',
-            // Delimiter for a key-value
-			keyDelimiter: '=',
+const attrs = parseAttrs(div.attrs, {
+  rules: {
+    'data-config': {
+      // Delimiter for key-value pairs
+      delimiter: ';',
+      // Delimiter for a key-value
+      keyDelimiter: '=',
+      // Optional parameter for stringifying key-value pairs
+      // If not set, keyGlue = keyDelimiter
+      glue: '; ',
+      // Optional parameter for stringifying a key-value
+      // If not set, glue = delimiter
+      keyGlue: ' = '
+    }
+  }
+});
 
-            // Optional parameter for stringifying key-value pairs
-            // If not set, keyGlue = keyDelimiter
-			glue: '; ',
-            // Optional parameter for stringifying a key-value
-            // If not set, glue = delimiter
-            keyGlue: ' = '
-		}
-	}
-});
 console.log(attrs['data-config']);
@@ -113,0 +149,0 @@ // {TEST: '1', ENV: 'debug', PATH: '.'}

New alerts

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

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

11280

increased by0.39%

Dependency count

0

decreased by-100%

Dev dependency count

6

decreased by-25%

Lines of code

173

increased by2.98%

Number of lines in readme file

150

increased by31.58%

Is type module

Yes

Worsened metrics

Number of package files

5

decreased by-37.5%

Number of low maintenance alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• - Removedobject-assign@^4.0.1

• - Removedobject-assign@4.1.1(transitive)