@fremtind/jkl-react-hooks - npm Package Compare versions

Comparing version 1.6.11 to 1.7.0

build/browser/index.js

@@ -134,3 +134,3 @@ import React, { useState, useEffect, useRef, useCallback, useLayoutEffect, useReducer } from 'react';
   function handleClickOutside(event) {
-    if (ref && ref.current && !ref.current.contains(event.target)) {
+    if ((ref === null || ref === void 0 ? void 0 : ref.current) && !ref.current.contains(event.target)) {
       fn();
@@ -155,3 +155,3 @@ }
   function handleFocusOutside(event) {
-    if (ref && ref.current && !ref.current.contains(event.target)) {
+    if ((ref === null || ref === void 0 ? void 0 : ref.current) && !ref.current.contains(event.target)) {
       fn();
@@ -367,3 +367,3 @@ }
   var scrollIntoView = function scrollIntoView() {
-    if (ref && ref.current) {
+    if (ref === null || ref === void 0 ? void 0 : ref.current) {
       ref.current.scrollIntoView(options);
@@ -386,2 +386,26 @@ }
 
-export { initialState as initialScreenState, useAnimatedHeight, useClickOutside, useFocusOutside, useIntersectionObserver, useKeyListener, useMutationObserver, useReducedMotion, useScreen, useScrollIntoView };
+var useProgressiveImg = function useProgressiveImg(_ref) {
+  var lowQualitySrc = _ref.lowQualitySrc,
+      highQualitySrc = _ref.highQualitySrc;
+
+  var _useState = useState(lowQualitySrc),
+      _useState2 = _slicedToArray(_useState, 2),
+      src = _useState2[0],
+      setSrc = _useState2[1];
+
+  useEffect(function () {
+    setSrc(lowQualitySrc);
+    var img = new Image();
+    img.src = highQualitySrc;
+
+    img.onload = function () {
+      setSrc(highQualitySrc);
+    };
+  }, [lowQualitySrc, highQualitySrc]);
+  return {
+    src: src,
+    isBlurred: src === lowQualitySrc
+  };
+};
+
+export { initialState as initialScreenState, useAnimatedHeight, useClickOutside, useFocusOutside, useIntersectionObserver, useKeyListener, useMutationObserver, useProgressiveImg, useReducedMotion, useScreen, useScrollIntoView };

build/browser/index.min.js

@@ -1,1 +0,1 @@
-import e,{useState as n,useEffect as t,useRef as r,useCallback as i,useLayoutEffect as o,useReducer as c}from"react";import u from"@babel/runtime/helpers/slicedToArray";import f from"@babel/runtime/helpers/defineProperty";import{breakpoints as s}from"@fremtind/jkl-core";var d=function(){var e=n(!("undefined"==typeof window||!window.matchMedia||window.matchMedia("(prefers-reduced-motion: no-preference)").matches)),r=u(e,2),i=r[0],o=r[1];return t((function(){var e,n,t;"undefined"!=typeof window&&window.matchMedia&&(e=window.matchMedia("(prefers-reduced-motion: no-preference)"),n=function(e){return o(!e.matches)},null===(t=e)||void 0===t||t.addListener(n));return function(){var t;null===(t=e)||void 0===t||t.removeListener(n)}}),[]),i};function a(e){var n=r(),c=r(),u=r(null),f=r(!0),s=d();function a(){var e=l(u);e&&e.removeAttribute("style")}var v=i((function(){if(!s&&!f.current){var t=l(u);if(t)if(t.style.display="block",t.style.overflow="hidden",e)t.style.height="0",t.style.height="".concat(t.scrollHeight,"px");else{if(0===t.scrollHeight)return void t.removeAttribute("style");t.style.height="".concat(t.scrollHeight,"px"),n.current=requestAnimationFrame((function(){c.current=requestAnimationFrame((function(){t.style.height="".concat(0,"px")}))}))}}}),[e]);return o((function(){v()}),[e,v]),t((function(){var e=l(u);return e&&e.addEventListener("transitionend",a),function(){e&&e.removeEventListener("transitionend",a)}}),[e]),t((function(){var e=n.current,t=c.current;return f.current=!1,function(){e&&cancelAnimationFrame(e),t&&cancelAnimationFrame(t)}}),[n,c]),[u,v]}function l(e){return e.current&&(e.current.el||e.current)}function v(n,t){function r(e){n&&n.current&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("click",r),function(){n&&document&&document.removeEventListener("click",r)}}))}function m(n,t){function r(e){n&&n.current&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("focusin",r),function(){n&&document&&document.removeEventListener("focusin",r)}}))}function p(e,n,r){function i(e){n&&!n.includes(e.key)||r(e)}"string"==typeof n&&(n=[n]),t((function(){var n=e&&e.current;return n&&n.addEventListener("keydown",i),function(){n&&n.removeEventListener("keydown",i)}}))}var w,y=function(){return"undefined"!=typeof window&&"undefined"!=typeof MutationObserver},h=function(e,n,i){var o=r(null);t((function(){var t=o.current;if(y()){var r=e.current;t&&t.disconnect(),t=new MutationObserver(n),r&&t.observe(r,i)}return function(){y()&&t&&t.disconnect()}}),[e,n,i])},b=function(){return"undefined"!=typeof window&&"undefined"!=typeof IntersectionObserver},O=function(e,n,i,o){var c=r(null);t((function(){var t=c.current;if(b()){var r=e.current;t&&t.disconnect(),t=new IntersectionObserver(n,o),r&&t.observe(r)}else i();return function(){b()&&t&&t.disconnect()}}),[e,n,i,o])};function g(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function j(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?g(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):g(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}!function(e){e.resized="WINDOW_RESIZED"}(w||(w={}));var P={resized:w.resized},D=function(e,n){return{isSmallDevice:e<s.small,isMediumDevice:e>s.small&&e<s.medium,isLargeDevice:e>s.medium&&e<s.large,isXlDevice:e>s.large,isPortrait:n>=e,isLandscape:n<e,inner:{height:n,width:e}}},E={isSmallDevice:!1,isMediumDevice:!1,isLargeDevice:!1,isXlDevice:!1,isLandscape:!1,isPortrait:!1,inner:{height:0,width:0}},L=function(){var e="undefined"!=typeof window?window.innerWidth:0,n="undefined"!=typeof window?window.innerHeight:0;return D(e,n)},S=function(e,n){var t=n.type,r=n.width,i=n.height;switch(t){case P.resized:return j(j({},e),D(r,i))}};function k(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}var A=function(){var e=c(S,E,L),n=u(e,2),r=n[0],i=n[1],o=function(){return requestAnimationFrame((function(){return i({type:P.resized,width:window.innerWidth,height:window.innerHeight})}))};return t((function(){return"undefined"!=typeof window&&window.addEventListener("resize",o),function(){"undefined"!=typeof window&&window.removeEventListener("resize",o)}}),[]),function(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?k(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):k(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}({},r)},M=function(e){var n=e.ref,r=e.timeout,i=void 0===r?0:r,o=e.autoScroll,c=void 0===o||o,u=e.options,f=void 0===u?{behavior:"smooth"}:u,s=function(){n&&n.current&&n.current.scrollIntoView(f)};return t((function(){if(c){var e=setTimeout(s,i);return function(){return clearTimeout(e)}}}),[n,i,c]),[s]};export{E as initialScreenState,a as useAnimatedHeight,v as useClickOutside,m as useFocusOutside,O as useIntersectionObserver,p as useKeyListener,h as useMutationObserver,d as useReducedMotion,A as useScreen,M as useScrollIntoView};
+import e,{useState as n,useEffect as t,useRef as r,useCallback as i,useLayoutEffect as o,useReducer as c}from"react";import u from"@babel/runtime/helpers/slicedToArray";import f from"@babel/runtime/helpers/defineProperty";import{breakpoints as d}from"@fremtind/jkl-core";var s=function(){var e=n(!("undefined"==typeof window||!window.matchMedia||window.matchMedia("(prefers-reduced-motion: no-preference)").matches)),r=u(e,2),i=r[0],o=r[1];return t((function(){var e,n,t;"undefined"!=typeof window&&window.matchMedia&&(e=window.matchMedia("(prefers-reduced-motion: no-preference)"),n=function(e){return o(!e.matches)},null===(t=e)||void 0===t||t.addListener(n));return function(){var t;null===(t=e)||void 0===t||t.removeListener(n)}}),[]),i};function a(e){var n=r(),c=r(),u=r(null),f=r(!0),d=s();function a(){var e=l(u);e&&e.removeAttribute("style")}var v=i((function(){if(!d&&!f.current){var t=l(u);if(t)if(t.style.display="block",t.style.overflow="hidden",e)t.style.height="0",t.style.height="".concat(t.scrollHeight,"px");else{if(0===t.scrollHeight)return void t.removeAttribute("style");t.style.height="".concat(t.scrollHeight,"px"),n.current=requestAnimationFrame((function(){c.current=requestAnimationFrame((function(){t.style.height="".concat(0,"px")}))}))}}}),[e]);return o((function(){v()}),[e,v]),t((function(){var e=l(u);return e&&e.addEventListener("transitionend",a),function(){e&&e.removeEventListener("transitionend",a)}}),[e]),t((function(){var e=n.current,t=c.current;return f.current=!1,function(){e&&cancelAnimationFrame(e),t&&cancelAnimationFrame(t)}}),[n,c]),[u,v]}function l(e){return e.current&&(e.current.el||e.current)}function v(n,t){function r(e){(null==n?void 0:n.current)&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("click",r),function(){n&&document&&document.removeEventListener("click",r)}}))}function m(n,t){function r(e){(null==n?void 0:n.current)&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("focusin",r),function(){n&&document&&document.removeEventListener("focusin",r)}}))}function p(e,n,r){function i(e){n&&!n.includes(e.key)||r(e)}"string"==typeof n&&(n=[n]),t((function(){var n=e&&e.current;return n&&n.addEventListener("keydown",i),function(){n&&n.removeEventListener("keydown",i)}}))}var w,y=function(){return"undefined"!=typeof window&&"undefined"!=typeof MutationObserver},h=function(e,n,i){var o=r(null);t((function(){var t=o.current;if(y()){var r=e.current;t&&t.disconnect(),t=new MutationObserver(n),r&&t.observe(r,i)}return function(){y()&&t&&t.disconnect()}}),[e,n,i])},b=function(){return"undefined"!=typeof window&&"undefined"!=typeof IntersectionObserver},O=function(e,n,i,o){var c=r(null);t((function(){var t=c.current;if(b()){var r=e.current;t&&t.disconnect(),t=new IntersectionObserver(n,o),r&&t.observe(r)}else i();return function(){b()&&t&&t.disconnect()}}),[e,n,i,o])};function g(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function j(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?g(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):g(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}!function(e){e.resized="WINDOW_RESIZED"}(w||(w={}));var P={resized:w.resized},D=function(e,n){return{isSmallDevice:e<d.small,isMediumDevice:e>d.small&&e<d.medium,isLargeDevice:e>d.medium&&e<d.large,isXlDevice:e>d.large,isPortrait:n>=e,isLandscape:n<e,inner:{height:n,width:e}}},E={isSmallDevice:!1,isMediumDevice:!1,isLargeDevice:!1,isXlDevice:!1,isLandscape:!1,isPortrait:!1,inner:{height:0,width:0}},L=function(){var e="undefined"!=typeof window?window.innerWidth:0,n="undefined"!=typeof window?window.innerHeight:0;return D(e,n)},S=function(e,n){var t=n.type,r=n.width,i=n.height;switch(t){case P.resized:return j(j({},e),D(r,i))}};function k(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}var A=function(){var e=c(S,E,L),n=u(e,2),r=n[0],i=n[1],o=function(){return requestAnimationFrame((function(){return i({type:P.resized,width:window.innerWidth,height:window.innerHeight})}))};return t((function(){return"undefined"!=typeof window&&window.addEventListener("resize",o),function(){"undefined"!=typeof window&&window.removeEventListener("resize",o)}}),[]),function(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?k(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):k(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}({},r)},M=function(e){var n=e.ref,r=e.timeout,i=void 0===r?0:r,o=e.autoScroll,c=void 0===o||o,u=e.options,f=void 0===u?{behavior:"smooth"}:u,d=function(){(null==n?void 0:n.current)&&n.current.scrollIntoView(f)};return t((function(){if(c){var e=setTimeout(d,i);return function(){return clearTimeout(e)}}}),[n,i,c]),[d]},z=function(e){var r=e.lowQualitySrc,i=e.highQualitySrc,o=n(r),c=u(o,2),f=c[0],d=c[1];return t((function(){d(r);var e=new Image;e.src=i,e.onload=function(){d(i)}}),[r,i]),{src:f,isBlurred:f===r}};export{E as initialScreenState,a as useAnimatedHeight,v as useClickOutside,m as useFocusOutside,O as useIntersectionObserver,p as useKeyListener,h as useMutationObserver,z as useProgressiveImg,s as useReducedMotion,A as useScreen,M as useScrollIntoView};

build/cjs/index.js

@@ -144,3 +144,3 @@ 'use strict';
   function handleClickOutside(event) {
-    if (ref && ref.current && !ref.current.contains(event.target)) {
+    if ((ref === null || ref === void 0 ? void 0 : ref.current) && !ref.current.contains(event.target)) {
       fn();
@@ -165,3 +165,3 @@ }
   function handleFocusOutside(event) {
-    if (ref && ref.current && !ref.current.contains(event.target)) {
+    if ((ref === null || ref === void 0 ? void 0 : ref.current) && !ref.current.contains(event.target)) {
       fn();
@@ -377,3 +377,3 @@ }
   var scrollIntoView = function scrollIntoView() {
-    if (ref && ref.current) {
+    if (ref === null || ref === void 0 ? void 0 : ref.current) {
       ref.current.scrollIntoView(options);
@@ -396,2 +396,26 @@ }
 
+var useProgressiveImg = function useProgressiveImg(_ref) {
+  var lowQualitySrc = _ref.lowQualitySrc,
+      highQualitySrc = _ref.highQualitySrc;
+
+  var _useState = React.useState(lowQualitySrc),
+      _useState2 = _slicedToArray__default['default'](_useState, 2),
+      src = _useState2[0],
+      setSrc = _useState2[1];
+
+  React.useEffect(function () {
+    setSrc(lowQualitySrc);
+    var img = new Image();
+    img.src = highQualitySrc;
+
+    img.onload = function () {
+      setSrc(highQualitySrc);
+    };
+  }, [lowQualitySrc, highQualitySrc]);
+  return {
+    src: src,
+    isBlurred: src === lowQualitySrc
+  };
+};
+
 exports.initialScreenState = initialState;
@@ -404,4 +428,5 @@ exports.useAnimatedHeight = useAnimatedHeight;
 exports.useMutationObserver = useMutationObserver;
+exports.useProgressiveImg = useProgressiveImg;
 exports.useReducedMotion = useReducedMotion;
 exports.useScreen = useScreen;
 exports.useScrollIntoView = useScrollIntoView;

build/esm/index.js

@@ -134,3 +134,3 @@ import React, { useState, useEffect, useRef, useCallback, useLayoutEffect, useReducer } from 'react';
   function handleClickOutside(event) {
-    if (ref && ref.current && !ref.current.contains(event.target)) {
+    if ((ref === null || ref === void 0 ? void 0 : ref.current) && !ref.current.contains(event.target)) {
       fn();
@@ -155,3 +155,3 @@ }
   function handleFocusOutside(event) {
-    if (ref && ref.current && !ref.current.contains(event.target)) {
+    if ((ref === null || ref === void 0 ? void 0 : ref.current) && !ref.current.contains(event.target)) {
       fn();
@@ -367,3 +367,3 @@ }
   var scrollIntoView = function scrollIntoView() {
-    if (ref && ref.current) {
+    if (ref === null || ref === void 0 ? void 0 : ref.current) {
       ref.current.scrollIntoView(options);
@@ -386,2 +386,26 @@ }
 
-export { initialState as initialScreenState, useAnimatedHeight, useClickOutside, useFocusOutside, useIntersectionObserver, useKeyListener, useMutationObserver, useReducedMotion, useScreen, useScrollIntoView };
+var useProgressiveImg = function useProgressiveImg(_ref) {
+  var lowQualitySrc = _ref.lowQualitySrc,
+      highQualitySrc = _ref.highQualitySrc;
+
+  var _useState = useState(lowQualitySrc),
+      _useState2 = _slicedToArray(_useState, 2),
+      src = _useState2[0],
+      setSrc = _useState2[1];
+
+  useEffect(function () {
+    setSrc(lowQualitySrc);
+    var img = new Image();
+    img.src = highQualitySrc;
+
+    img.onload = function () {
+      setSrc(highQualitySrc);
+    };
+  }, [lowQualitySrc, highQualitySrc]);
+  return {
+    src: src,
+    isBlurred: src === lowQualitySrc
+  };
+};
+
+export { initialState as initialScreenState, useAnimatedHeight, useClickOutside, useFocusOutside, useIntersectionObserver, useKeyListener, useMutationObserver, useProgressiveImg, useReducedMotion, useScreen, useScrollIntoView };

build/esm/index.min.js

@@ -1,1 +0,1 @@
-import e,{useState as n,useEffect as t,useRef as r,useCallback as i,useLayoutEffect as o,useReducer as c}from"react";import u from"@babel/runtime/helpers/slicedToArray";import f from"@babel/runtime/helpers/defineProperty";import{breakpoints as s}from"@fremtind/jkl-core";var d=function(){var e=n(!("undefined"==typeof window||!window.matchMedia||window.matchMedia("(prefers-reduced-motion: no-preference)").matches)),r=u(e,2),i=r[0],o=r[1];return t((function(){var e,n,t;"undefined"!=typeof window&&window.matchMedia&&(e=window.matchMedia("(prefers-reduced-motion: no-preference)"),n=function(e){return o(!e.matches)},null===(t=e)||void 0===t||t.addListener(n));return function(){var t;null===(t=e)||void 0===t||t.removeListener(n)}}),[]),i};function a(e){var n=r(),c=r(),u=r(null),f=r(!0),s=d();function a(){var e=l(u);e&&e.removeAttribute("style")}var v=i((function(){if(!s&&!f.current){var t=l(u);if(t)if(t.style.display="block",t.style.overflow="hidden",e)t.style.height="0",t.style.height="".concat(t.scrollHeight,"px");else{if(0===t.scrollHeight)return void t.removeAttribute("style");t.style.height="".concat(t.scrollHeight,"px"),n.current=requestAnimationFrame((function(){c.current=requestAnimationFrame((function(){t.style.height="".concat(0,"px")}))}))}}}),[e]);return o((function(){v()}),[e,v]),t((function(){var e=l(u);return e&&e.addEventListener("transitionend",a),function(){e&&e.removeEventListener("transitionend",a)}}),[e]),t((function(){var e=n.current,t=c.current;return f.current=!1,function(){e&&cancelAnimationFrame(e),t&&cancelAnimationFrame(t)}}),[n,c]),[u,v]}function l(e){return e.current&&(e.current.el||e.current)}function v(n,t){function r(e){n&&n.current&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("click",r),function(){n&&document&&document.removeEventListener("click",r)}}))}function m(n,t){function r(e){n&&n.current&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("focusin",r),function(){n&&document&&document.removeEventListener("focusin",r)}}))}function p(e,n,r){function i(e){n&&!n.includes(e.key)||r(e)}"string"==typeof n&&(n=[n]),t((function(){var n=e&&e.current;return n&&n.addEventListener("keydown",i),function(){n&&n.removeEventListener("keydown",i)}}))}var w,y=function(){return"undefined"!=typeof window&&"undefined"!=typeof MutationObserver},h=function(e,n,i){var o=r(null);t((function(){var t=o.current;if(y()){var r=e.current;t&&t.disconnect(),t=new MutationObserver(n),r&&t.observe(r,i)}return function(){y()&&t&&t.disconnect()}}),[e,n,i])},b=function(){return"undefined"!=typeof window&&"undefined"!=typeof IntersectionObserver},O=function(e,n,i,o){var c=r(null);t((function(){var t=c.current;if(b()){var r=e.current;t&&t.disconnect(),t=new IntersectionObserver(n,o),r&&t.observe(r)}else i();return function(){b()&&t&&t.disconnect()}}),[e,n,i,o])};function g(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function j(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?g(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):g(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}!function(e){e.resized="WINDOW_RESIZED"}(w||(w={}));var P={resized:w.resized},D=function(e,n){return{isSmallDevice:e<s.small,isMediumDevice:e>s.small&&e<s.medium,isLargeDevice:e>s.medium&&e<s.large,isXlDevice:e>s.large,isPortrait:n>=e,isLandscape:n<e,inner:{height:n,width:e}}},E={isSmallDevice:!1,isMediumDevice:!1,isLargeDevice:!1,isXlDevice:!1,isLandscape:!1,isPortrait:!1,inner:{height:0,width:0}},L=function(){var e="undefined"!=typeof window?window.innerWidth:0,n="undefined"!=typeof window?window.innerHeight:0;return D(e,n)},S=function(e,n){var t=n.type,r=n.width,i=n.height;switch(t){case P.resized:return j(j({},e),D(r,i))}};function k(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}var A=function(){var e=c(S,E,L),n=u(e,2),r=n[0],i=n[1],o=function(){return requestAnimationFrame((function(){return i({type:P.resized,width:window.innerWidth,height:window.innerHeight})}))};return t((function(){return"undefined"!=typeof window&&window.addEventListener("resize",o),function(){"undefined"!=typeof window&&window.removeEventListener("resize",o)}}),[]),function(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?k(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):k(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}({},r)},M=function(e){var n=e.ref,r=e.timeout,i=void 0===r?0:r,o=e.autoScroll,c=void 0===o||o,u=e.options,f=void 0===u?{behavior:"smooth"}:u,s=function(){n&&n.current&&n.current.scrollIntoView(f)};return t((function(){if(c){var e=setTimeout(s,i);return function(){return clearTimeout(e)}}}),[n,i,c]),[s]};export{E as initialScreenState,a as useAnimatedHeight,v as useClickOutside,m as useFocusOutside,O as useIntersectionObserver,p as useKeyListener,h as useMutationObserver,d as useReducedMotion,A as useScreen,M as useScrollIntoView};
+import e,{useState as n,useEffect as t,useRef as r,useCallback as i,useLayoutEffect as o,useReducer as c}from"react";import u from"@babel/runtime/helpers/slicedToArray";import f from"@babel/runtime/helpers/defineProperty";import{breakpoints as d}from"@fremtind/jkl-core";var s=function(){var e=n(!("undefined"==typeof window||!window.matchMedia||window.matchMedia("(prefers-reduced-motion: no-preference)").matches)),r=u(e,2),i=r[0],o=r[1];return t((function(){var e,n,t;"undefined"!=typeof window&&window.matchMedia&&(e=window.matchMedia("(prefers-reduced-motion: no-preference)"),n=function(e){return o(!e.matches)},null===(t=e)||void 0===t||t.addListener(n));return function(){var t;null===(t=e)||void 0===t||t.removeListener(n)}}),[]),i};function a(e){var n=r(),c=r(),u=r(null),f=r(!0),d=s();function a(){var e=l(u);e&&e.removeAttribute("style")}var v=i((function(){if(!d&&!f.current){var t=l(u);if(t)if(t.style.display="block",t.style.overflow="hidden",e)t.style.height="0",t.style.height="".concat(t.scrollHeight,"px");else{if(0===t.scrollHeight)return void t.removeAttribute("style");t.style.height="".concat(t.scrollHeight,"px"),n.current=requestAnimationFrame((function(){c.current=requestAnimationFrame((function(){t.style.height="".concat(0,"px")}))}))}}}),[e]);return o((function(){v()}),[e,v]),t((function(){var e=l(u);return e&&e.addEventListener("transitionend",a),function(){e&&e.removeEventListener("transitionend",a)}}),[e]),t((function(){var e=n.current,t=c.current;return f.current=!1,function(){e&&cancelAnimationFrame(e),t&&cancelAnimationFrame(t)}}),[n,c]),[u,v]}function l(e){return e.current&&(e.current.el||e.current)}function v(n,t){function r(e){(null==n?void 0:n.current)&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("click",r),function(){n&&document&&document.removeEventListener("click",r)}}))}function m(n,t){function r(e){(null==n?void 0:n.current)&&!n.current.contains(e.target)&&t()}e.useEffect((function(){return n&&document&&document.addEventListener("focusin",r),function(){n&&document&&document.removeEventListener("focusin",r)}}))}function p(e,n,r){function i(e){n&&!n.includes(e.key)||r(e)}"string"==typeof n&&(n=[n]),t((function(){var n=e&&e.current;return n&&n.addEventListener("keydown",i),function(){n&&n.removeEventListener("keydown",i)}}))}var w,y=function(){return"undefined"!=typeof window&&"undefined"!=typeof MutationObserver},h=function(e,n,i){var o=r(null);t((function(){var t=o.current;if(y()){var r=e.current;t&&t.disconnect(),t=new MutationObserver(n),r&&t.observe(r,i)}return function(){y()&&t&&t.disconnect()}}),[e,n,i])},b=function(){return"undefined"!=typeof window&&"undefined"!=typeof IntersectionObserver},O=function(e,n,i,o){var c=r(null);t((function(){var t=c.current;if(b()){var r=e.current;t&&t.disconnect(),t=new IntersectionObserver(n,o),r&&t.observe(r)}else i();return function(){b()&&t&&t.disconnect()}}),[e,n,i,o])};function g(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function j(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?g(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):g(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}!function(e){e.resized="WINDOW_RESIZED"}(w||(w={}));var P={resized:w.resized},D=function(e,n){return{isSmallDevice:e<d.small,isMediumDevice:e>d.small&&e<d.medium,isLargeDevice:e>d.medium&&e<d.large,isXlDevice:e>d.large,isPortrait:n>=e,isLandscape:n<e,inner:{height:n,width:e}}},E={isSmallDevice:!1,isMediumDevice:!1,isLargeDevice:!1,isXlDevice:!1,isLandscape:!1,isPortrait:!1,inner:{height:0,width:0}},L=function(){var e="undefined"!=typeof window?window.innerWidth:0,n="undefined"!=typeof window?window.innerHeight:0;return D(e,n)},S=function(e,n){var t=n.type,r=n.width,i=n.height;switch(t){case P.resized:return j(j({},e),D(r,i))}};function k(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}var A=function(){var e=c(S,E,L),n=u(e,2),r=n[0],i=n[1],o=function(){return requestAnimationFrame((function(){return i({type:P.resized,width:window.innerWidth,height:window.innerHeight})}))};return t((function(){return"undefined"!=typeof window&&window.addEventListener("resize",o),function(){"undefined"!=typeof window&&window.removeEventListener("resize",o)}}),[]),function(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?k(Object(t),!0).forEach((function(n){f(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):k(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}({},r)},M=function(e){var n=e.ref,r=e.timeout,i=void 0===r?0:r,o=e.autoScroll,c=void 0===o||o,u=e.options,f=void 0===u?{behavior:"smooth"}:u,d=function(){(null==n?void 0:n.current)&&n.current.scrollIntoView(f)};return t((function(){if(c){var e=setTimeout(d,i);return function(){return clearTimeout(e)}}}),[n,i,c]),[d]},z=function(e){var r=e.lowQualitySrc,i=e.highQualitySrc,o=n(r),c=u(o,2),f=c[0],d=c[1];return t((function(){d(r);var e=new Image;e.src=i,e.onload=function(){d(i)}}),[r,i]),{src:f,isBlurred:f===r}};export{E as initialScreenState,a as useAnimatedHeight,v as useClickOutside,m as useFocusOutside,O as useIntersectionObserver,p as useKeyListener,h as useMutationObserver,z as useProgressiveImg,s as useReducedMotion,A as useScreen,M as useScrollIntoView};

build/index.d.ts

@@ -11,1 +11,2 @@ export { useAnimatedHeight } from "./animation";
 export { useReducedMotion } from "./useReducedMotion/useReducedMotion";
+export { useProgressiveImg } from "./useProgressiveImg/useProgressiveImg";

CHANGELOG.md

@@ -6,2 +6,8 @@ # Change Log
 
+## 1.7.0 (2020-10-07)
+
+### Features
+
+- **image:** add image component ([8e99f33](https://github.com/fremtind/jokul/commit/8e99f33a12f2e598aff8a15eabe230ea666f0cbd))
+
 ## 1.6.0 (2020-08-13)
@@ -8,0 +14,0 @@

package.json

 {
     "name": "@fremtind/jkl-react-hooks",
-    "version": "1.6.11",
+    "version": "1.7.0",
     "publishConfig": {
@@ -37,3 +37,3 @@ "access": "public"
     "devDependencies": {
-        "@fremtind/jkl-portal-components": "^0.7.4"
+        "@fremtind/jkl-portal-components": "^0.7.5"
     },
@@ -57,3 +57,3 @@ "dependencies": {
     },
-    "gitHead": "9b37f369dc9b90b9a86352042ac6a0180d32d019"
+    "gitHead": "5ec088c64cb116a2c5ea1a6fdd5d5e386a306fb8"
 }

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

Improved metrics

Total package byte prevSize

64406

increased by5.19%

Number of package files

21

increased by5%

Lines of code

1200

increased by6.48%

No dependency changes