Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

ahooks

Package Overview
Dependencies
Maintainers
5
Versions
111
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ahooks - npm Package Compare versions

Comparing version 3.7.11 to 3.8.0

2

es/createUseStorageState/index.d.ts

@@ -0,4 +1,6 @@

export declare const SYNC_STORAGE_EVENT_NAME = "AHOOKS_SYNC_STORAGE_EVENT_NAME";
export type SetState<S> = S | ((prevState?: S) => S);
export interface Options<T> {
defaultValue?: T | (() => T);
listenStorageChange?: boolean;
serializer?: (value: T) => string;

@@ -5,0 +7,0 @@ deserializer?: (value: string) => T;

67

es/createUseStorageState/index.js
import { __read } from "tslib";
import { useState } from 'react';
import useEventListener from '../useEventListener';
import useMemoizedFn from '../useMemoizedFn';
import useUpdateEffect from '../useUpdateEffect';
import { isFunction, isUndef } from '../utils';
export var SYNC_STORAGE_EVENT_NAME = 'AHOOKS_SYNC_STORAGE_EVENT_NAME';
export function createUseStorageState(getStorage) {

@@ -12,6 +14,8 @@ function useStorageState(key, options) {

var storage;
var _a = options.onError,
onError = _a === void 0 ? function (e) {
var _a = options.listenStorageChange,
listenStorageChange = _a === void 0 ? false : _a,
_b = options.onError,
onError = _b === void 0 ? function (e) {
console.error(e);
} : _a;
} : _b;
// https://github.com/alibaba/hooks/issues/800

@@ -49,5 +53,5 @@ try {

}
var _b = __read(useState(getStoredValue), 2),
state = _b[0],
setState = _b[1];
var _c = __read(useState(getStoredValue), 2),
state = _c[0],
setState = _c[1];
useUpdateEffect(function () {

@@ -58,13 +62,48 @@ setState(getStoredValue());

var currentState = isFunction(value) ? value(state) : value;
setState(currentState);
if (isUndef(currentState)) {
storage === null || storage === void 0 ? void 0 : storage.removeItem(key);
} else {
try {
storage === null || storage === void 0 ? void 0 : storage.setItem(key, serializer(currentState));
} catch (e) {
console.error(e);
if (!listenStorageChange) {
setState(currentState);
}
try {
var newValue = void 0;
var oldValue = storage === null || storage === void 0 ? void 0 : storage.getItem(key);
if (isUndef(currentState)) {
newValue = null;
storage === null || storage === void 0 ? void 0 : storage.removeItem(key);
} else {
newValue = serializer(currentState);
storage === null || storage === void 0 ? void 0 : storage.setItem(key, newValue);
}
dispatchEvent(
// send custom event to communicate within same page
// importantly this should not be a StorageEvent since those cannot
// be constructed with a non-built-in storage area
new CustomEvent(SYNC_STORAGE_EVENT_NAME, {
detail: {
key: key,
newValue: newValue,
oldValue: oldValue,
storageArea: storage
}
}));
} catch (e) {
onError(e);
}
};
var syncState = function (event) {
if (event.key !== key || event.storageArea !== storage) {
return;
}
setState(getStoredValue());
};
var syncStateFromCustomEvent = function (event) {
syncState(event.detail);
};
// from another document
useEventListener('storage', syncState, {
enable: listenStorageChange
});
// from the same document but different hooks
useEventListener(SYNC_STORAGE_EVENT_NAME, syncStateFromCustomEvent, {
enable: listenStorageChange
});
return [state, useMemoizedFn(updateState)];

@@ -71,0 +110,0 @@ }

@@ -11,3 +11,3 @@ import type { PaginationOptions, PaginationResult } from '../usePagination/types';

sorter?: any;
filter?: any;
filters?: any;
extra?: any;

@@ -14,0 +14,0 @@ [key: string]: any;

@@ -7,2 +7,3 @@ declare const useDynamicList: <T>(initialList?: T[]) => {

remove: (index: number) => void;
batchRemove: (indexes: number[]) => void;
getKey: (index: number) => number;

@@ -9,0 +10,0 @@ getIndex: (key: number) => number;

import { __read, __spreadArray } from "tslib";
import { useCallback, useRef, useState } from 'react';
import isDev from '../utils/isDev';
var useDynamicList = function (initialList) {

@@ -76,2 +77,25 @@ if (initialList === void 0) {

}, []);
var batchRemove = useCallback(function (indexes) {
if (!Array.isArray(indexes)) {
if (isDev) {
console.error("`indexes` parameter of `batchRemove` function expected to be an array, but got \"".concat(typeof indexes, "\"."));
}
return;
}
if (!indexes.length) {
return;
}
setList(function (prevList) {
var newKeyList = [];
var newList = prevList.filter(function (item, index) {
var shouldKeep = !indexes.includes(index);
if (shouldKeep) {
newKeyList.push(getKey(index));
}
return shouldKeep;
});
keyList.current = newKeyList;
return newList;
});
}, []);
var move = useCallback(function (oldIndex, newIndex) {

@@ -159,2 +183,3 @@ if (oldIndex === newIndex) {

remove: remove,
batchRemove: batchRemove,
getKey: getKey,

@@ -161,0 +186,0 @@ getIndex: getIndex,

@@ -9,2 +9,3 @@ import type { BasicTarget } from '../utils/domTarget';

passive?: boolean;
enable?: boolean;
};

@@ -15,3 +16,4 @@ declare function useEventListener<K extends keyof HTMLElementEventMap>(eventName: K, handler: (ev: HTMLElementEventMap[K]) => void, options?: Options<HTMLElement>): void;

declare function useEventListener<K extends keyof WindowEventMap>(eventName: K, handler: (ev: WindowEventMap[K]) => void, options?: Options<Window>): void;
declare function useEventListener(eventName: string, handler: (event: Event) => void, options?: Options<Window>): void;
declare function useEventListener(eventName: string, handler: noop, options: Options): void;
export default useEventListener;

@@ -8,4 +8,9 @@ import useLatest from '../useLatest';

}
var _a = options.enable,
enable = _a === void 0 ? true : _a;
var handlerRef = useLatest(handler);
useEffectWithTarget(function () {
if (!enable) {
return;
}
var targetElement = getTargetElement(options.target, window);

@@ -28,4 +33,4 @@ if (!(targetElement === null || targetElement === void 0 ? void 0 : targetElement.addEventListener)) {

};
}, [eventName, options.capture, options.once, options.passive], options.target);
}, [eventName, options.capture, options.once, options.passive, enable], options.target);
}
export default useEventListener;

@@ -1,3 +0,7 @@

/// <reference types="react" />
export default function useSelections<T>(items: T[], defaultSelected?: T[]): {
import type { Key } from 'react';
export interface Options<T> {
defaultSelected?: T[];
itemKey?: string | ((item: T) => Key);
}
export default function useSelections<T>(items: T[], options?: T[] | Options<T>): {
readonly selected: T[];

@@ -14,3 +18,4 @@ readonly noneSelected: boolean;

readonly unSelectAll: () => void;
readonly clearAll: () => void;
readonly toggleAll: () => void;
};
import { __read } from "tslib";
import { useMemo, useState } from 'react';
import isPlainObject from 'lodash/isPlainObject';
import useMemoizedFn from '../useMemoizedFn';
export default function useSelections(items, defaultSelected) {
if (defaultSelected === void 0) {
defaultSelected = [];
import { isFunction, isString } from '../utils';
export default function useSelections(items, options) {
var _a, _b;
var defaultSelected = [];
var itemKey;
if (Array.isArray(options)) {
defaultSelected = options;
} else if (isPlainObject(options)) {
defaultSelected = (_a = options === null || options === void 0 ? void 0 : options.defaultSelected) !== null && _a !== void 0 ? _a : defaultSelected;
itemKey = (_b = options === null || options === void 0 ? void 0 : options.itemKey) !== null && _b !== void 0 ? _b : itemKey;
}
var _a = __read(useState(defaultSelected), 2),
selected = _a[0],
setSelected = _a[1];
var selectedSet = useMemo(function () {
return new Set(selected);
var getKey = function (item) {
if (isFunction(itemKey)) {
return itemKey(item);
}
if (isString(itemKey) && isPlainObject(item)) {
return item[itemKey];
}
return item;
};
var _c = __read(useState(defaultSelected), 2),
selected = _c[0],
setSelected = _c[1];
var selectedMap = useMemo(function () {
var keyToItemMap = new Map();
selected.forEach(function (item) {
keyToItemMap.set(getKey(item), item);
});
return keyToItemMap;
}, [selected]);
var isSelected = function (item) {
return selectedSet.has(item);
return selectedMap.has(getKey(item));
};
var select = function (item) {
selectedSet.add(item);
return setSelected(Array.from(selectedSet));
selectedMap.set(getKey(item), item);
setSelected(Array.from(selectedMap.values()));
};
var unSelect = function (item) {
selectedSet.delete(item);
return setSelected(Array.from(selectedSet));
selectedMap.delete(getKey(item));
setSelected(Array.from(selectedMap.values()));
};

@@ -33,23 +54,23 @@ var toggle = function (item) {

var selectAll = function () {
items.forEach(function (o) {
selectedSet.add(o);
items.forEach(function (item) {
selectedMap.set(getKey(item), item);
});
setSelected(Array.from(selectedSet));
setSelected(Array.from(selectedMap.values()));
};
var unSelectAll = function () {
items.forEach(function (o) {
selectedSet.delete(o);
items.forEach(function (item) {
selectedMap.delete(getKey(item));
});
setSelected(Array.from(selectedSet));
setSelected(Array.from(selectedMap.values()));
};
var noneSelected = useMemo(function () {
return items.every(function (o) {
return !selectedSet.has(o);
return items.every(function (item) {
return !selectedMap.has(getKey(item));
});
}, [items, selectedSet]);
}, [items, selectedMap]);
var allSelected = useMemo(function () {
return items.every(function (o) {
return selectedSet.has(o);
return items.every(function (item) {
return selectedMap.has(getKey(item));
}) && !noneSelected;
}, [items, selectedSet, noneSelected]);
}, [items, selectedMap, noneSelected]);
var partiallySelected = useMemo(function () {

@@ -61,2 +82,6 @@ return !noneSelected && !allSelected;

};
var clearAll = function () {
selectedMap.clear();
setSelected([]);
};
return {

@@ -74,4 +99,5 @@ selected: selected,

unSelectAll: useMemoizedFn(unSelectAll),
clearAll: useMemoizedFn(clearAll),
toggleAll: useMemoizedFn(toggleAll)
};
}

@@ -43,3 +43,3 @@ import { __read } from "tslib";

if (isNumber(itemHeightRef.current)) {
return Math.floor(scrollTop / itemHeightRef.current) + 1;
return Math.floor(scrollTop / itemHeightRef.current);
}

@@ -46,0 +46,0 @@ var sum = 0;

@@ -7,2 +7,3 @@ import { getTargetElement } from '../utils/domTarget';

if (targetElement.getRootNode() instanceof ShadowRoot) return true;
return false;
});

@@ -9,0 +10,0 @@ };

@@ -0,4 +1,6 @@

export declare const SYNC_STORAGE_EVENT_NAME = "AHOOKS_SYNC_STORAGE_EVENT_NAME";
export type SetState<S> = S | ((prevState?: S) => S);
export interface Options<T> {
defaultValue?: T | (() => T);
listenStorageChange?: boolean;
serializer?: (value: T) => string;

@@ -5,0 +7,0 @@ deserializer?: (value: string) => T;

@@ -7,8 +7,12 @@ "use strict";

});
exports.SYNC_STORAGE_EVENT_NAME = void 0;
exports.createUseStorageState = createUseStorageState;
var _tslib = require("tslib");
var _react = require("react");
var _useEventListener = _interopRequireDefault(require("../useEventListener"));
var _useMemoizedFn = _interopRequireDefault(require("../useMemoizedFn"));
var _useUpdateEffect = _interopRequireDefault(require("../useUpdateEffect"));
var _utils = require("../utils");
var SYNC_STORAGE_EVENT_NAME = 'AHOOKS_SYNC_STORAGE_EVENT_NAME';
exports.SYNC_STORAGE_EVENT_NAME = SYNC_STORAGE_EVENT_NAME;
function createUseStorageState(getStorage) {

@@ -20,6 +24,8 @@ function useStorageState(key, options) {

var storage;
var _a = options.onError,
onError = _a === void 0 ? function (e) {
var _a = options.listenStorageChange,
listenStorageChange = _a === void 0 ? false : _a,
_b = options.onError,
onError = _b === void 0 ? function (e) {
console.error(e);
} : _a;
} : _b;
// https://github.com/alibaba/hooks/issues/800

@@ -57,5 +63,5 @@ try {

}
var _b = (0, _tslib.__read)((0, _react.useState)(getStoredValue), 2),
state = _b[0],
setState = _b[1];
var _c = (0, _tslib.__read)((0, _react.useState)(getStoredValue), 2),
state = _c[0],
setState = _c[1];
(0, _useUpdateEffect["default"])(function () {

@@ -66,13 +72,48 @@ setState(getStoredValue());

var currentState = (0, _utils.isFunction)(value) ? value(state) : value;
setState(currentState);
if ((0, _utils.isUndef)(currentState)) {
storage === null || storage === void 0 ? void 0 : storage.removeItem(key);
} else {
try {
storage === null || storage === void 0 ? void 0 : storage.setItem(key, serializer(currentState));
} catch (e) {
console.error(e);
if (!listenStorageChange) {
setState(currentState);
}
try {
var newValue = void 0;
var oldValue = storage === null || storage === void 0 ? void 0 : storage.getItem(key);
if ((0, _utils.isUndef)(currentState)) {
newValue = null;
storage === null || storage === void 0 ? void 0 : storage.removeItem(key);
} else {
newValue = serializer(currentState);
storage === null || storage === void 0 ? void 0 : storage.setItem(key, newValue);
}
dispatchEvent(
// send custom event to communicate within same page
// importantly this should not be a StorageEvent since those cannot
// be constructed with a non-built-in storage area
new CustomEvent(SYNC_STORAGE_EVENT_NAME, {
detail: {
key: key,
newValue: newValue,
oldValue: oldValue,
storageArea: storage
}
}));
} catch (e) {
onError(e);
}
};
var syncState = function syncState(event) {
if (event.key !== key || event.storageArea !== storage) {
return;
}
setState(getStoredValue());
};
var syncStateFromCustomEvent = function syncStateFromCustomEvent(event) {
syncState(event.detail);
};
// from another document
(0, _useEventListener["default"])('storage', syncState, {
enable: listenStorageChange
});
// from the same document but different hooks
(0, _useEventListener["default"])(SYNC_STORAGE_EVENT_NAME, syncStateFromCustomEvent, {
enable: listenStorageChange
});
return [state, (0, _useMemoizedFn["default"])(updateState)];

@@ -79,0 +120,0 @@ }

@@ -11,3 +11,3 @@ import type { PaginationOptions, PaginationResult } from '../usePagination/types';

sorter?: any;
filter?: any;
filters?: any;
extra?: any;

@@ -14,0 +14,0 @@ [key: string]: any;

@@ -7,2 +7,3 @@ declare const useDynamicList: <T>(initialList?: T[]) => {

remove: (index: number) => void;
batchRemove: (indexes: number[]) => void;
getKey: (index: number) => number;

@@ -9,0 +10,0 @@ getIndex: (key: number) => number;

"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {

@@ -7,4 +8,6 @@ value: true

exports["default"] = void 0;
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _tslib = require("tslib");
var _react = require("react");
var _isDev = _interopRequireDefault(require("../utils/isDev"));
var useDynamicList = function useDynamicList(initialList) {

@@ -83,2 +86,25 @@ if (initialList === void 0) {

}, []);
var batchRemove = (0, _react.useCallback)(function (indexes) {
if (!Array.isArray(indexes)) {
if (_isDev["default"]) {
console.error("`indexes` parameter of `batchRemove` function expected to be an array, but got \"".concat((0, _typeof2["default"])(indexes), "\"."));
}
return;
}
if (!indexes.length) {
return;
}
setList(function (prevList) {
var newKeyList = [];
var newList = prevList.filter(function (item, index) {
var shouldKeep = !indexes.includes(index);
if (shouldKeep) {
newKeyList.push(getKey(index));
}
return shouldKeep;
});
keyList.current = newKeyList;
return newList;
});
}, []);
var move = (0, _react.useCallback)(function (oldIndex, newIndex) {

@@ -166,2 +192,3 @@ if (oldIndex === newIndex) {

remove: remove,
batchRemove: batchRemove,
getKey: getKey,

@@ -168,0 +195,0 @@ getIndex: getIndex,

@@ -9,2 +9,3 @@ import type { BasicTarget } from '../utils/domTarget';

passive?: boolean;
enable?: boolean;
};

@@ -15,3 +16,4 @@ declare function useEventListener<K extends keyof HTMLElementEventMap>(eventName: K, handler: (ev: HTMLElementEventMap[K]) => void, options?: Options<HTMLElement>): void;

declare function useEventListener<K extends keyof WindowEventMap>(eventName: K, handler: (ev: WindowEventMap[K]) => void, options?: Options<Window>): void;
declare function useEventListener(eventName: string, handler: (event: Event) => void, options?: Options<Window>): void;
declare function useEventListener(eventName: string, handler: noop, options: Options): void;
export default useEventListener;

@@ -15,4 +15,9 @@ "use strict";

}
var _a = options.enable,
enable = _a === void 0 ? true : _a;
var handlerRef = (0, _useLatest["default"])(handler);
(0, _useEffectWithTarget["default"])(function () {
if (!enable) {
return;
}
var targetElement = (0, _domTarget.getTargetElement)(options.target, window);

@@ -35,5 +40,5 @@ if (!(targetElement === null || targetElement === void 0 ? void 0 : targetElement.addEventListener)) {

};
}, [eventName, options.capture, options.once, options.passive], options.target);
}, [eventName, options.capture, options.once, options.passive, enable], options.target);
}
var _default = useEventListener;
exports["default"] = _default;

@@ -1,3 +0,7 @@

/// <reference types="react" />
export default function useSelections<T>(items: T[], defaultSelected?: T[]): {
import type { Key } from 'react';
export interface Options<T> {
defaultSelected?: T[];
itemKey?: string | ((item: T) => Key);
}
export default function useSelections<T>(items: T[], options?: T[] | Options<T>): {
readonly selected: T[];

@@ -14,3 +18,4 @@ readonly noneSelected: boolean;

readonly unSelectAll: () => void;
readonly clearAll: () => void;
readonly toggleAll: () => void;
};

@@ -10,23 +10,44 @@ "use strict";

var _react = require("react");
var _isPlainObject = _interopRequireDefault(require("lodash/isPlainObject"));
var _useMemoizedFn = _interopRequireDefault(require("../useMemoizedFn"));
function useSelections(items, defaultSelected) {
if (defaultSelected === void 0) {
defaultSelected = [];
var _utils = require("../utils");
function useSelections(items, options) {
var _a, _b;
var defaultSelected = [];
var itemKey;
if (Array.isArray(options)) {
defaultSelected = options;
} else if ((0, _isPlainObject["default"])(options)) {
defaultSelected = (_a = options === null || options === void 0 ? void 0 : options.defaultSelected) !== null && _a !== void 0 ? _a : defaultSelected;
itemKey = (_b = options === null || options === void 0 ? void 0 : options.itemKey) !== null && _b !== void 0 ? _b : itemKey;
}
var _a = (0, _tslib.__read)((0, _react.useState)(defaultSelected), 2),
selected = _a[0],
setSelected = _a[1];
var selectedSet = (0, _react.useMemo)(function () {
return new Set(selected);
var getKey = function getKey(item) {
if ((0, _utils.isFunction)(itemKey)) {
return itemKey(item);
}
if ((0, _utils.isString)(itemKey) && (0, _isPlainObject["default"])(item)) {
return item[itemKey];
}
return item;
};
var _c = (0, _tslib.__read)((0, _react.useState)(defaultSelected), 2),
selected = _c[0],
setSelected = _c[1];
var selectedMap = (0, _react.useMemo)(function () {
var keyToItemMap = new Map();
selected.forEach(function (item) {
keyToItemMap.set(getKey(item), item);
});
return keyToItemMap;
}, [selected]);
var isSelected = function isSelected(item) {
return selectedSet.has(item);
return selectedMap.has(getKey(item));
};
var select = function select(item) {
selectedSet.add(item);
return setSelected(Array.from(selectedSet));
selectedMap.set(getKey(item), item);
setSelected(Array.from(selectedMap.values()));
};
var unSelect = function unSelect(item) {
selectedSet["delete"](item);
return setSelected(Array.from(selectedSet));
selectedMap["delete"](getKey(item));
setSelected(Array.from(selectedMap.values()));
};

@@ -41,23 +62,23 @@ var toggle = function toggle(item) {

var selectAll = function selectAll() {
items.forEach(function (o) {
selectedSet.add(o);
items.forEach(function (item) {
selectedMap.set(getKey(item), item);
});
setSelected(Array.from(selectedSet));
setSelected(Array.from(selectedMap.values()));
};
var unSelectAll = function unSelectAll() {
items.forEach(function (o) {
selectedSet["delete"](o);
items.forEach(function (item) {
selectedMap["delete"](getKey(item));
});
setSelected(Array.from(selectedSet));
setSelected(Array.from(selectedMap.values()));
};
var noneSelected = (0, _react.useMemo)(function () {
return items.every(function (o) {
return !selectedSet.has(o);
return items.every(function (item) {
return !selectedMap.has(getKey(item));
});
}, [items, selectedSet]);
}, [items, selectedMap]);
var allSelected = (0, _react.useMemo)(function () {
return items.every(function (o) {
return selectedSet.has(o);
return items.every(function (item) {
return selectedMap.has(getKey(item));
}) && !noneSelected;
}, [items, selectedSet, noneSelected]);
}, [items, selectedMap, noneSelected]);
var partiallySelected = (0, _react.useMemo)(function () {

@@ -69,2 +90,6 @@ return !noneSelected && !allSelected;

};
var clearAll = function clearAll() {
selectedMap.clear();
setSelected([]);
};
return {

@@ -82,4 +107,5 @@ selected: selected,

unSelectAll: (0, _useMemoizedFn["default"])(unSelectAll),
clearAll: (0, _useMemoizedFn["default"])(clearAll),
toggleAll: (0, _useMemoizedFn["default"])(toggleAll)
};
}

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

if ((0, _utils.isNumber)(itemHeightRef.current)) {
return Math.floor(scrollTop / itemHeightRef.current) + 1;
return Math.floor(scrollTop / itemHeightRef.current);
}

@@ -53,0 +53,0 @@ var sum = 0;

@@ -13,2 +13,3 @@ "use strict";

if (targetElement.getRootNode() instanceof ShadowRoot) return true;
return false;
});

@@ -15,0 +16,0 @@ };

{
"name": "ahooks",
"version": "3.7.11",
"version": "3.8.0",
"description": "react hooks library",

@@ -5,0 +5,0 @@ "keywords": [

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

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

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc