Socket
Socket
Sign inDemoInstall

@chakra-ui/utils

Package Overview
Dependencies
3
Maintainers
4
Versions
257
Alerts
File Explorer

Advanced tools

npm Scripts
License

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 1.5.1 to 1.5.2

dist/cjs/breakpoint.js
dist/cjs/breakpoint.js.map
dist/esm/breakpoint.js
dist/esm/breakpoint.js.map
dist/types/breakpoint.d.ts
dist/types/breakpoint.d.ts.map

8

CHANGELOG.md
# Change Log
## 1.5.2
### Patch Changes
- [`8b5eb9654`](https://github.com/chakra-ui/chakra-ui/commit/8b5eb9654affe562795d38a19f732f84732a949d)
Thanks [@segunadebayo](https://github.com/segunadebayo)! - update type
signature for `px` function
## 1.5.1

@@ -4,0 +12,0 @@

4

dist/cjs/array.js

@@ -107,3 +107,3 @@ "use strict";

function getPrevIndex(currentIndex, count, loop) {
function getPrevIndex(index, count, loop) {
if (loop === void 0) {

@@ -113,3 +113,3 @@ loop = true;

return getNextIndex(currentIndex, count, -1, loop);
return getNextIndex(index, count, -1, loop);
}

@@ -116,0 +116,0 @@ /**

65

dist/cjs/assertion.js

@@ -5,10 +5,19 @@ "use strict";

exports.isNumber = isNumber;
exports.isNotNumber = isNotNumber;
exports.isNumeric = isNumeric;
exports.isArray = isArray;
exports.isEmptyArray = isEmptyArray;
exports.isFunction = isFunction;
exports.isDefined = isDefined;
exports.isUndefined = isUndefined;
exports.isObject = isObject;
exports.isEmptyObject = isEmptyObject;
exports.isNotEmptyObject = isNotEmptyObject;
exports.isNull = isNull;
exports.isString = isString;
exports.isCssVar = isCssVar;
exports.isEmpty = isEmpty;
exports.isRefObject = isRefObject;
exports.isInputEvent = isInputEvent;
exports.isRefObject = exports.__TEST__ = exports.__DEV__ = exports.isEmpty = exports.isNull = exports.isEmptyObject = exports.isObject = exports.isUndefined = exports.isDefined = exports.isEmptyArray = exports.isNotNumber = void 0;
exports.__TEST__ = exports.__DEV__ = void 0;

@@ -20,8 +29,6 @@ // Number assertions

var isNotNumber = function isNotNumber(value) {
function isNotNumber(value) {
return typeof value !== "number" || Number.isNaN(value) || !Number.isFinite(value);
};
}
exports.isNotNumber = isNotNumber;
function isNumeric(value) {

@@ -36,9 +43,7 @@ return value != null && value - parseFloat(value) + 1 >= 0;

var isEmptyArray = function isEmptyArray(value) {
function isEmptyArray(value) {
return isArray(value) && value.length === 0;
}; // Function assertions
} // Function assertions
exports.isEmptyArray = isEmptyArray;
function isFunction(value) {

@@ -49,28 +54,20 @@ return typeof value === "function";

var isDefined = function isDefined(value) {
function isDefined(value) {
return typeof value !== "undefined" && value !== undefined;
};
}
exports.isDefined = isDefined;
var isUndefined = function isUndefined(value) {
function isUndefined(value) {
return typeof value === "undefined" || value === undefined;
}; // Object assertions
} // Object assertions
exports.isUndefined = isUndefined;
var isObject = function isObject(value) {
function isObject(value) {
var type = typeof value;
return value != null && (type === "object" || type === "function") && !isArray(value);
};
}
exports.isObject = isObject;
var isEmptyObject = function isEmptyObject(value) {
function isEmptyObject(value) {
return isObject(value) && Object.keys(value).length === 0;
};
}
exports.isEmptyObject = isEmptyObject;
function isNotEmptyObject(value) {

@@ -80,9 +77,7 @@ return value && !isEmptyObject(value);

var isNull = function isNull(value) {
function isNull(value) {
return value == null;
}; // String assertions
} // String assertions
exports.isNull = isNull;
function isString(value) {

@@ -97,3 +92,3 @@ return Object.prototype.toString.call(value) === "[object String]";

var isEmpty = function isEmpty(value) {
function isEmpty(value) {
if (isArray(value)) return isEmptyArray(value);

@@ -103,6 +98,4 @@ if (isObject(value)) return isEmptyObject(value);

return false;
};
}
exports.isEmpty = isEmpty;
var __DEV__ = process.env.NODE_ENV !== "production";

@@ -116,8 +109,6 @@

var isRefObject = function isRefObject(val) {
function isRefObject(val) {
return "current" in val;
};
}
exports.isRefObject = isRefObject;
function isInputEvent(value) {

@@ -124,0 +115,0 @@ return value && isObject(value) && isObject(value.target);

9

dist/cjs/dom.js

@@ -12,3 +12,4 @@ "use strict";

exports.getRelatedTarget = getRelatedTarget;
exports.isRightClick = exports.cx = exports.ariaAttr = exports.dataAttr = exports.isBrowser = void 0;
exports.isRightClick = isRightClick;
exports.cx = exports.ariaAttr = exports.dataAttr = exports.isBrowser = void 0;

@@ -95,7 +96,5 @@ function getOwnerWindow(node) {

var isRightClick = function isRightClick(event) {
function isRightClick(event) {
return event.button !== 0;
};
exports.isRightClick = isRightClick;
}
//# sourceMappingURL=dom.js.map

8

dist/cjs/index.js

@@ -116,2 +116,10 @@ "use strict";

});
var _breakpoint = require("./breakpoint");
Object.keys(_breakpoint).forEach(function (key) {
if (key === "default" || key === "__esModule") return;
if (key in exports && exports[key] === _breakpoint[key]) return;
exports[key] = _breakpoint[key];
});
//# sourceMappingURL=index.js.map

146

dist/cjs/responsive.js

@@ -8,4 +8,3 @@ "use strict";

exports.isResponsiveObjectLike = isResponsiveObjectLike;
exports.analyzeBreakpoints = analyzeBreakpoints;
exports.isCustomBreakpoint = exports.px = exports.breakpoints = void 0;
exports.isCustomBreakpoint = exports.breakpoints = void 0;

@@ -89,143 +88,2 @@ var _array = require("./array");

/**
* @note
* The code below is the recommended way to analyze breakpoints
* related stuff. Avoid using functions above, it'll be removed in the
* next major
*/
var analyzeCSSValue = function analyzeCSSValue(value) {
var num = parseFloat(value.toString());
var unit = value.toString().replace(String(num), "");
return {
unitless: !unit,
value: num,
unit: unit
};
};
var px = function px(value) {
if (value == null) return value;
var _analyzeCSSValue = analyzeCSSValue(value),
unitless = _analyzeCSSValue.unitless;
return unitless || (0, _assertion.isNumber)(value) ? value + "px" : value;
};
exports.px = px;
var sortByBreakpointValue = function sortByBreakpointValue(a, b) {
return parseInt(a[1], 10) > parseInt(b[1], 10) ? 1 : -1;
};
var sortBps = function sortBps(breakpoints) {
return (0, _object.fromEntries)(Object.entries(breakpoints).sort(sortByBreakpointValue));
};
function normalize(breakpoints) {
var sorted = sortBps(breakpoints);
return Object.assign(Object.values(sorted), sorted);
}
function keys(breakpoints) {
var value = Object.keys(sortBps(breakpoints));
return new Set(value);
}
function subtract(value) {
if (!value) return value;
value = px(value);
var factor = value.endsWith("px") ? -1 : // the equivalent of 1px in em using a 16px base
-0.0635;
return (0, _assertion.isNumber)(value) ? "" + (value + factor) : value.replace(/([0-9]+\.?[0-9]*)/, function (m) {
return "" + (parseFloat(m) + factor);
});
}
function queryString(min, max) {
var query = [];
if (min) query.push("@media screen and (min-width: " + px(min) + ")");
if (query.length > 0 && max) query.push("and");
if (max) query.push("@media screen and (max-width: " + px(max) + ")");
return query.join(" ");
}
function analyzeBreakpoints(breakpoints) {
var _breakpoints$base;
if (!breakpoints) return null;
breakpoints.base = (_breakpoints$base = breakpoints.base) != null ? _breakpoints$base : "0px";
var normalized = normalize(breakpoints);
var queries = Object.entries(breakpoints).sort(sortByBreakpointValue).map(function (_ref, index, entry) {
var _entry;
var breakpoint = _ref[0],
minW = _ref[1];
var _ref2 = (_entry = entry[index + 1]) != null ? _entry : [],
maxW = _ref2[1];
maxW = parseFloat(maxW) > 0 ? subtract(maxW) : undefined;
return {
breakpoint: breakpoint,
minW: minW,
maxW: maxW,
maxWQuery: queryString(null, maxW),
minWQuery: queryString(minW),
minMaxQuery: queryString(minW, maxW)
};
});
var _keys = keys(breakpoints);
var _keysArr = Array.from(_keys.values());
return {
keys: _keys,
normalized: normalized,
isResponsive: function isResponsive(test) {
var keys = Object.keys(test);
return keys.length > 0 && keys.every(function (key) {
return _keys.has(key);
});
},
asObject: sortBps(breakpoints),
asArray: normalize(breakpoints),
details: queries,
media: [null].concat(normalized.map(function (minW) {
return queryString(minW);
}).slice(1)),
toArrayValue: function toArrayValue(test) {
if (!(0, _assertion.isObject)(test)) {
throw new Error("toArrayValue: value must be an object");
}
var result = _keysArr.map(function (bp) {
var _test$bp;
return (_test$bp = test[bp]) != null ? _test$bp : null;
});
while ((0, _array.getLastItem)(result) === null) {
result.pop();
}
return result;
},
toObjectValue: function toObjectValue(test) {
if (!Array.isArray(test)) {
throw new Error("toObjectValue: value must be an array");
}
return test.reduce(function (acc, value, index) {
var key = _keysArr[index];
if (key != null && value != null) acc[key] = value;
return acc;
}, {});
}
};
}
/**
* since breakpoints are defined as custom properties on an array, you may

@@ -237,2 +95,4 @@ * `Object.keys(theme.breakpoints)` to retrieve both regular numeric indices

*/
var isCustomBreakpoint = function isCustomBreakpoint(maybeBreakpoint) {

@@ -239,0 +99,0 @@ return Number.isNaN(Number(maybeBreakpoint));

4

dist/esm/array.js

@@ -80,3 +80,3 @@ export function getFirstItem(array) {

export function getPrevIndex(currentIndex, count, loop) {
export function getPrevIndex(index, count, loop) {
if (loop === void 0) {

@@ -86,3 +86,3 @@ loop = true;

return getNextIndex(currentIndex, count, -1, loop);
return getNextIndex(index, count, -1, loop);
}

@@ -89,0 +89,0 @@ /**

36

dist/esm/assertion.js

@@ -5,3 +5,5 @@ // Number assertions

}
export var isNotNumber = value => typeof value !== "number" || Number.isNaN(value) || !Number.isFinite(value);
export function isNotNumber(value) {
return typeof value !== "number" || Number.isNaN(value) || !Number.isFinite(value);
}
export function isNumeric(value) {

@@ -14,3 +16,5 @@ return value != null && value - parseFloat(value) + 1 >= 0;

}
export var isEmptyArray = value => isArray(value) && value.length === 0; // Function assertions
export function isEmptyArray(value) {
return isArray(value) && value.length === 0;
} // Function assertions

@@ -21,14 +25,22 @@ export function isFunction(value) {

export var isDefined = value => typeof value !== "undefined" && value !== undefined;
export var isUndefined = value => typeof value === "undefined" || value === undefined; // Object assertions
export function isDefined(value) {
return typeof value !== "undefined" && value !== undefined;
}
export function isUndefined(value) {
return typeof value === "undefined" || value === undefined;
} // Object assertions
export var isObject = value => {
export function isObject(value) {
var type = typeof value;
return value != null && (type === "object" || type === "function") && !isArray(value);
};
export var isEmptyObject = value => isObject(value) && Object.keys(value).length === 0;
}
export function isEmptyObject(value) {
return isObject(value) && Object.keys(value).length === 0;
}
export function isNotEmptyObject(value) {
return value && !isEmptyObject(value);
}
export var isNull = value => value == null; // String assertions
export function isNull(value) {
return value == null;
} // String assertions

@@ -42,3 +54,3 @@ export function isString(value) {

export var isEmpty = value => {
export function isEmpty(value) {
if (isArray(value)) return isEmptyArray(value);

@@ -48,6 +60,8 @@ if (isObject(value)) return isEmptyObject(value);

return false;
};
}
export var __DEV__ = process.env.NODE_ENV !== "production";
export var __TEST__ = process.env.NODE_ENV === "test";
export var isRefObject = val => "current" in val;
export function isRefObject(val) {
return "current" in val;
}
export function isInputEvent(value) {

@@ -54,0 +68,0 @@ return value && isObject(value) && isObject(value.target);

4

dist/esm/dom.js

@@ -60,3 +60,5 @@ export function getOwnerWindow(node) {

}
export var isRightClick = event => event.button !== 0;
export function isRightClick(event) {
return event.button !== 0;
}
//# sourceMappingURL=dom.js.map

1

dist/esm/index.js

@@ -15,2 +15,3 @@ export * from "./function";

export * from "./user-agent";
export * from "./breakpoint";
//# sourceMappingURL=index.js.map

133

dist/esm/responsive.js
import { getLastItem } from "./array";
import { isArray, isNumber, isObject } from "./assertion";
import { fromEntries, objectKeys } from "./object";
import { isArray, isObject } from "./assertion";
import { objectKeys } from "./object";
export var breakpoints = Object.freeze(["base", "sm", "md", "lg", "xl", "2xl"]);

@@ -68,130 +68,2 @@ export function mapResponsive(prop, mapper) {

/**
* @note
* The code below is the recommended way to analyze breakpoints
* related stuff. Avoid using functions above, it'll be removed in the
* next major
*/
var analyzeCSSValue = value => {
var num = parseFloat(value.toString());
var unit = value.toString().replace(String(num), "");
return {
unitless: !unit,
value: num,
unit
};
};
export var px = value => {
if (value == null) return value;
var {
unitless
} = analyzeCSSValue(value);
return unitless || isNumber(value) ? value + "px" : value;
};
var sortByBreakpointValue = (a, b) => parseInt(a[1], 10) > parseInt(b[1], 10) ? 1 : -1;
var sortBps = breakpoints => fromEntries(Object.entries(breakpoints).sort(sortByBreakpointValue));
function normalize(breakpoints) {
var sorted = sortBps(breakpoints);
return Object.assign(Object.values(sorted), sorted);
}
function keys(breakpoints) {
var value = Object.keys(sortBps(breakpoints));
return new Set(value);
}
function subtract(value) {
if (!value) return value;
value = px(value);
var factor = value.endsWith("px") ? -1 : // the equivalent of 1px in em using a 16px base
-0.0635;
return isNumber(value) ? "" + (value + factor) : value.replace(/([0-9]+\.?[0-9]*)/, m => "" + (parseFloat(m) + factor));
}
function queryString(min, max) {
var query = [];
if (min) query.push("@media screen and (min-width: " + px(min) + ")");
if (query.length > 0 && max) query.push("and");
if (max) query.push("@media screen and (max-width: " + px(max) + ")");
return query.join(" ");
}
export function analyzeBreakpoints(breakpoints) {
var _breakpoints$base;
if (!breakpoints) return null;
breakpoints.base = (_breakpoints$base = breakpoints.base) != null ? _breakpoints$base : "0px";
var normalized = normalize(breakpoints);
var queries = Object.entries(breakpoints).sort(sortByBreakpointValue).map((_ref, index, entry) => {
var _entry;
var [breakpoint, minW] = _ref;
var [, maxW] = (_entry = entry[index + 1]) != null ? _entry : [];
maxW = parseFloat(maxW) > 0 ? subtract(maxW) : undefined;
return {
breakpoint,
minW,
maxW,
maxWQuery: queryString(null, maxW),
minWQuery: queryString(minW),
minMaxQuery: queryString(minW, maxW)
};
});
var _keys = keys(breakpoints);
var _keysArr = Array.from(_keys.values());
return {
keys: _keys,
normalized,
isResponsive(test) {
var keys = Object.keys(test);
return keys.length > 0 && keys.every(key => _keys.has(key));
},
asObject: sortBps(breakpoints),
asArray: normalize(breakpoints),
details: queries,
media: [null, ...normalized.map(minW => queryString(minW)).slice(1)],
toArrayValue(test) {
if (!isObject(test)) {
throw new Error("toArrayValue: value must be an object");
}
var result = _keysArr.map(bp => {
var _test$bp;
return (_test$bp = test[bp]) != null ? _test$bp : null;
});
while (getLastItem(result) === null) {
result.pop();
}
return result;
},
toObjectValue(test) {
if (!Array.isArray(test)) {
throw new Error("toObjectValue: value must be an array");
}
return test.reduce((acc, value, index) => {
var key = _keysArr[index];
if (key != null && value != null) acc[key] = value;
return acc;
}, {});
}
};
}
/**
* since breakpoints are defined as custom properties on an array, you may

@@ -203,3 +75,4 @@ * `Object.keys(theme.breakpoints)` to retrieve both regular numeric indices

*/
export var isCustomBreakpoint = maybeBreakpoint => Number.isNaN(Number(maybeBreakpoint));
//# sourceMappingURL=responsive.js.map

2

dist/types/array.d.ts

@@ -26,3 +26,3 @@ export declare function getFirstItem<T>(array: T[]): T | undefined;

*/
export declare function getPrevIndex(currentIndex: number, count: number, loop?: boolean): number;
export declare function getPrevIndex(index: number, count: number, loop?: boolean): number;
/**

@@ -29,0 +29,0 @@ * Converts an array into smaller chunks or groups.

19

dist/types/assertion.d.ts

@@ -0,19 +1,20 @@

import { Dict } from "./types";
export declare function isNumber(value: any): value is number;
export declare const isNotNumber: (value: any) => boolean;
export declare function isNotNumber(value: any): boolean;
export declare function isNumeric(value: any): boolean;
export declare function isArray<T>(value: any): value is Array<T>;
export declare const isEmptyArray: (value: any) => boolean;
export declare function isEmptyArray(value: any): boolean;
export declare function isFunction(value: any): value is Function;
export declare const isDefined: (value: any) => boolean;
export declare const isUndefined: (value: any) => value is undefined;
export declare const isObject: (value: any) => value is Record<string, any>;
export declare const isEmptyObject: (value: any) => boolean;
export declare function isDefined(value: any): boolean;
export declare function isUndefined(value: any): value is undefined;
export declare function isObject(value: any): value is Dict;
export declare function isEmptyObject(value: any): boolean;
export declare function isNotEmptyObject(value: any): value is object;
export declare const isNull: (value: any) => value is null;
export declare function isNull(value: any): value is null;
export declare function isString(value: any): value is string;
export declare function isCssVar(value: string): boolean;
export declare const isEmpty: (value: any) => boolean;
export declare function isEmpty(value: any): boolean;
export declare const __DEV__: boolean;
export declare const __TEST__: boolean;
export declare const isRefObject: (val: any) => val is {
export declare function isRefObject(val: any): val is {
current: any;

@@ -20,0 +21,0 @@ };

4

dist/types/dom.d.ts
import { Booleanish, EventKeys } from "./types";
export declare function getOwnerWindow(node?: HTMLElement | null): Window & typeof globalThis;
export declare function getOwnerWindow(node?: HTMLElement | null): Window;
export declare function getOwnerDocument(node?: HTMLElement | null): Document;

@@ -18,3 +18,3 @@ export declare function canUseDOM(): boolean;

export declare function getRelatedTarget(event: Pick<FocusEvent, "relatedTarget" | "target" | "currentTarget">): HTMLElement;
export declare const isRightClick: (event: Pick<MouseEvent, "button">) => boolean;
export declare function isRightClick(event: Pick<MouseEvent, "button">): boolean;
//# sourceMappingURL=dom.d.ts.map

1

dist/types/index.d.ts

@@ -15,2 +15,3 @@ export * from "./function";

export * from "./user-agent";
export * from "./breakpoint";
//# sourceMappingURL=index.d.ts.map

20

dist/types/responsive.d.ts

@@ -7,22 +7,2 @@ import { Dict } from "./types";

export declare function isResponsiveObjectLike(obj: Dict, bps?: readonly string[]): boolean;
export declare const px: (value: number | string) => string;
export declare function analyzeBreakpoints(breakpoints: Dict): {
keys: Set<string>;
normalized: string[];
isResponsive(test: Dict): boolean;
asObject: Record<string, any>;
asArray: string[];
details: {
breakpoint: string;
minW: any;
maxW: any;
maxWQuery: string;
minWQuery: string;
minMaxQuery: string;
}[];
media: (string | null)[];
toArrayValue(test: Dict): any[];
toObjectValue(test: any[]): any;
} | null;
export declare type AnalyzeBreakpointsReturn = ReturnType<typeof analyzeBreakpoints>;
/**

@@ -29,0 +9,0 @@ * since breakpoints are defined as custom properties on an array, you may

2

package.json
{
"name": "@chakra-ui/utils",
"version": "1.5.1",
"version": "1.5.2",
"description": "Common utilties and types for Chakra UI",

@@ -5,0 +5,0 @@ "author": "Segun Adebayo <sage@adebayosegun.com>",

dist/cjs/array.js.map

Sorry, the diff of this file is not supported yet

dist/cjs/assertion.js.map

Sorry, the diff of this file is not supported yet

dist/cjs/dom.js.map

Sorry, the diff of this file is not supported yet

dist/cjs/index.js.map

Sorry, the diff of this file is not supported yet

dist/cjs/responsive.js.map

Sorry, the diff of this file is not supported yet

dist/esm/array.js.map

Sorry, the diff of this file is not supported yet

dist/esm/assertion.js.map

Sorry, the diff of this file is not supported yet

dist/esm/dom.js.map

Sorry, the diff of this file is not supported yet

dist/esm/index.js.map

Sorry, the diff of this file is not supported yet

dist/esm/responsive.js.map

Sorry, the diff of this file is not supported yet

dist/types/array.d.ts.map

Sorry, the diff of this file is not supported yet

dist/types/assertion.d.ts.map

Sorry, the diff of this file is not supported yet

dist/types/dom.d.ts.map

Sorry, the diff of this file is not supported yet

dist/types/index.d.ts.map

Sorry, the diff of this file is not supported yet

dist/types/responsive.d.ts.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc