Preloaded JavaScript libraries

Information about third-party JavaScript libraries preloaded for use in web apps.

Retool automatically imports the following utility libraries for use across Retool. These libraries are available for use in JavaScript queries and within {{ }} embedded expressions.

Name	Alias	Description
Lodash	_	A modern JavaScript utility library delivering modularity, performance & extras.
Moment.js	moment	Parse, validate, manipulate, and display dates and times.
UUID	uuid	Generate and validate RFC-compliant UUIDs.
Numbro	numbro	Convert, format, and manipulate numbers.
PapaParse	Papa	Parse CSV data, and convert between CSV and JSON.

Lodash

Lodash is a modern JavaScript utility library delivering modularity, performance, and extras. It is available using the _ alias.

Chunk an array

Live Editor

function chunkArray() {
  
  const array = query1.data; // [1, 2, 3, 4, 5, 6, 7, 8]
  const chunkedArray = _.chunk(query1.data, 2); // [[1, 2], [3, 4], [5, 6], [7, 8]]
  return chunkedArray[2][1];

}

Result

Loading...

Convert string to camel case

Live Editor

function camelCase() {
  
  const customerName = getUsers.data[1].name; // Jane Smith
  return _.camelCase(getUsers.data[1].name);

}

Result

Loading...

Moment

Moment.js is a library for parsing, validating, manipulating, and displaying dates in JavaScript. It is available using the moment alias.

Format date

Live Editor

function adjustDate() {

  const selectedDate = dateInput1.value // Current date
  const futureDate = moment(selectedDate).add(7, 'days'); // Add 7 days

  return futureDate.format('MMMM Do YYYY');
  
}

Result

Loading...

Parse date

Live Editor

function parseDate() {

  const selectedUser = table1.selectedRow.createdAt; // Created date from selected table row

  return moment(selectedUser, 'YYYY-MM-DD').format('MMMM Do YYYY');
  
}

Result

Loading...

UUID

UUID is a library for generating universally unique identifiers (UUID). It is available using the uuid alias.

Generate v4 UUID

Live Editor

function generateUuid() {
  
  return uuid.v4();

}

Result

Loading...

Validate UUID

Live Editor

function validateUuid() {
  
  if (uuid.validate('9db0126a-271b-4137-8842-c47f4257080d')) {
    return 'Valid';
  } else {
    return "Invalid";
  }

}

Result

Loading...

Numbro

Numbro is a library for transforming number values. It is available using the numbro alias.

Add thousands separator

Live Editor

function thousandsSeparator() {
  
  return numbro(1000).format({thousandSeparated: true});

}

Result

Loading...

Format as percentage

Live Editor

function validateUuid() {
  
  return numbro(0.423).format({
    output: "percent",
    mantissa: 1
});

}

Result

Loading...

PapaParse

PapaParse is a library for parsing CSV files. It is available using the Papa alias.

Convert CSV to JSON

Live Editor

function thousandsSeparator() {

  const csvData = `Order ID,Customer Name,Product,Quantity,Order Date
  1,John Doe,Widget A,3,2024-07-10
  2,Jane Smith,Gadget B,2,2024-07-11
  3,Jim Brown,Thingamajig C,5,2024-07-12
  4,Susan White,Doohickey D,1,2024-07-13
  5,Emily Black,Whatsit E,4,2024-07-14`;

  const jsonData = Papa.parse(csvData); // Convert CSV to JSON

  const customer = jsonData.data[2][1]; // JSON available on `data` property

  return customer;

}

Result

Loading...

Convert JSON to CSV

Live Editor

function thousandsSeparator() {

  const jsonData = [ [ "Order ID", "Customer Name", "Product", "Quantity", "Order Date" ], [ " 1", "John Doe", "Widget A", "3", "2024-07-10" ], [ " 2", "Jane Smith", "Gadget B", "2", "2024-07-11" ], [ " 3", "Jim Brown", "Thingamajig C", "5", "2024-07-12" ], [ " 4", "Susan White", "Doohickey D", "1", "2024-07-13" ], [ " 5", "Emily Black", "Whatsit E", "4", "2024-07-14" ] ];

  return Papa.unparse(jsonData);

}

Result

Loading...