@che-ins-ui/theme - npm Package Compare versions

Comparing version 2.0.8 to 2.1.0

dist/hooks.d.ts

@@ -1,2 +0,2 @@
-export declare const useScreenSizes: () => {
+export declare const useScreenSizes: (initialWidth?: number, initialHeight?: number) => {
     width: number;
@@ -3,0 +3,0 @@ height: number;

dist/theme.cjs.development.js

@@ -9,2 +9,3 @@ 'use strict';
 var react = require('react');
+var utils = require('@che-ins-ui/utils');
 var jsxRuntime = require('react/jsx-runtime');
@@ -133,6 +134,14 @@ var reactJss = require('react-jss');
 
-var useScreenSizes = function useScreenSizes() {
+var useScreenSizes = function useScreenSizes(initialWidth, initialHeight) {
+  if (initialWidth === void 0) {
+    initialWidth = Infinity;
+  }
+
+  if (initialHeight === void 0) {
+    initialHeight = Infinity;
+  }
+
   var _useState = react.useState({
-    width: window.innerWidth,
-    height: window.innerHeight
+    width: utils.isBrowser() ? window.innerWidth : initialWidth,
+    height: utils.isBrowser() ? window.innerHeight : initialHeight
   }),
@@ -143,14 +152,18 @@ windowSize = _useState[0],
   react.useEffect(function () {
-    var handleResize = function handleResize() {
-      setWindowSize({
-        width: window.innerWidth,
-        height: window.innerHeight
-      });
-    };
+    if (utils.isBrowser()) {
+      var handleResize = function handleResize() {
+        setWindowSize({
+          width: window.innerWidth,
+          height: window.innerHeight
+        });
+      };
 
-    window.addEventListener("resize", handleResize);
-    handleResize();
-    return function () {
-      return window.removeEventListener("resize", handleResize);
-    };
+      window.addEventListener("resize", handleResize);
+      handleResize();
+      return function () {
+        return window.removeEventListener("resize", handleResize);
+      };
+    } else {
+      return;
+    }
   }, []);
@@ -157,0 +170,0 @@ var width = windowSize.width,

dist/theme.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,n=(e=require("classnames"))&&"object"==typeof e&&"default"in e?e.default:e,r=require("react"),t=require("react/jsx-runtime"),i=require("react-jss");function s(){return(s=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e}).apply(this,arguments)}var o=function(e){return e.filter(Boolean).join("-")};function a(e,n,r){return r.indexOf(e)===n}var u=function(e,n){for(var r={},t=0,i=Object.entries(e);t<i.length;t++){var s=i[t],a=s[1];r[o([s[0],n])]=a}return r},d={xs:320,sm:576,md:768,lg:992,xl:1160,xxl:1400},c=function(e){return"number"==typeof e?e:d[e]};function l(e){return"@media screen and (min-width: "+c(e)+"px)"}function f(e){return"@media screen and (max-width: "+(c(e)-1)+"px)"}function x(e,n){return"@media screen and (min-width: "+c(e)+"px) and (max-width: "+(c(n)-1)+"px)"}var h=s({},d,{up:l,down:f,between:x}),m=function(e,n){return(null==n?void 0:n.options.classNamePrefix)+e.key};exports.BREAKPOINTS=h,exports.CheJssProvider=function(e){var n=e.classNamePrefix;return t.jsx(i.JssProvider,{classNamePrefix:void 0===n?"che-":n,generateId:m,children:e.children})},exports.createClasses=function(e,n){return function(r){var t=u(e);return Object.assign(t,function(e,n){for(var r,t={},i=(null==(r=e.components)?void 0:r[n])||{},s=0,o=Object.entries(i);s<o.length;s++){var a=o[s];t=Object.assign(t,u(a[1],a[0]))}return t}(r,n))}},exports.getClassName=function(e,r,t,i){var s=[e[i],e[o([i,"base"])],e[o([i,r])],e[o([i,t])]].filter(a);return n.apply(void 0,s)},exports.mediaBetweenWidth=x,exports.mediaMaxWidth=f,exports.mediaMinWidth=l,exports.useScreenSizes=function(){var e=r.useState({width:window.innerWidth,height:window.innerHeight}),n=e[0],t=e[1];r.useEffect((function(){var e=function(){t({width:window.innerWidth,height:window.innerHeight})};return window.addEventListener("resize",e),e(),function(){return window.removeEventListener("resize",e)}}),[]);var i=n.width,s=i<h.md;return{width:i,height:n.height,xs:i<h.sm,sm:i>=h.sm&&i<h.md,md:i>=h.md&&i<h.lg,lg:i>=h.lg&&i<h.xl,xl:i>=h.xl&&i<h.xxl,xxl:i>=h.xxl,isMobile:s,isDesktop:!s}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,n=(e=require("classnames"))&&"object"==typeof e&&"default"in e?e.default:e,r=require("react"),t=require("@che-ins-ui/utils"),i=require("react/jsx-runtime"),s=require("react-jss");function o(){return(o=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e}).apply(this,arguments)}var a=function(e){return e.filter(Boolean).join("-")};function u(e,n,r){return r.indexOf(e)===n}var d=function(e,n){for(var r={},t=0,i=Object.entries(e);t<i.length;t++){var s=i[t],o=s[1];r[a([s[0],n])]=o}return r},c={xs:320,sm:576,md:768,lg:992,xl:1160,xxl:1400},l=function(e){return"number"==typeof e?e:c[e]};function f(e){return"@media screen and (min-width: "+l(e)+"px)"}function x(e){return"@media screen and (max-width: "+(l(e)-1)+"px)"}function h(e,n){return"@media screen and (min-width: "+l(e)+"px) and (max-width: "+(l(n)-1)+"px)"}var v=o({},c,{up:f,down:x,between:h}),m=function(e,n){return(null==n?void 0:n.options.classNamePrefix)+e.key};exports.BREAKPOINTS=v,exports.CheJssProvider=function(e){var n=e.classNamePrefix;return i.jsx(s.JssProvider,{classNamePrefix:void 0===n?"che-":n,generateId:m,children:e.children})},exports.createClasses=function(e,n){return function(r){var t=d(e);return Object.assign(t,function(e,n){for(var r,t={},i=(null==(r=e.components)?void 0:r[n])||{},s=0,o=Object.entries(i);s<o.length;s++){var a=o[s];t=Object.assign(t,d(a[1],a[0]))}return t}(r,n))}},exports.getClassName=function(e,r,t,i){var s=[e[i],e[a([i,"base"])],e[a([i,r])],e[a([i,t])]].filter(u);return n.apply(void 0,s)},exports.mediaBetweenWidth=h,exports.mediaMaxWidth=x,exports.mediaMinWidth=f,exports.useScreenSizes=function(e,n){void 0===e&&(e=Infinity),void 0===n&&(n=Infinity);var i=r.useState({width:t.isBrowser()?window.innerWidth:e,height:t.isBrowser()?window.innerHeight:n}),s=i[0],o=i[1];r.useEffect((function(){if(t.isBrowser()){var e=function(){o({width:window.innerWidth,height:window.innerHeight})};return window.addEventListener("resize",e),e(),function(){return window.removeEventListener("resize",e)}}}),[]);var a=s.width,u=a<v.md;return{width:a,height:s.height,xs:a<v.sm,sm:a>=v.sm&&a<v.md,md:a>=v.md&&a<v.lg,lg:a>=v.lg&&a<v.xl,xl:a>=v.xl&&a<v.xxl,xxl:a>=v.xxl,isMobile:u,isDesktop:!u}};
 //# sourceMappingURL=theme.cjs.production.min.js.map

dist/theme.esm.js

 import classNames from 'classnames';
 import { useState, useEffect } from 'react';
+import { isBrowser } from '@che-ins-ui/utils';
 import { jsx } from 'react/jsx-runtime';
@@ -126,6 +127,14 @@ import { JssProvider } from 'react-jss';
 
-var useScreenSizes = function useScreenSizes() {
+var useScreenSizes = function useScreenSizes(initialWidth, initialHeight) {
+  if (initialWidth === void 0) {
+    initialWidth = Infinity;
+  }
+
+  if (initialHeight === void 0) {
+    initialHeight = Infinity;
+  }
+
   var _useState = useState({
-    width: window.innerWidth,
-    height: window.innerHeight
+    width: isBrowser() ? window.innerWidth : initialWidth,
+    height: isBrowser() ? window.innerHeight : initialHeight
   }),
@@ -136,14 +145,18 @@ windowSize = _useState[0],
   useEffect(function () {
-    var handleResize = function handleResize() {
-      setWindowSize({
-        width: window.innerWidth,
-        height: window.innerHeight
-      });
-    };
+    if (isBrowser()) {
+      var handleResize = function handleResize() {
+        setWindowSize({
+          width: window.innerWidth,
+          height: window.innerHeight
+        });
+      };
 
-    window.addEventListener("resize", handleResize);
-    handleResize();
-    return function () {
-      return window.removeEventListener("resize", handleResize);
-    };
+      window.addEventListener("resize", handleResize);
+      handleResize();
+      return function () {
+        return window.removeEventListener("resize", handleResize);
+      };
+    } else {
+      return;
+    }
   }, []);
@@ -150,0 +163,0 @@ var width = windowSize.width,

package.json

 {
 	"name": "@che-ins-ui/theme",
-	"version": "2.0.8",
+	"version": "2.1.0",
 	"description": "<>",
@@ -27,2 +27,3 @@ "build:storybook": "src/index.ts",
 	"dependencies": {
+		"@che-ins-ui/utils": "^2.1.0",
 		"classnames": "^2.3.1",
@@ -34,3 +35,3 @@ "react-jss": "^10.9.0"
 	},
-	"gitHead": "941f549d7c33506717f0d25d9cf02b7c2a5e42ac"
+	"gitHead": "b201d23c2ffd957b4190ba4a645ad7899c4c56fb"
 }

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

61626

increased by3.78%

Lines of code

505

increased by4.77%

Worsened metrics

Dependency count

4

increased by33.33%

Dependency changes

• + Added@che-ins-ui/utils@^2.1.0

• + Added@che-ins-ui/theme@2.2.0(transitive)

• + Added@che-ins-ui/utils@2.2.0(transitive)

• + Added@types/uuid@8.3.4(transitive)

• + Addeduuid@8.3.2(transitive)