Require Node.js 12.20 and move to ESM

index.d.ts

@@ -1,78 +1,70 @@
-/* eslint-disable no-redeclare */
-
-declare namespace srcset {
-	interface SrcSetDefinition {
-		url: string;
-		width?: number;
-		density?: number;
-	}
-
-	interface Options {
-		/**
-		When strict mode is enabled, errors will be thrown on invalid input.
-
-		When disabled, a best effort will be made to handle invalid input and no errors will be thrown. The output may be invalid.
-
-		@default false
-		*/
-		strict?: boolean;
-	}
+export interface SrcSetDefinition {
+	readonly url: string;
+	readonly width?: number;
+	readonly density?: number;
 }
 
-declare const srcset: {
+export interface Options {
 	/**
-	Parse the HTML `<img>` [srcset](http://mobile.smashingmagazine.com/2013/08/21/webkit-implements-srcset-and-why-its-a-good-thing/) attribute.
-
-	Accepts a “srcset” string and returns an array of objects with the possible properties: `url` (always), `width`, `density`, and `height`.
+	When strict mode is enabled, errors will be thrown on invalid input.
 
-	@param srcset - A “srcset” string.
+	When disabled, a best effort will be made to handle invalid input and no errors will be thrown. The output may be invalid.
 
-	@example
-	```
-	import srcset = require('srcset');
-
-	console.log(srcset.parse('banner-HD.jpg 2x, banner-phone.jpg 100w'));
-	// [
-	// 	{
-	// 		url: 'banner-HD.jpg',
-	// 		density: 2
-	// 	},
-	// 	{
-	// 		url: 'banner-phone.jpg',
-	// 		width: 100
-	// 	}
-	// ]
-	```
+	@default false
 	*/
-	parse: (srcset: string, options?: srcset.Options) => srcset.SrcSetDefinition[];
-
-	/**
-	Stringify `SrcSetDefinition`s.
-
-	@param SrcSetDefinitions - Each object should have a `url` field and may have either `width` or `density`. When the `strict` option is `true`, only `width` or `density` is accepted.
-
-	@returns A “srcset” string.
-
-	@example
-	```
-	import srcset = require('srcset');
-
-	const stringified = srcset.stringify([
-		{
-			url: 'banner-HD.jpg',
-			density: 2
-		},
-		{
-			url: 'banner-phone.jpg',
-			width: 100
-		}
-	]);
+	readonly strict?: boolean;
+}
 
-	console.log(stringified);
-	// banner-HD.jpg 2x, banner-phone.jpg 100w
-	```
-	*/
-	stringify: (srcSetDefinitions: readonly srcset.SrcSetDefinition[], options?: srcset.Options) => string;
-};
+/**
+Parse the HTML `<img>` [srcset](http://mobile.smashingmagazine.com/2013/08/21/webkit-implements-srcset-and-why-its-a-good-thing/) attribute.
+
+Accepts a “srcset” string and returns an array of objects with the possible properties: `url` (always), `width`, `density`, and `height`.
+
+@param srcset - A “srcset” string.
+
+@example
+```
+import {parseSrcset} from 'srcset';
+
+console.log(parseSrcset('banner-HD.jpg 2x, banner-phone.jpg 100w'));
+// [
+// 	{
+// 		url: 'banner-HD.jpg',
+// 		density: 2
+// 	},
+// 	{
+// 		url: 'banner-phone.jpg',
+// 		width: 100
+// 	}
+// ]
+```
+*/
+export function parseSrcset(srcset: string, options?: Options): SrcSetDefinition[];
+
+/**
+Stringify `SrcSetDefinition`s.
+
+@param SrcSetDefinitions - Each object should have a `url` field and may have either `width` or `density`. When the `strict` option is `true`, only `width` or `density` is accepted.
+
+@returns A “srcset” string.
+
+@example
+```
+import {stringifySrcset} from 'srcset';
+
+const stringified = stringifySrcset([
+	{
+		url: 'banner-HD.jpg',
+		density: 2
+	},
+	{
+		url: 'banner-phone.jpg',
+		width: 100
+	}
+]);
 
-export = srcset;
+console.log(stringified);
+// banner-HD.jpg 2x, banner-phone.jpg 100w
+```
+*/
+export function stringifySrcset(srcSetDefinitions: readonly SrcSetDefinition[], options?: Options): string;

index.js

@@ -1,5 +1,3 @@
-'use strict';
-
 /**
 This regex represents a loose rule of an “image candidate string”.
 
@@ -80,8 +78,9 @@ const validDescriptorCheck = (value, postfix, descriptor) => {
 	}
 };
 
-exports.parse = (string, {strict = false} = {}) => {
+export function parseSrcset(string, {strict = false} = {}) {
 	const allDescriptors = strict ? {} : undefined;
+
 	return string.split(imageCandidateRegex)
 		.filter((part, index) => index % 2 === 1)
 		.map(part => {
@@ -124,12 +123,13 @@ exports.parse = (string, {strict = false} = {}) => {
 
 			return result;
 		});
-};
+}
 
 const knownDescriptors = new Set(['width', 'height', 'density']);
 
-exports.stringify = (array, {strict = false} = {}) => {
-	const allDescriptors = strict ? {} : null;
+export function stringifySrcset(array, {strict = false} = {}) {
+	const allDescriptors = strict ? {} : undefined;
+
 	return array.map(element => {
 		if (!element.url) {
 			if (strict) {
@@ -183,4 +183,4 @@ exports.stringify = (array, {strict = false} = {}) => {
 
 		return result.join(' ');
 	}).join(', ');
-};
+}

index.test-d.ts

@@ -1,10 +1,10 @@
 import {expectType, expectError} from 'tsd';
-import srcset = require('./index.js');
+import {parseSrcset, stringifySrcset, SrcSetDefinition} from './index.js';
 
-const parsed = srcset.parse('banner-HD.jpg 2x, banner-phone.jpg 100w');
-expectType<srcset.SrcSetDefinition[]>(parsed);
+const parsed = parseSrcset('banner-HD.jpg 2x, banner-phone.jpg 100w');
+expectType<SrcSetDefinition[]>(parsed);
 
 parsed.push({url: 'banner-phone-HD.jpg'}, {url: 'banner-phone-HD.jpg', width: 100}, {url: 'banner-phone-HD.jpg', density: 2});
 expectError(parsed.push({}));
 
-expectType<string>(srcset.stringify(parsed));
+expectType<string>(stringifySrcset(parsed));

package.json

@@ -10,8 +10,10 @@
 		"email": "[email protected]",
 		"url": "https://sindresorhus.com"
 	},
+	"type": "module",
+	"exports": "./index.js",
 	"engines": {
-		"node": ">=12"
+		"node": "^12.20.0 || ^14.13.1 || >=16.0.0"
 	},
 	"scripts": {
 		"test": "xo && ava && tsd"
@@ -34,8 +36,8 @@
 		"element"
 	],
 	"devDependencies": {
-		"ava": "^2.4.0",
-		"tsd": "^0.13.1",
-		"xo": "^0.39.0"
+		"ava": "^3.15.0",
+		"tsd": "^0.19.0",
+		"xo": "^0.46.4"
 	}
 }

readme.md

@@ -6,8 +6,8 @@ Can be useful if you're creating a build-tool.
 
 ## Install
 
-```
-$ npm install srcset
+```sh
+npm install srcset
 ```
 
 ## Usage
@@ -25,9 +25,9 @@ How an image with `srcset` might look like:
 Then have some fun with it:
 
 ```js
-const srcset = require('srcset');
+import {parseSrcset, stringifySrcset} from 'srcset';
 
-const parsed = srcset.parse('banner-HD.jpg 2x, banner-phone.jpg 100w');
+const parsed = parseSrcset('banner-HD.jpg 2x, banner-phone.jpg 100w');
 console.log(parsed);
 /*
 [
@@ -47,7 +47,7 @@ parsed.push({
 	density: 3
 });
 
-const stringified = srcset.stringify(parsed);
+const stringified = stringifySrcset(parsed);
 console.log(stringified);
 /*
 banner-HD.jpg 2x, banner-phone.jpg 100w, banner-super-HD.jpg 3x
@@ -56,7 +56,7 @@ banner-HD.jpg 2x, banner-phone.jpg 100w, banner-super-HD.jpg 3x
 
 ## API
 
-### .parse(string, options?)
+### parseSrcset(string, options?)
 
 Parse the HTML `<img>` [srcset](http://mobile.smashingmagazine.com/2013/08/21/webkit-implements-srcset-and-why-its-a-good-thing/) attribute.
 
@@ -79,7 +79,7 @@ Default: `false`
 
 When enabled, an invalid “srcset” string will cause an error to be thrown. When disabled, a best effort will be made to parse the string, potentially resulting in invalid or nonsensical output.
 
-### .stringify(SrcSetDefinitions, options?)
+### stringifySrcset(SrcSetDefinitions, options?)
 
 Stringify `SrcSetDefinition`s. Accepts an array of `SrcSetDefinition` objects and returns a “srcset” string.
 
@@ -95,11 +95,10 @@ Type: `object`
 
 ##### strict
 
-Type: `boolean`
-
+Type: `boolean`\
 Default: `false`
 
-Enable or disable validation of the SrcSetDefinitions. When true, invalid input will cause an error to be thrown. When false, a best effort will be made to stringify invalid input, likely resulting in invalid srcset value.
+Enable or disable validation of the `SrcSetDefinition`'s. When true, invalid input will cause an error to be thrown. When false, a best effort will be made to stringify invalid input, likely resulting in invalid srcset value.
 
 ---