@amimpact/willy-utils 1.5.2-beta.0 → 1.6.1-beta.1

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { createCookie, readCookie, eraseCookie } from './cookie';
 import { formatCraftDate, formatDateFromNow, formatNewDate, formatUTCDate, parseISODuration } from './date';
 import { convertObjectToFormData } from './form';
-import { bytesToSize, convertHexToRGBA, downloadFile, getNestedSet, getUrlsFromString, isPlainObject, wrap } from './misc';
+import { bytesToSize, checkForScrollbars, convertHexToRGBA, downloadFile, getNestedSet, getUrlsFromString, isPlainObject, observeResize, wrap } from './misc';
 import { $, $$, getParents } from './selectors';
 import { isCraftActionUrl, isInternalLink, isExternalUrl, isAsset } from './url';
-export { $, $$, bytesToSize, convertHexToRGBA, createCookie, downloadFile, eraseCookie, formatCraftDate, convertObjectToFormData, formatDateFromNow, formatNewDate, formatUTCDate, getNestedSet, getParents, getUrlsFromString, isAsset, isCraftActionUrl, isExternalUrl, isInternalLink, isPlainObject, parseISODuration, readCookie, wrap, };
+export { $, $$, bytesToSize, checkForScrollbars, convertHexToRGBA, createCookie, downloadFile, eraseCookie, formatCraftDate, convertObjectToFormData, formatDateFromNow, formatNewDate, formatUTCDate, getNestedSet, getParents, getUrlsFromString, isAsset, isCraftActionUrl, isExternalUrl, isInternalLink, isPlainObject, observeResize, parseISODuration, readCookie, wrap, };

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.wrap = exports.readCookie = exports.parseISODuration = exports.isPlainObject = exports.isInternalLink = exports.isExternalUrl = exports.isCraftActionUrl = exports.isAsset = exports.getUrlsFromString = exports.getParents = exports.getNestedSet = exports.formatUTCDate = exports.formatNewDate = exports.formatDateFromNow = exports.convertObjectToFormData = exports.formatCraftDate = exports.eraseCookie = exports.downloadFile = exports.createCookie = exports.convertHexToRGBA = exports.bytesToSize = exports.$$ = exports.$ = void 0;
+exports.wrap = exports.readCookie = exports.parseISODuration = exports.observeResize = exports.isPlainObject = exports.isInternalLink = exports.isExternalUrl = exports.isCraftActionUrl = exports.isAsset = exports.getUrlsFromString = exports.getParents = exports.getNestedSet = exports.formatUTCDate = exports.formatNewDate = exports.formatDateFromNow = exports.convertObjectToFormData = exports.formatCraftDate = exports.eraseCookie = exports.downloadFile = exports.createCookie = exports.convertHexToRGBA = exports.checkForScrollbars = exports.bytesToSize = exports.$$ = exports.$ = void 0;
 var cookie_1 = require("./cookie");
 Object.defineProperty(exports, "createCookie", { enumerable: true, get: function () { return cookie_1.createCookie; } });
 Object.defineProperty(exports, "readCookie", { enumerable: true, get: function () { return cookie_1.readCookie; } });
@@ -15,11 +15,13 @@ var form_1 = require("./form");
 Object.defineProperty(exports, "convertObjectToFormData", { enumerable: true, get: function () { return form_1.convertObjectToFormData; } });
 var misc_1 = require("./misc");
 Object.defineProperty(exports, "bytesToSize", { enumerable: true, get: function () { return misc_1.bytesToSize; } });
+Object.defineProperty(exports, "checkForScrollbars", { enumerable: true, get: function () { return misc_1.checkForScrollbars; } });
 Object.defineProperty(exports, "convertHexToRGBA", { enumerable: true, get: function () { return misc_1.convertHexToRGBA; } });
 Object.defineProperty(exports, "downloadFile", { enumerable: true, get: function () { return misc_1.downloadFile; } });
 Object.defineProperty(exports, "getNestedSet", { enumerable: true, get: function () { return misc_1.getNestedSet; } });
 Object.defineProperty(exports, "getUrlsFromString", { enumerable: true, get: function () { return misc_1.getUrlsFromString; } });
 Object.defineProperty(exports, "isPlainObject", { enumerable: true, get: function () { return misc_1.isPlainObject; } });
+Object.defineProperty(exports, "observeResize", { enumerable: true, get: function () { return misc_1.observeResize; } });
 Object.defineProperty(exports, "wrap", { enumerable: true, get: function () { return misc_1.wrap; } });
 var selectors_1 = require("./selectors");
 Object.defineProperty(exports, "$", { enumerable: true, get: function () { return selectors_1.$; } });

package/dist/misc.d.ts

@@ -3,6 +3,14 @@
  * @param {string | number} bytes
  */
 export declare const bytesToSize: (bytes: number) => string;
+/**
+ * Check of een HTML element horizontale of verticale scrollbars heeft
+ * als dat zo is, dan wordt een class op het element gezet.
+ *
+ * @param {HTMLElement} el
+ * @param {String} dir // vertical of horizontal
+ */
+export declare const checkForScrollbars: (el: HTMLElement, dir?: String) => void;
 /**
  * Hex kleurcode converten naar rgba
  *
@@ -38,6 +46,14 @@ export declare const getUrlsFromString: (content: string) => RegExpMatchArray |
  * @returns {boolean}
  */
 export declare const isPlainObject: (value: any) => boolean;
+/**
+ * Resize observer; checkt of een HTML element zijn dimensies veranderen
+ * en zodra dat gebeurt wordt de callback functie gecalled.
+ *
+ * @param {HTMLElement} el
+ * @param {Function} callback
+ */
+export declare const observeResize: (element: HTMLElement, callback: Function) => void;
 /**
  * Wrap een element in een nieuw element
  *

package/dist/misc.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.wrap = exports.isPlainObject = exports.getUrlsFromString = exports.getNestedSet = exports.downloadFile = exports.convertHexToRGBA = exports.bytesToSize = void 0;
+exports.wrap = exports.observeResize = exports.isPlainObject = exports.getUrlsFromString = exports.getNestedSet = exports.downloadFile = exports.convertHexToRGBA = exports.checkForScrollbars = exports.bytesToSize = void 0;
 /**
  * Toon mooier bestandsformaat
  * @param {string | number} bytes
@@ -15,6 +15,29 @@ exports.bytesToSize = function (bytes) {
     var i = Math.floor(Math.log(bytes) / Math.log(1024));
     return Math.round(bytes / Math.pow(1024, i)) + ' ' + sizes[i];
 };
+/**
+ * Check of een HTML element horizontale of verticale scrollbars heeft
+ * als dat zo is, dan wordt een class op het element gezet.
+ *
+ * @param {HTMLElement} el
+ * @param {String} dir // vertical of horizontal
+ */
+exports.checkForScrollbars = function (el, dir) {
+    if (dir === void 0) { dir = 'vertical'; }
+    var direction = dir === 'vertical' ? 'scrollTop' : 'scrollLeft';
+    var hasScrollbar = !!el[direction];
+    if (!hasScrollbar) {
+        el[direction] = 1;
+        hasScrollbar = !!el[direction];
+        el[direction] = 0;
+    }
+    if (hasScrollbar) {
+        el.classList.add("has-" + dir + "-scrollbar");
+    }
+    else {
+        el.classList.remove("has-" + dir + "-scrollbar");
+    }
+};
 /**
  * Hex kleurcode converten naar rgba
  *
@@ -105,6 +128,19 @@ exports.isPlainObject = function (value) {
     }
     return Object.getPrototypeOf(value) === proto;
 };
+/**
+ * Resize observer; checkt of een HTML element zijn dimensies veranderen
+ * en zodra dat gebeurt wordt de callback functie gecalled.
+ *
+ * @param {HTMLElement} el
+ * @param {Function} callback
+ */
+exports.observeResize = function (element, callback) {
+    var resizeObserver = new ResizeObserver(function () {
+        callback(element);
+    });
+    resizeObserver.observe(element);
+};
 /**
  * Wrap een element in een nieuw element
  *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amimpact/willy-utils",
-  "version": "1.5.2-beta.0",
+  "version": "1.6.1-beta.1",
   "description": "Javascript utils",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -27,6 +27,7 @@
   },
   "homepage": "https://bitbucket.org/amimpact/willy-utils#readme",
   "devDependencies": {
+    "@types/resize-observer-browser": "^0.1.7",
     "browserify": "17.0.0",
     "onchange": "7.1.0",
     "typescript": "4.0.5"

package/tsconfig.json

@@ -16,4 +16,5 @@
         "dom"
       ],
     },
+    "types": ["resize-observer-browser"],
   }