font-picker - npm Package Compare versions

Comparing version 3.4.0 to 3.4.1

dist/FontPicker.es.js

@@ -1,16 +0,19 @@
-import { FontManager, FONT_FAMILY_DEFAULT, OPTIONS_DEFAULTS, getFontId } from '@samuelmeuli/font-manager';
+import { getFontId, OPTIONS_DEFAULTS, FontManager, FONT_FAMILY_DEFAULT } from '@samuelmeuli/font-manager';
 
-class FontPicker {
-    constructor(apiKey, defaultFamily = FONT_FAMILY_DEFAULT, { pickerId = OPTIONS_DEFAULTS.pickerId, families = OPTIONS_DEFAULTS.families, categories = OPTIONS_DEFAULTS.categories, scripts = OPTIONS_DEFAULTS.scripts, variants = OPTIONS_DEFAULTS.variants, limit = OPTIONS_DEFAULTS.limit, sort = OPTIONS_DEFAULTS.sort, }, onChange = () => { }) {
+var FontPicker = (function () {
+    function FontPicker(apiKey, defaultFamily, _a, onChange) {
+        if (defaultFamily === void 0) { defaultFamily = FONT_FAMILY_DEFAULT; }
+        var _b = _a.pickerId, pickerId = _b === void 0 ? OPTIONS_DEFAULTS.pickerId : _b, _c = _a.families, families = _c === void 0 ? OPTIONS_DEFAULTS.families : _c, _d = _a.categories, categories = _d === void 0 ? OPTIONS_DEFAULTS.categories : _d, _e = _a.scripts, scripts = _e === void 0 ? OPTIONS_DEFAULTS.scripts : _e, _f = _a.variants, variants = _f === void 0 ? OPTIONS_DEFAULTS.variants : _f, _g = _a.limit, limit = _g === void 0 ? OPTIONS_DEFAULTS.limit : _g, _h = _a.sort, sort = _h === void 0 ? OPTIONS_DEFAULTS.sort : _h;
+        if (onChange === void 0) { onChange = function () { }; }
         this.expanded = false;
         this.closeEventListener = this.closeEventListener.bind(this);
         this.toggleExpanded = this.toggleExpanded.bind(this);
-        const options = {
-            pickerId,
-            families,
-            categories,
-            scripts,
-            variants,
-            limit,
-            sort,
+        var options = {
+            pickerId: pickerId,
+            families: families,
+            categories: categories,
+            scripts: scripts,
+            variants: variants,
+            limit: limit,
+            sort: sort,
         };
@@ -20,10 +23,11 @@ this.fontManager = new FontManager(apiKey, defaultFamily, options, onChange);
     }
-    generateUI(sort) {
-        const { selectorSuffix } = this.fontManager;
-        const pickerId = `font-picker${selectorSuffix}`;
+    FontPicker.prototype.generateUI = function (sort) {
+        var _this = this;
+        var selectorSuffix = this.fontManager.selectorSuffix;
+        var pickerId = "font-picker" + selectorSuffix;
         this.fontPickerDiv = document.getElementById(pickerId);
         if (!this.fontPickerDiv) {
-            throw Error(`Missing div with id="${pickerId}"`);
+            throw Error("Missing div with id=\"" + pickerId + "\"");
         }
-        const dropdownButton = document.createElement("button");
+        var dropdownButton = document.createElement("button");
         dropdownButton.classList.add("dropdown-button");
@@ -38,3 +42,3 @@ dropdownButton.onclick = this.toggleExpanded;
         dropdownButton.appendChild(this.dropdownFamily);
-        const dropdownIcon = document.createElement("p");
+        var dropdownIcon = document.createElement("p");
         dropdownIcon.classList.add("dropdown-icon", "loading");
@@ -44,11 +48,12 @@ dropdownButton.appendChild(dropdownIcon);
             .init()
-            .then((fontMap) => {
-            const fonts = Array.from(fontMap.values());
+            .then(function (fontMap) {
+            var fonts = Array.from(fontMap.values());
             if (sort === "alphabet") {
-                fonts.sort((font1, font2) => font1.family.localeCompare(font2.family));
+                fonts.sort(function (font1, font2) {
+                    return font1.family.localeCompare(font2.family);
+                });
             }
-            this.generateFontList(fonts);
+            _this.generateFontList(fonts);
             dropdownIcon.classList.replace("loading", "finished");
-        })
-            .catch((err) => {
+        })["catch"](function (err) {
             dropdownIcon.classList.replace("loading", "error");
@@ -58,13 +63,14 @@ console.error("Error trying to fetch the list of available fonts");
         });
-    }
-    generateFontList(fonts) {
+    };
+    FontPicker.prototype.generateFontList = function (fonts) {
+        var _this = this;
         this.ul = document.createElement("ul");
         this.ul.classList.add("font-list");
-        fonts.forEach((font) => {
-            this.addFontLi(font);
+        fonts.forEach(function (font) {
+            _this.addFontLi(font);
         });
         this.fontPickerDiv.appendChild(this.ul);
-        const activeFontFamily = this.fontManager.getActiveFont().family;
-        const activeFontId = getFontId(activeFontFamily);
-        const fontButtonId = `font-button-${activeFontId}${this.fontManager.selectorSuffix}`;
+        var activeFontFamily = this.fontManager.getActiveFont().family;
+        var activeFontId = getFontId(activeFontFamily);
+        var fontButtonId = "font-button-" + activeFontId + this.fontManager.selectorSuffix;
         this.activeFontButton = document.getElementById(fontButtonId);
@@ -75,17 +81,18 @@ if (this.activeFontButton) {
         else {
-            console.error(`Could not find font button with ID (${fontButtonId})`);
+            console.error("Could not find font button with ID (" + fontButtonId + ")");
         }
-    }
-    addFontLi(font, listIndex) {
-        const fontId = getFontId(font.family);
-        const li = document.createElement("li");
+    };
+    FontPicker.prototype.addFontLi = function (font, listIndex) {
+        var _this = this;
+        var fontId = getFontId(font.family);
+        var li = document.createElement("li");
         li.classList.add("font-list-item");
-        const fontButton = document.createElement("button");
+        var fontButton = document.createElement("button");
         fontButton.type = "button";
-        fontButton.id = `font-button-${fontId}${this.fontManager.selectorSuffix}`;
+        fontButton.id = "font-button-" + fontId + this.fontManager.selectorSuffix;
         fontButton.classList.add("font-button");
         fontButton.textContent = font.family;
-        const onActivate = () => {
-            this.toggleExpanded();
-            this.setActiveFont(font.family);
+        var onActivate = function () {
+            _this.toggleExpanded();
+            _this.setActiveFont(font.family);
         };
@@ -101,6 +108,6 @@ fontButton.onclick = onActivate;
         }
-    }
-    closeEventListener(e) {
-        let targetEl = e.target;
-        const fontPickerEl = document.getElementById(`font-picker${this.fontManager.selectorSuffix}`);
+    };
+    FontPicker.prototype.closeEventListener = function (e) {
+        var targetEl = e.target;
+        var fontPickerEl = document.getElementById("font-picker" + this.fontManager.selectorSuffix);
         while (true) {
@@ -118,4 +125,4 @@ if (targetEl === fontPickerEl) {
         }
-    }
-    toggleExpanded() {
+    };
+    FontPicker.prototype.toggleExpanded = function () {
         if (this.expanded) {
@@ -131,12 +138,12 @@ this.expanded = false;
         }
-    }
-    getFonts() {
+    };
+    FontPicker.prototype.getFonts = function () {
         return this.fontManager.getFonts();
-    }
-    addFont(fontFamily, index) {
+    };
+    FontPicker.prototype.addFont = function (fontFamily, index) {
         if (Array.from(this.fontManager.getFonts().keys()).includes(fontFamily)) {
-            throw Error(`Did not add font to font picker: Font family "${fontFamily}" is already in the list`);
+            throw Error("Did not add font to font picker: Font family \"" + fontFamily + "\" is already in the list");
         }
         this.fontManager.addFont(fontFamily, true);
-        const font = this.fontManager.getFonts().get(fontFamily);
+        var font = this.fontManager.getFonts().get(fontFamily);
         if (font) {
@@ -146,11 +153,11 @@ this.addFontLi(font, index);
         else {
-            console.error(`Font "${fontFamily}" is missing in font list`);
+            console.error("Font \"" + fontFamily + "\" is missing in font list");
         }
-    }
-    removeFont(fontFamily) {
+    };
+    FontPicker.prototype.removeFont = function (fontFamily) {
         this.fontManager.removeFont(fontFamily);
-        const fontId = getFontId(fontFamily);
-        const fontButton = document.getElementById(`font-button-${fontId}${this.fontManager.selectorSuffix}`);
+        var fontId = getFontId(fontFamily);
+        var fontButton = document.getElementById("font-button-" + fontId + this.fontManager.selectorSuffix);
         if (fontButton) {
-            const fontLi = fontButton.parentElement;
+            var fontLi = fontButton.parentElement;
             fontButton.remove();
@@ -162,15 +169,15 @@ if (fontLi) {
         else {
-            throw Error(`Could not remove font from font picker: Font family "${fontFamily}" is not in the list`);
+            throw Error("Could not remove font from font picker: Font family \"" + fontFamily + "\" is not in the list");
         }
-    }
-    getActiveFont() {
+    };
+    FontPicker.prototype.getActiveFont = function () {
         return this.fontManager.getActiveFont();
-    }
-    setActiveFont(fontFamily) {
+    };
+    FontPicker.prototype.setActiveFont = function (fontFamily) {
         this.fontManager.setActiveFont(fontFamily);
-        const fontId = getFontId(fontFamily);
+        var fontId = getFontId(fontFamily);
         this.dropdownFamily.textContent = fontFamily;
         if (this.activeFontButton) {
             this.activeFontButton.classList.remove("active-font");
-            this.activeFontButton = document.getElementById(`font-button-${fontId}${this.fontManager.selectorSuffix}`);
+            this.activeFontButton = document.getElementById("font-button-" + fontId + this.fontManager.selectorSuffix);
             this.activeFontButton.classList.add("active-font");
@@ -181,8 +188,9 @@ }
         }
-    }
-    setOnChange(onChange) {
+    };
+    FontPicker.prototype.setOnChange = function (onChange) {
         this.fontManager.setOnChange(onChange);
-    }
-}
+    };
+    return FontPicker;
+}());
 
 export default FontPicker;

dist/FontPicker.js

@@ -7,15 +7,18 @@ (function (global, factory) {
 
-	class FontPicker {
-	    constructor(apiKey, defaultFamily = fontManager.FONT_FAMILY_DEFAULT, { pickerId = fontManager.OPTIONS_DEFAULTS.pickerId, families = fontManager.OPTIONS_DEFAULTS.families, categories = fontManager.OPTIONS_DEFAULTS.categories, scripts = fontManager.OPTIONS_DEFAULTS.scripts, variants = fontManager.OPTIONS_DEFAULTS.variants, limit = fontManager.OPTIONS_DEFAULTS.limit, sort = fontManager.OPTIONS_DEFAULTS.sort, }, onChange = () => { }) {
+	var FontPicker = (function () {
+	    function FontPicker(apiKey, defaultFamily, _a, onChange) {
+	        if (defaultFamily === void 0) { defaultFamily = fontManager.FONT_FAMILY_DEFAULT; }
+	        var _b = _a.pickerId, pickerId = _b === void 0 ? fontManager.OPTIONS_DEFAULTS.pickerId : _b, _c = _a.families, families = _c === void 0 ? fontManager.OPTIONS_DEFAULTS.families : _c, _d = _a.categories, categories = _d === void 0 ? fontManager.OPTIONS_DEFAULTS.categories : _d, _e = _a.scripts, scripts = _e === void 0 ? fontManager.OPTIONS_DEFAULTS.scripts : _e, _f = _a.variants, variants = _f === void 0 ? fontManager.OPTIONS_DEFAULTS.variants : _f, _g = _a.limit, limit = _g === void 0 ? fontManager.OPTIONS_DEFAULTS.limit : _g, _h = _a.sort, sort = _h === void 0 ? fontManager.OPTIONS_DEFAULTS.sort : _h;
+	        if (onChange === void 0) { onChange = function () { }; }
 	        this.expanded = false;
 	        this.closeEventListener = this.closeEventListener.bind(this);
 	        this.toggleExpanded = this.toggleExpanded.bind(this);
-	        const options = {
-	            pickerId,
-	            families,
-	            categories,
-	            scripts,
-	            variants,
-	            limit,
-	            sort,
+	        var options = {
+	            pickerId: pickerId,
+	            families: families,
+	            categories: categories,
+	            scripts: scripts,
+	            variants: variants,
+	            limit: limit,
+	            sort: sort,
 	        };
@@ -25,10 +28,11 @@ this.fontManager = new fontManager.FontManager(apiKey, defaultFamily, options, onChange);
 	    }
-	    generateUI(sort) {
-	        const { selectorSuffix } = this.fontManager;
-	        const pickerId = `font-picker${selectorSuffix}`;
+	    FontPicker.prototype.generateUI = function (sort) {
+	        var _this = this;
+	        var selectorSuffix = this.fontManager.selectorSuffix;
+	        var pickerId = "font-picker" + selectorSuffix;
 	        this.fontPickerDiv = document.getElementById(pickerId);
 	        if (!this.fontPickerDiv) {
-	            throw Error(`Missing div with id="${pickerId}"`);
+	            throw Error("Missing div with id=\"" + pickerId + "\"");
 	        }
-	        const dropdownButton = document.createElement("button");
+	        var dropdownButton = document.createElement("button");
 	        dropdownButton.classList.add("dropdown-button");
@@ -43,3 +47,3 @@ dropdownButton.onclick = this.toggleExpanded;
 	        dropdownButton.appendChild(this.dropdownFamily);
-	        const dropdownIcon = document.createElement("p");
+	        var dropdownIcon = document.createElement("p");
 	        dropdownIcon.classList.add("dropdown-icon", "loading");
@@ -49,11 +53,12 @@ dropdownButton.appendChild(dropdownIcon);
 	            .init()
-	            .then((fontMap) => {
-	            const fonts = Array.from(fontMap.values());
+	            .then(function (fontMap) {
+	            var fonts = Array.from(fontMap.values());
 	            if (sort === "alphabet") {
-	                fonts.sort((font1, font2) => font1.family.localeCompare(font2.family));
+	                fonts.sort(function (font1, font2) {
+	                    return font1.family.localeCompare(font2.family);
+	                });
 	            }
-	            this.generateFontList(fonts);
+	            _this.generateFontList(fonts);
 	            dropdownIcon.classList.replace("loading", "finished");
-	        })
-	            .catch((err) => {
+	        })["catch"](function (err) {
 	            dropdownIcon.classList.replace("loading", "error");
@@ -63,13 +68,14 @@ console.error("Error trying to fetch the list of available fonts");
 	        });
-	    }
-	    generateFontList(fonts) {
+	    };
+	    FontPicker.prototype.generateFontList = function (fonts) {
+	        var _this = this;
 	        this.ul = document.createElement("ul");
 	        this.ul.classList.add("font-list");
-	        fonts.forEach((font) => {
-	            this.addFontLi(font);
+	        fonts.forEach(function (font) {
+	            _this.addFontLi(font);
 	        });
 	        this.fontPickerDiv.appendChild(this.ul);
-	        const activeFontFamily = this.fontManager.getActiveFont().family;
-	        const activeFontId = fontManager.getFontId(activeFontFamily);
-	        const fontButtonId = `font-button-${activeFontId}${this.fontManager.selectorSuffix}`;
+	        var activeFontFamily = this.fontManager.getActiveFont().family;
+	        var activeFontId = fontManager.getFontId(activeFontFamily);
+	        var fontButtonId = "font-button-" + activeFontId + this.fontManager.selectorSuffix;
 	        this.activeFontButton = document.getElementById(fontButtonId);
@@ -80,17 +86,18 @@ if (this.activeFontButton) {
 	        else {
-	            console.error(`Could not find font button with ID (${fontButtonId})`);
+	            console.error("Could not find font button with ID (" + fontButtonId + ")");
 	        }
-	    }
-	    addFontLi(font, listIndex) {
-	        const fontId = fontManager.getFontId(font.family);
-	        const li = document.createElement("li");
+	    };
+	    FontPicker.prototype.addFontLi = function (font, listIndex) {
+	        var _this = this;
+	        var fontId = fontManager.getFontId(font.family);
+	        var li = document.createElement("li");
 	        li.classList.add("font-list-item");
-	        const fontButton = document.createElement("button");
+	        var fontButton = document.createElement("button");
 	        fontButton.type = "button";
-	        fontButton.id = `font-button-${fontId}${this.fontManager.selectorSuffix}`;
+	        fontButton.id = "font-button-" + fontId + this.fontManager.selectorSuffix;
 	        fontButton.classList.add("font-button");
 	        fontButton.textContent = font.family;
-	        const onActivate = () => {
-	            this.toggleExpanded();
-	            this.setActiveFont(font.family);
+	        var onActivate = function () {
+	            _this.toggleExpanded();
+	            _this.setActiveFont(font.family);
 	        };
@@ -106,6 +113,6 @@ fontButton.onclick = onActivate;
 	        }
-	    }
-	    closeEventListener(e) {
-	        let targetEl = e.target;
-	        const fontPickerEl = document.getElementById(`font-picker${this.fontManager.selectorSuffix}`);
+	    };
+	    FontPicker.prototype.closeEventListener = function (e) {
+	        var targetEl = e.target;
+	        var fontPickerEl = document.getElementById("font-picker" + this.fontManager.selectorSuffix);
 	        while (true) {
@@ -123,4 +130,4 @@ if (targetEl === fontPickerEl) {
 	        }
-	    }
-	    toggleExpanded() {
+	    };
+	    FontPicker.prototype.toggleExpanded = function () {
 	        if (this.expanded) {
@@ -136,12 +143,12 @@ this.expanded = false;
 	        }
-	    }
-	    getFonts() {
+	    };
+	    FontPicker.prototype.getFonts = function () {
 	        return this.fontManager.getFonts();
-	    }
-	    addFont(fontFamily, index) {
+	    };
+	    FontPicker.prototype.addFont = function (fontFamily, index) {
 	        if (Array.from(this.fontManager.getFonts().keys()).includes(fontFamily)) {
-	            throw Error(`Did not add font to font picker: Font family "${fontFamily}" is already in the list`);
+	            throw Error("Did not add font to font picker: Font family \"" + fontFamily + "\" is already in the list");
 	        }
 	        this.fontManager.addFont(fontFamily, true);
-	        const font = this.fontManager.getFonts().get(fontFamily);
+	        var font = this.fontManager.getFonts().get(fontFamily);
 	        if (font) {
@@ -151,11 +158,11 @@ this.addFontLi(font, index);
 	        else {
-	            console.error(`Font "${fontFamily}" is missing in font list`);
+	            console.error("Font \"" + fontFamily + "\" is missing in font list");
 	        }
-	    }
-	    removeFont(fontFamily) {
+	    };
+	    FontPicker.prototype.removeFont = function (fontFamily) {
 	        this.fontManager.removeFont(fontFamily);
-	        const fontId = fontManager.getFontId(fontFamily);
-	        const fontButton = document.getElementById(`font-button-${fontId}${this.fontManager.selectorSuffix}`);
+	        var fontId = fontManager.getFontId(fontFamily);
+	        var fontButton = document.getElementById("font-button-" + fontId + this.fontManager.selectorSuffix);
 	        if (fontButton) {
-	            const fontLi = fontButton.parentElement;
+	            var fontLi = fontButton.parentElement;
 	            fontButton.remove();
@@ -167,15 +174,15 @@ if (fontLi) {
 	        else {
-	            throw Error(`Could not remove font from font picker: Font family "${fontFamily}" is not in the list`);
+	            throw Error("Could not remove font from font picker: Font family \"" + fontFamily + "\" is not in the list");
 	        }
-	    }
-	    getActiveFont() {
+	    };
+	    FontPicker.prototype.getActiveFont = function () {
 	        return this.fontManager.getActiveFont();
-	    }
-	    setActiveFont(fontFamily) {
+	    };
+	    FontPicker.prototype.setActiveFont = function (fontFamily) {
 	        this.fontManager.setActiveFont(fontFamily);
-	        const fontId = fontManager.getFontId(fontFamily);
+	        var fontId = fontManager.getFontId(fontFamily);
 	        this.dropdownFamily.textContent = fontFamily;
 	        if (this.activeFontButton) {
 	            this.activeFontButton.classList.remove("active-font");
-	            this.activeFontButton = document.getElementById(`font-button-${fontId}${this.fontManager.selectorSuffix}`);
+	            this.activeFontButton = document.getElementById("font-button-" + fontId + this.fontManager.selectorSuffix);
 	            this.activeFontButton.classList.add("active-font");
@@ -186,7 +193,8 @@ }
 	        }
-	    }
-	    setOnChange(onChange) {
+	    };
+	    FontPicker.prototype.setOnChange = function (onChange) {
 	        this.fontManager.setOnChange(onChange);
-	    }
-	}
+	    };
+	    return FontPicker;
+	}());
 
@@ -193,0 +201,0 @@ return FontPicker;

package.json

 {
 	"name": "font-picker",
-	"version": "3.4.0",
+	"version": "3.4.1",
 	"description": "Font selector component for Google Fonts",
@@ -50,6 +50,6 @@ "author": {
 		"@samuelmeuli/stylelint-config": "^1.0.2",
-		"@samuelmeuli/tsconfig": "^0.1.1",
+		"@samuelmeuli/tsconfig": "^0.2.0",
 		"@typescript-eslint/eslint-plugin": "^2.0.0",
 		"@typescript-eslint/parser": "^2.0.0",
-		"eslint": "6.1.0",
+		"eslint": "6.5.1",
 		"eslint-config-airbnb-base": "14.0.0",
@@ -61,3 +61,3 @@ "eslint-config-prettier": "^6.1.0",
 		"lint-staged": "^9.2.3",
-		"np": "^5.0.2",
+		"np": "~5.0.0",
 		"npm-run-all": "^4.1.3",
@@ -67,5 +67,5 @@ "prettier": "^1.16.4",
 		"rollup-plugin-node-resolve": "^5.2.0",
-		"rollup-plugin-typescript2": "^0.22.1",
+		"rollup-plugin-typescript2": "^0.24.3",
 		"serve": "^11.0.0",
-		"stylelint": "^10.1.0",
+		"stylelint": "^11.0.0",
 		"typescript": "^3.5.3"
@@ -72,0 +72,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

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

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

Improved metrics

Total package byte prevSize

27432

increased by8.15%

Lines of code

395

increased by4.5%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes