Utils

Semantic UI includes this standalone library to avoid external dependencies and to allow for performant and opinionated uses of common utils like clone and isEqual as well as some particular use cases for web components.

Installation

The utils library is a standalone package that can be used without any other dependencies.

npm install @semantic-ui/utils

Usage

Utilities can be used by importing them in your project.

import { isArray, capitalize, clone, adoptStylesheet } from '@semantic-ui/utils';

const myArray = [1, 2, 3];
console.log(isArray(myArray)); // true

const myString = "hello world";
console.log(capitalize(myString)); // "Hello world"

const myObject = { a: 1, b: { c: 2 } };
const clonedObject = clone(myObject);
console.log(clonedObject); // { a: 1, b: { c: 2 } }

// Adopt CSS to document
adoptStylesheet('.button { background: blue; color: white; }');

Utility Categories

The Utils library is organized into several categories:

• Arrays: Utilities for working with arrays.
• Browser: Utilities for handling functionality on the client.
• Cloning: Deep cloning utilities.
• Colors: Utilities for color manipulation and conversion.
• Crypto: Cryptographic helpers like hashing functions.
• CSS: Utilities for stylesheet adoption, extraction, and scoping.
• Dates: Helpers for handling date formats.
• Equality: Helpers for comparing equality.
• Errors: Error handling and creation utilities.
• Functions: Helpers for manipulating functions.
• Looping: Iteration utilities for arrays and objects.
• Numbers: Helpers for manipulating numbers
• Objects: Helpers for object manipulation and traversal.
• Regular Expressions: Helpers for working with regular expressions.
• Environment: Environment detection utilities (server/client/dev/CI).
• Strings: String formatting and manipulation functions.
• Types: Functions for checking and manipulating data types.