@startlibs/utils 1.0.3 → 1.1.0

package/package.json

@@ -1,44 +1,44 @@
 {
   "name": "@startlibs/utils",
-  "version": "1.0.3",
+  "version": "1.1.0",
   "description": "Startlibs Utils",
-  "main": "lib/index.js",
+  "main": "lib/index.cjs",
+  "exports": {
+    ".": {
+      "source": "./src/index.js",
+      "require": "./lib/index.cjs",
+      "import": "./lib/index.mjs",
+      "default": "./lib/index.mjs"
+    },
+    "./package.json": "./package.json",
+    "./*": {
+      "import": "./lib/*.mjs"
+    }
+  },
   "sideEffects": false,
-  "source": true,
+  "source": "./src/index.js",
   "peerDependencies": {
-    "@startlabs/core": "^1.0.0",
-    "create-emotion": "*",
-    "lodash": "*",
-    "react": "*",
-    "react-dom": "*",
-    "styled-components": "^5.1.1"
+    "@startlibs/core": "*",
+    "lodash": "^4.17.21",
+    "react": ">=16.8",
+    "styled-components": ">=5"
   },
   "devDependencies": {
-    "@babel/core": "^7.2.0",
-    "@babel/plugin-external-helpers": "^7.2.0",
-    "@babel/plugin-proposal-class-properties": "^7.2.1",
-    "@babel/plugin-proposal-export-namespace-from": "^7.2.0",
-    "@babel/plugin-proposal-json-strings": "^7.2.0",
-    "@babel/plugin-proposal-object-rest-spread": "^7.2.0",
-    "@babel/plugin-proposal-optional-chaining": "^7.12.0",
-    "@babel/plugin-proposal-throw-expressions": "^7.2.0",
-    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
-    "@babel/plugin-syntax-import-meta": "^7.2.0",
-    "@babel/plugin-transform-runtime": "^7.2.0",
-    "@babel/plugin-transform-spread": "^7.2.0",
-    "@babel/plugin-transform-unicode-property-regex": "^7.27.1",
-    "@babel/preset-env": "^7.2.0",
-    "@babel/preset-flow": "^7.0.0",
-    "@babel/preset-react": "^7.0.0",
+    "@babel/core": "^7.26.0",
+    "@babel/plugin-transform-runtime": "^7.26.0",
+    "@babel/preset-env": "^7.26.0",
+    "@babel/preset-flow": "^7.25.0",
+    "@babel/preset-react": "^7.26.0",
     "babel-plugin-lodash": "^3.3.4",
     "babel-plugin-macros": "^2.4.2",
     "babel-plugin-styled-components": "^1.10.0",
-    "fbjs-scripts": "^0.6.0-alpha.3",
-    "rollup": "^2.16.1",
+    "lodash": "^4.17.21",
+    "rollup": "^2.79.2",
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-babel": "^4.0.3",
     "rollup-plugin-commonjs": "^9.2.0",
-    "rollup-plugin-node-resolve": "^3.4.0"
+    "rollup-plugin-node-resolve": "^3.4.0",
+    "styled-components": "^5.3.11"
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
@@ -59,7 +59,21 @@
   },
   "homepage": "https://github.com/felipeko/startlibs#readme",
   "dependencies": {
+    "@babel/runtime": "^7.20.0",
     "create-emotion": "10.0.27",
-    "styled-components": "5.1.1"
-  }
+    "polished": "^2.0.0 || ^3.0.0 || ^4.0.0"
+  },
+  "files": [
+    "lib",
+    "src"
+  ],
+  "module": "lib/index.mjs",
+  "browserslist": [
+    "chrome >= 61",
+    "edge >= 79",
+    "firefox >= 60",
+    "safari >= 11",
+    "ios_saf >= 11",
+    "samsung >= 8.2"
+  ]
 }

package/src/ActionUtils.js

@@ -0,0 +1,90 @@
+import {useMemo} from 'react'
+import {callIfFunction} from './utils'
+import {_s} from './lodashUtils'
+import _ from 'lodash/fp'
+
+const isNotSelector = (v) => (typeof v !== 'function' || v.length === 0)
+
+const toSelector = (v) => isNotSelector(v) ? (s) => _s.get(callIfFunction(v),s) : v
+
+const mergeSelectors = (prev, next) => (v) => next(prev(v))
+export const concatSelectors = (...paths) => paths.reduce(([selector, isSelector], path) =>
+    isNotSelector(path) && !isSelector
+    ? [selector.concat(path), false]
+    : [mergeSelectors(toSelector(selector), path), true],
+  [[], false]
+)
+
+export const COMPLETE_ACTION = {}
+export const REDUCE = {}
+export const FETCH = {}
+export const SKIP_FETCH = {}
+export const SKIP_DISPATCH = {}
+export const SKIPPED_ACTION = {}
+
+const ACTION_TYPES = [COMPLETE_ACTION,REDUCE,FETCH,SKIP_FETCH,SKIP_DISPATCH]
+
+export const selectPath = (useState, ...paths) => {
+  const [selector] = useMemo(() => concatSelectors(...paths), paths)
+  const [value] = useState(selector)
+  return value
+}
+
+export const Action = (fnOrArray, prevArgs = []) => {
+  const isArray = Array.isArray(fnOrArray)
+  if (isArray) {
+    // excessive paramaeters called on the action, used for options.
+    const actionType = _.last(prevArgs)
+    const [fetcher, reducer, rollbacker] = fnOrArray
+    if (actionType === REDUCE) {
+      return reducer(null,prevArgs)
+    } else if (actionType === FETCH) {
+      return fetcher()
+    } else {
+      return _.set('extra',fnOrArray.extra,[
+        actionType === SKIP_FETCH ? () => Promise.resolve() : fetcher,
+        actionType === SKIP_DISPATCH ? undefined : reducer,
+      ].concat(rollbacker || []))
+    }
+  } else {
+    return prevArgs.length < fnOrArray.length ? (...moreArgs) => Action(fnOrArray,[...prevArgs,...moreArgs]) : Action(fnOrArray(...prevArgs),prevArgs)
+  }
+}
+
+const mapAction = (get, dispatcher, firstRun) => (action) => {
+  if (Array.isArray(action)) {
+    if (firstRun) {
+      return () => mapAction(get,dispatcher)(action)
+    }
+    const [fetcher, reducer, rollbacker] = action
+    const {skip} = action.extra || {}
+    if (skip && skip(get())) {
+      return Promise.resolve(SKIPPED_ACTION)
+    }
+    const fetched = fetcher()
+    if (rollbacker) {
+      dispatcher(prevState => {
+        const nextState = reducer(null)(prevState)
+        fetched.catch((response)=> {
+          dispatcher(rollbacker(prevState,nextState,response))
+        })
+        return nextState
+      })
+    }
+    if (reducer !== undefined) {
+      fetched.then((response) => dispatcher(reducer(response)))
+    }
+    return fetched
+  } else {
+    return (...moreMetas) => mapAction(get,dispatcher)(action(...moreMetas))
+  }
+}
+
+export const activateActions = (get, dispatcher, ...actions) => {
+  return actions.map(mapAction(get, dispatcher,true))
+}
+
+export const SkipAction = (skip,action) => {
+  action.extra = {...action.extra,skip}
+  return action
+}

package/src/FetchUtils.js

@@ -0,0 +1,87 @@
+import {callIfFunction} from './utils'
+import _ from 'lodash/fp'
+
+const resolveFetch = async (url, fetchOptions) => {
+  try {
+    const response = await fetch(url, {
+      credentials: 'same-origin',
+      ...fetchOptions
+    })
+    const text = await response.text()
+    try {
+      const json = JSON.parse(text)
+      return [json, response]
+    } catch (eror) {
+      return [text, response]
+    }
+  } catch (error) {
+    return [error, false]
+  }
+}
+
+const innerFetcher = async (url, fetchOptions) => {
+  const [data, response] = await resolveFetch(url, fetchOptions)
+  if (!response || response.status >= 400) {
+    throw [data, response]
+  } else {
+    return [data, response]
+  }
+}
+export const queryStringToObj = (str = window.location.search) => Object.fromEntries(new URLSearchParams(str).entries())
+
+export const addQueryString = (existingUrl = '',obj) => {
+  const [onlyUrl, otherQueryString] = existingUrl.split('?')
+  const params = new URLSearchParams(otherQueryString)
+  for (let key in obj) {
+    const value = obj[key]
+    if (value === null) {
+      params.delete(key)
+    } else {
+      params.set(key, obj[key])
+    }
+  }
+  const paramsStr = params.toString()
+  if (!paramsStr) {
+    return onlyUrl
+  }
+  return onlyUrl + '?' + paramsStr
+}
+
+const cleanNulls = (str) => str.replace(/\0/g, '')
+
+// Cross-origin o X-Requested-With só custa: dispara preflight e impede o reuso do
+// <link rel=preload as=fetch>, cujo request vai sem ele. Quem lê o header é servidor nosso.
+const isSameOrigin = (url) => new URL(url, window.location.href).origin === window.location.origin
+
+export let postFetcherWithResponse = async (url, jsonOrForm, fetchOptions = {}) => innerFetcher(url, {
+  method: 'POST',
+  body: typeof jsonOrForm === 'string'
+    ? jsonOrForm
+    : !jsonOrForm || jsonOrForm.constructor === window.FormData || jsonOrForm.constructor === window.File
+      ? jsonOrForm
+      : cleanNulls(JSON.stringify(jsonOrForm)),
+  ...fetchOptions,
+  headers:
+    (_.isPlainObject(fetchOptions.headers) || !fetchOptions.headers)
+    ? {
+        ...(jsonOrForm && (typeof jsonOrForm === 'string' || jsonOrForm.constructor === window.FormData) ? {} : {'Content-Type': 'application/json; charset=UTF-8'}),
+        ...(isSameOrigin(url) ? {'X-Requested-With': 'XMLHttpRequest'} : {}),
+        ...fetchOptions.headers
+      }
+    : fetchOptions.headers
+})
+
+export let getFetcherWithResponse = async (url, jsonParams, fetchOptions) => innerFetcher(addQueryString(url, jsonParams), {
+  method: 'GET',
+  ...fetchOptions,
+  headers: {
+    ...(isSameOrigin(url) ? {'X-Requested-With': 'XMLHttpRequest'} : {}),
+    ...fetchOptions?.headers
+  }
+})
+
+export let postFetcher = async (url, json, options) => postFetcherWithResponse(url, json, options).then(([json]) => json)
+export let getFetcher = async (url, json, options) => getFetcherWithResponse(url, json, options).then(([json]) => json)
+
+export const formFetchWithResponse = (url, options) => (values, meta) => postFetcherWithResponse(callIfFunction(url, meta, values), values, callIfFunction(options, meta, values))
+export const formFetch = (url, options) => (values, meta) => postFetcher(callIfFunction(url, meta, values), values, callIfFunction(options, meta, values))

package/src/createPressEvent.jsx

@@ -0,0 +1,79 @@
+import React from 'react'
+import {callIfFunction, normalizePress} from './utils'
+
+
+const disableSelect = (e) => {
+  e.preventDefault();
+}
+
+export const createPressEvent = (onStart) => normalizePress((startEvent, info) => {
+  const onEnd = onStart(startEvent,info)
+
+  const finish = normalizePress((e,info) => {
+    callIfFunction(onEnd,e,info)
+    window.removeEventListener('selectstart', disableSelect)
+    window.removeEventListener('touchend',finish)
+    window.removeEventListener('mouseup',finish)
+  })
+
+
+  window.addEventListener('selectstart', disableSelect);
+  if (startEvent.touches) {
+    window.addEventListener('touchend', finish)
+  } else {
+    window.addEventListener("mouseup", finish);
+  }
+
+})
+
+export const createPressAndHoldEvent = (onStart,interval) => createPressEvent((startEvent,info) => {
+
+  const [onInterval,onEnd] = [].concat(onStart(startEvent,info))
+
+  let i = 0;
+  if (interval) {
+    const intervalId = setInterval(() => {
+      onInterval(i++)
+    }, interval)
+
+    return normalizePress((e, info) => {
+      callIfFunction(onEnd, e, info)
+      clearInterval(intervalId)
+    })
+  } else {
+    let running = true
+    const run = () => window.requestAnimationFrame(() => {
+      if (running) {
+        onInterval(i++)
+        run()
+      }
+    })
+    run()
+    return normalizePress((e,info) => {
+      callIfFunction(onEnd, e, info)
+      running = false
+    })
+  }
+})
+
+
+export const createPressAndMoveEvent = (onStart) => createPressEvent((startEvent, info) => {
+
+  const [onMove,onEnd] = [].concat(onStart(startEvent,info))
+
+  const finish = normalizePress((e,info) => {
+    callIfFunction(onEnd,e,info)
+    window.removeEventListener('touchmove',move)
+    window.removeEventListener('mousemove',move)
+  })
+  const move = normalizePress(onMove,finish)
+
+  if (startEvent.touches) {
+    window.addEventListener('touchmove', move, {passive: false})
+  } else {
+    window.addEventListener("mousemove", move);
+  }
+
+  return finish
+})
+

package/src/fixMediaQuery.js

@@ -0,0 +1,71 @@
+let fixed = false
+export const scrollWidth = (function() {
+  if (!window.document) return 0
+  const html = document.documentElement
+  const oldOverflow = html.style.overflowY
+  html.style.overflowY = 'scroll'
+  const width = window.innerWidth - html.clientWidth
+  html.style.overflowY = oldOverflow
+  return width
+})()
+
+const fixMediaQueryFn = function() {
+
+  const fontSize = parseFloat(window.getComputedStyle(document.body).getPropertyValue('font-size'))
+
+  if (scrollWidth > 0) {
+
+    [].slice.call(document.styleSheets).filter(styleSheet => isValidExternal(styleSheet) || isInline(styleSheet)).forEach(stylesheet => {
+      try {
+        [].slice.call(stylesheet.cssRules || stylesheet.media).filter(rule => rule.constructor === window.CSSMediaRule).forEach(rule => {
+          rule.media.mediaText = rule.media.mediaText.replace(/m(in|ax)-width:\s*(\d|\.)+(px|em)/gi, function(strA) {
+            if (strA.match('px')) {
+              return strA.replace(/\d+px/gi, function(strB) {
+                return parseInt(strB, 10) + scrollWidth + 'px'
+              })
+            }
+            else {
+              return strA.replace(/\d.+?em/gi, function(strB) {
+                return ((parseFloat(strB) * fontSize) + scrollWidth) / fontSize + 'em'
+              })
+            }
+          })
+        })
+      } catch (e) {}
+    })
+  }
+
+  fixed = true
+
+  function sameOrigin(url) {
+    const loc = window.location,
+      a = document.createElement('a')
+    a.href = url
+    return (a.hostname === loc.hostname && a.protocol === loc.protocol)
+  }
+
+  function isInline(stylesheet) {
+    try {
+      return stylesheet.ownerNode.constructor === HTMLStyleElement && stylesheet.ownerNode.getAttribute("data-styled") === null
+    } catch (e) {
+      return stylesheet.ownerNode.constructor === HTMLStyleElement
+    }
+  }
+
+  function isValidExternal(stylesheet) {
+    return stylesheet.href && (sameOrigin(stylesheet.href) || stylesheet.ownerNode?.crossOrigin === "anonymous")
+  }
+
+}
+
+
+export function fixMediaQuery() {
+  if (fixed || !document || !document.readyState)
+    return
+  if (process.env.NODE_ENV === 'test') { return }
+  if (document.readyState !== 'loading') {
+    fixMediaQueryFn()
+  } else {
+    document.addEventListener('DOMContentLoaded', fixMediaQueryFn)
+  }
+}

package/src/formatDate.js

@@ -0,0 +1,121 @@
+
+const escapedValidParts = /(^|[^\\])(dd?|DD?|mm?|LL?|hh?|MM?|ss|SSS|yy(?:yy)?)/g
+const validParts = /(dd?|DD?|mm?|LL?|hh?|MM?|yy(?:yy)|yy|ss|SSS)$/
+export const addZero = (v) => (v < 10 ? '0' : '') + v
+
+const getSet = (index, ttype, plus = 0, format = (v) => v, parse = (v, defaultDate) => (v === '0' ? '' : v)) => ([
+  (date,_,noUTC) => format((typeof date === 'number' ? new Date(date) : date)['get'+(noUTC?'':'UTC') + ttype]() + plus),
+  (unformatedStr, date, _, failOnFormat, noUTC) => {
+    const str = parse(unformatedStr, date, failOnFormat)
+    if (str === '' || isNaN(date.getTime()))
+      return date
+    if (str=== '\0')
+      return date.setTime(NaN)
+    const utcSTR = noUTC ? '' : 'UTC'
+    const v = parseInt(str, 10) - plus
+    const prevDay = date['get'+utcSTR+'Date']()
+    if (ttype !== 'Date') {
+      date['set'+utcSTR+'Date'](1)
+    }
+    date['set'+ utcSTR + ttype](v)
+    if (date['get' + utcSTR + ttype]() !== v) {
+      date['set' + utcSTR + ttype](NaN)
+      return date
+    }
+    if (ttype !== 'Date') {
+      date['set'+utcSTR+'Date'](prevDay)
+      if (date['get' + utcSTR + ttype]() !== v) {
+        date['set'+utcSTR+'Date'](0)
+        return date
+      }
+    }
+    return date
+  },
+  index
+])
+
+const getText = (type, total, slice = 99) => [
+  (date, messages,noUTC) => messages(type.toLowerCase(),date['get'+(noUTC? '': 'UTC') + type]()).slice(0, slice)
+]
+
+const yearParse = (y, date, failOnFormat) =>  {
+  const formattedY = y.length === 2 && y !== '20' ? '20' + y : y.length === 4 ? y : ''
+  if (formattedY === '') {
+    if (failOnFormat) {
+      const found = date.getUTCFullYear().toString().indexOf(y)
+      return found === 0 || found === 2 ? date.getUTCFullYear() : '\0'
+    } else {
+      return date.getUTCFullYear()
+    }
+  } else {
+    return formattedY
+  }
+}
+
+const val = {
+  yyyy: getSet(0,'FullYear', 0, (v) => v, yearParse),
+  yy: getSet(0,'FullYear', 0, (v) => (v+"").slice(2,4), yearParse),
+  M: getSet(1,'Month', 1),
+  MM: getSet(1,'Month', 1, addZero),
+  L: getText('Month',12,3),
+  LL: getText('Month',12),
+  d: getSet(2,'Date'),
+  dd: getSet(2,'Date', 0, addZero),
+  D: getText('Day', 7, 3),
+  DD: getText('Day', 7),
+  m: getSet(4,'Minutes'),
+  mm: getSet(4,'Minutes', 0, addZero),
+  h: getSet(5,'Hours'),
+  hh: getSet(5,'Hours', 0, addZero),
+  ss: getSet(6,'Seconds', 0, addZero),
+  SSS: getSet(7,'Milliseconds', 0, addZero),
+
+}
+
+export function formatDateToPattern(format) {
+  return format.replace(escapedValidParts, (_, _1, _2) => _1 + (_2 === 'yy' ? '##' : _2 === 'yyyy' ? '####' : '0#'))
+}
+
+export function formatDate(date, format, messages,noUTC) {
+  if (!date)
+    return ''
+  const separators = format.replace(escapedValidParts, '\0').split('\0')
+  const parts = format.match(escapedValidParts)
+  const formattedDate = parts.reduce((acc, part) =>
+      acc.concat(
+        separators.length ? [separators.shift()] : [],
+        part.replace(validParts, ''),
+        val[part.match(validParts)[0]][0](date, messages,noUTC)
+      ),
+    []
+  )
+  return formattedDate.join('').replace(/\\([dDmLhMy])/g, '$1')
+}
+
+const now = () => new Date()
+
+export function parseDate(str, possibleDate, format, messages, failOnFormat, noUTC) {
+  if (!str)
+    return possibleDate
+  const separators = format.replace(escapedValidParts, '\0').split('\0')
+  const parts = format.match(escapedValidParts)
+  const mutations = []
+  parts.reduce((rest, part, i) => {
+      const separator = (separators.length ? separators.shift() : '') + part.replace(validParts, '')
+      const current = rest.slice(separator.length)
+      if (current && separator === rest.slice(0, separator.length)) {
+        const setType = part.match(validParts)[0]
+        const nextSeparator = separators[0]
+        const nextStrIndex = current.indexOf(nextSeparator + (parts[i + 1] || '').replace(validParts, ''))
+        mutations[val[setType][2]] = [val[setType][1],nextStrIndex ? current.slice(0,nextStrIndex) : current]
+        return current.slice(nextStrIndex)
+      } else {
+        return ''
+      }
+    },
+    str
+  )
+  const date = possibleDate && possibleDate.getTime()!==-1 ? new Date(possibleDate) : now()
+  mutations.forEach(([setter,text])=> setter(text,date,messages,failOnFormat,noUTC))
+  return date
+}

package/src/formatUtils.jsx

@@ -0,0 +1,63 @@
+import React from 'react'
+import _ from 'lodash/fp'
+
+export const formatJoin = (arr,separator = ', ', lastSeparator = ' e ') => [arr.slice(0,-1).join(separator),arr.slice(-1)].join(lastSeparator)
+
+export const formatJoinArr = (arr,separator,lastSeparator) =>
+  arr.flatMap((v,i) => i < arr.length - 2 ? [v,separator] : (i < arr.length - 1 ? [v,lastSeparator] : [v]))
+
+export const removeAccents = (str) => (str||"").normalize('NFD').replace(/\p{Diacritic}/gu, "")
+export const asciify = (str) => removeAccents(str||"").replace(/[^\x00-\x7F]/g, "")
+export const normalizeText = (str) => removeAccents(str).toLowerCase()
+export const normalizeTextUrl = (str) => removeAccents(str).replace(/[\s.\u0022&/]/g, '-').replace(/-{2,}/g,'-').toLowerCase()
+
+
+export const willFormatDecimal = (digits = 2,{max,min,padTo,zeroless,clean} = {}) => {
+  const splitRegex = new RegExp(`(\\d+)(\\d{${digits}})`)
+  const singleRegex = new RegExp(`/^([^,]*,\\d{0,${digits}).*/`)
+  const pad = (str) =>
+    padTo
+    ? (str.indexOf(",") >= 0
+       ? _.padCharsEnd("0", str.indexOf(",") + padTo + 1,str)
+       : _.padCharsEnd("0", str.length + 1 + padTo, str + ",")
+    )
+    : str
+  const constrain = (val) => {
+    if (_.isNumber(max) && parseFloat(val.replace(",",".")) > max) return max.toString()
+    if (_.isNumber(min) && parseFloat(val.replace(",",".")) < min) return min.toString()
+    return val
+  }
+  const cleaned = (val) =>
+    clean
+    ? (val.replace(/,$/,'').replace(/^0*,/,'0,') || "0")
+    : val
+
+  return (v) => {
+    const skipZero = (finalV) => v!=='0' && zeroless && finalV === '0' ? '' : finalV.replace(/^0+([^,])/,'$1')
+    const formatted = _.flow(constrain,pad,skipZero,cleaned)
+    if (_.isNumber(v)) {
+      return formatted(v.toString().replace(".",","))
+    }
+    const fixComma = (v) => v.replace(/,/g, '').replace(splitRegex, "$1,$2")
+
+    const format = () => {
+      const allowedChars = (v||"").replace(/[^\d,]/g, "")
+      const commaIndex = allowedChars.indexOf(',')
+      if (commaIndex >= 0 && commaIndex < allowedChars.length - 1 - digits) {
+        const alteredComma = fixComma(allowedChars)
+        if (_.isNumber(max) && parseFloat(alteredComma.replace(",",".")) > max) {
+          return fixComma(allowedChars.slice(0, commaIndex + 1 + digits))
+        }
+        return alteredComma
+      }
+      const simpleNumber = allowedChars.replace(singleRegex, "$1")
+      if (_.isNumber(max) && parseInt(simpleNumber) > max) {
+        return simpleNumber.slice(0, -1)
+      }
+      return simpleNumber
+    }
+    const result = format()
+    return formatted(result)
+  }
+}
+export const parseDecimalToNumber = (v) => _.isString(v) ? Number(v.replace(/\./g,'').replace(',', ".")) : (v || 0)

package/src/getClosestOffsetScroll.js

@@ -0,0 +1,12 @@
+export const getClosestOffsetScroll = (node) => {
+  if (!node) {
+    return ((document.body))
+  }
+  const overflowY = window.getComputedStyle(node).overflowY
+  const isScrollable = overflowY !== 'visible' && overflowY !== 'hidden';
+  if (isScrollable && node.scrollHeight > node.clientHeight) {
+    return node;
+  } else {
+    return getClosestOffsetScroll((node.offsetParent));
+  }
+}

package/src/hooks/useEventListener.js

@@ -0,0 +1,26 @@
+import {useEffect} from 'react'
+
+export const useEventListener = (eventName,callback,deps = []) => {
+  useEffect(() => {
+    window.addEventListener(eventName,callback)
+    return () => window.removeEventListener(eventName,callback)
+  },deps)
+
+}
+
+export const useEventListenerIf = (check,eventName,callback,deps = []) => {
+  useEffect(() => {
+    if (!check()) return
+    window.addEventListener(eventName,callback)
+    return () => window.removeEventListener(eventName,callback)
+  },deps)
+
+}
+
+export const useEventListenerFor = (element,eventName,callback,deps = []) => {
+  useEffect(() => {
+    element.addEventListener(eventName,callback)
+    return () => element.removeEventListener(eventName,callback)
+  },deps.concat(element))
+
+}

package/src/index.js

@@ -0,0 +1,19 @@
+export * from './promiseUtils'
+export * from './getClosestOffsetScroll'
+export * from './smoothScroll'
+export * from './fixMediaQuery'
+export * from './FetchUtils'
+export * from './styled'
+export * from './formatDate'
+export * from './lodashUtils'
+export * from './ActionUtils'
+export * from './reduceUtils'
+export * from './reactUtils'
+export * from './hooks/useEventListener'
+export * from './utils'
+export * from './createPressEvent'
+export * from './wrapLazy'
+export * from './timeUtils'
+export * from './timerUtils'
+export * from './formatUtils'
+