@bolio-ui/core 1.1.7 → 2.0.0-alpha.0

package/esm/utils/collections.js

@@ -17,12 +17,10 @@ export var pickChild = function pickChild(children, targetChild) {
   var target = [];
   var withoutTargetChildren = React.Children.map(children, function (item) {
     if (! /*#__PURE__*/React.isValidElement(item)) return item;
-
     if (item.type === targetChild) {
       target.push(item);
       return null;
     }
-
     return item;
   });
   var targetChildren = target.length >= 0 ? target : undefined;
@@ -34,21 +32,17 @@ export var pickChildByProps = function pickChildByProps(children, key, value) {
   var withoutPropChildren = React.Children.map(children, function (item) {
     if (! /*#__PURE__*/React.isValidElement(item)) return null;
     if (!item.props) return item;
-
     if (isArray) {
       if (value.includes(item.props[key])) {
         target.push(item);
         return null;
       }
-
       return item;
     }
-
     if (item.props[key] === value) {
       target.push(item);
       return null;
     }
-
     return item;
   });
   var targetChildren = target.length >= 0 ? target : undefined;
@@ -61,12 +55,10 @@ export var setChildrenProps = function setChildrenProps(children, props) {
   var targetComponents = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
   if (React.Children.count(children) === 0) return [];
   var allowAll = targetComponents.length === 0;
-
   var clone = function clone(child) {
     var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     return /*#__PURE__*/React.cloneElement(child, props);
   };
-
   return React.Children.map(children, function (item) {
     if (! /*#__PURE__*/React.isValidElement(item)) return item;
     if (allowAll) return clone(item, props);
@@ -81,12 +73,10 @@ export var setChildrenIndex = function setChildrenIndex(children) {
   var targetComponents = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   if (React.Children.count(children) === 0) return [];
   var allowAll = targetComponents.length === 0;
-
   var clone = function clone(child) {
     var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     return /*#__PURE__*/React.cloneElement(child, props);
   };
-
   var index = 0;
   return React.Children.map(children, function (item) {
     if (! /*#__PURE__*/React.isValidElement(item)) return item;
@@ -112,12 +102,10 @@ export var getReactNode = function getReactNode(node) {
 export var isChildElement = function isChildElement(parent, child) {
   if (!parent || !child) return false;
   var node = child;
-
   while (node) {
     if (node === parent) return true;
     node = node.parentNode;
   }
-
   return false;
 };
 export var isBolioUIElement = function isBolioUIElement(el) {

package/esm/utils/color.js

@@ -1,43 +1,35 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-
 var hexToRgb = function hexToRgb(color) {
   var fullReg = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
   var full = color.replace(fullReg, function (_, r, g, b) {
     return "".concat(r).concat(r).concat(g).concat(g).concat(b).concat(b);
   });
   var values = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(full);
-
   if (!values) {
     throw new Error("Bolio UI: Unsupported ".concat(color, " color."));
   }
-
   return [Number.parseInt(values[1], 16), Number.parseInt(values[2], 16), Number.parseInt(values[3], 16)];
 };
-
 export var colorToRgbValues = function colorToRgbValues(color) {
   if (color.charAt(0) === '#') return hexToRgb(color);
   var safeColor = color.replace(/ /g, '');
   var colorType = color.substr(0, 4);
   var regArray = safeColor.match(/\((.+)\)/);
-
   if (!colorType.startsWith('rgb') || !regArray) {
     console.log(color);
     throw new Error("Bolio UI: Only support [\"RGB\", \"RGBA\", \"HEX\"] color.");
   }
-
   return regArray[1].split(',').map(function (str) {
     return Number.parseFloat(str);
   });
 };
 export var addColorAlpha = function addColorAlpha(color, alpha) {
   if (!/^#|rgb|RGB/.test(color)) return color;
-
   var _colorToRgbValues = colorToRgbValues(color),
-      _colorToRgbValues2 = _slicedToArray(_colorToRgbValues, 3),
-      r = _colorToRgbValues2[0],
-      g = _colorToRgbValues2[1],
-      b = _colorToRgbValues2[2];
-
+    _colorToRgbValues2 = _slicedToArray(_colorToRgbValues, 3),
+    r = _colorToRgbValues2[0],
+    g = _colorToRgbValues2[1],
+    b = _colorToRgbValues2[2];
   var safeAlpha = alpha > 1 ? 1 : alpha < 0 ? 0 : alpha;
   return "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(safeAlpha, ")");
 };

package/esm/utils/layouts.d.ts

@@ -11,10 +11,10 @@ export interface ReactiveDomReact {
     height: number;
     elementTop: number;
 }
-export declare const isUnplacedRect: (rect?: ReactiveDomReact | undefined) => boolean;
-export declare const getRefRect: (ref?: MutableRefObject<HTMLElement | null> | undefined, getContainer?: (() => HTMLElement | null) | undefined) => ReactiveDomReact;
-export declare const getEventRect: (event?: FocusEvent<HTMLElement> | MouseEvent<HTMLElement, globalThis.MouseEvent> | undefined, getContainer?: (() => HTMLElement | null) | undefined) => ReactiveDomReact;
-export declare const useRect: (initialState?: ReactiveDomReact | (() => ReactiveDomReact) | undefined) => {
+export declare const isUnplacedRect: (rect?: ReactiveDomReact) => boolean;
+export declare const getRefRect: (ref?: MutableRefObject<HTMLElement | null>, getContainer?: () => HTMLElement | null) => ReactiveDomReact;
+export declare const getEventRect: (event?: MouseEvent<HTMLElement> | FocusEvent<HTMLElement>, getContainer?: () => HTMLElement | null) => ReactiveDomReact;
+export declare const useRect: (initialState?: ReactiveDomReact | (() => ReactiveDomReact)) => {
     rect: ReactiveDomReact;
-    setRect: (eventOrRef: MouseEvent<HTMLElement> | FocusEvent<HTMLElement> | MutableRefObject<HTMLElement | null>, getContainer?: (() => HTMLElement | null) | undefined) => void;
+    setRect: (eventOrRef: MouseEvent<HTMLElement> | FocusEvent<HTMLElement> | MutableRefObject<HTMLElement | null>, getContainer?: () => HTMLElement | null) => void;
 };

package/esm/utils/layouts.js

@@ -6,11 +6,9 @@ export var getElementOffset = function getElementOffset(el) {
     top: 0,
     left: 0
   };
-
   var _el$getBoundingClient = el.getBoundingClientRect(),
-      top = _el$getBoundingClient.top,
-      left = _el$getBoundingClient.left;
-
+    top = _el$getBoundingClient.top,
+    left = _el$getBoundingClient.left;
   return {
     top: top,
     left: left
@@ -24,16 +22,13 @@ var defaultRect = {
   height: 0,
   elementTop: -1000
 };
-
 var getRectFromDOMWithContainer = function getRectFromDOMWithContainer(domRect, getContainer) {
   if (!domRect) return defaultRect;
   var container = getContainer ? getContainer() : null;
   var scrollElement = container || document.documentElement;
-
   var _getElementOffset = getElementOffset(container),
-      offsetTop = _getElementOffset.top,
-      offsetLeft = _getElementOffset.left;
-
+    offsetTop = _getElementOffset.top,
+    offsetLeft = _getElementOffset.left;
   return _extends({}, domRect, {
     width: domRect.width || domRect.right - domRect.left,
     height: domRect.height || domRect.top - domRect.bottom,
@@ -42,7 +37,6 @@ var getRectFromDOMWithContainer = function getRectFromDOMWithContainer(domRect,
     elementTop: domRect.top + scrollElement.scrollTop - offsetTop
   });
 };
-
 export var isUnplacedRect = function isUnplacedRect(rect) {
   if (!rect) return true;
   return rect.top === defaultRect.top && rect.left === defaultRect.left;
@@ -54,27 +48,22 @@ export var getRefRect = function getRefRect(ref, getContainer) {
 };
 export var getEventRect = function getEventRect(event, getContainer) {
   var _event$target;
-
   var rect = event === null || event === void 0 ? void 0 : (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.getBoundingClientRect();
   if (!rect) return defaultRect;
   return getRectFromDOMWithContainer(rect, getContainer);
 };
-
 var isRefTarget = function isRefTarget(eventOrRef) {
   return typeof (eventOrRef === null || eventOrRef === void 0 ? void 0 : eventOrRef.target) === 'undefined';
 };
-
 export var useRect = function useRect(initialState) {
   var _useState = useState(initialState || defaultRect),
-      _useState2 = _slicedToArray(_useState, 2),
-      rect = _useState2[0],
-      setRect = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    rect = _useState2[0],
+    setRect = _useState2[1];
   var updateRect = function updateRect(eventOrRef, getContainer) {
     if (isRefTarget(eventOrRef)) return setRect(getRefRect(eventOrRef, getContainer));
     setRect(getEventRect(eventOrRef, getContainer));
   };
-
   return {
     rect: rect,
     setRect: updateRect

package/esm/utils/prop-types.d.ts

@@ -8,12 +8,12 @@ declare const copyTypes: ["default", "silent", "prevent"];
 declare const triggerTypes: ["hover", "click"];
 declare const placement: ["top", "topStart", "topEnd", "left", "leftStart", "leftEnd", "bottom", "bottomStart", "bottomEnd", "right", "rightStart", "rightEnd"];
 declare const dividerAlign: ["start", "center", "end", "left", "right"];
-export declare type ButtonTypes = typeof buttonTypes[number];
-export declare type NormalTypes = typeof normalTypes[number];
-export declare type SnippetTypes = typeof snippetTypes[number];
-export declare type CardTypes = typeof cardTypes[number];
-export declare type CopyTypes = typeof copyTypes[number];
-export declare type TriggerTypes = typeof triggerTypes[number];
-export declare type Placement = typeof placement[number];
-export declare type DividerAlign = typeof dividerAlign[number];
+export type ButtonTypes = typeof buttonTypes[number];
+export type NormalTypes = typeof normalTypes[number];
+export type SnippetTypes = typeof snippetTypes[number];
+export type CardTypes = typeof cardTypes[number];
+export type CopyTypes = typeof copyTypes[number];
+export type TriggerTypes = typeof triggerTypes[number];
+export type Placement = typeof placement[number];
+export type DividerAlign = typeof dividerAlign[number];
 export {};

package/esm/utils/prop-types.js

@@ -2,14 +2,12 @@ export var tuple = function tuple() {
   for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     args[_key] = arguments[_key];
   }
-
   return args;
 };
 export var tupleNumber = function tupleNumber() {
   for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
     args[_key2] = arguments[_key2];
   }
-
   return args;
 };
 var buttonTypes = tuple('default', 'primary', 'secondary', 'info', 'success', 'warning', 'error', 'abort', 'primary-light', 'secondary-light', 'info-light', 'success-light', 'warning-light', 'error-light');

package/esm/utils/types.d.ts

@@ -1,3 +1,3 @@
-export declare type DeepPartial<T> = {
+export type DeepPartial<T> = {
     [P in keyof T]?: T[P] extends Record<string, any> ? DeepPartial<T[P]> : T[P];
 };

package/esm/utils/use-body-scroll.d.ts

@@ -1,2 +1,2 @@
-import useBodyScroll from "../use-body-scroll";
+import useBodyScroll from '../use-body-scroll';
 export default useBodyScroll;

package/esm/utils/use-bolio-ui-context.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import type { ToastLayout, Toast } from "../use-toasts/use-toast";
+import type { ToastLayout, Toast } from '../use-toasts/use-toast';
 export declare const defaultToastLayout: Required<ToastLayout>;
-export declare type UpdateToastsFunction = (fn: (toasts: Array<Toast>) => Array<Toast>) => any;
-export declare type UpdateToastsLayoutFunction = (fn: (layout: Required<ToastLayout>) => Required<ToastLayout>) => any;
-export declare type UpdateToastsIDFunction = (fn: () => string | null) => any;
+export type UpdateToastsFunction = (fn: (toasts: Array<Toast>) => Array<Toast>) => any;
+export type UpdateToastsLayoutFunction = (fn: (layout: Required<ToastLayout>) => Required<ToastLayout>) => any;
+export type UpdateToastsIDFunction = (fn: () => string | null) => any;
 export interface BolioUIContextParams {
     toasts: Array<Toast>;
     updateToasts: UpdateToastsFunction;

package/esm/utils/use-click-anywhere.js

@@ -1,16 +1,13 @@
 import { useEffect } from 'react';
-
 var useClickAnyWhere = function useClickAnyWhere(handler) {
   useEffect(function () {
     var callback = function callback(event) {
       return handler(event);
     };
-
     document.addEventListener('click', callback);
     return function () {
       return document.removeEventListener('click', callback);
     };
   }, [handler]);
 };
-
 export default useClickAnyWhere;

package/esm/utils/use-click-away.d.ts

@@ -1,2 +1,2 @@
-import { default as useClickAway } from "../use-click-away";
+import { default as useClickAway } from '../use-click-away';
 export default useClickAway;

package/esm/utils/use-clipboard.d.ts

@@ -1,2 +1,2 @@
-import useClipboard from "../use-clipboard";
+import useClipboard from '../use-clipboard';
 export default useClipboard;

package/esm/utils/use-context-state/create-bolio-ui-context.js

@@ -4,46 +4,38 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import React, { useImperativeHandle } from 'react';
 import useContextState from './use-context-state';
 import { capitalize } from '../collections';
-
 var makeVirtualValues = function makeVirtualValues(values) {
   var keys = Object.keys(values);
   var handlers = keys.reduce(function (pre, current) {
     var updateHandler = _defineProperty({}, "set".concat(capitalize(current)), function set(_next) {});
-
     return _extends({}, pre, updateHandler);
-  }, {}); // eslint-disable-next-line @typescript-eslint/no-unused-vars
-
+  }, {});
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   var update = function update(_key, _next) {};
-
   return _extends({
     update: update
   }, values, handlers);
 };
-
 export var createBolioUIContext = function createBolioUIContext(name, initialStates) {
   var _ref2;
-
   var virtualValues = makeVirtualValues(initialStates);
   var Context = /*#__PURE__*/React.createContext(virtualValues);
   var BolioUIContext = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var defaultValues = _ref.defaultValues,
-        children = _ref.children,
-        onChange = _ref.onChange,
-        onChangeBefore = _ref.onChangeBefore;
+      children = _ref.children,
+      onChange = _ref.onChange,
+      onChangeBefore = _ref.onChangeBefore;
     var initialValues = typeof defaultValues === 'function' ? defaultValues() : defaultValues;
-
     var mergedValues = _extends({}, initialStates, initialValues);
-
     var _useContextState = useContextState(mergedValues, {
-      onChange: onChange ? onChange : function () {},
-      filter: onChangeBefore ? onChangeBefore : function () {
-        return true;
-      }
-    }),
-        _useContextState2 = _slicedToArray(_useContextState, 3),
-        states = _useContextState2[0],
-        statesRef = _useContextState2[2];
-
+        onChange: onChange ? onChange : function () {},
+        filter: onChangeBefore ? onChangeBefore : function () {
+          return true;
+        }
+      }),
+      _useContextState2 = _slicedToArray(_useContextState, 3),
+      states = _useContextState2[0],
+      statesRef = _useContextState2[2];
     useImperativeHandle(ref, function () {
       return statesRef.current;
     }, [statesRef.current]);

package/esm/utils/use-context-state/use-context-state.js

@@ -4,14 +4,12 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { useMemo } from 'react';
 import useCurrentState from '../use-current-state';
 import { capitalize } from '../collections';
-
 var useContextState = function useContextState(initialState, options) {
   var _useCurrentState = useCurrentState(initialState),
-      _useCurrentState2 = _slicedToArray(_useCurrentState, 3),
-      state = _useCurrentState2[0],
-      setState = _useCurrentState2[1],
-      stateRef = _useCurrentState2[2];
-
+    _useCurrentState2 = _slicedToArray(_useCurrentState, 3),
+    state = _useCurrentState2[0],
+    setState = _useCurrentState2[1],
+    stateRef = _useCurrentState2[2];
   var update = function update(key, next) {
     var allowChange = options !== null && options !== void 0 && options.filter ? options === null || options === void 0 ? void 0 : options.filter(key, next) : true;
     if (!allowChange) return;
@@ -20,18 +18,15 @@ var useContextState = function useContextState(initialState, options) {
     });
     (options === null || options === void 0 ? void 0 : options.onChange) && (options === null || options === void 0 ? void 0 : options.onChange(key, next));
   };
-
   var makeUpdates = function makeUpdates() {
     var keys = Object.keys(state);
     return keys.reduce(function (pre, current) {
       var updateHandler = _defineProperty({}, "set".concat(capitalize(current)), function set(nextValue) {
         update(current, nextValue);
       });
-
       return _extends({}, pre, updateHandler);
     }, {});
   };
-
   var updates = makeUpdates();
   var stateMemo = useMemo(function () {
     return _extends({
@@ -40,5 +35,4 @@ var useContextState = function useContextState(initialState, options) {
   }, [state]);
   return [stateMemo, setState, stateRef];
 };
-
 export default useContextState;

package/esm/utils/use-current-state.d.ts

@@ -1,2 +1,2 @@
-import useCurrentState from "../use-current-state";
+import useCurrentState from '../use-current-state';
 export default useCurrentState;

package/esm/utils/use-default-props.d.ts

@@ -0,0 +1,2 @@
+declare const useDefaultProps: <T extends Record<string | number, any>, D extends Partial<T>>(props: T, defaultProps: D) => T & Required<D>;
+export default useDefaultProps;

package/esm/utils/use-default-props.js

@@ -2,21 +2,16 @@ var useDefaultProps = function useDefaultProps(props, defaultProps) {
   var nextProps = {};
   var propsKeys = Object.keys(props || {});
   var defaultKeys = Object.keys(defaultProps || {});
-
   for (var _i = 0, _propsKeys = propsKeys; _i < _propsKeys.length; _i++) {
     var propsName = _propsKeys[_i];
     nextProps[propsName] = props[propsName];
   }
-
   for (var _i2 = 0, _defaultKeys = defaultKeys; _i2 < _defaultKeys.length; _i2++) {
     var defaultName = _defaultKeys[_i2];
-
     if (props[defaultName] === undefined) {
       nextProps[defaultName] = defaultProps[defaultName];
     }
   }
-
   return nextProps;
 };
-
 export default useDefaultProps;

package/esm/utils/use-dom-observer.js

@@ -1,5 +1,4 @@
 import { useEffect } from 'react';
-
 var useDOMObserver = function useDOMObserver(ref) {
   var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
   var config = {
@@ -10,12 +9,10 @@ var useDOMObserver = function useDOMObserver(ref) {
   useEffect(function () {
     if (!ref || !ref.current) return;
     var unmount = false;
-
     var done = function done() {
       if (unmount) return;
       callback.apply(void 0, arguments);
     };
-
     var observer = new MutationObserver(done);
     observer.observe(ref.current, config);
     return function () {
@@ -24,5 +21,4 @@ var useDOMObserver = function useDOMObserver(ref) {
     };
   }, [ref]);
 };
-
 export default useDOMObserver;

package/esm/utils/use-drag.d.ts

@@ -1,8 +1,8 @@
 import { RefObject } from 'react';
-export declare type DraggingEvent = {
+export type DraggingEvent = {
     startX: number;
     currentX: number;
 };
-export declare type DraggingHandler = (event: DraggingEvent) => void;
+export type DraggingHandler = (event: DraggingEvent) => void;
 declare const useDrag: (elementRef: RefObject<HTMLElement> | null, draggingHandler?: DraggingHandler, dragStartHandler?: DraggingHandler, dragEndHandler?: DraggingHandler) => void;
 export default useDrag;

package/esm/utils/use-drag.js

@@ -1,30 +1,25 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { useEffect, useRef } from 'react';
 import useCurrentState from './use-current-state';
-
 var useDrag = function useDrag(elementRef) {
   var draggingHandler = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
   var dragStartHandler = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function () {};
   var dragEndHandler = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : function () {};
   var onDragging = useRef(false);
-
   var _useCurrentState = useCurrentState(0),
-      _useCurrentState2 = _slicedToArray(_useCurrentState, 3),
-      setStartX = _useCurrentState2[1],
-      startXRef = _useCurrentState2[2];
-
+    _useCurrentState2 = _slicedToArray(_useCurrentState, 3),
+    setStartX = _useCurrentState2[1],
+    startXRef = _useCurrentState2[2];
   var _useCurrentState3 = useCurrentState(0),
-      _useCurrentState4 = _slicedToArray(_useCurrentState3, 3),
-      setCurrentX = _useCurrentState4[1],
-      currentXRef = _useCurrentState4[2];
-
+    _useCurrentState4 = _slicedToArray(_useCurrentState3, 3),
+    setCurrentX = _useCurrentState4[1],
+    currentXRef = _useCurrentState4[2];
   var getCustomEvent = function getCustomEvent() {
     return {
       startX: startXRef.current,
       currentX: currentXRef.current
     };
   };
-
   var elementMouseDownHandler = function elementMouseDownHandler(event) {
     event.stopPropagation();
     event.stopImmediatePropagation();
@@ -33,25 +28,20 @@ var useDrag = function useDrag(elementRef) {
     setStartX(elementRef.current.getBoundingClientRect().x);
     dragStartHandler(getCustomEvent());
   };
-
   var globalDraggingHandler = function globalDraggingHandler(event) {
     if (!onDragging.current) return;
-
     if (event.type === 'touchmove') {
       setCurrentX(event.changedTouches[0].clientX);
     } else {
       setCurrentX(event.clientX);
     }
-
     draggingHandler(getCustomEvent());
   };
-
   var globalDragEndHandler = function globalDragEndHandler() {
     if (!onDragging.current) return;
     onDragging.current = false;
     dragEndHandler(getCustomEvent());
   };
-
   useEffect(function () {
     if (!elementRef || !elementRef.current) return;
     elementRef.current.addEventListener('mousedown', elementMouseDownHandler);
@@ -71,5 +61,4 @@ var useDrag = function useDrag(elementRef) {
     };
   }, [elementRef]);
 };
-
 export default useDrag;

package/esm/utils/use-portal.d.ts

@@ -1,2 +1,2 @@
-declare const usePortal: (selectId?: string, getContainer?: (() => HTMLElement | null) | undefined) => HTMLElement | null;
+declare const usePortal: (selectId?: string, getContainer?: () => HTMLElement | null) => HTMLElement | null;
 export default usePortal;

package/esm/utils/use-portal.js

@@ -2,39 +2,31 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { useEffect, useState } from 'react';
 import useSSR from './use-ssr';
 import { getId } from './collections';
-
 var createElement = function createElement(id) {
   var el = document.createElement('div');
   el.setAttribute('id', id);
   return el;
 };
-
 var usePortal = function usePortal() {
   var selectId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : getId();
   var getContainer = arguments.length > 1 ? arguments[1] : undefined;
   var id = "bolio-ui-".concat(selectId);
-
   var _useSSR = useSSR(),
-      isBrowser = _useSSR.isBrowser;
-
+    isBrowser = _useSSR.isBrowser;
   var _useState = useState(isBrowser ? createElement(id) : null),
-      _useState2 = _slicedToArray(_useState, 2),
-      elSnapshot = _useState2[0],
-      setElSnapshot = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    elSnapshot = _useState2[0],
+    setElSnapshot = _useState2[1];
   useEffect(function () {
     var customContainer = getContainer ? getContainer() : null;
     var parentElement = customContainer || document.body;
     var hasElement = parentElement.querySelector("#".concat(id));
     var el = hasElement || createElement(id);
-
     if (!hasElement) {
       parentElement.appendChild(el);
     }
-
     setElSnapshot(el);
   }, []);
   return elSnapshot;
 };
-
 export default usePortal;

package/esm/utils/use-previous.js

@@ -1,5 +1,4 @@
 import { useEffect, useRef } from 'react';
-
 var usePrevious = function usePrevious(state) {
   var ref = useRef(null);
   useEffect(function () {
@@ -7,5 +6,4 @@ var usePrevious = function usePrevious(state) {
   });
   return ref ? ref.current : null;
 };
-
 export default usePrevious;

package/esm/utils/use-real-shape.d.ts

@@ -1,9 +1,9 @@
 import { MutableRefObject } from 'react';
-export declare type ShapeType = {
+export type ShapeType = {
     width: number;
     height: number;
 };
 export declare const getRealShape: (el: HTMLElement | null) => ShapeType;
-export declare type ShapeResult = [ShapeType, () => void];
+export type ShapeResult = [ShapeType, () => void];
 declare const useRealShape: <T extends HTMLElement>(ref: MutableRefObject<T | null>) => ShapeResult;
 export default useRealShape;