Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@creuna/utils

Package Overview
Dependencies
Maintainers
2
Versions
18
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@creuna/utils

Creuna js utils

  • 1.2.0
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
68
decreased by-15%
Maintainers
2
Weekly downloads
 
Created
Source

Creuna JS utils

npm version travis build

A collection of useful JS utility functions.

Importing

You can choose whether you want to import everyting or individual modules.

// Import everything:
import utils from "@creuna/utils";

// Import single:
import rangeMap from "@creuna/utils/range-map";

Functions

anyToKebab(input)

@creuna/utils/any-to-kebab

  • input: string
  • returns: string
anyToKebab("CamelCaseString"); // "camel-case-string"

arrayInsert(array, index, item)

@creuna/utils/array-insert

  • array: array
  • index: number
  • item: any
  • returns: array

Returns a new array that is a deep clone of the one passed in containing the new item at the specified index.

arrayInsert(["a", "b", "c"], 1, "x"); // ['a', 'x', 'b', 'c']

arrayMove(array, oldIndex, newIndex)

@creuna/utils/array-move

  • array: array
  • oldIndex: number
  • newIndex: number
  • returns: array

Returns a new array that is a deep clone of the one passed in with the item at oldIndex moved to newIndex.

arrayInsert(["a", "b", "c"], 1, 2); // ['a', 'c', 'b']

arrayRemove(array, index)

@creuna/utils/array-remove

  • array: array
  • index: number
  • returns: array

Returns a new array that is a deep clone of the one passed in with the item at index removed.

arrayInsert(["a", "b", "c"], 1); // ['a', 'c']

clamp(value, minimum, maximum)

@creuna/utils/clamp

  • value: number
  • minimum: number
  • maximum: number
  • returns: number

clamp can be used to keep a value between a min and max value.

createPipe(...functions)

@creuna/utils/create-pipe

  • functions: any number of functions
  • returns: function

The pipe combines n functions, calling each function with the output of the last one. To actually execute the pipeline, call the returned function with a value. More on this concept here.

pipe(
  removeSpaces,
  capitalize,
  reverseString
)("a b c"); // "CBA"

deepClone(thing)

@creuna/utils/deep-clone

  • thing: object | array
  • returns: object | array

Returns a deep clone of an object (any nested objects or arrays will also be cloned). Be aware that this uses JSON.stringify, meaning that any array elements or object values that are undefined will be stripped

filterObject(object, predicate)

@creuna/utils/filter-object

  • object: object
  • value: (key: string, value: any): boolean
  • returns: object

Tests predicate (with key and value) for every entry in object. Returns a new object that contains every entry that passed the test.

const obj = { a: 1, b: 2, c: 3 };
filterObject(obj, (key, value) => key !== "b" && value !== 3); // { a: 1 }

fromQueryString(queryString[, prefix])

@creuna/utils/from-query-string

  • queryString: string
  • prefix: string (default '?')
  • returns: object

Converts a query string into an object.

fromQueryString("?param=test&other=test");
// { param: "test", other: "test" }

fromQueryString("#param=test&other=test", "#");
// { param: "test", other: "test" }

getData(dataAttributeName)

@creuna/utils/get-data

  • dataAttributeName: string
  • returns: string

Returns the value of the first DOM node with dataAttributeName

<body>
    <div data-some-attribute="true"></div>
</body>
getData("some-attribute"); // "true"

isEqual(a, b)

@creuna/utils/is-equal

  • a: any
  • b: any
  • returns: boolean

Checks whether a and b are equal (deep comparison for objects and arrays). This uses JSON.stringify, so be aware that array elements or object values that are undefined will be stripped.

isFullyInViewport(node)

@creuna/utils/is-fully-in-viewport

  • node: DOM node
  • returns: boolean

Checks whether the given element is fully visible in the viewport. This is a special case of isInViewport where the offsets are the dimensions of the element.

isInViewport(node, offset[, offsetX])

@creuna/utils/is-in-viewport

  • node: DOM node
  • offset: number
  • offsetX: number (defaults to offset)
  • returns: boolean

Checks whether the given element is visible in the viewport. Positive numbers for offset mean more of the element needs to be in the viewport while negative numbers mean that the element can be outside of the viewport.

isRunningOnClient: bool

@creuna/utils/is-running-on-client

  • exports: bool

Exports a boolean indicating whether or not the code is running on the client.

import isRunningOnClient from "@creuna/utils/is-running-on-client"; // true || false

kebabToCamel(kebabString)

@creuna/utils/kebab-to-camel

  • kebabString: string (kebab-case formatted)
  • returns: string (camelCase formatted)
kebabToCamel("kebab-string"); // "kebabString"

kebabToPascal(kebabString)

@creuna/utils/kebab-to-pascal

  • kebabString: string (kebab-case formatted)
  • returns: string (PascalCase formatted)
kebabToPascal("kebab-string"); // "KebabString"

pipe(value, ...functions)

@creuna/utils/pipe

  • value: any value
  • functions: any number of functions
  • returns: any (the result of running value through the pipeline)

A function that emulates the pipeline operator. For more advanced composition stuff, see createPipe.

pipeValue("a b c", removeSpaces, capitalize, reverseString); // "CBA"

rangeMap(val, inMin, inMax, outMin, outMax)

@creuna/utils/range-map

  • val: number
  • inMin: number
  • inMax: number
  • outMin: number
  • outMax: number
  • returns: number

Re-maps a number from one numeric range onto another.

rangeMap(0.5, 0, 1, 0, 100); // 50

replaceQueryParameters(url, query)

@creuna/utils/replace-query-parameters

  • url: string
  • query: object
  • returns: string

Adds or replaces query parameters in url.

replaceQueryParameters("http://lorem.com?param1=a&param2=b", {
  param2: "BBB",
  param3: "CCC"
});
// "http://lorem.com?param1=a&param2=CCC&param3=DDD"

scrollToElement(node, offset, duration, delay)

@creuna/utils/scroll-to-element

  • node: DOM node
  • offset: number (default 0 px)
  • duration: number (default 500 ms)
  • delay: number (default 0 ms)

Finds the scroll position of node and scrolls it into view (animated)

scrollToPosition(y, duration)

@creuna/utils/scroll-to-position

  • y: number
  • duration: number (default 500 ms)

scrollingElement: node

@creuna/utils/scrolling-element

Get the scrolling element (useful because some browsers use document.scrollingElement, some use document.documentElement and others use document.body. When not running on client, scrollingElement is undefined.

import scrollingElement from "@creuna/utils/scrolling-element";

if (scrollingElement) {
  scrollingElement.scrollTo(0, 100);
}

stripPropertiesWithKeys(object, keys)

@creuna/utils/strip-properties-with-keys

  • object: object
  • value: string[]
  • returns: object

Returns a shallow copy of object with properties matching any of the keys removed

const obj = { a: 1, b: 2, c: 3 };
stripPropertiesWithKeys(obj, ["b", "c"]); // { a: 1 }

stripPropertiesWithValue(object, value)

@creuna/utils/strip-properties-with-value

  • object: object
  • value: any
  • returns: object

Returns a shallow copy of object with properties matching value removed

const obj = { a: 1, b: 2 };
stripPropertiesWithValue(obj, 2); // { a: 1 }

stripUndefined(object)

@creuna/utils/strip-undefined

  • object: object
  • returns: object

Returns a shallow copy of object with properties matching undefined removed

toQueryString(object[, options])

@creuna/utils/to-query-string

  • object: object
  • options: object || bool (bool is used for encode)
    • encode: bool (default true)
    • prefix: string (default '?')
  • returns: string

Creates a query string representation of object. Encodes object values by default.

toQueryString({ param: "test", other: "test" });
// "?param=test&other=test"

toQueryString({ param: "test foo", other: "test" });
// "?param=test%20foo&other=test"

toQueryString({ param: "test foo", other: "test" }, { encode: false });
// "?param=test foo&other=test"

toQueryString({ param: "test", other: "test" }, { prefix: "#" });
// "#param=test&other=test"

tryParseJson(json, default)

@creuna/utils/try-parse-json

  • json: string (json)
  • default: any
  • returns: object if sucessfully parsed; default if unsuccessful

FAQs

Package last updated on 17 Aug 2019

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc