ship-components-utility
JavaScript set of utilities. Exports a commonjs module that can be used with webpack. Source is in ES6 and an ES5 version is available using Babel.
Docs & Help
Here is the list of utilities you can use.
- Collections
- KeyEvents
- NativeFileUploadDialog
- ParseUrl
- Sort
- Strings isEqual(Object1, Object2);
- Utils
Usage
ES6 (Recommended)
The component is written using ES6 therefore Babel is recommended to use it. The below example is based on using webpack and babel-loader.
<!-- ; <!-- ; <!-- ;
Docs
Collections
const Collections = ;
keys
/** * Returns the Objects keys * @param * @return */const keys = Collections;let obj = name: 'test' ;
toArray
/** * Converts an Object to an Array * @param * @return */
each
/** * Iterate through each Object keys * And binds a callback to each keys * @param * @param */const each = Collections;let obj = name: 'test' ;let {};
size
/** * Returns the size of an object or array * @param {Object || Array} val * @return */
searchFn
/** * Returns the function if available inside an object * @param {Object || Array || Func} val * @return */
any
/** * Similar to Javscript .some() function * @param {Object || Array} values * @param * @return */
find
/** * Similar to Underscore _.find() function * @param * @param * @param * @return */
findIndex
/** * Returns the index of an item in array if exisits, -1 otherwise * @param * @param * @param * @return */
getIn
/** * Get a nested value of an object or return * @param * @param * @param * @return */const getIn = Collections;const testMap = obj1: name: 'test1' obj2: name: 'test2' ;; // test2
hasIn
/** * Returns true if an object has the matched value, * otherwise false * @param * @param * @return */const hasIn = Collections;const testMap = obj1: name: 'test1' obj2: name: 'test2' ;; // true
isEqual
/** * First compres the size of two objects and then does a shallow * comparison of the two objects values * @param * @param * @return */ ;
KeyEvents
/** * List of key events * @param * @return */const KeyEvents = ;; // 34; // 27
NativeFileUploadDialog
/** * File upload dialog * @constructor param */const NativeFileUploadDialog = ;'image/*' open
ParseUrl
/** * Breaks a URL into parts * @param */const ParseUrl = ;let url = 'http://www.sony.com/homepage?param1=something¶m2=somethingelse';;<!--return value protocol: 'http' hostname: 'www.sony.com' query: 'param1=something¶m2=somethingelse' path: '/homepage'-->
Sort
const Sort = ;
compareDates
/** * Compare two dates * * @param * @param * @return */const compareDates = Sort;
sortBy
/** * Create a sorting function to sort an array of objects by prop. We accept any * number of arguments to sort by * * @param {String...} prop * @return */const sortBy = Sort;
sortByDates
/** * Create a sorting function to sort an array of objects by prop. We accept any * number of arguments to sort by * * @param {String...} prop * @return */const sortByDates = Sort;
Strings
const Strings = ;
hash
/** * Convert a string to a unique hash we can use as an key * http://stackoverflow.com/a/7616484 * @param * @return */const hash = Strings;
slugify
/** * Convert a string into something that is url and css friendly * @param * @return */const slugify = Strings;let str1 = 'THis Is A! sample--string';let str2 = 'this-is-a---sample--string';let result = ; not;;
capitalize
/** * Capitalize string * Convert to TitleCase if more than one word * @param * @return */const capitalize = Strings;let str1 = 'test test';let str2 = 'Test Test';let result = ; not;;
titleCase
/** * Title case string * @param * @return */const titleCase = Strings;
camelCase
/** * Convert to camelCase string * @param * @return */const camelCase = Strings;
toUnderscoreCase
/** * Convert camel case to underscore case * @param * @return */const toUnderscoreCase = Strings;
generateRandomString
/** * Generates a short random String * @param * @return */const generateRandomString = Strings;
stringShortener
/** * Shorten string * @param * @param * @return */const stringShortener = Strings;
stringIsValid
/** * Validate strings (name, username or email) * * @param * @param * @return */const stringIsValid = Strings;
convertHTMLToString
/** * Removes HTML tags from string * * @param * @return */const convertHTMLToString = Strings;let str = '<p>this is a text for<span>testing</span></p>';let result = ; not;;
Utils
const Utils = ;
objectSize
/** * Returns the size of an Object * @param * @return */const objectSize = Utils;
isObject
/** * Checks if value is the language type of Object * will skip values === null * @param * @return */const isObject = Utils;
isFunction
/** * Checks if value is classified as a Function object * @param * @return */const isFunction = Utils;
isString
/** * Checks if value is classified as a String primitive or object * @param * @return */const isString = Utils;
isArray
/** * Checks if value is classified as an Array object * @param * @return */const isArray = Utils;
isEqualArray
/** * Shallow comparison between 2 arrays * or envoke the callback function * @param * @param * @param * @return */const isEqualArray = Utils;
isUndefined
/** * Checks if value is undefined * @param * @return */const isUndefined = Utils;
bind
/** * Bind to itself * @param {args...} * @return * @example bind(this, 'handleClick', 'handleSubmit'); */const bind = Utils;
bindAll
/** * Binds methods of an object to the object itself, * overwriting the existing method. * Method names may be specified as individual arguments * or as arrays of method names * @param * @return */const bindAll = Utils;
unique
/** * Creates a duplicate-free version of an array * @param * @return */const unique = Utils;
mergeDeep
/** * This method is like _.assign except that it * recursively merges own and inherited enumerable * string keyed properties of source objects into the * destination object * @param * @param * @return */ const mergeDeep = Utils;
deepCopy
/** * Recursive object copy * * @param {Array<Objects> || Objects} obj * @return {Array<Objects> || Objects} */ const deepCopy = Utils;
pluck
/** * Extract a subset of keys off of an object * * @param * @return * @return */ const pluck = Utils;
isIEBrowser
/** * Detect IE browser * @param * @return */const isIEBrowser = Utils;
detectIEVersion
/** * Detect IE browser version * @return */const detectIEVersion = Utils;
Development
More examples can be found in the examples/
folder. A development server can be run with:
$ git clone https://github.com/ship-components/ship-components-utility.git$ npm install$ npm test
Webpack Configuration
This module is designed to be used with webpack but requires a few loaders if you are pulling the source into another project.
$ npm install webpack babel-loader --save-dev
Below are is a sample of how to setup the loaders:
/** * Relevant Webpack Configuration */ ... module: loaders: // Setup support for ES6 test: /\.$/ exclude: /node_modules/ loader: 'babel-loader' ...
Tests
npm install
npm test
History
- 2.1.1 - Fixes unambiguous imports and exports (ES vs node).
- 2.1.0 - Updates Webpack, eslint, jest and dependencies, grunt, husky, eslint-plugin-react and coverals
- 2.0.0 - Updates Webpack to 4.21.0, Babel to 7 (monorepo). Fixes npm warnings & security vulnerabilities.
- 2.0.0-beta.1 - Updates Webpack to 4.3.0 as well as eslint-loader, grunt-coveralls and lint-stages to latest.
- 1.5.2 - Bugfix for getScrollTop and testing improvements
- 1.5.1 - Adds functions throttle and getScrollTop to Utils.
- 1.5.0 - Adds isEqualArray function to Utils to shallow compare 2 arrays.
- 1.4.0 - updates dev dependencies to latest version (webpack, babel, eslint, jest, coveralls, eslint-config-ship-components).
- 1.3.2 - Removes the unnecessary babel plugins.
- 1.3.1 - Updates jest and babel-eslint to latest version.
- 1.3.0 - Updates the babel presets from latest to env - latest has been deprecated.
- 1.2.2 - Adds a pre-commit hook that will run jest test and eslint before for the changed files. NOTE: please make the precommit hook to be executable for the first time (chmod +x ./.git/hooks/pre-commit)
- 1.2.1 - Fixed an issue in getIn where it wasn't returning the defaultValue as expected
- 1.2.0 - Added pluck function to Util and added watch:test command
- 1.1.0 - Adds a deepCopy function to utility library to copy (recursively) objects, array of objects or date objects.
- 1.0.0 - First major version, fixed the export module path
- 0.1.0 - Initial
License
The MIT License (MIT)
Copyright (c) 2017
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.