koolkit

Properties

easings

easings: { easeInCubic: (t: number) => number; easeInElastic: (t: number) => number; easeInOutCubic: (t: number) => number; easeInOutElastic: (t: number) => number; easeInOutQuad: (t: number) => number; easeInOutQuart: (t: number) => number; easeInOutQuint: (t: number) => number; easeInOutSine: (t: number) => number; easeInQuad: (t: number) => number; easeInQuart: (t: number) => number; easeInQuint: (t: number) => number; easeInSine: (t: number) => number; easeOutCubic: (t: number) => number; easeOutElastic: (t: number) => number; easeOutQuad: (t: number) => number; easeOutQuart: (t: number) => number; easeOutQuint: (t: number) => number; easeOutSine: (t: number) => number; linear: (t: number) => number }

Type declaration

easeInCubic: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInElastic: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInOutCubic: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInOutElastic: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInOutQuad: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInOutQuart: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInOutQuint: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInOutSine: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInQuad: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInQuart: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInQuint: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeInSine: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeOutCubic: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeOutElastic: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeOutQuad: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeOutQuart: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeOutQuint: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
easeOutSine: (t: number) => number
- - (t: number): number
  - Parameters
    - t: number
    Returns number
linear: (t: number) => number
- - (t: number): number
  - Easing functions.
    
    link
    https://1loc.dev/misc/easing-functions/
    
    Parameters
    - t: number
    Returns number

Functions

CSVToJSON

CSVToJSON(data: string, delimiter?: string): any[]

- Defined in csvToJSON.ts:11
Converts a comma-separated values (CSV) string to a 2D array of objects. The first row of the string is used as the title row.

link
https://www.30secondsofcode.org/js/s/csv-to-json

Parameters
- data: string
  
  CSV string to convert.
- delimiter: string = ","
  
  delimiter used in the CSV string.
Returns any[]
JSON object array.

JSONToCSV

JSONToCSV(arr: any[], columns: string[], delimiter?: string): string

- Defined in jsonToCSV.ts:11
Converts an array of objects to a comma-separated values (CSV) string that contains only the columns specified.

link
https://www.30secondsofcode.org/js/s/jso-nto-csv

Parameters
- arr: any[]
  
  Array of objects to convert.
- columns: string[]
  
  Columns to include in the CSV string.
- delimiter: string = ","
  
  Delimiter to use in the CSV string.
Returns string
CSV string.

arrayMove

arrayMove(array: any[], oldIndex: number, newIndex: number): any[]

- Defined in arrayMove.ts:10
Move an item from one position in an array to another.

Parameters
- array: any[]
  
  Array to move the item in.
- oldIndex: number
  
  The index of the item to move.
- newIndex: number
  
  The index to move the item to.
Returns any[]

asyncSequentializer

asyncSequentializer(): (list: any) => any

- Defined in asyncSequentializer.ts:24
Returns (list: any) => any
- - (list: any): any
  - Parameters
    - list: any
    Returns any

checkElementIsVisibleInViewport

checkElementIsVisibleInViewport(el: Element, partiallyVisible?: boolean): boolean

- Defined in checkElementIsVisibleInViewport.ts:9
Checks if the element specified is visible in the viewport.

link
https://www.30secondsofcode.org/js/s/element-is-visible-in-viewport

Parameters
- el: Element
  
  element to check.
- partiallyVisible: boolean = false
  
  Determine if the element is entirely visible, or specify true to determine if it is partially visible.
Returns boolean
boolean

copyToClipboard

copyToClipboard(str: any): Promise<void>

- Defined in copyToClipboard.ts:8
Copy text to clipboard

link
https://www.30secondsofcode.org/articles/s/copy-text-to-clipboard-with-javascript

Parameters
- str: any
  
  string to copy to clipboard.
Returns Promise<void>
void

dataURIToBlob

dataURIToBlob(dataURI: string): Blob

- Defined in dataURIToBlob.ts:1
Parameters
- dataURI: string
Returns Blob

descartes

descartes(array?: any[]): number[]

- Defined in descartes.ts:7
Cartesian product.

Parameters
- array: any[] = []
Returns number[]
Array.

encodeURL

encodeURL(url: string): string

- Defined in encodeURL.ts:10
Encode a URL. encodeURIComponent doesn't encode -_.!~*'()

link
https://1loc.dev/misc/encode-a-url/

Parameters
- url: string
Returns string
An URL.

generatePrimeNumbers

generatePrimeNumbers(num: number): number[]

- Defined in generatePrimeNumbers.ts:9
Generate prime numbers. Using the Sieve of Eratosthenes.

link
https://www.30secondsofcode.org/js/s/primes

Parameters
- num: number
Returns number[]
Prime numbers array.

getIn

getIn(dict: any, path: any): any

- Defined in getIn.ts:9
Deep value retriever.

Parameters
- dict: any
  
  a deeply nested objects, array, or Javascript Map.
- path: any
  
  path to the value to retrieve.
Returns any

getTypeOf

getTypeOf(obj: any): string

- Defined in getTypeOf.ts:8
Get type of a variable in string

link
https://1loc.dev/misc/get-type-of-a-variable-in-string/

Parameters
- obj: any
  
  any
Returns string
string

getURLParams

getURLParams(query: string): Record<string, string>

- Defined in getURLParams.ts:9
Convert URL parameters to object.

link
https://1loc.dev/misc/convert-url-parameters-to-object/

Parameters
- query: string
Returns Record<string, string>
An URL parameters object.

groupBy

groupBy(objectArray: {}, key: string): {}

- Defined in groupBy.ts:9
Group the elements of an map according to the given key.

Parameters
- objectArray: {}
  
  The map to group.
  - [key: string]: any
- key: string
  
  The key to group by.
Returns {}
- [key: string]: any[]

injectCSS

injectCSS(css: string): HTMLStyleElement

- Defined in injectCSS.ts:8
Injects the given CSS code into the current document

link
https://www.30secondsofcode.org/js/s/inject-css

Parameters
- css: string
  
  css code string to inject
Returns HTMLStyleElement
The newly created style element

lazyGet

lazyGet(hostObj: any, name: string, initializer: any): void

Lazily initializes an object's property until it's used.

link

https://davidwalsh.name/lazy-object-initialization

example

// Don't define window.myProp until someone tries to use it
// Thus, if it's never used, it's never initialized
lazyGet(window, "myProp", () => {
  return { message: "Hello!" };
});

// window.myProp is now undefined, since it hasn't been requested yet

// Use it for something, which triggers initialization and returns its value
console.log(window.myProp.message);

// Using it again doesn't initialize again, since it was already created
console.log(window.myProp.message);

// And it can be reassigned later on:
window.myProp = null;

Parameters

hostObj: any
name: string
initializer: any

Returns void

mostPerformant

mostPerformant(fns: any, iterations?: number): any

- Defined in mostPerformant.ts:23
Returns the index of the function in an array of functions which executed the fastest.
link
https://www.30secondsofcode.org/js/s/most-performant

example
```
mostPerformant([
  () => {
    // Loops through the entire array before returning `false`
    [1, 2, 3, 4, 5, 6, 7, 8, 9, '10'].every(el => typeof el === 'number')
  },
  () => {
    // Only needs to reach index `1` before returning `false`
   [1, '2', 3, 4, 5, 6, 7, 8, 9, 10].every(el => typeof el === 'number')
. }
]) // 1
```
Parameters
- fns: any
  
  Functions to compare
- iterations: number = 10000
  
  Iterations to run each function. The more iterations, the more reliable the result but the longer it will take.
Returns any
Fastest function index

once

once(fn: any, context?: any): (...args: any[]) => any

- Defined in once.ts:17
Ensure a given function can only be called once.
link
https://davidwalsh.name/javascript-once

example
```
const canOnlyFireOnce = once(() => {
  console.log('Fired!')
})

canOnlyFireOnce() // "Fired!"
canOnlyFireOnce() // undefined
```
Parameters
- fn: any
  
  The function to call only once.
- Optional context: any
  
  The context to call the function in.
Returns (...args: any[]) => any
- - (...args: any[]): any
  - Parameters
    - Rest ...args: any[]
    Returns any

partition

partition(f: any): (array: any) => any

- Defined in partition.ts:7
Split an array into two based on a function.

Parameters
- f: any
Returns (array: any) => any
Array.
- - (array: any): any
  - Parameters
    - array: any
    Returns any

pipe

pipe(...fns: any[]): (x: any) => any

- Defined in pipe.ts:9
Compose functions from left to right.

link
https://1loc.dev/function/compose-functions-from-left-to-right

Parameters
- Rest ...fns: any[]
Returns (x: any) => any
any.
- - (x: any): any
  - Parameters
    - x: any
    Returns any

pipeAsyncFunctions

pipeAsyncFunctions(...fns: any[]): (arg: any) => any

- Defined in pipeAsyncFunctions.ts:20
Performs left-to-right function composition for asynchronous functions.
link
https://www.30secondsofcode.org/js/s/pipe-async-functions

example
```
const sum = pipeAsyncFunctions(
  x => x + 1,
  x => new Promise(resolve => setTimeout(() => resolve(x + 2), 1000)),
  x => x + 3,
  async x => (await x) + 4
);
(async() => {
  console.log(await sum(5)); // 15 (after one second)
})();
```
Parameters
- Rest ...fns: any[]
  
  Functions to compose.
Returns (arg: any) => any
A function that composes the functions in fns.
- - (arg: any): any
  - Parameters
    - arg: any
    Returns any

poll

poll(fn: any, timeout?: number, interval?: number): Promise<unknown>

- Defined in poll.ts:21
The polling function.
link
https://davidwalsh.name/javascript-polling

example
```
 poll(function() {
   return document.getElementById('lightbox').offsetWidth > 0;
 }, 2000, 150).then(function() {
     // Polling done, now do something else!
 }).catch(function() {
     // Polling timed out, handle the error!
 });
```
Parameters
- fn: any
  
  The function to poll.
- timeout: number = 2000
  
  The timeout in milliseconds.
- interval: number = 100
  
  The interval in milliseconds.
Returns Promise<unknown>
A promise that resolves when the condition is met.

rearg

rearg(fn: any, indexes: any): (...args: any[]) => any

- Defined in rearg.ts:19
Creates a function that invokes the provided function with its arguments arranged according to the specified indexes.
link
https://www.30secondsofcode.org/js/s/rearg

example
```
const rearged = rearg(
  function(a, b, c) {
    return [a, b, c]
  },
  [2, 0, 1]
)
rearged('b', 'c', 'a') // ['a', 'b', 'c']
```
Parameters
- fn: any
  
  Function to rearrange arguments for.
- indexes: any
  
  Indexes to rearrange arguments.
Returns (...args: any[]) => any
Function with rearranged arguments.
- - (...args: any[]): any
  - Parameters
    - Rest ...args: any[]
    Returns any

recordAnimationFrames

recordAnimationFrames(callback: any, autoStart?: boolean): { start: () => void; stop: () => void }

- Defined in recordAnimationFrames.ts:20
Invokes the provided callback on each animation frame.
example
```
const cb = () => console.log('Animation frame fired');
const recorder = recordAnimationFrames(cb);
// logs 'Animation frame fired' on each animation frame
recorder.stop(); // stops logging
recorder.start(); // starts again
const recorder2 = recordAnimationFrames(cb, false);
// `start` needs to be explicitly called to begin recording frames
```
link
https://www.30secondsofcode.org/js/s/record-animation-frames
Parameters
- callback: any
  
  Callback to invoke on each animation frame.
- autoStart: boolean = true
  
  Whether need to implicitly call start when the function is invoked.
Returns { start: () => void; stop: () => void }
- start: () => void
  - - (): void
    - Returns void
- stop: () => void
  - - (): void
    - Returns void

supportWebP

supportWebP(): Promise<boolean>

- Defined in supportWebP.ts:7
Check if the browser support webp.

Returns Promise<boolean>
Promise

until

until(callback: any, checker: any): (e: any) => void

Respond to an event only until a condition is met.

example

const btn = document.querySelector("button");
const handler = e => {
  const n = Number(e.currentTarget.textContent);
  e.currentTarget.textContent = n + 1;
}
const checker = e => Number(e.currentTarget.textContent) >= 5;
btn.addEventListener("click", until(handler, checker));

Parameters

callback: any
checker: any

Returns (e: any) => void

- (e: any): void
- Parameters
  - e: any
  Returns void

waitForTime

waitForTime(ms: number): Promise<void>

- Defined in waitForTime.ts:8
Wait a given amount of time between tasks.

link
https://davidwalsh.name/waitfortime

Parameters
- ms: number
Returns Promise<void>
A promise which will resolves in given period.

waitForever

waitForever(): Promise<void>

- Defined in waitForever.ts:10
Halts following actions without locking the browser, so you can interact with the page. Useful in debug and test.

link
https://davidwalsh.name/javascript-wait

Returns Promise<void>
A promise which never resolves.

when

when(pred: any, whenTrue: any): (x: any) => any

- Defined in when.ts:15
Returns a function that takes one argument and runs a callback if it's truthy or returns it if falsy.
link
https://www.30secondsofcode.org/js/s/when

example
```
const doubleEvenNumbers = when(x => x % 2 === 0, x => x * 2);
doubleEvenNumbers(2); // 4
doubleEvenNumbers(1); // 1
```
Parameters
- pred: any
  
  Predicate function.
- whenTrue: any
  
  A function to run if the predicate is truthy.
Returns (x: any) => any
Return a function expecting a single value, x, that returns the appropriate value based on pred.
- - (x: any): any
  - Parameters
    - x: any
    Returns any

Index

Properties

Functions

Properties

easings

Type declaration

easeInCubic: (t: number) => number

Parameters

t: number

Returns number

easeInElastic: (t: number) => number

Parameters

t: number

Returns number

easeInOutCubic: (t: number) => number

Parameters

t: number

Returns number

easeInOutElastic: (t: number) => number

Parameters

t: number

Returns number

easeInOutQuad: (t: number) => number

Parameters

t: number

Returns number

easeInOutQuart: (t: number) => number

Parameters

t: number

Returns number

easeInOutQuint: (t: number) => number

Parameters

t: number

Returns number

easeInOutSine: (t: number) => number

Parameters

t: number

Returns number

easeInQuad: (t: number) => number

Parameters

t: number

Returns number

easeInQuart: (t: number) => number

Parameters

t: number

Returns number

easeInQuint: (t: number) => number

Parameters

t: number

Returns number

easeInSine: (t: number) => number

Parameters

t: number

Returns number

easeOutCubic: (t: number) => number

Parameters

t: number

Returns number

easeOutElastic: (t: number) => number

Parameters

t: number

Returns number

easeOutQuad: (t: number) => number

Parameters

t: number

Returns number

easeOutQuart: (t: number) => number

Parameters

t: number

Returns number

easeOutQuint: (t: number) => number

Parameters

t: number

Returns number

easeOutSine: (t: number) => number

Parameters

t: number

Returns number

linear: (t: number) => number

Parameters