@bolio-ui/core 1.0.0

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

@@ -0,0 +1,22 @@
+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

@@ -0,0 +1,28 @@
+import { useEffect } from 'react';
+
+var useDOMObserver = function useDOMObserver(ref) {
+  var callback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
+  var config = {
+    attributes: false,
+    childList: true,
+    subtree: true
+  };
+  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 () {
+      unmount = true;
+      observer.disconnect();
+    };
+  }, [ref]);
+};
+
+export default useDOMObserver;

package/esm/utils/use-drag.js

@@ -0,0 +1,75 @@
+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];
+
+  var _useCurrentState3 = useCurrentState(0),
+      _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();
+    onDragging.current = true;
+    if (!elementRef || !elementRef.current) return;
+    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);
+    elementRef.current.addEventListener('touchstart', elementMouseDownHandler);
+    window.addEventListener('mousemove', globalDraggingHandler);
+    window.addEventListener('touchmove', globalDraggingHandler);
+    window.addEventListener('mouseup', globalDragEndHandler);
+    window.addEventListener('touchend', globalDragEndHandler);
+    return function () {
+      window.removeEventListener('mousemove', globalDraggingHandler);
+      window.removeEventListener('touchmove', globalDraggingHandler);
+      window.removeEventListener('mouseup', globalDragEndHandler);
+      window.removeEventListener('touchend', globalDragEndHandler);
+      if (!elementRef || !elementRef.current) return;
+      elementRef.current.removeEventListener('mousedown', elementMouseDownHandler);
+      elementRef.current.removeEventListener('touchstart', elementMouseDownHandler);
+    };
+  }, [elementRef]);
+};
+
+export default useDrag;

package/esm/utils/use-portal.js

@@ -0,0 +1,40 @@
+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;
+
+  var _useState = useState(isBrowser ? createElement(id) : null),
+      _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

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

package/esm/utils/use-real-shape.js

@@ -0,0 +1,53 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { useEffect, useState } from 'react';
+export var getRealShape = function getRealShape(el) {
+  var defaultShape = {
+    width: 0,
+    height: 0
+  };
+  if (!el || typeof window === 'undefined') return defaultShape;
+  var rect = el.getBoundingClientRect();
+
+  var _window$getComputedSt = window.getComputedStyle(el),
+      width = _window$getComputedSt.width,
+      height = _window$getComputedSt.height;
+
+  var getCSSStyleVal = function getCSSStyleVal(str, parentNum) {
+    if (!str) return 0;
+    var strVal = str.includes('px') ? +str.split('px')[0] : str.includes('%') ? +str.split('%')[0] * parentNum * 0.01 : str;
+    return Number.isNaN(+strVal) ? 0 : +strVal;
+  };
+
+  return {
+    width: getCSSStyleVal("".concat(width), rect.width),
+    height: getCSSStyleVal("".concat(height), rect.height)
+  };
+};
+
+var useRealShape = function useRealShape(ref) {
+  var _useState = useState({
+    width: 0,
+    height: 0
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      state = _useState2[0],
+      setState = _useState2[1];
+
+  var update = function update() {
+    var _getRealShape = getRealShape(ref.current),
+        width = _getRealShape.width,
+        height = _getRealShape.height;
+
+    setState({
+      width: width,
+      height: height
+    });
+  };
+
+  useEffect(function () {
+    return update();
+  }, [ref.current]);
+  return [state, update];
+};
+
+export default useRealShape;

package/esm/utils/use-resize.js

@@ -0,0 +1,21 @@
+import { useEffect } from 'react';
+
+var useResize = function useResize(callback) {
+  var immediatelyInvoke = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  useEffect(function () {
+    var fn = function fn() {
+      return callback();
+    };
+
+    if (immediatelyInvoke) {
+      fn();
+    }
+
+    window.addEventListener('resize', fn);
+    return function () {
+      return window.removeEventListener('resize', fn);
+    };
+  }, []);
+};
+
+export default useResize;

package/esm/utils/use-ssr.js

@@ -0,0 +1,20 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { useEffect, useState } from 'react';
+import { isBrowser } from './collections';
+
+var useSSR = function useSSR() {
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      browser = _useState2[0],
+      setBrowser = _useState2[1];
+
+  useEffect(function () {
+    setBrowser(isBrowser());
+  }, []);
+  return {
+    isBrowser: browser,
+    isServer: !browser
+  };
+};
+
+export default useSSR;

package/esm/utils/use-warning.js

@@ -0,0 +1,17 @@
+var warningStack = {};
+
+var useWarning = function useWarning(message, component) {
+  var tag = component ? " [".concat(component, "]") : ' ';
+  var log = "[Bolio UI]".concat(tag, ": ").concat(message);
+  if (typeof console === 'undefined') return;
+  if (warningStack[log]) return;
+  warningStack[log] = true;
+
+  if (process.env.NODE_ENV !== 'production') {
+    return console.error(log);
+  }
+
+  console.warn(log);
+};
+
+export default useWarning;

package/package.json

@@ -0,0 +1,140 @@
+{
+  "name": "@bolio-ui/core",
+  "version": "1.0.0",
+  "license": "MIT",
+  "description": "Amazing, modern and creative tools for React UI. 🥷🏼",
+  "homepage": "https://bolio-ui.com/",
+  "author": {
+    "name": "Bruno Andrade",
+    "email": "brunnoandradi@gmail.com"
+  },
+  "bugs": {
+    "url": "https://github.com/bolio-ui/bolio-ui/issues/new/choose"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/bolio-ui/bolio-ui"
+  },
+  "keywords": [
+    "bolio",
+    "bolio ui",
+    "components",
+    "modern components",
+    "react components",
+    "react ui"
+  ],
+  "files": [
+    "/dist",
+    "/esm"
+  ],
+  "main": "dist/index.js",
+  "module": "esm/index.js",
+  "types": "esm/index.d.ts",
+  "unpkg": "dist/index.min.js",
+  "sideEffects": false,
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "eslint src --max-warnings=0",
+    "prepare": "husky install",
+    "typecheck": "tsc --project tsconfig.json --noEmit",
+    "test": "jest",
+    "test:watch": "yarn test --watch",
+    "generate": "yarn plop --plopfile generators/plopfile.js",
+    "storybook": "start-storybook -s ./public -p 6006",
+    "build-storybook": "build-storybook -s ./public",
+    "export": "yarn build && next export -o _static",
+    "build:storybook": "build-storybook -s ./public",
+    "build:clear": "rm -rf ./dist ./esm",
+    "build:rollup": "rollup -c scripts/rollup.config.js",
+    "build:babel": "babel --no-babelrc --config-file ./scripts/babel.config.js --extensions \".js,.ts,.tsx\" ./core --out-dir ./esm --ignore \"**/__tests__/**/*,**/*.d.ts\"",
+    "build:after": "node scripts/move-built-in.js",
+    "build:webpack": "webpack --config scripts/webpack.config.js",
+    "build:package": "yarn build:clear && yarn build:rollup && yarn build:babel && yarn build:after",
+    "clear-all": "rm -rf .next _static node_modules",
+    "re-start": "rm -rf .next _static node_modules && yarn install && yarn dev",
+    "re-build": "rm -rf .next _static node_modules && yarn install && yarn build",
+    "release": "yarn build && yarn build:package && yarn publish --access public --non-interactive"
+  },
+  "lint-staged": {
+    "src/**/*": [
+      "yarn lint --fix",
+      "yarn test --findRelatedTests --bail"
+    ]
+  },
+  "dependencies": {
+    "@mapbox/rehype-prism": "^0.6.0",
+    "@mdx-js/loader": "^1.6.22",
+    "@next/mdx": "^11.0.1",
+    "algoliasearch": "^4.14.2",
+    "classnames": "^2.3.1",
+    "gray-matter": "^4.0.3",
+    "jest-styled-components": "^7.0.5",
+    "kbar": "0.1.0-beta.6",
+    "next": "11.0.1",
+    "next-pwa": "^5.2.24",
+    "next-seo": "^5.5.0",
+    "prism-react-renderer": "^1.2.1",
+    "react": "17.0.2",
+    "react-autosuggest": "^10.1.0",
+    "react-device-detect": "^1.17.0",
+    "react-dom": "^17.0.2",
+    "react-instantsearch-dom": "^6.12.0",
+    "react-live": "^2.2.3",
+    "react-syntax-highlighter": "^15.5.0",
+    "rehype-join-line": "^1.0.2",
+    "remark-autolink-headings": "^6.0.1",
+    "remark-slug": "^6.0.0",
+    "styled-components": "^5.3.0"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.14.5",
+    "@babel/core": "^7.14.8",
+    "@babel/plugin-transform-runtime": "^7.14.5",
+    "@babel/preset-env": "^7.14.7",
+    "@babel/preset-react": "^7.14.5",
+    "@babel/preset-typescript": "^7.14.5",
+    "@bolio-ui/icons": "^1.0.4",
+    "@rollup/plugin-commonjs": "^21.0.1",
+    "@rollup/plugin-node-resolve": "^13.1.3",
+    "@storybook/addon-essentials": "^6.5.12",
+    "@storybook/react": "^6.5.12",
+    "@testing-library/jest-dom": "^5.14.1",
+    "@testing-library/react": "^12.0.0",
+    "@types/jest": "^26.0.24",
+    "@types/react": "^17.0.15",
+    "@types/react-autosuggest": "^10.1.5",
+    "@types/react-dom": "^17.0.11",
+    "@types/react-syntax-highlighter": "^15.5.4",
+    "@types/styled-components": "^5.1.11",
+    "@typescript-eslint/eslint-plugin": "^4.29.0",
+    "@typescript-eslint/parser": "^4.29.0",
+    "babel-loader": "^8.2.2",
+    "babel-plugin-styled-components": "^1.13.2",
+    "babel-plugin-transform-rename-import": "^2.3.0",
+    "eslint": "7.32.0",
+    "eslint-config-next": "11.0.1",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-prettier": "^3.4.0",
+    "eslint-plugin-react": "^7.24.0",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "eslint-plugin-storybook": "^0.6.4",
+    "husky": "^7.0.0",
+    "jest": "^27.0.6",
+    "lint-staged": "^11.1.1",
+    "plop": "^2.7.4",
+    "prettier": "2.3.2",
+    "rollup": "^2.64.0",
+    "rollup-plugin-babel": "^4.4.0",
+    "rollup-plugin-local-resolve": "^1.0.7",
+    "styled-jsx": "4.0.1",
+    "ttypescript": "^1.5.13",
+    "typescript": "^4.3.5",
+    "typescript-transform-paths": "^3.3.1"
+  },
+  "peerDependencies": {
+    "react": ">=16.9.0",
+    "react-dom": ">=16.9.0"
+  }
+}