@wix/design-system
Version:
@wix/design-system
120 lines (115 loc) • 4.29 kB
JavaScript
;
exports.__esModule = true;
exports.callAll = void 0;
exports.getAutoHeightDuration = getAutoHeightDuration;
exports.getElementHeight = getElementHeight;
exports.noop = void 0;
exports.useControlledState = useControlledState;
exports.useEffectAfterMount = useEffectAfterMount;
exports.useUniqueId = useUniqueId;
var _react = require("react");
var noop = () => {};
exports.noop = noop;
function getElementHeight(el) {
if (!(el != null && el.current)) {
return 'auto';
}
return el.current.scrollHeight;
}
// Helper function for render props. Sets a function to be called, plus any additional functions passed in
var callAll = exports.callAll = function callAll() {
for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {
fns[_key] = arguments[_key];
}
return function () {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return fns.forEach(fn => fn && fn(...args));
};
};
// https://github.com/mui-org/material-ui/blob/da362266f7c137bf671d7e8c44c84ad5cfc0e9e2/packages/material-ui/src/styles/transitions.js#L89-L98
function getAutoHeightDuration(height) {
if (!height || typeof height === 'string') {
return 0;
}
var constant = height / 36;
// https://www.wolframalpha.com/input/?i=(4+%2B+15+*+(x+%2F+36+)+**+0.25+%2B+(x+%2F+36)+%2F+5)+*+10
return Math.round((4 + 15 * constant ** 0.25 + constant / 5) * 10);
}
function useControlledState(isExpanded, defaultExpanded) {
var [stateExpanded, setStateExpanded] = (0, _react.useState)(defaultExpanded || false);
var initiallyControlled = (0, _react.useRef)(isExpanded != null);
var expanded = initiallyControlled.current ? !!isExpanded : stateExpanded;
var setExpanded = (0, _react.useCallback)(n => {
if (!initiallyControlled.current) {
setStateExpanded(n);
}
}, []);
return [expanded, setExpanded];
}
function useEffectAfterMount(cb, dependencies) {
var justMounted = (0, _react.useRef)(true);
var unmounted = (0, _react.useRef)(false);
(0, _react.useEffect)(() => {
unmounted.current = false;
return () => {
unmounted.current = true;
};
}, []);
(0, _react.useEffect)(() => {
if (!justMounted.current && !unmounted.current) {
return cb();
}
justMounted.current = false;
// eslint-disable-next-line react-hooks/exhaustive-deps
}, dependencies);
}
/**
* Taken from Reach
* https://github.com/reach/reach-ui/blob/d2b88c50caf52f473a7d20a4493e39e3c5e95b7b/packages/auto-id
*
* Autogenerate IDs to facilitate WAI-ARIA and server rendering.
*
* Note: The returned ID will initially be `null` and will update after a
* component mounts. Users may need to supply their own ID if they need
* consistent values for SSR.
*
* @see Docs https://reach.tech/auto-id
*/
var useIsomorphicLayoutEffect = typeof window !== 'undefined' ? _react.useLayoutEffect : _react.useEffect;
var serverHandoffComplete = false;
var globalId = 0;
var genId = () => ++globalId;
function useUniqueId(idFromProps) {
/*
* If this instance isn't part of the initial render, we don't have to do the
* double render/patch-up dance. We can just generate the ID and return it.
*/
var initialId = idFromProps || (serverHandoffComplete ? genId() : null);
var [id, setId] = (0, _react.useState)(initialId);
useIsomorphicLayoutEffect(() => {
if (id === null) {
/*
* Patch the ID after render. We do this in `useLayoutEffect` to avoid any
* rendering flicker, though it'll make the first render slower (unlikely
* to matter, but you're welcome to measure your app and let us know if
* it's a problem).
*/
setId(genId());
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
(0, _react.useEffect)(() => {
if (serverHandoffComplete === false) {
/*
* Flag all future uses of `useId` to skip the update dance. This is in
* `useEffect` because it goes after `useLayoutEffect`, ensuring we don't
* accidentally bail out of the patch-up dance prematurely.
*/
serverHandoffComplete = true;
}
}, []);
return id != null ? String(id) : undefined;
}
//# sourceMappingURL=utils.js.map